/*
Theme Name: Twenty Twenty-Four Child - NDLE - Naissance de l'encre
Template: twentytwentyfour
Version: 2.1
Description: Thème enfant optimisé - Couleurs et typographies gérées via theme.json, styles avancés en CSS.
*/

/* ==============================
   VARIABLES CSS PERSONNALISÉES
   Complètent les variables générées par theme.json
   ============================== */

:root {
  /* Couleurs texte (absentes de theme.json) */
  --couleur-texte: #333;
  --couleur-titre: #464646;
  --couleur-texte-secondaire: #666;
  --couleur-bleu-fonce: #1a6fc4; /* Bleu accessible WCAG AA — contraste sur blanc */

  /* Opacités bleues (base : var(--wp--preset--color--primary-blue) = primary-blue) */
  --bleu-08: rgba(47, 122, 197, 0.08);
  --bleu-12: rgba(47, 122, 197, 0.12);
  --bleu-30: rgba(47, 122, 197, 0.3);

  /* Arrondis */
  --radius-bouton: 12px;
  --radius-tuile: 20px;
}

/* ==============================
   SUPPRESSION DES ESPACES ENTRE GRANDES SECTIONS UNIQUEMENT
   Header ↔ Main ↔ Footer
   ============================== */

/* Supprimer l'espace entre header et main */
body>header {
  margin-bottom: 0 !important;
  position: relative;
  z-index: 100;
}

/* Supprimer l'espace entre main et footer */
body>main {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Supprimer l'espace avant le footer */
body>footer {
  margin-top: 0 !important;
  position: relative;
}

body>footer::before {
  content: "";
  position: absolute;
  inset: 0;
  filter: url(#grain-filter);
  opacity: 0.20;
  pointer-events: none;
  z-index: 1;
}

body>footer > * {
  position: relative;
  z-index: 2;
}

/* Supprimer la règle du thème parent qui ajoute de l'espace */
:where(.wp-site-blocks)>* {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}

/* ==============================
   SUPPRESSION DES MARGES EXTERNES DES BLOCS PARENTS
   Groupe, Colonnes, Rangée, Grille, Emplacement
   ============================== */

/* Blocs parents dans le main uniquement (pas header ni footer) */
main .wp-block-group,
main .wp-block-columns,
main .wp-block-column,
main .wp-block-cover,
main .wp-block-media-text,
main .wp-block-group.alignfull,
main .wp-block-group.alignwide {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Appliquer aussi dans l'éditeur pour cohérence */
.editor-styles-wrapper main .wp-block-group,
.editor-styles-wrapper main .wp-block-columns,
.editor-styles-wrapper main .wp-block-column,
.editor-styles-wrapper main .wp-block-cover,
.editor-styles-wrapper main .wp-block-media-text {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* ==============================
   HARMONISATION HERO — Padding-top uniforme toutes pages (hors Portfolio)
   Référence : page Accueil — 105px entre bas header et premier titre
   S'applique automatiquement aux nouvelles pages (Ressources, sous-pages, etc.)
   ============================== */

body:not(.page-id-169):not(.page-template-portfolio-ndle) main > .wp-block-group:first-child,
body:not(.page-id-169):not(.page-template-portfolio-ndle) .entry-content > .wp-block-group:first-child {
  padding-top: 105px !important;
}
@media (max-width: 768px) {
  body.page.page-id-662 main > .wp-block-group:first-child,
  body.page.page-id-662 .entry-content > .wp-block-group:first-child {
    padding-top: 50px !important;
  }
}

/* Neutralise le padding-top hérité du thème sur les colonnes en premier enfant d'un hero */
/* + supprime le margin-top du titre asterisk dans ce contexte */
.hero-jaune > .wp-block-columns,
.hero-bourgogne > .wp-block-columns,
.hero-bleu > .wp-block-columns,
.hero-bleu-ciel > .wp-block-columns,
.hero-olive > .wp-block-columns {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

:is(.hero-jaune,.hero-bourgogne,.hero-bleu,.hero-bleu-ciel,.hero-olive) > .wp-block-columns [class*="is-style-"] {
  margin-top: 0 !important;
}

/* Alignement gauche explicite — corrige double classe has-text-align-left + has-text-align-center (is-style-asterisk impose center par défaut) */
.is-style-asterisk.has-text-align-left {
  text-align: left !important;
}
.is-style-asterisk.has-text-align-left::before {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* ==============================
   STYLES HEADING — Glyphes typographiques éditoriaux
   ¶ pied-mouche | § section | † obèle
   ============================== */

.is-style-pied-mouche::before,
.is-style-section::before,
.is-style-obele::before,
.is-style-double-obele::before,
.is-style-esperluette::before,
.is-style-index::before,
.is-style-asterisme::before,
.is-style-reference::before,
.is-style-fleuron::before {
  display: block;
  line-height: 1;
  margin-bottom: 0.25em;
  margin-left: auto;
  margin-right: auto;
}

.is-style-pied-mouche::before { content: "¶"; padding-left: 0.15em; }
.is-style-section::before     { content: "§"; }
.is-style-obele::before       { content: "†"; }
.is-style-double-obele::before  { content: "‡"; }
.is-style-esperluette::before   { content: "&"; }
.is-style-index::before         { content: "☞"; }
.is-style-asterisme::before     { content: "⁂"; }
.is-style-reference::before     { content: "※"; }
.is-style-fleuron::before       { content: "❧"; }

/* Alignement gauche */
.is-style-pied-mouche.has-text-align-left::before,
.is-style-section.has-text-align-left::before,
.is-style-obele.has-text-align-left::before,
.is-style-double-obele.has-text-align-left::before,
.is-style-esperluette.has-text-align-left::before,
.is-style-index.has-text-align-left::before,
.is-style-asterisme.has-text-align-left::before,
.is-style-reference.has-text-align-left::before,
.is-style-fleuron.has-text-align-left::before {
  margin-left: 0;
  margin-right: auto;
}


/* Espace entre colonnes - Augmenté */
.wp-block-columns {
  gap: 3rem !important;
}

/* Dans l'éditeur aussi */
.editor-styles-wrapper .wp-block-columns {
  gap: 3rem !important;
}

/* ==============================
   HEADER - Correction hauteur
   ============================== */

/* Forcer hauteur auto sur header */
body>header,
.wp-block-template-part>header,
header.wp-block-group {
  min-height: auto !important;
  height: auto !important;
}

/* Empêcher les groupes et colonnes du header de s'étirer - CIBLÉ */
header .wp-block-group,
header .wp-block-columns,
header .wp-block-column {
  min-height: auto !important;
  height: auto !important;
  flex-grow: 0 !important;
}

/* MAIS préserver le bouton hamburger - Dimensions correctes */
header .wp-block-navigation__responsive-container-open {
  min-height: 48px !important;
  height: 48px !important;
  width: auto !important;
  padding: 8px 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}

/* Masquer COMPLÈTEMENT le SVG natif WordPress */
header .wp-block-navigation__responsive-container-open svg {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border-width: 0 !important;
}

/* Les 3 lignes du hamburger - Lignes PARFAITEMENT égales (pas de décimales) */
header .wp-block-navigation__responsive-container-open::after {
  content: "";
  display: block;
  width: 24px;
  height: 15px;
  background-image:
    linear-gradient(to bottom,
      currentColor 0px, currentColor 3px,
      transparent 3px, transparent 6px,
      currentColor 6px, currentColor 9px,
      transparent 9px, transparent 12px,
      currentColor 12px, currentColor 15px);
}

/* Couleur au survol */
header .wp-block-navigation__responsive-container-open:hover {
  color: var(--wp--preset--color--hover-blue);
}

/* Supprimer contours hamburger */
header .wp-block-navigation__responsive-container-open:focus,
header .wp-block-navigation__responsive-container-open:active {
  outline: none !important;
  box-shadow: none !important;
}

/* Masquer le hamburger sur desktop (au-dessus de 600px) */
@media (min-width: 601px) {

  header .wp-block-navigation__responsive-container-open,
  header .wp-block-navigation__responsive-container-close {
    display: none !important;
  }
}

/* Alignement hamburger à droite sur mobile - BREAKPOINT CORRIGÉ */
@media (max-width: 600px) {
  header .wp-block-group.is-layout-flex {
    width: 100% !important;
    justify-content: flex-end !important;
  }

  header .wp-block-navigation {
    width: 100% !important;
    justify-content: flex-end !important;
  }
}

/* Paragraphes et listes mobile — taille minimale augmentée */
@media (max-width: 782px) {
  main :where(p),
  main :where(li) {
    font-size: 1.1rem !important;
  }
}

/* Footer paragraphes+listes mobile — spécificité 0,1,1 pour battre has-*-font-size */
@media (max-width: 782px) {
  footer [class*="font-size"]:not(.wp-block-social-links),
  footer p,
  footer li {
    font-size: 1.1rem !important;
  }
}

/* H1 + paragraphes hero mobile — +20% H1 / +10% p */
@media (max-width: 782px) {
  :is(.hero-jaune,.hero-bourgogne,.hero-bleu,.hero-bleu-ciel,.hero-olive,.hero-ressource) h1 {
    font-size: 2.4rem !important;
  }
  :is(.hero-jaune,.hero-bourgogne,.hero-bleu,.hero-bleu-ciel,.hero-olive,.hero-ressource) p {
    font-size: 1.1rem !important;
  }
}

/* ==============================
   TITRES H1–H6 RESPONSIFS
   Appliqués au front ET éditeur
   ============================== */

h1,
h2,
h3,
h4,
h5,
h6,
.wp-block-heading,
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
  font-family: var(--wp--preset--font-family--titles-serif);
  line-height: 1.25;
  font-weight: inherit;
}

/* H1 */
h1,
.wp-block-heading h1,
.editor-styles-wrapper h1 {
  font-size: clamp(2rem, 2rem + ((1vw - 0.2rem) * 2), 3.5rem);
  line-height: 1.15;
}

/* H2 */
h2,
.wp-block-heading h2,
.editor-styles-wrapper h2 {
  font-size: clamp(1.625rem, 1.625rem + ((1vw - 0.2rem) * 1.5), 2.75rem);
  line-height: 1.20;
}

/* H3 */
h3,
.wp-block-heading h3,
.editor-styles-wrapper h3 {
  font-size: clamp(1.313rem, 1.313rem + ((1vw - 0.2rem) * 1.125), 2.125rem);
  line-height: 1.30;
}

/* H4 */
h4,
.wp-block-heading h4,
.editor-styles-wrapper h4 {
  font-size: clamp(1.125rem, 1.125rem + ((1vw - 0.2rem) * 0.875), 1.75rem);
  line-height: 1.35;
}

/* H5 */
h5,
.wp-block-heading h5,
.editor-styles-wrapper h5 {
  font-size: clamp(1rem, 1rem + ((1vw - 0.2rem) * 0.5), 1.375rem);
  line-height: 1.40;
}

/* H6 */
h6,
.wp-block-heading h6,
.editor-styles-wrapper h6 {
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.375), 1.125rem);
  line-height: 1.45;
}

/* ==============================
   LIENS DANS TITRES — Suppression soulignement + préservation typo heading
   Scope : main uniquement (exclut footer — H3 "À propos" soulignement préservé)
   Scope : hors Portfolio (H2 titres projets non affectés)
   La couleur est laissée libre (Gutenberg textColor préservé).
   ============================== */

body:not(.page-id-169):not(.page-template-portfolio-ndle) main :is(h1,h2,h3,h4,h5,h6,.wp-block-heading) a {
  text-decoration: none !important;
  background-color: transparent !important;
  border-radius: 0 !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  transition: none !important;
}

body:not(.page-id-169):not(.page-template-portfolio-ndle) main :is(h1,h2,h3,h4,h5,h6,.wp-block-heading) a:hover {
  text-decoration: none !important;
  background-color: transparent !important;
}

/* ==============================
   COLONNES SECTION JAUNE — Alignement texte en haut
   1. WP `align-items: normal !important` → forcé à flex-start
   2. Global styles `padding-top: --spacing--50 (48px)` sur tous les
      .wp-block-columns → neutralisé sur les colonnes imbriquées
      pour aligner le haut du texte avec le haut de l'image col 1.
   ============================== */

[style*="ffd745"] .wp-block-columns {
  align-items: flex-start !important;
}

[style*="ffd745"] .wp-block-columns .wp-block-columns {
  padding-top: 0 !important;
}

/* Colonnes alignement vertical haut — correctif natif Gutenberg (are-vertically-aligned-top sans effet) */
.wp-block-columns.are-vertically-aligned-top {
  align-items: flex-start !important;
}

/* Colonnes enfants — contenu aligné TOP (flex-start) — override is-layout-flow */
.wp-block-column.is-layout-flow.is-vertically-aligned-top,
.is-layout-flow.wp-block-column.is-vertically-aligned-top {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
}

/* Légendes images - Taille 1rem */
.wp-element-caption,
.wp-block-image figcaption {
  font-size: 1rem !important;
  font-family: var(--wp--preset--font-family--manrope) !important;
}

/* ==============================
   LIENS — EFFET SURLIGNAGE AU SURVOL (sans décalage)
   ============================== */

/* Liens dans paragraphes */
p a {
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
  transition: background-color 0.2s ease, color 0.2s ease, text-decoration-color 0.2s ease;
  background-color: transparent;
  border-radius: 0;
}

p a:hover {
  text-decoration: underline;
  text-decoration-color: transparent;
  background-color: var(--wp--preset--color--hover-blue);
  color: inherit;
}

/* Neutralisation pseudo-éléments */
p a::before,
p a::after {
  content: none !important;
  display: none !important;
}

/* Liens dans listes */
ul li a,
ol li a {
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: background-color 0.2s ease, text-decoration-color 0.2s ease;
  background-color: transparent;
  border-radius: 0;
}

ul li a:hover,
ol li a:hover {
  text-decoration: underline;
  text-decoration-color: transparent;
  background-color: var(--wp--preset--color--hover-blue);
  color: inherit;
}

/* Liens dans citations */
blockquote a,
.wp-block-quote a {
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: background-color 0.2s ease, text-decoration-color 0.2s ease;
  background-color: transparent;
  border-radius: 0;
}

blockquote a:hover,
.wp-block-quote a:hover {
  text-decoration: underline;
  text-decoration-color: transparent;
  background-color: var(--wp--preset--color--hover-blue);
}

/* Taille texte tableau : respecte has-x-small-font-size Gutenberg (écrase WP Core :where() sur table) */
.wp-block-table.has-x-small-font-size > table,
.wp-block-table.has-x-small-font-size > table td,
.wp-block-table.has-x-small-font-size > table th {
  font-size: var(--wp--preset--font-size--x-small);
}

/* Liens dans tableaux */
.wp-block-table a {
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: background-color 0.2s ease, text-decoration-color 0.2s ease;
  background-color: transparent;
  border-radius: 0;
}

.wp-block-table a:hover {
  text-decoration: underline;
  text-decoration-color: transparent;
  background-color: var(--wp--preset--color--hover-blue);
}

/* ==============================
   TABLEAUX — Scroll horizontal mobile
   ============================== */
@media (max-width: 600px) {
  figure.wp-block-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    /* Indicateur visuel : ombre interne bord droit */
    box-shadow: inset -8px 0 20px -6px rgba(0, 0, 0, 0.2);
  }
  /* Neutralise table-layout: fixed sur mobile (colonnes sinon trop étroites) */
  figure.wp-block-table table.has-fixed-layout {
    table-layout: auto;
    min-width: 510px;
  }
  figure.wp-block-table table td,
  figure.wp-block-table table th {
    white-space: nowrap !important;
  }
}

/* ==============================
   NAVIGATION — EFFET SURVOL
   ============================== */

.wp-block-navigation a {
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease;
  padding: 4px 8px;
  border-radius: var(--radius-bouton);
}

.wp-block-navigation a:hover {
  background-color: var(--wp--preset--color--hover-blue);
  color: #ffffff !important;
}

/* Mise en avant du lien Portfolio dans le HEADER uniquement */
header .wp-block-navigation a[href*="/portfolio/"] {
  background-color: var(--couleur-bleu-fonce);
  border-radius: var(--radius-bouton);
  padding: 4px 12px;
  color: #ffffff !important;
  transition: background-color 0.2s ease, color 0.2s ease;
}

header .wp-block-navigation a[href*="/portfolio/"]:hover {
  background-color: var(--wp--preset--color--primary-blue);
  color: #ffffff !important;
}

/* Mise en avant du lien "Demander un devis" dans le FOOTER uniquement */
footer .wp-block-navigation a[href*="/demander-un-devis/"] {
  background-color: var(--couleur-bleu-fonce);
  border-radius: var(--radius-bouton);
  padding: 4px 12px;
  color: #ffffff !important;
  transition: background-color 0.2s ease, color 0.2s ease;
}

footer .wp-block-navigation a[href*="/demander-un-devis/"]:hover {
  background-color: var(--wp--preset--color--primary-blue);
  color: #ffffff !important;
}

/* Survol nom du site HEADER et FOOTER - Cohérence avec boutons */
header .wp-block-site-title a,
footer .wp-block-site-title a {
  display: inline-block;
  padding: 6px 8px;
  margin-left: -8px;
  border-radius: var(--radius-tuile);
  transition: background-color 0.2s ease, color 0.2s ease;
}

header .wp-block-site-title a:hover,
footer .wp-block-site-title a:hover {
  background-color: var(--wp--preset--color--hover-blue);
  color: #ffffff !important;
}

/* Titre et slogan — header + footer mobile +10% */
@media (max-width: 782px) {
  header .wp-block-site-title,
  footer .wp-block-site-title {
    font-size: 1.72rem !important;
  }
  header .wp-block-site-tagline,
  footer .wp-block-site-tagline {
    font-size: 1rem !important;
  }
}

/* Boutons réseaux sociaux FOOTER - Survol bleu sans décalage */
footer .wp-block-social-links {
  font-size: 2rem !important;
}

footer .wp-block-social-links .wp-social-link a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  border-radius: var(--radius-bouton);
  background-color: transparent;
  transition: background-color 0.2s ease;
}

footer .wp-block-social-links .wp-social-link a:hover {
  background-color: var(--wp--preset--color--hover-blue);
}

/* ==============================
   CORRECTIF — LIENS ORPHELINS FOOTER
   ==============================
   Cible les liens dans les colonnes du footer qui ne sont pas
   dans un <p> ou <li> (ex: liens dans titres, blocs HTML, liens isolés)
   Exclut les boutons, icônes sociales ET le lien "Demander un devis" pour éviter les conflits.
*/
footer .wp-block-columns a:not(.wp-block-button__link):not(.wp-block-social-link):not([href*="/demander-un-devis/"]) {
  border-radius: var(--radius-bouton);
  padding: 4px 8px;
  transition: background-color 0.2s ease, color 0.2s ease;
}

footer .wp-block-columns a:not(.wp-block-button__link):not(.wp-block-social-link):not([href*="/demander-un-devis/"]):hover {
  background-color: var(--wp--preset--color--hover-blue);
  color: #ffffff !important;
}

/* Sous-menu navigation - Fond bleu clair */
.wp-block-navigation .wp-block-navigation__submenu-container {
  background-color: #4A9FF5 !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
  border-radius: var(--radius-bouton) !important;
  overflow: hidden !important;
  z-index: 9999 !important;
}

/* Liens sous-menu - Taille réduite */
.wp-block-navigation .wp-block-navigation__submenu-container a {
  font-size: inherit !important;
  color: #ffffff !important;
  padding: 6px 12px !important;
  text-align: center !important;
  text-decoration: none !important;
  justify-content: center !important;
  width: 100% !important;
}

.wp-block-navigation__submenu-container .wp-block-navigation-item a:hover {
  background-color: var(--wp--preset--color--primary-blue) !important;
  color: #ffffff !important;
}

/* Sous-menu - Items centrés */
.wp-block-navigation__submenu-container .wp-block-navigation-item {
  display: flex !important;
  justify-content: center !important;
}

.wp-block-navigation__submenu-container .wp-block-navigation-item a {
  font-size: inherit !important;
  border-radius: var(--radius-bouton) !important;
  padding: 4px 8px !important;
  text-decoration: none !important;
}

.wp-block-navigation .wp-block-navigation-submenu__toggle {
  border-radius: var(--radius-bouton) !important;
}

/* Indicateur page active — barre bleu clair au-dessus, desktop uniquement */
@media (min-width: 601px) {
  /* Cas 1 : item avec lien <a> (current-menu-item / ancestor / aria-current sur a) */
  header .wp-block-navigation-item.current-menu-item > a,
  header .wp-block-navigation-item.current-menu-ancestor > a,
  header .wp-block-navigation-item > a[aria-current="page"] {
    position: relative;
  }

  header .wp-block-navigation-item.current-menu-item > a::after,
  header .wp-block-navigation-item.current-menu-ancestor > a::after,
  header .wp-block-navigation-item > a[aria-current="page"]::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 4px);
    height: 4px;
    background-color: var(--wp--preset--color--hover-blue);
    border-radius: 999px;
    pointer-events: none;
  }

  /* Cas 2 : item avec sous-menu où aria-current est sur le <button> toggle (ex. Ressources hub) */
  header .wp-block-navigation-item:has(> button[aria-current="page"]) {
    position: relative;
  }

  header .wp-block-navigation-item:has(> button[aria-current="page"])::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 4px);
    height: 4px;
    background-color: var(--wp--preset--color--hover-blue);
    border-radius: 999px;
    pointer-events: none;
  }
}

/* ==============================
   HUB RESSOURCES — Tuiles images
   ============================== */

body.page-ressources-hub .wp-block-column .wp-block-image {
  border-radius: var(--radius-tuile);
  overflow: hidden;
}

/* Cas 3 : Ressources hub — aucune classe active générée par FSE, ciblage via body class */
@media (min-width: 601px) {
  body.page-ressources-hub header .wp-block-navigation-item > a[href*="/ressources-editoriales/"] {
    position: relative;
  }

  body.page-ressources-hub header .wp-block-navigation-item > a[href*="/ressources-editoriales/"]::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 4px);
    height: 4px;
    background-color: var(--wp--preset--color--hover-blue);
    border-radius: 999px;
    pointer-events: none;
  }
}

/* ==============================
   BOUTONS — EFFET SURVOL PAR COULEUR
   Version complète et fonctionnelle
   ============================== */

.wp-block-button .wp-block-button__link {
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

/* Boutons ORANGE personnalisés → survol orange clair */
.wp-block-button__link.has-orange-button-background-color:hover,
.wp-block-button__link[class*="has-orange"]:hover {
  background-color: var(--wp--preset--color--orange-hover) !important;
  border-color: var(--wp--preset--color--orange-hover) !important;
  color: #fff !important;
}

/* Boutons accent-3 du thème parent (orange) → survol orange clair */
.wp-block-button__link.has-accent-3-background-color:hover {
  background-color: var(--wp--preset--color--orange-hover) !important;
  border-color: var(--wp--preset--color--orange-hover) !important;
  color: #fff !important;
}

/* Boutons BLEUS → survol bleu clair */
.wp-block-button__link.has-primary-blue-background-color:hover,
.wp-block-button__link.has-contrast-background-color:hover {
  background-color: var(--wp--preset--color--hover-blue) !important;
  border-color: var(--wp--preset--color--hover-blue) !important;
  color: #fff !important;
}

/* Boutons sans classe de couleur spécifique → survol bleu par défaut */
.wp-block-button__link:not([class*="has-"][class*="-background-color"]):hover {
  background-color: var(--wp--preset--color--hover-blue) !important;
  border-color: var(--wp--preset--color--hover-blue) !important;
  color: #fff !important;
}

/* Bouton taupe hero - Survol beige grisé (texte noir 80% constant) */
.wp-block-button__link.has-taupe-background-color:hover {
  background-color: #cccabd !important;
  border-color: #cccabd !important;
  color: rgba(51, 51, 51, 0.8) !important;
}

.wp-block-button__link.has-taupe-background-color {
  color: rgba(51, 51, 51, 0.8) !important;
}

/* ==============================
   ACCESSIBILITÉ - FOCUS CLAVIER
   :focus-visible = clavier uniquement (Tab)
   :focus = supprimé pour éviter contour au clic souris
   ============================== */

/* Suppression contour au clic souris (tous éléments) */
a:focus,
button:focus,
.wp-block-navigation a:focus,
.wp-block-button__link:focus,
p a:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* Anneau bleu UNIQUEMENT au focus clavier (accessibilité) */
a:focus-visible,
button:focus-visible,
.wp-block-navigation a:focus-visible,
.wp-block-button__link:focus-visible,
p a:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px #6493eb !important;
  transition: box-shadow 0.2s ease !important;
}

/* Masquage visuel accessible — contenu lisible par lecteurs d'écran et crawlers SEO */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Logo BnF (SVG inline) — réduction sur la page ISBN & dépôt légal */
.page-id-4571 main .wp-block-column svg {
  max-width: 200px;
  height: auto;
  display: block;
  margin-inline: 0 !important;
}

/* ==============================
   PAGE PORTFOLIO - FOND BEIGE
   ============================== */

body.page-id-169 main,
body.page-template-portfolio-ndle main {
  background-color: var(--wp--preset--color--background-beige) !important;
}

body.page-id-169 main>*,
body.page-template-portfolio-ndle main>* {
  background-color: var(--wp--preset--color--background-beige) !important;
}

/* ==============================
   LIENS "EN SAVOIR PLUS"
   ============================== */

a.en-savoir-plus {
  color: var(--wp--preset--color--primary-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 500;
  font-family: var(--wp--preset--font-family--manrope);
  transition: background-color 0.2s ease, color 0.2s ease;
}

a.en-savoir-plus:hover {
  background-color: var(--wp--preset--color--hover-blue);
  color: inherit;
  text-decoration: none;
  padding: 2px 6px;
  border-radius: var(--radius-bouton);
}

/* ==============================
   CAROUSEL SERVICES - SWIPER
   ============================== */

.services-carousel-swiper {
  position: relative;
  width: 100%;
  max-width: 1340px;
  margin: 0 auto;
  padding: 0;
  --swiper-pagination-bottom: 5px;
  overflow-x: clip; /* masque les slides hors-écran sans clipper le hover vertical */
}

.services-carousel-swiper .swiper {
  width: 100%;
  max-width: 1220px;
  margin: 0 auto;
  padding: 20px 20px 120px;
  position: relative;
  overflow: visible; /* écrase le overflow:hidden natif de Swiper.js */
}

.carousel-card {
  background: white;
  border-radius: var(--radius-tuile);
  padding: 2rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.carousel-card:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.carousel-card h4 {
  margin-top: 0;
  margin-bottom: 1rem;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--wp--preset--color--primary-blue);
  line-height: 1.3;
}

.carousel-card-content {
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--couleur-texte);
}

.carousel-card-content p {
  margin: 0.5rem 0;
}

/* Navigation Swiper */
.swiper-button-prev,
.swiper-button-next,
.swiper-button-play-pause {
  background: var(--wp--preset--color--primary-blue);
  color: white;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px var(--bleu-30);
  transition: all 0.3s ease;
  cursor: pointer;
  position: absolute;
  top: auto;
  bottom: 50px;
}

.swiper-button-prev {
  left: 50%;
  transform: translateX(calc(-50% - 80px));
}

.swiper-button-prev:after,
.swiper-button-next:after {
  font-size: 18px;
  font-weight: 900;
}

.swiper-button-play-pause {
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;
}

.swiper-button-next {
  left: 50%;
  transform: translateX(calc(-50% + 80px));
}

.swiper-button-prev:hover {
  background: var(--wp--preset--color--hover-blue);
  transform: translateX(calc(-50% - 80px)) scale(1.1);
  box-shadow: 0 6px 20px rgba(58, 150, 242, 0.4);
}

.swiper-button-next:hover {
  background: var(--wp--preset--color--hover-blue);
  transform: translateX(calc(-50% + 80px)) scale(1.1);
  box-shadow: 0 6px 20px rgba(58, 150, 242, 0.4);
}

.swiper-button-play-pause:hover {
  background: var(--wp--preset--color--hover-blue);
  transform: translateX(-50%) scale(1.1);
  box-shadow: 0 6px 20px rgba(58, 150, 242, 0.4);
}

.swiper-button-play-pause svg {
  display: block;
}

/* Pagination */
.swiper-pagination {
  position: relative !important;
  margin-top: 20px;
  bottom: auto !important;
  text-align: center;
}

.swiper-pagination-bullet {
  background: var(--wp--preset--color--primary-blue);
  opacity: 0.4;
  width: 12px;
  height: 12px;
}

.swiper-pagination-bullet-active {
  opacity: 1;
  background: var(--wp--preset--color--primary-blue);
}

/* Hauteur égale cartes */
.swiper-wrapper {
  align-items: stretch;
}

.swiper-slide {
  height: auto;
  display: flex;
}

/* Mobile */
@media (max-width: 768px) {
.services-carousel-swiper {
    padding: 40px 0 0px;
    max-width: none;
    width: calc(100% + (2 * var(--wp--preset--spacing--50)));
    margin-left: calc(-1 * var(--wp--preset--spacing--50)) !important;
    margin-right: calc(-1 * var(--wp--preset--spacing--50)) !important;
    position: relative;
    overflow: hidden;
  }

.services-carousel-swiper .swiper {
    padding: 20px 0 0px;
    max-width: none;
    margin: 0;
  }

.services-carousel-swiper .swiper::before,
  .services-carousel-swiper .swiper::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 3rem;
    z-index: 20;
    pointer-events: none;
  }

  .services-carousel-swiper .swiper::before {
    left: 0;
    background: linear-gradient(to right, var(--wp--preset--color--base) 0%, transparent 100%);
  }

  .services-carousel-swiper .swiper::after {
    right: 0;
    background: linear-gradient(to left, var(--wp--preset--color--base) 0%, transparent 100%);
  }
  
/* Cards compactes - troncature texte */
  .carousel-card-content {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .carousel-card-content.is-expanded {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
  }

  .carousel-card-toggle {
    display: block;
    background: none;
    border: none;
    color: var(--wp--preset--color--primary-blue);
    font-weight: 600;
    font-size: 0.875rem;
    cursor: pointer;
    padding: 0.5rem 0 0;
    font-family: var(--wp--preset--font-family--manrope);
  }

  .carousel-card-toggle:hover {
    text-decoration: underline;
  }

  .carousel-card:hover {
    transform: none;
  }

  .swiper-button-prev,
  .swiper-button-next {
    display: none;
  }

 .swiper-button-play-pause {
    display: none !important;
  }

  .carousel-card {
    min-height: 280px;
  }
}

/* Desktop: masquer bouton toggle carousel */
@media (min-width: 769px) {
  .carousel-card-toggle {
    display: none !important;
  }
}

/* ==============================
   BLOC CITATION - Style par défaut restauré
   ============================== */

.wp-block-quote {
  background-color: #ffffff;
  padding: 2rem;
  max-width: 1340px;
  margin-left: auto;
  margin-right: auto;
}

/* Citation dans l'éditeur */
.editor-styles-wrapper .wp-block-quote {
  background-color: #ffffff;
  padding: 2rem;
  border-left: 4px solid var(--wp--preset--color--primary-blue);
}

/* ==============================
   FORMULAIRE DEVIS - Style complet et cohérent
   ============================== */

/* Conteneur formulaire */
.wpforms-container {
  max-width: 1300px;
  margin: 0 auto;
  padding: 2rem;
  background-color: #ffffff;
  border-radius: var(--radius-bouton);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* Labels - Manrope + taille alignée */
.wpforms-field-label {
  font-weight: 600;
  color: var(--wp--preset--color--primary-blue);
  margin-bottom: 0.5rem;
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.667), 1.3rem);
  font-family: var(--wp--preset--font-family--manrope);
  line-height: 1.4;
}

/* Descriptions */
.wpforms-field-description {
  font-size: clamp(0.8125rem, 0.8125rem + ((1vw - 0.2rem) * 0.5), 1.125rem);
  color: var(--couleur-texte-secondaire);
  margin-top: 0.25rem;
  font-family: var(--wp--preset--font-family--manrope);
  line-height: 1.5;
}

/* Champs de saisie - pleine largeur + taille texte alignée */
.wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field input[type="tel"],
.wpforms-field input[type="number"],
.wpforms-field select,
.wpforms-field textarea {
  width: 100% !important;
  max-width: 99% !important;
  border: 2px solid #e0e0e0;
  border-radius: var(--radius-bouton);
  padding: 0.75rem 1rem;
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.667), 1.3rem);
  font-family: var(--wp--preset--font-family--manrope);
  line-height: 1.6;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.wpforms-field input:focus,
.wpforms-field select:focus,
.wpforms-field textarea:focus {
  border-color: var(--wp--preset--color--primary-blue);
  box-shadow: 0 0 0 3px rgba(47, 122, 197, 0.1);
  outline: none;
}

/* Conteneur des champs en pleine largeur */
.wpforms-field-container .wpforms-field {
  width: 100% !important;
}

.wpforms-field-medium,
.wpforms-field-large {
  width: 100% !important;
}

/* Champ Nom (First/Last) - reset fieldset padding natif navigateur */
.wpforms-field-name fieldset,
#wpforms-1044-field_1-container fieldset {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Champ Nom (First/Last) - 2 inputs côte à côte FORCÉ */
.wpforms-field-name .wpforms-field-row,
#wpforms-1044-field_1-container .wpforms-field-row,
#wpforms-619-field_3-container fieldset>div {
  display: flex !important;
  flex-direction: row !important;
  width: 100% !important;
  gap: 0 !important;
  padding: 0 !important;
  padding-inline-start: 0 !important;
}

.wpforms-field-name .wpforms-field-row-block,
.wpforms-field-name .wpforms-one-half,
#wpforms-1044-field_1-container .wpforms-field-row-block,
#wpforms-619-field_3-container .wpforms-field-row-block {
  flex: 1 !important;
  width: 50% !important;
  max-width: 50% !important;
  float: none !important;
  display: block !important;
  padding-left: 0 !important;
  padding-right: 0.5rem !important;
}

.wpforms-field-name .wpforms-field-row-block:last-child,
.wpforms-field-name .wpforms-one-half:last-child,
#wpforms-1044-field_1-container .wpforms-field-row-block:last-child,
#wpforms-619-field_3-container .wpforms-field-row-block:last-child {
  padding-right: 0 !important;
  padding-left: 0.5rem !important;
}

.wpforms-field-name input[type="text"],
.wpforms-field-name-first,
.wpforms-field-name-last {
  width: 100% !important;
  max-width: 100% !important;
}

.wpforms-field-name .wpforms-field-sublabel {
  font-size: 0.875rem;
  color: var(--couleur-texte-secondaire);
  font-family: var(--wp--preset--font-family--manrope);
  margin-top: 0.25rem;
  display: block;
}

/* Écraser les largeurs par défaut de WPForms */
.wpforms-container input.wpforms-field-medium,
.wpforms-container select.wpforms-field-medium,
.wpforms-container textarea.wpforms-field-medium,
.wpforms-container input.wpforms-field-large,
.wpforms-container select.wpforms-field-large,
.wpforms-container textarea.wpforms-field-large,
.wpforms-container .wpforms-field-row.wpforms-field-medium,
.wpforms-container .wpforms-field-row.wpforms-field-large {
  max-width: 100% !important;
  width: 100% !important;
}

/* Responsive - empiler sur mobile */
@media (max-width: 768px) {

  .wpforms-field-name .wpforms-field-row,
  #wpforms-619-field_3-container fieldset>div,
  #wpforms-1044-field_1-container .wpforms-field-row {
    flex-direction: column !important;
    gap: 0 !important;
  }

  .wpforms-field-name .wpforms-field-row-block,
  .wpforms-field-name .wpforms-field-row-block:last-child,
  .wpforms-field-name .wpforms-one-half,
  .wpforms-field-name .wpforms-one-half:last-child,
  #wpforms-619-field_3-container .wpforms-field-row-block,
  #wpforms-619-field_3-container .wpforms-field-row-block:last-child,
  #wpforms-1044-field_1-container .wpforms-field-row-block,
  #wpforms-1044-field_1-container .wpforms-field-row-block:last-child {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Radio buttons et checkboxes */
.wpforms-field-radio li,
.wpforms-field-checkbox li {
  margin-bottom: 0.75rem;
}

.wpforms-field-radio input[type="radio"],
.wpforms-field-checkbox input[type="checkbox"] {
  margin-right: 0.5rem;
  width: 18px;
  height: 18px;
  accent-color: var(--wp--preset--color--primary-blue);
}

.wpforms-field-radio label,
.wpforms-field-checkbox label {
  font-weight: 400;
  color: var(--couleur-texte);
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.667), 1.3rem);
  font-family: var(--wp--preset--font-family--manrope);
  line-height: 1.6;
}

/* Espacement entre champs */
.wpforms-field {
  margin-bottom: 1.75rem;
}

/* Bouton submit - centré + hover coordonné */
.wpforms-submit-container {
  text-align: center;
  margin-top: 2.5rem !important;
}

.wpforms-submit-container button {
  background-color: var(--wp--preset--color--orange-button) !important;
  color: #ffffff !important;
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  padding: 1rem 2.5rem !important;
  border: none !important;
  border-radius: var(--radius-bouton) !important;
  cursor: pointer !important;
  font-family: var(--wp--preset--font-family--manrope) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
  transition: background-color 0.2s ease, border-color 0.2s ease !important;
}

.wpforms-submit-container button:hover {
  background-color: var(--wp--preset--color--orange-hover) !important;
  border-color: var(--wp--preset--color--orange-hover) !important;
}

/* Message de confirmation */
.wpforms-confirmation-container {
  background-color: #e8f5e9;
  border-left: 4px solid #4caf50;
  padding: 1.5rem;
  border-radius: var(--radius-bouton);
  margin-top: 2rem;
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.667), 1.3rem);
  font-family: var(--wp--preset--font-family--manrope);
  line-height: 1.6;
}

/* ==============================
   TITRES DE SECTION (champs lecture seule)
   ============================== */

.wpforms-field.section-title input[readonly] {
  display: none !important;
}

.wpforms-field.section-title .wpforms-field-label {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--wp--preset--color--primary-blue);
  font-family: var(--wp--preset--font-family--manrope);
  letter-spacing: 0.5px;
  margin-top: 2.5rem;
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--wp--preset--color--black);
  display: block;
}

.wpforms-field-container .wpforms-field.section-title:first-child .wpforms-field-label {
  margin-top: 0.5rem;
}

.wpforms-field.section-title .wpforms-field-description {
  display: none;
}

.wpforms-field.section-title {
  margin-bottom: 1rem;
}

/* Responsive */
@media (max-width: 768px) {
  .wpforms-container {
    padding: 1.5rem 1rem;
  }

  .wpforms-submit-container button {
    width: 100%;
    padding: 1rem !important;
  }
}

/* ==============================
   LISTES - Version finale et stable
   ============================== */

/* Retirer les styles par défaut WordPress UNIQUEMENT pour listes non ordonnées (ul) */
main ul.wp-block-list,
.wp-site-blocks>* ul.wp-block-list {
  list-style: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 1340px !important;
}

/* Listes à puces standard (ul) - UN SEUL pseudo-élément */
main ul.wp-block-list:not(.liste-fleches):not(.liste-coches):not(.liste-croix):not(.liste-etoiles):not(.liste-chevrons):not(.liste-diamants):not(.liste-tirets) li {
  position: relative;
  padding-left: 1.8rem;
  line-height: 1.55;
  list-style: none !important;
}

main ul.wp-block-list:not(.liste-fleches):not(.liste-coches):not(.liste-croix):not(.liste-etoiles):not(.liste-chevrons):not(.liste-diamants):not(.liste-tirets) li::before {
  content: "●";
  position: absolute;
  left: 0.3rem;
  top: 0;
  color: currentColor;
  font-size: 1.2rem;
  line-height: 1.5;
}

/* Listes ordonnées (ol) - Numéros */
main ol.wp-block-list {
  list-style-type: decimal !important;
  padding-left: 2rem !important;
  margin-left: 0 !important;
}

main ol.wp-block-list li {
  padding-left: 0.5rem;
  line-height: 1.55;
  list-style-type: decimal !important;
}

main ol.wp-block-list li::marker {
  font-weight: 600;
  color: currentColor;
}

/* Pas de pseudo-élément sur les listes ordonnées */
main ol.wp-block-list li::before {
  content: none !important;
  display: none !important;
}

/* Listes avec flèches - classe personnalisée */
.liste-fleches {
  list-style: none !important;
  padding-left: 0 !important;
}

.liste-fleches li {
  position: relative;
  padding-left: 1.8rem;
  line-height: 1.55;
  list-style: none !important;
}

.liste-fleches li::before {
  content: "→";
  position: absolute;
  left: 0;
  top: 0;
  color: currentColor;
  font-weight: 600;
  line-height: 1.55;
}

/* Forcer AUCUNE puce native sur les ul uniquement */
main ul.wp-block-list li,
.liste-fleches li {
  list-style-type: none !important;
}

/* Listes dans colonnes */
.wp-block-columns ul.wp-block-list {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.wp-block-columns ol.wp-block-list {
  padding-left: 2rem !important;
}

/* Listes hors groupe - contenues dans 1340px */
.wp-site-blocks>.wp-block-list {
  max-width: 1340px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100%;
  box-sizing: border-box;
}

/* Padding responsive pour listes sans parent */
@media (min-width: 1340px) {
  .wp-site-blocks>.wp-block-list {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

@media (max-width: 1339px) {
  .wp-site-blocks>.wp-block-list {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}

/* Protection navigation - AUCUN style de liste */
.wp-block-navigation ul,
.wp-block-navigation li,
header ul,
header li,
nav ul,
nav li,
.wp-block-navigation__container,
.wp-block-navigation__container li {
  list-style: none !important;
  padding-left: 0 !important;
}

.wp-block-navigation li::before,
header ul li::before,
nav ul li::before {
  content: none !important;
  display: none !important;
}

/* Listes imbriquées */
main ul.wp-block-list li ul,
main ul.wp-block-list li ol {
  margin-top: 0.5rem;
  margin-left: 1.8rem;
}

main ol.wp-block-list li ol {
  margin-top: 0.5rem;
  list-style-type: lower-alpha !important;
}

/* ==============================
   BOUTON RETOUR EN HAUT
   ============================== */

.back-to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: var(--wp--preset--color--pink-magenta);
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 9999;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  transition: transform 0.3s ease, background-color 0.3s ease;
  border: none;
}

.back-to-top:hover {
  transform: translateY(-5px);
  background-color: #d978b5;
}

.back-to-top svg.icon {
  width: 24px;
  height: 24px;
  fill: #ffffff;
  position: relative;
  z-index: 2;
}

.progress-ring {
  position: absolute;
  width: 60px;
  height: 60px;
  z-index: 1;
}

.progress-ring circle {
  fill: none;
  stroke: #ffffff;
  stroke-width: 4;
  stroke-linecap: round;
  transform: rotate(-90deg);
  transform-origin: center;
}

/* Masquer sur mobile */
@media (max-width: 768px) {
  .back-to-top {
    display: none !important;
  }
}

/* ==============================
   PUCES & SYMBOLES TYPOGRAPHIQUES
   Uniquement glyphes (pas d'emoji)
   ============================== */

/* Liste avec coches de validation */
.liste-coches {
  list-style: none !important;
  padding-left: 0 !important;
}

.liste-coches li {
  position: relative;
  padding-left: 1.8rem;
  line-height: 1.55;
}

.liste-coches li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.3em;
  color: currentColor;
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.5;
}

/* Liste avec croix (points négatifs) */
.liste-croix {
  list-style: none !important;
  padding-left: 0 !important;
}

.liste-croix li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: 0.5rem;
  line-height: 1.55;
}

.liste-croix li::before {
  content: "✗";
  position: absolute;
  left: 0;
  top: 0.3em;
  color: currentColor;
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1.5;
}

/* Liste avec étoiles */
.liste-etoiles {
  list-style: none !important;
  padding-left: 0 !important;
}

.liste-etoiles li {
  position: relative;
  padding-left: 1.8rem;
  line-height: 1.55;
}

.liste-etoiles li::before {
  content: "★";
  position: absolute;
  left: 0;
  top: 0.3em;
  color: currentColor;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
}

/* Liste avec tirets cadratins */
.liste-tirets {
  list-style: none !important;
  padding-left: 0 !important;
}

.liste-tirets li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: 0.5rem;
  line-height: 1.55;
}

.liste-tirets li::before {
  content: "—";
  position: absolute;
  left: 0;
  top: 0;
  color: currentColor;
  font-weight: 400;
  line-height: 1.5;
}

/* Liste avec chevrons */
.liste-chevrons {
  list-style: none !important;
  padding-left: 0 !important;
}

.liste-chevrons li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: 0.5rem;
  line-height: 1.55;
}

.liste-chevrons li::before {
  content: "›";
  position: absolute;
  left: 0;
  top: 0.1em;
  color: currentColor;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1.3;
}

/* Liste avec diamants */
.liste-diamants {
  list-style: none !important;
  padding-left: 0 !important;
}

.liste-diamants li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: 0.5rem;
  line-height: 1.55;
}

.liste-diamants li::before {
  content: "◆";
  position: absolute;
  left: 0.2rem;
  top: 0.4rem;
  color: currentColor;
  font-size: 0.8rem;
  line-height: 1.8;
}

/* Symboles inline (dans le texte) */
.symbole {
  font-weight: 600;
  margin-right: 0.25rem;
}

/* Encadrement texte ASCII */
.encadre-typo {
  border: 2px solid currentColor;
  padding: 1.5rem;
  margin: 2rem 0;
  font-family: var(--wp--preset--font-family--manrope);
}

/* Signature typographique */
.signature-typo {
  font-family: var(--wp--preset--font-family--titles-serif);
  font-style: italic;
  color: var(--wp--preset--color--primary-blue);
  margin-top: 1rem;
}

/* ==============================
   FAQ - ACCORDÉONS AMÉLIORÉS
   ============================== */

/* FORCER PLEINE LARGEUR UNIQUEMENT SUR PAGE FAQ */
.page-template-default .wp-block-columns .wp-block-group.has-background,
.page-template-default .wp-block-column .is-style-arrow-icon-details {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Questions (fermées) */
.is-style-arrow-icon-details summary {
  color: var(--wp--preset--color--primary-blue) !important;
  font-weight: 600;
  cursor: pointer;
  padding: 1rem !important;
  margin: 0 !important;
  background-color: var(--bleu-08);
  border-radius: var(--radius-tuile);
  transition: background-color 0.2s ease, border-radius 0.2s ease;
}

.is-style-arrow-icon-details summary:hover {
  background-color: var(--bleu-12);
}

/* Accordéon fermé */
.is-style-arrow-icon-details:not([open]) {
  margin-bottom: 0.75rem;
}

/* Questions ouvertes */
.is-style-arrow-icon-details[open] summary {
  border-radius: 20px 20px 0 0 !important;
  background-color: var(--bleu-12);
}

/* Bloc réponse */
.is-style-arrow-icon-details[open] {
  background-color: #f2f2f2;
  border-radius: var(--radius-tuile);
  padding: 0 1rem 1rem 1rem;
  margin-bottom: 0.75rem;
  padding-top: 0 !important;
}

/* Premier élément de contenu */
.is-style-arrow-icon-details[open]> :not(summary):first-of-type {
  margin-top: 0;
  padding-top: 1rem;
}

/* Éléments de réponse */
.is-style-arrow-icon-details p,
.is-style-arrow-icon-details ul,
.is-style-arrow-icon-details ol,
.is-style-arrow-icon-details .wp-block-list {
  background-color: transparent !important;
  color: #333333 !important;
  margin-bottom: 0.75rem !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

.is-style-arrow-icon-details> :last-child {
  margin-bottom: 0 !important;
}

.is-style-arrow-icon-details ul,
.is-style-arrow-icon-details ol {
  padding-left: 1.5rem !important;
}

.is-style-arrow-icon-details li {
  color: #333333 !important;
  margin-bottom: 0.5rem;
}

.is-style-arrow-icon-details li:last-child {
  margin-bottom: 0;
}

/* ==============================
   FAQ PERSONNALISÉE — BLOC SUR MESURE
   ============================== */

.faq-container {
  max-width: 1340px;
  margin: 0 auto;
  padding: 2rem 1.5rem;
}

.faq-container h1 {
  color: var(--wp--preset--color--hover-blue);
  margin-bottom: 1rem;
}

.faq-intro {
  margin-bottom: 2rem;
  color: var(--couleur-texte-secondaire);
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.667), 1.3rem);
}

.faq-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  margin-bottom: 2rem;
}

@media (max-width: 768px) {
  .faq-columns {
    grid-template-columns: 1fr;
  }
}

/* Tuiles beiges */
.faq-section {
  background-color: var(--wp--preset--color--background-beige);
  border-radius: var(--radius-tuile);
  padding: 1.5rem;
  margin-bottom: 2rem;
}

.faq-section-title {
  color: var(--wp--preset--color--orange-button);
  margin-top: 0;
  margin-bottom: 1.5rem;
  font-size: clamp(1.35rem, 1.35rem + ((1vw - 0.2rem) * 1.050), 2.40rem);
  font-family: var(--wp--preset--font-family--titles-serif);
  line-height: 1.2;
}

/* FAQ Ressources — titres olive */
.faq-ressources h1 {                                                                                                             
    color: var(--wp--preset--color--olive);                                                                                        
  }               

  .faq-ressources .faq-section-title {
    color: var(--couleur-titre);
  }

/* Question (button) */
.faq-item {
  margin-bottom: 0.75rem;
}

.faq-item:last-child {
  margin-bottom: 0;
}

.faq-question {
  width: 100%;
  background-color: var(--bleu-08);
  color: var(--wp--preset--color--primary-blue);
  border: none;
  border-radius: var(--radius-tuile);
  padding: 1rem;
  text-align: left;
  font-size: clamp(0.984rem, 0.984rem + ((1vw - 0.2rem) * 0.809), 1.5rem);
  font-weight: 600;
  font-family: var(--wp--preset--font-family--body);
  cursor: pointer;
  transition: background-color 0.2s ease;
  position: relative;
  padding-left: 3rem;
  line-height: 1.55;
  outline: none !important;
  box-shadow: none !important;
}

.faq-question::before {
  content: "→ ";
  position: absolute;
  left: 1rem;
  transition: transform 0.3s ease;
}

.faq-item.open .faq-question::before {
  transform: rotate(90deg);
}

.faq-question:hover {
  background-color: var(--bleu-12);
}

/* Question ouverte */
.faq-item.open .faq-question {
  background-color: var(--bleu-12);
  border-radius: 20px 20px 0 0;
  margin-bottom: 0;
}

/* Réponse */
.faq-answer {
  max-height: 0;
  overflow: hidden;
  background-color: #f2f2f2;
  border-radius: 0 0 20px 20px;
  transition: max-height 0.4s ease, padding 0.4s ease;
  padding: 0 1rem;
}

.faq-item.open .faq-answer {
  max-height: 2000px;
  padding: 1rem;
  margin-bottom: 0.75rem;
}

.faq-answer p,
.faq-answer ul,
.faq-answer ol {
  margin: 0 0 0.75rem 0;
  color: var(--couleur-texte);
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.667), 1.3rem);
  font-family: var(--wp--preset--font-family--manrope);
  line-height: 1.55;
}

.faq-answer p:last-child,
.faq-answer ul:last-child,
.faq-answer ol:last-child {
  margin-bottom: 0;
}

.faq-answer ul,
.faq-answer ol {
  padding-left: 1.5rem;
}

.faq-answer li {
  margin-bottom: 0.5rem;
  font-size: clamp(0.875rem, 0.875rem + ((1vw - 0.2rem) * 0.667), 1.3rem);
  font-family: var(--wp--preset--font-family--manrope);
  line-height: 1.55;
}

.faq-answer li:last-child {
  margin-bottom: 0;
}

.faq-footer {
  text-align: center;
  margin-top: 3rem;
  font-size: clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.196), 16px);
}

.faq-footer a {
  color: var(--wp--preset--color--primary-blue);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: background-color 0.2s ease;
  padding: 2px 6px;
  border-radius: var(--radius-bouton);
}

.faq-footer a:hover {
  background-color: var(--wp--preset--color--hover-blue);
  text-decoration: none;
}

.faq-question:focus,
.faq-question:focus-visible,
.faq-question:active {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* ==============================
   NAVIGATION MOBILE - COMPLET ET FONCTIONNEL
   ============================== */

/* Bouton hamburger */
.wp-block-navigation__responsive-container-open {
  color: var(--wp--preset--color--black);
}

.wp-block-navigation__responsive-container-open:hover {
  color: var(--wp--preset--color--hover-blue);
}

/* Overlay - Fond noir transparent */
.wp-block-navigation__responsive-container.is-menu-open {
  background-color: rgba(0, 0, 0, 0.75) !important;
  padding: 0 !important;
}

/* Container dialog - Flex column avec bouton X en bas */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: center !important;
  min-height: 100vh !important;
  position: relative !important;
  overflow-y: auto !important;
  padding-top: 2rem !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
  padding: 0 !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  flex-grow: 0 !important;
  min-height: auto !important;
}

/* Exception page Sites d'Auteurs - Neutraliser double centrage */
.page-id-3296 .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
  justify-content: center !important;
  align-items: center !important;
}

/* Liste - Pleine largeur, SANS gap */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Items - Pleine largeur */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-content: center !important;
}

/* Liens - Pleine largeur, centrés, MAJUSCULES */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a {
  display: block !important;
  width: 100% !important;
  color: #ffffff !important;
  font-size: clamp(1.4rem, 1.4rem + ((1vw - 0.2rem) * 1.5), 2.2rem) !important;
  font-family: var(--wp--preset--font-family--system-sans-serif) !important;
  font-weight: 500 !important;
  text-align: center !important;
  padding: 1.25rem 0 !important;
  margin: 0 !important;
  text-decoration: none !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  transition: background-color 0.2s ease;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

/* Sous-menu mobile - Hiérarchie visuelle + Neutraliser current-menu-ancestor */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a,
.wp-block-navigation__responsive-container.is-menu-open .current-menu-ancestor .wp-block-navigation__submenu-container a {
  font-size: clamp(1.125rem, 1.125rem + ((1vw - 0.2rem) * 1.35), 1.8rem) !important;
  font-weight: normal !important;
  text-transform: none !important;
  padding: 1rem 0 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  text-align: center !important;
  background-color: rgba(255, 255, 255, 0.06) !important;
}

/* Tiret devant les liens enfants mobile */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a::before {
  content: "—";
  margin-right: 0.4em;
  opacity: 0.6;
}

/* Sous-menu mobile - Forçage label */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__label {
  display: inline !important;
  width: auto !important;
  text-align: center !important;
}

/* Neutraliser current-menu-ancestor mobile */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.current-menu-ancestor>a {
  color: #ffffff !important;
  background-color: transparent !important;
  text-align: center !important;
  display: block !important;
  width: 100% !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Forcer classe centrage sur sous-menu mobile */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
}

/* Forcer centrage items sous-menu mobile */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
  align-items: center !important;
}

/* Forcer centrage sous-menu mobile - button WordPress */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container button.wp-block-navigation-item__content {
  text-align: center !important;
  width: 100% !important;
  display: block !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container a {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.current-menu-ancestor .wp-block-navigation__submenu-container a {
  text-align: center !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  flex-direction: row !important;
}

/* Masquer descriptions dans menu mobile */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__description {
  display: none !important;
}

/* Hover */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:hover,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:focus,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:active {
  color: #ffffff !important;
  background-color: rgba(58, 150, 242, 0.3) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Sous-menu mobile - Supprimer radius (global, pas seulement is-menu-open) */
@media (max-width: 600px) {
  .wp-block-navigation .wp-block-navigation__submenu-container {
    border-radius: 0 !important;
  }
}

/* Sous-menu mobile ouvert - harmoniser avec parents */
/* CORRECTIF: Supprimer TOUS les radius sur le menu mobile ouvert (Parents et Enfants - normal, hover, focus, active) */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:hover,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:focus,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:active,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
  border-radius: 0 !important;
  width: 100% !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
  width: 100% !important;
  align-items: stretch !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a:hover,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a:focus,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item a:active {
  background-color: rgba(58, 150, 242, 0.3) !important;
  color: #ffffff !important;
}

/* Page active - Texte jaune uniquement */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a[aria-current="page"] {
  color: #ffd745 !important;
  background-color: transparent !important;
}

/* FORCER Accueil sans fond bleu si pas vraiment actif */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:first-child a {
  background-color: transparent !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:first-child a[aria-current="page"] {
  color: #ffd745 !important;
  background-color: transparent !important;
}

/* Bouton X - Positionné en bas */
.wp-block-navigation__responsive-container-close {
  color: #ffffff !important;
  outline: none !important;
  box-shadow: none !important;
  position: absolute !important;
  bottom: 2rem !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 64px !important;
  height: 64px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.wp-block-navigation__responsive-container-close svg {
  width: 36px !important;
  height: 36px !important;
  stroke-width: 3 !important;
}

/* Icône hamburger 3 lignes */
.wp-block-navigation__responsive-container-open svg {
  display: none !important;
}

/* ============================================
   BLOC ESPACEMENT - HAUTEUR PAR DÉFAUT 25px
   ============================================ */

/* Forcer 25px pour tous les blocs Espacement sans hauteur personnalisée */
.wp-block-spacer:not([style*="height"]) {
  height: 25px !important;
  min-height: 25px !important;
}

/* Pour les blocs avec hauteur inline à 100px (défaut WP), forcer 25px */
.wp-block-spacer[style*="height: 100px"],
.wp-block-spacer[style*="height:100px"] {
  height: 25px !important;
}

/* Neutraliser le padding global WordPress sur les groupes/colonnes des articles */
.single-post .no-global-padding.has-global-padding {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* Alignement vertical boutons OFFRES - Page Sites d'Auteurs */
.page-id-3296 #offres .wp-block-column>.wp-block-group {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  min-height: 100% !important;
}

/* Section VALEUR AUTEURS - Images colonnes responsive */
.page-id-3296 .section-valeur-auteurs .wp-block-column .wp-block-image {
  text-align: left;
  margin-left: 0;
  margin-right: auto;
}

@media (max-width: 782px) {
  .page-id-3296 .section-valeur-auteurs .wp-block-column .wp-block-image {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Section "Une vitrine à la hauteur" — Icônes section 1 : suppression clamp() qui écrasait les tailles mobile */

/* ========================================
   Portfolio - Neutraliser padding global pour pleine largeur
   Page Portfolio uniquement (ID: 169)
   ======================================== */

.page-id-169 .entry-content.has-global-padding,
.page-id-169 .wp-block-query.alignfull.has-global-padding {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

@media (max-width: 781px) {

  .page-id-169 .entry-content.has-global-padding,
  .page-id-169 .wp-block-query.alignfull.has-global-padding {
    padding-left: var(--wp--preset--spacing--50) !important;
    padding-right: var(--wp--preset--spacing--50) !important;
  }
}

/* ==============================
   FORÊT ISBN - Grille Optimale Dynamique
   ============================== */

.foret-isbn-container {
  position: relative;
}

.foret-isbn-grid-custom {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  width: 100%;
  min-height: 100vh;
  padding: 0;
  margin: 0;
  justify-content: center;
  list-style: none !important;
  position: relative;
  z-index: 1;
}

.foret-isbn-grid-custom .isbn-item {
  margin: 0;
  padding: 0;
  opacity: 0;
  animation: fadeInStagger 0.5s ease forwards;
  line-height: 0;
}

@keyframes fadeInStagger {
  to {
    opacity: 1;
  }
}

.foret-isbn-grid-custom .ean-barcode {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.foret-isbn-grid-custom .ean-barcode img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease, filter 0.2s ease;
}

.foret-isbn-grid-custom .ean-barcode:hover img {
  transform: scale(1.15);
  filter: brightness(1.1);
  z-index: 10;
  position: relative;
}

.foret-isbn-grid-custom .ean-placeholder {
  aspect-ratio: 1.41;
  background: linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  text-align: center;
  width: 100%;
  height: 100%;
  transition: transform 0.3s ease, filter 0.2s ease;
}

.foret-isbn-grid-custom .ean-barcode:hover .ean-placeholder {
  transform: scale(1.15);
  filter: brightness(1.05);
  z-index: 10;
  position: relative;
}

.foret-isbn-grid-custom .ean-placeholder span {
  font-family: 'Courier New', monospace;
  font-size: clamp(0.7rem, 1.5vw, 0.9rem);
  font-weight: 700;
  color: var(--wp--preset--color--primary-blue);
  margin-bottom: 0.5rem;
}

.foret-isbn-grid-custom .ean-placeholder small {
  font-size: clamp(0.6rem, 1.2vw, 0.75rem);
  color: var(--couleur-texte-secondaire);
  line-height: 1.2;
}

.foret-isbn-esc-badge {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(47, 122, 197, 0.95);
  color: white;
  padding: 1rem 2rem;
  border-radius: var(--radius-bouton);
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1.125rem;
  font-weight: 700;
  z-index: 99999;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  pointer-events: all !important;
  transition: background-color 0.3s ease;
}

.foret-isbn-esc-badge:hover {
  background: rgba(58, 150, 242, 0.95);
}

@media (max-width: 768px) {
  .foret-isbn-grid-custom {
    grid-template-columns: repeat(3, 1fr);
  }

  .foret-isbn-esc-badge {
    font-size: 1rem;
    padding: 0.875rem 1.5rem;
  }
}

/* ==============================
   CAS CLIENT — CARROUSEL
   ============================== */

.cas-client-slider {
  max-width: 900px;
  position: relative;
  margin: 0 auto;
  padding: 2rem 0 100px 0;
}

.cas-client-swiper {
  position: relative;
  width: 100%;
  height: 900px;
  overflow: hidden;
  padding-bottom: 20px;
}

.cas-client-swiper .swiper-slide {
  display: flex;
  height: 900px;
  align-items: center;
}

.cas-client-swiper .swiper-slide a {
  display: block;
  cursor: pointer;
}

.cas-client-swiper .swiper-slide img {
  width: 576px;
  height: 900px;
  object-fit: cover;
  object-position: top;
  border-radius: var(--radius-tuile);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transition: transform 0.3s ease;
}

.cas-client-swiper .swiper-slide img:hover {
  transform: scale(1.02);
}

.cas-client-swiper .swiper-slide::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 150px;
  background: linear-gradient(to top, #ffffff 0%, transparent 100%);
  pointer-events: none;
  z-index: 2;
}

/* Conteneur contrôles centrés */
.cas-client-slider .swiper-button-prev,
.cas-client-slider .swiper-button-next,
.cas-client-slider .swiper-button-play-pause {
  background: var(--wp--preset--color--primary-blue);
  color: white;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px var(--bleu-30);
  transition: all 0.3s ease;
  cursor: pointer;
  top: auto;
  bottom: 50px;
}

.cas-client-slider .swiper-button-prev {
  left: 50%;
  transform: translateX(calc(-50% - 80px));
}

.cas-client-slider .swiper-button-prev:after,
.cas-client-slider .swiper-button-next:after {
  font-size: 18px;
  font-weight: 900;
}

.cas-client-slider .swiper-button-play-pause {
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;
}

.cas-client-slider .swiper-button-next {
  left: 50%;
  transform: translateX(calc(-50% + 80px));
}

.cas-client-slider .swiper-button-prev:hover,
.cas-client-slider .swiper-button-next:hover,
.cas-client-slider .swiper-button-play-pause:hover {
  background: var(--wp--preset--color--hover-blue);
  box-shadow: 0 6px 20px rgba(58, 150, 242, 0.4);
}

.cas-client-swiper .swiper-pagination {
  position: relative !important;
  margin-top: 20px;
  bottom: auto !important;
}

.cas-client-swiper .swiper-pagination-bullet {
  background: var(--wp--preset--color--primary-blue);
  opacity: 0.4;
  width: 12px;
  height: 12px;
}

.cas-client-swiper .swiper-pagination-bullet-active {
  opacity: 1;
  background: var(--wp--preset--color--primary-blue);
}

.cas-client-caption {
  text-align: center;
  color: var(--couleur-texte-secondaire);
  font-size: 1rem;
  font-style: italic;
  margin: 1rem 0 0 0;
  font-family: var(--wp--preset--font-family--manrope);
  min-height: 28px;
  font-weight: 500;
}

.cas-client-description {
  text-align: center;
  color: var(--couleur-texte-secondaire);
  font-size: 0.95rem;
  font-style: italic;
  margin-top: 1.5rem;
  font-family: var(--wp--preset--font-family--manrope);
}

/* GLightbox : réactiver interactions + scroll vertical image zoomée */
.glightbox-clean .gslide-media,
.glightbox-clean .gslide-media.gslide-image,
.glightbox-clean .gslide-media img {
  pointer-events: auto !important;
  -webkit-user-drag: none;
  user-select: none;
}

.gslide-image {
  overflow-y: auto !important;
  max-height: 100vh;
  -webkit-overflow-scrolling: touch;
}

.gslide-image img.zoomed-in {
  max-height: none !important;
  max-width: none !important;
  height: auto !important;
  cursor: zoom-out !important;
}

/* GLightbox : scroll quand image zoomée */
.glightbox-container {
  touch-action: pan-y !important;
}

.gslide-image.is-zoomed-wrapper {
  display: block !important;
  overflow-y: auto !important;
  touch-action: pan-y !important;
}

.is-zoomed-wrapper img.zoomed-in {
  flex-shrink: 0 !important;
  max-width: none !important;
  max-height: none !important;
  height: auto !important;
  /* width : piloté par JS (naturalWidth) — pas de !important ici */
}

/* CAS CLIENT - Responsive Mobile */
@media (max-width: 768px) {

  /* Groupe principal - Réduction padding vertical */
  .page-id-3296 .wp-block-group[style*="padding-top:5rem"] {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  /* H3 sous-titre - Réduction margin-bottom */
  .page-id-3296 h3.wp-block-heading.has-text-align-center {
    margin-bottom: 2rem !important;
  }

  /* Slider - Padding et centrage */
  .cas-client-slider {
    padding: 1.5rem 0 120px 0;
    max-width: 100%;
    margin: 0 auto;
  }

  .cas-client-swiper .swiper-wrapper {
    width: 100% !important;
  }

  /* Forcer lien <a> 100% slide - Casse dépendance circulaire */
  .cas-client-swiper .swiper-slide a {
    width: 100%;
    display: block;
  }

  /* Conteneur Swiper - Hauteur fixe */
  .cas-client-swiper {
    height: 55vh !important;
    min-height: 450px !important;
    max-height: 550px !important;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }

  /* Slides - Structure simplifiée */
  .cas-client-swiper .swiper-slide {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    margin: 0 !important;
    height: 100%;
    width: 100% !important;
  }

  /* Images - Comportement desktop */
  .cas-client-swiper .swiper-slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: top center !important;
    margin: 0 auto;
  }

  /* Contrôles - Largeur adaptative */
  .cas-client-controls {
    display: none !important;
  }
}

/* FIX Menu mobile page Sites d'Auteurs - Forcer alignement centre */
.page-id-3296 .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container {
  align-items: center !important;
  justify-content: center !important;
}
/* ==============================
   DÉGRADÉS SECTIONS HERO — Classes additionnelles
   Assigner manuellement via "Classes CSS avancées" éditeur
   ============================== */

/* Base partagée — positionnement + overflow */
.hero-jaune,
.hero-bourgogne,
.hero-bleu,
.hero-bleu-ciel,
.hero-olive {
  position: relative;
  overflow: hidden;
}

/* Grain — identique sur toutes les variantes hero */
.hero-jaune::before,
.hero-bourgogne::before,
.hero-bleu::before,
.hero-bleu-ciel::before,
.hero-olive::before {
  content: "";
  position: absolute;
  inset: 0;
  filter: url(#grain-filter);
  opacity: 0.20;
  pointer-events: none;
  z-index: 1;
}

/* Dégradés individuels par variante */
/* Accueil — Jaune (Ambre → Jaune Vif, 20deg) */
.hero-jaune     { background: linear-gradient(20deg, #f5ad39 0%, #ffd94f 45%, #ffd94f 100%) !important; }
/* Services — Bourgogne (20deg) */
.hero-bourgogne { background: linear-gradient(20deg, #4f262c 0%, #6b3a3f 100%) !important; }
/* Sites d'Auteurs — Bleu (20deg) */
.hero-bleu      { background: linear-gradient(20deg, var(--wp--preset--color--primary-blue) 0%, #4a95d9 33%, #4a95d9 100%) !important; }
/* Devis — Bleu ciel (90deg horizontal) */
.hero-bleu-ciel { background: linear-gradient(90deg, #5ba5e8 0%, #8bc6fd 100%) !important; }
/* Ressources — Vert olive (20deg) */
.hero-olive     { background: linear-gradient(20deg, #4a5a2e 0%, #6b7a3f 100%) !important; }

/* ==============================
   HERO COVER — Bloc Bannière avec icône (classe additionnelle hero-cover)
   ============================== */

/* Pages ressources — neutralise le min-height par défaut de WP sur le Cover */
.hero-ressource .hero-cover,
.hero-ressource .wp-block-cover { min-height: auto !important; }

/* Padding gauche/haut/bas à 0 */
.hero-cover {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
  overflow: visible !important;
}
.hero-cover .wp-block-cover__inner-container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
  position: relative;
  z-index: 2;
}

/* Méthode A : image en arrière-plan natif du bloc Bannière */
.hero-cover img.wp-block-cover__image-background {
  object-fit: contain !important;
  max-width: 600px !important;
  margin-left: auto !important;
}

/* Méthode B : image en bloc Image dans une colonne */
.hero-cover .hero-icon img {
  max-width: 600px;
  height: auto;
}

/* Mobile : image sous le H1 */
@media (max-width: 782px) {
  .hero-cover {
    display: flex !important;
    flex-direction: column !important;
    min-height: auto !important;
  }
  .hero-cover .wp-block-cover__background {
    display: none !important; /* retire le dim overlay qui masquerait l'image repositionnée */
  }
  .hero-cover .wp-block-cover__inner-container {
    position: relative !important;
    order: 1;
    z-index: 2;
  }
  .hero-cover img.wp-block-cover__image-background {
    position: relative !important;
    order: 2;
    width: 100% !important;
    max-width: 600px !important;
    height: auto !important;
    object-fit: contain !important;
    margin: 0 auto !important;
  }
  .hero-cover .hero-icon img {
    max-width: 100%;
    height: auto;
  }
}

/* ==============================
   INFOBULLES CURSEUR — Boutons CTA hero accueil (.tooltip-cta-1 / .tooltip-cta-2)
   data-tooltip injecté dynamiquement par js/tooltips.js au mouseenter
   ============================== */

[data-tooltip]::after {
  content: attr(data-tooltip);
  position: fixed;
  left: var(--tooltip-x, 0);
  top: var(--tooltip-y, 0);
  transform: translate(14px, -110%);
  background: #1a1a1a;
  color: #ffffff;
  font-family: var(--wp--preset--font-family--manrope), sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.4;
  padding: 6px 12px;
  border-radius: 8px;
  white-space: nowrap;
  pointer-events: none;
  z-index: 9999;
}

/* ==============================
   INFOBULLE DOM — Glyphes typographiques (HTML riche)
   Injecté par js/tooltips.js — élément #glyph-tooltip
   ============================== */

#glyph-tooltip {
  display: none;
  position: fixed;
  background: rgba(0, 0, 0, 0.95);
  color: #ffffff;
  font-family: var(--wp--preset--font-family--manrope), sans-serif;
  font-size: 0.9rem;
  font-weight: 400;
  line-height: 1.5;
  padding: 1.5rem;
  border-radius: var(--radius-tuile);
  max-width: 360px;
  pointer-events: none;
  z-index: 9999;
}

#glyph-tooltip .glyph-icon {
  display: block;
  font-family: "Iowan Old Style", "Apple Garamond", Baskerville, "Times New Roman", "Droid Serif", Times, "Source Serif Pro", serif;
  font-size: 2.5em;
  line-height: 1;
  margin-bottom: 0.4em;
}

#glyph-tooltip .glyph-nom {
  font-weight: 600;
}

#glyph-tooltip .glyph-label {
  text-decoration: underline;
  text-underline-offset: 2px;
}

#glyph-dismiss {
  display: none;
  position: fixed;
  top: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.85);
  color: rgba(255, 255, 255, 0.75);
  font-family: var(--wp--preset--font-family--manrope), sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  padding: 0;
  border-radius: var(--radius-tuile);
  cursor: pointer;
  white-space: nowrap;
  z-index: 10000;
  transition: opacity 0.35s ease;
}

#glyph-dismiss:hover {
  color: #ffffff;
  background: rgba(0, 0, 0, 0.95);
}

#glyph-dismiss .glyph-dismiss-label {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.6rem 1.4rem;
}

#glyph-dismiss .glyph-dismiss-cb {
  width: 1em;
  height: 1em;
  cursor: pointer;
  accent-color: #ffffff;
  flex-shrink: 0;
}

h1[class*="is-style-"],
h2[class*="is-style-"],
h3[class*="is-style-"],
h4[class*="is-style-"],
h5[class*="is-style-"],
h6[class*="is-style-"] {
  position: relative;
}

.glyph-info-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -3em;
  left: 0;
  width: 1em;
  height: 1em;
  font-size: 0.4em;
  font-family: var(--wp--preset--font-family--titles-serif);
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  color: color-mix(in srgb, currentColor 85%, transparent);
  background: color-mix(in srgb, currentColor 35%, transparent);
  border: 1.5px solid color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 50%;
  cursor: pointer;
  user-select: none;
  pointer-events: auto;
  transition: background 0.2s ease, color 0.2s ease, opacity 0.35s ease;
}

.glyph-info-icon:hover {
  color: currentColor;
  background: color-mix(in srgb, currentColor 50%, transparent);
}

@keyframes glyph-icon-bounce {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.6); }
  55%  { transform: scale(0.85); }
  75%  { transform: scale(1.2); }
  90%  { transform: scale(0.95); }
  100% { transform: scale(1); }
}

.glyph-icon-bounce {
  animation: glyph-icon-bounce 0.5s ease forwards;
}

/* ==============================
   GRAIN GLOBAL — tous éléments avec fond dans main (.has-background)
   Grain par section — inner-container et images au-dessus (z-index: 2)
   ============================== */

/* Sections pleine largeur uniquement — tuiles (dans wp-block-column) exclues */
main .has-background.alignfull,
main .has-background.alignwide {
  position: relative;
  overflow: hidden;
}

main .has-background.alignfull::before,
main .has-background.alignwide::before {
  content: "";
  position: absolute;
  inset: 0;
  filter: url(#grain-filter);
  opacity: 0.20;
  pointer-events: none;
  z-index: 1;
}

/* Contenu au-dessus du grain — tous enfants directs */
main .has-background.alignfull > *,
main .has-background.alignwide > * {
  position: relative;
  z-index: 2;
}

/* Tuiles dans colonnes — grain désactivé (les tuiles sont toujours dans wp-block-column) */
main .wp-block-column .has-background.alignfull,
main .wp-block-column .has-background.alignwide {
  overflow: visible;
}
main .wp-block-column .has-background.alignfull::before,
main .wp-block-column .has-background.alignwide::before {
  content: none;
}
main .wp-block-column .has-background.alignfull > *,
main .wp-block-column .has-background.alignwide > * {
  position: static;
  z-index: auto;
}

/* Images jamais sous grain */
body > main img,
body > main figure,
body > main picture {
  position: relative;
  z-index: 2;
}

/* ==============================
   TEXTURE TRAME — Classe CSS personalisable additionnels [scan-lines-texture]
   ============================== */

.scan-lines-texture {
  position: relative;
  overflow: hidden;
}

.scan-lines-texture > * {
  position: relative;
  z-index: 2;
}

/* Images jamais sous grain — heroes + scan-lines-texture */
.hero-jaune img, .hero-jaune figure, .hero-jaune picture,
.hero-bourgogne img, .hero-bourgogne figure, .hero-bourgogne picture,
.hero-bleu img, .hero-bleu figure, .hero-bleu picture,
.hero-bleu-ciel img, .hero-bleu-ciel figure, .hero-bleu-ciel picture,
.hero-olive img, .hero-olive figure, .hero-olive picture,
.scan-lines-texture img, .scan-lines-texture figure, .scan-lines-texture picture {
  position: relative;
  z-index: 2;
}

.scan-lines-texture::before {
  content: "";
  position: absolute;
  inset: 0;
  filter: url(#grain-filter);
  opacity: 0.20;
  pointer-events: none;
  z-index: 1;
}

/* ==============================
   ALIGNEMENT VERTICAL COLONNES — PRIORITÉ MAXIMALE (fin fichier)
   Force display: flex sur colonnes enfants avec is-vertically-aligned-top
   Écrase règles natives WordPress is-layout-flow
   ============================== */
.wp-block-column.is-vertically-aligned-top {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
}

/* Supprimer padding gauche/droit <main> — Glossaire éditorial */
.page-glossaire-editorial main.has-global-padding {
  padding-inline: 0 !important;
}

/* Supprimer padding gauche/droit <main> — FAQ Ressources éditoriales */
.page-faq-ressources main.has-global-padding {
  padding-inline: 0 !important;
}

/* ==============================
   PUBLIER SON LIVRE — /ressources/publier-son-livre/
   ============================== */

/* Sommaire ancres */
.ressources-sommaire {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 3rem;
  padding: 1rem 1.25rem;
  background: rgba(255, 255, 255, 0.55);
  border-radius: var(--radius-tuile);
}

.ressources-sommaire a {
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  font-weight: 600;
  color: var(--couleur-texte);
  text-decoration: none;
  padding: 0.3rem 0.9rem;
  background: rgba(92, 107, 58, 0.08);
  border-radius: var(--radius-tuile);
  transition: background 0.2s, color 0.2s;
}

.ressources-sommaire a:hover {
  background: var(--wp--preset--color--olive);
  color: #fff;
  text-decoration: none;
}

/* scroll-margin pour header fixe */
.publier-son-livre h2.wp-block-heading {
  scroll-margin-top: 6rem;
}

/* ==============================
   GLOSSAIRE ÉDITORIAL — /ressources/glossaire-editorial/
   ============================== */

.glossaire-container {
  max-width: 1340px;
  margin: 0 auto;
  padding: 2rem 1.5rem;
}

.glossaire-container > h1 {
  color: var(--wp--preset--color--olive);
  margin-bottom: 1rem;
}

.glossaire-intro {
  max-width: 72ch;
  margin-bottom: 3rem;
}

/* Navigation sections */
.glossaire-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 3rem;
  padding: 1rem 1.25rem;
  background: rgba(255, 255, 255, 0.45);
  border-radius: var(--radius-tuile);
}

.glossaire-nav a {
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  font-weight: 600;
  color: var(--couleur-texte);
  text-decoration: none;
  padding: 0.3rem 0.9rem;
  border: none;
  border-radius: var(--radius-tuile);
  transition: background 0.2s, color 0.2s;
}

.glossaire-nav a:hover {
  background: var(--wp--preset--color--olive);
  color: #fff;
  text-decoration: none;
}

/* Sommaire page Publier son livre */
.publier-sommaire {
  padding-top: 3rem;
  padding-bottom: 0;
}

.publier-sommaire .glossaire-nav {
  margin: 0;
}

/* Champ de recherche */
.glossaire-search-wrapper {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 2rem;
}

.glossaire-search-input {
  flex: 1;
  max-width: 480px;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: var(--wp--preset--font-size--medium);
  color: var(--couleur-texte);
  background: rgba(255, 255, 255, 0.7);
  border: 1.5px solid rgba(92, 107, 58, 0.3);
  border-radius: var(--radius-bouton);
  padding: 0.6rem 1rem;
  outline: none;
  transition: border-color 0.2s, background 0.2s;
}

.glossaire-search-input:focus {
  border-color: var(--wp--preset--color--olive);
  background: #fff;
}

.glossaire-reset-btn {
  padding: 0.65rem 1.2rem;
  border: 2px solid var(--wp--preset--color--contrast);
  border-radius: var(--radius-bouton);
  background-color: var(--wp--preset--color--background-beige);
  color: var(--wp--preset--color--contrast);
  font-family: var(--wp--preset--font-family--manrope);
  font-size: clamp(0.8rem, 0.8rem + ((1vw - 0.2rem) * 0.5), 1.1rem);
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.glossaire-reset-btn:hover {
  background-color: var(--wp--preset--color--hover-blue);
  border-color: var(--wp--preset--color--hover-blue);
  color: #fff;
}

.glossaire-reset-btn:focus-visible {
  outline: 2px solid var(--wp--preset--color--hover-blue);
  outline-offset: 2px;
}

.glossaire-search-count {
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 0.85rem;
  color: var(--couleur-texte-secondaire);
  white-space: nowrap;
}

.glossaire-no-results {
  margin: 0 1.5rem 2rem;
  font-family: var(--wp--preset--font-family--manrope);
  font-style: italic;
  color: var(--couleur-texte-secondaire);
}

/* Illustration colonne gauche */
.glossaire-illustration {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-tuile);
}

/* Grille 2 colonnes */
.glossaire-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
}

.glossaire-col {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

/* Tuiles sections */
.glossaire-section {
  background-color: var(--wp--preset--color--background-beige);
  border-radius: var(--radius-tuile);
  padding: 1.5rem;
}

.glossaire-section-title {
  color: var(--couleur-titre);
  font-family: var(--wp--preset--font-family--titles-serif);
  font-size: clamp(1.35rem, 1.35rem + ((1vw - 0.2rem) * 1.050), 2.40rem);
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--wp--preset--color--olive);
}

/* Termes */
.glossaire-list {
  margin: 0;
  padding: 0;
}

.glossaire-term {
  margin-bottom: 1.25rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid rgba(92, 107, 58, 0.18);
}

.glossaire-term:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.glossaire-term dt {
  font-family: var(--wp--preset--font-family--manrope);
  font-weight: 700;
  font-size: var(--wp--preset--font-size--medium);
  color: var(--wp--preset--color--olive);
  margin-bottom: 0.2rem;
}

.glossaire-term dd {
  margin: 0;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: var(--wp--preset--font-size--medium);
  line-height: 1.6;
  color: var(--couleur-texte);
}

.glossaire-voir-aussi {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.82em;
  color: var(--couleur-texte-secondaire);
  font-style: italic;
}

.glossaire-voir-aussi a {
  color: var(--wp--preset--color--primary-blue);
}

/* Index alphabétique — pleine largeur */
.glossaire-section--index {
  margin: 3rem 1.5rem 0;
}

.glossaire-section--index .glossaire-index {
  column-count: 3;
  column-gap: 2rem;
}

.glossaire-section--index .glossaire-index p {
  margin-bottom: 0.6rem;
  font-size: var(--wp--preset--font-size--medium);
  break-inside: avoid;
}

/* Pied de page */
.glossaire-footer {
  margin-top: 2rem;
  padding: 0 1.5rem 2rem;
  font-size: 0.9rem;
  color: #555;
  text-align: center;
}

/* Mobile */
@media (max-width: 768px) {
  .ressources-sommaire {
    flex-direction: column;
  }
  .glossaire-nav {
    flex-direction: column;
  }
  .glossaire-columns {
    grid-template-columns: 1fr;
  }
  .glossaire-section--index .glossaire-index {
    column-count: 1;
  }
}

/* ================================================
   GLIGHTBOX — PROTECTION SUPERPOSITION INFOGRAPHIES
   ================================================ */
.glightbox-container .gslide-media {
  position: relative;
}
.glightbox-container .gslide-media::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 10;
  pointer-events: none;
}
.glightbox-container .gslide-media img {
  -webkit-user-drag: none;
}

/* ================================================
   Espacement uniforme entre blocs wp:columns consécutifs
   Global (desktop + mobile) : padding-bottom incohérent → remplacé par margin-top systématique
   Cause : certains wp:columns ont padding-bottom, d'autres non → espaces irréguliers
   ================================================ */
main .wp-block-columns {
  padding-bottom: 0 !important;        /* Neutralise padding-bottom source d'incohérence */
}
main .wp-block-columns + .wp-block-columns {
  margin-top: 3rem !important;         /* Espace uniforme entre blocs colonnes consécutifs */
}

/* Mobile uniquement — gap vertical uniforme entre tuiles empilées */
@media (max-width: 600px) {
  main .wp-block-columns {
    row-gap: 3rem !important;          /* Gap uniforme entre colonnes empilées sur mobile */
  }
}

/* ================================================
   SIMULATEUR DE RENTABILITÉ ÉDITORIALE
   Page /ressources/simulateur-edition/
   ================================================ */

.calc-edition-wrapper {
  max-width: 1340px;
  margin: 0 auto;
  padding: 0;
  font-family: var(--wp--preset--font-family--manrope);
  color: #333;
}

/* --- Notice pédagogique --- */
.calc-notice {
  background-color: var(--wp--preset--color--background-olive-light);
  border-left: 4px solid var(--wp--preset--color--olive);
  border-radius: 8px;
  padding: 1rem 1.5rem;
  margin-bottom: 2.5rem;
  font-size: 1rem;
  color: #464646;
}
.calc-notice p { margin: 0; }

/* --- Champ titre projet --- */
.calc-titre-projet-field {
  margin: 1.5rem 0 0.5rem;
}
.calc-titre-projet-field label {
  display: block;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  font-weight: 600;
  color: #464646;
  margin-bottom: 0.4rem;
}
.calc-titre-projet-field input[type="text"] {
  width: 100%;
  max-width: 1340px;
  padding: 0.75rem 1rem 1rem;
  margin-bottom: 1rem;
  border: 1.5px solid #c8c5bf;
  border-radius: 20px;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  color: #333;
  background: #fff;
  box-sizing: border-box;
}
.calc-titre-projet-field input[type="text"]:focus {
  outline: none;
  border-color: var(--wp--preset--color--olive);
}
.calc-titre-projet-field input[type="text"]::placeholder {
  color: #bbb;
  font-style: italic;
}

/* --- Champs meta : pages + type de livre --- */
.calc-meta-fields {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  margin-bottom: 1.5rem;
}
.calc-field-pages {
  flex: 0 0 auto;
}
.calc-field-pages label {
  display: block;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  font-weight: 600;
  color: #464646;
  margin-bottom: 0.4rem;
}
.calc-field-pages input[type="number"] {
  width: 130px;
  padding: 0.65rem 1rem;
  border: 1.5px solid #c8c5bf;
  border-radius: 20px;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  color: #333;
  background: #fff;
  box-sizing: border-box;
}
.calc-field-pages input[type="number"]:focus {
  outline: none;
  border-color: var(--wp--preset--color--olive);
}
.calc-field-type {
  flex: 1 1 auto;
}
.calc-field-type > label {
  display: block;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  font-weight: 600;
  color: #464646;
  margin-bottom: 0.4rem;
}
.calc-type-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.calc-type-btn {
  padding: 0.4rem 0.9rem;
  border: 1.5px solid #c8c5bf;
  border-radius: 20px;
  background: #fff;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 0.88rem;
  color: #464646;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.calc-type-btn:hover {
  border-color: var(--wp--preset--color--olive);
}
.calc-type-btn.is-active {
  border-color: var(--wp--preset--color--olive);
  background: var(--wp--preset--color--background-olive-light);
  color: #333;
  font-weight: 600;
}
@media (max-width: 600px) {
  .calc-meta-fields { flex-direction: column; gap: 1rem; }
}

/* --- Colonnes --- */
.calc-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  margin-bottom: 2.5rem;
}

.calc-col {
  background-color: var(--wp--preset--color--background-beige);
  border-radius: 20px;
  padding: 1.75rem;
}

/* Accent olive sur le header Parcours A */
.calc-col-a .calc-col-header {
  border-bottom: 2px solid var(--wp--preset--color--olive);
  padding-bottom: 1rem;
  margin-bottom: 1.5rem;
}
.calc-col-b .calc-col-header {
  border-bottom: 2px solid #bbb;
  padding-bottom: 1rem;
  margin-bottom: 1.5rem;
}

.calc-col-label {
  display: inline-block;
  background-color: #888;
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.2em 0.7em;
  border-radius: 4px;
  margin-bottom: 0.5rem;
}
.calc-col-b .calc-col-label {
  background-color: var(--wp--preset--color--olive);
}

.calc-col-title {
  font-family: var(--wp--preset--font-family--titles-serif);
  font-size: clamp(1.1rem, 1.1rem + ((1vw - 0.2rem) * 0.7), 1.5rem);
  line-height: 1.2;
  color: #464646;
  margin: 0.3rem 0 0.5rem;
}

.calc-col-intro {
  font-size: 1rem;
  color: #666;
  margin: 0;
}

/* --- Champs formulaire --- */
.calc-field {
  margin-bottom: 1.1rem;
}

.calc-field label {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  color: #464646;
  margin-bottom: 0.35rem;
}

.calc-field input[type="number"],
.calc-field select {
  width: 100%;
  padding: 0.55rem 0.75rem;
  border: 1.5px solid #c8c5bf;
  border-radius: 8px;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  color: #333;
  background: #fff;
  box-sizing: border-box;
  transition: border-color 0.2s;
}
.calc-field input[type="number"]:focus,
.calc-field select:focus {
  outline: none;
  border-color: var(--wp--preset--color--olive);
}

.calc-field input[type="range"].calc-slider {
  width: 100%;
  accent-color: var(--wp--preset--color--olive);
  margin-top: 0.3rem;
}
.calc-slider-labels {
  display: flex;
  justify-content: space-between;
  font-size: 1rem;
  color: #888;
  margin-top: 0.2rem;
}

.calc-optional {
  font-weight: 400;
  color: #999;
  font-size: 1rem;
}

/* --- Résultats --- */
.calc-results {
  margin-top: 1.5rem;
  border-top: 1px solid #d8d4ce;
  padding-top: 1rem;
}

.calc-result-block {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.calc-result-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid #e8e4df;
  font-size: 1rem;
}
.calc-result-row:last-child { border-bottom: none; }

.calc-result-key {
  font-weight: 700;
  font-size: 1rem;
  color: #333;
}

.calc-result-seuil {
  background-color: var(--wp--preset--color--background-olive-light);
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  margin: 0.5rem 0;
  border-bottom: none;
}

.calc-seuil-val {
  font-size: 1.15rem !important;
  font-weight: 800;
  color: var(--wp--preset--color--olive) !important;
}

.calc-result-val { font-weight: 600; white-space: nowrap; }
.calc-positive { color: #3a7a3a; }
.calc-negative { color: #c0392b; }

.calc-result-scenarios { margin-top: 0.75rem; }
.calc-scenarios-title {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #888;
  margin-bottom: 0.4rem;
}

.calc-alert {
  background: #fff3cd;
  border-left: 3px solid #e6a817;
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  color: #664d00;
  margin: 0.5rem 0 0;
}
.calc-info {
  background: #eef4e8;
  border-left: 3px solid var(--wp--preset--color--olive);
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  color: #3a4a20;
  margin: 0.5rem 0 0;
}

/* --- Comparaison --- */
.calc-comparison {
  background-color: var(--wp--preset--color--background-beige);
  border-radius: 20px;
  padding: 1.75rem;
  margin-bottom: 2.5rem;
}

.calc-comparison-title {
  font-family: var(--wp--preset--font-family--titles-serif);
  font-size: clamp(1rem, 1rem + ((1vw - 0.2rem) * 0.5), 1.35rem);
  color: #464646;
  margin: 0 0 1.25rem;
}

.calc-compare-table { width: 100%; }

.calc-compare-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 1rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid #e8e4df;
  font-size: 1rem;
  align-items: center;
}
.calc-compare-row:last-of-type { border-bottom: none; }

.calc-compare-head {
  font-size: 1rem;
  font-weight: 700;
  color: #888;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding-bottom: 0.6rem;
}
.calc-compare-cola { color: var(--wp--preset--color--olive); font-weight: 600; }
.calc-compare-colb { font-weight: 600; }

.calc-compare-equalpoint {
  margin-top: 1rem;
  padding: 0.75rem 1rem;
  background-color: var(--wp--preset--color--background-olive-light);
  border-radius: 8px;
  font-size: 1rem;
  color: #3a4a20;
}
.calc-compare-note,
.calc-compare-partial {
  font-size: 1rem;
  color: #666;
  margin: 0;
}

/* --- Export --- */
.calc-export {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  margin-bottom: 2rem;
}

.calc-export button {
  background-color: var(--wp--preset--color--olive);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 0.65rem 1.3rem;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s, opacity 0.2s;
}
.calc-export button:hover { background-color: #4a5630; }
.calc-export button:disabled { opacity: 0.5; cursor: not-allowed; }

.calc-export-email {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}

/* Cases RGPD */
.calc-rgpd {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0.5rem 0 0.25rem;
}
.calc-rgpd-label {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 1rem;
  color: #666;
  line-height: 1.5;
  cursor: pointer;
}
.calc-rgpd-label input[type="checkbox"] {
  margin-top: 0.2rem;
  flex-shrink: 0;
  accent-color: var(--wp--preset--color--olive);
  width: 1rem;
  height: 1rem;
  cursor: pointer;
}
.calc-rgpd-label a {
  color: var(--wp--preset--color--olive);
  text-decoration: underline;
}
.calc-rgpd-optional {
  color: #666;
}
.calc-export-email input[type="email"] {
  padding: 0.6rem 0.9rem;
  border: 1.5px solid #c8c5bf;
  border-radius: 8px;
  font-family: var(--wp--preset--font-family--manrope);
  font-size: 1rem;
  width: 220px;
}
.calc-export-email input[type="email"]:focus {
  outline: none;
  border-color: var(--wp--preset--color--olive);
}

.calc-export-msg {
  font-size: 1rem;
  padding: 0.4rem 0.75rem;
  border-radius: 6px;
  display: none;
}
.calc-export-msg--ok    { background: #eef4e8; color: #3a4a20; }
.calc-export-msg--warn  { background: #fff3cd; color: #664d00; }
.calc-export-msg--error { background: #fdecea; color: #8b1a1a; }
.calc-export-msg--info  { background: #f0f0f0; color: #555; }

/* --- Disclaimer légal --- */
.calc-legal {
  background-color: #f5f4f2;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  font-size: 1rem;
  color: #777;
  line-height: 1.6;
}
.calc-legal p { margin: 0; }
.calc-legal strong { color: #555; }
.calc-legal a { color: var(--wp--preset--color--olive); }

/* Placeholder gris clair — champs calculateur */
.calc-field input::placeholder,
.calc-export-email input[type="email"]::placeholder {
  color: #bbb;
  font-style: italic;
}

/* --- Responsive mobile --- */
@media (max-width: 700px) {
  .calc-columns {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .calc-export {
    flex-direction: column;
    align-items: flex-start;
  }
  .calc-export-email { width: 100%; }
  .calc-export-email input[type="email"] { width: 100%; }
  .calc-compare-row {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
  }
  .calc-compare-col0 {
    grid-column: 1 / -1;
    font-weight: 700;
    color: #464646;
    padding-bottom: 0.2rem;
  }
}