
/* =========================================================
   1. IDENTITÉ GLANE — charte v1.0 (verts sobres, fond crème)
   ========================================================= */
:root{
  /* Palette de la charte */
  --foret:#244432;      /* actions principales, navigation active, repères carte */
  --profond:#193629;    /* titres, texte fort */
  --sauge:#698D57;      /* accents, catégories, décor */
  --menthe:#E6EFDF;     /* puces, états doux, cartes secondaires */
  --creme:#FAF9F5;      /* fond général */
  --blanc:#FFFFFF;      /* cartes, formulaires, panneaux, menu */
  --sable:#F0EEE5;      /* surface secondaire */
  --terre-cuite:#BC644C;/* épingle sélectionnée, accent rare */

  /* Rôles (noms historiques conservés pour le JS) */
  --kraft:var(--creme); --papier:var(--blanc); --encre:var(--profond);
  --chou:var(--foret); --sur-chou:#FFFFFF;
  --terre:var(--terre-cuite); --sur-terre:#FFFFFF;
  --terre-txt:#9A4A35;          /* terre cuite assombrie : AA en petit texte */
  --tampon:#4F7041;             /* sauge assombri : AA en petit texte */
  --sur-tampon:#FFFFFF;
  --colza:var(--terre-cuite); --sur-colza:#FFFFFF;
  --sillon:#93A493;
  --texte-2:#5E7061;
  --etiquette:var(--menthe); --etiquette-txt:var(--profond);
  --bord:#DFE6DA; --eau:#A9C2C6; --champ:var(--menthe);
  --surface-2:var(--sable);
  --ombre:0 1px 2px rgba(25,54,41,.05),0 6px 18px -10px rgba(25,54,41,.18);
  --ombre-forte:0 2px 6px rgba(25,54,41,.07),0 18px 40px -18px rgba(25,54,41,.32);
  --r-s:10px; --r-m:14px; --r-l:22px; --r-pill:999px;
  --f-titre:Georgia,"Times New Roman",serif;
  --f-ui:"DM Sans",Arial,sans-serif;
  --f-mono:"DM Sans",Arial,sans-serif;
  /* Carte : fond de plan doux, routes blanches, eau grise-bleue */
  --map-sol:#EFF3E9; --map-bati:#E6EBDF; --map-bois:#D9E5CF; --map-parc:#E0EAD6;
  --map-eau:#C6DADD; --map-route:#FFFFFF; --map-route-bord:#D3DCCB;
  --map-axe:#FFFFFF; --map-axe-bord:#B9C8B0; --map-texte:#5E7061; --map-ville:#193629; --map-halo:#EFF3E9;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --foret:#9CC58F; --profond:#E8F0E2; --sauge:#8DB37A; --menthe:#22352A;
    --creme:#111A14; --blanc:#18241C; --sable:#1D2B22; --terre-cuite:#E58F75;
    --sur-chou:#112016; --sur-terre:#1A0F0B; --sur-colza:#1A0F0B; --sur-tampon:#112016;
    --terre-txt:#E9A08A; --tampon:#A9C79B;
    --sillon:#5E7A64; --texte-2:#A9BAA9;
    --bord:#2C3D31; --eau:#3E5A60;
    --ombre:0 1px 2px rgba(0,0,0,.3),0 8px 20px -12px rgba(0,0,0,.6);
    --ombre-forte:0 2px 6px rgba(0,0,0,.35),0 18px 40px -18px rgba(0,0,0,.75);
    --map-sol:#142019; --map-bati:#18251D; --map-bois:#172A1E; --map-parc:#192C20;
    --map-eau:#1D3337; --map-route:#2B3B30; --map-route-bord:#1A261E;
    --map-axe:#3D5443; --map-axe-bord:#22332A; --map-texte:#9DB09D; --map-ville:#E8F0E2; --map-halo:#142019;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --foret:#9CC58F; --profond:#E8F0E2; --sauge:#8DB37A; --menthe:#22352A;
  --creme:#111A14; --blanc:#18241C; --sable:#1D2B22; --terre-cuite:#E58F75;
  --sur-chou:#112016; --sur-terre:#1A0F0B; --sur-colza:#1A0F0B; --sur-tampon:#112016;
  --terre-txt:#E9A08A; --tampon:#A9C79B;
  --sillon:#5E7A64; --texte-2:#A9BAA9;
  --bord:#2C3D31; --eau:#3E5A60;
  --ombre:0 1px 2px rgba(0,0,0,.3),0 8px 20px -12px rgba(0,0,0,.6);
  --ombre-forte:0 2px 6px rgba(0,0,0,.35),0 18px 40px -18px rgba(0,0,0,.75);
  --map-sol:#142019; --map-bati:#18251D; --map-bois:#172A1E; --map-parc:#192C20;
  --map-eau:#1D3337; --map-route:#2B3B30; --map-route-bord:#1A261E;
  --map-axe:#3D5443; --map-axe-bord:#22332A; --map-texte:#9DB09D; --map-ville:#E8F0E2; --map-halo:#142019;
  color-scheme:dark;
}

/* =========================================================
   2. BASE
   ========================================================= */
*,*::before,*::after{box-sizing:inherit}
[hidden]{display:none!important}
html{height:100%;scroll-padding-top:calc(env(safe-area-inset-top,0px) + 80px);-webkit-text-size-adjust:100%}
body{margin:0;min-height:100%;background:var(--creme);color:var(--profond);font-family:var(--f-ui);font-size:16px;line-height:1.55}
img,svg{max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--f-titre);font-weight:400;letter-spacing:-.015em;line-height:1.1;margin:0;color:var(--profond)}
h1{font-size:clamp(2.8rem,6.2vw,4.75rem);line-height:1.04}
h2{font-size:clamp(1.75rem,3.4vw,2.6rem)}
h3{font-size:clamp(1.19rem,1.6vw,1.4rem);letter-spacing:-.005em;line-height:1.2}
p{margin:0}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.muted{color:var(--texte-2)}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:2.5px solid var(--foret);outline-offset:3px;border-radius:6px}
[tabindex="-1"]:focus{outline:none}
.ic{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ic.s{width:16px;height:16px}

/* =========================================================
   3. STRUCTURE
   ========================================================= */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:color-mix(in srgb,var(--creme) 94%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--bord)}
.topbar-in{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:10px 18px}
.logo-link{display:inline-flex;color:var(--foret);text-decoration:none;margin-right:auto}
.logo{width:112px;height:auto;display:block;overflow:visible}
.topnav{display:none;gap:4px}
.topnav a{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:var(--r-pill);text-decoration:none;font-weight:600;font-size:.94rem;color:var(--texte-2)}
.topnav a[aria-current="page"]{color:var(--sur-chou);background:var(--foret)}
.topnav a:not([aria-current="page"]):hover{color:var(--profond);background:var(--menthe)}
.btn-icon{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:var(--r-pill);border:1px solid var(--bord);background:var(--blanc);cursor:pointer;color:var(--profond);position:relative}
.btn-icon:hover{border-color:var(--sauge)}
.count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 6px;border-radius:var(--r-pill);background:var(--terre-cuite);color:var(--sur-terre);font:700 11px/20px var(--f-ui);text-align:center}
.count:empty{display:none}
main{max-width:1280px;margin:0 auto;padding:24px 18px 120px}
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(4,1fr);background:var(--blanc);border-top:1px solid var(--bord);padding-bottom:env(safe-area-inset-bottom,0px);box-shadow:0 -8px 24px -18px rgba(25,54,41,.35)}
.tabbar a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 4px 9px;text-decoration:none;font-size:11.5px;font-weight:700;color:var(--texte-2);position:relative}
.tabbar a[aria-current="page"]{color:var(--foret)}
.tabbar a[aria-current="page"] .ic{background:var(--menthe);border-radius:var(--r-pill);padding:3px 16px;box-sizing:content-box}
.tabbar .ic{padding:3px 16px;box-sizing:content-box;border-radius:var(--r-pill)}
.tabbar .count{top:4px;right:calc(50% - 24px)}
@media (min-width:860px){
  .topbar-in{padding:12px 32px}
  .topnav{display:flex}
  .tabbar{display:none}
  main{padding:40px 32px 80px}
}

/* =========================================================
   4. COMPOSANTS
   ========================================================= */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:12px 22px;border-radius:var(--r-pill);border:0;font-family:var(--f-ui);font-weight:700;font-size:13px;letter-spacing:.01em;text-decoration:none;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,transform .15s ease}
.btn:active{transform:translateY(1px)}
/* Action principale : toujours vert forêt (btn-terre conservé pour le JS) */
.btn-terre,.btn-chou{background:var(--foret);color:var(--sur-chou)}
.btn-terre:hover,.btn-chou:hover{background:color-mix(in srgb,var(--foret) 88%,#000)}
.btn-ghost{background:var(--blanc);border:1.5px solid var(--bord);color:var(--profond)}
.btn-ghost:hover{border-color:var(--foret)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.back{display:inline-flex;align-items:center;gap:4px;color:var(--texte-2);text-decoration:none;font-weight:600;font-size:.92rem;margin-bottom:16px}
.back:hover{color:var(--profond)}

/* Prix : pastille menthe, chiffres lisibles */
.tag{display:inline-flex;align-items:baseline;flex-wrap:wrap;column-gap:.45em;background:var(--menthe);color:var(--profond);padding:.3em .85em;font-family:var(--f-ui);font-variant-numeric:tabular-nums;font-size:.92rem;line-height:1.3;border-radius:var(--r-pill)}
.tag strong{font-weight:700;font-size:1.1em}
.tag s{color:var(--texte-2);font-size:.86em}
.tag small{font-size:.8em;color:var(--texte-2);font-weight:500}
.tag-big{font-size:1.2rem;padding:.4em 1.05em}
.tag-big strong{font-size:1.45em}

/* Pastilles de réduction (anciens tampons) */
.stamps{display:flex;align-items:flex-start;gap:6px;pointer-events:none;flex-wrap:wrap;justify-content:flex-end}
.stamp{display:inline-flex;align-items:baseline;gap:.4em;padding:.35em .75em;border-radius:var(--r-pill);font-family:var(--f-ui);line-height:1.1;background:var(--blanc);color:var(--tampon);box-shadow:var(--ombre);animation:pose .35s ease both}
.stamp b{font-weight:700;font-size:.95rem;font-variant-numeric:tabular-nums}
.stamp small{font-size:.72rem;font-weight:700;letter-spacing:.02em}
.st-tampon{color:var(--tampon)}
.st-colza{color:var(--terre-txt)}
.stamps.lg .stamp b{font-size:1.25rem}
.stamps.lg .stamp small{font-size:.8rem}
.stamps.lg .stamp{padding:.5em 1em}
@keyframes pose{from{opacity:0;transform:translateY(-4px)}}

/* Badge anti-gaspi */
.badge-gaspi{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--terre-cuite) 12%,var(--blanc));color:var(--terre-txt);font-size:.78rem;font-weight:700;width:fit-content;font-variant-numeric:tabular-nums}
.badge-gaspi .b-t{opacity:.9;border-left:1px solid currentColor;padding-left:6px}
.badge-gaspi.big{font-size:.95rem;padding:6px 14px}

/* Jauge de fraîcheur */
.gauge{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin:10px 0 6px}
.gauge i{height:8px;border-radius:var(--r-pill);background:var(--sable);border:0}
.gauge i.on{background:var(--sauge)}
.gauge.urgent i.on{background:var(--terre-cuite)}
.gauge-legend{display:flex;justify-content:space-between;font:700 .72rem var(--f-ui);color:var(--texte-2)}

/* Carte produit : photo, puis nom, disponibilité et action */
.pcard{position:relative;display:flex;flex-direction:column;background:var(--blanc);border-radius:var(--r-l);border:1px solid var(--bord);overflow:hidden;transition:box-shadow .2s ease,border-color .2s ease}
.pcard:hover{box-shadow:var(--ombre-forte);border-color:transparent}
.pcard-art{position:relative;aspect-ratio:10/7;margin:8px 8px 0;border-radius:calc(var(--r-l) - 6px);overflow:hidden}
.pcard-art .stamps{position:absolute;top:10px;right:10px;left:10px}
.pcard-body{display:flex;flex-direction:column;gap:6px;padding:12px 16px 16px;flex:1}
.pcard h3 a{text-decoration:none}
.stretch::after{content:"";position:absolute;inset:0;z-index:1}
.pcard-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:8px}
.pcard .add{position:relative;z-index:2;background:var(--foret);color:var(--sur-chou);border:0;width:42px;height:42px}
.hurry{font-size:.82rem;font-weight:700;color:var(--terre-txt)}
.small{font-size:.86rem}
.art{display:block;width:100%;height:100%}

/* Segmenté (rayon) */
.seg{display:inline-flex;padding:4px;border-radius:var(--r-pill);background:var(--blanc);border:1px solid var(--bord);gap:2px}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label{padding:7px 14px;border-radius:var(--r-pill);font:700 .84rem var(--f-ui);cursor:pointer;color:var(--texte-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.seg input:checked+label{background:var(--foret);color:var(--sur-chou)}
.seg input:focus-visible+label{outline:2.5px solid var(--foret);outline-offset:1px}
fieldset{border:0;margin:0;padding:0;min-width:0}

/* Chips catégories */
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--r-pill);border:1px solid var(--bord);background:var(--blanc);cursor:pointer;font-weight:600;font-size:.9rem;white-space:nowrap;color:var(--profond)}
.chip .ic{color:var(--sauge)}
.chip:hover{border-color:var(--sauge)}
.chip[aria-pressed="true"]{background:var(--menthe);color:var(--foret);border-color:var(--foret)}
.chip[aria-pressed="true"] .ic{color:var(--foret)}
.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-weight:600;font-size:.92rem}
.switch input{appearance:none;-webkit-appearance:none;width:42px;height:24px;border-radius:var(--r-pill);background:var(--sable);border:1.5px solid var(--sillon);position:relative;cursor:pointer;margin:0;flex:none}
.switch input::after{content:"";position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:var(--sillon);transition:transform .2s ease}
.switch input:checked{background:var(--foret);border-color:var(--foret)}
.switch input:checked::after{transform:translateX(18px);background:var(--sur-chou)}

/* Toast */
.toast{position:fixed;left:50%;bottom:calc(88px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;background:var(--profond);color:var(--creme);padding:12px 20px;border-radius:var(--r-pill);font-weight:600;font-size:.92rem;box-shadow:var(--ombre-forte);transition:opacity .2s ease,transform .25s ease;z-index:60;pointer-events:none;max-width:calc(100% - 36px);text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}
@media (min-width:860px){.toast{bottom:28px}}

/* =========================================================
   5. ÉCRANS
   ========================================================= */
/* Accueil */
.hero{padding:12px 0 32px;max-width:860px}
.hero h1{margin-bottom:16px}
.lede{font-size:1.06rem;color:var(--texte-2);max-width:58ch}
.search{display:flex;align-items:center;gap:8px;margin-top:24px;background:var(--blanc);border:1px solid var(--bord);border-radius:var(--r-pill);padding:6px 6px 6px 18px;box-shadow:var(--ombre)}
.search:focus-within{border-color:var(--foret)}
.search .ic{color:var(--texte-2)}
.search input{flex:1;min-width:0;border:0;background:transparent;padding:8px 2px;font-size:1rem}
.search input:focus{outline:none}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.map-block{margin-bottom:48px}
.map-frame{position:relative;border-radius:var(--r-l);overflow:hidden;background:var(--menthe);box-shadow:var(--ombre);border:1px solid var(--bord)}
.map{height:min(64vh,360px)}
@media (min-width:860px){.map{height:480px}}
.map svg{display:block}
.m-bg{fill:var(--menthe)}
.m-dot{fill:var(--sauge);opacity:.28}
.m-eau{fill:none;stroke:var(--eau);stroke-width:5;stroke-linecap:round;opacity:.7}
.m-eau.fine{stroke-width:3}
.m-periph{fill:color-mix(in srgb,var(--blanc) 45%,transparent);stroke:var(--sauge);stroke-width:1.4;stroke-dasharray:2 4}
.m-ville{font:600 12px var(--f-ui);fill:var(--texte-2)}
.m-ville.paris{font:400 16px var(--f-titre);fill:var(--profond);opacity:.75}
.m-rayon{fill:color-mix(in srgb,var(--foret) 5%,transparent);stroke:var(--foret);stroke-width:1.6;stroke-dasharray:6 5}
.m-rayon-lbl{font:700 11px var(--f-ui);fill:var(--foret)}
.mk{cursor:pointer}
.mk-body{fill:var(--foret);stroke:var(--blanc);stroke-width:1.5;transition:fill .15s ease}
.mk-txt{font:700 11px var(--f-ui);fill:var(--sur-chou)}
.mk-ic{fill:none;stroke:var(--sur-chou);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mk-hole{fill:var(--menthe)}
.mk:hover .mk-body,.mk.sel .mk-body{fill:var(--terre-cuite)}
.mk.sel .mk-txt{fill:var(--sur-terre)}.mk.sel .mk-ic{stroke:var(--sur-terre)}
.mk:focus{outline:none}
.mk:focus-visible .mk-body{stroke:var(--profond);stroke-width:3}
.me-dot{fill:var(--foret);stroke:var(--blanc);stroke-width:3}
.me-pulse{fill:var(--foret);opacity:.25;transform-origin:center;transform-box:fill-box;animation:pouls 2.4s ease-out infinite}
@keyframes pouls{0%{transform:scale(.4);opacity:.4}100%{transform:scale(2.4);opacity:0}}
.me-lbl{font:700 12px var(--f-ui);fill:var(--foret)}
.map-hint{position:absolute;left:12px;bottom:12px;background:var(--blanc);padding:8px 14px;border-radius:var(--r-pill);font-size:.84rem;box-shadow:var(--ombre);color:var(--texte-2)}
.map-card{position:absolute;left:12px;right:12px;bottom:12px}
.map-card:empty{display:none}
.mc{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center;background:var(--blanc);border-radius:var(--r-l);padding:12px;box-shadow:var(--ombre-forte);animation:monte .25s ease both}
@keyframes monte{from{opacity:0;transform:translateY(10px)}}
.mc-art{width:64px;height:64px;border-radius:var(--r-m);overflow:hidden}
.mc h3{font-size:1.15rem}
.mc-meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:.84rem;margin-top:2px}
.mc-actions{grid-column:1/-1;display:flex;gap:8px}
.mc-actions .btn{flex:1;min-height:42px;padding:8px 14px}
@media (min-width:620px){.map-card{left:auto;width:390px}}
.open{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.8rem;color:var(--texte-2)}
.open::before{content:"";width:8px;height:8px;border-radius:50%;border:1.5px solid var(--sillon)}
.open.is-open{color:var(--foret)}
.open.is-open::before{background:var(--sauge);border-color:var(--sauge)}
.carousel{display:grid;grid-auto-flow:column;grid-auto-columns:min(74%,248px);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 20px;margin:0 -4px;scrollbar-width:thin}
.carousel>*{scroll-snap-align:start}
.car-nav{display:none;gap:8px}
@media (min-width:860px){.car-nav{display:flex}}
.empty{padding:32px 20px;border:1.5px dashed var(--bord);background:var(--blanc);border-radius:var(--r-l);text-align:center;color:var(--texte-2);display:grid;gap:14px;justify-items:center}

/* Liste producteurs */
.filters{display:grid;gap:12px;margin:20px 0 24px;padding:16px;background:var(--blanc);border-radius:var(--r-l);border:1px solid var(--bord)}
.filters-row{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}
.result-count{font-size:.84rem;font-weight:700;color:var(--texte-2);margin-bottom:12px}
.grid-prod{display:grid;gap:16px}
@media (min-width:700px){.grid-prod{grid-template-columns:1fr 1fr}}
@media (min-width:1080px){.grid-prod{grid-template-columns:1fr 1fr 1fr}}
.prcard{position:relative;display:grid;grid-template-columns:108px 1fr;gap:14px;background:var(--blanc);border-radius:var(--r-l);border:1px solid var(--bord);padding:10px;transition:box-shadow .2s ease,border-color .2s ease}
.prcard:hover{box-shadow:var(--ombre-forte);border-color:transparent}
.prcard-art{border-radius:var(--r-m);overflow:hidden;aspect-ratio:1}
.prcard h3 a{text-decoration:none}
.prcard-type{font-size:.76rem;font-weight:700;color:var(--tampon);text-transform:uppercase;letter-spacing:.05em}
.prcard-meta{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:6px;font-size:.86rem}
.promo-pill{display:inline-flex;align-items:center;gap:5px;margin-top:8px;font-size:.78rem;font-weight:700;color:var(--terre-txt);background:color-mix(in srgb,var(--terre-cuite) 10%,var(--blanc));border-radius:var(--r-pill);padding:3px 10px;width:fit-content}
.grid-items{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(168px,1fr))}
@media (min-width:860px){.grid-items{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}

/* Fiche producteur : bandeau, nom et lieu immédiatement visibles */
.pr-hero{border-radius:var(--r-l);overflow:hidden;height:180px;margin-bottom:22px}
@media (min-width:860px){.pr-hero{height:260px}}
.pr-head{display:grid;gap:10px;margin-bottom:28px}
.pr-head .story{max-width:62ch;font-size:1.04rem}
.pr-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.pr-info{display:grid;gap:16px;margin-bottom:40px}
@media (min-width:860px){.pr-info{grid-template-columns:1.3fr 1fr}}
.panel{background:var(--blanc);border-radius:var(--r-l);border:1px solid var(--bord);padding:20px}
.panel h2{font-size:1.4rem;margin-bottom:12px}
.mini-map{height:210px;border-radius:var(--r-m);overflow:hidden;margin-bottom:12px;border:1px solid var(--bord)}
.hours{width:100%;border-collapse:collapse;font-size:.92rem}
.hours th{text-align:left;font-weight:600;padding:6px 0;width:38%}
.hours td{font-variant-numeric:tabular-nums;padding:6px 0;text-align:right}
.hours tr+tr{border-top:1px solid var(--bord)}
.hours tr.today{color:var(--foret);font-weight:700}
.hours tr.today th::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--sauge);margin-right:8px;vertical-align:middle}
.markets{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px}
.markets li{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;font-size:.92rem}
.markets .day{font:700 .74rem var(--f-ui);background:var(--menthe);color:var(--foret);border-radius:var(--r-pill);padding:3px 10px;margin-top:1px;text-transform:uppercase;letter-spacing:.04em}

/* Fiche produit */
.pd{display:grid;gap:24px}
@media (min-width:860px){.pd{grid-template-columns:1fr 1fr;align-items:start;gap:48px}}
.pd-art{position:relative;border-radius:var(--r-l);overflow:hidden;aspect-ratio:5/4}
.pd-art .stamps{position:absolute;top:16px;right:16px;left:16px}
.pd-producer{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--foret);text-decoration:none;margin:10px 0 18px}
.pd-producer:hover{text-decoration:underline}
.price-zone{display:grid;gap:8px;margin-bottom:20px}
.cap-note{font-size:.84rem;color:var(--tampon);font-weight:600}
.blk{border-top:1px solid var(--bord);padding:16px 0}
.blk h2{font-size:1.25rem;margin-bottom:10px}
.states{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.state{border:1px solid var(--bord);border-radius:var(--r-m);padding:10px 11px;font-size:.84rem;background:var(--blanc)}
.state b{display:block;font-size:.95rem}
.state .off{color:var(--texte-2);font-variant-numeric:tabular-nums}
.state.cur{border-color:var(--foret);background:var(--menthe);box-shadow:inset 0 0 0 1px var(--foret)}
.state.cur b::after{content:" (ce lot)";font-weight:600;font-size:.76rem;color:var(--tampon)}
.usage{display:flex;gap:8px;align-items:flex-start;font-size:.95rem}
.qty-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding-top:18px}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--bord);border-radius:var(--r-pill);background:var(--blanc)}
.stepper button{width:46px;height:46px;border:0;background:transparent;cursor:pointer;display:grid;place-items:center;border-radius:var(--r-pill)}
.stepper button:hover{background:var(--menthe)}
.stepper output{min-width:38px;text-align:center;font:700 1.05rem var(--f-ui);font-variant-numeric:tabular-nums}
.qty-row .btn{flex:1;min-width:170px;white-space:nowrap}
.facts{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:.93rem}
.facts dt{color:var(--texte-2)}
.facts dd{margin:0;font-weight:600}

/* Panier : panneaux blancs, prix final visible */
.save-hero{background:var(--foret);color:var(--sur-chou);border-radius:var(--r-l);padding:22px 24px;margin:18px 0 26px}
.save-hero p{font-family:var(--f-titre);font-size:clamp(1.4rem,3.6vw,1.9rem);line-height:1.2}
.save-hero .mono{font-family:var(--f-titre);font-variant-numeric:tabular-nums}
.cart-layout{display:grid;gap:24px}
@media (min-width:960px){.cart-layout{grid-template-columns:1.4fr 1fr;align-items:start}}
.tickets{display:grid;gap:16px}
.ticket-wrap{filter:none}
.ticket{position:relative;background:var(--blanc);padding:20px;font-family:var(--f-ui);font-size:.92rem;border-radius:var(--r-l);border:1px solid var(--bord)}
.t-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding-bottom:12px;border-bottom:1px solid var(--bord);margin-bottom:4px}
.t-head h2{font-family:var(--f-titre);font-size:1.3rem}
.t-line{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:10px 0;border-bottom:1px solid var(--bord);font-variant-numeric:tabular-nums}
.t-name{display:flex;gap:6px;align-items:baseline;overflow:hidden;font-weight:600}
.t-name span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t-disc{grid-column:1/-1;display:flex;justify-content:space-between;color:var(--tampon);font-size:.82rem;font-weight:600}
.t-ctl{grid-column:1/-1;display:flex;align-items:center;gap:6px;margin-top:6px}
.t-ctl button{width:32px;height:32px;border-radius:var(--r-pill);border:1px solid var(--bord);background:var(--blanc);cursor:pointer;display:grid;place-items:center}
.t-ctl button:hover{border-color:var(--foret)}
.t-ctl .rm{width:auto;padding:0 12px;font-size:.78rem;font-weight:600;margin-left:auto;color:var(--texte-2)}
.t-sum{display:flex;justify-content:space-between;padding-top:12px;font-weight:700;font-size:1rem;font-variant-numeric:tabular-nums}
.slots{margin-top:16px;padding-top:14px;border-top:1px solid var(--bord)}
.slots legend{float:left;width:100%;padding:0;font-family:var(--f-ui);font-weight:700;margin-bottom:10px;font-size:.92rem}
.slots .slot-list{clear:both}
.slot-list{display:grid;gap:8px}
.slot{display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--bord);border-radius:var(--r-m);cursor:pointer;font-family:var(--f-ui);font-size:.9rem}
.slot input{accent-color:var(--foret);width:18px;height:18px;margin:0}
.slot:has(input:checked){border-color:var(--foret);background:var(--menthe)}
.slot .mono{font-size:.82rem;color:var(--texte-2)}
.total-ticket{box-shadow:var(--ombre-forte);border-color:transparent}
.total-ticket .t-sum{font-size:1.2rem;border-top:1px solid var(--bord);margin-top:4px}
.total-ticket .barcode{display:none}
.sticky{position:sticky;top:96px}
.err{color:var(--terre-txt);font-weight:600;font-size:.88rem}
.confirm{text-align:center;display:grid;gap:18px;justify-items:center;padding:36px 0}
.confirm .stamps .stamp{color:var(--foret);background:var(--menthe);box-shadow:none}

/* Espace producteur : information dense rangée dans de grands panneaux */
.pro{display:grid;gap:24px}
@media (min-width:960px){.pro{grid-template-columns:1.15fr 1fr;align-items:start}}
.form{display:grid;gap:18px}
.field{display:grid;gap:6px}
.field>label,.field>legend{font-weight:700;font-size:.92rem}
.hint{font-size:.82rem;color:var(--texte-2)}
.input{width:100%;min-height:48px;padding:11px 14px;border-radius:var(--r-m);border:1px solid var(--bord);background:var(--blanc)}
.input:focus{outline:none;border-color:var(--foret);box-shadow:0 0 0 3px color-mix(in srgb,var(--foret) 18%,transparent)}
.input.mono{font-variant-numeric:tabular-nums}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.state-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.state-pick input{position:absolute;opacity:0}
.state-pick label{display:grid;gap:2px;padding:12px;border-radius:var(--r-m);border:1px solid var(--bord);background:var(--blanc);cursor:pointer;font-size:.84rem;height:100%}
.state-pick label b{font-size:.98rem}
.state-pick input:checked+label{border-color:var(--foret);background:var(--menthe);box-shadow:inset 0 0 0 1px var(--foret)}
.state-pick input:focus-visible+label{outline:2.5px solid var(--foret);outline-offset:2px}
.preview{display:grid;gap:16px}
.preview-card{max-width:300px}
.calc{font-size:.88rem;display:grid;gap:4px;font-variant-numeric:tabular-nums}
.calc div{display:flex;justify-content:space-between;border-bottom:1px solid var(--bord);padding:6px 0}
.mine{display:grid;gap:8px;margin-top:8px}
.mine li{list-style:none;display:flex;justify-content:space-between;gap:10px;padding:12px 14px;background:var(--blanc);border:1px solid var(--bord);border-radius:var(--r-m);font-size:.92rem}
.mine ul{padding:0;margin:0;display:grid;gap:8px}

/* =========================================================
   6. CARTE RÉELLE (MapLibre)
   ========================================================= */
.home-map{display:grid;gap:16px}
@media (min-width:960px){.home-map{grid-template-columns:340px 1fr;align-items:stretch}}
.map-frame .map{height:min(68vh,420px)}
@media (min-width:960px){.map-frame .map{height:560px}}
.map.gl{background:var(--map-sol)}
.maplibregl-map{font-family:var(--f-ui)}
.maplibregl-ctrl-group{border-radius:var(--r-pill)!important;overflow:hidden;box-shadow:var(--ombre)!important;background:var(--blanc)!important}
.maplibregl-ctrl-group button{width:38px!important;height:38px!important}
.maplibregl-ctrl-group button+button{border-top:1px solid var(--bord)!important}
:root[data-theme="dark"] .maplibregl-ctrl-group button .maplibregl-ctrl-icon{filter:invert(1)}
.maplibregl-ctrl-attrib{font-size:10.5px;background:color-mix(in srgb,var(--blanc) 85%,transparent)!important;border-radius:var(--r-pill)!important;color:var(--texte-2)}
.maplibregl-ctrl-attrib a{color:var(--texte-2)}
.maplibregl-ctrl-attrib.maplibregl-compact{min-height:22px}
.maplibregl-cooperative-gesture-screen{font-family:var(--f-ui);font-weight:600;background:color-mix(in srgb,var(--profond) 55%,transparent)}
/* Étiquette producteur */
.gmk{display:inline-flex;align-items:center;gap:6px;padding:5px 11px 5px 7px;border:2px solid var(--blanc);border-radius:var(--r-pill);background:var(--foret);color:var(--sur-chou);font:700 12px/1 var(--f-ui);font-variant-numeric:tabular-nums;cursor:pointer;box-shadow:0 4px 12px -4px rgba(25,54,41,.45);position:relative;white-space:nowrap;transition:background-color .15s ease,transform .15s ease}
.gmk::after{content:"";position:absolute;left:50%;bottom:-7px;width:10px;height:10px;background:inherit;border-right:2px solid var(--blanc);border-bottom:2px solid var(--blanc);transform:translateX(-50%) rotate(45deg);border-bottom-right-radius:2px}
.gmk .ic{width:16px;height:16px;padding:3px;border-radius:50%;background:color-mix(in srgb,var(--sur-chou) 16%,transparent);box-sizing:content-box}
.gmk:hover{background:color-mix(in srgb,var(--foret) 85%,#000)}
.gmk.sel{background:var(--terre-cuite);color:var(--sur-terre);z-index:2;transform:scale(1.08)}
.gmk:focus-visible{outline:3px solid var(--profond);outline-offset:2px}
.gmk-wrap{padding-bottom:6px}
.gmk-wrap.on{z-index:3}
.gme-wrap{z-index:4;pointer-events:none}
@media (max-width:620px){.map-frame .map-hint{display:none}}
/* Toi */
.gme{position:relative;width:18px;height:18px}
.gme i{position:absolute;inset:0;border-radius:50%;background:var(--foret);border:3px solid var(--blanc);box-shadow:0 2px 8px rgba(25,54,41,.4)}
.gme::before{content:"";position:absolute;inset:-14px;border-radius:50%;background:var(--foret);opacity:.18;animation:pouls-gl 2.4s ease-out infinite}
.gme b{position:absolute;left:50%;top:22px;transform:translateX(-50%);font:700 12px var(--f-ui);color:var(--foret);white-space:nowrap;text-shadow:0 0 3px var(--map-halo),0 0 3px var(--map-halo),0 0 6px var(--map-halo)}
.gme.demo i{background:var(--sillon)}
.gme.demo::before{display:none}
@keyframes pouls-gl{0%{transform:scale(.3);opacity:.35}100%{transform:scale(1.4);opacity:0}}
/* Statut de localisation */
.geo{position:absolute;top:12px;left:12px;right:60px;display:flex;justify-content:flex-start;pointer-events:none;z-index:3}
.geo-chip{pointer-events:auto;display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:6px 6px 6px 12px;border-radius:var(--r-pill);background:var(--blanc);box-shadow:var(--ombre);font-size:.82rem;font-weight:600;color:var(--profond)}
.geo-chip .ic{color:var(--foret)}
.geo-chip.demo .ic{color:var(--terre-txt)}
.geo-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.geo-chip button{flex:none;border:0;border-radius:var(--r-pill);background:var(--menthe);color:var(--foret);font:700 12px var(--f-ui);padding:6px 12px;cursor:pointer}
.geo-chip button:hover{background:color-mix(in srgb,var(--menthe) 80%,var(--foret))}
.geo-chip.only{padding-right:12px}
.geo-far{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 0 14px;padding:12px 16px;border-radius:var(--r-l);background:var(--menthe);color:var(--profond);font-size:.92rem}
.geo-far[hidden]{display:none}
.geo-far .btn{min-height:38px;padding:8px 16px}
.map.pick-position,.map.pick-position canvas{cursor:crosshair!important}
/* Liste synchronisée */
.near{display:flex;flex-direction:column;gap:10px;min-width:0}
.near-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:.8rem;font-weight:700;color:var(--texte-2);text-transform:uppercase;letter-spacing:.05em}
.near-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
@media (max-width:959px){.near-list{grid-auto-flow:column;grid-auto-columns:min(78%,280px);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}.near-list>li{scroll-snap-align:start}.near{order:2}}
@media (min-width:960px){.near-list{max-height:520px;overflow-y:auto;padding-right:4px;scrollbar-width:thin}}
.near-item{width:100%;display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;text-align:left;padding:8px 12px 8px 8px;border-radius:var(--r-l);border:1px solid var(--bord);background:var(--blanc);cursor:pointer;transition:border-color .15s ease,background-color .15s ease}
.near-item:hover{border-color:var(--sauge)}
.near-item[aria-pressed="true"]{border-color:var(--terre-cuite);box-shadow:inset 0 0 0 1px var(--terre-cuite)}
.near-art{width:52px;height:52px;border-radius:var(--r-m);overflow:hidden}
.near-item b{display:block;font-family:var(--f-titre);font-weight:400;font-size:1.05rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.near-item small{display:block;font-size:.8rem;color:var(--texte-2)}
.near-item .km{font-size:.8rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--foret);background:var(--menthe);border-radius:var(--r-pill);padding:3px 9px;white-space:nowrap}
.near-item>span:nth-child(2){min-width:0}

/* =========================================================
   7. CONNEXION ET ESPACES UTILISATEURS
   ========================================================= */
.acct{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:4px 14px 4px 4px;border-radius:var(--r-pill);border:1px solid var(--bord);background:var(--blanc);text-decoration:none;font-weight:700;font-size:.86rem;color:var(--profond)}
.acct:hover{border-color:var(--sauge)}
.acct[aria-current="page"]{border-color:var(--foret)}
.acct .av{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--menthe);color:var(--foret);font:700 .8rem var(--f-ui)}
.acct .av .ic{width:18px;height:18px}
.acct.member .av{background:var(--foret);color:var(--sur-chou)}
@media (max-width:859px){.acct .lbl{display:none}.acct{padding:4px}}
.auth{display:grid;gap:20px;align-items:start;max-width:1080px;margin:0 auto}
@media (min-width:900px){.auth{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:32px}}
.auth .panel{padding:24px}
@media (min-width:900px){.auth .panel{padding:32px}}
.auth h1,.flow h1{font-size:clamp(2.4rem,5vw,3.6rem);margin-bottom:10px}
.flow{max-width:1080px;margin:0 auto}
.flow.slim{max-width:640px}
.side-green{background:var(--foret);color:var(--sur-chou);border-radius:var(--r-l);padding:28px;display:grid;gap:16px;align-content:start}
.side-green h2{color:inherit;font-size:clamp(1.6rem,3vw,2.1rem)}
.side-green p{opacity:.92}
.side-green .btn{background:var(--blanc);color:var(--foret);justify-self:start}
.side-green .btn:hover{background:var(--menthe)}
.side-green .link{color:inherit;justify-self:start}
.perks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.perks li{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;font-size:.95rem}
.perks .ic{width:18px;height:18px;padding:4px;border-radius:50%;background:color-mix(in srgb,currentColor 14%,transparent);box-sizing:content-box}
.pw-wrap{position:relative}
.pw-wrap .input{padding-right:100px}
.pw-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);border:0;background:var(--menthe);color:var(--foret);border-radius:var(--r-pill);font:700 12px var(--f-ui);padding:8px 12px;cursor:pointer}
.field .err:empty,.form>.err:empty{display:none}
.input[aria-invalid="true"]{border-color:var(--terre-txt)}
.form-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px}
.link{color:var(--foret);font-weight:700;text-underline-offset:3px;background:none;border:0;padding:0;cursor:pointer;font-size:inherit;text-decoration:underline}
.or{display:flex;align-items:center;gap:12px;color:var(--texte-2);font-size:.82rem;font-weight:700}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--bord)}
.note-demo{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--r-m);background:var(--sable);color:var(--texte-2);font-size:.84rem}
.note-demo .ic{color:var(--terre-txt);margin-top:1px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;cursor:pointer}
.check input{accent-color:var(--foret);width:18px;height:18px;margin:2px 0 0;flex:none}
/* Étapes */
.steps{list-style:none;display:flex;gap:6px;margin:0 0 22px;padding:0;counter-reset:st;flex-wrap:wrap}
.steps li{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:var(--r-pill);background:var(--blanc);border:1px solid var(--bord);font-size:.8rem;font-weight:700;color:var(--texte-2);counter-increment:st}
.steps li::before{content:counter(st);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--sable);font-size:.74rem}
.steps li[aria-current="step"]{border-color:var(--foret);color:var(--foret)}
.steps li[aria-current="step"]::before{background:var(--foret);color:var(--sur-chou)}
.steps li.done{color:var(--foret)}
.steps li.done::before{content:"✓";background:var(--menthe);color:var(--foret)}
/* Formules */
.plans{display:grid;gap:14px;margin:8px 0 24px;border:0;padding:0}
@media (min-width:760px){.plans{grid-template-columns:repeat(3,1fr)}}
.plan{position:relative}
.plan input{position:absolute;opacity:0}
.plan label{display:grid;gap:8px;align-content:start;height:100%;padding:22px;border-radius:var(--r-l);border:1px solid var(--bord);background:var(--blanc);cursor:pointer;transition:border-color .15s ease}
.plan label:hover{border-color:var(--sauge)}
.plan input:checked+label{border-color:var(--foret);box-shadow:inset 0 0 0 1.5px var(--foret);background:color-mix(in srgb,var(--menthe) 45%,var(--blanc))}
.plan input:focus-visible+label{outline:2.5px solid var(--foret);outline-offset:3px}
.plan .p-name{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--tampon)}
.plan .p-price{font-family:var(--f-titre);font-size:2.6rem;line-height:1;color:var(--profond)}
.plan .p-price small{font-family:var(--f-ui);font-size:.9rem;color:var(--texte-2)}
.plan .p-tag{position:absolute;top:16px;right:16px;font-size:.72rem;font-weight:700;padding:3px 10px;border-radius:var(--r-pill);background:var(--menthe);color:var(--foret)}
.plan p{font-size:.9rem;color:var(--texte-2)}
.faq{display:grid;gap:8px;margin-top:10px}
.faq details{background:var(--blanc);border:1px solid var(--bord);border-radius:var(--r-m);padding:14px 16px}
.faq summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:10px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--foret);font-size:1.2rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{margin-top:8px;color:var(--texte-2);font-size:.94rem}
.recap{display:grid;font-variant-numeric:tabular-nums}
.recap div{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--bord)}
.recap .tot{font-weight:700;font-size:1.1rem;border-bottom:0}
.flow-grid{display:grid;gap:20px;align-items:start}
@media (min-width:900px){.flow-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:28px}}
.flow-grid .panel{display:grid;gap:16px;padding:24px}
.pay-opt{display:grid;gap:8px}
/* Paywall */
.gate{display:grid;gap:12px;padding:20px;border-radius:var(--r-l);background:var(--blanc);border:1px solid var(--bord);box-shadow:var(--ombre-forte);margin-top:16px}
.gate-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--menthe);color:var(--foret)}
.gate h2{font-size:1.45rem}
.gate .btn{width:100%}
.gate p{color:var(--texte-2);font-size:.92rem}
.gate .price-hint{font-size:.82rem;font-weight:700;color:var(--foret)}
/* Carte d'adhérent */
.mcard{position:relative;overflow:hidden;border-radius:var(--r-l);padding:22px 24px;background:var(--foret);color:var(--sur-chou);display:grid;gap:18px;width:100%;max-width:440px;aspect-ratio:1.6;align-content:space-between;box-shadow:var(--ombre-forte)}
.mcard::after{content:"";position:absolute;right:-60px;bottom:-80px;width:240px;height:240px;border-radius:50%;border:28px solid color-mix(in srgb,var(--sur-chou) 9%,transparent);pointer-events:none}
.mcard .m-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.mcard .m-logo{font:760 1.7rem/1 Fraunces,Georgia,serif;letter-spacing:-.04em}
.mcard .m-kind{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:4px 10px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--sur-chou) 16%,transparent)}
.mcard .m-name{font-family:var(--f-titre);font-size:1.6rem;line-height:1.1}
.mcard .m-meta{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:.78rem;opacity:.92;font-variant-numeric:tabular-nums;position:relative;z-index:1}
.mcard .m-meta b{display:block;font-size:.95rem}
.mcard.off{background:var(--sillon)}
.mcard.standard{background:linear-gradient(145deg,#e9f2e3,#f4f1e6);color:#193629;border:1px solid #d5e2d1;box-shadow:var(--ombre)}
.mcard.standard::after{border-color:rgba(105,141,87,.16)}
.mcard.standard .m-kind{background:rgba(36,68,50,.13)}
.mcard.premium{background:radial-gradient(circle at 88% 10%,#527459 0%,#244432 37%,#193629 100%);color:#fffdf4;border:2px solid #c8ae72;box-shadow:0 18px 40px -16px rgba(25,54,41,.48)}
.mcard.premium::before{content:"";position:absolute;inset:9px;border:1px solid rgba(231,205,146,.52);border-radius:calc(var(--r-l) - 9px);pointer-events:none}
.mcard.premium::after{border-color:rgba(231,205,146,.13)}
.mcard.premium .m-kind{background:#d8bc7a;color:#193629}
.mcard .m-sub{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;margin-top:6px;color:#e7cf9b}
.mcard .m-pickup{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 14px;padding:10px 12px;border-radius:var(--r-m);background:color-mix(in srgb,currentColor 10%,transparent);font-size:.78rem}
.mcard .m-pickup strong{font-size:1.05rem;letter-spacing:.12em}
.mcard .m-meta{opacity:1}
.card-cta{justify-self:start}
.join-panel{display:grid;gap:18px;padding:28px}
.join-preview{display:flex;align-items:flex-start;gap:14px;padding:18px;border-radius:var(--r-m);background:var(--menthe)}
.join-preview>.ic,.join-preview>span .ic{width:28px;height:28px;color:var(--foret)}
.join-preview p{color:var(--texte-2);margin-top:5px}
.pickup-code{display:grid;gap:5px;margin-top:16px;padding:16px;border-radius:var(--r-m);background:var(--menthe)}
.pickup-code strong{font-size:1.55rem;letter-spacing:.12em}
.pickup-code small{color:var(--texte-2)}
.pickup-verify{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.pickup-verify label{width:100%;font-size:.78rem;font-weight:700}
.pickup-verify .input{width:160px;text-transform:uppercase;letter-spacing:.1em}
.status{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:700;padding:4px 12px;border-radius:var(--r-pill);background:var(--menthe);color:var(--foret);width:fit-content}
.status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.status.off{background:color-mix(in srgb,var(--terre-cuite) 12%,var(--blanc));color:var(--terre-txt)}
.dash{display:grid;gap:20px}
@media (min-width:900px){.dash{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}}
.dash .panel{display:grid;gap:14px}
.dash-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:24px}
.resa{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.resa li{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:12px 14px;border:1px solid var(--bord);border-radius:var(--r-m);font-size:.9rem;font-variant-numeric:tabular-nums}
.resa li small{grid-column:1/-1;color:var(--texte-2)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:.93rem;margin:0}
.kv dt{color:var(--texte-2)}
.kv dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.danger{color:var(--terre-txt);background:none;border:0;padding:0;font:700 .86rem var(--f-ui);cursor:pointer;text-decoration:underline;text-underline-offset:3px;justify-self:start}
.welcome{display:grid;gap:20px;justify-items:center;text-align:center;padding:12px 0 24px;max-width:640px;margin:0 auto}
.welcome .mcard{text-align:left}
.actions{display:flex;flex-wrap:wrap;gap:10px}

/* =========================================================
   8. ESPACE PRODUCTEUR : tableau de bord, commandes, stock
   ========================================================= */
.pro-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 20px;margin-bottom:18px}
.pro-head .prcard-type{margin-bottom:6px}
.pro-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 0 26px;padding:4px;border-radius:var(--r-pill);background:var(--blanc);border:1px solid var(--bord);width:fit-content;max-width:100%}
.pro-tabs::-webkit-scrollbar{display:none}
.pro-tabs .t-short{display:none}
@media (max-width:600px){
  .pro-tabs{display:grid;grid-template-columns:repeat(3,1fr);width:100%}
  .pro-tabs a{justify-content:center;padding:9px 8px}
  .pro-tabs .t-long{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .pro-tabs .t-short{display:inline}
}
.pro-tabs a{flex:none;display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:var(--r-pill);text-decoration:none;font-weight:700;font-size:.88rem;color:var(--texte-2)}
.pro-tabs a:hover{color:var(--profond);background:var(--menthe)}
.pro-tabs a[aria-current="page"]{background:var(--foret);color:var(--sur-chou)}
.pro-tabs .n{min-width:20px;height:20px;padding:0 6px;border-radius:var(--r-pill);background:var(--terre-cuite);color:var(--sur-terre);font-size:11px;line-height:20px;text-align:center}
.pro-tabs a[aria-current="page"] .n{background:var(--sur-chou);color:var(--foret)}
.grid-2{display:grid;gap:16px;margin-bottom:16px}
@media (min-width:960px){.grid-2{grid-template-columns:1.35fr 1fr;align-items:start}}
.panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.panel-head h2{margin:0}
.panel-head a{font-size:.86rem}
.sec-title{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin:34px 0 14px}
/* Créneaux à préparer */
.slot-group+.slot-group{margin-top:14px;padding-top:14px;border-top:1px solid var(--bord)}
.slot-group h3{font-family:var(--f-ui);font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--texte-2);margin-bottom:8px;display:flex;justify-content:space-between;gap:8px}
.ord-mini{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ord-mini li{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:9px 12px;border-radius:var(--r-m);background:var(--creme);font-size:.9rem}
.ord-mini .who{font-weight:700}
.ord-mini .what{color:var(--texte-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ord-mini .amt{font-weight:700;font-variant-numeric:tabular-nums}
/* Statuts : toujours libellés, jamais la couleur seule */
.st{display:inline-flex;align-items:center;gap:6px;font-size:.76rem;font-weight:700;padding:3px 10px;border-radius:var(--r-pill);white-space:nowrap;width:fit-content}
.st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.st-prep{background:color-mix(in srgb,var(--terre-cuite) 12%,var(--blanc));color:var(--terre-txt)}
.st-prete{background:var(--menthe);color:var(--foret)}
.st-retiree{background:var(--sable);color:var(--texte-2)}
.st-annulee{background:var(--sable);color:var(--texte-2);text-decoration:line-through}
/* Stock bas */
.low{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.low li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--r-m);border:1px solid var(--bord);font-size:.9rem}
.low li b{font-variant-numeric:tabular-nums}
.low .zero{color:var(--terre-txt)}
/* Indicateurs */
.kpis{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:960px){.kpis{grid-template-columns:1.5fr repeat(3,1fr)}}
.kpi{background:var(--blanc);border:1px solid var(--bord);border-radius:var(--r-l);padding:16px 18px;display:grid;gap:4px;align-content:start;min-width:0}
.kpi .k-lbl{font-size:.8rem;font-weight:700;color:var(--texte-2)}
.kpi .k-val{font-family:var(--f-ui);font-weight:700;font-size:clamp(1.5rem,3vw,1.9rem);line-height:1.15;color:var(--profond);letter-spacing:-.01em}
.kpi.hero{grid-column:1/-1}
@media (max-width:959px){.kpi:last-child{grid-column:1/-1}}
@media (min-width:960px){.kpi.hero{grid-column:auto}}
.kpi.hero .k-val{font-size:clamp(2.6rem,5vw,3.4rem)}
.kpi .k-sub{font-size:.8rem;color:var(--texte-2)}
.delta{display:inline-flex;align-items:center;gap:4px;font-size:.8rem;font-weight:700}
.delta.up{color:var(--foret)}
.delta.down{color:var(--terre-txt)}
.delta.flat{color:var(--texte-2)}
.charts{display:grid;gap:16px;margin-top:16px}
@media (min-width:960px){.charts{grid-template-columns:1.5fr 1fr;align-items:start}}
.chart-panel{display:grid;gap:10px}
.chart-panel h2{font-size:1.3rem}
.chart-sub{font-size:.84rem;color:var(--texte-2);margin-top:-4px}
.chart{position:relative;width:100%}
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.ch-grid{stroke:var(--bord);stroke-width:1}
.ch-base{stroke:var(--sillon);stroke-width:1}
.ch-tick{font:500 11px var(--f-ui);fill:var(--texte-2);font-variant-numeric:tabular-nums}
.ch-bar{fill:var(--foret);transition:opacity .12s ease}
.ch-bar.now{fill:var(--sauge)}
.chart.hovering .ch-bar{opacity:.45}
.chart.hovering .ch-bar.on{opacity:1}
.ch-hit{fill:transparent;cursor:default}
.ch-val{font:700 11px var(--f-ui);fill:var(--profond);font-variant-numeric:tabular-nums}
.ch-legend{display:flex;gap:14px;font-size:.78rem;color:var(--texte-2)}
.ch-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;background:var(--foret);margin-right:6px;vertical-align:-1px}
.ch-legend i.now{background:var(--sauge)}
.tip{position:fixed;z-index:70;pointer-events:none;background:var(--profond);color:var(--creme);padding:8px 12px;border-radius:var(--r-m);font-size:.82rem;line-height:1.35;box-shadow:var(--ombre-forte);opacity:0;transition:opacity .1s ease;max-width:240px}
.tip.on{opacity:1}
.tip b{display:block;font-size:.95rem;font-variant-numeric:tabular-nums}
.hbars{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.hbars li{display:grid;gap:5px}
.hbars .hb-top{display:flex;justify-content:space-between;gap:10px;font-size:.88rem}
.hbars .hb-top span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.hbars .hb-top span:last-child{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.hbars .hb{height:14px;border-radius:0 4px 4px 0;background:var(--foret);min-width:3px}
.data-table{margin-top:4px}
.data-table summary{cursor:pointer;font-size:.82rem;font-weight:700;color:var(--foret)}
.data-table table{width:100%;border-collapse:collapse;margin-top:8px;font-size:.84rem;font-variant-numeric:tabular-nums}
.data-table th,.data-table td{text-align:left;padding:6px 4px;border-bottom:1px solid var(--bord)}
.data-table td:last-child,.data-table th:last-child{text-align:right}
/* Liste des commandes */
.ord-list{display:grid;gap:12px}
.ord{background:var(--blanc);border:1px solid var(--bord);border-radius:var(--r-l);padding:16px 18px;display:grid;gap:10px}
.ord-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 14px}
.ord-top .code{font-weight:700;font-variant-numeric:tabular-nums}
.ord-meta{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:.86rem;color:var(--texte-2)}
.ord-meta span{display:inline-flex;align-items:center;gap:6px}
.ord-items{list-style:none;margin:0;padding:0;display:grid;gap:4px;font-size:.9rem}
.ord-items li{display:flex;justify-content:space-between;gap:10px;font-variant-numeric:tabular-nums}
.ord-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding-top:10px;border-top:1px solid var(--bord)}
.ord-foot .tot{font-weight:700;font-variant-numeric:tabular-nums}
.ord-foot .btn{min-height:40px;padding:8px 18px}
.ord .new{font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:var(--r-pill);background:var(--foret);color:var(--sur-chou)}
/* Stock */
.stock{width:100%;border-collapse:collapse;font-size:.9rem}
.stock th{text-align:left;font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--texte-2);padding:0 8px 8px}
.stock td{padding:10px 8px;border-top:1px solid var(--bord);vertical-align:middle;font-variant-numeric:tabular-nums}
.stock td:first-child{font-weight:600}
.stock .stepper button{width:36px;height:36px}
.stock .stepper output{min-width:30px;font-size:.95rem}
@media (max-width:700px){
  .stock thead{display:none}
  .stock tr{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:12px 0;border-top:1px solid var(--bord)}
  .stock td{border:0;padding:0}
  .stock td.c-state,.stock td.c-price{font-size:.84rem;color:var(--texte-2);font-weight:400}
  .stock td.c-stock{grid-row:1/3;grid-column:2;align-self:center}
}

/* Pied de page discret */
.site-foot{border-top:1px solid var(--bord);margin-top:24px}
.site-foot-in{max-width:1280px;margin:0 auto;padding:22px 18px calc(96px + env(safe-area-inset-bottom,0px));display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;font-size:.82rem;color:var(--texte-2)}
.site-foot b{font-family:Fraunces,Georgia,serif;font-weight:760;color:var(--foret)}
.site-foot nav{display:flex;flex-wrap:wrap;gap:6px 18px}
.site-foot a{color:var(--texte-2);text-underline-offset:3px}
.site-foot a:hover{color:var(--profond)}
@media (min-width:860px){.site-foot-in{padding:22px 32px 28px}}
main{padding-bottom:40px!important}
.pro-link{font-size:.84rem;color:var(--texte-2);text-align:center}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Les photos réelles prennent la place des gravures, qui restent le visuel de repli. */
.glane-photo{display:block;width:100%;height:100%;object-fit:cover}
.pr-hero .glane-photo{min-height:210px}
.glane-inline-form{display:grid;gap:14px}
.glane-inline-form .row2{align-items:end}
.glane-muted-box{background:var(--menthe);border:1px solid var(--bord);border-radius:var(--r-m);padding:16px;margin:16px 0}
.glane-order-grid{display:grid;gap:12px}
.glane-map{height:300px;border-radius:var(--r-m);overflow:hidden;background:var(--map-sol)}
.glane-availability{display:flex;align-items:center;gap:10px}
.glane-photo-input{max-width:160px;font-size:.78rem}


/* =========================================================
   ACCUEIL 2026-10-13 : en-tête texte + hero deux colonnes avec la carte Glane
   ========================================================= */
.eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--sauge);margin-bottom:12px}
.home-sec{margin-bottom:56px}
.home-sec .sec-head{align-items:flex-end}
.home-sec h2{font-size:clamp(1.9rem,3.6vw,2.6rem)}
.arrow-link{color:var(--profond);font-weight:700;font-size:.95rem;text-decoration:none;white-space:nowrap}
.arrow-link:hover{color:var(--sauge)}
.arrow-link span{display:inline-block;transition:transform .15s ease}
.arrow-link:hover span{transform:translateX(3px)}
.home-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:-4px 0 18px}


/* Accueil : accroche centrée, recherche, grande carte */
.home-hero{text-align:center;max-width:860px;margin:0 auto;padding:40px 0 44px}
@media (min-width:860px){.home-hero{padding:72px 0 64px}}
.home-hero h1{font-size:clamp(2.7rem,6.4vw,5rem);line-height:1.04;margin:0 auto 20px;max-width:15ch}
.home-hero .lede{margin:0 auto;max-width:46ch;font-size:1.08rem}
.home-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:28px}
.home-cta .btn{min-height:46px;padding:12px 22px}
.home-search{width:100%;max-width:640px;margin:32px auto 0;text-align:left;align-self:center}
.home-map-big{margin-bottom:64px}
.home-map-big .sec-head{align-items:flex-end}
.home-map-big h2,.home-sec h2{font-size:clamp(1.9rem,3.6vw,2.6rem)}
.home-map-big .map-frame{border-radius:var(--r-l);border:0;box-shadow:0 2px 6px rgba(25,54,41,.06),0 28px 56px -28px rgba(25,54,41,.38)}
.home-map-big .map-frame .map{height:min(70vh,460px)}
@media (min-width:960px){.home-map-big .map-frame .map{height:min(72vh,620px)}}
.home-map-big .geo-far{margin:0 0 14px}
@media (max-width:620px){.home-map-big .map-hint{display:none}}

/* Accueil : fruits et légumes en filigrane, en parallaxe */
#fruit-layer{position:absolute;left:0;width:100%;overflow:hidden;pointer-events:none;z-index:0}
#fruit-layer .hf{position:absolute;will-change:transform;filter:saturate(.7)}
main{position:relative;z-index:1}
:root[data-theme="dark"] #fruit-layer .hf{filter:saturate(.6) brightness(.9)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) #fruit-layer .hf{filter:saturate(.6) brightness(.9)}}
@media print{#fruit-layer{display:none}}


/* Accueil : premier écran plein, arrêt sur chaque partie au défilement */
.home-hero{min-height:calc(100svh - 90px);display:flex;flex-direction:column;justify-content:center;padding-top:24px;padding-bottom:48px}
@media (max-width:859px){.home-hero{min-height:calc(100svh - 150px)}}
.home-map-big{min-height:calc(100svh - 96px)}
@media (max-width:859px){.home-map-big{min-height:0}}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}


/* Accueil client connecté : mini tableau de bord */
.home-hero-member{max-width:1100px}
.home-hero-member h1{max-width:none}
.mdash{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:28px;text-align:left}
@media (min-width:900px){.mdash{grid-template-columns:repeat(4,minmax(0,1fr))}}
.mtile{display:grid;gap:2px;align-content:start;padding:16px 18px;border-radius:var(--r-l);background:var(--blanc);border:1px solid var(--bord);text-decoration:none;color:var(--profond);box-shadow:var(--ombre);transition:border-color .15s ease,transform .15s ease}
.mtile:hover{border-color:var(--sauge);transform:translateY(-2px)}
.mtile-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--menthe);color:var(--foret);margin-bottom:8px}
.mtile-ic .ic{width:18px;height:18px}
.mtile-lbl{font-size:.78rem;font-weight:700;color:var(--texte-2)}
.mtile-val{font-weight:700;font-size:1.35rem;line-height:1.2}
.mtile-sub{font-size:.8rem;color:var(--texte-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ready-banner{display:flex;align-items:center;gap:12px;margin:22px auto 0;padding:12px 18px;border-radius:var(--r-pill);background:var(--foret);color:var(--sur-chou);text-decoration:none;font-size:.92rem;text-align:left;max-width:640px;width:100%}
.ready-banner span:nth-child(2){flex:1}
.ready-banner .ic{flex:none}
@media (max-width:600px){.mtile{padding:14px}.mtile-val{font-size:1.08rem}.mtile-lbl{font-size:.74rem}}
