/* ==========================================================================
   Surligné · feuille de style du thème WordPress
   Les jetons viennent de theme.json ; cette feuille habille les blocs natifs
   et les styles de blocs (is-style-…) utilisés par les compositions.
   ========================================================================== */

/* 1. Jetons du guide, reliés aux presets WordPress ------------------------ */
:root, .editor-styles-wrapper {
  --nuit: var(--wp--preset--color--nuit, #0B1F2E);
  --voile: var(--wp--preset--color--voile, #071521);
  --enseigne: var(--wp--preset--color--enseigne, #0B3A5E);
  --creme: var(--wp--preset--color--creme, #FFFDF8);
  --sable: var(--wp--preset--color--sable, #F3EFE8);
  --trait: var(--wp--preset--color--trait, #E6DFD3);
  --gris: var(--wp--preset--color--gris, #5E6B75);
  --gris-sur-nuit: var(--wp--preset--color--gris-sur-nuit, #C9D2D9);
  --saumon: var(--wp--preset--color--saumon, #F08E80);
  --saumon-survol: var(--wp--preset--color--saumon-survol, #E97A6B);
  --brique: var(--wp--preset--color--brique, #A9473A);
  --ligne-nuit: rgba(255, 253, 248, 0.16);
  --police: var(--wp--preset--font-family--bricolage, 'Bricolage Grotesque', 'Arial Narrow', system-ui, sans-serif);
  --etiquette: 0.8125rem;
  --petit: 0.9375rem;
  --texte: 1.125rem;
  --lecture: 62ch;
  --largeur: 1200px;
  --gouttiere: var(--wp--preset--spacing--gouttiere, clamp(1.25rem, 0.8rem + 2.5vw, 4rem));
  --ease: cubic-bezier(0.2, 0.8, 0.3, 1);
}

/* 2. Base ------------------------------------------------------------------ */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { font-optical-sizing: auto; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body.locked { overflow: hidden; }
h1, h2, h3, h4 { text-wrap: balance; }
p { text-wrap: pretty; }
img { max-width: 100%; height: auto; }
a { text-underline-offset: 0.18em; }
:where(a, button, summary, input, textarea, select):focus-visible { outline: 3px solid var(--nuit); outline-offset: 3px; }

/* Contextes sombres : les jetons secondaires basculent d'eux-mêmes */
.has-nuit-background-color, .wp-block-cover.is-style-hero {
  --gris: var(--gris-sur-nuit);
  --trait: var(--ligne-nuit);
  color: var(--creme);
}
.has-nuit-background-color :where(a, button, summary):focus-visible,
.wp-block-cover.is-style-hero :where(a, button):focus-visible { outline-color: var(--creme); }
.has-nuit-background-color a:not(.wp-block-button__link), .wp-block-cover.is-style-hero a:not(.wp-block-button__link) { color: var(--creme); }

/* 3. Signature : le surlignage et l'étiquette ------------------------------ */
mark, .surligne {
  background: var(--saumon);
  color: var(--nuit);
  padding: 0 0.16em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
mark.has-inline-color { color: var(--nuit); }

p.is-style-etiquette, .is-style-etiquette {
  display: inline-flex;
  align-items: center;
  gap: 0.6em;
  font-size: var(--etiquette);
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  line-height: 1.3;
  margin: 0;
}
.is-style-etiquette::before { content: ""; width: 0.75em; height: 0.75em; background: var(--saumon); flex: none; }
.has-saumon-background-color .is-style-etiquette::before { background: var(--nuit); }

/* 4. Styles de paragraphe -------------------------------------------------- */
p.is-style-repere { font-size: var(--etiquette); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--gris); }
p.is-style-chapo { font-size: var(--wp--preset--font-size--chapo, 1.1875rem); color: var(--gris); max-width: var(--lecture); }
p.is-style-mention { font-size: var(--petit); color: var(--gris); line-height: 1.5; }
p.is-style-sous-titre { font-size: clamp(1.375rem, 1.1rem + 1.4vw, 2rem); font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; max-width: 22ch; text-wrap: balance; }
p.is-style-chiffre { font-weight: 800; font-size: clamp(2.5rem, 1.5rem + 3.6vw, 4.5rem); letter-spacing: -0.04em; line-height: 0.92; white-space: nowrap; }
p.is-style-chiffre em { font-style: normal; font-size: 0.4em; font-weight: 600; letter-spacing: 0; color: var(--gris); }
p.is-style-numero { display: grid; place-items: center; width: 3rem; height: 3rem; background: var(--saumon); color: var(--nuit); font-weight: 800; font-size: 1.25rem; letter-spacing: -0.02em; line-height: 1; }
p.is-style-geant { font-weight: 800; font-size: clamp(3rem, 2rem + 4vw, 5rem); letter-spacing: -0.05em; line-height: 0.85; white-space: nowrap; }
.has-nuit-background-color p.is-style-geant { color: var(--saumon); }
h1.is-style-geant, h2.is-style-geant { font-size: var(--wp--preset--font-size--geant, clamp(3rem, 2rem + 5vw, 5.5rem)); letter-spacing: -0.04em; line-height: 0.95; }
p.is-style-montant { font-weight: 800; font-size: clamp(3rem, 1.5rem + 3.4vw, 5rem); letter-spacing: -0.04em; line-height: 1; text-wrap: balance; }
p.is-style-montant em { font-style: normal; font-size: 0.28em; font-weight: 600; letter-spacing: 0; color: var(--gris); margin-left: 0.35em; white-space: nowrap; }
p.is-style-encart { padding: 0.25rem 0 0.25rem 1.25rem; border-left: 4px solid var(--saumon); font-size: 1rem; color: var(--gris); max-width: 52em; }

/* 5. Boutons --------------------------------------------------------------- */
.wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; gap: 0.5em; min-height: 3.25rem; text-decoration: none; border-radius: 0; transition: background-color 0.15s, color 0.15s; }
.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: currentColor; border: 2px solid currentColor; padding: 0.9rem 1.6rem; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--nuit); color: var(--creme); border-color: var(--nuit); }
.has-nuit-background-color .wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-cover.is-style-hero .wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--creme); color: var(--nuit); border-color: var(--creme); }
.wp-block-button.is-style-nuit .wp-block-button__link { background: var(--nuit); color: var(--creme); }
.wp-block-button.is-style-nuit .wp-block-button__link:hover { background: var(--enseigne); color: var(--creme); }
.wp-block-buttons.surligne-actions-pleines .wp-block-button, .wp-block-buttons.surligne-actions-pleines .wp-block-button__link { width: 100%; }

/* 6. Hero photo (bloc Bannière, style « Hero Surligné ») ------------------ */
.wp-block-cover.is-style-hero { min-height: min(88svh, 860px); padding: 0; align-items: flex-end; justify-content: flex-start; }
.wp-block-cover.is-style-hero .wp-block-cover__background,
.wp-block-cover.is-style-hero .wp-block-cover__gradient-background { background: linear-gradient(0deg, rgba(7, 21, 33, 0.88) 0%, rgba(7, 21, 33, 0.42) 55%, rgba(7, 21, 33, 0) 100%) !important; opacity: 1 !important; }
/* Le contenu du hero se cale sur la colonne de 1200 px des autres sections, quelle que soit la largeur d'écran */
.wp-block-cover.is-style-hero .wp-block-cover__inner-container,
.wp-block-cover.is-style-hero.has-custom-content-position.has-custom-content-position .wp-block-cover__inner-container {
  box-sizing: border-box; width: 100%; max-width: calc(var(--largeur) + 2 * var(--gouttiere)); margin: 0 auto;
  padding: var(--gouttiere); padding-bottom: clamp(2.5rem, 2rem + 4vw, 5rem);
  display: flex; flex-direction: column; align-items: flex-start; gap: 1.25rem;
}
.wp-block-cover.is-style-hero .wp-block-cover__inner-container > * { margin: 0; max-width: none; }
.wp-block-cover.is-style-hero h1 { max-width: 15ch; color: var(--creme); }
.wp-block-cover.is-style-hero p.is-style-sous-titre { color: var(--creme); }
.wp-block-cover.is-style-hero p.is-style-chapo { color: rgba(255, 253, 248, 0.9); max-width: 52ch; font-size: var(--wp--preset--font-size--grand, 1.375rem); }
.wp-block-cover.is-style-hero .is-style-etiquette { color: var(--creme); }
.wp-block-cover.is-style-hero .wp-block-buttons { margin-top: 0.5rem; }
@media (max-width: 600px) { .wp-block-cover.is-style-hero .wp-block-buttons, .wp-block-cover.is-style-hero .wp-block-button, .wp-block-cover.is-style-hero .wp-block-button__link { width: 100%; } }

/* 7. Repère de section, en-tête, bandeau ---------------------------------- */
.wp-block-group.is-style-slab { border-top: 1px solid var(--trait); padding-top: 1rem; margin-bottom: 1.5rem; }
.wp-block-group.is-style-entete > h1, .wp-block-group.is-style-entete > h2 { max-width: 46rem; }
.wp-block-group.is-style-entete > p { max-width: var(--lecture); }
.wp-block-group.is-style-entete > * + * { margin-block-start: 1rem; }
.wp-block-group.is-style-bandeau { color: var(--nuit); }
.wp-block-group.is-style-bandeau p.is-style-mention { color: var(--nuit); }
.wp-block-group.is-style-bandeau p.is-style-sous-titre { font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); max-width: none; }
.wp-block-group.is-style-bandeau > .wp-block-group > * { margin: 0; }
@media (max-width: 600px) { .wp-block-group.is-style-bandeau .wp-block-buttons, .wp-block-group.is-style-bandeau .wp-block-button, .wp-block-group.is-style-bandeau .wp-block-button__link { width: 100%; } }

/* 8. Colonnes numérotées, fait marquant ----------------------------------- */
.wp-block-group.is-style-planches { border-top: 1px solid var(--trait); }
.is-style-planches > .wp-block-group { padding: 1.5rem 0 1.75rem; }
.is-style-planches > .wp-block-group > * { margin-top: 0; }
.is-style-planches > .wp-block-group > * + * { margin-top: 0.5rem; }
.is-style-planches > .wp-block-group > h3 { margin-top: 1rem; }
.is-style-planches > .wp-block-group > h3 + p, .is-style-planches p:not([class]) { color: var(--gris); font-size: 1rem; }
@media (max-width: 48rem) { .is-style-planches > .wp-block-group + .wp-block-group { border-top: 1px solid var(--trait); } }
.wp-block-group.is-style-fait { padding: clamp(1.5rem, 3vw, 2.5rem); }
.is-style-fait h3 { color: var(--creme); font-size: var(--wp--preset--font-size--titre-3); }
.is-style-fait p:not(.is-style-geant) { font-size: 1rem; color: var(--gris-sur-nuit); max-width: 52em; }

/* 9. Tableau comparatif ---------------------------------------------------- */
.wp-block-table.is-style-comparatif { margin-top: clamp(1.5rem, 3vw, 2.5rem); }
.wp-block-table.is-style-comparatif table { border-collapse: collapse; font-size: 1rem; min-width: 760px; }
.wp-block-table.is-style-comparatif th, .wp-block-table.is-style-comparatif td { padding: 1.1rem 1rem; text-align: left; vertical-align: top; border: 0; border-bottom: 1px solid var(--trait); }
.wp-block-table.is-style-comparatif thead th { font-size: var(--etiquette); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--gris); border-bottom: 2px solid var(--nuit); padding-bottom: 0.75rem; }
.wp-block-table.is-style-comparatif thead th:last-child { color: var(--nuit); background: var(--creme); border-top: 4px solid var(--saumon); }
.wp-block-table.is-style-comparatif tbody td { color: var(--gris); line-height: 1.5; }
.wp-block-table.is-style-comparatif tbody td:first-child { font-weight: 800; font-size: 1.25rem; letter-spacing: -0.015em; color: var(--nuit); width: 10rem; padding-left: 0; }
.wp-block-table.is-style-comparatif tbody td:last-child { color: var(--nuit); font-weight: 600; background: var(--creme); }
.wp-block-table.is-style-comparatif + p.is-style-mention { margin-top: 1rem; }

/* 10. Grille de cartes, listes à puces ------------------------------------- */
.is-style-cartes .wp-block-image img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.is-style-cartes > .wp-block-group > * + * { margin-top: 0.75rem; }
.is-style-cartes > .wp-block-group > h3 { margin-top: 0.5rem; }
.is-style-cartes p:not([class]) { color: var(--gris); }
ul.is-style-puces, .is-style-puces ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.45rem; font-size: var(--petit); }
ul.is-style-puces li, .is-style-puces li { display: flex; gap: 0.75rem; }
ul.is-style-puces li::before, .is-style-puces li::before { content: ""; width: 0.6em; height: 0.6em; margin-top: 0.55em; background: var(--saumon); flex: none; }
ul.is-style-puces li strong { font-weight: 700; }

/* 11. Étapes, lignes ------------------------------------------------------- */
.wp-block-group.is-style-etapes { counter-reset: etape; border-bottom: 1px solid var(--trait); }
.is-style-etapes > .wp-block-group { counter-increment: etape; display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 0.35rem 1.25rem; padding: 1.5rem 0; border-top: 1px solid var(--trait); }
.is-style-etapes > .wp-block-group::before { content: counter(etape); grid-column: 1; grid-row: 1 / span 9; display: grid; place-items: center; width: 3rem; height: 3rem; background: var(--saumon); color: var(--nuit); font-weight: 800; font-size: 1.375rem; }
.is-style-etapes > .wp-block-group > * { grid-column: 2; margin: 0; }
.is-style-etapes > .wp-block-group > p { color: var(--gris); max-width: var(--lecture); }
.wp-block-group.is-style-lignes { border-top: 1px solid var(--trait); }
.is-style-lignes > .wp-block-group { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 0.9rem 0; border-bottom: 1px solid var(--trait); }
.is-style-lignes > .wp-block-group > * { margin: 0; }
.is-style-lignes > .wp-block-group > p:first-child { font-size: var(--etiquette); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--gris); }
.is-style-lignes > .wp-block-group > p:last-child { font-weight: 800; font-size: 1.25rem; letter-spacing: -0.02em; text-align: right; }
.is-style-lignes > .wp-block-group > p:last-child.is-style-mention { font-size: 1rem; font-weight: 700; color: inherit; }
.is-style-lignes a { text-decoration: none; color: inherit; display: inline-block; padding: 0.3rem 0; }
.is-style-lignes a:hover { color: var(--saumon); }
.is-style-lignes .wp-block-buttons { margin-top: 1.25rem; }
.is-style-lignes .wp-block-buttons, .is-style-lignes .wp-block-button, .is-style-lignes .wp-block-button__link { width: 100%; }
.wp-block-group.is-style-reperes { border-top: 1px solid var(--trait); }
.is-style-reperes > .wp-block-group { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--trait); align-items: baseline; }
.is-style-reperes > .wp-block-group > * { margin: 0; }
.is-style-reperes > .wp-block-group > p:first-child { font-weight: 800; font-size: 1.75rem; letter-spacing: -0.03em; line-height: 1; white-space: nowrap; }
.is-style-reperes > .wp-block-group > p:last-child { color: var(--gris); font-size: 1rem; }
@media (max-width: 600px) { .is-style-reperes > .wp-block-group { grid-template-columns: 6.5rem minmax(0, 1fr); } }

/* 12. Tarifs (sur fond nuit) ---------------------------------------------- */
.wp-block-group.is-style-tarifs { border-top: 1px solid var(--trait); }
.is-style-tarifs > .wp-block-group { padding: 2rem 1.75rem 2.25rem; border-left: 1px solid var(--trait); display: flex; flex-direction: column; gap: 1rem; }
.is-style-tarifs > .wp-block-group > * { margin: 0; }
.is-style-tarifs > .wp-block-group > ul { flex: 1; }
.is-style-tarifs > .wp-block-group > .wp-block-buttons { margin-top: auto; }
.is-style-tarifs > .wp-block-group:first-child { border-left: 0; padding-left: 0; }
.is-style-tarifs > .wp-block-group:last-child { padding-right: 0; }
.is-style-tarifs p:not([class]) { color: var(--gris); }
.is-style-tarifs h3 { color: inherit; }
.is-style-tarifs .wp-block-buttons, .is-style-tarifs .wp-block-button, .is-style-tarifs .wp-block-button__link { width: 100%; }
@media (max-width: 62rem) { .is-style-tarifs > .wp-block-group, .is-style-tarifs > .wp-block-group:first-child, .is-style-tarifs > .wp-block-group:last-child { border-left: 0; border-bottom: 1px solid var(--trait); padding: 1.75rem 0; } }

/* 13. Photos et légendes --------------------------------------------------- */
.wp-block-image.is-style-legende img { aspect-ratio: 1; object-fit: cover; width: 100%; }
.wp-block-image figcaption, .wp-block-image .wp-element-caption { text-align: left; font-size: var(--petit); color: var(--nuit); font-weight: 600; margin: 0.6rem 0 0; line-height: 1.4; }
.wp-block-image figcaption em { font-style: normal; color: var(--brique); font-weight: 700; float: right; }
.wp-block-image.is-style-legende figcaption { display: flex; justify-content: space-between; gap: 0.5rem; }
.is-style-cartes .wp-block-image figcaption, .surligne-plan figcaption { font-size: var(--petit); color: var(--gris); font-weight: 400; }

/* 14. Questions fréquentes ------------------------------------------------- */
.wp-block-group.is-style-faq { border-bottom: 1px solid var(--trait); }
.wp-block-group.is-style-faq > * { margin: 0; }
.wp-block-details { border-top: 1px solid var(--trait); margin: 0; }
.wp-block-details summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-block: 1.25rem; font-weight: 700; font-size: 1.1875rem; letter-spacing: -0.01em; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; font-size: 1.75rem; font-weight: 800; line-height: 1; color: var(--brique); flex: none; }
.wp-block-details[open] summary::after { content: "−"; }
.wp-block-details summary:focus-visible { outline: 3px solid var(--nuit); outline-offset: 2px; }
.wp-block-details > :not(summary) { color: var(--gris); max-width: var(--lecture); margin: 0 0 0.75rem; }
.wp-block-details > :not(summary):last-child { padding-bottom: 1.25rem; margin-bottom: 0; }
.wp-block-details strong { color: var(--nuit); }

/* 15. Aperçu du bilan (bloc Aperçu) ---------------------------------------- */
.surligne-apercu { background: var(--sable); border: 1px solid var(--trait); padding: 1.5rem 1.5rem 1.25rem; width: 100%; max-width: 22rem; }
.surligne-apercu .preview-head { display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; }
.surligne-apercu .preview-head b { font-size: var(--etiquette); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--brique); }
.surligne-apercu .shoe { width: 160px; margin: 1rem auto 0.5rem; }
.surligne-apercu .preview-name { text-align: center; font-weight: 800; font-size: 1.125rem; letter-spacing: -0.02em; line-height: 1.2; margin: 0; }
.surligne-apercu .preview-name small { display: block; font-weight: 400; color: var(--gris); font-size: var(--petit); letter-spacing: 0; margin-top: 0.15rem; }
.shoe { position: relative; }
.shoe svg { width: 100%; height: auto; display: block; overflow: visible; }
.shoe .track { stroke: var(--trait); }
.shoe .fill { stroke: var(--saumon); transition: stroke-dashoffset 1.6s var(--ease); }
.shoe .nail { fill: var(--creme); }
.shoe .val { position: absolute; left: 0; right: 0; top: 40%; transform: translateY(-50%); text-align: center; line-height: 1; }
.shoe .val b { display: block; font-size: 2.9em; font-weight: 800; letter-spacing: -0.04em; }
.shoe .val span { font-size: 0.62em; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--gris); }
.pbars { display: grid; gap: 0.6rem; margin-top: 1rem; }
.bar { display: grid; grid-template-columns: 6.5rem 1fr 2.25rem; gap: 0.75rem; align-items: center; font-size: var(--etiquette); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; }
.bar i { display: block; height: 8px; background: var(--trait); position: relative; overflow: hidden; }
.bar i::after { content: ""; position: absolute; inset: 0; width: var(--w, 0%); background: var(--saumon); transition: width 1.3s var(--ease); }
.bar em { font-style: normal; text-align: right; font-weight: 800; font-size: 1.0625rem; letter-spacing: -0.02em; text-transform: none; }

/* 16. En-tête et pied de page --------------------------------------------- */
.wp-block-group.is-style-topbar { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--trait); padding-top: 0.75rem; padding-bottom: 0.75rem; }
/* Le gabarit enveloppe la barre dans <header> : c'est cette enveloppe qui doit coller, sinon la barre défile avec la page */
.wp-block-template-part:has(> .is-style-topbar) { position: sticky; top: 0; z-index: 50; }
body.admin-bar .wp-block-group.is-style-topbar, body.admin-bar .wp-block-template-part:has(> .is-style-topbar) { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { body.admin-bar .wp-block-group.is-style-topbar, body.admin-bar .wp-block-template-part:has(> .is-style-topbar) { top: 0; } }
.is-style-topbar .wp-block-site-logo img { max-height: 52px; width: auto; }
.is-style-topbar .wp-block-site-logo a { display: inline-flex; align-items: center; min-height: 44px; }
.is-style-topbar .wp-block-navigation a { color: var(--nuit); font-weight: 700; font-size: var(--petit); text-decoration: none; }
.is-style-topbar .wp-block-navigation a:hover { color: var(--brique); }
.is-style-topbar .wp-block-button__link { min-height: 2.75rem; padding: 0.6rem 1.1rem; font-size: 1rem; }
@media (max-width: 860px) { .is-style-topbar .wp-block-navigation { display: none; } }
@media (max-width: 600px) { .is-style-topbar .wp-block-site-logo img { max-height: 40px; } }
.surligne-footer { font-size: var(--petit); color: var(--gris); }
.surligne-footer .wp-block-site-logo img { max-height: 44px; width: auto; }
.surligne-footer a { color: var(--enseigne); text-decoration: none; }
.surligne-footer a:hover { color: var(--brique); }
@media (max-width: 600px) { .surligne-footer p { text-align: left; } }

/* 16 bis. Sous-menu de page : ancres vers les sections, collé sous l'en-tête --- */
.wp-block-group.is-style-sous-menu { position: sticky; top: var(--surligne-topbar-h, 0px); z-index: 40; border-bottom: 1px solid var(--trait); padding-top: 0; padding-bottom: 0; }
body.admin-bar .wp-block-group.is-style-sous-menu { top: calc(var(--surligne-topbar-h, 0px) + var(--wp-admin--admin-bar--height, 32px)); }
.is-style-sous-menu .wp-block-navigation { margin: 0; }
.is-style-sous-menu .wp-block-navigation__container { display: flex; flex-wrap: nowrap; gap: 0; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; margin: 0; padding: 0; }
.is-style-sous-menu .wp-block-navigation__container::-webkit-scrollbar { display: none; }
.is-style-sous-menu .wp-block-navigation-item { flex: none; margin: 0; }
.is-style-sous-menu .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 3.25rem; padding: 0.6rem 1rem; font-size: var(--petit); font-weight: 700; color: var(--gris); text-decoration: none; border-bottom: 3px solid transparent; white-space: nowrap; transition: color 0.15s, border-color 0.15s; }
.is-style-sous-menu .wp-block-navigation-item:first-child .wp-block-navigation-item__content { padding-left: 0; }
.is-style-sous-menu .wp-block-navigation-item__content:hover { color: var(--nuit); }
.is-style-sous-menu .wp-block-navigation-item.is-current .wp-block-navigation-item__content, .is-style-sous-menu .wp-block-navigation-item__content[aria-current] { color: var(--nuit); border-bottom-color: var(--saumon); }
.is-style-sous-menu .wp-block-navigation-item__content:focus-visible { outline-offset: -3px; }
.wp-block-group[id], .wp-block-cover[id] { scroll-margin-top: calc(var(--surligne-topbar-h, 0px) + var(--surligne-sous-menu-h, 0px) + 1rem); }
@media (max-width: 600px) { body.admin-bar .wp-block-group.is-style-sous-menu { top: var(--surligne-topbar-h, 0px); } }

/* 17. Sections ------------------------------------------------------------- */
.surligne-page .wp-block-post-content > .wp-block-group.alignfull:not(.is-style-bandeau):not(.is-style-sous-menu) { padding-top: var(--wp--preset--spacing--section); padding-bottom: var(--wp--preset--spacing--section); }
.wp-block-columns { gap: clamp(1.5rem, 1rem + 2vw, 3rem); }
.surligne-plan { margin: 0; }

/* 18. Mouvement réduit ----------------------------------------------------- */
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }

/* 17. Deux univers : votre cheval en saumon, votre écurie en ciel ---------- */
/* Une classe sur une section, une porte ou un bouton suffit : surlignage, étiquettes, puces, numéros et boutons prennent la couleur de l'univers. */
:root, .editor-styles-wrapper { --ciel: var(--wp--preset--color--ciel, #7FB6DC); --ciel-survol: var(--wp--preset--color--ciel-survol, #69A7D1); }
/* Une page entière (le stage) : la classe univers-page-projet sur son premier bloc bascule aussi l'en-tête, le bilan et la barre mobile. */
.univers-projet, body.univers-page-projet, body:has(.univers-page-projet) {
  --wp--preset--color--saumon: #7FB6DC;
  --wp--preset--color--saumon-survol: #69A7D1;
  --wp--preset--color--brique: #0B3A5E;
  --saumon: #7FB6DC;
  --saumon-survol: #69A7D1;
  --brique: #0B3A5E;
}
.univers-cheval {
  --wp--preset--color--saumon: #F08E80;
  --wp--preset--color--saumon-survol: #E97A6B;
  --wp--preset--color--brique: #A9473A;
  --saumon: #F08E80;
  --saumon-survol: #E97A6B;
  --brique: #A9473A;
}
.is-style-topbar .wp-block-navigation-item.univers-cheval > a, .is-style-topbar .wp-block-navigation-item.univers-projet > a { box-shadow: inset 0 -3px 0 var(--saumon); padding-bottom: 0.2rem; }
.wp-block-group.univers-porte { height: 100%; display: flex; flex-direction: column; gap: 1rem; padding: clamp(1.25rem, 2.5vw, 2rem); background: var(--creme); border-top: 8px solid var(--saumon); }
.univers-porte > * { margin: 0 !important; }
.univers-porte .wp-block-image img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.univers-porte > p:not([class]) { color: var(--gris); }
.univers-porte > .wp-block-buttons { margin-top: auto !important; padding-top: 0.5rem; }
.is-style-lignes > .univers-cheval > p:first-child::before, .is-style-lignes > .univers-projet > p:first-child::before { content: ""; display: inline-block; width: 0.75em; height: 0.75em; margin-right: 0.6em; background: var(--saumon); vertical-align: -0.05em; }
.univers-porte .is-style-lignes > .wp-block-group > p:last-child { white-space: nowrap; }
@media (max-width: 600px) { .univers-porte .wp-block-buttons, .univers-porte .wp-block-button, .univers-porte .wp-block-button__link { width: 100%; } }

/* 18. Articles : liste, rubriques, article, fin d'article ------------------ */
.surligne-filtres { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; padding: 0; margin: var(--wp--preset--spacing--l) 0; }
.surligne-filtres li { margin: 0; }
.surligne-filtres a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0.5rem 1rem; border: 1px solid var(--trait); color: var(--nuit); font-weight: 700; font-size: var(--petit); text-decoration: none; }
.surligne-filtres a:hover, .surligne-filtres .current-cat a { border-color: var(--nuit); background: var(--nuit); color: var(--creme); }
.surligne-articles .wp-block-post-template { gap: var(--wp--preset--spacing--l); }
.surligne-articles .wp-block-post { display: flex; flex-direction: column; gap: 0.6rem; }
.surligne-articles .wp-block-post > * { margin: 0; }
.surligne-articles .wp-block-post-featured-image img { width: 100%; object-fit: cover; }
.surligne-articles .wp-block-post-title { font-size: var(--wp--preset--font-size--titre-3); line-height: 1.15; }
.surligne-articles .wp-block-post-title a { color: inherit; text-decoration: none; }
.surligne-articles .wp-block-post-title a:hover { text-decoration: underline; text-decoration-color: var(--saumon); text-decoration-thickness: 3px; }
.surligne-articles .wp-block-post-excerpt__excerpt { color: var(--gris); font-size: 1rem; margin: 0; }
.surligne-articles .wp-block-post-date, .surligne-article-tete .wp-block-post-date { font-size: var(--petit); color: var(--gris); }
.wp-block-post-terms.is-style-etiquette a { color: inherit; text-decoration: none; }
.wp-block-query-pagination { margin-top: var(--wp--preset--spacing--xl); font-weight: 700; }
.surligne-article-tete { margin-bottom: var(--wp--preset--spacing--l); }
.surligne-article-tete .wp-block-post-title { font-size: var(--wp--preset--font-size--titre-1); line-height: 1.02; letter-spacing: -0.025em; margin-top: 1rem; }
.single-post .wp-block-post-featured-image { margin-bottom: var(--wp--preset--spacing--l); }
.surligne-article-contenu > * { margin-left: 0 !important; margin-right: 0 !important; }
.surligne-article-contenu > h2 { margin-top: var(--wp--preset--spacing--xl); }
.surligne-article-contenu > h3 { margin-top: var(--wp--preset--spacing--l); }
.surligne-article-contenu > p, .surligne-article-contenu > ul, .surligne-article-contenu > ol { font-size: var(--texte); line-height: 1.65; }
.surligne-article-contenu a { text-decoration-color: var(--saumon); text-decoration-thickness: 2px; }
.surligne-enbref { background: var(--sable); border-left: 6px solid var(--saumon); padding: 1.25rem 1.5rem; }
.surligne-enbref > * { margin: 0; }
.surligne-enbref > * + * { margin-top: 0.75rem; }
.surligne-article-fin { margin-top: var(--wp--preset--spacing--section); padding-top: var(--wp--preset--spacing--l); border-top: 1px solid var(--trait); }
.surligne-article-fin > * + * { margin-top: 1rem; }
.surligne-article-fin .wp-block-columns { margin-top: var(--wp--preset--spacing--l); }
.surligne-auclos { padding: 1.5rem 1.75rem; border-left: 6px solid var(--saumon); margin-top: var(--wp--preset--spacing--l) !important; margin-bottom: var(--wp--preset--spacing--l) !important; }
.surligne-auclos > * { margin: 0; }
.surligne-auclos > * + * { margin-top: 0.85rem; }
.surligne-auclos p:not([class]) { color: var(--creme); font-size: var(--texte); line-height: 1.6; }

/* 20. Hauts de page compacts : la photo annonce la page sans cacher la suite ---- */
.wp-block-cover.is-style-hero { min-height: min(62svh, 600px) !important; }
.wp-block-cover.is-style-hero .wp-block-cover__inner-container,
.wp-block-cover.is-style-hero.has-custom-content-position.has-custom-content-position .wp-block-cover__inner-container { gap: 0.85rem; padding-top: clamp(4rem, 3rem + 4vw, 6rem); padding-bottom: clamp(1.75rem, 1.25rem + 2vw, 3rem); }
.wp-block-cover.is-style-hero h1 { max-width: 22ch; font-size: clamp(2.125rem, 1.4rem + 2.8vw, 3.75rem); line-height: 1.02; }
.wp-block-cover.is-style-hero p.is-style-sous-titre { font-size: clamp(1.0625rem, 0.95rem + 0.6vw, 1.375rem); max-width: 40ch; }
.wp-block-cover.is-style-hero p.is-style-chapo { font-size: 1.0625rem; line-height: 1.55; max-width: 62ch; }
@media (max-width: 781px) {
  .wp-block-cover.is-style-hero { min-height: 0 !important; }
  .wp-block-cover.is-style-hero .wp-block-cover__inner-container { padding-top: 7rem; }
  .wp-block-cover.is-style-hero p.is-style-chapo { font-size: 1rem; }
}
.surligne-article-tete .wp-block-post-title { font-size: clamp(2rem, 1.5rem + 2vw, 3.25rem) !important; line-height: 1.05; }

/* 21. Avis : ce qu'en disent ceux qui sont venus ------------------------------ */
.surligne-avis { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: var(--wp--preset--spacing--m); }
.surligne-avis > .wp-block-group { background: var(--creme); border-top: 4px solid var(--saumon); padding: 1.5rem 1.5rem 1.35rem; display: flex; flex-direction: column; gap: 0.75rem; margin: 0 !important; }
.has-sable-background-color .surligne-avis > .wp-block-group { background: var(--creme); }
.has-creme-background-color .surligne-avis > .wp-block-group, .surligne-avis.sur-creme > .wp-block-group { background: var(--sable); }
.surligne-avis > .wp-block-group > * { margin: 0; }
.surligne-avis p.surligne-etoiles { color: var(--brique); letter-spacing: 0.12em; font-size: 0.95rem; }
.surligne-avis p.surligne-citation { font-size: 1.0625rem; line-height: 1.55; color: var(--nuit); flex: 1; }
.surligne-avis p.is-style-mention { color: var(--gris); }
.surligne-avis-note { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 1rem; }
.surligne-avis-note > * { margin: 0 !important; }

/* 22. Instagram : le troupeau suivi par près de 20 000 personnes ------------- */
.surligne-insta-grille { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.6rem; }
.surligne-insta-grille:has(> figure:nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 30rem; margin-inline: auto; }
@media (max-width: 781px) { .surligne-insta-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.surligne-insta-grille > figure { position: relative; margin: 0 !important; overflow: hidden; }
.surligne-insta-grille img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; transition: transform 0.4s var(--ease); }
.surligne-insta-grille a:hover img { transform: scale(1.03); }
.surligne-insta-grille a { display: block; }
.surligne-insta-grille figure figcaption.wp-element-caption { position: absolute; left: 0.5rem; bottom: 0.5rem; margin: 0; padding: 0.2rem 0.5rem; background: var(--nuit); color: var(--creme) !important; font-size: 0.8125rem; font-weight: 700; line-height: 1.3; pointer-events: none; }
p.surligne-insta-chiffre { font-weight: 800; font-size: clamp(3rem, 2rem + 3.5vw, 4.75rem); letter-spacing: -0.04em; line-height: 0.95; margin: 0; white-space: nowrap; }
.surligne-insta-chiffre em { font-style: normal; font-weight: 600; font-size: 1.0625rem; line-height: 1.35; letter-spacing: 0; display: block; margin-top: 0.5rem; opacity: 0.8; white-space: normal; }
.surligne-insta-chiffre em:first-child { margin: 0 0 0.35rem; }

/* 23. Réseaux dans l'en-tête et le pied de page --------------------------------- */
.is-style-topbar .wp-block-social-links { margin: 0; gap: 0.25rem; }
.is-style-topbar .wp-block-social-links .wp-social-link { color: var(--nuit); }
.is-style-topbar .wp-block-social-links .wp-social-link svg { width: 22px; height: 22px; }
.surligne-footer .wp-block-social-links .wp-social-link { color: var(--nuit); }
@media (max-width: 600px) { .is-style-topbar .wp-block-social-links { display: none; } }

/* 24. Pages légales : lecture sobre --------------------------------------------- */
.surligne-legal h1 { font-size: clamp(2rem, 1.5rem + 2vw, 3rem); }
.surligne-legal h2 { font-size: clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem); margin-top: var(--wp--preset--spacing--l); padding-top: var(--wp--preset--spacing--m); border-top: 1px solid var(--trait); }
.surligne-legal h3 { font-size: 1.125rem; margin-top: var(--wp--preset--spacing--m); }
.surligne-legal p, .surligne-legal li { font-size: 1.0625rem; line-height: 1.65; }
.surligne-legal > * { margin-left: 0 !important; margin-right: 0 !important; }

/* 20. Corrections de l'audit (septembre 2026) -------------------------------- */
/* Menu principal : bouton menu sous 860 px, panneau plein écran crème. */
@media (max-width: 860px) {
	.is-style-topbar .wp-block-navigation { display: flex; }
	.is-style-topbar .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.is-style-topbar .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
.is-style-topbar .wp-block-navigation__responsive-container-open { min-width: 44px; min-height: 44px; align-items: center; justify-content: center; color: var(--nuit); }
.is-style-topbar .wp-block-navigation__responsive-container-open svg { width: 28px; height: 28px; }
.is-style-topbar .wp-block-navigation__responsive-container.is-menu-open { padding: 1.25rem var(--wp--style--root--padding-right, 1.25rem); }
.is-style-topbar .wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; }
.is-style-topbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 4rem; gap: 0.25rem; align-items: flex-start; }
.is-style-topbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.75rem; font-weight: 800; letter-spacing: -0.02em; padding: 0.6rem 0; }
.is-style-topbar .surligne-nav { gap: 0.5rem; align-items: center; }

/* Sous-menu de page : fondu à droite quand des onglets sont cachés. */
.is-style-sous-menu.a-suivre .wp-block-navigation__container { -webkit-mask-image: linear-gradient(to right, #000 80%, transparent); mask-image: linear-gradient(to right, #000 80%, transparent); }

/* Tableau comparatif : une carte par ligne sur mobile. */
@media (max-width: 781px) {
	.wp-block-table.is-style-comparatif.has-labels { overflow: visible; }
	.is-style-comparatif.has-labels table { min-width: 0; width: 100%; }
	.is-style-comparatif.has-labels thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.is-style-comparatif.has-labels tbody tr { display: block; padding: 1.25rem 0; border-bottom: 2px solid var(--nuit); }
	.is-style-comparatif.has-labels tbody td { display: block; width: auto; padding: 0.5rem 0; border: 0; }
	.is-style-comparatif.has-labels tbody td:first-child { width: auto; padding-bottom: 0.25rem; }
	.is-style-comparatif.has-labels tbody td:not(:first-child)::before { content: attr(data-label); display: block; font-size: var(--etiquette); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--gris); margin-bottom: 0.2rem; }
	.is-style-comparatif.has-labels tbody td:last-child { padding: 0.75rem 1rem; border-left: 4px solid var(--saumon); }
}

/* Pied de page : zones cliquables de 44 px sur écran tactile. */
@media (max-width: 781px) {
	.surligne-footer a { display: inline-block; padding: 0.7rem 0; }
	.surligne-footer .wp-block-social-links .wp-social-link a { padding: 10px; }
}

/* « À lire aussi » en fin d'article. */
.surligne-a-lire { margin: var(--wp--preset--spacing--xl, 3rem) 0 0; padding-top: 1.5rem; border-top: 2px solid var(--nuit); }
.surligne-a-lire ul { list-style: none; margin: 0.75rem 0 0; padding: 0; }
.surligne-a-lire li { border-bottom: 1px solid var(--trait); }
.surligne-a-lire a { display: block; padding: 0.9rem 0; font-weight: 700; font-size: 1.15rem; color: var(--nuit); text-decoration: none; }
.surligne-a-lire a:hover { color: var(--brique); }
.is-style-topbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.is-style-topbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start; justify-content: flex-start; width: 100%; }
.is-style-topbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--trait); }
.is-style-topbar .wp-block-navigation__responsive-container.is-menu-open { --navigation-layout-justification-setting: flex-start; --navigation-layout-justify: flex-start; --navigation-layout-align: flex-start; }
.is-style-topbar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { align-items: flex-start; text-align: left; }