@layer jetons {
:root {
    /* Bleu roi : fond du logo DG LOC (bleu-800 = #022a85) */
    --bleu-50: #eef4ff;
    --bleu-100: #dce8ff;
    --bleu-200: #bbd3ff;
    --bleu-300: #8db4ff;
    --bleu-400: #5a8df5;
    --bleu-500: #2f66e8;
    --bleu-600: #1449c9;
    --bleu-700: #0a38a6;
    --bleu-800: #022a85;
    --bleu-900: #021d5e;
    --bleu-950: #011240;

    /* Bleu électrique : traits lumineux et « G » du logo */
    --electrique-100: #d3f3ff;
    --electrique-200: #a4e6fe;
    --electrique-300: #5bd3fc;
    --electrique-400: #0eb2ef;
    --electrique-500: #0a98da;
    --electrique-600: #0879b4;

    /* Orange soleil : accent chaud (prix, soleil, voiture, boutons sur fond bleu) */
    --soleil-50: #fff7ed;
    --soleil-100: #ffedd5;
    --soleil-200: #fed7aa;
    --soleil-300: #fdba74;
    --soleil-400: #fb923c;
    --soleil-500: #f97316;
    --soleil-600: #ea580c;
    --soleil-700: #c2410c;
    --soleil-800: #9a3412;

    /* Vert : messages de succès et teinte des SUV */
    --emeraude-50: #ecfdf5;
    --emeraude-100: #d1fae5;
    --emeraude-200: #a7f3d0;
    --emeraude-300: #6ee7b7;
    --emeraude-400: #34d399;
    --emeraude-500: #10b981;
    --emeraude-600: #059669;
    --emeraude-700: #047857;
    --emeraude-800: #065f46;
    --emeraude-900: #064e3b;

    /* Neutres légèrement bleutés, en accord avec le logo */
    --neutre-50: #f6f9fe;
    --neutre-100: #edf2fa;
    --neutre-200: #dfe7f3;
    --neutre-300: #c9d4e6;
    --neutre-400: #9aa9c2;
    --neutre-500: #7383a0;
    --neutre-600: #55637f;
    --neutre-700: #37445e;
    --neutre-800: #1f2a44;
    --neutre-900: #0d1b3e;

    --fond: #ffffff;
    --fond-alt: var(--neutre-50);
    --surface: #ffffff;
    --surface-2: var(--neutre-100);
    --bordure: var(--neutre-200);
    --bordure-forte: var(--neutre-300);
    --bordure-champ: var(--neutre-500);

    --texte: var(--neutre-900);
    --texte-corps: var(--neutre-700);
    --texte-discret: var(--neutre-600);
    --blanc: #ffffff;

    --primaire: var(--bleu-700);
    --primaire-hover: var(--bleu-800);
    --primaire-fond: var(--bleu-50);
    --sur-primaire: #ffffff;

    /* Boutons d'action (Réserver, Rechercher...) */
    --action: var(--bleu-600);
    --action-hover: var(--bleu-700);
    --sur-action: #ffffff;

    --accent: var(--soleil-500);
    --accent-hover: var(--soleil-600);
    --accent-fond: var(--soleil-50);
    --accent-texte: var(--soleil-700);
    --sur-accent: var(--neutre-900);

    --succes: var(--emeraude-700);
    --succes-fond: var(--emeraude-50);
    --succes-bordure: var(--emeraude-200);
    --attente: #b45309;
    --attente-fond: #fffbeb;
    --attente-bordure: #fde68a;
    --erreur: #b91c1c;
    --erreur-fond: #fef2f2;
    --erreur-bordure: #fecaca;
    --info: var(--bleu-700);
    --info-fond: var(--bleu-50);
    --info-bordure: var(--bleu-200);
    --cyan: #045a86;
    --cyan-fond: var(--electrique-100);
    --neutre-badge: var(--neutre-700);
    --neutre-badge-fond: var(--neutre-100);

    --anneau-focus: var(--bleu-600);

    --illu-vitre: var(--bleu-100);
    --illu-pneu: var(--neutre-800);
    --illu-jante: var(--neutre-200);
    --illu-phare: var(--soleil-200);
    --illu-feu: #e5484d;

    --paysage-mer: var(--electrique-200);
    --paysage-loin: #c6d9fa;
    --paysage-milieu: #8fb2f2;
    --paysage-proche: #4a7ee0;
    --paysage-sol: var(--bleu-700);
    --paysage-palme: var(--bleu-900);
    --paysage-tronc: #8a6a50;
    --paysage-route: var(--neutre-200);

    --e-1: 0.25rem;
    --e-2: 0.5rem;
    --e-3: 0.75rem;
    --e-4: 1rem;
    --e-5: 1.5rem;
    --e-6: 2rem;
    --e-7: 3rem;
    --e-8: 4rem;
    --e-9: 6rem;

    --r-sm: 0.5rem;
    --r-md: 0.75rem;
    --r-lg: 1rem;
    --r-xl: 1.5rem;
    --r-pill: 999px;

    --t-petit: 0.875rem;
    --t-corps: 1rem;
    --t-grand: 1.125rem;
    --t-h3: 1.25rem;
    --t-titre: clamp(1.75rem, 1.35rem + 1.6vw, 2.5rem);
    --t-titre-grand: clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem);

    --ombre-sm: 0 1px 2px rgba(2, 29, 94, 0.06), 0 1px 3px rgba(2, 29, 94, 0.08);
    --ombre-md: 0 6px 16px -4px rgba(2, 29, 94, 0.14), 0 2px 4px -2px rgba(2, 29, 94, 0.06);
    --ombre-lg: 0 24px 48px -16px rgba(2, 29, 94, 0.26), 0 6px 14px -6px rgba(2, 29, 94, 0.12);

    --police: 'Manrope', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --police-titre: var(--police);

    --duree: 180ms;
}
}
