/* ============================================================
   One Point Diagnostic — Design Tokens
   Palette sampled from the brand logo (navy + emerald on white)
   ============================================================ */
:root {
    /* Brand */
    --navy-950: #0a1533;
    --navy-900: #0f1f4d;
    --navy-800: #152a66;
    --navy-700: #1c3580;
    --navy-600: #1e3a8a;
    --navy-500: #2c4ba3;
    --navy-100: #dbe4f7;
    --navy-50: #eef2fb;

    --emerald-700: #0e7a38;
    --emerald-600: #149244;
    --emerald-500: #189a4a;
    --emerald-400: #2eb562;
    --emerald-100: #d9f3e4;
    --emerald-50: #ecfaf2;

    --gold-700: #8f6f14;
    --gold-600: #b08a1d;
    --gold-500: #c9a227;
    --gold-400: #dcb84a;
    --gold-100: #f6ecc9;
    --gold-50: #fdf8e9;

    --whatsapp: #25d366;

    /* Neutrals */
    --ink: #101828;
    --ink-2: #344054;
    --ink-3: #667085;
    --bg: #ffffff;
    --bg-soft: #f7f9fc;
    --line: #e6eaf2;

    /* Typography */
    --font-display: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    --font-body: 'Inter', system-ui, -apple-system, sans-serif;

    /* Shape */
    --r-sm: 10px;
    --r-md: 16px;
    --r-lg: 24px;
    --r-full: 999px;

    /* Elevation */
    --shadow-sm: 0 1px 2px rgba(16, 24, 40, .06);
    --shadow-md: 0 8px 24px rgba(16, 24, 40, .08);
    --shadow-lg: 0 24px 60px -12px rgba(15, 31, 77, .18);

    /* Glass */
    --glass-bg: rgba(255, 255, 255, .72);
    --glass-line: rgba(255, 255, 255, .55);
    --glass-blur: 16px;

    /* Motion */
    --ease: cubic-bezier(.22, .61, .36, 1);
    --dur: .35s;

    /* Layout */
    --container: 1200px;
    --header-h: 76px;
}