/* === Aesthetic variants (toggled via body[data-aesthetic]) === */

/* ---------- EDITORIAL (default) ---------- */
body[data-aesthetic="editorial"] {
  --accent: var(--accent-color, #2B8BC7);
  --bg: var(--paper);
}

/* ---------- FINTECH ---------- */
body[data-aesthetic="fintech"] {
  --paper: #FFFFFF;
  --paper-2: #F6F8FB;
  --bg: #FFFFFF;
  --ink-900: #0A1628;
  --ink-200: #E3E8EF;
  --line: #E3E8EF;
  --radius: 8px;
  --radius-lg: 14px;
}
body[data-aesthetic="fintech"] .hero-h1 {
  letter-spacing: -0.04em;
  font-weight: 700 !important;
  font-family: var(--sans) !important;
}
body[data-aesthetic="fintech"] .hero-h1-accent {
  color: var(--accent);
  font-style: normal;
  font-weight: 700 !important;
}
body[data-aesthetic="fintech"] h2 {
  font-family: var(--sans) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em;
}
body[data-aesthetic="fintech"] .cite blockquote {
  font-family: var(--sans);
  font-weight: 500;
}
body[data-aesthetic="fintech"] .logo-placeholder { font-family: var(--sans); font-weight: 600; }
body[data-aesthetic="fintech"] .app-card {
  border-radius: 14px;
}
body[data-aesthetic="fintech"] .hero::before {
  background:
    radial-gradient(1200px 500px at 70% -10%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 60%);
}

/* ---------- TERMINAL (light) ---------- */
body[data-aesthetic="terminal"] {
  --paper: #FFFFFF;
  --paper-2: #F5F5F3;
  --bg: #FFFFFF;
  --white: #FFFFFF;
  --card: #FFFFFF;
  --ink-900: #0A0F14;
  --ink-700: #20303F;
  --ink-500: #55636F;
  --ink-400: #78828C;
  --ink-300: #B5BDC5;
  --ink-200: #D8DDE2;
  --ink-100: #E8EBEE;
  --line: #1A2028;          /* high-contrast hairlines, bloomberg-ish on white */
  --blue-100: #E8EFF5;
  --blue-50: #F1F5F9;
  --fg: #0A0F14;
  --muted: #55636F;
  --radius: 0px;
  --radius-lg: 0px;
  --sans: 'IBM Plex Mono', ui-monospace, monospace;
  --serif: 'IBM Plex Mono', ui-monospace, monospace;
}
body[data-aesthetic="terminal"] {
  font-family: var(--mono);
  font-size: 13px;
}
body[data-aesthetic="terminal"] .hero-h1,
body[data-aesthetic="terminal"] h2 {
  font-family: var(--mono) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase;
  color: var(--ink-900);
}
body[data-aesthetic="terminal"] .hero-h1 { font-size: clamp(28px, 3.8vw, 44px) !important; line-height: 1.15; }
body[data-aesthetic="terminal"] .hero-h1-accent { font-style: normal; color: var(--accent); font-weight: 500 !important; }
body[data-aesthetic="terminal"] .hero-lede { font-family: var(--mono); font-size: 13px; color: var(--ink-700); }
body[data-aesthetic="terminal"] .btn, body[data-aesthetic="terminal"] .nav-cta,
body[data-aesthetic="terminal"] .chip,
body[data-aesthetic="terminal"] .tweak-pill,
body[data-aesthetic="terminal"] .tab,
body[data-aesthetic="terminal"] .aarc-mode-tab,
body[data-aesthetic="terminal"] .kpi,
body[data-aesthetic="terminal"] .field-input,
body[data-aesthetic="terminal"] .drop-zone {
  border-radius: 0;
  font-family: var(--mono);
}
body[data-aesthetic="terminal"] .btn,
body[data-aesthetic="terminal"] .nav-cta,
body[data-aesthetic="terminal"] .chip {
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 11px;
}
body[data-aesthetic="terminal"] .btn {
  border: 1px solid var(--ink-900);
  background: var(--white);
  color: var(--ink-900);
}
body[data-aesthetic="terminal"] .btn:hover { background: var(--ink-900); color: var(--paper); }
body[data-aesthetic="terminal"] .btn-primary {
  background: var(--ink-900); color: var(--paper); border-color: var(--ink-900);
}
body[data-aesthetic="terminal"] .btn-primary:hover { background: var(--accent); border-color: var(--accent); color: var(--white); }
body[data-aesthetic="terminal"] .btn-ghost { border-color: transparent; background: transparent; }
body[data-aesthetic="terminal"] .nav-cta {
  background: var(--ink-900); color: var(--paper); border: 1px solid var(--ink-900);
}
body[data-aesthetic="terminal"] .nav-cta:hover { background: var(--accent); border-color: var(--accent); }

body[data-aesthetic="terminal"] .app-card,
body[data-aesthetic="terminal"] .cite,
body[data-aesthetic="terminal"] .hero-demo,
body[data-aesthetic="terminal"] .cta-band-inner,
body[data-aesthetic="terminal"] .method-visual,
body[data-aesthetic="terminal"] .aarc-calc,
body[data-aesthetic="terminal"] .results-chart-wrap,
body[data-aesthetic="terminal"] .results-table-wrap,
body[data-aesthetic="terminal"] .csv-preview,
body[data-aesthetic="terminal"] .aarc-meta-bar,
body[data-aesthetic="terminal"] .tweaks,
body[data-aesthetic="terminal"] .card {
  border-radius: 0;
  border-color: var(--ink-900);
  box-shadow: none;
}
body[data-aesthetic="terminal"] .app-card { border-color: var(--ink-300); }
body[data-aesthetic="terminal"] .app-card:hover { border-color: var(--ink-900); transform: none; }

body[data-aesthetic="terminal"] .brand-mark {
  background: var(--ink-900);
  color: var(--paper);
  border-radius: 0;
}
body[data-aesthetic="terminal"] .brand { font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.04em; font-size: 14px; }
body[data-aesthetic="terminal"] .brand em { font-style: normal; }

body[data-aesthetic="terminal"] .cite blockquote {
  font-family: var(--mono);
  font-size: 13px;
  letter-spacing: 0;
  color: var(--ink-900);
}
body[data-aesthetic="terminal"] .logo-placeholder {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 13px;
  color: var(--ink-700);
}
body[data-aesthetic="terminal"] .hero::before { background: none; }
body[data-aesthetic="terminal"] .nav {
  border-bottom: 1px solid var(--ink-900);
  background: var(--paper);
}
body[data-aesthetic="terminal"] .hero-demo-head {
  background: var(--paper-2);
  border-bottom: 1px solid var(--ink-900);
}
body[data-aesthetic="terminal"] .hero-demo-foot {
  background: var(--paper-2);
  border-top: 1px solid var(--ink-900);
}
body[data-aesthetic="terminal"] .footer {
  background: var(--paper-2);
  border-top: 1px solid var(--ink-900);
}
body[data-aesthetic="terminal"] .section { border-top: 1px solid var(--ink-900); }
body[data-aesthetic="terminal"] .cites { background: var(--paper-2); }

body[data-aesthetic="terminal"] .nav-link,
body[data-aesthetic="terminal"] .field-label,
body[data-aesthetic="terminal"] .stat-label,
body[data-aesthetic="terminal"] .kpi-label,
body[data-aesthetic="terminal"] .smallcaps,
body[data-aesthetic="terminal"] .eyebrow { text-transform: uppercase; letter-spacing: 0.08em; }

body[data-aesthetic="terminal"] .eyebrow { color: var(--ink-900); }
body[data-aesthetic="terminal"] .chip {
  background: var(--paper-2);
  border-color: var(--ink-900);
  color: var(--ink-900);
}
body[data-aesthetic="terminal"] .chip.coral {
  background: var(--accent);
  color: var(--white);
  border-color: var(--accent);
}

body[data-aesthetic="terminal"] .tab.active,
body[data-aesthetic="terminal"] .aarc-mode-tab.active {
  background: var(--ink-900);
  color: var(--paper);
  box-shadow: none;
}
body[data-aesthetic="terminal"] .tweak-pill.active {
  background: var(--ink-900);
  border-color: var(--ink-900);
  color: var(--paper);
}

body[data-aesthetic="terminal"] .method-step.active {
  background: var(--paper-2);
}
body[data-aesthetic="terminal"] .method-step { border-top-color: var(--ink-900); }
body[data-aesthetic="terminal"] .method-step:last-child { border-bottom-color: var(--ink-900); }

body[data-aesthetic="terminal"] .results-tab.active { border-bottom-color: var(--ink-900); }
body[data-aesthetic="terminal"] .results-table th,
body[data-aesthetic="terminal"] .csv-table th {
  background: var(--ink-900);
  color: var(--paper);
}
body[data-aesthetic="terminal"] .event-row { background: var(--paper-2) !important; }

body[data-aesthetic="terminal"] .hero-meta { border-top-color: var(--ink-900); }
body[data-aesthetic="terminal"] .hero-meta .mono { font-weight: 500; }

/* ---------- Hero variants (controlled by data-hero) ---------- */
body[data-hero="editorial"] .hero-demo { display: none; }
body[data-hero="editorial"] .hero-grid { grid-template-columns: 1.2fr 1fr; }
body[data-hero="editorial"] .hero-editorial-visual { display: flex; }
body:not([data-hero="editorial"]) .hero-editorial-visual { display: none; }

body[data-hero="compact"] .hero { padding: 40px 0 56px; }
body[data-hero="compact"] .hero-h1 { font-size: clamp(32px, 3.6vw, 48px); }
body[data-hero="compact"] .hero-meta { display: none; }
