/*
 * RoofCraft design tokens — SINGLE SOURCE OF TRUTH.
 *
 * Canonical tokens (top block) define the new B&M navy/blue design system.
 * Change a brand value here and it propagates everywhere. Everything below
 * the token layer (core.css, sections/*.css) must reference var(--…) only —
 * no hard-coded brand colours/fonts/radii.
 *
 * The legacy-alias block maps old roofcraft token names onto the new system
 * so the not-yet-migrated section stylesheets keep working during the phased
 * rebuild. Phase 1 migrates each section to the canonical tokens; remove an
 * alias once nothing references it.
 */
:root {
    /* ===== Canonical: brand ===== */
    --navy: #0a1830;
    --navy-2: #0f2547;
    --blue: #009fe3;
    --blue-d: #0078a3;
    --blue-l: #eaf1fe;
    --green: #66b32e;      /* accent, not primary */
    --green-d: #0583af;
    --green-l: #e6f6ef;
    --spoed: #66b32e;
    --amber: #d97706;

    /* ===== Canonical: neutrals ===== */
    --ink: #222d56;
    --muted: #5b6678;
    --line: #e7ecf3;
    --surface: #f6f9fd;
    --card: #ffffff;

    /* ===== Canonical: geometry ===== */
    --r: 6px;
    --r-sm: 11px;
    --maxw: 1180px;

    /* ===== Canonical: elevation ===== */
    --sh-sm: 0 1px 2px rgba(13,30,60,.06), 0 2px 8px rgba(13,30,60,.05);
    --sh: 0 6px 22px rgba(13,30,60,.09);
    --sh-lg: 0 22px 60px rgba(13,30,60,.16);

    /* ===== Canonical: type ===== */
    --font: 'Open Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --display: 'Outfit', 'Inter', sans-serif;

    /* ===== Legacy aliases (bridge; remove per file in Phase 1) ===== */
    --green-dark: var(--green-d);
    --green-soft: #3fbf8a;
    --green-light: var(--green-l);
    --ink-soft: #23314a;
    --ink-mute: var(--muted);
    --line-soft: #f2f6fb;
    --bg: var(--card);
    --bg-soft: var(--surface);
    --bg-panel: var(--green-l);
    --emergency: var(--spoed);
    --whatsapp: #25d366;
    --shadow-sm: var(--sh-sm);
    --shadow: var(--sh);
    --shadow-lg: var(--sh-lg);
    --radius: var(--r);
    --radius-sm: var(--r-sm);
    --radius-lg: var(--r);
}