@font-face {
  font-family: "Michroma";
  src: url("assets/Michroma-Regular.ttf") format("truetype");
  font-display: swap;
}

:root {
  --black: #070707;
  --near-black: #0b0b0b;
  --surface: #111212;
  --bone: #f2eee7;
  --muted: #99938d;
  --line: rgba(242, 238, 231, 0.14);
  --red: #246bfe;
  --red-hot: #36c7ff;
  --cyan: #3be3f3;
  --display: "Michroma", "Arial Black", sans-serif;
  --sans: Inter, Helvetica, Arial, sans-serif;
  --pad: clamp(1.25rem, 4vw, 5rem);
}

* { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: smooth; background: var(--black); }
body { margin: 0; overflow-x: clip; background: var(--black); color: var(--bone); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
::selection { background: var(--red); color: white; }

.skip-link { position: fixed; z-index: 100; top: 1rem; left: 1rem; padding: .8rem 1rem; background: var(--bone); color: var(--black); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.grain { position: fixed; z-index: 90; inset: 0; contain: strict; overflow: hidden; pointer-events: none; opacity: .032; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); animation: noise .24s steps(2) infinite; }
.cursor-glow { position: fixed; z-index: 0; width: 34rem; aspect-ratio: 1; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, rgba(36,107,254,.12), transparent 68%); transform: translate(-50%, -50%); left: var(--mouse-x, 50vw); top: var(--mouse-y, 50vh); }

.site-header { position: fixed; z-index: 80; top: 0; left: 0; width: 100%; height: 5.5rem; padding: 0 var(--pad); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid transparent; transition: height .3s ease, background .3s ease, border-color .3s ease; }
.site-header.is-scrolled { height: 4.5rem; background: rgba(7,7,7,.86); border-color: var(--line); backdrop-filter: blur(18px); }
.wordmark { display: flex; gap: .8rem; align-items: center; font: .82rem/1 var(--display); letter-spacing: .18em; }
.wordmark svg { width: 2.6rem; fill: none; stroke: var(--cyan); stroke-width: 2; }
.desktop-nav { display: flex; gap: 2.2rem; color: #bbb6af; font-size: .74rem; text-transform: uppercase; letter-spacing: .13em; }
.desktop-nav a, .footer-links a { transition: color .2s ease; }
.desktop-nav a:hover, .footer-links a:hover { color: var(--red-hot); }
.nav-download { padding: .72rem 1rem; border: 1px solid rgba(242,238,231,.28); font: .66rem/1 var(--display); letter-spacing: .05em; text-transform: uppercase; transition: background .2s, color .2s; }
.nav-download:hover { color: var(--black); background: var(--bone); }

.hero { position: relative; min-height: 63rem; height: 100svh; overflow: hidden; isolation: isolate; background: radial-gradient(circle at 50% 42%, #07162d 0, #080b11 42%, #050505 72%); }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .16; background-image: linear-gradient(rgba(255,255,255,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.15) 1px, transparent 1px); background-size: 5vw 5vw; mask-image: linear-gradient(to bottom, black, transparent 78%); }
.hero-wave { position: absolute; z-index: -1; inset: 15% 0 auto; width: 100%; height: 50%; opacity: .28; mix-blend-mode: screen; }
.hero-beam { position: absolute; z-index: -1; width: 42vw; height: 110%; top: -10%; left: 50%; transform: translateX(-50%) rotate(8deg); background: linear-gradient(90deg, transparent, rgba(36,107,254,.08), transparent); filter: blur(10px); }
.hero-copy { position: relative; z-index: 2; height: 100%; padding: 7.8rem var(--pad) 3rem; display: flex; flex-direction: column; }
.eyebrow, .section-index { display: flex; align-items: center; gap: 1rem; color: #aaa49d; font: .67rem/1 var(--display); letter-spacing: .16em; text-transform: uppercase; }
.eyebrow::before, .section-index::before { content: ""; width: 2.5rem; height: 1px; background: currentColor; }
.eyebrow span, .section-index span { color: var(--red-hot); }
.hero-title { margin: auto 0 0; display: flex; align-items: baseline; justify-content: center; font: clamp(6.3rem, 18.7vw, 22rem)/.77 var(--display); letter-spacing: -.08em; white-space: nowrap; color: var(--bone); filter: drop-shadow(0 0 45px rgba(0,0,0,.75)); }
.title-line { animation: title-in 1.15s cubic-bezier(.2,.75,.2,1) both; }
.title-outline { color: transparent; -webkit-text-stroke: 2px rgba(242,238,231,.8); animation-delay: .1s; }
.hero-bottom { margin-top: auto; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2rem; }
.hero-kicker { margin: 0 0 .65rem; font: clamp(1.25rem, 2.1vw, 2rem)/1 var(--display); text-transform: uppercase; }
.hero-description { max-width: 34rem; margin: 0; color: #aaa49e; font-size: .98rem; line-height: 1.6; }
.primary-cta { min-width: 21rem; display: flex; align-items: center; gap: 1.15rem; padding: 1rem 1.2rem; color: white; background: var(--red); box-shadow: 0 0 0 1px rgba(255,255,255,.08) inset, 0 1rem 5rem rgba(36,107,254,.22); transition: background .25s, transform .25s; }
.primary-cta:hover { background: var(--red-hot); transform: translateY(-3px); }
.cta-icon { width: 3rem; aspect-ratio: 1; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.4); font-size: 1.4rem; }
.primary-cta strong, .primary-cta small { display: block; }
.primary-cta strong { margin-bottom: .38rem; font: .78rem/1 var(--display); text-transform: uppercase; letter-spacing: .08em; }
.primary-cta small { color: rgba(255,255,255,.7); font-size: .69rem; letter-spacing: .05em; }
.plugin-stage { position: absolute; z-index: 3; left: 50%; top: 50%; width: min(69vw, 69rem); transform: translate(-50%, -47%) perspective(1400px) rotateX(4deg); transform-style: preserve-3d; filter: drop-shadow(0 3rem 5rem rgba(0,0,0,.9)); }
.plugin-stage img { position: relative; z-index: 2; border-radius: .6vw; border: 1px solid rgba(72,226,243,.35); box-shadow: 0 0 1.2rem rgba(59,227,243,.1); }
.plugin-halo { position: absolute; inset: -18%; z-index: -1; background: radial-gradient(ellipse, rgba(36,107,254,.34), transparent 62%); filter: blur(30px); animation: breathe 5s ease-in-out infinite; }
.plugin-reflection { position: absolute; z-index: -1; left: 5%; right: 5%; top: 92%; height: 30%; opacity: .25; background: linear-gradient(rgba(36,107,254,.35), transparent); filter: blur(25px); transform: rotateX(70deg); }
.scroll-cue { position: absolute; z-index: 5; bottom: 2rem; left: 50%; display: flex; align-items: center; gap: .7rem; color: #77726c; font: .56rem/1 var(--display); letter-spacing: .15em; text-transform: uppercase; transform: translateX(-50%); }
.scroll-cue span { width: 1px; height: 1.5rem; background: var(--red); animation: scroll 1.7s infinite; }

.signal-strip { position: relative; z-index: 2; overflow: hidden; padding: 1.15rem 0; color: var(--black); background: var(--bone); }
.marquee-track { width: max-content; display: flex; align-items: center; animation: marquee 25s linear infinite; }
.marquee-track span { padding: 0 2rem; font: .74rem/1 var(--display); letter-spacing: .13em; }
.marquee-track i { width: .38rem; aspect-ratio: 1; background: var(--red); border-radius: 50%; }
.section-shell { position: relative; z-index: 2; padding-left: var(--pad); padding-right: var(--pad); }
.manifesto { padding-top: clamp(7rem, 13vw, 13rem); padding-bottom: clamp(7rem, 12vw, 12rem); }
.manifesto-grid { margin-top: 5rem; display: grid; grid-template-columns: 1.2fr .8fr; gap: 7vw; align-items: end; }
.manifesto-grid > *, .showcase-head > *, .features-layout > *, .detail-shot > * { min-width: 0; }
.display-copy { margin: 0; font: clamp(3rem, 8.5vw, 9rem)/.93 var(--display); letter-spacing: -.065em; }
.display-copy em, .features-intro em, .download-section h2 em { color: transparent; font-style: normal; -webkit-text-stroke: 1px var(--red-hot); }
.manifesto-text { padding-bottom: .8rem; }
.manifesto-text .lead { margin: 0 0 2rem; color: var(--bone); font: 1.2rem/1.4 var(--display); }
.manifesto-text > p:not(.lead) { color: var(--muted); font-size: 1.05rem; line-height: 1.75; }
.stat-row { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--line); display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.stat-row strong, .stat-row span { display: block; }
.stat-row strong { color: var(--red-hot); font: 1.6rem/1 var(--display); }
.stat-row span { margin-top: .75rem; color: #77716b; font-size: .68rem; line-height: 1.35; text-transform: uppercase; letter-spacing: .08em; }

.multiband-showcase { padding-top: 3rem; padding-bottom: clamp(8rem, 13vw, 14rem); }
.showcase-head { width: 100%; margin: 0; display: grid; grid-template-columns: 1fr .45fr; gap: 7vw; align-items: end; }
.showcase-head h2, .features-intro h2 { margin: 2.2rem 0 0; font: clamp(2.3rem, 5vw, 5.8rem)/1.02 var(--display); letter-spacing: -.045em; text-transform: uppercase; }
.showcase-head > p { margin: 0 0 .4rem; color: var(--muted); line-height: 1.7; }
.screen-frame { position: relative; width: min(69vw, 69rem); margin: 5rem auto 0; padding: 2.4rem 1.4rem 1.4rem; border: 1px solid rgba(59,227,243,.25); background: #081014; box-shadow: 0 4rem 10rem rgba(0,0,0,.8); overflow: hidden; }
.screen-frame::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 42%, rgba(255,255,255,.05) 50%, transparent 58%); transform: translateX(-120%); transition: transform 1s ease; }
.screen-frame:hover::before { transform: translateX(120%); }
.screen-label { position: absolute; top: .8rem; left: 1.4rem; right: 1.4rem; display: flex; justify-content: flex-end; color: var(--cyan); font: .48rem/1 var(--display); letter-spacing: .18em; }
.screen-label span:first-child { position: absolute; left: 50%; transform: translateX(-50%); }
.screen-frame img { width: 100%; border: 1px solid rgba(255,255,255,.07); }

.features { padding-top: clamp(7rem, 10vw, 11rem); padding-bottom: clamp(7rem, 12vw, 13rem); border-top: 1px solid var(--line); background: linear-gradient(180deg, #090909, #080d17); }
.features-layout { margin-top: 5rem; display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; }
.features-intro { position: sticky; top: 8rem; align-self: start; }
.features-intro h2 { margin-top: 0; font-size: clamp(2.4rem, 4.6vw, 5.2rem); }
.features-intro h2 em { display: block; margin-top: .18em; font-size: .64em; line-height: 1.14; }
.features-intro p { max-width: 31rem; color: var(--muted); line-height: 1.7; }
.feature { padding: 2rem 0; display: grid; grid-template-columns: 2.5rem 1fr auto; gap: 1.3rem; border-top: 1px solid var(--line); transition: padding .25s, border-color .25s; }
.feature:last-child { border-bottom: 1px solid var(--line); }
.feature:hover { padding-left: 1rem; border-color: rgba(36,107,254,.6); }
.feature-number { padding-top: .3rem; color: var(--red-hot); font: .55rem/1 var(--display); }
.feature h3 { margin: 0 0 .8rem; font: 1rem/1.3 var(--display); text-transform: uppercase; }
.feature p { max-width: 39rem; margin: 0; color: var(--muted); line-height: 1.65; }
.feature-mark { color: #6f6964; font-size: 1.2rem; line-height: 1; transition: color .2s, transform .2s; }
.feature:hover .feature-mark { color: var(--red-hot); transform: translate(.2rem, -.2rem); }

.detail-shot { padding-top: clamp(6rem, 10vw, 11rem); padding-bottom: clamp(6rem, 10vw, 11rem); display: grid; grid-template-columns: .55fr 1fr; gap: 6vw; align-items: center; overflow: hidden; }
.mono-label { color: var(--cyan); font: .58rem/1 var(--display); letter-spacing: .14em; }
.detail-copy h2 { margin: 1.7rem 0; font: clamp(2rem, 3.8vw, 4rem)/1.08 var(--display); letter-spacing: -.04em; text-transform: uppercase; }
.detail-copy p { max-width: 31rem; color: var(--muted); line-height: 1.7; }
.detail-copy a { display: inline-flex; gap: .7rem; margin-top: 1.3rem; padding-bottom: .45rem; border-bottom: 1px solid var(--red-hot); font: .68rem/1 var(--display); letter-spacing: .06em; text-transform: uppercase; }
.detail-image { position: relative; width: 100%; transform: none; }
.detail-image::before { content: ""; position: absolute; inset: 10% 0; z-index: -1; background: rgba(59,227,243,.13); filter: blur(60px); }
.detail-image img { border: 1px solid rgba(59,227,243,.25); box-shadow: 0 3rem 7rem #000; }

.download-section { position: relative; overflow: hidden; border-top: 1px solid rgba(36,107,254,.4); background: #050a12; }
.download-section::before { content: ""; position: absolute; inset: 0; opacity: .11; background: repeating-linear-gradient(90deg, transparent 0, transparent calc(8.333% - 1px), var(--bone) 8.333%); }
.download-glow { position: absolute; width: 65vw; aspect-ratio: 1; left: 50%; top: 20%; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle, rgba(36,107,254,.36), transparent 62%); filter: blur(20px); }
.download-inner { padding-top: clamp(7rem, 12vw, 12rem); padding-bottom: clamp(7rem, 11vw, 11rem); text-align: center; }
.download-inner .section-index { justify-content: center; }
.download-pretitle { margin: 4rem 0 1.3rem; color: var(--red-hot); font: .7rem/1 var(--display); letter-spacing: .16em; text-transform: uppercase; }
.download-section h2 { position: relative; margin: 0; font: clamp(4rem, 10.2vw, 11rem)/.86 var(--display); letter-spacing: -.07em; }
.download-sub { margin: 2rem auto 3.5rem; color: var(--muted); font-size: 1.05rem; }
.download-grid { max-width: 64rem; margin: 0 auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.download-card { display: grid; grid-template-columns: auto 1fr auto; gap: 1.3rem; align-items: center; padding: 1.25rem; text-align: left; border: 1px solid rgba(242,238,231,.22); background: rgba(7,7,7,.66); backdrop-filter: blur(14px); transition: background .25s, border-color .25s, transform .25s; }
.download-card:hover { background: var(--red); border-color: var(--red-hot); transform: translateY(-4px); }
.platform-icon { width: 3.5rem; height: 3.5rem; display: grid; place-items: center; }
.platform-icon i { display: block; color: var(--red-hot); font-size: 1.75rem; line-height: 1; }
.download-card strong, .download-card span, .download-card small { display: block; }
.download-card strong { margin-bottom: .35rem; font: .95rem/1 var(--display); }
.download-card div > span { color: #aba59f; font-size: .75rem; }
.download-card small { margin-top: .55rem; color: #716c67; font-size: .62rem; letter-spacing: .07em; }
.download-card:hover div > span, .download-card:hover small { color: rgba(255,255,255,.72); }
.download-arrow { color: var(--red-hot); font-size: 1.55rem; line-height: 1; }
.download-card:hover .platform-icon i, .download-card:hover .download-arrow { color: white; }
.install-note { margin: 1.5rem auto 0; color: #6f6964; font-size: .7rem; }
.install-note a { color: var(--bone); border-bottom: 1px solid; }

.site-footer { padding-top: 5rem; padding-bottom: 2rem; background: #050505; }
.footer-main { display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 4rem; border-bottom: 1px solid var(--line); }
.footer-logo { position: relative; font: clamp(2rem, 5vw, 5rem)/1 var(--display); letter-spacing: -.05em; }
.footer-logo span { position: absolute; top: 0; right: -1rem; color: var(--red); font: .45rem/1 var(--display); }
.footer-main p { margin: .3rem 0 0; color: var(--muted); font-size: .8rem; line-height: 1.6; text-align: right; text-transform: uppercase; letter-spacing: .08em; }
.footer-links { padding: 3rem 0 4rem; display: grid; grid-template-columns: repeat(2, 12rem); justify-content: end; gap: 3rem; }
.footer-links div { display: flex; flex-direction: column; gap: .8rem; }
.footer-links span { margin-bottom: .4rem; color: #5e5955; font: .55rem/1 var(--display); letter-spacing: .13em; }
.footer-links a { display: inline-flex; align-items: center; gap: .35rem; color: #a49f99; font-size: .78rem; }
.footer-links a i { font-size: .9rem; line-height: 1; }
.footer-bottom { padding-top: 1.5rem; display: flex; justify-content: space-between; border-top: 1px solid var(--line); color: #514c48; font: .52rem/1 var(--display); letter-spacing: .14em; }

.reveal { opacity: 0; transform: translateY(2rem); transition: opacity .85s ease, transform .85s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@keyframes title-in { from { opacity: 0; transform: translateY(100%) rotate(2deg); } to { opacity: 1; transform: none; } }
@keyframes breathe { 50% { opacity: .55; transform: scale(1.07); } }
@keyframes scroll { 0% { transform: scaleY(0); transform-origin: top; } 45% { transform: scaleY(1); transform-origin: top; } 55% { transform: scaleY(1); transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes noise { 0% { background-position: 0 0; } 25% { background-position: 2rem -3rem; } 50% { background-position: -3rem 2rem; } 75% { background-position: 3rem 4rem; } 100% { background-position: -2rem -1rem; } }

@media (max-width: 900px) {
  .desktop-nav { display: none; }
  .hero { min-height: 49rem; }
  .hero-copy { padding-top: 7rem; }
  .hero-title { justify-content: flex-start; font-size: 20vw; }
  .plugin-stage { top: 47%; width: 88vw; }
  .hero-bottom { grid-template-columns: 1fr; }
  .hero-description { max-width: 26rem; }
  .primary-cta { min-width: 0; max-width: 24rem; }
  .scroll-cue { display: none; }
  .manifesto-grid, .showcase-head, .features-layout, .detail-shot { grid-template-columns: 1fr; }
  .manifesto-text { max-width: 42rem; }
  .showcase-head > p { max-width: 33rem; }
  .features-intro { position: static; }
  .detail-image { width: 110%; margin-top: 2rem; }
}

@media (max-width: 600px) {
  .cursor-glow { display: none; }
  .site-header { height: 4.6rem; }
  .wordmark svg { width: 2rem; }
  .wordmark span { display: none; }
  .nav-download { font-size: .56rem; }
  .hero { min-height: 46rem; max-height: 52rem; }
  .eyebrow { font-size: .52rem; }
  .hero-copy { padding-top: 6rem; padding-bottom: 1.5rem; }
  .hero-title { position: relative; z-index: 4; margin-top: 4.5rem; font-size: 19vw; text-shadow: 0 .2rem 1.4rem #000; }
  .plugin-stage { top: 42%; width: calc(100vw - 2rem); }
  .hero-bottom { margin-top: auto; }
  .hero-kicker { font-size: 1rem; }
  .hero-description { font-size: .83rem; }
  .primary-cta { width: 100%; }
  .manifesto-grid, .features-layout { margin-top: 2.75rem; }
  .manifesto { padding-top: 5rem; padding-bottom: 5.5rem; }
  .display-copy { font-size: 12.8vw; }
  .manifesto-text .lead { font-size: .95rem; }
  .stat-row { margin-top: 2.25rem; padding-top: 1.5rem; gap: .5rem; }
  .stat-row strong { font-size: 1.2rem; }
  .stat-row span { font-size: .52rem; }
  .showcase-head h2 { font-size: 9.5vw; }
  .multiband-showcase { padding-top: 2rem; padding-bottom: 6rem; }
  .features-intro h2 { font-size: 7.8vw; }
  .features-intro h2 em { margin-top: .08em; font-size: 1em; line-height: 1.02; }
  .screen-frame { margin-top: 2.5rem; width: calc(100vw - 2rem); margin-left: calc(50% - 50vw + 1rem); padding: 2rem .4rem .4rem; }
  .screen-label { left: .6rem; right: .6rem; }
  .features { padding-top: 5.5rem; padding-bottom: 6rem; }
  .feature { grid-template-columns: 2rem 1fr; padding-top: 1.5rem; padding-bottom: 1.5rem; }
  .feature-mark { display: none; }
  .detail-shot { padding-top: 5.5rem; padding-bottom: 5.5rem; }
  .detail-image { width: calc(100vw - 2rem); margin: 2.5rem 0 0 calc(50% - 50vw + 1rem); transform: none; }
  .detail-image img { width: 100%; }
  .download-inner { padding-top: 6rem; padding-bottom: 6rem; }
  .download-pretitle { margin-top: 3rem; }
  .download-sub { margin-top: 1.5rem; margin-bottom: 2.5rem; }
  .download-grid { grid-template-columns: 1fr; }
  .download-section h2 { font-size: 14vw; }
  .download-card { padding: 1rem; }
  .platform-icon { width: 3rem; height: 3rem; }
  .site-footer { padding-top: 4rem; }
  .footer-main { display: block; }
  .footer-main p { margin-top: 1.5rem; text-align: left; }
  .footer-links { justify-content: start; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
  .footer-bottom { gap: 1rem; font-size: .42rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}