/* ============================================================
   BATTLEBACK — marketing site
   Brand system ported from docs/design/battleback_v2.html
   (the repo's visual source of truth). Mobile-first.
   ============================================================ */

:root{
  --void:#0a0612;
  --void-2:#13091e;
  --ink:#f6f0ff;
  --muted:#8a82a0;
  --line:#241830;
  --line-2:#3a2952;
  --cyan:#00eaff;
  --cyan-deep:#0099b8;
  --ice:#d6f7ff;
  --magenta:#6b3aff; /* indigo — var name kept for design-doc fidelity */
  --purple:#b829ff;
  --fire:#ff5a1f;
  --ember:#ff1a1a;
  --gold:#ffc230;
  --blood:#9a1818;
  --champ:#5fffa6;
  --warm-white:#fff5d6;
  --peach:#ffb98a;
  --btn-ink:#06070a;
}

*{margin:0;padding:0;box-sizing:border-box;-webkit-font-smoothing:antialiased}
html{scroll-behavior:smooth}
html,body{background:var(--void);color:var(--ink);font-family:'Barlow Condensed',sans-serif;font-weight:400;overflow-x:hidden;line-height:1.3}
body{
  background-image:
    radial-gradient(ellipse 1200px 600px at 20% 10%, rgba(184,41,255,.10), transparent 70%),
    radial-gradient(ellipse 1000px 500px at 80% 30%, rgba(107,58,255,.08), transparent 70%),
    radial-gradient(ellipse 1400px 800px at 50% 90%, rgba(0,234,255,.06), transparent 70%);
  min-height:100vh;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:200;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.4'/%3E%3C/svg%3E");
  opacity:.15;mix-blend-mode:overlay;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:2px}

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

/* ===== TYPOGRAPHY ===== */
.metal{
  font-family:'Big Shoulders Display',sans-serif;
  font-weight:900;
  letter-spacing:.01em;
  line-height:.85;
  text-transform:uppercase;
}
.chrome{
  background:linear-gradient(180deg, #ffffff 0%, #e0f4ff 30%, #6aa8c8 55%, #ffffff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:
    drop-shadow(0 0 8px var(--cyan))
    drop-shadow(0 0 24px var(--cyan-deep))
    drop-shadow(2px 0 0 var(--magenta))
    drop-shadow(-2px 0 0 var(--cyan));
}
.fire-text{
  background:linear-gradient(180deg, #fff5d6 0%, var(--gold) 40%, var(--fire) 75%, var(--ember) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 12px var(--fire)) drop-shadow(0 0 28px var(--ember));
}
.purple-text{
  background:linear-gradient(180deg, #ffffff 0%, #f0d4ff 40%, var(--purple) 80%, var(--magenta) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 12px var(--purple)) drop-shadow(0 0 28px var(--magenta));
}
.mono{font-family:'JetBrains Mono',monospace}

/* ===== HERO ===== */
.hero{
  position:relative;padding:72px 24px 56px;text-align:center;overflow:hidden;
  min-height:92vh;display:flex;flex-direction:column;justify-content:center;
}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-bg .ring{
  position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);
  width:clamp(360px,95vw,700px);height:clamp(360px,95vw,700px);border-radius:50%;
  background:radial-gradient(circle at 50% 60%, var(--ember) 0%, var(--fire) 20%, var(--gold) 40%, transparent 65%);
  opacity:.35;filter:blur(2px) saturate(1.4);
}
.hero-bg .ring2{
  position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);
  width:clamp(400px,102vw,760px);height:clamp(400px,102vw,760px);border-radius:50%;
  background:radial-gradient(circle, transparent 45%, var(--cyan) 48%, transparent 51%);
  opacity:.4;mix-blend-mode:screen;
}
.logo-wrap{position:relative}
.logo-wrap .sword{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:8px;height:132%;z-index:-1;
  background:linear-gradient(to bottom, transparent, var(--ice) 22%, var(--cyan) 50%, var(--ice) 78%, transparent);
  box-shadow:0 0 30px var(--cyan), 0 0 60px var(--cyan-deep), 0 0 100px var(--magenta);
}

.hero-content{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center}
.hero-tag{
  font-family:'JetBrains Mono',monospace;
  font-size:12px;letter-spacing:.5em;text-transform:uppercase;
  color:var(--cyan);
  text-shadow:0 0 12px var(--cyan-deep);
  margin-bottom:10px;padding-left:.5em;
}
.hero-logo{width:min(88vw,620px);filter:drop-shadow(0 12px 40px rgba(0,0,0,.6))}
.hero-sub{
  margin-top:18px;
  font-family:'Big Shoulders Display',sans-serif;font-weight:700;
  font-size:clamp(24px,3.4vw,34px);
  color:#e0d8f0;text-transform:uppercase;letter-spacing:.06em;
  max-width:680px;line-height:1.05;
}
.hero-sub span{color:var(--fire);text-shadow:0 0 14px var(--fire);white-space:nowrap}

.cta-row{
  margin-top:34px;display:flex;gap:14px;justify-content:center;align-items:stretch;
  flex-wrap:wrap;width:100%;
}
.btn-lg{
  display:flex;align-items:center;justify-content:center;
  font-family:'Big Shoulders Display',sans-serif;font-weight:800;
  font-size:17px;text-transform:uppercase;letter-spacing:.18em;
  padding:16px 30px;border-radius:8px;min-height:52px;
  background:linear-gradient(180deg,var(--cyan),var(--cyan-deep));
  color:var(--btn-ink);
  box-shadow:0 0 22px rgba(0,234,255,.45);
  transition:transform .2s, box-shadow .2s;
}
.btn-lg.f{background:linear-gradient(180deg,var(--gold),var(--fire));box-shadow:0 0 22px rgba(255,90,31,.45)}
.btn-lg:hover{transform:translateY(-2px);box-shadow:0 0 34px rgba(0,234,255,.6)}
.btn-lg.f:hover{box-shadow:0 0 34px rgba(255,90,31,.6)}
@media(max-width:479px){
  .cta-row{flex-direction:column}
  .btn-lg{width:100%}
}
.cta-note{
  margin-top:20px;
  font-family:'JetBrains Mono',monospace;font-size:10px;
  color:var(--muted);letter-spacing:.28em;text-transform:uppercase;
}

/* ===== MARQUEE BAND ===== */
.band{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:20px 0;overflow:hidden;
  background:linear-gradient(90deg, rgba(184,41,255,.08), rgba(0,234,255,.06) 50%, rgba(107,58,255,.08));
}
.ticker-track{display:flex;width:max-content;animation:marquee 32s linear infinite}
.ticker{
  font-family:'Big Shoulders Display',sans-serif;font-weight:900;
  font-size:clamp(20px,2.4vw,24px);letter-spacing:.18em;text-transform:uppercase;
  color:#e6deff;white-space:nowrap;padding-right:14px;
}
.ticker span{color:var(--cyan);margin:0 14px}
.ticker .m{color:var(--magenta)}
.ticker .f{color:var(--fire)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ===== SECTIONS ===== */
section{padding:64px 0;position:relative}
.section-head{margin-bottom:44px;max-width:760px}
.num{
  display:inline-block;
  font-family:'JetBrains Mono',monospace;font-size:11px;
  color:var(--cyan);letter-spacing:.4em;
  border:1px solid var(--cyan);padding:6px 12px 5px;
  background:rgba(0,234,255,.05);margin-bottom:18px;
}
.num.f{color:var(--fire);border-color:var(--fire);background:rgba(255,90,31,.05)}
.section-head h2{
  font-family:'Big Shoulders Display',sans-serif;font-weight:900;
  font-size:clamp(48px,9vw,100px);line-height:.85;
  text-transform:uppercase;margin-bottom:18px;letter-spacing:.005em;
}
.section-head p{
  font-family:'Barlow Condensed',sans-serif;font-weight:600;
  font-size:20px;color:#c4bbd8;text-transform:uppercase;letter-spacing:.04em;
}

/* mission chips */
.chip-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.chip{
  font-family:'JetBrains Mono',monospace;font-size:11px;
  padding:8px 14px;border:1px solid var(--cyan);
  background:rgba(0,234,255,.06);color:var(--cyan);
  letter-spacing:.2em;text-transform:uppercase;
  box-shadow:0 0 16px rgba(0,234,255,.15);
  white-space:nowrap;
}
.chip.m{border-color:var(--magenta);color:var(--magenta);background:rgba(107,58,255,.06);box-shadow:0 0 16px rgba(107,58,255,.15)}
.chip.f{border-color:var(--fire);color:var(--fire);background:rgba(255,90,31,.06);box-shadow:0 0 16px rgba(255,90,31,.15)}

/* ===== APP PREVIEW SECTIONS ===== */
.preview-grid{display:flex;flex-direction:column;gap:36px}

.phone-rail{
  display:flex;gap:20px;align-items:center;
  overflow-x:auto;
  margin:0 -24px;padding:14px 24px 24px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.phone-rail::-webkit-scrollbar{display:none}
.ph{flex:0 0 auto;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.ph figcaption{
  font-family:'JetBrains Mono',monospace;font-size:10px;
  color:var(--muted);letter-spacing:.3em;text-transform:uppercase;
}
.swipe-hint{
  font-family:'JetBrains Mono',monospace;font-size:10px;
  color:var(--muted);letter-spacing:.3em;text-transform:uppercase;
  text-align:center;margin-top:-8px;
}

.blurbs{display:flex;flex-direction:column;gap:22px}
.blurb .k{
  font-family:'JetBrains Mono',monospace;font-size:11px;
  letter-spacing:.3em;text-transform:uppercase;color:var(--cyan);margin-bottom:6px;
}
.blurb.f .k{color:var(--fire)}
.blurb p{
  font-family:'Barlow Condensed',sans-serif;font-weight:500;
  font-size:17px;color:#a89bc4;line-height:1.4;
}

@media(min-width:1024px){
  section{padding:90px 0}
  .preview-grid{
    flex-direction:row;align-items:center;gap:48px;
  }
  .preview-grid .rail-col{flex:1 1 auto;min-width:0}
  .preview-grid .blurbs{flex:0 0 300px}
  .preview-grid.flip{flex-direction:row-reverse}
  .phone-rail{
    overflow:visible;margin:0;padding:20px 0;
    justify-content:center;scroll-snap-type:none;
  }
  .swipe-hint{display:none}
  .ph{transition:transform .3s}
  .ph:nth-child(1){transform:rotate(-4deg) translateY(12px)}
  .ph:nth-child(2){transform:translateY(-14px)}
  .ph:nth-child(3){transform:rotate(4deg) translateY(12px)}
  .ph:hover{transform:rotate(0) translateY(-6px)}
}

/* ===== PHONE FRAME (ported verbatim) ===== */
.p{
  width:220px;height:460px;
  background:#0d0816;
  border-radius:34px;
  padding:9px;position:relative;
  box-shadow:
    inset 0 0 0 1.5px #1f1530,
    inset 0 0 0 2px #000,
    0 16px 40px rgba(0,0,0,.6),
    0 0 0 1px rgba(0,234,255,.1),
    0 0 30px rgba(0,234,255,.08);
}
.p.f{box-shadow:
  inset 0 0 0 1.5px #1f1530,
  inset 0 0 0 2px #000,
  0 16px 40px rgba(0,0,0,.6),
  0 0 0 1px rgba(255,90,31,.15),
  0 0 30px rgba(255,90,31,.1);
}
.p .isl{
  position:absolute;top:14px;left:50%;transform:translateX(-50%);
  width:66px;height:18px;background:#000;border-radius:10px;z-index:5;
}
.s{
  width:100%;height:100%;border-radius:26px;overflow:hidden;
  background:var(--void);position:relative;
  display:flex;flex-direction:column;
}
.sb{
  display:flex;justify-content:space-between;align-items:center;
  padding:10px 16px 4px;
  font-family:'JetBrains Mono',monospace;font-size:8px;
  color:#fff;letter-spacing:.08em;
}
.body{flex:1;padding:22px 12px 8px;overflow:hidden;position:relative;display:flex;flex-direction:column;gap:8px;padding-bottom:52px}

.tophdr{display:flex;justify-content:space-between;align-items:center;padding:0 2px 4px}
.tophdr .mini-logo{font-family:'Big Shoulders Display',sans-serif;font-weight:900;font-size:12px;color:var(--ice);letter-spacing:.1em;text-shadow:0 0 6px var(--cyan)}
.tophdr .mini-logo.fire{color:var(--warm-white);text-shadow:0 0 6px var(--fire)}
.tophdr .right-ico{width:20px;height:20px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:9px;font-family:'JetBrains Mono',monospace;color:var(--cyan)}
.tophdr .right-ico.fire{color:var(--fire);border-color:rgba(255,90,31,.4)}

.bigtxt{
  font-family:'Big Shoulders Display',sans-serif;font-weight:900;
  font-size:18px;color:var(--ice);text-transform:uppercase;letter-spacing:.03em;
  line-height:.95;text-shadow:0 0 8px var(--cyan-deep);
}
.smtxt{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);letter-spacing:.18em;text-transform:uppercase}
.midtxt{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:12px;color:#fff;text-transform:uppercase;letter-spacing:.04em}
.subtxt{font-family:'Barlow Condensed',sans-serif;font-weight:500;font-size:11px;color:#b8accf}

.card{
  background:rgba(255,255,255,.025);
  border:1px solid var(--line);
  border-radius:10px;padding:9px 10px;
}
.card.cyan{border-color:rgba(0,234,255,.3);background:rgba(0,234,255,.05)}
.card.mag{border-color:rgba(107,58,255,.3);background:rgba(107,58,255,.05)}
.card.fire{border-color:rgba(255,90,31,.3);background:rgba(255,90,31,.06)}
.card.pur{border-color:rgba(184,41,255,.3);background:rgba(184,41,255,.06)}
.card.glow-fire{box-shadow:0 0 20px rgba(255,90,31,.25)}
.card.glow-cyan{box-shadow:0 0 20px rgba(0,234,255,.18)}

/* Warrior's Word gold corner bloom */
.word-card{position:relative;overflow:hidden}
.word-card::before{
  content:"";position:absolute;top:-30px;right:-30px;width:110px;height:110px;
  background:radial-gradient(circle, rgba(255,194,48,.35), transparent 70%);
  pointer-events:none;
}
.word-card .quote{
  font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:13px;
  color:var(--warm-white);line-height:1.25;margin:4px 0;
}
.word-card .attr{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--peach);letter-spacing:.14em}
.k-gold{color:var(--gold)}
.k-ember{color:var(--ember)}
.k-cyan{color:var(--cyan)}
.k-champ{color:var(--champ)}
.k-purple{color:var(--purple)}

.row{display:flex;align-items:center;gap:8px}
.spread{display:flex;justify-content:space-between;align-items:center}

.btn-p{
  font-family:'Big Shoulders Display',sans-serif;font-weight:800;
  font-size:11px;text-transform:uppercase;letter-spacing:.18em;
  padding:9px 12px;text-align:center;border-radius:8px;
  background:linear-gradient(180deg,var(--cyan),var(--cyan-deep));
  color:var(--btn-ink);
  box-shadow:0 0 16px rgba(0,234,255,.4);
}
.btn-p.m{background:linear-gradient(180deg,var(--magenta),#3a1a8a);box-shadow:0 0 16px rgba(107,58,255,.4);color:#fff}
.btn-p.f{background:linear-gradient(180deg,var(--gold),var(--fire));box-shadow:0 0 16px rgba(255,90,31,.4)}
.btn-s{
  font-family:'Big Shoulders Display',sans-serif;font-weight:800;
  font-size:11px;text-transform:uppercase;letter-spacing:.18em;
  padding:8px 12px;text-align:center;border-radius:8px;
  background:rgba(255,255,255,.04);color:#fff;border:1px solid var(--line);
}

.pill{
  font-family:'JetBrains Mono',monospace;font-size:8px;
  padding:3px 6px;border-radius:3px;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid rgba(0,234,255,.3);color:var(--cyan);
  background:rgba(0,234,255,.05);
}
.pill.m{border-color:rgba(107,58,255,.3);color:var(--magenta);background:rgba(107,58,255,.05)}
.pill.f{border-color:rgba(255,90,31,.3);color:var(--fire);background:rgba(255,90,31,.05)}
.pill.u{border-color:rgba(184,41,255,.3);color:var(--purple);background:rgba(184,41,255,.05)}
.pill.ch{border-color:rgba(95,255,166,.4);color:var(--champ);background:rgba(95,255,166,.05)}
.pill.dim{border-color:var(--line-2);color:var(--muted);background:rgba(255,255,255,.02)}

.cb{
  width:14px;height:14px;border-radius:3px;border:1.5px solid #4a3868;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
}
.cb.on{background:var(--cyan);border-color:var(--cyan);box-shadow:0 0 8px var(--cyan-deep)}
.cb.on::after{content:"";width:6px;height:3px;border-left:1.5px solid #000;border-bottom:1.5px solid #000;transform:rotate(-45deg) translate(.5px,-.5px)}
.cb.on.fire{background:var(--fire);border-color:var(--fire);box-shadow:0 0 8px var(--fire)}

/* stat boxes */
.stat-row{display:flex;gap:6px}
.stat-row .card{flex:1;text-align:center;padding:8px 4px}
.stat-row .v{font-family:'Big Shoulders Display',sans-serif;font-weight:900;font-size:16px;color:var(--ice);line-height:1}
.stat-row .v.fire{color:var(--peach)}
.stat-row .v.ember{color:var(--ember)}
.stat-row .l{font-family:'JetBrains Mono',monospace;font-size:7px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;margin-top:4px}

/* streak hero + big numbers */
.streak-num{
  font-family:'Big Shoulders Display',sans-serif;font-weight:900;
  font-size:62px;color:var(--ice);line-height:1;
  text-shadow:0 0 18px var(--cyan);
}
.timer-num{
  font-family:'JetBrains Mono',monospace;font-weight:800;
  font-size:52px;color:var(--ice);line-height:1;letter-spacing:.02em;
  text-shadow:0 0 18px var(--cyan);text-align:center;
}
.meter{height:4px;border-radius:2px;background:var(--line);overflow:hidden}
.meter i{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,var(--cyan),var(--cyan-deep));box-shadow:0 0 8px var(--cyan-deep)}

/* avatars */
.ava{
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:'JetBrains Mono',monospace;font-weight:600;color:var(--btn-ink);
  background:linear-gradient(135deg,var(--gold),var(--fire));
  box-shadow:0 0 12px rgba(255,90,31,.5);
}
.ava.sm{width:20px;height:20px;font-size:8px}
.ava.lg{width:44px;height:44px;font-size:14px}

/* phone tab bar */
.tabbar{
  position:absolute;bottom:0;left:0;right:0;height:42px;
  background:rgba(13,8,22,.95);
  border-top:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-around;
  backdrop-filter:blur(8px);
}
.tabbar .tab{
  font-family:'JetBrains Mono',monospace;font-size:7px;letter-spacing:.15em;
  color:var(--muted);text-transform:uppercase;text-align:center;
}
.tabbar .tab.active{color:var(--cyan);text-shadow:0 0 6px var(--cyan)}
.tabbar.fire .tab.active{color:var(--fire);text-shadow:0 0 6px var(--fire)}

/* ===== FEATURE CARDS (// 04) ===== */
.arsenal{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:820px){.arsenal{grid-template-columns:repeat(3,1fr)}}
.arsenal .fcard{
  border:1px solid var(--line);border-radius:14px;padding:28px 24px;
  background:linear-gradient(180deg, rgba(255,255,255,.02), transparent);
  transition:transform .25s, box-shadow .25s;
}
.arsenal .fcard.cy{border-color:rgba(0,234,255,.3)}
.arsenal .fcard.fi{border-color:rgba(255,90,31,.3)}
.arsenal .fcard.in{border-color:rgba(107,58,255,.35)}
@media(hover:hover){
  .arsenal .fcard:hover{transform:translateY(-4px)}
  .arsenal .fcard.cy:hover{box-shadow:0 0 24px rgba(0,234,255,.18)}
  .arsenal .fcard.fi:hover{box-shadow:0 0 24px rgba(255,90,31,.18)}
  .arsenal .fcard.in:hover{box-shadow:0 0 24px rgba(107,58,255,.2)}
}
.fcard .ico{font-size:24px;margin-bottom:14px}
.fcard h3{
  font-family:'Big Shoulders Display',sans-serif;font-weight:900;
  font-size:28px;text-transform:uppercase;letter-spacing:.02em;color:#fff;
  margin-bottom:10px;line-height:.95;
}
.fcard p{font-family:'Barlow Condensed',sans-serif;font-weight:500;font-size:16px;color:#a89bc4;line-height:1.45}
.fcard .tag-line{
  display:inline-block;margin-top:14px;
  font-family:'JetBrains Mono',monospace;font-size:9px;
  color:var(--gold);letter-spacing:.24em;text-transform:uppercase;
}

/* ===== FINAL CTA ===== */
.enter{
  min-height:72vh;display:flex;align-items:center;text-align:center;
  position:relative;overflow:hidden;
}
.enter .enter-bg{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 700px 420px at 50% 60%, rgba(255,90,31,.16), transparent 60%),
    radial-gradient(ellipse 520px 340px at 50% 60%, rgba(0,234,255,.10), transparent 70%);
}
.enter .wrap{position:relative;z-index:2;width:100%}
.enter h2{font-size:clamp(64px,14vw,140px);margin-bottom:8px}
.enter .cta-row{margin-top:38px}

/* ===== FOOTER ===== */
footer{
  border-top:1px solid var(--line);
  padding:28px 0;
}
footer .wrap{
  display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center;
  font-family:'JetBrains Mono',monospace;font-size:10px;
  color:var(--muted);letter-spacing:.24em;text-transform:uppercase;
}
footer a:hover{color:var(--cyan)}
@media(min-width:700px){
  footer .wrap{flex-direction:row;justify-content:space-between}
}

/* ===== SCROLL REVEALS ===== */
[data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .6s ease, transform .6s ease;transition-delay:calc(var(--i,0)*90ms)}
[data-reveal].in{opacity:1;transform:none}
@media(min-width:1024px){
  [data-reveal].in.ph:nth-child(1){transform:rotate(-4deg) translateY(12px)}
  [data-reveal].in.ph:nth-child(2){transform:translateY(-14px)}
  [data-reveal].in.ph:nth-child(3){transform:rotate(4deg) translateY(12px)}
  [data-reveal].in.ph:hover{transform:rotate(0) translateY(-6px)}
}

/* ===== REDUCED MOTION ===== */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .ticker-track{animation:none}
  [data-reveal]{opacity:1;transform:none;transition:none}
  .ph,.fcard,.btn-lg{transition:none}
}