/* Charte CMI — reprise de cmi-strategies.com : Euclid Circular B, vert sapin, pistache, beiges. */
@font-face{font-family:'euclid';src:url('fonts/EuclidCircularB-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'euclid';src:url('fonts/EuclidCircularB-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'euclid';src:url('fonts/EuclidCircularB-Medium.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --vert-sapin:#013D43;
  --vert-fonce:#002125;
  --vert-pistache:#ADE2B8;
  --beige-clair:#F6F4EE;
  --beige-fonce:#E9E2D3;
  --creme:#F8F2E7;
  --gris-ardoise:#546373;
  --gris-vert:#B4C7C9;
  --rouge:#ED2A36;
  --blanc:#FFFFFF;
  --encre:#0F2B2E;
  --rad10:10px;--rad21:21px;--rad30:30px;--rad90:90px;
  --police:'euclid',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --large:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--blanc);color:var(--encre);font-family:var(--police);font-weight:400;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-weight:400;margin:0;text-wrap:balance;letter-spacing:-.01em}
p{margin:0}
.gouttiere{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.cadre{max-width:var(--large);margin:0 auto}
.pistache{color:var(--vert-pistache)}
.sapin{color:var(--vert-sapin)}

/* En-tête */
.entete{position:sticky;top:0;z-index:20;background:var(--vert-sapin);color:var(--blanc);border-bottom:1px solid rgba(255,255,255,.08)}
.entete .cadre{display:flex;align-items:center;gap:28px;min-height:72px}
.entete .marque{display:flex;align-items:center;gap:14px;text-decoration:none}
.entete .marque img{height:46px;width:auto}
.entete .marque span{white-space:nowrap;font-size:14px;line-height:1.25;color:var(--gris-vert);border-left:1px solid rgba(255,255,255,.2);padding-left:14px}
.entete .marque span b{display:block;color:var(--blanc);font-weight:500;font-size:15px}
.entete nav{display:flex;gap:24px;margin-left:auto;font-size:15px}
.entete nav a{text-decoration:none;color:rgba(255,255,255,.82);white-space:nowrap}
.entete nav a:hover{color:var(--vert-pistache)}

/* Boutons, à la manière du site CMI : pilule et pastille fléchée */
.bouton{display:inline-flex;align-items:center;gap:12px;padding:8px 8px 8px 22px;border-radius:var(--rad90);font-family:inherit;font-size:16px;font-weight:500;text-decoration:none;border:1px solid transparent;transition:background .2s,color .2s,border-color .2s;white-space:nowrap}
.bouton .fleche{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:var(--rad10);flex:none}
.bouton .fleche svg{width:14px;height:14px}
.b-pistache{background:var(--vert-pistache);color:var(--vert-sapin)}
.b-pistache .fleche{background:var(--vert-sapin);color:var(--vert-pistache)}
.b-pistache:hover{background:var(--blanc)}
.b-contour{border-color:rgba(255,255,255,.45);color:var(--blanc)}
.b-contour .fleche{background:rgba(255,255,255,.12);color:var(--blanc)}
.b-contour:hover{border-color:var(--vert-pistache);color:var(--vert-pistache)}
.b-sapin{border-color:var(--vert-sapin);color:var(--vert-sapin);background:transparent}
.b-sapin .fleche{background:var(--vert-sapin);color:var(--vert-pistache)}
.b-sapin:hover{background:var(--vert-sapin);color:var(--blanc)}
.entete .bouton{padding:5px 5px 5px 18px;font-size:15px}
.entete .bouton .fleche{width:32px;height:32px}
a:focus-visible,.bouton:focus-visible{outline:2px solid var(--vert-pistache);outline-offset:3px}

/* Ouverture */
.ouverture{position:relative;overflow:hidden;color:var(--blanc);background:radial-gradient(120% 90% at 20% 10%,#0a5058 0%,var(--vert-sapin) 45%,var(--vert-fonce) 100%);padding-block:clamp(70px,11vw,140px) clamp(80px,10vw,130px)}
.ouverture::before{content:"";position:absolute;inset:0;background:url('img/single_baner_traits.svg') no-repeat center 30%/cover;opacity:.9;pointer-events:none}
.ouverture .cadre{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;gap:26px}
.oeil{font-size:13px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--vert-pistache)}
.oeil.sur-clair{color:var(--vert-sapin)}
.ouverture h1{font-size:clamp(38px,6.4vw,72px);line-height:1.08;font-weight:400}
.ouverture .chapeau{font-size:clamp(17px,2vw,20px);font-weight:300;max-width:720px;color:rgba(255,255,255,.86)}
.ouverture .actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:6px}
.ornement{display:flex;align-items:center;justify-content:center;gap:0;margin:0 auto}
.ornement::before,.ornement::after{content:"";height:1px;width:64px;background:var(--rouge)}
.ornement i{width:22px;height:12px;border:1px solid var(--rouge);border-radius:6px;display:block}

/* Bandeau de chiffres */
.chiffres{background:var(--vert-fonce);color:var(--blanc)}
.chiffres .cadre{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(255,255,255,.1)}
.chiffres .chiffre{background:var(--vert-fonce);padding:28px 22px;min-width:0}
.chiffres b{display:block;font-size:clamp(28px,3.4vw,38px);font-weight:400;color:var(--vert-pistache);font-variant-numeric:tabular-nums;line-height:1.1}
.chiffres span{display:block;margin-top:8px;font-size:14.5px;color:var(--gris-vert);line-height:1.4}

/* Sections */
.section{padding-block:clamp(64px,9vw,112px)}
.fond-beige{background:var(--beige-clair)}
.fond-sapin{background:var(--vert-sapin);color:var(--blanc);position:relative;overflow:hidden}
.titre-section{display:flex;flex-direction:column;gap:16px;max-width:780px;margin-bottom:clamp(36px,5vw,56px)}
.titre-section.centre{margin-left:auto;margin-right:auto;text-align:center;align-items:center}
.titre-section h2{font-size:clamp(30px,4.2vw,46px);line-height:1.12}
.titre-section p{font-size:18.5px;font-weight:300;color:var(--gris-ardoise)}
.fond-sapin .titre-section p{color:rgba(255,255,255,.8)}

/* Cartes de fonctionnalités, façon cartes d'actualités CMI */
.grille{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.carte{background:var(--creme);border-radius:var(--rad21);padding:30px 28px 26px;display:flex;flex-direction:column;gap:12px;min-width:0}
.fond-beige .carte{background:var(--blanc)}
.carte .picto{width:46px;height:46px;border-radius:var(--rad10);background:var(--vert-sapin);color:var(--vert-pistache);display:grid;place-items:center;margin-bottom:6px}
.carte .picto svg{width:22px;height:22px}
.carte h3{font-size:21px;font-weight:500;line-height:1.25;color:var(--vert-sapin)}
.carte p{font-size:16px;color:var(--gris-ardoise)}
.etiquette{display:inline-block;align-self:flex-start;margin-top:auto;padding:4px 14px;border-radius:var(--rad90);background:var(--beige-fonce);color:var(--vert-sapin);font-size:13.5px;font-weight:500}
.fond-beige .etiquette{background:var(--beige-clair)}

/* Démarche */
.demarche{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--beige-fonce)}
.etape{padding:28px 26px 8px 0;border-right:1px solid var(--beige-fonce);min-width:0}
.etape + .etape{padding-left:26px}
.etape:last-child{border-right:0}
.etape .num{font-size:15px;font-weight:500;color:var(--rouge);letter-spacing:.06em}
.etape h3{font-size:22px;color:var(--vert-sapin);margin:10px 0 10px;font-weight:500}
.etape p{font-size:16px;color:var(--gris-ardoise)}
.decret{margin-top:40px;display:flex;gap:18px;align-items:flex-start;background:var(--creme);border-radius:var(--rad21);padding:22px 26px;font-size:16px;color:var(--gris-ardoise)}
.decret b{color:var(--vert-sapin);font-weight:500}

/* Exemple Tours */
.fond-sapin::before{content:"";position:absolute;inset:0;background:url('img/single_baner_traits.svg') no-repeat right -20% top 10%/90% auto;opacity:.6;pointer-events:none}
.fond-sapin .cadre{position:relative}
.exemple{display:grid;grid-template-columns:5fr 7fr;gap:clamp(30px,5vw,64px);align-items:start}
.exemple .titre-section{margin-bottom:0}
.exemple .fiche{display:flex;gap:28px;flex-wrap:wrap;margin-top:6px}
.exemple .fiche div b{display:block;font-size:30px;font-weight:400;color:var(--vert-pistache);font-variant-numeric:tabular-nums}
.exemple .fiche div span{font-size:14px;color:var(--gris-vert)}
.tableau{overflow-x:auto;border-radius:var(--rad21);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.tableau table{width:100%;border-collapse:collapse;font-size:15.5px}
.tableau caption{text-align:left;padding:16px 20px;font-size:14px;color:var(--gris-vert);border-bottom:1px solid rgba(255,255,255,.12)}
.tableau th{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--gris-vert);text-align:right;padding:12px 16px;white-space:nowrap}
.tableau th:first-child,.tableau td:first-child{text-align:left}
.tableau td{padding:13px 16px;border-top:1px solid rgba(255,255,255,.1);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tableau td:first-child{white-space:normal;min-width:220px}
.tableau td.ville{color:var(--vert-pistache);font-weight:500}
.note-tableau{margin-top:16px;font-size:14.5px;color:rgba(255,255,255,.72)}

/* Garanties */
.garanties{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 40px}
.garantie{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:24px 0;border-top:1px solid var(--beige-fonce);min-width:0}
.garantie .rond{width:52px;height:52px;border-radius:100%;background:var(--vert-pistache);color:var(--vert-sapin);display:grid;place-items:center}
.garantie .rond svg{width:22px;height:22px}
.garantie h3{font-size:20px;font-weight:500;color:var(--vert-sapin);margin-bottom:6px}
.garantie p{font-size:16px;color:var(--gris-ardoise)}
.garantie.large{grid-column:1/-1}

/* Sources */
.sources{overflow-x:auto;border-radius:var(--rad21);border:1px solid var(--beige-fonce);background:var(--blanc)}
.sources table{width:100%;border-collapse:collapse;font-size:15.5px}
.sources th{text-align:left;font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--gris-ardoise);padding:14px 20px;background:var(--beige-clair)}
.sources td{padding:14px 20px;border-top:1px solid var(--beige-fonce);vertical-align:top}
.sources td:first-child{font-weight:500;color:var(--vert-sapin);white-space:nowrap}
.sources td:last-child{white-space:nowrap;color:var(--gris-ardoise);font-variant-numeric:tabular-nums}

/* Accès */
.acces{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.role{background:var(--blanc);border-radius:var(--rad21);padding:28px;min-width:0}
.role h3{font-size:20px;font-weight:500;color:var(--vert-sapin);margin-bottom:8px}
.role p{font-size:16px;color:var(--gris-ardoise)}
.roles{display:flex;flex-direction:column;gap:12px;margin-top:6px}
.roles div{display:flex;gap:14px;align-items:baseline}
.roles .pastille{flex:none;padding:3px 12px;border-radius:var(--rad90);background:var(--vert-sapin);color:var(--vert-pistache);font-size:13px;font-weight:500}

/* Démonstration */
.demo{background:linear-gradient(160deg,var(--vert-sapin) 0%,var(--vert-fonce) 100%);color:var(--blanc);position:relative;overflow:hidden}
.demo::before{content:"";position:absolute;inset:0;background:url('img/single_baner_traits.svg') no-repeat left -10% bottom -30%/80% auto;opacity:.7;pointer-events:none}
.demo .cadre{position:relative}
.demo .titre-section p{color:rgba(255,255,255,.8)}
.portes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.porte{display:flex;flex-direction:column;gap:14px;padding:30px 28px;border-radius:var(--rad21);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);text-decoration:none;color:var(--blanc);transition:background .2s,border-color .2s;min-width:0}
.porte:hover{background:rgba(173,226,184,.12);border-color:var(--vert-pistache)}
.porte .oeil{font-size:12px}
.porte h3{font-size:23px;font-weight:400;line-height:1.2}
.porte p{font-size:15.5px;color:rgba(255,255,255,.75)}
.porte .aller{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px solid rgba(255,255,255,.14);font-size:15px;color:var(--vert-pistache)}
.porte .aller i{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--rad10);background:var(--vert-pistache);color:var(--vert-sapin)}
.porte .aller svg{width:14px;height:14px}
.demo .acces-demo{margin-top:34px;text-align:center;font-size:15.5px;color:rgba(255,255,255,.75)}
.demo .acces-demo b{color:var(--blanc);font-weight:500}

/* Pied de page */
.pied{background:var(--vert-fonce);color:var(--gris-vert);font-size:15px;padding-block:56px 34px}
.pied .haut{display:grid;grid-template-columns:auto 1fr auto;gap:48px;align-items:start;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.1)}
.pied .haut img{height:92px;width:auto}
.pied h4{margin:0 0 10px;color:var(--blanc);font-weight:500;font-size:15px}
.pied .colonnes{display:flex;gap:56px;flex-wrap:wrap}
.pied a{text-decoration:none}
.pied a:hover{color:var(--vert-pistache)}
.pied .bas{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:22px;font-size:13.5px}

/* Pages légales */
.page-legale .ouverture{padding-block:64px 56px}
.page-legale .ouverture h1{font-size:clamp(34px,5vw,52px)}
.legal{max-width:820px;margin:0 auto;padding-block:56px 80px}
.legal h2{font-size:24px;font-weight:500;color:var(--vert-sapin);margin:40px 0 12px;padding-top:22px;border-top:1px solid var(--beige-fonce)}
.legal h2:first-child{margin-top:0;border-top:0;padding-top:0}
.legal p,.legal li{color:var(--gris-ardoise);font-size:16.5px}
.legal p{margin-bottom:12px}
.legal ul{padding-left:20px;margin:0 0 12px}
.legal li{margin-bottom:7px}
.legal b{color:var(--encre);font-weight:500}
.legal .bloc{background:var(--beige-clair);border-radius:var(--rad21);padding:22px 26px;margin:14px 0}
.legal dl{margin:0;display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:10px 20px}
.legal dt{font-weight:500;color:var(--vert-sapin)}
.legal dd{margin:0;color:var(--gris-ardoise)}
.legal code{background:var(--beige-clair);padding:1px 7px;border-radius:6px;font-size:14.5px}
.legal .tab{overflow-x:auto;border:1px solid var(--beige-fonce);border-radius:var(--rad21);margin:16px 0}
.legal table{width:100%;border-collapse:collapse;font-size:15px}
.legal th{text-align:left;font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--gris-ardoise);background:var(--beige-clair);padding:12px 16px}
.legal td{padding:13px 16px;border-top:1px solid var(--beige-fonce);vertical-align:top;color:var(--gris-ardoise)}
.legal td.fort{color:var(--vert-sapin);font-weight:500}
.legal .maj{margin-top:40px;font-size:14px}

/* Écrans étroits */
@media (max-width:1120px){
  .entete nav{display:none}
  .entete .bouton{margin-left:auto}
}
@media (max-width:980px){
  .chiffres .cadre{grid-template-columns:repeat(2,1fr)}
  .chiffres .chiffre:last-child{grid-column:1/-1}
  .grille,.portes{grid-template-columns:1fr 1fr}
  .demarche{grid-template-columns:1fr 1fr}
  .etape:nth-child(2){border-right:0}
  .etape:nth-child(3){padding-left:0}
  .exemple{grid-template-columns:1fr}
  .pied .haut{grid-template-columns:1fr}
}
@media (max-width:640px){
  .entete .marque span{display:none}
  .entete .bouton .libelle-long{display:none}
  .grille,.portes,.garanties,.acces,.demarche{grid-template-columns:1fr}
  .etape,.etape + .etape{padding-left:0;border-right:0;border-bottom:1px solid var(--beige-fonce);padding-bottom:22px}
  .garantie.large{grid-column:auto}
  .legal dl{grid-template-columns:1fr;gap:2px}
  .legal dd{margin-bottom:10px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* ===== Observatoire : ouverture en deux colonnes avec un tableau de bord ===== */
.ouverture.duo-ouverture .cadre{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,70px);align-items:center;text-align:left}
.duo-ouverture .texte{display:flex;flex-direction:column;gap:24px;align-items:flex-start;min-width:0}
.duo-ouverture h1{font-size:clamp(36px,5.2vw,62px)}
.duo-ouverture .actions{justify-content:flex-start}
.etat{display:inline-flex;align-items:center;gap:10px;font-size:14px;color:rgba(255,255,255,.8)}
.etat .point{width:9px;height:9px;border-radius:50%;background:var(--vert-pistache);box-shadow:0 0 0 0 rgba(173,226,184,.6);animation:pouls 2.4s infinite}
@keyframes pouls{0%{box-shadow:0 0 0 0 rgba(173,226,184,.55)}70%{box-shadow:0 0 0 10px rgba(173,226,184,0)}100%{box-shadow:0 0 0 0 rgba(173,226,184,0)}}
.panneau{background:var(--blanc);color:var(--encre);border-radius:var(--rad21);box-shadow:0 30px 70px rgba(0,20,22,.45);overflow:hidden;min-width:0}
.panneau .barre{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;background:var(--beige-clair);border-bottom:1px solid var(--beige-fonce);font-size:13.5px}
.panneau .barre b{color:var(--vert-sapin);font-weight:500;font-size:15px}
.panneau .barre .vivant{display:inline-flex;align-items:center;gap:8px;padding:3px 11px;border-radius:var(--rad90);background:var(--vert-sapin);color:var(--vert-pistache);font-size:12.5px;font-weight:500;white-space:nowrap}
.panneau .barre .vivant::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--vert-pistache)}
.panneau .kpis{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--beige-fonce)}
.panneau .kpi{background:var(--blanc);padding:16px 20px;min-width:0}
.panneau .kpi span{display:block;font-size:13px;color:var(--gris-ardoise);line-height:1.3}
.panneau .kpi b{display:block;font-size:28px;font-weight:400;color:var(--vert-sapin);font-variant-numeric:tabular-nums;margin-top:4px;line-height:1.1}
.panneau .kpi em{font-style:normal;font-size:12.5px;color:var(--rouge);font-weight:500}
.panneau .kpi em.calme{color:var(--gris-ardoise);font-weight:400}
.panneau .courbe{padding:16px 20px 12px;border-top:1px solid var(--beige-fonce)}
.panneau .courbe .leg{display:flex;justify-content:space-between;font-size:13px;color:var(--gris-ardoise);margin-bottom:8px}
.panneau .courbe svg{width:100%;height:auto;display:block}
.panneau .courbe .ans{display:flex;justify-content:space-between;font-size:11.5px;color:var(--gris-ardoise);margin-top:4px;font-variant-numeric:tabular-nums}
.panneau .pied-panneau{padding:10px 20px;background:var(--beige-clair);font-size:12px;color:var(--gris-ardoise);border-top:1px solid var(--beige-fonce)}

/* ===== Bandeau des millésimes ===== */
.millesimes{background:var(--vert-pistache);color:var(--vert-sapin);font-size:14.5px}
.millesimes .cadre{display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;padding-block:13px}
.millesimes b{font-weight:500}
.millesimes span{white-space:nowrap}

/* ===== Le besoin / la réponse ===== */
.besoins{display:flex;flex-direction:column;border-top:1px solid var(--beige-fonce)}
.besoin{display:grid;grid-template-columns:1fr 46px 1fr;gap:20px;align-items:center;padding:24px 0;border-bottom:1px solid var(--beige-fonce)}
.besoin .demande{font-size:19px;color:var(--vert-sapin);line-height:1.35}
.besoin .demande small{display:block;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gris-ardoise);margin-bottom:6px}
.besoin .vers{width:46px;height:46px;border-radius:var(--rad10);background:var(--vert-pistache);color:var(--vert-sapin);display:grid;place-items:center}
.besoin .vers svg{width:16px;height:16px}
.besoin .reponse{font-size:16px;color:var(--gris-ardoise)}
.besoin .reponse b{display:block;color:var(--encre);font-weight:500;font-size:17px;margin-bottom:3px}

/* ===== Le flux de données ===== */
.flux{display:grid;grid-template-columns:1fr 70px 1.15fr 70px 1fr;align-items:stretch;gap:0}
.flux .colonne{background:var(--blanc);border-radius:var(--rad21);padding:26px 24px;display:flex;flex-direction:column;gap:12px;min-width:0}
.flux .colonne.centre{background:var(--vert-sapin);color:var(--blanc)}
.flux .colonne h3{font-size:20px;font-weight:500;color:var(--vert-sapin)}
.flux .colonne.centre h3{color:var(--vert-pistache)}
.flux .colonne p{font-size:15px;color:var(--gris-ardoise)}
.flux .colonne.centre p{color:rgba(255,255,255,.8)}
.flux ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.flux li{font-size:15px;display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--beige-fonce);padding-bottom:7px}
.flux li:last-child{border-bottom:0}
.flux li span{color:var(--gris-ardoise);font-size:13.5px;white-space:nowrap}
.flux .colonne.centre li{border-bottom-color:rgba(255,255,255,.15)}
.flux .colonne.centre li span{color:var(--vert-pistache)}
.flux .liaison{display:grid;place-items:center;color:var(--vert-sapin)}
.flux .liaison svg{width:38px;height:38px}
.puces{display:flex;flex-wrap:wrap;gap:8px}
.puces span{padding:5px 13px;border-radius:var(--rad90);background:var(--beige-clair);color:var(--vert-sapin);font-size:14px}
.flux .note-flux{grid-column:1/-1;margin-top:22px;font-size:15px;color:var(--gris-ardoise);text-align:center}

/* ===== Observer, analyser, proposer ===== */
.triptyque{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.volet{border-top:3px solid var(--vert-sapin);padding-top:22px;min-width:0}
.volet .verbe{font-size:clamp(30px,3.6vw,40px);color:var(--vert-sapin);line-height:1}
.volet .verbe span{color:var(--rouge)}
.volet p{margin-top:14px;font-size:16px;color:var(--gris-ardoise)}
.volet ul{margin:14px 0 0;padding-left:18px;font-size:15.5px;color:var(--gris-ardoise)}
.volet li{margin-bottom:6px}

@media (max-width:980px){
  .ouverture.duo-ouverture .cadre{grid-template-columns:1fr}
  .flux{grid-template-columns:1fr}
  .flux .liaison{padding:10px 0}
  .flux .liaison svg{transform:rotate(90deg)}
  .triptyque{grid-template-columns:1fr}
}
@media (max-width:640px){
  .besoin{grid-template-columns:1fr;gap:12px}
  .besoin .vers{transform:rotate(90deg)}
}
@media (prefers-reduced-motion:reduce){.etat .point{animation:none}}