/* DOSOBE v7 · identité affinée, menus, savoirs, leadership, pied de page, invite de sortie.
   Palette : teinte unique OKLCH h≈180 pour la famille verte (encre → signal → menthe),
   papier chaud conservé en contrepoint (h≈85). Contrastes vérifiés : signal-ink sur papier 5,9:1, signal sur encre 9,1:1. */
:root{
  --ink:#010E0E; --ink-2:#04211F; --ink-3:#0A3A35; --ink-soft:rgba(1,14,14,.68); --ink-faint:rgba(1,14,14,.12);
  --signal:#00C7AC; --signal-ink:#006A58; --mint:#84DFCB; --mint-p:#C4F4E8;
  --dsb-d:#010E0E; --dsb:#004F40; --dsb-p:#C4F4E8;
  --white:#FBFAF7; --paper:#F2EFE9; --paper-2:#E8E2D9;
}
::selection{background:var(--signal);color:var(--ink)}

/* — en-tête : trois menus — */
.hdr nav{align-items:stretch}
.mega-in.cols-2{grid-template-columns:4fr 4fr 4fr}
.mega-in.cols-3{grid-template-columns:3fr 4fr 3.4fr 3.4fr}
.mega .mg-t.dsb{--pv:var(--signal)}
.drawer .dr-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px}
.drawer .dr-cols > div{display:grid;gap:6px;align-content:start}
.drawer .dr-cols a{font:400 22px/1.2 var(--f-display);color:var(--white);text-decoration:none;padding:4px 0}
.drawer .dr-cols .tag{color:var(--signal);margin-bottom:6px}
.drawer > .btn{justify-self:start}

/* — demander à une IA — */
.askai{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:22px}
.askai .tag{margin-right:6px;color:var(--stone)}
.askai a{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;font:500 13px/1 var(--f-text);text-decoration:none;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink-faint);background:var(--white);transition:box-shadow .3s,background .3s}
.askai a:hover,.askai a:focus-visible{box-shadow:inset 0 0 0 1px var(--ink);background:var(--mint-p)}
.on-dark .askai .tag,.foot7 .askai .tag{color:rgba(251,250,247,.6)}
.foot7 .askai a{background:transparent;color:var(--white);box-shadow:inset 0 0 0 1px rgba(251,250,247,.22)}
.foot7 .askai a:hover{background:rgba(0,199,172,.14);box-shadow:inset 0 0 0 1px var(--signal)}

/* — publications — */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);border:var(--line);background:var(--white)}
.pcard{display:grid;grid-template-rows:auto auto 1fr;gap:14px;padding:18px 18px 22px;border-right:var(--line);border-bottom:var(--line);text-decoration:none;color:var(--ink);position:relative;transition:background .35s}
.pgrid .pcard:nth-child(3n){border-right:0}
.pcard:hover{background:var(--paper)}
.pc-img{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--ink) radial-gradient(circle,rgba(0,199,172,.35) 1px,transparent 1.6px) 0 0/8px 8px}
.pc-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(.35) contrast(1.02);transition:transform .8s var(--ease),filter .5s}
.pcard:hover .pc-img img{transform:scale(1.035);filter:none}
.pc-meta{display:flex;justify-content:space-between;gap:12px;font:500 12px/1 var(--f-num);color:var(--stone)}
.pc-t{font:400 clamp(19px,1.5vw,23px)/1.18 var(--f-display);padding-right:40px}
.pc-go{position:absolute;right:16px;bottom:18px;width:32px;height:32px;display:grid;place-items:center;box-shadow:inset 0 0 0 1px var(--ink-faint);transition:transform .5s var(--ease),background .3s}
.pcard:hover .pc-go{transform:rotate(-45deg);background:var(--signal)}
@media (max-width:980px){.pgrid{grid-template-columns:1fr 1fr}.pgrid .pcard:nth-child(3n){border-right:var(--line)}.pgrid .pcard:nth-child(2n){border-right:0}}
@media (max-width:640px){.pgrid{grid-template-columns:1fr}.pgrid .pcard{border-right:0!important}}

/* — guides — */
.guides{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:var(--line);background:var(--white)}
.guide{display:grid;gap:12px;align-content:start;padding:22px;border-right:var(--line);text-decoration:none;color:var(--ink);transition:background .35s}
.guide:last-child{border-right:0}
.guide:hover{background:var(--pp,var(--paper))}
.g-cover{position:relative;display:block;aspect-ratio:4/5;background:var(--ink);overflow:hidden;margin-bottom:6px}
.g-cover .mg-t{position:absolute;inset:0;width:auto;height:auto;opacity:.92;background-size:9px 9px}
.guide:hover .g-cover .mg-t{background-size:6px 6px}
.g-cover .num{position:absolute;left:16px;bottom:10px;font:300 72px/1 var(--f-num);color:var(--ink)}
.guide b{font:400 24px/1.12 var(--f-display)}
.g-p{font-size:15px;line-height:1.5;color:var(--ink-soft)}
@media (max-width:900px){.guides{grid-template-columns:1fr}.guide{border-right:0;border-bottom:var(--line)}.g-cover{aspect-ratio:16/9}}

/* — formations — */
.frm{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);border:var(--line);background:var(--white);counter-reset:f}
.frm li{position:relative;display:grid;grid-template-columns:52px 1fr 44px;grid-template-rows:auto auto auto;column-gap:16px;padding:22px;border-right:var(--line);border-bottom:var(--line);transition:background .35s}
.frm li:nth-child(2n){border-right:0}
.frm li:hover{background:var(--pp,var(--paper))}
.frm .num{grid-row:1/4;font:300 34px/1 var(--f-num);color:var(--stone)}
.frm .tag{grid-column:2}
.frm h3{grid-column:2;font:400 23px/1.15 var(--f-display);margin:8px 0}
.frm p{grid-column:2;margin:0;font-size:15px;line-height:1.5;color:var(--ink-soft)}
.frm .mg-t{grid-column:3;grid-row:1/3}
@media (max-width:800px){.frm{grid-template-columns:1fr}.frm li{border-right:0}}

/* — leadership — */
.leaders{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:0;border:var(--line);background:var(--white)}
.leader{display:grid;gap:10px;padding:18px 18px 22px;text-decoration:none;color:var(--ink);border-right:var(--line)}
.l-ph{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--ink);position:relative}
.l-ph::after{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(1,14,14,.5) 1px,transparent 1.6px) 0 0/6px 6px;mix-blend-mode:multiply;opacity:.0;transition:opacity .6s}
.l-ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .7s var(--ease),transform .9s var(--ease)}
.leader:hover .l-ph img{filter:grayscale(0);transform:scale(1.02)}
.leader:hover .l-ph::after{opacity:.35}
.leader .d3{font-size:clamp(26px,2.2vw,34px)}
.lead-principles{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border:var(--line)}
.lead-principles li{padding:18px;border-right:var(--line);font:500 15px/1.35 var(--f-text)}
.lead-principles li:last-child{border-right:0}
.lead-principles li::before{content:"";display:block;width:8px;height:8px;background:var(--signal);transform:rotate(45deg);margin-bottom:12px}
@media (max-width:800px){.lead-principles{grid-template-columns:1fr 1fr}.lead-principles li:nth-child(2){border-right:0}}
.about-lead{display:grid;grid-template-columns:4fr 7fr;gap:clamp(24px,4vw,64px);align-items:center}
.about-lead .leader{padding:0;border:0}
@media (max-width:800px){.about-lead{grid-template-columns:1fr}}

/* — portrait — */
.portrait{padding:calc(58px + var(--frame)*2 + 40px) 0 clamp(48px,7vw,96px)}
.pt-in{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,4vw,72px);align-items:start}
.pt-ph{position:relative;aspect-ratio:4/5;background:var(--ink);overflow:hidden}
.pt-ph img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;filter:grayscale(.15) contrast(1.03)}
.pt-trame{position:absolute;inset:auto 0 0 0;height:22%;width:100%;z-index:2;mix-blend-mode:normal}
.pt-txt .d1{margin:14px 0 8px}
.pt-q{margin:22px 0 26px;padding:0 0 0 20px;border-left:2px solid var(--signal)}
.pt-q p{font:400 clamp(22px,2vw,30px)/1.25 var(--f-display);margin:0}
.pt-txt .lead{margin:0 0 14px}
.pt-focus{list-style:none;margin:22px 0 28px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pt-focus li{padding:7px 12px;font:500 13px/1 var(--f-text);box-shadow:inset 0 0 0 1px var(--ink-faint);background:var(--white)}
.pt-media figure{margin:0}
.pt-media img{width:100%;height:auto;display:block;filter:grayscale(.2)}
.pt-media figcaption{margin-top:10px}
@media (max-width:900px){.pt-in{grid-template-columns:1fr}}

/* — scénarios — */
.scn{display:grid;gap:0}
.sc{border:var(--line);border-bottom:0;background:var(--white)}
.sc:last-of-type{border-bottom:var(--line)}
.sc header{display:grid;grid-template-columns:72px 1fr;column-gap:18px;padding:24px 24px 18px;border-bottom:var(--line);position:relative}
.sc header::after{content:"";position:absolute;right:0;top:0;bottom:0;width:6px;background:var(--pv,var(--signal))}
.sc header .num{grid-row:1/3;font:300 44px/1 var(--f-num);color:var(--stone)}
.sc header .d3{margin:8px 0 0}
.sc-b{display:grid;grid-template-columns:repeat(4,1fr)}
.sc-b > div{padding:20px 22px 24px;border-right:var(--line)}
.sc-b > div:last-child{border-right:0;background:var(--pp,var(--paper))}
.sc-b .lab{display:block;margin-bottom:10px}
.sc-b p,.sc-b li{font-size:15px;line-height:1.5;color:var(--ink-soft)}
.sc-b p{margin:0}
.sc-b ol{margin:0;padding-left:18px;display:grid;gap:6px}
.kpi{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.kpi li{padding-left:16px;position:relative;color:var(--ink)!important}
.kpi li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;background:var(--pv,var(--signal));transform:rotate(45deg)}
.scn .fine{margin-top:22px;font-size:13px;color:var(--stone);max-width:60em}
@media (max-width:1000px){.sc-b{grid-template-columns:1fr 1fr}.sc-b > div:nth-child(2){border-right:0}.sc-b > div:nth-child(-n+2){border-bottom:var(--line)}}
@media (max-width:640px){.sc-b{grid-template-columns:1fr}.sc-b > div{border-right:0;border-bottom:var(--line)}}

/* — agents — */
.atable{width:100%;border-collapse:collapse;background:var(--white);border:var(--line);font-size:15px}
.atable th,.atable td{text-align:left;padding:14px 18px;border-bottom:var(--line);vertical-align:top}
.atable th{font:500 11px/1 var(--f-num);letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.atable code{font:500 14px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--signal-ink)}
.atable code a{color:inherit}
.agent-note{margin-top:28px;padding:22px;background:var(--ink);color:var(--white)}
.agent-note .tag{color:var(--signal)}
.agent-note p{margin:12px 0 0;max-width:62em;line-height:1.55}
.agent-note a{color:var(--signal)}

/* — publication (article) — */
.art-h{padding:calc(58px + var(--frame)*2 + 40px) 0 0}
.art-h .d1{font-size:clamp(36px,4.6vw,72px);max-width:18em;margin:18px 0 26px}
.art-meta{display:flex;flex-wrap:wrap;gap:0;margin:0;border-top:var(--line);border-bottom:var(--line)}
.art-meta > div{padding:12px 22px 12px 0;margin-right:22px;border-right:var(--line)}
.art-meta > div:last-child{border-right:0}
.art-meta dt{font:500 11px/1 var(--f-num);letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.art-meta dd{margin:6px 0 0;font-weight:500}
.art-cover{margin-top:30px}
.art-cover img{width:100%;height:auto;max-height:620px;object-fit:cover;display:block}
.art-body{display:grid;grid-template-columns:3fr 8fr;gap:clamp(24px,4vw,72px);padding-top:clamp(36px,5vw,72px);padding-bottom:clamp(48px,6vw,96px)}
.art-side{position:sticky;top:110px;align-self:start;display:grid;gap:18px}
.toc ol{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:2px;counter-reset:t}
.toc li{counter-increment:t}
.toc a{display:grid;grid-template-columns:28px 1fr;padding:6px 0;font-size:14px;line-height:1.35;text-decoration:none;color:var(--ink-soft);border-bottom:var(--line)}
.toc a::before{content:counter(t,decimal-leading-zero);font:500 11px/1.6 var(--f-num);color:var(--stone)}
.toc a:hover{color:var(--ink)}
.art .prose{max-width:44em;font-size:18px;line-height:1.7}
.art .prose h2{font:400 clamp(26px,2.4vw,36px)/1.15 var(--f-display);margin:1.8em 0 .6em;scroll-margin-top:110px}
.art .prose h3{font:500 20px/1.3 var(--f-text);margin:1.6em 0 .5em}
.art .prose img{max-width:100%;height:auto}
.art .prose blockquote{margin:1.6em 0;padding-left:20px;border-left:2px solid var(--signal);font-family:var(--f-display);font-size:1.2em}
.art .prose a{color:var(--signal-ink)}
.art .prose table{width:100%;border-collapse:collapse;font-size:15px}
.art .prose td,.art .prose th{border:var(--line);padding:8px 10px}
@media (max-width:900px){.art-body{grid-template-columns:1fr}.art-side{position:static}}

/* — vidéo, témoignages — */
.vid{position:relative;aspect-ratio:16/9;background:var(--ink)}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tms{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:0;border:var(--line);background:var(--white)}
.tm{margin:0;padding:18px;border-right:var(--line);display:grid;gap:14px;align-content:start}
.tm blockquote{margin:0;font:400 20px/1.35 var(--f-display)}
.tm figcaption span{color:var(--stone);font-size:14px}

/* — pied de page d'identité — */
.foot7{background:var(--ink);color:rgba(251,250,247,.74);font-size:14px;position:relative;overflow:hidden}
.f-sig{position:relative;height:clamp(120px,18vw,260px);border-bottom:1px solid rgba(251,250,247,.1);display:flex;align-items:flex-start;gap:18px;padding:18px var(--gut)}
.f-sig span{position:relative;z-index:2;font:500 11px/1 var(--f-num);letter-spacing:.2em;text-transform:uppercase;color:var(--signal)}
.f-trame{position:absolute;inset:0;width:100%;height:100%}
.f-grid{display:grid;grid-template-columns:4fr repeat(3,2.6fr);border-bottom:1px solid rgba(251,250,247,.1)}
.f-grid > div{padding:26px var(--gut);border-right:1px solid rgba(251,250,247,.1);display:grid;gap:9px;align-content:start}
.f-grid > div:last-child{border-right:0}
.f-id p{margin:12px 0 4px;max-width:30em;line-height:1.55}
.f-id img{height:22px;width:auto}
.f-facts{margin:10px 0 0;display:grid;gap:0;border-top:1px solid rgba(251,250,247,.1)}
.f-facts > div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid rgba(251,250,247,.1)}
.f-facts dt{font:500 11px/1.6 var(--f-num);letter-spacing:.14em;text-transform:uppercase;color:rgba(251,250,247,.55)}
.f-facts dd{margin:0;color:var(--white)}
.f-dot{display:inline-block;width:7px;height:7px;background:var(--signal);transform:rotate(45deg);margin-right:8px;vertical-align:1px}
@media (prefers-reduced-motion:no-preference){.f-dot{animation:fdot 2.8s ease-in-out infinite}@keyframes fdot{50%{opacity:.25}}}
.foot7 .lab{font:500 11px/1 var(--f-num);letter-spacing:.14em;text-transform:uppercase;color:var(--signal);margin-bottom:6px}
.foot7 a{color:var(--white);text-decoration:none}
.f-col a{position:relative;width:max-content;max-width:100%}
.f-col a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--signal);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.f-col a:hover::after,.f-col a:focus-visible::after{transform:none}
.f-ask{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px 28px;padding:20px var(--gut);border-bottom:1px solid rgba(251,250,247,.1)}
.f-ask p{margin:0}
.f-ask p a{color:var(--signal)}
.f-ask .askai{margin-top:0}
.f-legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:16px var(--gut);font-size:13px}
.f-legal a{color:rgba(251,250,247,.82)}
@media (max-width:980px){.f-grid{grid-template-columns:1fr 1fr}.f-grid > div{border-bottom:1px solid rgba(251,250,247,.1)}.f-id{grid-column:1/-1}}
@media (max-width:560px){.f-grid{grid-template-columns:1fr}}

/* — invite de sortie — */
.exit{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:16px;background:rgba(1,14,14,.42);backdrop-filter:blur(3px);opacity:0;transition:opacity .4s var(--ease)}
.exit.on{opacity:1}
.exit[hidden]{display:none}
.exit-in{position:relative;width:min(560px,100%);background:var(--ink);color:var(--white);padding:28px 26px 22px;display:grid;gap:14px;box-shadow:0 0 0 1px rgba(0,199,172,.35),0 40px 80px -30px rgba(0,0,0,.6);transform:translateY(12px) scale(.98);transition:transform .5s var(--ease)}
.exit.on .exit-in{transform:none}
.exit-in .tag{color:var(--signal)}
.exit-in .d3{margin:0;font-size:clamp(24px,2.4vw,32px)}
.exit-in textarea,.exit-in input:not([type=hidden]){font:400 16px/1.45 var(--f-text);color:var(--white);background:rgba(251,250,247,.05);border:0;box-shadow:inset 0 0 0 1px rgba(251,250,247,.18);padding:12px 14px;width:100%;resize:vertical;border-radius:var(--r)}
.exit-in textarea:focus,.exit-in input:focus{outline:2px solid var(--signal);outline-offset:0}
.exit-row{display:grid;grid-template-columns:1fr auto;gap:10px}
.exit-x{position:absolute;right:12px;top:12px;width:34px;height:34px;display:grid;place-items:center;background:none;border:0;color:var(--white);cursor:pointer}
.exit-msg{margin:0;min-height:1.3em;font-size:14px;color:var(--mint)}
.exit .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:520px){.exit-row{grid-template-columns:1fr}}
@media (max-width:1080px){.hdr .end{justify-self:end}}
