:root {
  --ink: #060b10;
  --deep: #081522;
  --panel: #0c1d2c;
  --cyan: #31dcff;
  --lime: #b9f549;
  --orange: #ff9d2e;
  --white: #f3f7ec;
  --muted: #a8b5bd;
  --line: rgba(153, 237, 255, 0.2);
  --display: "Archivo Black", Impact, sans-serif;
  --body: "Manrope", sans-serif;
  --mono: "DM Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 6.5rem; }
body {
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(ellipse 75% 42% at 75% -4%, rgba(0, 149, 226, .22), transparent 72%),
    radial-gradient(ellipse 55% 35% at -8% 42%, rgba(127, 214, 48, .1), transparent 72%),
    linear-gradient(155deg, #050b11 0%, #07111b 42%, #04090e 100%);
  color: var(--white);
  font-family: var(--body);
}
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.page-grid {
  position: fixed;
  inset: 0;
  z-index: -2;
  overflow: hidden;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(65, 197, 239, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(65, 197, 239, .055) 1px, transparent 1px),
    linear-gradient(115deg, transparent 48%, rgba(49, 220, 255, .06) 48.15%, transparent 48.3%);
  background-size: 64px 64px, 64px 64px, 330px 330px;
  mask-image: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, .78) 58%, transparent 96%);
}
.page-grid::before {
  position: absolute;
  content: "";
  width: 76vw;
  height: 76vw;
  top: -35vw;
  right: -17vw;
  border-radius: 43% 57% 64% 36% / 45% 36% 64% 55%;
  opacity: .62;
  background:
    radial-gradient(circle at 42% 58%, rgba(49, 220, 255, .2) 0 1px, transparent 2px),
    radial-gradient(circle at 50% 50%, transparent 0 33%, rgba(49, 220, 255, .13) 33.15% 33.35%, transparent 33.5% 45%, rgba(185, 245, 73, .09) 45.15% 45.3%, transparent 45.45% 60%, rgba(49, 220, 255, .08) 60.1% 60.25%, transparent 60.4%);
  filter: blur(.1px);
  animation: ambient-drift 24s ease-in-out infinite alternate;
}
.page-grid::after {
  position: absolute;
  content: "";
  inset: 0;
  opacity: .64;
  background:
    radial-gradient(circle at 58% 16%, rgba(24, 173, 241, .18), transparent 25%),
    radial-gradient(circle at 4% 48%, rgba(170, 255, 46, .08), transparent 18%),
    repeating-linear-gradient(90deg, transparent 0 119px, rgba(124, 233, 255, .035) 120px 121px);
}
.section { width: min(1280px, calc(100% - 48px)); margin: 0 auto; }
.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; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  width: min(1360px, calc(100% - 32px));
  height: 86px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  background: rgba(6, 11, 16, .82);
  backdrop-filter: blur(18px);
}
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; }
.brand img { width: 44px; height: 44px; object-fit: contain; filter: drop-shadow(0 0 8px rgba(49, 220, 255, .45)); }
.brand__text { display: grid; line-height: .8; letter-spacing: -.07em; font-family: var(--display); font-size: 1.03rem; }
.brand__text b { color: var(--white); }
.brand__text i { color: var(--lime); font-style: normal; text-align: right; }
.main-nav { display: flex; align-items: center; gap: clamp(1.25rem, 4vw, 3.8rem); margin-left: 10vw; }
.main-nav a { position: relative; padding: 10px 0; color: #b5c8d1; font-family: var(--mono); font-size: .74rem; font-weight: 500; letter-spacing: .11em; text-transform: uppercase; transition: color .2s ease; }
.main-nav a::after { position: absolute; content: ""; left: 0; right: 0; bottom: 4px; height: 2px; transform: scaleX(0); transform-origin: left; background: var(--lime); transition: transform .2s ease; }
.main-nav a:hover { color: var(--white); }.main-nav a:hover::after { transform: scaleX(1); }
.header-buy { display: inline-flex; align-items: center; gap: 7px; padding: 10px 16px 10px 11px; background: var(--lime); border-radius: 2px; color: #071109; font: 800 .73rem var(--mono); letter-spacing: .05em; text-transform: uppercase; transition: transform .2s ease, box-shadow .2s ease; }
.header-buy:hover { transform: translateY(-2px); box-shadow: 0 7px 0 #23873c; }.header-buy img { width: 23px; height: 23px; object-fit: contain; }
.menu-toggle { display: none; background: none; border: 0; color: var(--white); }

.hero { position: relative; isolation: isolate; min-height: 785px; padding: 45px 0 86px; }
.hero::before { position: absolute; z-index: -1; content: ""; width: 50%; height: 88%; right: -7%; top: 0; border-left: 1px solid rgba(70, 221, 252, .2); background: linear-gradient(145deg, transparent 12%, rgba(31, 154, 219, .13) 12.3%, transparent 12.7%), repeating-linear-gradient(0deg, rgba(57, 222, 255, .06), rgba(57, 222, 255, .06) 1px, transparent 1px, transparent 8px); box-shadow: -25px 0 80px rgba(21, 178, 231, .08); transform: skewX(-8deg); }
.hero::after { position: absolute; z-index: -1; content: ""; width: 56%; height: 245px; top: 29%; right: -13%; opacity: .58; border: 1px solid rgba(49, 220, 255, .22); border-left: 0; background: repeating-linear-gradient(90deg, rgba(49, 220, 255, .08) 0 1px, transparent 1px 45px), linear-gradient(180deg, transparent 0 22%, rgba(49, 220, 255, .12) 22.3% 23%, transparent 23.3% 54%, rgba(185, 245, 73, .13) 54.3% 55%, transparent 55.3%); clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%); transform: skewX(-13deg); }
.hero__tape { position: absolute; top: 12px; left: 18%; display: flex; align-items: center; gap: 16px; color: var(--cyan); font: .61rem var(--mono); letter-spacing: .13em; opacity: .8; }
.hero__layout { min-height: 650px; display: grid; grid-template-columns: 194px minmax(320px, .95fr) minmax(400px, 1.15fr); align-items: center; gap: clamp(1.4rem, 4vw, 5rem); }
.action-stack { display: grid; gap: 9px; align-content: center; }
.action-stack__label { margin: 0 0 6px; color: var(--cyan); font: .61rem var(--mono); letter-spacing: .16em; }
.action-button { position: relative; width: 100%; min-height: 66px; padding: 8px 10px; overflow: hidden; display: flex; align-items: center; gap: 9px; border: 1px solid rgba(95, 222, 252, .28); border-radius: 3px; background: rgba(11, 30, 42, .75); color: var(--white); text-align: left; cursor: pointer; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.action-button::before { position: absolute; content: ""; inset: 0; width: 4px; background: var(--cyan); transition: width .2s ease; }
.action-button:hover { transform: translateX(6px); border-color: var(--cyan); background: rgba(17, 47, 64, .9); }.action-button:hover::before { width: 100%; opacity: .09; }
.action-button img, .action-button svg { position: relative; z-index: 1; width: 36px; height: 36px; flex: 0 0 36px; object-fit: contain; }
.action-button--x .official-social-icon { padding: 9px; border-radius: 50%; background: var(--white); }
.action-button span { position: relative; z-index: 1; min-width: 0; font-size: .71rem; line-height: 1.2; font-weight: 800; text-transform: uppercase; }.action-button small { display: block; margin-top: 3px; color: #92a8b4; font: .56rem var(--mono); letter-spacing: .025em; text-transform: none; white-space: nowrap; }
.action-button b { position: relative; z-index: 1; margin-left: auto; color: var(--lime); font-size: 1.05rem; }.action-button--ca { border-color: rgba(185, 245, 73, .48); background: linear-gradient(105deg, rgba(17, 57, 58, .94), rgba(8, 26, 30, .88)); }.action-button--ca::before { background: var(--lime); }.action-button--ca img { filter: drop-shadow(0 0 8px rgba(49, 220, 255, .34)); }.action-button--ca:hover { border-color: var(--lime); box-shadow: 0 0 24px rgba(185, 245, 73, .12); }

.hero__copy { position: relative; z-index: 2; padding-top: 43px; }
.eyebrow { display: flex; align-items: center; gap: 8px; margin: 0 0 17px; color: var(--cyan); font: .66rem var(--mono); letter-spacing: .16em; }.eyebrow span { width: 22px; height: 1px; background: currentColor; }
h1, h2, h3, p { margin-top: 0; } h1, h2, h3 { font-family: var(--display); }
h1 { max-width: 630px; margin-bottom: 25px; font-size: clamp(3.35rem, 6.1vw, 6.3rem); line-height: .94; letter-spacing: -.065em; text-transform: uppercase; text-wrap: balance; }
h1 em { color: var(--lime); font-style: normal; text-shadow: 3px 3px 0 #173f2b; }
.hero__lede { max-width: 430px; color: #a7b7bf; font-size: .98rem; line-height: 1.8; }
.hero__stats { display: flex; gap: 20px; margin-top: 35px; }.hero__stats div { padding-right: 19px; border-right: 1px solid var(--line); }.hero__stats div:last-child { padding: 0; border: 0; }.hero__stats b { display: block; color: var(--white); font: 1.2rem var(--display); letter-spacing: -.06em; }.hero__stats span { color: var(--muted); font: .55rem var(--mono); letter-spacing: .07em; text-transform: uppercase; }

.hero__visual { position: relative; min-height: 630px; align-self: end; }
.hero__visual::before { position: absolute; z-index: 0; content: ""; width: 91%; height: 65%; bottom: 12%; left: 6%; opacity: .48; border: 1px solid rgba(49, 220, 255, .22); background: repeating-linear-gradient(90deg, transparent 0 52px, rgba(49, 220, 255, .1) 52px 53px), repeating-linear-gradient(0deg, transparent 0 52px, rgba(49, 220, 255, .1) 52px 53px), radial-gradient(circle at 50% 50%, rgba(49, 220, 255, .13), transparent 65%); clip-path: polygon(0 15%, 74% 0, 100% 46%, 63% 100%, 0 84%); transform: perspective(700px) rotateY(-11deg) rotateX(4deg); box-shadow: inset 0 0 65px rgba(49, 220, 255, .12); }
.hero__halo { position: absolute; left: 50%; top: 48%; width: min(37vw, 510px); aspect-ratio: 1; border: 1px solid rgba(49, 220, 255, .42); border-radius: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 0 18px rgba(49, 220, 255, .04), 0 0 0 54px rgba(49, 220, 255, .025), inset 0 0 60px rgba(49, 220, 255, .1); }.hero__halo::after { position: absolute; content: ""; inset: 11%; border: 1px dashed rgba(185, 245, 73, .5); border-radius: 50%; animation: spin 35s linear infinite; }
.hero__mascot { position: absolute; z-index: 2; bottom: -25px; left: 50%; width: min(35vw, 570px); max-width: none; height: auto; transform: translateX(-50%); filter: drop-shadow(18px 19px 0 rgba(0, 0, 0, .22)) drop-shadow(0 0 34px rgba(30, 181, 238, .24)); animation: mascot-enter .8s cubic-bezier(.2,.9,.25,1) both; }
.price-card { position: absolute; z-index: 4; padding: 10px 15px; border: 1px solid rgba(150, 241, 255, .45); background: rgba(5, 19, 28, .82); box-shadow: 7px 7px 0 rgba(49, 220, 255, .15); backdrop-filter: blur(8px); }.price-card span { display: block; color: #a0b9c4; font: .53rem var(--mono); letter-spacing: .13em; }.price-card b { color: var(--lime); font: 1rem var(--display); letter-spacing: -.04em; }.price-card--top { top: 15%; right: 3%; transform: rotate(4deg); }.price-card--bottom { bottom: 8%; left: 0; transform: rotate(-5deg); }.visual-caption { position: absolute; z-index: 3; right: 1%; bottom: 8%; color: rgba(199, 232, 234, .72); font: .56rem/1.6 var(--mono); letter-spacing: .05em; text-align: right; }

.roadmap { position: relative; isolation: isolate; padding: 110px 0 125px; border-top: 1px solid var(--line); }.roadmap::before { position: absolute; z-index: -1; content: ""; width: 34%; height: 62%; left: -12%; bottom: 3%; border: 1px solid rgba(185, 245, 73, .12); border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 30px, rgba(185, 245, 73, .055) 31px 32px); transform: rotate(-19deg); }.section-heading { max-width: 600px; margin-bottom: 48px; }.section-heading h2 { margin-bottom: 13px; font-size: clamp(2.6rem, 5vw, 5rem); line-height: .95; letter-spacing: -.065em; text-transform: uppercase; }.section-heading h2 i { color: var(--orange); font-style: normal; }.section-heading > p:last-child { max-width: 440px; color: var(--muted); font-size: .94rem; line-height: 1.75; }
.roadmap__list { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 0; padding: 0; list-style: none; }.roadmap__list::before { position: absolute; content: ""; z-index: -1; top: 43px; left: 9%; right: 9%; height: 1px; background: linear-gradient(90deg, var(--lime), var(--cyan), rgba(49, 220, 255, .13)); }
.roadmap-card { min-height: 276px; padding: 24px 22px; border: 1px solid rgba(129, 194, 211, .22); background: linear-gradient(140deg, rgba(10, 31, 46, .88), rgba(5, 13, 19, .82)); transition: transform .25s ease, border-color .25s ease; }.roadmap-card:hover { transform: translateY(-8px); border-color: var(--cyan); }.roadmap-card__number { display: grid; width: 39px; height: 39px; place-items: center; margin-bottom: 54px; border: 1px solid rgba(152, 232, 252, .46); border-radius: 50%; background: var(--ink); color: var(--cyan); font: .65rem var(--mono); }.roadmap-card__status { margin-bottom: 8px; color: #8196a0; font: .57rem var(--mono); letter-spacing: .12em; }.roadmap-card h3 { margin-bottom: 12px; font-size: 1.18rem; letter-spacing: -.045em; text-transform: uppercase; }.roadmap-card > p:last-child { margin-bottom: 0; color: #9eb0b8; font-size: .77rem; line-height: 1.65; }.roadmap-card--done .roadmap-card__number { border-color: var(--lime); color: var(--lime); box-shadow: 0 0 16px rgba(185, 245, 73, .18); }.roadmap-card--active { border-color: rgba(255, 157, 46, .56); }.roadmap-card--active .roadmap-card__number { border-color: var(--orange); color: var(--orange); box-shadow: 0 0 16px rgba(255, 157, 46, .15); }

.chart-section { position: relative; padding: 105px 0 120px; }.chart-section::before { position: absolute; z-index: -1; content: ""; width: 26vw; max-width: 380px; aspect-ratio: 1; right: -14vw; top: 40px; opacity: .3; border: 1px solid rgba(49, 220, 255, .35); border-radius: 50%; box-shadow: 0 0 0 32px rgba(49, 220, 255, .025), 0 0 0 65px rgba(49, 220, 255, .02); }.section-heading--chart { display: grid; grid-template-columns: 1fr auto; align-items: end; max-width: none; }.section-heading--chart .eyebrow, .section-heading--chart h2 { grid-column: 1; }.section-heading--chart a { grid-column: 2; grid-row: 2; margin-bottom: 13px; color: var(--lime); font: .67rem var(--mono); letter-spacing: .04em; }.section-heading--chart a span { margin-left: 4px; font-size: 1rem; }
.terminal { border: 1px solid rgba(102, 221, 247, .42); background: #07121b; box-shadow: 13px 13px 0 rgba(35, 168, 205, .12), 0 0 60px rgba(19, 146, 203, .1); }.terminal__bar { height: 52px; display: flex; align-items: center; gap: 16px; padding: 0 17px; border-bottom: 1px solid rgba(131, 216, 239, .26); background: #0b202d; }.terminal__lights { display: flex; gap: 5px; }.terminal__lights i { width: 8px; height: 8px; border-radius: 50%; background: #fb6e66; }.terminal__lights i:nth-child(2) { background: var(--orange); }.terminal__lights i:nth-child(3) { background: var(--lime); }.terminal__bar p { margin: 0; flex: 1; color: #8097a2; font: .62rem var(--mono); letter-spacing: .05em; }.terminal__bar p span { padding: 3px 5px; margin-right: 7px; background: rgba(185, 245, 73, .15); color: var(--lime); }.terminal__bar p b { color: var(--cyan); }.terminal__bar > a { color: var(--cyan); font-size: 1.1rem; }.terminal__screen { position: relative; min-height: 600px; background: #081017; }.terminal iframe { position: relative; z-index: 2; display: block; width: 100%; min-height: 600px; border: 0; }.chart-fallback { position: absolute; inset: 0; display: grid; place-content: center; gap: 14px; text-align: center; color: var(--muted); font: .7rem var(--mono); }.chart-fallback p { margin: 0; }.chart-fallback a { color: var(--lime); }

.site-footer { width: min(1360px, calc(100% - 32px)); min-height: 111px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 25px; border-top: 1px solid var(--line); }.site-footer p, .site-footer > a:last-child { margin: 0; color: #849aa5; font: .61rem var(--mono); letter-spacing: .05em; }.site-footer > a:last-child { color: var(--cyan); }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes mascot-enter { from { opacity: 0; transform: translate(-45%, 6%) rotate(2deg); } to { opacity: 1; transform: translateX(-50%); } }
@keyframes ambient-drift { from { transform: translate3d(0, 0, 0) rotate(-7deg) scale(1); } to { transform: translate3d(-3%, 6%, 0) rotate(8deg) scale(1.08); } }
@media (prefers-reduced-motion: reduce) { .page-grid::before { animation: none; } }
@media (max-width: 1050px) { .hero__layout { grid-template-columns: 166px minmax(260px, .85fr) minmax(320px, 1fr); gap: 26px; }.hero__mascot { width: min(41vw, 520px); }.main-nav { margin-left: 0; }.roadmap-card { padding: 20px 16px; } }
@media (max-width: 800px) { .site-header { width: calc(100% - 24px); height: 70px; }.brand img { width: 38px; height: 38px; }.header-buy { padding: 8px 9px; font-size: .63rem; }.header-buy img { width: 20px; height: 20px; }.menu-toggle { z-index: 23; display: grid; gap: 5px; padding: 8px; cursor: pointer; }.menu-toggle span:not(.sr-only) { display: block; width: 23px; height: 2px; background: var(--white); transition: transform .2s ease; }.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:nth-child(2) { transform: translateY(-3.5px) rotate(-45deg); }.main-nav { position: fixed; top: 0; right: 0; width: min(300px, 80vw); height: 100dvh; padding: 100px 35px; display: grid; align-content: start; gap: 5px; background: #0a1720; border-left: 1px solid var(--line); transform: translateX(110%); transition: transform .25s ease; }.main-nav.is-open { transform: translateX(0); }.main-nav a { padding: 16px 0; font-size: .85rem; }.main-nav a::after { bottom: 8px; }.hero { min-height: auto; padding-top: 55px; }.hero__tape { left: 0; white-space: nowrap; }.hero__layout { display: grid; grid-template-columns: 1fr; gap: 0; }.hero__copy { padding-top: 42px; }.hero__visual { min-height: 500px; width: min(100%, 560px); margin: 0 auto; }.hero__mascot { width: min(86vw, 480px); }.hero__halo { width: min(80vw, 450px); }.action-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); order: 3; gap: 8px; margin: 12px 0 0; }.action-stack__label { grid-column: 1 / -1; }.action-button { min-height: 63px; }.action-button:hover { transform: translateY(-3px); }.roadmap__list { grid-template-columns: repeat(2, 1fr); }.roadmap__list::before { display: none; }.roadmap-card__number { margin-bottom: 29px; }.section-heading--chart { display: block; }.section-heading--chart a { display: inline-block; margin-top: 3px; }.terminal__screen, .terminal iframe { min-height: 480px; }.site-footer { width: calc(100% - 24px); padding: 22px 0; flex-wrap: wrap; }.site-footer .brand { order: 1; }.site-footer p { order: 3; width: 100%; }.site-footer > a:last-child { order: 2; margin-left: auto; } }
@media (max-width: 480px) { .section { width: min(100% - 28px, 1280px); }.brand__text { font-size: .86rem; }.header-buy { gap: 3px; }.header-buy img { display: none; }.hero { padding-bottom: 55px; }.hero__tape { font-size: .51rem; }.hero__copy { padding-top: 33px; } h1 { font-size: clamp(2.8rem, 15vw, 4.6rem); }.hero__lede { font-size: .87rem; }.hero__stats { gap: 11px; }.hero__stats div { padding-right: 10px; }.hero__stats b { font-size: 1rem; }.hero__visual { min-height: 400px; }.price-card--top { right: 0; }.price-card--bottom { left: 0; bottom: 11%; }.visual-caption { display: none; }.action-stack { grid-template-columns: 1fr; }.roadmap { padding: 80px 0; }.roadmap__list { grid-template-columns: 1fr; }.roadmap-card { min-height: 0; }.chart-section { padding: 75px 0; }.terminal { margin-left: -2px; margin-right: -2px; }.terminal__bar { padding: 0 11px; gap: 10px; }.terminal__bar p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.terminal__screen, .terminal iframe { min-height: 395px; } }