/* Lawrence AI - Design Tokens & CSS Variables
   "The Sovereign Insight" — Dark, premium aesthetic */
:root {
    /* Surface Hierarchy (deep navy layering) */
    --surface-base: #0f131f;
    --surface-container-lowest: #0a0e1a;
    --surface-container-low: #171b28;
    --surface-container: #1b1f2c;
    --surface-container-high: #262a37;
    --surface-container-highest: #313442;
    --surface-bright: #353946;

    /* Brand Identity (Aurora palette) */
    --brand-dark: #005db6;
    --brand-medium: #3a90ff;
    --brand-light: #a9c7ff;

    /* Tertiary (Electric Cyan) */
    --tertiary: #59d8de;
    --tertiary-container: #00a1a6;
    --on-tertiary-container: #002f31;

    /* Text on dark */
    --text-primary: #dfe2f3;
    --text-body: #c1c6d6;
    --text-secondary: #8b919f;
    --text-tertiary: #616879;

    /* Backward-compatible surface aliases */
    --surface-white: #0f131f;
    --surface-off-white: #171b28;
    --surface-cool: #1b1f2c;

    /* Dark navy aliases (used by hero/footer/CTA) */
    --deep-navy: #0f131f;
    --midnight: #171b28;
    --dark-indigo: #1b1f2c;

    /* Borders — "No-Line Rule": use tonal shifts, ghost borders only */
    --border-default: rgba(139, 145, 159, 0.1);
    --border-hover: rgba(139, 145, 159, 0.2);

    /* Accents */
    --success-green: #59d8de;
    --success-bg: rgba(89, 216, 222, 0.1);
    --danger-red: #ffb4ab;
    --danger-red-bg: #93000a;
    --warning-yellow: #eab308;

    /* Gradients */
    --gradient-brand: linear-gradient(135deg, #002957 0%, #37437a 50%, #3a90ff 100%);
    --gradient-dark: linear-gradient(135deg, #0a0e1a 0%, #0f131f 50%, #171b28 100%);
    --gradient-shimmer: linear-gradient(90deg, rgba(169,199,255,0.06) 0%, rgba(89,216,222,0.15) 50%, rgba(169,199,255,0.06) 100%);

    /* Shadows (absence of light, not grey smudges) */
    --shadow-card: 0 4px 16px rgba(0, 0, 0, 0.3);
    --shadow-card-hover: 0 20px 40px rgba(0, 0, 0, 0.4);
    --shadow-featured: 0 8px 30px rgba(0, 0, 0, 0.5);
    --shadow-elevated: 0 8px 24px rgba(0, 0, 0, 0.4);
    --shadow-nav: 0 4px 16px rgba(0, 0, 0, 0.3);

    /* Glassmorphism */
    --glass-bg: rgba(27, 31, 44, 0.65);
    --glass-border: rgba(139, 145, 159, 0.1);
    --glass-blur: 20px;

    /* Radii */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-pill: 100px;

    /* Animations */
    --easing: cubic-bezier(0.16, 1, 0.3, 1);

    /* Interactive Variables (Updated via JS) */
    --mouse-x: 50%;
    --mouse-y: 50%;
    --xray-x: 50%;
    --xray-y: 50%;
}