/* MyArk — hub des races (races.html) au visuel de l'affiche A3 (20/10/2026).
   Même univers que css/fiche-visuelle.css : fond crème à taches de couleur, cartes pastel
   (sable, pêche, sauge), titres arrondis vert sapin (Baloo 2), annotations manuscrites
   terracotta (Caveat), pastilles d'icône. Chargée par races.html seulement, après composants.css.
   Écrit à la main (pas de données) ; versionné par tools/apply_asset_versions.py. */

@font-face {
  font-family: 'Baloo 2'; font-style: normal; font-weight: 800; font-display: swap;
  src: url('../assets/fonts/baloo-2-latin-800.woff2') format('woff2');
}
@font-face {
  font-family: 'Caveat'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('../assets/fonts/caveat-latin-700.woff2') format('woff2');
}

body:has(.races-hub) {
  --fv-fond: #F5EBDC; --fv-carte: #FFF9F0; --fv-sable: #F3DFBA; --fv-peche: #F6D9C9; --fv-sauge: #E1E8D8;
  --fv-vert: #13594F; --fv-vert-fonce: #0F4A42; --fv-brun: #6B4A2E; --fv-terre: #A84B24;
  --fv-blob-1: #EBD3A9; --fv-blob-2: #DCE6D3; --fv-papier: #F4EFE6;
  --fv-ombre: 0 2px 4px rgba(107, 74, 46, .06), 0 10px 24px rgba(107, 74, 46, .10);
  --fv-titre: 'Baloo 2', var(--police-titre);
  --fv-main: 'Caveat', 'Segoe Print', 'Bradley Hand', cursive;
  --fond: var(--fv-fond); --carte: var(--fv-carte); --subtil: #EFE2CC; --bord: #E6D5BB;
  --lagune: var(--fv-vert); --lagune-fort: var(--fv-vert-fonce); --lagune-teinte: var(--fv-sauge);
  --texte-2: #675C50; /* 5,3:1 sur la carte crème */
  background:
    radial-gradient(ellipse min(46vw, 460px) 320px at calc(100% + 60px) 120px, var(--fv-blob-1) 97%, transparent 100%),
    radial-gradient(ellipse min(34vw, 320px) 280px at -80px 900px, var(--fv-blob-2) 97%, transparent 100%),
    var(--fv-fond);
}
@media (prefers-color-scheme: dark) {
  body:has(.races-hub) {
    --fv-fond: #1B1814; --fv-carte: #25201A; --fv-sable: #3A2F20; --fv-peche: #3D2A22; --fv-sauge: #26302A;
    --fv-vert: #8AD3C2; --fv-vert-fonce: #A6E0D2; --fv-brun: #D9B98F; --fv-terre: #F0A07A;
    --fv-blob-1: #2E261C; --fv-blob-2: #1F2822;
    --fv-ombre: none;
    --subtil: #2E2820; --bord: #3A3229; --texte-2: #B5AC9F;
  }
}

.races-hub .manuscrit { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; }
.races-hub > .breadcrumb { margin-bottom: calc(-1 * var(--s-5)); }

/* ---------- En-tête : comme le haut de l'affiche ---------- */
.hub-hero { display: grid; gap: var(--s-6); align-items: center; }
@media (min-width: 900px) { .hub-hero { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--s-7); } }
.hub-hero__texte { display: flex; flex-direction: column; gap: var(--s-2); }
.hub-hero__sur { margin: 0; font-family: var(--fv-titre); font-weight: 800; font-size: clamp(1.35rem, 3vw, 1.75rem); line-height: 1; color: var(--fv-brun); }
.hub-hero h1 {
  margin: 0; font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em;
  font-size: clamp(2.6rem, 7vw, 4.6rem); line-height: 1.02; color: var(--fv-vert);
}
.hub-hero__accroche { margin: 0; font-size: clamp(1.75rem, 4.5vw, 2.4rem); line-height: 1.1; color: var(--fv-terre); }
.hub-hero .lead { margin-top: var(--s-3); max-width: 38rem; }

/* Chiffres : petites cartes comme l'encart « Gabarit » */
.hub-chiffres { display: flex; flex-wrap: wrap; gap: 12px; margin: var(--s-4) 0 0; }
.hub-chiffres > div { min-width: 7.5rem; padding: 10px 18px 12px; border-radius: 18px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.hub-chiffres dt { font-size: var(--t-caption); line-height: var(--lh-caption); font-weight: 700; letter-spacing: var(--suivi-caption); text-transform: uppercase; color: var(--fv-brun); }
.hub-chiffres dd { margin: 0; font-family: var(--fv-titre); font-weight: 800; font-size: 2.1rem; line-height: 1.1; color: var(--fv-vert); }
@media (max-width: 599px) {
  .hub-chiffres { flex-wrap: nowrap; gap: 8px; }
  .hub-chiffres > div { flex: 1 1 0; min-width: 0; padding: 10px 12px 12px; }
  .hub-chiffres dd { font-size: 1.75rem; }
}

/* Trois affiches en éventail */
.hub-affiches {
  list-style: none; margin: 0 auto; padding: var(--s-4) var(--s-2) var(--s-2); width: min(100%, 560px);
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end;
}
.hub-affiches li { position: relative; }
.hub-affiches li:nth-child(1) { rotate: -7deg; translate: 14% 5%; z-index: 1; }
.hub-affiches li:nth-child(2) { z-index: 2; scale: 1.1; }
.hub-affiches li:nth-child(3) { rotate: 7deg; translate: -14% 5%; z-index: 1; }
.hub-affiches a { display: block; border-radius: 10px; }
.hub-affiches img {
  display: block; width: 100%; height: auto; aspect-ratio: 480 / 678; border-radius: 10px; background: var(--fv-papier);
  box-shadow: 0 4px 10px rgba(107, 74, 46, .14), 0 18px 40px rgba(107, 74, 46, .20);
  transition: translate .25s ease, box-shadow .25s ease;
}
.hub-une { margin: 0; display: flex; flex-direction: column; align-items: center; gap: var(--s-4); }
.hub-une figcaption { font-size: clamp(1.4rem, 3.4vw, 1.8rem); line-height: 1.1; color: var(--fv-terre); text-align: center; rotate: -2deg; }
@media (hover: hover) { .hub-affiches a:hover img { translate: 0 -10px; } }
.hub-affiches a:focus-visible { outline: 3px solid var(--fv-vert); outline-offset: 4px; }

/* ---------- Familles : grandes cartes pastel, comme les blocs de l'affiche ---------- */
.familles { display: grid; gap: var(--s-5); }
/* Grand écran : deux familles de une ou deux espèces partagent une rangée. */
@media (min-width: 900px) {
  .familles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .famille { grid-column: 1 / -1; }
  .famille.famille--demi { grid-column: auto; }
  .famille--demi .especes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.famille {
  display: flex; flex-direction: column; gap: var(--s-4);
  padding: 22px 16px 18px; border-radius: 28px; background: var(--fv-sable); box-shadow: var(--fv-ombre);
}
.famille--peche { background: var(--fv-peche); }
.famille--sauge { background: var(--fv-sauge); }
@media (min-width: 768px) { .famille { padding: 28px 32px 32px; } }
.famille__tete { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); }
.famille h2, .races-hub .hub-note h2 {
  display: flex; align-items: center; gap: 12px; margin: 0;
  font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert);
}
.famille--peche h2 { color: var(--fv-terre); }
.famille__pastille {
  display: inline-grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 50%;
  background: #FFF9F0; font-family: var(--police-texte); font-size: 1.5rem; line-height: 1;
  box-shadow: 0 1px 2px rgba(107, 74, 46, .14);
}
.famille__compte { margin: 0 0 0 auto; font-size: var(--t-small); font-weight: 600; color: var(--fv-brun); }

.especes {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 148px), 1fr));
}
@media (min-width: 900px) { .especes { gap: 16px; grid-template-columns: repeat(auto-fill, minmax(196px, 1fr)); } }
.espece {
  display: flex; flex-direction: column; height: 100%; overflow: hidden;
  border-radius: 20px; background: var(--fv-carte); color: var(--texte); text-decoration: none;
  box-shadow: 0 1px 2px rgba(107, 74, 46, .10);
  transition: translate .25s ease, box-shadow .25s ease;
}
.espece__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: radial-gradient(ellipse at center, #FBF3E6 0%, #F1E4CF 85%); }
.espece__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: scale .4s ease; }
.espece__img--emoji { display: grid; place-items: center; font-size: 3rem; }
.espece__texte { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 10px 14px 14px; }
.espece__nom { font-family: var(--fv-titre); font-weight: 800; font-size: 1.3rem; line-height: 1.15; color: var(--fv-vert); }
.espece__compte { font-size: var(--t-small); line-height: var(--lh-small); color: var(--texte-2); }
.espece__affiches {
  margin-top: 6px; padding: 2px 10px; border-radius: var(--rayon-pill);
  background: var(--fv-sauge); color: var(--fv-vert); font-size: var(--t-caption); line-height: 1.6; font-weight: 700;
}
.famille--sauge .espece__affiches { background: var(--fv-sable); color: var(--fv-brun); }
@media (hover: hover) {
  .espece:hover { translate: 0 -4px; box-shadow: var(--fv-ombre); }
  .espece:hover .espece__img img { scale: 1.06; }
}
.espece:focus-visible { outline: 3px solid var(--fv-vert); outline-offset: 3px; }

/* Une ou deux affiches seulement (pages espèce) */
.hub-affiches--1 { grid-template-columns: minmax(0, 1fr); width: min(60%, 240px); }
.hub-affiches--1 li:nth-child(1) { rotate: -3deg; translate: none; }
.hub-affiches--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(80%, 400px); }
.hub-affiches--2 li:nth-child(1) { rotate: -5deg; translate: 8% 3%; }
.hub-affiches--2 li:nth-child(2) { rotate: 4deg; scale: 1; translate: -8% 0; }

/* ---------- Pages espèce (/races/<espèce>/) ---------- */
.hub-hero__sur:has(.famille__pastille) { display: flex; align-items: center; gap: 12px; }
.races-espece .hub-hero .meta { max-width: 38rem; }
.races-hub .hub__search { max-width: 26rem; }
.races-hub .hub__search label { color: var(--fv-brun); }
.races-hub .hub__search input { border-radius: var(--rayon-pill); padding: 0 20px; background: var(--fv-carte); border-color: transparent; box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.espece__accroche { margin-top: 2px; font-size: 1.35rem; line-height: 1.1; color: var(--fv-terre); }
.espece__desc { font-size: var(--t-small); line-height: var(--lh-small); color: var(--texte-2); }
.espece__vigilance { margin-top: 2px; font-size: var(--t-small); line-height: var(--lh-small); font-weight: 600; color: var(--fv-terre); }
.races-espece .section-head h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert); }
.races-espece .cards .card { border: 0; border-radius: 22px; background: var(--fv-sable); box-shadow: var(--fv-ombre); }
.races-espece .cards .card:nth-child(3n+2) { background: var(--fv-peche); }
.races-espece .cards .card:nth-child(3n) { background: var(--fv-sauge); }
.races-espece .cards .card h3 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: 1.8rem; line-height: 1.1; color: var(--fv-vert); }
.races-espece .cards .card .eyebrow { color: var(--fv-brun); }

/* Filtres par critères (pages espèce, 20/10/2026) */
.filtres { border-radius: 20px; background: var(--fv-carte); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.filtres[hidden] { display: none; }
.filtres summary {
  display: flex; align-items: center; gap: 10px; min-height: var(--cible); padding: 10px 20px;
  cursor: pointer; list-style: none; font-weight: 700; color: var(--fv-vert);
}
.filtres summary::-webkit-details-marker { display: none; }
.filtres summary::after { content: "▾"; margin-left: auto; color: var(--fv-brun); transition: rotate .2s ease; }
.filtres[open] summary::after { rotate: 180deg; }
.filtres summary:focus-visible { outline: 3px solid var(--fv-vert); outline-offset: 2px; border-radius: 20px; }
.filtres__corps { display: flex; flex-direction: column; gap: var(--s-3); padding: 0 20px 18px; }
.filtre { display: grid; gap: 6px; min-width: 0; }
.filtre .hub__filters { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; }
@media (min-width: 768px) { .filtre { grid-template-columns: 9rem 1fr; align-items: center; } }
.filtre__titre { margin: 0; font-size: var(--t-caption); font-weight: 700; letter-spacing: var(--suivi-caption); text-transform: uppercase; color: var(--fv-brun); }
.races-hub button.chip { min-height: 40px; background: var(--fv-fond); border-color: transparent; color: var(--fv-vert); }
.races-hub button.chip:hover { border-color: var(--fv-vert); }
.races-hub button.chip:focus-visible { outline: 3px solid var(--fv-vert); outline-offset: 2px; }
.races-hub button.chip[aria-pressed="true"] { background: var(--fv-vert); border-color: var(--fv-vert); color: #FFF9F0; }
@media (prefers-color-scheme: dark) { .races-hub button.chip[aria-pressed="true"] { color: #1B1814; } }
.chip__n { font-size: var(--t-caption); font-weight: 600; opacity: .7; }
.filtres__reset, .race-vide__reset {
  align-self: flex-start; min-height: var(--cible); padding: 0; border: 0; background: none; cursor: pointer;
  font: inherit; font-size: var(--t-small); font-weight: 700; color: var(--fv-terre); text-decoration: underline; text-underline-offset: 3px;
}
.filtres__reset[hidden] { display: none; }
.race-vide { margin: 0; padding: 18px 20px; border-radius: 20px; background: var(--fv-carte); font-weight: 600; }
.race-vide[hidden] { display: none; }

/* ---------- Hub des guides (guides.html, 20/10/2026) ---------- */
/* Une : trois planches en éventail, façon cartes postales */
.hub-affiches--planches { width: min(100%, 600px); }
.hub-planche { display: block; padding: 8px 8px 22px; border-radius: 10px; background: #FFF9F0; box-shadow: 0 4px 10px rgba(107, 74, 46, .14), 0 18px 40px rgba(107, 74, 46, .20); }
.hub-planche img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 6px; background: var(--fv-papier); }
/* Encarts : cartes pastel avec pastille et titre manuscrit */
.guides-note { display: flex; flex-direction: column; gap: var(--s-2); padding: 22px 22px 24px; border-radius: 24px; box-shadow: var(--fv-ombre); }
@media (min-width: 900px) { .guides-note { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 7fr); column-gap: var(--s-6); align-items: center; padding: 26px 32px; } }
.guides-note--sauge { background: var(--fv-sauge); }
.guides-note--peche { background: var(--fv-peche); }
.guides-note p { margin: 0; }
.guides-note__titre { display: flex; align-items: center; gap: 12px; font-size: clamp(1.6rem, 3.6vw, 2rem); line-height: 1.05; color: var(--fv-vert); }
.guides-note--peche .guides-note__titre { color: var(--fv-terre); }
.guides-note a { color: var(--fv-vert-fonce); font-weight: 600; }
.guides-hub .hub__status { color: var(--fv-brun); font-weight: 600; }
.guides-hub .hub__filters { display: flex; flex-wrap: wrap; gap: 8px; }
/* Cartes d'animal */
.guides-grille { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); }
.guide-tuile { display: flex; flex-direction: column; overflow: hidden; border-radius: 22px; background: var(--fv-carte); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.guide-tuile__corps { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 14px 18px 20px; }
.guide-tuile__famille { align-self: flex-start; padding: 2px 10px; border-radius: var(--rayon-pill); font-size: var(--t-caption); font-weight: 700; color: var(--fv-brun); background: var(--fv-sable); }
.guide-tuile__famille--peche { background: var(--fv-peche); color: var(--fv-terre); }
.guide-tuile__famille--sauge { background: var(--fv-sauge); color: var(--fv-vert); }
.guide-tuile h2 { margin: 0; font-family: var(--fv-titre); font-weight: 800; font-size: 1.6rem; line-height: 1.1; color: var(--fv-vert); letter-spacing: 0; }
.guide-tuile p { margin: 0; font-size: var(--t-small); line-height: var(--lh-small); color: var(--texte-2); }
.guide-tuile .espece__img--emoji { font-size: 5.5rem; line-height: 1; }
.guide-parcours { list-style: none; margin: auto 0 0; padding: 10px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 12px; border-top: 1px dashed rgba(107, 74, 46, .28); }
.guide-parcours a {
  display: flex; align-items: center; gap: 8px; min-height: 32px; padding: 2px 0;
  color: var(--fv-vert); font-size: var(--t-small); line-height: 1.25; font-weight: 600; text-decoration: none;
}
.guide-parcours a::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--fv-terre); }
.guide-parcours a:hover { text-decoration: underline; text-underline-offset: 3px; }
.guide-parcours a:focus-visible { outline: 3px solid var(--fv-vert); outline-offset: 2px; border-radius: 4px; }

/* ---------- Pages guide (guides/<animal>/<parcours>.html, 20/10/2026) ----------
   Même univers que les fiches races : titres Baloo vert sapin, accroche et sur-titres
   manuscrits terracotta, sections en grandes cartes crème, encadrés pastel. */
.guide--fiche .page-header .eyebrow { color: var(--fv-brun); }
/* En-tête sur une colonne (titre, accroche, chapô), comme le haut de l'affiche. */
main.page.guide--fiche .intro.lecture > .page-header:has(> .lead) { display: flex; flex-direction: column; gap: var(--s-3); }
.guide--fiche .page-header h1 { font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em; color: var(--fv-vert); font-size: clamp(2.2rem, 6vw, 3.4rem); line-height: 1.05; }
.guide-accroche { margin: -6px 0 0; font-size: clamp(1.6rem, 4vw, 2.1rem); line-height: 1.1; color: var(--fv-terre); }
.guide-planche { margin: 0; max-width: 640px; }
.guide-planche img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 896; border-radius: 24px; background: radial-gradient(ellipse at center, #FBF3E6 0%, var(--fv-fond) 75%); }
@media (prefers-color-scheme: dark) { .guide-planche img { background: #F4EFE6; } }
/* Encadrés */
.guide--fiche .callout { border: 0; border-radius: 22px; padding: 18px 22px 20px; box-shadow: var(--fv-ombre); }
.guide--fiche .callout--warn { background: var(--fv-peche); }
.guide--fiche .callout--info { background: var(--fv-sauge); }
.guide--fiche .callout__label { font-family: var(--fv-main); font-weight: 700; font-size: 1.6rem; line-height: 1.1; letter-spacing: 0; text-transform: none; color: var(--fv-terre); }
.guide--fiche .callout--info .callout__label { color: var(--fv-vert); }
.guide--fiche .tip { border-radius: 22px; background: var(--fv-vert-fonce); }
@media (prefers-color-scheme: dark) { .guide--fiche .tip { background: #123B35; } }
.guide--fiche .tip .callout__label { font-family: var(--fv-main); font-weight: 700; font-size: 1.6rem; letter-spacing: 0; text-transform: none; color: #E9A13B; }
/* Sommaire */
.guide--fiche .toc { border: 0; border-radius: 22px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.guide--fiche .toc__title { margin: 0; }
.guide--fiche .toc__title { font-family: var(--fv-main); font-weight: 700; font-size: 1.6rem; letter-spacing: 0; text-transform: none; color: var(--fv-vert); }
.guide--fiche .toc li { border-bottom-style: dashed; border-bottom-color: rgba(107, 74, 46, .22); }
.guide--fiche .toc a { color: var(--fv-vert); }
.guide--fiche .toc__n {
  display: inline-grid; place-items: center; flex: none; width: 28px; height: 28px; min-width: 0; border-radius: 50%;
  background: var(--fv-sable); color: var(--fv-brun); font-size: var(--t-caption); font-weight: 700;
}
/* Sections : grandes cartes */
.guide--fiche .article > .prose { background: var(--fv-carte); border-radius: 28px; padding: 26px 22px 30px; box-shadow: var(--fv-ombre); }
@media (min-width: 768px) { .guide--fiche .article > .prose { padding: 34px 40px 38px; } }
.guide--fiche .prose > .eyebrow { font-family: var(--fv-main); font-weight: 700; font-size: 1.55rem; line-height: 1.1; letter-spacing: 0; text-transform: none; color: var(--fv-terre); }
.guide--fiche .prose h2 { font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em; color: var(--fv-vert); line-height: 1.1; margin-top: -6px; }
.guide--fiche .prose li::marker { color: var(--fv-point, #C2552B); }
.guide--fiche .schedule li, .guide--fiche .schedule li:first-child { border-color: rgba(107, 74, 46, .22); border-style: dashed; border-width: 0 0 1px; }
.guide--fiche .schedule strong { color: var(--fv-terre); }
.guide--fiche .faq { border-top: 0; }
.guide--fiche .faq details { border-bottom: 1px dashed rgba(107, 74, 46, .28); }
.guide--fiche .faq summary::after { color: var(--fv-terre); }
/* Blocs de fin */
.guide--fiche .section-head h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert); }
.guide--fiche .section-head .eyebrow { color: var(--fv-brun); }
.guide--fiche .cards .card { border: 0; border-radius: 22px; background: var(--fv-sable); box-shadow: var(--fv-ombre); }
.guide--fiche .cards .card:nth-child(3n+2) { background: var(--fv-peche); }
.guide--fiche .cards .card:nth-child(3n) { background: var(--fv-sauge); }
.guide--fiche .cards .card h3 { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.guide--fiche .cards .card .eyebrow { color: var(--fv-brun); }
.guide--fiche .product.card .btn { background: #FFF9F0; }
.guide--fiche .more-links__title { color: var(--fv-brun); }
.guide--fiche .chips .chip { background: var(--fv-carte); border-color: transparent; color: var(--fv-vert); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.guide--fiche .chips .chip[aria-current="page"] { background: var(--fv-vert); color: #FFF9F0; }
@media (prefers-color-scheme: dark) { .guide--fiche .chips .chip[aria-current="page"] { color: #1B1814; } }
.guide--fiche .sources { border-top: 1px dashed rgba(107, 74, 46, .3); }
.guide--fiche .sources h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: 2rem; color: var(--fv-vert); }

/* Pages Boutique (même thème que les guides, 20/10/2026) */
.boutique--fiche .deflist dt { color: var(--fv-brun); }
.boutique--fiche .deflist { border: 0; background: none; }
.boutique--fiche .deflist > div { border: 0; border-bottom: 1px dashed rgba(107, 74, 46, .25); padding-left: 0; padding-right: 0; background: none; }
.boutique--fiche .deflist > div:last-child { border-bottom: 0; }
.boutique--fiche .compare__row h3 { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.boutique--fiche .products__more { color: var(--fv-vert); }
.boutique--fiche .link-list a { color: var(--fv-vert); }
.boutique--fiche .link-list a::after { color: var(--fv-terre); }
.boutique--fiche .section-head + .products__disclosure, .boutique--fiche .section-head .products__disclosure { color: var(--texte-2); }

/* ---------- Accueil Boutique (boutique.html, 20/10/2026) ---------- */
.boutique-hub .shop-static-entry > div:first-child .eyebrow { color: var(--fv-brun); }
.boutique-hub .shop-static-entry h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert); }
.boutique-hub .shop-static-entry > div:first-child p { color: var(--texte-2); }
.boutique-groupe { margin: var(--s-2) 0 0; font-size: 1.6rem; line-height: 1.1; color: var(--fv-terre); }
.boutique-besoins { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
.boutique-besoins a {
  display: flex; flex-direction: column; gap: 2px; height: 100%; padding: 12px 16px; border-radius: 18px;
  background: var(--fv-carte); color: var(--texte); text-decoration: none; box-shadow: 0 1px 2px rgba(107, 74, 46, .10);
  transition: translate .25s ease, box-shadow .25s ease;
}
.boutique-besoins strong { font-family: var(--fv-titre); font-weight: 800; font-size: 1.15rem; line-height: 1.2; color: var(--fv-vert); }
.boutique-besoins small { font-size: var(--t-caption); color: var(--texte-2); }
@media (hover: hover) { .boutique-besoins a:hover { translate: 0 -3px; box-shadow: var(--fv-ombre); } }
.boutique-besoins a:focus-visible { outline: 3px solid var(--fv-vert); outline-offset: 3px; }
/* Boutique interactive (grille et sélection construites par js/app.js) */
.boutique-hub .shop-home > .section-head h2, .boutique-hub #conseils .section-head h2, .boutique-hub #faq .section-head h2,
.boutique-hub .shop-header h2 {
  font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert);
}
.boutique-hub .section-head .eyebrow, .boutique-hub .shop-header .eyebrow { color: var(--fv-brun); }
.boutique-hub .search-row { border-radius: var(--rayon-pill); border-color: transparent; background: var(--fv-carte); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.boutique-hub .search-panel label { color: var(--fv-brun); }
.boutique-hub .animal-card { border: 0; border-radius: 20px; background: var(--fv-carte); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.boutique-hub .animal-card strong { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); font-size: 1.05rem; }
.boutique-hub .animal-card[aria-pressed="true"], .boutique-hub .animal-card.active { background: var(--fv-vert); }
.boutique-hub .tip-card { border: 0; border-radius: 22px; background: var(--fv-sable); box-shadow: var(--fv-ombre); }
.boutique-hub .tip-card:nth-child(3n+2) { background: var(--fv-peche); }
.boutique-hub .tip-card:nth-child(3n) { background: var(--fv-sauge); }
.boutique-hub .tip-card h3 { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.boutique-hub .tip-icon { background: #FFF9F0; color: var(--fv-terre); border-radius: 50%; }
.boutique-hub #faq .faq { border-top: 0; border-radius: 24px; padding: 6px 24px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.boutique-hub #faq .faq details { border-bottom: 1px dashed rgba(107, 74, 46, .28); }
.boutique-hub #faq .faq details:last-child { border-bottom: 0; }
.boutique-hub #faq .faq summary::after { color: var(--fv-terre); }
.boutique-hub .affiliate-inline, .boutique-hub .affiliate-notice { color: var(--texte-2); }

/* ---------- Filmothèque (filmotheque.html, 20/10/2026) ---------- */
.hub-affiches--films a { display: block; border-radius: 10px; }
.hub-affiches--films img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 10px; background: var(--fv-papier);
  box-shadow: 0 4px 10px rgba(107, 74, 46, .14), 0 18px 40px rgba(107, 74, 46, .20); transition: translate .25s ease; }
@media (hover: hover) { .hub-affiches--films a:hover img { translate: 0 -10px; } }
.hub-affiches--films a:focus-visible { outline: 3px solid var(--fv-vert); outline-offset: 4px; }
.film-hub .film-selections .chip { background: var(--fv-carte); border-color: transparent; color: var(--fv-vert); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.film-hub .film-selections .chip:hover { background: var(--fv-vert); color: #FFF9F0; }
.film-hub .film-selections .chip:hover .chip__n { color: inherit; }
.film-hub .film-week { border-radius: 28px; background: var(--fv-vert-fonce); box-shadow: var(--fv-ombre); }
@media (prefers-color-scheme: dark) { .film-hub .film-week { background: #123B35; } }
.film-hub .film-week .eyebrow { font-family: var(--fv-main); font-weight: 700; font-size: 1.5rem; letter-spacing: 0; text-transform: none; color: #E9A13B; }
.film-hub .film-week h2 { font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em; }
.film-hub .film-section .section-head h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert); }
.film-hub .film-section .section-head .eyebrow { color: var(--fv-brun); }
.film-hub .film-more summary { color: var(--fv-vert); }
.film-hub .film-more select { border-radius: 14px; background: var(--fv-carte); border-color: transparent; }
.film-hub .film-grid .poster { padding: 8px 8px 12px; border-radius: 18px; background: var(--fv-carte); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); transition: translate .25s ease, box-shadow .25s ease; }
@media (hover: hover) { .film-hub .film-grid .poster:hover { translate: 0 -4px; box-shadow: var(--fv-ombre); } }
.film-hub .film-grid .poster__img { border: 0; border-radius: 12px; }
.film-hub .film-grid .poster__title { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); padding: 0 4px; }
.film-hub .film-grid .poster__title a { color: var(--fv-vert); }
.film-hub .film-grid .poster__meta { padding: 0 4px; }
.film-hub .film-grid .poster__title a::after { border-radius: 18px; }
.film-hub .film-reset { color: var(--fv-terre); }
.film-hub .channels { border-top-style: dashed; }
.film-hub .channels li { border-bottom-style: dashed; }
.film-hub > .film-section:not(.famille) .section-head h2 { color: var(--fv-vert); }

/* ---------- Fiches films et sélections (films/…, 20/10/2026) ---------- */
.film-page .page-header .eyebrow { color: var(--fv-brun); }
.film-page h1 { font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em; color: var(--fv-vert); font-size: clamp(2.2rem, 6vw, 3.4rem); line-height: 1.05; }
.film-page .film-hero { padding: 22px; border-radius: 28px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
@media (min-width: 768px) { .film-page .film-hero { padding: 32px; } }
.film-page .film-hero__img { border: 0; border-radius: 16px; box-shadow: 0 4px 10px rgba(107, 74, 46, .14), 0 18px 40px rgba(107, 74, 46, .20); rotate: -2deg; }
.film-page .chip--tag { background: var(--fv-sauge); border-color: transparent; color: var(--fv-vert); }
.film-page .callout { border: 0; border-radius: 22px; padding: 18px 22px 20px; box-shadow: var(--fv-ombre); }
.film-page .callout--info { background: var(--fv-sauge); }
.film-page .callout__label { font-family: var(--fv-main); font-weight: 700; font-size: 1.6rem; line-height: 1.1; letter-spacing: 0; text-transform: none; color: var(--fv-vert); }
.film-page .callout__title { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.film-page .film-selections__title { color: var(--fv-brun); }
.film-page .film-in-selections .chip { background: var(--fv-carte); border-color: transparent; color: var(--fv-vert); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.film-page .section-head h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert); }
.film-page .section-head .eyebrow { color: var(--fv-brun); }
.film-page .link-list { padding: 6px 22px !important; border-radius: 22px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.film-page .link-list li + li { border-top: 1px dashed rgba(107, 74, 46, .25); }
.film-page .link-list a { color: var(--fv-vert); }
.film-page .link-list a::after { color: var(--fv-terre); }
.film-page .film-grid .poster { padding: 8px 8px 12px; border-radius: 18px; background: var(--fv-carte); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.film-page .film-grid .poster__img { border: 0; border-radius: 12px; }
.film-page .film-grid .poster__title, .film-page .film-grid .poster__title a { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.film-page .film-grid .poster__title, .film-page .film-grid .poster__meta { padding: 0 4px; }
.film-page .film-grid .poster__title a::after { border-radius: 18px; }
main.page.film-selection-page .intro.lecture > .page-header:has(> .lead) { display: flex; flex-direction: column; gap: var(--s-3); }
main.page.film-selection-page .intro.lecture:has(> .page-header > .lead) { max-width: var(--w-lecture); }
/* Sélections : chaque film dans une carte crème */
.film-page .film-rows { border-top: 0; display: flex; flex-direction: column; gap: 14px; }
.film-page .film-row { padding: 16px; border: 0; border-radius: 22px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
@media (min-width: 768px) { .film-page .film-row { grid-template-columns: 110px minmax(0, 1fr); padding: 20px 24px; } }
.film-page .film-row__img { border: 0; border-radius: 12px; }
.film-page .film-row h2 a { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.film-page .film-row__actions a { color: var(--fv-vert); }
.film-page .faq { border-top: 0; padding: 6px 24px; border-radius: 24px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.film-page .faq details { border-bottom: 1px dashed rgba(107, 74, 46, .28); }
.film-page .faq details:last-child { border-bottom: 0; }
.film-page .faq summary::after { color: var(--fv-terre); }

/* ---------- Fiches « soins essentiels » (fr/…, 20/10/2026) ---------- */
.pilier--fiche .article > .split { padding: 26px 22px 30px; border-radius: 28px; background: var(--fv-carte); box-shadow: var(--fv-ombre); scroll-margin-top: 80px; }
@media (min-width: 900px) { .pilier--fiche .article > .split { padding: 34px 40px 38px; } }
/* Dans la carte, titre au-dessus du texte (la colonne de titre rendait le calendrier illisible). */
.pilier--fiche .article > .split { display: flex; flex-direction: column; gap: var(--s-4); }
.pilier--fiche .article > .split > .split__body { max-width: none; }
.pilier--fiche .split .section-head h2 { font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em; font-size: clamp(1.6rem, 3.4vw, 2rem); line-height: 1.12; }
.pilier--fiche .split .section-head .eyebrow { font-family: var(--fv-main); font-weight: 700; font-size: 1.5rem; letter-spacing: 0; text-transform: none; color: var(--fv-terre); }
.pilier--fiche .split .faq { border-top: 0; }
.pilier--fiche .deflist { border: 0; background: none; }
.pilier--fiche .deflist > div { border: 0; border-bottom: 1px dashed rgba(107, 74, 46, .25); padding-left: 0; padding-right: 0; background: none; }
.pilier--fiche .deflist > div:last-child { border-bottom: 0; }
.pilier--fiche .deflist dt { color: var(--fv-brun); }
.pilier--fiche .callout ul li::marker { color: var(--fv-point, #C2552B); }
.pilier--fiche .link-list { padding: 6px 22px !important; border-radius: 22px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.pilier--fiche .link-list li + li { border-top: 1px dashed rgba(107, 74, 46, .25); }
.pilier--fiche .link-list a { color: var(--fv-vert); }
.pilier--fiche .link-list a::after { color: var(--fv-terre); }
.pilier--fiche .more-links a { color: var(--fv-vert); font-weight: 700; }
.pilier--fiche > section:not(.app-block) > .section-head h2 { color: var(--fv-vert); }

/* ---------- Pages illustrées sans générateur dédié (tools/apply_illustre.py, 20/10/2026) ----------
   Calculateurs, outils, annuaires, podcasts, pages de l'app : même univers que les guides. */
.illustre .page-header .eyebrow { color: var(--fv-brun); }
.illustre .page-header h1 { font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em; color: var(--fv-vert); line-height: 1.05; }
.illustre .section-head h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert); }
.illustre .section-head .eyebrow { color: var(--fv-brun); }
.illustre .prose > .eyebrow:first-child + h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert); }
.illustre .prose > .eyebrow:first-child { color: var(--fv-brun); }
.illustre .callout { border: 0; border-radius: 22px; padding: 18px 22px 20px; box-shadow: var(--fv-ombre); }
.illustre .callout--info { background: var(--fv-sauge); }
.illustre .callout--warn { background: var(--fv-peche); }
.illustre .callout__label { font-family: var(--fv-main); font-weight: 700; font-size: 1.6rem; line-height: 1.1; letter-spacing: 0; text-transform: none; color: var(--fv-vert); }
.illustre .callout--warn .callout__label { color: var(--fv-terre); }
.illustre .cards .card { border: 0; border-radius: 22px; background: var(--fv-sable); box-shadow: var(--fv-ombre); }
.illustre .cards .card:nth-child(3n+2) { background: var(--fv-peche); }
.illustre .cards .card:nth-child(3n) { background: var(--fv-sauge); }
.illustre .cards .card h3 { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.illustre .cards .card .eyebrow { color: var(--fv-brun); }
.illustre .faq { border-top: 0; padding: 6px 24px; border-radius: 24px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.illustre .faq details { border-bottom: 1px dashed rgba(107, 74, 46, .28); }
.illustre .faq details:last-child { border-bottom: 0; }
.illustre .faq summary::after { color: var(--fv-terre); }
.illustre .link-list { padding: 6px 22px !important; border-radius: 22px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.illustre .link-list li + li { border-top: 1px dashed rgba(107, 74, 46, .25); }
.illustre .link-list a { color: var(--fv-vert); }
.illustre .link-list a::after { color: var(--fv-terre); }
.illustre .chips .chip { background: var(--fv-carte); border-color: transparent; color: var(--fv-vert); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.illustre .chips .chip[aria-current="page"] { background: var(--fv-vert); color: #FFF9F0; }
.illustre .toc { border: 0; border-radius: 22px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
.illustre .toc__title { margin: 0; font-family: var(--fv-main); font-weight: 700; font-size: 1.6rem; letter-spacing: 0; text-transform: none; color: var(--fv-vert); }
.illustre .toc li { border-bottom-style: dashed; border-bottom-color: rgba(107, 74, 46, .22); }
.illustre .toc a { color: var(--fv-vert); }
.illustre .toc__n { display: inline-grid; place-items: center; flex: none; width: 28px; height: 28px; min-width: 0; border-radius: 50%; background: var(--fv-sable); color: var(--fv-brun); font-size: var(--t-caption); font-weight: 700; }
.illustre .note, .illustre .meta { color: var(--texte-2); }
/* En-tête : accroche juste sous le titre (une seule colonne, comme les guides). */
main.page.illustre .intro.lecture > .page-header:has(> .lead) { display: flex; flex-direction: column; gap: var(--s-3); }
main.page.illustre .intro.lecture:has(> .page-header > .lead) { max-width: var(--w-lecture); }
.illustre .page-header h1 { font-size: clamp(2.2rem, 6vw, 3.4rem); }
/* Titres de section propres à chaque page (outils, annuaires, calculateurs, podcasts, app) */
.illustre .tool-heading h2, .illustre .tool-section h2, .illustre .directory-section h2, .illustre .directory-professional-callout h2 {
  font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; font-size: clamp(1.9rem, 4vw, 2.4rem); line-height: 1.05; color: var(--fv-vert);
}
.illustre .directory-professional-callout h2 { color: #FFF9F0; }
.illustre .tool-heading .eyebrow, .illustre .directory-section .eyebrow, .illustre .tool-section .eyebrow { color: var(--fv-brun); }
.illustre .tool-section--soft, .illustre .directory-section--soft { border-radius: 28px; background: var(--fv-sable); }
.illustre .directory-professional-callout { border-radius: 28px; background: var(--fv-vert-fonce); }
.illustre .calc-hub .card h2, .illustre .tool-jump strong, .illustre .directory-jump strong { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.illustre .tool-jump a, .illustre .directory-jump a { border-radius: 20px; }
.illustre .tool-jump .is-featured strong, .illustre .tool-jump [aria-current] strong { color: #FFF9F0; }
.illustre .tool-jump .is-featured { background: var(--fv-vert-fonce); }
.illustre .pod__name, .illustre .pod__name a { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.illustre .pod { border-radius: 22px; background: var(--fv-carte); box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.illustre .pod-theme { border-radius: 22px; }
.illustre .pod-theme h3, .illustre .card.moment h3 { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.illustre .pod-audible { border-radius: 28px; }
.illustre .price-card { border: 0; border-radius: 24px; box-shadow: var(--fv-ombre); }
.illustre .price-card h3, .illustre .price-card strong { color: var(--fv-vert); }
.illustre .app-block { border-radius: 28px; background: var(--fv-vert-fonce); }
@media (prefers-color-scheme: dark) { .illustre .app-block, .illustre .directory-professional-callout { background: #123B35; } }

/* ---------- Accueil (index.html, 21/10/2026) : bandeau d'ouverture crème, comme le haut de l'affiche ---------- */
.illustre--accueil .hero-band { background: none; color: var(--texte); }
.illustre--accueil .hero-band h1 { font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em; color: var(--fv-vert); font-size: clamp(2.6rem, 7vw, 4.4rem); line-height: 1.02; }
.illustre--accueil .hero-band h1 em { display: block; margin-top: 6px; font-family: var(--fv-main); font-weight: 700; font-style: normal; letter-spacing: 0; color: var(--fv-terre); font-size: .78em; }
.illustre--accueil .hero-band .eyebrow { color: var(--fv-brun); }
.illustre--accueil .hero-band .lead, .illustre--accueil .hero-band__note { color: var(--texte); }
.illustre--accueil .hero-band__link { color: var(--fv-vert); }
.illustre--accueil .hero-band__link:hover { color: var(--fv-vert-fonce); }
.illustre--accueil .hero-band a:focus-visible { outline-color: var(--fv-vert); }
.illustre--accueil .proofs li::before { color: var(--fv-terre); }
.illustre--accueil .hero-band__visual .phone { rotate: 3deg; filter: drop-shadow(0 18px 30px rgba(107, 74, 46, .25)); }
.illustre--accueil .split--carte { border: 0; border-radius: 28px; background: var(--fv-sauge); box-shadow: var(--fv-ombre); }
.illustre--accueil .card.moment { border: 0; }
.illustre--accueil .more-links__title { color: var(--fv-brun); }

/* ---------- Pages juridiques (confidentialité, 21/10/2026) : une carte crème par article ---------- */
.illustre--legal .legal { gap: 16px; }
.illustre--legal .legal > .prose { padding: 24px 22px 26px; border-radius: 24px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
@media (min-width: 768px) { .illustre--legal .legal > .prose { padding: 30px 36px 32px; } }
.illustre--legal .legal h2 { font-family: var(--fv-titre); font-weight: 800; letter-spacing: -0.01em; font-size: clamp(1.4rem, 3vw, 1.75rem); line-height: 1.15; color: var(--fv-vert); }
.illustre--legal .legal h3 { font-family: var(--fv-titre); font-weight: 800; color: var(--fv-vert); }
.illustre--legal .legal li::marker { color: var(--fv-point, #C2552B); }
.illustre--legal .legal table { border-collapse: collapse; }
.illustre--legal .legal th, .illustre--legal .legal td { border-color: rgba(107, 74, 46, .22); }

/* Encart « Soins essentiels » de guides.html (21/10/2026) : liens regroupés par animal, en pastilles. */
@media (min-width: 900px) { .guides-note.soins-note { grid-template-columns: minmax(0, 3fr) minmax(0, 7fr); align-items: start; } }
.soins-note__tete { display: flex; flex-direction: column; gap: 10px; }
.soins-note__tete p { margin: 0; }
.soins-note__tout { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; min-height: var(--cible); padding: 0 16px; border-radius: var(--rayon-pill);
  background: var(--fv-vert); color: #FFF9F0 !important; font-weight: 700; font-size: var(--t-small); text-decoration: none; }
.soins-note__tout:hover { background: var(--fv-vert-fonce); }
@media (prefers-color-scheme: dark) { .soins-note__tout { color: #1B1814 !important; } }
.soins-note__corps { display: flex; flex-direction: column; gap: 14px; }
.soins-groupe { display: grid; gap: 8px; }
@media (min-width: 600px) { .soins-groupe { grid-template-columns: 8rem minmax(0, 1fr); align-items: start; } }
.soins-groupe__titre { margin: 0; padding-top: 8px; font-family: var(--fv-titre); font-weight: 800; font-size: 1.15rem; color: var(--fv-vert); }
.soins-groupe__liste { gap: 8px; }
.soins-groupe__liste .chip { min-height: 38px; background: var(--fv-carte); border-color: transparent; color: var(--fv-vert); font-weight: 600; text-decoration: none; box-shadow: 0 1px 2px rgba(107, 74, 46, .10); }
.soins-groupe__liste .chip:hover { background: var(--fv-vert); color: #FFF9F0; }
@media (prefers-color-scheme: dark) { .soins-groupe__liste .chip:hover { color: #1B1814; } }
.soins-groupe__liste .chip:focus-visible { outline: 3px solid var(--fv-vert); outline-offset: 2px; }

/* ---------- Parti pris : carte crème façon « Le savais-tu ? » ---------- */
.races-hub .hub-note { border: 0; border-radius: 28px; padding: 26px 22px 28px; background: var(--fv-carte); box-shadow: var(--fv-ombre); }
@media (min-width: 768px) { .races-hub .hub-note { padding: 34px 40px 36px; } }
.races-hub .hub-note h2 { font-family: var(--fv-main); font-weight: 700; letter-spacing: 0; margin-bottom: var(--s-3); }
@media (min-width: 900px) { .races-hub .hub-note h2 { grid-row: 1 / span 3; align-items: flex-start; flex-direction: column; } }

/* ---------- Bandeau app : la bande vert sapin du bas de l'affiche ---------- */
.races-hub .app-block { background: var(--fv-vert-fonce); border-radius: 28px; }
@media (prefers-color-scheme: dark) { .races-hub .app-block { background: #123B35; } }

@media (prefers-reduced-motion: reduce) {
  .races-hub * { transition: none !important; }
}
@media print {
  body:has(.races-hub) { background: #fff; }
  .famille, .hub-chiffres > div, .races-hub .hub-note { box-shadow: none; }
}