/* Unseat audit v2 — design tokens
 * Drop into src/web/static/audit/tokens.css and load first on every v2 template.
 */
:root {
  /* Brand gradient */
  --grad-brand: linear-gradient(100deg, #6143F9 0%, #6143F9 15%, #8F3EBA 45%, #BE3A7C 70%, #ED3B3E 100%);
  --grad-brand-vertical: linear-gradient(180deg, #6143F9 0%, #8F3EBA 60%, #BE3A7C 100%);

  /* Flat brand */
  --brand-violet: #6143F9;
  --brand-purple: #8F3EBA;
  --brand-magenta: #BE3A7C;
  --brand-red: #ED3B3E;

  /* Dark theme */
  --bg-deep: #0A0A0F;
  --bg-surface: #1C1830;
  --bg-surface-2: #201B30;
  --bg-surface-3: #2A2340;
  --border-subtle: rgba(143,62,186,0.2);
  --border-strong: rgba(143,62,186,0.45);
  --border-hero: rgba(143,62,186,0.55);
  --fg-primary: #FFFFFF;
  --fg-body: #c9c3d8;
  --fg-muted: #a9a3b8;
  --fg-dim: #8a8498;
  --fg-extra-dim: #6b6580;

  /* Light theme */
  --bg-light: #FFFFFF;
  --bg-light-tint: #F9F8FB;
  --border-light: rgba(26,16,53,0.08);
  --fg-ink: #1A1035;
  --fg-ink-muted: #6b6580;

  /* Severity */
  --sev-red: #ED3B3E;
  --sev-red-glow: rgba(237,59,62,0.35);
  --sev-amber: #F59E0B;
  --sev-amber-glow: rgba(245,158,11,0.3);
  --sev-green: #10B981;
  --sev-green-bright: #34D399;
  --sev-green-glow: rgba(16,185,129,0.35);

  /* Type */
  --font-display: 'Outfit', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  --fs-hero: clamp(2.4rem, 4.5vw, 3.6rem);
  --fs-title: clamp(2rem, 3.8vw, 2.9rem);
  --fs-subtitle: clamp(1.7rem, 2.6vw, 2.1rem);
  --fs-lead: 1.15rem;
  --fs-body: 1rem;
  --fs-small: 0.92rem;
  --fs-micro: 0.72rem;
  --fs-score: 5.6rem;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semi: 600;
  --fw-bold: 700;
  --fw-black: 800;

  --ls-tight: -0.035em;
  --ls-display: -0.025em;
  --ls-heading: -0.02em;
  --ls-normal: 0;
  --ls-eyebrow: 0.12em;
  --ls-micro: 0.14em;

  /* Spacing (4px grid) */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px; --sp-5: 20px;
  --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px; --sp-16: 64px; --sp-20: 80px;

  /* Radius */
  --r-sm: 4px; --r-md: 8px; --r-lg: 12px; --r-xl: 16px; --r-2xl: 20px; --r-pill: 999px;

  /* Shadow */
  --shadow-card-dark: 0 12px 40px rgba(0,0,0,0.3);
  --shadow-card-light: 0 2px 12px rgba(26,16,53,0.04);
  --shadow-elevated: 0 30px 80px rgba(0,0,0,0.38), 0 0 0 1px rgba(97,67,249,0.22);
  --shadow-offer-idle: 0 30px 80px rgba(97,67,249,0.15);

  /* Motion */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 180ms;
  --dur-med: 320ms;
  --dur-slow: 600ms;
  --dur-epic: 1400ms;
  --dur-breath: 6s;
}

/* ═════════════════════════════════════════════════════════════
   Shared minimal brand header — used across audit-v2 funnel
   pages (landing, scan, results). Reveal page has its own
   .rv-header variant. Logo is the white wordmark on dark bg.
════════════════════════════════════════════════════════════════ */
.unseat-header {
  padding: 22px 28px 0;
}
.unseat-header-inner {
  max-width: 1280px;
  margin: 0 auto;
}
.unseat-logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}
.unseat-logo-img {
  display: block;
  height: 32px;
  width: auto;
}
@media (max-width: 720px) {
  .unseat-header { padding: 18px 20px 0; }
  .unseat-logo-img { height: 28px; }
}