/* Feuille unique : plateforme et pages producteur (brief et jetons : design/ du socle).
   Polices : Sporting Grotesque — Lucas Le Bihan, Velvetyne (OFL) ; Atkinson Hyperlegible Next —
   Braille Institute (OFL). Licences dans assets/fonts/. */

@font-face{font-family:'Sporting Grotesque';src:url(/assets/fonts/SportingGrotesque-Bold.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Sporting Grotesque';src:url(/assets/fonts/SportingGrotesque-Regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Atkinson Hyperlegible Next';src:url(/assets/fonts/AtkinsonHyperlegibleNext.woff2) format('woff2');font-weight:200 800;font-display:swap}
/* Repli aux métriques ajustées : pas de saut de mise en page au chargement. */
@font-face{font-family:'Kw Repli';src:local('Arial'),local('Helvetica');size-adjust:104%;ascent-override:92%;descent-override:24%}

:root{
  --nuit:#0F1B24; --craie:#F1F3EE; --encre:#16232C; --plan:#5E6E78; --plan-nuit:#1C2A34; --soleil:#F5B700;
  --papier:#FFFFFF; --sur-nuit:#E7ECEF; --sur-nuit-2:#A9B6BE; --ligne:#D5DBD6; --ok:#1E7A4F; --attention:#8A5A00; --non:#A33A2B;
  --f-display:'Sporting Grotesque','Kw Repli',system-ui,sans-serif;
  --f-texte:'Atkinson Hyperlegible Next','Kw Repli',system-ui,sans-serif;
  --t-hero:clamp(2.6rem,7vw,6rem); --lh-hero:.95; --ls-hero:-.03em;
  --t-h2:clamp(1.7rem,3.6vw,2.8rem); --lh-h2:1.05; --ls-h2:-.02em;
  --t-h3:clamp(1.15rem,1.8vw,1.4rem); --lh-h3:1.2; --ls-h3:-.01em;
  --t-texte:clamp(1rem,1.1vw,1.125rem); --lh-texte:1.55;
  --t-prix:clamp(2rem,4vw,3.2rem); --lh-prix:1; --ls-prix:-.02em;
  --t-mention:.82rem; --lh-mention:1.45;
  --r-champ:10px; --r-bouton:999px; --r-ligne:0;
  --esp-1:.5rem; --esp-2:1rem; --esp-3:1.5rem; --esp-4:2.5rem; --esp-5:4rem; --esp-6:7rem;
  --col-lecture:720px; --gouttiere:16px; --bord:max(var(--gouttiere),calc((100vw - 1240px) / 2));
}
@view-transition{navigation:auto}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--f-texte);font-size:var(--t-texte);line-height:var(--lh-texte);color:var(--encre);background:var(--craie);-webkit-font-smoothing:antialiased}
body.mb{--f-display:var(--f-texte)}   /* marque blanche : une seule famille, aucune marque de plateforme */
/* Grain : feTurbulence, 3 %, sans effet sur les clics. */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:1000;opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}
a{color:inherit}
h1,h2,h3{font-family:var(--f-display);font-weight:700;text-wrap:balance}
h2{font-size:var(--t-h2);line-height:var(--lh-h2);letter-spacing:var(--ls-h2)}
h3{font-size:var(--t-h3);line-height:var(--lh-h3);letter-spacing:var(--ls-h3)}
p{text-wrap:pretty}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.sauter{position:absolute;left:var(--gouttiere);top:-4rem;z-index:2000;background:var(--encre);color:var(--craie);padding:var(--esp-1) var(--esp-2);border-radius:var(--r-champ)}
.sauter:focus{top:var(--esp-1)}
[hidden]{display:none!important}

.btn-plein{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 var(--esp-3);border-radius:var(--r-bouton);
  background:var(--accent);color:var(--sur-accent);font-weight:700;text-decoration:none;border:0;font:inherit;font-weight:700;cursor:pointer}
.btn-plein:hover{background:var(--encre);color:var(--craie)}

/* ── En-tête plateforme, posé sur la carte ── */
.entete{position:absolute;top:0;left:0;right:0;z-index:500;display:flex;align-items:center;gap:var(--esp-3);padding:var(--esp-2) var(--bord);color:var(--sur-nuit);background:var(--nuit);border-bottom:1px solid var(--plan-nuit)}
.entete-clair{position:static;color:var(--encre);background:var(--craie);border-bottom:2px solid var(--encre)}
.marque{font-family:var(--f-display);font-weight:700;font-size:1.6rem;letter-spacing:-.03em;text-decoration:none}
.entete nav{margin-left:auto;display:flex;align-items:center;gap:var(--esp-3)}
.entete nav a:not(.btn-plein){text-decoration:none;font-weight:600;color:var(--sur-nuit-2)}
.entete nav a:not(.btn-plein):hover{color:var(--sur-nuit)}
@media(max-width:640px){.entete nav a:not(.btn-plein){display:none}.entete .btn-plein{min-height:42px;padding:0 var(--esp-2)}}

/* ── Hero : la carte bord à bord, le titre et la recherche posés dessus ── */
.hero{position:relative;min-height:max(72vh,560px);background:var(--nuit);color:var(--sur-nuit);overflow:hidden;display:flex;align-items:flex-end}
.carte{position:absolute;inset:0;background:var(--nuit)}
.hero-txt{position:relative;z-index:400;width:min(100%,46rem);padding:var(--esp-6) var(--bord) var(--esp-5);pointer-events:none}
.hero-txt>*{pointer-events:auto}
.hero h1{font-size:var(--t-hero);line-height:var(--lh-hero);letter-spacing:var(--ls-hero);max-width:11ch;color:var(--sur-nuit)}
.chapo{margin-top:var(--esp-3);max-width:34rem;color:var(--sur-nuit-2)}
.hero h1{line-height:1;text-shadow:none}
.hero .chapo{background:var(--nuit);padding:var(--esp-2) var(--esp-2) var(--esp-2) 0}
.cherche{margin-top:var(--esp-4);max-width:34rem}
.cherche label{display:block;font-weight:700;margin-bottom:var(--esp-1)}
.cherche-l{display:flex;gap:var(--esp-1);flex-wrap:wrap}
.cherche input{flex:1 1 15rem;min-height:52px;border-radius:var(--r-champ);border:2px solid var(--plan);background:var(--craie);color:var(--encre);padding:0 var(--esp-2);font:inherit}
.cherche input:focus{outline:none;border-color:var(--accent)}
.cherche button{min-height:52px;padding:0 var(--esp-3);border-radius:var(--r-bouton);border:0;background:var(--accent);color:var(--sur-accent);font:inherit;font-weight:700;cursor:pointer}
.cherche button:hover{background:var(--craie);color:var(--encre)}
.cherche-clair button:hover{background:var(--encre);color:var(--craie)}
@media(max-width:640px){.hero{min-height:auto;display:flex;flex-direction:column;padding-top:68px}.hero .carte{position:relative;order:2;height:46vh}.hero-txt{order:1;padding:var(--esp-4) var(--gouttiere) var(--esp-3);width:100%}
  .entete{position:absolute}}

/* Tuiles IGN passées « de nuit » : niveaux de gris inversés, teintés vers --nuit. */
.plateforme .leaflet-tile-pane{filter:grayscale(1) invert(1) brightness(.62) contrast(1.15) sepia(.35) hue-rotate(165deg) saturate(.8)}
.producteur .leaflet-tile-pane{filter:grayscale(1) contrast(.9) brightness(1.05)}
.leaflet-container{font-family:var(--f-texte);background:var(--nuit)}
.producteur .leaflet-container{background:var(--craie)}
.leaflet-control-attribution{font-size:.7rem}
.kw-pt{background:var(--soleil);border:2px solid var(--nuit);border-radius:50%}
.kw-ici{background:var(--craie);border:3px solid var(--nuit);border-radius:50%}

/* ── Sections de lecture (craie) ── */
.lecture{padding:var(--esp-5) var(--bord)}
.lecture>h2,.lecture>.intro,.lecture>.vide{max-width:var(--col-lecture)}
.intro{margin-top:var(--esp-2);color:var(--plan)}
.vide{margin-top:var(--esp-3)}
.vide p{margin-bottom:var(--esp-2)}
/* Les producteurs : des LIGNES pleine largeur, pas une grille de cartes. */
.prods{list-style:none;margin-top:var(--esp-4);border-top:2px solid var(--encre)}
.prod a{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1.3fr) auto;align-items:baseline;gap:var(--esp-1) var(--esp-3);
  padding:var(--esp-3) 0;border-bottom:1px solid var(--ligne);text-decoration:none;border-radius:var(--r-ligne)}
.prod a:hover .prod-nom{text-decoration:underline;text-underline-offset:4px}
.prod-nom{font-family:var(--f-display);font-weight:700;font-size:var(--t-h3);line-height:var(--lh-h3)}
.prod-lieu,.prod-dist{color:var(--plan)}
.prod-dist{grid-column:2}
.prod-prix{grid-column:3;grid-row:1/span 2;text-align:right;font-variant-numeric:tabular-nums;font-weight:700;font-size:1.35rem;white-space:nowrap}
.prod-prix small{font-size:var(--t-mention);font-weight:400;color:var(--plan)}
.prod.dedans .prod-dist{color:var(--ok);font-weight:700}
.prod.dedans a{border-left:4px solid var(--soleil);padding-left:var(--esp-2)}
@media(max-width:640px){.prod a{grid-template-columns:1fr auto}.prod-lieu,.prod-dist{grid-column:1}.prod-prix{grid-column:2;grid-row:1/span 3}}

.etapes ol{list-style:none;counter-reset:e;margin-top:var(--esp-4);max-width:var(--col-lecture);display:grid;gap:var(--esp-3)}
.etapes li{counter-increment:e;position:relative;padding-left:4rem}
.etapes li::before{content:counter(e);position:absolute;left:0;top:0;font-family:var(--f-display);font-weight:700;font-size:2.4rem;line-height:1;color:var(--plan)}
.etapes b{display:block;font-size:1.1rem}

.nuit{background:var(--nuit);color:var(--sur-nuit)}
.nuit-in{padding:var(--esp-5) var(--bord);max-width:calc(var(--col-lecture) + 2 * var(--bord))}
.nuit p{margin-top:var(--esp-2);color:var(--sur-nuit-2)}

.pied{background:var(--nuit);color:var(--sur-nuit-2);border-top:1px solid var(--plan-nuit)}
.pied-in{padding:var(--esp-4) var(--bord);display:flex;flex-wrap:wrap;align-items:center;gap:var(--esp-2) var(--esp-4)}
.pied .marque{color:var(--sur-nuit);font-size:1.3rem}
.pied nav{display:flex;flex-wrap:wrap;gap:var(--esp-3);margin-left:auto}
.pied a{color:var(--sur-nuit)}

/* ── Page producteur (gabarit neutre, couleur du producteur) ── */
.bandeau{background:var(--accent);color:var(--sur-accent);display:flex;align-items:center;gap:var(--esp-2);padding:var(--esp-2) var(--bord);min-height:72px}
.bandeau-logo{height:40px;width:auto;max-width:180px;object-fit:contain;object-position:left center}
.bandeau-nom{font-weight:800;font-size:1.2rem;text-decoration:none}
.bandeau-retour{margin-left:auto;font-weight:700;color:var(--sur-accent)}
.page-prod{padding:0 var(--bord)}
.page-prod>section{max-width:1040px}
.prod-tete{padding:var(--esp-5) 0 var(--esp-3);max-width:var(--col-lecture)}
.prod-tete h1{font-size:var(--t-h2);line-height:var(--lh-h2);letter-spacing:var(--ls-h2)}
.prod-sous{margin-top:var(--esp-1);color:var(--plan);font-weight:600}
.prod-accroche{margin-top:var(--esp-2);font-size:1.2rem;max-width:40rem}
.perimetre{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--esp-4);align-items:start;padding:var(--esp-3) 0 var(--esp-5)}
.carte-prod{position:relative;height:360px;border-radius:var(--r-champ)}
.peri-txt h2{font-size:var(--t-h3);line-height:var(--lh-h3)}
.peri-txt .cherche{margin-top:var(--esp-2)}
.cherche-clair input{border-color:var(--ligne);background:var(--papier)}
/* Suggestions d'adresse (BAN) : une liste sous le champ, même rayon, jamais de survol coloré hors jetons. */
.cherche-l{position:relative}
.cherche-sugg{position:absolute;left:0;top:calc(52px + var(--esp-1));z-index:5;width:min(100%,34rem);margin:0;padding:var(--esp-1) 0;list-style:none;background:var(--papier);color:var(--encre);border:2px solid var(--plan);border-radius:var(--r-champ)}
.cherche-sugg[hidden]{display:none}
.cherche-sugg li{padding:var(--esp-1) var(--esp-2);cursor:pointer;line-height:1.3}
.cherche-sugg li[aria-selected="true"],.cherche-sugg li:hover{background:var(--craie);text-decoration:underline}
.verdict{margin-top:var(--esp-3);padding:var(--esp-2) var(--esp-2) var(--esp-2) var(--esp-3);border-left:4px solid var(--plan);background:var(--papier)}
.verdict.dedans{border-color:var(--ok)}
.verdict.dedans b{color:var(--ok)}
.verdict.proche{border-color:var(--soleil)}
.verdict.proche b{color:var(--attention)}
.verdict.dehors{border-color:var(--non)}
.verdict.dehors b{color:var(--non)}
@media(max-width:820px){.perimetre{grid-template-columns:1fr}.carte-prod{height:300px}}

.offres{padding:var(--esp-4) 0;border-top:2px solid var(--encre)}
.liste-offres{list-style:none;margin-top:var(--esp-3)}
.offre{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto;gap:var(--esp-2) var(--esp-4);align-items:center;padding:var(--esp-3) 0;border-bottom:1px solid var(--ligne)}
.offre-cible{font-weight:700;color:var(--plan);font-size:var(--t-mention)}
.offre h3{margin-top:.2rem}
.offre-cond{margin-top:.3rem;color:var(--plan);font-size:.95rem}
.offre-prix{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:0 var(--esp-1)}
.px{font-family:var(--f-display);font-weight:700;font-size:var(--t-prix);line-height:var(--lh-prix);letter-spacing:var(--ls-prix);font-variant-numeric:tabular-nums}
.px-2{font-size:calc(var(--t-prix) * .62)}
.px-u{font-size:var(--t-mention);line-height:var(--lh-mention);color:var(--plan)}
.mention{margin-top:var(--esp-3);font-size:var(--t-mention);line-height:var(--lh-mention);color:var(--plan);max-width:var(--col-lecture)}
@media(max-width:820px){.offre{grid-template-columns:1fr}.offre-go{justify-self:start}}

.interet{padding:var(--esp-4) 0;border-top:2px solid var(--encre)}
.form-int{margin-top:var(--esp-3);max-width:var(--col-lecture);display:grid;gap:var(--esp-2)}
.fl{display:block}
.fl>span,.duo legend{display:block;font-weight:700;margin-bottom:.35rem}
.fl input,.fl select,.fl textarea{width:100%;min-height:50px;border:2px solid var(--ligne);border-radius:var(--r-champ);background:var(--papier);padding:.6rem var(--esp-2);font:inherit;color:var(--encre)}
.fl textarea{min-height:110px;resize:vertical}
.fl input:focus,.fl select:focus,.fl textarea:focus{outline:none;border-color:var(--encre)}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:var(--esp-2)}
@media(max-width:560px){.deux{grid-template-columns:1fr}}
.duo{border:0;display:flex;flex-wrap:wrap;gap:var(--esp-1)}
.duo legend{width:100%}
.duo label{flex:1 1 10rem;position:relative}
.duo input{position:absolute;opacity:0}
.duo span{display:flex;align-items:center;justify-content:center;min-height:48px;border:2px solid var(--ligne);border-radius:var(--r-champ);background:var(--papier);font-weight:700;cursor:pointer}
.duo input:checked+span{border-color:var(--encre)}
.duo input:focus-visible+span{outline:3px solid var(--accent);outline-offset:2px}
.accord{display:flex;gap:var(--esp-1);align-items:flex-start;font-size:.95rem}
.accord input{width:20px;height:20px;margin-top:.2rem;flex:0 0 auto;accent-color:var(--encre)}
.form-int .btn-plein{justify-self:start}
.champ-cache{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.presentation{padding:var(--esp-4) 0 var(--esp-5);border-top:2px solid var(--encre)}
.presentation .texte{margin-top:var(--esp-2);max-width:var(--col-lecture)}
.pied-prod{background:var(--craie);color:var(--encre);border-top:2px solid var(--encre)}
.pied-prod a{color:var(--encre)}

.legal h1{font-size:var(--t-h2);line-height:var(--lh-h2)}
.legal h2{font-size:var(--t-h3);line-height:var(--lh-h3);margin-top:var(--esp-4)}
.legal p{margin-top:var(--esp-1);max-width:var(--col-lecture)}
.introuvable h1{font-size:var(--t-h2);margin-bottom:var(--esp-3)}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}@view-transition{navigation:none}}
/* Contrôles Leaflet aux contrastes AA (les teintes par défaut ne passent pas). */
.leaflet-container .leaflet-control-attribution{background:var(--papier);color:var(--encre)}
.leaflet-container .leaflet-control-attribution a{color:var(--encre);text-decoration:underline}
.leaflet-bar a,.leaflet-bar a:hover{color:var(--encre);background:var(--papier)}
