/* ==========================================================================
   La Petite Fontaine — Feuille de styles principale
   Polices : Playfair Display SC (titres) · Poppins (corps)
   ========================================================================== */

/* ==========================================================================
   1. Variables CSS — Charte graphique Petite Fontaine
   ========================================================================== */

:root {
  /* — Bruns (du logo) — */
  --brun-acajou:      #46140d;   /* brun foncé base */
  --brun-dore:        #cc9b63;   /* brun clair base */
  --brun-slogan:      #b78b59;   /* variante Lighthouse-safe du brun clair */
  --brun-sombre:      #2d0d08;   /* plus foncé que l'acajou */
  --brun-roux:        #8b3a20;
  --brun-cuivre:      #a05c35;
  --brun-fauve:       #c17940;
  --brun-noisette:    #9e6b3a;
  --brun-pale:        #e8c99a;
  --brun-creme:       #f0ddb8;

  /* — Verts (Ardenne) — */
  --vert-fougere:     #5c6b3a;   /* 3e couleur principale */
  --vert-ardenne:     #4a5c32;
  --vert-mousse:      #7a8c5c;
  --vert-lichen:      #8c9a6e;
  --vert-sauge:       #9aaa78;
  --vert-prairie:     #b5c490;
  --vert-brume:       #ced8b5;
  --vert-givre:       #e2ead0;

  /* — Neutres chauds (pierre, lin, calcaire) — */
  --creme-ardennais:  #f5edd8;
  --lin-chaud:        #e8d5b0;
  --sable-roux:       #d4b88a;
  --pierre-calcaire:  #e2d9c5;
  --gres-ardennais:   #c9bda8;
  --ardoise-chaude:   #9a8c7e;
  --ombre-chaude:     #7a6a5a;
  --terre-brule:      #5c4a38;

  /* — Rayon de border des éléments arrondis — */
  --fontaine-radius:  12px;
}

/* ==========================================================================
   2. Gammes de couleurs (classes utilitaires de texte)
   ========================================================================== */

/* Bruns */
.brun-acajou     { color: #46140d; }
.brun-sombre     { color: #2d0d08; }
.brun-roux       { color: #8b3a20; }
.brun-cuivre     { color: #a05c35; }
.brun-fauve      { color: #c17940; }
.brun-noisette   { color: #9e6b3a; }
.brun-dore       { color: #cc9b63; }
.brun-pale       { color: #e8c99a; }
.brun-creme      { color: #f0ddb8; }

/* Verts */
.vert-ardenne    { color: #4a5c32; }
.vert-fougere    { color: #5c6b3a; }
.vert-mousse     { color: #7a8c5c; }
.vert-lichen     { color: #8c9a6e; }
.vert-sauge      { color: #9aaa78; }
.vert-prairie    { color: #b5c490; }
.vert-brume      { color: #ced8b5; }
.vert-givre      { color: #e2ead0; }

/* Neutres chauds */
.creme-ardennais { color: #f5edd8; }
.lin-chaud       { color: #e8d5b0; }
.sable-roux      { color: #d4b88a; }
.pierre-calcaire { color: #e2d9c5; }
.gres-ardennais  { color: #c9bda8; }
.ardoise-chaude  { color: #9a8c7e; }
.ombre-chaude    { color: #7a6a5a; }
.terre-brule     { color: #5c4a38; }

/* ==========================================================================
   3. Variations de couleurs de texte
   (texte courant + liens + hover sur fond coloré)
   ========================================================================== */

/* Sur fond brun-creme ou creme-ardennais */
.text-variant-creme-ardennais,
.text-variant-creme-ardennais a   { color: #6b4e30; }
.text-variant-creme-ardennais a:hover { color: #46140d; }
.text-titre-creme-ardennais        { color: #5a3d24; }

/* Sur fond lin-chaud */
.text-variant-lin-chaud,
.text-variant-lin-chaud a         { color: #6a4a28; }
.text-variant-lin-chaud a:hover   { color: #46140d; }
.text-titre-lin-chaud              { color: #583c20; }

/* Sur fond pierre-calcaire */
.text-variant-pierre-calcaire,
.text-variant-pierre-calcaire a   { color: #5e4e3a; }
.text-variant-pierre-calcaire a:hover { color: #3a2a1a; }
.text-titre-pierre-calcaire        { color: #4e4030; }

/* Sur fond gres-ardennais */
.text-variant-gres-ardennais,
.text-variant-gres-ardennais a    { color: #5a4a38; }
.text-variant-gres-ardennais a:hover { color: #3a2e22; }
.text-titre-gres-ardennais         { color: #4a3c2c; }

/* Sur fond sable-roux */
.text-variant-sable-roux,
.text-variant-sable-roux a        { color: #5c3c1c; }
.text-variant-sable-roux a:hover  { color: #3e2810; }
.text-titre-sable-roux             { color: #4c3016; }

/* Sur fond brun-pale */
.text-variant-brun-pale,
.text-variant-brun-pale a         { color: #6a3e1a; }
.text-variant-brun-pale a:hover   { color: #46140d; }
.text-titre-brun-pale              { color: #5a3014; }

/* Sur fond vert-givre */
.text-variant-vert-givre,
.text-variant-vert-givre a        { color: #4a5c32; }
.text-variant-vert-givre a:hover  { color: #2e3c1e; }
.text-titre-vert-givre             { color: #3c4e28; }

/* Sur fond vert-brume */
.text-variant-vert-brume,
.text-variant-vert-brume a        { color: #3e4e28; }
.text-variant-vert-brume a:hover  { color: #2a3618; }
.text-titre-vert-brume             { color: #344220; }

/* Sur fond vert-prairie */
.text-variant-vert-prairie,
.text-variant-vert-prairie a      { color: #2e3e1a; }
.text-variant-vert-prairie a:hover { color: #1e2a10; }
.text-titre-vert-prairie           { color: #263416; }

/* Sur fond foncé brun-acajou */
.text-variant-brun-acajou,
.text-variant-brun-acajou a       { color: #e8c99a; }
.text-variant-brun-acajou a:hover { color: #f0ddb8; }
.text-titre-brun-acajou            { color: #cc9b63; }

/* Sur fond foncé brun-roux */
.text-variant-brun-roux,
.text-variant-brun-roux a         { color: #e8c99a; }
.text-variant-brun-roux a:hover   { color: #f0ddb8; }
.text-titre-brun-roux              { color: #d4b88a; }

/* Sur fond foncé vert-ardenne */
.text-variant-vert-ardenne,
.text-variant-vert-ardenne a      { color: #ced8b5; }
.text-variant-vert-ardenne a:hover { color: #e2ead0; }
.text-titre-vert-ardenne           { color: #b5c490; }

/* Sur fond foncé vert-fougere */
.text-variant-vert-fougere,
.text-variant-vert-fougere a      { color: #d8e4c0; }
.text-variant-vert-fougere a:hover { color: #e8f0d4; }
.text-titre-vert-fougere           { color: #c0d0a0; }

/* Sur fond foncé vert-mousse */
.text-variant-vert-mousse,
.text-variant-vert-mousse a       { color: #e2ead0; }
.text-variant-vert-mousse a:hover { color: #f0f5e8; }
.text-titre-vert-mousse            { color: #ced8b5; }

/* Sur fond foncé terre-brule */
.text-variant-terre-brule,
.text-variant-terre-brule a       { color: #d4b88a; }
.text-variant-terre-brule a:hover { color: #e8c99a; }
.text-titre-terre-brule            { color: #c0a070; }

/* Liens acajou (usage général sur fond clair) */
.text-brun-acajou     { color: var(--brun-acajou); }
.text-brun-acajou a   { color: var(--brun-acajou); }
.text-brun-acajou a:hover { color: var(--brun-sombre); }

/* Liens dorés (usage général sur fond foncé) */
.text-brun-dore       { color: var(--brun-dore); }
.text-brun-dore a     { color: var(--brun-dore); }
.text-brun-dore a:hover { color: var(--brun-pale); }

/* Liens verts sur fond clair */
.text-vert-fougere    { color: var(--vert-fougere); }
.text-vert-fougere a  { color: var(--vert-fougere); }
.text-vert-fougere a:hover { color: var(--vert-ardenne); }

.text-vert-ardenne    { color: var(--vert-ardenne); }
.text-vert-ardenne a  { color: var(--vert-ardenne); }
.text-vert-ardenne a:hover { color: #2e3c1e; }

/* ==========================================================================
   4. Arrière-plans (backgrounds)
   ========================================================================== */

/* Bruns */
.bg-brun-acajou      { background-color: var(--brun-acajou); }
.bg-brun-sombre      { background-color: var(--brun-sombre); }
.bg-brun-roux        { background-color: var(--brun-roux); }
.bg-brun-cuivre      { background-color: var(--brun-cuivre); }
.bg-brun-fauve       { background-color: var(--brun-fauve); }
.bg-brun-noisette    { background-color: var(--brun-noisette); }
.bg-brun-dore        { background-color: var(--brun-dore); }
.bg-brun-pale        { background-color: var(--brun-pale); }
.bg-brun-creme       { background-color: var(--brun-creme); }

/* Verts */
.bg-vert-ardenne     { background-color: var(--vert-ardenne); }
.bg-vert-fougere     { background-color: var(--vert-fougere); }
.bg-vert-mousse      { background-color: var(--vert-mousse); }
.bg-vert-lichen      { background-color: var(--vert-lichen); }
.bg-vert-sauge       { background-color: var(--vert-sauge); }
.bg-vert-prairie     { background-color: var(--vert-prairie); }
.bg-vert-brume       { background-color: var(--vert-brume); }
.bg-vert-givre       { background-color: var(--vert-givre); }

/* Neutres chauds */
.bg-creme-ardennais  { background-color: var(--creme-ardennais); }
.bg-lin-chaud        { background-color: var(--lin-chaud); }
.bg-sable-roux       { background-color: var(--sable-roux); }
.bg-pierre-calcaire  { background-color: var(--pierre-calcaire); }
.bg-gres-ardennais   { background-color: var(--gres-ardennais); }
.bg-ardoise-chaude   { background-color: var(--ardoise-chaude); }
.bg-ombre-chaude     { background-color: var(--ombre-chaude); }
.bg-terre-brule      { background-color: var(--terre-brule); }

/* ==========================================================================
   5. Dégradés (backgrounds gradient)
   ========================================================================== */

/* Dégradés chauds (bruns) */
.bg-gradient-creme-chaud {
  background: linear-gradient(to bottom, var(--brun-creme), var(--creme-ardennais), var(--brun-creme));
}
.bg-gradient-lin-sable {
  background: linear-gradient(to bottom, var(--creme-ardennais), var(--lin-chaud), var(--creme-ardennais));
}
.bg-gradient-brun-pale {
  background: linear-gradient(to bottom, var(--lin-chaud), var(--brun-pale), var(--lin-chaud));
}
.bg-gradient-sable-calcaire {
  background: linear-gradient(to bottom, var(--pierre-calcaire), var(--sable-roux), var(--pierre-calcaire));
}
.bg-gradient-fauve-noisette {
  background: linear-gradient(to bottom, var(--brun-fauve), var(--brun-noisette));
}
.bg-gradient-acajou-roux {
  background: linear-gradient(to bottom, var(--brun-acajou), var(--brun-roux));
}
.bg-gradient-acajou-sombre {
  background: linear-gradient(to bottom, var(--brun-sombre), var(--brun-acajou));
}

/* Dégradés verts */
.bg-gradient-vert-givre {
  background: linear-gradient(to bottom, var(--vert-givre), var(--vert-brume), var(--vert-givre));
}
.bg-gradient-vert-prairie {
  background: linear-gradient(to bottom, var(--vert-brume), var(--vert-prairie), var(--vert-brume));
}
.bg-gradient-vert-lichen {
  background: linear-gradient(to bottom, var(--vert-prairie), var(--vert-lichen), var(--vert-prairie));
}
.bg-gradient-vert-mousse {
  background: linear-gradient(to bottom, var(--vert-lichen), var(--vert-mousse), var(--vert-lichen));
}
.bg-gradient-vert-fougere {
  background: linear-gradient(to bottom, var(--vert-mousse), var(--vert-fougere));
}
.bg-gradient-vert-ardenne {
  background: linear-gradient(to bottom, var(--vert-fougere), var(--vert-ardenne));
}

/* Dégradés mixtes (vert + brun) */
.bg-gradient-ardenne-acajou {
  background: linear-gradient(to bottom right, var(--vert-ardenne), var(--brun-acajou));
}
.bg-gradient-fougere-roux {
  background: linear-gradient(to bottom right, var(--vert-fougere), var(--brun-roux));
}
.bg-gradient-mousse-creme {
  background: linear-gradient(to bottom, var(--vert-givre), var(--vert-brume), var(--creme-ardennais));
}
.bg-gradient-creme-givre {
  background: linear-gradient(to bottom, var(--creme-ardennais), var(--vert-givre), var(--creme-ardennais));
}

/* ==========================================================================
   6. Boutons Bootstrap 5 — Gamme Fontaine
   Polices : Playfair Display SC (titres) · Poppins (corps)
   ========================================================================== */

/* — Base commune à tous les boutons Fontaine — */
[class*="btn-fontaine-"] {
  font-family: 'Poppins', sans-serif;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 50px;
  padding: 0.6rem 1.8rem;
  font-size: 0.9rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid transparent;
  transition: all 0.3s ease;
  cursor: pointer;
  text-decoration: none;
}

[class*="btn-fontaine-"]:hover,
[class*="btn-fontaine-"]:focus {
  box-shadow: 0 rgba(70, 20, 13, 0.25);
}

/* — Boutons pleins (fonds foncés, texte clair) — */

/* 1. Acajou classique */
.btn-fontaine-acajou {
  background-color: var(--brun-acajou);
  color: var(--brun-creme);
  border-color: var(--brun-acajou);
}
.btn-fontaine-acajou:hover {
  background-color: var(--brun-sombre);
  color: var(--brun-pale);
  border-color: var(--brun-sombre);
}

/* 2. Brun roux */
.btn-fontaine-roux {
  background-color: var(--brun-roux);
  color: var(--brun-creme);
  border-color: var(--brun-roux);
}
.btn-fontaine-roux:hover {
  background-color: var(--brun-acajou);
  color: var(--brun-pale);
  border-color: var(--brun-acajou);
}

/* 3. Brun doré */
.btn-fontaine-dore {
  background-color: var(--brun-dore);
  color: var(--brun-sombre);
  border-color: var(--brun-dore);
}
.btn-fontaine-dore:hover {
  background-color: var(--brun-fauve);
  color: var(--brun-sombre);
  border-color: var(--brun-fauve);
}

/* 4. Brun cuivre */
.btn-fontaine-cuivre {
  background-color: var(--brun-cuivre);
  color: var(--brun-creme);
  border-color: var(--brun-cuivre);
}
.btn-fontaine-cuivre:hover {
  background-color: var(--brun-roux);
  color: var(--brun-creme);
  border-color: var(--brun-roux);
}

/* 5. Vert ardenne */
.btn-fontaine-ardenne {
  background-color: var(--vert-ardenne);
  color: var(--vert-givre);
  border-color: var(--vert-ardenne);
}
.btn-fontaine-ardenne:hover {
  background-color: #2e3c1e;
  color: var(--vert-brume);
  border-color: #2e3c1e;
}

/* 6. Vert fougère */
.btn-fontaine-fougere {
  background-color: var(--vert-fougere);
  color: var(--vert-givre);
  border-color: var(--vert-fougere);
}
.btn-fontaine-fougere:hover {
  background-color: var(--vert-ardenne);
  color: var(--vert-brume);
  border-color: var(--vert-ardenne);
}

/* 7. Vert mousse */
.btn-fontaine-mousse {
  background-color: var(--vert-mousse);
  color: var(--vert-givre);
  border-color: var(--vert-mousse);
}
.btn-fontaine-mousse:hover {
  background-color: var(--vert-fougere);
  color: var(--vert-brume);
  border-color: var(--vert-fougere);
}

/* 8. Crème ardennais (fond clair, texte foncé) */
.btn-fontaine-creme {
  background-color: var(--creme-ardennais);
  color: var(--brun-acajou);
  border-color: var(--sable-roux);
}
.btn-fontaine-creme:hover {
  background-color: var(--lin-chaud);
  color: var(--brun-sombre);
  border-color: var(--brun-noisette);
}

/* 9. Terre brûlée */
.btn-fontaine-terre {
  background-color: var(--terre-brule);
  color: var(--brun-creme);
  border-color: var(--terre-brule);
}
.btn-fontaine-terre:hover {
  background-color: var(--ombre-chaude);
  color: var(--brun-pale);
  border-color: var(--ombre-chaude);
}

/* 10. Sable roux */
.btn-fontaine-sable {
  background-color: var(--sable-roux);
  color: var(--brun-acajou);
  border-color: var(--sable-roux);
}
.btn-fontaine-sable:hover {
  background-color: var(--brun-pale);
  color: var(--brun-sombre);
  border-color: var(--brun-noisette);
}

/* — Boutons outline (transparents, contour coloré) — */

/* 11. Outline acajou (sur fond clair) */
.btn-fontaine-outline-acajou {
  background-color: transparent;
  color: var(--brun-acajou);
  border-color: var(--brun-acajou);
}
.btn-fontaine-outline-acajou:hover {
  background-color: var(--brun-acajou);
  color: var(--brun-creme);
}

/* 12. Outline doré (sur fond foncé) */
.btn-fontaine-outline-dore {
  background-color: transparent;
  color: var(--brun-dore);
  border-color: var(--brun-dore);
}
.btn-fontaine-outline-dore:hover {
  background-color: var(--brun-dore);
  color: var(--brun-sombre);
}

/* 13. Outline brun-pale (sur fond foncé) */
.btn-fontaine-outline-pale {
  background-color: transparent;
  color: var(--brun-pale);
  border-color: var(--brun-pale);
}
.btn-fontaine-outline-pale:hover {
  background-color: var(--brun-pale);
  color: var(--brun-acajou);
}

/* 14. Outline creme (sur fond foncé) */
.btn-fontaine-outline-creme {
  background-color: transparent;
  color: var(--creme-ardennais);
  border-color: var(--creme-ardennais);
}
.btn-fontaine-outline-creme:hover {
  background-color: var(--creme-ardennais);
  color: var(--brun-acajou);
}

/* 15. Outline vert-fougère (sur fond clair) */
.btn-fontaine-outline-fougere {
  background-color: transparent;
  color: var(--vert-fougere);
  border-color: var(--vert-fougere);
}
.btn-fontaine-outline-fougere:hover {
  background-color: var(--vert-fougere);
  color: var(--vert-givre);
}

/* 16. Outline vert-givre (sur fond foncé) */
.btn-fontaine-outline-givre {
  background-color: transparent;
  color: var(--vert-givre);
  border-color: var(--vert-givre);
}
.btn-fontaine-outline-givre:hover {
  background-color: var(--vert-givre);
  color: var(--vert-ardenne);
}

/* 17. Outline vert-brume (sur fond foncé) */
.btn-fontaine-outline-brume {
  background-color: transparent;
  color: var(--vert-brume);
  border-color: var(--vert-brume);
}
.btn-fontaine-outline-brume:hover {
  background-color: var(--vert-brume);
  color: var(--vert-fougere);
}

/* 18. Ghost acajou (semi-transparent, sur hero image) */
.btn-fontaine-ghost-acajou {
  background: rgba(70, 20, 13, 0.2);
  color: var(--brun-creme);
  border-color: rgba(240, 221, 184, 0.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.btn-fontaine-ghost-acajou:hover {
  background: var(--brun-acajou);
  color: var(--brun-pale);
}

/* 19. Ghost vert (semi-transparent, sur hero image) */
.btn-fontaine-ghost-fougere {
  background: rgba(92, 107, 58, 0.2);
  color: var(--vert-givre);
  border-color: rgba(226, 234, 208, 0.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.btn-fontaine-ghost-fougere:hover {
  background: var(--vert-fougere);
  color: var(--vert-givre);
}

/* 20. Ghost creme (semi-transparent, sur hero image) */
.btn-fontaine-ghost-creme {
  background: rgba(245, 237, 216, 0.15);
  color: var(--creme-ardennais);
  border-color: rgba(245, 237, 216, 0.65);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.btn-fontaine-ghost-creme:hover {
  background: var(--creme-ardennais);
  color: var(--brun-acajou);
}

/* ==========================================================================
   7. Utilitaires divers
   ========================================================================== */

.vertical-height-100 { height: 100vh; }

.flex-vertical-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100%;
}

/* ==========================================================================
   8. BRANDING BLOCK — NE PAS MODIFIER
   ========================================================================== */

.brun-fonce-base { color: #46140d; }
.brun-clair-base { color: #cc9b63; }

.slogan-site-petitefontaine {
  font-size: 1.4em;
  font-family: 'Playfair Display SC', serif;
  color: #b78b59;
}

.nom-site-petitefontaine {
  font-size: 1.4em;
  font-family: 'Poppins', sans-serif;
  color: #46140d;
  margin-left: 10px;
}

/* ==========================================================================
   8. SOUS-THEME
   ========================================================================== */

.breadcrumb { font-size: 1.2em; }

.selecteur a {
  text-decoration: none;
  margin: -0.6rem;
  color: #3C4D32;
}

.selecteur a:hover {
  color: #8f997d;
}

.selecteur .is-active {
  color: #3C4D32;
  background-color: #f3ebe4;
}

.sidebar .block {
  border-style: none;
  border-width: 0;
  padding: 15px 15px;
  margin: 0 0 20px;
}

.sidebar h2 {
  margin: 0 0 0.5em;
  border-bottom: 0px;
  padding-bottom: 5px;
  text-shadow: 0 1px 0 #fff;
  font-size: 1.2em;
  line-height: 1.2;
}

.sidebar .block .content {
  font-size: 1.2em;
  line-height: 1.4;
}

.sidebar tbody {
  border: none;
}
/* ==========================================================================
   Gamme bleue — Parking / Stationnement
   Ratios WCAG 2.1 vérifiés (texte normal : AA = 4.5:1 / AAA = 7:1)
   ========================================================================== */

/* --- Variables CSS --- */
:root {
  --bleu-nuit:     #1a2e4a;   /* 13.69:1 sur blanc → AAA */
  --bleu-ardoise:  #1e3a5f;   /* 11.50:1 sur blanc → AAA */
  --bleu-profond:  #2a5080;   /*  8.21:1 sur blanc → AAA */
  --bleu-lac:      #2e6da4;   /*  5.47:1 sur blanc → AA  */
  --bleu-ciel:     #3d85c8;   /*  3.90:1 sur blanc → fond clair uniquement */
  --bleu-brume:    #6aaed6;   /*  fond clair uniquement */
  --bleu-givre:    #9dcae8;   /*  fond clair uniquement */
  --bleu-pale:     #cce5f5;   /*  fond clair uniquement */
  --bleu-creme:    #e8f4fb;   /*  fond clair uniquement */
}

/* --- Gamme de couleurs (classes utilitaires de texte) ---
   Utiliser uniquement bleu-nuit → bleu-lac comme couleur de texte sur fond blanc.
   bleu-ciel → bleu-creme : fonds uniquement, jamais en couleur de texte sur blanc. */
.bleu-nuit     { color: #1a2e4a; }   /* AAA sur blanc */
.bleu-ardoise  { color: #1e3a5f; }   /* AAA sur blanc */
.bleu-profond  { color: #2a5080; }   /* AAA sur blanc */
.bleu-lac      { color: #2e6da4; }   /* AA  sur blanc */

/* --- Arrière-plans (backgrounds) --- */
.bg-bleu-nuit     { background-color: #1a2e4a; }
.bg-bleu-ardoise  { background-color: #1e3a5f; }
.bg-bleu-profond  { background-color: #2a5080; }
.bg-bleu-lac      { background-color: #2e6da4; }
.bg-bleu-ciel     { background-color: #3d85c8; }
.bg-bleu-brume    { background-color: #6aaed6; }
.bg-bleu-givre    { background-color: #9dcae8; }
.bg-bleu-pale     { background-color: #cce5f5; }
.bg-bleu-creme    { background-color: #e8f4fb; }

/* --- Variations texte + liens sur fonds bleus foncés ---
   bleu-pale (#cce5f5) sur bleu-nuit    : 10.49:1 → AAA
   bleu-creme (#e8f4fb) sur bleu-ardoise: 10.28:1 → AAA
   blanc sur bleu-profond               :  8.21:1 → AAA
   blanc sur bleu-lac                   :  3.67:1 → utiliser bleu-creme à la place */

.text-variant-bleu-nuit,
.text-variant-bleu-nuit a         { color: #cce5f5; }
.text-variant-bleu-nuit a:hover   { color: #e8f4fb; }
.text-titre-bleu-nuit              { color: #9dcae8; }

.text-variant-bleu-ardoise,
.text-variant-bleu-ardoise a       { color: #e8f4fb; }
.text-variant-bleu-ardoise a:hover { color: #ffffff; }
.text-titre-bleu-ardoise           { color: #cce5f5; }

.text-variant-bleu-profond,
.text-variant-bleu-profond a       { color: #ffffff; }
.text-variant-bleu-profond a:hover { color: #e8f4fb; }
.text-titre-bleu-profond           { color: #cce5f5; }

/* Sur fonds bleus clairs (bleu-pale, bleu-creme, bleu-givre) :
   texte en bleu-nuit ou bleu-ardoise */
.text-variant-bleu-pale,
.text-variant-bleu-pale a         { color: #1e3a5f; }
.text-variant-bleu-pale a:hover   { color: #1a2e4a; }
.text-titre-bleu-pale              { color: #1a2e4a; }

.text-variant-bleu-creme,
.text-variant-bleu-creme a        { color: #1e3a5f; }
.text-variant-bleu-creme a:hover  { color: #1a2e4a; }
.text-titre-bleu-creme             { color: #1a2e4a; }

.text-variant-bleu-givre,
.text-variant-bleu-givre a        { color: #1e3a5f; }
.text-variant-bleu-givre a:hover  { color: #1a2e4a; }
.text-titre-bleu-givre             { color: #1a2e4a; }

/* --- Dégradés --- */
.bg-gradient-bleu-creme {
  background: linear-gradient(to bottom, #e8f4fb, #cce5f5, #e8f4fb);
}
.bg-gradient-bleu-givre {
  background: linear-gradient(to bottom, #cce5f5, #9dcae8, #cce5f5);
}
.bg-gradient-bleu-brume {
  background: linear-gradient(to bottom, #9dcae8, #6aaed6, #9dcae8);
}
.bg-gradient-bleu-ciel {
  background: linear-gradient(to bottom, #6aaed6, #3d85c8, #6aaed6);
}
.bg-gradient-bleu-lac {
  background: linear-gradient(to bottom, #2e6da4, #2a5080);
}
.bg-gradient-bleu-profond {
  background: linear-gradient(to bottom, #2a5080, #1e3a5f);
}
.bg-gradient-bleu-nuit {
  background: linear-gradient(to bottom, #1e3a5f, #1a2e4a);
}

/* --- Boutons Bootstrap 5 — Gamme bleue --- */

/* Plein bleu-ardenne (texte blanc) — 11.50:1 → AAA */
.btn-fontaine-bleu {
  background-color: #1e3a5f;
  color: #ffffff;
  border-color: #1e3a5f;
}
.btn-fontaine-bleu:hover {
  background-color: #1a2e4a;
  color: #cce5f5;
  border-color: #1a2e4a;
}

/* Plein bleu-lac (texte blanc) — 5.47:1 → AA */
.btn-fontaine-bleu-lac {
  background-color: #2e6da4;
  color: #ffffff;
  border-color: #2e6da4;
}
.btn-fontaine-bleu-lac:hover {
  background-color: #2a5080;
  color: #ffffff;
  border-color: #2a5080;
}

/* Plein bleu-creme (texte foncé) */
.btn-fontaine-bleu-creme {
  background-color: #e8f4fb;
  color: #1e3a5f;
  border-color: #9dcae8;
}
.btn-fontaine-bleu-creme:hover {
  background-color: #cce5f5;
  color: #1a2e4a;
  border-color: #6aaed6;
}

/* Outline bleu-ardoise sur fond blanc */
.btn-fontaine-outline-bleu {
  background-color: transparent;
  color: #1e3a5f;
  border-color: #1e3a5f;
}
.btn-fontaine-outline-bleu:hover {
  background-color: #1e3a5f;
  color: #e8f4fb;
}

/* Outline bleu-pale sur fond foncé */
.btn-fontaine-outline-bleu-pale {
  background-color: transparent;
  color: #cce5f5;
  border-color: #cce5f5;
}
.btn-fontaine-outline-bleu-pale:hover {
  background-color: #cce5f5;
  color: #1a2e4a;
}