/**
 * Design tokens: CSS custom properties (blue gradient layers, fonts, borders, shadows). See Ui-UxIdentity.md for the source design spec.
 */

/* Font families are chosen dynamically from the Customizer (Typography section);
   these are just the fallback defaults. Every font-family in this file resolves to
   one of these two variables, never a hardcoded family. */
:root {
    --header-h: 92px;
    --vosges-font-display: "Lora", Georgia, serif;
    --vosges-font-body: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

    /* 4-Layer Blue Derivation Spectrum (Brightest Tint -> Main Color #0F63A1) */
    --rect-blue-1: #E6F2FC;
    /* Layer 1: Brightest Ice Blue */
    --rect-blue-2: #8AC6F4;
    /* Layer 2: Soft Sky Blue */
    --rect-blue-3: #2D99EB;
    /* Layer 3: Vibrant Mid Blue */
    --rect-blue-4: #0F63A1;
    /* Layer 4: Main Brand Blue (Darkest/Strongest) */

    /* --- Extended Tint & Shade Ramp (all derived from the 4 official layers) --- */
    --blue-50: #F5FAFF;
    /* Near-white surface wash */
    --blue-100: #E6F2FC;
    --blue-150: #DCEDFB;
    --blue-200: #D6EAFA;
    --blue-300: #B8D8F4;
    --blue-400: #62B2F2;
    --blue-500: #2D99EB;
    --blue-600: #1B7EC4;
    --blue-700: #0F63A1;
    --blue-800: #0C4C7C;
    /* Deep shade bridging brand blue -> navy ink */

    /* --- Ink & Text --- */
    --ink-900: #0F2C4C;
    --ink-950: #0B233D;
    --ink-975: #071728;
    --text-primary: #0F2C4C;
    --text-secondary: #33597D;
    /* AA-safe on tinted blue backgrounds */
    --text-muted: #4A6A8A;
    /* Reserve for white backgrounds only */
    --border-soft: #D1E4F5;
    --border-mid: #B8D8F4;

    /* --- Signature Gradients --- */
    --grad-brand: linear-gradient(135deg, #2D99EB 0%, #0F63A1 100%);
    --grad-deep: linear-gradient(135deg, #0F63A1 0%, #0C4C7C 55%, #0F2C4C 100%);
    --grad-surface: linear-gradient(180deg, #FFFFFF 0%, #F7FBFF 100%);
    --grad-ink: linear-gradient(180deg, #123A61 0%, #0F2C4C 100%);

    /* --- Brand-Tinted Elevation (replaces flat neutral shadows) --- */
    --shadow-sm: 0 2px 10px rgba(15, 99, 161, 0.07);
    --shadow-md: 0 10px 28px rgba(15, 99, 161, 0.11);
    --shadow-lg: 0 18px 42px rgba(15, 99, 161, 0.18);
    --shadow-glow: 0 10px 28px rgba(45, 153, 235, 0.32);
    --focus-ring: 0 0 0 3px rgba(45, 153, 235, 0.45);
}