/* =========================================================
   HABILLAGE PARENTHÈSE — chargé après lp.css
   Signature : les parenthèses du logo encadrent le formulaire (« votre parenthèse »)
   et les photos sont recadrées en arche, comme l'architecture du club.
   ========================================================= */

body{background:var(--chaux);font-weight:400;line-height:1.65}
h1,h2,h3{font-family:var(--font-head);font-weight:400;color:var(--nuit);letter-spacing:.005em}
h2{font-size:clamp(1.85rem,3.6vw,2.75rem);line-height:1.12;margin-bottom:.45em}
h1,h2{text-wrap:balance}
.nowrap{white-space:nowrap}
h3{font-size:1.25rem;line-height:1.25}
a{color:var(--bronze)}
::selection{background:var(--laiton);color:var(--nuit)}
:focus-visible{outline:2px solid var(--laiton);outline-offset:3px}

/* ---------- Boutons ---------- */
.btn{border-width:1px;font-weight:500;letter-spacing:.02em;color:var(--chaux);gap:.6em}
.btn--lg{font-size:1rem;min-height:56px;padding:.9em 1.6em}
#leadForm .btn--lg{padding-left:.8em;padding-right:.8em}
.btn:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn--ghost{color:var(--nuit);border-color:var(--nuit);background:transparent}
.btn--ghost:hover{background:var(--nuit);color:var(--chaux)}
.btn--laiton{background:var(--laiton);border-color:var(--laiton);color:var(--nuit)}
.btn--laiton:hover{background:var(--laiton-clair);border-color:var(--laiton-clair);color:var(--nuit)}
.btn--outline-light{border-color:rgba(247,245,241,.7);color:var(--chaux)}
.btn--outline-light:hover{background:var(--chaux);border-color:var(--chaux);color:var(--nuit)}
.btn svg{width:18px;height:18px}

/* ---------- Motif : parenthèses du logo ---------- */
.paren{color:var(--laiton);width:auto;height:auto;flex:none}
.paren--r{transform:scaleX(-1)}

/* Photos en arche (demi-cercle parfait en haut, quelle que soit la largeur) */
.arch{border-radius:1000px 1000px 0 0;object-fit:cover}

/* ---------- Barre du haut (posée sur la photo du hero) ---------- */
.topbar{position:absolute;top:0;left:0;right:0;z-index:5;background:transparent;border:0}
.topbar__in{min-height:76px}
.topbar__logo img{width:168px}
.topbar__phone{color:var(--chaux);font-weight:500;font-size:1rem;letter-spacing:.02em}
.topbar__phone svg{width:36px;height:36px;padding:8px;border-radius:50%;background:transparent;border:1px solid rgba(196,163,110,.6);color:var(--laiton)}
.topbar__cta{min-height:44px;padding:.55em 1.4em;background:var(--laiton);border-color:var(--laiton);color:var(--nuit)}
.topbar__cta:hover{background:var(--laiton-clair);border-color:var(--laiton-clair)}

/* ---------- Hero ---------- */
.hero{background:var(--nuit)}
.hero__bg img{object-position:50% 40%}
.hero__bg::after{background:linear-gradient(180deg,rgba(27,32,29,.55) 0%,rgba(27,32,29,.72) 34%,rgba(27,32,29,.96) 62%,var(--nuit) 100%)}
.hero__grid{padding-top:104px;padding-bottom:40px}
.hero__kicker{color:var(--laiton);font-weight:500;letter-spacing:.06em;font-size:.92rem;margin-bottom:.9em}
.hero h1{color:var(--chaux);font-size:clamp(2.15rem,4.4vw,3.6rem);line-height:1.08;max-width:13em;margin-bottom:.5em}
.hero__lead{color:#d6d4cc;font-size:1.06rem;font-weight:300;max-width:34em;margin-bottom:1.6em}
.hero__rating{display:inline-flex;align-items:center;gap:14px;color:#d6d4cc;text-decoration:none;font-size:.88rem;line-height:1.35;margin-bottom:1.6em}
.hero__rating strong{display:block;color:var(--chaux);font-weight:500;font-size:.98rem}
.hero__rating:hover strong{text-decoration:underline;text-decoration-color:var(--laiton);text-underline-offset:4px}
.stars{display:inline-flex;gap:3px;color:var(--laiton)}
.stars svg{width:17px;height:17px}
.hero__facts{display:grid;gap:10px;color:#e4e2db;font-size:.95rem}
.hero__facts li{position:relative;padding-left:22px}
.hero__facts li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:9px;border:1px solid var(--laiton);border-radius:50%}

/* Formulaire : carte chaux, encadrée de deux parenthèses en laiton sur grand écran */
.hero__form{position:relative}
.hero__form .paren{display:none}
.form-card{background:var(--chaux);border-radius:var(--radius);box-shadow:0 30px 80px rgba(0,0,0,.45);padding:28px 22px 22px}
.form-card__head h2{font-size:1.75rem;margin-bottom:.35em}
.form-card__head p{color:var(--muted);font-size:.93rem;line-height:1.55;margin-bottom:18px}
.field{margin-bottom:12px}
.field>label{font-weight:500;font-size:.8rem;letter-spacing:.03em;color:var(--muted);margin-bottom:5px}
.field input{min-height:50px;border:1px solid var(--line);border-radius:2px;background:#fff;color:var(--nuit)}
.field input:focus{border-color:var(--nuit);box-shadow:0 0 0 3px rgba(196,163,110,.35)}
.row{gap:12px}
#leadForm .btn{margin-top:6px}
.form-note{margin:12px 0 0;font-size:.86rem;font-weight:500;color:var(--bronze);text-align:center}
.form-legal{font-size:.72rem;text-align:center}
.form-legal a{color:var(--muted)}
.form-phone{margin:14px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:.9rem;color:var(--muted)}
.form-phone a{color:var(--nuit);font-weight:600;white-space:nowrap}
.form-msg.is-error{background:#f6e4e1;border-radius:2px}

/* ---------- Infos pratiques ---------- */
.infos{background:var(--nuit-2);color:#c9c8c0;border-top:1px solid var(--line-dark)}
.infos__in{display:grid;gap:0;padding-top:6px;padding-bottom:6px}
.infos__item{display:flex;gap:14px;align-items:center;padding:16px 0;font-size:.88rem;line-height:1.45}
.infos__item+.infos__item{border-top:1px solid var(--line-dark)}
.infos__item p{margin:0}
.infos__item strong{display:block;color:var(--chaux);font-weight:500;font-size:.95rem}
.infos__item a{color:inherit;text-decoration:none}
.infos__item strong a{color:var(--chaux)}
.infos__item svg{width:22px;height:22px;color:var(--laiton)}

/* ---------- Sections ---------- */
.section{padding:64px 0}
.section--nuit{background:var(--nuit);color:#c9c8c0}
.section--nuit h2,.section--nuit h3{color:var(--chaux)}
.section--pierre{background:var(--pierre)}
.section-head{text-align:left;margin:0 0 36px;max-width:640px}
.section-head p{color:var(--muted);font-size:1.02rem}
.section--nuit .section-head p{color:#b9b8b0}

/* Univers */
.univers__grid{display:grid;gap:44px}
.univers__text p{color:#3d423e;font-size:1.02rem;max-width:36em}
.univers__quote{display:flex;align-items:stretch;gap:14px;margin:32px 0 0;padding:0}
.univers__quote .paren{width:20px;height:auto}
.univers__quote p{font-family:var(--font-head);font-size:clamp(1.3rem,2.3vw,1.65rem);line-height:1.35;color:var(--nuit);margin:0;padding:10px 0;max-width:20em}
.univers__media{position:relative;padding:0 0 64px 0;max-width:520px}
.univers__main{width:82%;aspect-ratio:4/5;margin-left:auto}
.univers__second{position:absolute;left:0;bottom:0;width:52%;aspect-ratio:4/3;object-fit:cover;border:8px solid var(--chaux);border-radius:2px}

/* Espaces : bande défilante sur mobile, mosaïque sur grand écran */
.mosaic{display:grid;grid-auto-flow:column;grid-auto-columns:84%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-right:-16px;padding-right:16px;scrollbar-width:thin;scrollbar-color:var(--laiton) transparent}
.mosaic figure{margin:0;scroll-snap-align:start;display:flex;flex-direction:column;gap:10px;min-width:0}
.mosaic img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:2px;flex:1;min-height:0}
.mosaic figcaption{font-size:.85rem;letter-spacing:.03em;color:var(--laiton)}

/* Avis */
.avis__grid{display:grid;gap:36px}
.avis__note{display:flex;align-items:center;gap:18px;margin:6px 0 4px}
.avis__num{font-family:var(--font-head);font-size:4.4rem;line-height:1;color:var(--nuit)}
.avis__note .stars{color:#a8875c}
.avis__note .stars svg{width:22px;height:22px}
.avis__src{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.92rem;margin-bottom:24px}
.avis__src svg{width:20px;height:20px}
.avis__list{display:grid;grid-auto-flow:column;grid-auto-columns:86%;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-right:-16px;padding-right:16px;scrollbar-width:thin;scrollbar-color:var(--laiton) transparent}
.avis__item{margin:0;scroll-snap-align:start;border-top:1px solid var(--nuit);padding-top:18px}
.avis__item p{font-size:.95rem;line-height:1.65;color:#3d423e;margin-bottom:12px}
.avis__item footer{font-weight:500;font-size:.85rem;color:var(--bronze)}

/* Programme */
.cours{display:grid;gap:28px;margin-bottom:52px}
.cours__col h3{font-family:var(--font);font-weight:500;font-size:.88rem;letter-spacing:.04em;color:var(--bronze);margin-bottom:10px}
.cours__col li{font-family:var(--font-head);font-size:1.75rem;line-height:1.2;color:var(--nuit);padding:10px 0;border-top:1px solid var(--line)}
.plus{display:grid;gap:28px}
.plus__item{display:grid;grid-template-columns:112px 1fr;gap:20px;align-items:start}
.plus__item img{width:112px;aspect-ratio:3/4}
.plus__item h3{margin-bottom:.35em}
.plus__item p{margin:0;color:#3d423e;font-size:.97rem}

/* Coachs */
.coachs__list{display:grid;grid-auto-flow:column;grid-auto-columns:62%;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-right:-16px;padding-right:16px;scrollbar-width:thin;scrollbar-color:var(--laiton) transparent}
.coachs__list li{scroll-snap-align:start}
.coachs__list img{width:100%;aspect-ratio:3/4;margin-bottom:14px;background:var(--pierre)}
.coachs__list h3{margin-bottom:.3em}
.coachs__list p{font-size:.86rem;line-height:1.55;color:var(--muted);margin:0}

/* Séance d'essai en 3 temps (vraie séquence : numérotée) */
.essai__steps{list-style:none;margin:0;padding:0;display:grid;gap:26px;counter-reset:e}
.essai__steps li{counter-increment:e;border-top:1px solid var(--line-dark);padding-top:20px;display:grid;grid-template-columns:52px 1fr;column-gap:8px}
.essai__steps li::before{content:counter(e);grid-row:span 2;font-family:var(--font-head);font-size:2.6rem;line-height:1;color:var(--laiton)}
.essai__steps h3{font-size:1.3rem;margin:0 0 .3em}
.essai__steps p{margin:0;font-size:.95rem}
.essai__cta{margin:40px 0 0}

/* Studio Lagree */
.lagree{padding:48px 0}
.lagree__in{display:grid;gap:22px;align-items:center}
.lagree__img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:2px}
.lagree h2{font-size:clamp(1.5rem,2.6vw,2rem)}
.lagree p{color:var(--muted);margin:0;max-width:30em}

/* CTA final */
.final{position:relative;overflow:hidden;background:var(--nuit);color:#d6d4cc;text-align:center;padding:88px 0}
.final__bg{position:absolute;inset:0}
.final__bg img{width:100%;height:100%;object-fit:cover}
.final__bg::after{content:"";position:absolute;inset:0;background:rgba(27,32,29,.84)}
.final__in{position:relative;max-width:760px}
.final h2{color:var(--chaux)}
.final p{font-size:1.05rem;font-weight:300;max-width:36em;margin:0 auto 30px}
.final__btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}

/* Pied de page */
.footer{background:var(--nuit-3);color:#a9aaa2;padding:48px 0 28px;font-size:.88rem}
.footer a{color:#d6d4cc;text-decoration:none}
.footer a:hover{color:var(--laiton)}
.footer strong{display:block;color:var(--laiton);font-weight:500;margin-bottom:6px}
.footer__logo{width:168px;filter:none}
.footer__social{display:flex;gap:12px;margin-top:18px}
.footer__social svg{width:22px;height:22px}
.footer__legal{border-top-color:rgba(196,163,110,.18);font-size:.78rem}

/* Barre mobile et bannière cookies */
.sticky-bar{background:var(--chaux);box-shadow:0 -8px 24px rgba(0,0,0,.18)}
.cookie{border-radius:var(--radius)}
.cookie .btn{font-weight:500}

/* ---------- Mobile ---------- */
@media (max-width:639px){
  .topbar__in{min-height:64px}
  .topbar__logo img{width:138px}
  .hero__grid{padding-top:84px;gap:26px;padding-bottom:32px}
  .hero h1{font-size:2.05rem}
  .hero__kicker{font-size:.85rem;margin-bottom:.6em}
  .hero__rating{margin-bottom:0}
  .hero__lead,.hero__facts{display:none}
  .form-card{padding:24px 18px 18px}
  .form-card__head h2{font-size:1.55rem}
  .section{padding:52px 0}
  .cours{gap:22px;margin-bottom:40px}
  .cours__col h3{padding-bottom:8px;border-bottom:1px solid var(--line)}
  .cours__col ul{display:flex;flex-wrap:wrap;column-gap:22px}
  .cours__col li{border:0;padding:2px 0;font-size:1.5rem}
}

/* ---------- Tablette / desktop ---------- */
@media (min-width:640px){
  .infos__in{grid-template-columns:repeat(3,1fr);gap:24px}
  .infos__item+.infos__item{border-top:0;border-left:1px solid var(--line-dark);padding-left:24px}
  .avis__list{grid-auto-columns:46%}
  .coachs__list{grid-auto-columns:36%}
  .cours{grid-template-columns:repeat(3,1fr);gap:32px}
  .plus{grid-template-columns:1fr 1fr;gap:36px}
  .essai__steps{grid-template-columns:repeat(3,1fr);gap:32px}
  .footer__grid{grid-template-columns:1.3fr 1fr 1fr 1.2fr}
  .lagree__in{grid-template-columns:minmax(0,440px) 1fr;gap:40px}
  .mosaic{grid-auto-columns:46%}
}
@media (min-width:960px){
  .section{padding:104px 0}
  .topbar__in{min-height:92px}
  .topbar__logo img{width:200px}
  .hero{min-height:min(860px,100vh)}
  .hero__bg::after{background:linear-gradient(90deg,rgba(27,32,29,.94) 0%,rgba(27,32,29,.82) 44%,rgba(27,32,29,.36) 60%,rgba(27,32,29,.18) 100%)}
  .hero__grid{grid-template-columns:1fr 470px;gap:64px;padding-top:150px;padding-bottom:88px}
  .hero__form{padding:0 34px}
  .hero__form .paren{display:block;position:absolute;top:-6%;height:112%;width:56px}
  .hero__form .paren--l{left:-20px}
  .hero__form .paren--r{right:-20px}
  .form-card{padding:34px 34px 26px}
  .univers__grid{grid-template-columns:1.05fr .95fr;gap:72px;align-items:center}
  .univers__media{margin-left:auto;width:100%}
  .mosaic{grid-auto-flow:row;grid-template-columns:repeat(12,1fr);grid-template-rows:280px 280px 330px;gap:22px 18px;overflow:visible;margin:0;padding:0}
  .mosaic img{aspect-ratio:auto;height:100%}
  .mosaic__a{grid-column:1/8;grid-row:1/3}
  .mosaic__b{grid-column:8/13;grid-row:1}
  .mosaic__e{grid-column:8/13;grid-row:2}
  .mosaic__c{grid-column:1/4;grid-row:3}
  .mosaic__d{grid-column:4/8;grid-row:3}
  .mosaic__f{grid-column:8/13;grid-row:3}
  .avis__grid{grid-template-columns:330px 1fr;gap:72px;align-items:start}
  .avis__score{position:sticky;top:40px}
  .avis__list{display:block;columns:2;column-gap:40px;overflow:visible;margin:0;padding:0}
  .avis__item{break-inside:avoid;margin-bottom:30px}
  .coachs__list{grid-auto-flow:row;grid-template-columns:repeat(5,1fr);overflow:visible;margin:0;padding:0;gap:24px}
  .plus__item{grid-template-columns:150px 1fr;gap:26px}
  .plus__item img{width:150px}
  .final{padding:128px 0}
}
