:root{
  --bg:#08080c; --card:#0f1116; --ink:#eef2ff; --muted:#9aa4b2;
  --accent:#ff7849; --accent2:#00e0ff; --ring:0 0 0 3px rgba(0,224,255,.28);
}
@media (prefers-color-scheme: light){
  :root{ --bg:#f7f8fc; --card:#ffffff; --ink:#0b0e14; --muted:#4b5563; }
}
*{ box-sizing:border-box }
html,body{height:100%}
body{
  margin:0; color:var(--ink); background:
    radial-gradient(1200px 640px at -5% -10%, rgba(255,120,73,.16), transparent 42%),
    radial-gradient(1000px 800px at 120% 10%, rgba(0,224,255,.14), transparent 48%),
    linear-gradient(180deg, #0a0c12, var(--bg));
  font-family: Inter, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  line-height:1.45;
}
.container{ max-width:1100px; margin:0 auto; padding: clamp(16px, 3vw, 32px); }

.skip{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip:focus{ left:16px; top:16px; width:auto; height:auto; background:#000; color:#fff; padding:8px 12px; border-radius:8px; z-index:99; }

.site-header{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.brand-badge{ width:min(520px, 80vw); height:auto; display:block; filter: drop-shadow(0 8px 36px rgba(0,224,255,.25)); }
.topnav a{
  color:var(--ink); text-decoration:none; font-weight:700; padding:10px 14px; border-radius:999px;
  border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.05);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}
.topnav a:hover{ transform:translateY(-2px); border-color:rgba(255,255,255,.2); box-shadow:var(--ring); }
.topnav a:focus-visible{ outline:none; box-shadow:var(--ring); }

.hero{ padding-top:12px; padding-bottom:8px; }
.eyebrow{
  display:inline-block; font-weight:800; letter-spacing:.4px; font-size:.9rem; color:#0b0e14;
  background:linear-gradient(90deg,var(--accent),var(--accent2)); padding:4px 10px; border-radius:999px;
}
h1{
  font-size: clamp(2rem, 5vw, 3.4rem);
  margin: 10px 0 8px;
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.lead{ color:var(--muted); font-size: clamp(1.05rem, 2vw, 1.2rem); max-width: 70ch; }

.cta{ display:flex; gap:12px; flex-wrap:wrap; margin:18px 0 8px; }
.btn{
  --btnbg:#151826;
  display:inline-flex; align-items:center; gap:10px; padding:12px 16px; border-radius:999px;
  text-decoration:none; font-weight:800; font-size:1rem; color:var(--ink);
  background:var(--btnbg); border:1px solid rgba(255,255,255,.08);
  transition:transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.btn:hover{ transform:translateY(-2px); border-color:rgba(255,255,255,.2); box-shadow:var(--ring); }
.btn:focus-visible{ outline:none; box-shadow:var(--ring); }
.btn-primary{ --btnbg: rgba(255,120,73,.14); border-color: rgba(255,120,73,.45); }
.btn-secondary{ --btnbg: rgba(0,224,255,.14); border-color: rgba(0,224,255,.45); }

.features{
  margin-top:22px;
  display:grid; gap:14px;
  grid-template-columns: repeat(auto-fit, minmax(230px,1fr));
}
.features article{
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.02), rgba(255,255,255,.02) 2px, transparent 2px, transparent 4px),
    var(--card);
  border:1px solid rgba(255,255,255,.06);
  padding:16px; border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.35);
  position:relative; overflow:hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.features article::after{
  content:""; position:absolute; inset:-1px;
  background:linear-gradient(120deg, rgba(255,120,73,.18), rgba(255,255,255,0) 25% 75%, rgba(0,224,255,.16));
  mix-blend-mode:overlay; opacity:0; transition:opacity .25s ease;
}
.features article:hover{ transform:translateY(-4px); border-color:rgba(255,255,255,.14); box-shadow:0 18px 50px rgba(0,0,0,.45); }
.features article:hover::after{ opacity:.8; }
.features h2{ margin:6px 0 8px; font-size:1.05rem; }
.features p{ margin:0; color:var(--muted); }

.availability{
  margin:18px 0 0; display:inline-flex; align-items:center; gap:10px;
  background:linear-gradient(90deg, rgba(255,120,73,.10), rgba(0,224,255,.10));
  border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:10px 14px;
  font-weight:600;
}
.availability .dot{
  width:10px; height:10px; border-radius:999px; background:#26ff8a;
  box-shadow:0 0 0 0 rgba(38,255,138,.6); animation:pulse 2s infinite;
}
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(38,255,138,.6); }
  70%{ box-shadow:0 0 0 10px rgba(38,255,138,0); }
  100%{ box-shadow:0 0 0 0 rgba(38,255,138,0); }
}

.site-footer{ color:var(--muted); text-align:center; font-size:.95rem; }
.site-footer a{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }

@media (prefers-reduced-motion: reduce){
  .features article, .features article::after, .btn, .topnav a, .availability .dot{ transition:none !important; animation:none !important; }
}