@font-face{font-family:'Bebas Neue';font-style:normal;font-weight:400;font-display:swap;src:url(bebas.woff2) format('truetype')}

/* =========================================================
   BCP — "Sakura" design system
   Pink is home. Orange is the spark. Everything is decorated.
   One stylesheet, no overrides, no patches.
   ========================================================= */
:root{
  /* pink family */
  --pink-50:#fff5fa; --pink-100:#ffe4f1; --pink-200:#ffc9e3;
  --pink-300:#ffa3cd; --pink-400:#ff6fb0; --pink-500:#ff2d9e;
  --pink-600:#e0007e; --pink-700:#b3005f;
  /* orange family */
  --orange-100:#ffeede; --orange-200:#ffd9b8;
  --orange-400:#ffab5c; --orange-500:#ff8a00; --orange-600:#e06e00;
  /* ink */
  --ink:#2a0f21; --ink-2:#4a2440; --mute:#8a6b80; --dim:#b39caa;

  --bg:#fff7fb;
  --card:#ffffff;
  --line:#ffd7ea;
  --line-2:#ffe9f3;

  --grad:linear-gradient(100deg,var(--pink-500),var(--pink-400) 45%,var(--orange-500));
  --grad-soft:linear-gradient(160deg,var(--pink-100),#fff 60%,var(--orange-100));

  --display:'Bebas Neue',Impact,'Arial Narrow',sans-serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,system-ui,sans-serif,
         'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji';
  --deva:'Noto Sans Devanagari','Nirmala UI','Mangal',var(--sans);

  --r-sm:12px; --r:18px; --r-lg:26px; --r-xl:34px;
  --pad:clamp(16px,4vw,40px);
  --max:1200px;
  --ease:cubic-bezier(.22,1,.36,1);
  --sh-1:0 2px 6px rgba(180,60,130,.07), 0 12px 28px -14px rgba(180,60,130,.22);
  --sh-2:0 6px 14px rgba(180,60,130,.10), 0 26px 54px -22px rgba(180,60,130,.34);
}
[data-theme="dark"]{
  --ink:#fff2f9; --ink-2:#ffd9ec; --mute:#c9a3b9; --dim:#9a7a8e;
  --bg:#170a16; --card:#22101f; --line:#3d1c35; --line-2:#2c1428;
  --pink-50:#2a0f26; --pink-100:#3a1030; --pink-200:#521a45;
  --grad-soft:linear-gradient(160deg,#3a1030,#22101f 60%,#2e1410);
  --sh-1:0 12px 28px -18px rgba(0,0,0,.8);
  --sh-2:0 26px 54px -24px rgba(0,0,0,.9);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);color:var(--ink);line-height:1.65;letter-spacing:-.01em;
  background:var(--bg);
  background-image:
    radial-gradient(52% 38% at 8% 4%,var(--pink-100) 0%,rgba(255,228,241,0) 62%),
    radial-gradient(46% 34% at 92% 2%,var(--orange-100) 0%,rgba(255,238,222,0) 60%),
    radial-gradient(50% 36% at 78% 54%,var(--pink-100) 0%,rgba(255,228,241,0) 64%),
    radial-gradient(54% 38% at 16% 88%,var(--orange-100) 0%,rgba(255,238,222,0) 66%);
  background-attachment:scroll;
  -webkit-font-smoothing:antialiased;
  padding-bottom:96px;
}
[data-theme="dark"] body{
  background-image:
    radial-gradient(52% 38% at 8% 4%,#3a1030 0%,rgba(58,16,48,0) 62%),
    radial-gradient(46% 34% at 92% 2%,#3a1a0e 0%,rgba(58,26,14,0) 60%),
    radial-gradient(50% 36% at 78% 54%,#2e1030 0%,rgba(46,16,48,0) 64%);
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--pink-300);color:var(--ink)}

.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.sec{padding-block:clamp(48px,7vw,96px);position:relative}
.sec.alt{background:linear-gradient(180deg,var(--pink-50),transparent 40%,var(--orange-100) 130%)}
[data-theme="dark"] .sec.alt{background:linear-gradient(180deg,#2a0f26,transparent 40%,#2a140e 130%)}
.sec > .wrap{position:relative;z-index:1}

/* ---------- type ---------- */
h1,h2{font-family:var(--display);font-weight:400;line-height:.9;letter-spacing:.01em;text-transform:uppercase}
h1{font-size:clamp(46px,12vw,140px);color:var(--ink)}
h2{font-size:clamp(32px,5.6vw,68px);margin-bottom:12px;position:relative;display:inline-block}
h2::after{
  content:"";display:block;height:6px;margin-top:10px;border-radius:99px;
  background:var(--grad);width:64px;
}
h3{font-family:var(--sans);font-size:clamp(16px,1.9vw,20px);font-weight:800;line-height:1.3;letter-spacing:-.02em}
p{color:var(--mute)}
.kicker{
  display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:800;
  letter-spacing:.2em;text-transform:uppercase;color:var(--pink-600);margin-bottom:14px;
}
.kicker::before{content:"✦";font-size:13px;color:var(--orange-500)}
.sub{font-size:clamp(14px,1.5vw,16px);max-width:60ch;margin-bottom:30px;line-height:1.7}
.small{font-size:12.5px;color:var(--dim)}
.grad-txt{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* Devanagari gets its own face */
html[lang="hi"]{--display:var(--deva)}
html[lang="hi"] h1,html[lang="hi"] h2{text-transform:none;letter-spacing:0;line-height:1.08;font-weight:800}
html[lang="hi"] h1{font-size:clamp(30px,8vw,84px)}
html[lang="hi"] h2{font-size:clamp(24px,5vw,52px)}

/* ---------- decorative petals ---------- */
.petals{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.petal{
  position:absolute;top:-8vh;width:12px;height:12px;border-radius:60% 0 60% 0;
  background:linear-gradient(135deg,var(--pink-300),var(--pink-200));
  opacity:.55;animation:fall linear infinite;
}
[data-theme="dark"] .petal{background:linear-gradient(135deg,var(--pink-500),var(--pink-600));opacity:.35}
@keyframes fall{
  0%{transform:translate3d(0,-10vh,0) rotate(0deg)}
  100%{transform:translate3d(6vw,110vh,0) rotate(420deg)}
}

/* ---------- top bar ---------- */
.strip{height:4px;background:linear-gradient(90deg,var(--pink-500),var(--orange-500),var(--pink-400),var(--pink-500));background-size:300% 100%;animation:stripMove 9s linear infinite}
@keyframes stripMove{to{background-position:300% 0}}
.top{
  position:sticky;top:0;z-index:200;display:flex;align-items:center;gap:12px;
  padding:12px var(--pad);background:rgba(255,247,251,.82);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--line-2);
}
[data-theme="dark"] .top{background:rgba(23,10,22,.82)}
.brand{display:flex;align-items:center;gap:9px;font-family:var(--display);font-size:26px;letter-spacing:.05em;flex:0 0 auto}
.brand img{width:36px;height:36px;border-radius:50%;border:2px solid #fff;box-shadow:var(--sh-1)}
.top nav{display:flex;gap:2px;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:none;justify-content:center}
.top nav::-webkit-scrollbar{display:none}
.top nav a{padding:8px 12px;border-radius:99px;white-space:nowrap;font-size:12.5px;font-weight:700;color:var(--mute);transition:.2s}
.top nav a:hover{color:var(--pink-600);background:var(--pink-100)}
.ctrl{display:flex;align-items:center;gap:8px;flex:0 0 auto;position:relative}
#theme,.langbtn{
  height:38px;border-radius:99px;border:1.5px solid var(--line);background:#fff;cursor:pointer;
  font-size:12.5px;font-weight:800;color:var(--ink);display:inline-flex;align-items:center;justify-content:center;
  box-shadow:var(--sh-1);transition:.25s var(--ease);
}
[data-theme="dark"] #theme,[data-theme="dark"] .langbtn{background:var(--card)}
#theme{width:38px;font-size:15px}
#theme:hover,.langbtn:hover{transform:translateY(-2px) rotate(-3deg);border-color:var(--pink-400)}
.langpick{position:relative}
.langbtn{gap:7px;padding:0 13px}
.langbtn svg{width:14px;height:14px;color:var(--pink-500)}
.langbtn .chev{width:10px;height:10px;transition:transform .25s}
.langpick.open .chev{transform:rotate(180deg)}
.langmenu{
  position:absolute;right:0;top:calc(100% + 9px);min-width:186px;padding:6px;border-radius:20px;
  background:#fff;border:1.5px solid var(--line);box-shadow:var(--sh-2);
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.96);transform-origin:top right;
  transition:.22s var(--ease);z-index:300;
}
[data-theme="dark"] .langmenu{background:var(--card)}
.langpick.open .langmenu{opacity:1;visibility:visible;transform:none}
.langopt{display:flex;align-items:center;justify-content:space-between;width:100%;padding:11px 13px;border:0;border-radius:14px;background:none;color:var(--mute);font-size:13.5px;font-weight:700;cursor:pointer;text-align:left}
.langopt i{font-style:normal;font-size:10px;font-weight:800;opacity:.5;letter-spacing:.1em}
.langopt:hover{background:var(--pink-100);color:var(--pink-700)}
.langopt.on{background:var(--pink-100);color:var(--pink-700)}
.langopt.on::after{content:"✓";color:var(--pink-500);font-weight:900}

.livebar{
  display:flex;align-items:center;justify-content:center;gap:9px;padding:7px var(--pad);
  font-size:10.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--pink-700);background:var(--pink-100);border-bottom:1px solid var(--line);
}
[data-theme="dark"] .livebar{background:#2a0f26;color:var(--pink-300)}
.livebar .dot{width:7px;height:7px;border-radius:50%;background:var(--orange-500);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.6);opacity:.5}}

/* ---------- hero ---------- */
.hero-nf{
  position:relative;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;
  gap:clamp(20px,4vw,54px);padding:clamp(28px,5vw,72px) var(--pad) clamp(32px,5vw,64px);
  max-width:var(--max);margin-inline:auto;
}
.hero-nf .nf-fade{display:none}
.hero-nf .nf-in{position:relative;z-index:2}
.nf-tag{
  display:inline-flex;align-items:center;gap:9px;margin-bottom:16px;padding:7px 14px;border-radius:99px;
  font-size:10px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;
  color:var(--pink-700);background:#fff;border:1.5px solid var(--line);box-shadow:var(--sh-1);
}
[data-theme="dark"] .nf-tag{background:var(--card);color:var(--pink-300)}
.hero-nf h1{margin-bottom:16px;text-wrap:balance}
.hero-nf h1 em{font-style:normal;display:inline-block;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-nf .lead{font-size:clamp(14px,1.6vw,16.5px);max-width:44ch;margin-bottom:26px;line-height:1.75}
.hero-nf .bg{
  width:100%;height:clamp(300px,50vh,520px);object-fit:cover;object-position:60% 30%;
  border-radius:var(--r-xl);border:6px solid #fff;box-shadow:var(--sh-2);transform:rotate(-1.2deg);
  transition:transform .6s var(--ease);
}
[data-theme="dark"] .hero-nf .bg{border-color:var(--card)}
.hero-nf .bg:hover{transform:rotate(0deg) scale(1.01)}
.hero-scroll{display:inline-flex;align-items:center;gap:9px;margin-top:26px;font-size:10px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.hero-scroll i{width:20px;height:32px;border:2px solid var(--line);border-radius:99px;position:relative}
.hero-scroll i::after{content:"";position:absolute;left:50%;top:6px;width:4px;height:7px;margin-left:-2px;border-radius:2px;background:var(--pink-500);animation:dotFall 1.8s infinite}
@keyframes dotFall{0%{transform:translateY(0);opacity:1}70%{transform:translateY(13px);opacity:0}100%{opacity:0}}
@media(max-width:900px){
  
  .hero-nf .bg{order:-1;height:clamp(220px,38vh,340px);transform:none}
}

/* ---------- ticker ---------- */
.ticker{overflow:hidden;border-block:1px solid var(--line);background:#fff;padding-block:12px}
[data-theme="dark"] .ticker{background:var(--card)}
.ticker-track{display:flex;gap:38px;width:max-content;animation:tickerMove 34s linear infinite}
.ticker span{font-family:var(--display);font-size:clamp(16px,2.2vw,26px);letter-spacing:.06em;color:var(--pink-400);display:inline-flex;align-items:center;gap:38px;white-space:nowrap}
.ticker span::after{content:"✿";font-size:.6em;color:var(--orange-400)}
@keyframes tickerMove{to{transform:translateX(-50%)}}

/* ---------- buttons ---------- */
.row{display:flex;flex-wrap:wrap;gap:11px;align-items:center}
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 28px;border-radius:99px;border:0;cursor:pointer;overflow:hidden;
  font-size:14px;font-weight:800;color:#fff;background:var(--grad);
  box-shadow:0 12px 26px -12px rgba(255,45,158,.7);
  transition:transform .3s var(--ease),box-shadow .3s;
}
.btn::after{content:"";position:absolute;inset:0;transform:translateX(-130%);background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transition:transform .7s}
.btn:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 18px 34px -14px rgba(255,45,158,.8)}
.btn:hover::after{transform:translateX(130%)}
.btn:active{transform:scale(.97)}
.btn.ghost{background:#fff;color:var(--pink-600);border:2px solid var(--pink-200);box-shadow:var(--sh-1)}
[data-theme="dark"] .btn.ghost{background:var(--card);color:var(--pink-300);border-color:var(--line)}
.btn.small{padding:10px 18px;font-size:12.5px}

/* ---------- cards ---------- */
.explore{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:14px}
.explore a,.who,.issue,.ld,.tl-item,.result,.note,.box,.leak,.sk-card,.proof,.faq-item{
  position:relative;background:#fff;border:1.5px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh-1);transition:transform .4s var(--ease),box-shadow .4s,border-color .3s;
}
[data-theme="dark"] .explore a,[data-theme="dark"] .who,[data-theme="dark"] .issue,
[data-theme="dark"] .ld,[data-theme="dark"] .tl-item,[data-theme="dark"] .result,
[data-theme="dark"] .note,[data-theme="dark"] .box,[data-theme="dark"] .leak,
[data-theme="dark"] .sk-card,[data-theme="dark"] .proof,[data-theme="dark"] .faq-item{
  background:var(--card);border-color:var(--line);
}
.explore a{padding:24px 22px 20px;display:block}
.explore a::before{
  content:"";position:absolute;inset:0 0 auto 0;height:5px;border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:var(--grad);opacity:.9;
}
.explore a:hover,.who:hover,.issue:hover,.ld:hover,.tl-item:hover,.sk-card:hover{
  transform:translateY(-5px) rotate(-.4deg);box-shadow:var(--sh-2);border-color:var(--pink-300);
}
.explore .num{
  display:inline-block;margin-bottom:9px;padding:4px 11px;border-radius:99px;
  font-family:var(--display);font-size:12px;letter-spacing:.14em;color:#fff;background:var(--grad);
}
.explore b{display:block;font-size:16.5px;font-weight:800;margin-bottom:6px;color:var(--ink)}
.explore span{display:block;font-size:13.5px;color:var(--mute);line-height:1.6}
.explore .yr{margin-top:13px;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--pink-500)}

/* per-card shades, so the grid never looks flat */
.explore a:nth-child(6n+1){background:linear-gradient(165deg,var(--pink-100),#fff 62%)}
.explore a:nth-child(6n+2){background:linear-gradient(165deg,var(--orange-100),#fff 62%)}
.explore a:nth-child(6n+3){background:linear-gradient(165deg,#ffe4f7,#fff 62%)}
.explore a:nth-child(6n+4){background:linear-gradient(165deg,#ffe8dc,#fff 62%)}
.explore a:nth-child(6n+5){background:linear-gradient(165deg,#ffdcec,#fff 62%)}
.explore a:nth-child(6n+6){background:linear-gradient(165deg,#fff0e2,#fff 62%)}
[data-theme="dark"] .explore a{background:var(--card)!important}

/* timeline */
.timeline{display:grid;gap:12px}
.tl-item{padding:22px 24px;border-left:5px solid var(--pink-400)}
.tl-item:nth-child(even){border-left-color:var(--orange-400)}
.tl-year{display:inline-block;font-family:var(--display);font-size:15px;letter-spacing:.14em;color:var(--pink-600);margin-bottom:7px}
[data-theme="dark"] .tl-year{color:var(--pink-300)}
.tl-item h3{margin-bottom:6px}
.tl-item p{font-size:14px;line-height:1.7}
.tl-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}

/* chips */
.chip,.tag,.stickers li,.tags li,.pill,.g,.party,.win,.bad,.tb-item,.sk-chip,.state-strip li{
  display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:99px;
  font-size:11px;font-weight:800;letter-spacing:.04em;list-style:none;
  background:#fff;border:1.5px solid var(--pink-200);color:var(--pink-700);box-shadow:0 3px 8px -4px rgba(180,60,130,.4);
}
[data-theme="dark"] .chip,[data-theme="dark"] .tag,[data-theme="dark"] .tags li,
[data-theme="dark"] .tb-item,[data-theme="dark"] .sk-chip,[data-theme="dark"] .state-strip li{
  background:var(--card);border-color:var(--line);color:var(--pink-300);
}
.win{color:#0f7a4a;border-color:#b6f0d0;background:#eefdf5}
.bad{color:var(--pink-700);border-color:var(--pink-200);background:var(--pink-100)}
.tags,.stickers{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:26px;padding:0}

/* map */
.map-stage{display:flex;justify-content:center;padding:10px 0}
.map-halo{display:none}
.map-box{position:relative;width:min(440px,90vw);padding:16px;border-radius:var(--r-xl);background:#fff;border:1.5px solid var(--line);box-shadow:var(--sh-2)}
[data-theme="dark"] .map-box{background:var(--card)}
.india-map,.map-box svg{width:100%;height:auto;overflow:visible}
.india-map path{fill-opacity:.96;stroke:var(--orange-500);stroke-width:3;stroke-linejoin:round;animation:mapFlow 4.6s linear infinite}
@keyframes mapFlow{from{stroke-dashoffset:var(--len,4000px)}}
.map-name{text-align:center;margin-top:10px;font-family:var(--display);font-size:30px;letter-spacing:.1em;color:var(--ink)}
.map-name small{display:block;font-family:var(--sans);font-size:9.5px;font-weight:800;letter-spacing:.4em;color:var(--dim);margin-top:2px}
.mapmeta{display:flex;border:1.5px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.mapmeta > div{flex:1;padding:14px;text-align:center;border-right:1px solid var(--line-2)}
.mapmeta > div:last-child{border-right:0}
.mapmeta b{display:block;font-family:var(--display);font-size:clamp(22px,3vw,34px);line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.mapmeta span{display:block;margin-top:5px;font-size:9.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}

/* issues */
.issue-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.issue{padding:22px}
.issue.urgent{border-left:5px solid var(--pink-500)}
.issue-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.issue .state{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--pink-600)}
.issue h3{margin-bottom:8px}
.issue p{font-size:13.5px;line-height:1.7}
.issue .next{margin-top:11px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--orange-600)}
.issue.mini{display:block}
.live-stamp{display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:22px;padding:9px 16px;border-radius:99px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--pink-700);background:#fff;border:1.5px solid var(--line);box-shadow:var(--sh-1)}
[data-theme="dark"] .live-stamp{background:var(--card);color:var(--pink-300)}
.live-stamp .dot{width:7px;height:7px;border-radius:50%;background:var(--orange-500);animation:pulse 2s infinite}

/* wire */
.wire{border-radius:var(--r-lg);border:1.5px solid var(--line);background:#fff;overflow:hidden;box-shadow:var(--sh-1)}
[data-theme="dark"] .wire{background:var(--card)}
.wire-head{display:flex;align-items:center;gap:9px;padding:13px 18px;border-bottom:1px solid var(--line-2);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--pink-600)}
.wire-head .dot{width:7px;height:7px;border-radius:50%;background:var(--pink-500);animation:pulse 1.8s infinite}
.wire-refresh{margin-left:auto;padding:6px 12px;border-radius:99px;cursor:pointer;font-size:11px;font-weight:800;border:1.5px solid var(--line);background:var(--pink-50);color:var(--pink-600)}
#wireList{list-style:none;padding:4px 0}
#wireList li{display:flex;gap:12px;justify-content:space-between;align-items:baseline;padding:11px 18px;border-bottom:1px solid var(--line-2)}
#wireList li:last-child{border-bottom:0}
#wireList a{font-size:13.5px;font-weight:700;color:var(--ink)}
#wireList a:hover{color:var(--pink-600)}
#wireList span{font-size:10.5px;color:var(--dim);white-space:nowrap;text-transform:uppercase;letter-spacing:.06em}
.wire-skel{height:12px;margin:10px 18px;border-radius:6px;background:var(--line-2)}
.wire-off{display:block!important;font-size:13px;color:var(--mute);padding:16px 18px!important}

/* leaders */
.leader-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;margin-top:24px}
.ld{padding:22px}
.ld h3{margin-bottom:2px;font-size:18px}
.ld .yrs{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-bottom:12px}
.ld .row2{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.ld dt{font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--pink-600);margin-top:12px}
.ld dt.bad{color:var(--orange-600)}
.ld dd{font-size:13.5px;color:var(--mute);margin-top:4px;line-height:1.65}

/* notes / sources */
.note{padding:20px 22px;margin:22px 0;border-left:5px solid var(--orange-400);font-size:13.5px;line-height:1.75;color:var(--mute)}
.note strong{color:var(--ink)}
.sources{font-size:12.5px;color:var(--mute);margin-top:26px;padding-top:16px;border-top:1px dashed var(--line);line-height:1.9}
.sources a{color:var(--pink-600);text-decoration:underline;text-underline-offset:3px}

/* page head */
.page-head{padding-block:clamp(30px,5vw,60px) 6px}
.crumbs{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:14px}
.crumbs a{color:var(--pink-600)}
.page-head h1{font-size:clamp(38px,8vw,96px);margin-bottom:14px}
.page-head > p{font-size:clamp(14px,1.6vw,16.5px);max-width:66ch;line-height:1.75}

/* elections */
.picker{display:flex;flex-wrap:wrap;gap:6px;margin:20px 0 12px}
.picker button{padding:8px 14px;border-radius:99px;cursor:pointer;font-size:11.5px;font-weight:800;border:1.5px solid var(--line);background:#fff;color:var(--mute);transition:.2s}
[data-theme="dark"] .picker button{background:var(--card)}
.picker button:hover{border-color:var(--pink-400);color:var(--pink-600)}
.picker button[aria-pressed="true"]{background:var(--grad);border-color:transparent;color:#fff}
.result{padding:24px}
.bar-row{display:grid;grid-template-columns:110px 1fr 50px;gap:12px;align-items:center;margin-bottom:9px}
.bar-row .nm{font-size:12.5px;font-weight:800;color:var(--ink)}
.bar-track{display:block;height:10px;border-radius:99px;background:var(--line-2);overflow:hidden}
.bar-fill{display:block;height:100%;border-radius:99px;background:var(--grad);transition:width .8s var(--ease)}
.bar-row .vl{font-size:11.5px;font-weight:800;text-align:right;color:var(--pink-600)}

/* squad */
.squad{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:14px}
.who{padding:24px;display:flex;flex-direction:column;align-items:flex-start}
.who .avatar{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;margin-bottom:13px;background:var(--grad);color:#fff;font-family:var(--display);font-size:20px;letter-spacing:.05em;box-shadow:0 8px 18px -8px var(--pink-500)}
.who h3{font-family:var(--display);font-size:23px;letter-spacing:.02em;margin-bottom:2px}
.who .role{font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--pink-600);margin-bottom:11px}
.who .bio{font-size:13.5px;line-height:1.65;color:var(--mute);margin-bottom:15px;flex:1}
.who .iglink{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:99px;font-size:12px;font-weight:800;color:#fff;background:var(--grad);box-shadow:0 10px 22px -12px var(--pink-500);transition:.25s var(--ease)}
.who .iglink svg{width:14px;height:14px;color:#fff}
.who .iglink:hover{transform:translateY(-2px) scale(1.03)}

/* tabs */
.tabs{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(16px,3vw,34px);align-items:start}
.tablist{display:flex;flex-direction:column;gap:8px}
.tablist button{text-align:left;padding:15px 18px;border-radius:var(--r);background:#fff;border:1.5px solid var(--line);color:var(--mute);font-size:14px;font-weight:800;cursor:pointer;transition:.25s}
[data-theme="dark"] .tablist button{background:var(--card)}
.tablist button:hover{color:var(--pink-600);transform:translateX(3px);border-color:var(--pink-300)}
.tablist button[aria-selected="true"]{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 12px 26px -14px var(--pink-500)}
.panes .pane{display:none;padding:clamp(20px,3vw,28px);border-radius:var(--r-lg);background:#fff;border:1.5px solid var(--line);font-size:clamp(14.5px,1.6vw,17px);line-height:1.75;color:var(--mute);box-shadow:var(--sh-1)}
[data-theme="dark"] .panes .pane{background:var(--card)}
.panes .pane:not([hidden]){display:block;animation:paneIn .45s var(--ease) both}
@keyframes paneIn{from{opacity:0;transform:translateY(10px)}}
@media(max-width:820px){
  .tabs{grid-template-columns:1fr}
  .tablist{flex-direction:row;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
  .tablist::-webkit-scrollbar{display:none}
  .tablist button{white-space:nowrap;padding:10px 14px;font-size:12.5px;flex:0 0 auto}
}

/* join + form */
.join{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,46px);align-items:start}
#pledge{display:grid;gap:5px;padding:clamp(20px,3vw,28px);border-radius:var(--r-xl);background:#fff;border:1.5px solid var(--line);box-shadow:var(--sh-2)}
[data-theme="dark"] #pledge{background:var(--card)}
#pledge h3{font-family:var(--display);font-size:24px;letter-spacing:.04em;margin-bottom:8px}
#pledge label{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:9px}
#pledge input[type=text]{width:100%;padding:13px 15px;border-radius:var(--r);font-size:15px;background:var(--pink-50);border:1.5px solid var(--line);color:var(--ink);transition:.2s}
#pledge input[type=text]:focus{outline:none;border-color:var(--pink-400);box-shadow:0 0 0 4px rgba(255,45,158,.14)}
#pledge .hp{position:absolute!important;left:-9999px!important;opacity:0!important;height:0!important}
#pledge .ck{display:flex;align-items:flex-start;gap:10px;margin:14px 0 4px;font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--mute);cursor:pointer;line-height:1.5}
#pledge .ck input{appearance:none;-webkit-appearance:none;width:22px;height:22px;flex:0 0 auto;margin-top:1px;border-radius:7px;border:2px solid var(--line);background:var(--pink-50);cursor:pointer;position:relative}
#pledge .ck input:checked{background:var(--grad);border-color:transparent}
#pledge .ck input:checked::after{content:"";position:absolute;left:7px;top:3px;width:6px;height:11px;border:2px solid #fff;border-top:0;border-left:0;transform:rotate(42deg)}
#pledge .btn{width:100%;margin-top:8px}
#msg{font-size:13px;font-weight:800;color:var(--pink-600);min-height:18px;text-align:center}
@media(max-width:820px){.join{grid-template-columns:1fr}}

/* success overlay */
.pledge-done{position:fixed;inset:0;z-index:600;display:grid;place-items:center;padding:20px;background:rgba(42,15,33,.6);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;visibility:hidden;transition:.35s}
.pledge-done.on,.pledge-done[aria-hidden="false"]{opacity:1;visibility:visible}
.pd-card{position:relative;width:min(400px,92vw);padding:34px 26px 26px;text-align:center;border-radius:var(--r-xl);background:#fff;border:2px solid var(--line);box-shadow:var(--sh-2);transform:translateY(16px) scale(.96);transition:.45s var(--ease)}
[data-theme="dark"] .pd-card{background:var(--card)}
.pledge-done.on .pd-card,.pledge-done[aria-hidden="false"] .pd-card{transform:none}
.pd-mark{position:relative;width:110px;height:110px;margin:0 auto 18px;display:grid;place-items:center}
.pd-mark svg{width:110px;height:110px;overflow:visible}
.pd-ring{fill:none;stroke:var(--pink-500);stroke-width:4;stroke-linecap:round;stroke-dasharray:314;stroke-dashoffset:314}
.pledge-done.on .pd-ring,.pledge-done[aria-hidden="false"] .pd-ring{animation:ringDraw .9s var(--ease) .1s forwards}
@keyframes ringDraw{}
.pd-tick{fill:none;stroke:var(--orange-500);stroke-width:8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:90;stroke-dashoffset:90}
.pledge-done.on .pd-tick,.pledge-done[aria-hidden="false"] .pd-tick{animation:tickDraw .5s var(--ease) .65s forwards}
@keyframes tickDraw{to{stroke-dashoffset:0}}
.pd-pulse{position:absolute;inset:0;border-radius:50%;border:2px solid var(--pink-400);opacity:0}
.pledge-done.on .pd-pulse,.pledge-done[aria-hidden="false"] .pd-pulse{animation:pulseOut 1.5s var(--ease) .2s}
.pledge-done.on .pd-pulse.d2,.pledge-done[aria-hidden="false"] .pd-pulse.d2{animation-delay:.5s}
@keyframes pulseOut{0%{opacity:.6;transform:scale(.6)}100%{opacity:0;transform:scale(1.7)}}
.pd-title{font-family:var(--display);font-size:30px;letter-spacing:.03em;margin-bottom:6px}
.pd-card p{font-size:14px;line-height:1.6;margin-bottom:18px}
.pd-card .btn{width:100%}
.pd-sparks{position:absolute;inset:0;pointer-events:none}
.pd-spark{position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;background:var(--c,#fff);opacity:0}
.pledge-done.on .pd-spark,.pledge-done[aria-hidden="false"] .pd-spark{animation:sparkFly .9s var(--ease) .7s forwards}
@keyframes sparkFly{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(.2)}}

/* FAQ */
.faq{display:grid;gap:10px;max-width:800px;margin-top:8px}
.faq-item{overflow:hidden;border-radius:var(--r)!important}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 20px;background:none;border:0;cursor:pointer;text-align:left;font-size:15px;font-weight:800;color:var(--ink)}
.faq-q i{font-style:normal;font-size:20px;line-height:1;color:var(--pink-500);transition:transform .3s var(--ease)}
.faq-item.open .faq-q i{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.faq-a p{padding:0 20px 18px;font-size:13.5px;line-height:1.75}

/* serko-style blocks */
.sk-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,4vw,54px);align-items:center}
.sk-chips{display:flex;flex-wrap:wrap;gap:8px}
.sk-stack{display:grid;gap:12px}
.sk-card{padding:17px 19px;border-radius:20px!important}
.sk-row{display:flex;align-items:center;gap:11px}
.sk-row > div{flex:1;min-width:0}
.sk-row b{display:block;font-size:14.5px;font-weight:800;color:var(--ink)}
.sk-row span{display:block;font-size:12px;color:var(--mute);margin-top:1px}
.sk-dot{width:10px;height:10px;border-radius:50%;background:var(--grad);flex:0 0 auto}
.sk-pill{padding:5px 11px;border-radius:99px;font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;background:var(--pink-100);color:var(--pink-700);border:1.5px solid var(--pink-200);white-space:nowrap}
.sk-pill.ok{background:#eefdf5;color:#0f7a4a;border-color:#b6f0d0}
.sk-split{display:flex;margin-top:13px;padding-top:13px;border-top:1px dashed var(--line)}
.sk-split > div{flex:1;text-align:center;border-right:1px solid var(--line-2)}
.sk-split > div:last-child{border-right:0}
.sk-split span{display:block;font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.sk-split b{display:block;margin-top:3px;font-family:var(--display);font-size:23px;line-height:1;color:var(--ink)}
.sk-card.chat{display:grid;gap:9px;padding:15px}
.sk-bubble{border-radius:16px;padding:11px 14px;font-size:13px;line-height:1.55;max-width:92%}
.sk-bubble.me{margin-left:auto;background:var(--grad);color:#fff;font-weight:800;border-bottom-right-radius:5px}
.sk-bubble.bot{background:var(--pink-50);border:1.5px solid var(--line);border-bottom-left-radius:5px}
.sk-bubble.bot b{display:block;color:var(--ink);margin-bottom:3px;font-size:13.5px}
.sk-bubble.bot span{display:block;color:var(--mute)}
.sk-link{display:inline-block;margin-top:7px;font-size:12px;font-weight:800;color:var(--pink-600)}
@media(max-width:900px){.sk-grid{grid-template-columns:1fr}}

/* stats */
.statgrid{display:flex;flex-wrap:wrap;gap:1px;background:var(--line);border:1.5px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.stat{flex:1 1 180px;background:#fff;padding:clamp(20px,3vw,32px);transition:.3s}
[data-theme="dark"] .stat{background:var(--card)}
.stat:hover{background:var(--pink-50)}
.stat b{display:block;font-family:var(--display);font-size:clamp(40px,6vw,74px);line-height:.9;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.stat span{display:block;margin-top:8px;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);line-height:1.5}

/* proof bar */
.proof{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:15px 18px;border-radius:99px}
.proof-avatars{display:flex}
.proof-avatars i{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:12px;font-style:normal;color:#fff;background:var(--grad);border:2px solid #fff;margin-left:-10px}
.proof-avatars i:first-child{margin-left:0}
.proof-txt b{display:block;font-size:13px;font-weight:800;color:var(--ink)}
.proof-txt span{display:block;font-size:11.5px;color:var(--dim)}
.proof-stat{margin-left:auto;text-align:center}
.proof-stat b{display:block;font-family:var(--display);font-size:21px;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.proof-stat span{display:block;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}

/* footer */
footer{position:relative;overflow:hidden;border-top:1.5px solid var(--line);background:linear-gradient(180deg,var(--pink-50),#fff);padding-block:44px 30px}
[data-theme="dark"] footer{background:linear-gradient(180deg,#2a0f26,var(--bg))}
.foot{display:grid;grid-template-columns:1.5fr 1fr;gap:26px;align-items:start}
.foot .flogo{width:46px;height:46px;border-radius:50%;margin-bottom:12px;border:2px solid #fff;box-shadow:var(--sh-1)}
.foot strong{font-family:var(--display);font-size:23px;letter-spacing:.05em}
.foot ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.foot ul a{display:inline-block;padding:7px 13px;border-radius:99px;border:1.5px solid var(--line);background:#fff;font-size:12px;font-weight:800;color:var(--mute);transition:.2s}
[data-theme="dark"] .foot ul a{background:var(--card)}
.foot ul a:hover{color:var(--pink-600);border-color:var(--pink-300);transform:translateY(-2px)}
.pub{grid-column:1/-1;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);padding-top:18px;border-top:1px dashed var(--line)}
.wm{position:absolute;right:-12px;bottom:-40px;font-family:var(--display);font-size:clamp(110px,24vw,260px);line-height:.7;color:var(--pink-100);pointer-events:none;letter-spacing:.02em}
.signature{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:26px 6% 6px}
.signature span{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:7px 14px;border-radius:99px;border:1.5px solid var(--line);color:var(--pink-700);background:#fff}
[data-theme="dark"] .signature span{background:var(--card);color:var(--pink-300)}
.signature .heart{color:var(--pink-500)}

/* tab bar */
.tabbar{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);display:none;gap:2px;padding:6px;z-index:250;border-radius:99px;background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border:1.5px solid var(--line);box-shadow:0 18px 40px -14px rgba(180,60,130,.4)}
[data-theme="dark"] .tabbar{background:rgba(34,16,31,.9)}
.tabbar a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 14px;border-radius:99px;font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);transition:.2s}
.tabbar a b{font-size:15px;line-height:1}
.tabbar a:hover,.tabbar a.on{color:var(--pink-600);background:var(--pink-100)}
@media(max-width:820px){.tabbar{display:flex}.top nav{display:none}body{padding-bottom:104px}}

/* floating */
.fab{position:fixed;right:16px;bottom:20px;width:44px;height:44px;border-radius:50%;z-index:240;cursor:pointer;border:1.5px solid var(--line);background:#fff;color:var(--pink-600);font-size:17px;display:grid;place-items:center;box-shadow:var(--sh-1);opacity:0;transform:translateY(12px) scale(.9);pointer-events:none;transition:.3s var(--ease)}
[data-theme="dark"] .fab{background:var(--card)}
.fab.on{opacity:1;transform:none;pointer-events:auto}
@media(max-width:820px){.fab{bottom:96px}}
.scrollbar{position:fixed;top:0;left:0;height:3px;width:0;background:var(--grad);z-index:400;transition:width .1s linear}

/* reveal */
.rv{opacity:0;transform:translateY(22px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.rv.in{opacity:1;transform:none}
.split-char{display:inline-block;opacity:0;transform:translateY(.45em);animation:charIn .6s var(--ease) forwards}
@keyframes charIn{}
@keyframes heroFade{}

/* misc */
.back-btn{margin-top:32px}
.leak{padding:16px 18px;margin-bottom:10px;border-radius:var(--r)}
.tagline{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.demand-head{text-align:center;margin-bottom:24px}
.demand-head .badge{display:inline-block;margin-bottom:12px;padding:6px 14px;border-radius:99px;font-size:10px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#fff;background:var(--grad)}
.sr,.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}
.native-lang{position:absolute!important;opacity:0!important;width:1px!important;height:1px!important;pointer-events:none!important}
section[id]{scroll-margin-top:88px}
:focus-visible{outline:3px solid var(--pink-400);outline-offset:3px;border-radius:8px}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}.split-char{opacity:1;transform:none}
}

/* the letter-split animation was eating the gradient on the accent word */
.hero-nf h1 em .split-char{
  background:var(--grad);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero-nf h1 em{color:var(--pink-500)}
/* the build badge must not sit on the tab bar */
#bcpBuild{left:auto!important;right:12px!important;bottom:auto!important;top:70px!important;font-size:9px!important;opacity:.75}
@media(max-width:820px){#bcpBuild{top:64px!important}}

/* =========================================================
   FIXES — one card style, real colour, tidy brand, motion
   ========================================================= */

/* 1. every part card looks exactly like Part 1 — no per-card shades */
.explore a{
  background:linear-gradient(160deg,var(--pink-100) 0%,#ffffff 55%,var(--orange-100) 130%) !important;
  border:1.5px solid var(--pink-200) !important;
}
[data-theme="dark"] .explore a{
  background:linear-gradient(160deg,#3d1234 0%,var(--card) 55%,#3a1a10 130%) !important;
  border-color:var(--line) !important;
}
.explore a::before{background:var(--grad) !important;opacity:1}
.explore .num{background:var(--grad) !important;color:#fff !important}
.explore .yr{color:var(--pink-600) !important}
[data-theme="dark"] .explore .yr{color:var(--pink-300) !important}

/* 2. the page is PINK now, not off-white */
body{
  background-color:#ffe9f4 !important;
  background-image:
    radial-gradient(58% 40% at 10% 0%,#ffc9e3 0%,rgba(255,201,227,0) 62%),
    radial-gradient(50% 36% at 94% 4%,#ffd9b8 0%,rgba(255,217,184,0) 60%),
    radial-gradient(54% 38% at 82% 48%,#ffd4ea 0%,rgba(255,212,234,0) 64%),
    radial-gradient(56% 40% at 12% 84%,#ffe0c9 0%,rgba(255,224,201,0) 66%) !important;
}
[data-theme="dark"] body{
  background-color:#1c0a1a !important;
  background-image:
    radial-gradient(58% 40% at 10% 0%,#5a1145 0%,rgba(90,17,69,0) 62%),
    radial-gradient(50% 36% at 94% 4%,#5a2a0e 0%,rgba(90,42,14,0) 60%),
    radial-gradient(54% 38% at 82% 48%,#4a1038 0%,rgba(74,16,56,0) 64%) !important;
}
.sec.alt{background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.2) 50%,rgba(255,217,184,.35)) !important}
[data-theme="dark"] .sec.alt{background:linear-gradient(180deg,#2e1030,#1c0a1a 60%,#2a140e) !important}
footer{background:linear-gradient(180deg,rgba(255,255,255,.7),#ffd9ec) !important}
[data-theme="dark"] footer{background:linear-gradient(180deg,#2e1030,#1c0a1a) !important}
.top{background:rgba(255,233,244,.86) !important}
[data-theme="dark"] .top{background:rgba(28,10,26,.86) !important}

/* 3. brand alignment */
.brand{gap:10px !important;align-items:center !important;line-height:1 !important}
.brand img{width:38px !important;height:38px !important;flex:0 0 38px !important;margin:0 !important}
.brand span{
  display:inline-block !important;line-height:1 !important;
  font-size:27px !important;letter-spacing:.04em !important;
  padding-bottom:2px;
}
.top{align-items:center !important}

/* 4. motion: theme switch, page open, click feedback */
@keyframes pageOpen{from{opacity:0;transform:translateY(10px) scale(.995)}}
main{animation:pageOpen .5s cubic-bezier(.22,1,.36,1) both}

html.theme-switching::before{
  content:"";position:fixed;inset:0;z-index:900;pointer-events:none;
  background:radial-gradient(circle at var(--tx,90%) var(--ty,8%),var(--pink-300) 0%,transparent 70%);
  animation:themeWipe .55s ease-out forwards;
}
@keyframes themeWipe{
  0%{opacity:.9;transform:scale(0);transform-origin:var(--tx,90%) var(--ty,8%)}
  100%{opacity:0;transform:scale(3)}
}

/* click ripple on buttons and cards */
.ripple{position:absolute;border-radius:50%;transform:scale(0);background:rgba(255,255,255,.55);pointer-events:none;animation:rip .6s ease-out forwards}
@keyframes rip{to{transform:scale(2.6);opacity:0}}
.btn,.explore a,.who,.issue,.ld{position:relative;overflow:hidden}
.btn:active{transform:scale(.96)}
.explore a:active,.who:active,.issue:active{transform:scale(.985)}

/* tab bar + language get a spring */
.tabbar a:active{transform:scale(.9)}
.langbtn:active,#theme:active{transform:scale(.92)}

/* =========================================================
   GLASS DASHBOARD — vivid mesh + frosted cards
   Matches the reference: strong gradient sky, white glass,
   floating nav, bento grid, soft shadows.
   ========================================================= */
:root{
  --glass-bg:rgba(255,255,255,.62);
  --glass-bg-2:rgba(255,255,255,.78);
  --glass-brd:rgba(255,255,255,.85);
  --glass-blur:blur(22px) saturate(180%);
  --glass-sh:0 8px 20px rgba(150,40,110,.10), 0 28px 60px -26px rgba(150,40,110,.40);
}
[data-theme="dark"]{
  --glass-bg:rgba(58,20,50,.55);
  --glass-bg-2:rgba(70,26,60,.72);
  --glass-brd:rgba(255,255,255,.14);
  --glass-sh:0 10px 26px rgba(0,0,0,.5), 0 30px 70px -30px rgba(0,0,0,.85);
}

/* the vivid mesh behind everything */
body{
  background-color:#ff5fa2 !important;
  background-image:
    radial-gradient(46% 38% at 6% 2%,#ff2d9e 0%,rgba(255,45,158,0) 62%),
    radial-gradient(40% 34% at 96% 0%,#ff8a00 0%,rgba(255,138,0,0) 60%),
    radial-gradient(44% 36% at 88% 46%,#a855f7 0%,rgba(168,85,247,0) 62%),
    radial-gradient(46% 38% at 8% 72%,#ff6fb0 0%,rgba(255,111,176,0) 64%),
    radial-gradient(50% 40% at 50% 100%,#ffb066 0%,rgba(255,176,102,0) 66%),
    linear-gradient(160deg,#ff4d9d 0%,#ff8a5c 45%,#c86bf5 100%) !important;
  background-attachment:scroll;
}
[data-theme="dark"] body{
  background-color:#2a0a22 !important;
  background-image:
    radial-gradient(46% 38% at 6% 2%,#8a0b52 0%,rgba(138,11,82,0) 62%),
    radial-gradient(40% 34% at 96% 0%,#7a3400 0%,rgba(122,52,0,0) 60%),
    radial-gradient(44% 36% at 88% 46%,#4a1580 0%,rgba(74,21,128,0) 62%),
    radial-gradient(46% 38% at 8% 72%,#5e0b3a 0%,rgba(94,11,58,0) 64%),
    linear-gradient(160deg,#2a0a22 0%,#2e0f1e 55%,#1c0a26 100%) !important;
}

/* floating glass nav */
.strip{height:0;background:none;animation:none}
.top{
  top:10px;margin:10px auto 0;max-width:var(--max);
  width:calc(100% - 24px);border-radius:99px;
  background:var(--glass-bg-2) !important;
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd) !important;
  box-shadow:var(--glass-sh);padding:9px 14px;
}
.top nav a{color:#6b2a4a;font-weight:700}
[data-theme="dark"] .top nav a{color:#ffc2e0}
.top nav a:hover{background:rgba(255,45,158,.16) !important;color:#c2006b !important}
.brand span{color:#3a0f2a}
[data-theme="dark"] .brand span{color:#fff}

/* every card is frosted glass now */
.explore a,.who,.issue,.ld,.tl-item,.result,.note,.box,.leak,.sk-card,
.proof,.faq-item,.stat,.map-box,.wire,.panes .pane,.tablist button,
.live-stamp,.sk-chip,.tb-item,.state-strip li,#pledge,.pd-card{
  background:var(--glass-bg) !important;
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd) !important;
  box-shadow:var(--glass-sh) !important;
  border-radius:24px !important;
}
.explore a{background:var(--glass-bg) !important}
.explore a::before{opacity:0 !important}
.explore a:hover,.who:hover,.issue:hover,.ld:hover,.sk-card:hover{
  background:var(--glass-bg-2) !important;transform:translateY(-4px);
}
[data-theme="dark"] .explore a,[data-theme="dark"] .who,[data-theme="dark"] .issue,
[data-theme="dark"] .ld,[data-theme="dark"] .tl-item,[data-theme="dark"] .result,
[data-theme="dark"] .note,[data-theme="dark"] .box,[data-theme="dark"] .leak,
[data-theme="dark"] .sk-card,[data-theme="dark"] .proof,[data-theme="dark"] .faq-item,
[data-theme="dark"] .stat,[data-theme="dark"] .map-box,[data-theme="dark"] .wire,
[data-theme="dark"] .panes .pane,[data-theme="dark"] .tablist button,
[data-theme="dark"] #pledge{background:var(--glass-bg) !important}

/* section wash off — the mesh should show through */
.sec.alt{background:transparent !important}
footer{background:var(--glass-bg) !important;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-top:1.5px solid var(--glass-brd) !important}

/* hero becomes a bento: text card + image card */
.hero-nf{
  display:grid;grid-template-columns:1.15fr .85fr;gap:16px;
  align-items:stretch;padding:16px var(--pad) 8px;max-width:var(--max);margin-inline:auto;
}
.hero-nf .nf-in{
  background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--glass-brd);box-shadow:var(--glass-sh);
  border-radius:28px;padding:clamp(22px,3.4vw,40px);
  display:flex;flex-direction:column;justify-content:center;
}
.hero-nf .bg{
  border-radius:28px;border:1.5px solid var(--glass-brd) !important;
  box-shadow:var(--glass-sh);transform:none !important;height:100%;min-height:280px;
}
.hero-nf h1{color:#2a0f21}
[data-theme="dark"] .hero-nf h1{color:#fff}
.hero-nf .lead{color:#5c2b45}
[data-theme="dark"] .hero-nf .lead{color:#e3c3d5}
.nf-tag{background:rgba(255,255,255,.8) !important;color:#c2006b !important;border-color:rgba(255,255,255,.9) !important}
.hero-scroll{color:#7a3d5c}
@media(max-width:900px){
  .hero-nf{grid-template-columns:1fr}
  .hero-nf .bg{order:-1;height:clamp(200px,34vh,300px);min-height:0}
}

/* stats row inside glass */
.statgrid{background:transparent !important;border:0 !important;gap:10px !important;border-radius:0 !important;overflow:visible !important}
.stat{flex:1 1 160px;border-radius:20px !important}

/* ticker on glass */
.ticker{background:var(--glass-bg) !important;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-block:1.5px solid var(--glass-brd) !important;border-radius:0}
.ticker span{color:rgba(255,255,255,.9) !important}
[data-theme="light"] .ticker span{color:#a3246b !important}

/* nav pills + tabbar glass */
.tabbar{background:var(--glass-bg-2) !important;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1.5px solid var(--glass-brd) !important}
.langbtn,#theme{background:rgba(255,255,255,.75) !important;border-color:rgba(255,255,255,.9) !important;color:#c2006b !important}
[data-theme="dark"] .langbtn,[data-theme="dark"] #theme{background:rgba(70,26,60,.75) !important;color:#ffc2e0 !important}

/* headings pop on the mesh */
.kicker{color:#fff !important;text-shadow:0 1px 8px rgba(140,0,80,.45)}

h2,.page-head h1{color:#fff !important;text-shadow:0 2px 16px rgba(120,0,70,.4)}
.sub,.page-head > p{color:rgba(255,255,255,.92) !important;text-shadow:0 1px 10px rgba(120,0,70,.35)}
h2::after{background:#fff !important;opacity:.85}
[data-theme="dark"] h2,[data-theme="dark"] .kicker,[data-theme="dark"] .sub{color:#ffe3f1 !important}

/* the floating nav needs breathing room below it */
main{padding-top:8px}
.hero-nf{padding-top:18px !important}
/* badge must not sit on a card title */
#bcpBuild{top:auto !important;bottom:auto !important;right:12px !important;margin-top:-26px;position:relative !important;display:block !important;width:max-content;margin-left:auto;margin-right:12px;z-index:1}
/* ghost button readable in both themes */
.btn.ghost{background:rgba(255,255,255,.86) !important;color:#c2006b !important;border:1.5px solid rgba(255,255,255,.95) !important}
[data-theme="dark"] .btn.ghost{background:rgba(255,255,255,.14) !important;color:#ffd0e8 !important;border-color:rgba(255,255,255,.22) !important}
/* section headings on the mesh stay legible in dark too */
[data-theme="dark"] h2,[data-theme="dark"] .page-head h1{color:#fff !important}

/* =========================================================
   FIXES v5.3
   1. kicker + heading were on one line (overlap)
   2. fixed background made scrolling feel stuck
   3. no visible reaction on click
   4. dark theme contrast
   ========================================================= */

/* 1. stack the kicker above the heading, always */
.kicker{display:flex !important;width:fit-content;margin-bottom:10px !important}
h2{display:block !important;width:auto !important;margin-top:0 !important}
.sec .wrap > h2,.demand-head h2{display:block !important}
.demand-head{text-align:left}
.demand-head .badge{margin-bottom:10px}
.page-head h1{display:block}

/* kicker readable on the bright mesh */
.kicker{color:#fff !important;background:rgba(120,0,70,.30);padding:6px 14px;border-radius:99px;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);text-shadow:none}
.kicker::before{color:#fff !important}
[data-theme="dark"] .kicker{background:rgba(255,255,255,.14)}

/* 2. scrolling: no fixed attachment — the mesh becomes its own fixed layer */
body{background-attachment:scroll !important}
.mesh-fixed{
  position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-color:#ff5fa2;
  background-image:
    radial-gradient(46% 38% at 6% 2%,#ff2d9e 0%,rgba(255,45,158,0) 62%),
    radial-gradient(40% 34% at 96% 0%,#ff8a00 0%,rgba(255,138,0,0) 60%),
    radial-gradient(44% 36% at 88% 46%,#a855f7 0%,rgba(168,85,247,0) 62%),
    radial-gradient(46% 38% at 8% 72%,#ff6fb0 0%,rgba(255,111,176,0) 64%),
    linear-gradient(160deg,#ff4d9d 0%,#ff8a5c 45%,#c86bf5 100%);
}
[data-theme="dark"] .mesh-fixed{
  background-color:#2a0a22;
  background-image:
    radial-gradient(46% 38% at 6% 2%,#8a0b52 0%,rgba(138,11,82,0) 62%),
    radial-gradient(40% 34% at 96% 0%,#7a3400 0%,rgba(122,52,0,0) 60%),
    radial-gradient(44% 36% at 88% 46%,#4a1580 0%,rgba(74,21,128,0) 62%),
    linear-gradient(160deg,#2a0a22 0%,#2e0f1e 55%,#1c0a26 100%);
}
body{background:#ff5fa2 !important}
[data-theme="dark"] body{background:#2a0a22 !important}

/* 3. visible press feedback before anything navigates */
.btn,.explore a,.who,.issue,.ld,.tabbar a,.langbtn,#theme,.picker button,.faq-q{
  transition:transform .16s cubic-bezier(.34,1.56,.64,1), box-shadow .2s, background .2s !important;
  -webkit-tap-highlight-color:transparent;
}
.btn:active,.langbtn:active,#theme:active,.picker button:active{transform:scale(.93) !important}
.explore a:active,.who:active,.issue:active,.ld:active{transform:scale(.975) !important}
.tabbar a:active{transform:scale(.88) !important}
/* the card flashes its accent when tapped */
.explore a:active,.who:active{box-shadow:0 0 0 3px rgba(255,45,158,.55), var(--glass-sh) !important}

/* page enter animation */
@keyframes enterPage{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
main,footer{animation:enterPage .45s cubic-bezier(.22,1,.36,1) both}
footer{animation-delay:.06s}

/* 4. dark theme: cards readable, not muddy */
[data-theme="dark"]{
  --glass-bg:rgba(48,16,42,.72);
  --glass-bg-2:rgba(62,22,54,.85);
  --glass-brd:rgba(255,255,255,.16);
}
[data-theme="dark"] .explore b,
[data-theme="dark"] .sk-row b,
[data-theme="dark"] .who h3,
[data-theme="dark"] .issue h3,
[data-theme="dark"] .ld h3,
[data-theme="dark"] .tl-item h3,
[data-theme="dark"] .faq-q{color:#fff !important}
[data-theme="dark"] .explore span,
[data-theme="dark"] .who .bio,
[data-theme="dark"] .issue p,
[data-theme="dark"] .ld dd,
[data-theme="dark"] .tl-item p{color:#e8c9dd !important}
[data-theme="dark"] .sk-pill,[data-theme="dark"] .issue .pill{
  background:rgba(255,45,158,.22) !important;color:#ffd0e8 !important;border-color:rgba(255,45,158,.4) !important;
}

/* =========================================================
   v5.4 — readability, slogan box, centred footer, LIVE pill
   ========================================================= */

/* ---------- slogan in its own glass box ---------- */
.sloganbox{
  text-align:center;padding:clamp(24px,4vw,40px) clamp(20px,4vw,44px);
  border-radius:28px;background:rgba(70,10,45,.55);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border:1.5px solid rgba(255,255,255,.28);
  box-shadow:0 24px 60px -26px rgba(60,0,40,.7);
}
[data-theme="dark"] .sloganbox{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18)}
.sloganbox .sl-hi{
  font-family:var(--deva);font-size:clamp(24px,5vw,40px);font-weight:800;
  color:#fff;margin-bottom:10px;line-height:1.2;letter-spacing:0;
}
.sloganbox .sl-en{
  font-family:var(--deva);font-size:clamp(13.5px,1.7vw,16.5px);line-height:1.85;
  color:rgba(255,255,255,.94);max-width:62ch;margin-inline:auto;
}

/* ---------- footer: centred, full name + short name ---------- */
footer{padding-block:44px 34px}
.foot{display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px}
.foot-main{display:flex;flex-direction:column;align-items:center}
.foot .flogo{width:58px;height:58px;border-radius:50%;border:2.5px solid #fff;box-shadow:0 10px 26px -12px rgba(140,0,80,.6);margin-bottom:12px}
.foot-name{
  font-family:var(--display);font-size:clamp(24px,4.4vw,34px);letter-spacing:.04em;
  line-height:1.1;color:#3a0f2a;text-transform:uppercase;margin-bottom:4px;
}
[data-theme="dark"] .foot-name{color:#fff}
.foot-short{
  font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:#c2006b;margin-bottom:8px;
}
[data-theme="dark"] .foot-short{color:#ff9ecb}
.foot-tag{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#7a3d5c}
[data-theme="dark"] .foot-tag{color:#d3aec2}
.foot-links{list-style:none;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.foot-links a{
  display:inline-block;padding:8px 15px;border-radius:99px;font-size:12px;font-weight:800;
  background:rgba(255,255,255,.8);border:1.5px solid rgba(255,255,255,.95);
  color:#8a2d63;box-shadow:0 6px 16px -10px rgba(140,0,80,.5);transition:.2s;
}
[data-theme="dark"] .foot-links a{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#ffc2e0}
.foot-links a:hover{transform:translateY(-2px);color:#c2006b}
.pub{
  font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:#7a3d5c;padding-top:16px;border-top:1px solid rgba(255,255,255,.45);
  width:100%;max-width:640px;
}
[data-theme="dark"] .pub{color:#c9a3b9;border-color:rgba(255,255,255,.14)}
.wm{opacity:.5;right:auto;left:50%;transform:translateX(-50%);bottom:-30px}

/* ---------- LIVE pill instead of BUILD ---------- */
#bcpBuild{
  background:linear-gradient(96deg,#ff2d9e,#ff8a00) !important;
  color:#fff !important;font-weight:900 !important;letter-spacing:.14em !important;
  display:inline-flex !important;align-items:center;gap:6px;
  padding:5px 12px 5px 10px !important;
  box-shadow:0 6px 18px -6px rgba(255,45,158,.8) !important;
}
#bcpBuild::before{
  content:"";width:6px;height:6px;border-radius:50%;background:#fff;
  animation:livePulse 1.6s ease-in-out infinite;
}
@keyframes livePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(1.5)}}

/* ---------- readability pass, both themes ---------- */
.sec .sub,.page-head > p{color:#fff !important;text-shadow:0 1px 12px rgba(110,0,65,.5)}
[data-theme="dark"] .sec .sub,[data-theme="dark"] .page-head > p{color:#f0d5e4 !important;text-shadow:0 1px 10px rgba(0,0,0,.6)}
.explore b,.sk-row b,.who h3,.issue h3,.ld h3,.tl-item h3{color:#2a0f21 !important}
[data-theme="dark"] .explore b,[data-theme="dark"] .sk-row b,[data-theme="dark"] .who h3,
[data-theme="dark"] .issue h3,[data-theme="dark"] .ld h3,[data-theme="dark"] .tl-item h3{color:#fff !important}
.explore span,.who .bio,.issue p,.ld dd,.tl-item p,.sk-row span{color:#5c2b45 !important}
[data-theme="dark"] .explore span,[data-theme="dark"] .who .bio,[data-theme="dark"] .issue p,
[data-theme="dark"] .ld dd,[data-theme="dark"] .tl-item p,[data-theme="dark"] .sk-row span{color:#e8c9dd !important}
.explore .yr{color:#c2006b !important}
[data-theme="dark"] .explore .yr{color:#ff9ecb !important}
.issue .state{color:#c2006b !important}
[data-theme="dark"] .issue .state{color:#ff9ecb !important}
.issue .pill,.sk-pill{background:#fff !important;color:#8a2d63 !important;border-color:rgba(255,255,255,.9) !important}
[data-theme="dark"] .issue .pill,[data-theme="dark"] .sk-pill{background:rgba(255,45,158,.24) !important;color:#ffd0e8 !important}
.note{color:#4a2440 !important}
[data-theme="dark"] .note{color:#e8c9dd !important}
.note strong{color:#2a0f21 !important}
[data-theme="dark"] .note strong{color:#fff !important}

/* kill the dead space above the slogan */
.sloganbox{margin-block:0}
.sec:has(.sloganbox){padding-block:clamp(24px,4vw,48px)}
section:empty{display:none}
/* the back-to-top button must not sit on the signature pills */
.fab{bottom:22px}
@media(max-width:820px){.fab{bottom:112px}}
.signature{padding-bottom:14px}
/* slogan sits a little closer to the content around it */
.sloganbox + .sec, .sec + .sloganbox{margin-top:0}

/* ---------- light theme readability pass ---------- */
.sec p,.page-head p,.join > div > p{color:#3f1c30 !important}
[data-theme="dark"] .sec p,[data-theme="dark"] .page-head p{color:#e8c9dd !important}
.sec .wrap > p:not(.kicker):not(.sub){color:#3f1c30 !important}
[data-theme="dark"] .sec .wrap > p:not(.kicker):not(.sub){color:#e8c9dd !important}
.motto,.tagline{color:#7a3d5c !important}
[data-theme="dark"] .motto,[data-theme="dark"] .tagline{color:#d3aec2 !important}
.tablist button{color:#5c2b45 !important}
[data-theme="dark"] .tablist button{color:#e8c9dd !important}
.panes .pane{color:#3f1c30 !important}
[data-theme="dark"] .panes .pane{color:#e8c9dd !important}
.faq-a p{color:#3f1c30 !important}
[data-theme="dark"] .faq-a p{color:#e8c9dd !important}
.sources{color:#5c2b45 !important}
[data-theme="dark"] .sources{color:#d3aec2 !important}
#pledge label{color:#7a3d5c !important}
[data-theme="dark"] #pledge label{color:#c9a3b9 !important}
#pledge .ck{color:#4a2440 !important}
[data-theme="dark"] #pledge .ck{color:#e8c9dd !important}

/* ---------- About / body copy must be readable on the mesh ---------- */
.sec p,.sec li,.sec dd,.sec dt{color:#3d1a2e !important}
[data-theme="dark"] .sec p,[data-theme="dark"] .sec li,[data-theme="dark"] .sec dd{color:#ecd0e0 !important}
#about p,#about li{color:#3d1a2e !important}
[data-theme="dark"] #about p,[data-theme="dark"] #about li{color:#ecd0e0 !important}
#about strong,#about b{color:#1a0a14 !important}
[data-theme="dark"] #about strong,[data-theme="dark"] #about b{color:#fff !important}
.sec .motto,.sec .tagline,.sec .small{color:#7a3d5c !important}
[data-theme="dark"] .sec .motto,[data-theme="dark"] .sec .tagline{color:#d3aec2 !important}

/* ---------- FINAL hard override: body copy on the mesh ---------- */
#about p,#about li,#about span,#about div:not(.kicker),
#join p,#join li,
.sec p,.sec li{
  color:#2f0f22 !important;
}
#about h2,#about h3,#join h2,#join h3{color:#1a0a14 !important}
[data-theme="dark"] #about p,[data-theme="dark"] #join p,[data-theme="dark"] .sec p{color:#f2dcea !important}
[data-theme="dark"] #about h2,[data-theme="dark"] #join h2{color:#fff !important}
/* the tagline line under About */
.motto{color:#7a2d55 !important}
[data-theme="dark"] .motto{color:#e0b8cd !important}

/* =========================================================
   v1.1 — performance + gender-neutral balance
   ========================================================= */

/* ---------- palette: rose + amber + violet, not bubblegum ---------- */
:root{
  --rose:#ff3d8b; --rose-d:#d81b60; --amber:#ff8f1f; --amber-d:#e07000;
  --violet:#7c3aed; --ink2:#1b1020;
  --grad:linear-gradient(100deg,var(--rose),var(--amber));
}
.mesh-fixed{
  background-color:#ff6a4d !important;
  background-image:
    radial-gradient(52% 44% at 8% 2%,#ff3d8b 0%,rgba(255,61,139,0) 64%),
    radial-gradient(46% 40% at 96% 4%,#ff8f1f 0%,rgba(255,143,31,0) 62%),
    radial-gradient(50% 42% at 88% 52%,#7c3aed 0%,rgba(124,58,237,0) 64%),
    radial-gradient(54% 44% at 6% 76%,#ff6a4d 0%,rgba(255,106,77,0) 66%),
    linear-gradient(160deg,#ff4f7d 0%,#ff8f4d 48%,#8b5cf6 100%) !important;
}
[data-theme="dark"] .mesh-fixed{
  background-color:#1a0d1f !important;
  background-image:
    radial-gradient(52% 44% at 8% 2%,#6d0f45 0%,rgba(109,15,69,0) 64%),
    radial-gradient(46% 40% at 96% 4%,#7a3a00 0%,rgba(122,58,0,0) 62%),
    radial-gradient(50% 42% at 88% 52%,#3b1a6e 0%,rgba(59,26,110,0) 64%),
    linear-gradient(160deg,#1a0d1f 0%,#24101c 55%,#150a24 100%) !important;
}

/* ---------- performance ---------- */
/* blur is the single most expensive thing on a phone — keep it only on bars */
@media (max-width: 820px), (prefers-reduced-motion: reduce){
  .explore a,.who,.issue,.ld,.tl-item,.result,.note,.box,.leak,.sk-card,.proof,
  .faq-item,.stat,.map-box,.wire,.panes .pane,.tablist button,#pledge,.pd-card{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
  }
  .petals{display:none}
}
/* let the browser skip work on sections that are far off screen */
.sec{content-visibility:visible}
footer{content-visibility:visible}
/* fewer paint layers */
.explore a,.who,.issue,.ld,.tl-item,.sk-card{will-change:auto}
img{content-visibility:visible}

/* ---------- the version stamp ---------- */
#bcpBuild{background:var(--grad) !important;letter-spacing:.16em !important}

/* hard performance rule: on phones nothing blurs except the two bars */
@media (max-width: 820px){
  *{ -webkit-backdrop-filter:none !important; backdrop-filter:none !important }
  .top,.tabbar{
    -webkit-backdrop-filter:blur(16px) saturate(160%) !important;
    backdrop-filter:blur(16px) saturate(160%) !important;
  }
}

/* split letters must never stay invisible if the animation is skipped */
.split-char{
  display:inline-block;
  opacity:1;
  animation:charIn .55s cubic-bezier(.22,1,.36,1) backwards;
}
@keyframes charIn{
  from{opacity:0;transform:translateY(.4em)}
  to{opacity:1;transform:none}
}
.hero-nf h1{min-height:1em}

/* =========================================================
   v1.2 — spacing, alignment, no version badge
   ========================================================= */

/* 1. the version badge is gone */
#bcpBuild{display:none !important}

/* 2. the footer no longer leaves a huge empty block */
footer{
  padding-block:40px 0 !important;
  overflow:hidden;
  min-height:0 !important;
}
.foot{gap:14px !important;padding-bottom:0 !important}
.foot-main{gap:0}
.foot .flogo{margin-bottom:10px !important}
.foot-name{font-size:clamp(22px,4vw,30px) !important;margin-bottom:2px !important}
.foot-short{margin-bottom:6px !important}
.foot-tag{margin-bottom:2px}
.foot-links{margin-top:2px}
.pub{margin-top:10px;padding-top:14px !important}
/* the watermark must not create height */
.wm{
  position:absolute !important;bottom:-6px !important;left:50% !important;
  transform:translateX(-50%) !important;font-size:clamp(70px,16vw,150px) !important;
  line-height:.7 !important;opacity:.35 !important;pointer-events:none;
}
.signature{
  position:relative;z-index:2;
  padding:14px 6% 22px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));
}
[data-theme="dark"] .signature{background:linear-gradient(180deg,rgba(40,14,34,.6),rgba(40,14,34,0))}
.signature span{padding:6px 12px !important;font-size:10px !important}

/* 3. nothing gets hidden under the sticky header */
section[id],main[id],div[id]{scroll-margin-top:104px}
@media(max-width:820px){section[id],main[id],div[id]{scroll-margin-top:96px}}

/* 4. tighter vertical rhythm on phones */
@media(max-width:820px){
  .sec{padding-block:clamp(34px,6vw,56px) !important}
  h2{margin-bottom:8px !important}
  .sub{margin-bottom:20px !important}
  .explore{gap:11px !important}
  .squad{gap:11px !important}
  .issue-grid{gap:11px !important}
  .timeline{gap:10px !important}
  .statgrid{gap:8px !important}
  .row{gap:9px !important}
  .tags{margin-top:18px !important;gap:7px !important}
  .note{margin:16px 0 !important}
  #join{padding-bottom:40px !important}
}
/* 5. the pledge card must not sit under the tab bar */
#join .join{padding-bottom:8px}
#pledge{padding-bottom:22px !important}
#msg{min-height:14px}

/* the back-to-top button was sitting on the form */
.fab{right:14px !important}
@media(max-width:820px){
  .fab{bottom:150px !important;width:40px !important;height:40px !important;font-size:15px !important;opacity:.9}
}
/* the pledge button must clear the floating tab bar */
@media(max-width:820px){
  #join{padding-bottom:120px !important}
  #pledge{padding-bottom:26px !important}
  #pledge .btn{margin-bottom:8px}
}

/* =========================================================
   v1.3 — footer spacing, festival banner design, clean stack
   ========================================================= */
footer{padding:48px 0 0 !important;display:block}
.foot{display:flex !important;flex-direction:column;align-items:center;text-align:center;gap:0 !important;padding-bottom:26px !important}
.foot-main{display:flex;flex-direction:column;align-items:center;gap:0}
.foot .flogo{margin:0 0 16px !important;width:56px !important;height:56px !important}
.foot-name{margin:0 0 6px !important;line-height:1.15 !important}
.foot-short{margin:0 0 10px !important;letter-spacing:.18em !important}
.foot-tag{margin:0 0 22px !important;font-size:11.5px !important}
.foot-links{display:flex !important;flex-wrap:wrap;justify-content:center;gap:9px !important;margin:0 0 26px !important;padding:0 !important}
.pub{width:100% !important;max-width:560px !important;margin:0 auto !important;padding:22px 0 0 !important;border-top:1px solid rgba(255,255,255,.5) !important;font-size:10px !important;line-height:1.9 !important;letter-spacing:.1em !important}
[data-theme="dark"] .pub{border-top-color:rgba(255,255,255,.14) !important}
.signature{display:flex !important;flex-wrap:wrap;justify-content:center;gap:8px !important;padding:20px 6% 30px !important;margin:0 !important;background:transparent !important;border-top:1px dashed rgba(255,255,255,.45);position:relative;z-index:3}
[data-theme="dark"] .signature{border-top-color:rgba(255,255,255,.12)}
.signature span{padding:7px 14px !important;font-size:10px !important;letter-spacing:.1em !important}
.wm{position:absolute !important;left:50% !important;bottom:44px !important;transform:translateX(-50%) !important;font-size:clamp(60px,13vw,110px) !important;line-height:.8 !important;opacity:.16 !important;z-index:0 !important;pointer-events:none}
@media(max-width:820px){
  footer{padding-bottom:96px !important}
  .foot{padding-bottom:20px !important}
  .signature{padding-bottom:18px !important}
  .wm{bottom:96px !important;opacity:.12 !important}
  .sec{padding-block:clamp(30px,5vw,48px) !important}
}
/* ---------- festival / Diwali banner ---------- */
.festbar,.diwali-note,#festBar{
  display:flex !important;align-items:center;justify-content:center;gap:10px;
  padding:11px 18px !important;margin:8px auto 0 !important;width:calc(100% - 24px);max-width:var(--max);
  border-radius:99px !important;font-size:12px !important;font-weight:800 !important;letter-spacing:.06em !important;
  color:#5a2a00 !important;
  background:linear-gradient(96deg,#fff0c2,#ffd9a0 45%,#ffc2d8) !important;
  border:1.5px solid rgba(255,255,255,.95) !important;
  box-shadow:0 10px 26px -12px rgba(160,80,0,.5), inset 0 1px 0 #fff !important;
  position:relative;overflow:hidden;
}
[data-theme="dark"] .festbar,[data-theme="dark"] .diwali-note,[data-theme="dark"] #festBar{
  background:linear-gradient(96deg,#4a2a08,#5a2a18 50%,#4a1030) !important;
  color:#ffdca8 !important;border-color:rgba(255,200,120,.35) !important;
}
.festbar::after,.diwali-note::after,#festBar::after{
  content:"";position:absolute;top:0;bottom:0;width:40%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  animation:festShine 4.5s ease-in-out infinite;
}
@keyframes festShine{0%{left:-45%}55%,100%{left:115%}}
.festbar b,.diwali-note b,#festBar b{font-weight:900;letter-spacing:.1em}

/* richer festival banner */
.festbar,.diwali-note,#festBar{
  font-size:13px !important;font-weight:900 !important;letter-spacing:.14em !important;
  text-transform:uppercase;padding:13px 20px !important;
  background:linear-gradient(96deg,#fff4d0 0%,#ffdca8 38%,#ffc9dd 72%,#ffe9c4 100%) !important;
  box-shadow:0 12px 30px -12px rgba(180,90,0,.55), inset 0 1px 0 #fff !important;
}
.festbar::before,.diwali-note::before,#festBar::before{
  content:"🪔";font-size:15px;filter:saturate(1.2);
}
/* hero rhythm */
.hero-nf .nf-tag{margin-bottom:14px !important}
.hero-nf h1{margin-bottom:18px !important;line-height:.92 !important}
.hero-nf .lead{margin-bottom:24px !important;line-height:1.72 !important}
.hero-nf .row{gap:11px !important}
/* nothing should sit under the floating tab bar */
@media(max-width:820px){
  .hero-nf{padding-bottom:26px !important}
  .sec:last-of-type{padding-bottom:110px !important}
}

/* hero buttons must clear the floating tab bar */
@media(max-width:820px){
  .hero-nf .nf-in{padding-bottom:34px !important}
  .hero-nf h1{margin-bottom:14px !important}
  .hero-nf .lead{margin-bottom:20px !important}
}

/* =========================================================
   ACTION / REACTION — the page answers back when touched
   ========================================================= */

/* the retired plain banner */
.banner{display:none !important}

/* 1. cards tilt towards the pointer (desktop only) */
.tilt{
  transform-style:preserve-3d;
  transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s !important;
}
@media(hover:hover) and (pointer:fine){
  .tilt:hover{box-shadow:0 26px 56px -24px rgba(120,0,70,.45) !important}
}

/* 2. buttons lean towards the cursor */
.mag{transition:transform .18s cubic-bezier(.34,1.56,.64,1),box-shadow .2s !important}

/* 3. link underline sweep */
.top nav a{position:relative;overflow:hidden}
.top nav a::after{
  content:"";position:absolute;left:12px;right:12px;bottom:5px;height:2px;border-radius:2px;
  background:var(--grad);transform:scaleX(0);transform-origin:left;
  transition:transform .3s cubic-bezier(.22,1,.36,1);
}
.top nav a:hover::after{transform:scaleX(1)}

/* 4. tab bar: the active pill slides */
.tabbar a{position:relative;transition:transform .2s cubic-bezier(.34,1.56,.64,1),color .2s,background .2s !important}
.tabbar a:active b{transform:scale(.85)}
.tabbar a b{transition:transform .2s cubic-bezier(.34,1.56,.64,1)}

/* 5. tap flash on anything clickable */
.tapflash{position:relative;overflow:hidden}
.tapflash::after{
  content:"";position:absolute;inset:0;border-radius:inherit;
  background:radial-gradient(circle at var(--px,50%) var(--py,50%),rgba(255,255,255,.65),transparent 60%);
  opacity:0;pointer-events:none;transition:opacity .5s;
}
.tapflash.hit::after{opacity:1;transition:opacity .08s}

/* 6. toast — every action tells you it happened */
.toast{
  position:fixed;left:50%;bottom:110px;transform:translate(-50%,20px);
  z-index:700;display:flex;align-items:center;gap:9px;
  padding:13px 20px;border-radius:99px;max-width:88vw;
  font-size:13px;font-weight:800;color:#2a0f21;
  background:#fff;border:1.5px solid rgba(255,255,255,.95);
  box-shadow:0 18px 44px -18px rgba(120,0,70,.5);
  opacity:0;visibility:hidden;transition:.32s cubic-bezier(.22,1,.36,1);
}
.toast.on{opacity:1;visibility:visible;transform:translate(-50%,0)}
.toast::before{content:"✓";display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--grad);color:#fff;font-size:11px;font-weight:900;flex:0 0 20px}
[data-theme="dark"] .toast{background:#2a1030;color:#ffe3f1;border-color:rgba(255,255,255,.16)}

/* 7. section heading pops in */
@keyframes headPop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.sec h2.in{animation:headPop .55s cubic-bezier(.22,1,.36,1) both}

/* 8. image gets a gentle lift on tap */
.hero-nf .bg:active{transform:scale(.99) !important}

/* 9. reduced motion — all of it off */
@media (prefers-reduced-motion: reduce){
  .tilt,.mag{transform:none !important}
  .toast{transition:none}
}

/* =========================================================
   FLOATING SOUND BUTTON — one proper control, not a stray corner icon
   ========================================================= */
.snd-fab{
  position:fixed;right:16px;bottom:96px;z-index:260;
  width:46px;height:46px;border-radius:50%;cursor:pointer;
  display:grid;place-items:center;padding:0;
  background:rgba(255,255,255,.92);
  border:1.5px solid rgba(255,255,255,.95);
  color:#c2006b;
  box-shadow:0 10px 26px -10px rgba(140,0,80,.55);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  transition:transform .28s cubic-bezier(.34,1.56,.64,1),box-shadow .25s,color .25s;
}
.snd-fab svg{width:20px;height:20px;stroke-linecap:round;stroke-linejoin:round}
.snd-fab .wave,.snd-fab .wave2{transition:opacity .25s,transform .25s;transform-origin:12px 12px}
.snd-fab:hover{transform:scale(1.08)}
.snd-fab:active{transform:scale(.9)}
.snd-fab.off{color:#9a8b95}
.snd-fab.off .wave{opacity:0;transform:scale(.6)}
.snd-fab.off .wave2{opacity:0;transform:scale(.6)}
.snd-fab.off::after{
  content:"";position:absolute;width:26px;height:2px;border-radius:2px;
  background:currentColor;transform:rotate(-45deg);
}
/* sound on = a soft ring pulse so you know it is live */
.snd-fab:not(.off)::before{
  content:"";position:absolute;inset:-4px;border-radius:50%;
  border:2px solid rgba(255,45,158,.45);
  animation:sndRing 2.4s ease-out infinite;
}
@keyframes sndRing{0%{opacity:.7;transform:scale(.85)}100%{opacity:0;transform:scale(1.35)}}
[data-theme="dark"] .snd-fab{background:rgba(48,16,42,.92);border-color:rgba(255,255,255,.18);color:#ff9ecb}
/* keep it clear of the back-to-top button and the tab bar */
@media(max-width:820px){
  .snd-fab{bottom:150px;right:14px;width:44px;height:44px}
  .fab{bottom:204px !important}
}
/* the old broken corner button is retired */
.sound-btn{display:none !important}

/* =========================================================
   QUALITY PASS — no design change, only polish
   ========================================================= */

/* 1. scroll performance: nothing on the page needs its own layer */
.hero-nf .bg{will-change:auto}
.petals{will-change:auto}

/* 2. cards get a light, compositor-friendly hover (no layout shift) */
.explore a,.who,.issue,.ld,.tl-item,.sk-card{
  transition:box-shadow .22s ease, border-color .22s ease, transform .22s ease;
}

/* 3. long text reads better */
p{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}

/* 4. every tap target is at least 44px (Apple + Google guideline) */
.btn,.tabbar a,.langbtn,#theme,.foot-links a,.picker button{min-height:44px}
.tabbar a{min-height:auto;padding-block:8px}

/* 5. inputs never zoom on iOS (font-size must be 16px+) */
input,select,textarea{font-size:16px}
#pledge input[type=text]{font-size:16px}

/* 6. images never jump the layout */
img{max-width:100%;height:auto}

/* 7. focus is visible for keyboard users only */
:focus{outline:none}
:focus-visible{outline:3px solid var(--rose);outline-offset:2px;border-radius:10px}

/* 8. the floating controls never cover text */
@media(max-width:820px){
  .snd-fab{bottom:150px}
  .fab{bottom:100px}
  #join{padding-bottom:110px}
}

/* 9. smoother font rendering on high-DPI */
@media(-webkit-min-device-pixel-ratio:2){
  body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
}

/* 10. reduced motion: everything settles instantly */
@media (prefers-reduced-motion:reduce){
  .explore a,.who,.issue,.ld,.tl-item,.sk-card{transition:none}
}

/* =========================================================
   SCROLL SAFETY — overlays scroll themselves, never the page
   ========================================================= */
.off{
  position:fixed;inset:0;z-index:700;overflow:auto;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;padding:32px 22px;text-align:center;
  background:linear-gradient(160deg,#ff2d7a,#ff8f1f 55%,#7c3aed);
  color:#fff;
  -webkit-overflow-scrolling:touch;
}
.off img{width:96px;height:96px;border-radius:50%;border:3px solid rgba(255,255,255,.85);margin-bottom:6px}
.off h2{font-family:var(--display);font-size:clamp(28px,6vw,52px);color:#fff;line-height:1.05;text-transform:uppercase}
.off p{color:rgba(255,255,255,.92);font-size:15px;max-width:44ch;line-height:1.7}
.off .countdown{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap;justify-content:center}
.off .countdown > div{min-width:64px;padding:12px 10px;border-radius:16px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3)}
.off .countdown b{display:block;font-family:var(--display);font-size:30px;line-height:1}
.off .countdown span{display:block;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;opacity:.85;margin-top:3px}

.pledge-done{overflow:auto;-webkit-overflow-scrolling:touch}

/* the body must never be left unscrollable */
body{overflow-y:auto !important}