/* =====================================================================
   SABAI TAJA — style.css
   Palette: Nepal crimson · deep navy · gold.   Themes: [data-theme="dark|light"]
   ===================================================================== */

:root{
  --crimson:#dc143c; --crimson-deep:#a30f2d; --gold:#e3b04b; --gold-soft:#f5dc93;
  --navy:#0a1230; --navy-2:#101b44;
  --font-head:'Playfair Display',Georgia,'Times New Roman',serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --pad:clamp(1.1rem,4vw,3rem);
  --glass-blur:18px;
}

/* ---------- Dark theme ---------- */
[data-theme="dark"]{
  --bg:#070d24; --bg2:#0c1537; --text:#f5f1e8; --muted:#aeb6d2;
  --accent:#ff4d6d;           /* crimson, lightened for AA contrast on navy */
  --gold-text:#f0c564;
  --card:rgba(255,255,255,.06); --card-b:rgba(255,255,255,.16);
  --shadow:0 20px 60px rgba(0,0,0,.45);
  --sky1:#040818; --sky2:#141a4a; --sky3:#6d2a55; --sky4:#f0905a;
  --snow:#f3f6ff; --far-rock:#6f7db0; --far-low:#2b3566;
  --mid:#1a2552; --near:#101a42; --fore:#080f2c; --rope:#e8d9a8;
  --mist:rgba(190,205,255,.20); --sun-c:rgba(255,170,100,.55); --particle:255,225,160;
  --stars:1; --scrim:rgba(4,8,24,.55);
}
/* ---------- Light theme ---------- */
[data-theme="light"]{
  --bg:#fbf6ec; --bg2:#f2e9d8; --text:#0c1436; --muted:#485072;
  --accent:#b80f31;
  --gold-text:#8a5f06;
  --card:rgba(255,255,255,.62); --card-b:rgba(12,20,54,.13);
  --shadow:0 20px 50px rgba(40,30,10,.16);
  --sky1:#bcd8f2; --sky2:#f8e4c6; --sky3:#fbd1a0; --sky4:#ffb77a;
  --snow:#ffffff; --far-rock:#8996bd; --far-low:#5a6aa0;
  --mid:#4a5a96; --near:#2c3b78; --fore:#142058; --rope:#7a5a14;
  --mist:rgba(255,255,255,.75); --sun-c:rgba(255,200,110,.85); --particle:255,255,255;
  --stars:0; --scrim:rgba(251,246,236,.0);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:70px}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:clamp(1rem,.95rem + .25vw,1.125rem);line-height:1.65;overflow-x:clip;-webkit-font-smoothing:antialiased;transition:background .6s var(--ease),color .6s var(--ease)}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3,p{margin:0}
em{font-style:italic;font-family:var(--font-head);color:var(--accent)}
code{font-size:.9em}
.container{width:min(1200px,100% - var(--pad)*2);margin-inline:auto}
.container.narrow{width:min(720px,100% - var(--pad)*2)}
.center{text-align:center}
.muted{color:var(--muted)} .sm{font-size:.9rem}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:1rem;top:-4rem;z-index:20000;background:var(--gold);color:#111;padding:.7rem 1rem;border-radius:8px;font-weight:600;transition:top .2s}
.skip:focus{top:1rem}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}

.kicker{font-size:.78rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-text);font-weight:600;margin-bottom:1rem}
.sec-h{font-family:var(--font-head);font-weight:800;font-size:clamp(2.4rem,7vw,5.5rem);line-height:1.05;letter-spacing:-.01em}
.sec-h.sm{font-size:clamp(2rem,5vw,3.2rem)}

/* Glassmorphism */
.glass{background:var(--card);border:1px solid var(--card-b);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(140%);backdrop-filter:blur(var(--glass-blur)) saturate(140%);border-radius:28px;box-shadow:var(--shadow)}

/* Dhaka-inspired border */
.dhaka{height:28px;width:100%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='28' viewBox='0 0 56 28'%3E%3Crect width='56' height='28' fill='%23dc143c'/%3E%3Cpath d='M28 2L50 14 28 26 6 14Z' fill='%230a1230'/%3E%3Cpath d='M28 7L42 14 28 21 14 14Z' fill='%23e3b04b'/%3E%3Cpath d='M28 11L34 14 28 17 22 14Z' fill='%23dc143c'/%3E%3Cpath d='M0 0H8L0 8ZM56 0H48L56 8ZM0 28H8L0 20ZM56 28H48L56 20Z' fill='%23e3b04b'/%3E%3C/svg%3E");background-size:56px 28px;background-repeat:repeat-x;position:relative;z-index:5}

/* ---------- Buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:1rem 1.8rem;border:0;border-radius:999px;font-weight:600;letter-spacing:.02em;color:#fff;background:linear-gradient(135deg,var(--crimson),var(--crimson-deep));box-shadow:0 10px 30px rgba(220,20,60,.4),inset 0 1px 0 rgba(255,255,255,.3);overflow:hidden;transition:box-shadow .3s,transform .3s var(--ease),background .3s;will-change:transform}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease)}
.btn:hover::after{transform:translateX(120%)}
.btn:hover{box-shadow:0 14px 40px rgba(220,20,60,.55),inset 0 1px 0 rgba(255,255,255,.4)}
.btn:active{transform:scale(.97)}
.b-check{position:absolute;width:26px;height:26px;opacity:0;transform:scale(.4)}
.b-check path{stroke-dasharray:1;stroke-dashoffset:1}

/* ---------- Loader ---------- */
.loader{position:fixed;inset:0;z-index:10000;background:radial-gradient(ellipse at 50% 40%,#16215a 0%,#070d24 70%);display:grid;place-items:center;transition:opacity .8s var(--ease),visibility .8s,transform .9s var(--ease)}
.loader.hide{opacity:0;visibility:hidden;transform:scale(1.06)}
.loader-inner{text-align:center;color:#f5f1e8}
.loader-mark{width:clamp(110px,22vw,170px);margin:0 auto 1.2rem;overflow:visible}
.loader-mark path{stroke:var(--gold);stroke-width:2.5;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.5s var(--ease) .2s forwards}
.loader-mark .lm-b{animation-delay:.9s}
.loader-mark .lm-c{fill:var(--crimson);stroke:none;opacity:0;transform-origin:92px 22px;animation:pop .6s var(--ease) 1.3s forwards}
.loader-mark .lm-a{animation:draw 1.5s var(--ease) .2s forwards,fillin .8s ease 1.4s forwards}
.loader-word{display:flex;justify-content:center;font-family:var(--font-head);font-weight:800;font-size:clamp(1.6rem,6vw,2.6rem);letter-spacing:.18em}
.loader-word span{opacity:0;transform:translateY(60%);animation:letter .7s var(--ease) forwards;animation-delay:calc(.9s + var(--k,0)*.06s)}
.loader-word .sp{width:.6em}
.loader-bar{width:min(220px,50vw);height:2px;margin:1.6rem auto 0;background:rgba(255,255,255,.15);border-radius:2px;overflow:hidden}
.loader-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--crimson),var(--gold));transform:scaleX(0);transform-origin:left;animation:bar 2s var(--ease) .2s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fillin{to{fill:rgba(220,20,60,.35)}}
@keyframes pop{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}
@keyframes letter{to{opacity:1;transform:none}}
@keyframes bar{to{transform:scaleX(1)}}

/* ---------- Progress + header ---------- */
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:9000;background:linear-gradient(90deg,var(--crimson),var(--gold));transform:scaleX(0);transform-origin:left}
.site-header{position:fixed;top:0;left:0;right:0;z-index:8000;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem var(--pad);transition:background .4s,backdrop-filter .4s,padding .4s,transform .5s var(--ease)}
.site-header.scrolled{background:color-mix(in srgb,var(--bg) 70%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);padding-block:.6rem;box-shadow:0 1px 0 var(--card-b)}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;font-family:var(--font-head);font-weight:800;font-size:1.25rem;letter-spacing:.02em;color:var(--hero-fg,var(--text))}
.nav{display:flex;align-items:center;gap:1.6rem;margin-left:auto}
.nav a{text-decoration:none;font-size:.92rem;font-weight:500;opacity:.85;position:relative;color:var(--hero-fg,var(--text))}
.nav a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.nav a:hover{opacity:1}.nav a:hover::after{transform:scaleX(1)}
.nav-cta{padding:.5rem 1.1rem;border-radius:999px;background:var(--crimson);color:#fff!important;opacity:1!important}
.site-header:not(.scrolled){--hero-fg:var(--text)}

/* Sun/moon switch */
.theme-toggle{border:0;background:none;padding:6px;border-radius:999px;line-height:0}
.tt-track{position:relative;display:block;width:62px;height:32px;border-radius:999px;background:linear-gradient(135deg,#7ec0ee,#f7d58b);box-shadow:inset 0 2px 6px rgba(0,0,0,.25),0 0 0 1px var(--card-b);transition:background .6s var(--ease);overflow:hidden}
[data-theme="dark"] .tt-track{background:linear-gradient(135deg,#0a1230,#2b2d6e)}
.tt-stars{position:absolute;inset:0;opacity:0;transition:opacity .5s;background:radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 40% 70%,#fff 0 1px,transparent 1.5px),radial-gradient(circle at 55% 25%,#fff 0 1.2px,transparent 1.7px)}
[data-theme="dark"] .tt-stars{opacity:1}
.tt-knob{position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#ffd25e;color:#c97a00;display:grid;place-items:center;box-shadow:0 2px 8px rgba(0,0,0,.35);transition:transform .6s var(--ease),background .5s,color .5s}
[data-theme="dark"] .tt-knob{transform:translateX(30px) rotate(360deg);background:#e9ecff;color:#3a4290}
.tt-knob svg{position:absolute;width:16px;height:16px;transition:opacity .4s,transform .6s var(--ease)}
.ic-moon{opacity:0;transform:scale(.3) rotate(-90deg)}
[data-theme="dark"] .ic-sun{opacity:0;transform:scale(.3) rotate(90deg)}
[data-theme="dark"] .ic-moon{opacity:1;transform:none}
.theme-toggle:hover .tt-knob{box-shadow:0 0 14px var(--gold)}

/* ---------- Custom cursor (desktop only; added by JS) ---------- */
.cursor-dot,.cursor-ring,.cursor-trail{position:fixed;left:0;top:0;pointer-events:none;z-index:99999;border-radius:50%;opacity:0;will-change:transform}
.has-cursor .cursor-dot,.has-cursor .cursor-ring,.has-cursor .cursor-trail{opacity:1}
.cursor-dot{width:8px;height:8px;margin:-4px 0 0 -4px;background:var(--gold);box-shadow:0 0 12px var(--gold)}
.cursor-ring{width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid var(--gold);transition:width .3s var(--ease),height .3s var(--ease),margin .3s var(--ease),background .3s,border-color .3s}
.cursor-ring.hover{width:64px;height:64px;margin:-32px 0 0 -32px;background:rgba(227,176,75,.14);border-color:var(--crimson)}
.cursor-trail{width:14px;height:14px;margin:-7px 0 0 -7px;background:radial-gradient(circle,var(--gold) 0%,rgba(227,176,75,0) 70%);mix-blend-mode:screen}
[data-theme="light"] .cursor-trail{mix-blend-mode:normal}
.has-cursor,.has-cursor a,.has-cursor button,.has-cursor .slide-btn{cursor:none}
.has-cursor input{cursor:text}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0;transition:opacity 1s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0s);will-change:transform,opacity}
.reveal[data-reveal="up"]{transform:translateY(50px)}
.reveal[data-reveal="left"]{transform:translateX(-90px)}
.reveal[data-reveal="right"]{transform:translateX(90px)}
.reveal[data-reveal="scale"]{transform:scale(.88)}
.reveal.in{opacity:1;transform:none}

/* =====================================================================
   HERO
   ===================================================================== */
.hero{position:relative;height:100vh;height:100svh;min-height:640px;overflow:hidden;isolation:isolate;display:grid;place-items:start center}
.hero>*{position:absolute}
.hero-photo{inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.4s;z-index:0}
.hero.has-photo .hero-photo{opacity:1}
.sky{inset:-5% 0 0 0;background:linear-gradient(180deg,var(--sky1) 0%,var(--sky2) 42%,var(--sky3) 70%,var(--sky4) 100%);z-index:1;transition:opacity 1s}
.hero.has-photo .sky{opacity:.0}
.stars{inset:0;z-index:2;opacity:calc(var(--stars)*.9);transition:opacity 1s;background-image:
  radial-gradient(1.5px 1.5px at 12% 18%,#fff,transparent),radial-gradient(1px 1px at 28% 8%,#fff,transparent),radial-gradient(1.5px 1.5px at 44% 24%,#fff,transparent),
  radial-gradient(1px 1px at 61% 12%,#fff,transparent),radial-gradient(2px 2px at 77% 20%,#ffe9b0,transparent),radial-gradient(1px 1px at 90% 9%,#fff,transparent),
  radial-gradient(1px 1px at 8% 38%,#fff,transparent),radial-gradient(1.5px 1.5px at 35% 40%,#fff,transparent),radial-gradient(1px 1px at 70% 36%,#fff,transparent),radial-gradient(1.5px 1.5px at 95% 33%,#fff,transparent);
  animation:twinkle 5s ease-in-out infinite alternate}
@keyframes twinkle{from{filter:brightness(.7)}to{filter:brightness(1.3)}}
.sun{--s:min(80vw,900px);left:calc(50% - var(--s)/2);bottom:calc(32% - var(--s)/2);width:var(--s);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,var(--sun-c) 0%,transparent 62%);z-index:3;filter:blur(10px)}
.layer{left:-5%;width:110%;max-width:none;height:100%;bottom:0;z-index:4;will-change:transform}
@media (max-aspect-ratio:4/5){.layer{height:86%}}
.l-mid{z-index:6}.l-near{z-index:8}.l-fore{z-index:9}
.hero.has-photo .l-far,.hero.has-photo .l-mid{opacity:0}
.f-mid{fill:var(--mid)}.f-near{fill:var(--near)}.f-fore{fill:var(--fore)}
.layer{transition:opacity 1s}
.flags .fl{transform-origin:center;animation:wave 2.8s ease-in-out infinite alternate}
.flags .fl rect{transform-box:fill-box;transform-origin:top center;animation:flutter 1.6s ease-in-out infinite alternate}
.flags .fl rect:nth-child(2n){animation-delay:-.4s}.flags .fl rect:nth-child(3n){animation-delay:-.9s}
@keyframes wave{to{transform:translateY(3px)}}
@keyframes flutter{from{transform:skewX(-6deg) scaleY(1)}to{transform:skewX(8deg) scaleY(.94)}}

.mist{left:-20%;width:140%;z-index:5;pointer-events:none;border-radius:50%;filter:blur(30px)}
.mist.m1{bottom:26%;height:22%;background:radial-gradient(ellipse at center,var(--mist),transparent 70%);animation:drift 38s linear infinite alternate}
.mist.m2{bottom:12%;height:24%;z-index:7;background:radial-gradient(ellipse at 40% 50%,var(--mist),transparent 68%);animation:drift 28s linear infinite alternate-reverse}
@keyframes drift{from{transform:translateX(-8%)}to{transform:translateX(8%)}}
.particles{inset:0;width:100%;height:100%;z-index:10;pointer-events:none}
.vignette{inset:0;z-index:11;pointer-events:none;background:radial-gradient(ellipse at 50% 35%,transparent 40%,var(--scrim) 100%),linear-gradient(180deg,var(--scrim) 0%,transparent 28%)}

.hero-content{position:relative;z-index:12;padding:clamp(5.5rem,16vh,9.5rem) var(--pad) 0;text-align:center;width:min(1700px,100%)}
.eyebrow{display:inline-flex;align-items:center;gap:1rem;font-size:.78rem;letter-spacing:.42em;text-transform:uppercase;color:var(--gold-text);font-weight:600;margin-bottom:1.4rem;opacity:0;transform:translateY(10px);transition:opacity 1s var(--ease) .2s,transform 1s var(--ease) .2s}
[data-theme="dark"] .eyebrow{color:var(--gold-soft)}
.eb-line{width:clamp(24px,6vw,70px);height:1px;background:currentColor;opacity:.7}
body.loaded .eyebrow{opacity:1;transform:none}
.hero-title{font-family:var(--font-head);font-weight:900;font-size:clamp(2.35rem,7.4vw,7rem);line-height:1.04;letter-spacing:-.015em;text-shadow:0 4px 40px rgba(0,0,0,.35)}
[data-theme="light"] .hero-title{text-shadow:0 2px 30px rgba(255,255,255,.7);color:var(--navy)}
[data-theme="dark"] .hero-title{color:#fff}
.hero-title .line{display:block}
.hero-title .hl{font-style:italic;text-shadow:none}
.hero-title .hl .w>span{padding:0 .06em;background:linear-gradient(100deg,var(--gold-soft),var(--gold) 45%,#ff6b85 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
[data-theme="light"] .hero-title .hl .w>span{background:linear-gradient(100deg,#b80f31,#dc143c 55%,#b8741a);-webkit-background-clip:text;background-clip:text}
.w{display:inline-block;overflow:hidden;vertical-align:bottom;padding:0 .04em .14em;margin:0 -.04em -.14em}
.w>span{display:inline-block;transform:translateY(115%) rotate(4deg);opacity:0;will-change:transform}
body.loaded .w>span{animation:wordUp 1.1s var(--ease) forwards;animation-delay:calc(var(--i)*.13s + .55s)}
@keyframes wordUp{to{transform:none;opacity:1}}

.soon-pill{display:inline-flex;align-items:center;gap:.7rem;margin-top:clamp(1.5rem,4vh,2.6rem);padding:.7rem 1.5rem;border-radius:999px;background:color-mix(in srgb,var(--bg) 62%,transparent);border:1px solid var(--card-b);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:.85rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--text);opacity:0;transform:translateY(16px);transition:opacity 1s var(--ease) 1.9s,transform 1s var(--ease) 1.9s}
body.loaded .soon-pill{opacity:1;transform:none}
.soon-pill .dot{width:9px;height:9px;border-radius:50%;background:var(--crimson);box-shadow:0 0 0 0 rgba(220,20,60,.7);animation:ping 1.8s infinite}
@keyframes ping{70%{box-shadow:0 0 0 12px rgba(220,20,60,0)}100%{box-shadow:0 0 0 0 rgba(220,20,60,0)}}

.scroll-ind{left:50%;bottom:clamp(1rem,4vh,2rem);transform:translateX(-50%);z-index:13;display:flex;flex-direction:column;align-items:center;gap:.5rem;text-decoration:none;color:#fff;font-size:.7rem;letter-spacing:.35em;text-transform:uppercase;opacity:0;transition:opacity 1s 2.4s}
body.loaded .scroll-ind{opacity:.9}
.mouse{width:24px;height:38px;border:2px solid currentColor;border-radius:14px;position:relative}
.mouse i{position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--gold);animation:wheel 1.8s ease-in-out infinite}
@keyframes wheel{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}

/* =====================================================================
   STORY (sticky pinned)
   ===================================================================== */
.story{position:relative;height:420vh;background:linear-gradient(180deg,var(--bg),var(--bg2))}
.story-pin{position:sticky;top:0;height:100vh;height:100svh;display:grid;align-items:center;overflow:hidden}
.story-bg{position:absolute;inset:0;background:radial-gradient(60% 50% at 20% 50%,color-mix(in srgb,var(--crimson) 22%,transparent),transparent 70%),radial-gradient(50% 50% at 90% 80%,color-mix(in srgb,var(--gold) 18%,transparent),transparent 70%)}
.story-inner{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.story-art{position:relative;display:grid;place-items:center}
.mandala{color:var(--gold)}
.mandala svg{width:100%;height:auto;overflow:visible}
.mandala.big{width:min(46vw,520px);will-change:transform}
.mandala.small{width:90px;margin:0 auto 1rem}
.mandala .p1{fill:var(--crimson);opacity:.8}.mandala .p2{fill:var(--gold);opacity:.9}.mandala .p3{fill:var(--navy);stroke:var(--gold);stroke-width:2}
.mandala .r{fill:none;stroke:var(--gold);stroke-width:1.5;opacity:.7}
.story-num{position:absolute;font-family:var(--font-head);font-weight:900;font-size:clamp(3rem,8vw,6.5rem);color:var(--text);text-shadow:0 0 40px var(--bg);display:flex;align-items:baseline;gap:.3rem;mix-blend-mode:normal}
.story-num small{font-size:.28em;font-weight:600;color:var(--muted)}
.chapters{display:grid}
.chapter{grid-area:1/1;opacity:0;transform:translateY(40px);filter:blur(8px);transition:opacity .8s var(--ease),transform .9s var(--ease),filter .8s;pointer-events:none}
.chapter.active{opacity:1;transform:none;filter:none;pointer-events:auto}
.chapter.past{transform:translateY(-40px)}
.ch-title{font-family:var(--font-head);font-weight:800;font-size:clamp(2.2rem,5.2vw,4.4rem);line-height:1.08;margin-bottom:1.2rem}
.ch-text{font-size:clamp(1.05rem,1.6vw,1.35rem);color:var(--muted);max-width:34ch}
.story-dots{display:flex;gap:.6rem;margin-top:2rem}
.story-dots i{width:34px;height:4px;border-radius:4px;background:var(--card-b);transition:background .5s,width .5s var(--ease)}
.story-dots i.on{background:var(--crimson);width:64px}

/* =====================================================================
   HORIZONTAL SLIDE (pinned)
   ===================================================================== */
.hscroll{position:relative;height:320vh;background:var(--bg2)}
.hscroll-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:center}
.hscroll-track{display:flex;gap:clamp(1rem,3vw,2.5rem);padding:0 clamp(1.2rem,8vw,8rem);will-change:transform;align-items:stretch}
.panel{flex:0 0 min(80vw,620px);min-height:min(62vh,520px);padding:clamp(1.5rem,3vw,2.6rem);display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden}
.panel.glass::before{content:"";position:absolute;width:85%;aspect-ratio:1;left:-18%;top:-26%;border-radius:50%;pointer-events:none;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--crimson) 40%,transparent) 0 6deg,transparent 6deg 12deg);-webkit-mask-image:radial-gradient(circle,#000 15%,transparent 68%);mask-image:radial-gradient(circle,#000 15%,transparent 68%);opacity:.55;transition:transform 1.2s var(--ease)}
.panel.glass:hover::before{transform:rotate(30deg) scale(1.08)}
.panel.intro{flex-basis:min(86vw,520px);justify-content:center;background:none;border:0;box-shadow:none;padding-left:0}
.big-h{font-family:var(--font-head);font-weight:900;font-size:clamp(2.6rem,6vw,5rem);line-height:1.05;margin-bottom:1.4rem}
.devnum{position:absolute;top:1rem;right:1.4rem;font-family:var(--font-head);font-size:clamp(2.4rem,5vw,4rem);color:var(--gold-text);opacity:.55}
.outline{font-family:var(--font-head);font-weight:900;font-size:clamp(3.6rem,11vw,8.5rem);line-height:.95;letter-spacing:-.02em;color:transparent;-webkit-text-stroke:2px var(--text);transition:color .5s,-webkit-text-stroke-color .5s}
.panel:hover .outline{color:var(--accent);-webkit-text-stroke-color:var(--accent)}
.outline.gold{-webkit-text-stroke-color:var(--gold-text)}
.p-line{margin-top:1rem;font-size:1.1rem;color:var(--muted);max-width:26ch}
.panel.final{background:linear-gradient(145deg,color-mix(in srgb,var(--crimson) 35%,var(--card)),var(--card))}
.hscroll.no-pin{height:auto}
.hscroll.no-pin .hscroll-pin{position:static;height:auto;overflow-x:auto;padding:4rem 0;scroll-snap-type:x mandatory}
.hscroll.no-pin .panel{scroll-snap-align:center}

/* Teaser strip */
.strip{background:var(--bg2);padding-bottom:clamp(3rem,8vw,6rem)}
.marquee{overflow:hidden;border-block:1px solid var(--card-b);background:linear-gradient(90deg,var(--crimson-deep),var(--crimson));color:#fff;transform:rotate(-1.2deg) scale(1.03);margin-block:2rem 4rem}
.mq-track{display:flex;width:max-content;gap:2.2rem;padding:1rem 0;font-family:var(--font-head);font-weight:800;font-size:clamp(1.4rem,3.4vw,2.4rem);letter-spacing:.12em;animation:marquee 32s linear infinite}
.mq-track i{font-style:normal;color:var(--gold-soft)}
@keyframes marquee{to{transform:translateX(-50%)}}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.stat{padding:2rem 1.6rem;text-align:center}
.stat .num{font-family:var(--font-head);font-weight:900;font-size:clamp(2.8rem,6vw,4.6rem);line-height:1;background:linear-gradient(120deg,var(--gold-soft),var(--gold) 50%,var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:.6rem}
[data-theme="light"] .stat .num{background:linear-gradient(120deg,#b8741a,#b80f31);-webkit-background-clip:text;background-clip:text}
.stat .num small{font-size:.4em;margin-left:.2em;font-weight:700}
.stat p:last-child{color:var(--muted)}

/* =====================================================================
   GALLERY
   ===================================================================== */
.gallery{padding:clamp(4rem,10vw,9rem) 0;background:linear-gradient(180deg,var(--bg2),var(--bg));overflow:hidden}
.gallery .head{margin-bottom:clamp(2rem,5vw,4rem)}
.carousel{--sw:min(82vw,960px);outline-offset:-4px}
.viewport{overflow:hidden;touch-action:pan-y;cursor:grab;padding:1.5rem 0}
.viewport.drag{cursor:grabbing}
.track{display:flex;gap:clamp(.8rem,2vw,1.6rem);will-change:transform;transition:transform .9s var(--ease)}
.track.dragging{transition:none}
.slide{flex:0 0 var(--sw);margin:0;position:relative;transform:scale(.86);opacity:.45;transition:transform .9s var(--ease),opacity .9s var(--ease);user-select:none;-webkit-user-select:none}
.slide.active{transform:none;opacity:1}
.slide-btn{display:block;width:100%;aspect-ratio:16/10;padding:0;border:0;border-radius:clamp(16px,2.6vw,30px);overflow:hidden;background:var(--bg2);box-shadow:var(--shadow);position:relative}
.slide-btn img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease);-webkit-user-drag:none;user-select:none}
.slide-btn:hover img,.slide-btn:focus-visible img{transform:scale(1.09)}
.slide-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(5,8,25,.78));pointer-events:none}
.slide figcaption{position:absolute;left:clamp(1rem,3vw,2rem);bottom:clamp(.9rem,2.4vw,1.6rem);color:#fff;font-family:var(--font-head);font-weight:700;font-size:clamp(1.1rem,2.6vw,2rem);text-shadow:0 2px 14px rgba(0,0,0,.6);pointer-events:none;z-index:2}
.slide-btn::before{content:"⤢";position:absolute;right:1rem;top:1rem;z-index:2;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.18);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:1.2rem;opacity:0;transform:scale(.7);transition:.4s var(--ease)}
.slide.active .slide-btn:hover::before,.slide.active .slide-btn:focus-visible::before{opacity:1;transform:none}
.car-ui{display:flex;align-items:center;justify-content:center;gap:clamp(.6rem,2vw,1.4rem);margin-top:1.4rem;padding-inline:var(--pad)}
.c-btn{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:1px solid var(--card-b);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .3s,border-color .3s,color .3s}
.c-btn svg{width:22px;height:22px}
.c-btn:hover{background:var(--crimson);border-color:var(--crimson);color:#fff}
.c-btn.play{width:44px;height:44px}.c-btn.play svg{width:16px;height:16px}
.c-btn .i-play{display:none}.c-btn.paused .i-play{display:block}.c-btn.paused .i-pause{display:none}
.dots{display:flex;gap:0;flex-wrap:wrap;justify-content:center;max-width:52vw}
.dots button{width:24px;height:24px;padding:0;border:0;background:none;position:relative;transition:width .5s var(--ease)}
.dots button::before{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;border-radius:10px;transform:translate(-50%,-50%);background:var(--card-b);transition:width .5s var(--ease),background .4s}
.dots button[aria-selected="true"]{width:46px}
.dots button[aria-selected="true"]::before{width:34px;background:linear-gradient(90deg,var(--crimson),var(--gold))}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:30000;background:rgba(3,6,20,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;place-items:center;padding:clamp(3.5rem,6vw,5rem) clamp(.6rem,6vw,6rem);opacity:0;transition:opacity .4s}
.lightbox[hidden]{display:none}
.lightbox.open{opacity:1}
.lb-fig{margin:0;max-width:100%;max-height:100%;display:grid;gap:.9rem;justify-items:center;transform:scale(.94);transition:transform .6s var(--ease)}
.lightbox.open .lb-fig{transform:none}
.lb-fig img{max-width:100%;max-height:78vh;border-radius:14px;box-shadow:0 30px 100px rgba(0,0,0,.6);object-fit:contain}
.lb-fig figcaption{color:#e9e6dd;font-family:var(--font-head);font-size:clamp(1rem,2.4vw,1.5rem);text-align:center}
.lb-close,.lb-nav{position:absolute;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;transition:background .3s}
.lb-close:hover,.lb-nav:hover{background:var(--crimson)}
.lb-close{top:1rem;right:1rem}.lb-prev{left:clamp(.4rem,2vw,1.5rem);top:50%;margin-top:-26px}.lb-next{right:clamp(.4rem,2vw,1.5rem);top:50%;margin-top:-26px}
.lb-close svg,.lb-nav svg{width:22px;height:22px}
body.lb-open{overflow:hidden}

/* =====================================================================
   LAUNCH / COUNTDOWN
   ===================================================================== */
.launch{position:relative;padding:clamp(5rem,12vw,10rem) 0;background:radial-gradient(80% 70% at 50% 0%,color-mix(in srgb,var(--crimson) 28%,var(--bg)),var(--bg) 70%);overflow:hidden}
.launch-glow{position:absolute;left:50%;top:50%;width:min(90vw,900px);aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(circle,color-mix(in srgb,var(--gold) 26%,transparent),transparent 62%);animation:breathe 6s ease-in-out infinite alternate;pointer-events:none}
@keyframes breathe{from{opacity:.5;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1.08)}}
.launch .container{position:relative}
.launch .sec-h{margin-bottom:clamp(2rem,5vw,3.5rem)}
.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(.45rem,2vw,1.5rem);max-width:900px;margin-inline:auto}
.unit{display:flex;flex-direction:column;align-items:center;gap:.8rem}
.unit>span{font-size:clamp(.6rem,1.6vw,.8rem);letter-spacing:.3em;text-transform:uppercase;color:var(--muted);font-weight:600}
.flip{position:relative;width:100%;padding:clamp(1rem,3.4vw,2rem) .2rem;border-radius:clamp(14px,2.4vw,24px);background:linear-gradient(180deg,var(--card),color-mix(in srgb,var(--card) 40%,transparent));border:1px solid var(--card-b);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));font-family:var(--font-head);font-weight:900;font-size:clamp(1.7rem,7.6vw,5.4rem);line-height:1;text-align:center;font-variant-numeric:tabular-nums;color:var(--gold-text);text-shadow:0 0 24px color-mix(in srgb,var(--gold) 55%,transparent);box-shadow:var(--shadow);perspective:600px;overflow:hidden}
[data-theme="dark"] .flip{color:var(--gold-soft)}
.flip::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--card-b);box-shadow:0 1px 0 rgba(0,0,0,.25)}
.flip::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.1),transparent 50%);pointer-events:none}
.flip.tick{animation:flipIn .6s var(--ease)}
@keyframes flipIn{0%{transform:rotateX(-75deg);opacity:.2;filter:brightness(1.8)}100%{transform:none;opacity:1;filter:none}}
.launch-note{margin-top:clamp(2rem,4vw,3rem);color:var(--muted);font-size:1.1rem}

/* =====================================================================
   NOTIFY
   ===================================================================== */
.notify{padding:clamp(3rem,8vw,7rem) 0 clamp(4rem,10vw,8rem);background:var(--bg)}
.notify-card{padding:clamp(2rem,5vw,3.6rem);text-align:center;position:relative;overflow:hidden}
.notify-card .muted{margin:.8rem 0 2rem}
.notify-form{display:flex;gap:.8rem;position:relative}
.notify-form input[type=email]{flex:1;min-width:0;padding:1rem 1.4rem;border-radius:999px;border:1.5px solid var(--card-b);background:color-mix(in srgb,var(--bg) 70%,transparent);color:var(--text);font:inherit;transition:border-color .3s,box-shadow .3s}
.notify-form input::placeholder{color:var(--muted);opacity:.8}
.notify-form input:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 4px color-mix(in srgb,var(--gold) 25%,transparent)}
.notify-form input.err{border-color:var(--crimson);animation:shake .45s}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.hp{position:absolute!important;left:-9999px;opacity:0;height:0;width:0}
.btn.done{background:linear-gradient(135deg,#1f9d63,#157a4b);pointer-events:none;min-width:56px}
.btn.done .b-txt{opacity:0;transform:translateY(-10px)}
.btn.done .b-check{opacity:1;transform:none;transition:.5s var(--ease)}
.btn.done .b-check path{stroke-dashoffset:0;transition:stroke-dashoffset .6s ease .25s}
.b-txt{transition:.3s}
.form-msg{min-height:1.6em;margin-top:1rem;font-size:.95rem;color:var(--muted)}
.form-msg.ok{color:#2fbf7a;font-weight:600}.form-msg.bad{color:var(--accent);font-weight:600}
.contact{margin-top:1.2rem;font-size:.95rem;color:var(--muted)}
.contact a{color:var(--gold-text);font-weight:600;text-underline-offset:4px}
.spark{position:absolute;width:8px;height:8px;border-radius:50%;pointer-events:none;background:var(--c,var(--gold));animation:spark .9s var(--ease) forwards}
@keyframes spark{to{transform:translate(var(--x),var(--y)) scale(0);opacity:0}}

/* Footer */
.footer{background:var(--bg2);padding-bottom:2.5rem}
.footer .dhaka{margin-bottom:2.4rem}
.foot{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;justify-content:space-between;align-items:flex-start}
.f-brand{font-family:var(--font-head);font-weight:900;font-size:1.6rem}
.credits{max-width:56ch}
.credits a{color:var(--gold-text);text-underline-offset:3px}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:900px){
  .story-inner{grid-template-columns:1fr;gap:1rem;text-align:left}
  .story-art{position:absolute;inset:0;opacity:.28;z-index:0;pointer-events:none}
  .mandala.big{width:min(120vw,640px)}
  .story-num{display:none}
  .story-copy{position:relative;z-index:1}
  .nav a:not(.nav-cta){display:none}
  .stats{grid-template-columns:1fr}
}
@media (max-width:560px){
  .nav{display:none}
  .site-header{justify-content:space-between}
  .notify-form{flex-direction:column}
  .btn{width:100%}
  .dots{max-width:40vw}
  .c-btn{width:44px;height:44px}
  .slide-btn::before{opacity:1;transform:none;width:36px;height:36px}
  .eb-line{display:none}
  .soon-pill{letter-spacing:.2em}
}
@media (min-width:1700px){
  .container{width:min(1500px,100% - var(--pad)*2)}
  .carousel{--sw:min(70vw,1180px)}
}

/* Touch / low-power: switch off heavy effects */
@media (hover:none),(pointer:coarse){
  :root{--glass-blur:8px}
  .mist,.sun{filter:none}
  .mist.m2{display:none}
  .slide-btn:hover img{transform:none}
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .mq-track{animation:none}
  .reveal{opacity:1;transform:none}
  .particles,.mist{display:none}
  .loader{display:none}
}