/* ══════════════════════════════════════════════════════════════════
   DA IMeD v4 — « Méditerranée médicale » modernisée (actée le 12/08)
   GABARIT PATHOLOGIE (première déclinaison, servira aux 8 pages).
   Page « Demander une télé-expertise » (chantier B, 12/09/2026) :
   page pédagogique + formulaire de dépôt en 10 étapes, mode
   simulation (dossier JSON + pièces), connecteur API à régler.
   ══════════════════════════════════════════════════════════════════ */
/* figtree latin-ext (couverture œ) */
:root {
  --creme:#fbf9f5; --encre:#1e2831; --mer:#0f4c6b; --mer-fonce:#0b3a52;
  --azur:#2485ba; --azur-fonce:#17678f; --marron:#39040e; --creme-rose:#f2e5d9;
  --ciel:#eaf3f8; --bord:rgba(30,40,49,.11);
  --titres:'Manrope', 'Trebuchet MS', sans-serif;
  --sans:'Figtree', 'Trebuchet MS', sans-serif;
  --aube:radial-gradient(900px 620px at 86% 104%, rgba(242,229,217,.65) 0%, rgba(242,229,217,0) 58%),
         radial-gradient(1100px 700px at 8% -12%, #0b3a52 0%, rgba(11,58,82,0) 68%),
         linear-gradient(148deg, #0f4c6b 0%, #15618b 44%, #2485ba 76%, #6fb0d3 100%);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--sans); font-size:17.5px; line-height:1.7; color:var(--encre); background:var(--creme); }
img { max-width:100%; display:block; }
a { color:var(--azur-fonce); }
a:focus-visible, button:focus-visible { outline:3px solid var(--azur); outline-offset:3px; border-radius:6px; }
.wrap { max-width:1120px; margin:0 auto; padding:0 26px; }

/* ---------- Étiquettes de relecture (outillage maquette, hors DA) ---------- */
.bdg { display:none; font-family:var(--sans); font-size:11px; font-weight:700; line-height:1; text-transform:uppercase; letter-spacing:.5px; padding:4px 9px; border-radius:11px; vertical-align:middle; margin-left:8px; white-space:nowrap; }
.bdg-keep { background:#dceadd; color:#20522c; }
.bdg-new  { background:#fbe8cc; color:#8a4a06; }
body.sans-badges .bdg, body.sans-badges .dot-new { display:none; }
.dot-new { display:none; color:#d98a1f; font-size:12px; line-height:1; }
#relecture-pill { display:none; position:fixed; right:18px; bottom:18px; z-index:99; background:var(--encre); color:#fff; border:0; font:700 13px/1 var(--sans); padding:12px 17px; border-radius:24px; cursor:pointer; box-shadow:0 4px 14px rgba(30,40,49,.35); }

/* ---------- Kickers, titres ---------- */
.kicker { font:700 13px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.17em; color:var(--azur-fonce); }
h2.titre { font:800 clamp(26px,3vw,34px)/1.2 var(--titres); color:var(--mer); margin-top:12px; text-wrap:balance; letter-spacing:-.01em; }
.intro { margin-top:16px; font-size:18.5px; }
.sous-titre { margin-top:52px; font:800 clamp(20px,2.2vw,24px)/1.3 var(--titres); color:var(--mer); letter-spacing:-.01em; }

/* ---------- Header flottant (verre dépoli) ---------- */
.header-zone { position:fixed; top:0; left:0; right:0; z-index:60; padding:14px 0; }
.header-zone .wrap { max-width:1150px; }
.barre { display:flex; align-items:center; justify-content:space-between; gap:16px; background:rgba(251,249,245,.72); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border:1px solid rgba(255,255,255,.55); box-shadow:0 8px 32px rgba(15,76,107,.10); border-radius:999px; padding:10px 12px 10px 22px; }
.logo img { width:118px; height:auto; }
nav.main > ul { list-style:none; display:flex; align-items:center; gap:10px; }
nav.main > ul > li { position:relative; }
nav.main > ul > li > a { display:block; padding:10px 11px; color:var(--encre); text-decoration:none; font-size:16.5px; font-weight:600; white-space:nowrap; border-radius:999px; transition:color .15s, background .15s; }
nav.main > ul > li:hover > a, nav.main > ul > li:focus-within > a { color:var(--mer); background:rgba(36,133,186,.10); }
/* Pont invisible : comble les 10px entre l'onglet et sa liste pour que
   le survol ne se perde pas en descendant (bug signalé le 18/08) */
.sub::before { content:""; position:absolute; left:-8px; right:-8px; top:-14px; height:14px; }
.sub { position:absolute; top:calc(100% + 10px); left:0; background:rgba(251,249,245,.92); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); list-style:none; min-width:312px; padding:10px; display:none; border-radius:18px; border:1px solid rgba(255,255,255,.6); box-shadow:0 20px 44px rgba(15,76,107,.16); }
nav.main li:hover .sub, nav.main li:focus-within .sub { display:block; }
.sub a { display:block; color:var(--encre); text-decoration:none; font-size:16px; font-weight:400; padding:9px 14px; border-radius:11px; }
.sub a:hover, .sub a:focus-visible { background:rgba(36,133,186,.12); color:var(--mer); }
.sub a[aria-current="page"] { font-weight:700; color:var(--mer); background:rgba(36,133,186,.10); }
.pill { display:inline-block; font:700 16.5px/1.2 var(--titres); text-decoration:none; padding:13px 26px; border-radius:999px; text-align:center; white-space:nowrap; transition:background .15s, color .15s, border-color .15s; }
.barre .pill { font-size:15px; padding:12px 20px; }
.pill-mer { background:var(--mer); color:#fff; border:2px solid var(--mer); }
.pill-mer:hover { background:var(--mer-fonce); border-color:var(--mer-fonce); }
.pill-ghost { background:transparent; color:var(--marron); border:2px solid var(--marron); }
.pill-ghost:hover { background:var(--marron); color:var(--creme-rose); }
.pill-blanc { background:#fff; color:var(--mer); border:2px solid #fff; }
.pill-blanc:hover { background:var(--ciel); border-color:var(--ciel); }
.pill-marron { background:transparent; color:var(--marron); border:2px solid var(--marron); }
.pill-marron:hover { background:var(--marron); color:var(--creme-rose); }
#burger { display:none; background:none; border:2px solid var(--marron); color:var(--marron); font:700 15px var(--titres); padding:8px 14px; border-radius:999px; cursor:pointer; }

/* ---------- En-tête de page : bandeau aube + barre d'actions ---------- */
.entete-page { position:relative; overflow:hidden; background:var(--aube); border-radius:0 0 34px 34px; padding:158px 0 92px; }
.fil { display:inline-flex; align-items:center; gap:10px; background:rgba(255,255,255,.14); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.3); border-radius:999px; padding:9px 18px; font:600 13.5px/1.2 var(--sans); color:rgba(255,255,255,.92); }
.fil a { color:#fff; text-decoration:none; font-weight:700; }
.fil a:hover { text-decoration:underline; text-underline-offset:3px; }
.fil .sep { opacity:.55; }
.entete-page h1 { font:800 clamp(34px,4.2vw,50px)/1.12 var(--titres); color:#fff; margin-top:30px; max-width:1020px; text-wrap:balance; letter-spacing:-.015em; }
.entete-page .intro { color:rgba(255,255,255,.95); font-weight:600; margin-top:16px; max-width:920px; font-size:19px; }
.barre-actions { position:relative; z-index:5; margin-top:-40px; }
.barre-actions .inner { display:flex; align-items:center; gap:16px; flex-wrap:wrap; background:rgba(251,249,245,.78); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border:1px solid rgba(255,255,255,.6); box-shadow:0 18px 44px rgba(15,76,107,.14); border-radius:26px; padding:16px 20px; }
.barre-actions .note { margin-left:auto; flex:1 1 260px; text-align:right; font-size:15px; line-height:1.45; color:rgba(30,40,49,.72); padding-right:6px; }

/* ---------- Sections ---------- */
section.bloc { padding:76px 0; }

/* ---------- Qu'est-ce que : texte + photo pleine hauteur ---------- */
.deux-col { display:grid; grid-template-columns:1.05fr .8fr; gap:60px; align-items:stretch; }
.deux-col .texte p { margin-top:14px; }
.deux-col .texte p:first-of-type { margin-top:22px; }
.carte-photo { margin:0; position:relative; min-height:420px; }
.carte-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:24px; border:1px solid var(--bord); box-shadow:0 24px 54px rgba(15,76,107,.14); }

/* ---------- Cartes dégradé ciel (symptômes, prévention, traitements) ---------- */
.grille-cartes { margin-top:34px; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.carte-c { background:linear-gradient(165deg, #ffffff 0%, var(--ciel) 130%); border:1px solid rgba(36,133,186,.20); border-radius:22px; padding:26px 28px 24px; display:flex; flex-direction:column; }
.carte-c h3 { font:800 18.5px/1.35 var(--titres); color:var(--mer); letter-spacing:-.01em; }
.carte-c h3 + p { margin-top:8px; }
.carte-c p { font-size:16.5px; line-height:1.6; }
.carte-c p strong { font-family:var(--titres); font-weight:700; color:var(--mer); }
.carte-c .porte-liens { margin-top:auto; }
.apres-cartes { margin-top:22px; }
.porte-liens { padding-top:18px; display:flex; flex-wrap:wrap; gap:10px; }
.porte-liens a { display:inline-block; background:rgba(36,133,186,.10); border:1px solid rgba(36,133,186,.28); color:var(--azur-fonce); border-radius:999px; padding:8px 16px; font:600 15px/1.3 var(--sans); text-decoration:none; transition:background .15s, color .15s, border-color .15s; }
.porte-liens a:hover, .porte-liens a:focus-visible { background:var(--mer); border-color:var(--mer); color:#fff; }
.porte-liens .dot-new { margin-left:4px; }

/* ---------- Syndrome de la queue de cheval : carte sombre ---------- */
.alerte { margin-top:26px; border-radius:26px; overflow:hidden; padding:38px 44px 34px;
  background:
    radial-gradient(720px 460px at 90% -10%, rgba(36,133,186,.42) 0%, rgba(36,133,186,0) 62%),
    radial-gradient(560px 400px at -4% 108%, rgba(242,229,217,.16) 0%, rgba(242,229,217,0) 60%),
    linear-gradient(148deg, var(--mer-fonce) 0%, var(--mer) 58%, #155f88 100%); }
.alerte h3 { font:800 20px/1.35 var(--titres); color:#fff; letter-spacing:-.01em; }
.alerte p { margin-top:10px; color:rgba(255,255,255,.94); font-size:16.5px; line-height:1.65; }
.alerte .porte-liens a { background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.4); color:#fff; }
.alerte .porte-liens a:hover, .alerte .porte-liens a:focus-visible { background:#fff; border-color:#fff; color:var(--mer); }

/* ---------- Quand opérer : cartes empilées ---------- */
.cas { margin-top:30px; display:grid; gap:16px; }
.cas-carte { background:#fff; border:1px solid var(--bord); border-radius:22px; padding:28px 32px 26px; }
.cas-carte h3 { font:800 19px/1.4 var(--titres); color:var(--mer); letter-spacing:-.01em; }
.cas-carte p { margin-top:10px; font-size:16.5px; line-height:1.65; }

/* ---------- Accordéons (examens, FAQ) ---------- */
.faq-cadre { margin-top:26px; background:#fff; border:1px solid var(--bord); border-radius:22px; padding:10px 30px; }
details.acc { border-bottom:1px solid var(--bord); }
details.acc:last-child { border-bottom:0; }
details.acc summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:14px; padding:17px 2px; font:700 17px/1.4 var(--titres); color:var(--mer); }
details.acc summary::-webkit-details-marker { display:none; }
details.acc summary::after { content:"+"; font:700 20px/1 var(--titres); color:var(--azur-fonce); flex-shrink:0; }
details.acc[open] summary::after { content:"\2212"; }
details.acc .contenu { padding:0 2px 20px; font-size:16.5px; }
details.acc .contenu p { margin-top:10px; }
details.acc .contenu p:first-child { margin-top:0; }
details.acc .contenu ul { list-style:none; margin-top:10px; }
details.acc .contenu li { position:relative; padding:5px 0 5px 22px; }
details.acc .contenu li::before { content:""; position:absolute; left:2px; top:1em; width:7px; height:7px; border-radius:50%; background:var(--azur); }
details.acc .contenu .porte-liens { padding-top:6px; padding-bottom:16px; }
.faq-tete { text-align:center; }
.faq-tete .kicker { display:block; }
.faq-bloc { margin:0 auto; }

/* ---------- Pour aller plus loin : carte article ---------- */
.article-carte { margin-top:30px; background:var(--ciel); border:1px solid rgba(36,133,186,.20); border-radius:22px; padding:26px 32px; }
.article-carte p { font-size:16.5px; line-height:1.65; }

/* ---------- Votre parcours : 2 portes ---------- */
.portes { margin-top:38px; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.porte { background:linear-gradient(165deg, #ffffff 0%, var(--ciel) 130%); border:1px solid rgba(36,133,186,.20); border-radius:22px; padding:30px 30px 26px; display:flex; flex-direction:column; }
.porte h3 { font:800 21.5px/1.3 var(--titres); color:var(--mer); letter-spacing:-.01em; }
.porte p { margin-top:10px; font-size:16.5px; line-height:1.6; }
.porte .porte-liens { margin-top:auto; }

/* ---------- Pour aller plus loin : pilules marron ---------- */
.liens-suite { margin-top:56px; text-align:center; }
.liens-suite .kicker { display:block; }
.liens-suite .pills { margin-top:18px; display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.liens-suite .pill { font-size:15.5px; padding:12px 22px; }

/* ---------- Prendre rendez-vous : panneau aube ---------- */
.rdv-panneau { border-radius:30px; overflow:hidden; display:grid; grid-template-columns:1.08fr .92fr; background:var(--aube); }
.rdv-info { padding:60px 52px; color:#fff; }
.rdv-info .kicker { color:var(--creme-rose); }
.rdv-info h2 { font:800 clamp(27px,2.9vw,34px)/1.2 var(--titres); color:#fff; margin-top:12px; letter-spacing:-.01em; }
.rdv-info .doctolib { margin-top:10px; font-size:18px; color:rgba(255,255,255,.92); }
.rdv-info .pill { margin-top:26px; font-size:17.5px; padding:15px 30px; }
.tel-big { display:inline-block; margin-top:28px; color:#fff; font:800 clamp(27px,2.9vw,34px)/1.1 var(--titres); letter-spacing:.02em; text-decoration:none; }
.tel-big:hover { color:var(--creme-rose); }
.rdv-adr { margin-top:8px; font-size:19.5px; color:rgba(255,255,255,.92); }
.rdv-pmr { margin-top:10px; font-size:15px; color:#fff; white-space:nowrap; margin-right:-46px; position:relative; z-index:1; }
.horaires { margin-top:24px; background:rgba(255,255,255,.14); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.3); border-radius:16px; padding:18px 26px; display:inline-block; }
.horaires h3 { font:700 12.5px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.15em; color:var(--creme-rose); }
.horaires ul { list-style:none; margin-top:6px; font-size:16.5px; color:rgba(255,255,255,.96); }
.horaires li { padding:2px 0; }
.rdv-photo { position:relative; min-height:420px; }
.rdv-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* ---------- Footer sombre ---------- */
footer.site { position:relative; overflow:hidden; margin-top:96px; padding:56px 0 28px; border-radius:34px 34px 0 0;
  background:
    radial-gradient(760px 480px at 92% -14%, rgba(36,133,186,.4) 0%, rgba(36,133,186,0) 62%),
    radial-gradient(520px 380px at -6% 112%, rgba(242,229,217,.13) 0%, rgba(242,229,217,0) 58%),
    linear-gradient(155deg, var(--mer-fonce) 0%, var(--mer) 62%, #135a80 100%); }
footer.site .haut { display:grid; grid-template-columns:1.25fr 1.1fr 1.1fr 1.9fr; gap:34px; align-items:start; }
footer.site .duo-cols { display:grid; grid-template-columns:1fr .9fr; gap:34px; align-items:start; }
footer.site .entete { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; flex-wrap:wrap; padding-bottom:30px; margin-bottom:44px; border-bottom:1px solid rgba(255,255,255,.16); }
footer.site .entete .pill { background:#fff; color:var(--mer-fonce); border:2px solid #fff; font-size:16.5px; }
footer.site .entete .pill:hover { background:var(--creme-rose); border-color:var(--creme-rose); color:var(--mer-fonce); text-decoration:none; }
.logo-foot img { width:128px; height:auto; }
footer.site .adr { margin-top:16px; font-size:16px; color:rgba(255,255,255,.72); }
footer.site h4 { font:700 12.5px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.15em; color:#a9d6ec; }
footer.site ul { list-style:none; margin-top:10px; }
footer.site li { padding:4px 0; }
footer.site a { color:rgba(255,255,255,.88); text-decoration:none; font-size:15.5px; }
footer.site li a { line-height:1.35; display:inline-block; }
footer.site a:hover { color:#fff; text-decoration:underline; text-underline-offset:3px; }
footer.site .tel-foot { font:800 21px/1.2 var(--titres); }
.contact-verre { margin:14px 0 0 -22px; background:rgba(255,255,255,.09); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1px solid rgba(255,255,255,.22); border-radius:18px; padding:18px 22px; display:flex; flex-direction:column; align-items:flex-start; gap:19px; }
footer.site .contact-verre .adr { margin-top:0; color:#fff; font-weight:600; font-size:18px; line-height:1.28; }
footer.site .contact-verre a { color:#fff; font-weight:600; }
footer.site .contact-verre .tel-foot { font-weight:800; }
footer.site .contact-verre .itin-foot { margin-top:-9px; font-size:13.5px; font-weight:700; color:#fff; }
footer.site .linkedin-verre { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:32px; background:rgba(255,255,255,.09); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border:1px solid rgba(255,255,255,.22); border-radius:16px; padding:20px 24px; color:#fff; font:700 16.5px/1.3 var(--titres); text-decoration:none; }
footer.site .linkedin-verre svg { width:22px; height:22px; flex-shrink:0; }
footer.site .linkedin-verre span::after { content:" \2192"; }
footer.site .linkedin-verre:hover { background:rgba(255,255,255,.17); text-decoration:none; color:#fff; }
.fin { margin-top:44px; padding-top:20px; border-top:1px solid rgba(255,255,255,.16); font-size:14px; color:rgba(255,255,255,.55); text-align:center; }
.fin a { font-size:14px; color:rgba(255,255,255,.7); text-decoration:underline; }

/* ---------- Apparitions au défilement ---------- */
@media (prefers-reduced-motion: no-preference) {
  body.js [data-rev] { opacity:0; transform:translateY(18px); transition:opacity .55s ease, transform .55s ease; }
  body.js [data-rev].vu { opacity:1; transform:none; }
}

/* ---------- Responsive ---------- */
@media (max-width:1180px) {
  nav.main > ul > li > a { padding:10px 7px; font-size:15.5px; }
  nav.main > ul { gap:2px; }
  .barre .pill { font-size:14.5px; padding:11px 16px; }
}
@media (max-width:900px) {
  #burger { display:block; }
  nav.main { display:none; position:absolute; top:calc(100% + 8px); left:26px; right:26px; background:rgba(251,249,245,.97); backdrop-filter:blur(14px); border:1px solid rgba(255,255,255,.6); border-radius:22px; box-shadow:0 20px 40px rgba(15,76,107,.16); }
  nav.main.ouvert { display:block; }
  nav.main > ul { flex-direction:column; align-items:stretch; padding:12px 16px 16px; gap:0; }
  .sub { position:static; display:none; box-shadow:none; border:0; background:transparent; backdrop-filter:none; padding:0 0 6px 14px; min-width:0; }
  .sub::before { content:none; }
  nav.main li:hover .sub, nav.main li:focus-within .sub { display:none; }
  nav.main li.deplie .sub, nav.main li.deplie:hover .sub, nav.main li.deplie:focus-within .sub { display:block; }
  nav.main > ul > li > a { display:flex; justify-content:space-between; align-items:center; gap:12px; }
  nav.main > ul > li > a::after { content:"+"; font:700 18px/1 var(--titres); color:var(--azur-fonce); }
  nav.main li.deplie > a::after { content:"\2212"; }
  nav.main li.simple > a::after { content:""; }
  .cta-header { display:none; }
  .header-zone { padding:10px 0; }
  .entete-page { padding:126px 0 76px; border-radius:0 0 26px 26px; }
  .barre-actions { margin-top:-30px; }
  .barre-actions .inner { flex-direction:column; align-items:stretch; padding:16px; gap:12px; }
  .barre-actions .note { margin:0 auto; text-align:center; flex:0 0 auto; }
  section.bloc { padding:54px 0; }
  .deux-col { grid-template-columns:1fr; gap:34px; }
  .carte-photo { min-height:0; }
  .carte-photo img { position:static; height:auto; aspect-ratio:4/5; }
  .grille-cartes { grid-template-columns:1fr; }
  .alerte { padding:32px 26px 30px; }
  .portes { grid-template-columns:1fr; }
  .faq-cadre { padding:6px 20px; }
  .rdv-panneau { grid-template-columns:1fr; }
  .rdv-photo { min-height:300px; }
  .rdv-info { padding:42px 30px; }
  .rdv-pmr { white-space:normal; margin-right:0; }
  footer.site .haut { grid-template-columns:1fr; gap:28px; }
  footer.site .duo-cols { grid-template-columns:1fr; gap:28px; }
  footer.site .linkedin-verre { margin-top:24px; }
}
@media (max-width:620px) {
  .pill { white-space:normal; }
}
/* Schémas pédagogiques : PNG transparent flottant sur le fond de page,
   jamais de recadrage (les légendes doivent rester entières) */
.carte-photo.schema img { object-fit:contain; background:transparent; border:none; box-shadow:none; border-radius:0; }

/* ── Avertissement de portée (bas des pages patho, traitements, guides) ── */
.avert-portee { max-width:1000px; margin:0 auto; padding:20px 24px; border:1px solid var(--bord); border-radius:16px; background:rgba(255,255,255,.62); }
.avert-portee p { font-size:15px; line-height:1.65; color:rgba(28,42,51,.72); }
.avert-portee strong { color:var(--mer-fonce); font-weight:700; }
/* ── En-tête « panneau clair » conversion : tél + adresse + horaires + photo ── */
.entete-claire { padding:128px 0 0; }
.entete-claire .panneau { position:relative; overflow:hidden; border-radius:34px;
  background:radial-gradient(760px 460px at 92% -12%, rgba(242,229,217,.95) 0%, rgba(242,229,217,0) 62%),
             radial-gradient(620px 420px at -6% 108%, rgba(36,133,186,.14) 0%, rgba(36,133,186,0) 60%),
             linear-gradient(160deg, #eaf3f8 0%, #f7fbfd 52%, #edf4f8 100%);
  border:1px solid rgba(36,133,186,.18); box-shadow:0 30px 70px rgba(15,76,107,.10);
  padding:46px 54px 42px; }
.entete-claire .fil { background:rgba(255,255,255,.7); border:1px solid rgba(36,133,186,.2); color:rgba(30,40,49,.6); }
.entete-claire .fil a { color:var(--azur-fonce); }
.entete-claire .fil .sep { color:rgba(30,40,49,.35); }
.entete-claire .cols { display:grid; grid-template-columns:1.45fr .8fr; gap:52px; align-items:center; margin-top:30px; }
.kicker-t { font:700 14.5px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.17em; color:var(--azur-fonce); }
.entete-claire h1 { font:800 clamp(34px,3.6vw,47px)/1.12 var(--titres); letter-spacing:-.02em; color:var(--mer-fonce); margin-top:14px; text-wrap:balance; }
.intro-t { margin-top:16px; font:400 18px/1.7 var(--sans); color:rgba(30,40,49,.82); max-width:640px; }
.tel-header { display:inline-block; margin-top:26px; font:800 clamp(30px,3vw,38px)/1.1 var(--titres); letter-spacing:.01em; color:var(--mer); text-decoration:none; white-space:nowrap; }
.tel-header:hover { color:var(--azur-fonce); }
.adr-carte { display:inline-block; margin-top:16px; background:rgba(255,255,255,.8); border:1px solid rgba(36,133,186,.2); border-radius:16px; padding:14px 22px 13px; }
.adr-header { font:600 19.5px/1.5 var(--sans); color:rgba(30,40,49,.78); }
.adr-itineraire { display:inline-block; margin-top:4px; font:700 14.5px/1.4 var(--sans); color:var(--azur-fonce); text-decoration:none; }
.adr-itineraire:hover { text-decoration:underline; color:var(--mer); }
.adr-pmr { margin-top:7px; font:400 14px/1.5 var(--sans); color:rgba(30,40,49,.65); }
.photo-t { margin:0; }
.photo-t img { width:100%; height:auto; aspect-ratio:4/4.2; object-fit:cover; display:block; border-radius:24px; border:4px solid #fff; box-shadow:0 22px 48px rgba(15,76,107,.20); }
.bref { margin-top:38px; padding-top:28px; border-top:1px solid rgba(36,133,186,.2); }
.bref-lab { font:700 14px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.16em; color:var(--azur-fonce); }
.bref-cartes { display:grid; grid-template-columns:.8fr 1.4fr .8fr; gap:14px; margin-top:16px; }
.bref-carte { background:rgba(255,255,255,.8); border:1px solid rgba(36,133,186,.16); border-radius:18px; padding:18px 22px 16px; }
.bref-carte strong { display:block; font:800 19.5px/1.3 var(--titres); letter-spacing:-.01em; color:var(--mer); font-variant-numeric:tabular-nums; }
.bref-carte span { display:block; margin-top:5px; font:600 12.5px/1.45 var(--sans); text-transform:uppercase; letter-spacing:.08em; color:rgba(30,40,49,.55); }
@media (max-width:900px) {
  .entete-claire { padding-top:104px; }
  .entete-claire .panneau { padding:30px 24px 28px; border-radius:26px; }
  .entete-claire .cols { grid-template-columns:1fr; gap:26px; }
  .bref-cartes { grid-template-columns:1fr; }
}
/* ── Cartes praticiens avec boutons de prise de RDV ──
   (retours Lucie 17-18/08 : cartes portrait à grande photo conservées,
   mais boutons ANCRÉS au bas de chaque carte -> les 2 boutons de Giorgi
   ne laissent plus de vide SOUS les boutons des autres, l'air restant
   respire entre la spécialité et le bouton) */
.medecins { margin-top:44px; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.medecin { display:flex; flex-direction:column; background:#fff; border:1px solid var(--bord); border-radius:20px; padding:12px 12px 16px; transition:transform .2s, box-shadow .2s, border-color .2s; }
.medecin:hover { transform:translateY(-4px); border-color:rgba(36,133,186,.45); box-shadow:0 18px 40px rgba(15,76,107,.13); }
.medecin .medecin-photo { display:block; border-radius:12px; }
.medecin img { width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:center 12%; border-radius:12px; }
.medecin h3 { margin-top:14px; font:700 17px/1.3 var(--titres); text-align:center; }
.medecin h3 a { color:var(--encre); text-decoration:none; }
.medecin h3 a:hover { color:var(--azur-fonce); text-decoration:underline; }
.medecin .spe { margin-top:3px; font-size:14.5px; line-height:1.35; color:var(--azur-fonce); text-align:center; }
/* Mention du mode de consultation COLLÉE au-dessus du bouton (retour Lucie
   18/08) : .mode absorbe l'air de la carte (margin-top:auto), le bloc de
   boutons qui la suit se colle dessous ; sans mention (Giorgi), c'est
   .rdv-liens qui garde l'ancrage bas. */
.medecin .mode { margin-top:auto; padding-top:14px; font:600 13.5px/1.4 var(--sans); color:rgba(30,40,49,.6); text-align:center; }
.medecin .rdv-liens { margin-top:auto; padding-top:14px; display:grid; gap:8px; }
.medecin .mode + .rdv-liens { margin-top:0; padding-top:9px; }
.medecin .rdv-liens a { display:block; text-align:center; font:700 14px/1.2 var(--sans); color:#fff; background:var(--mer); border-radius:999px; padding:12px 10px; text-decoration:none; transition:background .15s; }
.medecin .rdv-liens a:hover { background:var(--mer-fonce); }
@media (max-width:1060px) {
  .medecins { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px) {
  .medecins { grid-template-columns:1fr; }
}
/* ── Venir à l'institut (fusion /acces/, 18/08) : 3 cartes transport ── */
.cartes-3 { grid-template-columns:repeat(3,1fr); }
@media (max-width:900px) {
  .cartes-3 { grid-template-columns:1fr; }
}

/* ---------- Zone logo ---------- */
.logo-zone { position:relative; display:flex; align-items:center; gap:7px; }
/* ---------- Photo en vis-à-vis (retours 01/09) ---------- */
.duo-col { display:grid; grid-template-columns:1.12fr .88fr; gap:44px; align-items:stretch; }
/* la marge d'un enfant (ex. .alerte { margin-top:26px }) grandirait la rangée
   et ferait dépasser la photo étirée : hauteurs toujours alignées (Lucie 01/09) */
.duo-col > * { margin-top:0; margin-bottom:0; }
.duo-photo { margin:0; position:relative; min-height:260px; }
.duo-photo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:22px; border:1px solid var(--bord); box-shadow:0 22px 48px rgba(15,76,107,.18); }
@media (max-width:900px) {
  .duo-col { grid-template-columns:1fr; gap:26px; }
  .duo-photo { min-height:0; }
  .duo-photo img { position:static; height:auto; aspect-ratio:3/2; }
}
footer.site .fin { display:grid; grid-template-columns:1fr auto 1fr; align-items:baseline; gap:18px; }
footer.site .fin .legal { grid-column:2; }
footer.site .fin .signature-studio { grid-column:3; justify-self:end; color:#fff; font-weight:600; font-size:15px; }
footer.site .fin .signature-studio:hover { color:#fff; }
@media (max-width:760px) {
  footer.site .fin { grid-template-columns:1fr; gap:10px; }
  footer.site .fin .legal, footer.site .fin .signature-studio { grid-column:1; justify-self:center; }
}
/* ---------- Retouches mobile 04/09 (retours Lucie) ---------- */
@media (max-width:900px) {
  /* 🚨 Un style en ligne bat toute règle de feuille : ces grilles restaient à
     deux colonnes sur téléphone (texte compressé, photo en vignette). */
  .duo-col[style], .deux-col[style] { grid-template-columns:1fr !important; }
}
@media (max-width:620px) {
  /* Bouton de rendez-vous sur UNE ligne : pleine largeur de l'encart, taille
     indexée sur l'écran. Les autres boutons gardent le repli. */
  .rdv-info { padding:38px 24px; }
  .rdv-info .boutons { flex-direction:column; align-items:stretch; }
  .rdv-info .pill, .rdv-info .boutons .pill {
    display:block; width:100%; white-space:nowrap; text-align:center;
    font-size:clamp(13.5px,4.2vw,17.5px); padding:15px 10px; }
  /* Même traitement pour le bouton du pied de page (mêmes 28 caractères). */
  footer.site .entete .pill { white-space:nowrap; font-size:clamp(13.5px,4.2vw,16.5px); padding:13px 16px; }
  /* Accueil : la photo se rapproche des boutons et gagne un peu de largeur. */
  .hero .wrap { padding-bottom:36px; }
  .hero-carte-photo { padding:0 8px; }
  /* En-tête bleu : titre et chapeau d'un cran plus bas sur téléphone. */
  .entete-page h1 { font-size:31px; }
  .entete-page .intro { font-size:16.5px; line-height:1.62; }
}
/* Deux schémas en vis-à-vis : ils s'empilent dès qu'une colonne descendrait
   sous ~350 px, en dessous les légendes des planches deviennent illisibles.
   D'où ce seuil à 767 px, entre les deux ruptures habituelles du site. */
@media (max-width:767px) {
  .duo-schemas { grid-template-columns:1fr; gap:24px; }
  .duo-schemas figure { max-width:420px; margin-inline:auto; }
}

/* ---------- Retours mobile 16/09/2026 (Lucie, nuit de la mise en ligne) ---------- */
nav.main > ul > li.cta-menu { display:none; }
.haut-page, footer.site a.haut-page { display:none; position:fixed; right:16px; bottom:calc(30px + env(safe-area-inset-bottom, 0px)); z-index:70; width:50px; height:50px; border-radius:50%; background:var(--mer-fonce); color:#fff; align-items:center; justify-content:center; box-shadow:0 10px 26px rgba(11,58,82,.35); text-decoration:none; }
footer.site a.haut-page:hover { color:#fff; text-decoration:none; }
.haut-page svg { width:26px; height:26px; display:block; }
a, button, label, [role="button"] { -webkit-tap-highlight-color:transparent; }
@media (max-width:900px) {
  /* 1. L'en-tête reste en haut de page au lieu de suivre le défilement. */
  .header-zone { position:absolute; }
  /* 6. Logo plus grand, barre de même hauteur (81 px). */
  .barre { padding:6.5px 12px 6.5px 20px; }
  .logo img { width:132px; }
  /* 9. « Menu » +2 px. */
  #burger { font-size:17px; }
  /* 3. Panneau aligné sur la barre, onglets à 18 px sur une ligne. */
  nav.main { left:0; right:0; }
  nav.main > ul > li > a { font-size:18px; padding:12px 10px; }
  .sub a { font-size:17px; }
  /* 8. Bouton Prendre rendez-vous en fin de menu. */
  nav.main > ul > li.cta-menu { display:block; margin-top:12px; }
  nav.main > ul > li.cta-menu > a { display:block; text-align:center; background:var(--mer); color:#fff; border:2px solid var(--mer); font:700 17px/1.2 var(--titres); padding:14px 18px; border-radius:999px; }
  nav.main > ul > li.cta-menu > a::after { content:none; }
  nav.main > ul > li.cta-menu:hover > a, nav.main > ul > li.cta-menu:focus-within > a { background:var(--mer); color:#fff; }
  /* 2. Bouton de retour en haut de page. */
  .haut-page.visible, footer.site a.haut-page.visible { display:flex; }
  /* 7. Encarts médecins. */
  .medecin h3 { font-size:19px; }
  .medecin .spe { font-size:16px; }
  .membre .voile strong { font-size:19px; }
  .membre .voile .spe { font-size:16px; }
  /* 12. Par où commencer. */
  .encart .dest span { font-size:17px; padding:13px 22px; }
  /* 13. Pathologies et traitements de l'accueil. */
  .chips a { font-size:16.5px; }
  /* 14. Pied de page. */
  footer.site h4 { font-size:14.5px; }
  footer.site ul a { font-size:17.5px; }
  /* 16/09 soir : phrase « Accessible aux personnes à mobilité réduite… » +1 px */
  .rdv-pmr { font-size:16px; }
  .adr-pmr { font-size:15px; }
}
/* 11. Écran tactile : le survol « colle » après un toucher, on le neutralise (aucun effet au clic). */
@media (hover:none) {
  nav.main > ul > li:hover > a, nav.main > ul > li:focus-within > a { color:var(--encre); background:transparent; }
  .sub a:hover { background:transparent; color:var(--encre); }
  .pill-mer:hover { background:var(--mer); border-color:var(--mer); }
  .pill-ghost:hover { background:transparent; color:var(--marron); }
  .pill-blanc:hover { background:#fff; border-color:#fff; }
  .pill-ghost-blanc:hover { background:transparent; }
  .pill-marron:hover { background:transparent; color:var(--marron); }
  .signaux .fin .pill-marron:hover { background:var(--marron); border-color:var(--marron); color:var(--creme-rose); }
  .pill-retour:hover { border-color:rgba(30,40,49,.22); }
  footer.site .entete .pill:hover { background:#fff; border-color:#fff; color:var(--mer-fonce); }
  footer.site a:hover { text-decoration:none; }
  footer.site .linkedin-verre:hover { background:rgba(255,255,255,.09); }
  .porte-liens a:hover, .porte-liens a:focus-visible { background:rgba(36,133,186,.10); border-color:rgba(36,133,186,.28); color:var(--azur-fonce); }
  .alerte .porte-liens a:hover, .alerte .porte-liens a:focus-visible, .panneau-sombre .porte-liens a:hover, .panneau-sombre .porte-liens a:focus-visible { background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.4); color:#fff; }
  .chips a:hover { border-color:var(--bord); color:var(--encre); background:var(--creme); }
  .liens-chips a:hover { background:rgba(36,133,186,.10); color:var(--azur-fonce); border-color:rgba(36,133,186,.30); }
  .onglet:not([aria-selected="true"]):hover { border-color:var(--bord); color:var(--encre); }
  .encart:hover { transform:none; border-color:rgba(36,133,186,.20); box-shadow:none; }
  .encart:hover .dest span { background:#fff; color:var(--azur-fonce); border-color:rgba(36,133,186,.28); }
  .medecin:hover { transform:none; border-color:var(--bord); box-shadow:none; }
  .medecin h3 a:hover { color:var(--encre); text-decoration:none; }
  .medecin .rdv-liens a:hover { background:var(--mer); }
  .carte-actu:hover { transform:none; box-shadow:0 14px 34px -28px rgba(15,76,107,.4); }
  .carte-actu:hover h3 { color:var(--mer-fonce); }
  .carte-actu:hover .im img, .une:hover .im img, .art-video:hover img, .galerie figure:hover img, .membre:hover img { transform:none; }
  .une:hover h2 { color:var(--mer-fonce); }
  .art-video:hover .lecture { transform:translate(-50%,-50%); }
  .membre:hover { border-color:var(--bord); box-shadow:none; }
  .membre:hover .voile .fiche { text-decoration:none; }
  .preuve:hover { border-color:var(--bord); box-shadow:none; }
  .doc:hover, .doc:focus-visible { border-color:rgba(36,133,186,.22); box-shadow:none; }
  .pros .cote .doc:hover, .pros .cote .doc:focus-visible { border-color:rgba(57,4,14,.22); }
  .voir-plus:hover { background:transparent; color:var(--azur-fonce); }
  .legal-nav a:hover, .exam-nav a:hover { border-color:var(--bord); color:var(--encre); background:#fff; }
  .depot .btn-fichier:hover { background:var(--mer); border-color:var(--mer); }
  .lien-bouton:hover { color:var(--azur-fonce); }
  .tel-header:hover { color:var(--mer); }
  .tel-big:hover, .carte-alerte .tel-carte:hover { color:#fff; }
  .question-carte .tel-carte:hover { color:var(--mer); }
  .adr-itineraire:hover { text-decoration:none; color:var(--azur-fonce); }
  .hono-nom a:hover, .hono-nom a:focus-visible { color:inherit; text-decoration:none; }
  .biblio a:hover, .biblio .t a:hover { color:var(--azur-fonce); }
  .fil a:hover { text-decoration:none; }
  .eva label:hover, .choix label:hover { border-color:rgba(30,40,49,.14); }
}
/* ══════════ Page Demander une télé-expertise (chantier B) ══════════ */
/* ── En-tête fusionné : titre + démarche en quatre étapes, sans photo ── */
.tete-te { position:relative; padding:126px 0 26px; }
.tete-te::before { content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(760px 420px at 90% 0%, rgba(36,133,186,.16) 0%, rgba(36,133,186,0) 62%),
             radial-gradient(46% 58% at 0% 58%, rgba(242,229,217,.8) 0%, rgba(242,229,217,0) 60%); }
.tete-te .wrap { position:relative; }
.tete-te .fil { background:rgba(255,255,255,.7); border:1px solid rgba(36,133,186,.2); color:rgba(30,40,49,.6); }
.tete-te .fil a { color:var(--azur-fonce); }
.tete-te .fil .sep { color:rgba(30,40,49,.35); }
.tete-te .cols { display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; margin-top:28px; }
.tete-te h1 { font:800 clamp(32px,3.4vw,44px)/1.1 var(--titres); letter-spacing:-.02em; color:var(--mer-fonce); margin-top:14px; text-wrap:balance; }
.tete-te .intro-q { margin-top:24px; font:800 20px/1.4 var(--titres); color:var(--mer); letter-spacing:-.01em; max-width:560px; }
.tete-te .intro-t { margin-top:18px; font:400 18px/1.7 var(--sans); color:rgba(30,40,49,.82); max-width:560px; }
.tete-te .actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:26px; }
.tete-te .actions .pill { font-size:16.5px; padding:14px 26px; }
.faits { list-style:none; margin-top:26px; display:flex; flex-wrap:wrap; gap:8px; }
.faits li { display:inline-flex; align-items:center; gap:8px; padding:8px 14px 8px 10px; background:#fff; border:1px solid rgba(36,133,186,.2); border-radius:999px; font:600 14.5px/1.3 var(--sans); color:var(--mer); }
.faits li svg { width:18px; height:18px; color:var(--azur-fonce); flex:0 0 auto; }
.demarche { background:#fff; border:1px solid rgba(36,133,186,.18); border-radius:26px; padding:24px 28px 18px; box-shadow:0 24px 54px rgba(15,76,107,.10); }
.demarche .lab { display:block; font:700 12.5px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.16em; color:var(--azur-fonce); }
.demarche ol { list-style:none; margin-top:10px; }
.demarche li { display:grid; grid-template-columns:40px 1fr; gap:14px; align-items:start; padding:13px 0; }
.demarche li + li { border-top:1px solid var(--bord); }
.demarche .num { width:40px; height:40px; border-radius:50%; background:var(--mer); color:#fff; font:800 17px/40px var(--titres); text-align:center; }
.demarche h3 { font:800 17px/1.35 var(--titres); color:var(--mer); letter-spacing:-.01em; }
.demarche p { margin-top:4px; font-size:15px; line-height:1.55; color:rgba(30,40,49,.8); }
.demarche p strong { color:var(--mer); font-weight:700; }
/* ── Encart professionnels de santé : tons marron et crème rosée de la charte ── */
.pros { margin-top:44px; display:grid; grid-template-columns:1.34fr 1fr; border-radius:26px; overflow:hidden; background:linear-gradient(135deg, #fbf4ee 0%, var(--creme-rose) 100%); border:1px solid rgba(57,4,14,.14); }
.pros .texte { padding:36px 40px 34px; }
.pros .kicker { color:var(--marron); }
.pros h3 { margin-top:10px; font:800 clamp(21px,2.2vw,26px)/1.25 var(--titres); color:var(--marron); letter-spacing:-.01em; text-wrap:balance; }
.pros p { margin-top:12px; font-size:16.5px; line-height:1.65; color:rgba(57,4,14,.84); }
.pros .cote { display:flex; flex-direction:column; justify-content:center; padding:36px 24px 36px 32px; background:rgba(57,4,14,.06); border-left:1px solid rgba(57,4,14,.12); }
.pros .cote .doc { margin-top:0; border-color:rgba(57,4,14,.22); }
.pros h3 .souligne { display:block; margin-top:.4em; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:.28em; text-decoration-skip-ink:none; }
.pros h3 + p { margin-top:20px; }
.pros .cote .doc:hover, .pros .cote .doc:focus-visible { border-color:var(--marron); }
.pros .cote .doc .ico { background:var(--marron); }
.pros .cote .note { margin-top:12px; font-size:13.5px; line-height:1.5; color:rgba(57,4,14,.62); }
/* ── Bandeau « Nous consulter » sans photo ── */
.rdv-te .actions { margin-top:22px; display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.rdv-te .tel-big { margin-top:0; }
.av { display:inline-block; vertical-align:middle; margin-left:6px; padding:3px 8px; border-radius:9px; background:#fbe8cc; color:#8a4a06; font:700 11px/1.2 var(--sans); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; }

/* ── Avant de commencer : points + documents ── */
.avant { margin-top:34px; display:grid; grid-template-columns:1.1fr .9fr; gap:36px; align-items:start; }
.points { list-style:none; display:grid; gap:12px; }
.points li { position:relative; padding:18px 22px 18px 66px; background:#fff; border:1px solid var(--bord); border-radius:18px; font-size:16.5px; line-height:1.6; }
.points li svg { position:absolute; left:22px; top:19px; width:28px; height:28px; color:var(--azur-fonce); }
.points strong { font-family:var(--titres); font-weight:700; color:var(--mer); }
.docs { background:linear-gradient(165deg, #ffffff 0%, var(--ciel) 130%); border:1px solid rgba(36,133,186,.20); border-radius:22px; padding:26px 28px 24px; }
.docs h3 { font:800 19.5px/1.35 var(--titres); color:var(--mer); letter-spacing:-.01em; }
.docs > p { margin-top:8px; font-size:15.5px; line-height:1.55; color:rgba(30,40,49,.75); }
.doc { display:flex; align-items:center; gap:14px; margin-top:12px; padding:14px 16px; background:#fff; border:1px solid rgba(36,133,186,.22); border-radius:14px; text-decoration:none; color:var(--encre); font:600 15.5px/1.35 var(--sans); transition:border-color .15s, box-shadow .15s; }
.doc:hover, .doc:focus-visible { border-color:var(--mer); box-shadow:0 8px 20px rgba(15,76,107,.10); }
.doc .ico { flex:0 0 42px; width:42px; height:42px; border-radius:10px; background:var(--mer); color:#fff; display:grid; place-items:center; font:800 11px/1 var(--titres); letter-spacing:.06em; }
.doc small { display:block; font-weight:400; font-size:14px; color:rgba(30,40,49,.62); margin-top:2px; }
.docs .note { margin-top:14px; font-size:14px; line-height:1.5; color:rgba(30,40,49,.62); }
.alerte .kicker { color:var(--creme-rose); }
.alerte .porte-liens { margin-top:18px; }

/* ── Le formulaire ── */
.formulaire { margin-top:34px; display:grid; grid-template-columns:250px 1fr; gap:30px; align-items:start; }
.rail { position:sticky; top:112px; background:#fff; border:1px solid var(--bord); border-radius:22px; padding:18px 14px; }
.rail .rail-lab { display:block; padding:0 10px 10px; font:700 12px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.15em; color:var(--azur-fonce); }
.rail ol { list-style:none; display:grid; gap:2px; }
.rail li { display:flex; align-items:center; gap:12px; padding:8px 10px; border-radius:12px; font:600 14.5px/1.3 var(--sans); color:rgba(30,40,49,.55); }
.rail li .n { flex:0 0 28px; width:28px; height:28px; border-radius:50%; border:2px solid rgba(30,40,49,.18); display:grid; place-items:center; font:800 12.5px/1 var(--titres); color:rgba(30,40,49,.5); font-variant-numeric:tabular-nums; }
.rail li.fait .n { background:var(--azur); border-color:var(--azur); color:#fff; }
.rail li.fait { color:var(--encre); }
.rail li.courante { background:rgba(36,133,186,.10); color:var(--mer); }
.rail li.courante .n { border-color:var(--mer); color:var(--mer); background:#fff; }
.rail li button { all:unset; display:flex; align-items:center; gap:12px; width:100%; cursor:pointer; font:inherit; color:inherit; }
.rail li button:focus-visible { outline:3px solid var(--azur); outline-offset:3px; border-radius:8px; }
.rail li.hors { opacity:.55; }
.rail li em { display:block; font:400 12px/1.3 var(--sans); color:rgba(30,40,49,.55); }
.carte-form { position:relative; background:#fff; border:1px solid var(--bord); border-radius:26px; box-shadow:0 24px 54px rgba(15,76,107,.08); padding:34px 40px 36px; }
.simu-bandeau { margin-bottom:22px; padding:12px 16px; border-radius:14px; background:#fff7e6; border:1px solid #f1d79a; color:#6b4a06; font-size:15px; line-height:1.5; }
.simu-bandeau strong { font-family:var(--titres); }
.simu-bandeau p + p { margin-top:6px; }
.progres { display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap; }
.progres .ou { font:700 13px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.15em; color:var(--azur-fonce); }
.progres .pct { font:700 14px/1.4 var(--sans); color:rgba(30,40,49,.6); font-variant-numeric:tabular-nums; }
.barre-prog { margin-top:10px; height:8px; border-radius:999px; background:rgba(36,133,186,.14); overflow:hidden; }
.barre-prog i { display:block; height:100%; width:0; background:linear-gradient(90deg, var(--azur), var(--mer)); border-radius:999px; transition:width .35s ease; }
.etape-titre { margin-top:24px; font:800 clamp(24px,2.6vw,30px)/1.2 var(--titres); color:var(--mer); letter-spacing:-.01em; outline:none; }
.etape-consigne { margin-top:10px; font-size:17px; line-height:1.6; color:rgba(30,40,49,.78); }
.q { margin-top:26px; padding-top:26px; border-top:1px solid var(--bord); }
.q.sans-titre { border-top:0; padding-top:4px; margin-top:8px; }
.sous-bloc { margin-top:30px; padding:12px 18px; border-radius:14px; background:var(--ciel); font:800 17px/1.35 var(--titres); color:var(--mer); }
.sous-bloc[hidden] { display:none; }
.sous-bloc + .q { border-top:0; padding-top:18px; margin-top:0; }
.q[hidden] { display:none; }
.q .lib .fac { display:inline-block; margin-left:8px; vertical-align:middle; font:600 12px/1 var(--sans); color:rgba(30,40,49,.55); text-transform:uppercase; letter-spacing:.08em; }
.q .lib { display:block; font:700 19px/1.4 var(--titres); color:var(--encre); }
.q .aide { margin-top:6px; font-size:15.5px; line-height:1.55; color:rgba(30,40,49,.66); }
.q .aide.attention { color:#8a4a06; }
.choix { margin-top:14px; display:grid; gap:10px; }
.choix.deux { grid-template-columns:1fr 1fr; }
.choix label { display:flex; align-items:flex-start; gap:14px; padding:14px 18px; border:2px solid rgba(30,40,49,.14); border-radius:16px; background:#fff; cursor:pointer; font-size:17px; line-height:1.45; transition:border-color .15s, background .15s; }
.choix label:hover { border-color:var(--azur); }
.choix label.coche { border-color:var(--mer); background:rgba(36,133,186,.08); }
.choix input { flex:0 0 auto; width:22px; height:22px; margin-top:2px; accent-color:var(--mer); }
.champs { margin-top:14px; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.champs.un { grid-template-columns:minmax(0,420px); }
.champs.trois { grid-template-columns:1.3fr 1.05fr 1.15fr; }
@media (max-width:780px) { .champs.trois { grid-template-columns:1fr; } }
.champ label { display:block; font:600 15px/1.4 var(--sans); color:rgba(30,40,49,.8); }
.champ label small { display:block; margin-top:2px; font-weight:400; font-size:14px; line-height:1.4; color:rgba(30,40,49,.55); }
.champ input, .champ textarea { width:100%; margin-top:6px; padding:13px 16px; border:2px solid rgba(30,40,49,.16); border-radius:14px; background:#fff; font:400 17.5px/1.4 var(--sans); color:var(--encre); }
.champ textarea { min-height:130px; resize:vertical; }
.champ input:focus, .champ textarea:focus { outline:3px solid rgba(36,133,186,.35); outline-offset:0; border-color:var(--azur); }
.champ.erreur input, .champ.erreur textarea { border-color:#b3261e; }
.msg-erreur { margin-top:6px; font:600 14.5px/1.4 var(--sans); color:#b3261e; }
.q.erreur > .lib { color:#b3261e; }
.eva { margin-top:14px; display:grid; grid-template-columns:repeat(11,1fr); gap:6px; }
.eva label { position:relative; display:grid; place-items:center; height:58px; border:2px solid rgba(30,40,49,.14); border-radius:14px; font:800 20px/1 var(--titres); color:var(--mer); cursor:pointer; background:#fff; transition:background .15s, border-color .15s; }
.eva label:hover { border-color:var(--azur); }
.eva label.coche { background:var(--mer); color:#fff; border-color:var(--mer); }
.eva input { position:absolute; opacity:0; width:1px; height:1px; }
.eva input:focus-visible + span { outline:3px solid var(--azur); outline-offset:4px; border-radius:10px; }
.eva-legende { display:flex; justify-content:space-between; gap:12px; margin-top:8px; font-size:14px; color:rgba(30,40,49,.62); }
.depot { margin-top:14px; border:2px dashed rgba(36,133,186,.45); border-radius:18px; padding:22px; background:rgba(36,133,186,.05); text-align:center; }
.depot.erreur { border-color:#b3261e; }
.depot .btn-fichier { display:inline-block; background:var(--mer); color:#fff; border:2px solid var(--mer); border-radius:999px; padding:12px 22px; font:700 15.5px/1.2 var(--titres); cursor:pointer; }
.depot .btn-fichier:hover { background:var(--mer-fonce); border-color:var(--mer-fonce); }
.depot input[type=file] { position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; }
.depot input[type=file]:focus-visible + .btn-fichier { outline:3px solid var(--azur); outline-offset:3px; }
.depot .formats { margin-top:8px; font-size:14px; color:rgba(30,40,49,.6); }
.depot .qualite { display:block; max-width:520px; margin:6px auto 15px; color:var(--mer); font-weight:600; font-size:15px; line-height:1.5; }
.fichiers { list-style:none; margin-top:12px; display:grid; gap:8px; text-align:left; }
.fichiers li { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; background:#fff; border:1px solid var(--bord); border-radius:12px; font-size:15px; }
.fichiers li span small { color:rgba(30,40,49,.55); margin-left:6px; }
.fichiers button { background:none; border:0; color:#b3261e; font:600 14px var(--sans); cursor:pointer; padding:4px 6px; }
.sous-panneau { margin-top:12px; padding:18px 20px 20px; background:var(--ciel); border-radius:16px; }
.sous-panneau h4 { font:700 16.5px/1.4 var(--titres); color:var(--mer); }
.sous-panneau .champs { grid-template-columns:1fr 1.4fr 1fr; }
.sous-panneau .depot { background:#fff; }
.a-preparer { margin-top:18px; display:flex; align-items:flex-start; gap:14px; padding:16px 20px; background:var(--ciel); border-radius:16px; font-size:16.5px; line-height:1.6; }
.a-preparer svg { flex:0 0 26px; width:26px; height:26px; margin-top:1px; color:var(--azur-fonce); }
.a-preparer strong { font-family:var(--titres); font-weight:700; color:var(--mer); }
.vitale { margin-top:14px; display:flex; align-items:center; gap:18px; padding:14px 18px; background:var(--ciel); border-radius:16px; }
.vitale svg { flex:0 0 132px; width:132px; height:auto; }
.vitale p { font-size:15px; line-height:1.5; color:rgba(30,40,49,.78); }
.lien-bouton { background:none; border:0; padding:0; font:600 16px/1.4 var(--sans); color:var(--azur-fonce); text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.lien-bouton:hover { color:var(--mer); }
.nav-form { margin-top:36px; padding-top:24px; border-top:1px solid var(--bord); display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.nav-form .pill { cursor:pointer; font-family:var(--titres); }
.pill-retour { background:transparent; color:var(--encre); border:2px solid rgba(30,40,49,.22); }
.pill-retour:hover { border-color:var(--encre); }
.recap-erreurs { margin-top:22px; padding:16px 20px; border:2px solid #b3261e; border-radius:16px; background:#fdf3f2; color:#7a1a14; font-size:16px; line-height:1.5; }
.recap-erreurs strong { font-family:var(--titres); }
.recap-erreurs ul { margin-top:6px; padding-left:20px; }
.recap-erreurs a { color:#7a1a14; }
.ecran { padding:10px 4px 4px; }
.ecran .kicker { display:block; }
.ecran h3 { margin-top:12px; font:800 clamp(24px,2.6vw,30px)/1.2 var(--titres); color:var(--mer); letter-spacing:-.01em; text-wrap:balance; }
.ecran p { margin-top:14px; font-size:17.5px; line-height:1.65; max-width:640px; }
.ecran .docs { margin-top:22px; max-width:560px; }
.ecran .actions { margin-top:26px; display:flex; gap:12px; flex-wrap:wrap; }
.ecran .actions .pill { cursor:pointer; font-family:var(--titres); }
.coche-ok { width:64px; height:64px; border-radius:50%; background:rgba(36,133,186,.12); display:grid; place-items:center; color:var(--mer); }
.coche-ok svg { width:32px; height:32px; }
.simu { margin-top:28px; border:1px solid var(--bord); border-radius:22px; overflow:hidden; }
.simu .simu-tete { padding:16px 20px; background:#fff7e6; border-bottom:1px solid #f1d79a; color:#6b4a06; font-size:15px; line-height:1.5; }
.simu .simu-tete strong { font-family:var(--titres); }
.simu .onglets { display:flex; background:var(--ciel); border-bottom:1px solid var(--bord); }
.simu .onglets button { flex:1; padding:14px 10px; border:0; background:none; font:700 15px/1.2 var(--titres); color:rgba(30,40,49,.6); cursor:pointer; }
.simu .onglets button[aria-selected="true"] { background:#fff; color:var(--mer); box-shadow:inset 0 -3px 0 var(--mer); }
.simu .panneau { background:#fff; }
.simu pre { margin:0; padding:20px; font:13.5px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; white-space:pre-wrap; word-break:break-word; max-height:520px; overflow:auto; }
.simu table { width:100%; border-collapse:collapse; font-size:15px; }
.simu th, .simu td { text-align:left; padding:10px 14px; border-bottom:1px solid var(--bord); vertical-align:top; }
.simu th { font:700 12.5px/1.4 var(--titres); text-transform:uppercase; letter-spacing:.12em; color:var(--azur-fonce); }
.simu .vide { padding:20px; color:rgba(30,40,49,.6); }
.chip { display:inline-block; padding:4px 10px; border-radius:999px; font:700 12.5px/1.2 var(--sans); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; }
.chip.fort { background:#f8d7d3; color:#7a1a14; }
.chip.modere { background:#fbe8cc; color:#8a4a06; }
.chip.info { background:rgba(36,133,186,.14); color:var(--mer); }
.simu .actions-simu { display:flex; gap:10px; flex-wrap:wrap; padding:16px 20px; border-top:1px solid var(--bord); background:var(--creme); }
.simu .actions-simu .pill { cursor:pointer; font-family:var(--titres); font-size:15px; padding:12px 20px; }
.pot-de-miel { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
@media (max-width:1060px) {
  .formulaire { grid-template-columns:1fr; }
  .rail { position:static; }
  .rail ol { display:flex; flex-wrap:wrap; gap:6px; }
  .rail li { padding:6px 10px 6px 6px; }
}
@media (max-width:900px) {
  .tete-te { padding-top:104px; }
  .tete-te .cols { grid-template-columns:1fr; gap:28px; }
}
@media (max-width:760px) {
  .avant, .pros, .champs, .champs.trois, .choix.deux, .sous-panneau .champs { grid-template-columns:1fr; }
  .pros .texte { padding:28px 22px 24px; }
  .pros .cote { padding:22px; border-left:0; border-top:1px solid rgba(57,4,14,.12); }
  .carte-form { padding:24px 18px 26px; border-radius:20px; }
  .eva { grid-template-columns:repeat(6,1fr); }
  .eva label { height:54px; font-size:18px; }
  .vitale { flex-direction:column; align-items:flex-start; }
  .nav-form .pill { width:100%; }
  .simu .onglets { flex-direction:column; }
}
@media (prefers-reduced-motion: reduce) {
  .barre-prog i, .choix label, .eva label, .doc { transition:none; }
}
/* Menu mobile : second bouton vers la télé-expertise, aux tons marron de l'encart
   « Professionnels de santé » de la page du dispositif (24/09/2026). */
nav.main > ul > li.cta-menu-te { margin-top:10px; }
nav.main > ul > li.cta-menu-te > a,
nav.main > ul > li.cta-menu-te:hover > a,
nav.main > ul > li.cta-menu-te:focus-within > a { background:linear-gradient(135deg, #fbf4ee 0%, var(--creme-rose) 100%); color:var(--marron); border-color:var(--marron); font-size:16px; }