/* ============================================================
   KOORTIS — Design system
   Esthétique : premium, corporate, technologique, sobre.
   Base : encre profonde + ivoire + graphite. UN accent : bleu électrique.
   Display : Archivo (large, 500–900). Corps : Inter.
   ============================================================ */

:root{
  /* Couleurs */
  --encre:#0a0a10;          /* noir profond */
  --encre-2:#12121b;        /* panneau sombre */
  --encre-3:#1b1b27;        /* carte sombre */
  --ivoire:#f8f8f9;         /* blanc neutre (fond clair secondaire — plus de beige) */
  --blanc:#ffffff;
  --graphite:#3c3c46;       /* texte secondaire sur clair */
  --gris:#6c6c78;           /* KOO-06 : gris tertiaire densifié, contraste AA (5.2:1) */
  --gris-clair:#e9e9ec;     /* filets sur clair (neutre) */
  --ligne:rgba(10,10,16,.14);
  --ligne-sombre:rgba(244,242,236,.14);
  --accent:#f16722;         /* ORANGE KOORTIS (charte officielle) — accent principal */
  --accent-vif:#ff8a50;     /* orange éclairci sur fond sombre */
  --accent-encre:#8a3a10;
  --orange:#c24a0f;         /* KOO-06 : orange assombri, contraste AA (4.6:1) pour texte < 24px + fonds de boutons. --accent reste #f16722 pour grands titres/décor. */
  --orange-vif:#ff8a50;
  --marine:#1b204f;         /* bleu nuit KOORTIS (charte) — panneaux profonds */

  /* Typo */
  --f-display:"Montserrat","Archivo",system-ui,sans-serif; /* Montserrat = typo de la charte Koortis */
  --f-corps:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;

  /* Échelle display */
  --t-xxl:clamp(2.6rem,7.5vw,7rem);
  --t-h1:clamp(2.4rem,6vw,5rem);
  --t-h2:clamp(1.9rem,4vw,3.4rem);
  --t-h3:clamp(1.3rem,2.2vw,1.9rem);
  --t-lead:clamp(1.05rem,1.5vw,1.3rem);

  /* Layout */
  --contenu:1280px;
  --marge:clamp(20px,4.5vw,64px);
  --section:clamp(84px,11vw,176px);
  --rayon:3px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  font-family:var(--f-corps);
  font-size:16.5px;line-height:1.65;
  color:var(--encre);background:var(--ivoire);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;cursor:pointer;background:none;border:0;color:inherit}
::selection{background:var(--accent);color:#fff}

/* Focus visible — accessibilité clavier */
:focus-visible{outline:2.5px solid var(--accent);outline-offset:3px;border-radius:2px}
.sur-sombre :focus-visible,.section--sombre :focus-visible{outline-color:var(--accent-vif)}

.skip-lien{position:absolute;left:-9999px;top:0;background:var(--orange);color:#fff;padding:10px 18px;z-index:200}
.skip-lien:focus{left:12px;top:12px}

/* ---------- Typo ---------- */
.display,h1,h2,h3,h4{
  font-family:var(--f-display);
  font-weight:800;line-height:1.02;letter-spacing:-.02em;
  text-wrap:balance;
}
.t-xxl{font-size:var(--t-xxl);font-weight:900;line-height:.96;letter-spacing:-.03em;text-transform:uppercase}
h1,.t-h1{font-size:var(--t-h1)}
h2,.t-h2{font-size:var(--t-h2)}
h3,.t-h3{font-size:var(--t-h3);line-height:1.15}
.lead{font-size:var(--t-lead);line-height:1.55;color:var(--graphite);max-width:56ch}
.section--sombre .lead{color:#b9b9c6}
.section--panneau .lead{color:#c3c8e6}
.eyebrow{
  font-family:var(--f-corps);font-size:.72rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--gris);
  display:flex;align-items:center;gap:12px;margin-bottom:22px;
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--orange);flex:0 0 auto}
.section--panneau .eyebrow{color:#9aa0c8}
.accent{color:var(--accent)}
.section--sombre .accent,.section--panneau .accent{color:var(--accent-vif)}

/* ---------- Structure ---------- */
.contenu{max-width:var(--contenu);margin:0 auto;padding:0 var(--marge)}
.section{padding:var(--section) 0}
.section--sombre{background:radial-gradient(1100px 560px at 78% -10%, #161624 0%, var(--encre) 60%);color:var(--ivoire)}
.section--panneau{background:var(--marine);color:var(--ivoire)}
.section--blanc{background:var(--blanc)}
.tete-section{max-width:880px;margin-bottom:clamp(40px,5vw,64px)}
.tete-section .lead{margin-top:18px}
.tete-section h2{max-width:24ch}
.deux-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:start}
@media(max-width:880px){.deux-col{grid-template-columns:1fr}}

/* ---------- Boutons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:12px;
  font-weight:600;font-size:.95rem;letter-spacing:.01em;
  padding:16px 30px;border-radius:var(--rayon);
  border:1.5px solid transparent;
  transition:transform .18s ease,background .18s ease,color .18s ease,border-color .18s ease;
}
.btn:active{transform:translateY(1px)}
.btn .fl{transition:transform .18s ease}
.btn:hover .fl{transform:translateX(4px)}
.btn--plein{background:var(--orange);color:#fff}
.btn--plein:hover{background:#d9540f}
.btn--contour{border-color:var(--ligne);color:var(--encre)}
.btn--contour:hover{border-color:var(--encre)}
.section--sombre .btn--contour,.hero .btn--contour{border-color:var(--ligne-sombre);color:var(--ivoire)}
.section--sombre .btn--contour:hover,.hero .btn--contour:hover{border-color:var(--ivoire)}
.btn--blanc{background:var(--ivoire);color:var(--encre)}
.btn--blanc:hover{background:#fff}
.lien-fl{font-weight:600;display:inline-flex;align-items:center;gap:8px;color:var(--orange)}
.section--sombre .lien-fl{color:var(--accent-vif)}
.lien-fl .fl{transition:transform .18s ease}
.lien-fl:hover .fl{transform:translateX(4px)}

/* ---------- Navigation ---------- */
.topnav{
  position:fixed;inset:0 0 auto 0;z-index:100;
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;
  border-bottom:1px solid transparent;
  color:var(--ivoire);
}
.topnav.solide{background:rgba(10,10,16,.92);backdrop-filter:blur(14px);border-color:var(--ligne-sombre)}
.topnav--clair{color:var(--encre)}
.topnav--clair.solide{background:rgba(244,242,236,.94);border-color:var(--ligne)}
.topnav-in{max-width:var(--contenu);margin:0 auto;padding:0 var(--marge);display:flex;align-items:center;gap:34px;height:76px}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:900;font-size:1.25rem;letter-spacing:.04em}
.logo img{height:31px;width:auto;display:block}
.footer .logo img{height:44px}
@media(max-width:640px){.logo img{height:26px}}
.logo b{color:var(--orange-vif)}
.topnav--clair .logo b{color:var(--orange)}
.nav-liens{display:flex;gap:6px;margin-left:auto}
.nav-item{position:static}
.nav-item>a,.nav-item>button{
  display:flex;align-items:center;gap:6px;padding:10px 14px;font-size:.92rem;font-weight:500;
  opacity:.85;border-radius:var(--rayon);
}
.nav-item>a:hover,.nav-item>button:hover,.nav-item.ouvert>button{opacity:1}
.nav-item .chev{width:9px;height:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.nav-item.ouvert .chev{transform:rotate(-135deg) translateY(-2px)}
.sel-langue{
  margin-left:2px;appearance:none;-webkit-appearance:none;
  background:transparent;color:currentColor;border:1px solid transparent;border-radius:var(--rayon);
  opacity:.75;font:600 .78rem var(--f-corps);letter-spacing:.03em;padding:7px 26px 7px 10px;cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'><path d='M1 1l4 4 4-4' fill='none' stroke='%23f8f8f9' stroke-width='1.6' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;background-position:right 10px center;
}
.sel-langue:hover{opacity:1;border-color:var(--ligne-sombre)}
.sel-langue option{color:var(--encre);background:#fff}
.topnav--clair .sel-langue{border-color:var(--ligne);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'><path d='M1 1l4 4 4-4' fill='none' stroke='%230a0a10' stroke-width='1.6' stroke-linecap='round'/></svg>")}
@media(max-width:940px){.sel-langue{margin-left:0;padding:6px 20px 6px 6px;font-size:.7rem}.topnav-in{gap:12px}}
.rang-secteurs{display:flex;flex-wrap:wrap;gap:12px 14px}
.secteur-chip{
  display:inline-flex;align-items:center;gap:10px;
  padding:11px 18px;border:1px solid var(--ligne);border-radius:99px;background:var(--blanc);
  font-weight:600;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--graphite);
  transition:border-color .2s ease,transform .2s ease;
}
a.secteur-chip{text-decoration:none}
.secteur-chip:hover{border-color:var(--accent);transform:translateY(-2px)}
a.secteur-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-color:var(--accent)}
.secteur-chip img{width:22px;height:22px}
@media(max-width:640px){.secteur-chip{padding:9px 14px;font-size:.72rem;gap:8px}.secteur-chip img{width:18px;height:18px}}
.continents{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,44px);max-width:640px}
@media(max-width:560px){.continents{grid-template-columns:1fr}}
.continent{border-left:2px solid var(--gris-clair);padding-left:clamp(16px,2vw,24px)}
.continent h4{font-family:var(--f-corps);font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gris);margin-bottom:12px}
.cv-ville{display:flex;align-items:center;gap:10px;padding:5px 0;font-weight:600;color:var(--encre);font-size:1.02rem}
.cv-ville--avenir{color:var(--gris);font-weight:500}
.cv-ville small{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gris);border:1px solid var(--gris-clair);border-radius:99px;padding:2px 8px;margin-left:2px}
.cv-plein{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:0 0 auto}
.cv-creux{width:9px;height:9px;border-radius:50%;border:2px solid var(--accent);opacity:.55;flex:0 0 auto}
/* Localisations : même vocabulaire partout (point plein = bureau, cercle creux = à venir) */
.lieux{display:flex;flex-direction:column;gap:6px;margin-top:14px}
.lieux-groupe{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding-left:72px}
.lieux-continent{position:absolute;left:0;top:7px;font-size:.65rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gris)}
.lieux .cv-ville{font-size:.88rem;padding:2px 0;font-weight:500}
.lieux .cv-ville small{font-size:.62rem;padding:1px 7px}
.lieux--compact{gap:4px;margin-top:12px}
.lieux--compact .lieux-groupe{display:block;padding-left:0}
.lieux--compact .lieux-continent{position:static;display:block;margin-bottom:1px}
.lieux--compact .cv-ville{display:inline-flex;margin-right:12px}
.lieux--compact .cv-ville{font-size:.82rem}
.lieux-note{display:flex;align-items:flex-start;gap:9px;margin-top:5px;font-size:.78rem;line-height:1.45;color:var(--gris)}
.lieux-note .cv-creux{margin-top:5px}
.footer .lieux .cv-ville{color:rgba(248,248,249,.9)}
.footer .lieux .cv-ville--avenir{color:#8b8b96}
.footer .lieux .cv-ville small{border-color:rgba(244,242,236,.2);color:#8b8b96}
.nav-cta{margin-left:auto}
.nav-cta .btn{padding:11px 22px}

/* Mega-menu */
.mega{
  position:absolute;top:100%;left:0;right:0;
  background:rgba(10,10,16,.97);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  color:var(--ivoire);border-top:1px solid var(--ligne-sombre);
  padding:clamp(30px,3.2vw,46px) max(var(--marge),calc((100% - var(--contenu))/2 + var(--marge)));
  display:grid;grid-template-columns:1.7fr 1fr;gap:clamp(30px,4vw,72px);align-items:stretch;
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .26s ease,transform .3s cubic-bezier(.2,.65,.25,1),visibility .3s;
  box-shadow:0 34px 90px rgba(0,0,0,.5);
}
.nav-item.ouvert .mega{opacity:1;visibility:visible;transform:translateY(0)}
.mega-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,3vw,54px);align-content:start}
.mega-col h4{grid-column:1/-1;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gris);margin-bottom:16px;font-family:var(--f-corps);font-weight:600}
.mega-col a{display:flex;align-items:center;gap:10px;padding:9px 0;font-size:.95rem;opacity:.82;transition:opacity .18s ease,color .18s ease,transform .22s cubic-bezier(.2,.65,.25,1)}
.mega-col a::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent-vif);opacity:0;transition:opacity .18s ease;flex:0 0 auto}
.mega-col a:hover{opacity:1;transform:translateX(3px)}
.mega-col a:hover::before{opacity:1}
.mega-col a:hover{opacity:1;color:var(--accent-vif)}
.mega-mise{
  position:relative;overflow:hidden;border-radius:var(--rayon);
  background:var(--encre-3) center/cover no-repeat;
  min-height:210px;padding:24px;display:flex;flex-direction:column;gap:10px;justify-content:flex-end;
}
.mega-mise::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,16,.2) 0%,rgba(10,10,16,.55) 45%,rgba(10,10,16,.92) 100%)}
.mega-mise > *{position:relative;z-index:1}
.mega-mise p{font-size:.88rem;line-height:1.6;color:#d3d3de}

/* Navigation principale visible en grand écran (le lanceur reste pour le site complet) */
.nav-liens{display:none}
@media(min-width:1200px){.nav-liens{display:flex}}
.nav-glisse{
  position:absolute;left:0;bottom:16px;height:2px;width:0;background:var(--accent-vif);
  opacity:0;pointer-events:none;
  transition:transform .34s cubic-bezier(.2,.65,.25,1),width .34s cubic-bezier(.2,.65,.25,1),opacity .2s ease;
}
.nav-liens.glisse-on .nav-glisse{opacity:1}
.topnav:has(.nav-item.ouvert){background:rgba(10,10,16,.97);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-color:var(--ligne-sombre);color:var(--ivoire)}

/* Lanceur (9 points) : le site complet en un panneau */
.burger{display:flex;align-items:center;justify-content:center;margin-left:4px;padding:10px;border-radius:var(--rayon)}
.burger svg{width:26px;height:26px;transition:transform .3s cubic-bezier(.2,.65,.25,1),color .2s}
.burger:hover svg{color:var(--accent-vif)}
body.menu-ouvert .burger svg{transform:rotate(45deg);color:var(--accent-vif)}
body.menu-ouvert{overflow:hidden}
body.menu-ouvert .topnav{background:var(--marine);color:var(--ivoire);border-color:rgba(255,255,255,.14);-webkit-backdrop-filter:none;backdrop-filter:none} /* retour 06/09 : le backdrop-filter de .solide faisait du header le bloc conteneur du menu fixe → menu invisible après scroll ; fond marine (charte bleu/blanc/orange) */

/* Grand panneau (≥ 941px) */
.grand-menu{
  position:fixed;inset:76px 0 0 0;z-index:99;display:none;
  background:var(--marine);
  color:var(--ivoire);overflow-y:auto;
}
@media(min-width:941px){
  body.menu-ouvert .grand-menu{display:block;animation:gm-entree .35s cubic-bezier(.2,.65,.25,1)}
}
@keyframes gm-entree{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:translateY(0)}}
.grand-menu-in{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr 1.15fr;gap:clamp(28px,3.5vw,56px);padding-top:64px;padding-bottom:64px}
.gm-col h4{font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--orange-vif);margin-bottom:16px}
.gm-col .gm-h4-suite{margin-top:30px}
.gm-col a{display:block;padding:7px 0;color:#c9c9d6;font-size:.98rem;transition:color .15s,transform .2s}
.gm-col a:hover{color:#fff;transform:translateX(4px)}
.gm-mise{border-left:1px solid var(--ligne-sombre);padding-left:clamp(24px,2.5vw,44px)}
.gm-mise p{color:#b9b9c6;line-height:1.6;margin-bottom:22px}
.gm-mise .btn{white-space:nowrap}
.gm-mise strong{color:var(--ivoire)}

.tiroir{display:none}
@media(max-width:960px){
  .nav-liens,.nav-cta{display:none}
  .burger{margin-left:auto}
  .tiroir{
    display:block;position:fixed;inset:76px 0 0 0;z-index:99;background:var(--marine);color:var(--ivoire);
    padding:20px var(--marge) 60px;overflow-y:auto;
    opacity:0;visibility:hidden;transition:opacity .25s;
  }
  body.menu-ouvert .tiroir{opacity:1;visibility:visible}
  .tiroir details{border-bottom:1px solid var(--ligne-sombre)}
  .tiroir summary{
    list-style:none;display:flex;justify-content:space-between;align-items:center;
    padding:18px 0;font-family:var(--f-display);font-weight:700;font-size:1.15rem;cursor:pointer;
  }
  .tiroir summary::-webkit-details-marker{display:none}
  .tiroir summary .chev{width:10px;height:10px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .2s}
  .tiroir details[open] summary .chev{transform:rotate(-135deg)}
  .tiroir details a{display:block;padding:10px 0 10px 4px;color:#b9b9c6}
  .tiroir details a:hover{color:#fff}
  .tiroir>a.direct{display:block;padding:18px 0;font-family:var(--f-display);font-weight:700;font-size:1.15rem;border-bottom:1px solid var(--ligne-sombre)}
  .tiroir .btn{margin-top:26px;width:100%;justify-content:center}
}

/* ---------- Diaporama d'arrière-plan (Ken Burns + fondu) ---------- */
.hero-diapos{position:absolute;inset:0;overflow:hidden}
.diapo{
  position:absolute;inset:0;background-size:cover;background-position:center;
  opacity:0;animation:fondu-diapo 64s linear infinite;will-change:opacity,transform;
}
.diapo:nth-child(2){animation-delay:8s}
.diapo:nth-child(3){animation-delay:16s}
.diapo:nth-child(4){animation-delay:24s}
.diapo:nth-child(5){animation-delay:32s}
.diapo:nth-child(6){animation-delay:40s}
.diapo:nth-child(7){animation-delay:48s}
.diapo:nth-child(8){animation-delay:56s}
@keyframes fondu-diapo{
  0%{opacity:0;transform:scale(1.02)}
  2.3%{opacity:1}
  12.5%{opacity:1;transform:scale(1.09)}
  16.2%{opacity:0;transform:scale(1.11)}
  100%{opacity:0;transform:scale(1.02)}
}
/* Mode jour : photos claires assumées — voile allégé en haut, dégradé bas conservé pour la bande hero-bas */
body.jour .hero-voile{background:linear-gradient(180deg,rgba(10,10,16,.18) 0%,rgba(10,10,16,.05) 45%,rgba(10,10,16,.82) 100%)}
body.jour .diapo--photo{filter:brightness(.9) saturate(.98)}
.diapo--photo{filter:brightness(.68) saturate(.82) contrast(1.03)}
.diapo--photo::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(160deg,rgba(27,32,79,.4) 0%,rgba(10,10,16,.12) 52%,rgba(241,103,34,.18) 100%);
}
/* Duotone très atténué en jour (les photos de jour gardent leurs couleurs) */
body.jour .diapo--photo::after{
  background:linear-gradient(160deg,rgba(27,32,79,.16) 0%,rgba(10,10,16,.04) 52%,rgba(241,103,34,.08) 100%);
}
/* L'étiquette dans l'image est remplacée par la ligne d'avant-plan synchronisée (.hero-lieux) */
.diapo-nom{display:none}
@media (prefers-reduced-motion:reduce){
  .diapo{animation:none}
  .diapo:first-child{opacity:1}
}

/* ---------- Légende du diaporama : coin supérieur droit, vient et disparaît avec l'image ---------- */
.hero-legende{
  position:absolute;top:104px;right:var(--marge);z-index:3;pointer-events:none;
  display:flex;flex-direction:column;align-items:flex-end;gap:11px;
}
.hl-noms{
  position:relative;height:1.35em;min-width:300px;text-align:right;
  font-size:.78rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--ivoire);
  text-shadow:0 1px 14px rgba(5,6,12,.55);
}
.hl-noms span{
  position:absolute;right:0;top:0;display:inline-flex;align-items:center;gap:10px;white-space:nowrap;
  opacity:0;animation:mot-diapo 64s linear infinite;
}
.hl-noms span::after{content:"";width:8px;height:8px;background:var(--accent-vif);border-radius:1px;flex:0 0 auto}
.hl-noms span:nth-child(2){animation-delay:8s}
.hl-noms span:nth-child(3){animation-delay:16s}
.hl-noms span:nth-child(4){animation-delay:24s}
.hl-noms span:nth-child(5){animation-delay:32s}
.hl-noms span:nth-child(6){animation-delay:40s}
.hl-noms span:nth-child(7){animation-delay:48s}
.hl-noms span:nth-child(8){animation-delay:56s}
.hl-points{display:flex;gap:7px}
.hl-points i{
  width:5px;height:5px;border-radius:50%;background:rgba(248,248,249,.32);
  animation:point-diapo 64s linear infinite;
}
.hl-points i:nth-child(2){animation-delay:8s}
.hl-points i:nth-child(3){animation-delay:16s}
.hl-points i:nth-child(4){animation-delay:24s}
.hl-points i:nth-child(5){animation-delay:32s}
.hl-points i:nth-child(6){animation-delay:40s}
.hl-points i:nth-child(7){animation-delay:48s}
.hl-points i:nth-child(8){animation-delay:56s}
@keyframes point-diapo{
  0%{background:var(--accent-vif);transform:scale(1.4)}
  12.4%{background:var(--accent-vif);transform:scale(1.4)}
  12.5%{background:rgba(248,248,249,.32);transform:scale(1)}
  100%{background:rgba(248,248,249,.32);transform:scale(1)}
}
@media(max-width:640px){
  .hero-legende{top:92px;right:16px;gap:8px}
  .hl-noms{font-size:.62rem;min-width:0}
}
/* Fenêtres resserrées par rapport aux images : le libellé sortant a fini de
   disparaître (13.3 %) avant l'entrée du suivant (delay + 1.5 %) : jamais deux textes superposés */
@keyframes mot-diapo{
  0%{opacity:0;transform:translateY(9px)}
  1.5%{opacity:0;transform:translateY(9px)}
  3.1%{opacity:1;transform:translateY(0)}
  11.7%{opacity:1;transform:translateY(0)}
  13.3%{opacity:0;transform:translateY(-7px)}
  100%{opacity:0;transform:translateY(9px)}
}
@media (prefers-reduced-motion:reduce){
  .hl-noms span,.hl-points i{animation:none}
  .hl-noms span:first-child{opacity:1}
  .hl-points i:first-child{background:var(--accent-vif)}
}

/* ---------- Bande image pleine largeur ---------- */
.bande-image{
  position:relative;height:clamp(260px,34vw,460px);
  background-size:cover;background-position:center;
  border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);
}
.bande-image>span{
  position:absolute;bottom:22px;left:var(--marge);
  font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ivoire);
  padding:10px 16px;border:1px solid var(--ligne-sombre);border-radius:99px;background:rgba(10,10,16,.5);backdrop-filter:blur(8px);
}

/* ---------- Hero ---------- */
.hero{
  position:relative;min-height:min(100svh,980px);display:flex;align-items:flex-end;
  background:var(--encre);color:var(--ivoire);overflow:hidden;
}
.hero-fond{position:absolute;inset:0;pointer-events:none}
.hero-fond canvas{width:100%;height:100%}
.hero-voile{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,16,.16) 0%,rgba(10,10,16,0) 45%,rgba(10,10,16,.82) 100%);pointer-events:none}
.hero-in{position:relative;width:100%;padding-block:170px clamp(56px,8vh,110px)}
.hero .eyebrow{color:#9a9aa8}
.hero-titre{max-width:14ch}
.hero-sous{margin-top:28px;max-width:52ch;font-size:var(--t-lead);color:#c4c4d0;line-height:1.55}
.hero-actions{margin-top:40px;display:flex;gap:16px;flex-wrap:wrap}
/* Carte de message opaque, façon grand cabinet : le titre vit dans un panneau marine posé sur l'image */
.hero-carte{
  position:relative;max-width:520px;
  background:rgba(27,32,79,.94);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  transition:background .45s ease,-webkit-backdrop-filter .45s ease,backdrop-filter .45s ease;
  border-radius:var(--rayon);
  padding:clamp(22px,2.5vw,32px) clamp(20px,2.3vw,34px) clamp(24px,2.6vw,34px);
  box-shadow:0 30px 80px rgba(5,6,20,.55);
}
.hero-carte::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--orange),var(--orange-vif));
  border-radius:var(--rayon) 0 0 var(--rayon);
}
/* Entrée animée + saisie à la souris (desktop) */
@keyframes entree-carte{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.hero-carte{animation:entree-carte .9s cubic-bezier(.2,.65,.25,1) .15s backwards}
@media (hover:hover){
  .hero-carte:hover{background:rgba(27,32,79,.58);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
}
.hero-carte.deplacable{cursor:grab;touch-action:none}
.hero-carte.en-main{cursor:grabbing;user-select:none;box-shadow:0 42px 110px rgba(5,6,12,.65)}
.hero-carte.retour{transition:transform .5s cubic-bezier(.2,.65,.25,1)}

/* Rotor du titre : la 2e ligne alterne entre les phrases du script #phrases-rotor
   (index.html), pilotées par assets/main.js, 4 s par phrase. Sans JS : la seule
   phrase présente dans le HTML reste affichée, statique (opacité pleine par défaut).
   La hauteur est portée par .hero-rotor (taille de base) : elle ne bouge jamais.
   L'item est ancré en bas avec line-height:1 → une phrase réduite par l'ajustement
   automatique (font-size inline posée par le JS) garde la même ligne de base. */
.hero-rotor{display:block;position:relative;height:1.02em;overflow:visible}
.rotor-item{position:absolute;left:0;bottom:0;white-space:nowrap;line-height:1;transform-origin:left 78%}
.rotor-item.anime{animation:rotor 7s cubic-bezier(.3,.6,.3,1) both}
/* Taille vivante (un cycle de 4 s, relancé par le JS à chaque phrase) :
   entre en grandissant, respire pendant la tenue, sort en s'élevant */
@keyframes rotor{
  0%{opacity:0;transform:translateY(.42em) scale(.94)}
  14%{opacity:1;transform:translateY(0) scale(1)}
  50%{transform:translateY(0) scale(1.022)}
  86%{opacity:1;transform:translateY(0) scale(1)}
  100%{opacity:0;transform:translateY(-.38em) scale(1.05)}
}
@media (prefers-reduced-motion:reduce){
  .hero-carte{animation:none}
  .rotor-item.anime{animation:none}
}
.hero-carte .eyebrow{color:#aeb3d9}
.hero-carte .hero-titre{font-size:clamp(1.55rem,2.3vw,2.3rem);max-width:16ch}
.hero-carte .hero-sous{margin-top:16px;font-size:clamp(.93rem,1.05vw,1rem);line-height:1.6}
.hero-carte .hero-actions{margin-top:24px;gap:12px}.hero-carte .btn{padding:13px 21px;font-size:.9rem}
.hero-bas{
  position:relative;margin-top:clamp(40px,7vh,80px);
  border-top:1px solid var(--ligne-sombre);
  display:flex;flex-wrap:wrap;
}
.service-lien{
  position:relative;display:inline-flex;align-items:center;gap:10px;
  padding:18px clamp(14px,1.8vw,28px) 16px;
  font-size:.76rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;
  color:rgba(248,248,249,.78);transition:color .25s ease;
}
.service-lien img{width:17px;height:17px;filter:brightness(0) invert(1);opacity:.65;transition:opacity .25s ease}
/* ≥ 641px : grille équilibrée (2 rangées de 3 / 3 de 2) — séparateurs par bordures,
   celles du bord de rangée sont escamotées par le débord négatif + overflow:hidden
   (jamais de filet orphelin en début de ligne, quelle que soit la langue) */
@media(min-width:481px){
  .hero-bas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden}
  .service-lien{border-left:1px solid rgba(244,242,236,.1);border-top:1px solid rgba(244,242,236,.1);margin:-1px 0 0 -1px}
  .service-lien::before{top:1px}
}
@media(min-width:1101px){.hero-bas{grid-template-columns:repeat(3,minmax(0,1fr))}}
.service-lien::before{
  content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--accent-vif);
  transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.65,.25,1);
}
.service-lien:hover{color:#fff}
.service-lien:hover img{opacity:1}
.service-lien:hover::before{transform:scaleX(1)}
@media(max-width:480px){.service-lien{padding:12px 14px 11px;font-size:.66rem;gap:8px}.service-lien img{width:14px;height:14px}}

/* Hero de page intérieure — sombre, profond */
.hero-page{
  background:radial-gradient(1100px 560px at 75% -12%, #171725 0%, var(--encre) 58%);
  color:var(--ivoire);padding:196px 0 clamp(56px,7vw,104px);position:relative;overflow:hidden;
}
.hero-page .eyebrow{color:#9a9aa8}
.hero-page h1{max-width:18ch}
.hero-page .lead{color:#c4c4d0;margin-top:26px}
.hero-page .filaire{
  position:absolute;right:-140px;top:-140px;width:560px;height:560px;opacity:.5;pointer-events:none;
}
.fil-ariane{display:flex;gap:10px;font-size:.8rem;color:#8b8b96;margin-bottom:30px;flex-wrap:wrap}
.fil-ariane a:hover{color:var(--ivoire)}
.fil-ariane li+li::before{content:"/";margin-right:10px;opacity:.5}


/* ---------- Audace : manifeste plein écran ---------- */
.manifeste{background:radial-gradient(1100px 560px at 25% -12%, #171725 0%, var(--encre) 58%);color:var(--ivoire);position:relative;overflow:hidden}
.manifeste .contenu{position:relative}
.manifeste h2{
  font-size:clamp(2.2rem,4.8vw,4.4rem);font-weight:800;line-height:1.08;
  letter-spacing:-.02em;max-width:26ch;text-wrap:balance;
}
.manifeste .lead{margin-top:28px;color:#b9b9c6}
.manifeste .signe{
  position:absolute;right:-60px;top:-90px;font-family:var(--f-display);font-weight:900;
  font-size:clamp(16rem,32vw,30rem);line-height:1;color:transparent;
  -webkit-text-stroke:2px rgba(241,103,34,.35);pointer-events:none;user-select:none;
}

/* ---------- Bandeau de confiance / stats ---------- */
.bande-preuves{border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne);background:var(--blanc)}
.preuves-in{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.preuve{padding:clamp(28px,3.5vw,48px) clamp(18px,2.5vw,40px);border-left:1px solid rgba(10,10,16,.09)}
.preuve:first-child{border-left:0}
.preuve .chiffre{flex-wrap:wrap;font-family:var(--f-display);font-weight:900;font-size:clamp(2rem,3.6vw,3.2rem);letter-spacing:-.01em;line-height:1;display:flex;align-items:baseline;gap:3px;font-variant-numeric:tabular-nums}
.preuve .chiffre .unite{font-size:.5em;color:var(--orange);letter-spacing:0}
.preuve p{margin-top:12px;font-size:.86rem;color:var(--graphite);max-width:30ch}
@media(max-width:880px){.preuves-in{grid-template-columns:1fr 1fr}.preuve:nth-child(odd){border-left:0}.preuve{border-top:1px solid rgba(10,10,16,.09)}.preuve:nth-child(-n+2){border-top:0}}

.rang-logos{display:flex;align-items:center;column-gap:clamp(28px,4vw,64px);row-gap:16px;flex-wrap:wrap;opacity:.55}
.rang-logos .marque-logo{font-family:var(--f-display);font-weight:800;font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
/* Dans une carte (références), les libellés sont des phrases : autoriser le retour à la ligne (sinon débordement mobile) */
.carte .rang-logos .marque-logo{white-space:normal}

/* ---------- Cartes ---------- */
.grille-cartes{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ligne);border:1px solid var(--ligne)}
.section--sombre .grille-cartes,.section--panneau .grille-cartes{background:var(--ligne-sombre);border-color:var(--ligne-sombre)}
.grille-cartes--2{grid-template-columns:repeat(2,1fr)}
/* Quatre associés : 4 colonnes pleines (pas de cellule vide en fin de ligne) et
   cartes courtes, puisqu'elles ne portent qu'un intitulé et un nom. */
.grille-cartes--4{grid-template-columns:repeat(4,1fr)}
.grille-cartes--4 .carte{min-height:0;gap:10px;padding-top:clamp(24px,2.4vw,32px);padding-bottom:clamp(24px,2.4vw,32px)}
/* L'intitulé peut passer sur deux lignes selon la largeur ; on lui réserve la hauteur de
   deux lignes pour que les quatre noms restent alignés, sans jamais déborder de la carte. */
.grille-cartes--4 .num{font-size:.66rem;letter-spacing:.1em;line-height:1.3;min-height:2.6em}
@media (max-width:1000px){.grille-cartes--4 .num{min-height:0}}
/* Portrait des associés. Les sources vont de 252 à 420 px : le cercle est dimensionné
   pour rester net sur écran Retina sans agrandir la plus petite photo. */
/* Portrait à fond perdu : il occupe toute la largeur du haut de la carte. Aucun contour
   n'apparaît puisque la photo N'EST PAS posée sur la carte, elle en est le sommet. C'est le
   seul traitement qui tienne avec neuf prises de vue faites dans neuf pièces différentes. */
.grille-cartes--4 .carte{--pad-carte:24px;padding:0 var(--pad-carte) 26px;overflow:hidden}
.carte-portrait{display:block;width:calc(100% + var(--pad-carte)*2);max-width:none;
  margin:0 calc(var(--pad-carte)*-1) 20px;height:auto;
  aspect-ratio:1/1;object-fit:cover;object-position:50% 50%;
  filter:saturate(.92) contrast(1.02);background:var(--ligne)}
.grille-cartes--4 .carte p{font-size:.86rem;line-height:1.55;flex:0 0 auto}
/* Nom et prénom sur UNE seule ligne pour les neuf fiches : mesuré, 1.3rem est la plus
   grande taille qui fasse tenir le plus long (« Abdoulaye Diawara ») dans la carte la plus
   étroite. Plus de réserve de hauteur, puisqu'il n'y a plus qu'une ligne. */
.grille-cartes--4 .carte h3{font-size:1.3rem;line-height:1.2;min-height:0}
/* ——— Équipe : galerie éditoriale (portraits monochromes, 4:5, filet orange, couleur au survol) ——— */
.equipe{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 30px;margin-top:8px}
.equipe--5{grid-template-columns:repeat(5,minmax(0,1fr));gap:30px 22px}
/* 9 experts dans une même architecture (diagnostic 09/2026) : 3 colonnes, fiche = domaine → nom → expertises */
.equipe--9{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 30px}
.equipe--9 .equipe-role{margin-top:0}
.equipe--9 h3{font-size:1.32rem}
@media (max-width:980px){.equipe--9{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.equipe--9{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.equipe--9 h3{font-size:1.05rem}}
/* Schéma de gouvernance projet (page Approche) */
.gouv{display:flex;flex-direction:column;align-items:stretch;gap:0;margin-top:8px}
.gouv-niv{display:grid;gap:14px;position:relative;padding-top:22px}
.gouv-niv:first-child{padding-top:0}
.gouv-niv::before{content:"";position:absolute;left:50%;top:0;width:2px;height:22px;background:var(--accent)}
.gouv-niv:first-child::before{display:none}
.gouv-niv--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.gouv-niv--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.gouv-boite{background:var(--blanc);border:1px solid var(--ligne);border-radius:6px;padding:16px 18px;display:flex;flex-direction:column;gap:6px;min-height:92px}
.gouv-boite b{font-family:var(--f-display);font-size:1rem;color:var(--encre)}
.gouv-boite span{font-size:.84rem;color:var(--gris);line-height:1.45}
.gouv-boite--top{background:var(--encre);border-color:var(--encre);max-width:520px;margin:0 auto;width:100%;text-align:center}
.gouv-boite--top b{color:#fff}.gouv-boite--top span{color:rgba(255,255,255,.75)}
@media (max-width:900px){.gouv-niv--5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.gouv-niv--2,.gouv-niv--5{grid-template-columns:1fr}}
.equipe-fiche{display:flex;flex-direction:column;min-width:0}
.equipe-portrait{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--gris-clair);border-radius:3px}
.equipe-portrait img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 0;
  filter:none;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.equipe-fiche:hover .equipe-portrait img,.equipe-fiche:focus-within .equipe-portrait img{transform:scale(1.035)}
.equipe-portrait::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--accent);
  transform:scaleX(.26);transform-origin:left;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.equipe-fiche:hover .equipe-portrait::after{transform:scaleX(1)}
.equipe-role{margin:0 0 12px;font-family:var(--f-corps);font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.equipe-portrait+h3{margin-top:16px}
.equipe-fiche h3{margin:0;font-family:var(--f-display);font-size:1.28rem;line-height:1.12;letter-spacing:-.01em;min-height:0}
.equipe--5 .equipe-fiche h3{font-size:1.08rem}
.equipe--5 .equipe-role{font-size:.64rem;letter-spacing:.12em;white-space:nowrap}
.equipe-fiche p{margin:7px 0 0;color:var(--gris);font-size:.9rem;line-height:1.5}
@media (max-width:980px){.equipe{grid-template-columns:repeat(2,minmax(0,1fr))}.equipe--5{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.equipe,.equipe--5{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.equipe-fiche h3,.equipe--5 .equipe-fiche h3{font-size:1.05rem}}
@media (prefers-reduced-motion:reduce){.equipe-portrait img,.equipe-portrait::after{transition:none}.equipe-fiche:hover .equipe-portrait img{transform:none}}
@media (max-width:1200px){.grille-cartes--4 .carte h3{font-size:1.12rem}}
@media (max-width:520px){.grille-cartes--4 .carte h3{font-size:1.3rem}}
/* Équipe : cartes autonomes et colonnes automatiques, pour que la grille reste juste
   quel que soit l'effectif (une cellule vide laisserait apparaître un aplat gris). */
/* Cinq colonnes : les cinq membres tiennent sur une seule ligne, personne n'est isolé.
   Les cartes sont donc un peu plus étroites que celles de la direction. */
.grille-equipe{grid-template-columns:repeat(5,1fr);background:transparent;border:0;gap:12px}
.grille-equipe .carte{--pad-carte:18px}
@media (max-width:1100px){.grille-equipe{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.grille-equipe{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.grille-equipe{grid-template-columns:1fr}}
.grille-equipe .carte{border:1px solid var(--ligne)}
@media (max-width:560px){.grille-equipe{grid-template-columns:1fr}}
@media (max-width:1000px){.grille-cartes--4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.grille-cartes--4{grid-template-columns:1fr}}
@media(max-width:960px){.grille-cartes{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.grille-cartes{grid-template-columns:1fr}}
.carte{
  position:relative;background:var(--ivoire);padding:clamp(26px,3vw,42px);
  display:flex;flex-direction:column;gap:14px;min-height:240px;
  transition:background .22s ease,transform .22s ease,box-shadow .22s ease;
}
a.carte:hover{transform:translateY(-4px);z-index:1;box-shadow:0 18px 44px rgba(10,10,16,.12)}
.section--sombre a.carte:hover,.section--panneau a.carte:hover{box-shadow:0 22px 50px rgba(0,0,0,.4)}
.section--blanc .carte{background:var(--blanc)}
.section--sombre .carte{background:var(--encre-2)}
.section--panneau .carte{background:#151b45}
.carte .num{font-size:.72rem;font-weight:600;letter-spacing:.18em;color:var(--orange)}
.section--sombre .carte .num,.section--panneau .carte .num{color:var(--orange-vif)}
.carte h3{transition:color .22s ease}
.carte p{font-size:.93rem;color:var(--graphite);flex:1}
.section--sombre .carte p,.section--panneau .carte p{color:#b9b9c6}
.carte .fl-coin{
  position:absolute;top:26px;right:26px;width:34px;height:34px;border:1px solid var(--ligne);border-radius:50%;
  display:grid;place-items:center;font-size:.9rem;
  transition:background .22s ease,color .22s ease,transform .22s cubic-bezier(.2,.65,.25,1),border-color .22s ease;
}
.section--sombre .carte .fl-coin,.section--panneau .carte .fl-coin{border-color:var(--ligne-sombre)}
a.carte:hover{background:var(--blanc)}
.section--sombre a.carte:hover{background:var(--encre-3)}
.section--panneau a.carte:hover{background:#1f2658}
a.carte:hover h3{color:var(--accent)}
.section--sombre a.carte:hover h3,.section--panneau a.carte:hover h3{color:var(--accent-vif)}
a.carte:hover .fl-coin{background:var(--orange);border-color:var(--orange);color:#fff;transform:rotate(-45deg)}
.carte .tags{display:flex;gap:8px;flex-wrap:wrap}
.tag{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border:1px solid var(--ligne);border-radius:99px;color:var(--graphite)}
.section--sombre .tag,.section--panneau .tag{border-color:var(--ligne-sombre);color:#b9b9c6}

/* ---------- Listes clé-valeur / fiches ---------- */
.fiche{border-top:1px solid var(--ligne)}
.section--sombre .fiche{border-color:var(--ligne-sombre)}
.fiche-ligne{display:grid;grid-template-columns:220px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--ligne)}
.section--sombre .fiche-ligne{border-color:var(--ligne-sombre)}
.fiche-ligne dt{font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gris);padding-top:4px}
.fiche-ligne dd p{color:var(--graphite);font-size:.95rem}
.section--sombre .fiche-ligne dd p{color:#b9b9c6}
@media(max-width:640px){.fiche-ligne{grid-template-columns:1fr;gap:6px}}

/* ---------- Étapes / méthodologie ---------- */
.etapes{counter-reset:etape;display:grid;gap:0;border-top:1px solid var(--ligne)}
.section--sombre .etapes{border-color:var(--ligne-sombre)}
.etape{
  display:grid;grid-template-columns:110px 1fr 1.4fr;gap:clamp(16px,3vw,48px);
  padding:clamp(26px,3.5vw,44px) 0;border-bottom:1px solid var(--ligne);align-items:start;
}
.section--sombre .etape{border-color:var(--ligne-sombre)}
.etape .no{font-family:var(--f-display);font-weight:900;font-size:clamp(1.6rem,2.6vw,2.4rem);color:var(--orange);line-height:1}
.section--sombre .etape .no{color:var(--orange-vif)}
.etape h3{max-width:12ch}
.etape p{color:var(--graphite);font-size:.95rem}
.section--sombre .etape p{color:#b9b9c6}
@media(max-width:820px){.etape{grid-template-columns:64px 1fr}.etape p{grid-column:2}}

/* ---------- Chaîne de transformation ---------- */
.chaine{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-family:var(--f-display);font-weight:700;font-size:clamp(1rem,2vw,1.5rem);letter-spacing:.01em}
.chaine .maillon{padding:12px 20px;border:1px solid var(--ligne-sombre);border-radius:99px;white-space:nowrap}
.chaine .maillon.actif{background:var(--accent);border-color:var(--accent);color:#fff}
.chaine .lien-ch{color:var(--orange-vif);font-weight:400}
/* Groupe insécable « → maillon » : au repli, la flèche ouvre la ligne suivante
   au lieu de rester orpheline en fin de rangée */
.chaine .chaine-seg{display:inline-flex;align-items:center;gap:10px}

/* ---------- Écosystème SAP ---------- */
.eco-sap{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.puce-sap{
  border:1px solid var(--ligne-sombre);border-radius:var(--rayon);padding:16px 18px;
  font-size:.9rem;font-weight:600;display:flex;align-items:center;gap:10px;color:#d5d5de;
  transition:border-color .2s,color .2s,background .2s;
}
.puce-sap::before{content:"";width:7px;height:7px;background:var(--orange-vif);flex:0 0 auto;border-radius:1px}
.puce-sap:hover{border-color:var(--accent-vif);color:#fff;background:var(--encre-3)}
/* Variante claire des puces et de la chaîne */
.section--blanc .puce-sap,.section:not(.section--sombre):not(.section--panneau) .puce-sap{border-color:var(--ligne);color:var(--graphite)}
.section--blanc .puce-sap:hover,.section:not(.section--sombre):not(.section--panneau) .puce-sap:hover{border-color:var(--accent);color:var(--encre);background:var(--ivoire)}
.section--blanc .chaine .maillon,.section:not(.section--sombre):not(.section--panneau) .chaine .maillon{border-color:var(--ligne)}
.section--blanc .chaine .maillon.actif,.section:not(.section--sombre):not(.section--panneau) .chaine .maillon.actif{border-color:var(--accent)}
.section--blanc .chaine .lien-ch,.section:not(.section--sombre):not(.section--panneau) .chaine .lien-ch{color:var(--orange)}

/* ---------- Signature animée « Allions nos forces » ---------- */
.anneaux{width:min(300px,58vw);height:auto;margin:0 auto 30px;display:block;overflow:visible}
.anneaux .a-g{transform:translateX(-52px);transition:transform 1.1s cubic-bezier(.2,.75,.25,1.12) .25s}
.anneaux .a-d{transform:translateX(52px);transition:transform 1.1s cubic-bezier(.2,.75,.25,1.12) .25s}
.signature-anim.vu .a-g,.signature-anim.vu .a-d{transform:none}
@media (prefers-reduced-motion:reduce){.anneaux .a-g,.anneaux .a-d{transform:none;transition:none}}

/* ---------- Promesse du premier rendez-vous ---------- */
.chips-humain{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}
.chip-h{border:1.5px solid rgba(255,255,255,.55);border-radius:99px;padding:9px 18px;font-size:.85rem;font-weight:600;color:#fff}
.chips-humain--clair .chip-h{border-color:var(--ligne);color:var(--encre)}
.carte .mail{font-weight:600;color:var(--orange);word-break:break-all}

/* ---------- Matrice 2×2 (hommage aux cadres d'analyse du conseil) ---------- */
.matrice-cadre{display:grid;grid-template-columns:34px 1fr;grid-template-rows:1fr 40px;gap:0;position:relative}
.matrice{
  display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1px;
  background:var(--ligne);border:1px solid var(--ligne);
  border-left:1.5px solid rgba(10,10,16,.55);border-bottom:1.5px solid rgba(10,10,16,.55);
}
/* Flèches fines aux extrémités des deux axes (rails = bords gauche et bas de la matrice) */
.matrice-cadre::before{
  content:"";position:absolute;left:34px;top:-9px;transform:translateX(calc(-50% - .5px));
  border-left:4.5px solid transparent;border-right:4.5px solid transparent;
  border-bottom:9px solid rgba(10,10,16,.55);
}
.matrice-cadre::after{
  content:"";position:absolute;right:-9px;bottom:40px;transform:translateY(calc(50% + .5px));
  border-top:4.5px solid transparent;border-bottom:4.5px solid transparent;
  border-left:9px solid rgba(10,10,16,.55);
}
.quadrant{
  background:var(--blanc);padding:clamp(18px,2.2vw,30px);display:flex;flex-direction:column;gap:8px;min-height:150px;
  transition:background .22s ease;
}
.matrice .quadrant:not(.quadrant--koortis):hover{background:var(--ivoire)}
.quadrant h3,.quadrant h4{font-size:clamp(.95rem,1.3vw,1.15rem);line-height:1.2}
.quadrant p{font-size:.82rem;color:var(--graphite);line-height:1.55}
.quadrant--koortis{
  background:var(--accent);color:#fff;position:relative;z-index:1;
  transform:scale(1.035);box-shadow:0 16px 40px rgba(241,103,34,.32);
}
.quadrant--koortis:hover{background:#e85c15}
.quadrant--koortis p{color:rgba(255,255,255,.9)}
.quadrant .q-note{font-size:.64rem;font-weight:600;letter-spacing:.17em;text-transform:uppercase;color:var(--gris);margin-bottom:2px}
.quadrant--koortis .q-note{color:rgba(255,255,255,.8)}
.matrice-axe-y{writing-mode:vertical-rl;transform:rotate(180deg);align-self:stretch;display:flex;align-items:center;justify-content:center;font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--graphite);padding-left:4px}
.matrice-axe-x{grid-column:2;display:flex;align-items:flex-end;justify-content:center;font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--graphite);padding-top:16px}

/* ---------- Liste éditoriale (publication) ---------- */
.edito{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(36px,5vw,80px);align-items:start}
@media(max-width:880px){.edito{grid-template-columns:1fr}}
.edito-une{display:flex;flex-direction:column;gap:16px}
.edito-une .cat{font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.edito-une h3{font-size:clamp(1.55rem,2.6vw,2.3rem);line-height:1.16;letter-spacing:-.015em;transition:color .22s ease}
.edito-une:hover h3{color:var(--accent)}
.edito-une p{color:var(--graphite);font-size:1rem;line-height:1.68;max-width:54ch}
.edito-une .meta{font-size:.8rem;color:var(--gris);margin-top:2px}
.edito-liste{border-top:1px solid var(--ligne)}
.edito-ligne{display:flex;align-items:baseline;gap:16px;padding:21px 0;border-bottom:1px solid var(--ligne);transition:border-color .22s ease}
a.edito-ligne:hover{border-color:rgba(10,10,16,.34)}
.edito-ligne .cat{font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);flex:0 0 92px}
.edito-ligne .num{
  font-family:var(--f-display);font-weight:800;font-size:.98rem;color:var(--orange);
  flex:0 0 40px;font-variant-numeric:tabular-nums;letter-spacing:.03em;
}
.edito-ligne h4{font-size:1.02rem;line-height:1.35;flex:1;transition:color .22s ease}
a.edito-ligne:hover h4{color:var(--accent)}
.edito-ligne .fl{color:var(--orange);transition:transform .22s cubic-bezier(.2,.65,.25,1)}
a.edito-ligne:hover .fl{transform:translateX(4px)}

/* ---------- Éditorial / insights ---------- */
.ed-grille{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:1px;background:var(--ligne);border:1px solid var(--ligne)}
@media(max-width:960px){.ed-grille{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.ed-grille{grid-template-columns:1fr}}
.ed-carte{background:var(--blanc);padding:clamp(24px,3vw,38px);display:flex;flex-direction:column;gap:14px;min-height:260px}
.ed-carte .cat{font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.ed-carte h3{font-size:clamp(1.1rem,1.6vw,1.45rem);flex:1}
.ed-carte:hover h3{color:var(--accent)}
.ed-carte .meta{font-size:.8rem;color:var(--gris)}
.ed-carte--une{background:var(--encre);color:var(--ivoire)}
.ed-carte--une .cat{color:var(--orange-vif)}
.ed-carte--une h3{font-size:clamp(1.4rem,2.4vw,2.1rem)}
.ed-carte--une:hover h3{color:var(--accent-vif)}

/* Cartes éditoriales à couverture (grille Insights) : image pleine carte, texte posé dessus */
.ed-grille--visuel{gap:14px;background:transparent;border:0}
/* Blocs « À lire ensuite » : à 2 cartes, 2 colonnes pleines (pas de 3e piste vide) */
.ed-grille:has(> :nth-child(2):last-child){grid-template-columns:1fr 1fr}
@media(max-width:640px){.ed-grille:has(> :nth-child(2):last-child){grid-template-columns:1fr}}
.ed-carte--visuel{
  position:relative;min-height:clamp(340px,38vw,470px);border-radius:var(--rayon,2px);overflow:hidden;
  color:var(--ivoire);isolation:isolate;
  transition:transform .3s cubic-bezier(.2,.65,.25,1),box-shadow .3s ease;
}
.ed-carte--visuel:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(5,6,12,.45)}
.ed-fond{
  position:absolute;inset:0;z-index:-1;background-size:cover;background-position:center;
  transition:transform .7s cubic-bezier(.2,.65,.25,1);
}
.ed-carte--visuel:hover .ed-fond{transform:scale(1.055)}
/* voile de lisibilité sous le titre des cartes sombres */
.ed-carte--visuel:not(.ed-carte--claire)::before{
  content:"";position:absolute;inset:0 0 auto 0;height:62%;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,10,20,.5) 0%,rgba(8,10,20,.18) 55%,rgba(8,10,20,0) 100%);
}
/* flèche d'appel, glisse au survol */
.ed-carte--visuel::after{
  content:"→";position:absolute;right:26px;bottom:20px;
  font-family:var(--f-display);font-weight:700;font-size:1.3rem;color:currentColor;
  opacity:0;transform:translateX(-10px);transition:opacity .3s ease,transform .3s cubic-bezier(.2,.65,.25,1);
}
.ed-carte--visuel:hover::after{opacity:1;transform:translateX(0)}
.ed-carte--visuel h3{flex:1;text-wrap:balance}
.ed-carte--visuel .cat{color:var(--orange-vif)}
.ed-carte--visuel .meta{color:rgba(248,248,249,.74)}
.ed-carte--visuel.ed-carte--une:hover h3,.ed-carte--visuel:hover h3{color:var(--accent-vif)}
.ed-carte--claire{color:var(--encre)}
.ed-carte--claire .cat{color:var(--orange)}
.ed-carte--claire .meta{color:var(--gris)}
.ed-carte--claire:hover h3{color:var(--accent)}
.ed-carte--claire::after{color:var(--accent)}
.ed-carte--large{grid-column:1/-1;min-height:250px}
.ed-carte--large h3{max-width:30ch}

/* ---------- Icônes de pôle sur cartes ---------- */
.carte-ico{width:42px;height:42px;margin-bottom:4px;display:block}
a.carte:hover .carte-ico{filter:brightness(0) saturate(100%) invert(46%) sepia(77%) saturate(1856%) hue-rotate(346deg) brightness(98%) contrast(93%)}

/* ---------- En-tête de page à couverture (continuité carte → article) ---------- */
.hero-page--couv .hp-couv{
  position:absolute;inset:0 0 0 34%;z-index:0;pointer-events:none;
  background-size:cover;background-position:center;opacity:.5;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.85) 46%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.85) 46%,#000 100%);
}
.hero-page--couv .hp-couv::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,16,.32),rgba(10,10,16,.6))}
.hero-page--couv .contenu{position:relative;z-index:1}
@media(max-width:880px){.hero-page--couv .hp-couv{inset:0;opacity:.32}}
@media(max-width:640px){.ed-carte--large{min-height:300px}}

/* Corps d'article */
.article-corps{max-width:760px;margin:0 auto}
.article-corps>*+*{margin-top:1.4em}
.article-corps h2{font-size:clamp(1.5rem,2.4vw,2rem);margin-top:2em}
.article-corps h3{margin-top:1.6em}
.article-corps p,.article-corps li{color:var(--graphite);font-size:1.05rem;line-height:1.75}
.article-corps ul{list-style:none;padding-left:0}
.article-corps ul li{padding-left:26px;position:relative;margin-top:.6em}
.article-corps ul li::before{content:"";position:absolute;left:0;top:.65em;width:12px;height:2px;background:var(--accent)}
.article-corps blockquote{border-left:3px solid var(--orange);padding:6px 0 6px 26px;font-family:var(--f-display);font-weight:600;font-size:1.3rem;line-height:1.4;color:var(--encre)}

/* ---------- Cas clients ---------- */
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ligne-sombre);border:1px solid var(--ligne-sombre)}
.kpis--2{grid-template-columns:repeat(2,1fr)}
@media(max-width:720px){.kpis,.kpis--2{grid-template-columns:1fr}}
.kpi{background:var(--encre-2);padding:clamp(24px,3vw,40px)}
.kpi .chiffre{font-family:var(--f-display);font-weight:900;font-size:clamp(2.2rem,4.5vw,3.6rem);color:var(--orange-vif);line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.kpi p{margin-top:12px;font-size:.88rem;color:#b9b9c6;max-width:34ch}
.cas-phases{display:grid;gap:16px}
.cas-phase{border:1px solid var(--ligne);border-radius:6px;padding:clamp(24px,3vw,40px);background:var(--blanc)}
.cas-phase .etiquette{font-family:var(--f-display);font-weight:800;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase;color:var(--orange);margin-bottom:14px}
.cas-fleche{display:grid;place-items:center;color:var(--orange);font-size:1.4rem}

/* ---------- Citation / témoignage ---------- */
.temoignage{max-width:900px}
.temoignage blockquote{font-family:var(--f-display);font-weight:600;font-size:clamp(1.4rem,2.8vw,2.2rem);line-height:1.3;letter-spacing:-.01em}
.temoignage blockquote::before{content:"“";color:var(--orange);}
.temoignage blockquote::after{content:"”";color:var(--orange);}
.section--sombre .temoignage blockquote::before,.section--panneau .temoignage blockquote::before,
.section--sombre .temoignage blockquote::after,.section--panneau .temoignage blockquote::after{color:var(--orange-vif)}
.temoignage figcaption{margin-top:22px;font-size:.9rem;color:var(--gris)}
.temoignage figcaption b{color:inherit;display:block;font-size:1rem}
.section--sombre .temoignage figcaption b{color:var(--ivoire)}

/* ---------- CTA final ---------- */
.cta-final{background:var(--orange);color:#fff;position:relative;overflow:hidden}
/* Sur l'aplat orange, le tiret d'eyebrow orange disparaissait (orange sur orange) */
.cta-final .eyebrow::before{background:#fff}
.cta-final .contenu{position:relative}
.cta-final h2{font-size:clamp(2.2rem,5.5vw,4.4rem);max-width:16ch;text-transform:uppercase;letter-spacing:-.02em}
.cta-final p{margin-top:18px;max-width:52ch;color:rgba(255,255,255,.85);font-size:var(--t-lead)}
.cta-final .btn--blanc{margin-top:36px;background:#fff;color:var(--accent)}
.cta-final .btn--blanc:hover{background:var(--encre);color:#fff}
.cta-final .motif{position:absolute;right:-120px;bottom:-160px;width:520px;height:520px;opacity:.16;pointer-events:none}

/* ---------- Formulaires ---------- */
.form-grille{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:640px){.form-grille{grid-template-columns:1fr}}
.champ{display:flex;flex-direction:column;gap:8px}
.champ.large{grid-column:1/-1}
.champ label{font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}
.champ .req{color:var(--accent);font-weight:700}
.note-req{font-size:.8rem;color:var(--gris);margin-bottom:10px}
.champ input,.champ select,.champ textarea{
  font:inherit;font-size:16px;padding:14px 16px;border:1.5px solid var(--ligne);border-radius:var(--rayon);
  background:var(--blanc);color:var(--encre);transition:border-color .2s ease,box-shadow .2s ease;width:100%;
}
.champ input:hover,.champ select:hover,.champ textarea:hover{border-color:rgba(10,10,16,.3)}
.champ input::placeholder,.champ textarea::placeholder{color:var(--gris)}
.champ input:focus,.champ select:focus,.champ textarea:focus{
  border-color:var(--accent);outline:none;box-shadow:0 0 0 3.5px rgba(241,103,34,.14);
}
.champ select{
  appearance:none;-webkit-appearance:none;padding-right:44px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%233c3c46' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:12px 8px;
}
.champ textarea{min-height:150px;resize:vertical}
.form-grille .btn{justify-self:start}
@media(max-width:640px){.form-grille .btn{width:100%;justify-content:center}}

/* ---------- Footer ---------- */
.footer{background:var(--encre);color:var(--ivoire);padding:clamp(64px,8vw,110px) 0 40px}
.footer-haut{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:clamp(24px,3vw,48px);padding-bottom:clamp(44px,5vw,72px);border-bottom:1px solid rgba(244,242,236,.1)}
@media(max-width:960px){.footer-haut{grid-template-columns:1fr 1fr;row-gap:40px}}
@media(max-width:560px){.footer-haut{grid-template-columns:1fr;row-gap:34px}}
.footer .logo{font-size:1.5rem;margin-bottom:18px}
.footer-marque p{color:#9a9aa8;font-size:.92rem;max-width:36ch;line-height:1.7}
.footer h4{font-family:var(--f-corps);font-size:.7rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gris);margin-bottom:18px}
.footer-col a{display:block;padding:6px 0;color:#b9b9c6;font-size:.92rem;transition:color .2s ease}
.footer-col a:hover{color:#fff}
.footer-bas{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;padding-top:32px;font-size:.8rem;color:#8b8b96}
.footer-bas a{transition:color .2s ease}
.footer-bas a:hover{color:#fff}
.footer-bas nav{display:flex;gap:22px;flex-wrap:wrap}

/* ---------- Révélation au scroll ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.65,.25,1),transform .7s cubic-bezier(.2,.65,.25,1)}
.reveal.vu{opacity:1;transform:none}
.reveal-d1{transition-delay:.08s}.reveal-d2{transition-delay:.16s}.reveal-d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .btn,.carte,.fl-coin,.lien-fl .fl{transition:none}
}

/* ---------- Barre de progression de lecture ---------- */
.barre-lecture{position:fixed;top:0;left:0;height:3px;width:0;background:var(--accent);z-index:300;transition:width .1s linear}

/* ---------- Divers ---------- */
.note-placeholder{outline:1.5px dashed rgba(232,80,45,.0)} /* marqueur neutre : voir CONTENU-A-VALIDER.md */
hr.filet{border:0;border-top:1px solid var(--ligne);margin:0}
.section--sombre hr.filet{border-color:var(--ligne-sombre)}

/* ---------- Polish mobile (rythme, titres, cibles) ---------- */
@media(max-width:640px){
  :root{--section:clamp(64px,17vw,96px)}
  .hero-in{padding-block:150px 44px}
  .hero-actions{margin-top:32px}
  .hero-actions .btn{flex:1 1 auto;justify-content:center}
  .hero-bas{gap:18px 28px}
  .hero-carte{max-width:none;padding:26px 20px 30px}
  .hero-carte .hero-titre{font-size:clamp(1.75rem,7.6vw,2.3rem)}
  .hero-carte .hero-sous{font-size:.97rem}
  .tete-section{margin-bottom:34px}
  .tete-section .lead{margin-top:14px}
  .quadrant{min-height:132px;padding:16px 14px}
  .quadrant p{font-size:.78rem}
  .matrice-cadre{grid-template-columns:26px 1fr}
  .matrice-cadre::before{left:26px}
  .cta-final .btn--blanc{width:100%;justify-content:center}
  .footer{padding-top:56px}
}

/* ---------- Barres de défilement discrètes ---------- */
html{scrollbar-color:rgba(60,60,70,.55) transparent;scrollbar-width:thin}
.tiroir{scrollbar-width:thin;scrollbar-color:rgba(244,242,236,.3) transparent}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(60,60,70,.45);border-radius:99px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background-color:rgba(60,60,70,.65)}

/* ---------- Impression ---------- */
@media print{
  .topnav,.tiroir,.barre-lecture,.hero-diapos,.hero-fond,.skip-lien,.cta-final .motif{display:none!important}
  .hero,.hero-page,.section--sombre,.section--panneau,.manifeste,.footer{background:#fff!important;color:#000!important}
  .section{padding:32px 0}
  a{text-decoration:underline}
  .reveal{opacity:1!important;transform:none!important}
}

/* ---------- Devise (footer) ---------- */
.footer .devise{font-family:var(--f-display);font-weight:700;font-size:.98rem;color:var(--accent-vif);margin:12px 0 14px;letter-spacing:.01em}

/* ---------- Transitions de pages (View Transitions API, amélioration progressive) ---------- */
@view-transition{navigation:auto}
::view-transition-old(root){animation-duration:.22s}
::view-transition-new(root){animation-duration:.22s}
@media (prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}

/* KOO-13/14 : bloc contact du pied de page (adresse, téléphone, LinkedIn) */
.footer-contact{margin-top:18px;font-size:.86rem;line-height:1.6;color:var(--gris)}
.footer-contact .footer-adr{margin:0 0 4px}
.footer-contact a{color:var(--gris);text-decoration:none}
.footer-contact a:hover{color:var(--orange)}
.footer-linkedin{display:inline-block;margin-top:8px;font-weight:600;color:var(--orange)!important;letter-spacing:.02em}
.footer-linkedin:hover{text-decoration:underline}
.footer-linkedin:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
/* Date de mise à jour des pages légales */
.maj-legale{font-size:.85rem;color:var(--gris);margin:0 0 26px}

/* KOO-26 : styles de la page Autodiagnostic (scopés, déplacés hors du flux de contenu) */
.autodiag{max-width:820px}
  .autodiag h3{display:flex;align-items:baseline;gap:14px;margin:52px 0 6px;font-size:1.2rem}
  .autodiag h3:first-of-type{margin-top:0}
  .autodiag h3 .num-theme{font-family:var(--f-display);font-weight:900;font-size:1.5rem;color:var(--orange);line-height:1}
  .autodiag .fiche-ligne{display:flex;gap:18px;align-items:flex-start;cursor:pointer}
  .autodiag input[type="checkbox"]{appearance:none;-webkit-appearance:none;flex:0 0 auto;width:28px;height:28px;margin-top:2px;border:2px solid var(--ligne);border-radius:6px;background:var(--blanc);cursor:pointer;display:grid;place-items:center;transition:border-color .15s ease,background .15s ease}
  .autodiag input[type="checkbox"]:hover{border-color:var(--orange)}
  .autodiag input[type="checkbox"]:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
  .autodiag input[type="checkbox"]:checked{background:var(--orange);border-color:var(--orange)}
  .autodiag input[type="checkbox"]:checked::after{content:"";width:12px;height:7px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:translateY(-2px) rotate(-45deg)}
  .autodiag .q b{display:block;font-weight:600;font-size:1rem;line-height:1.5;color:var(--encre)}
  .autodiag .q small{display:block;margin-top:4px;font-size:.88rem;line-height:1.5;color:var(--gris)}
  .autodiag-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}
  .autodiag-actions .btn{cursor:pointer;font-family:inherit;font-size:.95rem}
  .autodiag-actions .btn--contour{background:transparent}
  .autodiag-note{margin-top:16px;font-size:.85rem;color:var(--gris)}
  #verdict{margin-top:30px;padding:28px 30px;background:var(--blanc);border-left:3px solid var(--orange)}
  #verdict .score{font-family:var(--f-display);font-weight:900;font-size:2.1rem;color:var(--orange);line-height:1}
  #verdict .titre-verdict{margin-top:12px;font-family:var(--f-display);font-weight:700;font-size:1.15rem;color:var(--encre)}
  #verdict .detail{margin-top:8px;color:var(--graphite);font-size:.98rem;line-height:1.7}
  @media print{.topnav,.tiroir,.cta-final,.autodiag-actions,.fil-ariane,footer{display:none !important}}

/* Crédits photographiques repliables (mentions légales) */
.credits-photo{margin:8px 0 20px;border:1px solid var(--ligne);border-radius:10px;background:var(--blanc)}
.credits-photo>summary{cursor:pointer;padding:14px 18px;font-weight:600;color:var(--encre);list-style:none;display:flex;align-items:center;gap:10px}
.credits-photo>summary::-webkit-details-marker{display:none}
.credits-photo>summary::before{content:"";width:8px;height:8px;border-right:2px solid var(--orange);border-bottom:2px solid var(--orange);transform:rotate(-45deg);transition:transform .2s ease;flex:0 0 auto}
.credits-photo[open]>summary::before{transform:rotate(45deg)}
.credits-photo>summary:focus-visible{outline:2px solid var(--orange);outline-offset:2px;border-radius:10px}
.credits-photo ul{margin:0;padding:4px 22px 18px 40px}

/* ——— Tableau de décision (page S/4HANA, diagnostic 09/2026) ——— */
.tableau-cadre{overflow-x:auto;border:1px solid var(--ligne-sombre);border-radius:6px}
.matrice-decision{width:100%;min-width:720px;border-collapse:collapse;font-size:.9rem;line-height:1.45}
.matrice-decision th,.matrice-decision td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--ligne-sombre)}
.matrice-decision thead th{font-family:var(--f-display);font-size:.95rem;background:rgba(255,255,255,.06);color:#fff}
.matrice-decision thead th small{display:block;font-family:var(--f-corps);font-weight:500;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--orange-vif);margin-top:4px}
.matrice-decision tbody th{font-family:var(--f-corps);font-weight:600;color:#fff;white-space:nowrap}
.matrice-decision tbody td{color:rgba(255,255,255,.82)}
.matrice-decision tbody tr:last-child th,.matrice-decision tbody tr:last-child td{border-bottom:0}
.section:not(.section--sombre) .matrice-decision thead th,.section:not(.section--sombre) .matrice-decision tbody th{color:var(--encre)}
.section:not(.section--sombre) .matrice-decision tbody td{color:var(--graphite)}

/* ——— Filtres des réalisations (diagnostic 09/2026, P1) ——— */
.ref-filtres{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 26px}
.ref-filtres .chip{appearance:none;border:1px solid var(--ligne-sombre);background:transparent;color:#f8f8f9;font:600 .78rem/1 var(--f-corps);letter-spacing:.06em;padding:10px 16px;border-radius:99px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.ref-filtres .chip:hover{border-color:var(--accent);color:var(--accent-vif)}
.ref-filtres .chip.actif{background:var(--accent);border-color:var(--accent);color:#fff}
.ref-filtres .chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Signature des points de vue (diagnostic 09/2026, P1) */
.signature-art{margin-top:18px;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--orange-vif);font-weight:600}
.hero-page--couv .signature-art{color:var(--orange-vif)}

/* ===== Variante BIS — visuels premium CLAIRS & LUMINEUX (choix client 05/09/2026) ===== */
/* Héros : quasiment pas de voile, la lumière des visuels doit passer */
.diapo--photo{filter:brightness(.94) saturate(.98) contrast(1.02)}
body.jour .diapo--photo{filter:none}
.diapo--photo::after{background:linear-gradient(160deg,rgba(27,32,79,.14) 0%,rgba(10,10,16,.03) 52%,rgba(241,103,34,.06) 100%)}
body.jour .diapo--photo::after{background:linear-gradient(160deg,rgba(27,32,79,.08) 0%,rgba(10,10,16,.02) 52%,rgba(241,103,34,.04) 100%)}
/* Légende du diaporama : lisible sur image claire */
.hl-noms{text-shadow:0 1px 14px rgba(5,6,12,.75),0 0 2px rgba(5,6,12,.6)}
/* Couvertures d'article : présentes et lumineuses */
.hp-couv{opacity:.5}
/* Bandes images : horizon/skyline légèrement remonté */
.bande-image{background-position:center 42%}
/* Cartes Insights à visuel : couvertures claires sous texte blanc → voile sombre pour la lisibilité */
.ed-carte--visuel .ed-fond::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,16,.40) 0%,rgba(10,10,16,.60) 55%,rgba(10,10,16,.85) 100%)}
.ed-carte--visuel .ed-fond{filter:saturate(.94)}
/* Voile du héros (mode nuit par défaut) : allégé, les visuels sont lumineux ; le bas reste dense pour la bande hero-bas */
.hero-voile{background:linear-gradient(180deg,rgba(10,10,16,.26) 0%,rgba(10,10,16,.10) 42%,rgba(10,10,16,.80) 100%)}
body.jour .hero-voile{background:linear-gradient(180deg,rgba(10,10,16,.14) 0%,rgba(10,10,16,.04) 45%,rgba(10,10,16,.78) 100%)}

/* ===== CHARTE « présentation » (05/09/2026) : orange KOORTIS + bleu marine + crème, imagerie d'aube ===== */
:root{--encre:#182a4a;--encre-2:#1f3358;--encre-3:#27406b;--marine:#182a4a;--ivoire:#faf8f4;--ligne:rgba(24,42,74,.16);--graphite:#3a4660}
body{background:#faf8f4}
.section--sombre{background:radial-gradient(1100px 560px at 78% -10%,#22395f 0%,#182a4a 60%);color:#f8f8f9}
/* Bloc du héros = bloc ORANGE à texte blanc (couverture de la présentation) */
.hero-carte{background:rgba(241,103,34,.96);box-shadow:0 30px 80px rgba(24,42,74,.45)}
.hero-carte::before{background:#fff;width:5px}
@media (hover:hover){.hero-carte:hover{background:rgba(241,103,34,.9)}}
.hero-carte .eyebrow{color:rgba(255,255,255,.85)}
.hero-carte .eyebrow::before{background:#fff}
.hero-carte h1,.hero-carte p{color:#fff}
.hero-carte .accent,.hero-carte h1 .accent{color:#182a4a}
.hero-carte .btn--plein{background:#fff;color:#c24a0f}
.hero-carte .btn--plein:hover{background:#faf8f4}
.hero-carte .btn--contour{border-color:rgba(255,255,255,.7);color:#fff}
.hero-carte .btn--contour:hover{border-color:#fff;background:rgba(255,255,255,.12)}
/* Bandeau « CHAPITRE » : étiquette des bandes images en bandeau marine rectangulaire, capitales espacées */
.bande-image>span{left:0;bottom:0;border:0;border-radius:0;background:#182a4a;backdrop-filter:none;padding:16px 34px 16px var(--marge);font-size:.72rem;letter-spacing:.24em}
/* Diaporama d'accueil : 16 diapos, cycle 128s (8 s chacune) */
.diapo,.hl-noms span,.hl-points i{animation-duration:128s}
@keyframes fondu-diapo{0%{opacity:0;transform:scale(1.02)}1.172%{opacity:1}6.25%{opacity:1;transform:scale(1.06)}8.125%{opacity:0;transform:scale(1.08)}100%{opacity:0;transform:scale(1.02)}}
.diapo:nth-child(2),.hl-noms span:nth-child(2),.hl-points i:nth-child(2){animation-delay:8s}
.diapo:nth-child(3),.hl-noms span:nth-child(3),.hl-points i:nth-child(3){animation-delay:16s}
.diapo:nth-child(4),.hl-noms span:nth-child(4),.hl-points i:nth-child(4){animation-delay:24s}
.diapo:nth-child(5),.hl-noms span:nth-child(5),.hl-points i:nth-child(5){animation-delay:32s}
.diapo:nth-child(6),.hl-noms span:nth-child(6),.hl-points i:nth-child(6){animation-delay:40s}
.diapo:nth-child(7),.hl-noms span:nth-child(7),.hl-points i:nth-child(7){animation-delay:48s}
.diapo:nth-child(8),.hl-noms span:nth-child(8),.hl-points i:nth-child(8){animation-delay:56s}
.diapo:nth-child(9),.hl-noms span:nth-child(9),.hl-points i:nth-child(9){animation-delay:64s}
.diapo:nth-child(10),.hl-noms span:nth-child(10),.hl-points i:nth-child(10){animation-delay:72s}
.diapo:nth-child(11),.hl-noms span:nth-child(11),.hl-points i:nth-child(11){animation-delay:80s}
.diapo:nth-child(12),.hl-noms span:nth-child(12),.hl-points i:nth-child(12){animation-delay:88s}
.diapo:nth-child(13),.hl-noms span:nth-child(13),.hl-points i:nth-child(13){animation-delay:96s}
.diapo:nth-child(14),.hl-noms span:nth-child(14),.hl-points i:nth-child(14){animation-delay:104s}
.diapo:nth-child(15),.hl-noms span:nth-child(15),.hl-points i:nth-child(15){animation-delay:112s}
.diapo:nth-child(16),.hl-noms span:nth-child(16),.hl-points i:nth-child(16){animation-delay:120s}

/* Légende & points synchronisés sur le cycle de 128 s */
@keyframes mot-diapo{0%{opacity:0;transform:translateY(6px)}1.172%{opacity:1;transform:translateY(0)}6.25%{opacity:1;transform:translateY(0)}8.125%{opacity:0;transform:translateY(-6px)}100%{opacity:0;transform:translateY(-6px)}}
@keyframes point-diapo{0%{background:var(--accent-vif);transform:scale(1.4)}6.172%{background:var(--accent-vif);transform:scale(1.4)}6.25%{background:rgba(248,248,249,.32);transform:scale(1)}100%{background:rgba(248,248,249,.32);transform:scale(1)}}