/*
Theme Name: Objectif Bien-Être
Theme URI: https://www.objectifbienetre.fr/
Description: Thème enfant de Twenty Twenty-Five (FSE) pour Objectif Bien-Être Angers. Design repris de la maquette Figma. Contenu éditable en blocs natifs. Voir README.md.
Author: Refonte WordPress
Template: twentytwentyfive
Version: 3.0.0
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: objectifbienetre
*/

/* =========================================================
   DESIGN SYSTEM — tokens de la maquette Figma (canvas 1728px)
   ========================================================= */
:root{
  --ob-accent:    #c26622;  /* boutons, sur-titres, accents */
  --ob-accent-dk: #ad591a;  /* hover accent */
  --ob-dark:      #403221;  /* titres, accordéon */
  --ob-grey:      #635f59;  /* texte courant */
  --ob-taupe:     #6f6356;  /* liens du pied de page */
  --ob-cream:     #fcfaf8;  /* fond de page */
  --ob-beige:     #f8f3ec;  /* sections alternées */
  --ob-pale:      #ebe0c4;  /* bordures */
  --ob-sage:      #bec2a3;

  /* Maquette = The Seasons (payante) + Raleway. Forum = équivalent libre.
     Si la licence The Seasons est achetée : @font-face + changer cette variable. */
  --ob-font-title:  "Forum", Georgia, serif;
  --ob-font-body:   "Raleway", "Helvetica Neue", Arial, sans-serif;
  --ob-font-script: "Monsieur La Doulaise", cursive;

  --container-s: 55rem;
  --container-m: 64rem;
  --container-l: 80.5rem;   /* 1288px = 220→1508 sur la maquette */
  --gutter: clamp(1.25rem,5vw,2.5rem);
  --section-y: clamp(4rem,6.4vw,6.9rem); /* ≈110px en haut/bas des sections */
  --radius: 12px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* =========================================================
   RESET + BASE
   ========================================================= */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
/* Tailles de texte, titres et boutons : définies dans theme.json (source unique,
   appliquée aussi dans l'éditeur). Ici uniquement ce que theme.json ne sait pas faire. */
body{ margin:0; -webkit-font-smoothing:antialiased; }
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }

/* Espacements verticaux = blockGap WP (theme.json, 1.5rem). Les réglages par composant
   ci-dessous utilisent 2 classes pour passer devant « :root :where(.is-layout-flow) > * ». */

/* Prénom manuscrit (« Illionna ») */
.ob-script{
  display:block; font-family:var(--ob-font-script); text-transform:none;
  font-size:clamp(2.4rem,3.2vw,3.4rem); line-height:1; color:var(--ob-accent);
  margin:0 0 .1em;
}
/* Sur-titre majuscule accent (« Comprendre, soulager… », « Massages, thérapies… ») */
.ob-kicker{
  font-weight:600; text-transform:uppercase; letter-spacing:.06em;
  font-size:.9375rem; color:var(--ob-accent); margin:0 0 1rem;
}

/* =========================================================
   SECTIONS
   Les sections pleine largeur s'enchaînent sans espace (le blockGap WP
   ajouterait une bande de fond entre elles).
   ========================================================= */
.ob-section{ position:relative; padding:var(--section-y) var(--gutter); }
.ob-section--beige{ background:var(--ob-beige); }
.ob-main{ margin:0; overflow-x:clip; }
.wp-block-post-content > .alignfull{ margin-top:0; margin-bottom:0; }

/* =========================================================
   BOUTONS — 46px de haut, rectangulaires, MAJUSCULES
   ========================================================= */
.wp-block-button.ob-btn > .wp-block-button__link{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  min-height:46px; padding:.75rem 1.25rem; border-radius:0;
  font-family:var(--ob-font-body); font-weight:500; font-size:.9375rem; line-height:1.2;
  text-transform:uppercase; letter-spacing:.03em;
  background:var(--ob-accent); color:var(--ob-cream); text-decoration:none;
  border:1px solid transparent; cursor:pointer;
  transition:transform .5s var(--ease), background-color .5s var(--ease);
}
.wp-block-button.ob-btn > .wp-block-button__link:hover{ background:var(--ob-accent-dk); color:var(--ob-cream); transform:translateY(-3px); }
.wp-block-button.ob-btn{ margin:0; }

/* =========================================================
   FORMES DES PHOTOS — la forme vient de la classe, pas du fichier.
   Une photo remplacée dans l'admin (n'importe quel format) est recadrée
   (object-fit:cover) au même ratio et avec le même arrondi.
   !important : neutralise les réglages taille/ratio qu'on pourrait poser
   par erreur dans la barre d'outils du bloc Image.
   ========================================================= */
.ob-img-portrait, .ob-img-arch, .ob-avatar, .ob-img-card, .ob-img-tall, .ob-img-booking, .ob-duo__main, .ob-duo__float{ margin:0 !important; }
/* le bandeau garde les marges latérales négatives de WordPress (pleine largeur) */
.ob-img-banner{ margin-block:0 !important; }
.ob-img-portrait img, .ob-img-arch img, .ob-avatar img, .ob-img-card img, .ob-img-tall img, .ob-img-booking img, .ob-duo__main img, .ob-duo__float img, .ob-img-banner img{
  width:100% !important; height:auto !important; object-fit:cover !important; display:block;
}
/* Portrait arrondi : 465×709 (accueil) ; ratio ajustable par section via --ob-portrait-ratio */
.ob-img-portrait img{ aspect-ratio:var(--ob-portrait-ratio,465/709) !important; border-radius:var(--radius); }
/* Arche (services) : 404×551, haut en demi-cercle
   (999px est ramené à largeur/2 par le navigateur = demi-cercle parfait) */
.ob-img-arch img{ aspect-ratio:404/551 !important; border-radius:999px 999px 0 0; }
/* Carte (pages services) : 408×529, coins 12px */
.ob-img-card img{ aspect-ratio:408/529 !important; border-radius:var(--radius); }
/* Grande photo verticale (thérapie) : 519×812, angles droits */
.ob-img-tall img{ aspect-ratio:519/812 !important; border-radius:0; }
/* Entreprise : photo principale 442×664, photo inclinée 270×405, réservation 442×622 */
.ob-duo__main img{ aspect-ratio:442/664 !important; border-radius:8px; }
.ob-duo__float img{ aspect-ratio:270/405 !important; border-radius:var(--radius); }
.ob-img-booking img{ aspect-ratio:442/622 !important; border-radius:8px; }
/* Bandeau pleine largeur (contact) : 1728×574 */
.ob-img-banner img{ aspect-ratio:1728/574 !important; }
/* Avatar rond 56px (témoignages) */
.ob-avatar{ flex:none; width:56px; }
.ob-avatar img{ aspect-ratio:1 !important; border-radius:50%; }

/* =========================================================
   HEADER — logo centré + bloc Navigation natif (menu « Menu principal »,
   Apparence → Éditeur → Navigation). Règle de placement :
   les 2 premiers liens à gauche du logo, les suivants à droite ;
   le lien portant la classe « ob-nav-cta » = bouton orange.
   ========================================================= */
.ob-header{ margin:0; position:relative; z-index:100; background:var(--ob-beige); }
.ob-header__inner{
  width:100%; max-width:calc(var(--container-l) + 2 * var(--gutter)); margin-inline:auto;
  padding:clamp(1rem,2.1vw,2.3rem) var(--gutter) 1rem;
  display:grid; align-items:center;
}
/* logo et menu dans la même cellule : le menu occupe toute la largeur, le logo au centre */
.wp-block-group.ob-header__inner > *{ grid-area:1 / 1; margin:0; }
.ob-header__logo{ justify-self:center; position:relative; z-index:1; }
.ob-header__logo img{ width:clamp(96px,8.8vw,152px); height:auto; }

/* 2 classes : passe devant « :root :where(.wp-block-navigation) » du thème parent */
.wp-block-navigation.ob-mainnav{
  justify-self:stretch; color:var(--ob-dark);
  font-weight:500; font-size:clamp(.8rem,.87vw,.9375rem); text-transform:uppercase; letter-spacing:.02em;
}
.ob-mainnav .wp-block-navigation-item__content{ transition:color .2s; }
.ob-mainnav .wp-block-navigation-item:not(.ob-nav-cta) > a:hover,
.ob-mainnav .current-menu-item:not(.ob-nav-cta) > a,
.ob-mainnav .wp-block-navigation-item:not(.ob-nav-cta) > a[aria-current="page"]{ color:var(--ob-accent); }
.wp-block-navigation.ob-mainnav .ob-nav-cta > a{
  display:inline-flex; align-items:center; min-height:46px; padding:.75rem 1.25rem;
  background:var(--ob-accent); color:var(--ob-cream); font-weight:700;
  transition:background-color .3s var(--ease), transform .3s var(--ease);
}
.wp-block-navigation.ob-mainnav .ob-nav-cta > a:hover{ background:var(--ob-accent-dk); transform:translateY(-3px); }

@media (min-width:1101px){
  .ob-mainnav .wp-block-navigation__responsive-container,
  .ob-mainnav .wp-block-navigation__responsive-close,
  .ob-mainnav .wp-block-navigation__responsive-dialog,
  .ob-mainnav .wp-block-navigation__responsive-container-content,
  .ob-mainnav .wp-block-navigation__container{ width:100%; }
  .ob-mainnav .wp-block-navigation__container{ justify-content:flex-start; gap:clamp(1.2rem,2vw,2.2rem); }
  .ob-mainnav .wp-block-navigation__container > li:nth-child(2){ margin-right:auto; }
}

/* Burger jusqu'à 1100px (WordPress ne le prévoit que sous 600px, trop étroit pour ce menu) */
@media (max-width:1100px){
  .ob-header__logo{ justify-self:start; }
  .wp-block-navigation.ob-mainnav{ justify-self:end; }
  .ob-mainnav .wp-block-navigation__responsive-container-open:not(.always-shown){ display:flex; }
  .ob-mainnav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){ display:none; }
}
/* Menu mobile ouvert : panneau crème, liens foncés (même sur l'accueil) */
.wp-block-navigation.ob-mainnav:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{
  background:var(--ob-cream); color:var(--ob-dark); padding:clamp(1.5rem,5vw,3rem); font-size:1rem;
}
.ob-mainnav .is-menu-open .wp-block-navigation__container{ gap:1.4rem; }
.wp-block-navigation.ob-mainnav .is-menu-open .ob-nav-cta > .wp-block-navigation-item__content{ padding:.75rem 1.25rem; }

/* Accueil : transparent par-dessus le hero, liens et burger blancs */
.ob-header--home{ position:absolute; top:0; left:0; right:0; background:transparent; }
.ob-header--home .ob-mainnav{ color:var(--ob-cream); }
.ob-header--home .ob-mainnav .wp-block-navigation-item:not(.ob-nav-cta) > a:hover{ color:var(--ob-pale); }
.ob-header--home .ob-mainnav .is-menu-open{ color:var(--ob-dark); }

/* =========================================================
   FOOTER — blocs natifs (Compositions → Parties de modèle → Pied de page)
   ========================================================= */
.ob-footer{ margin:0; background:var(--ob-cream); padding:clamp(2.5rem,3.1vw,3.4rem) var(--gutter) 1.1rem; }
.ob-footer__grid{
  width:100%; max-width:var(--container-l); margin-inline:auto;
  display:grid; grid-template-columns:363fr 336fr 336fr 253fr; column-gap:1.5rem; row-gap:2rem;
}
.wp-block-group.ob-footer__grid > *, .wp-block-group.ob-footer__col > *, .wp-block-group.ob-footer__bottom > *{ margin:0; }
.ob-footer__logo img{ width:clamp(110px,9.4vw,163px); height:auto; }
.ob-footer__col{ display:flex; flex-direction:column; align-items:flex-start; }
.wp-block-group.ob-footer__col > .ob-footer__title{ font-weight:600; font-size:.9375rem; text-transform:uppercase; letter-spacing:.03em; color:var(--ob-accent); margin:.6rem 0 1.1rem; }
.ob-footer__links{ list-style:none; padding:0; }
.ob-footer__links li{ margin:0; }
.ob-footer__links{ font-size:1.0625rem; }
.ob-footer__links a{ color:var(--ob-taupe); line-height:1.76; text-decoration:none; }
.ob-footer__links a:hover{ color:var(--ob-accent); }
.ob-footer__follow{ position:relative; }
.wp-block-social-links.ob-socials{ gap:.9rem; }
.ob-socials .wp-social-link{ transition:opacity .2s; }
.ob-socials .wp-social-link:hover{ opacity:.6; }
.ob-socials .wp-social-link a{ padding:0; }
.ob-socials .wp-social-link svg{ width:20px; height:20px; }
.ob-totop{
  position:absolute; top:0; right:0; width:40px; height:40px; border-radius:50%;
  display:grid; place-items:center; background:var(--ob-accent); color:var(--ob-cream) !important;
  transition:transform .3s var(--ease);
}
.ob-totop:hover{ transform:translateY(-3px); }
.ob-footer__bottom{
  grid-column:1 / -1; display:grid; grid-template-columns:subgrid; align-items:center;
  padding-top:1.1rem; border-top:1px solid rgba(194,102,34,.3);
  font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--ob-taupe);
}
.ob-footer__bottom a{ text-decoration:none; }
.ob-footer__bottom a:hover{ color:var(--ob-accent); }
.wp-block-group.ob-footer__bottom > .ob-footer__credit{ grid-column:3 / -1; text-align:right; }
@media (max-width:960px){
  .ob-footer__grid{ grid-template-columns:1fr 1fr; }
  .ob-footer__bottom{ grid-template-columns:1fr; gap:.6rem; text-align:center; justify-items:center; }
  .wp-block-group.ob-footer__bottom > .ob-footer__credit{ grid-column:auto; text-align:center; }
}
@media (max-width:560px){ .ob-footer__grid{ grid-template-columns:1fr; } }

/* =========================================================
   COUVERTURES (core/cover) — hero + bandeau CTA
   ========================================================= */
.ob-cover{ margin:0; }
.ob-cover .wp-block-cover__inner-container{ width:100%; max-width:var(--container-l); margin-inline:auto; padding-inline:var(--gutter); }
.ob-cover h1,.ob-cover h2,.ob-cover h3,.ob-cover p{ color:var(--ob-cream); }
/* Hero : 933px sur 1728 = 54vw */
.wp-block-cover.ob-hero{ min-height:clamp(560px,54vw,100svh); padding:0 var(--gutter) clamp(2.5rem,4.2vw,4.6rem); }
/* WP colle le contenu à gauche (position « bas gauche ») : on le recentre sur la grille 1288px */
.ob-hero .wp-block-cover__inner-container{ width:100% !important; max-width:var(--container-l) !important; margin-inline:auto !important; padding:0; }
.ob-hero h1{ max-width:10em; margin:0; }
/* Bandeau CTA : 453px sur 1728 */
.wp-block-cover.ob-cta{ min-height:clamp(380px,26.2vw,480px); padding:3rem var(--gutter); }
.ob-cta .wp-block-cover__inner-container{ max-width:60rem; text-align:center; }
.ob-cta p{ max-width:50.5rem; margin-inline:auto; }
.ob-cta .wp-block-cover__inner-container > *{ margin:0; }
.ob-cta .wp-block-cover__inner-container > * + *{ margin-top:1.25rem; }

/* Bandeau titre simple (mentions légales) */
.ob-hero-band{ text-align:center; padding-block:clamp(3.5rem,8vw,6rem); }

/* =========================================================
   ACCUEIL — présentation (photo + texte)
   ========================================================= */
.wp-block-columns.ob-about{ gap:clamp(2rem,4.9vw,5.25rem); margin:0; }
.ob-text.wp-block-group > .ob-script + *{ margin-top:0; }
.ob-text.wp-block-group > h2 + *{ margin-top:2.3rem; }
.wp-block-column > .ob-text + .wp-block-buttons{ margin-top:1.9rem; }
@media (max-width:781px){ .ob-about .ob-img-portrait{ max-width:465px; margin-inline:auto !important; } }

/* =========================================================
   ACCUEIL — services en arches
   ========================================================= */
.wp-block-group.ob-services{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2.5rem,5.8vw,6.25rem); margin-top:clamp(2rem,3.8vw,4rem); }
.wp-block-group.ob-services > *{ margin:0; }
.ob-service{ text-align:center; display:flex; flex-direction:column; align-items:center; }
.wp-block-group.ob-service > *{ margin:0; }
.ob-service .ob-img-arch{ width:100%; margin-bottom:1.6rem !important; }
.ob-service .wp-block-heading{ margin-bottom:.6rem; }
.ob-service .ob-kicker{ margin-bottom:1.1rem; }
.ob-service .wp-block-buttons{ justify-content:center; }
@media (max-width:700px){
  .wp-block-group.ob-services{ grid-template-columns:1fr; }
  .wp-block-heading br{ display:none; } /* retours à la ligne de la maquette desktop */
  .ob-service{ max-width:404px; margin-inline:auto; }
}

/* Arabesque décorative à cheval sur le haut de la section */
.ob-swirl::before{
  content:""; position:absolute; z-index:1; pointer-events:none;
  top:-71px; left:max(.5rem, calc(50% - 685px));
  width:123px; height:157px; background:url(assets/svg/swirl.svg) no-repeat center/contain;
}
@media (max-width:700px){ .ob-swirl::before{ width:80px; height:102px; top:-46px; } }

/* =========================================================
   ACCORDÉON (bloc Détails natif) — tout bloc Détails ajouté dans
   .ob-accordion prend ce style, sans classe à ajouter.
   ========================================================= */
.ob-kicker + .wp-block-heading{ margin-top:0; }
.wp-block-group.ob-accordion{ margin-top:clamp(2rem,2.6vw,2.75rem); }
.ob-accordion .wp-block-details{ border-bottom:1px solid var(--ob-dark); margin:0; padding:0; }
.ob-accordion summary{
  list-style:none; cursor:pointer; padding:1.25rem 0; display:flex; justify-content:space-between; align-items:center; gap:2rem;
  font-weight:600; text-transform:uppercase; letter-spacing:.06em; font-size:clamp(.8rem,.87vw,.9375rem); line-height:1.3; color:var(--ob-dark);
}
.ob-accordion summary::-webkit-details-marker{ display:none; }
/* pas de cadre de focus au clic (gênait la lecture) ; au clavier, la question passe en accent */
.ob-accordion summary:focus{ outline:none; }
.ob-accordion summary:focus-visible{ color:var(--ob-accent); }
.ob-accordion summary::after{
  content:""; flex:none; width:21px; height:21px;
  background:url(assets/svg/plus-icon.svg) no-repeat center/contain; transition:transform .3s var(--ease);
}
.ob-accordion details[open] summary::after{ transform:rotate(45deg); }
.ob-accordion details > :not(summary){ margin:-.5rem 0 0; padding-bottom:1.1rem; color:var(--ob-dark); }

/* =========================================================
   TÉMOIGNAGES — carrousel natif (scroll-snap), points générés en JS
   ========================================================= */
.ob-section--testimonials{ padding-bottom:clamp(3rem,4.6vw,5rem); }
.ob-section--testimonials .wp-block-heading{ margin-bottom:0; }
.wp-block-group.ob-slider{ margin-top:clamp(1.75rem,2.3vw,2.5rem); }
.ob-slider{
  display:flex; gap:3rem; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;
  overscroll-behavior-x:contain;
}
.ob-slider::-webkit-scrollbar{ display:none; }
.ob-slider > *{ flex:0 0 calc(50% - 1.5rem); scroll-snap-align:start; margin:0 !important; }
@media (max-width:781px){ .ob-slider > *{ flex-basis:100%; } }
.wp-block-group.ob-testimonial > *{ margin:0; }
.ob-testimonial__text{ border-left:1.5px solid var(--ob-accent); padding-left:1.25rem; }
.ob-testimonial .ob-testimonial__author{ margin-top:1.1rem; }
.ob-testimonial__author{ display:flex; align-items:center; gap:1.25rem; }
.ob-testimonial__author p{ margin:0; }
.ob-testimonial__name{ font-weight:700; font-size:.8125rem; text-transform:uppercase; letter-spacing:.1em; color:var(--ob-dark); }
.ob-testimonial__job{ font-size:.9375rem; color:var(--ob-dark); }
.ob-dots{ display:flex; justify-content:center; gap:.4rem; margin-top:clamp(2.5rem,4.7vw,5rem); }
.ob-dots[hidden]{ display:none; }
.ob-dots button{ width:9px; height:9px; padding:0; border:0; border-radius:50%; background:var(--ob-accent); opacity:.2; cursor:pointer; transition:opacity .3s; }
.ob-dots button.is-active{ opacity:1; }

/* =========================================================
   INTRO DE PAGE (titre centré sous le header) + À PROPOS
   ========================================================= */
/* Couleur des textes par section (varie selon les pages de la maquette) */
/* :where() = spécificité faible : les classes .ob-kicker, .ob-price, .ob-note gardent leur couleur */
.ob-text-dark :where(p:not(.ob-kicker)){ color:var(--ob-dark); }
.ob-text-taupe :where(p:not(.ob-kicker)){ color:var(--ob-taupe); }
.ob-kicker--dark{ color:var(--ob-dark); }

.ob-section.ob-page-intro{ padding-top:clamp(2rem,3.7vw,4rem); padding-bottom:0; }
.ob-page-intro .wp-block-heading + .ob-kicker{ margin-top:1.9rem; }
.ob-page-intro .ob-kicker + p{ margin-top:2rem; }
.ob-page-intro p:not(.ob-kicker){ max-width:44rem; }

/* photo 424×607, écart 111px */
.ob-about--apropos{ --ob-portrait-ratio:424/607; }
.wp-block-columns.ob-about--apropos{ gap:clamp(2rem,6.4vw,6.9rem); }
.ob-section.ob-apropos-passion{ padding-top:calc(var(--section-y) - .9rem); }

/* Récit : colonne de 739px ; tout bloc ajouté prend ce style sans classe */
.ob-section.ob-story{ padding-top:calc(var(--section-y) - 1.25rem); padding-bottom:calc(var(--section-y) + 2rem); }
.ob-story > .wp-block-heading{ font-size:clamp(1.6rem,1.9vw,2rem); line-height:1.25; }
.ob-story > .wp-block-heading:not(:first-child){ margin-top:2.5rem; }
.ob-story > .wp-block-heading + *{ margin-top:1.4rem; }
.ob-story > .wp-block-image{ margin-top:2.6rem; margin-bottom:0; }
.ob-story > .wp-block-image + .wp-block-heading{ margin-top:2.4rem; }
.ob-story .wp-block-image img{
  width:100% !important; height:auto !important; aspect-ratio:739/435 !important;
  object-fit:cover !important; border-radius:var(--radius);
}

/* Décors (CSS, non éditables) */
.ob-swirl.ob-swirl--inside::before{ top:1.4rem; left:max(.5rem, calc(50% - 709px)); }
@media (max-width:900px){ .ob-swirl.ob-swirl--inside::before{ display:none; } }
/* fleur jaune à cheval sur le bas de la section */
.ob-deco-flower::after{
  content:""; position:absolute; z-index:1; pointer-events:none;
  width:121px; height:121px; bottom:-60px; left:calc(50% + 475px);
  background:url(assets/svg/yelllow-flower.svg) no-repeat center/contain;
}
@media (max-width:1100px){ .ob-deco-flower::after{ left:auto; right:1rem; width:80px; height:80px; bottom:-40px; } }
/* étoile orange dans la marge gauche, au niveau du titre qui porte la classe */
.ob-deco-star{ position:relative; }
.ob-deco-star::before{
  content:""; position:absolute; pointer-events:none;
  left:-248px; top:calc(100% - 5px); width:75px; height:75px;
  background:url(assets/svg/brown-4-flower.svg) no-repeat center/contain;
}
@media (max-width:1240px){ .ob-deco-star::before{ display:none; } }

/* =========================================================
   PAGES SERVICES — rangées photo + texte (bloc Colonnes « ob-media »)
   ========================================================= */
.wp-block-columns.ob-media{ position:relative; gap:clamp(2rem,5.2vw,5.65rem); margin:0; }
.wp-block-group.ob-media-list > .ob-media + .ob-media{ margin-top:clamp(3rem,5.8vw,6.25rem); }
@media (min-width:782px){ .wp-block-columns.ob-media--reverse{ flex-direction:row-reverse; } }

/* Service : titre + sur-titre + texte, empilables */
.wp-block-group.ob-service-item > *{ margin:0; }
.ob-service-item .wp-block-heading{ font-size:clamp(1.6rem,1.9vw,2rem); line-height:1.2; margin-bottom:.55rem; }
.ob-service-item .ob-kicker{ margin-bottom:.75rem; }
.wp-block-column > .ob-service-item + .ob-service-item{ margin-top:clamp(2.5rem,3.8vw,3.75rem); }

/* Tarif sous la description d'un service */
.ob-service-item .ob-price{ margin-top:.9rem; font-family:var(--ob-font-title); font-size:1.5rem; line-height:1.2; color:var(--ob-accent); }

/* Packs & abonnements : tableau à filets, sans fond (défile horizontalement sur mobile) */
/* Enchaînement rangées → packs → avertissement : un seul espace entre chaque */
.ob-section.ob-media-list{ padding-bottom:0; }
.ob-section.ob-warning-section{ padding-top:0; }
.ob-packs .ob-kicker + .wp-block-heading{ margin-top:0; }
/* Image d'arrière-plan (Styles → Arrière-plan) : WordPress la met dans l'attribut style.
   Sans image = fond beige ; avec image = photo + voile sombre + textes clairs. */
.ob-packs[style*="background-image"]{ position:relative; isolation:isolate; background-position:center; }
.ob-packs[style*="background-image"]::before{ content:""; position:absolute; inset:0; z-index:-1; background:rgba(0,0,0,.62); pointer-events:none; }
/* Textes clairs sur photo : section Packs avec image, et tout tableau de tarifs posé dans un bloc Couverture */
.ob-packs[style*="background-image"] .wp-block-heading,
.ob-packs[style*="background-image"] p:not(.ob-kicker),
.ob-packs[style*="background-image"] .ob-pricing td,
.wp-block-cover .ob-pricing td{ color:var(--ob-cream); }
.ob-packs[style*="background-image"] .ob-pricing td:first-child,
.wp-block-cover .ob-pricing td:first-child{ color:#fff; }
.ob-packs[style*="background-image"] .ob-pricing th, .ob-packs[style*="background-image"] .ob-pricing td,
.wp-block-cover .ob-pricing th, .wp-block-cover .ob-pricing td{ border-bottom-color:rgba(252,250,248,.35); }
.ob-section.ob-media-list:has(+ .ob-packs[style*="background-image"]){ padding-bottom:var(--section-y); }
.ob-packs[style*="background-image"] + .ob-section.ob-warning-section{ padding-top:var(--section-y); }
.ob-pricing{ margin-top:clamp(1.5rem,2.5vw,2.5rem); }
.ob-pricing table{ min-width:640px; border-collapse:collapse; font-size:1rem; }
.ob-pricing th, .ob-pricing td{ border:0; border-bottom:1px solid var(--ob-pale); padding:1.1rem 1rem; text-align:left; vertical-align:top; }
.ob-pricing thead{ border:0; }
.ob-pricing th{ font-weight:600; font-size:.8125rem; text-transform:uppercase; letter-spacing:.06em; color:var(--ob-accent); padding-top:0; }
.ob-pricing td{ color:var(--ob-taupe); }
.ob-pricing td:first-child{ font-family:var(--ob-font-title); font-size:1.25rem; line-height:1.2; text-transform:uppercase; color:var(--ob-dark); padding-left:0; }
.ob-pricing th:first-child{ padding-left:0; }
.ob-packs .wp-block-buttons{ margin-top:2rem; }

/* Avertissement : titre accent entre deux filets */
.ob-warning .ob-warning__title{
  display:flex; align-items:center; gap:1.25rem;
  color:var(--ob-accent); font-size:clamp(1.6rem,1.9vw,2rem);
}
.ob-warning__title::before, .ob-warning__title::after{ content:""; flex:1; height:1px; background:var(--ob-accent); }
.ob-warning .ob-warning__title + p{ margin-top:.75rem; }
.ob-warning p{ color:var(--ob-dark); }

/* Thérapie et coaching */
.ob-section.ob-therapy{ padding-top:calc(var(--section-y) - 1rem); padding-bottom:3.5rem; }
.ob-therapy .ob-therapy__intro{ max-width:49rem; }
.wp-block-columns.ob-media--wide{ gap:clamp(2rem,4.2vw,4.56rem); margin-top:clamp(2.5rem,4.3vw,4.7rem); }

/* Encart d'information : cadre fin accent + fleur posée sur le bord du haut */
.wp-block-group.ob-notice{
  position:relative; max-width:40rem; margin-top:clamp(2.5rem,3.5vw,3.5rem);
  padding:2.2rem clamp(1.25rem,3vw,2.5rem) 1.8rem; border:1px solid var(--ob-accent); text-align:center;
}
.wp-block-group.ob-notice > *{ margin:0; }
.ob-notice::before{
  content:""; position:absolute; top:-20px; left:50%; width:40px; height:40px; transform:translateX(-50%);
  background:var(--ob-cream) url(assets/svg/brown-4-flower.svg) no-repeat center/26px;
}
.ob-notice .ob-kicker{ margin-bottom:.6rem; }
.ob-notice .ob-notice__text{ font-family:var(--ob-font-title); font-size:clamp(1.3rem,1.6vw,1.6rem); line-height:1.25; color:var(--ob-dark); }

/* Décors des rangées (CSS, non éditables) */
.ob-deco-leaf::before, .ob-deco-star-img::after{ content:""; position:absolute; pointer-events:none; }
.ob-deco-leaf::before{
  left:-121px; top:71%; width:63px; height:63px; transform:rotate(-16.5deg);
  background:url(assets/svg/yelllow-flower.svg) no-repeat center/contain;
}
.ob-deco-star-img::after{
  right:-57px; top:73%; width:75px; height:75px; transform:rotate(14.4deg);
  background:url(assets/svg/brown-4-flower.svg) no-repeat center/contain;
}
@media (max-width:1180px){ .ob-deco-leaf::before, .ob-deco-star-img::after{ display:none; } }

/* =========================================================
   MASSAGES EN ENTREPRISE
   ========================================================= */
.ob-section.ob-company{ padding-top:clamp(3rem,4.7vw,5rem); padding-bottom:calc(var(--section-y) + 6.2rem); }
.wp-block-columns.ob-media--company{ gap:clamp(2rem,8.6vw,9.25rem); }
.ob-media--company .wp-block-heading + p{ margin-top:1.75rem; }

/* Duo : photo principale + photo inclinée qui déborde en bas à droite + étoile */
.ob-duo{ position:relative; }
.wp-block-group.ob-duo > *{ margin:0; }
.ob-duo .ob-duo__main{ width:68.7%; }
.ob-duo .ob-duo__float{ position:absolute; left:56.5%; top:52.6%; width:41.9%; transform:rotate(4.13deg); }
.ob-duo::after{
  content:""; position:absolute; pointer-events:none;
  left:77.4%; top:31.8%; width:75px; height:75px;
  background:url(assets/svg/brown-4-flower.svg) no-repeat center/contain;
}
@media (max-width:781px){
  .ob-section.ob-company{ padding-bottom:calc(var(--section-y) + 4rem); }
  .ob-duo::after{ width:48px; height:48px; }
}

/* Arabesque centrée à cheval sur le haut de la section réservation */
.ob-swirl.ob-swirl--center::before{ left:calc(50% - 117px); top:-83px; }

/* Réservation : photo + offres (titre, tarifs, bouton) */
.wp-block-columns.ob-media--booking{ gap:clamp(2rem,6.2vw,6.65rem); }
.ob-media--booking .wp-block-heading + p{ margin-top:1rem; }
.wp-block-group.ob-offers{ margin-top:clamp(2rem,3.6vw,3.9rem); }
.wp-block-group.ob-offers > *, .wp-block-group.ob-offer > *{ margin:0; }
.ob-offer{ display:grid; grid-template-columns:1fr auto; column-gap:2rem; row-gap:.5rem; align-items:center; }
.ob-offer > .wp-block-heading{ grid-column:1; font-size:clamp(1.6rem,1.9vw,2rem); line-height:1.2; }
.ob-offer > .ob-offer__prices{ grid-column:1; }
.ob-offer > .wp-block-buttons{ grid-column:2; grid-row:1 / span 2; }
.wp-block-group.ob-offers > .ob-offer + .ob-offer{ border-top:1px solid var(--ob-pale); margin-top:2.4rem; padding-top:2.4rem; }
.ob-offer__prices{ list-style:none; padding:0; display:flex; flex-wrap:wrap; color:var(--ob-taupe); }
.ob-offer__prices li{ margin:0; }
.ob-offer__prices li + li{ border-left:1px solid var(--ob-pale); margin-left:1.6rem; padding-left:1.6rem; }
@media (max-width:600px){
  .ob-offer{ grid-template-columns:1fr; }
  .ob-offer > .wp-block-buttons{ grid-column:1; grid-row:auto; margin-top:.75rem; }
}

/* =========================================================
   PROSE (mentions légales)
   ========================================================= */
.ob-prose{ max-width:var(--container-s); margin-inline:auto; }
.ob-prose h2,.ob-prose h3{ margin-top:2rem; }
.ob-prose p{ color:var(--ob-grey); }
.ob-prose strong{ color:var(--ob-dark); }

/* =========================================================
   CONTACT
   ========================================================= */
.ob-section.ob-contact-hero{ padding-top:clamp(2rem,2.9vw,2.9rem); padding-bottom:clamp(3rem,4.8vw,5.2rem); }
.ob-about--contact{ --ob-portrait-ratio:424/437; }
.wp-block-columns.ob-about--contact{ gap:clamp(2rem,5.6vw,6rem); }
.ob-contact-hero h1 + p{ margin-top:1.75rem; }
.wp-block-group.ob-contact-info{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-top:1.75rem; }
.wp-block-group.ob-contact-info > *, .wp-block-group.ob-contact-info .wp-block-group > *{ margin:0; }
.ob-contact-info .wp-block-heading{ font-size:clamp(1.6rem,1.9vw,2rem); margin-bottom:.7rem; }
.ob-contact-info p, .ob-contact-info a{ color:var(--ob-taupe); text-decoration:none; }
.ob-contact-info a:hover{ color:var(--ob-accent); }
@media (max-width:500px){ .wp-block-group.ob-contact-info{ grid-template-columns:1fr; } }
.ob-contact-hero .ob-note{ margin-top:1.5rem; font-size:.9375rem; color:var(--ob-taupe); }
.ob-contact-hero .ob-note + .wp-block-buttons{ margin-top:1.5rem; }

.ob-section.ob-contact-form-section{ padding-top:clamp(3rem,4.5vw,4.8rem); padding-bottom:4.5rem; }
.ob-contact-form-section .wp-block-heading{ max-width:none; }
.wp-block-group.ob-contact-form{ margin-top:2rem; }
/* Style des formulaires : gabarit dans « ob-contact-form » ET tout formulaire Contact Form 7 (.wpcf7), où qu'il soit */
.wpcf7{ max-width:32.45rem; margin-inline:auto; }
:is(.ob-contact-form, .wpcf7) form{ display:grid; gap:11px; margin:0; }
:is(.ob-contact-form, .wpcf7) input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=hidden]),
:is(.ob-contact-form, .wpcf7) textarea, :is(.ob-contact-form, .wpcf7) select{
  width:100%; height:55px; padding:0 1.1rem; margin:0;
  border:1px solid #eaeaea; border-radius:0; background:transparent; box-shadow:none;
  font:inherit; font-size:1rem; color:var(--ob-dark);
}
:is(.ob-contact-form, .wpcf7) textarea{ height:147px; padding-top:1rem; resize:vertical; }
:is(.ob-contact-form, .wpcf7) ::placeholder{ color:var(--ob-grey); opacity:1; }
:is(.ob-contact-form, .wpcf7) input:focus, :is(.ob-contact-form, .wpcf7) textarea:focus, :is(.ob-contact-form, .wpcf7) select:focus{ outline:1px solid var(--ob-accent); border-color:var(--ob-accent); }
:is(.ob-contact-form, .wpcf7) button, :is(.ob-contact-form, .wpcf7) [type=submit]{
  justify-self:start; min-height:46px; padding:.75rem 1.25rem; border:0; border-radius:0; cursor:pointer;
  background:var(--ob-accent); color:var(--ob-cream);
  font-family:var(--ob-font-body); font-weight:700; font-size:.9375rem; text-transform:uppercase; letter-spacing:.03em;
  transition:background-color .3s var(--ease);
}
:is(.ob-contact-form, .wpcf7) button:hover, :is(.ob-contact-form, .wpcf7) [type=submit]:hover{ background:var(--ob-accent-dk); }
:is(.ob-contact-form, .wpcf7) form{ position:relative; }
:is(.ob-contact-form, .wpcf7) label{ display:block; margin:0; }
:is(.ob-contact-form, .wpcf7) .screen-reader-text{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
/* Contact Form 7 */
:is(.ob-contact-form, .wpcf7) .wpcf7-form-control-wrap{ display:block; }
:is(.ob-contact-form, .wpcf7) .wpcf7-acceptance{ display:block; font-size:.875rem; line-height:1.4; color:var(--ob-taupe); }
:is(.ob-contact-form, .wpcf7) .wpcf7-acceptance .wpcf7-list-item{ margin:0; }
:is(.ob-contact-form, .wpcf7) .wpcf7-acceptance label{ display:flex; gap:.6rem; align-items:flex-start; cursor:pointer; }
:is(.ob-contact-form, .wpcf7) .wpcf7-acceptance input{ margin:.15rem 0 0; accent-color:var(--ob-accent); }
:is(.ob-contact-form, .wpcf7) .wpcf7-not-valid-tip{ margin-top:.3rem; font-size:.8125rem; color:#b3261e; }
/* CF7 peut afficher deux fois la même erreur (validation au clic sur la case + à l'envoi) */
:is(.ob-contact-form, .wpcf7) .wpcf7-not-valid-tip ~ .wpcf7-not-valid-tip{ display:none; }
:is(.ob-contact-form, .wpcf7) .wpcf7-not-valid{ border-color:#b3261e !important; }
:is(.ob-contact-form, .wpcf7) .wpcf7-spinner{ position:absolute; left:14rem; bottom:.7rem; margin:0; }
.wpcf7 form .wpcf7-response-output{ margin:.5rem 0 0; padding:.75rem 1rem; font-size:.9375rem; color:var(--ob-dark); }