:root { --ink:#171b18; --paper:#f5f4ee; --acid:#dff13a; --blue:#b9d5ff; --line:#d7d8d0; --muted:#6b706b; --ease:cubic-bezier(.22,1,.36,1); --soft-shadow:0 22px 60px rgba(23,27,24,.09); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial, Helvetica, sans-serif; overflow-x:hidden; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
body:before { content:""; position:fixed; inset:0; pointer-events:none; z-index:90; opacity:.028; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); }
.scroll-progress { position:fixed; z-index:120; top:0; left:0; width:100%; height:3px; pointer-events:none; }
.scroll-progress span { display:block; width:100%; height:100%; background:var(--acid); transform:scaleX(0); transform-origin:left; will-change:transform; }
.pointer-glow { position:fixed; z-index:40; width:460px; height:460px; border-radius:50%; pointer-events:none; opacity:0; background:radial-gradient(circle,rgba(223,241,58,.18),rgba(185,213,255,.09) 42%,transparent 70%); transform:translate3d(-50%,-50%,0); transition:opacity .35s; mix-blend-mode:multiply; }
.pointer-glow.is-active { opacity:1; }
main { position:relative; z-index:1; }
::selection { background:var(--acid); color:var(--ink); }
button,input { font:inherit; }
a { color:inherit; text-decoration:none; }
.shipping-bar { min-height:34px; display:flex; align-items:center; justify-content:center; gap:32px; background:var(--ink); color:#fff; font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; position:relative; overflow:hidden; }
.shipping-bar:after { content:""; position:absolute; inset:0; background:linear-gradient(100deg,transparent 20%,rgba(223,241,58,.13) 50%,transparent 80%); transform:translateX(-100%); animation:bar-shimmer 9s ease-in-out infinite; }
.shipping-bar span { color:var(--acid); }
.site-header { height:84px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(22px,5vw,78px); border-bottom:1px solid rgba(215,216,208,.8); background:rgba(245,244,238,.86); position:sticky; top:0; z-index:50; backdrop-filter:blur(18px) saturate(1.1); box-shadow:0 8px 30px rgba(23,27,24,.025); }
.brand { display:flex; align-items:center; gap:12px; font-weight:900; letter-spacing:-.06em; font-size:19px; }
.brand>span:last-child span { color:#9bb20d; }
.brand-mark { width:33px; height:33px; display:grid; place-items:center; background:var(--acid); color:var(--ink); border-radius:50% 50% 50% 10%; font-size:17px; transition:transform .45s var(--ease),border-radius .45s var(--ease); }
.brand:hover .brand-mark { transform:rotate(-8deg) scale(1.08); border-radius:50% 10% 50% 50%; }
.nav-links { display:flex; align-items:center; gap:36px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.nav-links a { position:relative; padding:8px 0; }
.nav-links a:after { content:""; position:absolute; left:0; bottom:2px; width:100%; height:1px; background:var(--ink); transform:scaleX(0); transform-origin:right; transition:transform .35s var(--ease); }
.nav-links a:hover:after { transform:scaleX(1); transform-origin:left; }
.header-actions { display:flex; align-items:center; gap:12px; }
.cart-button { border:0; background:transparent; text-transform:uppercase; font-size:12px; font-weight:700; display:flex; align-items:center; gap:8px; cursor:pointer; transition:transform .25s var(--ease); }
.cart-button:hover { transform:translateY(-2px); }
.cart-button b { display:grid; place-items:center; background:var(--ink); color:#fff; width:24px; height:24px; border-radius:50%; }
.menu-button { display:none; border:0; background:none; font-size:26px; cursor:pointer; }
.hero { min-height:670px; display:grid; grid-template-columns:1.03fr .97fr; border-bottom:1px solid var(--line); overflow:hidden; position:relative; background:radial-gradient(circle at 18% 35%,rgba(255,255,255,.96),transparent 45%),radial-gradient(circle at 48% 88%,rgba(185,213,255,.22),transparent 28%); }
.hero-content { padding:clamp(70px,8vw,120px) 5vw 62px max(22px,5vw); display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2; }
.eyebrow { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.18em; margin:0 0 22px; }
.hero h1 { display:flex; flex-direction:column; align-items:flex-start; gap:7px; font-size:clamp(52px,5.7vw,88px); line-height:.88; letter-spacing:-.078em; margin:0; max-width:900px; font-weight:950; }
.hero h1 .h1-product { display:flex; align-items:center; gap:18px; animation:hero-title-in .9s var(--ease) both; }
.hero h1 .h1-product:last-child { color:#91a20a; text-shadow:0 10px 35px rgba(158,174,16,.09); animation-delay:.12s; }
.hero h1 .h1-product b { width:46px; height:46px; flex:0 0 auto; display:grid; place-items:center; border-radius:50%; background:var(--ink); color:var(--acid); font-size:11px; letter-spacing:.08em; box-shadow:0 10px 28px rgba(23,27,24,.13); }
.hero h1 small { margin-left:64px; font-size:12px; line-height:1; letter-spacing:.18em; text-transform:uppercase; color:#777c77; }
.hero-copy { max-width:590px; margin:35px 0; font-size:17px; line-height:1.7; color:#5d625e; }
.hero-actions { display:flex; align-items:center; gap:28px; flex-wrap:wrap; }
.button { min-height:54px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; gap:34px; font-size:12px; text-transform:uppercase; letter-spacing:.08em; font-weight:800; transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s; }
.button span,.text-link span { transition:transform .35s var(--ease); }
.button:hover { transform:translateY(-3px); box-shadow:0 14px 30px rgba(23,27,24,.16); }
.button:hover span,.text-link:hover span { transform:translate(3px,-3px); }
.button.dark { background:var(--ink); color:#fff; }
.button.light { background:var(--acid); color:var(--ink); }
.text-link { font-size:12px; text-transform:uppercase; letter-spacing:.08em; font-weight:800; border-bottom:1px solid var(--ink); padding:10px 0; display:flex; gap:18px; transition:opacity .25s; }
.text-link:hover { opacity:.58; }
.scroll-cue { width:max-content; display:flex; align-items:center; gap:12px; margin-top:48px; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#727772; }
.scroll-cue span { width:28px; height:28px; border:1px solid #bcc0b8; border-radius:50%; position:relative; }
.scroll-cue span:after { content:""; position:absolute; width:4px; height:4px; border-radius:50%; background:var(--ink); left:11px; top:7px; animation:scroll-dot 1.8s var(--ease) infinite; }
.hero-visual { position:relative; min-height:600px; background:var(--acid); overflow:hidden; display:flex; align-items:flex-end; justify-content:center; }
.hero-visual:before { content:""; width:82%; height:82%; border-radius:50%; position:absolute; background:rgba(255,255,255,.3); top:9%; left:9%; }
.hero-visual:after { content:"I + F"; position:absolute; left:-3%; bottom:-9%; font-weight:950; font-size:clamp(150px,20vw,320px); letter-spacing:-.11em; color:rgba(23,27,24,.045); white-space:nowrap; }
.orbit { position:absolute; border:1px solid rgba(23,27,24,.22); border-radius:50%; will-change:transform; }
.orbit-one { width:640px; height:330px; transform:rotate(24deg); top:25%; animation:orbit-one-spin 22s linear infinite; }
.orbit-two { width:360px; height:660px; transform:rotate(-40deg); top:4%; animation:orbit-two-spin 28s linear infinite reverse; }
.molecule { position:absolute; z-index:1; width:20px; height:20px; border:2px solid rgba(23,27,24,.48); border-radius:50%; animation:molecule-drift 5s var(--ease) infinite alternate; }
.molecule:before,.molecule:after { content:""; position:absolute; height:1px; width:58px; top:8px; left:17px; background:rgba(23,27,24,.3); transform-origin:left; }
.molecule:after { transform:rotate(120deg); }
.molecule-one { left:11%; top:20%; }
.molecule-two { right:17%; top:37%; transform:scale(.72); animation-delay:-1.7s; }
.molecule-three { left:19%; bottom:18%; transform:scale(.55); animation-delay:-3.1s; }
.visual-chip { position:absolute; z-index:7; padding:10px 14px; border:1px solid rgba(23,27,24,.18); background:rgba(245,244,238,.82); backdrop-filter:blur(10px); box-shadow:0 12px 30px rgba(23,27,24,.09); font-size:9px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; animation:chip-float 4.8s var(--ease) infinite alternate; }
.chip-one { left:7%; bottom:20%; transform:rotate(-5deg); }
.chip-two { right:5%; bottom:31%; transform:rotate(4deg); animation-delay:-2.4s; }
.hero-bottle { position:absolute; bottom:-12px; width:205px; height:460px; border-radius:35px 35px 26px 26px; background:linear-gradient(90deg,#ecece6,#fff 45%,#dedfd9); box-shadow:0 35px 55px rgba(41,48,7,.22); }
.bottle-front { z-index:4; transform:translateX(-54px) rotate(-3deg); animation:float-front 7s var(--ease) infinite alternate; }
.bottle-back { height:400px; width:183px; z-index:2; transform:translateX(110px) rotate(11deg); filter:brightness(.96); animation:float-back 8.5s var(--ease) .4s infinite alternate; }
.cap { height:76px; width:82%; margin:-44px auto 0; background:repeating-linear-gradient(90deg,#f8f8f5 0 4px,#d3d5ce 4px 7px); border-radius:14px 14px 5px 5px; border:1px solid #caccc3; }
.label { position:absolute; top:118px; width:100%; height:210px; padding:32px 26px; background:var(--ink); color:#fff; display:flex; flex-direction:column; }
.bottle-back .label { background:#3a5367; }
.label small { font-size:9px; letter-spacing:.12em; color:var(--acid); }
.label strong { font-size:42px; letter-spacing:-.07em; margin-top:38px; }
.label span { color:var(--acid); font-weight:700; margin-top:8px; }
.quality-stamp { position:absolute; z-index:6; top:70px; right:50px; width:118px; height:118px; border-radius:50%; background:var(--ink); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; transform:rotate(8deg); animation:stamp-breathe 6s ease-in-out infinite; box-shadow:0 18px 35px rgba(23,27,24,.16); }
.quality-stamp b { color:var(--acid); font-size:30px; }
.quality-stamp span { font-size:9px; text-transform:uppercase; text-align:center; line-height:1.3; letter-spacing:.1em; }
.benefits { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--line); }
.benefits article { display:flex; gap:18px; padding:30px clamp(18px,3vw,44px); border-right:1px solid var(--line); min-height:120px; align-items:center; transition:background .35s var(--ease),transform .35s var(--ease); }
.benefits article:hover { background:rgba(223,241,58,.12); transform:translateY(-3px); }
.benefits article:last-child { border-right:0; }
.benefits article>span { width:35px; height:35px; border:1px solid #bbbdb5; border-radius:50%; display:grid; place-items:center; font-size:10px; flex:0 0 auto; }
.benefits b { font-size:13px; }
.benefits p { font-size:11px; color:#70746f; line-height:1.5; margin:6px 0 0; }
.ingredient-marquee { overflow:hidden; background:var(--ink); color:#fff; border-bottom:1px solid #2f342f; padding:18px 0; }
.marquee-track { display:flex; align-items:center; width:max-content; animation:marquee-flow 24s linear infinite; will-change:transform; }
.marquee-track span { font-size:clamp(27px,3.1vw,48px); line-height:1; font-weight:950; letter-spacing:-.055em; white-space:nowrap; }
.marquee-track span:nth-of-type(4n+1),.marquee-track span:nth-of-type(4n+2) { color:var(--acid); }
.marquee-track i { margin:0 25px; color:#7e857e; font-size:20px; font-style:normal; }
.ingredient-marquee:hover .marquee-track { animation-play-state:paused; }
.products-section { padding:100px 5vw 120px; position:relative; isolation:isolate; }
.products-section:before { content:""; position:absolute; z-index:-1; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle,rgba(185,213,255,.16),transparent 68%); top:8%; right:-210px; pointer-events:none; }
.products-section:after { content:"CATALOGUE"; position:absolute; z-index:-1; top:52px; left:49%; font-size:clamp(80px,12vw,210px); font-weight:950; letter-spacing:-.08em; color:rgba(23,27,24,.025); pointer-events:none; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:48px; }
.section-heading h2,.quality-copy h2,.dispatch h2,.faq h2 { font-size:clamp(42px,5vw,72px); line-height:.94; letter-spacing:-.065em; margin:0; font-weight:950; }
.section-heading>p { max-width:420px; color:#666b66; line-height:1.7; }
.filters { display:flex; gap:10px; border-bottom:1px solid var(--line); margin-bottom:38px; padding-bottom:14px; overflow:auto; }
.filters button { border:1px solid var(--line); background:rgba(255,255,255,.16); border-radius:100px; padding:10px 18px; font-size:11px; text-transform:uppercase; font-weight:800; white-space:nowrap; cursor:pointer; transition:background .3s,color .3s,border-color .3s,transform .3s var(--ease); }
.filters button:hover { transform:translateY(-2px); border-color:#aeb1a9; }
.filters button span { opacity:.55; margin-left:5px; }
.filters button.active { background:var(--ink); color:#fff; border-color:var(--ink); }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:48px clamp(18px,2vw,32px); }
.product-card { min-width:0; display:flex; flex-direction:column; position:relative; transition:transform .5s var(--ease); }
.product-card:hover { transform:translateY(-7px); }
.product-card.is-hidden { display:none; }
.product-image { --rx:0deg; --ry:0deg; --scale:1; aspect-ratio:1/.92; position:relative; overflow:hidden; display:flex; justify-content:center; align-items:center; margin-bottom:20px; border:1px solid rgba(23,27,24,.035); transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) scale(var(--scale)); transform-style:preserve-3d; transition:box-shadow .5s var(--ease),transform .22s ease-out,border-radius .5s var(--ease); will-change:transform; }
.product-card:hover .product-image { --scale:1.018; box-shadow:var(--soft-shadow); border-radius:2px; }
.product-image.lime { background:#e8edc0; }
.product-image.blue { background:#dce8ed; }
.product-image:before,.product-image:after { content:""; position:absolute; border:1px solid rgba(0,0,0,.1); width:75%; aspect-ratio:1; border-radius:50%; top:10%; }
.product-image:after { width:45%; top:30%; }
.photo-card img { width:82%; height:82%; object-fit:contain; position:relative; z-index:2; border-radius:3px; mix-blend-mode:multiply; filter:saturate(.96) contrast(1.03) drop-shadow(0 12px 16px rgba(23,27,24,.055)); transition:transform .65s var(--ease),filter .65s var(--ease); }
.photo-card.crop-right img { width:100%; height:100%; object-fit:cover; object-position:left center; }
.product-card:hover .photo-card img { transform:scale(1.055) rotate(-1deg); filter:saturate(1) contrast(1.04) drop-shadow(0 18px 18px rgba(23,27,24,.09)); }
.product-badge { position:absolute; top:16px; left:16px; background:#fff; padding:8px 10px; font-size:9px; font-weight:800; letter-spacing:.08em; z-index:4; box-shadow:0 8px 22px rgba(23,27,24,.07); transition:transform .35s var(--ease); }
.product-card:hover .product-badge { transform:translate(3px,3px); }
.dark-badge { background:var(--ink); color:#fff; }
.packshot { width:58%; min-height:46%; background:#fff; position:relative; z-index:2; overflow:hidden; box-shadow:0 20px 35px rgba(0,0,0,.15); padding:24px; display:flex; flex-direction:column; justify-content:center; transform:rotate(-3deg); border:1px solid rgba(0,0,0,.08); transition:transform .65s var(--ease),box-shadow .65s var(--ease); }
.packshot:before { content:""; position:absolute; z-index:0; inset:-70%; background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.72) 50%,transparent 58%); transform:translateX(-55%) rotate(8deg); animation:pack-glint 7s ease-in-out infinite; pointer-events:none; }
.packshot small,.packshot b,.packshot span { position:relative; z-index:1; }
.product-card:hover .packshot { transform:rotate(-1deg) translateY(-6px) scale(1.03); box-shadow:0 28px 45px rgba(0,0,0,.18); }
.packshot:after { content:""; position:absolute; width:90%; height:100%; background:#fff; border:1px solid rgba(0,0,0,.08); left:10%; top:-9%; z-index:-1; }
.packshot small { font-size:9px; text-transform:uppercase; letter-spacing:.12em; }
.packshot b { margin:18px 0 10px; font-size:clamp(18px,2.2vw,31px); line-height:.9; letter-spacing:-.06em; }
.packshot span { font-size:10px; text-transform:uppercase; font-weight:700; }
.pack-red { border-bottom:14px solid #e94a43; }
.pack-red b { color:#b32927; }
.pack-purple { border-bottom:14px solid #7565aa; }
.pack-purple b { color:#574c82; }
.pack-blue { border-bottom:14px solid #6b9db7; }
.pack-blue b { color:#355b71; }
.pack-gold { border-bottom:14px solid #c89c41; }
.pack-gold b { color:#73551d; }
.product-meta { display:flex; justify-content:space-between; gap:12px; text-transform:uppercase; color:#686e68; font-size:10px; line-height:1.45; letter-spacing:.09em; }
.product-card h3 { font-size:20px; line-height:1.2; letter-spacing:-.035em; margin:14px 0 8px; transition:color .25s; font-weight:850; }
.product-card:hover h3 { color:#596308; }
.vendor { color:var(--muted); font-size:12px; line-height:1.5; margin:0 0 20px; min-height:33px; }
.product-bottom { display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); padding-top:16px; margin-top:auto; }
.product-bottom strong { font-size:20px; font-weight:950; transition:transform .35s var(--ease),color .35s; transform-origin:left; }
.product-card.price-pop .product-bottom strong { transform:scale(1.13); color:#87970d; }
.product-bottom button { border:1px solid transparent; background:transparent; border-radius:100px; padding:6px 7px 6px 12px; text-transform:uppercase; font-size:10px; font-weight:800; cursor:pointer; transition:transform .25s var(--ease),background .25s,border-color .25s,color .25s; }
.product-bottom button:not(:disabled):hover { transform:translateX(3px); }
.product-bottom button span { margin-left:8px; display:inline-grid; place-items:center; width:25px; height:25px; border-radius:50%; background:var(--acid); transition:transform .35s var(--ease),background .3s; }
.product-bottom button:not(:disabled):hover span { transform:rotate(90deg) scale(1.08); background:#cfe229; }
.product-bottom button:not(:disabled):hover { background:#fff; border-color:#d5d7ce; }
.product-bottom button.is-added { background:var(--ink); border-color:var(--ink); color:#fff; transform:none; padding:10px 13px; }
.product-bottom button:disabled { color:#8c918c; cursor:not-allowed; }
.coming-soon { font-size:13px!important; text-transform:uppercase; letter-spacing:.05em; }
.source-link { margin-top:13px; color:#4f554f; font-size:11px; line-height:1.45; text-decoration:underline; text-underline-offset:3px; transition:color .25s,text-underline-offset .25s; }
.source-link:hover { color:#89960f; text-underline-offset:5px; }
.source-link.muted { color:#8b8f8b; text-decoration:none; }
.quality-section { display:grid; grid-template-columns:1fr 1fr; min-height:700px; background:var(--ink); color:#fff; }
.quality-art { background:#d7e8f0; position:relative; overflow:hidden; display:grid; place-items:center; color:var(--ink); }
.grid-lines { position:absolute; inset:0; opacity:.35; background-image:linear-gradient(#7b98a5 1px,transparent 1px),linear-gradient(90deg,#7b98a5 1px,transparent 1px); background-size:60px 60px; }
.certificate { width:min(65%,420px); aspect-ratio:.72; background:#f6f5ef; box-shadow:30px 35px 0 rgba(25,38,45,.15); padding:50px; display:flex; flex-direction:column; position:relative; z-index:2; transform:rotate(-4deg); transition:transform .7s var(--ease),box-shadow .7s var(--ease); }
.quality-art:hover .certificate { transform:rotate(-2deg) translateY(-8px); box-shadow:38px 44px 0 rgba(25,38,45,.13); }
.certificate:after { content:"✓"; position:absolute; right:38px; bottom:40px; width:66px; height:66px; border:2px solid #829313; color:#829313; border-radius:50%; display:grid; place-items:center; font-size:32px; }
.certificate span { font-size:12px; letter-spacing:.16em; font-weight:800; }
.certificate b { font-size:36px; letter-spacing:-.055em; margin-top:auto; font-weight:950; }
.certificate small { margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }
.floating-code { position:absolute; right:7%; top:9%; background:var(--acid); padding:12px 16px; font-size:10px; font-weight:800; transform:rotate(8deg); }
.quality-copy { padding:clamp(70px,8vw,120px); display:flex; flex-direction:column; justify-content:center; }
.quality-copy .eyebrow { color:var(--acid); }
.quality-copy>p:not(.eyebrow) { color:#b4b8b4; line-height:1.8; margin:30px 0; max-width:600px; }
.quality-copy ul { list-style:none; padding:0; margin:0 0 36px; }
.quality-copy li { padding:15px 0; border-bottom:1px solid #343a35; font-size:13px; }
.quality-copy li span { color:var(--acid); margin-right:12px; }
.quality-copy .button { align-self:flex-start; }
.dispatch { padding:110px 5vw; background:linear-gradient(135deg,#dff13a 0%,#e7f665 52%,#dff13a 100%); position:relative; overflow:hidden; }
.dispatch:after { content:"N//L"; position:absolute; right:-1vw; bottom:-5vw; font-weight:900; font-size:clamp(150px,25vw,390px); letter-spacing:-.12em; color:rgba(23,27,24,.035); pointer-events:none; }
.dispatch .eyebrow { margin-bottom:28px; }
.dispatch h2 { max-width:850px; }
.dispatch-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:75px; border-top:1px solid rgba(0,0,0,.25); }
.dispatch-stat { padding:28px 28px 0 0; display:flex; flex-direction:column; gap:12px; transition:transform .4s var(--ease); position:relative; z-index:1; }
.dispatch-stat:hover { transform:translateY(-6px); }
.dispatch-stat strong { font-size:clamp(38px,4vw,62px); letter-spacing:-.06em; font-weight:950; }
.dispatch-stat span { font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.faq { display:grid; grid-template-columns:.75fr 1.25fr; gap:9vw; padding:110px 5vw; }
.faq>div:first-child>p:last-child { color:#70746f; margin-top:28px; line-height:1.7; }
.accordions details { border-top:1px solid var(--line); padding:24px 0; transition:padding .35s var(--ease),background .35s; }
.accordions details:hover { padding-left:12px; padding-right:12px; background:rgba(255,255,255,.24); }
.accordions details:last-child { border-bottom:1px solid var(--line); }
.accordions summary { cursor:pointer; list-style:none; font-size:16px; font-weight:700; display:flex; justify-content:space-between; gap:20px; }
.accordions summary span { transition:transform .35s var(--ease); }
.accordions details[open] summary span { transform:rotate(45deg); }
.accordions summary::-webkit-details-marker { display:none; }
.accordions p { color:#686d68; font-size:13px; line-height:1.7; max-width:650px; }
.regulatory-note { display:grid; grid-template-columns:.35fr 1.65fr; gap:50px; padding:35px 5vw; background:#ebe9df; border-top:1px solid var(--line); }
.regulatory-note strong { font-size:11px; text-transform:uppercase; letter-spacing:.12em; }
.regulatory-note p { margin:0; color:#5f645f; font-size:12px; line-height:1.7; max-width:900px; }
footer { background:#111411; color:#fff; padding:75px 5vw 25px; }
.brand.inverse .brand-mark { color:var(--ink); }
.footer-main { display:grid; grid-template-columns:1.6fr .7fr .7fr 1.2fr; gap:7vw; }
.footer-main>div { display:flex; flex-direction:column; gap:14px; }
.footer-main p { color:#919691; font-size:13px; line-height:1.7; }
.footer-main b { font-size:11px; text-transform:uppercase; letter-spacing:.1em; margin-bottom:10px; }
.footer-main a:not(.brand) { color:#bbbeba; font-size:12px; }
.newsletter form { display:flex; border-bottom:1px solid #555a55; }
.newsletter input { flex:1; background:transparent; color:#fff; border:0; padding:14px 0; outline:none; min-width:0; }
.newsletter button { width:42px; border:0; background:var(--acid); cursor:pointer; transition:transform .3s var(--ease),background .3s; }
.newsletter button:hover { transform:translate(3px,-3px); background:#ecfb67; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; border-top:1px solid #313631; margin-top:70px; padding-top:22px; color:#797e79; font-size:10px; text-transform:uppercase; letter-spacing:.07em; }
.agency-credit { text-align:center; }
.agency-credit a { color:var(--acid); font-weight:800; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; transition:color .25s,text-underline-offset .25s; }
.agency-credit a:hover { color:#fff; text-underline-offset:6px; }
.toast { position:fixed; z-index:100; right:22px; bottom:22px; max-width:min(360px,calc(100vw - 32px)); background:var(--ink); color:#fff; padding:15px 18px; font-size:11px; line-height:1.45; text-transform:uppercase; letter-spacing:.07em; transform:translateY(120px); opacity:0; transition:.25s; box-shadow:0 18px 45px rgba(23,27,24,.22); }
.toast.show { transform:translateY(0); opacity:1; }
.cart-button.cart-pulse b { animation:cart-pulse .45s var(--ease); }

.reveal { opacity:0; transform:translateY(28px); filter:blur(4px); transition:opacity .85s var(--ease),transform .85s var(--ease),filter .85s var(--ease); }
.reveal.is-visible { opacity:1; transform:none; filter:none; }
.product-card.reveal.is-visible:hover { transform:translateY(-7px); }
.benefits article.reveal.is-visible:hover { transform:translateY(-3px); }
.dispatch-stat.reveal.is-visible:hover { transform:translateY(-6px); }
.product-card.reveal:nth-child(3n+2) { transition-delay:.07s; }
.product-card.reveal:nth-child(3n+3) { transition-delay:.14s; }

@keyframes bar-shimmer { 0%,68% { transform:translateX(-100%); } 88%,100% { transform:translateX(100%); } }
@keyframes float-front { from { transform:translateX(-54px) translateY(0) rotate(-3deg); } to { transform:translateX(-54px) translateY(-10px) rotate(-2deg); } }
@keyframes float-back { from { transform:translateX(110px) translateY(0) rotate(11deg); } to { transform:translateX(110px) translateY(-8px) rotate(9.5deg); } }
@keyframes stamp-breathe { 0%,100% { transform:rotate(8deg) scale(1); } 50% { transform:rotate(5deg) scale(1.035); } }
@keyframes cart-pulse { 50% { transform:scale(1.25); background:var(--acid); color:var(--ink); } }
@keyframes hero-title-in { from { opacity:0; transform:translateY(32px) skewY(2deg); } to { opacity:1; transform:none; } }
@keyframes scroll-dot { 0% { transform:translateY(0); opacity:0; } 30% { opacity:1; } 80%,100% { transform:translateY(10px); opacity:0; } }
@keyframes orbit-one-spin { to { transform:rotate(384deg); } }
@keyframes orbit-two-spin { to { transform:rotate(320deg); } }
@keyframes molecule-drift { to { translate:10px -14px; rotate:16deg; } }
@keyframes chip-float { to { translate:0 -10px; } }
@keyframes marquee-flow { to { transform:translateX(-50%); } }
@keyframes pack-glint { 0%,65% { transform:translateX(-55%) rotate(8deg); } 88%,100% { transform:translateX(55%) rotate(8deg); } }

@media (max-width:900px) {
  .site-header { height:72px; }
  .menu-button { display:block; }
  .nav-links { display:none; position:absolute; top:72px; left:0; right:0; background:var(--paper); flex-direction:column; padding:36px; border-bottom:1px solid var(--line); align-items:flex-start; }
  .nav-links.open { display:flex; }
  .hero { grid-template-columns:1fr; }
  .hero-content { min-height:610px; }
  .hero-visual { min-height:570px; }
  .pointer-glow { display:none; }
  .benefits { grid-template-columns:1fr 1fr; }
  .benefits article:nth-child(2) { border-right:0; }
  .benefits article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .product-grid { grid-template-columns:repeat(2,1fr); }
  .quality-section { grid-template-columns:1fr; }
  .quality-art { min-height:650px; }
  .faq { grid-template-columns:1fr; }
  .footer-main { grid-template-columns:1.3fr 1fr 1fr; }
  .newsletter { grid-column:1/-1; margin-top:25px; }
}
@media (max-width:600px) {
  .shipping-bar { min-height:38px; font-size:9px; line-height:1.35; gap:10px; text-align:center; padding:8px 12px; }
  .site-header { padding-left:16px; padding-right:14px; }
  .brand { font-size:17px; gap:9px; }
  .brand-mark { width:30px; height:30px; }
  .header-actions { gap:7px; }
  .cart-button { padding:7px 8px; border-radius:100px; background:rgba(255,255,255,.72); }
  .cart-button b { width:25px; height:25px; }
  .menu-button { width:38px; height:38px; padding:0; display:grid; place-items:center; }
  .hero-content { min-height:590px; padding-top:75px; padding-bottom:44px; }
  .hero h1 { gap:6px; font-size:clamp(31px,9.8vw,38px); line-height:.92; }
  .hero h1 .h1-product { gap:11px; }
  .hero h1 .h1-product b { width:36px; height:36px; font-size:9px; }
  .hero h1 small { margin-left:47px; font-size:9px; }
  .hero-copy { font-size:15px; }
  .hero-actions { align-items:flex-start; flex-direction:column; }
  .scroll-cue { margin-top:34px; }
  .hero-visual { min-height:500px; }
  .hero-bottle { transform:translateX(-45px) rotate(-3deg); width:170px; height:390px; }
  .bottle-back { width:150px; height:350px; transform:translateX(90px) rotate(11deg); }
  .bottle-front,.bottle-back { animation:none; }
  .label { top:95px; height:180px; }
  .label strong { font-size:34px; }
  .quality-stamp { right:18px; top:40px; width:98px; height:98px; }
  .visual-chip { padding:8px 10px; font-size:8px; }
  .chip-one { left:4%; bottom:13%; }
  .chip-two { right:3%; bottom:25%; }
  .molecule-one { left:7%; top:19%; }
  .molecule-two { right:12%; top:42%; }
  .benefits { grid-template-columns:1fr; }
  .benefits article { border-right:0; border-bottom:1px solid var(--line); }
  .ingredient-marquee { padding:14px 0; }
  .marquee-track span { font-size:27px; }
  .marquee-track i { margin:0 18px; }
  .section-heading { align-items:flex-start; flex-direction:column; }
  .products-section { padding:72px 18px 82px; }
  .section-heading { gap:16px; margin-bottom:34px; }
  .section-heading>p { font-size:14px; line-height:1.65; }
  .filters { margin-bottom:28px; padding-bottom:12px; }
  .filters button { padding:10px 14px; font-size:10px; }
  .product-grid { grid-template-columns:1fr; gap:28px; }
  .product-card { padding-bottom:28px; border-bottom:1px solid var(--line); }
  .product-card:last-child { border-bottom:0; }
  .product-image { aspect-ratio:1.12; margin-bottom:16px; }
  .photo-card img { width:78%; height:78%; }
  .product-meta { font-size:10px; }
  .product-card h3 { font-size:19px; line-height:1.25; margin:11px 0 7px; }
  .vendor { font-size:12px; min-height:0; margin-bottom:16px; }
  .product-bottom { padding-top:13px; }
  .product-bottom strong { font-size:21px; }
  .product-bottom button { background:rgba(255,255,255,.7); border-color:#d7d8d0; }
  .product-bottom button span { width:29px; height:29px; }
  .source-link { font-size:11px; margin-top:11px; }
  .quality-art { min-height:520px; }
  .certificate { width:70%; padding:30px; }
  .certificate b { font-size:28px; }
  .quality-copy { padding:70px 24px; }
  .dispatch { padding-top:80px; padding-bottom:80px; }
  .dispatch-grid { grid-template-columns:1fr; margin-top:50px; }
  .dispatch-stat { border-top:1px solid rgba(0,0,0,.15); padding:24px 0; }
  .dispatch-stat span { font-size:12px; }
  .faq { padding:78px 20px; gap:52px; }
  .accordions details { padding:21px 0; }
  .accordions summary { font-size:15px; line-height:1.45; }
  .accordions p { font-size:14px; }
  .regulatory-note { grid-template-columns:1fr; gap:14px; padding:30px 20px; }
  .regulatory-note strong { font-size:12px; }
  .regulatory-note p { font-size:13px; }
  .footer-main { grid-template-columns:1fr 1fr; }
  .footer-main>div:first-child,.newsletter { grid-column:1/-1; }
  .footer-main p { font-size:14px; }
  .footer-main b { font-size:12px; }
  .footer-main a:not(.brand) { font-size:13px; }
  .footer-bottom { flex-direction:column; font-size:11px; line-height:1.5; }
  .agency-credit { text-align:left; }
  .toast { left:16px; right:16px; bottom:16px; max-width:none; text-align:center; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*:before,*:after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .reveal { opacity:1; transform:none; }
  .pointer-glow { display:none; }
}

@media (hover:none) {
  .product-image { --rx:0deg!important; --ry:0deg!important; --scale:1!important; }
  .ingredient-marquee:hover .marquee-track { animation-play-state:running; }
}