/* Énergie Tactile — feuille principale.
   La DA est celle validée par la cliente : vert sauge, crème, Marcellus et Inter.
   Voir docs/DIRECTION-ARTISTIQUE.md. Les jetons sont dans le CSS critique,
   injecté inline en tête de page par tools/build.py. */

/* ── Sections et rythme ─────────────────────────────────────────────────── */
.section{padding:3rem 0}
.section--blanc{background:var(--blanc)}
.section--creme{background:var(--creme)}
.section--sauge{background:var(--sauge-bande)}
.section--pale{background:var(--vert-pale)}
.section--serre{padding:2.5rem 0}

/* Sur fond sauge le corps de texte passe en olive : du blanc sur #A2BAA2
   ne donne que 2,1:1 de contraste, ce qui échoue en AA. Les grands titres
   restent en blanc, leur taille les rendant conformes. */
.section--sauge h2,.section--sauge h3{color:var(--titre-clair)}
.section--sauge .surtitre{color:var(--titre-clair)}
.section--sauge p,.section--sauge li{color:var(--olive)}

.section-tete{text-align:center;max-width:60ch;margin:0 auto 2.75rem}
.section-tete p:last-child{margin-bottom:0}

/* ── Deux colonnes texte et image ───────────────────────────────────────── */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.duo--inverse .duo-media{order:2}
.duo-media img{border-radius:10px;box-shadow:var(--ombre-douce)}
.duo-texte > :last-child{margin-bottom:0}
.duo-texte .mesure{max-width:60ch}
/* Intro de prestation sans photo : nom souligné + texte à gauche, bloc
   « Mes autres prestations » à droite pour combler le vide. */
.intro-prestation{display:grid;grid-template-columns:1.7fr 1fr;gap:4rem;align-items:start}
.intro-texte > :last-child{margin-bottom:0}
.intro-texte .mesure{max-width:60ch}
/* Le trait de séparation épouse la largeur du titre (bordure du titre lui-même)
   et reste fin : 1,5px, moitié de l'ancien. */
.intro-nom{display:inline-block;font-family:var(--serif);font-size:2rem;font-weight:600;
  text-transform:capitalize;color:var(--titre);line-height:1.2;margin:0 0 1.5rem;
  border-bottom:1.5px solid var(--sauge);padding-bottom:0.7rem}
.intro-aside{background:var(--creme);border-radius:16px;padding:1.75rem 1.9rem;box-shadow:var(--ombre-carte)}
.intro-aside-titre{font-family:var(--serif);font-size:1.25rem;font-weight:600;color:var(--titre);margin:0 0 0.6rem}
/* Accordéon des familles : <details>/<summary> natif, sans JS. */
.intro-aside-fam{border-top:1px solid var(--trait)}
.intro-aside-fam-titre{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  font-size:0.78rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--sauge-fonce);padding:0.9rem 0}
.intro-aside-fam-titre::-webkit-details-marker{display:none}
.intro-aside-fam-titre::after{content:"";flex:0 0 auto;width:0.5rem;height:0.5rem;
  border-right:2px solid var(--sauge-fonce);border-bottom:2px solid var(--sauge-fonce);
  transform:rotate(45deg) translate(-2px,-2px);transition:transform var(--transition)}
.intro-aside-fam[open] .intro-aside-fam-titre::after{transform:rotate(-135deg) translate(-2px,-2px)}
.intro-aside-fam-titre:hover{color:var(--sauge)}
.intro-aside ul{list-style:none;margin:0 0 0.7rem;padding:0}
.intro-aside li{border-bottom:1px solid var(--trait)}
.intro-aside li:last-child{border-bottom:none}
.intro-aside a{display:block;padding:0.55rem 0;color:var(--olive);text-decoration:none;font-size:0.9375rem}
.intro-aside a:hover{color:var(--sauge-fonce)}

/* ── Cartes ─────────────────────────────────────────────────────────────── */
.cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem}
.carte{
  background:var(--blanc);border-radius:12px;overflow:hidden;
  box-shadow:var(--ombre-carte);display:flex;flex-direction:column;
  transition:transform var(--transition),box-shadow var(--transition);
}
.carte:hover{transform:translateY(-3px);box-shadow:var(--ombre-douce)}
.carte img{width:100%;height:230px;object-fit:cover}
.carte-corps{padding:1.6rem;display:flex;flex-direction:column;gap:0.75rem;flex:1}
.carte-corps h3{color:var(--titre);margin:0}
.carte-corps p{color:var(--olive);margin:0;flex:1}
.carte-corps .btn{align-self:flex-start;margin-top:0.35rem}

/* ── Fil d'Ariane ───────────────────────────────────────────────────────── */
.ariane{background:var(--creme);border-bottom:1px solid var(--trait);font-size:0.8125rem}
.ariane ol{display:flex;flex-wrap:wrap;gap:0.4rem;list-style:none;margin:0;padding:0.85rem 0}
.ariane li:not(:last-child)::after{content:'›';margin-left:0.4rem;color:var(--texte-doux)}
.ariane a{color:var(--sauge-fonce);text-decoration:none}
.ariane a:hover{text-decoration:underline}
.ariane [aria-current="page"]{color:var(--texte-doux)}

/* ── Bandeau des tarifs d'une prestation ────────────────────────────────── */
.bandeau-tarif{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,290px));justify-content:center;gap:1.5rem;text-align:center}
/* Cartes blanches, même vocabulaire que les vignettes et les cartes de l'accueil : coins arrondis, ombre diffuse, pictogramme sauge. */
.bandeau-tarif > div{display:flex;flex-direction:column;align-items:center;background:var(--blanc);border-radius:14px;padding:1.6rem 1.25rem 1.5rem;box-shadow:var(--ombre-carte);border-top:3px solid var(--sauge)}
.picto-tarif{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(162,186,162,0.22);color:var(--sauge-fonce);margin-bottom:0.75rem}
.picto-tarif svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.bandeau-tarif .etiquette{font-family:var(--serif);font-size:1.0625rem;font-weight:600;color:var(--titre);margin:0 0 0.35rem}
.bandeau-tarif .prix{font-size:1.75rem;display:block;line-height:1.25;color:var(--olive)}
.prix-a{font-family:var(--serif);font-style:italic;font-weight:400;font-size:0.8em;color:var(--titre);padding:0 0.1em}
.bandeau-tarif .detail{font-size:0.875rem;color:var(--texte-doux);margin:0.45rem 0 0;max-width:24ch;line-height:1.45}
.bandeau-tarif-suite{text-align:center;margin:2.25rem 0 0}

/* ── Grille tarifaire ───────────────────────────────────────────────────── */
.tarifs-groupe{margin:0 0 3.5rem}
.tarifs-groupe:last-child{margin-bottom:0}
.tarifs-groupe > h3{color:var(--titre-fonce);border-bottom:2px solid var(--sauge);padding-bottom:0.6rem;margin-bottom:0.5rem;font-size:1.625rem}
.tarifs-groupe-entete{display:flex;align-items:baseline;flex-wrap:wrap;justify-content:space-between;gap:0.75rem 1.5rem;border-bottom:2px solid var(--sauge);padding-bottom:0.6rem;margin-bottom:0.5rem}
.tarifs-groupe-entete h3{color:var(--titre-fonce);font-size:1.625rem;margin:0;border:none;padding:0}
.btn--mini{padding:0.45rem 1.1rem;font-size:0.875rem}
.tarifs-sous-groupe-entete{display:flex;align-items:baseline;flex-wrap:wrap;justify-content:space-between;gap:0.75rem 1.5rem;margin:1.5rem 0 0.25rem}
.tarifs-sous-groupe-entete h4{color:var(--titre-fonce);font-size:1.125rem;margin:0}
.tarif-ligne{display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;padding:1rem 0;border-bottom:1px solid var(--trait)}
.tarif-nom{margin:0}
.tarif-nom a{color:inherit;text-decoration:none;border-bottom:1px solid var(--sauge)}
.tarif-nom a:hover{color:var(--sauge-fonce)}
.tarif-duree{color:var(--texte-doux);font-size:0.9375rem}
.tarif-note{display:block;font-size:0.8125rem;color:var(--texte-doux);font-style:italic}
.tarif-prix{white-space:nowrap;font-size:1.0625rem}

/* ── Avis ───────────────────────────────────────────────────────────────── */
.avis{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:1.5rem}
.avis-carte{background:var(--blanc);border-radius:12px;padding:1.6rem;box-shadow:var(--ombre-carte);display:flex;flex-direction:column;gap:0.75rem}
.avis-tete{display:flex;align-items:center;gap:0.75rem}
.avis-initiale{width:38px;height:38px;border-radius:50%;background:var(--sauge);color:var(--blanc);display:grid;place-items:center;font-weight:600;flex:0 0 auto}
.avis-nom{margin:0;font-weight:600;font-size:0.9375rem}
.avis-etoiles{display:flex;gap:2px}
.avis-etoiles svg{width:14px;height:14px;fill:#E8B84B;stroke:none}
.avis-carte p{margin:0;font-size:0.9375rem}

/* ── Listes à puces ─────────────────────────────────────────────────────── */
.liste-sobre{list-style:none;margin:0;padding:0;display:grid;gap:0.6rem}
.liste-sobre li{position:relative;padding-left:2.2rem}
/* Puce nénuphar : l'icône « spa » (Font Awesome) du WordPress, relevée sur energietactile.fr/massages/. Posée en masque : elle prend la couleur du fond (var(--sauge)). Même dessin dans assets/images/puce-nenuphar.svg. */
.liste-sobre li::before{
  content:'';position:absolute;left:0;top:0.32em;
  width:1.35rem;height:1.2rem;background:var(--sauge);
  -webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20576%20512%22%3E%3Cpath%20d=%22M568.25%20192c-29.04.13-135.01%206.16-213.84%2083-33.12%2029.63-53.36%2063.3-66.41%2094.86-13.05-31.56-33.29-65.23-66.41-94.86-78.83-76.84-184.8-82.87-213.84-83-4.41-.02-7.79%203.4-7.75%207.82.23%2027.92%207.14%20126.14%2088.77%20199.3C172.79%20480.94%20256%20480%20288%20480s115.19.95%20199.23-80.88c81.64-73.17%2088.54-171.38%2088.77-199.3.04-4.42-3.34-7.84-7.75-7.82zM287.98%20302.6c12.82-18.85%2027.6-35.78%2044.09-50.52%2019.09-18.61%2039.58-33.3%2060.26-45.18-16.44-70.5-51.72-133.05-96.73-172.22-4.11-3.58-11.02-3.58-15.14%200-44.99%2039.14-80.27%20101.63-96.74%20172.07%2020.37%2011.7%2040.5%2026.14%2059.22%2044.39a282.768%20282.768%200%200%201%2045.04%2051.46z%22/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20576%20512%22%3E%3Cpath%20d=%22M568.25%20192c-29.04.13-135.01%206.16-213.84%2083-33.12%2029.63-53.36%2063.3-66.41%2094.86-13.05-31.56-33.29-65.23-66.41-94.86-78.83-76.84-184.8-82.87-213.84-83-4.41-.02-7.79%203.4-7.75%207.82.23%2027.92%207.14%20126.14%2088.77%20199.3C172.79%20480.94%20256%20480%20288%20480s115.19.95%20199.23-80.88c81.64-73.17%2088.54-171.38%2088.77-199.3.04-4.42-3.34-7.84-7.75-7.82zM287.98%20302.6c12.82-18.85%2027.6-35.78%2044.09-50.52%2019.09-18.61%2039.58-33.3%2060.26-45.18-16.44-70.5-51.72-133.05-96.73-172.22-4.11-3.58-11.02-3.58-15.14%200-44.99%2039.14-80.27%20101.63-96.74%20172.07%2020.37%2011.7%2040.5%2026.14%2059.22%2044.39a282.768%20282.768%200%200%201%2045.04%2051.46z%22/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Mise en colonnes avec un filet de séparation. Le nombre de colonnes est
   décidé au build, d'après le nombre d'éléments et la longueur du plus long :
   une liste de trois entrées, ou dont un élément dépasse 90 caractères, reste
   sur une colonne. Voir colonnes_liste() dans tools/build.py.
   display:block est nécessaire, « columns » et « grid » sont incompatibles. */
.liste-sobre--2col,.liste-sobre--3col{
  display:block;
  column-gap:3.5rem;
  column-rule:1px solid var(--trait);
}
.liste-sobre--2col{columns:2}
.liste-sobre--3col{columns:3;column-gap:3rem}
.liste-sobre--2col li,.liste-sobre--3col li{
  break-inside:avoid;          /* un élément n'est jamais coupé entre deux colonnes */
  margin-bottom:0.7rem;
}
.liste-sobre--2col li:last-child,.liste-sobre--3col li:last-child{margin-bottom:0}

@media (max-width:960px){
  .liste-sobre--3col{columns:2;column-gap:3.5rem}
}
@media (max-width:620px){
  .liste-sobre--2col,.liste-sobre--3col{columns:1;column-rule:none}
}

/* ── Encart, appel à l'action et mentions ───────────────────────────────── */
.encart{background:var(--creme);border-left:3px solid var(--sauge);border-radius:0 10px 10px 0;padding:1.6rem 1.8rem}
.encart > :last-child{margin-bottom:0}
.appel{text-align:center}
.appel h2{margin-bottom:0.75rem}
.appel-actions{display:flex;flex-wrap:wrap;gap:0.75rem;justify-content:center;margin-top:1.75rem}
/* Mention de cadre de l'accueil : la phrase imposée, mise en valeur plutôt que perdue entre deux sections (vert du site, Playfair, pictogramme du WordPress, filets de part et d'autre). */
/* Rapproche la phrase du bloc qui la précède : le bas du bloc cabinet laisse déjà son propre espace. */
.section--mention{padding-top:0;margin-top:-1.5rem}
.mention-cadre{display:flex;flex-direction:column;align-items:center;gap:0.9rem;text-align:center;max-width:760px}
.mention-picto{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(162,186,162,0.22);color:var(--sauge-fonce)}
.mention-picto svg{width:24px;height:22px;fill:currentColor}
.mention-cadre p{margin:0;font-family:var(--serif);font-size:clamp(1.15rem,2.4vw,1.5rem);font-weight:600;line-height:1.45;color:var(--sauge-fonce);padding:1rem 0;border-top:1px solid rgba(130,147,130,0.35);border-bottom:1px solid rgba(130,147,130,0.35);max-width:44ch}
.mention{font-size:0.8125rem;color:var(--texte-doux);text-align:center;max-width:66ch;margin:0 auto}

/* ── Coordonnées et accès ───────────────────────────────────────────────── */
.infos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2.5rem}
.infos h3{font-size:1.25rem;color:var(--titre)}
.infos p{margin:0 0 0.5rem;font-size:0.9375rem}
.horaires{list-style:none;margin:0;padding:0;font-size:0.9375rem}
.horaires li{display:flex;justify-content:space-between;gap:1rem;padding:0.35rem 0;border-bottom:1px solid var(--trait)}
.horaires .jour{color:var(--texte-doux)}

/* ── Pied de page ───────────────────────────────────────────────────────── */
.pied{background:var(--vert-pale);padding:4.5rem 0 0}
.pied-haut{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-bottom:2.25rem;margin-bottom:2.5rem;border-bottom:1px solid var(--trait)}
.pied-haut img{width:150px;height:82px;object-fit:contain;flex:none}
.pied-haut .pied-accroche{margin:0;flex:1;text-align:center;max-width:none;font-size:1.125rem}
.pied-grille{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.15fr;gap:2.5rem;align-items:start}
/* Titres de colonne : Playfair sauge, filet court dessous, pour un rythme commun à toutes les colonnes. */
.pied h4{font-family:var(--serif);font-size:1.0625rem;font-weight:600;color:var(--titre);margin:0 0 1.1rem;padding-bottom:0.65rem;position:relative}
.pied h4::after{content:'';position:absolute;left:0;bottom:0;width:2rem;height:2px;background:var(--sauge);border-radius:2px}
.pied ul{list-style:none;margin:0;padding:0;display:grid;gap:0.6rem}
.pied a{color:var(--olive);text-decoration:none;font-size:0.9375rem}
.pied a:hover{color:var(--sauge-fonce);text-decoration:underline}
.pied a.btn,.pied a.btn:hover{color:var(--blanc);text-decoration:none}
.pied-accroche{font-family:var(--serif);font-size:1rem;font-weight:600;color:var(--titre);margin:0 0 1.1rem;line-height:1.35;max-width:24ch}
.pied .pied-coord{gap:0.85rem}
.pied-coord li{display:flex;gap:0.65rem;align-items:flex-start;font-size:0.9375rem;color:var(--olive);line-height:1.5}
.pied-coord svg{flex:none;width:18px;height:18px;margin-top:0.2rem;stroke:var(--sauge-fonce);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pied-horaires li{display:flex;justify-content:space-between;gap:1rem;font-size:0.9375rem;color:var(--olive);padding-bottom:0.45rem;border-bottom:1px solid var(--trait)}
.pied-horaires li span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.pied-zone{margin-top:3rem;padding-top:2rem;border-top:1px solid var(--trait);text-align:center}
.pied-zone h4{display:inline-block;margin-bottom:1.1rem}
.pied-zone h4::after{left:50%;transform:translateX(-50%)}
.pied .pied-villes{display:flex;flex-wrap:wrap;justify-content:center;gap:0.5rem 0.6rem;max-width:900px;margin:0 auto 0.9rem}
.pied-villes li{font-size:0.8125rem;color:var(--olive);padding:0.28rem 0.85rem;border:1px solid rgba(130,147,130,0.45);border-radius:100px;background:rgba(255,255,255,0.45)}
.pied-zone p{margin:0;font-size:0.8125rem;color:var(--texte-doux)}
.pied-bas{border-top:1px solid var(--trait);margin-top:2rem;padding:1.4rem 0;font-size:0.8125rem;color:var(--texte-doux);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}
.pied-bas p{margin:0}

/* ── Accessibilité ──────────────────────────────────────────────────────── */
.saut{position:absolute;left:-9999px;top:0;background:var(--blanc);color:var(--olive);padding:0.75rem 1.25rem;z-index:1200}
.saut:focus{left:0}
:focus-visible{outline:2px solid var(--sauge-fonce);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── Entrée en vue, animation sobre et respectueuse des préférences ─────── */
.apparait{opacity:0;transform:translateY(18px);transition:opacity 700ms ease-out,transform 700ms cubic-bezier(0.32,0.72,0,1)}
.apparait.vue{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .apparait{opacity:1;transform:none;transition:none}
  /* l'animation du hero est neutralisée ici aussi : le texte doit rester
     visible, pas seulement apparaître instantanément à la fin */
  .hero h1,.hero .hero-sous,.hero .hero-actions,.hero .hero-legende{
    animation:none;opacity:1;transform:none;
  }
  *{animation-duration:0.01ms !important;transition-duration:0.01ms !important}
}

/* ── Adaptations ────────────────────────────────────────────────────────── */
@media (max-width:1200px){
  .pied-grille{grid-template-columns:1fr 1fr 1fr;gap:2.5rem}
}
@media (max-width:900px){
  .pied-grille{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  .section{padding:3rem 0}
  .section--serre{padding:2rem 0}
  .duo{grid-template-columns:1fr;gap:2rem}
  .duo--inverse .duo-media{order:0}
  /* Smartphone : l'intro s'empile et se centre ; le bloc « Mes autres
     prestations » est masqué (le nuage « À découvrir aussi » du bas suffit). */
  .intro-prestation{grid-template-columns:1fr;text-align:center}
  .intro-texte .mesure{max-width:none;margin-inline:auto}
  .intro-aside{display:none}
  .section-tete{margin-bottom:2.5rem}
  .tarif-ligne{flex-direction:column;gap:0.25rem}
  .tarif-prix{align-self:flex-start}
  .pied-grille{grid-template-columns:1fr;gap:2.25rem}
  .pied-haut{flex-direction:column;align-items:flex-start;gap:1.1rem}
  .pied-haut .pied-accroche{text-align:left}
  .pied-bas{justify-content:center;text-align:center}
}

/* ── Formulaire ─────────────────────────────────────────────────────────── */
.formulaire label{display:block;font-size:0.8125rem;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var(--sauge-fonce);margin-bottom:0.4rem}
.formulaire input,.formulaire textarea{
  width:100%;font-family:var(--sans);font-size:1rem;color:var(--olive);
  padding:0.8rem 1rem;border:1px solid var(--trait);border-radius:8px;
  background:var(--blanc);transition:border-color var(--transition);
}
.formulaire input:focus,.formulaire textarea:focus{border-color:var(--sauge-fonce);outline:none}
.formulaire textarea{resize:vertical;min-height:8rem}
.formulaire button{margin-top:0.5rem;border:0}
/* pot de miel : invisible pour l'humain, rempli par les robots */
.pot-de-miel{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Une image dont la source est petite ne doit pas être étirée : elle garde
   sa taille réelle et reste centrée. Le portrait de la praticienne récupéré
   du site en place ne fait que 322 px de large. */
.duo-media--nature img{max-width:100%;width:auto;margin-inline:auto}

/* ── Vignettes des prestations proches ──────────────────────────────────── */
/* Remplacent la liste de liens « À découvrir aussi ». Même vocabulaire que
   les cartes de l'accueil, en plus compact : fond blanc, coins arrondis,
   ombre diffuse, photo en haut, titre en Playfair sauge. */
.vignettes{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:1.75rem;
  max-width:1000px;
  margin-inline:auto;
  list-style:none;
  padding:0;
}
/* Quatre cartes : 2 x 2 sur tablette, 4 sur une ligne en grand écran, jamais 3 + 1 orphelin. */
.vignettes--quatre{grid-template-columns:repeat(4,1fr)}
@media (max-width:999px){.vignettes--quatre{grid-template-columns:repeat(2,1fr)}}
/* Nuage de liens : pastilles sauge, le maillage « À découvrir aussi » sans les photos. */
.nuage{list-style:none;margin:1rem auto 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:0.6rem;max-width:880px}
.nuage a{display:inline-block;padding:0.45rem 1.15rem;border:1px solid var(--sauge);border-radius:100px;font-size:0.95rem;color:var(--titre-fonce);text-decoration:none;background:var(--blanc);transition:background var(--transition),color var(--transition)}
.nuage a:hover{background:var(--sauge);color:var(--blanc)}
/* Groupes titrés (annuaire des prestations) : même filet que .tarifs-groupe,
   pour rester dans le même vocabulaire que la grille tarifaire. */
.vignettes-groupe-titre{
  max-width:1000px;margin:0 auto 1.5rem;color:var(--titre);
  border-bottom:2px solid var(--sauge);padding-bottom:0.6rem;font-size:1.625rem;
}
.vignettes-groupe-titre:not(:first-child){margin-top:3rem}
/* Illustration sous le texte d'intro (ex. visuel « remboursement mutuelle »). */
.illustration-centree{margin:2rem 0 0;max-width:520px;text-align:center}
.illustration-centree img{width:100%;height:auto;border-radius:16px;box-shadow:var(--ombre-carte)}
/* Vidéo de présentation portrait (page « Qui suis-je »). */
.video-portrait{margin:0 auto;max-width:340px}
.video-portrait video{width:100%;height:auto;display:block;border-radius:16px;box-shadow:var(--ombre-carte);background:var(--sauge-bande)}
.vignettes-groupe-titre + .vignettes{margin-bottom:0}
/* Deux groupes côte à côte (entreprise, événementiel), une carte chacun. */
.vignettes-cote{display:grid;grid-template-columns:1fr 1fr;gap:0 1.75rem;max-width:1000px;margin:3rem auto 0}
.vignettes-cote .vignettes-groupe-titre{margin-top:0}
.vignettes-cote .vignettes{grid-template-columns:1fr}
@media (max-width:620px){.vignettes-cote{grid-template-columns:1fr}.vignettes-cote > div + div{margin-top:3rem}}
.vignette{margin:0}
.vignette a{
  display:flex;flex-direction:column;height:100%;
  background:var(--blanc);border-radius:12px;overflow:hidden;
  box-shadow:var(--ombre-carte);text-decoration:none;
  transition:transform var(--transition),box-shadow var(--transition);
}
.vignette a:hover{transform:translateY(-3px);box-shadow:var(--ombre-douce)}
.vignette img{width:100%;height:172px;object-fit:cover;display:block}
.vignette span{
  display:block;padding:1.15rem 1.25rem;
  font-family:var(--serif);font-size:1.125rem;font-weight:600;
  line-height:1.3;color:var(--titre);
}
.vignette a:hover span{color:var(--sauge-fonce)}

@media (max-width:620px){
  .vignettes{grid-template-columns:1fr;gap:1.25rem}
  .vignette img{height:150px}
}

/* Phrase sous « Avis et témoignages » : comme sur le WordPress (Playfair Display 600, 32 px, #A2BAA2, centrée, relevé au style calculé le 08/10/2026). */
.sous-titre-avis{font-size:clamp(1.3rem,4vw,2rem);font-weight:600;color:var(--titre);text-align:center;margin:0.5rem auto 0;line-height:1.3}

/* ── Page contact ───────────────────────────────────────────────────────── */
/* Trois cartes d'action (mêmes cartes que le bloc tarifs), une note, puis formulaire et fiche du cabinet côte à côte. */
.contact-actions{max-width:960px;margin-inline:auto}
.contact-tel{font-size:1.5rem;text-decoration:none;color:var(--olive);margin-bottom:0.4rem}
.contact-tel:hover{color:var(--bleu-survol)}
.contact-actions .btn{margin-top:auto}
.contact-note{display:flex;align-items:center;justify-content:center;gap:0.75rem;max-width:960px;margin:2rem auto 0;padding:1rem 1.5rem;background:rgba(162,186,162,0.18);border-radius:12px;text-align:center;font-size:0.9375rem;color:var(--olive)}
.contact-note svg{flex:none;width:20px;height:20px;stroke:var(--sauge-fonce);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.contact-duo{display:grid;grid-template-columns:1.1fr 1fr;gap:3.5rem;align-items:start;max-width:1100px}
.contact-cabinet{background:var(--blanc);border-radius:14px;overflow:hidden;box-shadow:var(--ombre-carte)}
.contact-cabinet img{display:block;width:100%;height:220px;object-fit:cover}
.contact-cabinet-corps{padding:1.6rem 1.75rem 1.75rem}
.contact-cabinet h3{font-size:1.25rem;margin:0 0 0.9rem}
.contact-cabinet h3 + .horaires{margin-bottom:0}
.contact-infos{list-style:none;margin:0 0 1.75rem;padding:0;display:grid;gap:0.8rem}
.contact-infos li{display:flex;gap:0.7rem;align-items:flex-start;font-size:0.9375rem;line-height:1.5;color:var(--olive)}
.contact-infos svg{flex:none;width:20px;height:18px;margin-top:0.2rem;fill:var(--sauge)}
.contact-infos li:first-child svg{width:18px;height:18px;fill:none;stroke:var(--sauge-fonce);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:900px){.contact-duo{grid-template-columns:1fr;gap:2.5rem}}

/* Carte : un cadre qui garde sa taille avant et après le clic, pour ne pas faire sauter la page. */
.carte[data-carte]{max-width:1100px;margin:0 auto;height:380px;border-radius:14px;overflow:hidden;background:rgba(162,186,162,0.18);box-shadow:var(--ombre-carte)}
.carte[data-carte] iframe{display:block;width:100%;height:100%;border:0}
.carte-attente{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.5rem;text-align:center;padding:1.5rem}
.carte-attente p{margin:0}
.carte-attente .detail{font-size:0.875rem;color:var(--texte-doux);max-width:44ch;margin-bottom:0.75rem}

.avis-plus{margin-top:.5rem;font-size:1rem}
.avis-plus a{text-decoration:underline;text-underline-offset:3px}

/* ── Animations : zoom des photos au survol, bouton qui se soulève ───────── */
.vignette img,.carte img{transition:transform 600ms cubic-bezier(0.32,0.72,0,1)}
.vignette a:hover img,.carte:hover img{transform:scale(1.06)}
.carte{overflow:hidden}
.btn{transition:background var(--transition),border-color var(--transition),transform var(--transition),box-shadow var(--transition)}
.btn:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(130,147,130,0.30)}
.btn:active{transform:translateY(0) scale(0.985);box-shadow:none}
@media (prefers-reduced-motion:reduce){
  .vignette a:hover img,.carte:hover img{transform:none}
  .btn:hover{transform:none}
}

/* ── Animations de texte et d'entrée latérale ────────────────────────────── */
.apparait--gauche{transform:translateX(-44px)}
.apparait--droite{transform:translateX(44px)}
.titre-anime .mot{display:inline-block;opacity:0;transform:translateY(0.6em);
  transition:opacity 650ms ease-out,transform 650ms cubic-bezier(0.32,0.72,0,1);transition-delay:calc(var(--i) * 70ms)}
.titre-anime.vue .mot{opacity:1;transform:none}
@media (max-width:760px){.apparait--gauche,.apparait--droite{transform:translateY(22px)}}
@media (prefers-reduced-motion:reduce){
  .titre-anime .mot{opacity:1;transform:none;transition:none}
}

/* Les cartes blanches posées sur un bandeau vert gardent le bouton vert standard (sans cela, bouton blanc sur carte blanche). */
.section--sauge .carte-corps .btn{background:var(--sauge);border-color:var(--sauge);color:var(--blanc)}
.section--sauge .carte-corps .btn:hover{background:var(--bleu-survol);border-color:var(--bleu-survol);color:var(--blanc)}
