/*
Theme Name: Bettina BAIS
Theme URI: https://bettinabais.fr
Author: BIZNET SOLUTION
Description: Thème bloc sur mesure du cabinet de psychothérapie Bettina BAIS. Contenus 100 % éditables dans l'éditeur de blocs.
Version: 1.0.4
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bettina-bais
Tags: block-theme, full-site-editing, one-column, blog
*/

/* ==========================================================================
   Jetons
   ========================================================================== */
:root {
  --bleu: #0BA5C0;
  --bleu-fonce: #09849A;
  --bleu-clair: #7CC9D4;
  --terra: #C98F7A;
  --terra-fonce: #B27762;
  --gris: #D9E6E9;
  --fond: #F5F9FA;
  --texte: #2B3A42;
  --texte-doux: #4A5B64;
  --blanc: #FFFFFF;

  --serif: Cardo, Georgia, serif;
  --sans: Lato, system-ui, sans-serif;

  --r-xl: 40px;
  --r-l: 28px;
  --r-m: 20px;
  --r-s: 14px;
  /* Galets organiques des formes terracotta */
  --galet-1: 62% 48% 54% 30% / 58% 52% 48% 42%;
  --galet-2: 56% 52% 40% 44% / 64% 50% 50% 36%;
  --galet-3: 60% 44% 50% 34% / 54% 58% 42% 46%;

  --ombre: 0 18px 50px -24px rgba(9, 132, 154, .28), 0 2px 8px -4px rgba(43, 58, 66, .08);
  --ombre-douce: 0 10px 30px -18px rgba(9, 132, 154, .30);

  --largeur: 1200px;
  --gouttiere: clamp(16px, 4vw, 40px);
  --grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.17  0 0 0 0 0.23  0 0 0 0 0.26  0 0 0 .05 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --grain-fort: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .22 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");

  /* Espacements : jetons de theme.json, modifiables dans Apparence › Éditeur › Styles */
  --esp-section: var(--wp--preset--spacing--80, clamp(64px, 8vw, 110px));
  --esp-bloc: var(--wp--preset--spacing--60, clamp(48px, 6vw, 80px));

  /* Textures des formes décoratives */
  --blob-bleu: var(--grain-fort), url("assets/img/fond-aquarelle.png") center / 260% no-repeat;
  --blob-clair: var(--grain-fort), radial-gradient(circle at 35% 30%, #FFFFFF, #DDEFF2 55%, #B9DFE6);
  --blob-terra: var(--grain-fort), radial-gradient(circle at 32% 28%, #E7BFAF, var(--terra) 58%, var(--terra-fonce));
  --ombre-terra: 0 16px 30px -16px rgba(178, 119, 98, .55);
}

/* ==========================================================================
   Base
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: clip; }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: 18px;
  line-height: 1.6;
  color: var(--texte);
  background-color: var(--fond);
  background-image:
    var(--grain),
    radial-gradient(1200px 700px at 110% 40%, rgba(124, 201, 212, .14), transparent 60%),
    radial-gradient(900px 600px at -10% 75%, rgba(217, 230, 233, .9), transparent 60%);
  overflow-x: clip;
}
img { max-width: 100%; height: auto; display: block; } /* height:auto : sinon l'attribut height des blocs image l'emporte sur aspect-ratio */
a { color: var(--bleu); text-decoration-thickness: 1px; text-underline-offset: 4px; transition: color .2s; }
a:hover { color: var(--bleu-fonce); }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid var(--bleu); outline-offset: 3px; border-radius: 6px; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--serif);
  font-weight: 700;
  line-height: 1.2;
  margin: 0 0 .5em;
  color: var(--bleu);
  text-wrap: balance;
  hyphens: none;
}
h1 { font-size: clamp(32px, 4.2vw, 48px); }
h2 { font-size: clamp(28px, 3.4vw, 40px); }
h3 { font-size: 32px; }
h4 { font-size: 24px; color: var(--bleu-fonce); }
h5 { font-size: 22px; color: var(--bleu-fonce); }
h6 { font-size: 20px; color: var(--bleu-fonce); }
p { margin: 0 0 1em; }

/* Neutralisation de l'espacement automatique de Gutenberg : blockGap à 0 dans
   theme.json, et ce filet À SPÉCIFICITÉ NULLE (jamais « .wp-block-group > * »,
   qui écraserait toutes les marges des composants). */
:where(.wp-block-group) > :where(*), :where(.wp-block-buttons) { margin-block: 0; }
/* WordPress remet margin-block-end à 0 sur chaque enfant de groupe
   (« :root :where(.is-layout-flow) > * », spécificité 0,1,0, imprimée AVANT cette
   feuille). On rétablit le rythme de la maquette à spécificité égale : cette feuille
   gagne par l'ordre, et les règles des composants, plus bas, gardent la main. */
:root :where(.is-layout-flow, .is-layout-constrained, .wp-block-details) > :where(p) { margin-block-end: 1em; }
:root :where(.is-layout-flow, .is-layout-constrained) > :where(h1, h2, h3, h4, h5, h6) { margin-block-end: .5em; }
figure.wp-block-image { margin: 0; }
.wp-block-image img { width: 100%; }

/* Texte justifié (retour client) */
.justifie, .justifie p, .justifie li { text-align: justify; hyphens: auto; -webkit-hyphens: auto; }

section[id], .wp-block-group[id] { scroll-margin-top: 90px; }
#qui-suis-je { scroll-margin-top: 0; }
.wrap { width: min(var(--largeur), 100% - 2 * var(--gouttiere)); margin-inline: auto; }

.surtitre {
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--bleu-fonce);
  margin: 0 0 14px;
}
.entete-section { max-width: 760px; margin: 0 auto 48px; text-align: center; }
.entete-section h2 { margin-bottom: 0; }

/* Donnée provisoire à modifier (surligneur natif de l'éditeur) */
mark.has-inline-color { padding: 0 4px; border-radius: 4px; }

/* ==========================================================================
   Icônes : pictos de la charte en masques CSS (aucun SVG dans le contenu)
   ========================================================================== */
.ico-heart            { --ico: url("assets/icons/heart.svg"); }
.ico-sun              { --ico: url("assets/icons/sun.svg"); }
.ico-user             { --ico: url("assets/icons/user-alt.svg"); }
.ico-plant            { --ico: url("assets/icons/plant.svg"); }
.ico-chat             { --ico: url("assets/icons/chat-box-message.svg"); }
.ico-moon             { --ico: url("assets/icons/moon.svg"); }
.ico-screen           { --ico: url("assets/icons/monitor-screen.svg"); }
.ico-clock            { --ico: url("assets/icons/clock.svg"); }
.ico-euro             { --ico: url("assets/icons/currency-euro.svg"); }
.ico-question         { --ico: url("assets/icons/question-mark.svg"); }

/* Pastille ronde + picto : ::before dessine la pastille, ::after le picto par-dessus */
.a-pastille { position: relative; }
.a-pastille::before {
  content: ""; display: block;
  width: 64px; height: 64px; margin-bottom: 20px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff 0%, rgba(124, 201, 212, .28) 70%);
  box-shadow: var(--ombre-douce);
}
.a-pastille::after {
  content: ""; position: absolute;
  width: 26px; height: 26px;
  background-color: var(--bleu);
  -webkit-mask: var(--ico) center / contain no-repeat;
  mask: var(--ico) center / contain no-repeat;
}
.a-pastille.pastille-terra::before { background: radial-gradient(circle at 35% 30%, #fff 0%, rgba(201, 143, 122, .26) 70%); }
.a-pastille.pastille-terra::after { background-color: var(--terra); }

/* ==========================================================================
   Boutons : bleu plein (principal) / terracotta plein (Prendre rendez-vous)
   La classe du bloc bouton atterrit sur le conteneur : on stylise le lien.
   ========================================================================== */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 14px; }
.wp-block-buttons.ctas { margin-top: 32px; }
.wp-block-buttons.ctas-centre { justify-content: center; }
.wp-block-button .wp-block-button__link {
  display: inline-flex; align-items: center; gap: 10px;
  border: 0;
  text-decoration: none;
  box-shadow: 0 10px 24px -14px rgba(9, 132, 154, .8);
  transition: background .2s, transform .2s;
}
.wp-block-button .wp-block-button__link::after { content: "→"; font-size: 1.05em; transition: transform .2s; }
.wp-block-button .wp-block-button__link:hover { transform: translateY(-1px); }
.wp-block-button .wp-block-button__link:hover::after { transform: translateX(3px); }
.wp-block-button.b-terra .wp-block-button__link { background-color: var(--terra); box-shadow: 0 10px 24px -14px rgba(178, 119, 98, .9); }
.wp-block-button.b-terra .wp-block-button__link:hover { background-color: var(--terra-fonce); }
.wp-block-button.b-petit .wp-block-button__link { padding: 12px 24px; font-size: 16px; }
.wp-block-button.b-sans-fleche .wp-block-button__link::after { content: none; }

.lien-fleche, .wp-block-read-more.lien-fleche { font-weight: 700; font-size: 18px; text-decoration: none; display: inline-flex; gap: 8px; align-items: center; }
.lien-fleche::after { content: "→"; transition: transform .2s; }
.lien-fleche:hover::after { transform: translateX(3px); }

/* ==========================================================================
   En-tête
   ========================================================================== */
.entete-site {
  position: fixed; z-index: 50;
  top: 18px; left: 0; right: 0; margin-inline: auto; /* pas de translate : il piégerait le panneau mobile (position: fixed) */
  width: min(1240px, 100% - 32px);
  display: flex; align-items: center; gap: 24px;
  padding: 12px 14px 12px 28px;
  border-radius: 36px;
  background: rgba(255, 255, 255, .55);
  -webkit-backdrop-filter: blur(14px) saturate(1.3);
  backdrop-filter: blur(14px) saturate(1.3);
  border: 1px solid rgba(255, 255, 255, .8);
  box-shadow: 0 12px 40px -24px rgba(9, 132, 154, .35);
  transition: background .3s, box-shadow .3s, top .3s;
}
.entete-site.defile { background: rgba(255, 255, 255, .82); top: 10px; box-shadow: 0 16px 40px -20px rgba(9, 132, 154, .35); }
.admin-bar .entete-site { top: 50px; }
.admin-bar .entete-site.defile { top: 42px; }

/* Marque : lotus en masque (emplacement du logo définitif) + nom */
.marque { margin: 0; flex: none; font-family: var(--serif); line-height: 1.1; font-size: 14px; }
.marque a { display: grid; grid-template-columns: auto auto; align-items: center; column-gap: 12px; text-decoration: none; color: var(--bleu-fonce); }
.marque a::before {
  content: ""; grid-row: span 2; width: 52px; height: 36px;
  background-color: var(--bleu);
  -webkit-mask: url("assets/formes/lotus.svg") center / contain no-repeat;
  mask: url("assets/formes/lotus.svg") center / contain no-repeat;
}
.marque strong { font-weight: 400; font-size: 23px; color: var(--bleu); letter-spacing: .01em; align-self: start; }
/* Le <br> reste pour l'éditeur ; la grille range déjà le nom sous la mention */
.marque br { display: none; }

/* Menu : core/navigation en « toujours replié » + affichage en ligne au-delà de 1260 px */
.menu-principal { margin-left: auto; font-size: 15px; }
.menu-principal .wp-block-navigation__container { gap: clamp(14px, 1.25vw, 18px); }
.menu-principal .wp-block-navigation-item__content {
  color: var(--texte); text-decoration: none; position: relative; padding: 6px 0; white-space: nowrap;
}
.menu-principal .wp-block-navigation-item__content::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 1.5px;
  background: var(--bleu); transform: scaleX(0); transition: transform .25s; transform-origin: left;
}
.menu-principal .wp-block-navigation-item__content:hover { color: var(--bleu-fonce); }
.menu-principal .wp-block-navigation-item__content:hover::after,
.menu-principal .actif > .wp-block-navigation-item__content::after,
.menu-principal .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
.menu-principal .actif > .wp-block-navigation-item__content,
.menu-principal .current-menu-item > .wp-block-navigation-item__content { color: var(--bleu); }

.entete-site .wp-block-navigation .wp-block-navigation__responsive-container-open {
  width: 46px; height: 46px; border-radius: 50%;
  align-items: center; justify-content: center;
  border: 1px solid var(--gris); background: var(--blanc); color: var(--bleu);
}
/* Panneau mobile : sinon blanc sur blanc (le CSS du bloc est imprimé après cette feuille) */
.wp-block-navigation.menu-principal .wp-block-navigation__responsive-container.is-menu-open {
  background-color: rgba(255, 255, 255, .98) !important;
  color: var(--texte) !important;
  padding: 90px 32px 32px;
}
/* backdrop-filter fait de l'en-tête le repère des éléments fixes : on le coupe menu ouvert */
.entete-site:has(.is-menu-open) { -webkit-backdrop-filter: none; backdrop-filter: none; }
.wp-block-navigation.menu-principal .is-menu-open .wp-block-navigation__container { gap: 6px; align-items: flex-start; }
.wp-block-navigation.menu-principal .is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start; }
.wp-block-navigation.menu-principal .is-menu-open .wp-block-navigation-item__content { font-size: 22px; font-family: var(--serif); padding: 8px 0; }

@media (min-width: 1261px) {
  .entete-site .wp-block-navigation .wp-block-navigation__responsive-container-open { display: none; }
  .entete-site .wp-block-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: block; position: relative; inset: auto; width: auto; z-index: auto; background-color: transparent;
  }
  .entete-site .wp-block-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-close { display: none; }
}

.entete-cta { flex: none; }

/* ==========================================================================
   Qui suis-je ? — texte à gauche, portrait à droite, rivière en fond
   ========================================================================== */
.qsj { position: relative; padding: 150px 0 var(--esp-bloc); isolation: isolate; overflow-x: clip; }
/* La photo de fond est un vrai bloc image (remplaçable en un clic) sorti du flux */
.qsj > .qsj__photo { position: absolute; inset: 0; z-index: -2; margin: 0; }
.qsj > .qsj__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.qsj::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(245, 249, 250, 0) 0%, rgba(245, 249, 250, 0) 60%, var(--fond) 100%),
    linear-gradient(90deg, rgba(245, 249, 250, .94) 0%, rgba(245, 249, 250, .9) 48%, rgba(245, 249, 250, .45) 72%, rgba(245, 249, 250, .15) 100%);
}
.qsj__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(40px, 6vw, 90px); align-items: center; }

.qsj__texte { max-width: 640px; }
.qsj__texte h1 { margin-bottom: 18px; }
.qsj .chapo { font-family: var(--serif); font-size: 23px; line-height: 1.45; color: var(--texte); margin-bottom: 28px; }
.questions {
  list-style: none; margin: 0 0 30px; padding: 18px 0 18px 26px;
  border-left: 2px solid var(--terra);
  font-family: var(--serif); font-style: italic; font-size: 20px; line-height: 1.5; color: var(--bleu-fonce);
}
.questions li + li { margin-top: 8px; }
.signature { font-family: var(--serif); font-style: italic; font-size: 21px; line-height: 1.4; color: var(--texte); margin-top: 26px; }
.signature strong { font-size: 26px; color: var(--bleu-fonce); }

/* Portrait : trois formes en pseudo-éléments de deux groupes superposés */
.qsj__portrait { position: relative; width: min(480px, 100%); margin-inline: auto; aspect-ratio: 1; isolation: isolate; }
.qsj__portrait::before { /* forme aquarelle bleue */
  content: ""; position: absolute; z-index: 0;
  width: 72%; aspect-ratio: 1; right: -12%; top: -12%;
  border-radius: 58% 42% 50% 50% / 45% 55% 45% 55%; opacity: .95;
  background: var(--blob-bleu); box-shadow: inset 0 0 40px rgba(255, 255, 255, .35);
}
.qsj__portrait > .portrait-cadre { position: absolute; inset: 0; z-index: 1; isolation: isolate; }
.portrait-cadre::before { /* forme claire */
  content: ""; position: absolute; z-index: -1;
  width: 46%; aspect-ratio: 1; left: -14%; top: 34%;
  border-radius: 48% 52% 60% 40% / 55% 45% 55% 45%;
  background: var(--blob-clair);
}
.portrait-cadre::after { /* galet terracotta */
  content: ""; position: absolute; z-index: 2;
  width: 26%; aspect-ratio: 1.2; right: -2%; bottom: -4%;
  border-radius: var(--galet-1);
  background: var(--blob-terra); box-shadow: var(--ombre-terra);
}
.portrait-cadre .portrait { height: 100%; }
.portrait-cadre .portrait img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 24px 40px rgba(9, 132, 154, .25)); }

/* ==========================================================================
   Mon approche thérapeutique
   ========================================================================== */
.approche { padding: var(--esp-bloc) 0 var(--esp-section); }

.themes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.theme {
  padding: 32px 30px 30px;
  background: var(--blanc);
  border-radius: var(--r-l);
  border: 1px solid rgba(217, 230, 233, .9);
  box-shadow: var(--ombre-douce);
}
.theme.a-pastille::after { top: 51px; left: 49px; }
.theme h3 { margin-bottom: 10px; font-size: 28px; }
.theme p { margin: 0; text-align: justify; hyphens: auto; -webkit-hyphens: auto; }

.approche-bloc {
  position: relative;
  margin-top: var(--esp-bloc);
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 70px); align-items: center;
  padding: clamp(32px, 5vw, 64px);
  border-radius: var(--r-xl);
  background:
    var(--grain),
    radial-gradient(600px 420px at 95% 100%, rgba(201, 143, 122, .16), transparent 70%),
    linear-gradient(130deg, #FFFFFF 0%, #EEF6F8 38%, #D5EDF1 72%, rgba(124, 201, 212, .55) 100%);
  box-shadow: var(--ombre);
}
.approche-bloc__texte .fort { font-weight: 700; color: var(--bleu-fonce); }

/* Photo en forme de galet : masque SVG étiré aux proportions de l'image */
.approche-bloc__visuel { position: relative; aspect-ratio: 5 / 6; isolation: isolate; }
.approche-bloc__visuel::before {
  content: ""; position: absolute; z-index: -1;
  width: 48%; aspect-ratio: 1; left: -14%; top: -6%;
  border-radius: 55% 45% 52% 48% / 48% 56% 44% 52%;
  background: var(--blob-bleu);
}
.approche-bloc__visuel::after {
  content: ""; position: absolute; z-index: 2;
  width: 22%; aspect-ratio: 1.2; right: -4%; bottom: 8%;
  border-radius: var(--galet-3);
  background: var(--blob-terra); box-shadow: var(--ombre-terra);
}
.photo-galet { height: 100%; filter: drop-shadow(0 26px 30px rgba(9, 132, 154, .22)); }
.photo-galet img {
  width: 100%; height: 100%; object-fit: cover;
  -webkit-mask: url("assets/formes/galet.svg") center / 100% 100% no-repeat;
  mask: url("assets/formes/galet.svg") center / 100% 100% no-repeat;
}

/* ==========================================================================
   Tarifs
   ========================================================================== */
.tarifs { padding: 0 0 var(--esp-section); }
.tarifs__bloc {
  position: relative;
  border-radius: var(--r-xl);
  padding: var(--esp-bloc) clamp(24px, 5vw, 72px);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .25), rgba(255, 255, 255, .45)),
    url("assets/img/fond-aquarelle.png") center / cover no-repeat;
  box-shadow: var(--ombre);
  overflow: hidden;
  isolation: isolate;
}
.tarifs__bloc::before { /* grande forme aquarelle */
  content: ""; position: absolute; z-index: -1;
  width: 380px; aspect-ratio: 1; left: -120px; top: -110px;
  border-radius: 58% 42% 50% 50% / 45% 55% 45% 55%;
  background: var(--blob-bleu); filter: saturate(1.2) brightness(.95);
}
.tarifs__bloc::after { /* galet terracotta */
  content: ""; position: absolute; z-index: -1;
  width: 220px; aspect-ratio: 1.2; right: -60px; bottom: -70px;
  border-radius: var(--galet-2);
  background: var(--blob-terra); box-shadow: var(--ombre-terra);
}
.tarifs__bloc > .entete-section { position: static; }
.tarifs__bloc > .entete-section::after { /* petite forme claire */
  content: ""; position: absolute; z-index: -1;
  width: 110px; aspect-ratio: 1; right: 5%; top: 26px;
  border-radius: 50%;
  background: var(--blob-clair);
}

.tarifs__cartes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; align-items: stretch; }
.tarif {
  display: flex; flex-direction: column; align-items: center;
  text-align: center;
  padding: 36px 30px 34px;
  border-radius: var(--r-l);
  background: rgba(255, 255, 255, .92);
  box-shadow: var(--ombre);
  font-size: 18px;
}
.tarif.a-pastille::before { margin-bottom: 18px; }
.tarif.a-pastille::after { top: 55px; left: calc(50% - 13px); }
.tarif h3 { font-size: 32px; margin-bottom: 14px; }
.tarif p { margin: 0 0 12px; line-height: 1.5; }
.tarif p:last-child { margin-bottom: 0; }
.tarif strong { color: var(--bleu-fonce); }
.tarif .tarif__grand { font-size: 26px; line-height: 1.35; margin: 0; }
.tarif .tarif__ou { margin: 0; }
.tarif .tarif__prix { margin: -8px 0 12px; font-family: var(--serif); font-size: 40px; line-height: 1.1; }
.tarif .tarif__prix strong { color: var(--bleu); }
.tarif.tarif--chaud { background: linear-gradient(180deg, #FFFFFF 0%, #FBF1ED 100%); }

/* ==========================================================================
   Prendre rendez-vous
   ========================================================================== */
.rdv { padding: 0 0 var(--esp-bloc); }
.rdv__col { max-width: 860px; }
.rdv__sous-titre { font-size: 24px; color: var(--bleu-fonce); margin: 0 0 20px; }
ol.etapes { list-style: none; margin: 0 0 40px; padding: 0; counter-reset: e; position: relative; display: grid; gap: 14px; }
ol.etapes::before { content: ""; position: absolute; left: 23px; top: 24px; bottom: 24px; width: 1.5px; background: linear-gradient(var(--bleu-clair), rgba(124, 201, 212, .25)); }
ol.etapes li {
  counter-increment: e; position: relative;
  display: flex; align-items: center; gap: 24px;
  min-height: 48px;
}
ol.etapes li::before {
  content: counter(e);
  position: relative; flex: none;
  width: 48px; height: 48px; border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 22px; font-weight: 700; color: var(--bleu);
  background: var(--blanc);
  box-shadow: inset 0 0 0 1.5px var(--bleu-clair), var(--ombre-douce);
}
.annulation { margin: 0 0 40px; padding-left: 26px; border-left: 2px solid var(--terra); }
.annulation h3 { font-size: 24px; color: var(--terra-fonce); margin-bottom: 8px; }
.annulation p { margin: 0 0 6px; }

/* Emplacement du module de réservation (Calendly, Koalendar ou TidyCal) */
.agenda { border-radius: var(--r-xl); padding: 34px; background: var(--blanc); box-shadow: var(--ombre); }
.agenda h3 { font-size: 26px; margin-bottom: 12px; }
.agenda__note { display: flex; align-items: center; gap: 12px; margin: 0; padding: 22px 24px; border-radius: var(--r-m); border: 1.5px dashed var(--bleu-clair); background: var(--fond); color: var(--texte-doux); font-size: 16px; }
.agenda iframe { width: 100%; min-height: 660px; border: 0; border-radius: var(--r-m); }
.rdv__question { margin-top: 40px; text-align: center; }
.rdv__question p { margin-bottom: 16px; }
.rdv__question .wp-block-buttons { justify-content: center; }

/* ==========================================================================
   Foire aux questions
   ========================================================================== */
.faq { padding: var(--esp-section) 0; position: relative; isolation: isolate; }
.faq::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(217, 230, 233, 0), rgba(217, 230, 233, .6) 14%, rgba(217, 230, 233, .6) 86%, rgba(217, 230, 233, 0));
}
.faq__col { max-width: 900px; }
.questions-faq { display: grid; gap: 12px; }
.questions-faq details {
  margin: 0;
  background: rgba(255, 255, 255, .85);
  border-radius: var(--r-m);
  box-shadow: 0 6px 20px -16px rgba(9, 132, 154, .4);
  transition: background .25s, box-shadow .25s;
}
.questions-faq details[open] { background: var(--blanc); box-shadow: var(--ombre); padding-bottom: 24px; }
.questions-faq summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 22px 26px;
  font-family: var(--serif); font-size: 22px; line-height: 1.35; color: var(--texte);
}
.questions-faq summary::-webkit-details-marker { display: none; }
.questions-faq summary::after {
  content: ""; flex: none; width: 34px; height: 34px; border-radius: 50%;
  background: rgba(124, 201, 212, .2) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230BA5C0' stroke-width='2' stroke-linecap='round'><path d='M12 6v12M6 12h12'/></svg>") center / 16px no-repeat;
  transition: transform .3s, background-color .3s;
}
.questions-faq details[open] summary::after { transform: rotate(45deg); background-color: rgba(201, 143, 122, .18); }
.questions-faq summary:hover { color: var(--bleu-fonce); }
.questions-faq details > :not(summary) { margin-inline: 26px; }
.questions-faq details > p:last-child, .questions-faq details > ul:last-child { margin-bottom: 0; }
.questions-faq .rubrique { margin: 18px 26px 8px; }
ul.urgences { list-style: none; margin-top: 0; margin-bottom: 8px; padding: 0; display: grid; gap: 6px; }
ul.urgences li { padding-left: 18px; position: relative; }
ul.urgences li::before { content: ""; position: absolute; left: 0; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--bleu-clair); }
.faq__suite { margin-top: 40px; text-align: center; }
.faq__suite p { margin-bottom: 16px; }
.faq__suite .wp-block-buttons { justify-content: center; }

/* ==========================================================================
   Contact
   ========================================================================== */
.contact { padding: var(--esp-bloc) 0 0; }
.contact__bloc {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(32px, 5vw, 70px); align-items: start;
  border-radius: var(--r-xl);
  padding: clamp(32px, 5vw, 64px);
  background:
    linear-gradient(90deg, rgba(245, 249, 250, .8), rgba(245, 249, 250, .25)),
    url("assets/img/fond-ciel.jpg") center / cover no-repeat;
  box-shadow: var(--ombre);
}
.contact__texte p:not(.surtitre) { max-width: 440px; }
.contact__visuel { position: relative; width: min(400px, 90%); aspect-ratio: 1; margin: 40px auto 0; isolation: isolate; }
.contact__visuel::before {
  content: ""; position: absolute; z-index: -1;
  width: 44%; aspect-ratio: 1; right: -10%; top: -8%;
  border-radius: 52% 48% 45% 55% / 55% 45% 55% 45%;
  background: var(--blob-bleu);
}
.contact__visuel::after {
  content: ""; position: absolute; z-index: 2;
  width: 22%; aspect-ratio: 1.2; left: 2%; bottom: 2%;
  border-radius: var(--galet-2);
  background: var(--blob-terra); box-shadow: var(--ombre-terra);
}
.photo-prairie { height: 100%; }
.photo-prairie img {
  width: 100%; height: 100%; object-fit: cover;
  border-radius: 58% 42% 55% 45% / 46% 58% 42% 54%;
  box-shadow: 0 30px 60px -30px rgba(9, 132, 154, .45);
}

/* Formulaire Contact Form 7, gabarit aux classes de la maquette */
.formulaire { padding: 34px; border-radius: var(--r-l); background: rgba(255, 255, 255, .9); box-shadow: var(--ombre); }
.formulaire .wpcf7-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.formulaire .wpcf7-form > p { margin: 0; }
.formulaire .wpcf7-form > .hidden-fields-container, .formulaire .wpcf7-form > fieldset { display: none; }
.champ { display: grid; gap: 6px; margin: 0; }
.champ--large, .consent, .captcha, .envoi, .formulaire .wpcf7-response-output { grid-column: 1 / -1; }
.champ label, .champ .libelle { font-size: 15px; font-weight: 700; color: var(--texte); }
.champ .requis { color: var(--terra); }
.formulaire .wpcf7-form-control-wrap { display: block; }
.formulaire input[type="text"], .formulaire input[type="email"], .formulaire input[type="tel"], .formulaire select, .formulaire textarea {
  display: block;
  font: 16px var(--sans); color: var(--texte);
  width: 100%;
  padding: 13px 16px;
  border-radius: var(--r-s);
  border: 1px solid var(--gris);
  background: var(--fond);
  transition: border-color .2s, box-shadow .2s, background .2s;
  appearance: none;
}
.formulaire select { background: var(--fond) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2309849A' stroke-width='2' stroke-linecap='round'><path d='m6 9 6 6 6-6'/></svg>") right 14px center / 18px no-repeat; }
.formulaire textarea { min-height: 150px; height: 150px; resize: vertical; }
.formulaire input:focus, .formulaire select:focus, .formulaire textarea:focus { outline: none; border-color: var(--bleu-clair); background: var(--blanc); box-shadow: 0 0 0 4px rgba(124, 201, 212, .25); }
.compteur { margin: 0; font-size: 14px; color: var(--texte-doux); text-align: right; }
.compteur .wpcf7-character-count.too-long, .compteur .wpcf7-character-count.limite { color: var(--terra-fonce); font-weight: 700; }
.consent { font-size: 14px; line-height: 1.5; color: var(--texte); }
.consent .wpcf7-list-item { margin: 0; }
.consent label { display: flex; gap: 12px; align-items: flex-start; }
.consent input { margin-top: 3px; accent-color: var(--bleu); width: 16px; height: 16px; flex: none; }
.captcha { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 14px; color: var(--texte-doux); padding: 12px 16px; border-radius: var(--r-s); border: 1px dashed var(--gris); background: var(--fond); }
.captcha::before { content: ""; width: 20px; height: 20px; flex: none; background: var(--bleu-clair); -webkit-mask: url("assets/icons/check.svg") center / contain no-repeat; mask: url("assets/icons/check.svg") center / contain no-repeat; }
.envoi { display: flex; justify-content: flex-end; align-items: center; gap: 12px; }
.formulaire .wpcf7-submit {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 15px 30px; border: 0; border-radius: 999px; cursor: pointer;
  font: 700 18px/1.2 var(--sans); color: var(--blanc); background: var(--bleu);
  box-shadow: 0 10px 24px -14px rgba(9, 132, 154, .8);
  transition: background .2s, transform .2s;
}
.formulaire .wpcf7-submit:hover { background: var(--bleu-fonce); transform: translateY(-1px); }
.formulaire .wpcf7-spinner { margin: 0; }
.formulaire .wpcf7-not-valid-tip { margin-top: 6px; font-size: 14px; color: var(--terra-fonce); }
.formulaire .wpcf7-not-valid { border-color: var(--terra) !important; }
.formulaire .wpcf7-response-output { margin: 4px 0 0 !important; padding: 14px 18px !important; border-radius: var(--r-s); border: 1.5px solid var(--bleu-clair) !important; background: var(--fond); font-size: 15px; }
.formulaire .wpcf7 form.invalid .wpcf7-response-output, .formulaire .wpcf7 form.unaccepted .wpcf7-response-output { border-color: var(--terra) !important; }

/* ==========================================================================
   Cartes d'articles (boucle de requête)
   ========================================================================== */
.blog { padding: var(--esp-section) 0; }
.articles, .wp-block-post-template.articles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; list-style: none; margin: 0; padding: 0; }
.articles > li { margin: 0; display: flex; }
.article {
  display: flex; flex-direction: column; width: 100%;
  background: var(--blanc);
  border-radius: var(--r-l);
  overflow: hidden;
  box-shadow: var(--ombre-douce);
  border: 1px solid rgba(217, 230, 233, .9);
}
.article .article__image { margin: 10px 10px 0; border-radius: calc(var(--r-l) - 8px); overflow: hidden; aspect-ratio: 16 / 11; }
.article .article__image a, .article .article__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.article .article__image img { transition: transform .6s; }
.article:hover .article__image img { transform: scale(1.04); }
.article__corps { padding: 24px 26px 28px; display: flex; flex-direction: column; flex: 1; }
.meta { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; font-size: 14px; color: var(--texte-doux); margin-bottom: 12px; }
.meta .cat, .meta .wp-block-post-terms { font-weight: 700; color: var(--terra-fonce); letter-spacing: .06em; text-transform: uppercase; font-size: 12px; }
.meta .wp-block-post-terms a { color: inherit; text-decoration: none; }
.article .wp-block-post-title { font-size: 24px; color: var(--texte); margin: 0 0 .5em; }
.article .wp-block-post-title a { color: inherit; text-decoration: none; }
.article .wp-block-post-title a:hover { color: var(--bleu-fonce); }
.article .wp-block-post-excerpt { margin: 0 0 1em; }
.article .wp-block-post-excerpt__excerpt { margin: 0; }
.article .wp-block-post-excerpt__more-text { display: none; }
.article .lien-fleche { margin-top: auto; }
.blog .ctas { margin-top: 44px; }

/* ==========================================================================
   Pied de page — découpe en vagues
   ========================================================================== */
.pied { margin-top: 20px; }
.pied::before {
  content: ""; display: block; width: 100%; height: clamp(60px, 8vw, 120px); margin-bottom: -1px;
  background: url("assets/formes/vague-pied.svg") center / 100% 100% no-repeat;
}
.pied__fond {
  background:
    var(--grain),
    linear-gradient(180deg, var(--gris) 0%, #E6EFF1 60%, var(--fond) 100%);
  padding: 30px 0 34px;
}
.pied__haut {
  display: grid; grid-template-columns: auto 1fr 1.2fr; align-items: start; gap: 0;
  padding-bottom: 34px;
  border-bottom: 1px solid rgba(124, 201, 212, .55);
}
.pied__haut > * { padding: 0 clamp(20px, 3vw, 44px); }
.pied__haut > * + * { border-left: 1px solid rgba(124, 201, 212, .55); }
.pied__haut > :first-child { padding-left: 0; }
.pied__haut > :last-child { padding-right: 0; }
.marque--pied a::before { width: 68px; height: 46px; }
.marque--pied { font-size: 16px; }
.marque--pied strong { font-size: 28px; }
.pied h4 { font-family: var(--sans); font-size: 18px; font-weight: 700; color: var(--bleu-fonce); margin: 0 0 8px; }
.pied__offre p { margin: 0 0 6px; font-size: 17px; }
.pied__tarif { line-height: 1.6; }
.pied__tarif strong { color: var(--bleu-fonce); }
.pied__lien { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; font-size: 17px; line-height: 1.35; color: var(--texte); }
.pied__lien a { color: var(--texte); text-decoration: none; }
.pied__lien a:hover { color: var(--bleu-fonce); }
.pied__lien::before { content: ""; width: 24px; height: 24px; flex: none; background: var(--bleu); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.pied__lien.lien-linkedin { --ico: url("assets/icons/linkedin.svg"); }
.pied__lien.lien-lieu { --ico: url("assets/icons/location.svg"); }
.pied__ctas { margin-top: 18px; gap: 10px; }
.pied__ctas .wp-block-button__link::after { content: none; }
ul.pied__bas { list-style: none; display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 22px; margin: 24px auto 0; padding: 0; font-size: 15px; color: var(--texte-doux); }
.pied__bas a { color: var(--texte-doux); }
.pied__bas a:hover { color: var(--bleu-fonce); }
.pied__bas li + li::before { content: "|"; margin-right: 22px; color: var(--bleu-clair); }

/* ==========================================================================
   Pages internes : en-tête de page, blog, article, pages légales
   ========================================================================== */
.page-tete { position: relative; padding: 170px 0 var(--esp-bloc); isolation: isolate; overflow: clip; text-align: center; }
.page-tete::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background:
    linear-gradient(180deg, rgba(245, 249, 250, .55) 0%, rgba(245, 249, 250, .75) 55%, var(--fond) 100%),
    url("assets/img/fond-montagnes.jpg") center 30% / cover no-repeat;
}
.page-tete.avec-formes > .page-tete__contenu::before { /* forme aquarelle */
  content: ""; position: absolute; z-index: -1;
  width: 300px; aspect-ratio: 1; left: -90px; top: 90px;
  border-radius: 58% 42% 50% 50% / 45% 55% 45% 55%; opacity: .8;
  background: var(--blob-bleu);
}
.page-tete.avec-formes > .page-tete__contenu::after { /* galet terracotta */
  content: ""; position: absolute; z-index: -1;
  width: 110px; aspect-ratio: 1.2; right: 9%; bottom: 40px;
  border-radius: var(--galet-1);
  background: var(--blob-terra); box-shadow: var(--ombre-terra);
}
.page-tete__contenu { max-width: 820px; position: static; }
.page-tete h1 { margin-bottom: 16px; }
.page-tete__intro, .page-tete .wp-block-post-excerpt__excerpt { font-family: var(--serif); font-size: 22px; line-height: 1.5; color: var(--texte); margin: 0 auto; max-width: 680px; }
.fil { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; font-size: 14px; color: var(--texte-doux); margin-bottom: 26px; }
.fil a { color: var(--bleu-fonce); text-decoration: none; }
.fil a:hover { text-decoration: underline; }
.fil .wp-block-post-terms { display: inline; }
.page-tete--sobre { padding-bottom: 40px; }
.page-tete--sobre::before { background: linear-gradient(180deg, var(--gris) 0%, var(--fond) 100%); }

/* Liste du blog : filtres par catégorie (liens natifs) */
.blog-liste { padding: 10px 0 var(--esp-section); }
.filtres { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 44px; }
.filtres > p { margin: 0; }
.filtres ul.wp-block-categories { display: contents; list-style: none; margin: 0; padding: 0; }
.filtres .cat-item { margin: 0; }
.filtres a {
  display: inline-block;
  font: 700 15px var(--sans); color: var(--bleu-fonce); text-decoration: none;
  padding: 10px 20px; border-radius: 999px;
  background: var(--blanc); border: 1px solid var(--gris);
  transition: background .2s, color .2s, border-color .2s;
}
.filtres a:hover { border-color: var(--bleu-clair); color: var(--bleu-fonce); }
.blog .filtre-tous a, .filtres .current-cat a { background: var(--bleu); border-color: var(--bleu); color: var(--blanc); }
.category .filtre-tous a { background: var(--blanc); border-color: var(--gris); color: var(--bleu-fonce); }
.blog-liste .articles { row-gap: 32px; }
.aucun { text-align: center; color: var(--texte-doux); }

.pagination, .wp-block-query-pagination { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 52px; }
.wp-block-query-pagination-numbers { display: flex; gap: 10px; }
.wp-block-query-pagination .page-numbers, .wp-block-query-pagination-next, .wp-block-query-pagination-previous {
  min-width: 46px; height: 46px; padding: 0 16px; border-radius: 999px;
  display: inline-grid; place-items: center;
  font-weight: 700; font-size: 16px; text-decoration: none; white-space: nowrap;
  color: var(--bleu-fonce); background: var(--blanc); border: 1px solid var(--gris);
}
.wp-block-query-pagination .page-numbers.current { background: var(--bleu); border-color: var(--bleu); color: var(--blanc); }
.wp-block-query-pagination-next, .wp-block-query-pagination-previous { padding: 0 22px; }

/* Bandeau rendez-vous */
.bandeau-rdv { padding: 0 0 var(--esp-bloc); }
.bandeau-rdv__bloc {
  position: relative; overflow: clip; isolation: isolate;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 24px 40px;
  padding: clamp(32px, 5vw, 56px) clamp(28px, 5vw, 64px);
  border-radius: var(--r-xl);
  background: var(--grain), linear-gradient(120deg, #FFFFFF 0%, #E6F3F6 50%, rgba(124, 201, 212, .5) 100%);
  box-shadow: var(--ombre);
}
.bandeau-rdv__bloc::before {
  content: ""; position: absolute; z-index: -1;
  width: 240px; aspect-ratio: 1; right: 28%; top: -120px;
  border-radius: 55% 45% 52% 48% / 48% 56% 44% 52%; opacity: .7;
  background: var(--blob-bleu);
}
.bandeau-rdv h2 { margin-bottom: 8px; }
.bandeau-rdv p { margin: 0; }
.bandeau-rdv .wp-block-buttons { margin-top: 0; }

/* Article */
.page-tete--article { padding-bottom: 40px; }
.meta--tete { justify-content: center; margin-bottom: 14px; }
.meta--tete > * + *::before { content: "·"; margin-right: 12px; color: var(--bleu-clair); }
.billet__visuel { position: relative; max-width: 1040px; isolation: isolate; }
.billet__visuel::before {
  content: ""; position: absolute; z-index: -1;
  width: 200px; aspect-ratio: 1; left: -50px; top: -40px;
  border-radius: 55% 45% 52% 48% / 48% 56% 44% 52%;
  background: var(--blob-bleu);
}
.billet__visuel::after {
  content: ""; position: absolute; z-index: 2;
  width: 90px; aspect-ratio: 1.2; right: 24px; bottom: -24px;
  border-radius: var(--galet-1);
  background: var(--blob-terra); box-shadow: var(--ombre-terra);
}
.billet__image { margin: 0; filter: drop-shadow(0 30px 40px rgba(9, 132, 154, .22)); }
.billet__image img {
  width: 100%; aspect-ratio: 16 / 8; object-fit: cover;
  -webkit-mask: url("assets/formes/galet.svg") center / 100% 100% no-repeat;
  mask: url("assets/formes/galet.svg") center / 100% 100% no-repeat;
}
.billet__contenu { max-width: 720px; padding: var(--esp-bloc) 0 20px; }
.billet__contenu h2 { font-size: clamp(26px, 3vw, 32px); margin: 1.6em 0 .6em; }
.billet__contenu ul { padding-left: 0; list-style: none; margin: 0 0 1.2em; display: grid; gap: 10px; }
.billet__contenu ul li { position: relative; padding-left: 26px; }
.billet__contenu ul li::before { content: ""; position: absolute; left: 4px; top: .65em; width: 9px; height: 9px; border-radius: 50%; background: var(--terra); }
.billet__contenu > p:first-child::first-letter { float: left; font-family: var(--serif); font-weight: 700; font-size: 72px; line-height: .85; margin: 6px 12px 0 0; color: var(--bleu); }
.billet__contenu .wp-block-quote {
  margin: 40px 0; padding: 30px 36px; border: 0; border-radius: var(--r-l);
  background: linear-gradient(120deg, #FFFFFF, #EAF5F7);
  box-shadow: var(--ombre-douce);
  font-family: var(--serif); font-style: italic; font-size: 26px; line-height: 1.4; color: var(--bleu-fonce);
  position: relative;
}
.billet__contenu .wp-block-quote p { margin: 0; text-align: left; }
.billet__contenu .wp-block-quote::before { content: "“"; position: absolute; left: 18px; top: -18px; font-size: 90px; line-height: 1; color: var(--terra); font-style: normal; }
.note { font-size: 15px; color: var(--texte-doux); padding: 16px 20px; border-left: 2px solid var(--bleu-clair); background: rgba(255, 255, 255, .7); border-radius: 0 var(--r-s) var(--r-s) 0; }
.billet__auteur { max-width: 820px; padding-bottom: var(--esp-bloc); }
.auteur {
  display: flex; gap: 32px; align-items: center;
  padding: 36px; border-radius: var(--r-xl);
  background: var(--blanc); box-shadow: var(--ombre);
}
.auteur__photo { width: 150px; height: 150px; flex: none; }
.auteur__photo img { width: 150px; height: 150px; object-fit: contain; }
.auteur h2 { font-size: 32px; margin-bottom: 8px; }
.auteur .wp-block-buttons { margin-top: 18px; }
.blog--suite { padding-top: 0; }

/* Pages légales */
.legal { padding: 20px 0 var(--esp-section); }
.legal__grille { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(32px, 5vw, 70px); align-items: start; max-width: 1080px; }
.sommaire { position: sticky; top: 120px; padding: 26px; border-radius: var(--r-l); background: var(--blanc); box-shadow: var(--ombre-douce); }
.sommaire ol { margin: 0; padding-left: 20px; display: grid; gap: 8px; font-size: 16px; }
.sommaire a { color: var(--texte); text-decoration: none; }
.sommaire a:hover { color: var(--bleu-fonce); text-decoration: underline; }
.legal__texte h2 { font-size: clamp(24px, 2.6vw, 30px); margin: 1.4em 0 .5em; scroll-margin-top: 110px; }
.legal__texte > h2:first-child { margin-top: 0; }
ul.fiche { list-style: none; margin: 0 0 1em; padding: 0; display: grid; gap: 6px; }
ul.fiche strong { display: inline-block; min-width: 120px; color: var(--bleu-fonce); }
.a-fournir { padding: 18px 22px; border-radius: var(--r-s); border: 1.5px dashed var(--bleu-clair); background: rgba(255, 255, 255, .6); color: var(--texte-doux); font-style: italic; }

/* Page 404 */
.page-404 { text-align: center; }
.page-404 .wp-block-buttons { justify-content: center; }

/* ==========================================================================
   Adaptatif
   ========================================================================== */
@media (max-width: 1260px) {
  .entete-site { padding: 10px 12px 10px 20px; }
}
@media (max-width: 1000px) {
  .qsj__grid, .contact__bloc, .approche-bloc { grid-template-columns: 1fr; }
  .qsj__portrait { order: -1; max-width: 420px; }
  .qsj > .qsj__photo { bottom: auto; height: 60%; }
  .qsj::before { background: linear-gradient(180deg, rgba(245, 249, 250, .5) 0%, rgba(245, 249, 250, .92) 34%, var(--fond) 60%); }
  .themes, .tarifs__cartes, .articles, .wp-block-post-template.articles { grid-template-columns: 1fr 1fr; }
  .tarifs__cartes > .tarif:last-child, .articles > li:last-child { grid-column: 1 / -1; }
  .approche-bloc__visuel { max-width: 420px; width: 100%; margin: 0 auto; aspect-ratio: 1; }
  .pied__haut { grid-template-columns: 1fr 1fr; gap: 26px 0; }
  .pied__haut > :first-child { grid-column: 1 / -1; }
  .pied__haut > :nth-child(2) { border-left: 0; padding-left: 0; }
  .legal__grille { grid-template-columns: 1fr; }
  .sommaire { position: static; }
  .auteur { flex-direction: column; text-align: center; }
  .auteur .wp-block-buttons { justify-content: center; }
  .bandeau-rdv__bloc { flex-direction: column; text-align: center; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  h1 { font-size: 32px; } h2 { font-size: 28px; }
  h3, .theme h3, .tarif h3 { font-size: 24px; } h4 { font-size: 20px; }
  .wp-block-button .wp-block-button__link { font-size: 16px; }
  .questions-faq summary { font-size: 19px; padding: 18px 20px; }
  .questions-faq details > :not(summary) { margin-inline: 20px; }
  .marque a::before { width: 40px; height: 28px; }
  .marque strong { font-size: 19px; }
  .marque { font-size: 12px; }
  .entete-site .entete-cta { display: none; } /* bat « .wp-block-buttons.is-layout-flex » du bloc */
  .qsj { padding-top: 110px; }
  .qsj .chapo { font-size: 20px; }
  .questions { font-size: 18px; }
  .themes, .tarifs__cartes, .articles, .wp-block-post-template.articles { grid-template-columns: 1fr; }
  .tarifs__cartes > .tarif:last-child, .articles > li:last-child { grid-column: auto; }
  .tarif .tarif__prix { font-size: 34px; }
  .tarifs__bloc, .contact__bloc, .approche-bloc { border-radius: var(--r-l); }
  .formulaire { padding: 22px; }
  .formulaire .wpcf7-form { grid-template-columns: 1fr; }
  .agenda { padding: 22px; }
  .pied__haut { grid-template-columns: 1fr; }
  .pied__haut > * { border-left: 0 !important; padding: 0 !important; }
  .pied__bas li + li::before { content: none; }
  .ctas .wp-block-button, .ctas .wp-block-button__link, .envoi .wpcf7-submit { width: 100%; justify-content: center; }
  .page-tete { padding-top: 130px; }
  .page-tete__intro, .page-tete .wp-block-post-excerpt__excerpt { font-size: 19px; }
  .billet__image img { aspect-ratio: 4 / 3; }
  .billet__contenu .wp-block-quote { font-size: 21px; padding: 26px 22px; }
  .auteur { padding: 26px 20px; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }