/* Chai Kreative & Advisory — relaunch microsite */
@font-face{font-family:Rozha;src:url(fonts/rozha-deva.woff2) format("woff2");unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF;font-display:swap}
@font-face{font-family:Rozha;src:url(fonts/rozha-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;font-display:swap}
@font-face{font-family:Kalam;src:url(fonts/kalam-deva.woff2) format("woff2");unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF;font-display:swap}
@font-face{font-family:Kalam;src:url(fonts/kalam-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+2122,U+2191,U+2193,U+FEFF;font-display:swap}
@font-face{font-family:TiroD;src:url(fonts/tiro-deva.woff2) format("woff2");unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF;font-display:swap}
@font-face{font-family:Mono;font-weight:400;src:url(fonts/plexmono-400.woff2) format("woff2");font-display:swap}
@font-face{font-family:Mono;font-weight:500;src:url(fonts/plexmono-500.woff2) format("woff2");font-display:swap}
@font-face{font-family:WorkS;font-weight:300;src:url(fonts/worksans-300.woff2) format("woff2");font-display:swap}
@font-face{font-family:WorkS;font-weight:400;src:url(fonts/worksans-400.woff2) format("woff2");font-display:swap}
@font-face{font-family:WorkS;font-weight:500;src:url(fonts/worksans-500.woff2) format("woff2");font-display:swap}
@font-face{font-family:WorkS;font-weight:600;src:url(fonts/worksans-600.woff2) format("woff2");font-display:swap}

:root{
  --paper:#FBF8F2; --cream:#F1E5CF; --sand:#E5D4B5; --ochre:#C9A063; --bronze:#A58A55; --umber:#6B4C2C;
  --terra:#B9573D; --sky:#78AFCB; --sky-l:#D6E8F1; --ink:#1E1B18; --mute:#6E655B; --line:#E4DACB;
  --frame:#78AFCB;
  --f-body:WorkS,TiroD,system-ui,sans-serif; --f-disp:Rozha,TiroD,Georgia,serif;
  --f-mono:Mono,TiroD,ui-monospace,monospace; --f-hand:Kalam,TiroD,cursive;
  --gut:clamp(16px,4vw,56px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--frame);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.55;transition:background-color 1.4s ease;min-height:100vh}
body.gated,body.mono{--frame:#C4C4C4}
body.gated{overflow:hidden}
a{color:inherit}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}
.mono{font-family:var(--f-mono);letter-spacing:.14em;text-transform:uppercase;font-size:12px}
[lang="hi"]{font-family:var(--f-body)}
.mono[lang="hi"],.mono [lang="hi"]{letter-spacing:.03em;text-transform:none;font-size:1.1em}
main:focus{outline:none}
.kicker{color:var(--mute);margin-bottom:14px}
.ns-note{display:none;padding:12px var(--gut);background:var(--sky-l);font-size:14px}
:focus-visible{outline:3px solid var(--terra);outline-offset:3px}

/* -------- fills (art + icons) -------- */
.f-paper{fill:#FFFDF8}.f-cream{fill:var(--cream)}.f-ochre{fill:var(--ochre)}.f-bronze{fill:var(--bronze)}.f-umber{fill:var(--umber)}
.f-terra{fill:var(--terra)}.f-sky{fill:var(--sky)}.f-ink{fill:var(--ink)}
.art polygon,.art path,.art circle,.art ellipse,.art rect,.ic polygon,.ic path,.ic circle,.ic ellipse,.ic rect,.ic line,
.cup svg polygon,.cup svg ellipse,.brew-cup polygon{stroke:var(--ink);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.ic *{stroke-width:2.4}
.nofill{fill:none}.nostroke{stroke:none!important}
.ln{fill:none;stroke:var(--ink);stroke-width:2}.ln.w3{stroke-width:3}.ln.w4,.w4{stroke-width:4}
.ln-sky{fill:none;stroke:var(--sky);stroke-width:3;stroke-linecap:round}
.dash{stroke-dasharray:4 5}
.art .steam{fill:none;stroke:var(--sky);stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.art .arcC{fill:none;stroke:var(--bronze);stroke-width:16;stroke-linecap:round}
.art .cha{font-family:Rozha,serif;font-size:150px;fill:var(--ink)}
.art .news{font-family:var(--f-mono);font-size:16px;letter-spacing:.12em;fill:var(--ink)}
.art .news.hi{font-family:Rozha,serif;font-size:26px;letter-spacing:0}

/* -------- black & white ⇄ colour -------- */
.tint{transition:filter 1.4s ease}
.reveal:not(.lit) .tint{filter:grayscale(1) contrast(1.05)}
body.mono .tint,body.mono .gate-art{filter:grayscale(1) contrast(1.05)!important}

/* ================= GATE ================= */
.gate{position:fixed;inset:0;z-index:50;padding:0;background:var(--paper);overflow-y:auto;overscroll-behavior:contain;
  border:clamp(8px,1.6vw,20px) solid var(--frame);transition:border-color 1.4s ease,opacity .7s ease,transform .9s cubic-bezier(.7,0,.2,1);
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;background-position:-1px -1px}
.gate-strip{display:flex;justify-content:space-between;gap:12px;padding:18px var(--gut);border-bottom:1px solid var(--line);background:var(--paper);color:var(--ink)}
.gate-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(20px,4vw,64px);align-items:start;padding:clamp(18px,3vw,40px) var(--gut) 40px;min-height:calc(100% - 60px)}
.gate-art{filter:grayscale(1) contrast(1.06);transition:filter 1.6s ease .2s;position:sticky;top:20px;padding:40px 30px}
.gate-art .art{width:100%;height:auto;max-height:72vh;margin:auto;overflow:visible;animation:breathe 7s ease-in-out infinite alternate}
.art{overflow:visible}
.gate.colour .gate-art{filter:none}
.gate-copy{background:rgba(251,248,242,.94);padding:clamp(4px,1vw,12px)}
.gate-h{font-family:var(--f-disp);font-weight:400;font-size:clamp(54px,6.2vw,96px);line-height:1.1;white-space:nowrap}
.gate-en{font-size:clamp(18px,2vw,24px);font-weight:500;margin-top:4px}
.scribble{font-family:var(--f-hand);color:var(--terra);font-size:clamp(18px,1.8vw,22px);line-height:1.2;display:inline-block;transform:rotate(-3deg)}
.s-gate{margin:10px 0 6px}
.points{list-style:none;margin:16px 0 10px;border-top:1px solid var(--ink)}
.points li{display:grid;grid-template-columns:44px 1fr;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}
.points b{font-size:13px;color:var(--terra);padding-top:3px}
.points span{display:block;font-size:16px;line-height:1.5}
.points em{display:block;font-style:normal;color:var(--mute);font-size:14px;line-height:1.45;margin-top:2px}
.fine{border-bottom:1px solid var(--line);padding:10px 0}
.fine summary{cursor:pointer;font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--umber);list-style:none}
.fine summary::before{content:"+ ";color:var(--terra)}
.fine[open] summary::before{content:"– "}
.fine-body{padding-top:10px;font-size:13px;line-height:1.55;color:#3d362f;max-width:80ch}
.fine-body h4{font-size:13px;font-weight:600;margin:12px 0 4px}
.fine-body p{margin-bottom:6px}
.gate-actions{display:flex;flex-wrap:wrap;gap:12px;margin:14px -12px 10px;padding:14px 12px;position:sticky;bottom:0;z-index:3;background:linear-gradient(rgba(251,248,242,.0),var(--paper) 22%)}
.gate-micro,.gate-later{font-size:12.5px;color:var(--mute);line-height:1.5;max-width:62ch}
.gate-later{font-size:16px;color:var(--umber);margin-top:6px}
.gate.out{opacity:0;transform:scale(1.04);pointer-events:none}

/* buttons */
.btn{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 20px 11px;border:2px solid var(--ink);background:var(--paper);
  text-decoration:none;box-shadow:4px 4px 0 var(--ink);transition:transform .15s,box-shadow .15s,background-color .3s;line-height:1.25}
.btn span{font-weight:600;font-size:17px}
.btn small{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.8}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.btn-accept{background:var(--ink);color:var(--paper)}
.btn-accept:hover{background:var(--terra)}
.btn-ghost{background:var(--paper)}

/* ================= SITE SHEET ================= */
.site{display:none;max-width:1280px;margin:clamp(8px,1.6vw,22px) auto;background:var(--paper);box-shadow:0 1px 0 rgba(0,0,0,.04)}
body:not(.gated) .site,body.reveal-site .site{display:block}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px var(--gut);
  background:rgba(251,248,242,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.brand img{height:40px;width:auto}
.nav{display:flex;gap:clamp(14px,2.4vw,32px)}
.nav a{text-decoration:none;color:var(--umber);font-size:11.5px}
.nav a span{font-size:14px;letter-spacing:.04em;text-transform:none;color:var(--ink);margin-right:4px}
.nav a:hover{color:var(--terra)}
.colour-toggle{display:flex;align-items:center;gap:8px;font-size:11px}
.colour-toggle .sw{width:42px;height:22px;border:2px solid var(--ink);border-radius:20px;position:relative;
  background:linear-gradient(90deg,var(--terra),var(--ochre),var(--sky));transition:background .4s}
.colour-toggle .sw i{position:absolute;top:2px;left:22px;width:14px;height:14px;border-radius:50%;background:var(--paper);border:2px solid var(--ink);transition:left .3s}
.colour-toggle[aria-pressed="false"] .sw{background:linear-gradient(90deg,#fff,#999)}
.colour-toggle[aria-pressed="false"] .sw i{left:2px}
.colour-toggle .lbl{letter-spacing:.04em;text-transform:none;font-size:14px}

section{padding:clamp(48px,7vw,104px) var(--gut);border-bottom:1px solid var(--line)}
.strip{display:flex;justify-content:space-between;gap:12px;color:var(--ink);margin:-8px 0 clamp(28px,5vw,56px);flex-wrap:wrap}

/* HERO */
.hero{padding-top:clamp(28px,4vw,48px)}
.hero-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:clamp(24px,4vw,64px);align-items:center}
.mega{font-family:var(--f-disp);font-weight:400;font-size:clamp(84px,11.2vw,168px);line-height:1.08;letter-spacing:-.01em;display:flex;align-items:center;white-space:nowrap}
.caret{display:inline-block;width:3px;height:.8em;background:var(--ink);margin-left:.08em;animation:blink 1.1s steps(1) infinite}
.hero-en{font-size:clamp(24px,3.2vw,40px);font-weight:300;line-height:1.15;margin-top:6px}
.hero-en strong{font-weight:600}
.hero-hi{font-size:clamp(19px,2.1vw,26px);color:var(--umber);margin-top:8px}
.loader{display:flex;align-items:center;gap:10px;margin:22px 0 4px;font-size:11px;color:var(--mute)}
.loader .bar{flex:0 1 220px;height:10px;border:1.5px solid var(--ink);position:relative;overflow:hidden}
.loader .bar i{position:absolute;inset:0 auto 0 0;width:0;background:repeating-linear-gradient(90deg,var(--ink) 0 8px,transparent 8px 11px)}
.dots{margin-top:18px;color:var(--ink);word-spacing:.5em;font-size:15px}
.punch{margin-top:26px}
.punch-hi{font-family:var(--f-disp);font-size:clamp(36px,4.6vw,60px);line-height:1.15}
.punch-hi span{color:var(--terra)}
.s-punch{margin-top:2px}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.hero-art-wrap{position:relative}
.hero-art .art{width:100%;height:auto}
.hero-art .sh{transform-box:fill-box;transform-origin:center;transition:transform .5s cubic-bezier(.2,.8,.2,1);
  transform:translate(calc(var(--px,0) * var(--k,0) * 1px),calc(var(--py,0) * var(--k,0) * 1px))}
.hero-art .sh:nth-child(3n+2){--k:7}.hero-art .sh:nth-child(3n){--k:-5}.hero-art .sh:nth-child(3n+1){--k:3}
.calli{position:absolute;right:-6px;bottom:-14px;width:clamp(120px,15vw,190px);color:var(--umber);background:var(--paper);border:2px solid var(--ink);padding:12px 14px 8px;transform:rotate(3deg);box-shadow:5px 5px 0 var(--ochre)}
.calli .aaghaaz{width:100%;height:auto}
.calli figcaption{font-size:10px;margin-top:4px;text-align:center}
.calli figcaption span{font-size:13px;letter-spacing:0}
.sticker{position:absolute;left:-8px;top:8%;background:var(--sky-l);border:2px solid var(--ink);padding:8px 10px;font-size:11px;line-height:1.3;transform:rotate(-7deg);box-shadow:3px 3px 0 var(--ink)}

/* MARQUEE */
.marquee{overflow:hidden;border-bottom:1px solid var(--line);background:var(--cream);padding:14px 0}
.track{display:inline-flex;gap:28px;white-space:nowrap;animation:marq 46s linear infinite;font-size:13px;color:var(--ink)}
.track [lang="hi"]{font-size:16px;letter-spacing:.02em;text-transform:none}
.track b{color:var(--terra);font-weight:400}

/* FLAGSHIP: NAGAR PEHCHAAN */
.np{background:linear-gradient(180deg,#EEF5F9,var(--paper));position:relative}
.np-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(24px,4vw,64px);align-items:start}
.np-visual{position:sticky;top:110px}
.h2.np-h{font-size:clamp(34px,4.1vw,58px)}
.np-h span{color:var(--terra);display:block}
.np-h-en strong,.np .h2-en strong{font-weight:600}
.np-lede{margin-top:18px;font-size:17px;line-height:1.6;max-width:60ch}
.np-lede sup,.np-fine sup{color:var(--terra);font-weight:600}
.np-name{font-weight:600;text-decoration:none;background:linear-gradient(transparent 62%,var(--sky-l) 62%)}
.np-name:hover{background:linear-gradient(transparent 62%,var(--ochre) 62%)}
.np-feats{list-style:none;margin:20px 0 6px;border-top:1px solid var(--ink)}
.np-feats li{display:grid;grid-template-columns:40px 1fr;column-gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.np-feats b{grid-row:span 2;color:var(--terra);font-size:12px;padding-top:4px}
.np-feats span{font-size:16px}.np-feats em{font-style:normal;font-size:14px;color:var(--mute)}
.s-np{margin-top:12px}
.np-meta{margin-top:16px;color:var(--mute);font-size:11px}
.np-meta [lang]{text-transform:none;letter-spacing:.03em;font-size:13px}
.np-visual{position:relative}
.np-art{width:100%;height:auto;border:2px solid var(--ink);box-shadow:8px 8px 0 var(--sky);background:#fff;filter:grayscale(1);transition:filter 1.2s ease}
.np-art.done{filter:none}
body.mono .np-art{filter:grayscale(1)!important}
.np-art polygon,.np-art path,.np-art circle,.np-art rect{stroke:var(--ink);stroke-width:2.5;stroke-linejoin:round}
.np-art .np-bb-hi{font-family:Rozha,serif;font-size:34px;fill:var(--ink)}
.np-art .np-id{font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;fill:var(--ink)}
.np-art .scan{fill:var(--terra);stroke:none;opacity:0}
.np-art.scanning .scan{animation:npscan 1.6s ease-in-out forwards}
.np-art .stamp{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(1.5) rotate(-14deg);transition:opacity .35s ease,transform .45s cubic-bezier(.2,1.4,.4,1)}
.np-art.done .stamp{opacity:1;transform:scale(1) rotate(-6deg)}
.np-art .stamp-in{stroke:var(--terra);stroke-width:2;stroke-dasharray:5 4}
.np-art .np-stamp-hi{font-family:Rozha,serif;font-size:24px;fill:var(--terra);text-anchor:middle}
.np-art .np-stamp-en{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;fill:var(--ink);text-anchor:middle}
.np-art .ring{stroke:var(--terra);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:npring 2.2s ease-out infinite}
.np-art .ring.r2{animation-delay:1.1s}
.np-replay{position:absolute;right:-6px;bottom:-22px;padding:8px 14px}
.np-replay span{font-size:14px}
.np-fine{margin-top:clamp(32px,4vw,48px);font-size:12px;line-height:1.55;color:var(--mute);max-width:110ch;border-top:1px solid var(--line);padding-top:12px}
.card-link{display:inline-block;margin-top:12px;font-size:11px;color:var(--terra);text-decoration:none;border-bottom:1.5px solid var(--terra)}
.card-link span{text-transform:none;font-size:13px;letter-spacing:.03em}
@keyframes npscan{0%{opacity:1;transform:translateY(0)}90%{opacity:1}100%{opacity:0;transform:translateY(212px)}}
@keyframes npring{from{transform:scale(.6);opacity:.9}to{transform:scale(2.2);opacity:0}}
@media (max-width:860px){.np-grid{grid-template-columns:1fr}.np-visual{position:relative;top:0;max-width:560px;margin:8px auto 30px;width:100%}}

/* SECTION HEADS */
.sec-head{margin-bottom:clamp(28px,4vw,48px);position:relative}
.h2{font-family:var(--f-disp);font-weight:400;font-size:clamp(44px,6.6vw,92px);line-height:1.08}
.h2-en{font-size:clamp(18px,2vw,24px);font-weight:300;margin-top:4px}
.h2-en .hint{font-size:11px;color:var(--mute)}
.s-swipe{display:none}

/* NINE FACES (reference grid) */
.roop{padding-left:0;padding-right:0}
.roop .sec-head{padding:0 var(--gut);text-align:center}
.cards{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.card{padding:clamp(24px,3vw,40px) clamp(18px,2.4vw,34px) clamp(28px,3vw,40px);text-align:center;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  transition:background-color .4s,transform .4s;position:relative}
.card:nth-child(3n){border-right:0}
.card:hover{background:#fff}
.day{font-size:12px;color:var(--mute)}
.day span{text-transform:none;font-size:13px;letter-spacing:.08em}
.ic{width:112px;height:112px;margin:14px auto 10px;overflow:visible}
.ic .s1,.ic .s2{transform-box:fill-box;transform-origin:center;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.card:hover .ic .s1{transform:translate(5px,-4px) rotate(4deg)}
.card:hover .ic .s2{transform:translate(-4px,4px) rotate(-6deg)}
.card:hover .ic{filter:none!important}
.card h3{font-family:var(--f-disp);font-weight:400;font-size:clamp(28px,2.8vw,36px);line-height:1.15}
.en-t{font-size:11px;color:var(--bronze);margin-top:2px}
.hi-l{margin-top:10px;font-size:16.5px;line-height:1.5}
.en-l{font-size:14px;color:var(--mute);line-height:1.45}

/* MANIFESTO */
.manifesto{background:var(--paper)}
.lines{list-style:none;counter-reset:l}
.lines li{position:relative;padding:clamp(18px,2.4vw,28px) 0 clamp(18px,2.4vw,28px) clamp(44px,6vw,90px);border-bottom:1px solid var(--line);
  opacity:.15;transform:translateY(16px);transition:opacity .8s ease,transform .8s ease}
.lines li::before{counter-increment:l;content:"0" counter(l);position:absolute;left:0;top:clamp(26px,3vw,40px);font-family:var(--f-mono);font-size:12px;letter-spacing:.14em;color:var(--terra)}
.lines li p{font-family:var(--f-disp);font-size:clamp(32px,5vw,66px);line-height:1.12}
.lines li span{display:block;font-size:clamp(15px,1.6vw,20px);color:var(--mute);margin-top:4px}
.lines mark{background:linear-gradient(transparent 62%,var(--ochre) 62%) no-repeat 0 0/0% 100%;color:inherit;transition:background-size 1.1s ease .3s}
.lit .lines li{opacity:1;transform:none}
.lit .lines li:nth-child(2){transition-delay:.15s}.lit .lines li:nth-child(3){transition-delay:.3s}.lit .lines li:nth-child(4){transition-delay:.45s}.lit .lines li:nth-child(5){transition-delay:.6s}
.lit .lines mark{background-size:100% 100%}
body.mono .lines mark{background-image:linear-gradient(transparent 62%,#cfcfcf 62%)}
.s-cap{position:absolute;right:4%;top:22%;font-style:normal}

/* PROCESS */
.cups{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,32px)}
.cup{text-align:left;border:2px solid var(--ink);background:#fff;padding:22px 22px 26px;box-shadow:5px 5px 0 var(--ink);transition:transform .2s,box-shadow .2s;position:relative}
.cup:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--ink)}
.cup svg{width:96px;height:120px;margin-bottom:10px;overflow:visible}
.cup .tea{fill:var(--ochre);stroke:none!important;transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(.04);transition:transform 1.3s cubic-bezier(.3,.7,.2,1)}
.cup.full .tea,.lit .cup .tea{transform:scaleY(var(--lvl))}
.cup.empty .tea{transform:scaleY(.04)!important}
.steam-g path{fill:none;stroke:var(--sky);stroke-width:4;stroke-linecap:round;opacity:0;transition:opacity .6s}
.lit .cup:not(.empty) .steam-g path,.steam-g.on path{opacity:1;animation:steam 2.4s ease-in-out infinite}
.cup-n{position:absolute;right:18px;top:18px;color:var(--terra)}
.cup h3{font-family:var(--f-disp);font-weight:400;font-size:clamp(38px,4vw,52px);line-height:1.1}

/* BREW */
.brew{background:linear-gradient(180deg,var(--paper),#F6EFE2)}
.brew-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
fieldset{border:0;margin-bottom:22px}
legend{margin-bottom:12px;color:var(--umber)}
legend span{text-transform:none;font-size:14px;letter-spacing:.04em;color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips button{border:2px solid var(--ink);padding:9px 14px;background:#fff;font-size:15px;border-radius:30px;transition:background .2s,transform .15s}
.chips button span{font-weight:600;margin-right:4px}
.chips button:hover{transform:translateY(-2px)}
.chips button.on{background:var(--ink);color:var(--paper)}
.brew-out{display:grid;grid-template-columns:120px 1fr;gap:22px;border:2px solid var(--ink);background:#fff;padding:24px;box-shadow:6px 6px 0 var(--ochre)}
.brew-cup{width:110px;height:138px;overflow:visible}
#brewtea{stroke:none!important;transition:fill .6s ease}
.brew-tag{color:var(--terra)}
.brew-hi{font-family:var(--f-disp);font-size:clamp(28px,3vw,38px);line-height:1.2;margin-top:6px}
.brew-en{font-size:16px;color:var(--mute);margin-top:4px}
.s-free{margin-top:14px}

/* CONTACT */
.big-mail{display:inline-block;font-family:var(--f-disp);font-size:clamp(30px,6.4vw,84px);line-height:1.1;text-decoration:none;word-break:break-word;
  background:linear-gradient(transparent 70%,var(--sky-l) 70%);transition:background .3s}
.big-mail:hover{background:linear-gradient(transparent 70%,var(--ochre) 70%)}
.addr{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:clamp(28px,4vw,48px);border-top:1px solid var(--ink);padding-top:22px;font-size:15px}
.addr .lbl{color:var(--bronze);margin-bottom:6px;font-size:11px}
.addr .lbl span{text-transform:none;font-size:13px;letter-spacing:.04em}
.tagline{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:clamp(28px,4vw,48px);font-family:var(--f-hand);font-size:clamp(22px,2.6vw,32px);color:var(--umber)}

/* FOOTER */
.foot{padding:28px var(--gut) 34px;font-size:13px}
.foot-top{display:flex;align-items:center;gap:16px;margin-bottom:12px}
.foot-top img{width:40px;height:auto}
.foot-top p{font-size:11px;color:var(--ink);line-height:1.7}
.foot-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:18px;color:var(--mute);font-size:11px}
.linkish{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:underline;color:var(--umber)}
.linkish span{text-transform:none;font-size:13px;letter-spacing:.04em}

/* ================= RESPONSIVE ================= */
@media (max-width:1024px){
  .addr{grid-template-columns:1fr 1fr}
  .nav a{font-size:0}.nav a span{font-size:15px;margin:0}
}
@media (max-width:860px){
  .gate-grid{grid-template-columns:1fr;gap:6px;padding-top:12px}
  .gate-art{position:relative;top:0;padding:18px 8px 6px;--sc:.42}
  .gate-art .art{max-height:32vh;width:auto}
  .hero-grid{grid-template-columns:1fr}
  .hero-art-wrap{max-width:520px;margin:10px auto 0;width:100%}
  .brew-grid{grid-template-columns:1fr}
  .cups{grid-template-columns:1fr}
  .cup{display:grid;grid-template-columns:90px 1fr;column-gap:18px;align-items:start}
  .cup svg{grid-row:span 5;width:80px;height:100px}
}
@media (max-width:720px){
  .cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-top:0;padding:0 var(--gut) 8px;gap:14px}
  .cards::-webkit-scrollbar{display:none}
  .card{flex:0 0 78%;scroll-snap-align:center;border:2px solid var(--ink)!important;background:#fff;box-shadow:4px 4px 0 var(--ink)}
  .s-swipe{display:block;position:absolute;right:var(--gut);bottom:-30px}
  .roop .sec-head{margin-bottom:40px}
  .nav{display:none}
  .strip span:nth-child(3){display:none}
  .gate-strip span:nth-child(3){display:none}
}
@media (max-width:560px){
  .brand img{height:34px}
  .colour-toggle .lbl{display:none}
  .gate-actions{flex-direction:column}
  .gate-actions .btn{width:100%}
  .brew-out{grid-template-columns:1fr;text-align:left}
  .brew-cup{width:84px;height:106px}
  .addr{grid-template-columns:1fr}
  .calli{right:2px;bottom:-18px}
  .sticker{left:0;top:2%}
  .points li{grid-template-columns:34px 1fr}
  .lines li{padding-left:38px}
  .s-cap{position:static;display:block;margin-top:6px}
  .mega{font-size:clamp(84px,27vw,130px)}
}
@media (max-width:340px){ .brand img{content:url(img/logo-mark.svg);height:36px} }


/* QA fixes */
.brew-grid>*,.brew-out>*,.hero-grid>*,.np-grid>*,.gate-grid>*{min-width:0}
.btn{max-width:100%}.btn small,.btn span{overflow-wrap:anywhere}
@media (max-width:860px){.brew-grid{grid-template-columns:minmax(0,1fr)}}
fieldset{min-width:0}
.chips button{max-width:100%}
.nav a{padding:10px 0}
.colour-toggle{padding:8px 0;min-height:40px}
.gate{-webkit-overflow-scrolling:touch}
@media (max-width:360px){
  .gate-h{white-space:normal;font-size:44px}
  .gate-strip{gap:6px;font-size:10px}
  .chips button{font-size:13px;padding:8px 11px}
  .strip{font-size:10px}
}

/* ================= MOTION ================= */
@keyframes blink{50%{opacity:0}}
@keyframes marq{to{transform:translateX(-50%)}}
@keyframes breathe{from{transform:scale(.97) rotate(-.6deg)}to{transform:scale(1.01) rotate(.6deg)}}
@keyframes steam{0%,100%{transform:translateY(0);opacity:.9}50%{transform:translateY(-4px);opacity:.4}}
.art .sh{transform-box:fill-box;transform-origin:center;transition:transform 1.3s cubic-bezier(.2,.85,.2,1)}
.scatter .gate-art .sh{transform:translate(calc(var(--dx) * var(--sc,1)),calc(var(--dy) * var(--sc,1))) rotate(var(--r))}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .lines li{opacity:1;transform:none}
}
@media print{.gate,.top,.marquee{display:none!important}.site{display:block!important}}