/* Caldera Sparkling Hop Water — white base, deep green + gold. Instrument Serif + Inter. */
@font-face{font-family:"Inter";font-weight:300;font-style:normal;font-display:swap;src:url(assets/fonts/inter-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-weight:500;font-style:normal;font-display:swap;src:url(assets/fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-weight:400;font-style:normal;font-display:swap;src:url(assets/fonts/instrument-serif-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-weight:400;font-style:italic;font-display:swap;src:url(assets/fonts/instrument-serif-latin-400-italic.woff2) format("woff2")}

:root{
  --bg:#ffffff; --panel:#f3f5f0; --panel2:#eef1ea;
  --ink:#143a27; --mute:#5c6b60; --gold:#9a7b33; --gold-line:#c3a24e; --green:#15402a;
  --disc:#1d5338; --line:rgba(20,58,39,.14);
  --serif:"Instrument Serif","Times New Roman",serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gut:clamp(20px,4.2vw,68px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color:var(--ink);color-scheme:light;font-family:var(--sans);font-weight:300;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth}
:root{color-scheme:light}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{min-height:100vh;font-size:15px;line-height:1.6;position:relative;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
ul{list-style:none}
:focus-visible{outline:1px solid var(--gold);outline-offset:4px}
.skip{position:absolute;left:-9999px;top:8px;background:var(--green);color:#fff;padding:8px 14px;z-index:99}
.skip:focus{left:8px}

/* faded hop watermark on open bands */
.hero,.split-hero,.page-intro,.craft{background-image:url(assets/hops-tile.webp);background-repeat:repeat;background-size:540px auto}

/* image placeholders */
.ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;background:var(--panel);border:1px solid var(--line);color:var(--mute);text-align:center;padding:24px}
.ph-ic{width:46px;height:46px;stroke:var(--gold-line);fill:none;stroke-width:2;opacity:.9;flex:none}
.ph b{font-family:var(--sans);font-weight:400;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.ph em{font-style:normal;font-size:12.5px;color:var(--mute)}

.range{display:flex;flex-direction:column;align-items:center;text-align:center}
.range .kicker{margin-bottom:30px}
.range-shot{width:100%;max-width:380px}
.range-shot img{width:100%;height:auto;display:block;filter:drop-shadow(0 26px 40px rgba(20,58,39,.22))}

/* header */
.site-header{display:flex;align-items:center;justify-content:space-between;height:96px;padding:0 var(--gut);position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);background:var(--bg)}
.nav-r a{min-height:44px;display:inline-flex;align-items:center}
.nav a{font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);opacity:.82;transition:opacity .2s,color .2s}
.nav a:hover,.nav a[aria-current]{opacity:1;color:var(--gold)}
.nav-r{display:flex;align-items:center;gap:34px}
.brand img{width:124px;height:auto;display:block}
.menu{display:none}

/* buttons + links */
.btn{display:inline-block;font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;padding:17px 32px;background:var(--green);color:#fff;border:1px solid var(--green);transition:background .25s,color .25s,border-color .25s;cursor:pointer}
.btn:hover{background:transparent;color:var(--green)}
.btn-brass{background:var(--gold-line);border-color:var(--gold-line);color:#14301f}
.btn-brass:hover{background:transparent;color:var(--gold)}
.btn-sm{padding:12px 22px;background:transparent;color:var(--ink);border-color:rgba(20,58,39,.35)}
.btn-sm:hover{background:var(--green);color:#fff;border-color:var(--green)}
.link{font-size:11px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--gold-line);padding-bottom:5px;transition:color .25s}
.link:hover{color:var(--gold)}
.kicker,.eyebrow{font-size:11px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}

/* hero (home) */
.hero{position:relative;min-height:calc(100svh - 97px);display:grid;grid-template-columns:repeat(12,1fr);align-items:center;padding:0 var(--gut);overflow:hidden}
.hero-copy{grid-column:1/6;grid-row:1;z-index:2;align-self:center}
.hero-logo{width:clamp(210px,20vw,290px);height:auto;margin-bottom:18px}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(57px,7.5vw,123px);line-height:.95;letter-spacing:-.012em;margin:10px 0 18px;color:var(--ink)}
.hero-claim-sm{font-size:clamp(11px,1.05vw,13px);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.hero .tagline{font-family:var(--serif);font-style:italic;font-size:clamp(17px,1.6vw,22px);color:var(--mute)}
.lede{max-width:30ch;color:var(--mute);font-size:15px;margin-bottom:38px}
.cta{display:flex;align-items:center;gap:34px;flex-wrap:wrap}
.hero-bottle{grid-column:7/12;grid-row:1;justify-self:end;align-self:center;position:relative;display:flex;align-items:center;justify-content:center;height:calc(100svh - 190px);min-height:480px;width:100%}
.hero-bottle::before{content:"";position:absolute;top:60%;left:50%;transform:translate(-50%,-50%);height:62%;aspect-ratio:1/1;border-radius:50%;background:var(--disc);z-index:0}
.hero-bottle img{position:relative;z-index:1;height:100%;width:auto;max-width:none;flex:none;filter:drop-shadow(0 30px 44px rgba(20,58,39,.28))}
.hero-meta{grid-column:9/13;grid-row:1;justify-self:end;align-self:end;padding-bottom:44px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);z-index:2}
/* rising bubbles */
.bubbles{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.bubbles i{position:absolute;bottom:7%;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.95),rgba(255,255,255,.3));box-shadow:0 0 6px rgba(255,255,255,.4);opacity:0;animation:bub linear infinite}
.bubbles .b1{left:46%;width:10px;height:10px;animation-duration:6s;animation-delay:0s}
.bubbles .b2{left:52%;width:7px;height:7px;animation-duration:7.6s;animation-delay:1.2s}
.bubbles .b3{left:49%;width:13px;height:13px;animation-duration:8.6s;animation-delay:2.5s}
.bubbles .b4{left:55%;width:6px;height:6px;animation-duration:6.8s;animation-delay:3.2s}
.bubbles .b5{left:43%;width:8px;height:8px;animation-duration:9s;animation-delay:.7s}
.bubbles .b6{left:57%;width:9px;height:9px;animation-duration:7.2s;animation-delay:4s}
@keyframes bub{0%{transform:translateY(0) scale(.6);opacity:0}12%{opacity:.85}80%{opacity:.45}100%{transform:translateY(-60vh) scale(1);opacity:0}}
/* branded section separator */
.sep{display:flex;align-items:center;justify-content:center;gap:16px;padding:clamp(22px,3.2vw,44px) var(--gut)}
.sep>span{height:1px;width:clamp(44px,8vw,96px)}
.sep>span:first-child{background:linear-gradient(90deg,transparent,var(--gold-line))}
.sep>span:last-child{background:linear-gradient(90deg,var(--gold-line),transparent)}
.sep svg{width:17px;height:auto;stroke:var(--gold-line);fill:none;flex:none;opacity:.95}

/* generic section */
.section{padding:clamp(52px,7vw,104px) var(--gut);position:relative}
.narrow{max-width:760px;margin:0 auto}
.center{text-align:center}

/* page intro band — plain default, used on most inner pages */
.page-intro{position:relative;overflow:hidden;padding:clamp(52px,7.5vw,96px) var(--gut) clamp(24px,3.5vw,48px);text-align:center;background:#fff}
.page-intro>*{position:relative;z-index:1}
.page-intro h1{font-family:var(--serif);font-weight:400;font-size:clamp(46px,6.6vw,104px);line-height:.98;letter-spacing:-.012em;margin-top:18px;color:var(--ink)}
.page-intro .lede{margin:28px auto 0;max-width:46ch;color:var(--mute)}

/* page intro — photo variant (About Us / Our Story only) */
.page-intro-photo::before{content:"";position:absolute;inset:0;background-image:url(assets/about-banner-bg.webp);background-size:cover;background-position:center;opacity:.85;z-index:0;pointer-events:none}
.page-intro-photo::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 65% at center,rgba(13,30,22,.78) 0%,rgba(13,30,22,.46) 48%,rgba(13,30,22,0) 78%);z-index:0;pointer-events:none}
.page-intro-photo h1{color:#fff}
.page-intro-photo .kicker{color:#e9ded0}
.page-intro-photo .lede{color:#d8ddd4}

/* page intro — dark variant (solid brand green, no photo) */
.page-intro-dark{background:var(--green)}
.page-intro-dark .kicker{color:var(--gold-line)}
.page-intro-dark h1{color:#fff}
.page-intro-dark .lede{color:rgba(255,255,255,.72)}

/* page intro — bottle watermark variant (Track Order) */
.page-intro-bottle{background:#fff}
.page-intro-bottle-img{position:absolute;z-index:0;pointer-events:none;right:clamp(-40px,2vw,40px);bottom:-14%;height:132%;width:auto;opacity:.16}
.page-intro-bottle>*:not(.page-intro-bottle-img){position:relative;z-index:1}

/* page intro — generic faint product-image filler, for pages with no other imagery */
.page-intro-filler-img{position:absolute;z-index:0;pointer-events:none}
.page-intro-filler-img.pos-br{right:clamp(-30px,2vw,30px);bottom:-12%}
.page-intro-filler-img.pos-bl{left:clamp(-30px,2vw,30px);bottom:-12%}
.page-intro-filler-img.pos-tr{right:clamp(-20px,3vw,40px);top:-18%}
.page-intro-filler-img.pos-tl{left:clamp(-20px,3vw,40px);top:-18%}
.filler-b2b{height:78%;width:auto;opacity:.14}
.filler-shipping{width:min(320px,36vw);height:auto;opacity:.13}
.filler-faq{width:min(300px,34vw);height:auto;opacity:.12}
.filler-privacy{height:90%;width:auto;opacity:.1}
.filler-terms{width:min(260px,30vw);height:auto;opacity:.1}
.filler-refunds{height:85%;width:auto;opacity:.12}

/* body-section filler — second, lighter watermark touch in the page body itself,
   sits behind in-flow content via negative z-index (no need to re-layer the prose) */
.section-filler-img{position:absolute;z-index:-1;pointer-events:none;max-height:100%}
.bf-tl{left:clamp(-60px,1vw,20px);top:0}
.bf-tr{right:clamp(-60px,1vw,20px);top:0}
.bf-bl{left:clamp(-60px,1vw,20px);bottom:0}
.bf-br{right:clamp(-60px,1vw,20px);bottom:0}
.bf-terms{height:200px;width:auto;opacity:.1}
.bf-privacy{width:170px;height:auto;opacity:.1}
.bf-shipping{height:190px;width:auto;opacity:.1}
.bf-refunds{height:220px;width:auto;opacity:.1}
.bf-faq{height:240px;width:auto;opacity:.08}

/* product (home) — bottle, boxed copy, faded hops */
.product{display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px;align-items:center}
.product-image{grid-column:1/5;aspect-ratio:4/5;background:var(--panel);position:relative;overflow:hidden}
.product-image img{position:absolute;inset:8% 18%;width:64%;height:84%;object-fit:contain;filter:drop-shadow(0 20px 26px rgba(20,58,39,.18))}
.product-copy{grid-column:6/11}
.product-copy.boxed{border:1px solid var(--line);background:var(--panel);padding:clamp(28px,3.2vw,52px)}
.statement{font-family:var(--serif);font-size:clamp(24px,2.6vw,40px);line-height:1.16;letter-spacing:-.005em;margin:22px 0 44px;max-width:23ch;color:var(--ink)}
.deco-hops.prod{right:0;top:50%;transform:translateY(-50%)}

/* facts / nutrition */
.facts{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.facts div{padding:18px 16px 18px 0;border-bottom:1px solid var(--line)}
.facts dt{font-size:10px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-bottom:6px}
.facts dd{font-size:15px;display:flex;align-items:center;gap:8px;color:var(--ink)}
.veg{display:inline-block;width:14px;height:14px;border:1.5px solid #1f7a46;padding:2px;box-sizing:border-box;flex:none}
.veg::after{content:"";display:block;width:100%;height:100%;border-radius:50%;background:#1f7a46}

/* nutrition table */
.nutri{max-width:520px;margin:0 auto;border:1px solid var(--line);background:var(--bg)}
.nutri h3{font-family:var(--serif);font-weight:400;font-size:28px;padding:22px 26px;border-bottom:1px solid var(--line);color:var(--ink)}
.nutri .row{display:flex;justify-content:space-between;padding:15px 26px;border-bottom:1px solid var(--line);font-size:14.5px;color:var(--ink)}
.nutri .row:last-of-type{border-bottom:0}
.nutri .row span:last-child{color:var(--mute)}
.nutri .foot{font-size:11.5px;color:var(--mute);padding:16px 26px;border-top:1px solid var(--line)}

/* craft (home) — text left, sliding panel right */
.craft{position:relative;overflow:hidden;background:var(--panel2)}
.craft::before{content:"";position:absolute;inset:0;background-image:url(assets/craft-bg.webp);background-size:cover;background-position:center;opacity:.85;z-index:0;pointer-events:none}
.craft::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 65% at center,rgba(13,30,22,.78) 0%,rgba(13,30,22,.46) 48%,rgba(13,30,22,0) 78%);z-index:0;pointer-events:none}
.craft-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;max-width:46ch;margin:0 auto}
.craft-copy .kicker{margin-bottom:14px;color:#e9ded0}
.craft h2{font-family:var(--serif);font-weight:400;font-size:clamp(38px,5vw,76px);line-height:1;letter-spacing:-.01em;color:#fff}
.craft p{color:#d8ddd4;margin:28px 0 36px;font-size:16px}

/* shop / order */
.shop-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:56px;flex-wrap:wrap}
.shop h2,.order h2{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5vw,72px);line-height:1;color:var(--ink)}
.shop-head p{color:var(--mute)}
.packs{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.packs.four{grid-template-columns:repeat(4,1fr)}
.pack{background:var(--bg);border:1px solid var(--line);display:flex;flex-direction:column;transition:border-color .25s;min-width:0}
.pack:hover{border-color:var(--gold-line)}
.pack-image{display:block;position:relative;aspect-ratio:1/.92;background:var(--panel)}
.pack-image img{position:absolute;inset:22px;width:calc(100% - 44px);height:calc(100% - 44px);object-fit:contain;filter:drop-shadow(0 12px 14px rgba(20,58,39,.14))}
.pack-ph{aspect-ratio:1/.92}
.pack-ph .ph{border:0}
.pack-info{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;padding:20px 22px;border-top:1px solid var(--line)}
.pack h3{font-family:var(--serif);font-weight:400;font-size:24px;line-height:1.1;color:var(--ink)}
.pack p{font-size:12.5px;color:var(--mute);margin-top:2px}
.buy{display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.price{display:flex;flex-direction:column;align-items:flex-end;font-size:19px;color:var(--ink);letter-spacing:.01em}
.price small{font-size:10.5px;color:var(--mute);margin-top:2px;letter-spacing:.04em}

/* order detail blocks */
.order-layout{display:grid;grid-template-columns:280px 1fr;gap:48px;margin-top:48px}
.order-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;border-top:1px solid var(--line);padding-top:48px}
.order-grid h3{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.order-grid p{color:var(--mute);font-size:14px;line-height:1.7}

/* live pack badges + sold-out state */
.pack{position:relative}
.pack-badge{position:absolute;top:14px;left:14px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;background:var(--green);color:#fff;padding:5px 10px;z-index:2}
.pack-badge-out{background:var(--mute)}
.pack-sold-out .pack-image img{opacity:.45}
.btn-disabled{opacity:.45;cursor:default;pointer-events:none}

/* quantity stepper (shop page) */
.qty-stepper{display:flex;align-items:center;gap:14px;border:1px solid rgba(20,58,39,.35)}
.qty-btn{background:none;border:0;width:38px;height:38px;font-size:16px;color:var(--ink);cursor:pointer;transition:background .2s}
.qty-btn:hover{background:var(--panel)}
.qty-val{min-width:18px;text-align:center;font-size:14px;color:var(--ink)}

/* crate — order + checkout summary */
.crate-aside{border:1px solid var(--line);padding:26px 24px;align-self:start;position:sticky;top:116px}
.crate-aside h3,#checkout-summary-wrap h3,#checkout-form h3{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.crate-empty{color:var(--mute);font-size:14px;line-height:1.6}
.crate-rows{border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:10px}
.crate-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:14px;color:var(--ink)}
.crate-sub{font-weight:500;border-top:1px solid var(--line);margin-top:6px;padding-top:12px}
.crate-note{font-size:12px;color:var(--mute);margin-top:10px;line-height:1.6}
.crate-cta{display:block;text-align:center;margin-top:18px}
.order-error{color:var(--mute);grid-column:1/-1;padding:40px 0;text-align:center}

/* checkout + track layout */
.checkout-layout{display:grid;grid-template-columns:320px 1fr;gap:48px;align-items:start}
#checkout-summary-wrap{border:1px solid var(--line);padding:26px 24px;position:sticky;top:116px}
#checkout-form h3{margin-top:28px}
#checkout-form h3:first-of-type{margin-top:0}
.f-err{color:#9b3b2d;font-size:12px;margin-top:6px;display:block;min-height:1px}
.f-note{color:var(--gold);font-size:12px;margin-top:6px;display:block}
.check-row{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--mute)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{font-size:13px;margin-top:6px}
.form-ok{color:var(--green)}
.form-err{color:#9b3b2d}

/* receipt */
.receipt-box{max-width:560px;border:1px solid var(--line);padding:36px 32px}
.receipt-box h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,38px);margin:4px 0 22px;color:var(--ink)}
.receipt-box .story-cta{margin-top:20px}

/* order tracker */
.tracker{display:flex;flex-direction:column;gap:0;margin:18px 0;border-left:2px solid var(--line);padding-left:20px}
.tracker li{position:relative;padding:10px 0;color:var(--mute);font-size:14px}
.tracker li::before{content:"";position:absolute;left:-26px;top:16px;width:9px;height:9px;border-radius:50%;background:var(--line)}
.tracker li.done{color:var(--ink)}
.tracker li.done::before{background:var(--green)}
.tracker li.current{color:var(--gold);font-weight:500}
.tracker li.current::before{background:var(--gold-line)}

@media (max-width:860px){
  .order-layout,.checkout-layout{grid-template-columns:1fr}
  .crate-aside,#checkout-summary-wrap{position:static}
}

/* drink band (home) — centred editorial */
.drink{text-align:center}
.drink .statement{font-family:var(--serif);font-size:clamp(28px,3.4vw,52px);line-height:1.14;letter-spacing:-.005em;max-width:20ch;margin:20px auto 40px;color:var(--ink)}
.facts-strip{display:grid;grid-template-columns:repeat(4,1fr);max-width:900px;margin:0 auto;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts-strip div{padding:24px 6px;border-right:1px solid var(--line);min-width:0}
.facts-strip div:last-child{border-right:0}
.facts-strip dt{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mute);margin-bottom:9px}
.facts-strip dd{font-size:15px;color:var(--ink);display:flex;align-items:center;justify-content:center;gap:8px}
.drink-cta{margin-top:36px}
.drink .nutri-center{margin-top:40px}

/* hop water detail — Q&A left, nutrition right */
.hw-detail{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:start}
.qa-block{margin-bottom:46px}
.qa-block:last-child{margin-bottom:0}
.qa-block h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,42px);color:var(--ink)}
.qa-block h2::after{content:"";display:block;width:42px;height:2px;background:var(--gold-line);margin:14px 0 0}
.qa-block p{color:var(--mute);font-size:16px;line-height:1.78;margin-top:18px}

/* nutrition facts panel */
.nutri2{border:1px solid var(--line);background:var(--bg);padding:30px 30px 24px}
.nutri2 h3{font-family:var(--serif);font-weight:400;font-size:30px;color:var(--ink);border-bottom:2px solid var(--ink);padding-bottom:12px}
.nutri2 .serve{font-size:12px;letter-spacing:.03em;color:var(--mute);padding:10px 0;border-bottom:6px solid var(--ink)}
.nutri2 .amt{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);padding:10px 0;border-bottom:1px solid var(--line)}
.nutri2 .cal{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-bottom:3px solid var(--ink)}
.nutri2 .cal b{font-family:var(--serif);font-weight:400;font-size:26px;color:var(--ink)}
.nutri2 .nrow{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--ink)}
.nutri2 .nrow:last-of-type{border-bottom:0}
.nutri2 .nrow span:last-child{color:var(--mute)}
.nutri2 .nfoot{font-size:11px;color:var(--mute);padding-top:14px;line-height:1.6}
.nutri-wrap{position:sticky;top:112px}
.nutri-center{max-width:460px;margin:0 auto}

/* split hero (hop water) — bottle left, copy right */
.split-hero{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;min-height:calc(100svh - 97px);padding:0 var(--gut);overflow:hidden}
.split-bottle{position:relative;display:flex;align-items:center;justify-content:center;height:72vh;min-height:460px}
.split-bottle::before{content:"";position:absolute;top:61%;left:50%;transform:translate(-50%,-50%);height:64%;aspect-ratio:1/1;border-radius:50%;background:var(--disc)}
.split-bottle img{position:relative;z-index:1;height:100%;width:auto;max-width:none;filter:drop-shadow(0 28px 38px rgba(20,58,39,.22))}
.split-copy{max-width:520px}
.split-copy h1{font-family:var(--serif);font-weight:400;font-size:clamp(44px,5.6vw,92px);line-height:.98;letter-spacing:-.012em;margin:18px 0 26px;color:var(--ink)}
.split-copy .lede{margin-bottom:30px}
.deco-hops.hw{right:0;top:14%}

/* prose */
.prose p{color:var(--mute);margin-bottom:24px;font-size:16.5px;line-height:1.78}
.prose .lead{color:var(--ink);font-family:var(--serif);font-size:clamp(24px,2.4vw,34px);line-height:1.28;max-width:32ch;margin:0 auto 44px;text-align:center}
.prose h2{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,42px);margin:56px 0 20px;color:var(--ink)}
.prose strong{color:var(--ink);font-weight:500}

/* policy pages — TOC pills, meta strip, and the h3/list styles long legal text needs */
.pol-toc{margin:0 0 40px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px;text-align:left}
.pol-toc a{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:100px;font-family:var(--sans);font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:400;color:var(--mute);text-decoration:none;transition:color .2s,border-color .2s}
.pol-toc a:hover{color:var(--gold);border-color:var(--gold-line)}
.pol-meta{margin:0 0 44px;padding:20px 24px;border:1px solid var(--line);font-size:13px;line-height:1.75;color:var(--mute);text-align:left}
.pol-meta b{color:var(--ink);font-weight:500}
.pol-meta a{color:var(--ink)}
.prose h2:first-of-type{margin-top:0}
.prose h3{font-family:var(--sans);font-weight:500;font-size:12px;letter-spacing:.09em;text-transform:uppercase;margin:30px 0 12px;color:var(--gold)}
.prose ul{margin:0 0 24px;padding-left:20px;color:var(--mute)}
.prose li{margin-bottom:10px;font-size:16px;line-height:1.72}
.prose section{scroll-margin-top:110px}
.pol-grievance{margin-top:22px}
.pol-body{text-align:left}

/* FAQ */
.faq{max-width:780px;margin:0 auto}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:26px 44px 26px 0;position:relative;font-family:var(--serif);font-size:clamp(20px,2vw,26px);color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);font-family:var(--sans);font-weight:300;font-size:24px;color:var(--gold);transition:transform .25s}
.faq details[open] summary::after{content:"\2212"}
.faq .ans{padding:0 44px 28px 0;color:var(--mute);font-size:15.5px;line-height:1.75}
.faq .ans p{margin-bottom:14px}

/* certifications */
.cert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1000px;margin:0 auto}
.cert{border:1px solid var(--line);padding:34px 30px;display:flex;flex-direction:column;gap:14px;background:var(--bg);transition:border-color .25s}
.cert:hover{border-color:var(--gold-line)}
.cert h3{font-family:var(--serif);font-weight:400;font-size:24px;color:var(--ink)}
.cert p{color:var(--mute);font-size:14px;line-height:1.65;flex:1}
.cert .meta{font-size:12px;letter-spacing:.04em;color:var(--gold)}
.cert .dl{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--gold-line);padding-bottom:5px;align-self:flex-start}
.cert .dl:hover{color:var(--gold)}

/* contact / b2b */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;max-width:1040px;margin:0 auto}
.contact-col h2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3vw,44px);margin-bottom:30px;color:var(--ink)}
.contact-list{display:flex;flex-direction:column;gap:26px}
.contact-list .item .lbl{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.contact-list .item a,.contact-list .item p{font-size:16px;color:var(--ink);line-height:1.55}
.contact-list .item .sub{font-size:13px;color:var(--mute);margin-top:3px}
form.ticket{display:flex;flex-direction:column;gap:18px}
.ticket .row2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field label{display:block;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin-bottom:8px}
.field input,.field select,.field textarea{width:100%;background:var(--panel);border:1px solid var(--line);color:var(--ink);font-family:var(--sans);font-size:15px;padding:14px 16px;border-radius:0}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:1px solid var(--gold);outline-offset:0;border-color:var(--gold)}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 20px) 20px,calc(100% - 14px) 20px;background-size:6px 6px,6px 6px;background-repeat:no-repeat}

/* about */
.story-cta{margin-top:48px;text-align:center}
.todo{border:1px dashed rgba(20,58,39,.3);padding:14px 18px;font-size:13px;color:var(--mute);max-width:52ch;margin:40px auto 0;text-align:left}
.todo strong{font-weight:500;color:var(--ink)}

/* footer — deep green anchor */
.site-footer{border-top:3px solid var(--gold-line);padding:76px var(--gut) 44px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;font-size:13px;color:#cdd6cb;position:relative;background:var(--green)}
.foot-brand img{width:104px;margin-bottom:18px}
.foot-brand .fcontact{font-size:12.5px;line-height:1.9}
.foot-brand .fcontact a:hover{color:var(--gold-line)}
.foot-col h4{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-line);margin-bottom:16px;font-weight:400}
.foot-col a{display:block;margin-bottom:11px;transition:color .2s}.foot-col a:hover{color:#fff}
.foot-policies{grid-column:1/-1;display:flex;gap:28px;flex-wrap:wrap;padding-top:30px;border-top:1px solid rgba(255,255,255,.14);font-size:11.5px}
.foot-policies a:hover{color:#fff}
.legal{grid-column:1/-1;font-size:11.5px;line-height:1.7;max-width:86ch;color:#90a393}

.review-tag{position:fixed;left:12px;bottom:12px;z-index:50;font-size:10px;letter-spacing:.06em;color:#fff;background:var(--green);border:1px solid var(--gold-line);padding:6px 10px;max-width:calc(100vw - 24px)}

/* ---------- mobile ---------- */
@media (max-width:860px){
  .site-header{height:72px;grid-template-columns:1fr auto}
  .nav{display:none}
  .brand{grid-column:1;justify-self:start}.brand img{width:96px}
  .menu{display:block;justify-self:end;position:relative;z-index:7}
  .menu summary{list-style:none;cursor:pointer;padding:8px 0;display:flex;align-items:center;justify-content:flex-end;min-width:44px;min-height:44px}
  .menu summary::-webkit-details-marker{display:none}
  .burger{display:block;width:24px;height:15px;stroke:var(--ink);stroke-width:1.6}
  .menu-panel{position:absolute;right:0;top:40px;background:var(--bg);border:1px solid var(--line);min-width:210px;padding:10px 0;box-shadow:0 20px 40px rgba(20,58,39,.12)}
  .menu-panel a{display:block;padding:12px 20px;font-size:11px;letter-spacing:.18em;text-transform:uppercase}

  /* mobile hero: same as desktop — copy left, bottle right (scaled down) */
  .hero{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:14px;min-height:0;padding:16px var(--gut) 20px;text-align:left}
  .hero-copy{grid-column:1;align-self:center;text-align:left}
  .hero-logo{width:clamp(118px,33vw,158px);margin:0 0 10px}
  .hero h1{font-size:clamp(29px,8.1vw,42px);line-height:1.02;margin:6px 0 12px}
  .hero-claim-sm{font-size:9px;letter-spacing:.12em;margin-bottom:10px}
  .hero .tagline{font-size:12.5px}
  .hero-bottle{grid-column:2;align-self:center;justify-self:end;height:46svh;min-height:280px;max-height:400px;width:auto;min-width:0;margin:0}
  .hero-bottle::before{top:56%;height:52%}
  .hero-meta{display:none}

  .section{padding:46px var(--gut)}
  .sep{padding:24px var(--gut)}
  .drink .statement{max-width:none}
  .facts-strip{grid-template-columns:repeat(2,1fr)}
  .facts-strip div{padding:18px 8px;border-bottom:1px solid var(--line)}
  .facts-strip div:nth-child(2n){border-right:0}
  .facts-strip div:nth-last-child(-n+2){border-bottom:0}
  .hw-detail{display:block}
  .nutri-wrap{position:static;margin-top:44px}
  .nutri-center{max-width:none}
  .qa-block{text-align:center}
  .qa-block h2::after{margin-left:auto;margin-right:auto}
  .prose{text-align:center}
  .craft{text-align:center}
  .shop-head{flex-direction:column;align-items:center;text-align:center;gap:10px}
  .packs,.packs.four{grid-template-columns:1fr}
  .pack-info{flex-direction:row;align-items:flex-end;text-align:left}
  .order-grid{grid-template-columns:1fr;gap:32px;text-align:center}

  .split-hero{display:flex;flex-direction:column;min-height:0;padding:28px var(--gut) 0;gap:24px;text-align:center}
  .split-bottle{order:-1;width:100%;height:48svh;min-height:330px}
  .split-bottle::before{height:64%}
  .split-copy{max-width:none}
  .split-copy h1,.split-copy .lede{text-align:center}

  .page-intro{padding-top:38px}
  .page-intro-bottle-img{height:92%;opacity:.12;right:-10px}
  .filler-b2b{height:58%;opacity:.12}
  .filler-shipping{width:38vw;opacity:.11}
  .filler-faq{width:34vw;opacity:.1}
  .filler-privacy{height:62%;opacity:.08}
  .filler-terms{width:30vw;opacity:.08}
  .filler-refunds{height:55%;opacity:.1}
  .section-filler-img{display:none}
  .contact-grid{grid-template-columns:1fr;gap:48px;text-align:center}
  .contact-col h2{text-align:center}
  .contact-list{align-items:center}
  .cert-grid{grid-template-columns:1fr}
  .cert{align-items:center;text-align:center}
  .cert .dl{align-self:center}
  form.ticket{text-align:left}
  form.ticket .btn{align-self:center}
  .ticket .row2{grid-template-columns:1fr}
  .site-footer{grid-template-columns:1fr 1fr;gap:34px}
  .foot-brand{grid-column:1/-1}
}