/* essaim-oise.fr — « Ruche de nuit » : sections sombres immersives + pages de lecture couleur cire */
@font-face{font-family:"Unbounded";src:url(/assets/fonts/unbounded.woff2) format("woff2");font-weight:400 800;font-display:swap}
@font-face{font-family:"Figtree";src:url(/assets/fonts/figtree.woff2) format("woff2");font-weight:400 800;font-display:swap}
@font-face{font-family:"Figtree";src:url(/assets/fonts/figtree-italic.woff2) format("woff2");font-weight:400 600;font-style:italic;font-display:swap}
:root{
  --nuit:#16100a;--nuit-2:#21180f;--nuit-3:#2e2215;--cire:#fff8ea;--cire-2:#fbefd6;--cire-3:#f3e2bd;
  --miel:#f5a623;--miel-2:#ffc24a;--ambre:#c46f06;--pollen:#ffd84a;--encre:#2a1d10;--brun:#5d4630;--gris:#7b6a58;
  --feuille:#2f7a45;--feuille-2:#e3f2e4;--alerte:#c9352b;--alerte-2:#fde7e4;--ciel:#2c6ea8;
  --r:18px;--r-s:10px;--ombre:0 18px 50px -20px rgba(40,22,4,.35);--ombre-s:0 6px 18px -8px rgba(40,22,4,.3);
  --max:1180px;--lecture:760px;
  --hex:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 0l28 16v32L28 64 0 48V16zM28 64l28 16v32M28 64L0 80v32' fill='none' stroke='%23f5a623' stroke-opacity='.10' stroke-width='1.2'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cire);color:var(--encre);font:400 1.0625rem/1.68 "Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--ambre);text-underline-offset:.18em;text-decoration-thickness:1.5px}
a:hover{color:#8f4f00}
h1,h2,h3,h4{font-family:"Unbounded",system-ui,sans-serif;line-height:1.14;letter-spacing:-.01em;color:inherit;margin:0 0 .5em}
h1{font-size:clamp(2rem,5.4vw,3.6rem);font-weight:750}
h2{font-size:clamp(1.45rem,3.2vw,2.15rem);font-weight:700;margin-top:1.8em}
h3{font-size:clamp(1.1rem,2vw,1.3rem);font-weight:650;margin-top:1.5em}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--pollen);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:0;background:var(--pollen);color:var(--nuit);padding:.6em 1em;z-index:1000}
.skip:focus{left:8px;top:8px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ------- En-tête ------- */
.top{position:sticky;top:0;z-index:50;background:rgba(22,16,10,.86);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);color:var(--cire);border-bottom:1px solid rgba(245,166,35,.18)}
.top .wrap{display:flex;align-items:center;gap:18px;height:64px}
.logo{display:flex;align-items:center;gap:10px;color:var(--cire);text-decoration:none;font:700 1.02rem/1 "Unbounded",sans-serif;white-space:nowrap}
.logo svg{width:34px;height:34px}
.logo b{color:var(--miel)}
.nav{display:flex;gap:4px;margin-left:auto;align-items:center}
.nav a{color:#f3e6cc;text-decoration:none;font-weight:600;font-size:.95rem;padding:.5em .8em;border-radius:99px}
.nav a:hover,.nav a[aria-current=page]{background:rgba(245,166,35,.16);color:#fff}
.nav .btn{margin-left:6px}
.burger{display:none;margin-left:auto;background:none;border:1px solid rgba(245,166,35,.45);color:var(--cire);border-radius:12px;width:46px;height:42px;cursor:pointer}
.burger span,.burger span::before,.burger span::after{display:block;width:20px;height:2px;background:currentColor;margin:auto;position:relative;transition:.25s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0}
.burger span::before{top:-6px}.burger span::after{top:6px}
@media (max-width:980px){
  .burger{display:block}
  .nav{position:fixed;inset:64px 0 auto 0;flex-direction:column;align-items:stretch;background:var(--nuit);padding:12px 16px 22px;gap:2px;transform:translateY(-120%);transition:transform .3s;max-height:calc(100vh - 64px);overflow:auto;border-bottom:1px solid rgba(245,166,35,.25)}
  .nav.open{transform:none}
  .nav a{padding:.85em 1em;font-size:1.05rem}
  .nav .btn{margin:8px 0 0;justify-content:center}
}

/* ------- Boutons ------- */
.btn{display:inline-flex;align-items:center;gap:.55em;font:700 1rem/1.1 "Figtree",sans-serif;padding:.95em 1.35em;border-radius:99px;border:0;cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .15s,background .15s;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn svg{width:1.15em;height:1.15em;flex:none}
.btn-miel{background:linear-gradient(180deg,var(--miel-2),var(--miel));color:var(--nuit)!important;box-shadow:0 10px 26px -10px rgba(245,166,35,.8)}
.btn-miel:hover{box-shadow:0 14px 32px -10px rgba(245,166,35,.95)}
.btn-ghost{background:rgba(255,248,234,.08);color:var(--cire)!important;border:1.5px solid rgba(255,248,234,.35)}
.btn-ghost:hover{background:rgba(255,248,234,.16)}
.btn-dark{background:var(--nuit);color:var(--cire)!important}
.btn-rouge{background:var(--alerte);color:#fff!important;box-shadow:0 10px 26px -12px rgba(201,53,43,.8)}
.btn-line{background:transparent;color:var(--encre)!important;border:1.5px solid var(--cire-3)}
.btn-line:hover{border-color:var(--miel);background:#fff}
.btn-sm{padding:.6em 1em;font-size:.92rem}

/* ------- Héros d'accueil ------- */
.hero{position:relative;min-height:min(100svh,920px);color:var(--cire);background:var(--nuit);overflow:hidden;display:flex;align-items:center;isolation:isolate}
.hero picture,.hero .hero-img{position:absolute;inset:0;z-index:-3}
.hero .hero-img img{width:100%;height:100%;object-fit:cover;object-position:30% 40%;filter:saturate(1.1) brightness(.78);transform:scaleX(-1)}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(120% 90% at 78% 30%,rgba(245,166,35,.0),rgba(22,16,10,.55) 55%,rgba(22,16,10,.94) 100%),linear-gradient(90deg,rgba(22,16,10,.92),rgba(22,16,10,.35) 60%,rgba(22,16,10,.1))}
.hero canvas{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none}
.hero .wrap{width:100%;padding-top:70px;padding-bottom:70px}
.hero-txt{max-width:640px}
.kicker{display:inline-flex;align-items:center;gap:.5em;font:700 .78rem/1 "Unbounded",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--miel);background:rgba(245,166,35,.12);border:1px solid rgba(245,166,35,.35);padding:.55em .9em;border-radius:99px;margin-bottom:18px}
.kicker i{width:8px;height:8px;border-radius:50%;background:var(--pollen);box-shadow:0 0 0 0 rgba(255,216,74,.8);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(255,216,74,0)}100%{box-shadow:0 0 0 0 rgba(255,216,74,0)}}
.hero h1{text-wrap:balance}
.hero h1 em{font-style:normal;color:var(--miel);background:linear-gradient(transparent 62%,rgba(245,166,35,.28) 0)}
.hero .lead{font-size:clamp(1.08rem,2vw,1.28rem);color:#f1e3c7;max-width:560px;margin-bottom:26px}
.finder{background:rgba(255,248,234,.97);border-radius:22px;padding:8px;display:flex;gap:8px;box-shadow:0 30px 60px -25px rgba(0,0,0,.8);max-width:600px;position:relative}
.finder input{flex:1;min-width:0;border:0;background:transparent;font:600 1.08rem "Figtree",sans-serif;color:var(--encre);padding:.8em 1em;border-radius:16px}
.finder input:focus{outline:none;background:#fff}
.finder .btn{flex:none}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.hero-meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:26px;color:#d9c7a6;font-size:.95rem}
.hero-meta span{display:flex;align-items:center;gap:.45em}
.hero-meta svg{width:18px;height:18px;color:var(--miel)}
.scroll-cue{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);color:#cdb995;font-size:.8rem;text-align:center;opacity:.8}
.scroll-cue::after{content:"";display:block;margin:6px auto 0;width:2px;height:28px;background:linear-gradient(var(--miel),transparent);animation:cue 1.8s infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media (max-width:640px){.finder{flex-direction:column}.finder .btn{justify-content:center}.hero .wrap{padding-top:40px}.scroll-cue{display:none}}

/* Liste de suggestions des communes */
.ac{position:absolute;left:8px;right:8px;top:calc(100% + 6px);background:#fff;border-radius:14px;box-shadow:var(--ombre);list-style:none;margin:0;padding:6px;z-index:60;max-height:300px;overflow:auto;color:var(--encre)}
.ac li{padding:.6em .8em;border-radius:10px;cursor:pointer;display:flex;justify-content:space-between;gap:10px}
.ac li small{color:var(--gris)}
.ac li[aria-selected=true],.ac li:hover{background:var(--cire-2)}
.field{position:relative}

/* ------- Sections ------- */
.sec{padding:clamp(56px,9vw,110px) 0}
.sec-dark{background:var(--nuit);color:var(--cire);position:relative;isolation:isolate}
.sec-dark::before{content:"";position:absolute;inset:0;background:var(--hex);background-size:56px 97px;z-index:-1;mask-image:radial-gradient(80% 70% at 50% 40%,#000,transparent)}
.sec-dark a:not(.btn){color:var(--miel-2)}
.sec-cire2{background:var(--cire-2)}
.sec-head{max-width:720px;margin-bottom:36px}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head h2{margin-top:0}
.sec-head p{font-size:1.12rem;color:var(--brun)}
.sec-dark .sec-head p{color:#dccaa8}
.eyebrow{font:700 .78rem/1 "Unbounded",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ambre);margin-bottom:14px;display:block}
.sec-dark .eyebrow{color:var(--miel)}
.drip{display:block;width:100%;height:46px;color:var(--nuit);margin-bottom:-1px}
.drip.flip{transform:scaleY(-1);margin:-1px 0 0}

/* ------- Triage « qu'avez-vous vu ? » ------- */
.triage{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}
.tcard{position:relative;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:var(--nuit-2);border:1px solid rgba(245,166,35,.18);color:var(--cire);text-decoration:none;min-height:330px;transition:transform .25s,border-color .25s,box-shadow .25s}
.tcard:hover{transform:translateY(-6px);border-color:var(--miel);box-shadow:0 24px 50px -24px rgba(245,166,35,.6);color:var(--cire)}
.tcard img{height:170px;width:100%;object-fit:cover;transition:transform .6s}
.tcard:hover img{transform:scale(1.06)}
.tcard .tb{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.tcard h3{font-size:1.04rem;margin:0 0 .45em}
.tcard p{font-size:.95rem;color:#d7c4a2;margin:0 0 12px}
.tcard .go{margin-top:auto;font-weight:700;color:var(--miel-2);display:flex;align-items:center;gap:.4em}
.tag{display:inline-block;font:700 .7rem/1 "Unbounded",sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:.45em .7em;border-radius:99px;margin-bottom:10px;align-self:flex-start}
.tag-ok{background:rgba(47,122,69,.25);color:#9ee0ad}
.tag-warn{background:rgba(201,53,43,.25);color:#ffb3aa}
.tag-info{background:rgba(245,166,35,.2);color:var(--miel-2)}
.tcard.alerte{border-color:rgba(201,53,43,.4)}
.tcard.alerte:hover{border-color:#ff6b5d;box-shadow:0 24px 50px -24px rgba(201,53,43,.7)}
.unsure{margin-top:22px;text-align:center;color:#dccaa8}

/* ------- Quiz d'identification ------- */
.quiz{background:var(--nuit-2);border:1px solid rgba(245,166,35,.25);border-radius:24px;padding:clamp(20px,4vw,36px);max-width:820px;margin:28px auto 0;color:var(--cire)}
.quiz .q{display:none}.quiz .q.on{display:block;animation:fade .35s}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.quiz h3{margin:0 0 16px;font-size:1.15rem}
.quiz .opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.quiz button.opt{text-align:left;background:rgba(255,248,234,.06);border:1.5px solid rgba(255,248,234,.18);color:var(--cire);border-radius:14px;padding:14px 16px;font:600 1rem "Figtree",sans-serif;cursor:pointer;transition:.2s}
.quiz button.opt:hover{border-color:var(--miel);background:rgba(245,166,35,.1)}
.quiz .bar{height:6px;background:rgba(255,248,234,.1);border-radius:9px;margin-bottom:20px;overflow:hidden}
.quiz .bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--miel),var(--pollen));transition:width .35s}
.quiz .res{display:none}.quiz .res.on{display:block;animation:fade .4s}
.quiz .res .btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.quiz .back{background:none;border:0;color:#cdb995;cursor:pointer;margin-top:14px;font:600 .95rem "Figtree",sans-serif}

/* ------- Chronomètre de l'essaim ------- */
.chrono{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,70px);align-items:start}
.chrono-vis{position:sticky;top:100px;border-radius:26px;overflow:hidden;aspect-ratio:4/5;box-shadow:var(--ombre)}
.chrono-vis img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s,transform 1.2s;transform:scale(1.05)}
.chrono-vis img.on{opacity:1;transform:none}
.chrono-vis .clock{position:absolute;left:16px;bottom:16px;right:16px;background:rgba(22,16,10,.78);backdrop-filter:blur(8px);color:var(--cire);border-radius:16px;padding:12px 16px;font:700 1rem "Unbounded",sans-serif;display:flex;align-items:center;gap:12px}
.chrono-vis .clock b{color:var(--miel)}
.steps-t{list-style:none;margin:0;padding:0;counter-reset:s}
.steps-t li{position:relative;padding:22px 0 22px 64px;border-left:2px dashed var(--cire-3);margin-left:22px;min-height:40vh;display:flex;flex-direction:column;justify-content:center;opacity:.45;transition:opacity .4s}
.steps-t li.on{opacity:1}
.steps-t li::before{counter-increment:s;content:counter(s);position:absolute;left:-23px;top:calc(50% - 22px);width:44px;height:44px;border-radius:50%;background:var(--cire);border:2px solid var(--miel);display:grid;place-items:center;font:700 1rem "Unbounded",sans-serif;color:var(--ambre)}
.steps-t li.on::before{background:var(--miel);color:var(--nuit)}
.steps-t .t{font:700 .8rem "Unbounded",sans-serif;color:var(--ambre);letter-spacing:.06em;text-transform:uppercase}
.steps-t h3{margin:.3em 0 .4em}
@media (max-width:820px){.chrono{grid-template-columns:1fr}.chrono-vis{position:relative;top:0;aspect-ratio:16/10}.steps-t li{min-height:0}}

/* ------- Indice d'essaimage ------- */
.indice{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:28px;align-items:center;background:linear-gradient(140deg,var(--nuit-2),var(--nuit-3));border:1px solid rgba(245,166,35,.25);border-radius:28px;padding:clamp(20px,4vw,40px);color:var(--cire)}
.gauge{position:relative;width:100%;max-width:340px;margin:auto}
.gauge svg{width:100%}
.gauge .val{position:absolute;left:0;right:0;bottom:12%;text-align:center}
.gauge .val b{display:block;font:800 clamp(2.4rem,7vw,3.4rem)/1 "Unbounded",sans-serif;color:var(--miel)}
.gauge .val span{font-weight:700;color:#e9d7b5}
.indice .days{display:grid;grid-template-columns:repeat(auto-fit,minmax(86px,1fr));gap:8px;margin:16px 0}
.indice .day{background:rgba(255,248,234,.06);border-radius:14px;padding:10px;text-align:center;font-size:.86rem}
.indice .day b{display:block;font:700 1.15rem "Unbounded",sans-serif}
.indice .day .lvl{display:block;height:6px;border-radius:9px;margin-top:6px;background:#3a2c1c}
.indice select{font:600 1rem "Figtree",sans-serif;padding:.55em .8em;border-radius:12px;border:1px solid rgba(245,166,35,.4);background:var(--nuit);color:var(--cire)}
.indice small{color:#cbb894}
@media (max-width:820px){.indice{grid-template-columns:1fr}}

/* ------- Cartes et grilles ------- */
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.card{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--ombre-s);text-decoration:none;color:var(--encre);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s;border:1px solid #f1e3c4}
.card:hover{transform:translateY(-4px);box-shadow:var(--ombre);color:var(--encre)}
.card img{aspect-ratio:16/10;object-fit:cover;width:100%}
.card .cb{padding:16px 18px 20px}
.card h3{font-size:1.05rem;margin:0 0 .4em}
.card p{margin:0;color:var(--brun);font-size:.96rem}
.card .more{display:inline-block;margin-top:10px;font-weight:700;color:var(--ambre)}
.sec-dark .card{background:var(--nuit-2);border-color:rgba(245,166,35,.15);color:var(--cire)}
.sec-dark .card p{color:#d3c09d}

/* ------- Pages de lecture ------- */
.phero{position:relative;color:var(--cire);background:var(--nuit);overflow:hidden;isolation:isolate}
.phero .bg{position:absolute;inset:0;z-index:-2}
.phero .bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.5) saturate(1.05)}
.phero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(22,16,10,.92),rgba(22,16,10,.55) 70%,rgba(22,16,10,.35)),linear-gradient(0deg,rgba(22,16,10,.6),transparent 40%)}
.phero .wrap{padding-top:clamp(40px,7vw,90px);padding-bottom:clamp(40px,7vw,80px)}
.phero h1{font-size:clamp(1.85rem,4.6vw,3.1rem);max-width:880px;text-wrap:balance}
.phero .lead{font-size:clamp(1.05rem,1.8vw,1.2rem);color:#eedfc2;max-width:720px;margin:0}
.crumbs{font-size:.88rem;color:#cbb894;margin-bottom:18px;display:flex;flex-wrap:wrap;gap:.3em}
.crumbs a{color:#ecdcbc;text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs span[aria-hidden]{opacity:.5}
.meta-line{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:18px;color:#d2bf9c;font-size:.9rem}
.layout{display:grid;grid-template-columns:minmax(0,var(--lecture)) 290px;gap:56px;justify-content:center;padding:44px 20px 70px;max-width:var(--max);margin:0 auto}
.layout.full{grid-template-columns:minmax(0,1fr)}
.prose{min-width:0}
.prose>h2:first-child{margin-top:0}
.prose h2{scroll-margin-top:90px;position:relative}
.prose h2::before{content:"";display:block;width:42px;height:6px;border-radius:9px;background:var(--miel);margin-bottom:14px}
.prose h3{scroll-margin-top:90px}
.prose ul,.prose ol{padding-left:1.3em;margin:0 0 1.2em}
.prose li{margin-bottom:.45em}
.prose li::marker{color:var(--ambre)}
.prose strong{color:#1c1309}
.prose figure{margin:28px 0;border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--ombre-s)}
.prose figure img{width:100%}
.prose figcaption{padding:10px 16px;font-size:.88rem;color:var(--gris)}
.prose blockquote{margin:24px 0;padding:18px 22px;border-left:5px solid var(--miel);background:#fff;border-radius:0 var(--r-s) var(--r-s) 0;font-size:1.05rem}
.answer{background:#fff;border:2px solid var(--miel);border-radius:var(--r);padding:20px 22px;margin:0 0 30px;box-shadow:var(--ombre-s);position:relative}
.answer::before{content:"La réponse courte";position:absolute;top:-12px;left:18px;background:var(--miel);color:var(--nuit);font:700 .72rem/1 "Unbounded",sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:.45em .7em;border-radius:99px}
.answer p:last-child{margin:0}
.callout{border-radius:var(--r);padding:18px 20px 18px 58px;margin:24px 0;position:relative;background:#fff;border:1px solid #f0dfbb}
.callout::before{position:absolute;left:18px;top:16px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font:800 .95rem "Unbounded",sans-serif;content:"i";background:var(--cire-3);color:var(--ambre)}
.callout p:last-child,.callout ul:last-child{margin-bottom:0}
.callout.warn{background:var(--alerte-2);border-color:#f5c3bd}.callout.warn::before{content:"!";background:var(--alerte);color:#fff}
.callout.ok{background:var(--feuille-2);border-color:#bfe0c4}.callout.ok::before{content:"✓";background:var(--feuille);color:#fff}
.callout.oise{background:linear-gradient(135deg,#fff,var(--cire-2));border-color:var(--miel)}.callout.oise::before{content:"60";font-size:.7rem;background:var(--nuit);color:var(--miel)}
.callout b.t{display:block;font-family:"Unbounded",sans-serif;font-size:.98rem;margin-bottom:.35em}
.tbl-wrap{overflow-x:auto;margin:24px 0;border-radius:var(--r);box-shadow:var(--ombre-s);background:#fff}
table.tbl{border-collapse:collapse;width:100%;min-width:520px;font-size:.96rem}
.tbl th,.tbl td{padding:12px 14px;text-align:left;border-bottom:1px solid #f1e5cb;vertical-align:top}
.tbl thead th{background:var(--nuit);color:var(--cire);font:600 .85rem "Unbounded",sans-serif;letter-spacing:.02em}
.tbl tbody tr:nth-child(even){background:#fffbf2}
.steps{list-style:none;padding:0!important;counter-reset:st;margin:24px 0}
.steps>li{counter-increment:st;position:relative;padding:4px 0 18px 60px;margin:0}
.steps>li::before{content:counter(st);position:absolute;left:0;top:0;width:42px;height:42px;border-radius:13px;background:var(--nuit);color:var(--miel);display:grid;place-items:center;font:700 1rem "Unbounded",sans-serif;clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%)}
.steps>li::after{content:"";position:absolute;left:20px;top:46px;bottom:4px;width:2px;background:var(--cire-3)}
.steps>li:last-child::after{display:none}
.steps>li>b:first-child{display:block;font-family:"Unbounded",sans-serif;font-size:1rem;margin-bottom:.2em}
.dodont{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}
.dodont>div{border-radius:var(--r);padding:18px 20px;background:#fff;border-top:6px solid var(--feuille);box-shadow:var(--ombre-s)}
.dodont>div.dont{border-top-color:var(--alerte)}
.dodont h3{margin:0 0 .6em;font-size:1rem}
.dodont ul{margin:0;padding-left:1.1em}
@media (max-width:640px){.dodont{grid-template-columns:1fr}}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:26px 0}
.kpi{background:var(--nuit);color:var(--cire);border-radius:var(--r);padding:16px 18px}
.kpi b{display:block;font:800 1.7rem/1.1 "Unbounded",sans-serif;color:var(--miel)}
.kpi span{font-size:.9rem;color:#dccaa8}
.kpi small{display:block;margin-top:6px;font-size:.75rem;color:#a99678}
.idgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:24px 0}
.idc{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--ombre-s);border:2px solid transparent}
.idc img{aspect-ratio:4/3;object-fit:cover;width:100%}
.idc .ib{padding:12px 14px 16px}
.idc h3{margin:0 0 .35em;font-size:.98rem}
.idc ul{margin:0;padding-left:1.05em;font-size:.92rem}
.idc.bee{border-color:var(--feuille)}.idc.wasp{border-color:var(--alerte)}
.idc .verdict{display:block;margin-top:8px;font-weight:700;font-size:.9rem}
.idc.bee .verdict{color:var(--feuille)}.idc.wasp .verdict{color:var(--alerte)}

/* FAQ */
.faq{margin:20px 0}
.faq details{background:#fff;border-radius:14px;margin-bottom:10px;border:1px solid #f0e0bf;overflow:hidden}
.faq summary{cursor:pointer;list-style:none;padding:16px 52px 16px 18px;font:600 1.02rem "Figtree",sans-serif;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:18px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;background:var(--cire-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5' fill='none' stroke='%23c46f06' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .25s}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq details>div{padding:0 18px 16px;color:var(--brun)}
.faq details>div p:last-child{margin:0}

/* Sources */
.sources{margin-top:46px;padding-top:22px;border-top:1px solid var(--cire-3);font-size:.9rem;color:var(--gris)}
.sources h2{font-size:1.05rem;margin-top:0}.sources h2::before{display:none}
.sources ol{padding-left:1.4em}
.sources a{word-break:break-word}
sup.ref a{text-decoration:none;font-size:.75em;font-weight:700;padding:0 .15em}

/* Barre latérale */
.side{position:relative}
.side-in{position:sticky;top:92px;display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 108px);overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}
.side-in>*{flex-shrink:0}
.toc{background:#fff;border-radius:var(--r);padding:16px 18px;border:1px solid #f0e0bf;font-size:.92rem}
.toc b{display:block;font:700 .78rem "Unbounded",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--ambre);margin-bottom:8px}
.toc ol{margin:0;padding-left:1.1em}
.toc li{margin:.32em 0}
.toc a{color:var(--brun);text-decoration:none}
.toc a:hover,.toc a.on{color:var(--ambre);text-decoration:underline}
.sos{background:var(--nuit);color:var(--cire);border-radius:var(--r);padding:18px;position:relative;overflow:hidden;isolation:isolate}
.sos::before{content:"";position:absolute;inset:0;background:var(--hex);background-size:40px 69px;z-index:-1;opacity:.7}
.sos h3{margin:0 0 .4em;font-size:1rem;color:var(--miel)}
.sos p{font-size:.92rem;color:#e0cfae;margin:0 0 12px}
.sos .btn{width:100%;justify-content:center;margin-top:6px}
.sos.rouge h3{color:#ff9d92}
@media (max-width:1000px){.layout{grid-template-columns:minmax(0,1fr);gap:20px}.side-in{position:static;max-height:none;overflow:visible}.toc{display:none}}

/* Encadré partenaire guêpes/frelons */
.af{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;background:linear-gradient(120deg,#2a0f0b,#43170f);color:#fff;border-radius:24px;padding:24px clamp(18px,3vw,32px);margin:34px 0;border:1px solid rgba(255,120,100,.3);box-shadow:0 24px 50px -28px rgba(201,53,43,.7)}
.af .ic{width:64px;height:64px;border-radius:18px;background:var(--alerte);display:grid;place-items:center}
.af .ic svg{width:38px;height:38px}
.af h3{margin:0 0 .3em;font-size:1.12rem;color:#fff}
.af p{margin:0;color:#ffd9d2;font-size:.97rem}
.af p a{color:#fff}
.af .acts{display:flex;flex-direction:column;gap:8px}
.af .acts .btn{justify-content:center}
@media (max-width:760px){.af{grid-template-columns:1fr}.af .acts{flex-direction:column}}
/* boutons d'appel ALLO FRELONS 60 / Miss Frelon à égalité : nom, puis numéro dessous */
.btn-tel{justify-content:center;padding-top:.7em;padding-bottom:.7em;min-width:13.5em}
.btn-tel>span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.btn-tel small{font-size:1.06em;font-weight:800;letter-spacing:.02em}
.sos .tels{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:4px}
.sos .tels .btn-tel{min-width:0;margin:0;padding:.55em .35em;font-size:.76rem}
.sos .tels .btn-tel svg{display:none}
.sos .tels .btn-tel>span{align-items:center}
.sos .btn{margin-top:5px}

/* ------- Carte ------- */
.mapapp{display:grid;grid-template-columns:400px 1fr;height:calc(100svh - 64px);min-height:560px;background:var(--nuit)}
.mapside{display:flex;flex-direction:column;background:var(--cire);min-height:0;border-right:1px solid var(--cire-3)}
.mapside .mh{padding:18px 18px 12px;background:var(--nuit);color:var(--cire)}
.mapside .mh h1{font-size:1.3rem;margin:0 0 .3em}
.mapside .mh p{font-size:.9rem;color:#d9c7a5;margin:0 0 12px}
.mapside .mh .finder{max-width:none;border-radius:16px;padding:5px}
.mapside .mh .finder input{padding:.6em .8em;font-size:1rem}
.mapside .mh .finder .btn{padding:.6em .9em}
.filters{display:flex;flex-wrap:wrap;gap:6px;padding:10px 18px;border-bottom:1px solid var(--cire-3);background:var(--cire-2)}
.chip{display:inline-flex;align-items:center;gap:.4em;border:1.5px solid var(--cire-3);background:#fff;border-radius:99px;padding:.38em .8em;font:600 .86rem "Figtree",sans-serif;cursor:pointer;color:var(--encre)}
.chip i{width:10px;height:10px;border-radius:50%;flex:none}
.chip[aria-pressed=false]{opacity:.5;background:transparent}
.plist{overflow:auto;flex:1;padding:10px 12px 20px;margin:0;list-style:none}
.pitem{background:#fff;border-radius:16px;padding:14px 14px 12px;margin-bottom:10px;border:1.5px solid #f2e4c6;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.pitem:hover,.pitem.on{border-color:var(--miel);box-shadow:var(--ombre-s)}
.pitem .ph{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.pitem h2{font:700 .98rem/1.25 "Unbounded",sans-serif;margin:0}
.pitem .dist{font-weight:800;color:var(--ambre);white-space:nowrap;font-size:.92rem}
.pitem .loc{font-size:.88rem;color:var(--gris);margin:2px 0 6px}
.pitem .inf{font-size:.9rem;color:var(--brun);margin:0 0 10px}
.pitem .acts{display:flex;flex-wrap:wrap;gap:6px}
.pitem .acts a{font-size:.86rem;padding:.5em .85em}
.pitem .badge{display:inline-block;font:700 .66rem/1 "Unbounded",sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:.4em .6em;border-radius:99px;margin-bottom:6px}
.b-recup{background:#e3f2e4;color:#1f5e33}.b-apiculteur{background:#fff1d4;color:#8a5200}.b-asso{background:#e6eefb;color:#234f86}.b-guepes{background:#fde7e4;color:#9b241c}.b-inscrit{background:#efe6ff;color:#5b2ea6}.b-partenaire{background:#16100a;color:#ffc24a}
.pitem .src{display:block;font-size:.74rem;color:#a7957d;margin-top:8px}
#map{width:100%;height:100%;background:#e9e2d0}
.mapnote{padding:10px 18px;font-size:.8rem;color:var(--gris);border-top:1px solid var(--cire-3);background:var(--cire-2)}
.mapnote a{color:var(--ambre)}
.hexpin{width:30px;height:34px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4))}
.leaflet-popup-content{font:400 .92rem/1.45 "Figtree",sans-serif;margin:12px 14px}
.leaflet-popup-content b{font-family:"Unbounded",sans-serif;font-size:.9rem}
.leaflet-popup-content a.btn{color:var(--nuit)!important;margin-top:6px}
.mapswitch{display:none}
@media (max-width:860px){
  .mapapp{grid-template-columns:1fr;height:auto;min-height:0}
  .mapside{border-right:0}
  .mapview{height:62svh;position:relative}
  .plist{max-height:none;overflow:visible}
  .mapswitch{display:flex;gap:8px;position:sticky;top:64px;z-index:30;background:var(--nuit);padding:8px 12px}
  .mapswitch a{flex:1;justify-content:center}
}

/* ------- Formulaires ------- */
.form{background:#fff;border-radius:24px;box-shadow:var(--ombre);padding:clamp(20px,4vw,36px);border:1px solid #f0e0bf}
.form .stepper{display:flex;gap:6px;margin-bottom:22px}
.form .stepper i{flex:1;height:6px;border-radius:9px;background:var(--cire-3)}
.form .stepper i.on{background:var(--miel)}
.form fieldset{border:0;padding:0;margin:0 0 6px;display:none}
.form fieldset.on{display:block;animation:fade .3s}
.form legend{font:700 1.2rem "Unbounded",sans-serif;margin-bottom:14px;padding:0}
.form label{display:block;font-weight:700;margin:14px 0 6px}
.form label small{font-weight:500;color:var(--gris)}
.form input[type=text],.form input[type=tel],.form input[type=email],.form input[type=number],.form select,.form textarea{width:100%;font:500 1.02rem "Figtree",sans-serif;padding:.8em .95em;border-radius:12px;border:1.5px solid var(--cire-3);background:var(--cire);color:var(--encre)}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--miel);background:#fff;box-shadow:0 0 0 4px rgba(245,166,35,.18)}
.form textarea{min-height:96px;resize:vertical}
.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.choice{position:relative}
.choice input{position:absolute;opacity:0;inset:0}
.choice span{display:flex;flex-direction:column;gap:4px;height:100%;padding:14px;border-radius:14px;border:1.5px solid var(--cire-3);background:var(--cire);cursor:pointer;font-weight:700;transition:.15s}
.choice span small{font-weight:500;color:var(--gris)}
.choice input:checked+span{border-color:var(--miel);background:#fff6e2;box-shadow:0 0 0 3px rgba(245,166,35,.25)}
.choice input:focus-visible+span{outline:3px solid var(--pollen)}
.form .nav-f{display:flex;justify-content:space-between;gap:10px;margin-top:22px}
.form .check{display:flex;gap:10px;align-items:flex-start;font-weight:500;margin-top:14px}
.form .check input{margin-top:.35em;width:18px;height:18px;flex:none;accent-color:var(--ambre)}
.form .err{color:var(--alerte);font-weight:700;margin-top:10px;min-height:1.2em}
.hp{position:absolute;left:-9999px}
.done{display:none;text-align:center}.done.on{display:block;animation:fade .4s}
.done .big{font-size:3rem;line-height:1}
.near{list-style:none;padding:0;margin:18px 0;text-align:left}
.near li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:var(--cire);margin-bottom:8px;flex-wrap:wrap}
.near li b{font-family:"Unbounded",sans-serif;font-size:.92rem}

/* Fil des essaims signalés */
.feed{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.feed li{display:flex;align-items:center;gap:14px;background:rgba(255,248,234,.06);border:1px solid rgba(245,166,35,.15);border-radius:16px;padding:12px 16px}
.feed .dot{width:12px;height:12px;border-radius:50%;flex:none;background:var(--miel);box-shadow:0 0 0 4px rgba(245,166,35,.18)}
.feed .dot.pris{background:#5cc97a;box-shadow:0 0 0 4px rgba(92,201,122,.2)}
.feed .dot.parti{background:#8d7c66;box-shadow:none}
.feed b{font-family:"Unbounded",sans-serif;font-size:.92rem}
.feed small{display:block;color:#bfae8d}
.feed .st{margin-left:auto;font-size:.82rem;font-weight:700;white-space:nowrap}
.feed.light li{background:#fff;border-color:#f0e0bf}.feed.light small{color:var(--gris)}

/* Pied de page */
.foot{background:var(--nuit);color:#d9c7a5;padding:60px 0 30px;position:relative;isolation:isolate;font-size:.95rem}
.foot::before{content:"";position:absolute;inset:0;background:var(--hex);background-size:56px 97px;z-index:-1;opacity:.6}
.foot .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:30px}
.foot h2{font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;color:var(--miel);margin:0 0 14px}
.foot ul{list-style:none;padding:0;margin:0}
.foot li{margin:.45em 0}
.foot a{color:#efe1c4;text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline}
.foot .bottom{margin-top:40px;padding-top:20px;border-top:1px solid rgba(245,166,35,.18);display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;font-size:.85rem;color:#a99678}
@media (max-width:860px){.foot .cols{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot .cols{grid-template-columns:1fr}}

/* Barre d'action mobile */
.dock{display:none}
@media (max-width:760px){
  .dock{display:flex;position:fixed;left:10px;right:10px;bottom:10px;z-index:45;gap:8px;background:rgba(22,16,10,.92);backdrop-filter:blur(10px);padding:8px;border-radius:20px;box-shadow:0 14px 30px -10px rgba(0,0,0,.6)}
  .dock a{flex:1;justify-content:center;padding:.85em .6em;font-size:.92rem}
  body{padding-bottom:82px}
}

/* Apparition au défilement */
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.rv{opacity:1;transform:none}}

/* Divers */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,60px);align-items:center}
@media (max-width:820px){.two{grid-template-columns:1fr}}
.rounded{border-radius:26px;overflow:hidden;box-shadow:var(--ombre)}
.rounded img{width:100%}
.pill-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:16px 0}
.pill-list a{display:inline-block;padding:.5em .95em;border-radius:99px;background:#fff;border:1px solid #f0e0bf;color:var(--encre);text-decoration:none;font-weight:600;font-size:.93rem}
.pill-list a:hover{border-color:var(--miel)}
.sec-dark .pill-list a{background:rgba(255,248,234,.06);border-color:rgba(245,166,35,.25);color:var(--cire)}
.cal{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;margin:20px 0}
.cal div{text-align:center;font-size:.75rem;font-weight:700}
.cal div i{display:block;height:54px;border-radius:8px;margin-bottom:4px;background:var(--cire-3)}
.cal div.m1 i{background:#f8d58f}.cal div.m2 i{background:var(--miel)}.cal div.m3 i{background:var(--ambre)}
.cal div.now{color:var(--ambre)}.cal div.now i{outline:3px solid var(--nuit);outline-offset:2px}
@media (max-width:520px){.cal{grid-template-columns:repeat(6,1fr)}}
.code{background:var(--nuit);color:#f4e4c2;border-radius:14px;padding:16px;font:500 .85rem/1.5 ui-monospace,Consolas,monospace;overflow-x:auto;white-space:pre-wrap;word-break:break-all}
.notice{font-size:.85rem;color:var(--gris)}

.tcard .go svg,.card .more svg{width:18px;height:18px;flex:none}
.chrono-vis .clock svg{width:24px;height:24px;flex:none;color:var(--miel)}
.hero-meta svg,.tcard svg{max-width:22px}
@media (max-width:640px){#m-form{flex-direction:row;flex-wrap:nowrap}#m-form .btn{padding:.6em .7em;font-size:.88rem}#m-form #m-geo{font-size:0;width:44px;justify-content:center}#m-form #m-geo::before{content:"⌖";font-size:1.3rem}}
.side .feed li{flex-wrap:wrap;gap:6px 10px;padding:10px 12px}.side .feed .st{margin-left:22px;white-space:normal;font-size:.78rem}
@media (max-width:600px){.tcard{flex-direction:row;min-height:0}.tcard picture{flex:0 0 108px}.tcard img{height:100%;min-height:150px;width:108px}.tcard .tb{padding:12px 14px}.tcard h3{font-size:.95rem}.tcard p{font-size:.88rem;margin-bottom:8px}}

/* Apiculteurs partenaires */
.partners{list-style:none;padding:0;margin:18px 0 26px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr))}
.partner{background:#fff;border:1px solid #f1e3c4;border-radius:var(--r);box-shadow:var(--ombre-s);padding:18px 18px 16px;display:flex;flex-direction:column;gap:6px}
.partner .badge{display:inline-block;font:700 .66rem/1 "Unbounded",sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:.45em .7em;border-radius:99px}
.partner h3{margin:0;font-size:1.1rem}.partner .loc{margin:0;color:#7a6345;font-size:.92rem}.partner p{margin:0}
.partner .acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.partners-empty{background:#fff8ea;border:1px dashed #e0c48c;border-radius:var(--r);padding:20px;margin:18px 0 26px}
/* Mise en avant de ceux qui récupèrent les essaims (carte + pages communes) */
.pitem.fort{border-color:#bfe0c4;border-left:5px solid #2f7a45}
.pitem.faible{padding:9px 12px 8px;background:#fffdf8;border-color:#f5ead3}
.pitem.faible h2{font-size:.88rem;font-weight:600}
.pitem.faible .badge{opacity:.75;margin-bottom:3px}
.pitem.faible .loc{margin:1px 0 4px;font-size:.82rem}
.pitem.faible .inf{font-size:.8rem;color:var(--gris);margin-bottom:6px}
.pitem.faible .acts a{font-size:.8rem;padding:.4em .7em}
.pitem.faible .src{display:none}
.hexpin.petit{width:21px;height:24px;opacity:.72;filter:drop-shadow(0 2px 2px rgba(0,0,0,.25))}
.chip.only{border-color:#2f7a45;color:#1f5e33}
.chip.only[aria-pressed=true]{opacity:1;background:#e3f2e4}
.chip.only[aria-pressed=false]{opacity:1;background:#fff}
.tbl-contacts tr.recup td:first-child{border-left:5px solid #2f7a45}
.tbl-contacts tr.faible td{color:#6f5f4c;font-size:.92em}
.tbl-contacts tr.faible strong{font-weight:600}
.tbadge{display:inline-block;font:700 .62rem/1 "Unbounded",sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:.4em .6em;border-radius:99px;background:#e3f2e4;color:#1f5e33;margin-bottom:4px}
