/* ===== Voting Site Mockup : shared styles (RESONATE / ALYA palette) ===== */
:root{
  /* Resonate Technology Software Solutions : brand palette */
  --bg:#1a1405; --bg-2:#0f0c06; --surf:#0F1330; --surf-2:#171208;
  --navy-900:#1a1405; --navy-800:#0f0c06; --navy-700:#171208; --navy-600:#1e180c;
  --card-bg:#15110a; --panel:#0f0c06;
  --text:#F3F6FC; --muted:#A3AEC8; --faint:#7D89A6;
  --line:rgba(255,255,255,.09);
  --cyan:#F6E7B8; --blue:#D4AF37; --lav:#E6C96B; --violet:#C9A227; --mag:#A87E2F; --ok:#22B573;
  /* legacy accent names repointed to brand colours so every rule adopts them */
  --gold:#D4AF37; --gold-2:#F6E7B8; --orange:#A87E2F;
  --grad:linear-gradient(135deg,#F6E7B8,#D4AF37 42%,#E6C96B 76%,#A87E2F);
  --grad-soft:linear-gradient(135deg,#F6E7B8,#E6C96B);
  --radius:16px; --maxw:1200px;
  --sans:"Avenir Next","Avenir","Nunito Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--text);background:var(--navy-900);line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.eyebrow{color:var(--gold);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.82rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--grad);color:#1a1405;font-weight:700;border:0;border-radius:40px;padding:14px 30px;cursor:pointer;font-size:.95rem;box-shadow:0 10px 26px rgba(212,175,55,.35);transition:transform .15s, box-shadow .15s}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(212,175,55,.45)}
.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--line);box-shadow:none}
.section-pad{padding:84px 0}
h1,h2,h3{line-height:1.15;margin:0}
.sec-title{font-size:clamp(1.6rem,3.2vw,2.3rem);font-weight:800}
.sec-sub{color:var(--muted);max-width:720px;margin:14px auto 0}
.center{text-align:center}

/* hexagon motif */
.hex-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hex-bg svg{position:absolute}

/* NAV */
header.nav{position:sticky;top:0;z-index:50;background:rgba(7,5,3,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:78px}
.brand{display:flex;align-items:center;gap:12px}
.brand .mark{width:40px;height:40px}
.brand .name{font-weight:800;letter-spacing:.02em;line-height:1}
.brand .name small{display:block;font-size:.58rem;letter-spacing:.32em;color:var(--muted);font-weight:600;margin-top:3px}
nav.links{display:flex;gap:30px}
nav.links a{font-size:.86rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#e6dcc2;padding:6px 0;position:relative}
nav.links a:hover,nav.links a.active{color:#fff}
nav.links a::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;background:var(--gold);transition:width .2s}
nav.links a:hover::after,nav.links a.active::after{width:100%}
.nav-cta{display:flex;align-items:center;gap:14px}
.burger{display:none;background:none;border:0;color:#fff;font-size:1.5rem;cursor:pointer}
#mmenu{display:none;background:var(--navy-800);border-bottom:1px solid var(--line)}
#mmenu a{display:block;padding:14px 24px;border-top:1px solid var(--line);color:#e6dcc2;text-transform:uppercase;font-size:.85rem;letter-spacing:.05em}

/* page banner (inner pages) */
.page-banner{background:radial-gradient(1000px 420px at 80% -20%,rgba(27,61,110,.9),transparent 60%),linear-gradient(180deg,var(--navy-800),var(--navy-900));border-bottom:1px solid var(--line);overflow:hidden;position:relative}
.page-banner .wrap{padding:66px 24px 58px;position:relative;z-index:2}
.page-banner h1{font-size:clamp(2rem,4.5vw,3.2rem);font-weight:800}
.crumbs{color:var(--muted);font-size:.85rem;margin-top:12px}
.crumbs a:hover{color:var(--gold)}

/* HERO */
.hero{background:radial-gradient(1200px 500px at 85% -10%,rgba(27,61,110,.9),transparent 60%),linear-gradient(180deg,var(--navy-800),var(--navy-900));overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:center;min-height:600px;padding:60px 0;position:relative;z-index:2}
.hero h1{font-size:clamp(2.8rem,6vw,4.6rem);font-weight:800;margin:.3em 0 .1em;letter-spacing:-.01em}
.hero .tag{font-size:clamp(1.3rem,3vw,2rem);font-weight:700;color:#fff}
.hero p.lead{color:var(--muted);max-width:520px;margin:18px 0 30px;font-size:1.02rem}
.devices{position:relative;height:460px}
.devices .laptop-img{position:absolute;right:0;top:40px;width:94%}
.devices .phone-img{position:absolute;left:0;top:30px;width:120px;z-index:3;filter:drop-shadow(0 24px 40px rgba(0,0,0,.5))}
.bubble{position:absolute;right:2%;top:0;background:linear-gradient(135deg,#2b74c9,#5bd0c9);color:#06263f;font-weight:800;font-size:.8rem;line-height:1.45;padding:14px 18px;border-radius:16px 16px 16px 4px;box-shadow:0 16px 30px rgba(0,0,0,.35);text-align:center;z-index:4}
.bubble span{display:block}
.laptop-shell{position:absolute;right:0;top:40px;width:94%}
.laptop-shell img{border-radius:12px;border:8px solid #0a1428;box-shadow:0 30px 60px rgba(0,0,0,.45)}
.laptop-shell .base{height:14px;background:linear-gradient(#c9d2e4,#8a97b4);border-radius:0 0 12px 12px;width:112%;transform:translateX(-5%);border-top:2px solid #6d7a98}

/* TRIVIA */
.trivia{background:linear-gradient(90deg,var(--navy-700),var(--navy-600));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.trivia .inner{display:flex;gap:20px;align-items:center;padding:22px 0}
.trivia .badge{flex:none;background:var(--gold);color:#1a1405;font-weight:800;border-radius:12px;padding:10px 16px;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}
.trivia p{margin:0;color:#eee4ca;font-size:.95rem}

/* EVENTS */
.events-head{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:end;margin-bottom:28px}
.search{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:40px;padding:12px 20px;min-width:300px;color:var(--muted)}
.search input{background:none;border:0;color:var(--text);outline:none;width:100%;font-size:.95rem}
.events-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.ecard{background:var(--card-bg);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .18s,border-color .18s;position:relative}
.ecard:hover{transform:translateY(-4px);border-color:rgba(212,175,55,.5)}
.ecard .thumb{height:160px;position:relative;overflow:hidden}
.ecard .thumb img{width:100%;height:100%;object-fit:cover}
.ecard .sale{position:absolute;top:12px;left:12px;background:var(--orange);color:#fff;font-weight:700;font-size:.68rem;padding:5px 10px;border-radius:20px;letter-spacing:.04em;z-index:2}
.ecard .body{padding:16px 16px 18px}
.ecard h3{font-size:1rem;font-weight:700;margin-bottom:8px}
.ecard p{color:var(--muted);font-size:.82rem;margin:0 0 14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ecard .meta{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:12px}
.ecard .meta .lbl{font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.ecard .meta .date{font-weight:700;color:var(--gold);font-size:.86rem}
.carousel-ctrls{display:flex;gap:10px;justify-content:center;margin-top:30px}
.carousel-ctrls button{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:#fff;font-size:1.1rem;cursor:pointer;transition:background .15s,color .15s}
.carousel-ctrls button:hover{background:var(--gold);color:#1a1405}

/* SPLIT sections */
.split{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.split img{border-radius:18px;border:1px solid var(--line)}
.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}
.feature{display:flex;gap:12px;align-items:flex-start}
.feature .ic{flex:none;width:42px;height:42px;border-radius:10px;background:rgba(212,175,55,.14);display:flex;align-items:center;justify-content:center;color:var(--gold);font-weight:800}
.feature h4{margin:0 0 3px;font-size:.98rem}
.feature p{margin:0;color:var(--muted);font-size:.84rem}

/* generic cards */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:36px}
.card{background:linear-gradient(180deg,#153358,var(--panel));border:1px solid var(--line);border-radius:var(--radius);padding:28px}
.card .ic{width:52px;height:52px;border-radius:14px;background:rgba(212,175,55,.14);color:var(--gold);display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:16px}
.card h3{font-size:1.1rem;margin-bottom:10px}
.card p{color:var(--muted);font-size:.88rem;margin:0}

/* partners */
.logo-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;margin-top:34px}
.logo-grid .lg{background:var(--card-bg);border:1px solid var(--line);border-radius:14px;height:96px;display:flex;align-items:center;justify-content:center;padding:18px}
.logo-grid .lg img{max-height:48px;width:auto;opacity:.85;filter:saturate(.9)}

/* steps */
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:40px}
.step{background:var(--card-bg);border:1px solid var(--line);border-radius:var(--radius);padding:26px;position:relative}
.step::before{counter-increment:s;content:counter(s);position:absolute;top:-16px;left:22px;width:40px;height:40px;border-radius:12px;background:var(--gold);color:#1a1405;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.step h4{margin:14px 0 8px;font-size:1.02rem}
.step p{color:var(--muted);font-size:.86rem;margin:0}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:10px}
.stat{text-align:center;padding:24px;background:var(--card-bg);border:1px solid var(--line);border-radius:var(--radius)}
.stat b{display:block;font-size:2.2rem;font-weight:800;color:var(--gold)}
.stat span{color:var(--muted);font-size:.86rem}

/* policy long text */
.doc{max-width:860px;margin:0 auto}
.doc h3{margin:30px 0 10px;color:#fff}
.doc p{color:var(--muted)}
.accordion{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-top:8px}
.accordion details{border-bottom:1px solid var(--line)}
.accordion details:last-child{border-bottom:0}
.accordion summary{cursor:pointer;padding:18px 22px;font-weight:600;list-style:none;display:flex;justify-content:space-between;align-items:center;background:var(--card-bg)}
.accordion summary::-webkit-details-marker{display:none}
.accordion summary::after{content:"+";color:var(--gold);font-size:1.4rem}
.accordion details[open] summary::after{content:"–"}
.accordion .ac-body{padding:0 22px 20px;color:var(--muted);font-size:.9rem}

/* CTA band */
.cta-band{background:linear-gradient(120deg,var(--navy-600),var(--navy-700));border:1px solid var(--line);border-radius:22px;padding:48px;text-align:center;margin:0 24px}

/* event banner with AI stage background */
.banner-stage{background:linear-gradient(90deg,rgba(8,6,4,.94) 8%,rgba(8,6,4,.72) 48%,rgba(8,6,4,.42) 100%),url('img/hero-stage.png') center/cover no-repeat !important;border-bottom:1px solid var(--line)}

/* EVENT hero (per-event landing) */
.event-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;position:relative;z-index:2}
.event-hero .crest{text-align:center}
.event-hero .crest img{max-width:300px;margin:0 auto;filter:drop-shadow(0 20px 40px rgba(0,0,0,.45))}
.countdown{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap}
.cd-box{background:linear-gradient(180deg,#e9edf5,#aeb9d0);color:#0b1b36;border-radius:12px;min-width:92px;padding:14px 10px;text-align:center;box-shadow:0 10px 22px rgba(0,0,0,.3)}
.cd-box b{display:block;font-size:2.2rem;font-weight:800;line-height:1}
.cd-box span{font-size:.8rem;color:#2a3a5c;font-weight:600}
@media (max-width:860px){.event-hero{grid-template-columns:1fr;text-align:left}.event-hero .crest img{max-width:220px}}

/* VOTE pill on event cards */
.vote-pill{display:inline-block;background:rgba(212,175,55,.16);color:var(--gold);font-weight:700;font-size:.74rem;padding:6px 14px;border-radius:20px}

/* VOTING SYSTEM */
.vote-layout{display:grid;grid-template-columns:1fr 320px;gap:30px;align-items:start}
.vote-cats{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.vote-cats button{background:var(--card-bg);border:1px solid var(--line);color:#e6dcc2;padding:9px 20px;border-radius:30px;font-weight:600;cursor:pointer;font-size:.85rem}
.vote-cats button.active{background:var(--gold);color:#1a1405;border-color:var(--gold)}
.vote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.vcard{background:var(--card-bg);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .15s,border-color .15s}
.vcard:hover{transform:translateY(-4px);border-color:rgba(212,175,55,.5)}
.vthumb{position:relative;aspect-ratio:1/1;overflow:hidden}
.vthumb img{width:100%;height:100%;object-fit:cover}
.vno{position:absolute;top:10px;left:10px;background:rgba(8,6,4,.8);color:#fff;font-weight:800;border-radius:10px;padding:4px 10px;font-size:.8rem;z-index:2}
.vbody{padding:16px}
.vbody h3{font-size:1.02rem}
.vsash{color:var(--muted);font-size:.78rem;display:block;margin:2px 0 12px}
.vbar{height:8px;background:#1b1509;border-radius:6px;overflow:hidden}
.vbar i{display:block;height:100%;background:var(--grad);border-radius:6px;transition:width .4s}
.vrow{display:flex;justify-content:space-between;align-items:center;margin-top:14px}
.vcount{color:var(--muted);font-size:.8rem;font-weight:600}
.vote-btn{padding:9px 18px;font-size:.84rem}
/* leaderboard */
.board{background:var(--card-bg);border:1px solid var(--line);border-radius:var(--radius);padding:22px;position:sticky;top:96px}
.board h3{font-size:1rem;margin-bottom:6px}
.board .sub{color:var(--muted);font-size:.76rem;margin-bottom:14px;display:block}
.board ol{list-style:none;margin:0;padding:0}
.board li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.board li:first-child{border-top:0}
.board .rk{flex:none;width:24px;height:24px;border-radius:7px;background:rgba(212,175,55,.16);color:var(--gold);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:.8rem}
.board li img{width:38px;height:38px;border-radius:9px;object-fit:cover}
.board li b{display:block;font-size:.86rem}
.board li small{color:var(--muted);font-size:.74rem}
/* toast */
.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);background:#1e1709;border:1px solid var(--gold);color:#fff;padding:14px 22px;border-radius:40px;font-size:.9rem;font-weight:600;box-shadow:0 14px 30px rgba(0,0,0,.4);opacity:0;transition:opacity .3s,transform .3s;z-index:100}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:980px){.vote-layout{grid-template-columns:1fr}.vote-grid{grid-template-columns:repeat(2,1fr)}.board{position:static}}
@media (max-width:560px){.vote-grid{grid-template-columns:1fr}}

/* FOOTER */
footer{background:var(--navy-800);border-top:1px solid var(--line);padding:56px 0 28px;margin-top:20px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px}
footer h5{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--gold);margin:0 0 16px}
footer a{display:block;color:var(--muted);font-size:.88rem;padding:5px 0}
footer a:hover{color:#fff}
.foot-bottom{border-top:1px solid var(--line);margin-top:34px;padding-top:20px;display:flex;justify-content:space-between;color:var(--muted);font-size:.8rem;flex-wrap:wrap;gap:10px}
.note{background:#13244a;border:1px dashed rgba(212,175,55,.5);color:#e6dcc2;border-radius:12px;padding:10px 16px;font-size:.78rem;text-align:center;margin:18px auto;max-width:820px}

@media (max-width:980px){
  nav.links{display:none}
  .burger{display:block}
  .hero-grid{grid-template-columns:1fr;min-height:auto}
  .devices{height:380px;margin-top:10px}
  .events-grid{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1fr}.feature-list{grid-template-columns:1fr}
  .card-grid{grid-template-columns:1fr}.logo-grid{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .events-grid{grid-template-columns:1fr}.foot-grid{grid-template-columns:1fr}
  .logo-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:1fr}.stats{grid-template-columns:1fr}
  .nav-cta .btn{display:none}.cta-band{padding:32px 20px}
}

/* ===== VOTE MODAL (simulated payment flow) ===== */
.modal-overlay{position:fixed;inset:0;background:rgba(5,4,2,.74);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;z-index:200;padding:20px}
.modal-overlay.show{display:flex}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:20px;width:100%;max-width:440px;box-shadow:0 30px 70px rgba(0,0,0,.55);overflow:hidden;animation:pop .22s ease}
@keyframes pop{from{transform:translateY(16px) scale(.97);opacity:0}to{transform:none;opacity:1}}
.modal-head{display:flex;align-items:center;gap:14px;padding:20px 22px;border-bottom:1px solid var(--line)}
.modal-head img{width:52px;height:52px;border-radius:12px;object-fit:cover;flex:none}
.modal-head h3{font-size:1.05rem}
.modal-head small{color:var(--muted);font-size:.78rem}
.modal-head .x{margin-left:auto;background:none;border:0;color:var(--muted);font-size:1.5rem;cursor:pointer;line-height:1}
.modal-body{padding:22px}
.modal-body .lab{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.bundles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}
.bundle{background:var(--card-bg);border:1px solid var(--line);border-radius:12px;padding:12px 8px;text-align:center;cursor:pointer;transition:border-color .15s,transform .1s}
.bundle:hover{transform:translateY(-2px)}
.bundle.active{border-color:var(--gold);background:rgba(212,175,55,.12)}
.bundle b{display:block;font-size:1.25rem;color:var(--gold)}
.bundle span{font-size:.74rem;color:var(--muted)}
.pm-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:8px}
.pm{display:flex;align-items:center;gap:10px;background:var(--card-bg);border:1px solid var(--line);border-radius:10px;padding:11px 12px;cursor:pointer;font-weight:600;font-size:.86rem;transition:border-color .15s}
.pm:hover{border-color:rgba(212,175,55,.5)}
.pm.active{border-color:var(--gold);background:rgba(212,175,55,.1)}
.pm .dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--muted);flex:none}
.pm.active .dot{border-color:var(--gold);background:var(--gold)}
.modal-foot{padding:18px 22px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px}
.modal-foot .total{font-size:.82rem;color:var(--muted)}
.modal-foot .total b{display:block;color:var(--text);font-size:1.3rem}
.modal .btn{width:auto}
.pay-processing,.pay-done{text-align:center;padding:36px 22px}
.spinner{width:52px;height:52px;border:4px solid var(--line);border-top-color:var(--gold);border-radius:50%;margin:0 auto 20px;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.pay-done .check{width:64px;height:64px;border-radius:50%;background:rgba(46,204,113,.16);color:#2ecc71;display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto 18px}
.sim-note{font-size:.72rem;color:var(--muted);text-align:center;margin-top:14px;padding:0 22px 20px}

/* ========================================================================
   FUTURISTIC INDEX : "the future platform of voting" (Resonate palette)
   ======================================================================== */
body{background:var(--bg)}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
   radial-gradient(900px 600px at 82% -8%,rgba(212,175,55,.18),transparent 60%),
   radial-gradient(760px 520px at 8% 12%,rgba(230,201,107,.14),transparent 60%),
   radial-gradient(680px 520px at 60% 108%,rgba(168,126,47,.12),transparent 60%);}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.chip{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:600;letter-spacing:.04em;
  color:#dbe6ff;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:40px;padding:7px 16px}
.chip .dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px rgba(246,231,184,.18);animation:pulse 1.8s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 7px rgba(246,231,184,0)}}

/* glass hero */
.fx-hero{position:relative;overflow:hidden;padding:72px 0 86px}
.fx-hero .orb{position:absolute;border-radius:50%;filter:blur(60px);opacity:.5;pointer-events:none}
.fx-hero .orb.a{width:420px;height:420px;background:radial-gradient(circle,#D4AF37,transparent 70%);top:-120px;right:4%}
.fx-hero .orb.b{width:360px;height:360px;background:radial-gradient(circle,#E6C96B,transparent 70%);bottom:-140px;left:-60px}
.fx-hero .orb.c{width:300px;height:300px;background:radial-gradient(circle,#A87E2F,transparent 70%);top:40%;right:38%;opacity:.3}
.fx-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.fx-grid h1{font-size:clamp(2.6rem,6vw,4.4rem);font-weight:800;letter-spacing:-.02em;line-height:1.04;margin:20px 0 0}
.fx-grid .sub{color:var(--muted);font-size:1.08rem;max-width:520px;margin:22px 0 32px}
.fx-cta{display:flex;gap:14px;flex-wrap:wrap}
.fx-trust{display:flex;gap:26px;margin-top:34px;flex-wrap:wrap;color:var(--faint);font-size:.8rem}
.fx-trust b{color:var(--text);display:block;font-size:1.15rem;font-weight:800}
/* glass device panel */
.glass{position:relative;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.12);border-radius:24px;backdrop-filter:blur(14px);
  box-shadow:0 30px 80px rgba(0,0,0,.5);padding:22px}
.glass::after{content:"";position:absolute;inset:0;border-radius:24px;padding:1px;
  background:var(--grad);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:.5;pointer-events:none}
.gpanel-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.gpanel-top .live{display:inline-flex;align-items:center;gap:7px;font-size:.72rem;font-weight:700;color:var(--cyan);text-transform:uppercase;letter-spacing:.08em}
.gpanel-top .live i{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation:pulse 1.6s infinite}
.grow{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid var(--line);margin-bottom:10px}
.grow img{width:46px;height:46px;border-radius:11px;object-fit:cover;flex:none}
.grow .nm{font-weight:700;font-size:.9rem}
.grow .mini{height:6px;border-radius:4px;background:rgba(255,255,255,.08);margin-top:6px;overflow:hidden}
.grow .mini i{display:block;height:100%;background:var(--grad);border-radius:4px}
.grow .pc{margin-left:auto;font-weight:800;font-size:.92rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* stat band */
.statband{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  border:1px solid var(--line);border-radius:20px;padding:30px;margin-top:8px}
.statband .s{text-align:center}
.statband .s b{display:block;font-size:2.3rem;font-weight:800;letter-spacing:-.02em}
.statband .s span{color:var(--muted);font-size:.82rem}

/* future feature grid */
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.fcard{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015));
  border:1px solid var(--line);border-radius:18px;padding:28px;transition:transform .18s,border-color .18s}
.fcard:hover{transform:translateY(-5px);border-color:rgba(212,175,55,.5)}
.fcard .ring{width:54px;height:54px;border-radius:15px;display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;margin-bottom:18px;background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.3)}
.fcard h3{font-size:1.08rem;margin-bottom:9px}
.fcard p{color:var(--muted);font-size:.88rem;margin:0}

/* flow timeline */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px;position:relative}
.flow .node{position:relative;padding:0 18px;text-align:center}
.flow .num{width:58px;height:58px;border-radius:50%;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:1.3rem;color:#1a1405;background:var(--grad);position:relative;z-index:2}
.flow .node:not(:last-child)::after{content:"";position:absolute;top:29px;left:60%;right:-40%;height:2px;
  background:linear-gradient(90deg,var(--blue),var(--lav));opacity:.4;z-index:1}
.flow h4{font-size:1rem;margin-bottom:8px}
.flow p{color:var(--muted);font-size:.84rem;margin:0}

/* showcase rail */
.rail{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.spot{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:3/4;border:1px solid var(--line)}
.spot img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.spot:hover img{transform:scale(1.06)}
.spot .cap{position:absolute;inset:auto 0 0 0;padding:16px;background:linear-gradient(180deg,transparent,rgba(6,5,3,.92));}
.spot .cap b{display:block;font-size:.95rem}
.spot .cap span{color:var(--lav);font-size:.78rem;font-weight:600}

/* big gradient cta */
.fx-cta-band{position:relative;overflow:hidden;border-radius:26px;padding:60px 40px;text-align:center;margin:0 24px;
  background:linear-gradient(135deg,rgba(246,231,184,.14),rgba(230,201,107,.12) 55%,rgba(168,126,47,.14));
  border:1px solid rgba(255,255,255,.14)}
.fx-cta-band h2{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800}
.fx-cta-band p{color:#cdd6f2;max-width:620px;margin:14px auto 28px}

@media (max-width:980px){
  .fx-grid{grid-template-columns:1fr}
  .statband{grid-template-columns:repeat(2,1fr)}
  .fgrid{grid-template-columns:1fr 1fr}
  .flow{grid-template-columns:repeat(2,1fr);gap:28px 0}
  .flow .node:not(:last-child)::after{display:none}
  .rail{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .statband{grid-template-columns:1fr 1fr}.fgrid{grid-template-columns:1fr}.rail{grid-template-columns:1fr 1fr}
}

/* ========================================================================
   LUXURY LAYER : realistic, editorial, premium (Resonate palette, refined)
   ======================================================================== */
:root{
  --serif:"Avenir Next","Avenir","Nunito Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --platinum:#D8DEEC; --ink-soft:#C9D2E3;
}
body{background:#080603}
/* replace neon orbs with a restrained, warm vignette */
body::before{background:
   radial-gradient(1100px 700px at 78% -12%,rgba(212,175,55,.10),transparent 62%),
   radial-gradient(900px 640px at 6% 108%,rgba(230,201,107,.07),transparent 60%);}

/* editorial serif display */
.hero h1,.fx-grid h1,.lux-hero h1,.sec-title,.page-banner h1,.fx-cta-band h2{
  font-family:var(--serif);font-weight:700;letter-spacing:0;line-height:1.08}
.grad-text{font-style:italic}

/* refined labels */
.eyebrow{color:var(--platinum);font-weight:600;letter-spacing:.26em;font-size:.72rem;text-transform:uppercase}
.rule{display:inline-block;width:56px;height:2px;background:var(--grad);border-radius:2px;margin-bottom:20px}

/* refined buttons */
.btn{border-radius:6px;padding:15px 32px;font-weight:600;letter-spacing:.02em;box-shadow:0 12px 34px rgba(212,175,55,.16)}
.btn:hover{box-shadow:0 16px 40px rgba(212,175,55,.26)}
.btn.ghost{border:1px solid rgba(255,255,255,.24);text-transform:uppercase;letter-spacing:.14em;font-size:.76rem;color:var(--platinum)}
.btn.ghost:hover{border-color:var(--platinum);background:rgba(255,255,255,.03)}

/* refined chip */
.chip{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);color:var(--platinum);
  text-transform:uppercase;letter-spacing:.16em;font-size:.68rem;font-weight:600;padding:8px 16px}
.chip .dot{background:var(--lav);box-shadow:0 0 0 4px rgba(230,201,107,.16)}

/* ===== LUXURY HERO (full-bleed photograph) ===== */
.lux-hero{position:relative;min-height:90vh;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--line)}
.lux-hero .bg{position:absolute;inset:0;background:url('img/hero-stage.png') center/cover no-repeat;transform:scale(1.04);animation:kenburns 22s ease-in-out infinite alternate}
@keyframes kenburns{to{transform:scale(1.14)}}
.lux-hero::after{content:"";position:absolute;inset:0;z-index:1;background:
   linear-gradient(90deg,rgba(7,5,3,.97) 0%,rgba(7,5,3,.86) 40%,rgba(7,5,3,.5) 72%,rgba(7,5,3,.3) 100%),
   linear-gradient(0deg,rgba(7,5,3,.9),transparent 45%)}
.lux-hero .wrap{position:relative;z-index:2;width:100%}
.lux-hero .inner{max-width:720px;padding:110px 0}
.lux-hero h1{font-size:clamp(2.9rem,6.2vw,5.2rem);margin:20px 0 0}
.lux-hero h1 em{font-style:italic;color:transparent;background:var(--grad);-webkit-background-clip:text;background-clip:text}
.lux-hero .sub{color:var(--ink-soft);font-size:1.1rem;line-height:1.7;max-width:560px;margin:24px 0 36px;font-weight:300}
.lux-stats{display:flex;gap:50px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.14);padding-top:28px;margin-top:44px}
.lux-stats .s b{font-family:var(--serif);font-size:2rem;font-weight:700;display:block;line-height:1}
.lux-stats .s span{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;margin-top:6px;display:block}

/* ===== refined stat band ===== */
.statband{background:transparent;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;padding:44px 30px}
.statband .s b{font-family:var(--serif);font-weight:700;font-size:2.6rem}
.statband .s span{text-transform:uppercase;letter-spacing:.14em;font-size:.72rem}

/* ===== matte feature cards + line icons ===== */
.fgrid{gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:48px}
.fcard{background:#100d07;border:0;border-radius:0;padding:40px 34px;box-shadow:none;transition:background .2s}
.fcard:hover{background:#131008;transform:none}
.fcard .ring{width:52px;height:52px;border-radius:50%;border:1px solid rgba(230,201,107,.28);background:transparent;color:var(--platinum);margin-bottom:22px}
.fcard .ring svg{width:23px;height:23px;stroke:currentColor;stroke-width:1.4;fill:none}
.fcard h3{font-size:1.08rem;font-weight:600;margin-bottom:10px}
.fcard p{font-size:.9rem;line-height:1.65}

/* ===== flow refined ===== */
.flow .num{font-family:var(--serif);background:transparent;color:var(--platinum);border:1px solid rgba(230,201,107,.3);width:62px;height:62px;font-weight:700}
.flow .node:not(:last-child)::after{top:31px;background:linear-gradient(90deg,rgba(230,201,107,.4),rgba(230,201,107,0));height:1px}
.flow h4{font-family:var(--serif);font-size:1.18rem;font-weight:600}

/* ===== spotlight rail refined ===== */
.spot{border-radius:8px}
.spot .cap b{font-family:var(--serif);font-size:1.15rem;font-weight:600}
.spot .cap span{color:var(--platinum);letter-spacing:.08em;text-transform:uppercase;font-size:.7rem}
.spot::after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.08);border-radius:8px;pointer-events:none}

/* ===== event cards refined ===== */
.ecard{border-radius:10px}
.ecard:hover{border-color:rgba(230,201,107,.35)}
.ecard h3{font-family:var(--serif);font-weight:600}
.ecard .meta .date{color:var(--platinum)}

/* ===== CTA band: photographic ballroom ===== */
.fx-cta-band{border-radius:14px;padding:84px 40px;border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(rgba(7,5,3,.82),rgba(7,5,3,.9)),url('img/hero-lux.jpg') center/cover no-repeat}
.fx-cta-band h2{font-size:clamp(2rem,4.4vw,3rem)}
.fx-cta-band .orb{display:none}

/* floating hero leaderboard : matte luxury card */
.lux-board{position:absolute;right:0;top:50%;transform:translateY(-50%);width:330px;z-index:2;
  background:rgba(10,12,28,.72);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.12);
  border-radius:14px;padding:22px;box-shadow:0 30px 70px rgba(0,0,0,.6)}
.lux-board .bh{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;
  padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.1)}
.lux-board .bh b{font-family:var(--serif);font-size:1.05rem;font-weight:600}
.lux-board .live{font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;color:var(--lav);display:inline-flex;align-items:center;gap:6px}
.lux-board .live i{width:6px;height:6px;border-radius:50%;background:var(--lav);box-shadow:0 0 8px var(--lav);animation:pulse 1.6s infinite}
.lb-row{display:flex;align-items:center;gap:12px;padding:9px 0}
.lb-row img{width:40px;height:40px;border-radius:8px;object-fit:cover}
.lb-row .nm{font-size:.84rem;font-weight:600}
.lb-row .nm small{display:block;color:var(--muted);font-size:.68rem;font-weight:400}
.lb-row .v{margin-left:auto;font-family:var(--serif);font-weight:700;font-size:.95rem;color:var(--platinum)}
@media (max-width:1100px){.lux-board{display:none}}

@media (max-width:980px){
  .lux-hero{min-height:auto}.lux-hero .inner{padding:90px 0}
  .lux-stats{gap:30px}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){.fgrid{grid-template-columns:1fr}.lux-stats .s b{font-size:1.6rem}}

/* marketing hashtag line */
.hashline{margin-top:26px;color:var(--faint);font-size:.74rem;letter-spacing:.06em;font-weight:500}
.hashline:hover{color:var(--muted)}
@media (max-width:560px){.hashline{font-size:.66rem;line-height:1.9}}

/* brand emblem image */
.brand .mark{width:46px;height:46px;object-fit:contain}
.foot-grid .brand .mark{width:44px;height:44px}

/* ===== big hero logo ===== */
.lux-hero .inner{padding:0;max-width:none}
.lux-row{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:40px;padding:96px 0 40px}
.lux-row .inner .sub{max-width:520px}
.hero-logo{position:relative;display:flex;align-items:center;justify-content:center}
.hero-logo img{width:min(42vw,480px);max-width:100%;position:relative;z-index:2;
  filter:drop-shadow(0 24px 70px rgba(212,175,55,.4));animation:floaty 6.5s ease-in-out infinite}
.hero-logo::before{content:"";position:absolute;width:76%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(212,175,55,.35),rgba(246,231,184,.12) 55%,transparent 72%);
  filter:blur(36px);z-index:1;animation:glowpulse 6.5s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-16px)}}
@keyframes glowpulse{50%{opacity:.72;transform:scale(1.06)}}
.lux-hero .lux-stats{margin-top:8px}
@media (max-width:980px){
  .lux-row{grid-template-columns:1fr;padding:80px 0 30px;gap:24px}
  .hero-logo{order:-1}
  .hero-logo img{width:min(64vw,320px)}
}

/* ========================================================================
   HOME PAGE — LUXE ENHANCEMENTS
   ======================================================================== */
/* slim announcement bar */
.topbar{position:relative;z-index:60;text-align:center;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--platinum);background:linear-gradient(90deg,rgba(246,231,184,.08),rgba(230,201,107,.12),rgba(168,126,47,.08));
  border-bottom:1px solid rgba(255,255,255,.08);padding:10px 16px}
.topbar b{color:#fff;font-weight:700}
.topbar .sep{opacity:.45;margin:0 14px}
@media(max-width:620px){.topbar .hideSm{display:none}.topbar .sep{display:none}}

/* hero particle canvas + cursor glow */
.fxcanvas{position:absolute;inset:0;z-index:1;pointer-events:none}
.heroglow{position:absolute;top:0;left:0;width:560px;height:560px;border-radius:50%;z-index:1;pointer-events:none;opacity:0;
  background:radial-gradient(circle,rgba(212,175,55,.20),rgba(230,201,107,.08) 40%,transparent 62%);
  transform:translate(-50%,-50%);transition:opacity .5s;mix-blend-mode:screen;will-change:transform}
.lux-hero .wrap{position:relative;z-index:3}

/* dual orbiting rings around the emblem */
.hero-logo .haloring{position:absolute;width:94%;aspect-ratio:1;border-radius:50%;left:50%;top:50%;
  transform:translate(-50%,-50%) rotate(0deg);transform-origin:center;
  border:1px solid rgba(230,201,107,.22);box-shadow:inset 0 0 60px rgba(212,175,55,.10);z-index:1;animation:orbit 30s linear infinite}
.hero-logo .haloring::before{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;border-radius:50%;
  background:var(--cyan);box-shadow:0 0 16px 3px rgba(246,231,184,.9);transform:translateX(-50%)}
.hero-logo .haloring.two{width:80%;border-color:rgba(168,126,47,.18);animation-duration:24s;animation-direction:reverse}
.hero-logo .haloring.two::before{background:var(--mag);box-shadow:0 0 16px 3px rgba(168,126,47,.85);width:8px;height:8px}
@keyframes orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}

/* shimmering hero accent word */
.lux-hero h1 em{background-size:220% auto;animation:shimmer 7s linear infinite}
@keyframes shimmer{to{background-position:-220% center}}

/* scroll reveal */
.reveal{opacity:0;transform:translateY(32px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* button light sweep */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;z-index:-1;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);transition:left .7s ease}
.btn:hover::after{left:160%}

/* interactive card glow */
.fcard{position:relative;overflow:hidden}
.fcard::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(360px circle at var(--mx,50%) var(--my,0%),rgba(212,175,55,.12),transparent 60%)}
.fcard:hover::after{opacity:1}

/* luxury serif marquee ribbon */
.ribbon{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:linear-gradient(90deg,rgba(255,255,255,.02),transparent 30%,transparent 70%,rgba(255,255,255,.02));
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ribbon .track{display:flex;width:max-content;animation:slide 34s linear infinite;padding:20px 0}
.ribbon:hover .track{animation-play-state:paused}
.ribbon .item{font-family:var(--serif);font-size:1.5rem;font-weight:600;color:var(--platinum);opacity:.55;
  padding:0 40px;display:inline-flex;align-items:center;gap:40px;white-space:nowrap}
.ribbon .item::after{content:"✦";color:var(--lav);font-size:.78rem;opacity:.85}
@keyframes slide{to{transform:translateX(-50%)}}

@media (prefers-reduced-motion:reduce){
  .hero-logo .haloring,.lux-hero h1 em,.ribbon .track,.bg{animation:none}
  .reveal{opacity:1;transform:none;transition:none}
}

/* ========================================================================
   HOME — APPLE-LUXURY REDESIGN (scoped to body.home)
   ======================================================================== */
body.home{background:#070503}
.home{--display:"Inter",-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",system-ui,sans-serif}
.home .ribbon{display:none}                 /* cleaner, focused */
.home .section-pad{padding:100px 0}
/* typography: tight sans */
.home h1,.home h2,.home h3,.home h4,.home .sec-title{font-family:var(--display);letter-spacing:-.03em}
.home .sec-title{font-weight:800;font-size:clamp(2.1rem,4.8vw,3.5rem);line-height:1.04}
.home .sec-sub{font-size:1.12rem;color:var(--muted)}
.home .eyebrow{color:var(--lav);letter-spacing:.16em}
.home .rule{height:3px;width:50px}

/* Apple pill buttons + text links */
.home .btn{border-radius:980px;padding:15px 30px;font-weight:600;letter-spacing:0;font-size:1.02rem;
  text-transform:none;box-shadow:none;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.home .btn:hover{transform:translateY(-1px) scale(1.02);box-shadow:0 14px 38px rgba(212,175,55,.3)}
.home .btn.ghost{background:none;border:0;color:#E6C96B;padding:15px 12px}
.home .btn.ghost::after{content:" ›";font-weight:700}
.home .btn.ghost:hover{background:none;color:#E6C96B;transform:none;box-shadow:none}

/* ===== centered product hero ===== */
.ahero{position:relative;text-align:center;padding:76px 0 36px;overflow:hidden}
.ahero .halo{position:absolute;top:-14%;left:50%;transform:translateX(-50%);width:960px;max-width:150vw;height:680px;z-index:0;pointer-events:none;
  background:radial-gradient(58% 58% at 50% 42%,rgba(212,175,55,.22),rgba(230,201,107,.12) 46%,transparent 70%)}
.ahero>.wrap{position:relative;z-index:2}
.ahero .over{font-size:.82rem;letter-spacing:.24em;text-transform:uppercase;color:var(--lav);font-weight:600;margin-bottom:18px}
.ahero h1{font-size:clamp(2.7rem,7.4vw,5.6rem);font-weight:800;letter-spacing:-.045em;line-height:1.02;margin:0 auto;max-width:16ch}
.ahero h1 .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ahero .sub{color:var(--ink-soft);font-size:clamp(1.08rem,2.1vw,1.4rem);max-width:600px;margin:24px auto 30px;font-weight:400;line-height:1.5}
.ahero .cta{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap}
.ahero .emblem{margin:26px auto 0;width:min(82vw,580px);position:relative;transition:transform .2s ease-out}
.ahero .emblem img{width:100%;filter:drop-shadow(0 30px 50px rgba(0,0,0,.55));animation:floaty 6.5s ease-in-out infinite}
.ahero .emblem .ring{position:absolute;left:50%;top:50%;width:90%;aspect-ratio:1;transform:translate(-50%,-50%);
  border-radius:50%;border:1px solid rgba(230,201,107,.16);animation:orbit 36s linear infinite}

/* ===== bento grid ===== */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:54px}
.bento .b{position:relative;overflow:hidden;border-radius:28px;padding:34px;
  background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.09);box-shadow:0 30px 60px rgba(0,0,0,.28);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .35s}
.bento .b:hover{transform:translateY(-5px);border-color:rgba(212,175,55,.45)}
.bento .b::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(212,175,55,.14),transparent 60%)}
.bento .b:hover::after{opacity:1}
.bento .b .ic{width:50px;height:50px;border-radius:15px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;
  background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.26);color:#E6C96B}
.bento .b .ic svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.5;fill:none}
.bento .b h3{font-size:1.4rem;font-weight:700;letter-spacing:-.02em;margin-bottom:8px}
.bento .b p{color:var(--muted);font-size:.96rem;line-height:1.55;margin:0}
.bento .big{font-size:3.8rem;font-weight:800;letter-spacing:-.03em;line-height:1;margin-bottom:8px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.b1{grid-column:span 3;grid-row:span 2}.b2{grid-column:span 3}.b3{grid-column:span 3}
.b4{grid-column:span 2}.b5{grid-column:span 2}.b6{grid-column:span 2}
.minibars{margin-top:26px;display:flex;flex-direction:column;gap:14px}
.minibars .row{display:flex;align-items:center;gap:14px}
.minibars .row img{width:44px;height:44px;border-radius:12px;object-fit:cover}
.minibars .nm{font-size:.86rem;font-weight:600;width:112px;flex:none}
.minibars .bar{flex:1;height:9px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden}
.minibars .bar i{display:block;height:100%;background:var(--grad);border-radius:6px;width:0;animation:grow 2.2s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes grow{to{width:var(--w)}}

/* home restyle of shared sections */
.home .statband{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:46px 30px}
.home .statband .s b{font-family:var(--display);letter-spacing:-.03em;font-size:2.8rem}
.home .flow h4,.home .spot .cap b,.home .ecard h3{font-family:var(--display)}
.home .ecard,.home .spot{border-radius:22px}
.home .flow .num{font-family:var(--display)}
.home .fx-cta-band{border-radius:40px;padding:84px 40px;border:1px solid rgba(255,255,255,.1);
  background:radial-gradient(120% 130% at 50% 0,rgba(212,175,55,.18),rgba(230,201,107,.06) 45%,transparent 62%),#0d0a05}
.home .fx-cta-band h2{font-size:clamp(2.2rem,5vw,3.6rem);font-weight:800;letter-spacing:-.03em}

@media (max-width:900px){
  .bento{grid-template-columns:1fr 1fr}
  .b1,.b2,.b3,.b4,.b5,.b6{grid-column:span 1;grid-row:auto}
}
@media (max-width:560px){.bento{grid-template-columns:1fr}.minibars .nm{width:auto}}

/* ========================================================================
   VOTING — LIVE COMMAND CENTRE + ACCESSIBILITY
   ======================================================================== */
.cc-head{display:flex;justify-content:space-between;align-items:end;flex-wrap:wrap;gap:14px;margin-bottom:8px}
.cc-note{color:var(--muted);max-width:640px;margin:0 0 22px;font-size:.92rem}
.cc-live{display:inline-flex;align-items:center;gap:7px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--cyan)}
.cc-live i{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation:pulse 1.6s infinite}
.cc-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.cc-tabs button{background:var(--card-bg);border:1px solid var(--line);color:#e6dcc2;padding:10px 18px;border-radius:30px;font-weight:600;cursor:pointer;font-size:.85rem}
.cc-tabs button.active{background:var(--grad);color:#1a1405;border-color:transparent}
.cc-panel{display:none}.cc-panel.active{display:block}
.cc-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.panelcard{background:var(--card-bg);border:1px solid var(--line);border-radius:16px;padding:20px}
.panelcard h4{font-size:.98rem;margin-bottom:4px}
.panelcard .sub{color:var(--muted);font-size:.76rem;display:block;margin-bottom:16px}
/* channel badges */
.chbadge{display:inline-flex;align-items:center;gap:5px;font-size:.66rem;font-weight:700;padding:3px 9px;border-radius:20px}
.chbadge.web{background:rgba(212,175,55,.16);color:#E6C96B}
.chbadge.wa{background:rgba(37,211,102,.16);color:#43e089}
.chbadge.ms{background:rgba(0,132,255,.2);color:#5aa9ff}
.chdot{width:8px;height:8px;border-radius:50%;flex:none}
.chdot.web{background:#D4AF37}.chdot.wa{background:#25D366}.chdot.ms{background:#0084FF}
/* feeds */
.feed{max-height:380px;overflow:auto;display:flex;flex-direction:column;gap:10px}
.feed .ev{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02);animation:slideIn .4s ease}
@keyframes slideIn{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}
.feed .ev img{width:38px;height:38px;border-radius:9px;object-fit:cover;flex:none}
.feed .ev .t{font-size:.84rem;font-weight:500}
.feed .ev .m{color:var(--muted);font-size:.72rem;margin-top:3px;display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.feed .ev .when{margin-left:auto;color:var(--faint);font-size:.68rem;white-space:nowrap;align-self:flex-start}
/* demographics */
.demorow{display:flex;align-items:center;gap:12px;margin-bottom:13px}
.demorow:last-child{margin-bottom:0}
.demorow .lab{width:118px;font-size:.8rem;flex:none;color:#e6dcc2}
.demorow .bar{flex:1;height:10px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden}
.demorow .bar i{display:block;height:100%;background:var(--grad);border-radius:6px;transition:width .6s cubic-bezier(.2,.7,.2,1)}
.demorow .val{width:46px;text-align:right;font-size:.78rem;color:var(--muted);flex:none}
/* candidate alerts */
.alert{display:flex;gap:12px;align-items:flex-start;padding:13px 14px;border:1px solid var(--line);border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.01));animation:slideIn .4s ease}
.alert .ava{width:42px;height:42px;border-radius:11px;object-fit:cover;flex:none}
.alert .body b{font-size:.88rem}.alert .body p{color:var(--muted);font-size:.78rem;margin:3px 0 0}
.alert .when{margin-left:auto;color:var(--faint);font-size:.68rem;white-space:nowrap}
.alert-select{background:var(--card-bg);border:1px solid var(--line);color:#fff;border-radius:10px;padding:9px 12px;font-size:.84rem;font-weight:600;cursor:pointer}
/* accessibility FAB + panel */
.a11y-fab{position:fixed;right:22px;bottom:22px;z-index:140;width:58px;height:58px;border-radius:50%;border:0;cursor:pointer;
  background:var(--grad);color:#1a1405;font-size:1.6rem;box-shadow:0 12px 30px rgba(212,175,55,.4);display:flex;align-items:center;justify-content:center}
.a11y-fab:hover{transform:scale(1.05)}
.a11y-panel{position:fixed;right:22px;bottom:92px;z-index:140;width:304px;background:var(--panel);border:1px solid var(--line);
  border-radius:18px;padding:20px;box-shadow:0 24px 60px rgba(0,0,0,.55);display:none}
.a11y-panel.open{display:block;animation:pop .22s ease}
.a11y-panel h4{font-size:1.02rem;margin-bottom:4px}
.a11y-panel .sub{color:var(--muted);font-size:.74rem;display:block;margin-bottom:12px}
.a11y-opt{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.a11y-opt .nm{font-size:.86rem;font-weight:600}
.a11y-opt .nm small{display:block;color:var(--muted);font-weight:400;font-size:.72rem;margin-top:2px}
.switch{width:46px;height:27px;border-radius:20px;background:rgba(255,255,255,.14);position:relative;cursor:pointer;flex:none;transition:background .2s}
.switch.on{background:#D4AF37}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:21px;height:21px;border-radius:50%;background:#fff;transition:left .2s}
.switch.on::after{left:22px}
.a11y-btn{width:100%;margin-top:12px;padding:11px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:#fff;font-weight:600;cursor:pointer;font-size:.84rem}
.a11y-btn:hover{border-color:rgba(212,175,55,.5)}
/* high-contrast + large-text modes */
body.a11y-contrast{--muted:#d9e3f6;--faint:#d6c9a6}
body.a11y-contrast .vcard,body.a11y-contrast .panelcard,body.a11y-contrast .board,body.a11y-contrast .ecard{border-color:rgba(255,255,255,.42)}
body.a11y-contrast .vsash,body.a11y-contrast .vcount{color:#e8dfc6}
body.a11y-large{font-size:118%}
.vcard[tabindex]:focus{outline:3px solid var(--cyan);outline-offset:3px}
@media(max-width:860px){.cc-grid{grid-template-columns:1fr}}

/* per-candidate demographics link on vote cards */
.demo-link{background:none;border:0;color:#E6C96B;font-size:.76rem;font-weight:600;cursor:pointer;padding:0;margin-top:10px;display:inline-block}
.demo-link:hover{color:#E6C96B;text-decoration:underline}

/* ===== candidate profile modal (individual demographics) ===== */
.vcard{cursor:pointer}
.modal.profile{max-width:580px;position:relative}
.modal.profile .x{position:absolute;top:14px;right:16px;background:none;border:0;color:#fff;font-size:1.7rem;line-height:1;cursor:pointer;z-index:3;opacity:.8}
.modal.profile .x:hover{opacity:1}
.prof-head{display:flex;gap:18px;align-items:center;padding:28px 24px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(212,175,55,.10),rgba(230,201,107,.04) 60%,transparent)}
.prof-head img{width:96px;height:96px;border-radius:18px;object-fit:cover;flex:none;border:1px solid rgba(255,255,255,.14)}
.prof-rank{display:inline-block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:var(--lav);background:rgba(230,201,107,.16);padding:4px 11px;border-radius:20px;margin-bottom:8px}
.prof-head h3{font-size:1.45rem;font-weight:700}
.prof-head small{color:var(--muted);display:block;margin-top:3px}
.prof-votes{margin-top:12px;font-size:1.4rem;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.prof-votes span{font-size:.82rem;color:var(--muted);-webkit-text-fill-color:var(--muted);font-weight:500}
.prof-body{padding:24px;max-height:48vh;overflow:auto}
.prof-sub{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:0 0 18px}
.prof-demo{margin-bottom:24px}
.prof-demo:last-child{margin-bottom:0}
.prof-demo h4{font-size:.95rem;margin-bottom:14px}
.prof-two{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.prof-two .prof-demo{margin-bottom:0}
.prof-foot{padding:18px 24px;border-top:1px solid var(--line);text-align:right}
@media(max-width:560px){.prof-two{grid-template-columns:1fr;gap:20px}.prof-head{flex-direction:column;text-align:center}}

/* ========================================================================
   GLOBAL CORPORATE-LUXURY SYSTEM  (all pages / tabs)
   home page keeps its own more-specific .home rules
   ======================================================================== */
:root{--display-sans:"Avenir Next","Avenir","Nunito Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
body{background:#070503}
/* clean corporate typography (overrides the serif luxury layer on inner pages) */
h1,h2,h3,h4,.sec-title,.page-banner h1,.hero h1,.event-hero h1{font-family:var(--display-sans);letter-spacing:-.03em}
.sec-title{font-weight:800;font-size:clamp(2rem,4.6vw,3.2rem);line-height:1.05}
.eyebrow{color:var(--lav);letter-spacing:.2em;font-weight:600}
.sec-sub{color:var(--muted)}

/* refined pill buttons + corporate outline ghost */
.btn{border-radius:980px;padding:14px 28px;font-weight:600;letter-spacing:0;text-transform:none;box-shadow:none;
  transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.btn:hover{transform:translateY(-1px) scale(1.02);box-shadow:0 12px 30px rgba(212,175,55,.26)}
.btn.ghost{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.2);color:#F2EAD6;text-transform:none;letter-spacing:0}
.btn.ghost:hover{border-color:var(--platinum);background:rgba(255,255,255,.07)}

/* corporate page header */
.page-banner{background:radial-gradient(900px 520px at 72% -25%,rgba(212,175,55,.15),transparent 60%),radial-gradient(700px 420px at 10% 120%,rgba(230,201,107,.08),transparent 60%),#0a0805 !important;border-bottom:1px solid var(--line)}
.page-banner .wrap{padding:86px 24px 74px}
.page-banner h1{font-size:clamp(2.4rem,5.2vw,3.7rem);font-weight:800}
.page-banner .eyebrow{display:block;margin-bottom:14px}
.crumbs a:hover{color:var(--lav)}

/* matte-glass cards & tiles */
.card,.step,.stat,.logo-grid .lg{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);border-radius:22px;box-shadow:0 26px 54px rgba(0,0,0,.26)}
.card{padding:34px;transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s}
.card:hover{transform:translateY(-5px);border-color:rgba(212,175,55,.42)}
.card h3,.step h4{letter-spacing:-.01em}
.card .ic,.feature .ic{background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.26);color:#E6C96B;border-radius:14px}
.step{padding:30px;transition:border-color .3s}
.step:hover{border-color:rgba(212,175,55,.42)}
.step::before{background:var(--grad);color:#1a1405;border-radius:14px;font-weight:800}
.stat{padding:30px;border-radius:22px}
.stat b{font-weight:800;letter-spacing:-.03em;font-size:2.4rem}
.logo-grid .lg{border-radius:18px;transition:border-color .3s}
.logo-grid .lg:hover{border-color:rgba(212,175,55,.4)}
.split img{border-radius:22px}
.feature .ic{border-radius:13px}

/* accordion (policy) */
.accordion{border-radius:18px;overflow:hidden;border-color:var(--line)}
.accordion summary{background:rgba(255,255,255,.03);font-weight:600}
.accordion summary::after{color:var(--lav)}

/* refined CTA band */
.cta-band{border-radius:34px;border:1px solid rgba(255,255,255,.1);
  background:radial-gradient(120% 140% at 50% 0,rgba(212,175,55,.16),rgba(230,201,107,.06) 48%,transparent 62%),#0d0a05}
.cta-band .sec-title{font-weight:800}

/* event / voting banner refinements */
.ecard{border-radius:18px}
.ecard .meta .date{color:var(--lav)}
.banner-stage{background:linear-gradient(90deg,rgba(7,5,3,.97) 6%,rgba(7,5,3,.86) 46%,rgba(7,5,3,.62) 100%),linear-gradient(0deg,rgba(7,5,3,.92),transparent 55%),url('img/hero-stage.png') center/cover no-repeat !important}
.cd-box{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));color:#F2EAD6;border:1px solid var(--line);box-shadow:none}
.cd-box b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.cd-box span{color:var(--muted)}
.vote-cats button.active{background:var(--grad);color:#1a1405;border-color:transparent}
.board{border-radius:20px}

/* footer */
footer{background:#0a0805;border-top:1px solid var(--line)}
footer h5{color:var(--lav)}
.note{border-color:rgba(212,175,55,.4);background:rgba(255,255,255,.03)}

/* corporate consistency: event titles in sans */
.ecard h3{font-family:var(--display-sans);font-weight:700}

/* ===== per-candidate QR in profile ===== */
.prof-qr{display:flex;gap:18px;align-items:center;margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}
.qr-box{background:#0f0c06;border:1px solid var(--line);border-radius:14px;padding:12px;flex:none}
.qr-box img{width:150px;height:150px;display:block;border-radius:6px;background:#0f0c06}
.qr-cap b{font-size:.92rem}
.qr-cap p{color:var(--muted);font-size:.78rem;margin:5px 0 0;line-height:1.5}
@media(max-width:560px){.prof-qr{flex-direction:column;text-align:center}}

/* ===== ALYA chat widget (all pages) ===== */
/* move accessibility FAB to the left so ALYA sits bottom-right */
.a11y-fab{right:auto;left:22px}
.a11y-panel{right:auto;left:22px}
.alya-fab{position:fixed;right:22px;bottom:22px;z-index:150;display:flex;align-items:center;gap:10px;cursor:pointer;border:0;
  background:var(--grad);color:#1a1405;border-radius:40px;padding:11px 18px 11px 11px;font-weight:700;font-size:.9rem;
  box-shadow:0 14px 34px rgba(212,175,55,.4);transition:transform .2s}
.alya-fab:hover{transform:translateY(-2px)}
.alya-fab .av{width:34px;height:34px;border-radius:50%;background:rgba(6,5,3,.14);display:flex;align-items:center;justify-content:center;font-size:1.05rem}
.alya-panel{position:fixed;right:22px;bottom:22px;z-index:151;width:372px;max-width:calc(100vw - 32px);height:564px;max-height:calc(100vh - 44px);
  background:var(--panel);border:1px solid var(--line);border-radius:22px;box-shadow:0 30px 70px rgba(0,0,0,.6);display:none;flex-direction:column;overflow:hidden}
.alya-panel.open{display:flex;animation:pop .22s ease}
.alya-head{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(212,175,55,.1),transparent)}
.alya-head .av{width:42px;height:42px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;color:#1a1405;font-weight:800;font-size:1.15rem;flex:none}
.alya-head b{font-size:1rem;display:block;letter-spacing:.02em}
.alya-head small{color:#43e089;font-size:.72rem;display:flex;align-items:center;gap:6px}
.alya-head small::before{content:"";width:7px;height:7px;border-radius:50%;background:#43e089;box-shadow:0 0 7px #43e089}
.alya-head .x{margin-left:auto;background:none;border:0;color:var(--muted);font-size:1.6rem;cursor:pointer;line-height:1}
.alya-msgs{flex:1;overflow:auto;padding:18px;display:flex;flex-direction:column;gap:12px}
.alya-msg{max-width:86%;padding:11px 14px;border-radius:15px;font-size:.88rem;line-height:1.5;animation:slideIn .3s ease}
.alya-msg.bot{background:rgba(255,255,255,.05);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.alya-msg.me{background:var(--grad);color:#1a1405;align-self:flex-end;border-bottom-right-radius:4px;font-weight:500}
.alya-msg a{color:var(--cyan);text-decoration:underline}
.alya-chips{display:flex;gap:8px;flex-wrap:wrap;padding:0 18px 12px}
.alya-chip{background:rgba(212,175,55,.1);border:1px solid rgba(212,175,55,.3);color:#E6C96B;border-radius:20px;padding:7px 12px;font-size:.75rem;cursor:pointer;font-weight:600}
.alya-chip:hover{background:rgba(212,175,55,.2)}
.alya-input{display:flex;gap:8px;padding:14px;border-top:1px solid var(--line)}
.alya-input input{flex:1;background:var(--card-bg);border:1px solid var(--line);border-radius:30px;padding:11px 16px;color:#fff;outline:none;font-size:.88rem}
.alya-input input:focus{border-color:rgba(212,175,55,.5)}
.alya-input button{background:var(--grad);border:0;border-radius:50%;width:42px;height:42px;cursor:pointer;color:#1a1405;font-size:1.1rem;flex:none}
.alya-typing{display:flex;gap:4px;align-self:flex-start;padding:12px 14px;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:15px;border-bottom-left-radius:4px}
.alya-typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:blink 1.2s infinite}
.alya-typing i:nth-child(2){animation-delay:.2s}.alya-typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,60%,100%{opacity:.3}30%{opacity:1}}
@media(max-width:480px){.alya-panel{right:8px;left:8px;width:auto;bottom:8px;height:calc(100vh - 16px)}.alya-fab span{display:none}}

/* ========================================================================
   BLACK & GOLD THEME — final token override + unified typography
   ======================================================================== */
:root{
  --bg:#070503; --bg-2:#0c0a06; --surf:#120e08; --surf-2:#171208;
  --navy-900:#070503; --navy-800:#0c0a06; --navy-700:#120e08; --navy-600:#1a150a;
  --card-bg:#15110a; --panel:#0c0a06;
  --text:#F6EFDD; --muted:#B9AE92; --faint:#8c836c;
  --line:rgba(212,175,55,.16);
  --cyan:#F6E7B8; --blue:#D4AF37; --lav:#E6C96B; --violet:#C9A227; --mag:#A87E2F; --ok:#4CC38A;
  --gold:#D4AF37; --gold-2:#E6C96B; --orange:#C9A227; --platinum:#EADFC2; --ink-soft:#E3D7B8;
  --grad:linear-gradient(120deg,#BF953F,#FCF6BA 32%,#D4AF37 55%,#B38728 80%,#E6C96B);
  --grad-soft:linear-gradient(135deg,#E6C96B,#BF953F);
}
body,body.home{background:#070503}
body::before{background:
  radial-gradient(1000px 650px at 78% -10%,rgba(212,175,55,.10),transparent 62%),
  radial-gradient(860px 600px at 6% 108%,rgba(230,201,107,.06),transparent 60%)}

/* unified typography: elegant serif display + Inter everywhere else */
h1,h2,.sec-title,.page-banner h1,.event-hero h1,.fx-cta-band h2,.prof-head h3,
.home h1,.home h2,.home .sec-title,.ahero h1,.home .fx-cta-band h2{
  font-family:var(--sans);font-weight:800;letter-spacing:-.02em}
.ahero h1{font-weight:700}
h3,h4,h5,.home h3,.home h4,.bento .b h3,.fcard h3,.card h3,.alya-head b,nav.links a,.btn{font-family:var(--display-sans)}
.eyebrow,.chip,.topbar{font-family:var(--display-sans)}
.statband .s b,.lux-stats .s b,.prof-votes,.bento .big{font-family:var(--sans)}

/* gold polish */
.btn{color:#1a1405}
.chip .dot{background:var(--gold);box-shadow:0 0 0 4px rgba(212,175,55,.18)}
.rule{background:var(--grad)}
header.nav{background:rgba(7,5,3,.84)}
#mmenu{background:#0c0a06}
.topbar{background:linear-gradient(90deg,rgba(212,175,55,.10),rgba(230,201,107,.14),rgba(168,126,47,.10));border-bottom:1px solid rgba(212,175,55,.2)}

/* brand lockup: INTELLIGENCE letter-justified to match CROWNSPHERE width */
.brand .name{display:flex;flex-direction:column;align-items:stretch}
.brand .name small{display:flex;justify-content:space-between;letter-spacing:0;width:100%;margin-top:3px}

/* ===== candidate card v2: rank badge, stats row, daily delta ===== */
.vthumb{position:relative}
.vrank{position:absolute;top:0;left:16px;z-index:2;background:var(--grad);color:#1a1405;
  border-radius:0 0 11px 11px;padding:8px 12px 9px;text-align:center;box-shadow:0 10px 22px rgba(0,0,0,.4)}
.vrank b{display:block;font-size:1.2rem;font-weight:800;line-height:1}
.vrank i{font-style:normal;font-size:.5rem;font-weight:800;letter-spacing:.22em;display:block;margin-top:2px}
.vsash-chip{display:inline-block;background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--muted);
  font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:20px;padding:4px 12px;margin:8px 0 14px}
.vstats{display:flex;align-items:center;background:rgba(255,255,255,.03);border:1px solid var(--line);
  border-radius:13px;padding:10px 12px;margin-bottom:12px;gap:12px}
.vstats .vs{flex:1;min-width:0}
.vstats .vs+.vs{border-left:1px solid var(--line);padding-left:12px}
.vstats .vs i{font-style:normal;display:block;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);font-weight:800;margin-bottom:2px}
.vstats .vs b{font-size:1.08rem;font-weight:800;letter-spacing:-.01em}
.vstats .vote-btn{flex:none;padding:10px 20px;font-size:.82rem;font-weight:700}
.vdelta{margin-top:10px;font-size:.72rem;font-weight:700;text-align:center;letter-spacing:.02em}
.vdelta .dup{color:#4CC38A}
.vdelta .ddown{color:#D98E4A}
.vdelta .d0{color:var(--faint)}

/* ============================================================
   MUTYA 2026 : immersive futuristic layer (body.mutya-mode only)
   ============================================================ */

/* --- stage atmosphere: ember canvas + drifting aurora glows --- */
#mu-emb{position:fixed;inset:0;z-index:0;pointer-events:none}
.mu-aurora{position:fixed;inset:-20%;z-index:0;pointer-events:none;
  background:
    radial-gradient(42% 30% at 18% 22%,rgba(212,175,55,.10),transparent 70%),
    radial-gradient(36% 26% at 84% 12%,rgba(246,231,184,.07),transparent 70%),
    radial-gradient(50% 36% at 60% 88%,rgba(168,126,47,.09),transparent 70%);
  animation:muAur 26s ease-in-out infinite alternate}
@keyframes muAur{to{transform:translate3d(2.5%,-2%,0) scale(1.06)}}
.stage-mode section,.stage-mode footer,.stage-mode .page-banner,.stage-mode .topbar{position:relative;z-index:1}

/* --- cinematic event title + hero stats --- */
.mutya-mode #vote-event-name{
  font-size:clamp(2.9rem,6vw,4.7rem);letter-spacing:.01em;
  background:linear-gradient(100deg,#F6E7B8 0%,#D4AF37 28%,#FFF6D8 46%,#D4AF37 62%,#A87E2F 100%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:muSheen 7s linear infinite;
  filter:drop-shadow(0 0 28px rgba(212,175,55,.30))}
@keyframes muSheen{to{background-position:220% 0}}
.mu-stats{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.mu-stat{min-width:136px;padding:14px 20px;border:1px solid rgba(212,175,55,.28);border-radius:14px;
  background:linear-gradient(160deg,rgba(246,231,184,.07),rgba(8,6,4,.55));
  backdrop-filter:blur(8px);box-shadow:inset 0 0 22px rgba(212,175,55,.05)}
.mu-stat b{display:block;font-family:var(--sans);font-size:1.5rem;line-height:1.2;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.mu-stat b#mu-lead{font-size:1.02rem;padding-top:5px}
.mu-stat span{font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* --- The Crown Race podium --- */
.mu-podwrap{margin:0 0 48px;position:relative}
.mu-pod-head{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:26px}
.mu-pod-head h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800}
.mu-pod-head p{color:var(--muted);font-size:.86rem;margin:0}
.mu-live{display:inline-flex;align-items:center;gap:8px;font-size:.68rem;font-weight:800;
  letter-spacing:.22em;color:#F6E7B8;border:1px solid rgba(212,175,55,.4);padding:6px 12px;border-radius:30px}
.mu-live i{width:7px;height:7px;border-radius:50%;background:#22B573;box-shadow:0 0 10px #22B573;animation:muPulse 1.6s infinite}
@keyframes muPulse{50%{opacity:.3}}
.mu-pod-row{display:grid;grid-template-columns:1fr 1.18fr 1fr;gap:18px;align-items:end}
.mu-pod{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;
  font:inherit;color:var(--text);text-align:center;padding:30px 18px 24px;
  border-radius:20px;border:1px solid rgba(212,175,55,.26);
  background:linear-gradient(175deg,rgba(246,231,184,.06),rgba(10,8,5,.78) 55%);
  backdrop-filter:blur(8px);overflow:hidden;
  transition:transform .18s,border-color .18s,box-shadow .18s}
.mu-pod:hover{transform:translateY(-6px);border-color:rgba(246,231,184,.55);
  box-shadow:0 24px 54px rgba(0,0,0,.5),0 0 34px rgba(212,175,55,.12)}
.mu-pod.p1{padding-top:48px;border-color:rgba(246,231,184,.45);box-shadow:0 0 44px rgba(212,175,55,.10)}
.mu-beam{position:absolute;top:-62%;left:50%;width:160%;height:170%;transform:translateX(-50%);pointer-events:none;
  background:conic-gradient(from 180deg at 50% 0%,transparent 42%,rgba(246,231,184,.10) 50%,transparent 58%);
  animation:muBeam 9s ease-in-out infinite alternate}
@keyframes muBeam{from{transform:translateX(-56%)}to{transform:translateX(-44%)}}
.mu-crown{position:absolute;top:8px;left:50%;transform:translateX(-50%);font-size:1.6rem;color:#F6E7B8;
  filter:drop-shadow(0 0 12px rgba(246,231,184,.8));animation:muFloat 3.4s ease-in-out infinite}
@keyframes muFloat{50%{transform:translateX(-50%) translateY(-5px)}}
.mu-medal{position:absolute;top:14px;left:16px;font-weight:800;font-size:.8rem;letter-spacing:.1em;
  color:#1a1405;background:var(--grad);padding:5px 10px;border-radius:9px;box-shadow:0 8px 18px rgba(0,0,0,.4)}
.mu-ring{position:relative;width:126px;height:126px;border-radius:50%;padding:4px;margin-bottom:10px;flex:none}
.mu-pod.p1 .mu-ring{width:158px;height:158px}
.mu-ring::before{content:"";position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(#F6E7B8,#A87E2F,#D4AF37,#FFF6D8,#A87E2F,#F6E7B8);
  animation:muSpin 7s linear infinite}
.mu-ring img{position:relative;width:100%;height:100%;object-fit:cover;border-radius:50%;border:3px solid #0a0805}
@keyframes muSpin{to{transform:rotate(360deg)}}
.mu-pod b{font-family:var(--sans);font-size:1.12rem}
.mu-pod.p1 b{font-size:1.32rem}
.mu-pod small{color:var(--muted);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
.mu-votes{margin-top:8px;font-weight:800;font-size:1.32rem;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.mu-votes i{font-style:normal;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);-webkit-text-fill-color:var(--muted);margin-left:6px}
.mu-up{font-size:.74rem;color:#58d68d;font-weight:600}
.mu-up.mu-flat{color:var(--muted)}

/* --- live vote ticker --- */
.mu-ticker{margin-top:22px;border:1px solid rgba(212,175,55,.22);border-radius:12px;
  background:rgba(8,6,4,.6);overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mu-ticker-in{display:inline-block;white-space:nowrap;padding:10px 0;
  animation:muTick 40s linear infinite;will-change:transform}
@keyframes muTick{to{transform:translateX(-50%)}}
.mu-ti{margin:0 18px;color:var(--muted);font-size:.82rem}
.mu-ti b{color:#F6E7B8;font-weight:600}
.mu-sep{color:#A87E2F}

/* --- holographic candidate cards --- */
.mutya-mode .vcard{--rx:0deg;--ry:0deg;
  transform:perspective(950px) rotateX(var(--rx)) rotateY(var(--ry));
  border-color:rgba(212,175,55,.22);
  background:linear-gradient(170deg,rgba(246,231,184,.05),var(--card-bg) 40%);
  transition:transform .14s ease-out,border-color .2s,box-shadow .2s}
.mutya-mode .vcard:hover{
  transform:perspective(950px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(-5px);
  border-color:rgba(246,231,184,.5);
  box-shadow:0 26px 60px rgba(0,0,0,.55),0 0 30px rgba(212,175,55,.14)}
.mutya-mode .vthumb::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,246,216,.15) 46%,rgba(255,246,216,.04) 52%,transparent 64%);
  transform:translateX(-130%);transition:transform .7s ease}
.mutya-mode .vcard:hover .vthumb::before{transform:translateX(130%)}
.mutya-mode .vthumb::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(240px 240px at var(--gx,50%) var(--gy,30%),rgba(255,246,216,.10),transparent 60%);
  opacity:0;transition:opacity .25s}
.mutya-mode .vcard:hover .vthumb::after{opacity:1}
.mutya-mode .vrank{box-shadow:0 10px 26px rgba(212,175,55,.35);animation:muBadge 3s ease-in-out infinite}
@keyframes muBadge{50%{box-shadow:0 10px 30px rgba(212,175,55,.6)}}
.mutya-mode .vbar i{background:linear-gradient(90deg,#A87E2F,#D4AF37,#FFF6D8,#D4AF37);
  background-size:200% 100%;animation:muBar 2.6s linear infinite}
@keyframes muBar{to{background-position:200% 0}}

/* --- HUD command centre + leaderboard --- */
.mutya-mode .panelcard{position:relative;border-color:rgba(212,175,55,.22);
  background:linear-gradient(170deg,rgba(246,231,184,.04),rgba(10,8,5,.8))}
.mutya-mode .panelcard::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.016) 0 1px,transparent 1px 3px)}
.mutya-mode .board{border-color:rgba(212,175,55,.3);box-shadow:0 0 36px rgba(212,175,55,.08)}

/* --- responsive + reduced motion --- */
@media(max-width:860px){
  .mu-pod-row{grid-template-columns:1fr 1fr;align-items:stretch}
  .mu-pod.p1{grid-column:1/-1;order:-1}
  .mu-stat{flex:1;min-width:calc(50% - 10px)}
}
@media(prefers-reduced-motion:reduce){
  .mu-aurora,.mu-ring::before,.mu-ticker-in,.mutya-mode #vote-event-name,
  .mu-beam,.mu-crown,.mu-live i,.mutya-mode .vbar i,.mutya-mode .vrank{animation:none!important}
}

/* Mutya hero refinements: crest re-tinted gold, stats as a tidy 2x2 grid */
.mutya-mode .crest img{max-width:none;max-height:420px;width:auto;margin:0 auto;
  filter:drop-shadow(0 24px 44px rgba(0,0,0,.6)) drop-shadow(0 0 38px rgba(212,175,55,.22));
  animation:floaty 6.5s ease-in-out infinite}
.mutya-mode .mu-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:560px}
.mutya-mode .mu-stat{min-width:0}

/* ============================================================
   HOME : immersive Mutya spotlight (single-event mode)
   ============================================================ */
.stage-mode .ahero h1 .g{
  background:linear-gradient(100deg,#F6E7B8 0%,#D4AF37 30%,#FFF6D8 48%,#D4AF37 64%,#A87E2F 100%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:muSheen 7s linear infinite;filter:drop-shadow(0 0 24px rgba(212,175,55,.28))}
.mu-feature{display:grid;grid-template-columns:1.15fr 1fr;gap:34px;align-items:center;
  border:1px solid rgba(212,175,55,.3);border-radius:24px;padding:38px 38px 28px;
  position:relative;overflow:hidden;
  background:linear-gradient(165deg,rgba(246,231,184,.07),rgba(10,8,5,.82) 55%);
  backdrop-filter:blur(8px);
  box-shadow:0 30px 70px rgba(0,0,0,.45),0 0 44px rgba(212,175,55,.08)}
.mu-feature::before{content:"";position:absolute;left:-10%;right:-10%;top:-40%;height:130%;pointer-events:none;
  background:conic-gradient(from 180deg at 50% 0%,transparent 44%,rgba(246,231,184,.08) 50%,transparent 56%);
  animation:muBeam 10s ease-in-out infinite alternate}
.mu-feat-info .mu-feat-title{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin:14px 0 10px;
  background:linear-gradient(100deg,#F6E7B8,#D4AF37 35%,#FFF6D8 50%,#A87E2F);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:muSheen 7s linear infinite}
.mu-feat-info p{color:var(--muted);max-width:520px;margin:0}
.mu-feat-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px;max-width:470px}
.mu-feat-pods{display:flex;gap:18px;justify-content:center;align-items:flex-end;position:relative;z-index:1}
.mu-feat-pod{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;
  position:relative;padding-top:28px;color:var(--text);transition:transform .18s}
.mu-feat-pod:hover{transform:translateY(-6px)}
.mu-feat-pod .mu-ring{width:102px;height:102px;margin-bottom:6px}
.mu-feat-pod.r1 .mu-ring{width:142px;height:142px}
.mu-feat-pod.r2{order:-1}.mu-feat-pod.r3{order:1}
.mu-feat-pod b{font-size:.95rem;font-weight:800}
.mu-feat-pod.r1 b{font-size:1.1rem}
.mu-feat-pod small{color:var(--muted);font-size:.74rem}
.mu-feat-pod .mu-crown{top:-4px}
.mu-feat-ticker{grid-column:1/-1;margin-top:6px}
#mu-hcd{font-size:1.06rem;padding-top:4px}
@media(max-width:900px){
  .mu-feature{grid-template-columns:1fr;padding:28px 20px 22px}
  .mu-feat-pods{margin-top:10px}
  .mu-feat-pod .mu-ring{width:88px;height:88px}
  .mu-feat-pod.r1 .mu-ring{width:118px;height:118px}
}

/* ===== script wordmark logo ===== */
.brand.wm .wm-col{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.brand .wordmark{height:42px;width:auto;display:block;filter:drop-shadow(0 4px 14px rgba(0,0,0,.45))}
.brand .wm-sub{font-size:.55rem;letter-spacing:.46em;text-transform:uppercase;color:var(--muted);font-weight:700;padding-left:6px}
footer .brand .wordmark{height:46px}
.ahero .emblem{width:min(86vw,640px)}
.ahero .emblem img{filter:drop-shadow(0 24px 44px rgba(0,0,0,.6)) drop-shadow(0 0 34px rgba(212,175,55,.18))}
@media(max-width:640px){.brand .wordmark{height:34px}.brand .wm-sub{letter-spacing:.34em}}

/* hero: wordmark leads, above the headline */
.ahero .hero-logo{width:min(68vw,380px);margin:0 auto 34px}
.ahero .hero-logo img{animation:floaty 6.5s ease-in-out infinite}
.hero-brand-sub{display:block;text-align:center;font-size:.62rem;letter-spacing:.56em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-top:16px;padding-left:.56em}

/* hero lockup: INTELLIGENCE sits under the "Sphere" part of the script */
.ahero .hero-logo{position:relative;width:min(72vw,430px);margin:0 auto 44px}
.ahero .hero-logo .hero-brand-sub{position:absolute;right:2%;bottom:-14px;margin:0;padding:0;
  display:block;font-size:.6rem;letter-spacing:.5em;text-transform:uppercase;
  color:var(--muted);font-weight:700;white-space:nowrap}
/* nav/footer lockup matches: sub-line under the "Sphere" end */
.brand.wm .wm-col{align-items:flex-end}
.brand .wm-sub{padding-left:0;padding-right:2px}

/* ===== global stage globe ===== */
.globe-stage{position:relative;margin-top:14px}
#globe-wrap{display:flex;justify-content:center;min-height:460px;cursor:grab}
#globe-wrap canvas{outline:none}
.globe-card{position:absolute;top:50%;right:2%;transform:translateY(-50%);width:302px;z-index:3;
  border:1px solid rgba(212,175,55,.35);border-radius:18px;padding:22px;
  background:linear-gradient(165deg,rgba(246,231,184,.08),rgba(10,8,5,.9) 55%);backdrop-filter:blur(10px);
  box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 34px rgba(212,175,55,.12)}
.globe-card h3{font-size:1.5rem;margin:12px 0 2px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.globe-card small{color:var(--muted);display:block;margin-bottom:14px}
.globe-card .x{position:absolute;top:8px;right:14px;background:none;border:0;color:var(--muted);font-size:1.35rem;cursor:pointer}
.globe-card .gc-stats{display:flex;gap:12px;margin:0 0 16px}
.globe-card .gc-stats div{flex:1;border:1px solid rgba(212,175,55,.25);border-radius:12px;padding:10px 12px}
.globe-card .gc-stats b{display:block;font-size:1.12rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.globe-card .gc-stats span{font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.globe-card .btn{width:100%;justify-content:center}
.globe-legend{display:flex;gap:26px;justify-content:center;margin-top:4px;color:var(--muted);font-size:.78rem;flex-wrap:wrap}
.globe-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px}
.gl-host i{background:#F6E7B8;box-shadow:0 0 10px rgba(246,231,184,.9)}
.gl-ov i{background:rgba(212,175,55,.6)}
@media(max-width:820px){.globe-card{position:static;transform:none;width:auto;margin:14px auto 0;max-width:420px}#globe-wrap{min-height:380px}}

/* ALYA widget: official gold mark */
.alya-fab .av{background:rgba(6,5,3,.35)}
.alya-fab .av img{width:26px;height:auto;display:block}
.alya-head .av.av-logo{background:rgba(6,5,3,.6);border:1px solid rgba(212,175,55,.45)}
.alya-head .av.av-logo img{width:30px;height:auto;display:block}
.globe-tip{font-family:var(--sans);font-size:.78rem;letter-spacing:.06em;color:#F6E7B8;
  background:rgba(8,6,4,.92);border:1px solid rgba(212,175,55,.45);border-radius:9px;padding:7px 12px;white-space:nowrap}
.globe-tip.host{color:#1a1405;background:linear-gradient(135deg,#F6E7B8,#D4AF37);font-weight:700;border-color:#F6E7B8}

/* home hero: tightened — smaller type, clear gap under the lockup */
.home .ahero{padding:54px 0 28px}
.home .ahero .hero-logo{width:min(54vw,310px);margin:0 auto 48px}
.home .ahero .hero-logo .hero-brand-sub{bottom:-12px;font-size:.56rem}
.home .ahero h1{font-size:clamp(2rem,4.6vw,3.5rem);line-height:1.08}
.home .ahero .sub{font-size:clamp(.96rem,1.6vw,1.14rem);max-width:520px;margin:18px auto 26px}
.home .ahero .cta .btn{padding:12px 26px;font-size:.9rem}

/* ===== competitive extras ===== */
/* golden hour banner */
.mult-banner{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 22px;padding:13px 20px;
  border:1px solid rgba(212,175,55,.3);border-radius:14px;background:rgba(13,10,5,.7);color:var(--muted);font-size:.86rem}
.mult-banner i{font-style:normal;margin-left:auto;color:var(--faint);font-size:.74rem;letter-spacing:.08em}
.mult-banner.on{border-color:rgba(246,231,184,.6);color:#1a1405;font-weight:700;
  background:var(--grad);box-shadow:0 10px 30px rgba(212,175,55,.3);animation:multPulse 2.2s ease-in-out infinite}
.mult-banner.on i,.mult-banner.on span{color:#201807}
@keyframes multPulse{50%{box-shadow:0 10px 42px rgba(212,175,55,.55)}}
.mult-line{margin:12px 0 0;padding:10px 14px;border-radius:10px;background:rgba(212,175,55,.14);
  border:1px solid rgba(212,175,55,.35);color:#F6E7B8;font-size:.85rem}
/* broadcast button + boosts board */
.bc-btn{width:100%;justify-content:center;margin-top:16px}
.board.boosts{margin-top:18px}
.board.boosts li{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid rgba(212,175,55,.12)}
.board.boosts li:last-child{border-bottom:0}
.board.boosts .rk{flex:none;width:22px;height:22px;border-radius:50%;background:rgba(212,175,55,.18);color:#F6E7B8;
  display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:800}
.board.boosts b{display:block;font-size:.84rem}
.board.boosts small{color:var(--muted);font-size:.72rem}
.board.boosts .when{margin-left:auto;color:var(--faint);font-size:.68rem;flex:none}
/* integrity */
.intg-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.intg-chips .chip{border:1px solid rgba(212,175,55,.26);border-radius:14px;padding:14px 16px;text-align:center;
  background:linear-gradient(165deg,rgba(246,231,184,.05),rgba(10,8,5,.6))}
.intg-chips b{display:block;font-size:1.35rem;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.intg-chips span{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.intg-chips .ok b{background:none;-webkit-text-fill-color:#43e089;color:#43e089}
.intg-chips .warn b{background:none;-webkit-text-fill-color:#e08943;color:#e08943}
.rcpt{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid rgba(212,175,55,.1);flex-wrap:wrap}
.rcpt .hash{font-family:ui-monospace,Menlo,monospace;font-size:.68rem;color:#8d9dbb;background:rgba(255,255,255,.04);
  border:1px solid var(--line);border-radius:7px;padding:3px 7px;flex:none}
.rcpt .t{font-size:.8rem;display:flex;align-items:center;gap:8px}
.rcpt .when{margin-left:auto;color:var(--faint);font-size:.68rem}
.anom{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid rgba(212,175,55,.1);font-size:.82rem;color:var(--muted)}
.anom .when{margin-left:auto;color:var(--faint);font-size:.68rem;flex:none}
.intg-note{color:var(--faint);font-size:.72rem;margin:14px 0 0}
/* replay */
#replay-cv{background:rgba(8,6,4,.5);border:1px solid rgba(212,175,55,.14);border-radius:12px}
.movers{margin-top:14px}
.mover{padding:8px 0;border-bottom:1px solid rgba(212,175,55,.1);font-size:.84rem;color:#58d68d}
.mover b{color:var(--text)}
.mover.dim{color:var(--muted)}
/* profile extras */
.prof-trend{border:1px solid rgba(212,175,55,.2);border-radius:14px;padding:14px 16px 8px;margin-bottom:16px;background:rgba(8,6,4,.45)}
.prof-trend .pt-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.prof-trend h4{margin:0;font-size:.85rem}
.prof-trend span{color:#58d68d;font-size:.76rem;font-weight:600}
.prof-trend canvas{width:100%;height:56px;display:block}
.prof-fans .fan{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(212,175,55,.1);font-size:.85rem}
.prof-fans .fan:last-child{border-bottom:0}
.prof-fans .fan span:last-child{margin-left:auto;color:var(--gold-2,#E6C96B);font-weight:700}
.prof-btns{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.prof-btns .a11y-btn{width:auto}

/* ===== backend / lead generation ===== */
.lead-cta{padding:10px 18px;font-size:.84rem}
.lead-modal .modal-head h3{font-size:1.1rem}
.lead-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lead-form input,.lead-form textarea{background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;
  padding:12px 14px;color:var(--text);font:inherit;width:100%}
.lead-form textarea{grid-column:1/-1;resize:vertical}
.lead-form input:focus,.lead-form textarea:focus{outline:none;border-color:rgba(212,175,55,.6)}
.lead-note{color:#e08943;font-size:.78rem;margin-right:auto}
.rcpt-capture{display:flex;gap:10px;margin:16px auto 10px;max-width:420px}
.rcpt-capture input{flex:1;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:10px;
  padding:11px 13px;color:var(--text);font:inherit;font-size:.82rem}
.rcpt-capture .btn{padding:10px 20px;font-size:.82rem}
html[data-backend="on"] .nav::after{content:"BACKEND LIVE";position:absolute;right:12px;top:6px;
  font-size:.52rem;letter-spacing:.2em;color:#43e089;opacity:.8}
@media(max-width:860px){.lead-cta{display:none}.lead-form{grid-template-columns:1fr}}

/* ===== mobile fixes (390px audit, 8 Oct) ===== */
@media (max-width:860px){
  .intg-chips{grid-template-columns:1fr 1fr}
}
@media (max-width:480px){
  .countdown .cd-box,.count .cd{flex:1 1 40%}
  .rcpt .when{margin-left:0;width:100%}
  .mult-banner{font-size:.78rem;gap:8px}
  .mult-banner i{margin-left:0;width:100%}
}