:root{--leaf:#1e4d2b;--deep:#10301b;--sun:#e9a93b;--cream:#fcf6e6;--kraft:#ebddbb;--chilli:#9e2a1f;--ink:#1d2a1f;--r:20px}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font:400 16px/1.6 Figtree,system-ui,sans-serif;color:var(--ink);background:var(--cream)}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3,.logo{font-family:'Cormorant Garamond',Georgia,serif;font-weight:700;line-height:1.05}
h1{font-size:clamp(2.7rem,6vw,5rem)}h2{font-size:clamp(2rem,4vw,3.3rem)}h3{font-size:1.45rem}
.wrap{width:min(1180px,92%);margin:auto}.muted{color:#5b6a5c;font-size:.95rem}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.6rem;border-radius:99px;background:var(--leaf);color:#fff;font-weight:600;transition:transform .2s,background .2s}
.btn:hover{background:var(--deep);transform:translateY(-2px)}.btn.sm{padding:.5rem 1.1rem;font-size:.9rem}
.btn.alt{background:transparent;color:var(--leaf);box-shadow:inset 0 0 0 2px var(--leaf)}.btn.alt:hover{background:var(--leaf);color:#fff}
.btn.sun{background:var(--sun);color:var(--deep)}.btn.sun:hover{background:#f2b955}.btn[disabled]{opacity:.5;pointer-events:none}
/* splash: logo flies into the header logo */
html{scrollbar-gutter:stable}html,body{overflow-x:clip}body.lock{overflow:hidden}
.splash-bg{position:fixed;inset:0;z-index:100;background:var(--cream);transition:opacity .8s}.splash-bg.out{opacity:0;pointer-events:none}
.splash-bg::before{content:"";position:absolute;left:50%;top:50%;width:min(80vw,520px);aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,#ffd98a,#f7c35f 40%,transparent 70%);animation:sunrise 1.5s ease-out both}
.splash-logo{position:fixed;z-index:101;left:50%;top:50%;width:min(56vw,320px);translate:-50% -50%;animation:rise 1s both;pointer-events:none}
html.nosplash .splash-bg,html.nosplash .splash-logo{display:none}html:not(.nosplash) body.splashing #hdr-logo{opacity:0}
@keyframes rise{from{opacity:0;transform:translateY(30px)}}@keyframes sunrise{from{transform:translateY(120px) scale(.4);opacity:0}}
/* header */
:root{--hh:76px}
.announce{background:var(--leaf);color:#f6ecd0;text-align:center;font-size:.85rem;line-height:1.2;padding:.45rem 1rem}
.head{position:sticky;top:0;z-index:40;height:var(--hh);background:rgba(252,246,230,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(30,77,43,.1)}
.head .wrap{position:relative;height:100%;display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"logo nav icons";align-items:center;gap:1rem}
.logo{grid-area:logo;justify-self:start;display:flex;align-items:center}.logo img{height:calc(var(--hh) - 14px);width:auto}
nav{grid-area:nav;display:flex;gap:2rem;font-weight:500}nav a{padding:.3rem 0;border-bottom:2px solid transparent}nav a:hover,nav a.on{border-color:var(--sun)}
.icons{grid-area:icons;justify-self:end;display:flex;gap:.25rem}.head .menu-btn{grid-area:menu;display:none}
.ib{position:relative;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;transition:background .2s}.ib:hover{background:rgba(30,77,43,.08)}.ib svg{width:22px;height:22px}
.ib b{position:absolute;top:2px;right:0;min-width:19px;height:19px;border-radius:99px;background:var(--chilli);color:#fff;font:600 .7rem/19px Figtree;text-align:center;padding:0 4px}.ib b[data-n="0"]{display:none}
/* hero: four pouches stacked, brought to the front one per scroll (see app.js) */
.hero{position:relative;z-index:3;height:calc(100svh - var(--hh));min-height:540px}
.hero-bg{position:absolute;inset:0;overflow:hidden;background:linear-gradient(180deg,#fff6dc,var(--cream))}
.hero-sun{position:absolute;z-index:0;left:50%;top:48%;height:112%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;pointer-events:none;background:radial-gradient(circle,#ffd98a,#f7c35f 38%,rgba(247,195,95,0) 70%);opacity:0;transform:scale(.5);transition:opacity 1.4s,transform 1.6s cubic-bezier(.2,.8,.2,1)}
.ready .hero-sun{opacity:.95;transform:none;animation:glow 9s 2s ease-in-out infinite alternate}@keyframes glow{to{transform:scale(1.06)}}
.hills{position:absolute;left:0;bottom:-1px;width:100%;height:130px;display:block}
.hero-grid{position:relative;height:100%;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:2rem;padding:1.5rem 0 2.4rem}
.hero h1{font-size:clamp(2.4rem,4.8vw,4.3rem);color:var(--deep);}.hero h1 .l{display:block;opacity:0;translate:0 28px;transition:opacity .8s,translate .9s cubic-bezier(.2,.8,.2,1)}
.ready .hero h1 .l{opacity:1;translate:0}.ready .hero h1 .l:nth-child(2){transition-delay:.12s}.ready .hero h1 .l:nth-child(3){transition-delay:.24s}
.lead{max-width:46ch;margin:1.2rem 0 1.8rem;font-size:1.1rem;opacity:0;transition:opacity .9s .5s}.cta{display:flex;gap:.8rem;flex-wrap:wrap;opacity:0;transition:opacity .9s .65s}.ready .lead,.ready .cta{opacity:1}
.stage{height:100%;min-height:0;display:flex;flex-direction:column;opacity:0;transition:opacity 1s .3s}.ready .stage{opacity:1}
.pile{position:relative;flex:1;min-height:0}
.pp{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;height:100%;width:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 22px 22px rgba(16,48,27,.2));transform-origin:50% 100%}
.pp:not(:first-child){display:none}.anim .pp:not(:first-child){display:block}
.caps{position:relative;flex:none;height:2.4rem}.cap{position:absolute;inset:0;display:grid;place-items:center;font:700 1.55rem 'Cormorant Garamond',serif;color:var(--deep);opacity:0;visibility:hidden}.cap:first-child{opacity:1;visibility:visible}.cap:hover{color:var(--leaf);text-decoration:underline}
/* sections */
section{position:relative}.pad{padding:5rem 0}.head-row{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:2.2rem;flex-wrap:wrap}
.steps{z-index:1;height:calc(100svh - var(--hh));min-height:540px;display:flex;align-items:center;background:var(--cream)}.steps .wrap{width:min(1180px,92%)}
.steps h2{text-align:center}.steps .sub{text-align:center;margin:.4rem 0 1.6rem}
.steps-stage{display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:1fr 1fr;gap:1.2rem 2.5rem;align-items:center}
.steps-pouch{grid-column:2;grid-row:1/3;height:min(46svh,420px);width:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 22px 22px rgba(16,48,27,.2))}
.step{background:#fff;border-radius:var(--r);padding:1.1rem 1.4rem;box-shadow:0 10px 30px rgba(30,77,43,.1);border-left:5px solid var(--sun)}
.step:nth-of-type(1){grid-area:1/1}.step:nth-of-type(2){grid-area:1/3}.step:nth-of-type(3){grid-area:2/1}.step:nth-of-type(4){grid-area:2/3}
.step b{font:700 1.8rem 'Cormorant Garamond';color:var(--sun);line-height:1}.step h3{font-size:1.3rem;margin:.1rem 0 .2rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.4rem}
.card{position:relative;display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;background:var(--tint);transition:transform .3s,box-shadow .3s}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(30,77,43,.14)}.card-img{display:grid;place-items:center;aspect-ratio:1;padding:1.4rem}.card-img img{transition:transform .5s cubic-bezier(.2,.8,.2,1)}.card:hover .card-img img{transform:translateY(-6px) rotate(-1.5deg)}
.card-body{padding:1rem 1.2rem 1.2rem;background:rgba(255,255,255,.62);flex:1;display:flex;flex-direction:column;gap:.2rem}.card-row{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:.8rem}.price{font-weight:600}
.wish{position:absolute;top:.8rem;right:.8rem;z-index:2;width:40px;height:40px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 4px 12px rgba(0,0,0,.1);transition:transform .2s}.wish:hover{transform:scale(1.1)}
.wish.on{color:var(--chilli)}.wish.on svg{fill:currentColor;animation:pop .35s}@keyframes pop{50%{transform:scale(1.35)}}
.story{background:var(--deep);color:#f6ecd0;overflow:hidden;padding:6rem 0}.story .sunb{position:absolute;left:50%;top:-30%;width:900px;aspect-ratio:1;translate:-50% 0;border-radius:50%;background:radial-gradient(circle,rgba(247,195,95,.5),transparent 65%)}
.story .wrap{position:relative;display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;align-items:center}.story p{max-width:56ch;margin-top:1.2rem}.pillars{display:grid;gap:1rem}
.pillars div{border:1px solid rgba(246,236,208,.25);border-radius:var(--r);padding:1.1rem 1.4rem;font:600 1.5rem 'Cormorant Garamond'}.pillars span{display:block;font:400 .95rem Figtree;opacity:.8}
.founder{margin-top:1.6rem;color:var(--sun);font-weight:600}
/* product page */
.pdp{display:grid;grid-template-columns:1fr 1fr;gap:3rem;padding:3rem 0}.pdp-img{background:var(--tint);border-radius:28px;display:grid;place-items:center;padding:2rem;aspect-ratio:1}
.crumbs{padding-top:1.5rem;font-size:.9rem;color:#5b6a5c}.pdp h1{font-size:clamp(2.2rem,4vw,3.4rem)}.pdp .big{font:600 2rem Figtree;margin:1rem 0}
.pills{display:flex;gap:.6rem;margin:.6rem 0 1.4rem;flex-wrap:wrap}.pill input{position:absolute;opacity:0}.pill span{display:block;padding:.6rem 1.2rem;border-radius:99px;box-shadow:inset 0 0 0 2px rgba(30,77,43,.25);cursor:pointer;transition:.2s}
.pill input:checked+span{background:var(--leaf);color:#fff;box-shadow:none}.pill input:focus-visible+span{outline:3px solid var(--sun)}
.buy{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}.qty{display:inline-flex;align-items:center;border-radius:99px;box-shadow:inset 0 0 0 2px rgba(30,77,43,.25)}.qty button{width:40px;height:44px;font-size:1.2rem}.qty input,.qty span{width:34px;text-align:center;border:0;background:none;font:600 1rem Figtree}
.chips{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:2rem}.chip{padding:.45rem 1.1rem;border-radius:99px;box-shadow:inset 0 0 0 2px rgba(30,77,43,.25);font-weight:500}.chip.on,.chip:hover{background:var(--leaf);color:#fff;box-shadow:none}
/* drawer */
.veil{position:fixed;inset:0;background:rgba(16,48,27,.45);opacity:0;visibility:hidden;transition:.3s;z-index:59}.drawer-open .veil{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(430px,100%);background:var(--cream);z-index:60;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}.drawer-open .drawer{transform:none}
.drawer header{display:flex;justify-content:space-between;align-items:center;padding:1.2rem 1.4rem;border-bottom:1px solid rgba(30,77,43,.12)}.drawer h2{font-size:1.8rem}
.ship{padding:.9rem 1.4rem;background:#fff4d6;font-size:.9rem}.bar{height:6px;background:rgba(0,0,0,.08);border-radius:9px;margin-top:.45rem;overflow:hidden}.bar i{display:block;height:100%;width:0;background:var(--leaf);transition:width .5s}
.items{flex:1;overflow:auto;padding:1rem 1.4rem}.line{display:grid;grid-template-columns:70px 1fr auto;gap:.9rem;padding:.9rem 0;border-bottom:1px solid rgba(30,77,43,.1);align-items:center}
.thumb{background:var(--tint);border-radius:14px;padding:6px}.line .qty button{width:30px;height:32px}.line .qty{transform:scale(.92);transform-origin:left}.rm{font-size:.8rem;color:var(--chilli);text-decoration:underline}
.empty{text-align:center;padding:3rem 1rem}.empty p{margin:.5rem 0 1.2rem}
.foot-cart{padding:1.2rem 1.4rem;border-top:1px solid rgba(30,77,43,.12);display:grid;gap:.8rem}.tot{display:flex;justify-content:space-between;font-weight:600;font-size:1.1rem}.foot-cart .btn{width:100%}
/* checkout */
.co{display:grid;grid-template-columns:1.3fr 1fr;gap:3rem;padding:3rem 0 5rem;align-items:start}.fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.2rem 0 1.8rem}.fields .full{grid-column:1/-1}
label.f{display:grid;gap:.3rem;font-weight:500;font-size:.92rem}.f input,.f textarea{padding:.8rem 1rem;border-radius:12px;border:1.5px solid rgba(30,77,43,.25);background:#fff;font:inherit}.f input:focus,.f textarea:focus{border-color:var(--leaf);outline:3px solid rgba(233,169,59,.4)}
.pay{display:grid;gap:.6rem;margin-bottom:1.6rem}.pay label{display:flex;gap:.7rem;align-items:center;padding:.9rem 1.1rem;border-radius:14px;border:1.5px solid rgba(30,77,43,.25);cursor:pointer}.pay input:checked+span{font-weight:600}
.summary{background:#fff;border-radius:var(--r);padding:1.6rem;position:sticky;top:90px;box-shadow:0 10px 30px rgba(30,77,43,.08)}.summary .line{grid-template-columns:56px 1fr auto}.row{display:flex;justify-content:space-between;padding:.3rem 0}.err{color:var(--chilli);margin-bottom:.8rem;font-weight:500}
.ok{text-align:center;padding:5rem 0}.ok h1{margin:1rem 0}
footer{background:var(--deep);color:#e9dfc2;padding:4rem 0 2rem}.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}.fgrid h4{font:700 1.4rem 'Cormorant Garamond';color:var(--sun);margin-bottom:.6rem}.fgrid a{display:block;padding:.15rem 0;opacity:.85}.fgrid a:hover{opacity:1;color:var(--sun)}
.toast{position:fixed;left:50%;bottom:24px;translate:-50% 90px;background:var(--deep);color:#fff;padding:.8rem 1.4rem;border-radius:99px;z-index:80;opacity:0;transition:.4s cubic-bezier(.2,.8,.2,1)}.toast.show{translate:-50% 0;opacity:1}
.rv{opacity:0;translate:0 24px;transition:opacity .7s,translate .8s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;translate:0}
@media(max-width:900px){:root{--hh:64px}
nav{display:none;position:absolute;top:100%;left:-4.2%;right:-4.2%;flex-direction:column;gap:0;background:var(--cream);padding:.5rem 4.5% 1rem;box-shadow:0 14px 24px rgba(16,48,27,.12)}nav a{padding:.8rem 0;border-bottom:1px solid rgba(30,77,43,.1)}body.menu-open nav{display:flex}
.head .wrap{grid-template-columns:1fr auto 1fr;grid-template-areas:"menu logo icons"}.head .menu-btn{display:grid;justify-self:start}.logo{justify-self:center}.logo img{height:50px}
.hero-grid{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:.4rem;align-content:start;padding:1.1rem 0 2rem}.hero h1{font-size:clamp(2rem,9.4vw,3rem)}.hero h1 .l{display:inline}
.lead{font-size:.95rem;margin:.6rem 0 .9rem}.cta .btn{padding:.65rem 1.2rem;font-size:.92rem}.cap{font-size:1.25rem}.caps{height:2rem}.hills{height:90px}
.pad{padding:3.5rem 0}.story{padding:4rem 0}.story .wrap,.pdp,.co,.fgrid{grid-template-columns:1fr}.summary{position:static}.pdp{gap:1.5rem}
.steps h2{font-size:1.9rem}.steps .sub{display:none}.steps-stage{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:.7rem;margin-top:.8rem}
.steps-pouch{grid-area:1/1/2/3!important;height:min(27svh,230px);justify-self:center}.step{grid-area:auto!important;padding:.7rem .8rem}.step h3{font-size:1.05rem}.step p{font-size:.8rem;line-height:1.35}.step b{font-size:1.3rem}}
@media(max-width:600px){.grid{grid-template-columns:repeat(2,1fr);gap:.8rem}.card-img{padding:.8rem}.card-body{padding:.7rem .8rem .9rem}.card h3{font-size:1.15rem}.card .muted{font-size:.82rem}.card-row{flex-direction:column;align-items:stretch;gap:.5rem}.card-row .btn{width:100%}.fields{grid-template-columns:1fr}.head-row .btn{padding:.6rem 1.1rem}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.hero h1 .l,.lead,.cta,.stage,.rv,.hero-sun{opacity:1!important;translate:none!important;transform:none!important}.splash-bg,.splash-logo{display:none}}
.card h3{min-height:2.2em}.card .muted{min-height:2.9em}
.wish svg{width:22px;height:22px}
.grid.cols4{grid-template-columns:repeat(4,1fr)}
.banner{padding:0 0 5rem}.banner-link{display:block;border-radius:28px;overflow:hidden;box-shadow:0 18px 40px rgba(30,77,43,.14)}.banner-link img{width:100%;height:auto;transition:transform 1.4s cubic-bezier(.2,.8,.2,1)}.banner-link:hover img{transform:scale(1.03)}.banner-cap{display:none}
@media(max-width:900px){.grid.cols4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.banner{padding-bottom:3.5rem}.banner-link{border-radius:20px}.banner-cap{display:block;text-align:center;margin-top:1.3rem}.banner-cap h2{font-size:1.9rem}.banner-cap .btn{margin-top:1rem}}
@media(max-width:600px){.head-row{flex-wrap:nowrap;align-items:center}.head-row h2{font-size:1.8rem}}
[hidden]{display:none!important}
.eyebrow{font:600 .78rem Figtree;letter-spacing:.18em;text-transform:uppercase;color:var(--chilli);margin-bottom:.6rem}
/* pick your masala */
.picker{position:relative;overflow:hidden;padding:5.5rem 0;background-color:var(--tint,#f3ecd2);transition:background-color .9s}
.dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.picker-grid{position:relative;display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:2.5rem;align-items:center}
.tabs{display:grid;gap:.6rem;margin-top:1.6rem}
.tab{display:flex;align-items:center;gap:.8rem;padding:.5rem 1rem .5rem .5rem;border-radius:99px;background:rgba(255,255,255,.55);text-align:left;font-weight:600;box-shadow:inset 0 0 0 2px transparent;transition:background .25s,transform .25s,box-shadow .25s}
.tab img{width:44px;height:44px;object-fit:contain;border-radius:50%;background:#fff;padding:3px;flex:none}
.tab:hover{background:#fff;transform:translateX(4px)}.tab[aria-selected=true]{background:#fff;box-shadow:inset 0 0 0 2px var(--leaf)}
.picker-stage{display:grid;place-items:center;min-height:min(58vh,500px)}.float{animation:floaty 6s ease-in-out infinite}@keyframes floaty{50%{transform:translateY(-12px)}}
.picker-pouch{width:min(100%,470px);aspect-ratio:1;object-fit:contain;cursor:pointer;filter:drop-shadow(0 28px 28px rgba(16,48,27,.25))}
.picker-pouch.in{animation:pouchIn .8s cubic-bezier(.2,.9,.3,1.25) both}@keyframes pouchIn{from{opacity:0;transform:translateY(40px) rotate(-10deg) scale(.82)}}
.picker-info{background:rgba(255,255,255,.72);backdrop-filter:blur(6px);border-radius:24px;padding:1.8rem}.picker-info.swap{animation:fadeUp .6s both}@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}}
.picker-info h3{font-size:2rem;margin-bottom:.5rem}.pairs-l{margin-top:1rem;font-weight:600;font-size:.9rem}.pairs{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0 1.3rem}.pairs span{padding:.25rem .85rem;border-radius:99px;background:var(--cream);font-size:.85rem;font-weight:500}
.pk-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}.pk-btns{display:flex;gap:.5rem}
/* sprinkle the flavour */
.plate{position:relative;overflow:hidden;padding:5.5rem 0;background:#173d22;color:#f6ecd0}.plate .muted{color:rgba(246,236,208,.78)}.plate .eyebrow{color:var(--sun)}
.plate-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:3rem;align-items:center}
.pchips{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.5rem 0}.pchip{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:99px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1.5px rgba(246,236,208,.3);font-weight:500;transition:.2s}
.pchip i{width:14px;height:14px;border-radius:50%;background:var(--c)}.pchip:hover{background:rgba(255,255,255,.14)}.pchip[aria-pressed=true]{background:var(--sun);color:var(--deep);box-shadow:none}
.meter{display:flex;align-items:center;gap:1rem;margin-bottom:1.4rem}.meter-bar{flex:1;max-width:280px;height:10px;border-radius:9px;background:rgba(255,255,255,.14);overflow:hidden}.meter-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--sun),#f6c866);transition:width .3s}.meter span{font-weight:600;min-width:9.5em}
.plate-actions{display:flex;gap:.7rem;flex-wrap:wrap}.plate .btn.alt{color:#f6ecd0;box-shadow:inset 0 0 0 2px rgba(246,236,208,.5)}.plate .btn.alt:hover{background:rgba(246,236,208,.15)}#plate-add{animation:fadeUp .5s both}
.plate-stage{position:relative;width:min(100%,560px);aspect-ratio:1;margin:auto;touch-action:pan-y;cursor:crosshair;user-select:none;-webkit-user-select:none}.plate-stage canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.shaker{position:absolute;left:0;top:0;width:96px;pointer-events:none;opacity:0;transform-origin:50% 6%;transition:opacity .2s;z-index:3;filter:drop-shadow(0 10px 10px rgba(0,0,0,.35))}.plate-stage.on .shaker{opacity:1}
@media(max-width:900px){.picker,.plate{padding:3.8rem 0}.picker-grid,.plate-grid{grid-template-columns:1fr;gap:1.4rem}
.tabs{display:flex;overflow-x:auto;gap:.5rem;margin:1.1rem -4% 0;padding:.2rem 4%;scroll-snap-type:x proximity;scrollbar-width:none}.tab{flex:none;scroll-snap-align:start;padding-right:1rem}.tab:hover{transform:none}.tab img{width:36px;height:36px}
.picker-stage{min-height:0}.picker-pouch{width:min(78vw,340px)}.picker-info{padding:1.3rem}.picker-info h3{font-size:1.6rem}.pk-btns{width:100%}.pk-btns .btn{flex:1}.meter{flex-wrap:wrap}.shaker{width:76px}}
.picker-grid>*,.plate-grid>*{min-width:0}
/* accounts */
.ib.acct.in::after{content:"";position:absolute;top:9px;right:8px;width:9px;height:9px;border-radius:50%;background:var(--leaf);box-shadow:0 0 0 2px var(--cream)}
.f select{padding:.8rem 1rem;border-radius:12px;border:1.5px solid rgba(30,77,43,.25);background:#fff;font:inherit;max-width:100%}
.chk{display:flex;gap:.6rem;align-items:center;font-size:.92rem;cursor:pointer}.chk input{width:18px;height:18px;accent-color:var(--leaf)}
.auth{padding:3rem 0 5rem;display:grid;place-items:start center}.auth-card{width:min(440px,100%);background:#fff;border-radius:var(--r);padding:2rem;box-shadow:0 10px 30px rgba(30,77,43,.08)}
.auth-card h1{font-size:2.3rem;margin:1.2rem 0 .3rem}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--cream);border-radius:99px;padding:4px}
.auth-tabs a{text-align:center;padding:.55rem;border-radius:99px;font-weight:600;font-size:.92rem}.auth-tabs a[aria-selected=true]{background:var(--leaf);color:#fff}
.stack{display:grid;gap:1rem;margin-top:1.2rem}.auth-alt{margin-top:1.2rem;text-align:center}.auth .err,.acc .err{color:var(--chilli);margin-top:.8rem;font-weight:500}
.acc{padding:2.5rem 0 5rem}.acc-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap}.acc-head h1{font-size:clamp(2.2rem,4.5vw,3.4rem)}
.acc-tabs{display:flex;gap:.4rem;margin:1.4rem 0;border-bottom:1px solid rgba(30,77,43,.15);overflow-x:auto}
.acc-tabs a{padding:.7rem 1.2rem;font-weight:600;border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap}.acc-tabs a.on{border-color:var(--sun);color:var(--leaf)}
.notice{background:#e6f1dc;color:var(--deep);padding:.8rem 1.1rem;border-radius:12px;margin-bottom:1.2rem;font-weight:500}.notice.bad{background:#f8e0dc;color:var(--chilli)}
.order{background:#fff;border-radius:var(--r);margin-bottom:.8rem;box-shadow:0 6px 20px rgba(30,77,43,.06)}
.order summary{list-style:none;display:grid;grid-template-columns:1fr auto auto;gap:1rem;align-items:center;padding:1.1rem 1.4rem;cursor:pointer}.order summary::-webkit-details-marker{display:none}
.order summary div{display:grid}.order[open] summary{border-bottom:1px solid rgba(30,77,43,.1)}.order-body{padding:1rem 1.4rem 1.3rem}
.badge{display:inline-block;font:600 .74rem Figtree;padding:.25rem .7rem;border-radius:99px;background:#fff0c9;color:#7a5410;margin-left:.5rem;vertical-align:middle}
.order .badge{margin:0}.badge.s-paid,.badge.s-delivered{background:#dcefd0;color:#1e4d2b}.badge.s-cancelled{background:#f8e0dc;color:var(--chilli)}
.addr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;margin-bottom:1.6rem}
.addr{background:#fff;border-radius:var(--r);padding:1.2rem 1.3rem;box-shadow:0 6px 20px rgba(30,77,43,.06);display:flex;flex-direction:column;gap:.5rem}.addr.def{box-shadow:inset 0 0 0 2px var(--leaf)}
.addr h3{font-size:1.3rem}.addr p{font-size:.95rem}.addr-act{display:flex;gap:1rem;flex-wrap:wrap;margin-top:auto;font-size:.88rem;font-weight:600}.addr-act form{display:inline}.addr-act a,.addr-act button{color:var(--leaf);text-decoration:underline}.addr-act .rm{color:var(--chilli)}
.addr.add{place-items:center;justify-content:center;min-height:150px;border:2px dashed rgba(30,77,43,.3);background:transparent;box-shadow:none;font-weight:600;color:var(--leaf)}.addr.add:hover{background:#fff}
.panel{background:#fff;border-radius:var(--r);padding:1.6rem;box-shadow:0 10px 30px rgba(30,77,43,.08)}.panel h3{margin-bottom:.4rem}.panel .fields{margin:1rem 0 1.2rem}.fields.one{grid-template-columns:1fr}
.two{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;align-items:start}.btn-row{display:flex;gap:.8rem;margin-top:1.2rem;flex-wrap:wrap}
@media(max-width:900px){.two{grid-template-columns:1fr}.order summary{grid-template-columns:1fr auto}.order summary .badge{grid-row:2;justify-self:start}.head .icons .ib{width:40px}}
/* top offer bar */
.announce{position:relative;overflow:hidden;padding:0;background:linear-gradient(90deg,#17391f,var(--leaf) 30%,#2a6a3a 50%,var(--leaf) 70%,#17391f);color:#f6ecd0;font-size:.85rem;letter-spacing:.02em}
.announce::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(255,217,138,.28) 50%,transparent 60%);transform:translateX(-100%);animation:shine 6s 1.5s ease-in-out infinite}
@keyframes shine{60%,100%{transform:translateX(100%)}}
.marq{display:flex;width:max-content;animation:marq 38s linear infinite;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.announce:hover .marq{animation-play-state:paused}.marq-set{display:flex;align-items:center;flex:none;padding:.5rem 0}
.offer{white-space:nowrap;padding:0 1.6rem}.offer.hot{color:#ffd98a;font-weight:600}
.spark{flex:none;width:9px;height:9px;background:var(--sun);clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);animation:twinkle 2.4s ease-in-out infinite}
@keyframes marq{to{transform:translateX(-50%)}}@keyframes twinkle{50%{transform:scale(.55) rotate(45deg);opacity:.6}}
.head{transition:box-shadow .3s,background .3s}.head.scrolled{box-shadow:0 8px 24px rgba(16,48,27,.12);background:rgba(252,246,230,.97)}
@media(prefers-reduced-motion:reduce){.marq{animation:none!important;width:100%;justify-content:center;-webkit-mask-image:none;mask-image:none}.marq-set[aria-hidden]{display:none}.marq-set{flex-wrap:wrap;justify-content:center}.marq-set .offer:not(.hot),.marq-set .spark{display:none}.announce::after{display:none}.spark{animation:none!important}}
/* footer */
footer{position:relative;overflow:hidden;background:radial-gradient(900px 400px at 85% 0,rgba(233,169,59,.14),transparent 70%),var(--deep);color:#e9dfc2;padding:6.5rem 0 1.4rem;margin-top:0}
.ft-wave{position:absolute;top:-1px;left:0;width:100%;height:56px;display:block}
.ft-word{position:absolute;left:50%;bottom:-.22em;translate:-50% 0;font:700 clamp(7rem,24vw,22rem)/1 'Cormorant Garamond',serif;letter-spacing:.04em;color:transparent;-webkit-text-stroke:1.5px rgba(246,236,208,.07);pointer-events:none;user-select:none;white-space:nowrap}
footer .wrap{position:relative}
.ft-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding-bottom:2.4rem;margin-bottom:2.6rem;border-bottom:1px solid rgba(246,236,208,.14)}
.ft-trust div{display:grid;gap:.1rem;padding-left:1rem;border-left:3px solid var(--sun)}.ft-trust b{font:700 1.35rem 'Cormorant Garamond',serif;color:#fff}.ft-trust span{font-size:.85rem;opacity:.75}
.ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.4fr;gap:2.5rem}
.ft-brand p{max-width:34ch;margin-top:1.1rem;opacity:.85;font-size:.95rem}
.ft-logo{display:inline-block;background:var(--cream);padding:.7rem 1.1rem;border-radius:20px;box-shadow:0 12px 28px rgba(0,0,0,.25);transition:transform .4s cubic-bezier(.2,.8,.2,1)}.ft-logo:hover{transform:rotate(-2deg) scale(1.04)}.ft-logo img{width:112px;height:auto}
.ft-grid h4{font:700 1.45rem 'Cormorant Garamond',serif;color:var(--sun);margin-bottom:.8rem;position:relative;padding-bottom:.55rem}.ft-grid h4::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:2px;border-radius:2px;background:var(--sun);transition:width .4s}.ft-grid>div:hover h4::after{width:56px}
.ft-grid a{display:block;padding:.2rem 0;opacity:.85;transition:opacity .2s,color .2s,translate .25s}.ft-grid a:hover{opacity:1;color:var(--sun);translate:4px 0}
.ft-grid a.ft-line{display:flex;gap:.7rem;align-items:flex-start;padding:.35rem 0}.ft-line svg{flex:none;width:20px;height:20px;margin-top:.15rem;color:var(--sun)}.ft-grid a.ft-line:hover{translate:0}
.ft-bottom{display:flex;align-items:center;gap:1rem 1.6rem;flex-wrap:wrap;margin-top:3rem;padding-top:1.2rem;border-top:1px solid rgba(246,236,208,.14);font-size:.85rem;opacity:.9}.ft-bottom>span{opacity:.7}.ft-made{margin-left:auto}
.ft-top{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--sun);color:var(--deep);transition:transform .25s,background .25s}.ft-top:hover{transform:translateY(-4px);background:#f2b955}.ft-top svg{width:20px;height:20px}
@media(max-width:900px){.ft-trust{grid-template-columns:1fr 1fr}.ft-grid{grid-template-columns:1fr 1fr;gap:2rem 1.4rem}.ft-brand{grid-column:1/-1}.ft-made{margin-left:0}footer{padding-top:5rem}}
@media(max-width:480px){.ft-grid{grid-template-columns:1fr}.ft-trust b{font-size:1.15rem}.ft-bottom{padding-bottom:.4rem}.ft-top{margin-left:auto}.ft-made{display:none}}
.ft-grid a.ft-logo{display:inline-block;opacity:1;padding:.7rem 1.1rem}.ft-grid a.ft-logo:hover{translate:0;transform:rotate(-2deg) scale(1.04)}

@media(max-width: 600px) {
.head-row .btn {
        padding: .6rem 0.7rem
    }
}
.ft-grid .ft-social{display:flex;gap:.6rem;margin-top:1.2rem}.ft-grid .ft-social a{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:50%;background:rgba(246,236,208,.1);box-shadow:inset 0 0 0 1.5px rgba(246,236,208,.25);opacity:1;transition:background .25s,color .25s,transform .25s}.ft-social svg{width:21px;height:21px}
.ft-grid .ft-social a:hover{background:var(--sun);color:var(--deep);translate:0;transform:translateY(-4px) rotate(-6deg)}

/* small phones: keep the pouch stack big enough by trimming the text above it */
@media(max-width:900px){.hero-sun{height:125%}.cta{flex-wrap:nowrap;gap:.5rem}.cta .btn{white-space:nowrap}}
@media(max-width:900px) and (max-height:760px){.hero .lead{display:none}.hero h1{font-size:clamp(1.8rem,8.2vw,2.5rem)}.cta{margin-top:.8rem}.cta .btn{padding:.55rem .95rem;font-size:.86rem}.hero-grid{padding-top:.8rem}}