/* Palette douce (validée le 6 novembre 2026) : les blocs sont en tons pastel, les textes et les boutons gardent leurs couleurs.
   Elle s'applique parce que <html> porte la classe « doux » ; retirer cette classe redonne les couleurs vives. */
html.doux {
  --soft-navy: #D9E6F4;
  --soft-orange: #FFDCBC;
  --soft-green: #D2EEDF;
  --soft-yellow: #FFEDA3;
  --orange-pale: #FFEEDD;
  --yellow-pale: #FFF6D2;
  --accent-orange: #B85500;
  --on-navy: #1C4775;        /* texte courant des blocs bleus */
  --green-ink: #12784F;      /* questions et intertitres des blocs verts */
}
html.doux .tile--navy  { background: var(--soft-navy);   color: var(--navy); }
html.doux .tile--orange { background: var(--soft-orange); color: var(--navy); }
html.doux .tile--green { background: var(--soft-green);  color: var(--navy); }
html.doux .tile--yellow { background: var(--soft-yellow); color: var(--navy); }

/* Mises en valeur lisibles sur fond clair */
html.doux .hl-yellow,
html.doux .kicker--yellow,
html.doux .tile--navy [style*="var(--yellow)"] { color: var(--accent-orange) !important; }
html.doux .hero .lead { color: var(--green-dark); }
html.doux .dots--yellow li::before { background: var(--green-dark); }
html.doux .action__foot { border-top-color: rgba(2, 44, 90, .18) !important; }

/* Les boutons blancs deviennent pleins, pour rester bien visibles sur les fonds clairs */
html.doux .tile--navy .btn--white { background: var(--navy); color: var(--white); }
html.doux .tile--green .btn--white { background: var(--green-dark); color: var(--white); }
html.doux .tile--orange .btn--white { background: var(--navy); color: var(--white); }

/* Le pied de page reste bleu marine : il garde ses couleurs claires d'origine */
html.doux .site-footer { --on-navy: #D5DEE8; --green-ink: #CFEFE1; }

/* La citation reste le seul bloc en jaune vif : c'est le temps fort de la page */
html.doux .quote { background: var(--yellow); }