/* ═══════════ boot curtain ═══════════ */
.boot{
  position:fixed;inset:0;z-index:200;
  display:grid;place-items:center;
  background:var(--void);
  transition:opacity .7s var(--ease),visibility .7s;
}
.boot[hidden]{display:grid}            /* keep layout, JS toggles .is-done */
.boot.is-done{opacity:0;visibility:hidden;pointer-events:none}
.boot__inner{width:min(340px,72vw);text-align:center}
.boot__mark{
  font-family:var(--display);font-size:clamp(30px,7vw,46px);letter-spacing:.02em;
  text-transform:uppercase;transform:skewX(-6deg);
  background:linear-gradient(100deg,var(--ice),#fff 45%,var(--fire));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.boot__bar{height:2px;margin-top:18px;background:rgba(255,255,255,.08);overflow:hidden;border-radius:2px}
.boot__bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--ice),var(--fire))}
.boot__txt{
  margin-top:12px;font-family:var(--mono);font-size:10px;letter-spacing:.3em;
  text-transform:uppercase;color:var(--ink-3);
}

/* ═══════════ nav ═══════════ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:clamp(12px,2vw,20px) var(--gut);
  display:flex;align-items:center;gap:16px;
  transition:background .4s,backdrop-filter .4s,border-color .4s;
  border-bottom:1px solid transparent;
}
.nav.is-stuck{
  background:rgba(6,7,15,.72);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom-color:var(--line);
}
.nav__brand{display:flex;align-items:center;gap:11px;flex:none}
.nav__glyph{
  width:30px;height:30px;border-radius:9px;flex:none;
  background:linear-gradient(140deg,var(--fire),#ff9a52 40%,var(--ice));
  display:grid;place-items:center;
  font-family:var(--display);font-size:15px;color:#0b0400;
  box-shadow:0 6px 20px -8px rgba(255,90,31,.9);
}
.nav__name{font-family:var(--display);font-size:19px;letter-spacing:.06em;transform:skewX(-6deg)}
.nav__name span{color:var(--fire-soft)}
.nav__links{display:flex;gap:4px;margin-inline:auto}
.nav__links a{
  font-size:13.5px;font-weight:600;letter-spacing:.04em;color:var(--ink-2);
  padding:8px 14px;border-radius:999px;transition:color .25s,background .25s;
}
.nav__links a:hover{color:#fff;background:rgba(255,255,255,.06)}
.nav__cta{flex:none}
.nav__burger{display:none;flex:none;width:42px;height:42px;border:1px solid var(--line);border-radius:12px;place-items:center}
.nav__burger i{display:block;width:16px;height:1.5px;background:var(--ink);position:relative}
.nav__burger i::before,.nav__burger i::after{content:"";position:absolute;left:0;width:16px;height:1.5px;background:var(--ink)}
.nav__burger i::before{top:-5px}.nav__burger i::after{top:5px}

@media (max-width:940px){
  .nav__links{display:none}
  .nav__burger{display:grid}
  .nav__cta{display:none}
  .nav__brand{margin-inline-end:auto}
}

.drawer{
  position:fixed;inset:0;z-index:99;display:none;
  background:rgba(4,5,11,.94);backdrop-filter:blur(20px);
  padding:96px var(--gut) 40px;
}
.drawer.is-open{display:block}
.drawer a{
  display:block;padding:18px 0;border-bottom:1px solid var(--line);
  font-family:var(--display);font-size:30px;text-transform:uppercase;letter-spacing:.02em;
}
.drawer a small{display:block;font-family:var(--ui);font-size:12px;letter-spacing:.2em;color:var(--ink-3);margin-top:2px}
.drawer .btn{margin-top:28px;width:100%;justify-content:center}

/* ═══════════ hero ═══════════ */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;align-items:flex-end;
  padding:clamp(104px,14vh,150px) var(--gut) clamp(52px,7vh,78px);
  overflow:hidden;
  isolation:isolate;
}
.hero__bg{position:absolute;inset:0;z-index:-3;background:
  radial-gradient(58% 48% at 50% 34%,rgba(44,76,232,.28),transparent 72%),
  radial-gradient(38% 40% at 78% 62%,rgba(255,90,31,.18),transparent 70%),
  radial-gradient(44% 44% at 16% 70%,rgba(54,226,255,.13),transparent 72%),
  linear-gradient(180deg,#070914 0%,#05060d 58%,#04050a 100%);
}
/* CRT-ish horizon grid, pure CSS so it paints instantly */
.hero__grid{
  position:absolute;inset:auto 0 0;height:52vh;z-index:-2;pointer-events:none;
  background-image:
    linear-gradient(rgba(88,132,255,.22) 1px,transparent 1px),
    linear-gradient(90deg,rgba(88,132,255,.18) 1px,transparent 1px);
  background-size:64px 64px;
  transform:perspective(520px) rotateX(66deg);
  transform-origin:bottom center;
  -webkit-mask-image:linear-gradient(to top,#000 4%,transparent 78%);
  mask-image:linear-gradient(to top,#000 4%,transparent 78%);
  opacity:.65;
}
.hero__canvas{position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity 1.2s var(--ease)}
.hero__canvas.is-on{opacity:1}
.hero__canvas canvas{display:block;width:100%;height:100%}

/* character key art column */
.hero__art{
  position:absolute;z-index:-1;pointer-events:none;
  right:clamp(-40px,-1vw,0px);bottom:0;
  width:clamp(260px,30vw,430px);
  aspect-ratio:360/546;
}
.hero__art img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;
  mix-blend-mode:screen;opacity:0;
  filter:saturate(1.15) contrast(1.05);
  transition:opacity 1.1s var(--ease),transform 1.4s var(--ease);
  transform:scale(1.04);
}
.hero__art img.is-on{opacity:.95;transform:scale(1)}
@media (max-width:1180px){.hero__art{opacity:.6}}
@media (max-width:820px){.hero__art{opacity:.32;right:-14vw;width:70vw}}

.hero__inner{width:100%;max-width:1280px;margin-inline:auto;position:relative}
.hero__head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:clamp(20px,4vw,56px)}
.hero__copy{flex:1 1 520px;min-width:0}

.hero__top{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}

.hero__logo{height:clamp(24px,3vw,34px);width:auto;margin:16px 0 0;opacity:.78;
  filter:drop-shadow(0 0 18px rgba(120,170,255,.4))}

.hero__title{
  font-size:clamp(52px,9.6vw,138px);
  margin:10px 0 0;
}
.hero__title .ln{display:block;overflow:hidden}
.hero__title .ln > span{display:block}
.hero__title .lit{
  background:linear-gradient(96deg,#fff 8%,#cfe0ff 38%,var(--ice) 72%,#7fd8ff 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero__title .fire{
  background:linear-gradient(96deg,var(--fire) 0%,#ff9d4a 58%,#ffd39b 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

.hero__cnname{
  margin:14px 0 0;font-size:clamp(15px,1.6vw,19px);font-weight:600;letter-spacing:.42em;
  color:var(--ink-2);text-indent:.42em;
}
.hero__lede{margin-top:16px;max-width:44ch}

.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;align-items:center}
.hero__hint{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase}

/* stat rail */
.hero__stats{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;margin-top:clamp(30px,4.4vw,52px);
  border:1px solid var(--line);border-radius:var(--r-md);
  background:var(--line);overflow:hidden;
}
.stat{background:rgba(9,11,22,.86);padding:15px clamp(12px,2vw,22px)}
.stat b{display:block;font-family:var(--display);font-size:clamp(26px,3.6vw,44px);line-height:1;
  letter-spacing:.01em;color:#fff}
.stat b i{font-style:normal;font-size:.5em;color:var(--ice);margin-left:.15em;vertical-align:.4em}
.stat span{display:block;margin-top:7px;font-family:var(--mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-3)}
@media (max-width:700px){.hero__stats{grid-template-columns:repeat(2,1fr)}}

/* ═══════════ ticker ═══════════ */
.ticker{
  border-block:1px solid var(--line);
  background:linear-gradient(90deg,rgba(255,90,31,.07),rgba(44,76,232,.08),rgba(54,226,255,.07));
  overflow:hidden;padding:13px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.ticker__track{display:flex;width:max-content;animation:slide 38s linear infinite}
.ticker:hover .ticker__track{animation-play-state:paused}
.ticker__track span{
  font-family:var(--display);font-size:clamp(15px,1.8vw,22px);text-transform:uppercase;
  letter-spacing:.04em;color:rgba(238,242,253,.42);padding-inline:22px;white-space:nowrap;
  display:inline-flex;align-items:center;gap:22px;
}
.ticker__track span::after{content:"◆";font-size:.5em;color:var(--fire)}
@keyframes slide{to{transform:translate3d(-50%,0,0)}}
@media (prefers-reduced-motion:reduce){.ticker__track{animation:none}}

/* ═══════════ sections ═══════════ */
.sec{padding-block:var(--sec-y);position:relative}
.sec--tight{padding-block:clamp(60px,8vw,110px)}
.sec__head{
  display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;
  gap:24px;margin-bottom:clamp(34px,5vw,60px);
}
.sec__title{font-size:clamp(36px,6vw,80px);margin:12px 0 0;max-width:15ch}
.sec__side{max-width:40ch}

.rule{height:1px;border:0;margin:0;background:linear-gradient(90deg,var(--line),transparent)}

/* ═══════════ footer ═══════════ */
.foot{border-top:1px solid var(--line);padding:clamp(44px,6vw,72px) 0 40px;background:var(--void)}
.foot__top{display:flex;flex-wrap:wrap;gap:36px;justify-content:space-between;align-items:flex-start}
.foot__mark{font-family:var(--display);font-size:clamp(40px,9vw,110px);line-height:.9;
  text-transform:uppercase;transform:skewX(-6deg);color:transparent;-webkit-text-stroke:1px rgba(154,178,230,.26)}
.foot__cols{display:flex;flex-wrap:wrap;gap:clamp(28px,5vw,72px)}
.foot__col h4{margin:0 0 12px;font-family:var(--mono);font-size:10px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ink-3);font-weight:400}
.foot__col a,.foot__col p{display:block;margin:0 0 8px;font-size:13.5px;color:var(--ink-2)}
.foot__col a:hover{color:var(--ice)}
.foot__legal{
  margin-top:clamp(34px,5vw,56px);padding-top:22px;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:14px 28px;justify-content:space-between;
  font-size:12px;color:var(--ink-3);line-height:1.7;
}
.foot__legal p{margin:0;max-width:78ch}
