/* =====================================================================
   New Day - BLUE THEME (2026-09-29)
   A skin layered on top of style.css + waitlist-overlay.css.
   To revert to the lime look: remove the <link> to this file from
   index.html, privacy.html, confirm/ and unsubscribe/ (and restore the
   original pack cutouts from the backup folder).
   Rules here change color, type, radius and decoration only. Layout rules
   that live behavior depends on (sticky gum intro, ingredient accordion
   flex/hover, modal structure) are intentionally left untouched.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,500;0,6..96,600;0,6..96,700;1,6..96,500;1,6..96,600&display=swap');

:root{
  --cobalt:#202A31; --cobalt-deep:#11181E; --navy:#202A31;
  --sky:#93D2F6; --sky-deep:#46535D; --sky-light:#E8F5FD; --tint:#F7F4EC;
  --cream:#FFF5E6; --muted:#56616A;
  --mint-swatch:#7ED3A4; --mint-fill:#C4EDD6; --fresh-fill:#CEEAF5;
  --display:"Fraunces","Cooper Black","Georgia",serif;
  --condensed:"Anton","Impact","Arial Narrow",sans-serif;
  /* existing tokens, re-pointed */
  --lime:var(--sky); --ink:var(--navy); --paper:#FFFFFF; --line:#DEE4E8;
  --star:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23FFFFFF' d='M12 1.5c.7 5.6 4.9 9.8 10.5 10.5-5.6.7-9.8 4.9-10.5 10.5C11.3 16.9 7.1 12.7 1.5 12 7.1 11.3 11.3 7.1 12 1.5z'/%3E%3C/svg%3E");
}
body{background:#fff;color:var(--navy)}
button:focus-visible,a:focus-visible,summary:focus-visible{outline-color:var(--sky-deep)}

/* ---- type ---- */
.wordmark{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0,"opsz" 144;font-weight:900;letter-spacing:-1.4px;color:var(--cobalt)}
.wordmark span{font-family:'DM Sans',Arial,sans-serif;font-weight:600}
h1,h2{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0,"opsz" 144;font-weight:900;color:var(--cobalt)}
#hero-title{letter-spacing:-.025em;line-height:.98}
h2{letter-spacing:-1.4px;line-height:1.06}
.italic,em{font-family:var(--display);font-style:italic;font-variation-settings:"SOFT" 100,"WONK" 1,"opsz" 144;font-weight:500;letter-spacing:-.02em}
h1 .italic{font-weight:600}
h1 .italic:after{height:8px;bottom:5px;background:var(--sky)}
.eyebrow{font-family:var(--condensed);font-weight:400;font-size:13px;letter-spacing:2px;color:var(--cobalt)}
.hero p,.section-intro>p,.product>p,.hero-note,.waitlist-product-note,.product .fine{color:var(--muted)}

/* ---- announcement + progress strip ---- */
.announcement{background:var(--cobalt);color:var(--cream)}
.announcement .banner-cta{color:var(--sky)}
.banner-cta .ui-icon{transition:transform .2s ease}
.banner-cta:hover .ui-icon{transform:translateX(3px)}
.landing-progress{padding:11px 5%;background:#fff;border-bottom:1px solid var(--line)}
.landing-progress .waitlist-progress{margin:0;padding:0;background:transparent;color:var(--navy)}
.landing-progress .waitlist-progress>div:first-child{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 12px;font-family:'DM Sans',Arial,sans-serif;font-size:11px;font-weight:600;letter-spacing:1px;color:var(--cobalt)}
.landing-progress [data-spots-left]{letter-spacing:0;font-size:12px;color:var(--navy)}
.landing-progress .waitlist-track,#waitlist-modal .waitlist-track{position:relative;height:6px;margin:8px 0 0;background:var(--sky-light);border-radius:9px}
.waitlist-track>span{display:block;height:100%;width:0;background:var(--cobalt);border-radius:9px;transition:width .65s ease}
.waitlist-track.has-signups:after{content:"";position:absolute;top:50%;left:clamp(4px,var(--progress),calc(100% - 4px));width:8px;height:8px;border-radius:50%;background:var(--cobalt);box-shadow:0 0 0 2px #fff;transform:translate(-50%,-50%);pointer-events:none;animation:nd-pulse 1.8s ease-out infinite}
@media(max-width:720px){.landing-progress{padding:9px 5%}.landing-progress .waitlist-progress>div:first-child{font-size:10px}.landing-progress [data-spots-left]{font-size:11px}}

/* ---- header ---- */
nav a{color:var(--navy);position:relative}
.bag{background:var(--cobalt);border-color:var(--cobalt);color:var(--cream);font-weight:600}
@media(hover:hover) and (pointer:fine){
  .bag:hover{background:var(--sky);border-color:var(--sky);color:var(--navy)}
  nav a:hover{text-decoration:none;opacity:1}
  nav a::after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
  nav a:hover::after{transform:scaleX(1);transform-origin:left}
}

/* ---- buttons ---- */
.button{background:var(--cobalt);border-color:var(--cobalt);color:var(--cream);font-family:var(--condensed);font-weight:400;font-size:15px;letter-spacing:1.8px;border-radius:6px}
.button:hover{background:var(--sky);border-color:var(--sky);color:var(--navy)}

/* ---- hero ---- */
.hero-art{background:var(--sky)}
.hero-art::before,.hero-art::after{content:'';position:absolute;inset:0;pointer-events:none;background-repeat:no-repeat}
.hero-art::before{background-image:var(--star),var(--star);background-position:7% 9%,90% 13%;background-size:28px,16px;animation:nd-twinkle 3.6s ease-in-out infinite}
.hero-art::after{background-image:var(--star),var(--star);background-position:13% 84%,62% 6%;background-size:18px,12px;animation:nd-twinkle 3.6s ease-in-out -1.8s infinite}
.hero-art .hero-flavors{position:relative;z-index:1}
.hero-art .hero-flavors img{filter:drop-shadow(0 18px 16px #202A3133)}
.hero-flavors span{font-family:var(--condensed);font-size:12px;letter-spacing:2px;color:var(--cobalt)}
.round-link{border-color:var(--cobalt);color:var(--cobalt);background:#ffffff80;z-index:1}
.round-link .ui-icon{transition:transform .2s ease}
.round-link:hover{background:#fff}
.round-link:hover .ui-icon{transform:translateY(3px)}
.hero-copy>*{animation:nd-fade-up .7s cubic-bezier(.2,.7,.2,1) both}
.hero-copy>:nth-child(2){animation-delay:.08s}.hero-copy>:nth-child(3){animation-delay:.16s}.hero-copy>:nth-child(4){animation-delay:.24s}.hero-copy>:nth-child(5){animation-delay:.32s}
.hero-flavors>a{animation:nd-zoom-in .9s .2s cubic-bezier(.2,.7,.2,1) both}
.hero-flavors>a:nth-child(2){animation-delay:.35s}

/* ---- moving banner (night stripe) ---- */
.ticker.night-stripe{display:block;background:var(--cobalt);color:var(--cream);padding:18px 0}
.marquee{display:flex;overflow:hidden;width:100%}
.marquee-track{display:flex;flex:none;align-items:center;animation:nd-marquee 38s linear infinite}
.ticker:hover .marquee-track{animation-play-state:paused}
.m-item{display:flex;flex:none;align-items:center;gap:26px;padding:0 30px;white-space:nowrap}
.night-stripe .m-item .stripe-drinks{width:58px;height:50px;color:var(--sky)}
.m-item .stripe-drinks path{fill:#93D2F64d}
.m-item .m-star{width:18px;height:18px;color:var(--sky);flex:none}
.night-stripe p{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0,"opsz" 144;font-weight:700;letter-spacing:-.4px;color:var(--cream)}
.night-stripe em{color:var(--sky);font-weight:500}

/* ---- 01 / the gum (sticky intro behavior untouched) ---- */
#shop{border-bottom:0}
.facts span{border-color:var(--cobalt);color:var(--cobalt);font-family:var(--condensed);font-size:12px;letter-spacing:1.5px;transition:transform .16s ease,box-shadow .16s ease}
.facts span:hover{transform:translateY(-2px);box-shadow:0 4px 0 #202A3122}
.product{border-color:var(--cobalt);border-radius:18px;background:#fff;box-shadow:0 22px 50px #202A3114}
.product-image{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.product:hover .product-image{transform:translateY(-5px)}
.product-heading h3{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0;font-weight:800;font-size:26px;letter-spacing:-.4px;color:var(--cobalt)}
.product-heading>span{font-family:var(--condensed);font-size:12px;letter-spacing:1.8px;color:var(--cobalt)}
.flavor{border-radius:10px;border-color:var(--line)}
.flavor.active{border-color:var(--cobalt);background:var(--sky-light)}
.swatch.lime{background:var(--mint-swatch)}
.swatch.blue{background:var(--sky-deep)}
@media(hover:hover) and (pointer:fine){.pack:hover,.flavor:hover{border-color:var(--cobalt);box-shadow:0 2px 0 #202A3122}}

/* ---- 02 / the ritual: cobalt band with wave edges ---- */
.ritual{background:var(--cobalt);color:var(--cream);position:relative;z-index:1;border-bottom:0}
.ritual::before,.ritual::after{content:'';position:absolute;left:0;right:0;height:46px;background-size:100% 100%;background-repeat:no-repeat;pointer-events:none}
.ritual::before{top:-45px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23202A31' d='M0 34C220 66 470 4 720 30S1220 62 1440 28V60H0z'/%3E%3C/svg%3E")}
.ritual::after{bottom:-45px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23202A31' d='M0 0H1440V26C1200 60 960 0 720 30S240 60 0 26Z'/%3E%3C/svg%3E")}
.ritual h2{color:var(--cream)}
.ritual h2 em{color:var(--sky)}
.hero .eyebrow{font-family:'DM Sans',Arial,sans-serif;font-weight:600;font-size:15px;letter-spacing:.1px;color:var(--cobalt)}
.ritual .eyebrow{color:var(--sky)}
.steps article{border-top-color:#ffffff47}
.steps article>span{font-family:var(--condensed);color:var(--sky);letter-spacing:1px}
.steps h3{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0;font-weight:800;font-size:28px;letter-spacing:-.3px;color:var(--cream)}
.steps p{color:#D8E6F8}

/* ---- 03 / the formula ---- */
.science{background:#fff}
.science-heading svg{color:var(--cobalt)}
.science-heading svg .beaker-liquid{fill:var(--sky)}
.science-heading p,.accordion-hint,.science-footnote,.ingredient-graphic figcaption{color:var(--muted)}
.ingredient-accordion{border:1.5px solid var(--cobalt);border-radius:20px;overflow:hidden;background:#fff}
.ingredient-accordion .ingredient-panel{background:var(--tint);border-right-color:var(--line)}
.ingredient-accordion .ingredient-panel.is-open{background:#fff}
.panel-tab{color:var(--cobalt);font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0;font-weight:800;letter-spacing:-.3px;transition:background-color .25s ease}
.panel-letter{font-family:var(--condensed);font-weight:400;letter-spacing:1px}
.is-open .panel-tab{background:var(--sky)}
.panel-content:not([hidden]){animation:nd-fade-in .35s ease both}
.ingredient-accordion .panel-content>h3{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0;font-weight:900;letter-spacing:-.8px;color:var(--cobalt)}
.science-index{font-family:var(--condensed);letter-spacing:1.6px;color:var(--cobalt)}
.science-row p{color:var(--navy)}
.science-row a{color:var(--cobalt)}
.ingredient-graphic{border-color:var(--line);background-color:#fff;background-image:linear-gradient(#202A310d 1px,transparent 1px),linear-gradient(90deg,#202A310d 1px,transparent 1px);border-radius:10px}
.ingredient-graphic>svg{color:var(--cobalt)}
.ingredient-graphic text{fill:currentColor}
.ingredient-graphic [fill="#c3ff00"]{fill:var(--sky)}
.ingredient-graphic [stroke="#c3ff00"]{stroke:var(--sky)}
.study-note{border-top-color:var(--line)}
.study-note summary{color:var(--cobalt);font-weight:600}
.study-badge{background:var(--sky);color:var(--navy);font-family:var(--condensed);letter-spacing:1.4px;font-size:10px;border-radius:4px}
.science-footnote{border-top-color:var(--line)}

/* ---- 04 / good questions ---- */
#questions{border-bottom:0}
summary{font-weight:600;color:var(--navy)}
summary span{color:var(--cobalt)}
details p{color:var(--muted)}
@media(hover:hover) and (pointer:fine){summary:hover{color:var(--cobalt)}}
/* rows fade in one after another when motion.js reveals the list */
.faq>.scroll-reveal:not(.reveal-pending) details{animation:nd-fade-up .55s cubic-bezier(.2,.7,.2,1) both}
.faq>.scroll-reveal:not(.reveal-pending) details:nth-child(2){animation-delay:.07s}
.faq>.scroll-reveal:not(.reveal-pending) details:nth-child(3){animation-delay:.14s}
.faq>.scroll-reveal:not(.reveal-pending) details:nth-child(4){animation-delay:.21s}
.faq>.scroll-reveal:not(.reveal-pending) details:nth-child(5){animation-delay:.28s}
.faq>.scroll-reveal:not(.reveal-pending) details:nth-child(6){animation-delay:.35s}
.faq>.scroll-reveal:not(.reveal-pending) details:nth-child(7){animation-delay:.42s}

/* ---- footer: cream with a wave edge ---- */
footer{background:var(--cream);position:relative}
footer::before{content:'';position:absolute;left:0;right:0;top:-45px;height:46px;pointer-events:none;background-size:100% 100%;background-repeat:no-repeat;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23FFF5E6' d='M0 30C240 0 480 60 720 30S1200 0 1440 34V60H0z'/%3E%3C/svg%3E")}
.footer-top p,.footer-top>a:last-child{font-family:var(--condensed);font-size:12px;letter-spacing:1.8px;color:var(--cobalt)}
.footer-top>a:last-child .ui-icon{transition:transform .2s ease}
.footer-top>a:last-child:hover .ui-icon{transform:translateY(-3px)}
.footer-bottom{border-top-color:#202A312e;color:var(--muted)}
.footer-top.scroll-reveal:not(.reveal-pending)+.footer-bottom{animation:nd-fade-in .8s .25s ease both}

/* ---- waitlist popup (Codex's Sep 26 layout, blue skin) ---- */
#waitlist-modal{height:fit-content;min-height:0;background:#fff;color:var(--navy);border:1px solid var(--cobalt);border-top:7px solid var(--cobalt);border-radius:18px;box-shadow:0 30px 80px #202A3140;padding:44px 28px 26px}
#waitlist-modal::backdrop{background:#202A3199}
#waitlist-modal .waitlist-close{color:var(--cobalt)}
#waitlist-modal :focus-visible{outline-color:var(--sky-deep)}
.waitlist-wordmark{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0,"opsz" 144;font-weight:900;font-size:37px;letter-spacing:-1.4px;line-height:1;color:var(--cobalt);margin:0 auto 24px;width:max-content;text-align:center}.waitlist-wordmark span{display:inline-block;font-family:'DM Sans',Arial,sans-serif;font-weight:600;font-size:12px;letter-spacing:0;vertical-align:top;margin:8px 0 0 5px}
#waitlist-title{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0,"opsz" 144;font-weight:900;color:var(--cobalt)}
.offer-number{font-size:112px;letter-spacing:-5px;line-height:.9}
.offer-number>span{font-size:52px;top:12px;letter-spacing:-2px}
.offer-off{font-family:var(--condensed);font-weight:400;font-size:24px;letter-spacing:6px;color:var(--cobalt);margin:10px 0 2px}
#waitlist-modal .first-order{font-family:var(--display);font-style:italic;font-variation-settings:"SOFT" 100,"WONK" 1,"opsz" 144;font-weight:500;font-size:22px;color:var(--sky-deep);margin:0 0 18px}
#waitlist-modal .waitlist-description{color:var(--muted);font-size:15px}
#waitlist-email{border:1.5px solid var(--cobalt);border-radius:10px;background:#fff;color:var(--navy);font-family:'DM Sans',Arial,sans-serif}
#waitlist-email::placeholder{color:var(--muted)}
.waitlist-cta{background:var(--cobalt);color:var(--cream);border-radius:10px;font-family:var(--condensed);font-weight:400;font-size:15px;letter-spacing:1.8px;transition:background-color .18s,color .18s}
.waitlist-cta:hover{background:var(--sky);color:var(--navy)}
.waitlist-cta .cta-arrow{transition:transform .2s ease}
.waitlist-cta:hover .cta-arrow{transform:translateX(3px)}
.waitlist-consent{color:var(--navy)}
.waitlist-consent input{accent-color:var(--cobalt)}
.waitlist-footer,.waitlist-footer button,.waitlist-footer a,#waitlist-modal .waitlist-fine{color:var(--muted)}
#waitlist-status{color:var(--cobalt)}
.success-mark{background:var(--cobalt);color:var(--cream);margin-top:30px}
#waitlist-success h2{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0,"opsz" 144;font-weight:900;letter-spacing:-1.5px;color:var(--cobalt)}
#waitlist-success h2 em{font-family:var(--display);font-style:italic;font-variation-settings:"SOFT" 100,"WONK" 1,"opsz" 144;font-weight:500;color:var(--sky-deep)}
#waitlist-success .waitlist-description{color:var(--navy);font-size:16px}
#waitlist-success{padding-bottom:10px}
@media(max-width:720px){#waitlist-modal{padding:40px 22px 22px}.offer-number{font-size:98px}}

/* ---- motion ---- */
@keyframes nd-fade-up{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@keyframes nd-fade-in{from{opacity:0}to{opacity:1}}
@keyframes nd-zoom-in{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:none}}
@keyframes nd-marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes nd-twinkle{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes nd-pulse{0%{box-shadow:0 0 0 2px #fff,0 0 0 2px #202A3166}100%{box-shadow:0 0 0 2px #fff,0 0 0 11px #202A3100}}

@media(max-width:720px){
  .ritual::before,.ritual::after,footer::before{height:26px}
  .ritual::before,footer::before{top:-25px}
  .ritual::after{bottom:-25px}
  .m-item{gap:16px;padding:0 20px}
  .night-stripe .m-item .stripe-drinks{width:44px;height:38px}
  .hero-art::before{background-size:22px,13px}
}
.hero-flavors a.coming-soon{position:relative}
.hero-flavors a.coming-soon img{opacity:.9}
.soon-tag{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%) rotate(-6deg);background:var(--cobalt);color:var(--cream);font-family:var(--condensed);font-style:normal;font-size:12px;letter-spacing:1.8px;text-transform:uppercase;padding:7px 13px;border-radius:4px;box-shadow:0 8px 18px #202A3140;white-space:nowrap;pointer-events:none;z-index:2}
.hero-flavors a.coming-soon:hover .soon-tag{background:var(--sky);color:var(--navy)}
.product.is-soon .product-image{opacity:.9}
@media(max-width:720px){.soon-tag{font-size:10px;letter-spacing:1.4px;padding:6px 10px}}
.footer-privacy{color:var(--muted);text-decoration:underline;text-underline-offset:3px}.footer-privacy:hover{color:var(--cobalt)}
@media(prefers-reduced-motion:reduce){
  .marquee-track,.hero-art::before,.hero-art::after,.hero-copy>*,.hero-flavors>a,.waitlist-track.has-signups:after,.panel-content:not([hidden]),.faq details,.footer-bottom{animation:none!important}
}

/* Pack v5 palette: electric blue, ice blue and brushed-silver neutrals. */
.hero-art{background:radial-gradient(ellipse at 48% 40%,#EDF9FD 0%,#CDEBF7 52%,#BDD8E9 100%)}
footer{background:#F1F7FA}
footer::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23F1F7FA' d='M0 30C240 0 480 60 720 30S1200 0 1440 34V60H0z'/%3E%3C/svg%3E")}
.product{border-color:#D5D8ED;box-shadow:0 22px 50px #202A310D}
#waitlist-modal{background:#FBFCFE}
.swatch.blue{background:#93D2F6}

/* Spearmint concept pack accent. */
:root{--mint-swatch:#9BDDDC;--mint-fill:#D5F0EF}

/* Sparse accents from the approved Spearmint pack. */
:root{--mint-swatch:#93D2F6;--mint-fill:#E5F4EA}
.hero .eyebrow .sun{color:var(--mint-swatch)}
h1 .italic:after{background:linear-gradient(90deg,var(--sky) 0%,var(--sky) 77%,var(--mint-swatch) 77%,var(--mint-swatch) 100%)}
#shop .section-intro>.eyebrow::after{content:"";display:inline-block;vertical-align:middle;width:15px;height:15px;margin-left:12px;background:var(--mint-swatch);clip-path:polygon(50% 0,62% 36%,100% 50%,62% 64%,50% 100%,38% 64%,0 50%,38% 36%)}
.flavor[data-flavor="spearmint"].active{background:var(--mint-fill);border-color:#69899D}

/* Approved sky-blue Peppermint visual identity, 19 October 2026. */
:root{--display:"Bodoni Moda",Georgia,serif;--condensed:"DM Sans",Arial,sans-serif;--sky:#93D2F6;--paper:#FFFCF6;--cream:#FFF5E6;--line:#DEE4E8}
body,.science{background:var(--paper)}
header,.landing-progress{background:var(--paper)}
.wordmark,.waitlist-wordmark{font-family:var(--display);font-weight:600;letter-spacing:-2px;font-variation-settings:normal;line-height:1.1}
.wordmark{font-size:43px}.wordmark span,.waitlist-wordmark span{font-size:10px;letter-spacing:0}
h1,h2,.product-heading h3,.steps h3,.panel-tab,.ingredient-accordion .panel-content>h3,#waitlist-title,#waitlist-success h2{font-weight:600;font-variation-settings:normal}
.italic,em,h1 .italic{font-weight:500;font-variation-settings:normal}
.eyebrow,.button,.waitlist-cta,.hero-flavors span,.science-index,.study-badge,.facts span{font-weight:600;letter-spacing:1.2px}
.announcement{background:var(--sky);color:var(--navy)}.announcement .banner-cta{color:var(--navy)}
.hero-art{background:#EAF5FC;display:flex;align-items:center;justify-content:center}
.hero-art::before,.hero-art::after{display:none}
.hero-art .hero-peppermint{display:block;width:100%;padding:0;margin:0;transform:none}
.hero-peppermint>a{display:block;width:100%;margin:0;transform:none!important;animation:none}
.hero-art .hero-peppermint img{display:block;position:static;width:100%;height:auto;object-fit:contain;filter:none;animation:none;transform:none}
.hero-peppermint span{display:block;text-align:center;margin:20px 0 60px;color:var(--navy)}
.hero .eyebrow .sun{color:var(--cobalt)}h1 .italic:after{background:var(--sky)}
.product{background:#FFFCF6;border-color:var(--line);box-shadow:0 20px 50px #202A3109}
.product-image{width:100%;height:auto;object-fit:contain;border-radius:12px;filter:none!important;animation:none!important}
.product:hover .product-image{transform:none}.product-heading h3{font-size:30px}
.ticker.night-stripe{background:var(--sky);color:var(--navy)}.night-stripe p,.night-stripe em,.night-stripe .m-item .stripe-drinks,.m-item .m-star{color:var(--navy)}
.ritual{background:var(--sky);color:var(--navy)}.ritual h2,.ritual h2 em,.ritual .eyebrow,.steps article>span,.steps h3,.steps p{color:var(--navy)}.steps article{border-color:#202A3138}
.ritual::before,.ritual::after{filter:none;background-image:none;background:var(--sky);height:1px}.ritual::before{top:-1px}.ritual::after{bottom:-1px}
.ingredient-accordion{border-color:#D6E2EB}.ingredient-accordion .ingredient-panel.is-open{background:var(--paper)}.ingredient-graphic{background-color:var(--paper)}
.button,.waitlist-cta,.bag{background:var(--cobalt);color:var(--cream);border-color:var(--cobalt)}
.button:hover,.waitlist-cta:hover,.bag:hover{background:var(--sky);color:var(--navy);border-color:var(--cobalt)}
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,#waitlist-modal :focus-visible{outline:2px solid #202A31;outline-offset:4px}
#waitlist-modal{background:var(--cream);border-color:#D6E2EB;border-top:7px solid var(--sky);box-shadow:0 30px 80px #202A3133}
#waitlist-modal::backdrop{background:#202A3180}.waitlist-wordmark{font-size:45px;margin-bottom:23px}
#waitlist-modal .first-order,#waitlist-success h2 em{color:#46535D}
.offer-number{font-size:112px;letter-spacing:-5px}.offer-off{font-family:'DM Sans',Arial,sans-serif;font-size:18px;font-weight:600;letter-spacing:5px}
#waitlist-email{background:#FFFCF6;border-color:#8A9DAA}#waitlist-modal .waitlist-close{width:40px;height:40px;top:10px;right:10px;background:transparent;border-radius:50%}
#waitlist-status{color:#663C2E}.success-mark{background:#E2F2FD;color:var(--navy)}
.account-page{background:var(--paper);color:var(--navy)}.account-page code{color:var(--navy);background:var(--sky-light)}
@media(max-width:720px){.wordmark{font-size:36px}.hero-art{aspect-ratio:auto;min-height:0}.hero-copy{padding-bottom:38px}.hero-peppermint span{margin:10px 0 64px}.hero .eyebrow{font-size:12px}#hero-title{font-size:clamp(45px,11vw,76px);white-space:normal}.waitlist-wordmark{font-size:40px}.offer-number{font-size:94px}.product-heading h3{font-size:28px}#waitlist-modal{max-height:calc(100dvh - 24px);overflow-y:auto;padding:38px 22px 22px}}

/* Floating product and neutral typography correction. */
:root{--cobalt:#202A31;--cobalt-deep:#11181E;--navy:#202A31;--ink:#202A31;--muted:#56616A;--paper:#FDFCFA;--cream:#FFF8ED;--sky:#93D2F6;--line:#DEE4E8;--mint-swatch:#93D2F6;--mint-fill:#E2F2FD}
body,.science{background:var(--paper)}header,.landing-progress{background:#FFFFFF}
.wordmark,.waitlist-wordmark{color:var(--ink);font-optical-sizing:none;font-variation-settings:"opsz" 24}
h1,h2,.product-heading h3,.steps h3,.ingredient-accordion .panel-content>h3,#waitlist-title,#waitlist-success h2{font-weight:700;font-optical-sizing:none;font-variation-settings:"opsz" 24;color:var(--ink)}
.italic,em,h1 .italic{font-optical-sizing:none;font-variation-settings:"opsz" 24}
.hero-art{background:radial-gradient(ellipse at 48% 38%,#F7FCFF 0%,#DDEFFB 56%,#C7E5F8 100%);min-height:620px}
.hero-art .hero-peppermint{width:100%;display:flex;justify-content:center;align-items:center;padding:42px 4% 72px}
.hero-peppermint>a{width:100%;max-width:610px;display:flex;flex-direction:column;align-items:center}
.hero-art .hero-peppermint img{width:92%;max-width:580px;height:auto;aspect-ratio:auto;position:static;object-fit:contain;border:0;border-radius:0;background:transparent;filter:drop-shadow(0 24px 20px #2D536D24);animation:peppermint-float 7s ease-in-out infinite}
.hero-peppermint span{margin:22px 0 0;color:var(--ink)}
.product{background:#FFFFFF;box-shadow:0 20px 50px #18252E08;border-color:var(--line)}
.product-image{width:100%;max-width:520px;margin:0 auto 28px;display:block;border-radius:0;background:transparent;filter:drop-shadow(0 15px 16px #2D536D1F)!important}
.button,.waitlist-cta,.bag{background:var(--ink);color:#FFFFFF;border-color:var(--ink)}
.button:hover,.waitlist-cta:hover,.bag:hover{background:var(--sky);color:var(--ink);border-color:var(--ink)}
.announcement,.ticker.night-stripe,.ritual{background:var(--sky);color:var(--ink)}
.hero .eyebrow,.hero .eyebrow .sun,.steps article>span,.steps h3,.steps p,.ritual h2,.ritual .eyebrow,.ritual h2 em{color:var(--ink)}
.facts span,.panel-tab,.science-index,.study-note summary,.footer-privacy{color:var(--ink)}
#waitlist-modal{background:#FFFFFF;border-color:#D6E2EB;border-top-color:var(--sky);box-shadow:0 30px 80px #18252E33}
#waitlist-modal::backdrop{background:#17232F80}
#waitlist-modal .first-order,#waitlist-success h2 em,#waitlist-modal .waitlist-description,#waitlist-modal .waitlist-fine{color:var(--muted)}
#waitlist-email{background:#F8FBFD;color:var(--ink);border-color:#8A9DAA}
.success-mark{background:#E2F2FD;color:var(--ink)}
footer{background:#F1F7FA}.footer-bottom{color:var(--muted)}
@keyframes peppermint-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@media(max-width:720px){.hero-art{min-height:0}.hero-art .hero-peppermint{padding:28px 5% 70px}.hero-art .hero-peppermint img{width:92%;max-width:440px}.hero-peppermint span{margin:18px 0 0}.product-image{margin-bottom:24px}}
@media(prefers-reduced-motion:reduce){.hero-art .hero-peppermint img{animation:none;transform:none}}

/* Clip only the transparent perimeter, retaining the full carton silhouette. */
.pack-cutout{display:block;width:100%;max-width:520px;margin:0 auto 28px;filter:drop-shadow(0 15px 16px #2D536D1F)}
.pack-cutout img{clip-path:polygon(9.4% 9.4%,10% 7.7%,11.7% 6.7%,86% 5.6%,89.7% 6.9%,90.6% 8.7%,90.6% 92.2%,15.7% 95.5%,9.4% 91%)}
.pack-cutout .product-image{margin:0;filter:none!important}
.hero-peppermint .pack-cutout{width:92%;max-width:580px;margin:0;filter:drop-shadow(0 24px 20px #2D536D24);animation:peppermint-float 7s ease-in-out infinite}
.hero-art .hero-peppermint .pack-cutout img{width:100%;max-width:none;filter:none;animation:none}
@media(max-width:720px){.hero-peppermint .pack-cutout{max-width:440px}}
@media(prefers-reduced-motion:reduce){.hero-peppermint .pack-cutout{animation:none;transform:none}}

/* Cloud-pack launch: a continuous sky wash and soft section waves. */
.hero-scene{position:relative;background:linear-gradient(105deg,#FDFCFA 0%,#FDFCFA 29%,#F1F7F8 48%,#DEEFF9 71%,#CBE7F8 100%);margin-bottom:45px}
.hero,.hero-copy,.hero-art{background:transparent}
.hero-peppermint>a{max-width:650px}
.hero-peppermint .pack-cutout{width:100%;max-width:620px}
.pack-cutout img{clip-path:none}
.ticker.night-stripe{position:relative;z-index:1;overflow:visible;padding:20px 0;background:var(--sky)}
.ticker.night-stripe::before,.ticker.night-stripe::after,.ritual::before,.ritual::after{content:"";position:absolute;left:0;right:0;display:block;height:46px;pointer-events:none;background-color:transparent;background-size:100% 100%;background-repeat:no-repeat}
.ticker.night-stripe::before,.ritual::before{top:-45px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%2393D2F6' d='M0 34C220 66 470 4 720 30S1220 62 1440 28V60H0z'/%3E%3C/svg%3E")}
.ticker.night-stripe::after,.ritual::after{bottom:-45px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%2393D2F6' d='M0 0H1440V26C1200 60 960 0 720 30S240 60 0 26Z'/%3E%3C/svg%3E")}
.ritual{margin:45px 0}
@media(max-width:720px){
 .hero-scene{background:linear-gradient(170deg,#FDFCFA 0%,#FDFCFA 33%,#F1F7F8 49%,#DEEFF9 73%,#CBE7F8 100%);margin-bottom:29px}
 .hero-art{padding-top:0;padding-bottom:74px}
 .hero-art .hero-peppermint{padding-top:0;padding-bottom:46px}
 .hero-peppermint .pack-cutout{width:100%;max-width:470px}
 .ticker.night-stripe{padding:18px 0}
 .ticker.night-stripe::before,.ticker.night-stripe::after,.ritual::before,.ritual::after{height:30px}
 .ticker.night-stripe::before,.ritual::before{top:-29px}
 .ticker.night-stripe::after,.ritual::after{bottom:-29px}
 .ritual{margin:29px 0}
}

/* Supplied cloud-over-y identity, with a small-icon cloud favicon. */
.wordmark{display:inline-flex;align-items:center;width:184px;flex-shrink:0;line-height:1}
.brand-logo{display:block;width:100%;height:auto;object-fit:contain}
.waitlist-wordmark{width:230px;max-width:75%;margin:0 auto 22px;line-height:1}
.hero h1 .italic{isolation:isolate}
footer{background:var(--ink);color:var(--cream);margin-top:45px}
footer::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23202A31' d='M0 30C240 0 480 60 720 30S1200 0 1440 34V60H0z'/%3E%3C/svg%3E")}
.footer-top p,.footer-top>a:last-child,.footer-privacy,.footer-bottom{color:var(--cream)}
.footer-bottom{border-top-color:#FFFFFF35}
footer :focus-visible{outline-color:var(--sky)}
@media(max-width:1000px){header .wordmark{width:150px}header nav{gap:22px}}
@media(max-width:720px){header .wordmark{width:156px}.waitlist-wordmark{width:212px;max-width:75%}footer{margin-top:29px}}

@media(max-width:720px){header nav{gap:12px;justify-content:space-between}}
@media(max-width:360px){header nav{gap:8px;font-size:11px}}

/* Straight marquee, quiet drifting sky behind the announcement copy. */
.ticker.night-stripe::before,.ticker.night-stripe::after{content:none;display:none}
.hero-scene{margin-bottom:0}
.announcement{position:relative;isolation:isolate;overflow:hidden}
.announcement::before,.announcement::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:url("sky-clouds-v01.svg");background-repeat:repeat-x;animation:announcement-sky 64s linear infinite;mask-image:linear-gradient(90deg,#000 0%,#000 20%,#0004 38%,#0004 62%,#000 80%,#000 100%)}
.announcement::before{background-size:960px 48px;background-position:0 center;opacity:.38}
.announcement::after{background-size:960px 32px;background-position:320px center;opacity:.16;animation-duration:94s;animation-delay:-31s}
.announcement .banner-message,.announcement .banner-cta{position:relative;z-index:1}
@keyframes announcement-sky{from{background-position-x:0}to{background-position-x:-960px}}
@media(max-width:720px){.announcement::before{opacity:.24;mask-image:none}.announcement::after{opacity:.1;mask-image:none}}
@media(prefers-reduced-motion:reduce){.announcement::before,.announcement::after{animation:none}}

/* Keep the announcement CTA available while the rest of the header scrolls. */
.announcement{position:sticky;top:0;z-index:40}
html{scroll-padding-top:72px}
@media(min-width:1000px){#shop>.section-intro{top:72px}}