
/* ==========================================================================
   Longevity Montreal — Design System Tokens
   ========================================================================== */

:root {

    /* Brand Colors — Navy */
    --lm-navy-dark: #091428;
    --lm-navy: #0f1b3d;
    --lm-navy-medium: #1a2e4a;

    /* Brand Colors — Emerald */
    --lm-emerald-dark: #059669;
    --lm-emerald: #10b981;
    --lm-emerald-light: #34d399;
    --lm-emerald-lighter: #6ee7b7;

    /* Brand Colors — Gold */
    --lm-gold-dark: #d97706;
    --lm-gold: #f59e0b;
    --lm-gold-light: #fbbf24;

    /* Light Backgrounds */
    --lm-bg-light: #ecfdf5;
    --lm-bg-lighter: #f0fdf4;

    /* Neutrals */
    --lm-white: #ffffff;
    --lm-off-white: #f9fafb;
    --lm-gray-100: #f3f4f6;
    --lm-gray-200: #e5e7eb;
    --lm-gray-300: #d1d5db;
    --lm-gray-400: #9ca3af;
    --lm-gray-500: #6b7280;
    --lm-gray-600: #4b5563;
    --lm-gray-700: #374151;
    --lm-gray-800: #1f2937;
    --lm-gray-900: #111827;

    /* Text Colors */
    --lm-text-primary: #1e293b;
    --lm-text-secondary: #475569;
    --lm-text-muted: #94a3b8;

    /* Knowledge Hub Category Colors */
    --color-resource-light: #d3ffd5;
    --color-resource: #01c604;
    --color-resource-dark: #00b625;
    --color-organization-light: #d3e2ff;
    --color-organization: #004ce1;
    --color-organization-dark: #003cff;
    --color-influencer-light: #fff3d3;
    --color-influencer: #ffd034;
    --color-influencer-dark: #ffab00;
    --color-health-facility-light: #e3d3ff;
    --color-health-facility: #7a34ff;
    --color-health-facility-dark: #4800ff;

    /* Semantic Tokens (override shared main.css vars) */
    --color-tag-body-text: var(--lm-text-primary);
    --color-tag-a: var(--lm-emerald);
    --color-tag-strong: var(--lm-emerald-light);
    --color-tag-main-bg: var(--lm-bg-lighter);

    --color-card-bg: var(--lm-white);
    --color-section-bg-light: var(--lm-bg-light);
    --color-section-text-dark: var(--lm-navy);

    --color-label-bg: var(--lm-emerald);
    --color-label-text: var(--lm-white);

    --color-button-bg-cta: linear-gradient(135deg, var(--lm-gold-dark), var(--lm-gold), var(--lm-gold-light));
    --color-button-text-cta: var(--lm-navy-dark);
    --color-button-bg-cta-hover: linear-gradient(135deg, var(--lm-gold), var(--lm-gold-light));
    --color-button-text-cta-hover: var(--lm-navy-dark);

    --color-event-listing-bg: var(--lm-white);

    /* Typography */
    --font-display: 'Space Grotesk', 'Montserrat', Arial, sans-serif;
    --font-body: 'Montserrat', Arial, sans-serif;

    /* Typography Scale */
    --fs-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.8rem);
    --fs-sm: clamp(0.8rem, 0.76rem + 0.2vw, 0.9rem);
    --fs-base: clamp(0.9rem, 0.86rem + 0.2vw, 1rem);
    --fs-lg: clamp(1rem, 0.95rem + 0.35vw, 1.15rem);
    --fs-xl: clamp(1.15rem, 1.05rem + 0.5vw, 1.35rem);
    --fs-2xl: clamp(1.35rem, 1.15rem + 1vw, 1.75rem);
    --fs-3xl: clamp(1.6rem, 1.3rem + 1.5vw, 2.25rem);
    --fs-4xl: clamp(2rem, 1.5rem + 2.5vw, 3rem);
    --fs-5xl: clamp(2.5rem, 2rem + 3vw, 4rem);
    --fs-6xl: clamp(3rem, 2.2rem + 4vw, 5rem);

    /* Spacing Scale */
    --space-xs: clamp(0.25rem, 0.2rem + 0.25vw, 0.5rem);
    --space-sm: clamp(0.5rem, 0.4rem + 0.5vw, 0.75rem);
    --space-md: clamp(1rem, 0.85rem + 0.75vw, 1.5rem);
    --space-lg: clamp(1.5rem, 1.25rem + 1.25vw, 2.5rem);
    --space-xl: clamp(2.5rem, 2rem + 2.5vw, 4rem);
    --space-2xl: clamp(3.5rem, 2.5rem + 5vw, 6rem);

    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-pill: 9999px;

    /* Shadows */
    --shadow-sm: 0 1px 3px rgba(9, 20, 40, 0.06);
    --shadow-md: 0 4px 12px rgba(9, 20, 40, 0.08);
    --shadow-lg: 0 12px 24px rgba(9, 20, 40, 0.12);
    --shadow-xl: 0 20px 40px rgba(9, 20, 40, 0.16);

    /* Transitions */
    --ease-out: cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --duration-fast: 0.15s;
    --duration-normal: 0.3s;
    --duration-slow: 0.5s;

    /* Layout */
    --container-max: 1200px;
    --header-height: 80px;

    /* Gradients */
    --lm-gradient-hero: linear-gradient(135deg, var(--lm-navy-dark) 0%, var(--lm-navy) 50%, var(--lm-navy-medium) 100%);
    --lm-gradient-cta: linear-gradient(135deg, var(--lm-gold-dark), var(--lm-gold), var(--lm-gold-light));
    --lm-gradient-dark: linear-gradient(135deg, var(--lm-navy-dark) 0%, var(--lm-navy) 100%);
    --lm-gradient-accent-bar: linear-gradient(90deg, var(--lm-emerald), var(--lm-gold), var(--lm-emerald));

    /* Glass */
    --lm-glass-bg: rgba(15, 27, 61, 0.85);
    --lm-glass-border: rgba(255, 255, 255, 0.08);
    --lm-glass-blur: blur(12px);
}
