/* ============================================================
   Proxi'Seniors — Tokens (DA issue du flyer)
   Marine + bleu ciel doux + jaune doré. Accessibilité senior :
   gros caractères, fort contraste, cibles tactiles généreuses.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500;600;700;800&family=Mulish:wght@400;500;600;700;800&display=swap');

:root {
  /* — Marque — */
  --navy:        #173A78;   /* bleu marine principal (titres, texte fort) */
  --navy-deep:   #0F2A5C;   /* marine profond (bandeaux pleins) */
  --navy-ink:    #14233F;   /* texte courant très lisible */
  --sky:         #BBE0F1;   /* bleu ciel panneaux (comme le flyer) */
  --sky-soft:    #E4F3FB;   /* bleu ciel très clair, fonds de section */
  --sky-line:    #CFE6F2;   /* lignes / bordures douces */
  --yellow:      #F7C518;   /* jaune doré — CTA, cœurs, accents */
  --yellow-deep: #E0A800;   /* jaune au survol / ombrage */
  --yellow-soft: #FDF3D2;   /* fond jaune pâle */

  /* — Neutres — */
  --white:       #FFFFFF;
  --page:        #F5FAFD;   /* fond de page, blanc bleuté doux */
  --ink:         #14233F;   /* corps de texte */
  --muted:       #4C5E78;   /* texte secondaire */
  --subtle:      #76879E;   /* métadonnées, légendes */

  /* — Sémantique — */
  --green:       #3F9E6A;   /* validations, check-list */
  --green-soft:  #E4F4EB;

  /* — Typo — */
  --font-display: 'Poppins', system-ui, sans-serif;
  --font-body:    'Mulish', system-ui, sans-serif;

  /* Échelle généreuse (senior) */
  --fs-13: 0.8125rem;
  --fs-15: 0.9375rem;
  --fs-17: 1.0625rem;   /* base un peu plus grande */
  --fs-19: 1.1875rem;   /* corps confortable */
  --fs-22: 1.375rem;
  --fs-26: 1.625rem;
  --fs-32: 2rem;
  --fs-40: 2.5rem;
  --fs-52: 3.25rem;
  --fs-64: 4rem;

  /* — Rayons — */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-xl: 32px;
  --r-pill: 999px;

  /* — Ombres douces (jamais agressives) — */
  --sh-1: 0 2px 10px rgba(20, 49, 95, 0.06);
  --sh-2: 0 10px 30px rgba(20, 49, 95, 0.10);
  --sh-3: 0 22px 60px rgba(15, 42, 92, 0.16);
  --sh-yellow: 0 10px 26px rgba(224, 168, 0, 0.32);

  /* — Espacements — */
  --sp-2: 8px;  --sp-3: 12px;  --sp-4: 16px;  --sp-5: 20px;
  --sp-6: 24px; --sp-8: 32px;  --sp-10: 40px; --sp-12: 48px;
  --sp-16: 64px; --sp-20: 80px; --sp-24: 96px;
}

* { box-sizing: border-box; }