/* =========================================================================
   God of Finance - brand identity, funnel pages (system B)
   Near-black like his Discord and his charts, his own money green (#00C060 on
   the Academy artwork, lifted a touch for contrast on black), red kept for the
   live dot only. No logo exists beyond his name, so the lockup is a typeset
   wordmark: GOD OF FINANCE in heavy Archivo, never an invented mark.
   ========================================================================= */

@font-face { font-family: "Archivo"; src: url("fonts/archivo-var.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/inter-var.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }

:root {
  --paper: #070907;
  --paper-2: #0b100d;
  --card: #0f1411;
  --ink: #eef3ef;
  --muted: #97a39b;
  --faint: #6f7b73;
  --hair: rgba(238, 243, 239, 0.12);
  --accent: #1fcb6e;
  --accent-2: #5fe39a;
  --accent-ink: #04140a;
  --accent-soft: rgba(31, 203, 110, 0.14);
  --live: #f23a2f;
  --display: "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --gutter: clamp(20px, 5vw, 40px);
  --radius: 16px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

body { display: flex; flex-direction: column; font-family: var(--sans); overflow-x: hidden; background: var(--paper); color: var(--ink); }
.page { flex: 1 1 auto; min-width: 0; }

/* -------------------------------- Lockup -------------------------------- */
.brand { display: inline-flex; align-items: center; gap: 12px; }
.brand__mark {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 8px;
  background: var(--accent); color: var(--accent-ink);
  font-family: var(--display); font-weight: 900; font-size: 0.95rem; line-height: 1;
  letter-spacing: -0.02em;
}
.brand__word {
  font-family: var(--display);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--ink);
  white-space: nowrap;
  line-height: 1;
}
.brand__word em { font-style: normal; color: var(--accent); }

/* ------------------------------ Brand bar ------------------------------- */
.brandbar { display: flex; justify-content: center; padding: 26px var(--gutter); }
.brandbar .brand__word { font-size: 0.95rem; }

/* -------------------------------- Footer -------------------------------- */
.brandfoot { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 56px var(--gutter) 48px; }
.brandfoot .brand__mark { width: 24px; height: 24px; font-size: 0.78rem; border-radius: 6px; opacity: 0.92; }
.brandfoot .brand__word { font-size: 0.8rem; color: var(--muted); }
.brandfoot__legal { font-family: var(--sans); font-size: 0.74rem; letter-spacing: 0.02em; color: var(--muted); }

/* ---- mobile hardening (references/mobile.md) ---- */
img, svg, video, canvas, iframe { max-width: 100%; height: auto; }
p, li, td, th, blockquote, figcaption,
h1, h2, h3, h4, h5, h6 { overflow-wrap: anywhere; }
table, pre { display: block; max-width: 100%; overflow-x: auto; }
@media (max-width: 700px) {
  .tag, [class*="badge"], [class*="pill"] { margin-left: 0; }
}
@media (max-width: 420px) {
  .tok-merge, .tok-link, code { white-space: normal; }
  .brandbar .brand__word { font-size: 0.82rem; letter-spacing: 0.12em; }
}


/* --- Aliases for the cloned webinar kit (matches Edgar's token names) --- */
:root {
  --text: var(--ink);
  --text-2: var(--muted);
  --text-3: var(--faint);
  --surface: var(--card);
  --line: var(--hair);
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --light-ink: #0f141a;
  --light-hair: rgba(15, 20, 26, 0.14);
  --bg: var(--paper);
  --surface-2: #0b100d;
}

/* --- Layout and signal tokens the cloned webinar kit expects --- */
:root {
  --maxw: 1120px;
  --section-y: clamp(64px, 10vh, 120px);
  --radius-lg: 1.25rem;
  --light-bg: #f6f8f6;
  --light-bg-2: #edf1ee;
  --light-muted: #4a524d;
  --accent-on-light: #0b7a3d;
  --signal-pos: #1fcb6e;
  --signal-neg: #f23a2f;
}