:root{--bg:#fff;--ink:#141a33;--muted:#4d5470;--line:#dce0ec;--soft:#f1f3f8;--accent:#2546d8;--accent-tint:#e8edff;--confetti:#ff8a3d;--confetti-ink:#b34a0b;--todo:#fff1c2;--display:"Outfit","Avenir Next","Segoe UI",system-ui,sans-serif;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0e1226;--ink:#eef0f8;--muted:#a9aecb;--line:#2a3052;--soft:#171c36;--accent:#6c86f5;--accent-tint:#1c2550;--confetti-ink:#ffa366;--todo:#5a4600;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0e1226;--ink:#eef0f8;--muted:#a9aecb;--line:#2a3052;--soft:#171c36;--accent:#6c86f5;--accent-tint:#1c2550;--confetti-ink:#ffa366;--todo:#5a4600;color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 "DM Sans","Segoe UI",system-ui,sans-serif}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:-9999px;top:8px;background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:999px;z-index:9}
.skip:focus{left:12px}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;max-width:1200px;margin:0 auto;padding:14px max(16px,env(safe-area-inset-left))}
.brand{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:1.2rem;letter-spacing:-.02em;text-decoration:none;min-height:44px}
.brand svg{flex:none}.brand .mk{font:700 1.3rem/1 var(--display);letter-spacing:-.03em}
.back{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-weight:600;font-size:.95rem}
.back:hover{background:var(--soft)}
main{max-width:72ch;margin:0 auto;padding:clamp(16px,4vw,40px) 16px 48px}
h1{font-size:clamp(1.9rem,1.4rem + 2.2vw,2.8rem);line-height:1.12;letter-spacing:-.03em;margin:0 0 12px;text-wrap:balance}
h2{font-size:1.3rem;line-height:1.3;letter-spacing:-.01em;margin:2.2em 0 .5em}
.lead{font-size:1.12rem;color:var(--muted);margin:0 0 6px}
.maj{font-size:.9rem;color:var(--muted);margin:0}
p,li{max-width:68ch}
ul{padding-left:1.2em}
li{margin:.45em 0}
.sum{list-style:none;padding:14px 18px;background:var(--soft);border-radius:16px}
.sum li{padding-left:1.4em;position:relative}
.sum li::before{content:"✓";position:absolute;left:0;font-weight:700}
.kv{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 20px;margin:0}
.kv dt{font-weight:600}.kv dd{margin:0}
@media (max-width:480px){.kv{grid-template-columns:minmax(0,1fr)}.kv dd{margin-bottom:8px}}
mark.todo{background:var(--todo);color:inherit;padding:1px 6px;border-radius:6px;font-weight:600}
.tbl{overflow-x:auto;margin:1em 0;border:1px solid var(--line);border-radius:14px}
table{border-collapse:collapse;width:100%;font-size:.95rem}
th,td{text-align:left;vertical-align:top;padding:10px 14px;border-bottom:1px solid var(--line)}
tr:last-child td{border-bottom:0}
th{background:var(--soft);font-weight:600}
@media (max-width:560px){table,thead,tbody,tr,th,td{display:block}thead{position:absolute;left:-9999px}tr{border-bottom:1px solid var(--line);padding:8px 0}tr:last-child{border-bottom:0}td{border:0;padding:2px 14px}td:first-child{font-weight:600;padding-top:8px}}
.cols{columns:3 200px;column-gap:24px;list-style:none;padding:0}
.cols li{break-inside:avoid;display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid var(--line);padding:7px 0;margin:0}
.cols span{color:var(--muted);font-variant-numeric:tabular-nums}
code{background:var(--soft);padding:1px 6px;border-radius:6px;font-size:.92em}
.foot{max-width:1200px;margin:0 auto;padding:18px 16px 32px;border-top:1px solid var(--line)}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 18px}
.foot a{color:var(--muted);min-height:36px;display:inline-flex;align-items:center}
.foot a[aria-current]{color:var(--ink);font-weight:600}
.gen{display:grid;gap:14px;margin:1.2em 0;padding:16px 18px;border:1px solid var(--line);border-radius:16px}
.gen .row{display:grid;gap:6px;border:0;padding:0;margin:0}
.gen legend{font-weight:600;padding:0;margin-bottom:4px}
.gen label{font-weight:600}
.gen .ck{font-weight:400;display:flex;gap:8px;align-items:center;min-height:32px}
.gen input[type=text],.gen input:not([type]),.gen #g-dep{font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);max-width:320px}
.gen input[type=color]{width:64px;height:40px;border:1px solid var(--line);border-radius:10px;background:none;padding:2px}
textarea.code{width:100%;font:13px/1.5 ui-monospace,Menlo,Consolas,monospace;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--soft);color:var(--ink);resize:vertical}
.btn{font:inherit;font-weight:600;min-height:44px;padding:0 18px;border:0;border-radius:999px;background:var(--ink);color:var(--bg);cursor:pointer}
#g-link{overflow-wrap:anywhere}
.prev{border:1px solid var(--line);border-radius:16px;overflow:hidden}
.prev iframe{display:block;width:100%;height:900px;border:0}
main:has(.gen){max-width:900px}
.ty{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:2px 12px}
pre.code{white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.5 ui-monospace,Menlo,Consolas,monospace;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}
.gen input[type=url],.gen input[type=password],.gen input[type=number],.gen #nk-nom,.gen #nk-contact,.gen #nk-deps,.gen #nk-orig,.gen #nk-notes{font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);max-width:460px}
.map{height:420px;border:1px solid var(--line);border-radius:16px;overflow:hidden;margin:0 0 1em}
.gen select{font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);max-width:260px}
.gen input[type=range]{max-width:460px;width:100%}
#gz-com{font:inherit;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);max-width:320px}
main:has(#gz-map){max-width:980px}
/* ---------- Page API (façon console développeur) ---------- */
main:has(.api){max-width:1240px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.api{display:grid;grid-template-columns:210px minmax(0,1fr);gap:48px;margin-top:28px;--cbg:#16181d;--cink:#e6e6e3;--cmut:#8b929c}
.api-nav{position:sticky;top:16px;align-self:start;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 32px);overflow:auto;padding-right:8px;border-right:1px solid var(--line)}
.api-nav-t{margin:14px 0 4px;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.api-nav-t:first-child{margin-top:0}
.api-nav a{display:block;padding:6px 10px;border-radius:8px;text-decoration:none;font-size:.95rem;color:var(--muted);border-left:3px solid transparent}
.api-nav a:hover{background:var(--soft);color:var(--ink)}
.api-nav a.on{color:var(--ink);font-weight:650;border-left-color:var(--accent);background:var(--soft)}
.api-doc{min-width:0}
.api-doc section{scroll-margin-top:16px}
.api-doc section>h2:first-child{margin-top:0}
.api-doc section+section{margin-top:56px}
.api-doc h3{font-size:1.05rem;margin:1.8em 0 .5em}
.api-doc p,.api-doc li{max-width:78ch}
.api-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:0 0 18px}
.api-card{display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid var(--line);border-radius:16px;text-decoration:none}
.api-card:hover{border-color:var(--ink)}
.api-card b{font-size:1.05rem}.api-card span:last-child{color:var(--muted);font-size:.95rem;line-height:1.5}
.api-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--soft);font:700 1rem ui-monospace,Menlo,monospace;color:var(--accent)}
.api-cta{display:flex;flex-wrap:wrap;gap:10px}
.api .btn{display:inline-flex;align-items:center;text-decoration:none}
.api .btn-2{background:transparent;color:var(--ink);border:1px solid var(--line)}
.api .btn-2:hover{background:var(--soft)}
.api-steps{padding-left:1.4em}.api-steps li{margin:.5em 0}
.note{padding:14px 18px;border-radius:14px;background:var(--soft);border-left:4px solid var(--accent);margin:1em 0}
.tabs{margin:1em 0;border-radius:14px;overflow:hidden;background:var(--cbg)}
.tabs-bar{display:flex;gap:2px;overflow-x:auto;padding:6px 6px 0;background:#0e1013;scrollbar-width:none}
.tabs-bar::-webkit-scrollbar{display:none}
.tabs-bar [role=tab]{font:600 .88rem/1 inherit;font-family:inherit;color:var(--cmut);background:none;border:0;padding:12px 14px;border-radius:10px 10px 0 0;cursor:pointer;white-space:nowrap;min-height:40px}
.tabs-bar [role=tab]:hover{color:var(--cink)}
.tabs-bar [role=tab][aria-selected=true]{color:#fff;background:var(--cbg);box-shadow:inset 0 2px 0 var(--accent)}
.api pre{position:relative;margin:1em 0;padding:16px 18px;border-radius:14px;background:var(--cbg);color:var(--cink);font:13.5px/1.6 ui-monospace,"SF Mono",Menlo,Consolas,monospace;overflow:auto;white-space:pre;tab-size:2;max-height:560px}
.tabs pre{margin:0;border-radius:0}
.api pre code{background:none;padding:0;font:inherit;color:inherit}
.api pre:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.tabs-bar .cp{position:sticky;right:0;box-shadow:-10px 0 10px #0e1013;margin-left:auto;align-self:center;font:600 12px/1 system-ui,sans-serif;color:var(--cink);background:#2a2e36;border:0;border-radius:8px;padding:0 12px;cursor:pointer;min-height:32px;margin-bottom:4px;flex:none}
.tabs-bar .cp:hover{background:#3a404b}
.tabs-bar:not(:has([role=tab])){padding:6px}.tabs-bar:not(:has([role=tab])) .cp{margin-bottom:0}
.tk-c{color:#7f8a99;font-style:italic}.tk-s{color:#a5d6a7}.tk-k{color:#f5a26b}
.kv2{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;margin:1em 0;padding:14px 16px;border:1px solid var(--line);border-radius:14px}
.kv2 code{overflow-wrap:anywhere;background:none;padding:0}
.verb{font:700 .75rem ui-monospace,Menlo,monospace;color:#0b7a3e;background:#e3f6ea;padding:3px 8px;border-radius:6px}
.api table.ref td:first-child{white-space:nowrap}
.api table.ref td:first-child code{white-space:nowrap}
.demo-f,.ex-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin:1em 0}
.demo-f label,.ex-g label{display:grid;gap:4px;font-weight:600;font-size:.9rem}
.demo-f select,.ex select,.ex input[type=text],.ex input[type=number]{font:inherit;font-weight:400;font-size:1rem;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);width:100%;min-height:44px}
.demo{padding:16px;border:1px solid var(--line);border-radius:16px;min-height:120px}
.demo-map{height:440px;padding:0;overflow:hidden}
.ex{padding:16px 18px;border:1px solid var(--line);border-radius:16px}
.ex-act{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin:4px 0 0}
.ex-act .ck{display:flex;gap:8px;align-items:center;min-height:44px}
.ex-out{margin-top:16px}
.ex-st{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:0}
#ex-s{font-weight:700;padding:3px 10px;border-radius:999px;background:var(--soft)}
#ex-s.ok{background:#e3f6ea;color:#0b5d30}#ex-s.ko{background:#fde8e8;color:#9b1c1c}
#ex-ms{color:var(--muted);font-size:.95rem}
@media (max-width:900px){
  .api{grid-template-columns:minmax(0,1fr);gap:0;margin-top:18px}
  .api-nav{position:sticky;top:0;z-index:5;flex-direction:row;overflow-x:auto;max-height:none;border:0;border-bottom:1px solid var(--line);background:var(--bg);margin:0 -16px 24px;padding:8px 16px;gap:6px;scrollbar-width:none}
  .api-nav::-webkit-scrollbar{display:none}
  .api-nav-t{display:none}
  .api-nav a{white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:8px 14px;min-height:40px;display:flex;align-items:center}
  .api-nav a.on{border-color:var(--ink);background:var(--ink);color:var(--bg)}
  .api-doc section{scroll-margin-top:72px}
  .api pre{font-size:12.5px;padding:14px}
  .demo-map{height:360px}
}
@media (max-width:560px){.api table.ref td:first-child{white-space:normal}.kv2{grid-template-columns:minmax(0,1fr);gap:2px}.kv2 .verb{justify-self:start;margin-top:8px}}

/* ---------- Charte Trucs à faire ---------- */
h1,h2,h3,.api-card b{font-family:var(--display);letter-spacing:-.02em}
h1{font-weight:700;letter-spacing:-.03em}
h2,h3{font-weight:700}
a{text-decoration-color:color-mix(in srgb,var(--accent) 45%,transparent)}
main :is(p,li,td,dd,figcaption) a:not(.btn){color:var(--accent)}
.btn{background:var(--accent);color:var(--bg)}
.api .btn-2{background:transparent;color:var(--ink)}
.kicker,.maj{color:var(--muted)}
/* ---------- Page « Créer un compte » : offres ---------- */
main:has(.offres){max-width:1240px}
main:has(.offres)>h1,main:has(.offres)>.lead,main:has(.offres)>.maj{text-align:center;margin-left:auto;margin-right:auto}
main:has(.offres)>.maj{display:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.per{display:flex;width:max-content;margin:22px auto 28px;padding:4px;border-radius:999px;background:var(--soft);border:1px solid var(--line)}
.per button{font:600 .95rem "DM Sans",system-ui,sans-serif;border:0;background:none;color:var(--muted);min-height:42px;padding:0 18px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.per button[aria-pressed="true"]{background:var(--bg);color:var(--ink);box-shadow:0 1px 3px rgba(20,26,51,.14)}
.per .eco{font-size:.75rem;font-weight:700;color:var(--confetti-ink);background:color-mix(in srgb,var(--confetti) 18%,transparent);padding:2px 8px;border-radius:999px}
.cartes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:stretch;padding:16px 2px 6px}
.carte{position:relative;display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line);border-radius:22px;padding:24px 22px 22px}
.carte .pic{width:48px;height:48px;border-radius:15px;background:var(--kt);color:var(--k);display:grid;place-items:center}
.carte .pic svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.carte h2{font:700 1.45rem/1.15 var(--display);letter-spacing:-.025em;margin:16px 0 4px}
.carte .pour{margin:0;color:var(--muted);font-size:.95rem;min-height:3em;line-height:1.45}
.carte .prix{margin:14px 0 18px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.carte .prix small{width:100%;font-size:.82rem;color:var(--muted);line-height:1}
.carte .prix b{font:700 2.4rem/1 var(--display);letter-spacing:-.04em}
.carte .prix span{font-size:.88rem;color:var(--muted);line-height:1.3}
.cta{display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:999px;border:1.5px solid var(--ink);font-weight:700;text-decoration:none;font-size:.98rem}
.cta:hover{background:var(--soft)}
.cta.go{background:var(--accent);border-color:var(--accent);color:#fff}
.cta.go:hover{background:color-mix(in srgb,var(--accent) 86%,#000)}
.carte .plus{margin:18px 0 0;font-size:.85rem;font-weight:700;color:var(--muted)}
.av{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:11px}
.av li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;margin:0;font-size:.94rem;line-height:1.4}
.av svg{width:20px;height:20px;margin-top:1px;fill:none;stroke:var(--k);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.carte.reco{border:2px solid var(--accent);box-shadow:0 18px 40px -18px color-mix(in srgb,var(--accent) 55%,transparent);transform:translateY(-10px)}
.carte.reco{background:linear-gradient(180deg,var(--accent-tint),var(--bg) 42%)}
.ruban{position:absolute;top:-14px;left:50%;transform:translateX(-50%);margin:0;background:var(--accent);color:#fff;font:700 .78rem/1 "DM Sans",system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:8px 14px;border-radius:999px;white-space:nowrap}
.ruban::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--confetti);margin-right:7px;vertical-align:1px}
.tva{text-align:center;font-size:.85rem;color:var(--muted);margin:22px auto 0;max-width:70ch}
.cmpb{text-align:center;margin:22px 0 0;max-width:none}
.btn{font:700 1rem "DM Sans",system-ui,sans-serif;min-height:48px;padding:0 26px;border-radius:999px;border:1.5px solid var(--ink);background:var(--bg);color:var(--ink);cursor:pointer}
.btn:hover{background:var(--soft)}
.cmp{margin:26px 0 8px;overflow-x:auto;border:1px solid var(--line);border-radius:18px;scroll-margin-top:16px}
.cmp table,.cmp thead,.cmp tbody{display:revert}
.cmp tr{display:table-row;padding:0;border:0}
.cmp th,.cmp td{display:table-cell;padding:11px 14px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle;font-size:.92rem}
.cmp thead{position:static}
.cmp table{min-width:720px;border-collapse:separate;border-spacing:0}
.cmp th[scope="row"]{text-align:left;font-weight:500;background:var(--bg);position:sticky;left:0;z-index:1;min-width:210px}
.cmp thead th{background:var(--soft);font:700 1rem var(--display);position:sticky;top:0}
.cmp thead th:first-child{text-align:left;left:0;z-index:2;font:600 .85rem "DM Sans",system-ui,sans-serif;color:var(--muted)}
.cmp .r{background:color-mix(in srgb,var(--accent-tint) 70%,var(--bg))}
.cmp thead th.r{background:var(--accent);color:#fff}
.cmp td{color:var(--ink)}
.cmp td.n{color:var(--muted);opacity:.7}
.cmp tr.g th{background:var(--soft);text-align:left;font:700 .8rem "DM Sans",system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding-top:16px}
.cmp tr.p th,.cmp tr.p td{font-weight:700;border-bottom:0}
.offres details{border-bottom:1px solid var(--line);max-width:72ch}
.offres h2+details{border-top:1px solid var(--line)}
.offres summary{cursor:pointer;font-weight:600;padding:14px 0;min-height:44px}
.offres details p{margin:0 0 14px;color:var(--muted)}
.offres>h2{margin-top:2.4em}
@media (max-width:1060px){.cartes{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.carte.reco{transform:none}}
@media (max-width:640px){
  .cartes{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 -16px;padding:20px 16px 12px;scrollbar-width:none}
  .cartes::-webkit-scrollbar{display:none}
  .carte{flex:0 0 84%;scroll-snap-align:center}
  .carte .pour{min-height:0}
  .per button{padding:0 14px}
}
@media (prefers-reduced-motion:no-preference){.carte{transition:transform .18s ease,box-shadow .18s ease}.carte:not(.reco):hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(20,26,51,.35)}}
.carte.reco .pic{background:var(--bg);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 25%,transparent)}
.offres>h2,.offres details{margin-left:auto;margin-right:auto;max-width:760px}
.pts{display:none;justify-content:center;gap:7px;margin-top:4px}
.pts i{width:7px;height:7px;border-radius:999px;background:var(--line);transition:width .2s,background .2s}
.pts i.on{width:22px;background:var(--accent)}
@media (max-width:640px){.pts{display:flex}}
.carte .pic{background:color-mix(in srgb,var(--k) 13%,var(--bg))}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .cta.go,:root:not([data-theme="light"]) .ruban,:root:not([data-theme="light"]) .cmp thead th.r{color:#0e1226}}
:root[data-theme="dark"] .cta.go,:root[data-theme="dark"] .ruban,:root[data-theme="dark"] .cmp thead th.r{color:#0e1226}
@media (max-width:640px){
  .cmp{margin-left:-16px;margin-right:-16px;border-radius:0;border-left:0;border-right:0}
  .cmp table{min-width:540px}
  .cmp th[scope="row"]{min-width:0;width:132px;max-width:132px;font-size:.8rem;line-height:1.3;padding:9px 8px 9px 12px;box-shadow:1px 0 0 var(--line)}
  .cmp td{font-size:.78rem;padding:9px 4px}
  .cmp thead th{font-size:.82rem;padding:10px 4px;line-height:1.15}
  .cmp tr.g th{font-size:.7rem;padding:12px 8px 6px 12px}
}
@media (max-width:640px){
  .cmp table{min-width:0;width:472px;table-layout:fixed}
  .cmp thead th:first-child{width:132px;padding-left:12px;font-size:.72rem}
  .cmp thead th{width:85px}
}
/* Carte recommandée : dépasse en haut seulement (bas aligné avec les autres), lueur courte qui n'est jamais coupée */
.carte.reco{transform:none;margin-top:-10px;box-shadow:0 12px 28px -14px color-mix(in srgb,var(--accent) 45%,transparent)}
@media (max-width:1060px){.carte.reco{margin-top:0}}
@media (max-width:640px){
  .cartes{padding-bottom:30px;margin-bottom:-14px}
  .carte.reco{box-shadow:0 8px 18px -10px color-mix(in srgb,var(--accent) 45%,transparent)}
}
.engag{display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:start;max-width:860px;margin:26px auto 0;padding:16px 20px;border-radius:18px;background:color-mix(in srgb,#0b7a5e 9%,var(--bg));border:1px solid color-mix(in srgb,#0b7a5e 30%,var(--line))}
.engag svg{width:30px;height:30px;fill:none;stroke:#0b7a5e;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.engag p{margin:0;font-size:.95rem;line-height:1.55;max-width:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .engag svg{stroke:#4cc49f}}
/* ---------- Kit de communication ---------- */
main:has(.kit){max-width:980px}
.kit-intro{font-size:1.05rem}
.kit-f{background:var(--soft);border-radius:18px;padding:18px 20px;margin:12px 0 18px}
.kit-f label{font-weight:600}
.kit-f .opt{font-weight:400;color:var(--muted)}
.kit-f input:not([type=radio]){display:block;width:100%;margin-top:4px;min-height:46px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--ink);font:inherit}
.kit-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:12px 0}
@media (max-width:560px){.kit-row{grid-template-columns:1fr}}
.kit-ch{border:0;padding:0;margin:0 0 10px;display:flex;flex-wrap:wrap;gap:8px}
.kit-ch legend{font-weight:600;margin-bottom:6px}
.kit-ch label{position:relative;cursor:pointer;font-weight:500}
.kit-ch input{position:absolute;opacity:0;inset:0;margin:0}
.kit-ch span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:var(--bg);font-size:.92rem}
.kit-ch input:checked+span{background:var(--accent);border-color:var(--accent);color:#fff}
.kit-ch input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
.btn.go{background:var(--accent);border-color:var(--accent);color:#fff}
.kit-aper{background:var(--soft);border-radius:18px;padding:24px;display:flex;justify-content:center;margin-bottom:8px}
.aff{background:#fff;color:#141a33;width:min(100%,420px);aspect-ratio:210/297;border-radius:6px;box-shadow:0 12px 30px -14px rgb(20 26 51 / .4);padding:7% 8%;display:flex;flex-direction:column;align-items:center;text-align:center;font-family:"DM Sans",system-ui,sans-serif;container-type:inline-size}
.aff-top{display:flex;align-items:center;gap:2.4cqi;font:700 5.4cqi/1 "Outfit",sans-serif;letter-spacing:-.03em;color:#141a33}
.aff-top svg{width:9cqi;height:9cqi}
.aff-k{margin:7cqi 0 0;font:700 3.6cqi/1.2 "DM Sans",sans-serif;text-transform:uppercase;letter-spacing:.08em;color:#b34a0b}
.aff-h{margin:2cqi 0 0;font:700 8.6cqi/1.08 "Outfit",sans-serif;letter-spacing:-.035em;text-wrap:balance}
.aff-qr{width:44cqi;margin:6cqi 0 0;padding:3cqi;border:1.2cqi solid #2546D8;border-radius:5cqi}
.aff-qr svg{display:block;width:100%;height:auto}
.aff-s{margin:3cqi 0 0;font-size:3.3cqi;color:#4d5470}
.aff-u{margin:1.5cqi 0 0;font:700 4.6cqi/1.2 "Outfit",sans-serif;color:#2546D8}
.aff-n{margin:3cqi 0 0;font:600 4cqi/1.25 "DM Sans",sans-serif}
.aff-n:empty{display:none}
.aff-b{margin:auto 0 0;font-size:3cqi;color:#4d5470}
.kit-badge-aper{padding:18px;background:var(--soft);border-radius:14px;margin:8px 0}
.tf-badge{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;background:#2546D8;color:#fff;font:600 15px/1 "DM Sans",system-ui,sans-serif;text-decoration:none}
.kit-code{width:100%;font:13px/1.5 ui-monospace,Menlo,monospace;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--bg);color:var(--ink)}
.kit-dl{columns:2 260px}
.kit-note{font-size:.9rem;color:var(--muted)}
@page{size:A4;margin:0}
@page a5{size:A5;margin:0}
@media print{
  html,body{height:100%;overflow:hidden;margin:0}
  body *{visibility:hidden}
  .aff,.aff *{visibility:visible}
  .kit-aper{position:absolute;inset:0;padding:0;background:none;display:block}
  .aff{position:fixed;inset:0;width:100%;height:100%;aspect-ratio:auto;box-shadow:none;border-radius:0;padding:12mm 14mm}
  .aff.a5{page:a5}
}
/* Affiche : fond coloré ou sobre, pied de page */
.aff{position:relative;overflow:hidden;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.aff>*{position:relative;z-index:1}
.aff-deco{position:absolute!important;inset:0;z-index:0!important;display:none}
.aff.couleur{background:radial-gradient(110% 70% at 100% 0%,#5B78F2 0%,rgba(91,120,242,0) 60%),linear-gradient(165deg,#3150E3,#2546D8 50%,#1C38BD);color:#fff}
.aff.couleur .aff-deco{display:block}
.aff-deco i{position:absolute;border-radius:42% 58% 55% 45%/48% 42% 58% 52%;background:rgba(255,255,255,.08)}
.aff-deco .b1{width:70cqi;height:60cqi;left:-30cqi;top:-18cqi}
.aff-deco .b2{width:80cqi;height:70cqi;right:-38cqi;bottom:-26cqi;background:rgba(255,255,255,.07)}
.aff-deco .b3{width:40cqi;height:36cqi;right:-12cqi;top:34%;background:rgba(255,138,61,.16)}
.aff-deco b{position:absolute;width:2.4cqi;height:2.4cqi;border-radius:50%}
.aff-deco b.r{background:none!important;border:.9cqi solid #FFB27F;width:3.6cqi;height:3.6cqi}
.aff.couleur .aff-top{color:#fff;background:#fff;padding:2.2cqi 4cqi 2.2cqi 2.4cqi;border-radius:999px;color:#141a33}
.aff.couleur .aff-k{color:#FFB27F}
.aff.couleur .aff-h{color:#fff}
.aff.couleur .aff-qr{background:#fff;border-color:#FF8A3D;box-shadow:0 3cqi 6cqi -3cqi rgba(0,0,0,.4)}
.aff.couleur .aff-s{color:#DCE3FF}
.aff.couleur .aff-n{color:#fff}
.aff.couleur .aff-b,.aff.couleur .aff-u{color:#DCE3FF}
.aff.couleur .aff-u b{color:#fff}
.aff-n{margin:2.4cqi 0 0!important;font:700 5cqi/1.2 "Outfit",sans-serif!important}
.aff-pied{margin-top:auto;display:grid;gap:1.4cqi}
.aff-pied p{margin:0}
.aff-u{font:500 2.7cqi/1.35 "DM Sans",sans-serif!important;color:#4d5470}
.aff-u b{font-weight:700;color:#2546D8}
.aff-qr{width:52cqi!important;margin-top:7cqi!important}
.aff-h{font-size:9.2cqi!important}
.aff-n{font-size:5.6cqi!important}
/* ---------- Pages « Que faire à … » (communes, départements) ---------- */
main.qf{max-width:860px}
.fil{font-size:.9rem;color:var(--muted);margin-bottom:10px}.fil a{color:inherit}
.qf .qcta{margin:16px 0 22px}
.qf .qbtn{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border-radius:999px;background:var(--accent);color:#fff;text-decoration:none;font-weight:700}
.evl{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.evl li{margin:0;max-width:none;border-bottom:1px solid var(--line)}
.evl a{display:grid;gap:2px;padding:12px 4px 12px 16px;text-decoration:none;border-left:4px solid var(--c);margin:6px 0}
.evl a:hover{background:var(--soft)}
.evl .q{font-size:.85rem;font-weight:600;color:var(--confetti-ink)}
.evl .t{font:700 1.05rem/1.3 var(--display);letter-spacing:-.01em}
.evl .m{font-size:.9rem;color:var(--muted)}.evl .g{color:#0b7a5e}
.qf .plus{color:var(--muted)}
.vois{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.vois li{margin:0}
.vois a{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-weight:600;font-size:.92rem}
.vois a:hover{background:var(--soft)}.vois span{color:var(--muted);font-weight:500}
.cats{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.cats li{margin:0}.cats a{display:block;padding:12px 14px;border-radius:14px;border:1px solid var(--line);border-left:5px solid var(--c);text-decoration:none}
.cats b{font:700 1.2rem var(--display);margin-right:4px}
.qf .src{font-size:.85rem;color:var(--muted);margin-top:28px}
.evl a,.cats a{color:var(--ink)}
.evl .t{color:var(--ink)}
.qf .qbtn:hover{background:color-mix(in srgb,var(--accent) 86%,#000)}