/* =====================================================================
   MAQUETTE « encre et papier » — aperçu seulement.
   Compilée UNIQUEMENT avec `node build.mjs --maquette` (sortie dans dist-maquette/, jamais dist/) : `npm run build` et `npm run deploy`
   ne la voient pas. Aucun texte ni titre ne change : tout passe par le style.
   Idée : le lavis d'encre de l'accueil est l'atout du site ; le reste s'efface pour le servir (papier, filets, un seul accent vermillon,
   comme le soleil et le sceau d'une estampe).
   ===================================================================== */

:root {
  --paper: #F3F5F1;
  --mist: #E4ECE7;
  --ink-g: #1F3B36;
  --seal: #B5412F;
  --line: #D3DDD6;
  --shadow: 0 1px 2px rgba(31, 59, 54, .06), 0 12px 32px rgba(31, 59, 54, .08);
  --display: 'Bodoni Moda', Georgia, serif;
  --ease: cubic-bezier(.25, 0, .3, 1); /* Open Props : ease-out-3 */
  --shadow-hover: 0 2px 4px rgba(31, 59, 54, .08), 0 18px 40px rgba(31, 59, 54, .14);
  /* Les aplats beige et sauge de toutes les pages deviennent papier et brume : la palette se propage sans toucher au HTML. */
  --beige: var(--paper);
  --beige-80: var(--paper);
  --sage: var(--mist);
  --sage-63: var(--mist);
}
body { background: var(--paper); }
.float-cta { background: var(--green); box-shadow: 0 6px 20px rgba(31, 59, 54, .3); }

/* ---------------------------------------------------------- Boutons : un plein (action), un contour (suite) */
.btn { font-weight: 600; letter-spacing: .005em; }
.btn:hover { background: var(--ink-g); border-color: var(--ink-g); color: #fff; }
.btn-ghost, .home .card-round .btn { background: transparent; color: var(--green); border: 1.5px solid var(--green); }
.btn-ghost:hover, .home .card-round .btn:hover { background: var(--green); border-color: var(--green); color: #fff; }
.home .place .btn-w { background: var(--green); border-color: var(--green); color: #fff; }
.home .place .btn-w:hover { background: var(--ink-g); border-color: var(--ink-g); }

/* ---------------------------------------------------------- Accueil : le lavis */
.home { background: var(--paper); }
.home .hero { height: clamp(400px, 66vh, 660px); background: #E9EEF0; overflow: hidden; }
.home .hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 38%; }
/* Brume qui dérive lentement : le seul mouvement de la page, coupé si le visiteur demande moins d'animations */
.home .hero::before { content: ''; position: absolute; inset: 0 -25%; z-index: 1; pointer-events: none;
  background: radial-gradient(55% 26% at 26% 62%, rgba(255, 255, 255, .55), transparent 70%), radial-gradient(48% 24% at 76% 70%, rgba(255, 255, 255, .45), transparent 70%);
  animation: brume 52s ease-in-out infinite alternate; }
.home .hero::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(46% 24% at 40% 21%, rgba(243, 245, 241, .92), rgba(243, 245, 241, .55) 60%, rgba(243, 245, 241, 0) 100%), linear-gradient(to bottom, rgba(243, 245, 241, 0) 0, rgba(243, 245, 241, 0) 62%, var(--paper) 96%); }
@keyframes brume { from { transform: translateX(-7%); } to { transform: translateX(7%); } }
@media (prefers-reduced-motion: reduce) { .home .hero::before { animation: none; } }
.home .hero-title { display: block; position: absolute; left: 50%; transform: translateX(-50%); margin: 0; z-index: 2; top: clamp(26px, 8vh, 72px); width: min(880px, 92%); color: var(--ink-g); text-shadow: 0 0 10px var(--paper), 0 0 22px var(--paper); }
.home .hero-title span { font-size: clamp(2.1rem, 5.4vw, 4rem); line-height: 1.08; letter-spacing: -.012em; }
.home .hero-title small { margin-top: 12px; font: 700 clamp(1.05rem, 2.1vw, 1.5rem)/1.3 var(--display); color: #3E5E57; letter-spacing: .01em; }

/* Le bouton de rendez-vous remonte dans la brume, au bas du lavis */
.home .why { background: transparent; margin-top: clamp(-70px, -5vw, -24px); position: relative; z-index: 3; padding: 0 0 88px; }
.home .why > .wrap { display: flex; flex-direction: column; align-items: stretch; }
.home .why .cta-main { order: 1; margin: 0; }
.home .why .cta-rating { order: 2; margin: 14px 0 0; text-align: center; color: #3b4d48; }
.home .why .ico-lotus { order: 3; display: block; width: 58px; height: 62px; margin: 64px auto 0; opacity: .9; }
.home .why h1 { order: 4; margin: 28px auto 40px; max-width: 24ch; text-align: center; font: 700 clamp(1.7rem, 3.4vw, 2.5rem)/1.18 var(--display); color: var(--ink-g); text-wrap: balance; }
.home .why .why-grid { order: 5; }
.home .why h2 { order: 6; }
.home .why .cta-main .btn { min-width: 0; min-height: 58px; padding: 14px 42px; font: 600 1.125rem/1.2 var(--font); box-shadow: 0 10px 28px rgba(48, 87, 78, .32); }
.home .why .cta-main .btn:hover { box-shadow: 0 6px 18px rgba(31, 59, 54, .3); }

/* « Pourquoi consulter » : une liste calme séparée par des filets, au lieu de huit cartes grises à ombre dure */
.home .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 24px; width: min(960px, 100%); margin: 0 auto 64px; }
.home .why-grid .item { min-height: 88px; justify-content: center; align-items: center; text-align: center; padding: 18px 22px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow);
  font: 500 1.125rem/1.5 var(--font); color: #1B2C28; }
.home .why h2 { max-width: 40rem; margin: 0 auto; font: 500 1.25rem/1.7 var(--font); color: #34443f; text-align: center; text-wrap: balance; }

/* « Des signes qui ne trompent pas » : titre à gauche, lignes à droite, sur la brume */
.home .signs { background: linear-gradient(to bottom, var(--paper) 0, var(--mist) 80px, var(--mist) calc(100% - 80px), var(--paper) 100%); padding: 120px 0; }
.home .signs .wrap { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 64px; align-items: start; }
.home .signs h2 { margin: 0; position: sticky; top: 110px; font: 700 clamp(1.8rem, 3.2vw, 2.5rem)/1.18 var(--display); color: var(--ink-g); }
.home .signs ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; font: 500 1.125rem/1.6 var(--font); color: #1B2C28; text-align: left; }
.home .signs li { padding: 18px 22px; background: rgba(255, 255, 255, .78); border: 1px solid rgba(31, 59, 54, .12); border-left: 3px solid var(--gold); border-radius: 12px; }
.home .signs strong { color: var(--ink-g); }

/* Avis */
.home .reviews { background: var(--paper); padding: 88px 0 72px; }
.home .car-track { justify-content: flex-start; align-items: flex-start; gap: 20px; padding: 6px 6px 18px; scroll-snap-type: x mandatory; scroll-padding-left: 6px;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 22px, #000 calc(100% - 38px), transparent 100%); mask-image: linear-gradient(to right, transparent 0, #000 22px, #000 calc(100% - 38px), transparent 100%); }
.home .car-track > figure:not(.rv-card) { display: contents; }
.home .car-track > figure:not(.rv-card) img { flex: 0 0 320px; width: 320px !important; height: auto !important; scroll-snap-align: start; border-radius: 12px; box-shadow: var(--shadow); }
.home .reviews .car-btn { width: 44px; height: 44px; padding: 0; border-radius: 50%; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); display: flex; align-items: center; justify-content: center; }
.home .reviews .car-btn .ico { width: 12px; height: 20px; }
.home .car-track .rv-card { border-radius: 14px; border-color: var(--line); box-shadow: var(--shadow); }

/* Votre accompagnement : deux cartes sobres, bouton en contour */
.home .accomp { background: var(--paper); padding: 24px 0 104px; }
.home .accomp > .wrap > h2 { margin-bottom: 48px; font: 700 clamp(1.9rem, 3.6vw, 2.7rem)/1.15 var(--display); color: var(--ink-g); }
.home .cards2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; width: min(980px, 100%); margin: 0 auto; }
.home .card-round, .home .card-round.alt { align-items: center; text-align: center; padding: 42px 38px 38px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: var(--shadow); }
.home .card-round h3 { margin-bottom: 18px; font: 700 1.7rem/1.2 var(--display); color: var(--ink-g); }
.home .card-round p { font: 500 1.0625rem/1.65 var(--font); color: #1B2C28; }
.home .card-round .btn { min-width: 0; min-height: 48px; margin-top: 22px; padding: 10px 30px; background: transparent; color: var(--green); border: 1.5px solid var(--green); font: 600 1rem/1.2 var(--font); }
.home .card-round .btn:hover { background: var(--green); color: #fff; }

/* Qui suis-je : une bande vert encre, le seul aplat sombre de la page */
.home .about-strip { background: var(--paper); padding: 0 clamp(16px, 4vw, 40px) 104px; }
.home .about-box { background: var(--header); color: #fff; border-radius: 22px; padding: 64px clamp(24px, 6vw, 88px); gap: clamp(28px, 6vw, 96px); }
.home .about-box h2 { margin-bottom: 12px; font: 700 clamp(1.9rem, 3.6vw, 2.8rem)/1.12 var(--display); color: #fff; }
.home .about-box p { max-width: 28rem; font: 400 1.1875rem/1.65 var(--font); color: #DCE7E1; }
.home .about-box .avatar { border: 4px solid var(--gold); background: var(--header); box-shadow: 0 0 0 8px rgba(255, 255, 255, .08); }
.home .about-box .btn-w { min-width: 0; min-height: 48px; padding: 10px 30px; background: #fff; border-color: #fff; color: var(--header); font: 600 1rem/1.2 var(--font); }
.home .about-box .btn-w:hover { background: transparent; color: #fff; }

/* Deux lieux : deux panneaux de même poids */
.home .places { background: var(--paper); padding: 0 0 104px; }
.home .places > .wrap > h2 { margin-bottom: 48px; text-align: center; font: 700 clamp(1.9rem, 3.8vw, 2.8rem)/1.15 var(--display); color: var(--ink-g); }
.home .places-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; width: min(980px, 100%); }
.home .place { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 38px 36px 40px; box-shadow: var(--shadow); }
.home .place h3.city { display: flex; align-items: center; gap: 14px; margin-bottom: 28px; font: 700 1.75rem/1.15 var(--display); font-style: normal; color: var(--ink-g); }
.home .place h3.city::before { content: ''; flex: none; width: 9px; height: 9px; background: var(--seal); transform: rotate(45deg); }
.home .place h4 { gap: 10px; margin: 0 0 8px; font: 600 1rem/1.3 var(--font); color: var(--green); }
.home .place h4 .ico { width: 20px; height: 24px; }
.home .place h4 .ico-clock, .home .place h4 .ico-info { width: 22px; height: 22px; }
.home .place .addr, .home .hours, .home .practical, .home .place .contact-mini { margin-left: 30px; font: 500 1rem/1.6 var(--font); color: #1B2C28; }
.home .place .addr, .home .hours { margin-bottom: 28px; }
.home .hours { grid-template-columns: 5.6rem auto; column-gap: 16px; }
.home .place .contact-mini .btn-w { min-width: 0; min-height: 44px; padding: 8px 26px; font: 600 1rem/1.2 var(--font); }
.home .nearby { width: min(980px, 100%); margin: 28px auto 0; font: 400 .95rem/1.6 var(--font); color: #4C5E58; }
.home .map { width: min(980px, 100%); height: auto; min-height: 0; border: 1px dashed rgba(31, 59, 54, .3); border-radius: 18px; overflow: hidden; background: var(--mist); }
.home .map:has(iframe) { border-style: solid; border-color: var(--line); background: #fff; box-shadow: var(--shadow); }
.home .map iframe { height: 380px; display: block; }
.home .map .map-consent { padding: 22px 24px; display: grid; gap: 14px; justify-items: center; font: 500 .95rem/1.55 var(--font); color: #2B3E39; }
.home .map .map-consent p { margin: 0; }

/* ---------------------------------------------------------- Téléphone : mêmes principes, tailles en rem (plus d'unité « Wix » à 320 px) */
@media (max-width: 767px) {
  .home .hero { height: clamp(380px, 62vh, 520px); }
  .home .hero img { object-position: 38% 40%; }
  .home .hero-title { top: 22px; }
  .home .hero-title span { font-size: clamp(1.8rem, 8.4vw, 2.4rem); }
  .home .hero-title small { font-size: 1.05rem; }
  .home .why { margin-top: -64px; padding-bottom: 56px; }
  .home .why .ico-lotus { margin-top: 44px; }
  .home .why h1 { margin: 22px auto 28px; font-size: 1.65rem; }
  .home .why .cta-main .btn { min-height: 56px; padding: 14px 34px; font-size: 1.0625rem; }
  .home .why-grid { grid-template-columns: 1fr; width: 100%; margin-bottom: 44px; }
  .home .why-grid { gap: 14px; }
  .home .why-grid .item { font-size: 1.0625rem; padding: 16px 18px; min-height: 0; }
  .home .why h2 { font-size: 1.0625rem; }
  .home .signs { padding: 84px 0; background: linear-gradient(to bottom, var(--paper) 0, var(--mist) 56px, var(--mist) calc(100% - 56px), var(--paper) 100%); }
  .home .signs .wrap { grid-template-columns: 1fr; gap: 28px; }
  .home .signs h2 { position: static; font-size: 1.65rem; }
  .home .signs ul { font-size: 1.0625rem; line-height: 1.65; }
  .home .signs li { padding: 15px 18px; }
  .home .reviews { padding: 56px 0 40px; }
  .home .reviews .car-btn { display: none; }
  .home .reviews .carousel { display: block; padding: 0; }
  .home .car-track { flex-direction: row; gap: 14px; overflow-x: auto; overflow-y: hidden; scroll-padding-left: 16px; padding: 4px 16px 18px; -webkit-overflow-scrolling: touch; }
  .home .car-track > figure:not(.rv-card) img { flex-basis: min(80vw, 300px); width: min(80vw, 300px) !important; }
  .home .accomp { padding: 8px 0 64px; }
  .home .accomp > .wrap > h2 { font-size: 1.75rem; margin-bottom: 28px; }
  .home .cards2 { grid-template-columns: 1fr; gap: 20px; }
  .home .card-round, .home .card-round.alt { padding: 30px 24px 28px; border-radius: 16px; }
  .home .card-round h3 { font-size: 1.5rem; }
  .home .card-round p { font-size: 1rem; }
  .home .card-round .btn { min-height: 48px; font-size: 1rem; width: 100%; }
  .home .about-strip { padding: 0 16px 64px; }
  .home .about-box { flex-direction: column; align-items: center; text-align: center; padding: 44px 24px; background: var(--header); gap: 24px; border-radius: 20px; }
  .home .about-box h2 { font-size: 1.9rem; }
  .home .about-box p { font-size: 1.0625rem; }
  .home .about-box .avatar { width: 168px; height: 168px; border-width: 3px; margin: 0 auto; }
  .home .about-box .btn-w { min-height: 48px; font-size: 1rem; }
  .home .places { padding-bottom: 64px; }
  .home .places > .wrap > h2 { font-size: 1.85rem; margin-bottom: 28px; }
  .home .places-grid { grid-template-columns: 1fr; width: 100%; gap: 20px; }
  .home .place { padding: 28px 22px 30px; border-radius: 16px; }
  .home .place h3.city { font-size: 1.5rem; margin-bottom: 20px; }
  .home .place .addr, .home .hours, .home .practical, .home .place .contact-mini { margin-left: 0; font-size: 1rem; }
  .home .place h4 { font-size: 1rem; }
  .home .hours { grid-template-columns: 5.2rem auto; column-gap: 12px; }
  .home .map { border-radius: 16px; }
  .home .map iframe { height: 320px; }
}
@media (min-width: 768px) and (max-width: 1000px) {
  .home .signs .wrap { grid-template-columns: 1fr; gap: 28px; }
  .home .signs h2 { position: static; }
  .home .cards2 { grid-template-columns: 1fr; width: min(640px, 100%); }
  .home .why-grid { gap: 16px 18px; }
}
@media (min-width: 768px) and (max-width: 900px) {
  .home .places-grid { gap: 20px; }
  .home .place { padding: 30px 24px 32px; }
  .home .place .addr, .home .hours, .home .practical, .home .place .contact-mini { margin-left: 0; }
}

/* ---------------------------------------------------------- Bouton flottant : seulement quand le bouton principal a quitté l'écran (maquette.js) */
.mq-js .float-cta { opacity: 0; visibility: hidden; transform: translateY(14px); pointer-events: none; transition: opacity .3s var(--ease), transform .3s var(--ease), visibility 0s .3s, background-color .3s; }
.mq-js .float-cta.on { opacity: 1; visibility: visible; transform: none; pointer-events: auto; transition-delay: 0s; }
@media (max-width: 767px) { footer { padding-bottom: 84px; } }

/* ---------------------------------------------------------- Fondu entre les pages (navigateurs récents ; ignoré ailleurs) : l'en-tête reste en place */
@view-transition { navigation: auto; }
.site-header { view-transition-name: site-header; }
::view-transition-old(root) { animation: vt-out .18s var(--ease) both; }
::view-transition-new(root) { animation: vt-in .28s var(--ease) both; }
@keyframes vt-out { to { opacity: 0; } }
@keyframes vt-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }

/* ---------------------------------------------------------- Retours au toucher et au clavier */
.btn:active { transform: translateY(1px) scale(.985); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, .btn:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; box-shadow: 0 0 0 7px rgba(201, 168, 92, .25); border-radius: 8px; }
.btn:focus-visible { border-radius: 999px; }
.home .why-grid .item, .home .signs li, .home .card-round, .home .place { transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
@media (hover: hover) {
  .home .why-grid .item:hover, .home .card-round:hover, .home .place:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); }
  .home .signs li:hover { transform: translateX(3px); }
}
@media (prefers-reduced-motion: reduce) { .home .why-grid .item, .home .signs li, .home .card-round, .home .place { transition: none; } .home .why-grid .item:hover, .home .card-round:hover, .home .place:hover, .home .signs li:hover { transform: none; } }

/* =====================================================================
   PAGES INTÉRIEURES — mêmes principes que l'accueil : papier et brume, titres Bodoni, cases blanches aux coins doux, un fil doré,
   texte net (Quicksand 500, vert très foncé). Aucun texte ne change. Les titres et le texte courant passent par des règles générales,
   puis chaque page reçoit ses cases.
   ===================================================================== */
main h1, main h2, main h3 { font-family: var(--display); color: var(--ink-g); font-weight: 700; letter-spacing: -.005em; }
main p, main li, main figcaption, main address { font-family: var(--font); }
.bg-beige-80, .bg-beige, .bg-white { background-color: var(--paper); }

/* Mon approche */
.approche-hero { background: var(--paper); }
.approche-hero .imgbox { border-radius: 18px; overflow: hidden; box-shadow: var(--shadow); background: none; }
.approche-hero .txt { border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); padding: 48px 56px 54px; }
.approche-hero h1 { font: 700 clamp(1.7rem, 3vw, 2.3rem)/1.2 var(--display); font-style: normal; margin-bottom: 22px; }
.approche-hero p { font: 500 1.125rem/1.7 var(--font); color: #1B2C28; }
.principles h2 { font: 700 clamp(1.8rem, 3.4vw, 2.6rem)/1.15 var(--display); padding: 24px 0 8px; }
.principles .pcard { background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.principles .cols h3 { font: 700 1.5rem/1.2 var(--display); margin-bottom: 16px; }
.principles .cols p { font: 500 1.0625rem/1.65 var(--font); color: #1B2C28; }
.banner-img .inner.boxed { border-radius: 18px; box-shadow: var(--shadow); }
.banner-img h2, .banner-img h3 { font: 700 1.7rem/1.25 var(--display); margin-bottom: 22px; }
.banner-img p { font: 500 1.0625rem/1.65 var(--font); color: #1B2C28; }

/* Votre séance */
.seance { background: var(--paper); }
.seance .kicker { font: 700 clamp(1.8rem, 3.4vw, 2.6rem)/1.15 var(--display); color: var(--ink-g); margin-bottom: 56px; }
.seance-grid figure img { border-radius: 14px; box-shadow: var(--shadow); }
.seance-grid figcaption { font: 500 .95rem/1.4 var(--font); color: #3E5E57; }
.seance-grid .txt { text-align: left; font: 500 1.125rem/1.7 var(--font); color: #1B2C28; }
.btn-peach { background: var(--green); border-color: var(--green); color: #fff; }
.btn-peach:hover { background: var(--ink-g); border-color: var(--ink-g); color: #fff; }
.tools { background: linear-gradient(to bottom, var(--paper) 0, var(--mist) 70px, var(--mist) 100%); padding: 80px 0 90px; }
.tools h2 { font: 700 clamp(1.9rem, 3.6vw, 2.8rem)/1.15 var(--display); }
.tools .lead { font: 500 1.25rem/1.6 var(--font); color: #1B2C28; }
.tool { background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); padding: 30px 24px 32px; width: 290px; }
.tool img, .round-img { margin-bottom: 20px; box-shadow: 0 0 0 4px rgba(201, 168, 92, .5); }
.tool h3 { font: 700 1.45rem/1.2 var(--display); margin-bottom: 14px; }
.tool p { font: 500 1rem/1.65 var(--font); color: #1B2C28; }

/* Qui suis-je ? */
.about-page { background: var(--paper); }
.ap-band { background: var(--mist); }
.ap-panel { border-radius: 18px; box-shadow: var(--shadow); }
.ap-photo img { border-radius: 18px; box-shadow: var(--shadow); }
.about-page .name { font: 700 clamp(1.9rem, 3.4vw, 2.6rem)/1.15 var(--display); margin: 28px 0 6px; }
.about-page .ap-sub { font: 600 1.25rem/1.3 var(--font); color: #3E5E57; }
.about-page p { font: 500 1.125rem/1.7 var(--font); color: #1B2C28; }
.parcours { background: var(--paper); }
.parcours h1, .parcours h2 { font: 700 clamp(1.8rem, 3.2vw, 2.4rem)/1.15 var(--display); margin-bottom: 22px; }
.parcours ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.parcours li { background: #fff; border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 12px; padding: 16px 22px; font: 500 1.0625rem/1.6 var(--font); color: #1B2C28; }

/* FAQ */
.page-title { font: 700 clamp(2.3rem, 5vw, 3.6rem)/1.1 var(--display); color: var(--ink-g); }
.faq { background: var(--paper); }
.faq-grid { gap: 22px 24px; }
.faq-grid > div, .faq .full { background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); padding: 28px 30px; }
.faq .narrow { width: 100%; }
.faq h2, .faq h2.sm { font: 700 1.3rem/1.35 var(--display); margin-bottom: 12px; }
.faq p { font: 500 1rem/1.65 var(--font); color: #1B2C28; }

/* Contact : le texte sur l'encre devient lisible (fond papier), formulaire net, bouton de la même famille */
.contact-page .intro { font: 700 clamp(1.3rem, 2.4vw, 1.9rem)/1.4 var(--display); color: var(--ink-g); background: rgba(243, 245, 241, .9); padding: 22px 28px; border-radius: 18px; margin-bottom: 110px; }
.contact-page h1 { font: 700 clamp(2.2rem, 4.6vw, 3.4rem)/1.12 var(--display); }
.contact-arch { background: rgba(228, 236, 231, .94); }
.field label { font: 600 .9rem/1.3 var(--font); color: #1B2C28; }
.field input, .field textarea, .field select { border: 1px solid #9DB0A7; border-radius: 10px; background: #fff; font: 500 1rem/1.4 var(--font); }
.form .actions .btn, .form button[type="submit"] { background: var(--green); border-color: var(--green); color: #fff; }
.form .actions .btn:hover, .form button[type="submit"]:hover { background: var(--ink-g); border-color: var(--ink-g); }
.contact-page .after { font: 600 1.0625rem/1.6 var(--font); color: #1B2C28; background: rgba(243, 245, 241, .92); border-radius: 18px; }
.contact-map { border-radius: 14px; border-color: var(--line); }

/* Blog */
.blog-head h1, .blog-head .blog-intro { font: 500 1.3rem/1.6 var(--font); color: #1B2C28; }
.post-card { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; box-shadow: var(--shadow); transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
@media (hover: hover) { .post-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); } }
.post-card h2 { font: 700 1.55rem/1.25 var(--display); color: var(--ink-g); }
.post-card p { font: 500 1rem/1.65 var(--font); color: #2B3E39; }
.post-card .meta { color: #4C5E58; }
.post-cta, .post-nl { border-radius: 16px; }

/* Pages d'accueil de campagne, newsletter, mentions légales */
.landing-top h1, .benefits h2, .landing-2col h2, .landing-mid h2 { font-family: var(--display); color: var(--ink-g); }
.landing-top .lead, .landing-top .big, .landing-2col .txt, .landing-mid .txt, .results, .benefits .intro-list { font-family: var(--font); font-weight: 500; color: #1B2C28; }
.trio > *, .quad .it { background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); padding: 26px 22px 28px; }
.trio h3, .quad .it h3, .results h3 { font-family: var(--display); color: var(--ink-g); }
.nl-box h1 { font: 700 2rem/1.2 var(--display); }
.nl-box .btn, .nl-news .btn, .post-nl .btn { background: var(--green); border-color: var(--green); border-radius: 999px; }
.nl-box .btn:hover, .nl-news .btn:hover, .post-nl .btn:hover { background: var(--ink-g); border-color: var(--ink-g); }
.legal h1 { font: 700 2.2rem/1.2 var(--display); }
.legal .body, .legal .body p { font-family: var(--font); font-weight: 500; color: #1B2C28; }
.booking-sec { background: var(--paper); }

/* Pages intérieures sur téléphone : tailles en rem (plus d'unité « Wix »), cases pleine largeur */
@media (max-width: 767px) {
  .approche-hero .txt { margin: -40px 0 0; padding: 32px 24px 36px; width: auto; }
  .approche-hero p, .about-page p, .seance-grid .txt, .banner-img p, .principles .cols p, .tool p { font-size: 1.0625rem; line-height: 1.65; }
  .principles .cols { grid-template-columns: 1fr; width: calc(100% - 32px); padding-top: 90px; gap: 18px; }
  .principles .cols h3 { font-size: 1.4rem; }
  .seance .kicker { font-size: 1.7rem; margin-bottom: 32px; }
  .seance-grid { grid-template-columns: 1fr; gap: 36px; }
  .tools { padding: 56px 0 64px; }
  .tools h2 { font-size: 1.9rem; }
  .tools .lead { font-size: 1.0625rem; margin-bottom: 32px; }
  .tool { width: 100%; max-width: 360px; }
  .about-page .name { font-size: 1.9rem; margin: 8px 0 4px; }
  .ap-panel { padding: 28px 22px 34px; min-height: 0; }
  .about-page .ap-sub { font-size: 1.1rem; }
  .parcours h2 { font-size: 1.8rem; }
  .parcours li { font-size: 1rem; padding: 14px 18px; }
  .page-title { font-size: 2.3rem; }
  .faq-grid > div, .faq .full { padding: 22px 20px; }
  .faq h2, .faq h2.sm { font-size: 1.2rem; }
  .contact-page .intro { font-size: 1.25rem; padding: 18px 20px; margin-bottom: 56px; }
  .contact-page h1 { font-size: 2.2rem; }
  .blog-head h1, .blog-head .blog-intro { font-size: 1.125rem; }
  .post-card h2 { font-size: 1.35rem; }
  .landing-top h1 { font-size: 2rem; }
  .trio > *, .quad .it { padding: 22px 18px 24px; }
}

.principles h2, .principles > h2 { color: var(--ink-g); }
@media (max-width: 767px) { .about-page .name { margin-top: 22px; } }

/* Cartes « accompagnement » : texte aligné à gauche, une idée par paragraphe, sans lignes orphelines */
.home .card-round p { align-self: stretch; text-align: left; margin: 0 0 14px; text-wrap: pretty; hyphens: auto; }
.home .card-round p:last-of-type { margin-bottom: 28px; }
.home .card-round h3 { text-align: center; }
.home .card-round .btn { margin-top: auto; align-self: center; }
.home .card-round { justify-content: flex-start; }