/*
Theme Name: The Nut Sack — GeneratePress Child
Theme URI: https://www.thenutsack.co.uk/
Description: Nut Sack mobile-first design system. Requires GeneratePress parent theme.
Author: Smiley Starfish
Template: generatepress
Version: 0.1.44
Text Domain: nutsack-gp
*/
:root{--ns-ink:#171711;--ns-dark:#171812;--ns-cream:#fff2d0;--ns-paper:#f4eee0;--ns-acid:#97e600;--ns-muted:#6a685d;--ns-border:rgba(26,27,19,.15);--ns-max:1820px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{overflow-x:hidden;background:var(--ns-paper);color:var(--ns-ink)}
/* ===== STATIC PAGE SHELL: ONE OWNER (child page.php + this block) =====
   GeneratePress header.php opens #page and #content; its footer closes them.
   Child page.php adds exactly one #primary and #main. Page content owns ONLY
   .ns-home / .ns-page and section markup. No GP article/entry header/title.
   No body flex, no negative margins, no trailing shell patches. */
body.page #page.site{display:flow-root;width:100%;max-width:none;margin:0;padding:0;overflow:visible}
body.page #content.site-content{display:flow-root;width:100%;max-width:none;margin:0;padding:0;background:transparent}
body.page #primary.ns-content-area{display:block;float:none;width:100%;max-width:none;margin:0;padding:0}
body.page #main.ns-page-main{display:flow-root;width:100%;max-width:none;margin:0;padding:0}
body.page #main.ns-page-main > :is(.ns-home,.ns-page){display:flow-root;width:100%;max-width:none;margin:0;padding:0}
/* ===== END STATIC PAGE SHELL ===== */
.ns-page,.ns-home{overflow:clip}
.ns-wrap{width:min(var(--ns-max),calc(100% - clamp(36px,5vw,112px)));margin-inline:auto}
.ns-band{padding:clamp(58px,8vw,116px) 0}
.ns-band--dark{background:radial-gradient(ellipse at 18% 80%,#293909,#181910 64%);color:var(--ns-cream)}
.ns-band--cream{background:var(--ns-cream);color:var(--ns-ink)}
.ns-band--paper{background:var(--ns-paper);color:var(--ns-ink)}
.ns-band--cream .ns-eyebrow,.ns-band--paper .ns-eyebrow{color:#597f00}
.ns-photo-card{margin:0;background:var(--ns-cream);padding:13px;border:2px solid var(--ns-ink);box-shadow:18px 18px 0 rgba(151,230,0,.30);position:relative;color:var(--ns-ink)}
.ns-photo-card img,.ns-outtake img,.ns-route-card img{display:block;width:100%;height:auto;object-fit:cover}
.ns-photo-card figcaption,.ns-outtake figcaption{padding:12px 3px 2px;font-size:.86rem;line-height:1.4}
.ns-actions{display:flex;flex-wrap:wrap;gap:10px}
.ns-button.button,.ns-cta-panel a.button{display:inline-flex;justify-content:center;align-items:center;min-height:48px;margin:0;padding:12px 22px;border:2px solid currentColor;font-weight:850;text-transform:uppercase;line-height:1.2;letter-spacing:.02em;text-decoration:none;border-radius:0;box-shadow:none}
.ns-button--acid.button{background:var(--ns-acid);color:var(--ns-ink);border-color:var(--ns-acid)}
.ns-button--outline-light.button{background:transparent;color:var(--ns-cream);border-color:var(--ns-cream)}
.ns-route-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:35px}
.ns-route-card{background:#fffaf0;color:var(--ns-ink);border:1px solid var(--ns-border);overflow:hidden;min-width:0}
.ns-route-card img{aspect-ratio:4/3}
.ns-route-card__body{padding:clamp(24px,2.1vw,34px)}
.ns-route-card h3{font-size:clamp(1.7rem,1.85vw,2.05rem);line-height:1.18;margin:0 0 14px;font-weight:850}
.ns-route-card p{font-size:clamp(1.1rem,1.33vw,1.34rem);line-height:1.6}
.ns-route-link{font-weight:850;color:#416000}
.ns-material-note li{margin:.6em 0}
.ns-outtake{margin:0;background:#fff4d4;padding:12px;color:var(--ns-ink)}
.ns-cta-panel{padding:32px;background:var(--ns-ink);color:var(--ns-cream);display:grid;gap:20px}
.ns-cta-panel h2{color:inherit;font-size:clamp(1.8rem,3vw,3rem);line-height:1.06}
.ns-inner-hero{padding-block:80px}
.ns-full-bleed{width:100%}
.ns-stack{display:grid;gap:22px}
.ns-page img{max-width:100%}
@media(max-width:900px){.ns-route-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.ns-wrap{width:calc(100% - 34px)}
.ns-band{padding:48px 0}
.ns-route-grid{grid-template-columns:minmax(0,1fr)}
.ns-photo-card{box-shadow:8px 8px 0 rgba(151,230,0,.22)}
.ns-cta-panel{padding:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.ns-hero{background:radial-gradient(ellipse at 30% 65%,#293e07,transparent 58%),#171b0e;color:var(--ns-cream);position:relative;overflow:hidden;padding:22px 0 54px}
.ns-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 43px,rgba(204,243,112,.045) 43px 44px),repeating-linear-gradient(90deg,transparent 0 43px,rgba(204,243,112,.045) 43px 44px)}
.ns-hero .ns-wrap{position:relative;z-index:1}
.ns-hero-split{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(18px,3vw,55px);align-items:start}
.ns-hero-split>*{min-width:0}
.ns-hero-headline{padding-top:35px;position:relative;z-index:2}
.ns-hero-headline>.ns-eyebrow{display:table;background:var(--ns-acid);color:#171812;padding:12px 18px;transform:rotate(-2deg);font-weight:900;font-size:clamp(1rem,1.23vw,1.3rem);line-height:1.2;letter-spacing:.055em;margin-bottom:34px}
.ns-hero-title{font-family:Impact,Haettenschweiler,"Arial Narrow Bold","Arial Narrow",sans-serif;font-size:clamp(6rem,14.8vw,19rem);line-height:.77;letter-spacing:-.035em;text-transform:uppercase;font-weight:900;margin:0;transform:rotate(-2.7deg);transform-origin:left top}
.ns-hero-title span{display:block;position:relative}
.ns-hero-title span:first-child{color:var(--ns-cream);z-index:2}
.ns-hero-title span:nth-child(2){color:var(--ns-cream);margin-left:.2em;z-index:3;-webkit-text-stroke:2px #171b0e;text-shadow:4px 4px 0 #171b0e}
.ns-hero-title span:nth-child(3){color:var(--ns-acid);margin-left:.03em;z-index:1}
.ns-product-side{min-width:0;display:flex;flex-direction:column;align-items:center;position:relative}
.ns-photo-card--hero{margin:0;background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important;transform:none!important;width:100%;position:relative}
.ns-photo-card--hero::before{content:none!important}
.ns-photo-card--hero img{display:block;width:min(100%,980px);height:auto;object-fit:contain;margin:-160px auto 0;filter:drop-shadow(0 18px 30px rgba(0,0,0,.24))}
.ns-photo-card--hero .ns-price-badge{position:absolute;z-index:4;right:5%;top:10%;width:76px;height:76px;border-radius:50%;background:var(--ns-acid);color:#161b0e;display:grid;place-items:center;font-size:1.7rem;font-weight:900;transform:rotate(10deg)}
.ns-product-notes{display:grid;gap:5px;align-self:center;max-width:470px;text-align:center;margin-top:0}
.ns-product-notes .ns-eyebrow{font-size:.78rem;letter-spacing:.1em}
.ns-product-caption{margin:0;color:var(--ns-cream);font-size:.88rem;line-height:1.45}
.ns-hero-bottom{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);gap:clamp(30px,6vw,110px);align-items:center;margin-top:14px;padding:20px 0 0;border-top:1px solid rgba(255,242,208,.22)}
.ns-hero-details{min-width:0}
.ns-hero-keyword{color:var(--ns-acid);font-weight:900}
@media(max-width:1000px){.ns-hero-split{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}
.ns-hero-title{font-size:clamp(5.1rem,14vw,9.5rem)}
.ns-photo-card--hero img{margin-top:-66px}
.ns-hero-bottom{grid-template-columns:1fr;gap:22px}}
/* Mobile HOME hero: original poster title first, large product photo below.
   Same markup and design as desktop; only responsive placement changes. */
@media(max-width:700px){
 .ns-hero{padding:clamp(22px,5vw,32px) 0 40px}
 .ns-hero-split{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(18px,5vw,28px);align-items:start}
 .ns-hero-headline{grid-column:1;grid-row:1;min-width:0;padding:0;position:relative;z-index:3}
 .ns-hero-headline>.ns-eyebrow{display:inline-block;width:auto;max-width:100%;font-size:clamp(.83rem,3.15vw,1.05rem);line-height:1.2;padding:10px 12px;margin:0 0 clamp(25px,7vw,38px);transform:rotate(-2deg)}
 /* Mobile-only title is high-resolution transparent PNG artwork. Real H1
    text remains in the DOM for accessibility and indexing. The PNG includes
    the green eyebrow label; suppress the separate visible eyebrow on phone. */
 .ns-hero-headline>.ns-eyebrow{display:none}
 .ns-home .ns-hero-title{position:relative;display:block;width:100%;max-width:532px;aspect-ratio:1095 / 1379;height:auto;margin:0;transform:none;font-size:inherit;line-height:normal;letter-spacing:normal;-webkit-text-stroke:0;filter:none}
 .ns-home .ns-hero-title::before{content:"";position:absolute;inset:0;background:url("assets/nutsack-home-mobile-poster.png") center top/contain no-repeat;pointer-events:none}
 .ns-home .ns-hero-title span{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
 .ns-product-side{grid-column:1;grid-row:2;position:relative;z-index:2;width:100%;max-width:100%;margin:0;min-width:0;align-items:center}
 .ns-photo-card--hero{width:min(100%,480px);margin:0 auto}
 .ns-photo-card--hero img{display:block;width:100%;max-width:100%;max-height:min(112vw,520px);height:auto;margin:0 auto;object-fit:contain;filter:drop-shadow(0 11px 14px rgba(0,0,0,.28))}
 .ns-photo-card--hero .ns-price-badge{width:clamp(72px,20vw,92px);height:clamp(72px,20vw,92px);font-size:clamp(1.3rem,5vw,1.75rem);right:4%;top:12%;box-shadow:5px 5px 0 #171812}
 .ns-product-notes{max-width:420px;width:100%;margin:12px auto 0;text-align:center}
 .ns-home .ns-product-notes .ns-eyebrow,.ns-home .ns-product-caption{font-size:clamp(.9rem,3.4vw,1.12rem);line-height:1.35}
 .ns-hero-bottom{margin-top:clamp(24px,6vw,34px);padding-top:20px}
}
.site-header.ns-site-header{position:sticky;top:0;z-index:1001;background:#f1e9df;border:0;box-shadow:none;margin:0;padding:0}
.admin-bar .site-header.ns-site-header{top:32px}
.ns-masthead-inner{width:min(1800px,calc(100% - 44px));margin-inline:auto;min-height:118px;display:grid;grid-template-columns:minmax(320px,610px) minmax(0,1fr);gap:clamp(20px,3vw,55px);align-items:center}
.ns-site-header__logo{display:block;line-height:0;max-width:100%;justify-self:start}
.ns-site-header__logo img{display:block;width:100%;max-width:610px;height:auto;object-fit:contain}
/* PRIMARY MENU: six accessible poster-buttons in a deliberate 3 x 2 grid.
   One authoritative desktop rule-set. No page-level CSS or overlay patches. */
.ns-desktop-nav{justify-self:stretch;width:100%;min-width:0}
.ns-header-menu{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;list-style:none;gap:10px 13px;padding:0;margin:0}
.ns-header-menu li{min-width:0;margin:0;padding:0;position:relative}
.ns-header-menu a{color:#171812;text-decoration:none;font-weight:900;text-transform:uppercase;letter-spacing:.015em}
.ns-desktop-nav .ns-header-menu>li>a{
 display:flex;align-items:center;justify-content:center;text-align:center;
 min-height:58px;width:100%;padding:9px 8px;
 background:#fff7e7;color:#171812;border:2px solid #171812;
 box-shadow:3px 3px 0 #171812;
 font-weight:900;font-size:clamp(.78rem,.9vw,.98rem);line-height:1.14;
 letter-spacing:.02em;text-decoration:none;white-space:normal;
 transition:background-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
/* Slight, intentional variation gives the nav The Nut Sack's poster-like character. */
.ns-desktop-nav .ns-header-menu>li:nth-child(2)>a{transform:rotate(.45deg);background:#fff0d4}
.ns-desktop-nav .ns-header-menu>li:nth-child(3)>a{transform:rotate(-.5deg)}
.ns-desktop-nav .ns-header-menu>li:nth-child(4)>a{background:#f1f8d9;transform:rotate(-.35deg)}
.ns-desktop-nav .ns-header-menu>li:nth-child(5)>a{transform:rotate(.4deg)}
/* Hover, keyboard focus and the current page are designed, visible states. */
.ns-desktop-nav .ns-header-menu>li:not(.ns-buy-menu)>a:hover,
.ns-desktop-nav .ns-header-menu>li:not(.ns-buy-menu)>a:focus-visible{
 background:#97e600;color:#171812;text-decoration:none;
 transform:translate(-2px,-2px) rotate(-1deg);box-shadow:6px 6px 0 #171812;
}
.ns-desktop-nav .ns-header-menu>li:not(.ns-buy-menu):nth-child(even)>a:hover,
.ns-desktop-nav .ns-header-menu>li:not(.ns-buy-menu):nth-child(even)>a:focus-visible{background:#ffac62}
.ns-desktop-nav .ns-header-menu>li.current-menu-item:not(.ns-buy-menu)>a,
.ns-desktop-nav .ns-header-menu>li.current_page_item:not(.ns-buy-menu)>a{
 background:#171812;color:#fff2d0;text-decoration:none;
}
/* Fallback for the Buy link even when WordPress's CSS Classes field is hidden. */
.ns-desktop-nav .ns-header-menu>li.ns-buy-menu>a,
.ns-desktop-nav .ns-header-menu>li>a[href*="savesomegreen.co.uk/product/the-nut-sack/"]{
 background:#97e600;color:#171812;border:2px solid #171812;
 box-shadow:5px 5px 0 #171812;transform:rotate(-.6deg);text-decoration:none;
}
.ns-desktop-nav .ns-header-menu>li.ns-buy-menu>a:hover,
.ns-desktop-nav .ns-header-menu>li.ns-buy-menu>a:focus-visible,
.ns-desktop-nav .ns-header-menu>li>a[href*="savesomegreen.co.uk/product/the-nut-sack/"]:hover,
.ns-desktop-nav .ns-header-menu>li>a[href*="savesomegreen.co.uk/product/the-nut-sack/"]:focus-visible{
 background:#ffac62;color:#171812;box-shadow:7px 7px 0 #171812;
 transform:translate(-2px,-2px) rotate(1deg);text-decoration:none;
}
.ns-header-menu a:focus-visible{outline:3px solid #171812;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.ns-desktop-nav .ns-header-menu>li>a{transition:none}}
.ns-header-menu .sub-menu{display:none;position:absolute;left:0;top:100%;list-style:none;padding:8px 0;margin:0;background:#f1e9df;min-width:190px;z-index:10;box-shadow:0 10px 25px #0003}
.ns-header-menu .sub-menu a{display:block;padding:10px 14px;font-size:.9rem;line-height:1.3;color:#171812;text-decoration:none}
.ns-header-menu li:hover>.sub-menu,.ns-header-menu li:focus-within>.sub-menu{display:block}
.ns-mobile-menu{display:none}
.main-navigation{display:none!important}
.ns-home .ns-product-notes{gap:9px;max-width:650px;align-self:center;text-align:center;margin-top:14px}
.ns-home .ns-product-notes .ns-eyebrow{font-size:clamp(1.04rem,1.35vw,1.38rem);font-weight:900;line-height:1.25;letter-spacing:.06em}
.ns-home .ns-product-caption{font-size:clamp(1.02rem,1.08vw,1.18rem);line-height:1.48;max-width:48ch}
@media(min-width:701px){.ns-photo-card--hero .ns-price-badge{right:3%;top:11%;bottom:auto;width:110px;height:110px;border:3px solid #171812;box-shadow:7px 7px 0 #171812;transform:rotate(13deg);font-size:2.25rem}}
@media(max-width:1100px){.ns-masthead-inner{grid-template-columns:minmax(0,1fr) auto;min-height:78px;width:calc(100% - 24px);gap:12px}
.ns-site-header__logo img{max-width:540px;max-height:90px}
.ns-desktop-nav{display:none}
.ns-mobile-menu{display:block;position:relative;z-index:11}
.ns-mobile-menu summary{list-style:none;cursor:pointer;color:#171812;background:#97e600;font-size:.94rem;font-weight:900;text-transform:uppercase;padding:12px 15px;white-space:nowrap}
.ns-mobile-menu summary::-webkit-details-marker{display:none}
.ns-mobile-menu summary span{margin-left:8px}
.ns-mobile-menu nav{position:absolute;right:0;top:calc(100% + 4px);background:#f1e9df;min-width:min(85vw,320px);box-shadow:0 14px 26px #0005}
.ns-mobile-menu .ns-header-menu{display:block}
.ns-mobile-menu .ns-header-menu a{display:block;width:100%;min-height:0;font-size:1rem;line-height:1.3;padding:13px 18px;text-align:left;white-space:normal}
.ns-mobile-menu .ns-header-menu>li>a:hover,.ns-mobile-menu .ns-header-menu>li>a:focus-visible{background:#d7f7a0;color:#171812;text-decoration:none}
.ns-mobile-menu .ns-header-menu>li.current-menu-item>a{background:#171812;color:#fff2d0}
.ns-mobile-menu .ns-header-menu a[href*="savesomegreen.co.uk/product/the-nut-sack/"],.ns-mobile-menu .ns-header-menu li.ns-buy-menu>a{box-shadow:none}
.ns-mobile-menu .ns-header-menu li+li{border-top:1px solid #17181225}
.ns-mobile-menu .ns-header-menu .sub-menu{display:block;position:static;box-shadow:none;padding:0 0 0 16px}}
@media(max-width:782px){.admin-bar .site-header.ns-site-header{top:46px}}

@media(max-width:600px){.admin-bar .site-header.ns-site-header{top:0}
.ns-masthead-inner{min-height:68px}
.ns-mobile-menu summary{padding:11px 12px;font-size:.81rem}}

/* Shared component sizing and responsive layout — single source, v0.1.18 */
.ns-copy{font-size:clamp(1.1rem,1.42vw,1.4rem);line-height:1.65;max-width:62ch}
.ns-heading{font-family:Impact,Haettenschweiler,"Arial Narrow Bold","Arial Narrow",sans-serif;text-transform:uppercase;
 font-size:clamp(2.45rem,4.35vw,5.5rem);font-weight:900;letter-spacing:-.017em;line-height:1.12;margin:.28em 0 .35em;
 max-width:18ch;overflow-wrap:normal;word-break:normal}
.ns-media-split,.ns-behind-scenes,.ns-inner-hero__grid,.ns-result-photo{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,5vw,78px);align-items:center}
.ns-media-split>*,.ns-behind-scenes>*,.ns-inner-hero__grid>*,.ns-result-photo>*{min-width:0}
.ns-material-note .ns-heading{max-width:17ch}
.ns-material-note .ns-copy,.ns-behind-scenes .ns-copy{font-size:clamp(1.12rem,1.43vw,1.43rem);line-height:1.65;max-width:57ch}
.ns-material-note ul{font-size:clamp(1.06rem,1.24vw,1.26rem);line-height:1.6}
.ns-behind-scenes .ns-heading{font-size:clamp(2.55rem,4.3vw,5.5rem);max-width:17ch;line-height:1.12}
.ns-behind-scenes .ns-actions .ns-button.button{min-height:66px;font-size:clamp(1.04rem,1.15vw,1.25rem);padding:15px 23px}
.ns-hero-subtitle{font-size:clamp(1.7rem,2.7vw,3rem);font-weight:850;line-height:1.15;max-width:24ch;margin:14px 0}
.ns-hero-details .ns-copy{font-size:clamp(1.13rem,1.4vw,1.45rem);max-width:62ch;line-height:1.65;margin:0}
.ns-hero-actions{display:grid;gap:18px;width:100%;align-self:center}
.ns-hero-badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%}
.ns-hero-badge{display:flex;align-items:center;justify-content:center;text-align:center;min-width:0;min-height:84px;
 padding:15px 12px;background:rgba(255,242,208,.10);border:none;border-radius:999px;
 color:var(--ns-cream);font-size:clamp(1.02rem,1.18vw,1.25rem);font-weight:800;line-height:1.24;
 cursor:default;user-select:text}
.ns-hero-ctas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%}
.ns-hero-ctas .ns-button.button{display:flex;min-height:94px;padding:20px 18px;align-items:center;
 justify-content:center;text-align:center;font-size:clamp(1.13rem,1.35vw,1.55rem);font-weight:900;
 border-radius:0;text-decoration:none;cursor:pointer;transition:transform .16s ease,background .16s ease}
.ns-hero-ctas .ns-button.button:hover,.ns-hero-ctas .ns-button.button:focus-visible{transform:translateY(-3px)}
/* At tablet and phone widths every content split becomes one full-width column. */
@media(max-width:900px){
.ns-media-split,.ns-behind-scenes,.ns-inner-hero__grid,.ns-result-photo,
.ns-hero-bottom{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(24px,5vw,48px)}
.ns-media-split>*,.ns-behind-scenes>*,.ns-inner-hero__grid>*,.ns-result-photo>*{width:100%;max-width:100%;min-width:0}
.ns-heading,.ns-behind-scenes .ns-heading{font-size:clamp(2.45rem,8.3vw,4.45rem);max-width:100%;line-height:1.14}
.ns-copy,.ns-hero-details .ns-copy,.ns-material-note .ns-copy,.ns-behind-scenes .ns-copy{font-size:clamp(1.1rem,2.7vw,1.35rem)}
.ns-hero-actions{max-width:none}
}
@media(max-width:700px){
.ns-media-split,.ns-behind-scenes,.ns-inner-hero__grid,.ns-result-photo{grid-template-columns:minmax(0,1fr);gap:24px}
.ns-heading,.ns-behind-scenes .ns-heading{font-size:clamp(2.15rem,10vw,3.2rem);line-height:1.15;letter-spacing:-.015em}
.ns-copy,.ns-hero-details .ns-copy,.ns-material-note .ns-copy,.ns-behind-scenes .ns-copy{font-size:1.13rem;line-height:1.62}
.ns-hero-subtitle{font-size:clamp(1.65rem,6.8vw,2.25rem)}
.ns-hero-badges{grid-template-columns:1fr;gap:8px}
.ns-hero-badge{min-height:49px;justify-content:flex-start;text-align:left;padding:11px 17px;font-size:1.05rem}
.ns-hero-ctas{grid-template-columns:minmax(0,1fr)}
.ns-hero-ctas .ns-button.button{min-height:65px;font-size:1.16rem}
.ns-behind-scenes .ns-actions{width:100%}
.ns-behind-scenes .ns-actions .ns-button.button{flex:1 1 100%;width:100%;font-size:1.05rem}
}

/* ===== INNER-PAGE COMPONENTS (content styling only) ===== */
/* One callout title at every width: controlled high-contrast poster extrusion. */
.ns-page-title{font-family:Impact,Haettenschweiler,"Arial Narrow Bold","Arial Narrow",sans-serif;text-transform:uppercase;font-size:clamp(4.5rem,8.1vw,10rem);line-height:.94;letter-spacing:-.018em;margin:.12em 0 .2em;max-width:13ch;overflow-wrap:normal;word-break:normal}
.ns-page-intro{font-size:clamp(1.22rem,1.9vw,1.9rem);line-height:1.45;max-width:55ch;margin:0 0 1.1em}
.ns-acid{color:var(--ns-acid)}
.ns-section-head{margin-bottom:clamp(22px,3.2vw,55px)}
.ns-section-head .ns-copy{max-width:68ch}
.ns-callout-band{padding:clamp(35px,5vw,78px) 0}
.ns-callout-band--acid{background:var(--ns-acid);color:#151812;--ns-callout-shadow:#fff2d0}
.ns-callout-band--rust{background:#9a3e25;color:#fff2d0;--ns-callout-shadow:#171812}
.ns-callout-band__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(20px,4vw,75px);align-items:center}
.ns-callout-title{font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;text-transform:uppercase;font-size:clamp(2.8rem,5vw,6rem);line-height:1.15;letter-spacing:-.01em;margin:0;min-width:0;transform:rotate(-.7deg);transform-origin:left center;text-shadow:clamp(1px,.16vw,3px) clamp(2px,.23vw,4px) 0 var(--ns-callout-shadow)}
/* Historical bold offset kept on the two inline-poster headings. */
.ns-callout-title--poster{text-shadow:3px 4px 0 #171812}
@media(max-width:700px){.ns-callout-title--poster{text-shadow:1px 2px 0 #171812}}
.ns-callout-copy{font-size:clamp(1.14rem,1.6vw,1.65rem);line-height:1.58;margin:0;max-width:60ch}
.ns-step-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,28px)}
.ns-step-card{background:#fffaf0;border:2px solid #191a12;padding:clamp(20px,2.2vw,32px);min-width:0}
.ns-step-number{font-family:Impact,Haettenschweiler,sans-serif;font-size:clamp(3rem,4.2vw,5rem);color:#658f00;line-height:1}
.ns-step-card h3{font-size:clamp(1.5rem,1.9vw,2.2rem);margin:14px 0 12px;line-height:1.2}
.ns-step-card p,.ns-info-row p,.ns-faq p,.ns-form-card p{font-size:clamp(1.05rem,1.3vw,1.35rem);line-height:1.6}

.ns-note{padding:22px 25px;border-left:6px solid var(--ns-acid);background:rgba(151,230,0,.11);font-size:clamp(1.05rem,1.25vw,1.28rem);line-height:1.55;margin:25px 0}

/* ===== SHARED INFO FEATURE — How to Use, Uses, Make Nut Milk =====
   One layout component replaces the nested two-column .ns-media-split +
   .ns-info-row grid. Use ns-info-feature for all 4 content sections.
   Image and text are THE SAME markup at all breakpoints. */
.ns-info-feature{display:grid;gap:clamp(22px,3vw,46px)}
.ns-info-feature__intro{width:100%;min-width:0}
.ns-info-feature__intro .ns-heading{max-width:27ch;margin:.25em 0 .28em}
.ns-info-feature__intro .ns-copy{max-width:82ch;margin:0;line-height:1.55}
.ns-info-feature__body{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(26px,4.5vw,72px);align-items:start;min-width:0}
.ns-info-feature__body>*{min-width:0}
.ns-info-feature__body--photo-right{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
.ns-info-feature__body--photo-right>.ns-photo-card{order:2}
.ns-info-feature__body--photo-right>.ns-info-list{order:1}
.ns-info-feature__body>.ns-photo-card{margin:0;align-self:start;max-width:100%}
.ns-info-feature__body>.ns-photo-card img{display:block;max-width:100%;width:100%;height:auto}
.ns-info-feature .ns-info-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.6vw,24px);align-content:start;min-width:0}
.ns-info-feature .ns-info-row{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(8px,.9vw,13px);border:3px solid #171812;background:#fffdf4;color:#171812;padding:clamp(17px,1.5vw,25px);box-shadow:7px 8px 0 #97e600}
.ns-info-feature .ns-info-row:nth-child(even){box-shadow:7px 8px 0 #df6e33}
.ns-info-feature .ns-info-row strong{font-family:Impact,Haettenschweiler,"Arial Narrow Bold","Arial Narrow",sans-serif;font-size:clamp(1.45rem,1.85vw,2rem);text-transform:uppercase;line-height:1.1;letter-spacing:.01em}
.ns-info-feature .ns-info-row p{font-size:clamp(1rem,1.08vw,1.18rem);line-height:1.55;margin:0;overflow-wrap:break-word;max-width:100%}
@media(max-width:1040px){
  .ns-info-feature__body,.ns-info-feature__body--photo-right{grid-template-columns:minmax(0,1fr)}
  .ns-info-feature__body--photo-right>.ns-photo-card,.ns-info-feature__body--photo-right>.ns-info-list{order:initial}
  .ns-info-feature__body>.ns-photo-card{max-width:700px}
}
@media(max-width:600px){
  .ns-info-feature .ns-info-list{grid-template-columns:minmax(0,1fr)}
  .ns-info-feature .ns-info-row{padding:18px;box-shadow:5px 6px 0 #97e600}
  .ns-info-feature .ns-info-row:nth-child(even){box-shadow:5px 6px 0 #df6e33}
}
/* Recipe: exactly one "Strain it" feature uses vertically stacked tips beside
   the portrait photo. All other shared info features retain their layouts.
   This variant is applied by a class on that single section in the page HTML. */
@media(min-width:1041px){
  .ns-info-feature--recipe-stacked .ns-info-feature__body--photo-right{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:clamp(22px,3vw,48px);
    align-items:stretch;
  }
  .ns-info-feature--recipe-stacked .ns-info-list{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:repeat(4,minmax(0,1fr));
    gap:clamp(12px,1.35vw,20px);
    align-content:stretch;
  }
  .ns-info-feature--recipe-stacked .ns-info-row{
    justify-content:center;
  }
  .ns-info-feature--recipe-stacked .ns-info-feature__body>.ns-photo-card{
    display:flex;
    flex-direction:column;
    align-self:stretch;
    height:100%;
    max-width:none;
  }
  .ns-info-feature--recipe-stacked .ns-info-feature__body>.ns-photo-card img{
    width:100%;
    height:clamp(480px,48vw,730px);
    object-fit:cover;
    object-position:center center;
  }
}
/* The other Make Nut Milk information feature retains its v0.1.37 rules. */
@media(min-width:1200px){
  .ns-info-feature--four-across .ns-info-feature__body{grid-template-columns:minmax(0,.85fr) minmax(0,2.15fr);gap:clamp(18px,2.4vw,38px)}
  .ns-info-feature--four-across .ns-info-feature__body--photo-right{grid-template-columns:minmax(0,2.15fr) minmax(0,.85fr)}
  .ns-info-feature--four-across .ns-info-list{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.05vw,18px)}
  .ns-info-feature--four-across .ns-info-row{padding:clamp(12px,1vw,18px);gap:9px}
  .ns-info-feature--four-across .ns-info-row strong{font-size:clamp(1.15rem,1.45vw,1.72rem)}
  .ns-info-feature--four-across .ns-info-row p{font-size:clamp(.93rem,.99vw,1.08rem);line-height:1.48}
}
/* ===== END SHARED INFO FEATURE ===== */

.ns-faq{display:grid;gap:12px;max-width:1100px}
.ns-faq details{border:2px solid #303527;padding:14px 22px;background:rgba(255,255,255,.25)}
.ns-faq summary{cursor:pointer;font-size:clamp(1.23rem,1.65vw,1.7rem);font-weight:850;line-height:1.35}
.ns-faq p{margin:16px 0 4px}
.ns-form-card{background:#fff2d0;color:#171812;padding:clamp(22px,3vw,48px);border:3px solid #171812}
.ns-form-card h2{font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;text-transform:uppercase;font-size:clamp(2.4rem,3.6vw,4.3rem);line-height:1.05;margin:0 0 .4em}
.ns-form-card__inner{max-width:650px}
.ns-route-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}
.ns-page .ns-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.ns-page .ns-actions .ns-button{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:62px;padding:15px 22px;text-transform:uppercase;text-decoration:none;font-weight:900;font-size:clamp(1.02rem,1.2vw,1.25rem);border:2px solid currentColor}
.ns-page .ns-actions .ns-button--acid{background:var(--ns-acid);color:#171812;border-color:var(--ns-acid)}
.ns-page .ns-actions .ns-button--outline-light{color:#fff2d0;border-color:#fff2d0}
.ns-page .ns-actions .ns-button--paper{background:#fff2d0;color:#171812;border-color:#171812}
.ns-page .ns-cta-panel{grid-template-columns:minmax(0,1fr) auto;align-items:center}
.ns-page .ns-cta-panel p{font-size:clamp(1.12rem,1.38vw,1.45rem);line-height:1.5}
@media(max-width:900px){
.ns-page .ns-inner-hero__grid,.ns-page .ns-media-split,.ns-callout-band__grid,.ns-page .ns-result-photo{grid-template-columns:minmax(0,1fr)}
.ns-page-title{font-size:clamp(3.5rem,10vw,6.5rem);max-width:100%}
.ns-step-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.ns-page .ns-cta-panel{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:700px){
/* The same poster heading and image as desktop, stacked at phone widths.
   Android uses its condensed sans-serif fallback if Impact is unavailable. */
.ns-page-title{font-family:Impact,Haettenschweiler,"Arial Narrow Bold","Arial Narrow","Roboto Condensed",sans-serif-condensed,sans-serif;font-size:clamp(3.1rem,12.7vw,5.5rem);font-weight:900;line-height:.93;letter-spacing:-.032em;max-width:100%;text-wrap:balance;-webkit-text-stroke:.25px currentColor}
.ns-page .ns-inner-hero{padding-block:clamp(34px,7vw,55px)}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card){display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(16px,5vw,28px);align-items:start}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>div:first-child{display:contents}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>div:first-child>.ns-eyebrow{grid-column:1;grid-row:1;justify-self:start;margin:0}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>div:first-child>.ns-page-title{grid-column:1;grid-row:2;margin:0}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>figure.ns-photo-card{grid-column:1;grid-row:3;width:min(100%,620px);margin:0 auto;align-self:start;min-width:0}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>div:first-child>.ns-page-intro,.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>div:first-child>.ns-actions{grid-column:1;min-width:0;margin:0}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>div:first-child>.ns-actions{margin-top:3px}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>figure.ns-photo-card figcaption{font-size:.86rem;line-height:1.4;padding:10px 2px 2px}
.ns-page .ns-inner-hero__grid:has(> figure.ns-photo-card)>figure.ns-photo-card img{width:100%;height:auto}
.ns-page-intro{font-size:1.2rem}
.ns-step-grid,.ns-route-grid--two{grid-template-columns:minmax(0,1fr)}
.ns-callout-title{font-size:clamp(2.3rem,9vw,3.6rem);line-height:1.17;transform:rotate(-.3deg);text-shadow:1px 2px 0 var(--ns-callout-shadow)}
.ns-page .ns-actions .ns-button{width:100%}
}

/* ===== SHARED NUT SACK CONTACT FORM COMPONENT =====
   Theme-owned presentation for the independent tns-contact-form plugin.
   Scoped to .ns-form-card, never to GeneratePress's page wrappers.
   Ported from the audited Flatsome child, without .nutsack-site dependency.
*/
.ns-page .ns-form-card{background:#fffdf4;color:var(--ns-ink);border:5px solid #171812;box-shadow:12px 14px 0 var(--ns-acid);transform:rotate(.65deg);min-width:0}
.ns-page .ns-form-card__inner{max-width:none;transform:rotate(-.65deg)}
.ns-page .ns-form-card h2{color:var(--ns-ink);font-weight:900;letter-spacing:-.025em}
.ns-page .ns-form-card__inner>p{color:#31281c;margin:0 0 1rem;line-height:1.58}
.ns-page .ns-form-card .tns-form{width:100%;margin-top:1.15rem;min-width:0}
.ns-page .ns-form-card .tns-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,20px)}
.ns-page .ns-form-card .tns-form p{margin:0 0 .9rem;min-width:0}
.ns-page .ns-form-card .tns-form label{display:block;margin:0 0 .35rem;color:var(--ns-ink);font-size:.87rem;font-weight:900;line-height:1.25;letter-spacing:.045em;text-transform:uppercase}
.ns-page .ns-form-card .tns-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="hidden"]),
.ns-page .ns-form-card .tns-form textarea,
.ns-page .ns-form-card .tns-form select{display:block;width:100%;max-width:100%;margin:0;padding:.8rem .9rem;border:2px solid #171812;border-radius:0;color:var(--ns-ink);background:#fff;font:inherit;line-height:1.4;box-shadow:4px 4px 0 rgba(200,102,39,.18)}
.ns-page .ns-form-card .tns-form textarea{min-height:150px;resize:vertical}
.ns-page .ns-form-card .tns-form input::placeholder,.ns-page .ns-form-card .tns-form textarea::placeholder{color:rgba(22,19,13,.58);opacity:1}
.ns-page .ns-form-card .tns-form :is(input,textarea,select,button):focus-visible{outline:3px solid #c86627;outline-offset:3px}
.ns-page .ns-form-card .tns-form .tns-submit{display:block;width:100%;min-height:54px;margin-top:.35rem;padding:.8rem 1.15rem;border:2px solid #171812;border-radius:0;color:#171812;background:var(--ns-acid);font:inherit;font-size:1rem;font-weight:900;line-height:1.15;letter-spacing:.045em;text-align:center;text-transform:uppercase;box-shadow:6px 7px 0 #c86627;cursor:pointer}
.ns-page .ns-form-card .tns-form .tns-submit:hover{transform:translateY(-2px)}
.ns-page .ns-form-card .tns-status{margin:0 0 1rem;padding:.85rem 1rem;border:2px solid #171812;color:var(--ns-ink);font-weight:800;line-height:1.45}
.ns-page .ns-form-card .tns-status.success{background:rgba(151,230,0,.25);box-shadow:5px 5px 0 rgba(151,230,0,.58)}
.ns-page .ns-form-card .tns-status.error{background:rgba(200,102,39,.16);box-shadow:5px 5px 0 rgba(200,102,39,.30)}
.ns-page .ns-form-card .tns-hp,.ns-page .ns-form-card .tns-hp *{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
.ns-page .ns-form-card .h-captcha{margin:1rem 0;max-width:100%;overflow:hidden}
@media(max-width:900px){.ns-page .ns-form-card,.ns-page .ns-form-card__inner{transform:none}}
@media(max-width:540px){.ns-page .ns-form-card .tns-form-grid{grid-template-columns:minmax(0,1fr)}}
/* ===== END CONTACT FORM COMPONENT ===== */

/* ===== SHARED SITE FOOTER: rendered once via GeneratePress generate_footer ===== */
/* GeneratePress's actual copyright element is .site-info. */
.site-footer,.site-info{background:#171b0e;color:#fff2d0}
.site-info{border-top:9px solid #97e600;padding:0}
.site-info .inside-site-info{display:block;max-width:none;width:100%;padding:0}
.site-info .copyright-bar{display:block;width:100%;}
.site-info .ns-footer-inner{width:min(var(--ns-max),calc(100% - clamp(36px,5vw,112px)));margin-inline:auto;padding:clamp(30px,4.5vw,65px) 0;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px 45px}
.site-info .ns-footer-copy{margin:0;font-size:clamp(1.08rem,1.32vw,1.38rem);font-weight:900;letter-spacing:.025em}
.site-info .ns-footer-links{display:flex;flex-wrap:wrap;align-items:center;gap:16px clamp(16px,2vw,35px)}
.site-info .ns-footer-links a{display:inline-block;color:#fff2d0;font-size:clamp(1rem,1.1vw,1.2rem);font-weight:850;text-decoration:none;text-transform:uppercase;text-underline-offset:5px}
.site-info .ns-footer-links a:hover,.site-info .ns-footer-links a:focus-visible{color:#97e600;text-decoration:underline}
.site-info .ns-footer-credit{color:#97e600}
/* ===== MAKE NUT MILK: shopping-list section only; no shared-grid overrides ===== */
.ns-recipe-shopping .ns-recipe-shopping__heading{max-width:980px;margin-bottom:clamp(26px,3vw,48px)}
.ns-recipe-shopping .ns-recipe-shopping__heading .ns-heading{max-width:none;margin:.23em 0 .35em}
.ns-recipe-shopping .ns-recipe-shopping__heading .ns-copy{max-width:75ch;margin-bottom:0}
.ns-recipe-shopping .ns-recipe-shopping__grid{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(28px,4.8vw,85px);align-items:start}
.ns-recipe-shopping .ns-recipe-shopping__grid>*{min-width:0}
.ns-recipe-shopping .ns-recipe-shopping__photo{margin:0;transform:rotate(-1.1deg);transform-origin:center;border:3px solid #171812;box-shadow:12px 14px 0 #171812}
.ns-recipe-shopping .ns-recipe-shopping__ingredients{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.65vw,26px);align-content:start}
.ns-recipe-shopping .ns-recipe-shopping__ingredient{padding:clamp(18px,1.7vw,29px);background:#fffdf4;border:3px solid #171812;box-shadow:6px 7px 0 #97e600;min-width:0}
.ns-recipe-shopping .ns-recipe-shopping__ingredient:nth-child(2n){box-shadow:6px 7px 0 #df6e33}
.ns-recipe-shopping .ns-recipe-shopping__ingredient h3{font-family:Impact,Haettenschweiler,"Arial Narrow Bold","Arial Narrow",sans-serif;text-transform:uppercase;font-weight:900;font-size:clamp(1.48rem,2.05vw,2.4rem);line-height:1.1;margin:0 0 .55em}
.ns-recipe-shopping .ns-recipe-shopping__ingredient p{font-size:clamp(1.05rem,1.2vw,1.3rem);line-height:1.55;margin:0;overflow-wrap:break-word}
.ns-recipe-shopping .ns-recipe-shopping__ingredient--last{grid-column:1/-1}
@media(max-width:1000px){.ns-recipe-shopping .ns-recipe-shopping__grid{grid-template-columns:minmax(0,1fr)}.ns-recipe-shopping .ns-recipe-shopping__photo{max-width:660px}}
@media(max-width:640px){.ns-recipe-shopping .ns-recipe-shopping__ingredients{grid-template-columns:minmax(0,1fr)}.ns-recipe-shopping .ns-recipe-shopping__ingredient--last{grid-column:auto}.site-info .ns-footer-inner{width:calc(100% - 34px);align-items:flex-start;flex-direction:column}.site-info .ns-footer-links{gap:12px 20px}}
/* ===== END SHARED FOOTER AND RECIPE COMPONENT ===== */