/* ==========================================================================
   NeuraTrade — shared stylesheet (multi-page)
   Identity: AI trading terminal. Teal = brand/action, amber = secondary,
   green/red = market data only. Light/dark theme toggle.
   Type: Space Grotesk (display) · Manrope (body) · JetBrains Mono (data).
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

/* ---- Light theme (default) ---- */
:root {
  --ink-900:#eef1f6; --ink-850:#f4f6fa; --ink-800:#ffffff;
  --ink-700:#f1f4f9; --ink-600:#e2e8f0;
  --line:#e2e8f0; --line-2:#cbd5e1;

  --text:#0f1722; --muted:#5a6675; --muted-2:#94a1b2;

  --gold:#00b89a; --gold-2:#00e0b8;
  --cyan:#00b89a; --cyan-2:#00e0b8; --cobalt:#3f6dff;
  --up:#16a34a; --up-soft:rgba(22,163,74,.12);
  --down:#dc2626; --down-soft:rgba(220,38,38,.12);

  --display:"Space Grotesk",system-ui,sans-serif;
  --body:"Manrope",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;

  --maxw:1200px; --radius:14px; --radius-sm:10px;

  --shadow: 0 1px 2px rgba(15,23,34,.06), 0 8px 24px rgba(15,23,34,.05);
  --glow1: rgba(0,184,154,.10);
  --glow2: rgba(217,138,0,.08);
}

/* ---- Dark theme ---- */
html.dark {
  --ink-900:#0a0e14; --ink-850:#0f141d; --ink-800:#131a24;
  --ink-700:#1a2330; --ink-600:#222d3d;
  --line:#222d3d; --line-2:#2a3a50;

  --text:#e6edf3; --muted:#8b98a9; --muted-2:#5a6675;

  --gold:#00e0b8; --gold-2:#00b89a;
  --cyan:#00e0b8; --cyan-2:#7fe0f5; --cobalt:#3f6dff;
  --up:#2dd47f; --up-soft:rgba(45,212,127,.12);
  --down:#ff5c5c; --down-soft:rgba(255,92,92,.12);

  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 18px 50px rgba(0,0,0,.45);
  --glow1: rgba(0,224,184,.06);
  --glow2: rgba(255,176,0,.05);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; font-family:var(--body); background:var(--ink-900); color:var(--text);
  line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
  transition: background-color .25s ease, color .25s ease;
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
ul { margin:0; padding:0; list-style:none; }
button { font-family:inherit; }
::selection { background:var(--gold); color:#fff; }
:focus-visible { outline:2px solid var(--gold); outline-offset:3px; border-radius:4px; }

.wrap { width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px; }
.mono { font-family:var(--mono); font-variant-numeric:tabular-nums; }
.up { color:var(--up); } .down { color:var(--down); }

.skip-link {
  position:absolute; left:-9999px; top:0; background:var(--gold); color:#fff;
  padding:10px 16px; border-radius:0 0 8px 0; z-index:100; font-weight:700;
}
.skip-link:focus { left:0; }

.eyebrow {
  font-family:var(--mono); font-size:.72rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold); display:inline-flex; align-items:center; gap:.6em;
}
.eyebrow::before { content:""; width:22px; height:1px; background:var(--gold); opacity:.7; }
.eyebrow.cyan { color:var(--cyan); }
.eyebrow.cyan::before { background:var(--cyan); }

/* ===== theme toggle ======================================================= */
.theme-toggle {
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:10px;
  background:transparent; border:1px solid var(--line-2); color:var(--text);
  cursor:pointer; transition:background-color .15s, border-color .15s;
}
.theme-toggle:hover { background:var(--ink-700); border-color:var(--gold); }
.theme-toggle svg { width:18px; height:18px; }
.theme-toggle .moon { display:none; }
.theme-toggle .sun  { display:block; }
html.dark .theme-toggle .moon { display:block; }
html.dark .theme-toggle .sun  { display:none; }

/* ===== buttons =========================================================== */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:var(--body); font-weight:700; font-size:.95rem; padding:.78em 1.4em;
  border-radius:var(--radius-sm); border:1px solid transparent; cursor:pointer;
  transition:transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease, filter .15s;
  white-space:nowrap;
}
.btn--primary { background:var(--gold); color:#04201b; }
html.dark .btn--primary { color:#04201b; }
.btn--primary:hover { filter:brightness(1.08); transform:translateY(-2px); }
.btn--ghost { background:transparent; color:var(--text); border-color:var(--line-2); }
.btn--ghost:hover { border-color:var(--gold); color:var(--gold); transform:translateY(-2px); }
.btn--block { width:100%; }
.btn--lg { padding:.95em 1.8em; font-size:1rem; }

.arrow-link {
  display:inline-flex; align-items:center; gap:.45em; font-weight:600; color:var(--gold);
  font-size:.95rem;
}
.arrow-link svg { width:16px; height:16px; transition:transform .15s ease; }
.arrow-link:hover svg { transform:translateX(3px); }

/* ===== market tape ======================================================= */
.tape { background:var(--ink-850); border-bottom:1px solid var(--line); overflow:hidden; position:relative; }
.tape::after {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg,var(--ink-850),transparent 8%,transparent 92%,var(--ink-850));
}
.tape__track { display:inline-flex; gap:2.5rem; padding:8px 0; white-space:nowrap; animation:tape 40s linear infinite; will-change:transform; }
.tape__item { font-family:var(--mono); font-size:.78rem; color:var(--muted); display:inline-flex; gap:.55rem; }
.tape__item b { color:var(--text); font-weight:600; }
@keyframes tape { from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* ===== header + nav ====================================================== */
.site-header {
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--ink-800) 88%, transparent);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  transition:background-color .25s ease;
}
.site-header__inner { display:flex; align-items:center; justify-content:space-between; height:70px; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:.6rem; font-family:var(--display); font-size:1.25rem; letter-spacing:-.01em; color:var(--text); }
.brand__mark { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; background:var(--gold); color:#04201b; }
.brand__mark svg { width:17px; height:17px; }
.brand b { font-weight:700; } .brand span { font-weight:400; }

.nav { display:flex; align-items:center; gap:30px; margin-left:auto; }
.nav__menu { display:flex; align-items:center; gap:6px; }
.nav__menu > li { position:relative; }
.nav__top {
  display:inline-flex; align-items:center; gap:.35em; background:none; border:none; cursor:pointer;
  font-size:.92rem; font-weight:600; color:var(--muted); padding:10px 12px; border-radius:8px;
  transition:color .15s ease, background .15s ease;
}
.nav__top:hover, .nav__top.is-active { color:var(--text); }
.nav__top .caret { width:12px; height:12px; transition:transform .2s ease; opacity:.8; }
.nav__menu > li:hover .caret { transform:rotate(180deg); }

/* dropdown / mega */
.dropdown, .mega {
  position:absolute; top:calc(100% + 10px); left:0; z-index:60;
  background:var(--ink-800); border:1px solid var(--line-2); border-radius:var(--radius);
  box-shadow:var(--shadow);
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s;
}
.nav__menu > li:hover .dropdown, .nav__menu > li:hover .mega,
.nav__menu > li:focus-within .dropdown, .nav__menu > li:focus-within .mega {
  opacity:1; visibility:visible; transform:translateY(0);
}
.dropdown { min-width:230px; padding:8px; }
.dropdown a { display:block; padding:11px 14px; border-radius:8px; font-size:.92rem; color:var(--muted); transition:background .15s, color .15s; }
.dropdown a:hover { background:var(--ink-700); color:var(--text); }

.mega { width:560px; padding:14px; display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.mega__item { display:flex; gap:12px; padding:12px; border-radius:10px; transition:background .15s ease; }
.mega__item:hover { background:var(--ink-700); }
.mega__ico { width:38px; height:38px; flex-shrink:0; border-radius:9px; display:grid; place-items:center; background:var(--ink-600); color:var(--cyan); }
.mega__ico svg { width:19px; height:19px; }
.mega__item h4 { margin:0 0 2px; font-size:.92rem; font-weight:700; color:var(--text); font-family:var(--display); }
.mega__item p { margin:0; font-size:.8rem; color:var(--muted); line-height:1.4; }
.mega__foot { grid-column:1/-1; border-top:1px solid var(--line); margin-top:6px; padding:12px 12px 6px; }

.nav__cta { display:flex; align-items:center; gap:12px; }
.nav__cta .signin { font-size:.92rem; font-weight:600; color:var(--text); }
.nav__cta .signin:hover { color:var(--gold); }

.nav-toggle { display:none; width:42px; height:42px; border:1px solid var(--line-2); border-radius:10px; background:transparent; cursor:pointer; position:relative; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after {
  content:""; position:absolute; left:11px; width:18px; height:2px; background:var(--text); border-radius:2px;
  transition:transform .2s ease, opacity .2s ease;
}
.nav-toggle span { top:20px; } .nav-toggle span::before { top:-6px; } .nav-toggle span::after { top:6px; }
body.nav-open .nav-toggle span { background:transparent; }
body.nav-open .nav-toggle span::before { transform:translateY(6px) rotate(45deg); }
body.nav-open .nav-toggle span::after { transform:translateY(-6px) rotate(-45deg); }

/* ===== page hero (inner pages) =========================================== */
.page-hero {
  padding:72px 0 56px; border-bottom:1px solid var(--line); text-align:center;
  background:
    radial-gradient(800px 360px at 70% -10%, var(--glow1), transparent 60%),
    radial-gradient(700px 360px at 20% 0%, var(--glow2), transparent 60%);
}
.page-hero .eyebrow { margin-bottom:18px; }
.page-hero h1 { font-family:var(--display); font-weight:700; font-size:clamp(2rem,4.2vw,3rem); letter-spacing:-.025em; line-height:1.06; margin:0 auto 16px; max-width:18ch; }
.page-hero p { color:var(--muted); font-size:1.1rem; max-width:54ch; margin:0 auto; }
.breadcrumb { font-family:var(--mono); font-size:.74rem; color:var(--muted-2); letter-spacing:.06em; margin-bottom:22px; }
.breadcrumb a:hover { color:var(--gold); }

/* ===== home hero ========================================================= */
.hero {
  position:relative; padding:84px 0 64px; border-bottom:1px solid var(--line);
  background:
    radial-gradient(900px 440px at 80% -8%, var(--glow1), transparent 60%),
    radial-gradient(720px 480px at 4% 18%, var(--glow2), transparent 55%);
}
.hero__grid { display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.hero__eyebrow { margin-bottom:22px; }
.hero h1 { font-family:var(--display); font-weight:700; font-size:clamp(2.3rem,4.6vw,3.5rem); line-height:1.04; letter-spacing:-.025em; margin:0 0 22px; }
.hero h1 em { font-style:normal; color:var(--gold); }
.hero__sub { font-size:1.1rem; color:var(--muted); max-width:32ch; margin:0 0 32px; }
.hero__actions { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:26px; }
.hero__demo { font-family:var(--mono); font-size:.76rem; color:var(--muted-2); display:flex; align-items:center; gap:.5rem; }
.hero__demo .dot { width:7px; height:7px; border-radius:50%; background:var(--up); animation:pulse 2.4s ease-out infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(45,212,127,.5);} 70%{box-shadow:0 0 0 9px rgba(45,212,127,0);} 100%{box-shadow:0 0 0 0 rgba(45,212,127,0);} }

/* signal card */
.signal { background:var(--ink-800); border:1px solid var(--line-2); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow); position:relative; overflow:hidden; }
.signal::before { content:""; position:absolute; inset:-1px -1px auto -1px; height:2px; background:var(--gold); opacity:.7; border-radius:var(--radius) var(--radius) 0 0; }
.signal__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.signal__pair { display:flex; align-items:center; gap:10px; }
.signal__pair .sym { font-family:var(--display); font-weight:600; font-size:1.05rem; }
.signal__pair .px { font-family:var(--mono); font-size:.85rem; color:var(--muted); }
.signal__badge { font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; font-weight:600; padding:5px 10px; border-radius:999px; background:var(--up-soft); color:var(--up); border:1px solid color-mix(in srgb, var(--up) 30%, transparent); }
.spark { width:100%; height:96px; margin-bottom:16px; }
.spark path.line { fill:none; stroke:var(--up); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1400; stroke-dashoffset:1400; animation:draw 2.6s ease forwards .3s; }
@keyframes draw { to { stroke-dashoffset:0; } }
.signal__conf { margin-bottom:18px; }
.signal__conf .row { display:flex; justify-content:space-between; font-family:var(--mono); font-size:.74rem; color:var(--muted); margin-bottom:7px; text-transform:uppercase; letter-spacing:.1em; }
.signal__conf .row strong { color:var(--text); }
.bar { height:7px; border-radius:99px; background:var(--ink-600); overflow:hidden; }
.bar > i { display:block; height:100%; width:87%; background:linear-gradient(90deg,var(--up),var(--gold)); border-radius:99px; transform-origin:left; transform:scaleX(0); animation:fill 1.6s cubic-bezier(.2,.7,.2,1) forwards .4s; }
@keyframes fill { to { transform:scaleX(1); } }
.signal__levels { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; border-top:1px solid var(--line); padding-top:16px; }
.signal__levels div { display:flex; flex-direction:column; gap:3px; }
.signal__levels span { font-family:var(--mono); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); }
.signal__levels b { font-family:var(--mono); font-size:.95rem; font-weight:600; }

/* ===== brand / proof strip (marquee) ===================================== */
.proof { padding:34px 0; border-bottom:1px solid var(--line); }
.proof__label { text-align:center; font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); margin-bottom:22px; }
.marquee { overflow:hidden; position:relative; }
.marquee::before, .marquee::after { content:""; position:absolute; top:0; bottom:0; width:90px; z-index:2; pointer-events:none; }
.marquee::before { left:0; background:linear-gradient(90deg,var(--ink-900),transparent); }
.marquee::after { right:0; background:linear-gradient(270deg,var(--ink-900),transparent); }
.marquee__track { display:inline-flex; align-items:center; gap:56px; white-space:nowrap; animation:tape 32s linear infinite; }
.marquee__track span { font-family:var(--display); font-weight:600; font-size:1.15rem; color:var(--muted); opacity:.7; }

/* ===== sections ========================================================== */
.section { padding:80px 0; border-bottom:1px solid var(--line); }
.section--tight { padding:64px 0; }
.section__head { max-width:58ch; margin-bottom:48px; }
.section__head.center { margin-inline:auto; text-align:center; }
.section__head h2 { font-family:var(--display); font-weight:600; font-size:clamp(1.7rem,3vw,2.3rem); letter-spacing:-.02em; line-height:1.1; margin:16px 0 14px; }
.section__head p { color:var(--muted); font-size:1.05rem; margin:0; }
.section__head.center .eyebrow { justify-content:center; }

/* stat strip */
.stats { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--ink-800); box-shadow:var(--shadow); }
.stats div { padding:26px 24px; border-right:1px solid var(--line); }
.stats div:last-child { border-right:none; }
.stats b { display:block; font-family:var(--mono); font-weight:600; font-size:1.7rem; color:var(--text); letter-spacing:-.01em; }
.stats b .accent { color:var(--gold); }
.stats span { font-size:.85rem; color:var(--muted); }

/* feature grid */
.features { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.features.cols-3 { grid-template-columns:repeat(3,1fr); }
.feature { background:var(--ink-800); border:1px solid var(--line); border-radius:var(--radius); padding:26px; transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease; box-shadow:var(--shadow); }
.feature:hover { border-color:var(--gold); transform:translateY(-3px); }
.feature__ico { width:44px; height:44px; border-radius:11px; display:grid; place-items:center; background:color-mix(in srgb, var(--gold) 12%, transparent); color:var(--gold); margin-bottom:18px; }
.feature__ico.cyan { color:var(--cyan); background:color-mix(in srgb, var(--cyan) 12%, transparent); }
.feature__ico svg { width:22px; height:22px; }
.feature h3 { font-family:var(--display); font-weight:600; font-size:1.15rem; margin:0 0 8px; }
.feature p { color:var(--muted); font-size:.96rem; margin:0; }

/* showcase (alternating) */
.showcase { display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; padding:64px 0; border-bottom:1px solid var(--line); }
.showcase:nth-of-type(even) .showcase__media { order:-1; }
.showcase__copy h2 { font-family:var(--display); font-weight:600; font-size:clamp(1.6rem,2.6vw,2.1rem); letter-spacing:-.02em; margin:16px 0 14px; line-height:1.12; }
.showcase__copy p { color:var(--muted); font-size:1.02rem; margin:0 0 22px; }
.showcase__list { display:grid; gap:12px; margin-bottom:26px; }
.showcase__list li { display:flex; gap:.65rem; align-items:flex-start; font-size:.96rem; }
.showcase__list svg { width:18px; height:18px; color:var(--up); flex-shrink:0; margin-top:3px; }

/* mock panels for showcase */
.mock { background:var(--ink-800); border:1px solid var(--line-2); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow); position:relative; overflow:hidden; }
.mock::before { content:""; position:absolute; inset:-1px -1px auto -1px; height:2px; background:var(--gold); opacity:.6; border-radius:var(--radius) var(--radius) 0 0; }
.mock__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.mock__head .t { font-family:var(--display); font-weight:600; font-size:.98rem; }
.mock__chip { font-family:var(--mono); font-size:.68rem; padding:4px 9px; border-radius:99px; letter-spacing:.1em; }
.mock__chip.up { background:var(--up-soft); color:var(--up); border:1px solid color-mix(in srgb, var(--up) 30%, transparent); }
.mock__chip.cyan { background:color-mix(in srgb, var(--cyan) 12%, transparent); color:var(--cyan); border:1px solid color-mix(in srgb, var(--cyan) 30%, transparent); }
.mock__bars { display:flex; align-items:flex-end; gap:7px; height:120px; margin-bottom:14px; }
.mock__bars i { flex:1; border-radius:4px 4px 0 0; background:color-mix(in srgb, var(--gold) 50%, transparent); }
.mock__row { display:flex; align-items:center; justify-content:space-between; padding:11px 12px; border:1px solid var(--line); border-radius:9px; margin-bottom:8px; font-family:var(--mono); font-size:.8rem; }
.mock__row span { color:var(--muted); }
.mock__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.mock__stat { border:1px solid var(--line); border-radius:9px; padding:12px; background:var(--ink-700); }
.mock__stat span { display:block; font-family:var(--mono); font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted-2); margin-bottom:5px; }
.mock__stat b { font-family:var(--mono); font-size:1.2rem; }
.equity { width:100%; height:140px; }
.equity path.area { fill:url(#eg); opacity:.25; }
.equity path.line { fill:none; stroke:var(--cyan); stroke-width:2.4; stroke-linecap:round; }

/* steps */
.steps { display:grid; grid-template-columns:repeat(4,1fr); }
.step { padding:28px 28px 28px 0; border-top:2px solid var(--gold); }
.step__no { font-family:var(--mono); font-size:.78rem; color:var(--gold); letter-spacing:.1em; margin-bottom:14px; }
.step h3 { font-family:var(--display); font-weight:600; font-size:1.1rem; margin:0 0 8px; }
.step p { color:var(--muted); font-size:.92rem; margin:0; }

/* testimonials */
.quotes { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.quote { background:var(--ink-800); border:1px solid var(--line); border-radius:var(--radius); padding:26px; display:flex; flex-direction:column; box-shadow:var(--shadow); }
.quote__stars { color:#f59e0b; letter-spacing:2px; margin-bottom:14px; font-size:.9rem; }
.quote p { font-size:1rem; color:var(--text); margin:0 0 22px; }
.quote__who { display:flex; align-items:center; gap:12px; margin-top:auto; }
.quote__av { width:40px; height:40px; border-radius:50%; display:grid; place-items:center; font-family:var(--display); font-weight:700; color:#04201b; background:var(--gold); font-size:.95rem; }
.quote__who b { display:block; font-size:.92rem; }
.quote__who span { font-size:.8rem; color:var(--muted); }

/* pricing */
.toggle { display:inline-flex; align-items:center; gap:14px; margin:0 auto 40px; border:1px solid var(--line-2); border-radius:99px; padding:6px; background:var(--ink-800); }
.toggle button { background:none; border:none; cursor:pointer; color:var(--muted); font-weight:600; font-size:.9rem; padding:9px 18px; border-radius:99px; transition:all .18s ease; }
.toggle button.active { background:var(--gold); color:#04201b; }
.toggle .save { font-family:var(--mono); font-size:.66rem; color:var(--up); margin-left:4px; }
.plans { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:start; }
.plan { background:var(--ink-800); border:1px solid var(--line); border-radius:var(--radius); padding:28px; display:flex; flex-direction:column; box-shadow:var(--shadow); }
.plan--featured { border-color:var(--gold); background:color-mix(in srgb, var(--gold) 5%, var(--ink-800)); box-shadow:0 30px 70px -40px color-mix(in srgb, var(--gold) 40%, transparent); }
.plan__tag { align-self:flex-start; font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); border:1px solid color-mix(in srgb, var(--gold) 40%, transparent); border-radius:99px; padding:4px 10px; margin-bottom:16px; }
.plan h3 { font-family:var(--display); font-weight:600; font-size:1.3rem; margin:0 0 6px; }
.plan__desc { color:var(--muted); font-size:.9rem; margin:0 0 20px; min-height:42px; }
.plan__price { display:flex; align-items:baseline; gap:4px; margin-bottom:6px; }
.plan__price b { font-family:var(--mono); font-weight:600; font-size:2.1rem; }
.plan__price span { color:var(--muted); font-size:.9rem; }
.plan__bill { font-family:var(--mono); font-size:.72rem; color:var(--muted-2); margin:0 0 22px; min-height:1em; }
.plan ul { display:grid; gap:11px; margin:0 0 24px; }
.plan li { font-size:.92rem; color:var(--text); display:flex; gap:.6rem; align-items:flex-start; }
.plan li svg { width:16px; height:16px; color:var(--up); flex-shrink:0; margin-top:4px; }
.plan .btn { margin-top:auto; }

/* accordion (FAQ) */
.accordion { max-width:780px; margin-inline:auto; }
.acc { border:1px solid var(--line); border-radius:var(--radius); margin-bottom:12px; background:var(--ink-800); overflow:hidden; box-shadow:var(--shadow); }
.acc__q { width:100%; text-align:left; background:none; border:none; cursor:pointer; padding:20px 22px; font-family:var(--display); font-weight:600; font-size:1.02rem; color:var(--text); display:flex; align-items:center; justify-content:space-between; gap:16px; }
.acc__q .pm { width:20px; height:20px; flex-shrink:0; position:relative; }
.acc__q .pm::before, .acc__q .pm::after { content:""; position:absolute; background:var(--gold); border-radius:2px; transition:transform .2s ease, opacity .2s ease; }
.acc__q .pm::before { top:9px; left:0; width:20px; height:2px; }
.acc__q .pm::after { left:9px; top:0; width:2px; height:20px; }
.acc.open .pm::after { transform:scaleY(0); }
.acc__a { max-height:0; overflow:hidden; transition:max-height .28s ease; }
.acc__a p { padding:0 22px 20px; margin:0; color:var(--muted); font-size:.96rem; }

/* values (about) */
.values { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.value { padding:26px; border:1px solid var(--line); border-radius:var(--radius); background:var(--ink-800); box-shadow:var(--shadow); }
.value__ico { width:42px; height:42px; border-radius:10px; display:grid; place-items:center; background:color-mix(in srgb, var(--cyan) 12%, transparent); color:var(--cyan); margin-bottom:16px; }
.value__ico svg { width:21px; height:21px; }
.value h3 { font-family:var(--display); font-weight:600; font-size:1.1rem; margin:0 0 8px; }
.value p { color:var(--muted); font-size:.94rem; margin:0; }

/* timeline (about) */
.timeline { max-width:760px; margin:0 auto; }
.tl { display:grid; grid-template-columns:120px 1fr; gap:24px; padding:22px 0; border-top:1px solid var(--line); }
.tl__year { font-family:var(--mono); font-weight:600; color:var(--gold); }
.tl h3 { font-family:var(--display); font-weight:600; font-size:1.1rem; margin:0 0 6px; }
.tl p { color:var(--muted); font-size:.95rem; margin:0; }

/* markets */
.market-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.market { display:flex; gap:18px; align-items:flex-start; padding:26px; border:1px solid var(--line); border-radius:var(--radius); background:var(--ink-800); transition:border-color .2s ease, box-shadow .2s ease; box-shadow:var(--shadow); }
.market:hover { border-color:var(--gold); }
.market__ico { width:48px; height:48px; border-radius:12px; flex-shrink:0; display:grid; place-items:center; font-family:var(--display); font-weight:700; background:color-mix(in srgb, var(--gold) 12%, transparent); color:var(--gold); }
.market h3 { font-family:var(--display); font-weight:600; font-size:1.15rem; margin:0 0 6px; }
.market p { color:var(--muted); font-size:.94rem; margin:0 0 10px; }
.market .mono { font-size:.78rem; color:var(--muted-2); }

/* contact */
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
.field { margin-bottom:18px; }
.field label { display:block; font-size:.85rem; font-weight:600; margin-bottom:8px; color:var(--text); }
.field input, .field textarea, .field select {
  width:100%; background:var(--ink-700); border:1px solid var(--line-2); border-radius:10px;
  padding:13px 14px; color:var(--text); font-family:var(--body); font-size:.95rem;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.field textarea { min-height:140px; resize:vertical; }
.field input:focus, .field textarea:focus, .field select:focus {
  outline:none; border-color:var(--gold);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--gold) 22%, transparent);
}
.field .err { color:var(--down); font-size:.8rem; margin-top:6px; display:none; }
.field.invalid .err { display:block; }
.field.invalid input, .field.invalid textarea { border-color:var(--down); }
.form-note { font-size:.82rem; color:var(--muted-2); margin-top:8px; }
.form-success { display:none; padding:16px; border:1px solid color-mix(in srgb, var(--up) 35%, transparent); background:var(--up-soft); border-radius:10px; color:var(--up); font-size:.95rem; margin-bottom:20px; }
.form-success.show { display:block; }
.contact-info { display:grid; gap:16px; }
.cinfo { display:flex; gap:14px; align-items:flex-start; padding:20px; border:1px solid var(--line); border-radius:var(--radius); background:var(--ink-800); box-shadow:var(--shadow); }
.cinfo__ico { width:42px; height:42px; border-radius:10px; flex-shrink:0; display:grid; place-items:center; background:color-mix(in srgb, var(--cyan) 12%, transparent); color:var(--cyan); }
.cinfo__ico svg { width:20px; height:20px; }
.cinfo h4 { margin:0 0 4px; font-family:var(--display); font-size:1rem; }
.cinfo p { margin:0; color:var(--muted); font-size:.92rem; }
.cinfo a { color:var(--gold); }

/* legal / prose */
.prose { max-width:760px; margin:0 auto; }
.prose h2 { font-family:var(--display); font-weight:600; font-size:1.3rem; margin:34px 0 12px; }
.prose p { color:var(--muted); margin:0 0 16px; font-size:.98rem; }
.prose ul.bul { display:grid; gap:8px; margin:0 0 16px; padding-left:18px; list-style:disc; }
.prose ul.bul li { color:var(--muted); }
.callout { border:1px solid var(--line-2); border-left:3px solid var(--gold); background:var(--ink-800); border-radius:10px; padding:18px 20px; margin:0 0 16px; color:var(--muted); font-size:.95rem; }

/* CTA band + cards */
.cta-band { padding:84px 0; text-align:center; border-bottom:1px solid var(--line); background:radial-gradient(700px 300px at 50% 0%, var(--glow1), transparent 65%); }
.cta-band h2 { font-family:var(--display); font-weight:700; font-size:clamp(1.9rem,3.6vw,2.8rem); letter-spacing:-.025em; margin:0 0 16px; }
.cta-band p { color:var(--muted); font-size:1.1rem; margin:0 auto 30px; max-width:48ch; }
.cta-band .hero__actions { justify-content:center; }

.cta-cards { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.cta-card { padding:36px; border:1px solid var(--line-2); border-radius:var(--radius); background:var(--ink-800); box-shadow:var(--shadow); }
.cta-card h3 { font-family:var(--display); font-weight:600; font-size:1.4rem; margin:0 0 10px; }
.cta-card p { color:var(--muted); margin:0 0 20px; }

/* ===== footer ============================================================ */
.site-footer { background:var(--ink-850); padding:64px 0 28px; font-size:.92rem; border-top:1px solid var(--line); }
.footer__top { display:grid; grid-template-columns:1.6fr repeat(4,1fr); gap:36px; padding-bottom:44px; border-bottom:1px solid var(--line); }
.footer__brand .brand { margin-bottom:16px; }
.footer__brand p { color:var(--muted); max-width:34ch; margin:0 0 16px; }
.footer__social { display:flex; gap:10px; }
.footer__social a { width:38px; height:38px; border:1px solid var(--line-2); border-radius:9px; display:grid; place-items:center; color:var(--muted); transition:all .15s ease; }
.footer__social a:hover { color:var(--gold); border-color:var(--gold); }
.footer__social svg { width:17px; height:17px; }
.footer__col h4 { font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2); margin:0 0 16px; font-weight:600; }
.footer__col a { display:block; color:var(--muted); margin-bottom:11px; transition:color .15s ease; }
.footer__col a:hover { color:var(--gold); }
.footer__disc { padding:24px 0; border-bottom:1px solid var(--line); }
.footer__disc p { color:var(--muted-2); font-size:.78rem; line-height:1.6; margin:0 0 10px; max-width:none; }
.footer__demo { font-family:var(--mono); font-size:.74rem; color:var(--muted-2); border:1px solid var(--line); border-radius:var(--radius-sm); padding:10px 12px; max-width:max-content; margin-top:14px; }
.footer__bottom { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-top:24px; flex-wrap:wrap; }
.footer__bottom p { color:var(--muted-2); margin:0; font-size:.84rem; }

/* reveal */
.js .reveal { opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.js .reveal.in { opacity:1; transform:none; }

/* ===== responsive ======================================================== */
@media (max-width:980px) {
  .hero__grid { grid-template-columns:1fr; gap:44px; }
  .hero__sub { max-width:none; }
  .stats { grid-template-columns:repeat(2,1fr); }
  .stats div:nth-child(2) { border-right:none; }
  .stats div:nth-child(1), .stats div:nth-child(2) { border-bottom:1px solid var(--line); }
  .steps { grid-template-columns:repeat(2,1fr); }
  .plans, .quotes, .values, .features.cols-3 { grid-template-columns:1fr; }
  .plans, .quotes { max-width:460px; margin-inline:auto; }
  .showcase { grid-template-columns:1fr; gap:36px; }
  .showcase:nth-of-type(even) .showcase__media { order:0; }
  .market-grid, .contact-grid, .cta-cards { grid-template-columns:1fr; }
  .contact-grid { gap:32px; }
  .footer__top { grid-template-columns:1fr 1fr; }
  .footer__brand { grid-column:1/-1; }
  .tl { grid-template-columns:80px 1fr; gap:16px; }
}
@media (max-width:900px) {
  .nav-toggle { display:block; }
  .nav {
    position:absolute; top:100%; left:0; right:0; margin-left:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:var(--ink-850); border-bottom:1px solid var(--line);
    padding:8px 0 18px; max-height:calc(100vh - 94px); overflow-y:auto;
    transform:translateY(-140%); transition:transform .28s ease;
    box-shadow:0 24px 40px -20px rgba(0,0,0,.15);
  }
  body.nav-open .nav { transform:translateY(0); }
  body.nav-open { overflow:hidden; }
  .nav__menu { flex-direction:column; align-items:stretch; gap:0; }
  .nav__menu > li { border-bottom:1px solid var(--line); }
  .nav__top { width:100%; justify-content:space-between; padding:15px 24px; border-radius:0; color:var(--text); }
  .nav__menu > li:hover .caret { transform:none; }
  .dropdown, .mega {
    position:static; opacity:1; visibility:visible; transform:none;
    width:auto; border:none; box-shadow:none; background:transparent; border-radius:0;
    padding:0 12px 12px; display:block;
  }
  .mega { grid-template-columns:1fr; }
  .mega__item { padding:10px 12px; }
  .mega__foot { padding:10px 12px; }
  .dropdown a { padding:10px 12px; }
  .nav__cta { flex-direction:column; align-items:stretch; gap:12px; padding:16px 24px 0; }
  .nav__cta .signin { padding:6px 0; }
  .nav__cta .btn { width:100%; }
}
@media (max-width:560px) {
  .wrap { padding-inline:18px; }
  .section { padding:60px 0; }
  .steps { grid-template-columns:1fr; }
  .signal__levels, .mock__grid { grid-template-columns:1fr; }
  .footer__top { grid-template-columns:1fr; gap:28px; }
  .footer__bottom { flex-direction:column; align-items:flex-start; }
  .tl { grid-template-columns:1fr; gap:6px; }
}
@media (prefers-reduced-motion:reduce) {
  * { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .js .reveal { opacity:1; transform:none; }
  .spark path.line { stroke-dashoffset:0; } .bar > i { transform:scaleX(1); }
}