/* =========================================================
   GABARIT PAGE SERVICE
   Marque : 3 emplacements marques "MARQUE" dans le corps de page.
   ========================================================= */
:root{
  --titre:"Poppins","Segoe UI",Helvetica,Arial,sans-serif;
  --texte:"Open Sans","Segoe UI",Helvetica,Arial,sans-serif;
  --gut:clamp(1.15rem,3.6vw,4rem); --r:14px; --r-l:24px; --t:.35s cubic-bezier(.4,0,.2,1);
}
:root,:root[data-theme="clair"],:root[data-theme="light"]{
  --bg:#FBF9F5; --surface:#FFFFFF; --surface-2:#F4EFE9;
  --ink:#241820; --ink-2:#584A52; --muted:#8B7C84; --line:rgba(36,24,32,.12);
  --primary:#7A1440; --primary-2:#99194F; --on-primary:#FFFFFF;
  --accent:#C26A00; --accent-soft:#FBEEDC; --warm:#F3E3D0;
  --alerte:#B4531F; --alerte-soft:#F9EBE1;
  --sh:0 1px 2px rgba(36,24,32,.05),0 10px 30px -14px rgba(36,24,32,.18);
  --sh-2:0 2px 6px rgba(36,24,32,.06),0 26px 54px -22px rgba(36,24,32,.3);
  --hero-fond:radial-gradient(88% 118% at 78% 16%,rgba(194,106,0,.15),transparent 58%),
              linear-gradient(115deg,#F7EEE6 0%,#FCF8F2 52%,#F4E8E5 100%);
  --hero-voile:linear-gradient(100deg,rgba(251,249,245,.97) 0%,rgba(251,249,245,.84) 40%,rgba(251,249,245,.18) 100%);
  --hero-ink:#241820; --hero-span:#7A1440; --hero-lede:#584A52;
  --hero-btn:#7A1440; --hero-btn-ink:#FFFFFF; --hero-o-ink:#241820; --hero-o-bord:rgba(36,24,32,.28);
}
:root[data-theme="sombre"],:root[data-theme="dark"]{
  --bg:#241A20; --surface:#302330; --surface-2:#3B2C39; --ink:#F2EAEE;
  --ink-2:#CDBCC5; --muted:#9A8892; --line:rgba(242,234,238,.16);
  --primary:#E0799F; --primary-2:#EA93B2; --on-primary:#2A0E1C;
  --accent:#F19200; --accent-soft:rgba(241,146,0,.16); --warm:#453341;
  --alerte:#E8A06E; --alerte-soft:rgba(180,83,31,.2);
  --sh:0 1px 2px rgba(0,0,0,.4),0 10px 30px -14px rgba(0,0,0,.6);
  --sh-2:0 2px 6px rgba(0,0,0,.4),0 26px 54px -22px rgba(0,0,0,.75);
  --hero-fond:radial-gradient(88% 118% at 78% 16%,rgba(224,121,159,.3),transparent 58%),
              linear-gradient(115deg,#1E1018 0%,#3C1730 52%,#511A3A 100%);
  --hero-voile:linear-gradient(100deg,rgba(20,10,15,.94) 0%,rgba(20,10,15,.78) 46%,rgba(20,10,15,.42) 100%);
  --hero-ink:#FFFFFF; --hero-span:#F0A8C4; --hero-lede:rgba(245,235,240,.9);
  --hero-btn:#FFFFFF; --hero-btn-ink:#3C1730; --hero-o-ink:#FFFFFF; --hero-o-bord:rgba(255,255,255,.45);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{background-color:var(--bg);color:var(--ink);font-family:var(--texte);font-size:16px;
  line-height:1.65;-webkit-font-smoothing:antialiased;transition:background-color var(--t),color var(--t)}
.no-anim,.no-anim *,.no-anim *::before,.no-anim *::after{transition:none!important}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--gut)}
h1,h2,h3,h4{font-family:var(--titre);font-weight:600;letter-spacing:-.02em;line-height:1.15;text-wrap:balance}
.lab{font-family:var(--titre);font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--titre);
  font-weight:600;font-size:.9rem;padding:.85rem 1.6rem;border-radius:100px;background:var(--primary);
  color:var(--on-primary);border:2px solid var(--primary);transition:var(--t);cursor:pointer;text-align:center}
.btn:hover{background:var(--primary-2);border-color:var(--primary-2);transform:translateY(-2px);box-shadow:var(--sh-2)}
.btn-o{background:transparent;color:var(--ink);border-color:var(--line)}
.btn-o:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn-full{width:100%}
.nav .btn{white-space:nowrap}
.lbl-court{display:none}

.theme{position:fixed;right:1rem;bottom:1rem;z-index:9999;display:flex;gap:.25rem;background:var(--surface);
  border:1px solid var(--line);border-radius:100px;padding:.28rem;box-shadow:var(--sh-2)}
.theme button{font-family:var(--titre);font-size:.72rem;font-weight:600;padding:.45rem .8rem;border:0;
  border-radius:100px;background:transparent;color:var(--muted);cursor:pointer;transition:var(--t)}
.theme button.on{background:var(--primary);color:var(--on-primary)}

/* >>> HEADER:CSS:DEBUT <<< */
/* Icones vectorielles. Emises en 1em, elles heritent de la taille de police
   de leur contexte : le CSS ecrit pour les emoji continue de s'appliquer. */
.icn{display:inline-block;vertical-align:-.14em;flex:0 0 auto;overflow:visible}

/* ===== HEADER A DEUX NIVEAUX =====
   Bandeau de service : navigation secondaire (cabinet, prescripteurs).
   Elle n'apparait qu'ici, jamais en double dans le menu principal.
   Rangee principale : logo, navigation principale, actions.
   Sans le tiroir, le site n'etait pas navigable en dessous de 1040px. */
header{position:sticky;top:0;z-index:900;background:var(--bg);border-bottom:1px solid var(--line)}

/* --- bandeau de service --- */
.hdr-serv{background:var(--surface-2);border-bottom:1px solid var(--line)}
.hdr-serv-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding-top:.42rem;padding-bottom:.42rem;font-family:var(--titre);font-size:.78rem}
.hdr-lieux{color:var(--muted);font-weight:500;letter-spacing:.02em;white-space:nowrap}
.hdr-lieux i{font-style:normal;opacity:.45;margin:0 .4rem}
.hdr-liens{display:flex;gap:1.5rem}
.hdr-liens a{color:var(--ink-2);font-weight:500;transition:var(--t);white-space:nowrap}
.hdr-liens a:hover{color:var(--accent)}

/* --- rangee principale --- */
.nav{display:flex;align-items:center;justify-content:space-between;gap:1.4rem;
  padding-top:.5rem;padding-bottom:.5rem}
/* libelle long par defaut, libelle court en dessous de 760px.
   Ces deux regles doivent rester dans le bloc header : sans elles,
   le bouton affiche ses deux libelles et deborde. */
.nav .btn{white-space:nowrap}
.lbl-court{display:none}
.brand{display:flex;align-items:center;gap:.7rem;flex:0 0 auto}
/* Logo : PNG a fond transparent, de rapport 6,26. A 38px de haut il occupe
   238px de large : c'est l'element le plus large de la rangee, d'ou le menu
   principal limite a trois entrees. */
.logo-img{height:75px;width:auto;display:block}
/* Deux fichiers plutot qu'un filtre : l'inversion en blanc plein detruisait
   l'orange et le pourpre. La version sombre ne blanchit que le lettrage. */
/* OceanWP imprime en bas de page son tiroir de panier et son apercu
   rapide. Prives de son CSS, ils s'affichaient en clair comme du contenu
   brut sous le pied de page. Nos pages ont leur propre panier. */
#oceanwp-cart-sidebar-wrap,#owp-qv-wrap{display:none!important}

.logo-sombre{display:none}
:root[data-theme="sombre"] .logo-clair,
:root[data-theme="dark"] .logo-clair{display:none}
:root[data-theme="sombre"] .logo-sombre,
:root[data-theme="dark"] .logo-sombre{display:block}
footer .logo-img{height:55px}

.menu{display:flex;align-items:center;gap:.35rem;font-family:var(--titre);font-size:.88rem;font-weight:500}
.mi{position:relative}
.mi > a{display:inline-flex;align-items:center;gap:.4rem;color:var(--ink-2);
  padding:.7rem 1.1rem;border-radius:10px;transition:var(--t);white-space:nowrap}
.mi > a:hover,.mi.open > a,.mi > a.on{color:var(--primary);background:var(--surface-2)}
.chev{font-style:normal;font-size:.58rem;opacity:.5;transition:transform var(--t)}
.mi.open .chev{transform:rotate(180deg)}
.sub{position:absolute;top:calc(100% + .4rem);left:0;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-2);padding:.6rem;
  min-width:262px;max-height:min(70vh,420px);overflow-y:auto;
  opacity:0;visibility:hidden;transform:translateY(-7px);
  transition:var(--t);z-index:20}
.mi.open .sub{opacity:1;visibility:visible;transform:none}
.sub a{display:block;padding:.5rem .75rem;border-radius:8px;font-size:.85rem;
  font-weight:400;color:var(--ink-2);font-family:var(--texte)}
.sub a:hover{background:var(--accent-soft);color:var(--accent)}
.sub-large{display:grid;grid-template-columns:repeat(3,minmax(168px,1fr));gap:0 .9rem;min-width:590px}
.sub-large.pos-right{left:auto;right:0}
.sub h4{font-family:var(--titre);font-size:.65rem;font-weight:600;letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted);padding:.5rem .75rem .2rem;margin:0}

.hactions{display:flex;align-items:center;gap:.5rem;flex:0 0 auto}
/* icones sans bordure : quatre cadres cote a cote alourdissaient la rangee */
.ic-btn{width:44px;height:44px;border-radius:12px;border:0;display:grid;
  place-items:center;font-size:1.4rem;transition:var(--t);position:relative;color:var(--ink-2);
  background:transparent;cursor:pointer}
/* trait legerement epaissi : a cette taille, 1,75 paraissait trop fin */
.ic-btn .icn{stroke-width:1.9}
.ic-btn:hover{background:var(--surface-2);color:var(--primary)}
.ic-btn b{position:absolute;top:3px;right:3px;background:var(--accent);color:#fff;
  font-family:var(--titre);font-size:.58rem;font-weight:700;width:17px;height:17px;
  border-radius:50%;display:grid;place-items:center}
.hactions .btn{margin-left:.35rem}
.burger{display:none}
/* Le bouton porte les deux icones ; c'est aria-expanded qui decide laquelle
   s'affiche. Reecrire son contenu en JavaScript ramenait un emoji. */
.burger .i-fermer{display:none}
.burger[aria-expanded="true"] .i-menu{display:none}
.burger[aria-expanded="true"] .i-fermer{display:block}

/* tiroir mobile */
.drawer{display:none;border-top:1px solid var(--line);background:var(--bg);
  max-height:calc(100dvh - 62px);overflow-y:auto;padding:.6rem var(--gut) 2rem}
.drawer.open{display:block}
.drawer .grp{padding:1rem 0;border-bottom:1px solid var(--line)}
.drawer .grp > b{font-family:var(--titre);font-size:.68rem;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent);display:block;margin-bottom:.45rem}
.drawer a{display:block;padding:.5rem 0;font-family:var(--titre);font-size:.95rem;
  font-weight:500;color:var(--ink);transition:var(--t)}
.drawer a:hover{color:var(--primary);padding-left:.35rem}
.drawer .sous a{font-weight:400;font-size:.88rem;color:var(--ink-2);padding-left:.9rem}
.drawer .actions{padding-top:1.3rem;display:grid;gap:.6rem}

@media(max-width:1100px){
  .menu{display:none}
  .burger{display:grid;place-items:center}
}
/* sous 900px le bandeau disparait : ses liens sont dans le tiroir */
@media(max-width:900px){.hdr-serv{display:none}}
@media(max-width:760px){
  .logo-img{height:59px}
  .nav .btn{padding:.68rem 1.1rem;font-size:.84rem}
  .lbl-long{display:none}
  .lbl-court{display:inline}
}
@media(max-width:600px){.nav .btn{display:none}}
@media(max-width:520px){.logo-img{height:49px}}
@media(max-width:420px){
  .logo-img{height:42px}
  .ic-btn{width:36px;height:36px}
  .hactions{gap:.3rem}
  .ic-compte{display:none}   /* le compte reste accessible depuis le tiroir */
}
/* >>> HEADER:CSS:FIN <<< */


































/* hero de page service */
.shero{position:relative;overflow:hidden;background:var(--hero-fond);
  padding:clamp(2.4rem,5vw,4rem) 0 clamp(2.4rem,5vw,3.6rem)}
.shero-bg{position:absolute;inset:0;z-index:0;background-image:var(--hero-img,none);
  background-size:cover;background-position:center right}
.shero-bg::after{content:"";position:absolute;inset:0;background:var(--hero-voile)}
.shero-in{position:relative;z-index:1}
.fil{font-size:.8rem;color:var(--muted);margin-bottom:1.4rem}
.fil a:hover{color:var(--primary);text-decoration:underline}
.fil span{margin:0 .35rem}
h1{font-size:clamp(2rem,4.6vw,3.2rem);font-weight:700;color:var(--hero-ink);max-width:18ch;margin-bottom:1.2rem}
.shero .lede{font-size:clamp(1rem,1.3vw,1.12rem);color:var(--hero-lede);max-width:56ch;line-height:1.8}
.shero .acts{margin-top:2rem;display:flex;gap:.8rem;flex-wrap:wrap}
.shero .btn{background:var(--hero-btn);color:var(--hero-btn-ink);border-color:var(--hero-btn)}
.shero .btn:hover{background:var(--accent);border-color:var(--accent);color:#FFFFFF}
.shero .btn-o{background:transparent;color:var(--hero-o-ink);border-color:var(--hero-o-bord)}
.shero .btn-o:hover{background:var(--hero-o-ink);color:var(--bg);border-color:var(--hero-o-ink)}

/* reponses rapides */
.rapides{border-bottom:1px solid var(--line);background:var(--surface)}
.rapides .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}
.rapides .it{background:var(--surface);padding:1.4rem 1.3rem}
.rapides b{display:block;font-family:var(--titre);font-size:.72rem;font-weight:600;letter-spacing:.13em;
  text-transform:uppercase;color:var(--accent);margin-bottom:.4rem}
.rapides p{font-size:.88rem;color:var(--ink-2);line-height:1.6}
@media(max-width:900px){.rapides .wrap{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.rapides .wrap{grid-template-columns:1fr}}

/* corps */
.agrid{display:grid;grid-template-columns:250px 1fr;gap:clamp(2rem,4vw,4rem);
  padding:clamp(2.4rem,5vw,3.6rem) 0 clamp(2.5rem,5vw,4rem);align-items:start}
/* sans min-width:0, une colonne de grille refuse de descendre sous la largeur
   minimale de son contenu : les tableaux feraient alors deborder toute la page */
.agrid > *{min-width:0}
.aside{position:sticky;top:88px;display:grid;gap:1.2rem}
.toc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem 1.4rem}
.toc h2{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:.9rem}
.toc a{display:block;font-size:.85rem;color:var(--ink-2);padding:.42rem 0 .42rem .8rem;
  border-left:2px solid var(--line);transition:var(--t);line-height:1.45}
.toc a:hover{color:var(--primary);border-left-color:var(--primary)}
.toc a.on{color:var(--accent);border-left-color:var(--accent);font-weight:600}
.encart-rdv{background:var(--primary);color:var(--on-primary);border-radius:var(--r);padding:1.4rem}
.encart-rdv b{font-family:var(--titre);font-size:1rem;font-weight:600;display:block;margin-bottom:.5rem}
.encart-rdv p{font-size:.84rem;color:rgba(255,255,255,.85);line-height:1.6;margin-bottom:1.1rem}
:root[data-theme="sombre"] .encart-rdv p{color:rgba(5,32,27,.75)}
.encart-rdv .btn{background:var(--on-primary);color:var(--primary);border-color:var(--on-primary);
  font-size:.84rem;padding:.7rem 1rem}
.encart-rdv .btn:hover{background:transparent;color:var(--on-primary)}
@media(max-width:1000px){.agrid{grid-template-columns:1fr}
  .aside{position:static;grid-template-columns:1fr 1fr}}
@media(max-width:640px){.aside{grid-template-columns:1fr}}

.prose{max-width:70ch}
.prose h2{font-size:clamp(1.35rem,2.6vw,1.8rem);margin:2.6rem 0 .9rem;scroll-margin-top:90px}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.08rem;margin:1.8rem 0 .6rem}
.prose p{margin-bottom:1.1rem;color:var(--ink-2);line-height:1.85}
.prose ul{margin:0 0 1.3rem 0;padding-left:1.3rem;color:var(--ink-2)}
.prose li{margin-bottom:.55rem;line-height:1.8}
.prose li::marker{color:var(--accent)}
.prose strong{color:var(--ink);font-weight:600}
.prose a:not(.btn){color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.prose a:not(.btn):hover{color:var(--accent)}

/* tableaux : display:block + overflow-x pour qu'ils defilent seuls
   sur petit ecran, sans jamais faire deborder la page */
.tbl{display:block;overflow-x:auto;width:100%;margin:1.5rem 0 2rem;
  border-collapse:collapse;font-size:.88rem;-webkit-overflow-scrolling:touch}
.tbl thead th{font-family:var(--titre);font-size:.7rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--accent);text-align:left;padding:.7rem .9rem;
  border-bottom:2px solid var(--line);white-space:nowrap}
.tbl td{padding:.85rem .9rem;border-bottom:1px solid var(--line);color:var(--ink-2);
  line-height:1.6;vertical-align:top;min-width:8.5rem}
.tbl td b{color:var(--ink);font-weight:600;white-space:nowrap}
.tbl tbody tr:hover td{background:var(--surface)}
.tbl tbody tr:last-child td{border-bottom:0}

/* cartes de types de semelles */
.types{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.6rem 0 2rem}
.type{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.3rem 1.4rem}
.type b{font-family:var(--titre);font-size:.98rem;font-weight:600;display:block;margin-bottom:.4rem}
.type span{font-size:.87rem;color:var(--muted);line-height:1.7}
@media(max-width:620px){.types{grid-template-columns:1fr}}

/* etapes numerotees du parcours */
.etapes{display:grid;gap:.75rem;margin:1.6rem 0 2rem}
.etape{display:flex;gap:1.05rem;align-items:flex-start;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);padding:1.05rem 1.2rem;transition:var(--t)}
.etape:hover{transform:translateX(6px);border-color:var(--accent)}
.etape b{font-family:var(--titre);font-size:1.1rem;font-weight:700;color:var(--accent);flex:0 0 auto;width:1.9rem}
.etape strong{font-family:var(--titre);font-size:.95rem;font-weight:600;display:block;margin-bottom:.15rem}
.etape span{font-size:.86rem;color:var(--muted);line-height:1.65}

/* encadres */
.enc{border-radius:var(--r);padding:1.3rem 1.5rem;margin:1.9rem 0;border:1px solid var(--line)}
.enc b{font-family:var(--titre);font-size:.72rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;display:block;margin-bottom:.6rem}
.enc p{margin:0;font-size:.92rem;line-height:1.78}
.enc p + p{margin-top:.8rem}
.enc-note{background:var(--accent-soft);border-color:transparent}
.enc-note b{color:var(--accent)}
.enc-note p{color:var(--ink-2)}
.enc-alerte{background:var(--alerte-soft);border-color:transparent}
.enc-alerte b{color:var(--alerte)}
.enc-alerte p{color:var(--ink-2)}

.cta-inline{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);
  padding:1.8rem;margin:2.4rem 0;display:flex;gap:1.5rem;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cta-inline h3{font-size:1.15rem;margin-bottom:.4rem}
.cta-inline p{font-size:.89rem;color:var(--muted);margin:0;max-width:46ch;line-height:1.65}

details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;margin-bottom:.7rem}
summary{padding:1rem 1.3rem;font-family:var(--titre);font-weight:600;font-size:.94rem;cursor:pointer;
  list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:1.3rem;color:var(--accent);font-weight:400;transition:var(--t)}
details[open] summary::after{transform:rotate(45deg)}
details .rep{padding:0 1.3rem 1.2rem;font-size:.9rem;color:var(--ink-2);line-height:1.78}

/* pathologies liees */
.liees{border-top:1px solid var(--line);padding:clamp(2.4rem,5vw,3.6rem) 0}
.liees h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin-bottom:.6rem}
.liees > .wrap > p{color:var(--muted);font-size:.94rem;margin-bottom:1.8rem;max-width:58ch}
.lgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.lien{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);
  padding:1.5rem 1.4rem;transition:var(--t);display:flex;flex-direction:column}
.lien:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:transparent}
.lien .k{font-family:var(--titre);font-size:.66rem;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin-bottom:.7rem}
.lien h3{font-size:1.05rem;margin-bottom:.5rem}
.lien p{font-size:.85rem;color:var(--muted);line-height:1.65;flex:1}
.lien .go{margin-top:1rem;font-family:var(--titre);font-size:.8rem;font-weight:600;color:var(--primary)}
@media(max-width:860px){.lgrid{grid-template-columns:1fr}}

/* bandeau final */
.final{background:var(--primary);color:var(--on-primary);border-radius:var(--r-l);
  padding:clamp(2rem,4.5vw,3.2rem);display:flex;justify-content:space-between;align-items:center;
  gap:2rem;flex-wrap:wrap;margin-bottom:clamp(2rem,4vw,3rem)}
.final h2{margin:0 0 .5rem;color:var(--on-primary);font-size:clamp(1.4rem,2.8vw,2rem)}
.final p{color:rgba(255,255,255,.82);max-width:50ch;font-size:.97rem}
:root[data-theme="sombre"] .final p{color:rgba(5,32,27,.78)}
.final .btn{background:var(--on-primary);color:var(--primary);border-color:var(--on-primary)}
.final .btn:hover{background:transparent;color:var(--on-primary)}

footer{background:var(--surface);border-top:1px solid var(--line);padding:clamp(2.6rem,5vw,4rem) 0 1.8rem}
.fg{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2.2rem;padding-bottom:2rem;border-bottom:1px solid var(--line)}
footer h5{font-family:var(--titre);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);margin-bottom:1rem}
footer p,footer a{font-size:.87rem;color:var(--ink-2);line-height:1.85;display:block}
footer a:hover{color:var(--primary)}
.fbrand{display:flex;align-items:center;gap:.7rem;margin-bottom:.9rem}
.fl{margin-top:1.4rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  font-size:.76rem;color:var(--muted)}
@media(max-width:900px){.fg{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.fg{grid-template-columns:1fr}}

/* >>> ACCUEIL:RETOUCHES <<< */
/* Premiere section : moins haute et moins aeree. Elle occupait presque tout
   l'ecran avant qu'on voie le moindre contenu. */
.hero{min-height:clamp(360px,52vh,520px);padding:clamp(2rem,4.5vw,3.4rem) 0}
/* L'image etait cadree sur le mur et la fenetre. On descend le cadrage et on
   resserre, pour amener la semelle et l'orthese dans le champ. */
.hero-bg{background-size:118%;background-position:72% 78%}
@media(max-width:900px){.hero-bg{background-size:cover;background-position:68% 82%}}
.hero h1{font-size:clamp(2.1rem,4.8vw,3.5rem);margin-top:1rem}
.hero .lede{margin-top:1.1rem}
.hero .acts{margin-top:1.6rem}
.hero-note{margin-top:1.5rem}

/* Le choix du theme est masque tant que la version sombre n'est pas revue.
   La regle est volontairement facile a retirer. */
.theme{display:none}