/* OPEPARTNER — « Une heure pour avancer »
   Surcharge de colors.css avec les quatre couleurs de l'opération.
   colors.css n'est pas modifié : il reste la référence des autres landings du groupe.
   Ce fichier doit être chargé APRÈS lui.

   Contrastes mesurés sur le crème #F5F0E3 (WCAG 2.1) :
     marine    #1E3A52 → 10.4:1  ✓ AA/AAA — texte courant
     ardoise   #4F5D61 →  5.9:1  ✓ AA     — texte secondaire
     gris-bleu #6D7D81 →  3.8:1  ✗        — filets, bordures, grands titres uniquement
     orange    #E18432 →  2.5:1  ✗        — aplats et filets, JAMAIS en texte sur crème

   Le bouton d'action est donc un aplat orange à texte marine (4.3:1), et non à texte
   blanc (2.8:1) : c'est la seule combinaison qui garde l'orange sans devenir illisible
   au soleil, sur un téléphone tenu debout. */
:root {
  --creme:     #F5F0E3;
  --marine:    #1E3A52;
  --gris-bleu: #6D7D81;
  --orange:    #E18432;

  /* Nuances dérivées — indispensables aux textes secondaires et aux états de survol,
     que les quatre couleurs seules ne peuvent pas couvrir sans casser le contraste. */
  --marine-900:    #142838;  /* pied de page */
  --ardoise-700:   #4F5D61;  /* texte secondaire sur crème */
  --gris-bleu-200: #D9DEDF;  /* bordures discrètes */
  --gris-bleu-100: #EDEFEC;  /* surfaces à peine détachées du crème */
  --orange-survol: #C96F22;

  /* --- Remappage des tokens du design system --- */
  --paper:      var(--creme);
  --navy-900:   var(--marine-900);
  --navy-800:   var(--marine);
  --navy-700:   var(--marine);
  --navy-600:   var(--marine);
  --navy-400:   var(--ardoise-700);
  --orange-500: var(--orange);
  --orange-600: var(--orange-survol);
  --grey-100:   var(--gris-bleu-100);
  --grey-200:   var(--gris-bleu-200);
  --grey-300:   var(--gris-bleu-200);

  --color-bg:                 var(--creme);
  --color-surface:            #FFFFFF;
  --color-surface-alt:        var(--gris-bleu-100);
  --color-text:               var(--marine);
  --color-text-muted:         var(--ardoise-700);
  --color-text-inverse:       var(--creme);
  --color-text-inverse-muted: rgba(245,240,227,0.76);
  --color-accent:             var(--orange);
  --color-accent-hover:       var(--orange-survol);
  --color-border:             var(--gris-bleu-200);
  --color-border-inverse:     rgba(245,240,227,0.26);
  --color-link:               var(--marine);
  --color-link-hover:         var(--orange-survol);

  --ring-focus: 0 0 0 3px rgba(225,132,50,0.55);
}
