/* KURUNDU® — The Cinnamon Route
   Island & Alpine Distilling Co. */

/* ---------- Fonts (self-hosted Montserrat variable) ---------- */
@font-face{font-family:Montserrat;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/montserrat-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Montserrat;font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/montserrat-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  /* Brand guide */
  --forest:#0D2112; --botanical:#344420; --black:#000000; --cream:#F9F6E3;
  --gold:#C9A84B; --ochre:#8D6612;
  /* Tints */
  --agold:#9A863C;
  --forest-a:rgba(13,33,18,.82); --black-a:rgba(0,0,0,.82);
  --on-cream:rgba(13,33,18,.82);
  /* Map only (not brand colours) */
  --sea-deep:#0B2233; --sea:#163B52; --sea-shallow:#2E6478;
  --ribbon:0px; --header:74px;
  --blend:30vh;   /* height of the colour hand-over between chapters */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-stopped{overflow:clip}
body{background:var(--forest);color:var(--cream);font-family:Montserrat,system-ui,sans-serif;font-weight:400;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
body.locked{overflow:hidden;height:100vh}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--gold);color:var(--forest)}
.up{text-transform:uppercase;letter-spacing:.28em}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.42em;text-transform:uppercase;color:var(--gold)}
.h-xl{font-weight:700;text-transform:uppercase;letter-spacing:.12em;line-height:1.02}
.body{font-size:16px;line-height:1.85;font-weight:400;color:rgba(249,246,227,.86);max-width:520px}
.rule{height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);width:180px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Icons ---------- */
.ic{width:1em;height:1em;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.125em}

/* ---------- Accessibility ---------- */
.skip{position:fixed;left:16px;top:-60px;z-index:200;background:var(--gold);color:var(--forest);padding:12px 18px;border-radius:40px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;transition:top .3s}
.skip:focus{top:12px}
:focus{outline:none}
:focus-visible{outline:1px solid var(--gold);outline-offset:4px;border-radius:4px}
.btn-gold:focus-visible,.btn-ghost:focus-visible,.btn-stock:focus-visible,.g-btn:focus-visible,.sell:focus-visible,.botan button:focus-visible{border-radius:40px}
.on-cream :focus-visible{outline-color:var(--ochre)}
.trade .form :focus-visible{outline-color:var(--gold)}

/* ---------- Header ---------- */
.site-header{position:fixed;top:var(--ribbon);left:0;right:0;height:var(--header);z-index:40;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,4vw,48px);transition:background .5s,backdrop-filter .5s}
.site-header.solid{background:var(--black-a);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(201,168,75,.18)}
.progress{position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,var(--ochre),var(--gold),#E8CF7C);transform:scaleX(0);transform-origin:0 50%;will-change:transform;opacity:0;transition:opacity .5s}
.site-header.solid .progress{opacity:1}
body.ambient-off .botanicals,body.ambient-off #dust{opacity:0}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:46px;height:46px;animation:spin 40s linear infinite}
.brand .parent{font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--agold);line-height:1.5}
.brand .parent strong{display:block;color:var(--cream);font-weight:700;font-size:13px;letter-spacing:.32em}
.nav{display:flex;align-items:center;gap:34px}
.nav a{font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:500;position:relative}
.nav a:not(.btn-stock)::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--gold);transform:scaleX(0);transition:transform .4s}
.nav a:not(.btn-stock):hover::after,.nav a[aria-current="true"]::after{transform:scaleX(1)}
.btn-stock{border:1px solid var(--gold);color:var(--gold);padding:12px 20px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:600;border-radius:40px;position:relative;overflow:hidden;isolation:isolate;transition:color .4s;white-space:nowrap}
.btn-stock::before{content:"";position:absolute;inset:0;background:var(--gold);transform:translateY(101%);transition:transform .45s cubic-bezier(.7,0,.2,1);z-index:-1}
.btn-stock:hover{color:var(--forest)}
.btn-stock:hover::before{transform:none}
.menu-btn{display:none;width:40px;height:40px;border:1px solid rgba(201,168,75,.5);border-radius:50%;align-items:center;justify-content:center;position:relative;z-index:2;flex:none}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:16px;height:1px;background:var(--gold);transition:transform .4s cubic-bezier(.7,0,.2,1),opacity .3s}
.menu-btn span{position:relative}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0}
.menu-btn span::before{top:-5px}.menu-btn span::after{top:5px}
.menu-open .menu-btn span{background:transparent}
.menu-open .menu-btn span::before{transform:translateY(5px) rotate(45deg)}
.menu-open .menu-btn span::after{transform:translateY(-5px) rotate(-45deg)}
@media (max-width:900px){.nav a:not(.btn-stock){display:none}.menu-btn{display:flex}.nav{gap:12px}.btn-stock{padding:10px 14px;font-size:10px}.brand .parent{display:none}}
@media (max-width:360px){.btn-stock{padding:9px 11px;letter-spacing:.2em}}

/* ---------- Mobile menu ---------- */
.mmenu{position:fixed;inset:0;z-index:38;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(201,168,75,.10) 0%,rgba(201,168,75,0) 55%),var(--black);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:calc(var(--header) + 20px) 24px 40px;text-align:center;clip-path:circle(0% at calc(100% - 36px) 37px);visibility:hidden;transition:clip-path .8s cubic-bezier(.7,0,.2,1),visibility 0s .8s}
.menu-open .mmenu{clip-path:circle(150% at calc(100% - 36px) 37px);visibility:visible;transition:clip-path .8s cubic-bezier(.7,0,.2,1),visibility 0s}
.mmenu-rings{position:absolute;left:50%;top:50%;width:min(560px,130vw);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;opacity:.8}
.ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ring.spin,.ring.spin-r{will-change:transform}
.mmenu nav{position:relative;display:flex;flex-direction:column;gap:22px}
.mmenu nav a{font-size:20px;letter-spacing:.3em;text-transform:uppercase;font-weight:600;opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s,color .3s}
.mmenu nav a small{display:block;font-size:9px;letter-spacing:.4em;color:var(--agold);font-weight:500;margin-bottom:6px}
.mmenu nav a:hover{color:var(--gold)}
.menu-open .mmenu nav a{opacity:1;transform:none}
.menu-open .mmenu nav a:nth-child(1){transition-delay:.25s}.menu-open .mmenu nav a:nth-child(2){transition-delay:.32s}
.menu-open .mmenu nav a:nth-child(3){transition-delay:.39s}.menu-open .mmenu nav a:nth-child(4){transition-delay:.46s}
.mmenu .insta{position:relative;margin-top:34px;opacity:0;transition:opacity .5s .5s}
.menu-open .mmenu .insta{opacity:1}
@media (min-width:901px){.mmenu{display:none}}

/* ---------- Layers ---------- */
#dust{position:fixed;inset:0;z-index:5;pointer-events:none;opacity:.8;transition:opacity .8s}
.botanicals{position:fixed;inset:0;z-index:5;pointer-events:none;overflow:hidden;color:var(--gold);opacity:.55;transition:opacity .8s,color .8s}
body.on-light .botanicals{color:var(--ochre);opacity:.4}
.bot{position:absolute;left:0;top:0;will-change:transform}
main{position:relative;z-index:3}
.thread{position:absolute;left:0;top:0;width:60px;pointer-events:none;z-index:2;display:none;overflow:visible}
.thread .t-ghost{fill:none;stroke:rgba(201,168,75,.14);stroke-width:1;stroke-dasharray:2 6}
.thread .t-line{fill:none;stroke:var(--gold);stroke-width:1.2;stroke-linecap:round;opacity:.7}
.thread .t-node{fill:var(--black);stroke:var(--gold);stroke-width:1.2}
@media (min-width:1300px){.thread{display:block}}
body::after{content:"";position:fixed;inset:0;z-index:4;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .95 0 0 0 0 .8 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E")}


/* ---------- Chapter rail ---------- */
.rail{position:fixed;right:clamp(12px,2vw,28px);top:50%;transform:translateY(-50%);z-index:30;display:flex;flex-direction:column;gap:18px}
.rail a{display:flex;align-items:center;justify-content:flex-end;gap:12px;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:transparent;transition:color .4s}
.rail a i{width:9px;height:9px;border-radius:50%;border:1px solid var(--agold);transition:all .4s;flex:none}
.rail a:hover,.rail a:focus-visible,.rail a.active{color:var(--gold)}
.rail a.active i{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 4px rgba(201,168,75,.15)}
body.on-light .rail a i{border-color:var(--ochre)}
body.on-light .rail a:hover,body.on-light .rail a:focus-visible,body.on-light .rail a.active{color:var(--ochre)}
body.on-light .rail a.active i{background:var(--ochre);border-color:var(--ochre);box-shadow:0 0 0 4px rgba(141,102,18,.15)}
@media (max-width:760px){.rail{display:none}}

/* ---------- Age gate ---------- */
.gate{position:fixed;inset:0;z-index:80;background:radial-gradient(circle at 50% 42%,rgba(201,168,75,.13) 0%,rgba(201,168,75,0) 50%),var(--black);display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:24px;overflow-y:auto}
.gate.hidden{display:none}
.gate-rings{position:relative;width:min(320px,70vw);aspect-ratio:1;flex:none}
@media (max-height:640px){.gate-rings{width:min(200px,50vw)}}
.gate-rings svg{position:absolute;inset:0;width:100%;height:100%}
.gate-rings img{position:absolute;inset:14%;width:72%;height:72%;border-radius:50%;opacity:0;transform:scale(.8)}
/* gold-line emblem (K-WC 1.2 Change 15): drawn by CSS from the first paint, before any script has loaded.
   Each path has pathLength=1 and an index (--i); the groups turn that index into a stagger. .k-return = the short version. */
.gate-rings svg.gate-line{inset:14%;width:72%;height:72%;overflow:visible;pointer-events:none;--k:1}
.k-return .gate-line{--k:.5}
.gate-line g[class^="e-"] path{stroke-dasharray:1;stroke-dashoffset:1;animation:gl-draw calc(var(--d) * var(--k)) cubic-bezier(.45,0,.55,1) calc(var(--t) * var(--k)) forwards}
.gate-line .e-rim path{--t:calc(.2s + (var(--i) - 1) * .08s);--d:.5s}
.gate-line .e-rim path:first-child{--t:0s;--d:.55s}
.gate-line .e-top path{--t:calc(.4s + var(--i) * .05s);--d:.45s}
.gate-line .e-low path{--t:calc(.6s + var(--i) * .025s);--d:.4s}
.gate-line .e-core path{--t:calc(.75s + var(--i) * var(--cs));--d:.6s}
@keyframes gl-draw{to{stroke-dashoffset:0}}
.k-return .gl-tip{display:none}
.gate-line.hold{animation:gl-hold 1.8s ease-in-out infinite}
@keyframes gl-hold{0%,100%{filter:none}50%{filter:drop-shadow(0 0 6px rgba(201,168,75,.75)) brightness(1.35)}}
.k-return .gate .g-fade,.k-return .gate .denied,.k-return .gate .nojs{display:none}
@media (prefers-reduced-motion:reduce){.gate-line{display:none}.k-return .gate{display:none}}
.gate h2{margin-top:34px;font-size:13px;letter-spacing:.42em;font-weight:500;text-transform:uppercase;color:var(--gold)}
.gate p.q{margin-top:14px;font-size:clamp(20px,3vw,28px);letter-spacing:.2em;text-transform:uppercase;font-weight:600}
.gate .g-actions{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap;justify-content:center}
.gate .g-btn{min-width:170px;padding:15px 26px;border-radius:40px;font-size:11px;letter-spacing:.32em;text-transform:uppercase;font-weight:600;border:1px solid var(--gold);color:var(--gold);transition:all .35s}
.gate .g-btn.yes{background:var(--gold);color:var(--black)}
.gate .g-btn:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(201,168,75,.25)}
.gate small{margin-top:30px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--agold);max-width:460px;line-height:1.9}
.gate small a{text-decoration:underline;text-underline-offset:3px}
.gate small a:hover{color:var(--gold)}
.gate .denied{display:none;margin-top:24px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--cream)}
.gate.no .denied{display:block}.gate.no .g-dob{display:none}
/* date-of-birth check (K-WC 1.3 Change 19) */
.gate .g-dob{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap;justify-content:center;align-items:center}
.gate .g-dob select{min-width:150px;padding:14px 40px 14px 20px;border-radius:40px;border:1px solid rgba(201,168,75,.6);background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A84B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 16px center/14px;color:var(--cream);font:inherit;font-size:13px;letter-spacing:.14em;-webkit-appearance:none;appearance:none;outline:none}
.gate .g-dob select option{color:#000}
.gate .g-dob select:focus-visible{border-color:var(--gold);box-shadow:0 0 0 2px rgba(201,168,75,.35)}
.gate .g-dob .g-btn{min-width:150px}
.gate .g-hint{flex-basis:100%;min-height:1.2em;margin-top:4px;font-size:11px;letter-spacing:.14em;color:var(--gold)}
@media (max-width:420px){.gate .g-dob select,.gate .g-dob .g-btn{min-width:0;flex:1 1 40%}}
.gate .nojs{margin-top:24px;font-size:12px;letter-spacing:.14em;color:var(--cream)}
.g-fade{opacity:0;transform:translateY(14px)}

/* ---------- Sections ---------- */
section{position:relative}
.wrap{width:min(1200px,100% - 32px);margin:0 auto}

/* Hero */
.hero{min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding:calc(var(--ribbon) + var(--header) + 20px) 16px 80px;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,rgba(52,68,32,.55),transparent 60%)}
.hero-rings{position:absolute;left:50%;top:50%;width:min(900px,150vw);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none}
.spin{animation:spin 90s linear infinite;transform-origin:50% 50%}
.spin-r{animation:spin 140s linear infinite reverse;transform-origin:50% 50%}
@keyframes spin{to{transform:rotate(360deg)}}
.corner{position:absolute;width:clamp(150px,19vw,290px);aspect-ratio:1;pointer-events:none;z-index:1}
.corner img{position:absolute;left:50%;top:50%;width:92%;height:auto;transform:translate(-50%,-50%) rotate(-45deg);opacity:.82;filter:drop-shadow(0 0 22px rgba(201,168,75,.22))}
.corner.tr img,.corner.bl img{transform:translate(-50%,-50%) rotate(45deg)}
.corner.tl{left:clamp(4px,1.2vw,20px);top:calc(var(--ribbon) + var(--header) + 4px)}
.corner.tr{right:clamp(4px,1.2vw,20px);top:calc(var(--ribbon) + var(--header) + 4px)}
.corner.bl{left:clamp(4px,1.2vw,20px);bottom:clamp(4px,1.2vw,20px)}
.corner.br{right:clamp(4px,1.2vw,20px);bottom:clamp(4px,1.2vw,20px)}
.corner::after{content:"";position:absolute;inset:18%;border-radius:50%;background:radial-gradient(circle,rgba(201,168,75,.10),transparent 70%);animation:breathe 6s ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:.4;transform:scale(.9)}50%{opacity:1;transform:scale(1.08)}}
@media (max-width:700px){.corner{width:clamp(110px,30vw,150px)}.corner img{opacity:.6}}
.flourish{display:block;width:clamp(96px,9vw,128px);height:auto;margin:18px auto 0;filter:drop-shadow(0 0 14px rgba(201,168,75,.25))}
.hero-inner{position:relative;z-index:2}
.hero .emblem{width:92px;height:92px;margin:0 auto 26px;border-radius:50%;box-shadow:0 0 0 1px var(--gold),0 0 0 8px rgba(13,33,18,1),0 0 0 9px rgba(201,168,75,.5),0 0 60px rgba(201,168,75,.35)}
.wordmark{font-size:clamp(54px,12vw,170px);font-weight:700;letter-spacing:.06em;line-height:.9;color:var(--cream);text-shadow:0 0 60px rgba(201,168,75,.15)}
.wordmark sup{font-size:.18em;font-weight:500;vertical-align:top;position:relative;top:.6em;margin-left:.1em;color:var(--gold)}
.hero .sub{margin-top:22px;font-size:clamp(13px,1.8vw,20px);letter-spacing:.55em;font-weight:400;color:var(--gold);text-transform:uppercase}
.hero .story{margin:34px auto 0;max-width:560px;font-size:15px;line-height:1.9;color:rgba(249,246,227,.82)}
.hero .ctas{display:flex;gap:14px;justify-content:center;margin-top:38px;flex-wrap:wrap}
.btn-ghost{padding:14px 24px;border-radius:40px;border:1px solid rgba(249,246,227,.35);font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:500;transition:all .35s}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn-gold{padding:14px 26px;border-radius:40px;background:var(--gold);color:var(--forest);font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:700;transition:all .35s}
.btn-gold:hover{background:var(--cream)}
.btn-gold[disabled]{opacity:.6;pointer-events:none}
.scroll-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:.4em;text-transform:uppercase;color:var(--agold);display:flex;flex-direction:column;align-items:center;gap:10px;z-index:2}
.scroll-cue i{width:1px;height:44px;background:linear-gradient(var(--gold),transparent);animation:cue 2s ease-in-out infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.chars span{display:inline-block}
.split-line{overflow:hidden;display:block}

/* Cream surfaces */
.on-cream{position:relative;isolation:isolate}
.on-cream::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.35;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .42 0 0 0 0 .1 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E")}

/* Spice */
.spice{padding:50px 0 40px;color:var(--cream);   /* K-WC 1.3 Change 17: green, flowing into the black map. Gap above/below tightened (Rush, 5 Oct): was 30vh + 30px each side */
  background:radial-gradient(ellipse 55% 45% at 72% 50%,rgba(52,68,32,.55),rgba(52,68,32,0) 70%),
             linear-gradient(180deg,var(--forest) 0,var(--forest) 55%,var(--black) 100%)}
.spice .eyebrow{color:var(--gold)}
.spice h2{color:var(--cream)}
.spice .body{color:rgba(249,246,227,.82)}
.spice .rule{background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.spice .draw{stroke:var(--gold)}
.spice .quill-art text{fill:var(--agold)}
.spice .grid{display:grid;grid-template-columns:1.05fr 1fr;gap:60px;align-items:center}
.spice h2{font-size:clamp(38px,6vw,76px);margin:18px 0 26px}
.spice .quill-art{position:relative;aspect-ratio:1;max-width:520px;width:100%;margin-left:auto}
.spice .quill-art svg{width:100%;height:100%;overflow:visible}
.spice .quill-glow{position:absolute;left:12%;right:12%;top:26%;bottom:22%;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,rgba(201,168,75,.15),rgba(201,168,75,0) 68%)}
.spice .quill-photo{position:absolute;left:14%;width:72%;top:37%;display:block;filter:drop-shadow(0 14px 12px rgba(4,12,6,.55)) drop-shadow(0 3px 3px rgba(4,12,6,.5))}
.spice .quill-photo img{display:block;width:100%;height:auto}
.draw{fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.facts{display:flex;gap:40px;margin-top:40px;flex-wrap:wrap}
.facts div{border-top:1px solid rgba(141,102,18,.45);padding-top:14px;min-width:120px}
.facts b{display:block;font-size:26px;font-weight:700;letter-spacing:.1em;color:var(--ochre)}
.facts span{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--on-cream)}
@media (max-width:860px){.spice{padding:36px 0 24px}.spice .grid{grid-template-columns:1fr;gap:28px}.spice .quill-art{margin:0 auto;max-width:360px}}

/* Route map */
.route{position:relative;height:100vh;min-height:560px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-start;background:#060f09}   /* K-WC 1.3 Change 18: near-black forest sea */
.route-head{position:relative;z-index:3}
.route-head{text-align:center;padding-top:calc(var(--ribbon) + var(--header) + 14px)}
.route-head h2{font-size:clamp(26px,4vw,48px);margin-top:12px}
.map-wrap{position:absolute;inset:0;z-index:1}
.map-stage{position:absolute;inset:0;overflow:hidden}
.map-stage>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
/* edges fade to black so the map has no hard frame; heavier under the title and the captions */
.map-fade{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,#000 0,rgba(0,0,0,.85) calc(var(--header) + 70px),rgba(0,0,0,0) 34%,rgba(0,0,0,0) 72%,rgba(0,0,0,.9) 100%),
             linear-gradient(90deg,rgba(0,0,0,.85) 0,rgba(0,0,0,0) 12%,rgba(0,0,0,0) 88%,rgba(0,0,0,.85) 100%)}
@keyframes ripple{0%{opacity:0}33%{opacity:.9}66%{opacity:0}100%{opacity:0}}
.map-grid{fill:none;stroke:rgba(249,246,227,.09);stroke-width:1}
.map-line{fill:none;stroke:rgba(201,168,75,.45);stroke-width:1;stroke-dasharray:10 5}
.map-line.dotted{stroke-dasharray:2 5}
.map-label{fill:rgba(249,246,227,.82);font-family:Montserrat,system-ui,sans-serif;font-size:calc(12px * var(--mz,1));letter-spacing:4px;text-transform:uppercase;font-weight:600;paint-order:stroke;stroke:rgba(0,0,0,.6);stroke-width:3px;stroke-linejoin:round}
.map-label.big{fill:var(--cream);font-size:calc(19px * var(--mz,1));font-weight:700;letter-spacing:6px;stroke-width:4px}
.map-label.land{fill:var(--cream);font-weight:700;letter-spacing:6px;font-size:calc(13px * var(--mz,1))}
.map-label.land.lg{font-size:calc(22px * var(--mz,1));letter-spacing:12px;fill:rgba(249,246,227,.9)}
.map-label.sea{fill:rgba(249,246,227,.55);font-style:italic;letter-spacing:7px;font-weight:500;stroke:rgba(0,0,0,.5)}
.map-label.sea.xl{font-size:calc(20px * var(--mz,1));letter-spacing:12px;fill:rgba(201,168,75,.4);stroke:none}
.map-label.sm{font-size:calc(10.5px * var(--mz,1));letter-spacing:4px}
.map-label.xs{font-size:calc(9px * var(--mz,1));letter-spacing:2.5px}
.map-label.line{font-size:calc(9px * var(--mz,1));letter-spacing:3px;fill:rgba(201,168,75,.9)}
.compass .c-ring{fill:none;stroke:#C9A84B;stroke-width:1}
.compass .c-ring.thin{stroke:#9A863C;stroke-width:.7;stroke-dasharray:2 3}
.compass>circle:first-child{fill:rgba(0,0,0,.28)}
.compass .c-major{fill:#000;stroke:#C9A84B;stroke-width:1}
.compass .c-minor{fill:#000;stroke:#9A863C;stroke-width:.8}
.compass .c-shade{fill:#C9A84B;opacity:.9}
.compass .c-dot{fill:var(--cream)}
.compass .c-n{fill:#C9A84B;font-weight:700;font-size:13px}
.scalebar path{stroke:var(--cream);stroke-width:1;fill:none}
.scalebar rect{fill:var(--cream)}
#routeGhost{fill:none;stroke:rgba(249,246,227,.3);stroke-width:1.5;stroke-dasharray:3 7}
#routeGlow{fill:none;stroke:#C9A84B;stroke-width:8;stroke-opacity:.22;stroke-linecap:round}
#routePath{fill:none;stroke:url(#routeGold);stroke-width:2.6;stroke-dasharray:7 6;stroke-linecap:round}
.pin-pulse{fill:#C9A84B}
.pin-dot{fill:var(--cream);stroke:#C9A84B;stroke-width:2}
.ship-art .hull{fill:#C9A84B;stroke:rgba(0,0,0,.5);stroke-width:.8}
.ship-art .mast{stroke:var(--cream);stroke-width:1.2}
.ship-art .sail{fill:var(--cream);stroke:rgba(0,0,0,.35);stroke-width:.5}
.ship-art .sail.s2{opacity:.85}
.ship-art .flag{fill:#C9A84B}
.ship-art .wake{fill:none;stroke:rgba(249,246,227,.75);stroke-width:1.1;stroke-linecap:round}
.ship-art .wake.w2{stroke-opacity:.5;stroke-dasharray:6 5;animation:wake 1.4s linear infinite}
@keyframes wake{to{stroke-dashoffset:22}}
.leader{fill:none;stroke:var(--cream);stroke-width:.8;stroke-dasharray:2 3}
.map-label.big.cant{font-size:calc(17px * var(--mz,1));letter-spacing:5px}
.captions{position:absolute;left:50%;bottom:clamp(14px,4vh,40px);transform:translateX(-50%);width:min(560px,90%);text-align:center;height:70px;z-index:2}
.captions::before{content:"";position:absolute;inset:-26px -60px;background:radial-gradient(closest-side,rgba(0,0,0,.82),rgba(0,0,0,0));z-index:-1}
.cap{position:absolute;inset:0;opacity:0}
.cap b{display:block;font-size:14px;letter-spacing:.4em;text-transform:uppercase;color:var(--gold);font-weight:600}
.cap span{display:block;margin-top:8px;font-size:14px;color:rgba(249,246,227,.8)}
.no-motion .cap{position:static;opacity:1;margin-bottom:14px}
.no-motion .captions{position:absolute;transform:translateX(-50%);height:auto;bottom:12px}
.no-motion .cap{display:none}.no-motion #cap3{display:block}
.no-motion #canterbury,.no-motion #lblCant{opacity:1}
.pulse{animation:pulse 2.4s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes pulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.6);opacity:0}}

/* Alps */
/* K-WC 1.3 Change 28 (Milford Sound): the photo is placed from the text (--alps-tb = the text's bottom edge, set by
   main.js): the peaks (about 15% down the photo) sit one bottle-height of clear sky (--gap, the bottle's size in the ring
   + margin) below the text, so the bottle can rise into that sky once the text has scrolled away (Change 23). The chapter
   is as tall as the photo, so the fiord water and boat are seen before the fade into the Gin chapter.
   --lw = layer width, --lh = its height, --lt = its top. */
.alps{--lw:116vw;--lx:.55;--lh:calc(var(--lw) * .5631);--gap:calc(min(285px, 49.6vw, 30vh) + 90px);
  --lt:calc(var(--alps-tb,58vh) + var(--gap) - var(--lh) * .15);
  height:max(110vh,calc(var(--lt) + var(--lh) * 1.04));overflow:hidden;background:radial-gradient(ellipse 60% 32% at 50% 64%,rgba(249,246,227,.2),rgba(249,246,227,0) 70%),linear-gradient(180deg,var(--black) 0%,var(--forest) 24%,var(--forest) 32%,var(--botanical) 72%,var(--forest) 100%)}
.alps::after{content:"";position:absolute;left:0;right:0;bottom:0;height:18%;z-index:6;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.3) 45%,var(--black));pointer-events:none}
.alps-text{position:absolute;left:0;right:0;top:15vh;text-align:center;z-index:6;padding:0 16px;text-shadow:0 2px 24px rgba(0,0,0,.55)}
.alps-text h2{font-size:clamp(32px,6.4vw,92px);margin:16px 0 22px}
.alps-text .body{margin:0 auto}
.moon{position:absolute;left:50%;top:8vh;width:min(460px,80vw);aspect-ratio:1;transform:translateX(-50%);z-index:1}
/* shifted so the centre peak (--lx across the photo) sits under the gold ring */
.layer{position:absolute;left:calc(50% - var(--lw) * var(--lx));width:var(--lw);top:var(--lt);z-index:2;will-change:transform}
.layer.l1{z-index:3}.layer.l2{z-index:4}.layer.l3{z-index:5}   /* the flying bottle starts at z 2: behind the far peaks, above the sky and ring */
.layer img{width:100%;height:auto;display:block}
.layer picture{display:block}
/* valley cloud (K-WC 1.2 Change 9): a soft strip that drifts sideways between the valley walls and the foreground */
.layer.lc{z-index:5;aspect-ratio:1980/1115;pointer-events:none;overflow:hidden}
.cloud-drift{position:absolute;left:0;top:4%;width:200%;display:flex;opacity:.85;animation:cloud-drift 160s linear infinite;animation-play-state:paused}
.cloud-drift img{width:50%;height:auto;flex:none}
.alps.in-view .cloud-drift{animation-play-state:running}
@keyframes cloud-drift{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.cloud-drift{animation:none}}
/* fiord water shimmer (Change 28): the finale's lake technique, masked to the water in the photo */
.alps-shimmer{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:.3;mix-blend-mode:screen;
  -webkit-mask:url(../img/alps/alps-water.webp) center/100% 100% no-repeat;mask:url(../img/alps/alps-water.webp) center/100% 100% no-repeat}
.alps-shimmer i{position:absolute;left:-5%;right:-5%;top:82%;height:18%;
  background:repeating-linear-gradient(180deg,rgba(249,236,200,0) 0,rgba(249,236,200,0) 5px,rgba(249,236,200,.13) 7px,rgba(249,236,200,0) 9px,rgba(249,236,200,0) 13px,rgba(249,236,200,.07) 15px,rgba(249,236,200,0) 17px,rgba(249,236,200,0) 23px);filter:blur(.7px);
  -webkit-mask:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);mask:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);
  animation:fin-shim 6s ease-in-out infinite alternate;animation-play-state:paused}
.alps.in-view .alps-shimmer i{animation-play-state:running}
@media (prefers-reduced-motion:reduce){.alps-shimmer i{animation:none}}
@media (min-width:701px) and (max-aspect-ratio:1/1){.alps{--lw:220vw;--lx:.6}}   /* portrait tablets: fill the taller screen (the boat just off the left edge, not cut in half) */
@media (max-width:700px){.alps{--lw:240vw;--lx:.58}.alps-text{top:14vh}}   /* phones: the peak in the middle, the fiord walls either side */

/* Bottle */
.gin{min-height:100vh;overflow:hidden;background:radial-gradient(ellipse 46% 58% at 50% 56%,rgba(141,102,18,.62) 0%,rgba(141,102,18,.2) 42%,rgba(141,102,18,0) 72%),radial-gradient(ellipse 30% 10% at 50% 86%,rgba(201,168,75,.16),transparent 70%),var(--black);display:flex;align-items:center}
.gin .stage{position:relative;width:min(1200px,100% - 32px);margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(30px,6vw,110px);align-items:center;padding:calc(var(--ribbon) + var(--header)) 0 60px}
.bottle-box{position:relative;width:clamp(210px,24vw,300px);aspect-ratio:300/640}
.bottle-stage{position:absolute;inset:0;z-index:3}
.bottle-box svg.bottle{position:relative;width:100%;height:100%;filter:drop-shadow(0 40px 50px rgba(0,0,0,.55));transition:opacity .8s}
.bottle-fly{position:fixed;inset:0;z-index:2;pointer-events:none}
.bottle-fly.front{z-index:7}
#bottle3d{position:absolute;inset:0;width:100%;height:100%;opacity:0}
.fly-glow{position:absolute;left:0;top:0;width:10px;height:10px;border-radius:50%;opacity:0;transform-origin:0 0;will-change:transform,opacity;
  background:radial-gradient(closest-side,rgba(249,246,227,.55),rgba(249,246,227,.18) 45%,rgba(201,168,75,.08) 70%,transparent)}
.bottle-stage.ready{cursor:grab;touch-action:pan-y}
.bottle-stage.grabbing{cursor:grabbing}
.bottle-stage.ready svg.bottle{visibility:hidden;pointer-events:none}
.bottle-ctrl{position:absolute;left:50%;bottom:-62px;transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:10px;white-space:nowrap}
.bottle-ctrl[hidden]{display:none}
.bottle-ctrl span{display:inline-flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold)}
.bottle-ctrl span .ic{font-size:16px}
.bottle-ctrl button{width:32px;height:32px;border-radius:50%;border:1px solid rgba(201,168,75,.5);display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:14px;transition:all .3s}
.bottle-ctrl button:hover{background:var(--gold);color:var(--black)}
@media (max-width:420px){.bottle-ctrl{gap:7px}.bottle-ctrl span{display:none}}
.b-rings{position:absolute;left:50%;top:58%;width:230%;aspect-ratio:1;transform:translate(-50%,-50%);z-index:1}
.b-orn{position:absolute;width:36%;height:auto;z-index:2;opacity:.7;top:34%;filter:drop-shadow(0 0 16px rgba(201,168,75,.25))}
.b-orn.l{left:-30%;transform:rotate(90deg)}
.b-orn.r{right:-30%;transform:rotate(90deg)}
.gin .col{position:relative;z-index:4}
.gin .col h2{font-size:clamp(28px,3.6vw,52px);margin:14px 0 22px}
.gin .col.r{text-align:left}
.notes-list{display:flex;flex-direction:column;gap:14px;margin-top:10px}
.note-chip{display:flex;align-items:center;gap:14px;font-size:12px;letter-spacing:.3em;text-transform:uppercase;font-weight:600}
.note-chip i{width:30px;height:30px;border-radius:50%;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;flex:none;color:var(--gold);font-size:15px}
.botan{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.botan button{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:30px;border:1px solid rgba(201,168,75,.5);font-size:10px;letter-spacing:.24em;text-transform:uppercase;transition:all .3s}
.botan button .ic{font-size:14px;color:var(--gold);transition:color .3s}
.botan button:hover,.botan button.on{background:var(--gold);color:var(--black)}
.botan button:hover .ic,.botan button.on .ic{color:var(--black)}
.botan-info{margin-top:16px;min-height:52px;font-size:14px;line-height:1.7;color:rgba(249,246,227,.82)}
.gift{margin-top:30px;display:inline-flex;align-items:center;gap:12px;padding:12px 18px;border:1px dashed rgba(201,168,75,.6);border-radius:12px;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.gift .ic{font-size:16px}
@media (max-width:900px){.bottle-box{margin-bottom:56px}.gin .stage{grid-template-columns:1fr;text-align:center;justify-items:center}.gin .col.r{text-align:center}.notes-list{align-items:center}.botan{justify-content:center}.b-orn{display:none}}

/* Serve cards */
.serve{padding:calc(var(--blend) * .65) 0 60px;background:radial-gradient(ellipse 50% var(--blend) at 50% 0,rgba(141,102,18,.28),rgba(141,102,18,0)),linear-gradient(180deg,var(--black) 0,rgba(0,0,0,.6) calc(var(--blend) * .35),rgba(0,0,0,0) var(--blend))}
.serve-head{text-align:center;margin-bottom:60px}
.serve-head h2{font-size:clamp(30px,4.6vw,60px);margin-top:14px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;perspective:1400px}
.serve,.spice{overflow-x:clip}   /* the cards' 3D entrance and the turning quill drawing never widen the page */
.card{position:relative;aspect-ratio:3/4.1;transform-style:preserve-3d;cursor:pointer}   /* no transform transition here: the flip turns .card-in, and GSAP moves .card on entry */
.card:focus-visible{outline-offset:6px;border-radius:200px 200px 16px 16px}
.card.flipped .card-in{transform:rotateY(180deg)}
.card-in{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,.8,.2,1)}
.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:200px 200px 16px 16px;border:1px solid rgba(201,168,75,.55);overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:30px 24px;text-align:center}
.face.front{background:radial-gradient(circle at 50% 36%,rgba(201,168,75,.22),transparent 55%),var(--black)}
.face.back{transform:rotateY(180deg);background:radial-gradient(ellipse at 50% 30%,rgba(141,102,18,.18),transparent 65%),var(--black);color:var(--cream);justify-content:center;border-color:rgba(201,168,75,.55)}   /* K-WC 1.3: black back */
.face.back::before{border-color:rgba(201,168,75,.3)}
.face::before{content:"";position:absolute;inset:10px;border-radius:190px 190px 10px 10px;border:1px solid rgba(201,168,75,.28);pointer-events:none}
.face svg.glass{width:46%;margin-bottom:auto;margin-top:16%}
/* K-WC 1.3 Change 24: photo card fronts. The photo fills the arch (its own vignette and black fade are baked in);
   the inner gold line and the title sit on top of it */
.face.front.has-photo{background:var(--black)}
.card-photo{position:absolute;inset:0;z-index:0;transform:translateZ(0)}   /* translateZ: no flicker in Safari on the flip */
.card-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.face.has-photo::before{z-index:2}
.face.has-photo > :not(.card-photo){position:relative;z-index:1;text-shadow:0 1px 12px rgba(0,0,0,.85)}
.face h3{font-size:15px;letter-spacing:.32em;text-transform:uppercase;font-weight:700}
.face p{font-size:12px;letter-spacing:.14em;margin-top:10px;color:var(--agold);text-transform:uppercase}
.face.back p{color:rgba(249,246,227,.82);text-transform:none;letter-spacing:.02em;font-size:14px;line-height:1.8}
.face.back h3{color:var(--gold)}
.flip-hint{margin-top:14px;font-size:9px;letter-spacing:.3em;color:var(--gold);text-transform:uppercase;display:inline-flex;align-items:center;gap:8px}
.flip-hint .ic{font-size:12px}
.face.back .flip-hint{color:var(--agold);margin-top:22px}
@media (max-width:860px){.cards{grid-template-columns:1fr;max-width:340px;margin:0 auto}}

/* Trade */
.trade{color:var(--forest);padding:calc(var(--blend) + 30px) 0 calc(var(--blend) + 30px);overflow:hidden;
  background:linear-gradient(180deg,var(--forest) 0,rgba(13,33,18,.55) calc(var(--blend) * .42),rgba(13,33,18,0) var(--blend)),
             linear-gradient(0deg,var(--forest) 0,rgba(13,33,18,.5) calc(var(--blend) * .5),rgba(13,33,18,0) var(--blend)),var(--cream)}
.trade .eyebrow{color:var(--ochre)}
.trade .grid{display:grid;grid-template-columns:1fr 1.05fr;gap:70px;align-items:start}
.trade h2{font-size:clamp(32px,4.8vw,64px);margin:16px 0 24px;color:var(--forest)}
.trade .body{color:var(--on-cream)}
.trade ul{list-style:none;margin-top:30px;display:flex;flex-direction:column;gap:16px}
.trade li{display:flex;gap:14px;font-size:14px;line-height:1.6;align-items:flex-start}
.trade li .li-ic{width:24px;height:24px;border-radius:50%;border:1px solid var(--ochre);flex:none;margin-top:-1px;display:flex;align-items:center;justify-content:center;color:var(--ochre);font-size:12px}
.sell{margin-top:32px;display:inline-flex;align-items:center;gap:12px;padding:14px 22px;border-radius:40px;border:1px solid var(--black);background:var(--black);color:var(--cream);font-size:11px;letter-spacing:.28em;text-transform:uppercase;font-weight:600;transition:all .3s}
.sell .ic{font-size:15px}
.sell:hover{background:var(--forest);border-color:var(--forest);color:var(--cream)}
.form{background:var(--black);color:var(--cream);border-radius:200px 200px 18px 18px;padding:90px clamp(20px,4vw,48px) 44px;position:relative;box-shadow:0 30px 60px rgba(0,0,0,.28)}
.form::before{content:"";position:absolute;inset:10px;border-radius:190px 190px 12px 12px;border:1px solid rgba(201,168,75,.35);pointer-events:none}
.form .ftitle{text-align:center;font-size:13px;letter-spacing:.4em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:26px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;position:relative}
.fgrid .full{grid-column:1/-1}
.field label{display:block;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--agold);margin-bottom:6px}
.field label .req{color:var(--gold);margin-left:2px}
.field input,.field select{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(201,168,75,.45);border-radius:0;color:var(--cream);padding:9px 0;font:inherit;font-size:16px;outline:none;-webkit-appearance:none;appearance:none}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A84B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 2px center;background-size:14px;padding-right:22px}
.field select option{color:#000}
.field input:focus,.field select:focus{border-color:var(--gold)}
.field input:focus-visible,.field select:focus-visible{outline:none;border-bottom-width:2px;margin-bottom:-1px}
.field.invalid input{border-color:#e39a7a}
.field .err{display:none;margin-top:6px;font-size:11px;color:#f0b49a;letter-spacing:.04em}
.field.invalid .err{display:block}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form .privacy{font-size:11px;color:var(--agold);margin-top:16px;line-height:1.6}
.form .privacy a{color:var(--gold);text-decoration:underline}
.form button[type=submit]{margin-top:22px;width:100%}
.form-done{display:none;text-align:center;padding:20px 0 10px;position:relative}
.form-done .ok{width:62px;height:62px;border-radius:50%;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:var(--gold);font-size:26px;box-shadow:0 0 0 6px var(--black),0 0 0 7px rgba(201,168,75,.4)}
.form-done h3{font-size:15px;letter-spacing:.32em;text-transform:uppercase;font-weight:700;color:var(--cream)}
.form-done p{margin-top:12px;font-size:14px;line-height:1.8;color:rgba(249,246,227,.82)}
.form.sent .fgrid,.form.sent .privacy,.form.sent button[type=submit]{display:none}
.form.sent .form-done{display:block}
@media (max-width:900px){.trade .grid{grid-template-columns:1fr}.fgrid{grid-template-columns:1fr}}

/* Finale: KURUNDU horizon */
.finale{--iw:100vw;--ih:calc(var(--iw) * .6);--fs:15.6vw;position:relative;height:100vh;min-height:560px;overflow:hidden;
  background:radial-gradient(ellipse 75% 26% at 50% 50%,rgba(201,168,75,.34),rgba(141,102,18,.12) 55%,rgba(141,102,18,0) 78%),
             linear-gradient(180deg,var(--forest) 0%,var(--forest) 18%,var(--botanical) 48%,var(--forest) 64%,var(--black) 100%)}
.fin-layers{position:absolute;inset:0}
.fin-layer{position:absolute;left:50%;bottom:0;width:var(--iw);transform:translateX(-50%);will-change:transform}
.fin-layer img{display:block;width:100%;height:auto}
.fin-layer picture{display:block}
/* Lake Tekapo at first light (K-WC 1.2 Change 11): lake and shore are separate so only the water shimmers */
.fin-near{position:absolute}
.fin-near > picture:last-child{position:absolute;left:0;top:0;width:100%}
.fin-shimmer{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:.32;mix-blend-mode:screen;
  -webkit-mask:url(../img/finale/finale-lake-1200.webp) center/100% 100% no-repeat;mask:url(../img/finale/finale-lake-1200.webp) center/100% 100% no-repeat}
.fin-shimmer i{position:absolute;left:-5%;right:-5%;top:58%;height:50%;
  background:repeating-linear-gradient(180deg,rgba(249,236,200,0) 0,rgba(249,236,200,0) 6px,rgba(249,236,200,.12) 8px,rgba(249,236,200,0) 11px,rgba(249,236,200,0) 15px,rgba(249,236,200,.07) 17px,rgba(249,236,200,0) 19px,rgba(249,236,200,0) 27px);filter:blur(.8px);
  -webkit-mask:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);mask:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);
  animation:fin-shim 7s ease-in-out infinite alternate;animation-play-state:paused}
.finale.in-view .fin-shimmer i{animation-play-state:running}
@keyframes fin-shim{0%{transform:translate3d(0,0,0) scaleY(1)}100%{transform:translate3d(-2%,12px,0) scaleY(1.06)}}
@media (prefers-reduced-motion:reduce){.fin-shimmer i{animation:none}}
.fin-far{z-index:1}.fin-mid{z-index:2}.fin-word{z-index:3}.fin-near{z-index:4}
.fin-word{width:100vw;bottom:calc(var(--ih) * .395 - var(--fs) * .06);text-align:center}   /* letters stand on the far shore; the lake covers their feet */
.fin-title{font-size:var(--fs);font-weight:700;letter-spacing:.035em;line-height:.8;color:var(--cream);white-space:nowrap;
  text-shadow:0 0 60px rgba(201,168,75,.25),0 2px 30px rgba(0,0,0,.25);padding-left:.035em}
.fin-title.sweep{background:linear-gradient(100deg,var(--cream) 0%,var(--cream) 45%,#FFF3C4 48.5%,#E7C978 50%,#FFF3C4 51.5%,var(--cream) 55%,var(--cream) 100%) 100% 0/300% 100% no-repeat;   /* 300% wide: covers the word at every position; the highlight crosses it once */
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:fin-sweep 2.4s cubic-bezier(.45,.05,.35,1) .2s 1 both}
@keyframes fin-sweep{to{background-position:0% 0}}
@media (prefers-reduced-motion:reduce){.fin-title.sweep{animation:none;color:var(--cream);background:none}}
.fin-title sup{font-size:.14em;font-weight:500;vertical-align:top;position:relative;top:.35em;margin-left:.06em;color:var(--gold)}
.fin-fade{position:absolute;left:0;right:0;bottom:0;height:18%;z-index:5;background:linear-gradient(180deg,rgba(0,0,0,0),var(--black));pointer-events:none}
@media (max-width:700px){.finale{--iw:260vw;--fs:17vw;height:78vh;min-height:0}.fin-word{bottom:calc(var(--ih) * .413 - var(--fs) * .06)}}   /* fits a 375 px phone; feet just in the water */

/* Footer */
footer{position:relative;z-index:3;background:var(--black);padding:40px 0 0}
footer .wrap{padding-bottom:36px}
.f-top{display:grid;grid-template-columns:auto 1fr auto;gap:40px;align-items:center}
.f-top img{width:110px;height:110px}
.f-nav{display:flex;gap:28px;justify-content:center;flex-wrap:wrap}
.f-nav a{font-size:11px;letter-spacing:.3em;text-transform:uppercase;transition:color .3s}
.f-nav a:hover{color:var(--gold)}
.insta{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.18em;color:var(--gold)}
.insta .ic{font-size:18px;stroke-width:1.6}
.resp{margin:50px 0 26px;text-align:center;font-size:12px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold)}
.resp a{text-decoration:underline}
.legal{border-top:1px solid rgba(201,168,75,.18);padding-top:24px;font-size:11px;line-height:1.9;color:rgba(249,246,227,.55);display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}
.legal a{color:var(--agold);text-decoration:underline;margin-right:16px}
.legal a.plain{color:inherit;text-decoration:none;margin-right:0}
.legal a.plain:hover{color:var(--gold)}
@media (max-width:760px){.f-top{grid-template-columns:1fr;justify-items:center;text-align:center}}

/* ---------- K-WC 1.3 Change 21: ® as a small superscript, recipes, botanical link, footer email ---------- */
sup.r{font-size:.55em;line-height:0;vertical-align:.62em;margin-left:.06em;letter-spacing:0;font-weight:inherit}
.btn-stock sup.r,.btn-gold sup.r,.g-btn sup.r{font-size:.7em;vertical-align:.5em}
.card .face.back h3{font-size:15px;letter-spacing:.24em;text-transform:uppercase}
.recipe{list-style:none;margin:16px 0 12px;padding:0;font-size:13px;line-height:1.9}
.recipe li::before{content:"";display:inline-block;width:5px;height:5px;margin:0 10px 2px 0;border-radius:50%;background:var(--gold);vertical-align:middle}
.method{font-size:12.5px;line-height:1.7;opacity:.85}
.botan-more{display:inline-block;margin-top:22px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);border-bottom:1px solid rgba(201,168,75,.45);padding-bottom:3px;transition:border-color .3s,color .3s}
.botan-more:hover{color:var(--cream);border-color:var(--cream)}
.f-top .f-mail{grid-column:3;justify-self:end;font-size:12px;letter-spacing:.06em;color:var(--cream);opacity:.75;margin-top:-28px}
.f-top .f-mail:hover{opacity:1;color:var(--gold)}
@media (max-width:760px){.f-top .f-mail{grid-column:auto;justify-self:center;margin-top:-24px}}

/* ---------- Kinetic headlines (K-WC 1.2 Change 13) ---------- */
.k-eyebrow .k-vis{position:relative;display:inline-block;padding-bottom:7px}
.k-eyebrow .k-num{display:inline-block}
.k-eyebrow .k-num.landed{animation:k-land 1.3s ease-out}
@keyframes k-land{0%{color:#F2DE9A;text-shadow:0 0 14px rgba(201,168,75,.95)}100%{text-shadow:0 0 0 rgba(201,168,75,0)}}
.k-eyebrow .k-ul{position:absolute;left:0;bottom:0;width:56px;height:1px;background:linear-gradient(90deg,currentColor,rgba(201,168,75,0));transform-origin:left}
.no-motion .k-eyebrow .k-ul{transform:none}
.h-xl .k-line-mask{position:relative;padding-bottom:.04em}
.h-xl .k-line-mask::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,rgba(201,168,75,0),var(--gold) 30%,var(--gold) 70%,rgba(201,168,75,0));opacity:0;transform:scaleX(.2);pointer-events:none}
.h-xl.k-play .k-line-mask::after{animation:k-rule 1.5s ease-out both}
.h-xl.k-play .k-line-mask:nth-child(2)::after{animation-delay:.12s}
.h-xl.k-play .k-line-mask:nth-child(3)::after{animation-delay:.24s}
.h-xl.k-play .k-line-mask:nth-child(4)::after{animation-delay:.36s}
@keyframes k-rule{0%{opacity:0;transform:scaleX(.2)}30%{opacity:.85;transform:scaleX(1)}100%{opacity:0;transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.h-xl.k-play .k-line-mask::after,.k-eyebrow .k-num.landed{animation:none}}

/* ---------- Stock KURUNDU popup: the trade manifest (K-WC 1.2 Change 16) ---------- */
@property --mf-a{syntax:"<angle>";inherits:false;initial-value:0deg}
html.mf-open{overflow:hidden}
.mf{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:var(--forest);overflow:hidden}
.mf:not([open]){display:none}
.mf::backdrop{background:transparent}
.mf-shade{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(13,33,18,.5),rgba(0,0,0,.88) 72%);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);opacity:0}
.mf.open .mf-shade{opacity:1}
.mf-ring{position:absolute;left:-50px;top:-50px;width:100px;height:100px;border-radius:50%;border:1.5px solid var(--gold);box-shadow:0 0 28px rgba(201,168,75,.55),inset 0 0 18px rgba(201,168,75,.35);opacity:0;pointer-events:none}
.mf-dust{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.mf-dust i{position:absolute;bottom:-10px;width:3px;height:3px;border-radius:50%;background:var(--gold);box-shadow:0 0 6px rgba(201,168,75,.85);opacity:0;animation:mf-dust linear infinite;animation-play-state:paused}
.mf.open .mf-dust i{animation-play-state:running}
@keyframes mf-dust{0%{transform:translate3d(0,0,0);opacity:0}15%{opacity:.75}80%{opacity:.4}100%{transform:translate3d(60px,-78vh,0);opacity:0}}
.mf-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:64px 24px 24px;perspective:1400px}
.mf-card{position:relative;display:flex;flex-direction:column;width:min(100%,600px);max-height:min(90vh,calc(100dvh - 88px));border-radius:6px;color:var(--forest);outline:none;opacity:0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .27 0 0 0 0 .1 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
    radial-gradient(ellipse at 50% 0%,#FFFDF2 0%,var(--cream) 55%,#EFE7C9 100%);
  box-shadow:0 0 0 1px var(--gold),0 40px 90px rgba(0,0,0,.6),0 0 70px rgba(201,168,75,.2)}
.mf.open .mf-card{opacity:1}
/* double gold border, and a sheen that travels round it once on open */
.mf-card::before{content:"";position:absolute;inset:9px;border:1px solid var(--gold);outline:1px solid rgba(201,168,75,.45);outline-offset:3px;border-radius:3px;pointer-events:none;z-index:2}
.mf-card::after{content:"";position:absolute;inset:8px;padding:2px;border-radius:4px;pointer-events:none;z-index:2;opacity:0;
  background:conic-gradient(from var(--mf-a),transparent 0deg,transparent 290deg,rgba(255,244,200,.25) 320deg,#FFF6D6 342deg,rgba(255,244,200,.25) 352deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.mf-card.sheen::after{animation:mf-sheen 2.4s cubic-bezier(.45,.05,.35,1) 1 both}
@keyframes mf-sheen{0%{--mf-a:0deg;opacity:0}12%{opacity:1}85%{opacity:1}100%{--mf-a:360deg;opacity:0}}
.mf-scroll{position:relative;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:54px 56px 42px;scrollbar-width:thin;scrollbar-color:rgba(141,102,18,.4) transparent}
.mf-orn{position:absolute;top:18px;width:74px;height:auto;opacity:.75;z-index:1;pointer-events:none}
.mf-orn.l{left:18px;transform:rotate(-38deg)}
.mf-orn.r{right:18px;transform:rotate(38deg) scaleX(-1)}
.mf-art{position:absolute;right:6px;bottom:84px;width:64%;max-width:360px;color:var(--forest);opacity:.045;pointer-events:none}
.mf-grab{display:none}
.mf-x{position:absolute;top:-50px;right:-6px;z-index:3;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:var(--gold);transition:transform .45s cubic-bezier(.3,.8,.2,1),color .3s}
.mf-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}
.mf-x:hover{transform:rotate(90deg);color:var(--cream)}
.mf-card{overflow:visible}
.mf-card>.mf-scroll{border-radius:6px}
@media (max-height:620px) and (min-width:701px){.mf-stage{padding-top:24px}.mf-card{max-height:calc(100dvh - 48px)}.mf-x{top:14px;right:14px;color:var(--ochre)}.mf-orn.r{display:none}}
.mf-x:focus-visible,.mf-close:focus-visible{outline:2px solid var(--ochre);outline-offset:3px}
.mf-badge{position:relative;width:78px;height:78px;margin:0 auto 14px}
.mf-badge img{width:100%;height:100%;border-radius:50%;box-shadow:0 8px 18px rgba(13,33,18,.35),0 0 0 1px rgba(141,102,18,.35)}
.mf-badge i{position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--gold);opacity:0;pointer-events:none}
.mf-eyebrow{text-align:center;font-size:10px;font-weight:600;letter-spacing:.36em;text-transform:uppercase;color:var(--ochre)}
.mf-title{text-align:center;font-weight:700;text-transform:uppercase;letter-spacing:.08em;line-height:1.15;font-size:clamp(21px,2.6vw,28px);margin:10px auto 30px;max-width:15em;color:var(--forest)}
.mf-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 30px}
.mf-field{position:relative;margin-bottom:20px}
.mf-field.full{grid-column:1/-1}
.mf-field label{display:block;font-size:9.5px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--ochre);margin-bottom:4px}
.mf-field label .req{margin-left:2px}
.mf-in{position:relative;display:block}
.mf-field input,.mf-field select,.mf-field textarea{display:block;width:100%;background:transparent;border:0;border-bottom:1px solid rgba(13,33,18,.5);border-radius:0;color:var(--forest);padding:8px 0 7px;font:inherit;font-size:16px;line-height:1.45;outline:none;-webkit-appearance:none;appearance:none}
.mf-field textarea{resize:none;overflow-y:hidden;min-height:37px;max-height:calc(3 * 1.45em + 15px)}
.mf-field select{padding-right:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D6612' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 2px center/14px}
.mf-field select:invalid,.mf-field select.empty{color:rgba(13,33,18,.5)}
.mf-field select option{color:#000}
.mf-ul{position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,var(--ochre),var(--gold) 40%,#E4CB7C);transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.3,.8,.2,1);pointer-events:none}
.mf-field:focus-within .mf-ul{transform:none}
.mf-err{display:none;margin-top:6px;font-size:11px;letter-spacing:.03em;color:var(--ochre);font-weight:600}
.mf-field.invalid .mf-err{display:block}
.mf-field.invalid input{border-bottom-color:var(--ochre)}
.mf-actions{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:10px}
.mf-privacy{font-size:11px;line-height:1.7;color:rgba(13,33,18,.7);max-width:24em}
.mf-privacy a,.mf-fail a{text-decoration:underline;color:var(--forest)}
.mf-send{flex:none;padding:15px 38px;border-radius:40px;background:var(--gold);color:var(--forest);font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;transition:background .3s,transform .3s}
.mf-send:hover{background:#D9BC66}
.mf-send:focus-visible{outline:2px solid var(--ochre);outline-offset:4px}
.mf-send[disabled]{pointer-events:none;opacity:.7}
.mf-fail{display:none;margin-top:16px;font-size:12px;line-height:1.6;color:var(--ochre);font-weight:600}
.mf.failed .mf-fail{display:block}
.mf-done{display:none;text-align:center;padding:6px 0 2px;outline:none}
.mf.sent .mf-form{display:none}
.mf.sent .mf-done{display:block}
.mf-done-seal{width:66px;height:66px;margin:4px auto 16px;display:block;filter:drop-shadow(0 4px 6px rgba(106,76,12,.4))}
.mf-done h3{font-size:clamp(19px,2.2vw,24px);font-weight:700;text-transform:uppercase;letter-spacing:.08em;line-height:1.2}
.mf-done p{margin:12px 0 24px;font-size:15px;line-height:1.6;color:rgba(13,33,18,.8)}
.mf-close{font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--ochre);border-bottom:1px solid currentColor;padding-bottom:3px}
.mf-close:hover{color:var(--forest)}
.mf-env{position:absolute;left:50%;top:50%;width:260px;height:170px;margin:-85px 0 0 -130px;opacity:0;visibility:hidden;pointer-events:none;filter:drop-shadow(0 20px 30px rgba(0,0,0,.5))}
.mf-ship{position:absolute;left:0;bottom:9vh;width:86px;height:48px;opacity:0;pointer-events:none}
@media (max-width:700px){
  .mf-stage{align-items:flex-end;padding:0}
  .mf-card{width:100%;max-height:90dvh;border-radius:22px 22px 0 0;box-shadow:0 0 0 1px var(--gold),0 -20px 60px rgba(0,0,0,.55)}
  .mf-card::before{inset:7px 7px 0;border-bottom:0;border-radius:16px 16px 0 0;outline:0;box-shadow:inset 0 0 0 3px var(--cream),inset 0 0 0 4px rgba(201,168,75,.45)}
  .mf-card::after{display:none}
  .mf-grab{display:block;flex:none;padding:10px 0 4px;touch-action:none;cursor:grab;position:relative;z-index:3}
  .mf-grab span{display:block;width:46px;height:4px;margin:0 auto;border-radius:4px;background:rgba(13,33,18,.28)}
  .mf-scroll{padding:18px 24px calc(26px + env(safe-area-inset-bottom,0px))}
  .mf-orn{width:52px;top:14px}.mf-orn.l{left:14px}.mf-orn.r{right:14px}
  .mf-x{top:10px;right:10px;color:var(--ochre)}
  .mf-orn.r{display:none}
  .mf-badge{width:62px;height:62px}
  .mf-title{margin-bottom:22px}
  .mf-grid{grid-template-columns:1fr;gap:0}
  .mf-actions{flex-direction:column-reverse;align-items:stretch;gap:16px}
  .mf-send{justify-content:center}
  .mf-privacy{max-width:none;text-align:center}
}
html.no-motion .mf-card,html.no-motion .mf-shade{transition:opacity .3s ease}
html.no-motion .mf-dust{display:none}
@media (prefers-reduced-motion:reduce){.mf-card.sheen::after{animation:none}.mf-send::before,.mf-x,.mf-ul{transition:none}}

/* ecomit credit bar (very bottom of every page) */
.ecomit-credit-bar{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:8px;padding:9px 20px calc(9px + env(safe-area-inset-bottom,0px));background:rgba(249,246,227,.04);border-top:.5px solid rgba(201,168,75,.16);font-size:10px;letter-spacing:.07em;text-transform:uppercase;line-height:1}
.ecomit-credit-bar::before{content:"";position:absolute;top:0;left:0;width:30%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(249,246,227,.06) 35%,rgba(249,246,227,.18) 50%,rgba(249,246,227,.06) 65%,transparent 100%);animation:ecomit-glare 5s ease-in-out infinite;pointer-events:none;will-change:transform}
@keyframes ecomit-glare{0%{transform:translateX(-100%) skewX(-20deg);opacity:0}5%{opacity:1}30%{transform:translateX(400%) skewX(-20deg);opacity:0}100%{transform:translateX(400%) skewX(-20deg);opacity:0}}
.ecomit-credit-label{color:rgba(249,246,227,.45)}
.ecomit-credit-sep{color:rgba(249,246,227,.2);font-size:11px}
.ecomit-credit-link{position:relative;display:flex;align-items:center;gap:5px;text-decoration:none;line-height:1}
.ecomit-credit-logo{height:14px;width:auto;opacity:.7;transition:opacity .25s ease}
.ecomit-credit-link:hover .ecomit-credit-logo,.ecomit-credit-link:focus-visible .ecomit-credit-logo{opacity:1}
.ecomit-credit-wordmark{display:inline-flex;align-items:center;text-transform:none;font-weight:500}
.ecomit-wl{display:inline-block;color:rgba(249,246,227,.7);transition:color .25s ease}
.ecomit-wl:nth-child(2){animation-delay:.07s}.ecomit-wl:nth-child(3){animation-delay:.14s}.ecomit-wl:nth-child(4){animation-delay:.21s}.ecomit-wl:nth-child(5){animation-delay:.28s}.ecomit-wl:nth-child(6){animation-delay:.35s}.ecomit-wl:nth-child(7){animation-delay:.42s}
@keyframes ecomit-wave{0%,100%{transform:translateY(0)}40%{transform:translateY(-4px)}}
.ecomit-credit-link:hover .ecomit-wl,.ecomit-credit-link:focus-visible .ecomit-wl{color:var(--cream);animation:ecomit-wave .6s ease both}
body > .ecomit-credit-bar{position:fixed;left:0;right:0;bottom:0;z-index:5;background:rgba(0,0,0,.6)}
@media (prefers-reduced-motion:reduce){.ecomit-credit-bar::before{animation:none;opacity:0}.ecomit-credit-link:hover .ecomit-wl{animation:none}}

/* Cookie + toast */
.cookie{position:fixed;left:16px;bottom:16px;z-index:50;max-width:360px;background:rgba(0,0,0,.94);border:1px solid rgba(201,168,75,.4);border-radius:14px;padding:16px 18px;font-size:12px;line-height:1.7;display:none}
@media (max-width:420px){.cookie{right:16px;max-width:none}}
.cookie.show{display:block}
.cookie a{color:var(--gold);text-decoration:underline}
.cookie button{margin-top:10px;padding:8px 18px;border-radius:30px;background:var(--gold);color:var(--black);font-size:10px;letter-spacing:.24em;font-weight:700;text-transform:uppercase}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,120px);z-index:95;background:var(--gold);color:var(--black);padding:14px 22px;border-radius:40px;font-size:12px;font-weight:600;letter-spacing:.06em;transition:transform .5s cubic-bezier(.3,.8,.2,1);max-width:calc(100% - 32px);text-align:center}
.toast.show{transform:translate(-50%,0)}
.toast a{text-decoration:underline}

/* ---------- Legal / utility pages ---------- */
.page{min-height:100vh;padding:calc(var(--header) + 70px) 0 100px;background:radial-gradient(ellipse at 50% 0%,rgba(52,68,32,.55),transparent 60%)}
.site-header.static{background:var(--black-a);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(201,168,75,.18)}
.btn-stock.back{display:inline-flex;align-items:center;gap:10px}
.btn-stock.back .ic{font-size:14px}
.doc{width:min(760px,100% - 32px);margin:0 auto}
.doc h1{font-size:clamp(30px,5vw,54px);margin:16px 0 18px}
.doc .meta{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--agold)}
.doc .draft{margin:28px 0 10px;padding:14px 18px;border:1px dashed rgba(201,168,75,.6);border-radius:12px;font-size:13px;line-height:1.7;color:var(--gold)}
.doc h2{font-size:14px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);font-weight:600;margin:44px 0 14px}
.doc p,.doc li{font-size:15px;line-height:1.85;color:rgba(249,246,227,.86)}
.doc p+p{margin-top:14px}
.doc ul{margin:10px 0 0 20px}
.doc li+li{margin-top:6px}
.doc a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.center-page{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:40px 16px}
.center-page .emblem{width:92px;height:92px;margin:0 auto 26px;border-radius:50%;box-shadow:0 0 0 1px var(--gold),0 0 0 8px rgba(13,33,18,1),0 0 0 9px rgba(201,168,75,.5),0 0 60px rgba(201,168,75,.35)}
.center-page h1{font-size:clamp(28px,5vw,52px);margin:16px 0 18px}
.center-page .body{margin:0 auto 34px}

@media (prefers-reduced-motion:reduce){
  .spin,.spin-r,.brand img,.scroll-cue i,.pulse,.corner::after,.ship-art .wake.w2{animation:none}
  .mmenu,.menu-open .mmenu{transition:none}
  .card-in{transition:none}
}

/* ---------- K-WC 1.3 Round 7 (client 2 Oct): botanicals must stay clickable next to the chapter dots ---------- */
.rail a{pointer-events:none}            /* the hidden label no longer eats clicks meant for the page */
.rail a i{pointer-events:auto;margin:-6px;padding:6px;background-clip:content-box;box-sizing:content-box}
@media (min-width:901px){.gin .stage{padding-right:clamp(40px,4vw,64px)}}   /* keep the right column clear of the dots */
