/*
 * PocketLLM marketing design tokens — single source of truth.
 * Mirrors docs/design_system.md §4.3 (marketing/warm register).
 * Imported by style.css and blog/blog.css (@import) and support/index.html (<link>).
 * Do NOT redeclare these :root values anywhere else; edit them here only.
 * (Exception: index.html inlines a byte-identical :root in its critical CSS
 * because it loads style.css async; keep the two in sync.)
 */
:root {
    /* Warm register (design system §4.3) */
    --primary-bg: #F5EFE6;
    --secondary-bg: #FDFCF8;
    --accent-yellow: #F4C753;   /* decorative gold — never body text (1.4:1 on cream) */
    --accent-gold: #a07d2e;     /* text-safe gold (AA large only, 3.36:1 on cream) */
    --accent-gold-strong: #846320;  /* darker gold for normal-size text (AA: 4.85:1 cream / 5.40:1 card) */
    --text-dark: #1A2332;       /* slate, body text, 13.81:1 on cream (AAA) */
    --text-medium: #4A5568;     /* secondary text, 6.58:1 on cream (AA) */
    --text-light: #5a6473;      /* tertiary text, 5.25:1 on cream (AA) */
    --sidebar-bg: #FFFFFF;
    --border-color: #E2D5C7;
    --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    --sidebar-width: 280px;

    /* Blog code surfaces */
    --code-bg: #1A2332;
    --code-text: #F5EFE6;

    /* Gap-fill neutrals / states */
    --highlight-bg: #FFF9E6;    /* warm highlight tint (pricing card) */
    --slate-hover: #2D3748;     /* primary-button hover, white passes */
    --disabled-bg: #9ca3af;     /* disabled control — WCAG-exempt */
    --disabled-text: #1f2937;
    --disabled-bg-secondary: #f3f4f6;
    --disabled-text-secondary: #374151;

    /* Form status (AA on cream at normal text size) */
    --success: #047857;         /* 4.73:1 on cream */
    --error: #b91c1c;           /* 5.66:1 on cream */

    /* Spacing scale — mirrors app Spacing.swift (design system §7) */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 12px;
    --space-lg: 16px;
    --space-xl: 20px;
    --space-2xl: 24px;
    --space-3xl: 32px;

    /* Type scale (design system §6) — snap hardcoded sizes onto these */
    --fs-caption: 12px;
    --fs-small: 14px;
    --fs-body: 16px;
    --fs-body-lg: 18px;
    --fs-h4: 20px;
    --fs-h3: 24px;
    --fs-h2: 32px;
    --fs-h1: 48px;
    --fs-h1-lg: 56px;   /* marketing-hero display step between h1 and display (recurring: hero/section titles, price amount, blog title) */
    --fs-display: 72px;
}