/* =========================================================
   01-COMPOSANTS.CSS
   1. Page d'accueil  2. Images  3. Gabarit pages internes
   ========================================================= */

/* ---- BOUTONS ---- */
.cp .btn{display:inline-block;text-decoration:none;background:var(--ink);color:var(--accent);padding:15px 26px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;transition:transform .2s ease,background .2s ease;border:0;cursor:pointer}
.cp .btn:hover{background:var(--accent);color:var(--ink);transform:translateY(-2px)}
.cp .btn.light{background:var(--accent);color:var(--ink)}
.cp .btn.light:hover{background:var(--white);color:var(--ink)}
.cp .btn.ghost{background:transparent;border:1px solid var(--line);color:var(--ink)}
.cp .btn.ghost:hover{background:var(--white)}
.cp .btn.ghost-dark{background:transparent;border:1px solid var(--line-dark);color:var(--paper)}
.cp .btn.ghost-dark:hover{background:rgba(161,174,201,.14)}
.cp .btn-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}/* ---- HERO ---- */
.cp .hero{padding:clamp(48px,6vw,84px) 0 clamp(56px,6vw,88px)}
.cp .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,70px);align-items:stretch}
.cp .hero h1 em{font-style:normal;color:var(--teal-deep)}
.cp .hero .lead{margin-top:22px;max-width:46ch}
.cp .hero-photo{margin:0;max-width:none}
.cp .hero-grid > div:first-child{display:flex;flex-direction:column;justify-content:flex-start}/* les deux marges auto repartissent l'espace libre a parts egales :
   les boutons se retrouvent centres entre le paragraphe et la photo */
.cp .hero-grid > div:first-child .btn-row{margin-top:auto;padding-top:36px}
.cp .hero-grid > div:first-child .hero-photo{margin-top:auto;padding-top:36px}
.cp .hero-photo img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:var(--ink)}
.cp .pioneer{background:var(--ink);color:var(--cream);padding:clamp(30px,3.4vw,42px) clamp(26px,3vw,38px)}
.cp .pioneer .k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-light);margin:0 0 18px}
.cp .pioneer .claim{font-family:var(--display);font-size:clamp(20px,2.1vw,26px);font-weight:500;line-height:1.28;letter-spacing:-.015em;margin:0 0 28px;color:var(--cream)}
.cp .pioneer ul{list-style:none;margin:0;padding:0}
.cp .pioneer li{padding:16px 0;border-top:1px solid var(--line-dark)}
.cp .pioneer li b{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-light);font-weight:400;margin-bottom:6px}
.cp .pioneer li span{font-size:15.5px;color:var(--steel-2);line-height:1.45}
.cp .pioneer-highlight{margin-top:26px;border:1px solid var(--accent);background:rgba(0,255,204,.07);padding:22px 22px 20px}
.cp .pioneer-highlight .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.cp .pioneer-highlight .t{font-family:var(--display);font-size:clamp(17px,1.7vw,20px);font-weight:500;line-height:1.3;letter-spacing:-.01em;color:var(--paper);margin:0 0 8px}
.cp .pioneer-highlight .s{font-size:14px;line-height:1.5;color:var(--steel);margin:0}/* ---- CHIFFRES ---- */
.cp .figures{background:var(--ink);color:var(--cream)}
.cp .figures .wrap{padding-top:clamp(44px,5vw,64px);padding-bottom:clamp(44px,5vw,64px)}
.cp .fig-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-dark);border:1px solid var(--line-dark)}
.cp .fig{background:var(--ink);padding:28px 24px}
.cp .fig b{font-family:var(--display);font-size:clamp(32px,3.6vw,46px);font-weight:600;letter-spacing:-.03em;display:block;line-height:1;color:var(--cream)}
.cp .fig span{font-size:14.5px;color:var(--steel);display:block;margin-top:12px;line-height:1.45}
.cp .fig-note{font-family:var(--mono);font-size:11px;color:var(--steel);margin-top:22px;letter-spacing:.04em}/* ---- PORTES ---- */
.cp .doors{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:46px}
.cp .door{background:var(--white);padding:34px 30px;text-decoration:none;display:flex;flex-direction:column;gap:12px;transition:background .3s ease}
.cp .door:hover{background:var(--cream-2)}
.cp .door .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-deep)}
.cp .door p{font-size:15.5px;color:var(--sage);margin:0}
.cp .door .go{margin-top:auto;padding-top:18px;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center;gap:10px}
.cp .door .go i{display:block;width:24px;height:1px;background:var(--teal);transition:width .3s ease}
.cp .door:hover .go i{width:44px}/* ---- COMPARATEUR ---- */
.cp .compare{background:var(--cream-2)}
.cp .table{margin-top:46px;border:1px solid var(--line);background:var(--white)}
.cp .row{display:grid;grid-template-columns:1.05fr 1.95fr;align-items:stretch}
.cp .row + .row{border-top:1px solid var(--line)}
.cp .row > div{padding:17px 24px;font-size:15.5px;display:flex;align-items:center}
.cp .row .crit{color:var(--ink);font-weight:500}
.cp .row .emb{background:var(--ink);color:var(--cream)}
.cp .row .chir{color:var(--sage)}
.cp .row.head > div{padding-top:22px;padding-bottom:22px}
.cp .row.head .crit{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);font-weight:400}
.cp .row.head h3{font-size:18px}
.cp .row.head .emb h3{color:var(--cream)}
.cp .row.head .emb small{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-light);margin-bottom:6px}
.cp .row.head .chir small{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--sage);margin-bottom:6px}/* ---------- BOUTON FLOTTANT INTERNATIONAL ---------- */
.cp .cp-float{position:fixed;right:22px;bottom:22px;z-index:9990;
  display:inline-flex;align-items:center;gap:12px;
  background:var(--ink);color:var(--accent);text-decoration:none;
  padding:15px 22px 15px 18px;border:1px solid var(--accent);
  font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  box-shadow:0 10px 30px rgba(0,20,27,.28);
  transition:background .25s ease,color .25s ease,transform .25s ease;
  animation:cp-float-in .5s .8s cubic-bezier(.2,.7,.3,1) both;}
.cp .cp-float:hover, .cp .cp-float:focus-visible{background:var(--accent);color:var(--ink);transform:translateY(-3px)}
.cp .cp-float svg{width:20px;height:20px;flex:none;display:block}
.cp .cp-float .l1{display:block;font-weight:500}
.cp .cp-float .l2{display:block;font-size:10px;letter-spacing:.14em;color:var(--steel);margin-top:3px}
.cp .cp-float:hover .l2, .cp .cp-float:focus-visible .l2{color:var(--ink)}
@keyframes cp-float-in{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:none}
}
@media(max-width:640px){
  .cp .cp-float{right:12px;bottom:12px;padding:13px 16px;gap:9px;font-size:11px}
  .cp .cp-float .l2{display:none}
  .cp .cp-float svg{width:18px;height:18px}
}
@media print{
  .cp .cp-float{display:none}
}/* ---------- SCHÉMA SUR FOND SOMBRE ---------- */
.cp .proc-schema{margin:clamp(34px,4vw,52px) 0 0;background:var(--paper);padding:clamp(20px,2.4vw,32px)}
.cp .proc-schema img{display:block;width:100%;height:auto}
.cp .proc-schema figcaption{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-top:16px;line-height:1.6;max-width:70ch}/* ---------- ACTUALITES ---------- */
.cp .news{background:var(--white)}
.cp .news-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap}
.cp .news-head .btn{margin-top:0}
.cp .news-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:46px}
.cp .card{background:var(--white);padding:34px 30px;display:flex;flex-direction:column;gap:12px}
.cp .card .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin:0}
.cp .card h3{font-size:21px;margin:0}
.cp .card p{font-size:15.5px;color:var(--text-2);margin:0}
.cp .card a{margin-top:auto;padding-top:16px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--text);border-bottom:0}
.cp .card a:after{content:" →";color:var(--text-3)}
.cp .card:hover{background:var(--paper)}
@media(max-width:900px){
  .cp .news-grid{grid-template-columns:1fr}
}
.cp .compare .foot{font-size:14.5px;color:var(--sage);margin-top:20px;max-width:78ch}/* ---------- BLOC PREUVE SCIENTIFIQUE ---------- */
.cp .proof{background:var(--ink);color:var(--paper);padding:clamp(28px,3.2vw,40px) clamp(26px,3vw,38px);margin-top:clamp(34px,4vw,52px);border-left:3px solid var(--accent)}
.cp .proof .k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
.cp .proof .claim{font-family:var(--display);font-size:clamp(19px,2vw,25px);font-weight:500;line-height:1.3;letter-spacing:-.015em;margin:0 0 14px;color:var(--paper);max-width:52ch}
.cp .proof .ref{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--steel);margin:0}
.cp .proof .src{margin:0;font-size:14px;line-height:1.5;color:var(--steel)}
.cp .proof .src a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(0,255,204,.4)}
.cp .proof .src a:hover{border-color:var(--accent)}
.cp .proof .src em{font-style:italic}
.cp .proof.on-light .src{color:var(--text-3)}
.cp .proof.on-light .src a{color:var(--text);border-bottom:1px solid var(--accent)}
.cp .proof.on-light{background:transparent;color:var(--text);border-left:3px solid var(--accent);padding-left:26px}
.cp .proof.on-light .k{color:var(--text-2)}
.cp .proof.on-light .claim{color:var(--text)}
.cp .proof.on-light .ref{color:var(--text-3)}/* ---- DÉROULÉ ---- */
.cp .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-dark);border:1px solid var(--line-dark);margin-top:46px}
.cp .step{background:var(--ink);padding:30px 26px}
.cp .step .t{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--teal-light);margin-bottom:16px;display:block}
.cp .step h3{color:var(--cream);margin-bottom:10px}
.cp .step p{font-size:15px;color:var(--steel);margin:0}
.cp .proc{background:var(--ink);color:var(--cream)}
.cp .proc h2{color:var(--cream);max-width:30ch}
.cp .proc .lead{color:var(--steel-2)}/* ---- DIFFÉRENCIATION ---- */
.cp .edge-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3.4vw,52px);margin-top:48px}
.cp .edge{border-top:2px solid var(--ink);padding-top:20px}
.cp .edge .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-deep);margin-bottom:12px}
.cp .edge h3{margin-bottom:10px;font-size:21px}
.cp .edge p{font-size:15.5px;color:var(--sage);margin-bottom:14px}
.cp .edge a{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--teal);padding-bottom:3px}/* ---- PARCOURS ---- */
.cp .parc{background:var(--teal-deep);color:var(--cream)}
.cp .parc h2{color:var(--cream)}
.cp .parc .lead{color:var(--steel-2)}
.cp .parc-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(161,174,201,.30);border:1px solid rgba(161,174,201,.30);margin-top:44px}
.cp .parc-card{background:var(--teal-deep);padding:36px 32px}
.cp .parc-card .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-light);margin-bottom:14px}
.cp .parc-card h3{color:var(--cream);font-size:26px;margin-bottom:12px}
.cp .parc-card p{color:var(--steel-2);font-size:15.5px}
.cp .parc-card ul{list-style:none;margin:0 0 24px;padding:0}
.cp .parc-card li{font-size:15px;padding:9px 0 9px 22px;border-top:1px solid rgba(161,174,201,.26);position:relative;color:var(--steel-2)}
.cp .parc-card li:before{content:"→";position:absolute;left:0;font-family:var(--mono);color:var(--teal-light)}/* ---- PRESSE ---- */
.cp .press{background:var(--white);padding:clamp(40px,4.5vw,58px) 0}
.cp .press .wrap{display:flex;align-items:center;gap:clamp(24px,4vw,56px);flex-wrap:wrap}
.cp .press .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);white-space:nowrap}
.cp .press ul{list-style:none;display:flex;gap:clamp(20px,3vw,46px);margin:0;padding:0;flex-wrap:wrap}
.cp .press li{font-family:var(--display);font-size:clamp(16px,1.6vw,20px);font-weight:500;letter-spacing:.02em;color:var(--ink)}
.cp .press li span{display:block;font-family:var(--body);font-size:13px;font-weight:400;color:var(--sage);letter-spacing:0;margin-top:2px}/* ---- FAQ ---- */
.cp details{border-top:1px solid var(--line);padding:2px 0}
.cp details:last-of-type{border-bottom:1px solid var(--line)}
.cp summary{cursor:pointer;list-style:none;padding:22px 44px 22px 0;position:relative;font-family:var(--display);font-size:clamp(18px,1.8vw,21px);font-weight:500;letter-spacing:-.01em}
.cp summary::-webkit-details-marker{display:none}
.cp summary:after{content:"+";position:absolute;right:6px;top:19px;font-family:var(--mono);font-size:22px;color:var(--teal);transition:transform .25s ease}
.cp details[open] summary:after{transform:rotate(45deg)}
.cp details p{max-width:76ch;padding-right:44px;color:var(--text-2);font-size:16px}/* ---- CONTACT ---- */
.cp .contact{background:var(--ink);color:var(--cream)}
.cp .contact h2{color:var(--cream);max-width:16ch}
.cp .contact-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,70px);align-items:start}
.cp .contact p{color:var(--steel-2)}
.cp .coord{list-style:none;margin:0;padding:0}
.cp .coord li{padding:18px 0;border-top:1px solid var(--line-dark);display:grid;grid-template-columns:110px 1fr;gap:18px;align-items:baseline}
.cp .coord .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-light)}
.cp .coord a{text-decoration:none;font-size:18px}
.cp .coord a:hover{color:var(--teal-light)}/* ---- BLOC ÉDITORIAL SEO ---- */
.cp .seo{background:var(--cream-2);border-top:1px solid var(--line)}
.cp .seo-grid{display:grid;grid-template-columns:.42fr 1fr;gap:clamp(30px,5vw,72px);align-items:start}
.cp .seo-side{position:sticky;top:104px}
.cp .seo-side h2{font-size:clamp(24px,2.6vw,32px)}
.cp .seo-side p{font-size:15.5px;color:var(--sage);margin-top:14px}
.cp .seo-body{column-gap:clamp(28px,3.4vw,52px)}
.cp .seo-body h3{font-size:20px;margin:0 0 12px}
.cp .seo-body h3 + p{margin-top:0}
.cp .seo-body p{font-size:16px;line-height:1.68;color:var(--text-2);margin-bottom:20px}
.cp .seo-body .block{padding-top:26px;margin-top:26px;border-top:1px solid var(--line)}
.cp .seo-body .block:first-child{padding-top:0;margin-top:0;border-top:0}
.cp .seo-body a{color:var(--teal-deep);text-decoration:none;border-bottom:1px solid rgba(0,20,27,.30)}
.cp .seo-body a:hover{border-color:var(--teal-deep)}
.cp .seo-body ul{margin:0 0 20px;padding:0;list-style:none}
.cp .seo-body li{font-size:16px;padding:8px 0 8px 20px;position:relative;color:var(--text-2);border-top:1px solid var(--line)}
.cp .seo-body li:before{content:"";position:absolute;left:0;top:18px;width:8px;height:1px;background:var(--teal)}
.cp footer{background:var(--ink-2);color:var(--steel);font-size:13.5px;padding:34px 0}
.cp footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.cp footer a{color:var(--steel)}
@media(max-width:980px){
  .cp .hero-grid, .cp .contact-grid, .cp .seo-grid{grid-template-columns:1fr}
  .cp .seo-side{position:static}
  .cp .fig-grid, .cp .steps{grid-template-columns:1fr 1fr}
  .cp .doors, .cp .edge-grid, .cp .parc-grid{grid-template-columns:1fr}
  }
@media(max-width:640px){
  .cp .fig-grid, .cp .steps{grid-template-columns:1fr}
  .cp .row{grid-template-columns:.85fr 1.15fr;align-items:stretch}
  .cp .row > div{padding:12px 14px;font-size:14.5px;line-height:1.4}
  .cp .row .crit{background:var(--paper-2);font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-2)}
  .cp .row.head{display:none}
  .cp .coord li{grid-template-columns:1fr;gap:4px}
}
@media(prefers-reduced-motion:reduce){
  .cp *{animation:none!important;transition:none!important}
}


/* =========================================================
   IMAGES — composants a utiliser dans les modules Code
   Ne jamais mettre de style="" en dur sur une image.
   ========================================================= */

/* Image simple, pleine largeur du conteneur */
.cp .cp-figure{margin:0}
.cp .cp-figure img{display:block;width:100%;height:auto}
.cp .cp-figure figcaption{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--sage);margin-top:14px;line-height:1.6}
.cp .cp-band--dark .cp-figure figcaption,.cp .day .cp-figure figcaption,.cp .contact .cp-figure figcaption{color:var(--steel)}

/* Ratios imposes : evite que la page saute au chargement */
.cp .cp-figure--16-9 img{aspect-ratio:16/9;object-fit:cover}
.cp .cp-figure--4-3  img{aspect-ratio:4/3;object-fit:cover}
.cp .cp-figure--1-1  img{aspect-ratio:1/1;object-fit:cover}
.cp .cp-figure--portrait img{aspect-ratio:3/4;object-fit:cover}

/* Texte a gauche, image a droite (ou l'inverse) */
.cp .cp-media{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4.5vw,72px);align-items:center}
.cp .cp-media--large-image{grid-template-columns:.85fr 1.15fr}
.cp .cp-media--inverse .cp-figure{order:-1}
.cp .cp-media h2{margin-bottom:16px}

/* Bandeau photo pleine largeur d'ecran */
.cp .cp-banner{width:100vw;margin-left:calc(50% - 50vw);display:block}
.cp .cp-banner img{display:block;width:100%;height:clamp(260px,42vw,520px);object-fit:cover}

/* Portrait de praticien */
.cp .cp-portrait{display:grid;grid-template-columns:220px 1fr;gap:clamp(24px,3vw,44px);align-items:start}
.cp .cp-portrait img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.cp .cp-portrait .nom{font-family:var(--display);font-size:22px;font-weight:600;margin:0 0 6px}
.cp .cp-portrait .role{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);margin-bottom:16px}

/* Bande de plusieurs images */
.cp .cp-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.cp .cp-gallery img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}

@media(max-width:900px){
  .cp .cp-media,.cp .cp-portrait{grid-template-columns:1fr}
  .cp .cp-media--inverse .cp-figure{order:0}
  .cp .cp-portrait img{max-width:240px}
  .cp .cp-gallery{grid-template-columns:1fr 1fr}
}


/* =========================================================
   GABARIT PAGES INTERNES — "article documentaire"
   À COLLER À LA FIN DE assets/css/01-composants.css

   Volontairement différent de la page d'accueil :
   pas de bandes pleine largeur alternées, pas de grille
   de cartes. Une colonne de lecture étroite, un rail
   collant à gauche, des encadrés intégrés au fil du texte.
   Mêmes tokens de couleur et de typographie.
   ========================================================= */

/* ---------- Fil d'Ariane ---------- */
.cp .pg-crumb{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);padding:26px 0 0}
.cp .pg-crumb a{color:var(--text-3);text-decoration:none}
.cp .pg-crumb a:hover{color:var(--text)}
.cp .pg-crumb span{margin:0 8px;opacity:.5}

/* ---------- En-tête d'article ---------- */
.cp .pg-head{padding:26px 0 clamp(34px,4vw,52px);border-bottom:1px solid var(--line)}
.cp .pg-head h1{font-size:clamp(32px,4.4vw,52px);line-height:1.08;max-width:22ch}
.cp .pg-head .lead{margin-top:20px;max-width:62ch;font-size:clamp(17px,1.5vw,19px)}
.cp .pg-meta{display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:28px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}
.cp .pg-meta b{font-weight:400;color:var(--text-2)}

/* ---------- Mise en page : rail + colonne de lecture ---------- */
.cp .pg-layout{display:grid;grid-template-columns:250px 1fr;gap:clamp(32px,5vw,76px);align-items:start;padding:clamp(38px,4.5vw,60px) 0 clamp(56px,7vw,90px)}
.cp .pg-rail{position:sticky;top:96px;display:flex;flex-direction:column;gap:26px}

/* Sommaire */
.cp .pg-toc .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin:0 0 14px}
.cp .pg-toc ol{list-style:none;margin:0;padding:0;counter-reset:toc}
.cp .pg-toc li{counter-increment:toc;border-top:1px solid var(--line)}
.cp .pg-toc li:first-child{border-top:0}
.cp .pg-toc a{display:grid;grid-template-columns:26px 1fr;gap:6px;padding:10px 0;font-size:14.5px;line-height:1.35;color:var(--text-2);text-decoration:none}
.cp .pg-toc a:before{content:counter(toc,decimal-leading-zero);font-family:var(--mono);font-size:10.5px;color:var(--text-3);padding-top:3px}
.cp .pg-toc a:hover{color:var(--text)}

/* Encadré du rail */
.cp .pg-aside{background:var(--ink);color:var(--paper);padding:22px 20px}
.cp .pg-aside .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
.cp .pg-aside ul{list-style:none;margin:0;padding:0}
.cp .pg-aside li{padding:11px 0;border-top:1px solid var(--line-dark);font-size:14px;line-height:1.4;color:var(--steel-2)}
.cp .pg-aside li:first-child{border-top:0}
.cp .pg-aside li b{display:block;font-family:var(--display);font-size:22px;font-weight:600;color:var(--paper);letter-spacing:-.02em;margin-bottom:2px}
.cp .pg-aside .go{display:block;margin-top:18px;padding-top:14px;border-top:1px solid var(--line-dark);font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);text-decoration:none}

/* ---------- Corps de l'article ---------- */
.cp .pg-body{max-width:74ch}
.cp .pg-body > section{padding-top:clamp(34px,4vw,52px);margin-top:clamp(34px,4vw,52px);border-top:1px solid var(--line)}
.cp .pg-body > section:first-child{padding-top:0;margin-top:0;border-top:0}
.cp .pg-body h2{font-size:clamp(24px,2.6vw,32px);line-height:1.18;margin:0 0 18px;scroll-margin-top:100px}
.cp .pg-body h3{font-size:19px;margin:30px 0 10px}
.cp .pg-body p{font-size:17px;line-height:1.7;color:var(--text-2);margin:0 0 18px}
.cp .pg-body p strong{color:var(--text);font-weight:600}
.cp .pg-body a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--accent)}
.cp .pg-body ul{list-style:none;margin:0 0 20px;padding:0}
.cp .pg-body li{font-size:17px;line-height:1.6;color:var(--text-2);padding:9px 0 9px 22px;border-top:1px solid var(--line);position:relative}
.cp .pg-body li:before{content:"";position:absolute;left:0;top:19px;width:9px;height:1px;background:var(--accent)}

/* Encadré définition */
.cp .pg-def{background:var(--paper-2);border-left:3px solid var(--accent);padding:22px 24px;margin:0 0 24px}
.cp .pg-def .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin:0 0 10px}
.cp .pg-def p{margin:0;font-size:16.5px}

/* Exergue */
.cp .pg-quote{margin:26px 0;padding:0 0 0 26px;border-left:2px solid var(--accent)}
.cp .pg-quote p{font-family:var(--display);font-size:clamp(19px,2vw,23px);font-weight:500;line-height:1.35;letter-spacing:-.015em;color:var(--text);margin:0}
.cp .pg-quote cite{display:block;margin-top:12px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);font-style:normal}

/* Deux colonnes de listes */
.cp .pg-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.6vw,38px);margin:0 0 24px}
.cp .pg-split h3{margin-top:0}

/* Tableau simple */
.cp .pg-table{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:16px}
.cp .pg-table th,.cp .pg-table td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.5}
.cp .pg-table thead th{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--paper);background:var(--ink);border-bottom:0}
.cp .pg-table tbody th{font-weight:500;color:var(--text);width:26%}
.cp .pg-table td{color:var(--text-2)}
.cp .pg-table tbody tr:nth-child(even) td,.cp .pg-table tbody tr:nth-child(even) th{background:var(--paper-2)}

/* Étapes numérotées en ligne */
.cp .pg-steps{counter-reset:st;list-style:none;margin:0 0 22px;padding:0}
.cp .pg-steps li{counter-increment:st;padding:16px 0 16px 52px;border-top:1px solid var(--line);position:relative}
.cp .pg-steps li:before{content:counter(st,decimal-leading-zero);position:absolute;left:0;top:17px;font-family:var(--mono);font-size:12px;color:var(--accent);background:none;width:auto;height:auto}
.cp .pg-steps b{display:block;font-family:var(--display);font-size:18px;font-weight:600;color:var(--text);margin-bottom:5px}

/* Appel à l'action intégré au texte */
.cp .pg-cta{background:var(--ink);color:var(--paper);padding:clamp(26px,3vw,36px);margin:34px 0;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.cp .pg-cta h3{font-size:clamp(19px,1.9vw,23px);color:var(--paper);margin:0 0 8px}
.cp .pg-cta p{color:var(--steel-2);margin:0;font-size:15.5px;max-width:48ch}
.cp .pg-cta .btn{background:var(--accent);color:var(--ink);white-space:nowrap}
.cp .pg-cta .btn:hover{background:var(--paper)}

/* FAQ intégrée */
.cp .pg-body details{border-top:1px solid var(--line);padding:0}
.cp .pg-body details:last-of-type{border-bottom:1px solid var(--line)}
.cp .pg-body summary{font-family:var(--display);font-size:18px;font-weight:500;padding:18px 40px 18px 0}
.cp .pg-body summary:after{top:16px;font-size:20px}
.cp .pg-body details p{padding-right:40px;font-size:16.5px}

/* Pages liées */
.cp .pg-related{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:30px}
.cp .pg-related a{background:var(--white);padding:22px 20px;text-decoration:none;border:0;display:block;transition:background .25s ease}
.cp .pg-related a:hover{background:var(--paper-2)}
.cp .pg-related .k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);display:block;margin-bottom:8px}
.cp .pg-related b{font-family:var(--display);font-size:17px;font-weight:600;color:var(--text);line-height:1.25;display:block}

/* Mentions de bas de page */
.cp .pg-legal{border-top:1px solid var(--line);padding:26px 0 60px;font-size:13.5px;line-height:1.6;color:var(--text-3);max-width:80ch}
.cp .pg-legal strong{color:var(--text-2);font-weight:500}

@media(max-width:980px){
  .cp .pg-layout{grid-template-columns:1fr;gap:34px}
  .cp .pg-rail{position:static;flex-direction:row;flex-wrap:wrap;gap:26px}
  .cp .pg-toc,.cp .pg-aside{flex:1 1 280px}
  .cp .pg-related{grid-template-columns:1fr}
}
@media(max-width:640px){
  .cp .pg-split,.cp .pg-cta{grid-template-columns:1fr}
  .cp .pg-table thead{display:none}
  .cp .pg-table tbody th{width:auto;display:block;padding-bottom:4px}
  .cp .pg-table td{display:block;padding-top:4px}
  .cp .pg-table td:before{content:attr(data-l);display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:3px}
}

/* Tableau large (comparatif à 4 techniques) */
.cp .pg-tablewrap{overflow-x:auto;margin:0 0 22px;-webkit-overflow-scrolling:touch}
.cp .pg-tablewrap .pg-table{margin:0;min-width:660px;font-size:15px}
.cp .pg-tablewrap .pg-table th,.cp .pg-tablewrap .pg-table td{padding:11px 13px}
.cp .pg-table .hi{background:rgba(0,255,204,.10)}
.cp .pg-table thead th.hi{background:var(--ink);color:var(--accent)}
.cp .pg-tablewrap + .pg-note{font-size:14px;color:var(--text-3);margin:-10px 0 22px}

/* ---------- BOUTON FLOTTANT : RENDEZ-VOUS RAPIDE (pages internes) ---------- */
.cp .cp-float--rdv{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.cp .cp-float--rdv:hover,.cp .cp-float--rdv:focus-visible{background:var(--ink);color:var(--accent);border-color:var(--accent)}
.cp .cp-float--rdv .l2{color:rgba(0,20,27,.62)}
.cp .cp-float--rdv:hover .l2,.cp .cp-float--rdv:focus-visible .l2{color:var(--steel)}

/* ---------- VIDÉO YOUTUBE SANS COOKIE AVANT CLIC ---------- */
.cp .cp-video{margin:28px 0 24px}
.cp .cp-video .frame{position:relative;aspect-ratio:16/9;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;cursor:pointer;border:0;width:100%;padding:24px;text-align:center;transition:background .25s ease}
.cp .cp-video .frame:hover{background:var(--ink-2)}
.cp .cp-video .play{width:64px;height:64px;border:1px solid var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;transition:background .25s ease}
.cp .cp-video .frame:hover .play{background:var(--accent)}
.cp .cp-video .play svg{width:22px;height:22px;fill:var(--accent);margin-left:3px;transition:fill .25s ease}
.cp .cp-video .frame:hover .play svg{fill:var(--ink)}
.cp .cp-video .t{font-family:var(--display);font-size:clamp(17px,1.8vw,21px);font-weight:500;color:var(--paper);line-height:1.3;max-width:34ch;margin:0}
.cp .cp-video .n{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);margin:0;max-width:44ch;line-height:1.6}
.cp .cp-video iframe{display:block;width:100%;aspect-ratio:16/9;border:0}
.cp .cp-video figcaption{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-top:12px}

/* ---------- CAS CLINIQUES ---------- */
.cp .pg-case{border:1px solid var(--line);margin:0 0 30px;background:var(--white)}
.cp .pg-case > header{background:var(--ink);color:var(--paper);padding:20px 24px;display:flex;justify-content:space-between;align-items:baseline;gap:18px;flex-wrap:wrap}
.cp .pg-case > header h3{font-size:21px;color:var(--paper);margin:0}
.cp .pg-case > header .who{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0}
.cp .pg-case .body{padding:24px}
.cp .pg-case .grid{display:grid;grid-template-columns:1fr 1fr;gap:24px 30px}
.cp .pg-case .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin:0 0 12px}
.cp .pg-case ul{margin:0}
.cp .pg-case li{font-size:16px;padding:8px 0 8px 20px}
.cp .pg-case li:first-child{border-top:0}
.cp .pg-case p{font-size:16px;margin:0 0 14px}
.cp .pg-case .note{border-left:3px solid var(--accent);background:var(--paper-2);padding:18px 20px;margin:22px 0 0}
.cp .pg-case .note p:last-child{margin-bottom:0}
.cp .pg-case-imgs{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border-top:1px solid var(--line)}
.cp .pg-case-imgs figure{margin:0;background:var(--white);padding:0}
.cp .pg-case-imgs img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.cp .pg-case-imgs figcaption{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);padding:12px 14px;line-height:1.5}
.cp .pg-case-imgs .todo{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;background:var(--paper-2);color:var(--text-3);font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;text-align:center;padding:16px}
@media(max-width:640px){
  .cp .pg-case .grid{grid-template-columns:1fr}
  .cp .pg-case-imgs{grid-template-columns:1fr}
}

.cp .pg-case-imgs--4{grid-template-columns:repeat(2,1fr)}
@media(max-width:640px){.cp .pg-case-imgs--4{grid-template-columns:1fr}}

.cp .pg-case-imgs--2{grid-template-columns:repeat(2,1fr)}
@media(max-width:640px){.cp .pg-case-imgs--2{grid-template-columns:1fr}}

/* Cas cliniques : images carrées, affichées en entier */
.cp .pg-case-imgs img{aspect-ratio:1/1;object-fit:contain;background:var(--paper-2)}

/* Image d'illustration à mi-largeur, affichée en entier */
.cp .pg-body .cp-figure--demi{max-width:50%;margin:26px auto 24px}
.cp .pg-body .cp-figure--demi img{width:100%;height:auto;object-fit:contain}
@media(max-width:640px){.cp .pg-body .cp-figure--demi{max-width:100%}}

/* Bloc image + texte côte à côte (image à gauche) */
.cp .pg-body .cp-media-row{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:clamp(22px,3vw,40px);align-items:start;margin:30px 0 26px}
.cp .pg-body .cp-media-row figure{margin:0;max-width:340px}
.cp .pg-body .cp-media-row img{display:block;width:100%;max-width:340px;height:auto}
.cp .pg-body .cp-media-row figcaption{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-top:12px;line-height:1.6}
.cp .pg-body .cp-media-row .txt p:last-child{margin-bottom:0}
.cp .pg-body .cp-media-row .txt h3{margin-top:0}
@media(max-width:760px){.cp .pg-body .cp-media-row{grid-template-columns:1fr}}

/* ---------- NOS CENTRES : carte + lieux ---------- */
.cp .pg-map{background:var(--paper-2);border:1px solid var(--line);padding:clamp(16px,2vw,26px);margin:26px 0 30px}
.cp .pg-map svg{display:block;width:100%;height:auto}
.cp .pg-map figcaption{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-top:14px;line-height:1.6}
.cp .pg-lieu{border:1px solid var(--line);background:var(--white);margin:0 0 20px}
.cp .pg-lieu > header{background:var(--ink);color:var(--paper);padding:18px 22px;display:grid;grid-template-columns:38px 1fr;gap:16px;align-items:start}
.cp .pg-lieu .num{font-family:var(--mono);font-size:13px;color:var(--ink);background:var(--accent);width:30px;height:30px;display:flex;align-items:center;justify-content:center}
.cp .pg-lieu h3{margin:0 0 4px;font-size:20px;color:var(--paper)}
.cp .pg-lieu .adr{margin:0;font-size:15px;color:var(--steel-2)}
.cp .pg-lieu .body{padding:20px 22px}
.cp .pg-lieu .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin:0 0 12px}
.cp .pg-lieu ul{margin:0 0 16px}
.cp .pg-lieu li{font-size:16px;padding:8px 0 8px 20px}
.cp .pg-lieu li:first-child{border-top:0}
.cp .pg-lieu .go{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--text);border-bottom:1px solid var(--accent);padding-bottom:3px}
@media(max-width:640px){.cp .pg-lieu > header{grid-template-columns:1fr}}

/* ---------- CARTE INTERACTIVE (chargée au clic) ---------- */
.cp .pg-map{padding:0;background:var(--ink);border:1px solid var(--line);overflow:hidden}
.cp .pg-map .facade{position:relative;aspect-ratio:16/10;width:100%;border:0;background:var(--ink);color:var(--paper);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:28px;text-align:center;transition:background .25s ease}
.cp .pg-map .facade:hover{background:var(--ink-2)}
.cp .pg-map .facade .ico{width:54px;height:54px;border:1px solid var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .25s ease}
.cp .pg-map .facade:hover .ico{background:var(--accent)}
.cp .pg-map .facade .ico svg{width:24px;height:24px;stroke:var(--accent);fill:none;stroke-width:1.6;transition:stroke .25s ease}
.cp .pg-map .facade:hover .ico svg{stroke:var(--ink)}
.cp .pg-map .facade .t{font-family:var(--display);font-size:clamp(17px,1.8vw,20px);font-weight:500;color:var(--paper);margin:0}
.cp .pg-map .facade .n{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);margin:0;max-width:46ch;line-height:1.6}
.cp .pg-map #cp-carte{width:100%;aspect-ratio:16/10}
.cp .pg-map .leaflet-container{font-family:var(--body)}
.cp .pg-map figcaption{padding:14px 18px;background:var(--white)}

.cp .cp-pin{background:var(--accent);color:var(--ink);width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:600 13px/1 var(--mono);box-shadow:0 2px 8px rgba(0,20,27,.4)}

/* Carte : habillage sombre */
.cp .leaflet-container{background:var(--ink)}
.cp .leaflet-control-attribution{background:rgba(0,20,27,.78)!important;color:var(--steel)!important;font-size:10px!important}
.cp .leaflet-control-attribution a{color:var(--accent)!important}
.cp .leaflet-popup-content-wrapper,.cp .leaflet-popup-tip{background:var(--ink);color:var(--paper)}
.cp .leaflet-popup-content{font-size:13px;line-height:1.5}
.cp .leaflet-popup-content strong{color:var(--accent)}
.cp .leaflet-bar a{background:var(--ink);color:var(--paper);border-bottom-color:var(--line-dark)}
.cp .leaflet-bar a:hover{background:var(--accent);color:var(--ink)}

/* Voile sombre sur les tuiles : les reperes (z-index 600) restent au-dessus */
.cp .leaflet-container{position:relative}
.cp .leaflet-container::before{content:'';position:absolute;inset:0;background:rgba(0,20,27,.5);z-index:400;pointer-events:none}

/* ---------- FICHES PRATICIENS ---------- */
.cp .pg-medecin{border:1px solid var(--line);background:var(--white);margin:0 0 24px;display:grid;grid-template-columns:200px 1fr;align-items:stretch}
.cp .pg-medecin .photo{background:var(--paper-2);position:relative;overflow:hidden}
.cp .pg-medecin .photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 18%}
.cp .pg-medecin .initiales{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:44px;font-weight:600;color:var(--steel);letter-spacing:.04em;background:var(--ink)}
.cp .pg-medecin .contenu{padding:26px 28px}
.cp .pg-medecin h3{margin:0 0 4px;font-size:23px}
.cp .pg-medecin .role{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin:0 0 18px}
.cp .pg-medecin .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin:20px 0 10px}
.cp .pg-medecin .k:first-of-type{margin-top:0}
.cp .pg-medecin ul{margin:0}
.cp .pg-medecin li{font-size:15.5px;padding:7px 0 7px 20px;line-height:1.5}
.cp .pg-medecin li:first-child{border-top:0}
.cp .pg-medecin .liens{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);display:flex;gap:20px;flex-wrap:wrap}
.cp .pg-medecin .liens a{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--text);border-bottom:1px solid var(--accent);padding-bottom:3px}
@media(max-width:760px){
  .cp .pg-medecin{grid-template-columns:1fr}
  .cp .pg-medecin .photo{aspect-ratio:16/9}
  .cp .pg-medecin .initiales{position:static;aspect-ratio:16/9}
}

/* ---------- ENCART MIS EN AVANT (renvoi vers une autre page) ---------- */
.cp .pg-encart{border:1px solid var(--accent);background:rgba(0,255,204,.07);padding:clamp(24px,3vw,32px);margin:30px 0;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}
.cp .pg-encart .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-3);margin:0 0 10px}
.cp .pg-encart h3{margin:0 0 8px;font-size:clamp(19px,2vw,23px)}
.cp .pg-encart p{margin:0;font-size:15.5px;max-width:52ch}
.cp .pg-encart .btn{background:var(--ink);color:var(--accent);white-space:nowrap}
.cp .pg-encart .btn:hover{background:var(--accent);color:var(--ink)}
@media(max-width:640px){.cp .pg-encart{grid-template-columns:1fr}}

/* ---------- PAGE CONTACT ---------- */
.cp .pg-contact-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,56px);align-items:start;margin:30px 0}
.cp .pg-form-slot{border:1px dashed var(--line);background:var(--paper-2);padding:clamp(26px,3vw,40px);text-align:center;color:var(--text-3);font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;line-height:1.8}
.cp .pg-coord{background:var(--ink);color:var(--paper);padding:clamp(24px,3vw,32px)}
.cp .pg-coord .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 6px}
.cp .pg-coord li{border-top:1px solid var(--line-dark);padding:16px 0;list-style:none}
.cp .pg-coord li:first-child{border-top:0;padding-top:0}
.cp .pg-coord li:before{display:none}
.cp .pg-coord a{color:var(--paper);text-decoration:none;font-size:19px;border:0}
.cp .pg-coord a:hover{color:var(--accent)}
.cp .pg-coord span{font-size:16px;color:var(--steel-2);line-height:1.5;display:block}
.cp .pg-urgence{border-left:3px solid #E2574C;background:rgba(226,87,76,.07);padding:20px 22px;margin:26px 0}
.cp .pg-urgence .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#B3392F;margin:0 0 8px}
.cp .pg-urgence p{margin:0;font-size:16px}
@media(max-width:900px){.cp .pg-contact-grid{grid-template-columns:1fr}}

/* Le sélecteur de langue TranslatePress occupe le coin bas droit :
   on décale les boutons flottants pour ne pas le recouvrir. */
.cp .cp-float{bottom:74px}
@media(max-width:640px){.cp .cp-float{bottom:64px}}

/* =========================================================
   LARGEUR DES PAGES INTERNES
   Dans Divi, les modules Code n'héritent d'aucune largeur
   maximale : les blocs se centrent donc eux-mêmes.
   Indépendant des réglages de la ligne Divi.
   ========================================================= */
.cp .pg-crumb,
.cp .pg-head,
.cp .pg-layout,
.cp .pg-legal,
.cp .pg-contact-grid,
.cp .pg-body{
  max-width:1180px;
  margin-left:auto;
  margin-right:auto;
  padding-left:clamp(20px,4vw,28px);
  padding-right:clamp(20px,4vw,28px);
  box-sizing:border-box;
}
/* la colonne de lecture garde sa mesure à l'intérieur de la grille */
.cp .pg-layout .pg-body{max-width:74ch;padding-left:0;padding-right:0}
.cp .pg-legal{max-width:1180px}

/* =========================================================
   NEUTRALISATION DES CONTENEURS DIVI
   Divi limite ses lignes à 1080 px et ajoute des marges :
   nos blocs se retrouvent plus étroits que prévu. On force
   les conteneurs qui abritent un bloc .cp à s'effacer.
   Le centrage et la largeur sont gérés par notre CSS.
   ========================================================= */
.et_pb_section:has(.cp){padding-top:0;padding-bottom:0}
.et_pb_row:has(.cp){width:100%;max-width:100%;padding:0;margin-left:auto;margin-right:auto}
.et_pb_column:has(.cp){margin-bottom:0}
.et_pb_module:has(.cp),
.et_pb_code:has(.cp){margin-bottom:0}

/* position:sticky ne fonctionne que si aucun parent ne masque
   le débordement : on rétablit la visibilité sur ces conteneurs. */
.et_pb_section:has(.cp),
.et_pb_row:has(.cp),
.et_pb_column:has(.cp),
.et_pb_module:has(.cp){overflow:visible}
.cp,.cp .pg-layout{overflow:visible}

/* =========================================================
   LARGEUR DE LA COLONNE DE LECTURE
   La mesure était exprimée en "ch", unité calculée sur la
   taille de police de l'élément. Divi impose sa propre taille
   de base au conteneur, ce qui rendait la colonne plus
   étroite que prévu. On fixe donc la police du bloc et on
   laisse la grille définir la largeur.
   ========================================================= */
.cp .pg-layout .pg-body{max-width:none;width:100%;font-size:17px}
.cp .pg-body > section{max-width:none}

/* =========================================================
   SCHÉMAS ET ILLUSTRATIONS DANS LES PAGES INTERNES
   Une illustration en pleine largeur de colonne écrase le
   texte : on la borne et on la centre.
   ========================================================= */
.cp .pg-body .cp-figure{max-width:560px;margin-left:auto;margin-right:auto}
.cp .pg-body .cp-figure img{display:block;width:100%;height:auto}
.cp .pg-body .cp-figure figcaption{text-align:center}
/* la variante côte-à-côte garde sa propre largeur */
.cp .pg-body .cp-media-row .cp-figure,
.cp .pg-body .cp-media-row figure{max-width:340px;margin:0}

/* =========================================================
   FORMULAIRE WPFORMS — habillage aux couleurs du site
   ========================================================= */
.cp .cp-form{margin-top:26px}
.cp .cp-form .wpforms-container{margin:0!important;max-width:none}
.cp .cp-form .wpforms-form .wpforms-field{padding:0 0 18px!important}
.cp .cp-form .wpforms-form label.wpforms-field-label{
  font-family:var(--mono)!important;font-size:10.5px!important;letter-spacing:.14em!important;
  text-transform:uppercase!important;color:var(--text-3)!important;font-weight:400!important;margin-bottom:8px!important}
.cp .cp-form .wpforms-form input[type=text],
.cp .cp-form .wpforms-form input[type=email],
.cp .cp-form .wpforms-form input[type=tel],
.cp .cp-form .wpforms-form input[type=number],
.cp .cp-form .wpforms-form input[type=date],
.cp .cp-form .wpforms-form select,
.cp .cp-form .wpforms-form textarea{
  font-family:var(--body)!important;font-size:16px!important;color:var(--text)!important;
  background:var(--white)!important;border:1px solid var(--line)!important;border-radius:0!important;
  padding:13px 15px!important;width:100%!important;max-width:none!important;box-shadow:none!important;
  transition:border-color .2s ease}
.cp .cp-form .wpforms-form input:focus,
.cp .cp-form .wpforms-form select:focus,
.cp .cp-form .wpforms-form textarea:focus{border-color:var(--ink)!important;outline:2px solid var(--accent);outline-offset:-2px}
.cp .cp-form .wpforms-form textarea{min-height:150px!important;line-height:1.6!important}
.cp .cp-form .wpforms-form .wpforms-field-description{
  font-size:13.5px!important;color:var(--text-3)!important;margin-top:8px!important}
.cp .cp-form .wpforms-form .wpforms-field-label-inline{font-size:15px!important;color:var(--text-2)!important}
.cp .cp-form .wpforms-form button[type=submit]{
  background:var(--ink)!important;color:var(--accent)!important;border:0!important;border-radius:0!important;
  font-family:var(--mono)!important;font-size:12px!important;letter-spacing:.12em!important;
  text-transform:uppercase!important;padding:16px 30px!important;cursor:pointer;
  transition:background .2s ease,color .2s ease,transform .2s ease}
.cp .cp-form .wpforms-form button[type=submit]:hover{
  background:var(--accent)!important;color:var(--ink)!important;transform:translateY(-2px)}
.cp .cp-form .wpforms-form .wpforms-required-label{color:var(--accent)!important}
.cp .cp-form .wpforms-form .wpforms-error{
  font-family:var(--body)!important;font-size:13.5px!important;color:#B3392F!important}
.cp .cp-form .wpforms-form input.wpforms-error,
.cp .cp-form .wpforms-form textarea.wpforms-error{border-color:#B3392F!important}
.cp .cp-form .wpforms-confirmation-container-full{
  background:var(--ink)!important;color:var(--paper)!important;border:0!important;padding:26px 28px!important}
.cp .cp-form .wpforms-confirmation-container-full p{color:var(--paper)!important;margin:0!important}

/* =========================================================
   FORMULAIRE MAISON [cp_formulaire]
   ========================================================= */
.cp form.cp-form{margin-top:26px}
.cp .cp-pot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cp .cp-champ{margin:0 0 18px}
.cp .cp-champ label{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:8px}
.cp .cp-champ label span{color:var(--accent)}
.cp .cp-champ input,.cp .cp-champ select,.cp .cp-champ textarea{
  font-family:var(--body);font-size:16px;color:var(--text);background:var(--white);
  border:1px solid var(--line);border-radius:0;padding:13px 15px;width:100%;
  box-sizing:border-box;transition:border-color .2s ease}
.cp .cp-champ select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--text-3) 50%),linear-gradient(135deg,var(--text-3) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:44px}
.cp .cp-champ textarea{line-height:1.6;min-height:150px;resize:vertical}
.cp .cp-champ input:focus,.cp .cp-champ select:focus,.cp .cp-champ textarea:focus{
  border-color:var(--ink);outline:2px solid var(--accent);outline-offset:-2px}
.cp .cp-duo{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.cp form.cp-form .aide{font-size:13.5px;color:var(--text-3);margin:8px 0 0;line-height:1.5}
.cp .cp-case{margin:6px 0 24px}
.cp .cp-case label{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;cursor:pointer}
.cp .cp-case input{width:18px;height:18px;margin-top:3px;accent-color:var(--ink)}
.cp .cp-case span{font-size:14.5px;line-height:1.55;color:var(--text-2)}
.cp .cp-case .req{color:var(--accent)}
.cp form.cp-form button[type=submit]{
  background:var(--ink);color:var(--accent);border:0;border-radius:0;cursor:pointer;
  font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  padding:16px 30px;transition:background .2s ease,color .2s ease,transform .2s ease}
.cp form.cp-form button[type=submit]:hover{background:var(--accent);color:var(--ink);transform:translateY(-2px)}
.cp .cp-form-ok{background:var(--ink);color:var(--paper);padding:clamp(24px,3vw,34px);margin:0 0 26px}
.cp .cp-form-ok .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.cp .cp-form-ok p{color:var(--steel-2);margin:0}
.cp .cp-form-ok a{color:var(--accent);border-bottom:1px solid var(--accent)}
.cp .cp-form-erreur{border-left:3px solid #E2574C;background:rgba(226,87,76,.07);padding:20px 22px;margin:0 0 26px}
.cp .cp-form-erreur .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#B3392F;margin:0 0 8px}
.cp .cp-form-erreur p{margin:0;font-size:15.5px}
@media(max-width:640px){.cp .cp-duo{grid-template-columns:1fr}}

/* Message de confirmation du formulaire */
.cp .cp-form-ok{scroll-margin-top:100px}
.cp .cp-form-ok h3{color:var(--paper);font-size:clamp(20px,2.1vw,25px);margin:0 0 12px}
.cp .cp-form-ok .k{display:flex;align-items:center;gap:8px}
.cp .cp-form-ok .petit{margin-top:18px;padding-top:16px;border-top:1px solid var(--line-dark);font-size:14px}
.cp .cp-form-ok .petit a{color:var(--steel-2);border-bottom:1px solid var(--line-dark)}
.cp .cp-form-ok .petit a:hover{color:var(--accent);border-color:var(--accent)}

/* ---------- BIBLIOGRAPHIE / PRESSE SCIENTIFIQUE ---------- */
.cp .pg-refs{margin:0 0 26px;list-style:none;padding:0}
.cp .pg-refs li{border-top:1px solid var(--line);padding:20px 0 20px 0;position:relative;list-style:none}
.cp .pg-refs li:before{display:none}
.cp .pg-refs .titre{font-family:var(--display);font-size:18px;font-weight:600;color:var(--text);line-height:1.3;margin:0 0 6px;display:block}
.cp .pg-refs .source{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin:0 0 10px}
.cp .pg-refs .apport{font-size:15.5px;color:var(--text-2);line-height:1.6;margin:0}
.cp .pg-refs .lien{display:inline-block;margin-top:10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;color:var(--text);border-bottom:1px solid var(--accent);padding-bottom:2px}
.cp .pg-refs .maison{border-left:3px solid var(--accent);padding-left:20px;background:rgba(0,255,204,.05)}
.cp .pg-refs .maison .source{color:var(--text-2)}

/* =========================================================
   MOBILE — TABLEAUX DES PAGES INTERNES
   Les tableaux comparatifs étaient forcés à 660 px minimum,
   ce qui imposait un défilement horizontal sur téléphone.
   En dessous de 760 px, chaque ligne devient une carte :
   le critère en bandeau, puis une valeur par colonne,
   chacune précédée de son intitulé.
   ========================================================= */
@media(max-width:760px){
  .cp .pg-tablewrap{overflow:visible}
  .cp .pg-tablewrap .pg-table{min-width:0;font-size:15px}
  .cp .pg-table{display:block}
  .cp .pg-table thead{display:none}
  .cp .pg-table tbody{display:block}
  .cp .pg-table tbody tr{display:block;border:1px solid var(--line);background:var(--white);margin:0 0 14px}
  .cp .pg-table tbody tr:nth-child(even) td,
  .cp .pg-table tbody tr:nth-child(even) th{background:transparent}
  .cp .pg-table tbody th{
    display:block;width:auto;background:var(--ink);color:var(--paper);
    font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
    font-weight:400;padding:11px 14px;border:0}
  .cp .pg-table tbody td{
    display:block;padding:12px 14px;border-bottom:1px solid var(--line);line-height:1.5}
  .cp .pg-table tbody td:last-child{border-bottom:0}
  .cp .pg-table tbody td:before{
    content:attr(data-l);display:block;font-family:var(--mono);font-size:10px;
    letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);margin-bottom:5px}
  .cp .pg-table tbody td.hi{background:rgba(0,255,204,.10)}
  .cp .pg-table tbody td.hi:before{color:var(--text-2)}
  .cp .pg-note{margin-top:0}
}

/* =========================================================
   QUESTIONNAIRE IPSS
   ========================================================= */
.cp .cp-ipss{margin-top:26px}
.cp .cp-ipss-intro{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin:0 0 18px}
.cp .cp-q{border:1px solid var(--line);background:var(--white);padding:22px 24px;margin:0 0 16px}
.cp .cp-q legend{font-family:var(--display);font-size:17px;font-weight:500;line-height:1.35;color:var(--text);padding:0;margin-bottom:16px;display:flex;gap:12px;align-items:flex-start}
.cp .cp-q legend .num{font-family:var(--mono);font-size:11px;color:var(--ink);background:var(--accent);width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex:none;margin-top:2px}
.cp .cp-q .choix{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.cp .cp-q .choix-7{grid-template-columns:repeat(7,1fr)}
.cp .cp-q .choix label{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;
  border:1px solid var(--line);padding:12px 6px;cursor:pointer;transition:background .18s ease,border-color .18s ease}
.cp .cp-q .choix label:hover{background:var(--paper-2)}
.cp .cp-q .choix input{position:absolute;opacity:0;width:0;height:0}
.cp .cp-q .choix .v{font-family:var(--display);font-size:20px;font-weight:600;color:var(--text-3);line-height:1}
.cp .cp-q .choix .l{font-size:11.5px;line-height:1.3;color:var(--text-3)}
.cp .cp-q .choix label:has(input:checked){background:var(--ink);border-color:var(--ink)}
.cp .cp-q .choix label:has(input:checked) .v{color:var(--accent)}
.cp .cp-q .choix label:has(input:checked) .l{color:var(--steel-2)}
.cp .cp-q .choix label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}

.cp .cp-ipss-total{background:var(--ink);color:var(--paper);padding:20px 24px;margin:24px 0;
  display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;position:sticky;bottom:0;z-index:5}
.cp .cp-ipss-total .lib{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--steel)}
.cp .cp-ipss-total .val{font-family:var(--display);font-size:30px;font-weight:600;color:var(--paper);line-height:1}
.cp .cp-ipss-total .val #cp-ipss-score{color:var(--accent)}
.cp .cp-ipss-total .niv{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--steel);margin-left:auto}
.cp .cp-ipss-total .niv.n1{color:var(--accent)}
.cp .cp-ipss-total .niv.n2{color:#FFC46B}
.cp .cp-ipss-total .niv.n3{color:#FF8A7A}

.cp .cp-ipss-envoi{border-top:1px solid var(--line);padding-top:28px;margin-top:28px}
.cp .cp-ipss-envoi h3{margin:0 0 6px}

.cp .cp-ipss-resultat{background:var(--ink);color:var(--paper);padding:clamp(28px,3.4vw,40px);scroll-margin-top:100px}
.cp .cp-ipss-resultat .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 16px}
.cp .cp-ipss-resultat .score{font-family:var(--display);font-size:clamp(52px,9vw,84px);font-weight:600;color:var(--accent);line-height:1;letter-spacing:-.03em;margin:0 0 14px}
.cp .cp-ipss-resultat .score span{font-size:22px;color:var(--steel);margin-left:10px;letter-spacing:0}
.cp .cp-ipss-resultat h3{color:var(--paper);font-size:clamp(21px,2.2vw,26px);margin:0 0 10px}
.cp .cp-ipss-resultat p{color:var(--steel-2);margin:0 0 12px;max-width:58ch}
.cp .cp-ipss-resultat .qdv{font-size:15px}
.cp .cp-ipss-resultat .qdv strong{color:var(--paper)}
.cp .cp-ipss-resultat .petit{font-size:14px;margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line-dark)}
.cp .cp-ipss-resultat a{color:var(--accent);border-bottom:1px solid var(--accent)}
.cp form.cp-ipss button[type=submit]{
  background:var(--ink);color:var(--accent);border:0;cursor:pointer;font-family:var(--mono);
  font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:16px 30px;
  transition:background .2s ease,color .2s ease,transform .2s ease}
.cp form.cp-ipss button[type=submit]:hover{background:var(--accent);color:var(--ink);transform:translateY(-2px)}
.cp form.cp-ipss .aide{font-size:13.5px;color:var(--text-3);margin:10px 0 0;line-height:1.5}

@media(max-width:760px){
  .cp .cp-q{padding:18px 16px}
  .cp .cp-q .choix,.cp .cp-q .choix-7{grid-template-columns:1fr}
  .cp .cp-q .choix label{flex-direction:row;justify-content:flex-start;gap:14px;text-align:left;padding:11px 14px}
  .cp .cp-q .choix .v{font-size:16px;width:20px;flex:none}
  .cp .cp-q .choix .l{font-size:14.5px}
  .cp .cp-ipss-total{padding:16px 18px;gap:10px}
  .cp .cp-ipss-total .niv{margin-left:0;width:100%}
}

/* =========================================================
   ARTICLES DE BLOG (Theme Builder Divi)
   Ces règles s'appliquent aux articles, sans avoir à
   toucher aux réglages de chaque module.
   ========================================================= */

/* ---- Titre de l'article (module « Titre de l'article ») ---- */
body.single h1.entry-title,
body.single .et_pb_title_container h1,
body.single .et_pb_post_title .entry-title{
  font-family:var(--display)!important;
  font-weight:600!important;
  font-size:clamp(32px,4.4vw,52px)!important;
  line-height:1.08!important;
  letter-spacing:-.022em!important;
  color:var(--text)!important;
  text-wrap:balance;
  max-width:22ch;
}
body.single .et_pb_title_meta_container,
body.single .et_pb_post_title .et_pb_title_meta_container{
  font-family:var(--mono)!important;
  font-size:11px!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  color:var(--text-3)!important;
}
body.single .et_pb_title_meta_container a{color:var(--text-2)!important;text-decoration:none}

/* ---- Corps de l'article ---- */
body.single .et_pb_post_content h2{font-family:var(--display);font-size:clamp(24px,2.6vw,32px);line-height:1.18;color:var(--text);margin:38px 0 16px}
body.single .et_pb_post_content h3{font-family:var(--display);font-size:20px;color:var(--text);margin:30px 0 10px}
body.single .et_pb_post_content p,
body.single .et_pb_post_content li{font-family:var(--body);font-size:17px;line-height:1.7;color:var(--text-2)}
body.single .et_pb_post_content a{color:var(--text);border-bottom:1px solid var(--accent);text-decoration:none}
body.single .et_pb_post_content strong{color:var(--text);font-weight:600}
body.single .et_pb_post_content blockquote{border-left:2px solid var(--accent);padding-left:24px;font-family:var(--display);font-size:21px;font-weight:500;color:var(--text)}

/* =========================================================
   COLONNE LATÉRALE D'ARTICLES
   À placer dans la colonne étroite d'une ligne 3/4 + 1/4,
   avec un module « Blog » réglé en mode grille.
   Ajouter la classe CSS  cp-sidebar  au module.
   ========================================================= */
.cp-sidebar{position:sticky;top:96px}
.cp-sidebar .et_pb_blog_grid .et_pb_post{
  background:var(--white)!important;border:1px solid var(--line)!important;
  border-radius:0!important;box-shadow:none!important;padding:0!important;margin-bottom:14px!important}
.cp-sidebar .et_pb_blog_grid .et_pb_image_container{margin:0!important}
.cp-sidebar .et_pb_blog_grid .et_pb_image_container img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.cp-sidebar .et_pb_blog_grid .entry-title{
  font-family:var(--display)!important;font-size:16px!important;font-weight:600!important;
  line-height:1.3!important;padding:16px 18px 0!important;margin:0!important}
.cp-sidebar .et_pb_blog_grid .entry-title a{color:var(--text)!important;text-decoration:none}
.cp-sidebar .et_pb_blog_grid .entry-title a:hover{color:var(--text-2)!important}
.cp-sidebar .et_pb_blog_grid .post-meta{
  font-family:var(--mono)!important;font-size:10px!important;letter-spacing:.12em!important;
  text-transform:uppercase!important;color:var(--text-3)!important;padding:8px 18px 16px!important;margin:0!important}
.cp-sidebar .et_pb_blog_grid .post-content{padding:0 18px 16px!important}
.cp-sidebar .et_pb_blog_grid .post-content p{font-size:14.5px!important;line-height:1.5!important;color:var(--text-2)!important;margin:0!important}
.cp-sidebar .et_pb_blog_grid .more-link,
.cp-sidebar .et_pb_blog_grid .more{
  font-family:var(--mono)!important;font-size:10.5px!important;letter-spacing:.1em!important;
  text-transform:uppercase!important;color:var(--text)!important;border-bottom:1px solid var(--accent);
  text-decoration:none;display:inline-block;margin:0 18px 16px}
.cp-sidebar .et_pb_blog_grid .et_pb_post:hover{background:var(--paper-2)!important}

/* Titre de la colonne latérale (module Texte au-dessus) */
.cp-sidebar-titre{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-3);margin:0 0 14px}

@media(max-width:980px){.cp-sidebar{position:static}}

/* =========================================================
   BLOCS DE LIENS POUR WIDGET HTML PERSONNALISÉ
   Deux modèles prêts à coller : .cp-liens (liste simple)
   et .cp-cartes (blocs avec surtitre).
   ========================================================= */
.cp-liens{list-style:none;margin:0;padding:0}
.cp-liens li{list-style:none;padding:12px 0;border-top:1px solid var(--line);margin:0}
.cp-liens li:first-child{border-top:0;padding-top:0}
.cp-liens li:before{display:none}
.cp-liens a{display:block;font-family:var(--display);font-size:15.5px;font-weight:600;line-height:1.35;color:var(--text);text-decoration:none;border:0;transition:color .18s ease}
.cp-liens a:hover{color:var(--text-2)}
.cp-liens .k{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:4px;font-weight:400}

.cp-cartes{display:grid;gap:10px}
.cp-cartes a{display:block;background:var(--white);border:1px solid var(--line);padding:16px 18px;text-decoration:none;transition:background .2s ease,border-color .2s ease}
.cp-cartes a:hover{background:var(--paper-2);border-color:var(--text-3)}
.cp-cartes .k{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:6px}
.cp-cartes b{display:block;font-family:var(--display);font-size:16px;font-weight:600;line-height:1.3;color:var(--text)}
.cp-cartes p{margin:6px 0 0;font-size:13.5px;line-height:1.45;color:var(--text-2)}

/* Encadré contact pour la colonne latérale */
.cp-encart-tel{background:var(--ink);color:var(--paper);padding:22px 20px}
.cp-encart-tel .k{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.cp-encart-tel p{margin:0 0 14px;font-size:15px;line-height:1.5;color:var(--steel-2)}
.cp-encart-tel .tel{display:block;font-family:var(--display);font-size:21px;font-weight:600;color:var(--paper);text-decoration:none;margin-bottom:14px}
.cp-encart-tel .tel:hover{color:var(--accent)}
.cp-encart-tel .btn-mini{display:inline-block;background:var(--accent);color:var(--ink);font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;padding:12px 18px;text-decoration:none;border:0}
.cp-encart-tel .btn-mini:hover{background:var(--paper)}

/* =========================================================
   VARIANTE SOMBRE
   Si vous préférez le widget sur fond pétrole, remplacez
   le bloc ci-dessus par celui-ci — il suffit de retirer les
   commentaires autour.
   =========================================================

#sidebar .widget_recent_entries {
  background: #00141B;
  border-color: #00141B;
}
#sidebar .widget_recent_entries .widgettitle {
  color: #00FFCC !important;
  border-bottom-color: rgba(161, 174, 201, .26) !important;
}
#sidebar .widget_recent_entries li {
  border-bottom-color: rgba(161, 174, 201, .26);
}
#sidebar .widget_recent_entries li a {
  color: #F4F7F6;
}
#sidebar .widget_recent_entries li a:hover {
  color: #00FFCC;
}
#sidebar .widget_recent_entries .post-date {
  color: #A1AEC9;
}

   ========================================================= */

/* ---------- Mobile ---------- */
@media (max-width: 980px) {
  #sidebar {
    position: static;
  }
  #sidebar .widget_recent_entries {
    padding: 20px 18px 6px;
  }
}


/* =========================================================
   BARRE LATÉRALE DES ARTICLES — Centre de la Prostate
   ---------------------------------------------------------
   Remplace les règles précédentes de sidebar.
   À coller dans Divi → Options du thème → CSS personnalisé,
   ou à la fin de assets/css/01-composants.css
   ========================================================= */

/* ---------------------------------------------------------
   1. LA COLONNE
   --------------------------------------------------------- */
#sidebar {
  position: sticky;
  top: 96px;
}

/* ---------------------------------------------------------
   2. CHAQUE WIDGET : une seule carte, un seul cadre
   --------------------------------------------------------- */
#sidebar .et_pb_widget {
  background: #FFFFFF;
  border: 1px solid rgba(0, 20, 27, .14);
  padding: 22px 20px;
  margin: 0 0 16px !important;
  float: none;
  width: auto;
  box-sizing: border-box;
}

#sidebar .et_pb_widget:last-child {
  margin-bottom: 0 !important;
}

/* ---------------------------------------------------------
   3. TITRE DE WIDGET, avec le filet menthe
   --------------------------------------------------------- */
#sidebar .et_pb_widget .widgettitle,
#sidebar .et_pb_widget h4 {
  font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
  font-size: 10.5px !important;
  font-weight: 400 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  color: #587278 !important;
  margin: 0 0 16px !important;
  padding: 0 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(0, 20, 27, .14) !important;
  background: none !important;
  position: relative;
  line-height: 1.4 !important;
}

#sidebar .et_pb_widget .widgettitle::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 32px;
  height: 2px;
  background: #00FFCC;
}

/* ---------------------------------------------------------
   4. BLOC « DERNIERS ARTICLES »
   Le cadre est porté par le widget : le bloc lui-même
   ne doit ni border ni fond, sinon double encadrement.
   --------------------------------------------------------- */
#sidebar .cp-articles,
#sidebar .wp-block-latest-posts {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  list-style: none !important;
}

#sidebar .cp-articles li,
#sidebar .wp-block-latest-posts li {
  list-style: none !important;
  margin: 0 !important;
  padding: 14px 0 !important;
  border-bottom: 1px solid rgba(0, 20, 27, .14);
  position: relative;
  transition: padding-left .22s ease;
}

#sidebar .cp-articles li:first-child,
#sidebar .wp-block-latest-posts li:first-child {
  padding-top: 0 !important;
}

#sidebar .cp-articles li:last-child,
#sidebar .wp-block-latest-posts li:last-child {
  border-bottom: 0;
  padding-bottom: 0 !important;
}

#sidebar .cp-articles li::before,
#sidebar .wp-block-latest-posts li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 22px;
  width: 0;
  height: 1px;
  background: #00FFCC;
  transition: width .22s ease;
}

#sidebar .cp-articles li:first-child::before,
#sidebar .wp-block-latest-posts li:first-child::before {
  top: 8px;
}

#sidebar .cp-articles li:hover,
#sidebar .wp-block-latest-posts li:hover {
  padding-left: 18px !important;
}

#sidebar .cp-articles li:hover::before,
#sidebar .wp-block-latest-posts li:hover::before {
  width: 11px;
}

/* Titre de l'article */
#sidebar .wp-block-latest-posts__post-title {
  display: block;
  font-family: 'Epilogue', Georgia, serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -.01em;
  color: #00141B !important;
  text-decoration: none !important;
  border: 0 !important;
  transition: color .18s ease;
  text-wrap: balance;
}

#sidebar .wp-block-latest-posts__post-title:hover {
  color: #2E4A50 !important;
}

/* L'auteur est masqué : il est identique partout,
   il n'apporte rien et alourdit la colonne. */
#sidebar .wp-block-latest-posts__post-author {
  display: none !important;
}

/* La date, discrète */
#sidebar .wp-block-latest-posts__post-date {
  display: block;
  font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
  font-size: 9.5px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: #587278 !important;
  margin-top: 6px !important;
}

#sidebar .wp-block-latest-posts__post-excerpt {
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  color: #2E4A50 !important;
  margin: 7px 0 0 !important;
}

#sidebar .wp-block-latest-posts__featured-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  margin-bottom: 10px;
}

/* ---------------------------------------------------------
   5. LE CHAMP DE RECHERCHE
   --------------------------------------------------------- */
#sidebar .widget_search form,
#sidebar .wp-block-search__inside-wrapper {
  display: flex;
  gap: 0;
  border: 1px solid rgba(0, 20, 27, .14);
  background: #FFFFFF;
}

#sidebar .widget_search input[type=text],
#sidebar .widget_search input[type=search],
#sidebar .wp-block-search__input {
  flex: 1;
  min-width: 0;
  font-family: 'Instrument Sans', system-ui, sans-serif !important;
  font-size: 14.5px !important;
  color: #00141B !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
  outline: 0;
}

#sidebar .widget_search input[type=search]::placeholder,
#sidebar .wp-block-search__input::placeholder {
  color: #587278;
}

#sidebar .widget_search input[type=submit],
#sidebar .widget_search button,
#sidebar .wp-block-search__button {
  background: #00141B !important;
  color: #00FFCC !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-family: 'IBM Plex Mono', ui-monospace, monospace !important;
  font-size: 10.5px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  padding: 12px 18px !important;
  margin: 0 !important;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}

#sidebar .widget_search input[type=submit]:hover,
#sidebar .widget_search button:hover,
#sidebar .wp-block-search__button:hover {
  background: #00FFCC !important;
  color: #00141B !important;
}

#sidebar .widget_search form:focus-within,
#sidebar .wp-block-search__inside-wrapper:focus-within {
  border-color: #00141B;
  outline: 2px solid #00FFCC;
  outline-offset: -2px;
}

/* ---------------------------------------------------------
   6. LISTES GÉNÉRIQUES (catégories, archives…)
   --------------------------------------------------------- */
#sidebar .et_pb_widget:not(.widget_search) ul li a {
  font-family: 'Instrument Sans', system-ui, sans-serif;
  font-size: 15px;
  color: #00141B;
  text-decoration: none;
  border: 0;
}

#sidebar .et_pb_widget:not(.widget_search) ul li a:hover {
  color: #2E4A50;
}

/* ---------------------------------------------------------
   7. MOBILE
   --------------------------------------------------------- */
@media (max-width: 980px) {
  #sidebar {
    position: static;
    margin-top: 40px;
  }
  #sidebar .et_pb_widget {
    padding: 20px 18px;
  }
}

/* =========================================================
   CORRECTIF — le cadre du widget ne suivait pas la liste
   ---------------------------------------------------------
   Deux causes cumulées :
   1. Divi fait flotter ses widgets, la carte ne grandissait
      donc pas avec son contenu.
   2. Le bloc « Derniers articles » en mode grille sort du
      flux normal : on le repasse en liste verticale.
   ========================================================= */
#sidebar .et_pb_widget{
  float:none!important;
  display:flow-root!important;   /* la carte englobe tout son contenu */
  overflow:visible;
  height:auto!important;
  min-height:0!important;
}
#sidebar .et_pb_widget::after{
  content:"";display:table;clear:both;
}

/* Le bloc « Derniers articles » repasse en liste simple,
   même si le mode grille a été coché dans l'éditeur. */
#sidebar .wp-block-latest-posts.is-grid,
#sidebar .wp-block-latest-posts{
  display:block!important;
  flex-wrap:nowrap!important;
  column-count:1!important;
  margin:0!important;
  padding:0!important;
  width:100%!important;
}
#sidebar .wp-block-latest-posts.is-grid li,
#sidebar .wp-block-latest-posts li{
  width:100%!important;
  max-width:100%!important;
  float:none!important;
  display:block!important;
  margin:0!important;
}

/* Le titre du premier article chevauchait le filet du cadre */
#sidebar .et_pb_widget .wp-block-latest-posts{
  margin-top:0!important;
}

/* =========================================================
   IPSS — ALERTE SCORE SÉVÈRE, ERREUR, FENÊTRE DE CONFIRMATION
   ========================================================= */
.cp .cp-ipss-alerte{border-left:3px solid #E2574C;background:rgba(226,87,76,.08);padding:18px 22px;margin:0 0 24px}
.cp .cp-ipss-alerte .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#B3392F;margin:0 0 8px}
.cp .cp-ipss-alerte p{margin:0;font-size:15.5px;line-height:1.55;color:var(--text-2)}
.cp .cp-ipss-alerte a{color:var(--text);border-bottom:1px solid #E2574C}

.cp .cp-ipss-erreur{color:#B3392F;font-size:14.5px;line-height:1.5;margin:12px 0 0}

.cp .cp-ipss-modal{position:fixed;inset:0;background:rgba(0,20,27,.62);display:flex;align-items:center;justify-content:center;z-index:9999;padding:20px;animation:cp-modal-in .2s ease both}
.cp .cp-ipss-modal[hidden]{display:none}
@keyframes cp-modal-in{from{opacity:0}to{opacity:1}}
.cp .cp-ipss-modal .carte{background:var(--ink);color:var(--paper);max-width:460px;width:100%;padding:clamp(28px,3.4vw,38px);position:relative}
.cp .cp-ipss-modal .fermer{position:absolute;top:10px;right:14px;background:none;border:0;font-size:30px;line-height:1;cursor:pointer;color:var(--steel);padding:4px 8px}
.cp .cp-ipss-modal .fermer:hover{color:var(--accent)}
.cp .cp-ipss-modal .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
.cp .cp-ipss-modal .score{font-family:var(--display);font-size:clamp(46px,8vw,68px);font-weight:600;color:var(--accent);line-height:1;letter-spacing:-.03em;margin:0 0 12px}
.cp .cp-ipss-modal .score span{font-size:20px;color:var(--steel);margin-left:10px;letter-spacing:0}
.cp .cp-ipss-modal h3{color:var(--paper);font-size:clamp(19px,2vw,23px);margin:0 0 10px}
.cp .cp-ipss-modal p{color:var(--steel-2);margin:0 0 12px;font-size:15.5px;line-height:1.6}
.cp .cp-ipss-modal .petit{font-size:14px;margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line-dark)}
@media(max-width:640px){.cp .cp-ipss-modal .carte{padding:26px 22px}}

/* Chapeau court au-dessus du questionnaire */
.cp .cp-ipss-chapeau{font-size:16.5px;color:var(--text-2);margin:0 0 6px;line-height:1.6}

/* =========================================================
   RYTHME VERTICAL DES PAGES EN MODULES SÉPARÉS
   Chaque module Code produit un bloc .cp indépendant :
   sans ces règles, ils se collent ou se chevauchent.
   ========================================================= */
.cp > .pg-body{
  padding-top:clamp(34px,4vw,52px);
  padding-bottom:clamp(34px,4vw,52px);
}
/* filet de séparation entre les grands titres d'un même bloc */
.cp > .pg-body > h2{
  padding-top:clamp(30px,3.5vw,46px);
  margin-top:clamp(30px,3.5vw,46px);
  border-top:1px solid var(--line);
  scroll-margin-top:100px;
}
.cp > .pg-body > h2:first-child{padding-top:0;margin-top:0;border-top:0}
/* le questionnaire n'a pas de filet au-dessus : il suit l'en-tête */
.cp > .pg-body#ipss{padding-top:clamp(28px,3.2vw,40px)}
.cp .pg-legal{margin-top:0;padding-top:26px}

/* --- Questionnaire : respiration interne --- */
.cp .cp-ipss-chapeau{margin:0 0 22px}
.cp form.cp-ipss{margin-top:0}
.cp .cp-q{margin-bottom:14px}
.cp .cp-q:last-of-type{margin-bottom:0}
.cp .cp-ipss-total{margin:26px 0 22px}
.cp .cp-ipss-alerte{margin:0 0 22px}
.cp .cp-q-qdv{margin-top:0}
.cp .cp-ipss-envoi{margin-top:34px;padding-top:32px}
.cp form.cp-ipss button[type=submit]{margin-top:6px}

/* --- Encadrés et listes : espacements homogènes --- */
.cp .pg-body > ul,
.cp .pg-body > ol{margin-bottom:26px}
.cp .pg-body > p + h3{margin-top:32px}
.cp .pg-encart{margin:34px 0}
.cp .pg-cta{margin:34px 0}
.cp .pg-body > details:first-of-type{margin-top:6px}
.cp .pg-body > h3{margin-top:34px}
.cp .pg-related{margin-top:22px;margin-bottom:6px}

/* Chapeau de présentation au-dessus du H1 */
@media(max-width:640px){}

/* Bloc parcours dans le cadran pionnier */

/* Le chapeau adopte la typographie du texte d'introduction */

/* Chapeau du hero : mêmes police et corps que .lead, avec un filet */
.cp .hero-intro{max-width:52ch;margin:0 0 26px;padding-left:18px;border-left:2px solid var(--accent)}
.cp .hero-intro strong{color:var(--text);font-weight:600}
@media(max-width:640px){.cp .hero-intro{padding-left:14px;margin-bottom:20px}}

/* Bloc parcours dans le cadran pionnier */
.cp .pioneer-parcours{margin-top:22px;padding-top:22px;border-top:1px solid var(--line-dark)}
.cp .pioneer-parcours .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.cp .pioneer-parcours .s{font-size:14.5px;line-height:1.55;color:var(--steel-2);margin:0 0 18px}
.cp .pioneer-parcours .liens{display:flex;flex-direction:column;gap:10px}
.cp .pioneer-parcours .liens a{display:flex;align-items:center;justify-content:space-between;gap:12px;
  width:100%;box-sizing:border-box;background:transparent;border:1px solid var(--accent);
  color:var(--accent);text-decoration:none;padding:15px 18px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  transition:background .22s ease,color .22s ease,transform .22s ease}
.cp .pioneer-parcours .liens a:after{content:"→";font-size:14px;transition:transform .22s ease}
.cp .pioneer-parcours .liens a:hover{background:var(--accent);color:var(--ink);transform:translateY(-2px)}
.cp .pioneer-parcours .liens a:hover:after{transform:translateX(3px)}

/* Boutons parcours : libellé + précision sur deux lignes */
.cp .pioneer-parcours .liens a{align-items:center;padding:14px 18px}
.cp .pioneer-parcours .liens a span{display:flex;flex-direction:column;gap:5px;text-align:left}
.cp .pioneer-parcours .liens a b{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;line-height:1.2}
.cp .pioneer-parcours .liens a i{font-family:var(--body);font-size:13px;font-style:normal;letter-spacing:0;text-transform:none;line-height:1.35;color:var(--steel-2)}
.cp .pioneer-parcours .liens a:hover i{color:rgba(0,20,27,.72)}