:root{
  --bleu:#012060; --bleu-dyn:#0B5CFD; --vert:#3D7C02; --vert-cl:#5fa32a;
  --bordeaux:#770B20; --violet:#6b3fa0;
  --ink:#0d1526; --muted:#9aa8c4; --muted-d:#54617d; --line:#e3e9f4; --line-dk:rgba(255,255,255,.14);
  --cream:#f6f8fc; --cream2:#eef2f9; --white:#ffffff; --dark:#060d1c; --dark2:#0b1424;
  --grad:linear-gradient(115deg,#012060,#0a4a7a 45%,#3D7C02);
  --maxw:1240px;
  --r:18px; --r-sm:10px;
  --shadow:0 12px 44px rgba(0,0,0,.18);
  --shadow-lg:0 30px 80px rgba(0,0,0,.4);
  --sans:Calibri,'Segoe UI',Candara,'Trebuchet MS',system-ui,-apple-system,sans-serif;
  --display:Calibri,'Segoe UI Semibold','Segoe UI',Candara,'Trebuchet MS',system-ui,sans-serif;
  --mono:'Segoe UI','Calibri',system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;min-width:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--sans);color:var(--ink);background:var(--white);line-height:1.68;overflow-x:hidden;max-width:100vw;font-size:17px}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--display);line-height:1.07;font-weight:700;color:var(--bleu);letter-spacing:-.015em}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--vert);font-weight:700}
.mono{font-family:var(--mono)}

/* ---------- HEADER (transparent au départ, se solidifie) ---------- */
header{position:sticky;top:0;z-index:200;background:rgba(6,13,28,.72);backdrop-filter:blur(16px);border-bottom:1px solid var(--line-dk);transition:.3s}
.nav{display:flex;align-items:center;justify-content:space-between;height:96px;gap:20px}
.brand{display:flex;align-items:center;height:68px;flex-shrink:0;background:rgba(255,255,255,.96);padding:6px 12px;border-radius:10px}
.brand img{height:64px;width:auto}
.menu{display:flex;align-items:center;gap:4px}
.menu>a,.dropdown>.dbtn{padding:10px 15px;border-radius:9px;font-size:.94rem;font-weight:600;color:#fff;transition:.18s;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:5px;background:none;border:none;font-family:inherit}
.menu>a:hover,.dropdown>.dbtn:hover{background:rgba(255,255,255,.12)}
.menu>a.active{color:var(--vert-cl)}
.cta-nav{background:var(--grad);color:#fff!important;padding:11px 22px!important;border-radius:999px;box-shadow:0 8px 22px rgba(20,70,30,.35)}
.cta-nav:hover{filter:brightness(1.1)}
.dropdown{position:relative}
.dropdown-panel{position:absolute;top:calc(100% + 8px);left:0;background:var(--dark2);border:1px solid var(--line-dk);border-radius:14px;padding:10px;min-width:330px;box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;display:grid;gap:2px}
.dropdown:hover .dropdown-panel,.dropdown:focus-within .dropdown-panel{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown-panel a{display:flex;align-items:center;gap:12px;padding:12px;border-radius:10px;font-size:.9rem;font-weight:600;color:#fff}
.dropdown-panel a:hover{background:rgba(255,255,255,.08)}
.dropdown-panel .dot{width:11px;height:11px;border-radius:50%;flex-shrink:0}
.dropdown-panel small{display:block;font-weight:400;color:var(--muted);font-size:.78rem}
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px;flex-direction:column;gap:5px}
.burger span{width:26px;height:2.5px;background:#fff;border-radius:2px;transition:.25s}
.burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

/* pages */
.page{display:none}
.page.on{display:block;animation:fade .5s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}

/* ---------- HERO IMMERSIF (fond animé + vidéo) ---------- */
.hero{position:relative;min-height:calc(100vh - 80px);display:flex;align-items:center;overflow:hidden;background:var(--dark)}
.hero-bg{position:absolute;inset:0;z-index:0;background:linear-gradient(115deg,#012060,#063a6b,#0a4a3a,#2f7a2a,#012060);background-size:300% 300%;animation:flow 18s ease infinite}
@keyframes flow{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.hero-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 40%,transparent,rgba(6,13,28,.55) 80%)}
.hero-grain{position:absolute;inset:0;z-index:1;opacity:.5;background:
  radial-gradient(1px 1px at 20% 30%,rgba(255,255,255,.4),transparent),
  radial-gradient(1px 1px at 60% 70%,rgba(255,255,255,.3),transparent),
  radial-gradient(1px 1px at 80% 20%,rgba(255,255,255,.25),transparent),
  radial-gradient(1px 1px at 40% 80%,rgba(255,255,255,.3),transparent);
  background-size:200px 200px,240px 240px,180px 180px,220px 220px}
.hero .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;padding:60px 32px}
.hero-copy{color:#fff}
.hero-badge{display:inline-flex;align-items:center;gap:9px;padding:8px 16px;border-radius:999px;font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#fff;font-weight:700;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(6px)}
.hero-badge .b{width:8px;height:8px;border-radius:50%;background:var(--vert-cl);box-shadow:0 0 12px var(--vert-cl)}
.hero h1{color:#fff;font-size:clamp(2.6rem,5.4vw,4.4rem);margin:22px 0 20px;text-shadow:0 4px 30px rgba(0,0,0,.3)}
.hero h1 .g{background:linear-gradient(100deg,#7fd94a,#c9f0b0);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.lead{font-size:1.15rem;color:rgba(255,255,255,.86);max-width:52ch;margin-bottom:34px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;gap:9px;padding:15px 30px;border-radius:999px;font-weight:700;font-size:1rem;transition:.2s;cursor:pointer;border:none;font-family:inherit}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 14px 36px rgba(20,70,30,.4)}
.btn-primary:hover{filter:brightness(1.1);transform:translateY(-2px)}
.btn-glass{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px)}
.btn-glass:hover{background:rgba(255,255,255,.2)}
/* carte vidéo */
.hero-video{position:relative;border-radius:22px;overflow:hidden;box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.18);background:#fff;aspect-ratio:16/11}
.hero-video video{width:100%;height:100%;object-fit:cover;display:block}
.hero-video .vlabel{position:absolute;left:16px;bottom:14px;font-family:var(--mono);font-size:.72rem;color:#fff;background:rgba(6,13,28,.6);padding:6px 12px;border-radius:8px;backdrop-filter:blur(6px);display:flex;align-items:center;gap:8px}
.hero-video .vlabel .live{width:7px;height:7px;border-radius:50%;background:var(--vert-cl);box-shadow:0 0 8px var(--vert-cl);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.scroll-hint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;color:rgba(255,255,255,.6);font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:8px}
.scroll-hint .arrow{width:22px;height:22px;border-right:2px solid rgba(255,255,255,.5);border-bottom:2px solid rgba(255,255,255,.5);transform:rotate(45deg);animation:bounce 2s infinite}
@keyframes bounce{0%,100%{transform:rotate(45deg) translate(0,0)}50%{transform:rotate(45deg) translate(5px,5px)}}

/* ---------- reveal au scroll ---------- */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- STRIP ---------- */
.strip{background:var(--dark);color:#fff;border-bottom:1px solid var(--line-dk)}
.strip .wrap{display:flex;justify-content:space-between;gap:24px;padding:16px 32px;font-family:var(--mono);font-size:.76rem;letter-spacing:.05em;color:var(--muted);flex-wrap:wrap}
.strip b{color:var(--vert-cl)}

/* ---------- SECTIONS ---------- */
section.blk{padding:96px 0}
.blk-head{text-align:center;max-width:700px;margin:0 auto 56px}
.blk-head h2{font-size:clamp(2rem,3.6vw,2.9rem);margin:14px 0 14px}
.blk-head p{color:var(--muted-d);font-size:1.06rem}
.dark-sec{background:var(--dark);color:#fff}
.dark-sec h2{color:#fff}.dark-sec .blk-head p{color:var(--muted)}
.alt{background:var(--cream)}

/* ---------- BANDE IMAGE PLEIN CADRE (parallax + fondu) ---------- */
.imgband{position:relative;min-height:460px;display:flex;align-items:center;overflow:hidden;background:var(--dark)}
.imgband .bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;transform:scale(1.08);transition:transform 1.2s ease}
.imgband.in .bg{transform:scale(1)}
.imgband::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,13,28,.86),rgba(6,13,28,.45) 60%,transparent)}
.imgband .wrap{position:relative;z-index:2;color:#fff;padding:70px 32px}
.imgband .eyebrow{color:var(--vert-cl)}
.imgband h2{color:#fff;font-size:clamp(1.9rem,3.6vw,2.9rem);max-width:20ch;margin:14px 0 16px}
.imgband p{color:rgba(255,255,255,.86);max-width:48ch;margin-bottom:24px;font-size:1.06rem}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.stat{text-align:center;padding:30px 18px;border-radius:var(--r);background:rgba(255,255,255,.04);border:1px solid var(--line-dk)}
.dark-sec .stat .n{color:#fff}
.stat .n{font-family:var(--display);font-size:3rem;font-weight:800;line-height:1;background:linear-gradient(100deg,#7fd94a,#5fa3ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat .l{color:var(--muted);font-size:.9rem;margin-top:10px}

/* activités */
.acts{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.act{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px 30px;transition:.25s;position:relative;overflow:hidden}
.act::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:.3s}
.act:hover::before{transform:scaleX(1)}
.act:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}
.act .ic{width:56px;height:56px;border-radius:15px;display:grid;place-items:center;margin-bottom:20px;background:var(--grad)}
.act .k{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-d);font-weight:700}
.act h3{font-size:1.45rem;margin:6px 0 12px}
.act p{color:var(--muted-d);font-size:.96rem;margin-bottom:16px}
.act .go{font-weight:700;font-size:.92rem;color:var(--vert)}

/* domaines : cartes sombres avec image de fond */
.doms{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.dom{border-radius:var(--r);overflow:hidden;transition:.25s;cursor:pointer;position:relative;min-height:260px;display:flex;flex-direction:column;justify-content:flex-end;background:var(--dark2);border:1px solid var(--line-dk)}
.dom::before{content:"";position:absolute;inset:0;background:var(--c,var(--bleu));opacity:.85;z-index:0;transition:.3s}
.dom::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(6,13,28,.85));z-index:1}
.dom:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.dom:hover::before{opacity:.7}
.dom .bd{position:relative;z-index:2;padding:26px 24px;color:#fff}
.dom .fiche{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;color:rgba(255,255,255,.7);display:flex;justify-content:space-between;margin-bottom:10px}
.dom h3{color:#fff;font-size:1.28rem;margin-bottom:8px}
.dom p{color:rgba(255,255,255,.8);font-size:.9rem;margin-bottom:14px}
.dom .tags{font-family:var(--mono);font-size:.7rem;color:rgba(255,255,255,.6);display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid rgba(255,255,255,.14)}
.dom .arrow{color:#fff;font-weight:800}

/* méthode */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:26px 22px;position:relative}
.step .num{font-family:var(--display);font-size:2rem;font-weight:800;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.step.free{background:linear-gradient(140deg,rgba(61,124,2,.1),rgba(11,92,253,.05));border-color:var(--vert)}
.step .badge-free{position:absolute;top:16px;right:16px;background:var(--grad);color:#fff;font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;padding:5px 10px;border-radius:999px;font-weight:700}
.step h4{color:var(--bleu);font-size:1.04rem;margin:10px 0 6px}
.step p{color:var(--muted-d);font-size:.85rem}

/* zone */
.zone{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.zone h2{font-size:clamp(1.8rem,3.2vw,2.6rem);margin-bottom:18px}
.zone h2 .g{color:var(--vert)}
.zone p{color:var(--muted-d);margin-bottom:12px}
.zone-list{border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.zone-list .row{display:flex;justify-content:space-between;padding:16px 22px;border-bottom:1px solid var(--line);font-size:.96rem;background:#fff}
.zone-list .row:last-child{border-bottom:none}
.zone-list .row .num{font-family:var(--mono);color:var(--muted-d);font-size:.82rem}
.zone-list .row.big{background:var(--grad);color:#fff;font-weight:700}
.zone-list .row.big .num{color:#c9f0b0}

/* CTA band vidéo/immersif */
.ctaband{background:var(--grad);color:#fff;border-radius:24px;padding:60px 50px;position:relative;overflow:hidden}
.ctaband::after{content:"";position:absolute;right:-70px;top:-70px;width:280px;height:280px;border-radius:50%;background:rgba(255,255,255,.08)}
.ctaband h2{color:#fff;font-size:clamp(1.9rem,3.4vw,2.7rem);max-width:16ch;margin-bottom:14px}
.ctaband p{color:rgba(255,255,255,.9);max-width:48ch;margin-bottom:26px}
.ctaband .btn-white{background:#fff;color:var(--bleu)}
.ctaband .row{display:flex;gap:14px;flex-wrap:wrap}
.ctaband .btn-outline{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55)}

/* PRÉSENTATION */
.pres-hero{position:relative;overflow:hidden;color:#fff;padding:100px 0 88px;background:var(--dark)}
.pres-hero .pbg{position:absolute;inset:0;z-index:0;background:linear-gradient(115deg,#012060,#063a6b,#0a4a3a,#2f7a2a,#012060);background-size:300% 300%;animation:flow 20s ease infinite}
.pres-hero .pbg::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 40% 30%,transparent,rgba(6,13,28,.6))}
.pres-hero .wrap{position:relative;z-index:1}
.pres-hero .eyebrow{color:var(--vert-cl)}
.pres-hero h1{color:#fff;font-size:clamp(2.3rem,4.5vw,3.6rem);margin:16px 0 20px;max-width:18ch}
.pres-hero h1 .g{color:#c9f0b0}
.pres-hero p{color:rgba(255,255,255,.9);max-width:60ch;font-size:1.1rem}
.pres-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
.value{display:flex;gap:16px;margin-bottom:26px}
.value .ic{width:48px;height:48px;border-radius:13px;flex-shrink:0;display:grid;place-items:center;background:var(--grad)}
.value h4{font-size:1.16rem;margin-bottom:5px}
.value p{color:var(--muted-d);font-size:.95rem}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pillar{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;position:relative;overflow:hidden}
.pillar::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:var(--grad)}
.pillar .big{font-family:var(--display);font-size:2.5rem;font-weight:800;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.pillar h4{margin:10px 0 8px;font-size:1.18rem}
.pillar p{color:var(--muted-d);font-size:.9rem}
.media-card{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-lg);border:1px solid var(--line)}
.media-card .imgbox{position:relative;overflow:hidden}
.media-card .imgbox img{width:100%;height:100%;object-fit:cover}
.media-card .cap{padding:14px 18px;font-family:var(--mono);font-size:.74rem;color:var(--muted-d);display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);background:#fff}
.media-card .cap .dotv{width:9px;height:9px;border-radius:50%;background:var(--vert)}

/* DOMAINE DETAIL */
.dhero{position:relative;overflow:hidden;padding:80px 0 60px;color:#fff;background:var(--dark)}
.dhero .dbg{position:absolute;inset:0;z-index:0;background:var(--c,var(--bleu))}
.dhero .dbg::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(6,13,28,.7),rgba(6,13,28,.3))}
.dhero .wrap{position:relative;z-index:1}
.crumb{font-family:var(--mono);font-size:.76rem;color:rgba(255,255,255,.7);margin-bottom:24px}
.crumb a{color:var(--vert-cl)}
.dhero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.dhero .fiche-tag{font-family:var(--mono);font-size:.78rem;letter-spacing:.12em;color:#fff;font-weight:700;text-transform:uppercase;opacity:.85}
.dhero h1{color:#fff;font-size:clamp(2.2rem,4.2vw,3.3rem);margin:14px 0 18px}
.dhero h1 .g{color:#c9f0b0}
.dhero p{color:rgba(255,255,255,.88);font-size:1.08rem;max-width:52ch}
.dhero-card{border-radius:var(--r);height:320px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);position:relative;overflow:hidden;display:grid;place-items:center}
.dhero-card .rn{font-family:var(--display);font-size:7rem;font-weight:800;color:rgba(255,255,255,.14)}
.dhero-card .lbl{font-family:var(--mono);color:rgba(255,255,255,.8);font-size:.8rem;position:absolute;bottom:20px;left:24px}
.dsection{padding:64px 0}
.dsub{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.dcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px}
.dcard h4{display:flex;align-items:center;gap:10px;font-size:1.14rem;margin-bottom:12px}
.dcard h4 .dot{width:10px;height:10px;border-radius:50%;background:var(--c,var(--bleu))}
.dcard ul{list-style:none}
.dcard li{padding:7px 0 7px 22px;position:relative;color:var(--muted-d);font-size:.94rem}
.dcard li::before{content:"";position:absolute;left:0;top:14px;width:8px;height:8px;border-radius:50%;background:var(--c,var(--vert))}
.dom-nav{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}
.dom-nav a{padding:10px 18px;border:1px solid var(--line);border-radius:999px;font-size:.86rem;font-weight:600;transition:.18s;background:#fff}
.dom-nav a:hover{border-color:var(--c,var(--bleu));color:var(--c,var(--bleu))}
.dom-nav a.cur{background:var(--c,var(--bleu));color:#fff;border-color:transparent}

/* FORMATION */
.cat{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.theme{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;position:relative}
.theme::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:var(--c,var(--bleu))}
.theme .bd{padding:26px 22px}
.theme .k{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;color:var(--muted-d);text-transform:uppercase}
.theme h4{font-size:1.14rem;margin:6px 0 16px}
.theme .fm{display:flex;justify-content:space-between;gap:10px;padding:11px 0;border-top:1px solid var(--line);font-size:.86rem}
.theme .fm .d{color:var(--muted-d);font-family:var(--mono);font-size:.78rem;flex-shrink:0}
.agenda{display:grid;gap:14px}
.sess{display:grid;grid-template-columns:auto 1fr auto auto;gap:22px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px 24px;transition:.2s}
.sess:hover{box-shadow:var(--shadow);transform:translateX(4px);border-color:transparent}
.sess .date{text-align:center;border-radius:12px;padding:10px 16px;min-width:78px;background:var(--grad);color:#fff}
.sess .date .d{font-family:var(--display);font-size:1.55rem;font-weight:800;line-height:1}
.sess .date .m{font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;text-transform:uppercase;opacity:.9}
.sess .info h4{font-size:1.08rem;margin-bottom:4px}
.sess .info .meta{font-family:var(--mono);font-size:.74rem;color:var(--muted-d)}
.sess .info .meta b{color:var(--vert)}
.sess .places{font-size:.8rem;color:var(--muted-d);background:var(--cream);padding:7px 13px;border-radius:999px;font-family:var(--mono);white-space:nowrap}
.sess .btn-r{background:var(--grad);color:#fff;padding:11px 22px;border-radius:999px;font-weight:700;font-size:.9rem;white-space:nowrap;border:none;cursor:pointer;transition:.18s}
.sess .btn-r:hover{filter:brightness(1.1)}

/* CONTACT */
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:start}
.cinfo h2{font-size:2rem;margin-bottom:16px}
.cinfo p{color:var(--muted-d);margin-bottom:26px}
.cblock{display:flex;gap:14px;margin-bottom:22px;align-items:flex-start}
.cblock .ic{width:46px;height:46px;border-radius:12px;background:var(--grad);display:grid;place-items:center;flex-shrink:0}
.cblock .t{font-weight:700}
.cblock .s{color:var(--muted-d);font-size:.92rem}
.cform{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:36px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.cform::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:var(--grad)}
.field{margin-bottom:18px}
.field label{display:block;font-weight:700;font-size:.88rem;margin-bottom:7px}
.field input,.field select,.field textarea{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:12px;font-family:inherit;font-size:.96rem;background:var(--cream);transition:.18s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--vert);background:#fff;box-shadow:0 0 0 3px rgba(61,124,2,.12)}
.field textarea{resize:vertical;min-height:120px}
.note{font-size:.82rem;color:var(--muted-d);margin-top:14px}

/* FOOTER */
footer{background:var(--dark);color:#fff;padding:64px 0 30px;position:relative}
footer::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:40px;border-bottom:1px solid var(--line-dk)}
.foot-brand img{height:60px;margin-bottom:18px;width:auto}
.foot-brand p{color:rgba(255,255,255,.7);font-size:.9rem;max-width:30ch;font-style:italic}
.foot-col h5{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--vert-cl);margin-bottom:16px}
.foot-col a,.foot-col .li{display:block;color:rgba(255,255,255,.82);font-size:.92rem;padding:5px 0;cursor:pointer}
.foot-col a:hover{color:#fff}
.foot-bottom{display:flex;justify-content:space-between;padding-top:24px;color:rgba(255,255,255,.6);font-size:.82rem;flex-wrap:wrap;gap:12px}
.foot-bottom a{color:rgba(255,255,255,.7)}

/* RESPONSIVE */
@media(max-width:1080px){
  .stats{grid-template-columns:repeat(2,1fr);gap:16px}
  .steps{grid-template-columns:repeat(2,1fr)}
  .cat{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .burger{display:flex}
  .menu{position:fixed;top:96px;left:0;right:0;background:var(--dark2);flex-direction:column;align-items:stretch;padding:16px 20px 26px;gap:2px;border-bottom:1px solid var(--line-dk);box-shadow:var(--shadow-lg);transform:translateY(-135%);transition:.3s;max-height:calc(100vh - 96px);overflow-y:auto}
  .menu.open{transform:translateY(0)}
  .menu>a,.dropdown>.dbtn{padding:14px 12px;width:100%;font-size:1rem}
  .dropdown{width:100%}
  .dropdown-panel{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding:4px 0 8px 12px;min-width:0;display:none;background:none}
  .dropdown.open .dropdown-panel{display:grid}
  .cta-nav{text-align:center;justify-content:center;margin-top:8px}
  .hero{min-height:auto}
  .hero .wrap{grid-template-columns:1fr;gap:40px;padding:48px 32px 60px}
  .hero-video{max-width:480px;margin:0 auto}
  .scroll-hint{display:none}
  .zone{grid-template-columns:1fr;gap:32px}
  .pres-grid,.contact-grid,.dhero-grid{grid-template-columns:1fr;gap:34px}
  .acts,.doms,.pillars,.dsub{grid-template-columns:1fr;gap:18px}
  .cat{grid-template-columns:1fr}
  .imgband::before{background:linear-gradient(180deg,rgba(6,13,28,.65),rgba(6,13,28,.85))}
  .sess{grid-template-columns:auto 1fr;gap:14px}
  .sess .places,.sess .btn-r{grid-column:2}
  .foot-grid{grid-template-columns:1fr;gap:28px}
}
@media(max-width:560px){
  body{font-size:16px}
  .wrap{padding:0 20px}
  section.blk{padding:64px 0}
  .stats{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr}
  .ctaband{padding:40px 26px}
  .cform{padding:24px}
  .strip .wrap{gap:8px}
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2.5px solid var(--vert-cl);outline-offset:2px;border-radius:4px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}.hero-bg,.pres-hero .pbg{animation:none}}


/* colibri filigrane */
.hero{position:relative}
.colibri-wm{position:absolute;pointer-events:none;opacity:.06;z-index:0}
.colibri-hero{top:40px;right:-40px;width:340px;transform:rotate(-8deg)}
.hero .wrap{position:relative;z-index:1}
.ctaband .colibri-cta{right:24px;bottom:-10px;width:220px;opacity:.12;transform:rotate(6deg)}
.pres-hero{position:relative;overflow:hidden}
.pres-hero .colibri-pres{right:-30px;top:20px;width:280px;opacity:.1}
.pres-hero .wrap{position:relative;z-index:1}


/* ---------- RECHERCHE ---------- */
.searchbox{position:relative;flex-shrink:0;margin-left:auto;margin-right:6px}
.searchbox input{width:190px;padding:9px 34px 9px 13px;border:1px solid var(--line2);
  border-radius:var(--r-sm);font-family:inherit;font-size:.86rem;background:#fff;color:var(--ink);transition:.18s}
.searchbox input:focus{outline:none;border-color:var(--vert);width:230px;box-shadow:0 0 0 3px rgba(61,124,2,.12)}
.searchbox .si{position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none;opacity:.5}
.search-res{position:absolute;top:calc(100% + 6px);right:0;width:340px;background:#fff;
  border:1px solid var(--line2);box-shadow:var(--shadow-lg);border-radius:var(--r-sm);
  max-height:60vh;overflow-y:auto;display:none;z-index:400}
.search-res.on{display:block}
.search-res a{display:block;padding:11px 14px;border-bottom:1px solid var(--line);font-size:.88rem;color:var(--ink)}
.search-res a:last-child{border-bottom:none}
.search-res a:hover{background:var(--paper2)}
.search-res a b{display:block;font-weight:700;color:var(--bleu);margin-bottom:2px}
.search-res a span{color:var(--muted);font-size:.78rem}
.search-res .empty{padding:14px;color:var(--muted);font-size:.86rem}
@media(max-width:900px){
  .searchbox{order:5;width:100%;margin:10px 0 0}
  .searchbox input{width:100%}
  .searchbox input:focus{width:100%}
  .search-res{width:100%}
}

/* ---------- ÉLÉMENTS CLIQUABLES ---------- */
.act,.dom,.theme{cursor:pointer}
.act:hover,.theme:hover{background:var(--paper2)}
.act::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:var(--c,var(--vert));transform:scaleX(0);transform-origin:left;transition:.22s}
.act:hover::after{transform:scaleX(1)}
.clickable-hint{font-family:var(--mono);font-size:.72rem;color:var(--vert);
  font-weight:700;margin-top:12px;display:inline-block}
.theme .bd .more{display:block;margin-top:14px;font-size:.8rem;font-weight:700;color:var(--vert)}

/* ---------- PAGES LÉGALES ---------- */
.legal{max-width:860px}
.legal h3{font-size:1.15rem;margin:32px 0 12px;color:var(--bleu)}
.legal h3:first-child{margin-top:0}
.legal p{color:var(--muted);margin-bottom:12px}
.legal-list{list-style:none;margin:0 0 16px;border-top:1px solid var(--line)}
.legal-list li{padding:11px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:.95rem}
.legal-list li b{display:inline-block;min-width:230px;color:var(--bleu);font-weight:700}
.legal a{color:var(--vert);font-weight:600}
@media(max-width:640px){.legal-list li b{display:block;min-width:0;margin-bottom:2px}}

:root{--colibri:url('/img/2e4935e2c3.png')}
.hero,.pres-hero,.ctaband{position:relative;overflow:hidden}
.hero>.wrap,.pres-hero>.wrap,.ctaband>*:not(.colibri-bg){position:relative;z-index:1}
.colibri-bg{position:absolute;pointer-events:none;background:var(--colibri) no-repeat center/contain;z-index:0}
.cb-hero{top:56px;right:-30px;width:300px;height:283px;opacity:.07;transform:rotate(-6deg)}
.cb-pres{top:30px;right:-10px;width:260px;height:245px;opacity:.10;transform:rotate(-4deg)}
.cb-cta{right:30px;bottom:-6px;width:200px;height:189px;opacity:.14;transform:rotate(5deg)}
@media(max-width:700px){.cb-hero,.cb-pres,.cb-cta{width:180px;height:170px;opacity:.06}}

/* ================= HEADER v3 · corrigé ================= */
.nav{gap:16px}
.menu{flex:0 1 auto;min-width:0}
.menu>a,.dropdown>.dbtn{padding-left:11px;padding-right:11px;font-size:.87rem}

/* le CTA du menu : visible et lisible, ou pas affiché du tout · jamais fantôme */
.cta-nav{background:var(--bleu)!important;color:#fff!important;
  padding:11px 20px!important;border-radius:8px;box-shadow:none!important;
  align-items:center;justify-content:center}
.cta-nav:hover{background:var(--vert)!important}

.searchbox{margin-left:8px;margin-right:0}
.searchbox input{width:150px}
.searchbox input:focus{width:200px}

/* place insuffisante -> on retire VRAIMENT le CTA (pas de résidu blanc) */
@media(max-width:1340px){
  .cta-nav{display:none!important}
  .brand img{height:58px}
  .menu>a,.dropdown>.dbtn{padding-left:9px;padding-right:9px;font-size:.84rem}
}
@media(max-width:1100px){
  .searchbox input{width:130px}
  .brand img{height:54px}
}
/* mobile : menu déroulant, le CTA revient en pleine largeur */
@media(max-width:900px){
  .nav{height:78px!important}
  .brand img{height:50px}
  .menu{position:fixed;top:78px!important;max-height:calc(100vh - 78px)!important}
  .cta-nav{display:inline-flex!important;width:100%;margin:8px 0 0}
  .searchbox{position:static;order:-1;width:100%;margin:0 0 10px;padding:0}
  .searchbox input,.searchbox input:focus{width:100%!important;box-sizing:border-box}
  .search-res{position:static;width:100%;max-height:44vh;margin-top:6px;box-shadow:none}
}

/* ================= RECHERCHE · bordures garanties (var. de repli) ================= */
.searchbox input{
  border:1.5px solid var(--line2,#c7d1e4)!important;
  background:#fff!important;
  border-radius:8px!important;
  color:var(--ink,#101a30)!important;
}
.searchbox input::placeholder{color:var(--muted,#54617d);opacity:1}
.searchbox input:hover{border-color:var(--vert,#3D7C02)!important}
.searchbox input:focus{
  border-color:var(--vert,#3D7C02)!important;
  box-shadow:0 0 0 3px rgba(61,124,2,.14)!important;
}
.searchbox .si{color:var(--muted,#54617d)}
.search-res{
  border:1px solid var(--line2,#c7d1e4)!important;
  border-radius:8px;background:#fff;
  box-shadow:0 14px 40px rgba(1,32,96,.16)!important;
}
.search-res a{border-bottom:1px solid var(--line,#dce3ef)}
/* header sur fond sombre (maquette D) : champ lisible */

/* maquette D : header sombre -> champ translucide clair */
.searchbox input{background:rgba(255,255,255,.10)!important;
  border-color:rgba(255,255,255,.34)!important;color:#fff!important}
.searchbox input::placeholder{color:rgba(255,255,255,.65)}
.searchbox input:hover,.searchbox input:focus{
  background:rgba(255,255,255,.16)!important;border-color:#8ed14f!important}
.searchbox .si{color:rgba(255,255,255,.7)}
@media(max-width:900px){
  .searchbox input{background:#fff!important;color:#101a30!important;
    border-color:#c7d1e4!important}
  .searchbox input::placeholder{color:#54617d}
}

/* =====================================================================
   ACEF · maquette D · patch v2
   hero clair, header degrade, transitions douces entre sections
   ===================================================================== */

/* ---------- 1. HEADER : degrade bleu -> vert, logo sans encadre ------ */
header{
  background:linear-gradient(100deg,#012060 0%,#0a4a7a 52%,#2f7a2a 100%)!important;
  border-bottom:none!important;
  box-shadow:0 2px 24px rgba(1,32,96,.20);
}
header .nav{height:84px}
.brand{
  background:none!important;
  padding:0!important;
  border-radius:0!important;
  height:56px;
}
.brand img{height:52px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.28))}
#q,input#q{
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.30);
  color:#fff;
}
#q::placeholder{color:rgba(255,255,255,.72)}
.cta-nav{
  background:#fff!important;
  color:#012060!important;
  box-shadow:0 6px 18px rgba(0,0,0,.22)!important;
}
.cta-nav:hover{background:#eef7e4!important;filter:none}

/* ---------- 2. HERO CLAIR -------------------------------------------- */
.hero{
  background:#fff!important;
  min-height:0!important;
  padding:0;
}
.hero .wrap{
  padding:64px 32px 76px!important;
  align-items:center;
}
.hero-bg{
  background:
    radial-gradient(1100px 520px at 12% 8%, rgba(11,92,253,.10), transparent 62%),
    radial-gradient(900px 480px at 88% 92%, rgba(61,124,2,.13), transparent 62%),
    #ffffff!important;
  animation:none!important;
}
.hero-bg::after{
  background:linear-gradient(180deg,transparent 62%,#ffffff 100%)!important;
}
.hero-grain{display:none!important}

.hero-copy{color:var(--ink)}
.hero-badge{
  background:rgba(1,32,96,.05);
  border:1px solid rgba(1,32,96,.14);
  color:var(--bleu);
  backdrop-filter:none;
}
.hero h1{
  color:var(--bleu)!important;
  text-shadow:none!important;
  font-size:clamp(2.3rem,4.6vw,3.7rem);
  margin:20px 0 18px;
}
.hero h1 .g{
  background-image:linear-gradient(100deg,#3D7C02,#5fa32a)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
}
.hero p.lead{color:var(--muted-d)!important;font-size:1.08rem;margin-bottom:30px}
.hero .btn-glass{
  background:#fff;
  color:var(--bleu);
  border:1.5px solid rgba(1,32,96,.18);
  backdrop-filter:none;
}
.hero .btn-glass:hover{background:#f2f6fd;border-color:rgba(1,32,96,.32)}

/* le visuel doit ressortir sur fond blanc */
.hero-video{
  border:1px solid var(--line)!important;
  box-shadow:0 24px 60px rgba(1,32,96,.14)!important;
  aspect-ratio:4/3;
  background:#fff!important;
}
/* logo anime : jamais recadre, jamais deforme */
.hero-video video{
  object-fit:contain!important;
  background:#fff;
}
.hero-visual{position:relative}
.hero-visual::before{
  content:"";position:absolute;inset:-26px -22px -22px -26px;z-index:-1;
  border-radius:32px;
  background:linear-gradient(140deg,rgba(11,92,253,.10),rgba(61,124,2,.10));
  filter:blur(2px);
}
.hero-video .vlabel{background:rgba(6,13,28,.72)}
.scroll-hint{
  color:var(--muted-d)!important;
  bottom:16px;
}
.scroll-hint .arrow{
  border-right-color:rgba(1,32,96,.35)!important;
  border-bottom-color:rgba(1,32,96,.35)!important;
}

/* ---------- 3. BANDEAU SOUS LE HERO : clair, plus de rupture --------- */
.strip{
  background:#fff!important;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)!important;
  color:var(--muted-d)!important;
}
.strip .wrap{color:var(--muted-d)}
.strip b{color:var(--vert)!important}

/* ---------- 4. HARMONISATION DES SECTIONS ---------------------------- */
/* fini le damier blanc/creme : fondu progressif, aucune arete franche  */
.blk{padding:82px 0}
.alt,.blk.alt{
  background:linear-gradient(180deg,
      #ffffff 0%,
      #f7f9fd 18%,
      #f7f9fd 82%,
      #ffffff 100%)!important;
}
.blk-head{margin:0 auto 46px}
.blk-head p{color:var(--muted-d)}

/* les bandes photo se fondent en haut et en bas */
.imgband{min-height:420px}
.imgband::after{
  content:"";position:absolute;left:0;right:0;z-index:2;pointer-events:none;
  height:88px;
}
.imgband::after{
  top:0;
  background:linear-gradient(180deg,#ffffff,transparent);
}
.imgband .fade-b{
  position:absolute;left:0;right:0;bottom:0;height:88px;z-index:2;
  pointer-events:none;
  background:linear-gradient(0deg,#ffffff,transparent);
}

/* ---------- 5. CHIFFRES CLES : lisibles et animes -------------------- */
.stats{gap:20px}
.stat{
  background:#fff!important;
  border:1px solid var(--line)!important;
  border-radius:16px;
  padding:34px 20px 30px!important;
  position:relative;overflow:hidden;
  box-shadow:0 6px 26px rgba(1,32,96,.05);
  transition:.25s;
}
.stat::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,#012060,#0a4a7a 55%,#3D7C02);
}
.stat:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(1,32,96,.10)}
.stat .n{
  font-size:clamp(2.8rem,5vw,3.9rem)!important;
  font-weight:800;
  background-image:linear-gradient(100deg,#012060,#3D7C02)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
  letter-spacing:-.02em;
}
.stat .n .u{font-size:.55em;font-weight:700}
.stat .l{
  color:var(--muted-d)!important;
  font-size:.9rem;font-weight:600;margin-top:12px;
  line-height:1.35;
}

/* ---------- 6. QUATRE ACTIVITES : alignees, CTA en bas --------------- */
.acts{grid-template-columns:repeat(4,1fr)!important;gap:20px}
.act{
  display:flex;flex-direction:column;
  padding:30px 24px 26px!important;
}
.act .ic{
  width:52px;height:52px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb,var(--c) 12%,#fff);
  margin-bottom:16px;
}
.act .k{margin-bottom:6px;color:var(--c)!important}
.act h3{font-size:1.28rem;margin-bottom:10px}
.act p{color:var(--muted-d);font-size:.95rem;flex:1 1 auto;margin-bottom:18px}
.act .go{
  margin-top:auto;align-self:flex-start;
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 16px;border-radius:999px;
  background:color-mix(in srgb,var(--c) 10%,#fff);
  color:var(--c)!important;
  border:1px solid color-mix(in srgb,var(--c) 26%,#fff);
  cursor:pointer;transition:.2s;
}
.act:hover .go{background:var(--c);color:#fff!important;border-color:var(--c)}

/* ---------- 7. FRISE CHRONOLOGIQUE (6 etapes) ------------------------ */
.steps.timeline{
  grid-template-columns:repeat(6,1fr)!important;
  gap:0;
  position:relative;
  padding-top:56px;
}
.steps.timeline::before{
  content:"";position:absolute;top:22px;left:8%;right:8%;height:3px;
  background:linear-gradient(90deg,#012060,#0a4a7a 50%,#3D7C02);
  border-radius:2px;
}
.steps.timeline .step{
  background:none!important;border:none!important;
  padding:0 12px!important;
  text-align:center;
  position:relative;
}
.steps.timeline .step::before{
  content:"";position:absolute;top:-42px;left:50%;transform:translateX(-50%);
  width:17px;height:17px;border-radius:50%;
  background:#fff;
  border:3px solid var(--bleu-dyn);
  box-shadow:0 0 0 5px rgba(11,92,253,.12);
  transition:.3s;
}
.steps.timeline .step:hover::before{
  background:var(--bleu-dyn);
  box-shadow:0 0 0 8px rgba(11,92,253,.16);
}
.steps.timeline .step.free::before{
  border-color:var(--vert);
  box-shadow:0 0 0 5px rgba(61,124,2,.16);
}
.steps.timeline .step.free:hover::before{background:var(--vert)}
.steps.timeline .num{
  font-size:1.5rem!important;margin-bottom:8px;
}
.steps.timeline .step h4{
  font-size:1rem;margin-bottom:8px;color:var(--bleu);
}
.steps.timeline .step p{
  font-size:.86rem;color:var(--muted-d);line-height:1.5;
}
.steps.timeline .badge-free{
  position:static!important;
  display:inline-block;margin-bottom:8px;
}
/* apparition sequencee */
.js .steps.timeline .step{opacity:0;transform:translateY(14px);transition:.5s ease}
.steps.timeline.in .step{opacity:1;transform:none}
.steps.timeline.in .step:nth-child(1){transition-delay:.00s}
.steps.timeline.in .step:nth-child(2){transition-delay:.09s}
.steps.timeline.in .step:nth-child(3){transition-delay:.18s}
.steps.timeline.in .step:nth-child(4){transition-delay:.27s}
.steps.timeline.in .step:nth-child(5){transition-delay:.36s}
.steps.timeline.in .step:nth-child(6){transition-delay:.45s}

/* ---------- 8. RESPONSIVE -------------------------------------------- */
@media(max-width:1080px){
  .acts{grid-template-columns:repeat(2,1fr)!important}
  .steps.timeline{grid-template-columns:repeat(3,1fr)!important;row-gap:44px}
}
@media(max-width:860px){
  .hero .wrap{grid-template-columns:1fr!important;padding:44px 22px 54px!important}
  .hero-visual{order:-1}
  .hero-visual::before{display:none}
  header .nav{height:70px}
  .brand{height:44px}
  .brand img{height:40px}
}
@media(max-width:640px){
  .acts{grid-template-columns:1fr!important}
  .steps.timeline{grid-template-columns:1fr!important;padding-top:0;row-gap:26px}
  .steps.timeline::before{
    top:6px;bottom:6px;left:9px;right:auto;width:3px;height:auto;
    background:linear-gradient(180deg,#012060,#3D7C02);
  }
  .steps.timeline .step{text-align:left;padding:0 0 0 38px!important}
  .steps.timeline .step::before{top:4px;left:1px;transform:none}
  .blk{padding:56px 0}
  .stat{padding:26px 16px!important}
}

/* =====================================================================
   ACEF - maquette D - patch v3 : contenu
   ===================================================================== */

/* ---------- 1. SIX EXPERTISES : image en haut, texte en bas --------- */
.dom{
  background:#fff!important;
  border:1px solid var(--line)!important;
  min-height:0!important;
  justify-content:flex-start!important;
  box-shadow:0 6px 26px rgba(1,32,96,.05);
}
.dom::before,.dom::after{display:none!important}
.dom>img{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:186px!important;
  object-fit:cover;
  flex:0 0 auto;
  border-bottom:3px solid var(--c);
}
.dom .top{display:none!important}
.dom .bd{
  background:#fff!important;
  padding:22px 22px 24px!important;
  position:relative;z-index:1;
  display:flex;flex-direction:column;flex:1 1 auto;
}
.dom .fiche{
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted-d)!important;margin-bottom:10px;
}
.dom .fiche .code{
  background:var(--c);color:#fff!important;
  padding:3px 9px;border-radius:999px;font-weight:700;letter-spacing:.06em;
}
.dom h3{color:var(--bleu)!important;font-size:1.18rem;margin-bottom:9px}
.dom p{color:var(--muted-d)!important;font-size:.93rem;flex:1 1 auto;margin-bottom:14px}
.dom .tags{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:14px;border-top:1px solid var(--line);
  font-size:.82rem;color:var(--muted-d)!important;font-family:var(--mono);
}
.dom .tags .arrow{color:var(--c)!important;font-size:1.15rem;transition:.2s}
.dom:hover{transform:translateY(-5px);box-shadow:0 20px 46px rgba(1,32,96,.13)}
.dom:hover .tags .arrow{transform:translateX(5px)}

/* ---------- 2. PRESENTATION : accroche + Notre histoire ------------- */
.pres-hero .vision{
  font-size:1.25rem;font-style:italic;color:var(--vert)!important;
  font-weight:600;margin-bottom:14px;
}
.hist-grid{display:grid;grid-template-columns:1.55fr .95fr;gap:44px;align-items:start}
.hist-txt p{color:var(--muted-d);margin-bottom:15px;font-size:1rem}
.hist-txt .lead-h{
  font-size:1.2rem;color:var(--bleu)!important;font-weight:600;
  line-height:1.5;margin-bottom:20px;
}
.hist-txt b{color:var(--bleu)}
.hist-txt .signature{
  margin-top:26px;padding-left:20px;
  border-left:3px solid var(--vert);
  font-style:italic;font-weight:600;color:var(--bleu)!important;font-size:1.06rem;
}
.hist-side{
  background:linear-gradient(160deg,#f7f9fd,#eef4ec);
  border:1px solid var(--line);border-radius:18px;padding:26px 24px;
  position:sticky;top:110px;
}
.hist-fact{
  display:flex;justify-content:space-between;gap:14px;
  padding:11px 0;border-bottom:1px dashed var(--line);
}
.hist-fact:last-of-type{border-bottom:none}
.hf-k{font-family:var(--mono);font-size:.76rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted-d)}
.hf-v{font-weight:700;color:var(--bleu);text-align:right;font-size:.94rem}
.hist-note{
  margin-top:16px;padding-top:14px;border-top:1px solid var(--line);
  font-size:.78rem;color:var(--muted-d);line-height:1.45;
}

/* ---------- 3. QUATRE PILIERS -------------------------------------- */
.pillars{grid-template-columns:repeat(4,1fr)!important}

/* ---------- 4. SECTEURS D'INTERVENTION ------------------------------ */
.sects{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.sect{
  display:flex;align-items:center;gap:13px;
  background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:18px 18px;transition:.22s;
}
.sect .si{
  width:40px;height:40px;flex:0 0 auto;border-radius:11px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,rgba(1,32,96,.09),rgba(61,124,2,.11));
  color:var(--bleu);
}
.sect .sn{font-weight:600;font-size:.94rem;color:var(--bleu);line-height:1.3}
.sect:hover{
  border-color:var(--vert);transform:translateY(-3px);
  box-shadow:0 12px 30px rgba(1,32,96,.09);
}
.sect:hover .si{background:linear-gradient(135deg,#012060,#3D7C02);color:#fff}

/* ---------- 5. CONTACT : FAQ ---------------------------------------- */
.cfaq{margin-top:30px;padding-top:26px;border-top:1px solid var(--line)}
.cfaq h3{font-size:1.15rem;margin-bottom:14px;color:var(--bleu)}
.cfaq details{
  border:1px solid var(--line);border-radius:12px;
  padding:13px 16px;margin-bottom:9px;background:#fff;transition:.2s;
}
.cfaq details[open]{border-color:var(--vert);background:#fbfdf9}
.cfaq summary{
  cursor:pointer;font-weight:600;font-size:.94rem;color:var(--bleu);
  list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center;
}
.cfaq summary::-webkit-details-marker{display:none}
.cfaq summary::after{content:"+";color:var(--vert);font-size:1.3rem;font-weight:700;line-height:1}
.cfaq details[open] summary::after{content:"\2212"}
.cfaq details p{margin-top:10px;color:var(--muted-d);font-size:.92rem}

/* ---------- 6. FOOTER COMPLET --------------------------------------- */
.foot-top{
  display:grid;grid-template-columns:1.65fr 1fr 1fr 1.05fr;
  gap:38px;padding-bottom:34px;
}
.foot-brand img{max-width:190px;margin-bottom:14px}
.foot-brand p{color:var(--muted);font-size:.9rem;line-height:1.6;margin-bottom:18px}
.foot-nda{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);
  border-left:3px solid var(--vert-cl);
  border-radius:12px;padding:14px 16px;
}
.fn-badge{
  display:inline-block;font-family:var(--mono);font-size:.64rem;
  letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:#0b1424;background:var(--vert-cl);
  padding:4px 10px;border-radius:999px;margin-bottom:9px;
}
.foot-nda p{color:rgba(255,255,255,.88);font-size:.83rem;line-height:1.55;margin:0}
.foot-nda small{color:var(--muted);font-size:.75rem}
.foot-col h5{
  color:#fff;font-size:.78rem;font-family:var(--mono);letter-spacing:.14em;
  text-transform:uppercase;margin-bottom:14px;
}
.foot-col .li,.foot-col a{
  display:block;color:var(--muted);font-size:.88rem;
  padding:5px 0;cursor:pointer;transition:.18s;line-height:1.45;
}
.foot-col .li:hover,.foot-col a:hover{color:var(--vert-cl);transform:translateX(3px)}
.foot-bottom{
  border-top:1px solid var(--line-dk);padding-top:22px;
  display:flex;justify-content:space-between;gap:22px;flex-wrap:wrap;
  font-size:.78rem;color:var(--muted);line-height:1.7;
}
.foot-bottom a{color:var(--muted)}
.foot-bottom a:hover{color:var(--vert-cl)}

/* ---------- 7. PAGE RECLAMATIONS ------------------------------------ */
.rec-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:20px 0 8px}
.rec-step{
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 18px;
  border-top:3px solid var(--vert);
}
.rec-step .rs-n{
  font-family:var(--display);font-size:1.7rem;font-weight:800;
  color:var(--vert);line-height:1;margin-bottom:9px;
}
.rec-step h4{font-size:1rem;margin-bottom:7px;color:var(--bleu)}
.rec-step p{font-size:.87rem;color:var(--muted-d);line-height:1.5}

/* ---------- 8. RESPONSIVE ------------------------------------------- */
@media(max-width:1080px){
  .sects{grid-template-columns:repeat(3,1fr)}
  .pillars{grid-template-columns:repeat(2,1fr)!important}
  .foot-top{grid-template-columns:1fr 1fr;gap:30px}
  .rec-steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:860px){
  .hist-grid{grid-template-columns:1fr;gap:28px}
  .hist-side{position:static}
}
@media(max-width:640px){
  .sects{grid-template-columns:1fr 1fr;gap:12px}
  .sect{padding:14px 13px;gap:10px}
  .sect .sn{font-size:.85rem}
  .pillars{grid-template-columns:1fr!important}
  .foot-top{grid-template-columns:1fr;gap:26px}
  .rec-steps{grid-template-columns:1fr}
  .dom>img{height:158px!important}
}

/* =====================================================================
   ACEF - maquette D - patch v4 : retours Ellis
   ===================================================================== */

/* ---------- 1. SEPARATION DES SECTIONS : nette, comme avant --------- */
.alt,.blk.alt{
  background:var(--cream)!important;      /* aplat franc, plus de degrade */
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
/* on retire les voiles blancs poses sur les bandes photo */
.imgband::after{display:none!important}
.imgband .fade-b{display:none!important}
.hero-bg::after{
  background:linear-gradient(180deg,transparent 78%,rgba(255,255,255,.65) 100%)!important;
}

/* ---------- 2. LES 4 VOLETS : une methode enchainee ----------------- */
.acts.methode{position:relative;align-items:stretch}
.acts.methode .act{position:relative}
/* fleche de liaison entre les volets */
.acts.methode .act:not(:last-child)::after{
  content:"";position:absolute;right:-14px;top:64px;z-index:3;
  width:12px;height:12px;
  border-top:2.5px solid var(--vert);
  border-right:2.5px solid var(--vert);
  transform:rotate(45deg);
  opacity:.55;transition:.3s;
}
.acts.methode .act:not(:last-child):hover::after{opacity:1;transform:rotate(45deg) translateX(3px)}
.acts.methode .act .go{display:none!important}
.acts.methode .act p{margin-bottom:0}
/* apparition sequencee */
.js .acts.methode .act{opacity:0;transform:translateY(16px);transition:.55s ease}
.acts.methode.in .act{opacity:1;transform:none}
.acts.methode.in .act:nth-child(1){transition-delay:0s}
.acts.methode.in .act:nth-child(2){transition-delay:.11s}
.acts.methode.in .act:nth-child(3){transition-delay:.22s}
.acts.methode.in .act:nth-child(4){transition-delay:.33s}

.methode-out{
  margin-top:34px;padding:26px 30px;
  background:#fff;border:1px solid var(--line);
  border-left:4px solid var(--vert);
  border-radius:16px;
  display:flex;align-items:center;gap:28px;flex-wrap:wrap;
  box-shadow:0 8px 30px rgba(1,32,96,.06);
}
.methode-note{
  flex:1 1 420px;margin:0;
  color:var(--muted-d);font-size:.97rem;line-height:1.6;
}
.methode-note b{color:var(--bleu)}
.methode-out .btn{flex:0 0 auto}

/* ---------- 3. SIX EXPERTISES : cadre photo plus grand -------------- */
.dom>img{height:250px!important;object-position:center 42%}
.dom .bd{padding:24px 24px 26px!important}

/* ---------- 4. SECTEURS : plus vivants ------------------------------ */
.sects{gap:18px}
.sect{
  padding:20px 20px;
  transition:opacity .5s ease,transform .5s ease,border-color .22s,box-shadow .22s;
}
.sects.in .sect{opacity:1;transform:none}
.sects.in .sect:nth-child(1){transition-delay:0s}
.sects.in .sect:nth-child(2){transition-delay:.06s}
.sects.in .sect:nth-child(3){transition-delay:.12s}
.sects.in .sect:nth-child(4){transition-delay:.18s}
.sects.in .sect:nth-child(5){transition-delay:.24s}
.sects.in .sect:nth-child(6){transition-delay:.30s}
.sects.in .sect:nth-child(7){transition-delay:.36s}
.sects.in .sect:nth-child(8){transition-delay:.42s}
.sect .si{width:44px;height:44px;transition:.28s}
.sect:hover .si{transform:rotate(-6deg) scale(1.08)}
.sect::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:linear-gradient(90deg,#012060,#3D7C02);transition:width .3s ease;
}
.sect{position:relative;overflow:hidden}
.sect:hover::after{width:100%}

/* ---------- 5. FRISE : trace progressif + noeuds vivants ------------ */
.steps.timeline::before{
  transform:scaleX(0);transform-origin:left;
  transition:transform 1.5s cubic-bezier(.22,.8,.3,1);
}
.steps.timeline.in::before{transform:scaleX(1)}
.steps.timeline .step::before{
  transform:translateX(-50%) scale(.2);
  transition:transform .45s cubic-bezier(.34,1.4,.5,1),background .25s,box-shadow .25s;
}
.steps.timeline.in .step::before{transform:translateX(-50%) scale(1)}
.steps.timeline.in .step:nth-child(1)::before{transition-delay:.18s}
.steps.timeline.in .step:nth-child(2)::before{transition-delay:.36s}
.steps.timeline.in .step:nth-child(3)::before{transition-delay:.54s}
.steps.timeline.in .step:nth-child(4)::before{transition-delay:.72s}
.steps.timeline.in .step:nth-child(5)::before{transition-delay:.90s}
.steps.timeline.in .step:nth-child(6)::before{transition-delay:1.08s}
.steps.timeline .step{cursor:default;transition:.3s ease}
.steps.timeline .step:hover{transform:translateY(-5px)}
.steps.timeline .step:hover h4{color:var(--vert)}
.steps.timeline .num{transition:.3s}
.steps.timeline .step:hover .num{transform:scale(1.12)}
/* la 2e etape, gratuite, respire pour attirer l'oeil */
@keyframes noeudLibre{
  0%,100%{box-shadow:0 0 0 5px rgba(61,124,2,.16)}
  50%{box-shadow:0 0 0 11px rgba(61,124,2,.06)}
}
.steps.timeline.in .step.free::before{animation:noeudLibre 2.6s ease-in-out 1.4s infinite}

/* ---------- RESPONSIVE ---------------------------------------------- */
@media(max-width:1080px){
  .acts.methode .act:not(:last-child)::after{display:none}
}
@media(max-width:860px){
  .methode-out{flex-direction:column;align-items:flex-start;gap:18px}
  .methode-out .btn{width:100%;justify-content:center}
}
@media(max-width:640px){
  .dom>img{height:200px!important}
  .steps.timeline .step:hover{transform:none}
}

/* =====================================================================
   ACEF - maquette D - v5 : page Formations
   ===================================================================== */

/* ---------- BANDEAU NDA --------------------------------------------- */
.nda-band{
  background:linear-gradient(100deg,#012060,#0a4a7a 55%,#2f7a2a);
  color:#fff;padding:26px 0;
}
.nda-in{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.nda-pastille{
  flex:0 0 auto;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;
  text-transform:uppercase;font-weight:700;color:#012060;background:#fff;
  padding:7px 14px;border-radius:999px;
}
.nda-txt{flex:1 1 340px}
.nda-txt p{margin:0;font-size:1rem;color:#fff}
.nda-txt .nda-sub{font-size:.85rem;color:rgba(255,255,255,.78);margin-top:4px}
.nda-chiffres{display:flex;gap:26px;flex:0 0 auto;flex-wrap:wrap}
.nda-chiffres span{
  display:flex;flex-direction:column;font-size:.76rem;
  color:rgba(255,255,255,.78);line-height:1.3;max-width:110px;
}
.nda-chiffres b{
  font-family:var(--display);font-size:1.7rem;font-weight:800;color:#fff;line-height:1;
  margin-bottom:3px;
}

/* ---------- FILTRES -------------------------------------------------- */
.ff-filtres{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:28px}
.ff-filtre{
  font-family:inherit;font-size:.88rem;font-weight:600;cursor:pointer;
  padding:9px 17px;border-radius:999px;
  border:1.5px solid var(--line);background:#fff;color:var(--muted-d);
  display:inline-flex;align-items:center;gap:8px;transition:.2s;
}
.ff-filtre span{
  font-family:var(--mono);font-size:.72rem;background:var(--cream2);
  color:var(--muted-d);padding:2px 7px;border-radius:999px;transition:.2s;
}
.ff-filtre:hover{border-color:var(--c,var(--bleu-dyn));color:var(--c,var(--bleu))}
.ff-filtre.actif{
  background:var(--c,#012060);border-color:var(--c,#012060);color:#fff;
}
.ff-filtre.actif span{background:rgba(255,255,255,.22);color:#fff}

/* ---------- FICHE FORMATION (accordeon) ------------------------------ */
.fiches-f{display:flex;flex-direction:column;gap:12px}
.fiche-f{
  border:1px solid var(--line);border-radius:16px;background:#fff;
  overflow:hidden;transition:.25s;
  box-shadow:0 4px 18px rgba(1,32,96,.04);
}
.fiche-f.masquee{display:none}
.fiche-f:hover{border-color:var(--c);box-shadow:0 12px 34px rgba(1,32,96,.09)}
.fiche-f.ouverte{border-color:var(--c);box-shadow:0 16px 44px rgba(1,32,96,.12)}

.ff-head{
  width:100%;display:grid;
  grid-template-columns:auto 1fr auto auto;
  align-items:center;gap:20px;
  padding:20px 24px;background:none;border:none;cursor:pointer;
  font-family:inherit;text-align:left;
}
.ff-code{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;font-weight:700;
  color:#fff;background:var(--c);padding:6px 11px;border-radius:8px;white-space:nowrap;
}
.ff-ti{display:flex;flex-direction:column;gap:5px;min-width:0}
.ff-titre{font-family:var(--display);font-weight:700;font-size:1.06rem;color:var(--bleu);line-height:1.3}
.ff-accroche{font-size:.88rem;color:var(--muted-d);font-style:italic;line-height:1.45}
.ff-meta{display:flex;flex-direction:column;align-items:flex-end;white-space:nowrap}
.ff-meta b{font-size:.92rem;color:var(--bleu)}
.ff-meta small{font-size:.76rem;color:var(--muted-d);font-family:var(--mono)}
.ff-chev{
  width:11px;height:11px;flex:0 0 auto;
  border-right:2.4px solid var(--c);border-bottom:2.4px solid var(--c);
  transform:rotate(45deg) translateY(-3px);transition:.28s;
}
.fiche-f.ouverte .ff-chev{transform:rotate(-135deg) translateY(-3px)}

.ff-body{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .38s cubic-bezier(.22,.8,.3,1);
}
.fiche-f.ouverte .ff-body{grid-template-rows:1fr}
.ff-inner{overflow:hidden}
.fiche-f.ouverte .ff-inner{overflow:visible}
.ff-inner>*:first-child{margin-top:4px}
.ff-body .ff-inner{padding:0 24px}
.fiche-f.ouverte .ff-body .ff-inner{padding:0 24px 26px}

.ff-tab{width:100%;border-collapse:collapse;margin-bottom:22px;font-size:.86rem}
.ff-tab th{
  background:var(--c);color:#fff;font-family:var(--mono);font-size:.68rem;
  letter-spacing:.1em;text-transform:uppercase;padding:9px 12px;text-align:left;font-weight:700;
}
.ff-tab th:first-child{border-radius:8px 0 0 0}
.ff-tab th:last-child{border-radius:0 8px 0 0}
.ff-tab td{padding:11px 12px;background:var(--cream);color:var(--bleu);font-weight:600;border-bottom:1px solid var(--line)}

.ff-cols{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.ff-cols h5{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--c);font-weight:700;margin:0 0 11px;
}
.ff-cols h5:not(:first-child){margin-top:22px}
.ff-list{list-style:none;padding:0;margin:0}
.ff-list li{
  position:relative;padding-left:19px;margin-bottom:9px;
  font-size:.9rem;color:var(--muted-d);line-height:1.55;
}
.ff-list li::before{
  content:"";position:absolute;left:0;top:.55em;
  width:6px;height:6px;border-radius:50%;background:var(--c);
}
.ff-prog li b{color:var(--bleu)}
.ff-cadre{
  font-size:.86rem;color:var(--muted-d);line-height:1.6;
  background:var(--cream);border-left:3px solid var(--c);
  padding:14px 16px;border-radius:0 10px 10px 0;margin:0;
}
.ff-cta{margin-top:22px}

/* ---------- TABLEAU SSCT --------------------------------------------- */
.ssct-wrap{overflow-x:auto;border-radius:16px;border:1px solid var(--line);background:#fff}
.ssct-tab{width:100%;border-collapse:collapse;font-size:.9rem;min-width:760px}
.ssct-tab th{
  background:var(--bleu);color:#fff;padding:13px 16px;text-align:left;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;
}
.ssct-tab td{padding:15px 16px;border-bottom:1px solid var(--line);color:var(--muted-d);vertical-align:top}
.ssct-tab tr:last-child td{border-bottom:none}
.ssct-tab tr:hover td{background:var(--cream)}
.ssct-tab .pg{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:10px;
  background:linear-gradient(135deg,#012060,#3D7C02);color:#fff;
  font-family:var(--display);font-weight:800;font-size:1.05rem;
}
.ssct-tab .pr{font-weight:700;color:var(--vert);white-space:nowrap}
.ssct-note{margin-top:16px;font-size:.85rem;color:var(--muted-d);text-align:center}

/* ---------- NOS INTERVENTIONS : animation ---------------------------- */
.js .dsub .dcard{opacity:0;transform:translateY(18px);transition:.55s ease}
.dsub.in .dcard{opacity:1;transform:none}
.dsub.in .dcard:nth-child(1){transition-delay:0s}
.dsub.in .dcard:nth-child(2){transition-delay:.1s}
.dsub.in .dcard:nth-child(3){transition-delay:.2s}
.dsub.in .dcard:nth-child(4){transition-delay:.3s}
.js .dsub .dcard li{opacity:0;transform:translateX(-8px);transition:.4s ease}
.dsub.in .dcard li{opacity:1;transform:none}
.dsub.in .dcard li:nth-child(1){transition-delay:.20s}
.dsub.in .dcard li:nth-child(2){transition-delay:.28s}
.dsub.in .dcard li:nth-child(3){transition-delay:.36s}
.dsub.in .dcard li:nth-child(4){transition-delay:.44s}
.dsub .dcard{transition-property:opacity,transform,box-shadow,border-color}
.dsub .dcard:hover{transform:translateY(-4px)}
.dsub .dcard h4 .sq{transition:.3s}
.dsub .dcard:hover h4 .sq{transform:rotate(45deg) scale(1.15)}

/* ---------- RESPONSIVE ------------------------------------------------ */
@media(max-width:980px){
  .ff-cols{grid-template-columns:1fr;gap:6px}
  .ff-head{grid-template-columns:auto 1fr auto;gap:14px;padding:18px}
  .ff-meta{display:none}
  .ff-body .ff-inner,.fiche-f.ouverte .ff-body .ff-inner{padding-left:18px;padding-right:18px}
}
@media(max-width:640px){
  .nda-in{flex-direction:column;align-items:flex-start;gap:16px}
  .nda-chiffres{gap:18px}
  .nda-chiffres b{font-size:1.4rem}
  .ff-head{grid-template-columns:1fr auto;gap:12px}
  .ff-code{grid-column:1/-1;justify-self:start}
  .ff-titre{font-size:.98rem}
  .ff-tab{font-size:.78rem}
  .ff-tab th,.ff-tab td{padding:8px 9px}
  .ff-filtres{gap:7px}
  .ff-filtre{font-size:.8rem;padding:7px 13px}
}

/* photos des encadres de page domaine */
.dhero-card.a-photo{background:none;border:none;padding:0}
.dhero-card.a-photo img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center 40%;
  border-radius:var(--r);
}
.dhero-card.a-photo::after{
  content:"";position:absolute;inset:0;border-radius:var(--r);
  background:linear-gradient(180deg,transparent 52%,rgba(6,13,28,.72));
  pointer-events:none;
}
.dhero-card.a-photo .lbl{z-index:2;color:#fff;font-weight:600}

/* visuel pleine largeur de la page Agenda */
.agenda-visuel{position:relative;overflow:hidden;max-height:400px;display:block}
.agenda-visuel img{width:100%;height:400px;object-fit:cover;object-position:center 45%;display:block}
.agenda-visuel::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.55),transparent 26%,transparent 74%,rgba(255,255,255,.9));
}
@media(max-width:640px){
  .agenda-visuel img{height:240px}
  .agenda-visuel{max-height:240px}
}

.exp-visuel img{height:300px;object-position:center 55%}
.exp-visuel{max-height:300px}
@media(max-width:640px){.exp-visuel img,.exp-visuel{height:190px;max-height:190px}}

/* =====================================================================
   v8 - classes orphelines et correction de la page Agenda
   ===================================================================== */

/* ---------- les 3 etapes de reservation ---------------------------- */
.resa-etapes{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
  counter-reset:etape;
}
.re{
  display:flex;align-items:flex-start;gap:16px;
  background:#fff;border:1px solid var(--line);border-radius:16px;
  padding:24px 22px;
  border-top:3px solid var(--vert);
  box-shadow:0 6px 24px rgba(1,32,96,.05);
  transition:.25s;
}
.resa-etapes.in .re{opacity:1;transform:none}
.resa-etapes.in .re:nth-child(1){transition-delay:0s}
.resa-etapes.in .re:nth-child(2){transition-delay:.1s}
.resa-etapes.in .re:nth-child(3){transition-delay:.2s}
.re:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(1,32,96,.11)}
.re-n{
  flex:0 0 auto;width:42px;height:42px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#012060,#3D7C02);
  color:#fff;font-family:var(--display);font-weight:800;font-size:1.25rem;
  line-height:1;
}
.re h4{font-size:1.06rem;color:var(--bleu);margin-bottom:6px}
.re p{font-size:.92rem;color:var(--muted-d);line-height:1.55;margin:0}

/* ---------- bouton fantome, utilise sur les pages domaine ----------- */
.btn-ghost{
  background:rgba(255,255,255,.94);
  color:var(--bleu);
  border:1px solid rgba(255,255,255,.5);
}
.btn-ghost:hover{background:#fff;transform:translateY(-2px)}

/* ---------- libelle reserve aux lecteurs d'ecran -------------------- */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* ---------- visuel Agenda : plus de bande blanche en haut ----------- */
.agenda-visuel::after{
  background:linear-gradient(180deg,transparent 0%,transparent 68%,rgba(255,255,255,.92) 100%)!important;
}
.agenda-visuel img{height:340px}
.agenda-visuel{max-height:340px;margin-bottom:-2px}
/* la page Expertises garde son propre reglage */
.exp-visuel::after{
  background:linear-gradient(180deg,transparent 0%,transparent 62%,rgba(255,255,255,.92) 100%)!important;
}

/* le hero de l'Agenda etait trop haut et trop vide */
.page[data-page="agenda"] .pres-hero{padding:64px 0 54px}

/* ---------- responsive --------------------------------------------- */
@media(max-width:900px){
  .resa-etapes{grid-template-columns:1fr;gap:14px}
}
@media(max-width:640px){
  .agenda-visuel img,.agenda-visuel{height:210px;max-height:210px}
}

/* la photo emerge du hero sombre au lieu de le heurter */
.agenda-visuel::after,.exp-visuel::after{
  background:linear-gradient(180deg,
    rgba(6,13,28,.62) 0%,
    rgba(6,13,28,.18) 14%,
    transparent 30%,
    transparent 66%,
    rgba(255,255,255,.94) 100%)!important;
}

/* ---------- heros de page : moins hauts, deux colonnes -------------- */
.pres-hero{padding:58px 0 52px!important}
.hero2{display:grid;grid-template-columns:1.08fr .92fr;gap:46px;align-items:center}
.hero2-col{min-width:0}
.pres-hero h1{max-width:none;margin:14px 0 16px}
.pres-hero p{max-width:52ch;font-size:1.04rem}

/* legende des six domaines, hero Expertises */
.hchips{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.hchip{
  display:flex;align-items:center;gap:10px;text-align:left;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);
  border-radius:12px;padding:11px 13px;cursor:pointer;
  font-family:inherit;transition:.2s;backdrop-filter:blur(4px);
}
.hchip:hover{background:rgba(255,255,255,.18);transform:translateX(3px)}
.hchip .hd{width:9px;height:9px;border-radius:50%;background:var(--c);flex:0 0 auto;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 35%,transparent)}
.hchip .hl{display:flex;flex-direction:column;min-width:0;flex:1 1 auto}
.hchip .hl b{color:#fff;font-size:.84rem;font-weight:700;line-height:1.25}
.hchip .hl small{color:rgba(255,255,255,.6);font-size:.68rem;font-family:var(--mono);margin-top:2px}
.hchip .ha{color:rgba(255,255,255,.45);font-size:.9rem;transition:.2s}
.hchip:hover .ha{color:#fff;transform:translateX(2px)}

/* prochaine session, hero Agenda */
.next-sess{
  background:rgba(255,255,255,.97);border-radius:18px;padding:24px 26px;
  box-shadow:0 24px 60px rgba(0,0,0,.28);
}
.ns-k{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--vert);font-weight:700}
.ns-d{display:flex;align-items:center;gap:12px;margin:12px 0 14px}
.ns-d b{font-family:var(--display);font-size:2.9rem;font-weight:800;color:var(--bleu);line-height:1}
.ns-d span{font-size:.84rem;color:var(--muted-d);line-height:1.25;font-weight:600}
.next-sess h4{font-size:1.1rem;color:var(--bleu);margin-bottom:6px}
.next-sess p{font-size:.87rem;color:var(--muted-d);margin-bottom:16px}
.next-sess .btn{width:100%;justify-content:center;padding:12px 20px;font-size:.92rem;
  background:var(--grad);color:#fff}

/* ---------- bandeaux photo : ne plus couper les tetes -------------- */
.agenda-visuel img{height:430px!important;object-position:center 30%!important}
.agenda-visuel{max-height:430px!important}
.exp-visuel img{height:340px!important;object-position:center 48%!important}
.exp-visuel{max-height:340px!important}

/* ---------- Notre histoire : recit structure ------------------------ */
.hist-txt .lead-h{margin-bottom:26px}
.recit{display:flex;flex-direction:column;gap:0;margin:0 0 30px;position:relative}
.rc{display:flex;gap:18px;padding:0 0 22px;position:relative}
.rc:not(:last-child)::before{
  content:"";position:absolute;left:17px;top:38px;bottom:0;width:2px;
  background:linear-gradient(180deg,var(--vert),rgba(61,124,2,.12));
}
.rc-n{
  flex:0 0 auto;width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#fff;border:2px solid var(--vert);
  color:var(--vert);font-family:var(--mono);font-size:.74rem;font-weight:700;
  position:relative;z-index:1;
}
.rc h4{font-size:1.04rem;color:var(--bleu);margin-bottom:5px}
.rc p{font-size:.95rem;color:var(--muted-d);line-height:1.6;margin:0}

.tripty{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:26px}
.tp{
  background:linear-gradient(160deg,#f7f9fd,#eef4ec);
  border:1px solid var(--line);border-radius:13px;padding:16px 15px;
}
.tp b{display:block;color:var(--bleu);font-size:.96rem;margin-bottom:5px}
.tp span{font-size:.84rem;color:var(--muted-d);line-height:1.5}

.encart{
  background:#fff;border:1px solid var(--line);border-left:4px solid var(--bleu-dyn);
  border-radius:0 14px 14px 0;padding:20px 22px;margin-bottom:14px;
}
.encart.encart-v{border-left-color:var(--vert)}
.encart h4{font-size:1.02rem;color:var(--bleu);margin-bottom:7px}
.encart p{font-size:.94rem;color:var(--muted-d);line-height:1.6;margin:0}
.encart b{color:var(--bleu)}

/* ---------- responsive ---------------------------------------------- */
@media(max-width:960px){
  .hero2{grid-template-columns:1fr;gap:30px}
  .hchips{grid-template-columns:1fr 1fr}
  .tripty{grid-template-columns:1fr;gap:10px}
}
@media(max-width:640px){
  .hchips{grid-template-columns:1fr}
  .agenda-visuel img,.agenda-visuel{height:230px!important;max-height:230px!important}
  .exp-visuel img,.exp-visuel{height:200px!important;max-height:200px!important}
  .ns-d b{font-size:2.3rem}
}

.resa-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:46px;align-items:center}
.resa-photo{position:relative;border-radius:20px;overflow:hidden;
  box-shadow:0 24px 60px rgba(1,32,96,.16);border:1px solid var(--line)}
.resa-photo img{width:100%;aspect-ratio:4/3.1;object-fit:cover;object-position:center 34%;display:block}
.resa-photo .rp-cap{position:absolute;left:0;right:0;bottom:0;padding:34px 20px 16px;
  color:#fff;font-family:var(--mono);font-size:.76rem;
  background:linear-gradient(0deg,rgba(6,13,28,.82),transparent)}
.resa-h2{font-size:clamp(1.6rem,2.8vw,2.2rem);margin:12px 0 22px}
/* dans ce contexte les etapes s'empilent */
.resa-grid .resa-etapes{grid-template-columns:1fr!important;gap:12px}
.resa-blk{padding:70px 0!important}
@media(max-width:900px){
  .resa-grid{grid-template-columns:1fr;gap:28px}
  .resa-photo img{aspect-ratio:16/9}
}

/* =====================================================================
   v12 - corrections issues de l'audit visuel
   ===================================================================== */

/* ---------- C. menu mobile : ne peut plus etre peint quand ferme ---- */
@media(max-width:1080px){
  #menu:not(.open){visibility:hidden;pointer-events:none}
  #menu.open{visibility:visible;pointer-events:auto}
}

/* ---------- B. tableau SSCT en cartes sous 760px ------------------- */
@media(max-width:760px){
  .ssct-wrap{border:none;background:none;overflow:visible}
  .ssct-tab{min-width:0;width:100%;display:block}
  .ssct-tab thead{display:none}
  .ssct-tab tbody,.ssct-tab tr,.ssct-tab td{display:block;width:100%}
  .ssct-tab tr{
    background:#fff;border:1px solid var(--line);border-radius:14px;
    border-top:3px solid var(--bleu);
    padding:16px 18px;margin-bottom:12px;
  }
  .ssct-tab tr:hover td{background:none}
  .ssct-tab td{
    border:none;padding:7px 0;font-size:.92rem;
    display:flex;justify-content:space-between;gap:16px;align-items:baseline;
  }
  .ssct-tab td::before{
    content:attr(data-l);flex:0 0 auto;
    font-family:var(--mono);font-size:.68rem;letter-spacing:.09em;
    text-transform:uppercase;color:var(--muted-d);font-weight:700;
  }
  .ssct-tab td:first-child{
    border-bottom:1px solid var(--line);margin-bottom:6px;padding-bottom:12px;
  }
  .ssct-tab td:first-child::before{display:none}
  .ssct-tab .pg{width:40px;height:40px;font-size:1.2rem}
  .ssct-tab .pr{font-size:1rem}
}

/* ---------- D. footer : lisible ------------------------------------ */
.foot-col .li,.foot-col a{font-size:.94rem!important;color:#b9c6de!important;padding:6px 0!important}
.foot-col .li:hover,.foot-col a:hover{color:var(--vert-cl)!important}
.foot-col h5{font-size:.82rem!important;color:#fff!important}
.foot-brand p{font-size:.94rem!important;color:#b9c6de!important}
.foot-nda p{font-size:.9rem!important;color:#d3dcec!important}
.foot-nda small{font-size:.82rem!important;color:#a6b4cd!important}
.foot-bottom{font-size:.85rem!important;color:#a6b4cd!important}
.foot-bottom a{color:#c2cde2!important}

/* footer mobile : colonnes repliables */
@media(max-width:640px){
  .foot-col{border-top:1px solid var(--line-dk);padding-top:14px}
  .foot-col h5{margin-bottom:10px}
  .foot-col .li,.foot-col a{padding:8px 0!important}
  .foot-bottom{font-size:.8rem!important;line-height:1.65}
}

/* ---------- E. Agenda : carte non coupee, vide reduit -------------- */
.page[data-page="agenda"] .pres-hero{padding:70px 0 62px!important}
.next-sess{margin-top:6px}
.resa-blk{padding:62px 0 46px!important}
.page[data-page="agenda"] .blk:not(.resa-blk){padding-top:52px}

/* ---------- F. Reclamations : contraste et deuxieme colonne -------- */
.page[data-page="reclamations"] .legal p,
.page[data-page="reclamations"] .legal li{color:#4a566f!important;font-size:.98rem}
.rec-step p{font-size:.92rem!important;color:#4a566f!important}
.rec-grid{display:grid;grid-template-columns:1fr .46fr;gap:44px;align-items:start}
.rec-aside{
  background:linear-gradient(160deg,#f7f9fd,#eef4ec);
  border:1px solid var(--line);border-radius:18px;padding:24px 22px;
  position:sticky;top:110px;
}
.rec-aside h4{font-size:1.02rem;color:var(--bleu);margin-bottom:10px}
.rec-aside p{font-size:.9rem;color:var(--muted-d);line-height:1.6;margin-bottom:14px}
.rec-aside .ra-l{
  display:block;padding:9px 0;border-top:1px dashed var(--line);
  font-size:.88rem;color:var(--bleu);font-weight:600;
}
.rec-aside .btn{width:100%;justify-content:center;margin-top:14px;font-size:.92rem;padding:12px 18px}
@media(max-width:900px){.rec-grid{grid-template-columns:1fr;gap:26px}.rec-aside{position:static}}

/* ---------- G. densite : textes agrandis --------------------------- */
.dsub .dcard li{font-size:.96rem!important;line-height:1.6!important;margin-bottom:9px}
.dsub .dcard h4{font-size:1.1rem!important}
.hist-txt p{font-size:1.02rem!important}
.rc p{font-size:1rem!important}
.rc h4{font-size:1.1rem!important}
.tp span{font-size:.9rem!important}
.encart p{font-size:.99rem!important}
.ff-accroche{font-size:.92rem!important}
.ff-meta b{font-size:.96rem!important}
.ff-meta small{font-size:.8rem!important}
.ff-list li{font-size:.95rem!important}
.ff-tab{font-size:.9rem!important}

/* ---------- H. hero Expertises : pastilles lisibles, vide reduit --- */
.hchip{padding:13px 15px}
.hchip .hl b{font-size:.92rem!important}
.hchip .hl small{font-size:.74rem!important;color:rgba(255,255,255,.72)!important}
.hchips{gap:11px}
.page[data-page="expertises"] .blk{padding-bottom:44px}

/* ---------- catalogue mobile : lignes plus aerees ------------------ */
@media(max-width:640px){
  .ff-head{padding:16px 16px}
  .ff-titre{font-size:1rem!important;line-height:1.35}
  .ff-accroche{display:none}
  .fiche-f.ouverte .ff-accroche{display:block;margin-top:6px}
  .dsub .dcard li{font-size:.94rem!important}
}

/* le vert fonce etait illisible sur le hero sombre de Presentation */
.pres-hero .vision{color:#a8e06a!important}

/* 1. le trait de la frise etait invisible sans JavaScript */
.steps.timeline::before{transform:none}
.js .steps.timeline::before{transform:scaleX(0)}
.js .steps.timeline.in::before{transform:scaleX(1)}
/* 2. cartes Nos interventions : toutes les rangees a la meme hauteur */
.dsub{grid-auto-rows:1fr}
/* 3. longueur de ligne des pages legales */
.page[data-page="reclamations"] .legal p,
.page[data-page="mentions"] .legal p,
.page[data-page="cgv"] .legal p,
.page[data-page="reglement"] .legal p,
.page[data-page="confidentialite"] .legal p{max-width:72ch}

/* ---------- bulle ---------- */
#bot-ouvrir{
  position:fixed;right:22px;bottom:22px;z-index:900;
  width:58px;height:58px;border-radius:50%;border:none;cursor:pointer;
  background:linear-gradient(135deg,#012060,#0a4a7a 55%,#3D7C02);
  color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 34px rgba(1,32,96,.42);transition:.25s;
}
#bot-ouvrir svg{width:26px;height:26px}
#bot-ouvrir:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 18px 44px rgba(1,32,96,.5)}
#bot-ouvrir.cache{opacity:0;pointer-events:none;transform:scale(.7)}
.bo-pt{
  position:absolute;top:3px;right:3px;width:13px;height:13px;border-radius:50%;
  background:#5fa32a;border:2.5px solid #fff;
}

/* ---------- panneau ---------- */
#bot{
  position:fixed;right:22px;bottom:22px;z-index:901;
  width:378px;max-width:calc(100vw - 32px);
  height:562px;max-height:calc(100vh - 40px);
  background:#fff;border-radius:20px;overflow:hidden;
  display:none;flex-direction:column;
  box-shadow:0 30px 80px rgba(1,32,96,.36);
  border:1px solid var(--line);
}
#bot.ouvert{display:flex;animation:botIn .28s cubic-bezier(.22,.9,.3,1)}
@keyframes botIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}

.bot-tete{
  display:flex;align-items:center;gap:12px;padding:15px 16px;
  background:linear-gradient(100deg,#012060,#0a4a7a 58%,#2f7a2a);color:#fff;flex:0 0 auto;
}
.bt-ava{width:38px;height:38px;border-radius:11px;flex:0 0 auto;
  background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center}
.bt-ava svg{width:21px;height:21px}
.bt-id{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.bt-id b{font-size:.98rem;color:#fff}
.bt-id span{font-size:.73rem;color:rgba(255,255,255,.8);display:flex;align-items:center;gap:6px}
.bt-live{width:7px;height:7px;border-radius:50%;background:#7fd94a;
  box-shadow:0 0 8px #7fd94a;animation:pulse 2s infinite;display:inline-block}
#bot-fermer{background:none;border:none;color:#fff;font-size:1.7rem;line-height:1;
  cursor:pointer;padding:0 4px;opacity:.8}
#bot-fermer:hover{opacity:1}

.bot-fil{flex:1 1 auto;overflow-y:auto;padding:18px 16px;background:var(--cream);
  display:flex;flex-direction:column;gap:11px}
.bm{max-width:87%;padding:11px 14px;border-radius:15px;font-size:.9rem;line-height:1.55}
.bm.bot{background:#fff;border:1px solid var(--line);border-bottom-left-radius:5px;
  color:var(--ink);align-self:flex-start;box-shadow:0 2px 10px rgba(1,32,96,.05)}
.bm.moi{background:linear-gradient(120deg,#012060,#0a4a7a);color:#fff;
  border-bottom-right-radius:5px;align-self:flex-end}
.bm b{color:var(--bleu)}
.bm.moi b{color:#fff}
.bm ul{margin:7px 0 0;padding-left:17px}
.bm li{margin-bottom:4px}
.bm .bm-cta{
  display:inline-flex;align-items:center;gap:6px;margin-top:10px;
  padding:8px 14px;border-radius:999px;background:var(--grad);color:#fff;
  font-size:.83rem;font-weight:700;cursor:pointer;border:none;font-family:inherit;
}
.bm .bm-cta:hover{filter:brightness(1.1)}
.bm-src{display:block;margin-top:9px;font-family:var(--mono);font-size:.7rem;color:var(--muted-d)}
.bm-src a{color:var(--bleu-dyn);font-weight:700;cursor:pointer}

.btape{align-self:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:15px;border-bottom-left-radius:5px;padding:13px 15px;display:flex;gap:4px}
.btape i{width:6px;height:6px;border-radius:50%;background:var(--muted-d);
  animation:botPt 1.3s infinite}
.btape i:nth-child(2){animation-delay:.18s}
.btape i:nth-child(3){animation-delay:.36s}
@keyframes botPt{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}

.bot-sugg{display:flex;gap:7px;padding:0 14px 10px;flex-wrap:wrap;flex:0 0 auto;background:var(--cream)}
.bs{
  font-family:inherit;font-size:.78rem;font-weight:600;cursor:pointer;
  padding:7px 12px;border-radius:999px;background:#fff;
  border:1px solid var(--line);color:var(--bleu);transition:.18s;
}
.bs:hover{border-color:var(--vert);color:var(--vert);transform:translateY(-1px)}

.bot-saisie{display:flex;gap:8px;padding:11px 13px;border-top:1px solid var(--line);
  background:#fff;flex:0 0 auto}
#bot-input{
  flex:1 1 auto;border:1px solid var(--line);border-radius:999px;
  padding:11px 16px;font-family:inherit;font-size:.9rem;color:var(--ink);outline:none;
}
#bot-input:focus{border-color:var(--vert)}
.bot-saisie button{
  width:42px;height:42px;flex:0 0 auto;border:none;border-radius:50%;cursor:pointer;
  background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;
}
.bot-saisie button svg{width:19px;height:19px}
.bot-saisie button:hover{filter:brightness(1.1)}
.bot-pied{
  margin:0;padding:0 14px 12px;font-size:.71rem;color:var(--muted-d);
  text-align:center;background:#fff;flex:0 0 auto;line-height:1.45;
}
.bot-pied .bot-lien{color:var(--bleu-dyn);font-weight:700}

@media(max-width:520px){
  #bot{right:10px;left:10px;bottom:10px;width:auto;height:min(78vh,540px)}
  #bot-ouvrir{right:16px;bottom:16px;width:54px;height:54px}
}
@media print{#bot,#bot-ouvrir{display:none!important}}

.value .ic svg,.cblock .ic svg{stroke:#fff!important;fill:none!important}
.value .ic svg *,.cblock .ic svg *{stroke:#fff!important;fill:none!important}
.value .ic,.cblock .ic{display:flex;align-items:center;justify-content:center}

/* =====================================================================
   v18 - entrees en scene. Tout est conditionne a .js : sans JavaScript,
   le contenu reste visible et immobile.
   ===================================================================== */

@media (prefers-reduced-motion: no-preference){

  /* ---------- socle commun ---------- */
  .js .anim{opacity:0;will-change:opacity,transform}
  .js .anim.vu{opacity:1}

  /* montee simple */
  .js .a-monte{transform:translateY(26px);transition:opacity .62s cubic-bezier(.22,.85,.3,1),transform .62s cubic-bezier(.22,.85,.3,1)}
  .js .a-monte.vu{transform:none}

  /* glissement lateral */
  .js .a-glisse{transform:translateX(-24px);transition:opacity .58s ease,transform .58s cubic-bezier(.22,.85,.3,1)}
  .js .a-glisse.vu{transform:none}

  /* eclosion */
  .js .a-eclot{transform:translateY(20px) scale(.94);transition:opacity .6s ease,transform .68s cubic-bezier(.28,1.25,.42,1)}
  .js .a-eclot.vu{transform:none}

  /* decalage en cascade, jusqu'a 8 elements */
  .js .anim[data-d="1"]{transition-delay:.07s}
  .js .anim[data-d="2"]{transition-delay:.14s}
  .js .anim[data-d="3"]{transition-delay:.21s}
  .js .anim[data-d="4"]{transition-delay:.28s}
  .js .anim[data-d="5"]{transition-delay:.35s}
  .js .anim[data-d="6"]{transition-delay:.42s}
  .js .anim[data-d="7"]{transition-delay:.49s}

  /* ---------- titres de section : le trait se tire ---------- */
  .blk-head{position:relative}
  .js .blk-head .eyebrow{display:inline-block;position:relative;padding-bottom:9px}
  .js .blk-head .eyebrow::after{
    content:"";position:absolute;left:50%;bottom:0;height:2px;width:0;
    background:linear-gradient(90deg,var(--bleu),var(--vert));
    transform:translateX(-50%);transition:width .7s cubic-bezier(.22,.85,.3,1) .12s;
  }
  .js .blk-head.vu .eyebrow::after{width:58px}

  /* ---------- chiffres cles : le liseré se remplit ---------- */
  .js .stat::before{transform:scaleX(0);transform-origin:left;
    transition:transform .8s cubic-bezier(.22,.85,.3,1)}
  .js .stat.vu::before{transform:scaleX(1)}
  .js .stat.vu::before{transition-delay:inherit}

  /* ---------- 4 volets : l'icone se pose apres la carte ---------- */
  .js .act .ic{transform:scale(.6) rotate(-12deg);opacity:0;
    transition:transform .55s cubic-bezier(.28,1.3,.42,1) .18s,opacity .4s ease .18s}
  .js .act.vu .ic{transform:none;opacity:1}

  /* ---------- 4 piliers : le numero monte en meme temps ---------- */
  .js .pillar .big{transform:translateY(12px);opacity:0;
    transition:transform .6s cubic-bezier(.22,.85,.3,1) .16s,opacity .5s ease .16s}
  .js .pillar.vu .big{transform:none;opacity:1}

  /* ---------- valeurs : la pastille pivote ---------- */
  .js .value .ic{transform:scale(.55) rotate(-18deg);opacity:0;
    transition:transform .55s cubic-bezier(.28,1.35,.4,1) .1s,opacity .38s ease .1s}
  .js .value.vu .ic{transform:none;opacity:1}

  /* ---------- six expertises : la photo se decompresse ---------- */
  .js .dom>img{transform:scale(1.09);transition:transform 1.05s cubic-bezier(.22,.85,.3,1)}
  .js .dom.vu>img{transform:none}

  /* ---------- survols plus vivants ---------- */
  .stat,.pillar,.value,.pv{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
  .value:hover .ic{transform:rotate(6deg) scale(1.07)}
  .pillar:hover{transform:translateY(-5px)}
  .pillar:hover .big{color:var(--vert)}
}

/* mouvement reduit : on garde l'apparition, sans deplacement */
@media (prefers-reduced-motion: reduce){
  .js .anim{opacity:0;transition:opacity .4s ease}
  .js .anim.vu{opacity:1;transform:none}
}

/* ---------- Presentation : reperes et engagement ---------- */
.preuves{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}
.pv{
  background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:16px 15px;border-top:3px solid transparent;
  border-image:linear-gradient(90deg,var(--bleu),var(--vert)) 1;
  border-image-slice:1;border-width:3px 0 0 0;border-style:solid;
  box-shadow:0 5px 20px rgba(1,32,96,.05);
}
.pv-n{
  display:block;font-family:var(--display);font-size:1.9rem;font-weight:800;
  line-height:1;margin-bottom:7px;
  background:linear-gradient(100deg,var(--bleu),var(--vert));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.pv-n i{font-style:normal;font-size:.58em}
.pv-l{font-size:.78rem;color:var(--muted-d);line-height:1.45;display:block}
.pv:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(1,32,96,.1)}

.engagement{
  margin-top:16px;background:linear-gradient(150deg,#f7f9fd,#eef4ec);
  border:1px solid var(--line);border-left:4px solid var(--vert);
  border-radius:0 16px 16px 0;padding:22px 24px;
}
.eg-k{
  display:block;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--vert);font-weight:700;margin-bottom:9px;
}
.engagement p{font-size:.98rem;color:var(--muted-d);line-height:1.6;margin-bottom:16px}
.engagement b{color:var(--bleu)}
.engagement .btn{font-size:.92rem;padding:12px 22px}

@media(max-width:640px){
  .preuves{grid-template-columns:1fr;gap:9px}
  .pv{display:flex;align-items:center;gap:14px;padding:13px 15px}
  .pv-n{margin-bottom:0;flex:0 0 auto;min-width:62px}
  .engagement .btn{width:100%;justify-content:center}
}

.equipe-card{
  margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:16px;
  padding:22px 24px;box-shadow:0 6px 24px rgba(1,32,96,.05);
}
.ec-k{
  display:block;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--vert);font-weight:700;margin-bottom:14px;
}
.ec-l{
  display:grid;grid-template-columns:auto 1fr;gap:4px 12px;
  padding:10px 0;border-bottom:1px dashed var(--line);align-items:baseline;
}
.ec-l:last-of-type{border-bottom:none}
.ec-l i{
  width:8px;height:8px;border-radius:50%;grid-row:1/3;align-self:center;
  background:linear-gradient(135deg,var(--bleu),var(--vert));
}
.ec-l b{font-size:.94rem;color:var(--bleu)}
.ec-l span{font-size:.82rem;color:var(--muted-d);line-height:1.45}
.ec-p{
  margin-top:14px;padding-top:13px;border-top:1px solid var(--line);
  font-size:.85rem;color:var(--muted-d);font-style:italic;
}

@media (prefers-reduced-motion: no-preference){

  /* ---------- entrees nettement plus lisibles ---------- */
  .js .a-monte{
    transform:translateY(46px);filter:blur(7px);
    transition:opacity .78s cubic-bezier(.2,.8,.25,1),
               transform .82s cubic-bezier(.2,.8,.25,1),
               filter .6s ease;
  }
  .js .a-monte.vu{transform:none;filter:none}

  .js .a-glisse{
    transform:translateX(-46px);filter:blur(6px);
    transition:opacity .72s cubic-bezier(.2,.8,.25,1),
               transform .8s cubic-bezier(.2,.8,.25,1),
               filter .55s ease;
  }
  .js .a-glisse.vu{transform:none;filter:none}

  .js .a-eclot{
    transform:translateY(34px) scale(.9);filter:blur(6px);
    transition:opacity .7s ease,
               transform .86s cubic-bezier(.22,1.3,.36,1),
               filter .55s ease;
  }
  .js .a-eclot.vu{transform:none;filter:none}

  /* cascade plus marquee */
  .js .anim[data-d="1"]{transition-delay:.11s}
  .js .anim[data-d="2"]{transition-delay:.22s}
  .js .anim[data-d="3"]{transition-delay:.33s}
  .js .anim[data-d="4"]{transition-delay:.44s}
  .js .anim[data-d="5"]{transition-delay:.55s}
  .js .anim[data-d="6"]{transition-delay:.66s}
  .js .anim[data-d="7"]{transition-delay:.77s}

  /* ---------- MOUVEMENT AMBIANT, visible en permanence ---------- */

  /* une lumiere parcourt la frise des six etapes */
  .steps.timeline{position:relative}
  .steps.timeline::after{
    content:"";position:absolute;top:20px;left:8%;width:74px;height:7px;
    border-radius:4px;pointer-events:none;z-index:0;
    background:radial-gradient(ellipse at center,rgba(127,217,74,.85),rgba(127,217,74,0) 72%);
    opacity:0;
  }
  .steps.timeline.vu::after,.steps.timeline.in::after{
    animation:filerLumiere 5.4s cubic-bezier(.5,0,.5,1) 1.1s infinite;
  }
  @keyframes filerLumiere{
    0%{left:8%;opacity:0}
    9%{opacity:1}
    76%{opacity:1}
    88%{left:calc(92% - 74px);opacity:0}
    100%{left:calc(92% - 74px);opacity:0}
  }

  /* les noeuds respirent, l'un apres l'autre */
  .steps.timeline .step::before{animation:noeudRespire 5.4s ease-in-out infinite}
  .steps.timeline .step:nth-child(1)::before{animation-delay:1.2s}
  .steps.timeline .step:nth-child(2)::before{animation-delay:1.9s}
  .steps.timeline .step:nth-child(3)::before{animation-delay:2.6s}
  .steps.timeline .step:nth-child(4)::before{animation-delay:3.3s}
  .steps.timeline .step:nth-child(5)::before{animation-delay:4.0s}
  .steps.timeline .step:nth-child(6)::before{animation-delay:4.7s}
  @keyframes noeudRespire{
    0%,88%,100%{box-shadow:0 0 0 5px rgba(11,92,253,.12)}
    6%{box-shadow:0 0 0 12px rgba(11,92,253,.02)}
    12%{box-shadow:0 0 0 5px rgba(11,92,253,.12)}
  }

  /* un reflet balaie le liseré des chiffres cles */
  .stat::after{
    content:"";position:absolute;top:0;left:-45%;width:45%;height:4px;
    pointer-events:none;z-index:2;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.92),transparent);
    animation:balayer 4.6s ease-in-out infinite;
  }
  .stat:nth-child(1)::after{animation-delay:.2s}
  .stat:nth-child(2)::after{animation-delay:.55s}
  .stat:nth-child(3)::after{animation-delay:.9s}
  .stat:nth-child(4)::after{animation-delay:1.25s}
  @keyframes balayer{
    0%{left:-45%}
    38%{left:100%}
    100%{left:100%}
  }

  /* les pastilles des quatre volets flottent doucement */
  .act .ic{animation:flotter 4.2s ease-in-out infinite}
  .act:nth-child(2) .ic{animation-delay:.5s}
  .act:nth-child(3) .ic{animation-delay:1s}
  .act:nth-child(4) .ic{animation-delay:1.5s}
  @keyframes flotter{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
  .js .act.vu .ic{animation:flotter 4.2s ease-in-out .6s infinite}

  /* la fleche du bloc methode avance et revient */
  .methode-out .btn{position:relative;overflow:hidden}
  .methode-out .btn::after{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.26) 50%,transparent 65%);
    transform:translateX(-120%);
    animation:lustrer 4.8s ease-in-out 1.4s infinite;
  }
  @keyframes lustrer{0%{transform:translateX(-120%)}28%,100%{transform:translateX(120%)}}

  /* les cartes d'expertise reagissent plus franchement */
  .dom{transition:transform .34s cubic-bezier(.2,.8,.25,1),box-shadow .34s ease,border-color .3s}
  .dom:hover{transform:translateY(-9px)}
  .dom>img{transition:transform 1.05s cubic-bezier(.22,.85,.3,1)}
  .dom:hover>img{transform:scale(1.06)}

  /* survols des chiffres et piliers */
  .stat:hover{transform:translateY(-6px)}
  .pv:hover{transform:translateY(-4px)}
}

/* mouvement reduit : aucune animation ambiante, apparition simple */
@media (prefers-reduced-motion: reduce){
  .steps.timeline::after,.stat::after,.methode-out .btn::after{display:none!important}
  .act .ic,.steps.timeline .step::before{animation:none!important}
}

/* le titre officiel est long : on l'accorde a la largeur disponible */
.hero h1{
  font-size:clamp(1.85rem,3.5vw,3rem)!important;
  line-height:1.16!important;
  letter-spacing:-.015em;
  max-width:20ch;
  margin:18px 0 12px!important;
}
.hero-slogan{
  font-size:1.02rem;font-style:italic;font-weight:600;
  color:var(--vert);margin:0 0 20px;
  padding-left:15px;border-left:3px solid var(--vert);
  line-height:1.45;
}
.hero p.lead{font-size:1rem!important;margin-bottom:28px!important}
@media(max-width:860px){
  .hero h1{max-width:none}
  .hero-slogan{font-size:.95rem}
}

/* ---- POINT 2 : vidéo du logo fondue dans le décor ---- */
.hero-video{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  overflow:visible !important;
  aspect-ratio:440/296 !important;
}
.hero-video video{
  object-fit:contain !important;
  -webkit-mask-image:radial-gradient(ellipse 76% 72% at 50% 50%,#000 58%,rgba(0,0,0,0) 100%);
          mask-image:radial-gradient(ellipse 76% 72% at 50% 50%,#000 58%,rgba(0,0,0,0) 100%);
  filter:drop-shadow(0 22px 60px rgba(0,0,0,.35));
}
.hero-video .vlabel{display:none !important}

/* ---- POINT 1 : chiffres-clés ramenés à deux colonnes ---- */
.preuves{grid-template-columns:repeat(2,1fr) !important}

/* ---- POINT 1 : photo des associés dans la colonne « Notre histoire » ---- */
.hist-side .media-card{margin-bottom:20px}
.hist-side .media-card .imgbox{aspect-ratio:4/3.1 !important;border-radius:14px;overflow:hidden}

/* ---- POINT 6 : section « 4 manières de vous accompagner » plus vivante ---- */
.acts.methode .act{
  border-top:3px solid transparent;
  transition:transform .38s cubic-bezier(.22,1,.36,1),
             box-shadow .38s ease, border-color .38s ease, background .38s ease;
}
.acts.methode .act::before{
  background:var(--c,var(--vert)) !important;
  height:3px !important;
}
/* lettre-repère en filigrane */
.acts.methode .act > .k{position:relative;z-index:2}
.acts.methode .act .filigrane{
  position:absolute;right:-6px;top:-26px;
  font-family:var(--display);font-size:8.2rem;font-weight:700;line-height:1;
  color:var(--c,var(--vert));opacity:.055;pointer-events:none;
  transition:opacity .45s ease,transform .45s cubic-bezier(.22,1,.36,1);
  z-index:0;
}
.acts.methode .act:hover .filigrane{opacity:.13;transform:translateY(6px) scale(1.06)}
/* halo de couleur au survol */
.acts.methode .act::after{
  content:"" !important;position:absolute !important;
  left:0;right:0;bottom:0;top:auto;
  height:100% !important;width:auto !important;
  border:0 !important;transform:none !important;
  background:radial-gradient(120% 90% at 50% 118%,
             color-mix(in srgb,var(--c,#3D7C02) 16%,transparent) 0%,transparent 62%);
  opacity:0;transition:opacity .4s ease;z-index:0;pointer-events:none;
}
.acts.methode .act:hover::after{opacity:1}
.acts.methode .act > *{position:relative;z-index:1}
.acts.methode .act:hover{
  transform:translateY(-10px);
  border-top-color:var(--c,var(--vert));
  box-shadow:0 26px 60px rgba(1,32,96,.16);
}
/* pastille d'icône qui se remplit au survol */
.acts.methode .act .ic{
  transition:background .38s ease, transform .5s cubic-bezier(.22,1,.36,1),
             box-shadow .38s ease;
}
.acts.methode .act:hover .ic{
  background:var(--c,var(--vert)) !important;
  transform:translateY(-3px) scale(1.06) rotate(-4deg);
  box-shadow:0 12px 26px color-mix(in srgb,var(--c,#3D7C02) 38%,transparent);
}
.acts.methode .act:hover .ic svg{filter:brightness(0) invert(1)}
.acts.methode .act .ic svg{transition:filter .3s ease}
.acts.methode .act h3{transition:color .3s ease}
.acts.methode .act:hover h3{color:var(--c,var(--bleu))}
@media (prefers-reduced-motion:reduce){
  .acts.methode .act,.acts.methode .act .ic,.acts.methode .act .filigrane{
    transition:none !important;transform:none !important;
  }
}

/* ---- POINT 4 (2e retour) : logo du pied fidele a l'original, sur pastille blanche ---- */
.foot-brand img{
  /* meme traitement qu'en en-tete : logo blanc pose directement sur le fond sombre */
  height:52px !important;
  max-width:none !important;
  width:auto !important;
  margin-bottom:20px;
  background:none !important;
  padding:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.28));
}
@media(max-width:900px){
  .foot-brand img{height:44px !important}
}

/* ═══ Restructuration Formations (retour Omega, points 7 à 9) ═══ */
.sous-bloc{margin-bottom:54px}
.sous-bloc:last-child{margin-bottom:0}
.sb-head{display:flex;gap:16px;align-items:flex-start;margin-bottom:22px;
  padding-bottom:16px;border-bottom:1px solid rgba(1,32,96,.12)}
.sb-n{flex:0 0 34px;height:34px;border-radius:50%;background:var(--bleu,#012060);
  color:#fff;font-family:var(--display);font-weight:700;font-size:.95rem;
  display:flex;align-items:center;justify-content:center;margin-top:2px}
.sb-head h3{margin:0 0 6px;font-size:1.18rem;color:var(--bleu,#012060);line-height:1.3}
.sb-head p{margin:0;font-size:.92rem;line-height:1.6;opacity:.78;max-width:74ch}

.carte-etapes{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:38px}
.ce{background:#fff;border:1px solid rgba(1,32,96,.1);border-radius:14px;padding:22px 20px;
  position:relative;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease}
.ce:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(1,32,96,.13)}
.ce-n{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;color:var(--vert,#3D7C02);
  display:block;margin-bottom:10px}
.ce h4{margin:0 0 8px;font-size:1rem;color:var(--bleu,#012060);line-height:1.3}
.ce p{margin:0;font-size:.86rem;line-height:1.6;opacity:.78}

.modalites{background:#fff;border:1px solid rgba(1,32,96,.12);border-radius:18px;
  padding:30px 28px;margin-bottom:30px;border-left:4px solid var(--vert,#3D7C02)}
.mod-head{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid rgba(1,32,96,.1)}
.mod-badge{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--vert,#3D7C02);border:1px solid currentColor;
  border-radius:20px;padding:5px 13px;margin-bottom:14px}
.mod-head p{margin:0;font-size:.92rem;line-height:1.65;opacity:.82;max-width:80ch}
.mod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 30px}
.mod-item h5{margin:0 0 8px;font-size:.92rem;color:var(--bleu,#012060);
  padding-left:12px;border-left:2px solid var(--vert,#3D7C02);line-height:1.35}
.mod-item p{margin:0;font-size:.85rem;line-height:1.62;opacity:.8}
.carte-cta{text-align:center}

@media (max-width:960px){
  .carte-etapes{grid-template-columns:repeat(2,1fr)}
  .mod-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:620px){
  .carte-etapes{grid-template-columns:1fr}
  .mod-grid{grid-template-columns:1fr;gap:22px}
  .modalites{padding:24px 20px}
  .sb-head{gap:12px}
  .sb-head h3{font-size:1.05rem}
}
@media (prefers-reduced-motion:reduce){ .ce{transition:none} .ce:hover{transform:none} }

/* ---- credit createur ---- */
.foot-bottom{align-items:flex-start}
.credit-swc{flex-basis:100%;padding-top:14px;margin-top:4px;
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.55);font-size:.8rem}
.credit-swc a{color:rgba(255,255,255,.8);text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:1px;transition:color .25s ease}
.credit-swc a:hover{color:#fff;border-bottom-color:#fff}

/* ═══ Demande de créneau (point 10 du retour Omega) ═══ */
.resa-form{max-width:980px;margin:0 auto}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.fgrid .fspan{grid-column:1 / -1}
.fopt{font-weight:400;opacity:.55;font-size:.8rem;margin-left:6px}
.btn-r{cursor:pointer}
.resa-ok{display:flex;gap:16px;align-items:flex-start;margin-top:24px;padding:20px;
  border-radius:14px;background:rgba(61,124,2,.07);border:1px solid rgba(61,124,2,.28)}
.ro-ic{flex:0 0 34px;height:34px;border-radius:50%;background:var(--vert,#3D7C02);color:#fff;
  display:flex;align-items:center;justify-content:center}
.ro-ic svg{width:19px;height:19px}
.resa-ok h4{margin:0 0 6px;font-size:1rem;color:var(--bleu,#012060)}
.resa-ok p{margin:0 0 12px;font-size:.88rem;line-height:1.6;opacity:.85}
.resa-ok pre{margin:0;padding:14px;border-radius:10px;background:#fff;
  border:1px solid rgba(1,32,96,.14);font-family:var(--mono,monospace);font-size:.78rem;
  line-height:1.55;white-space:pre-wrap;word-break:break-word;max-height:260px;overflow:auto}
@media(max-width:720px){
  .fgrid{grid-template-columns:1fr}
  .resa-ok{flex-direction:column}
}

/* ---- POINT 11 : logo fidele a l'original, pose sur blanc aux deux extremites ---- */
header .brand{
  background:none !important;
  padding:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

/* ═══════════ Corrections après recette de préproduction ═══════════ */

/* B · le fond blanc de la balise video annulait le fondu du logo */
.hero-video video{
  background:transparent !important;
}
.hero-visual::before{display:none !important}

/* C · filet de securite : aucun contenu ne doit rester invisible,
   meme si l'observateur d'animations echoue */
.js .anim{opacity:1}
.js .anim:not(.vu){opacity:0}
html.anim-secours .js .anim,
html.anim-secours .anim{opacity:1 !important;transform:none !important}

/* D · assistant : le panneau doit tenir dans l'ecran sur mobile */
@media(max-width:640px){
  /* le panneau reste masque tant qu'il n'est pas ouvert :
     la mise en page ne s'applique qu'a l'etat .ouvert */
  #bot{
    top:auto !important;
    height:auto !important;
    max-height:82vh !important;
  }
  #bot.ouvert{
    display:flex !important;
    flex-direction:column !important;
  }
  #bot .bot-fil{flex:1 1 auto;min-height:110px;overflow-y:auto}
  #bot .bot-sugg{
    flex:0 0 auto;max-height:118px;overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  #bot .bot-saisie{flex:0 0 auto}
  #bot .bot-pied{flex:0 0 auto;font-size:.68rem;padding:0 12px 9px}
}


/* ═══════════ Correction : flex-basis en disposition colonne ═══════════
   En rangee, `flex:1 1 420px` fixe une largeur de base. Passe en colonne
   sous 860 px, la meme valeur devient une HAUTEUR de base et cree un grand
   vide sous le texte. On neutralise la base sur les petits ecrans. */
@media(max-width:900px){
  .methode-note{flex:0 1 auto !important}
  .nda-txt{flex:0 1 auto !important}
  .nda-band .wrap{flex-wrap:wrap}
}


/* ---------- CARTES-LIENS (conversion <article> -> <a>, 25.08.2026) ---------- */
/* Les cartes d'expertise et d'activite sont desormais de vrais liens.
   On neutralise le style d'ancre par defaut et on garantit un focus visible. */
a.dom, a.act{
  color:inherit;
  text-decoration:none;
}
a.dom:focus-visible, a.act:focus-visible{
  outline:3px solid var(--c, #0B5CFD);
  outline-offset:3px;
}


/* ---------- HERO — EQUILIBRE DU TITRE (retour Omega, 25.08.2026) ---------- */
/* Le titre officiel fait 84 caracteres. Il etait bride par max-width:20ch
   (~480px) dans une colonne de ~590px, ce qui le cassait en 5 lignes tres
   inegales et produisait l'effet d'escalier signale par le client.
   On leve le bride et on elargit la colonne de texte pour retomber sur
   ~28 caracteres par ligne, soit 3 lignes.
   REGLAGE : ajuster le ratio ci-dessous si le rendu demande un autre equilibre. */
@media (min-width:861px){
  .hero .wrap{
    grid-template-columns:1.22fr .78fr;
  }
  .hero h1{
    max-width:none;
    text-wrap:balance;      /* repartit les lignes, ignore par les vieux navigateurs */
  }
}


/* ---------- LIEN LINKEDIN DU PIED DE PAGE (25.08.2026) ---------- */
.foot-col a.li-in{
  display:flex;
  align-items:center;
  gap:9px;
}
.foot-col a.li-in svg{
  width:16px;
  height:16px;
  flex:0 0 16px;
}


/* ---------- FORMULAIRES SERVEUR (25.08.2026) ---------- */
/* PIEGE A ROBOTS : invisible a l'ecran, hors du flux de tabulation.
   On evite display:none, que certains automates detectent. */
.piege{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}
/* bandeau affiche au retour de /envoi.php */
.form-etat{
  grid-column:1 / -1;   /* le formulaire peut etre une grille : on occupe toute la largeur */
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:14px 16px;
  border-radius:10px;
  margin-bottom:18px;
  font-size:.94rem;
  line-height:1.5;
}
.form-etat.ok{
  background:#EAF5E4;
  border:1px solid #B9DCA6;
  color:#2A5C12;
}
.form-etat.err{
  background:#FDECEC;
  border:1px solid #F3C2C2;
  color:#8C2020;
}
.cform button[type="submit"][disabled]{
  opacity:.6;
  cursor:progress;
}


/* ---------- RESERVATION MICROSOFT BOOKINGS (28.08.2026) ---------- */
/* Le cadre n'est insere qu'au clic : aucune requete vers Microsoft
   n'est emise tant que le visiteur n'a pas demande le calendrier. */
.msbook{
  max-width:1180px;
  margin:0 auto;
}
.msbook-ph{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:14px;
  padding:44px 28px;
  background:#fff;
  border:1px solid var(--line, #D5DCE8);
  border-radius:16px;
  box-shadow:0 2px 18px rgba(1,32,96,.06);
}
.msbook-ic{
  width:40px;
  height:40px;
  color:var(--vert, #3D7C02);
}
.msbook-txt{
  max-width:46ch;
  margin:0;
}
.msbook-ph .note{
  margin:2px 0 0;
  max-width:52ch;
}
/* Bookings choisit sa mise en page d'apres la largeur de SA fenetre, qui dans
   un cadre vaut la largeur du cadre. En dessous de son seuil, il bascule en
   affichage telephone : une colonne etroite perdue dans du blanc.
   On donne donc au cadre une largeur reelle de 1400px pour declencher la mise
   en page bureau, puis on le reduit proportionnellement via une transformation.
   Le facteur de reduction est calcule en JavaScript selon la place disponible. */
.msbook-frame{
  position:relative;
  overflow:hidden;
  border:1px solid var(--line, #D5DCE8);
  border-radius:16px;
  background:#fff;
}
.msbook-frame iframe{
  width:1400px;
  height:1500px;
  border:0;
  display:block;
  transform-origin:top left;   /* utilise seulement si 'zoom' est indisponible */
}
@media (max-width:860px){
  .msbook-ph{ padding:32px 20px; }
  /* sur telephone la mise en page mobile de Bookings est la bonne :
     on laisse le cadre a la largeur reelle, sans reduction */
  .msbook-frame iframe{
    width:100%;
    height:1750px;
    transform:none;
  }
}