/* ============================================================
   Aurent Pro — 基础层
   深炭 / 电蓝 / 荧光绿 · 紧凑专业版（同族 t1 的深色变体）
   ============================================================ */

:root {
  --bg:      #0d1013;
  --bg-2:    #14181d;
  --bg-3:    #1a1f26;
  --line:    rgba(255,255,255,.09);
  --line-2:  rgba(255,255,255,.045);
  --fg:      #e9eef4;
  --fg-2:    #9aa7b4;
  --fg-3:    #66727e;
  --blue:    #3d8bfd;
  --lime:    #a3e635;
  --up:      #4ade80;
  --down:    #f87171;
  --shadow:  0 22px 54px -30px rgba(0,0,0,.9);

  --font-display: "Avenir Next", "Avenir", "Segoe UI Variable Display", "Segoe UI",
                  "Helvetica Neue", "PingFang SC", sans-serif;
  --font-ui:      "Avenir Next", "Avenir", "Segoe UI Variable Text", "Segoe UI",
                  "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-mono:    "SF Mono", "JetBrains Mono", "Cascadia Mono", Consolas, monospace;

  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --gut: clamp(16px, 3.4vw, 36px);
  --maxw: 1160px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.6;
  color: var(--fg);
  background-color: var(--bg);
  background-image:
    radial-gradient(940px 500px at 82% -14%, rgba(61,139,253,.16), transparent 62%),
    radial-gradient(680px 420px at -8% 14%, rgba(163,230,53,.07), transparent 66%),
    repeating-linear-gradient(90deg, var(--line-2) 0 1px, transparent 1px 72px);
  background-attachment: fixed;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-family: var(--font-display); font-weight: 600; letter-spacing: -.018em; line-height: 1.18; margin: 0; }
p { margin: 0; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; }

.wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gut); }

.eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: var(--font-mono); font-size: 11px; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase; color: var(--lime);
}
.eyebrow::before { content: ""; width: 20px; height: 1px; background: var(--lime); opacity: .8; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 11px 20px; border-radius: var(--r-md);
  font-size: 14px; font-weight: 600; letter-spacing: .01em;
  transition: transform .16s ease, background-color .16s ease, border-color .16s ease, color .16s ease;
}
.btn-primary { color: #06121f; background: linear-gradient(140deg, var(--blue), #79b0ff); }
.btn-primary:hover { transform: translateY(-1px); }
.btn-ghost { color: var(--fg); border: 1px solid var(--line); background: rgba(255,255,255,.02); }
.btn-ghost:hover { border-color: var(--blue); color: var(--blue); }

.card {
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: linear-gradient(166deg, var(--bg-2), var(--bg-3));
  box-shadow: var(--shadow);
}

[data-reveal] { opacity: 0; transform: translateY(12px); animation: reveal .6s cubic-bezier(.22,.72,.24,1) forwards; }
[data-reveal="1"] { animation-delay: .04s; } [data-reveal="2"] { animation-delay: .12s; }
[data-reveal="3"] { animation-delay: .20s; } [data-reveal="4"] { animation-delay: .28s; }
[data-reveal="5"] { animation-delay: .36s; } [data-reveal="6"] { animation-delay: .44s; }
@keyframes reveal { to { opacity: 1; transform: none; } }

@keyframes tick { 0% { color: var(--fg); } 24% { color: var(--lime); } 100% { color: var(--fg); } }
.tick { animation: tick 1.1s ease-out; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; animation: none; }
  .tick { animation: none; }
  * { transition: none !important; }
}
