:root {
  color-scheme: dark;
  --bg: #020a08;
  --panel: rgba(4, 23, 18, .82);
  --green: #00e99a;
  --green-deep: #059657;
  --orange: #ff8a00;
  --text: #f5f8f7;
  --soft: #c0cbc7;
  --muted: #82928c;
  --line: rgba(92, 143, 123, .22);
  --pointer-x: 70vw;
  --pointer-y: 45vh;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { background: var(--bg); min-width: 320px; }
body {
  min-height: 100svh;
  overflow-x: hidden;
  background: #020a08;
  color: var(--text);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(circle 220px at var(--pointer-x) var(--pointer-y), rgba(0,233,154,.045), transparent 72%);
}
.scene { position: fixed; inset: 0; overflow: hidden; pointer-events: none; }
.scene::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(2,10,8,.98) 0%, rgba(2,10,8,.9) 31%, rgba(2,10,8,.26) 58%, rgba(2,10,8,.12) 100%),
    linear-gradient(180deg, rgba(2,10,8,.1), rgba(2,10,8,.04) 62%, rgba(2,10,8,.82));
}
.scene-grid {
  position: absolute;
  inset: 50% 0 0;
  opacity: .34;
  transform: perspective(500px) rotateX(62deg) scale(1.35);
  transform-origin: center bottom;
  background-image: linear-gradient(rgba(0,233,154,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(0,233,154,.12) 1px, transparent 1px);
  background-size: 48px 48px;
}
.scene-glow {
  position: absolute;
  width: 62vw;
  height: 62vw;
  right: -7vw;
  top: -7vw;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,173,110,.18), transparent 64%);
  filter: blur(14px);
}
.world { position: absolute; width: min(68vw, 1040px); height: min(78vw, 900px); right: -2vw; top: 6vh; }
.market-card rect { fill: rgba(2,20,16,.86); stroke: rgba(32,223,145,.46); stroke-width: 1; }
.chart-line { fill: none; stroke: #00ed9d; stroke-width: 2.4; filter: url(#glow); }
.candles { fill: #00e99a; stroke: #00e99a; stroke-width: 2; }
.ticker { stroke: rgba(60,215,148,.22); }
.ticker-dots { fill: #00e99a; }
.connections { animation: pulse 2.6s ease-in-out infinite alternate; }
.connection-lines { opacity: .78; stroke-dasharray: 4 6; animation: flow 10s linear infinite; }
.stars i { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px var(--green); animation: float 5s ease-in-out infinite; }
.stars i:nth-child(1){left:52%;top:18%}.stars i:nth-child(2){left:71%;top:12%;animation-delay:-2s}.stars i:nth-child(3){left:84%;top:26%;animation-delay:-3s}.stars i:nth-child(4){left:58%;top:72%;animation-delay:-1s}.stars i:nth-child(5){left:92%;top:66%;animation-delay:-4s}.stars i:nth-child(6){left:48%;top:46%;animation-delay:-2.5s}
.site-header {
  position: relative;
  z-index: 5;
  height: 82px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  max-width: 1340px;
  margin: 0 auto;
  padding: 0 42px;
  border-bottom: 1px solid rgba(75,128,106,.17);
}
.brand { display: inline-flex; width: max-content; }
.brand svg { display: block; width: 166px; height: 52px; }
.language {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid rgba(166,193,180,.36);
  border-radius: 999px;
  background: rgba(5,18,14,.54);
  color: var(--text);
  font: inherit;
  cursor: default;
}
.language svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.language b { margin-left: 4px; color: var(--soft); font-size: 18px; font-weight: 400; }
.status { justify-self: end; display: flex; align-items: center; gap: 14px; color: #abb6b2; font-size: 11px; letter-spacing: .32em; text-transform: uppercase; }
.status span { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); animation: pulse 1.8s ease-in-out infinite alternate; }
main { position: relative; z-index: 2; min-height: calc(100svh - 146px); }
.hero { width: min(1340px, 100%); min-height: 610px; margin: 0 auto; display: flex; align-items: center; padding: 55px 42px 30px; }
.hero-copy { width: min(610px, 48vw); }
.eyebrow { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; color: #aab7b2; font-size: 11px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; }
.eyebrow span { width: 34px; height: 1px; background: var(--orange); }
h1 { font-size: clamp(54px, 5.4vw, 82px); line-height: 1.03; letter-spacing: -.052em; font-weight: 760; }
h1 em { color: var(--green); font-style: normal; }
h1 strong { color: var(--orange); font-weight: inherit; text-shadow: 0 0 28px rgba(255,138,0,.25); }
.lead { margin-top: 24px; font-size: clamp(18px,1.6vw,22px); line-height: 1.45; color: #eef3f1; }
.support { margin-top: 10px; max-width: 585px; color: var(--soft); font-size: 15px; line-height: 1.6; }
.notify-form { margin-top: 28px; width: min(650px, 100%); }
.form-shell { display: grid; grid-template-columns: 46px minmax(0,1fr) 190px; min-height: 66px; align-items: center; overflow: hidden; border: 1px solid rgba(144,176,161,.5); border-radius: 16px; background: rgba(2,15,12,.78); box-shadow: 0 18px 60px rgba(0,0,0,.28); transition: border-color .18s, box-shadow .18s; }
.form-shell:focus-within { border-color: rgba(0,233,154,.72); box-shadow: 0 0 0 3px rgba(0,233,154,.08), 0 18px 60px rgba(0,0,0,.3); }
.mail-icon { display: grid; place-items: center; color: #a2b5ad; }
.mail-icon svg { width: 24px; fill: none; stroke: currentColor; stroke-width: 1.5; }
input { min-width: 0; height: 100%; padding: 0 10px; border: 0; outline: 0; background: transparent; color: var(--text); font: inherit; font-size: 16px; }
input::placeholder { color: #84958e; }
.form-shell button { align-self: stretch; border: 0; background: linear-gradient(135deg,#ffb000,#ff6900); color: white; font: inherit; font-weight: 750; font-size: 15px; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; transition: filter .18s, transform .18s; }
.form-shell button:hover { filter: brightness(1.12); }
.form-shell button:active { transform: scale(.985); }
.form-shell button:focus-visible { outline: 2px solid white; outline-offset: -4px; }
.form-shell button:disabled { cursor: wait; opacity: .7; }
.form-note { margin-top: 12px; text-align: center; color: #d0d9d5; font-size: 11px; }
.form-error { margin-top: 8px; color: #ff9b75; font-size: 12px; }
.success { margin-top: 28px; padding: 16px 18px; display: flex; gap: 13px; align-items: center; border: 1px solid rgba(0,233,154,.38); border-radius: 14px; background: rgba(3,35,25,.86); }
.success-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--green); color: #012016; font-weight: 900; }
.success p { margin-top: 3px; color: var(--soft); font-size: 12px; }
.benefits { display: flex; flex-wrap: wrap; justify-content: center; gap: 28px; margin-top: 18px; color: #dce4e1; font-size: 12px; }
.benefits span { display: inline-flex; align-items: center; gap: 8px; }
.benefits i { display: grid; place-items: center; width: 18px; height: 18px; border: 1px solid var(--green); border-radius: 50%; color: var(--green); font-style: normal; font-size: 11px; }
.features { width: min(1280px, calc(100% - 60px)); margin: 0 auto; display: grid; grid-template-columns: repeat(6,1fr); gap: 22px; padding: 4px 0 48px; }
.features article { text-align: center; }
.feature-icon { display: grid; place-items: center; width: 66px; height: 66px; margin: 0 auto 12px; border: 1px solid rgba(66,145,113,.5); border-radius: 14px; background: linear-gradient(145deg,rgba(4,42,31,.8),rgba(3,17,14,.88)); box-shadow: inset 0 0 22px rgba(0,233,154,.06); }
.feature-icon svg { width: 38px; height: 38px; fill: none; stroke: var(--green); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 7px rgba(0,233,154,.24)); }
.features h2 { color: #f1f5f3; font-size: 13px; text-transform: uppercase; }
.features p { margin-top: 7px; color: #d0d8d5; font-size: 12px; line-height: 1.45; }
footer { position: relative; z-index: 5; min-height: 64px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; padding: 0 42px; border-top: 1px solid rgba(75,128,106,.2); color: #a7b3ae; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
footer .footer-center { display: flex; align-items: center; gap: 24px; letter-spacing: .2em; }
.footer-center i { width: 34px; height: 1px; background: var(--orange); }
footer nav { justify-self: end; display: flex; gap: 18px; }
footer a { color: inherit; text-decoration: none; text-transform: none; letter-spacing: 0; }
footer a:hover { color: var(--green); }
[hidden] { display: none !important; }
.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; }
@keyframes pulse { from { opacity: .55; } to { opacity: 1; } }
@keyframes flow { to { stroke-dashoffset: -100; } }
@keyframes float { 50% { transform: translateY(-12px); opacity: .55; } }
@media (max-width: 1100px) {
  .world { right: -18vw; opacity: .8; }
  .scene::after { background: linear-gradient(90deg,rgba(2,10,8,.98),rgba(2,10,8,.82) 50%,rgba(2,10,8,.25)); }
  .hero-copy { width: min(620px,62vw); }
  .features { grid-template-columns: repeat(3,1fr); row-gap: 28px; }
}
@media (max-width: 760px) {
  .site-header { height: 70px; grid-template-columns: 1fr auto; padding: 0 20px; }
  .brand svg { width: 142px; }
  .language { display: none; }
  .status { font-size: 9px; }
  .world { width: 1050px; height: 940px; right: -590px; top: 85px; opacity: .42; }
  .scene::after { background: linear-gradient(90deg,rgba(2,10,8,.98) 0%,rgba(2,10,8,.86) 72%,rgba(2,10,8,.45)); }
  .hero { min-height: auto; padding: 58px 22px 42px; }
  .hero-copy { width: 100%; }
  h1 { font-size: clamp(46px,14vw,66px); }
  .support { font-size: 14px; }
  .form-shell { grid-template-columns: 42px 1fr; border-radius: 13px; overflow: visible; }
  .form-shell button { grid-column: 1 / -1; min-height: 54px; margin: 6px -1px -1px; border-radius: 0 0 13px 13px; }
  .form-note { text-align: left; }
  .benefits { justify-content: flex-start; gap: 12px 20px; }
  .features { width: calc(100% - 36px); grid-template-columns: repeat(2,1fr); gap: 28px 12px; padding-bottom: 38px; }
  footer { grid-template-columns: 1fr; justify-items: center; gap: 12px; padding: 20px; text-align: center; }
  footer nav { justify-self: center; }
}
@media (max-width: 420px) {
  .status { display: none; }
  h1 { font-size: 44px; }
  .features { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}
