/* [fusion 0.60.2] Les tokens fixes vivaient dans assets/css/tokens.css : ils sont
   desormais ici, en tete de main.css, pour economiser une requete bloquante.
   C'est l'unique source. L'ancien fichier a ete archive en .fusionne-* pour
   eviter toute divergence ; le handle ms-tokens reste enregistre (sans src)
   afin que les dependances declarees ailleurs continuent de resoudre. */
/* Tokens fixes du design system.
   Les couleurs de categorie sont generees par inc/design-tokens.php
   depuis les champs ACF des termes categorie_pro. */

:root{
  --k0:#F5F9F8;--k1:#EAF1EE;--k2:#DBE7E3;--k3:#C0D1CB;
  --k4:#8FA49D;--k5:#63776F;--k6:#43524B;--k7:#26312B;--k8:#0F1512;
  --k-label:#5F7268;
  --lp:#0A3D38;--lm:#125A51;--lc:#7FD9C7;--l-tint:#EAF7F5;
  --co0:#FFF2EE;--co1:#FFD2C4;--co2:#FF9D80;--co3:#FF6F52;
  --co4:#CA412A;--co5:#B23621;--co6:#7A2415;
  --yl0:#FFF8E9;--yl3:#F2A93B;--yl4:#C98617;--yl5:#8F5E0F;
  --yl6:#64410A;
  --ok-bg:#ECFDF5;--ok-tx:#064E3B;--ok-br:#10B981;
  --er-bg:#FFF1F2;
  --er-tx:#B3261E;--er-dot:#D93025; /* etat ferme */
  --ok-solid:#0E7A45;--ok-edge:#BFEBD0;--ok-ink2:#0B5C39; /* statut verifie */
  --in-bg:#EEF4FF;--in-tx:#1E3A8A;--in-br:#3B82F6;
  --l-edge:#CDE8E2;--l-edge-soft:#C9E8E1;
  --in-edge:#C7DBFF;--in-ink2:#1E3A6E;
  --yl-edge:#F5DE9E;--yl-ink2:#6B4A0F;
  --wa-bg:#EAF9F0;--wa-edge:#BFEBD0;--wa-ink:#0E7A45;
  --r4:4px;--r8:8px;--r12:12px;--rp:9999px;
  --sh1:0 1px 3px rgba(10,61,56,.06);
  --sh2:0 4px 16px rgba(10,61,56,.08),0 1px 3px rgba(10,61,56,.05);
  --shf:0 0 0 3px rgba(202,65,42,.22);
  --wrap:1160px;
  --sp-xs:32px;--sp-sm:48px;--sp-md:64px;--sp-lg:88px;
  --hdr-h:62px;  /* référence du sticky de la barre de filtres */
  font-family:'Bricolage Grotesque',sans-serif;color:var(--k8);background:#fff;
  font-optical-sizing:auto;-webkit-font-smoothing:antialiased;
}

/* Mayotte Services - styles du theme.
   Ne jamais utiliser `padding` en raccourci sur un element portant .wrap :
   cela ecrase les gouttieres laterales. Utiliser padding-block / padding-inline. */

*{box-sizing:border-box;margin:0;padding:0}


:focus-visible{outline:2px solid var(--co4);outline-offset:2px;border-radius:3px}
/* Cibles de focus programmatique (titre d'etape, panneau, resume d'erreurs) :
   le focus est deplace par le script, pas par l'utilisateur. Le contour n'a rien
   a signaler ici, et les lecteurs d'ecran annoncent l'element sans lui. Les
   elements reellement focalisables gardent leur contour. */
[tabindex="-1"]:focus,[tabindex="-1"]:focus-visible{outline:none}
a{color:inherit;text-decoration:none}
svg{display:block}
h1,h2{text-wrap:balance}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* `hidden` doit toujours l'emporter : tout composant qui declare son
   propre display (grid, flex...) annulerait sinon le masquage, sans
   aucun signe visible dans le code. */
[hidden]{display:none !important}

.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--co4);color:#fff;font-weight:600;font-size:15.5px;padding:11px 18px;border-radius:0 0 var(--r8) 0}
.skip:focus{left:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:24px}
@media (min-width:1240px){.wrap{padding-inline:32px}}

.btn{font-family:inherit;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:transform .14s,background .14s;white-space:nowrap;letter-spacing:-.01em;border:none;text-decoration:none}
.btn i{font-size:16px}
.blg{font-size:16px;padding:10px 20px;border-radius:var(--r8)}
.bmd{font-size:15.5px;padding:9px 17px;border-radius:var(--r8)}
.bsm{font-size:14.5px;padding:7px 14px;border-radius:var(--r8)}
.solid{background:var(--co4);color:#fff;border:1.5px solid transparent}
.solid:hover{background:var(--co5);transform:translateY(-1px)}
.ghost{background:var(--k1);color:var(--k6);border:1.5px solid var(--k2)}
.ghost:hover{background:var(--k2);color:var(--k8)}
.outline{background:#fff;color:var(--k7);border:1.5px solid var(--k3)}
.outline:hover{background:var(--k0);border-color:var(--k5)}

.badge{display:inline-flex;align-items:center;gap:4px;font-size:13.5px;font-weight:600;padding:4px 9px;border-radius:var(--r4);border:1px solid transparent;white-space:nowrap}
.badge i{font-size:13.5px}
.badge.xs{font-size:12.5px;padding:3px 7px}
.b-verif{background:var(--ok-solid);color:#fff;border-color:transparent}
.b-revend{background:var(--k1);color:var(--k6);border-color:var(--k3)}
.b-partner{background:var(--yl0);color:var(--yl-ink2);border-color:var(--yl-edge)}
/* Le vert plein appartient au statut « verifie » : la disponibilite passe
   en neutre avec une pastille, sinon deux verts diraient deux choses. */
.b-dispo{background:#fff;color:var(--k6);border-color:var(--k3);font-weight:500}
.b-dispo::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--ok-br);flex:none}

/* HEADER */
.hdr{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--k2)}
.hdr-in{display:flex;align-items:center;min-height:var(--hdr-h);gap:18px}
.logo-t{font-size:18px;font-weight:700;color:var(--lp);letter-spacing:-.025em;white-space:nowrap}
.logo-t .accent{font-style:italic;font-weight:400;color:var(--co4)}
/* Le panneau doit pouvoir depasser l'en-tete : aucun overflow:hidden sur la
   chaine des parents, sinon les suggestions seraient coupees au ras de la
   barre. Le z-index reste interne au contexte d'empilement de .hdr. */
.hdr-search{flex:1;max-width:460px;position:relative}
.hdr,.hdr-in,.hs-form{overflow:visible}
.hs-form{display:flex;align-items:center;gap:6px;background:var(--k1);border:1.5px solid var(--k2);border-radius:var(--rp);padding:4px 5px 4px 13px}
.hs-form:focus-within{background:#fff;border-color:var(--co3);box-shadow:var(--shf)}
.hs-form>i{font-size:16px;color:var(--k-label);flex-shrink:0}
.hs-form input{font-family:inherit;font-size:16px;font-weight:500;border:none;outline:none;background:transparent;flex:1;min-width:0;color:var(--k8)}
.hs-form select{font-family:'DM Mono',monospace;font-size:12.5px;font-weight:500;border:none;outline:none;background:transparent;color:var(--k5);cursor:pointer;max-width:120px;border-left:1px solid var(--k3);padding-left:9px}
.hs-go{width:34px;height:34px;border-radius:50%;background:var(--co4);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:15.5px;flex-shrink:0}
/* Lien de confiance dans l'en-tete : un lien, pas un bouton. Le corail
   reste reserve a l'action principale, et il n'y en a qu'une par ecran. */
.hdr-conf{display:inline-flex;align-items:center;gap:6px;font-size:14.5px;font-weight:600;color:var(--k6);padding:7px 10px;border-radius:var(--r8);white-space:nowrap;transition:color .14s,background .14s}
.hdr-conf i{font-size:17px;color:var(--lm)}
.hdr-conf:hover,.hdr-conf[aria-current='page']{color:var(--lp);background:var(--l-tint)}
.hdr-right{margin-left:auto;display:flex;gap:8px}
.burger{display:none;width:38px;height:38px;border-radius:var(--r8);background:var(--k1);border:1.5px solid var(--k2);color:var(--k6);align-items:center;justify-content:center;font-size:20px;cursor:pointer;flex-shrink:0}

/* FIL + EN-TÊTE DE PAGE */
.crumb{display:flex;align-items:center;gap:7px;font-size:14px;color:var(--k-label);padding-block:16px;flex-wrap:wrap}
.crumb a:hover{color:var(--co5)}
.crumb i{font-size:14px;opacity:.5}
.crumb [aria-current]{color:var(--k7);font-weight:600}

.phead{padding-block:18px 26px;border-bottom:1px solid var(--k2)}
.phead-in{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.phead h1{font-size:clamp(28px,4.2vw,42px);font-weight:700;letter-spacing:-.04em;line-height:1.02;margin-bottom:10px}
.phead h1 .ink{color:var(--cat-ink)}
.pcount{font-size:16px;color:var(--k5);line-height:1.6;max-width:640px}
.pcount b{color:var(--k8);font-weight:600}
.phead-cat{display:inline-flex;align-items:center;gap:8px;background:var(--cat-surface);border:1px solid var(--cat-edge);color:var(--cat-ink);border-radius:var(--rp);padding:5px 14px 5px 6px;font-size:14.5px;font-weight:600;margin-bottom:14px}
.phead-cat span{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.75);display:flex;align-items:center;justify-content:center;font-size:15.5px}

/* BARRE DE FILTRES */
.fbar{position:sticky;top:var(--hdr-h);z-index:40;background:#fff;border-bottom:1px solid var(--k2)}
.fbar-in{display:flex;align-items:center;gap:10px;padding-block:12px;flex-wrap:wrap}
.fchip{display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:14.5px;font-weight:600;padding:0 14px;border-radius:var(--rp);border:1.5px solid var(--k2);background:#fff;color:var(--k6);cursor:pointer;transition:background .14s,border-color .14s,color .14s;box-sizing:border-box;height:38px;line-height:1;flex:0 0 auto;white-space:nowrap}
.fchip i{font-size:15.5px;line-height:1;flex:none}
.fchip:hover{border-color:var(--k4);background:var(--k0)}
.fchip[aria-pressed="true"]{background:var(--co0);border-color:var(--co2);color:var(--co5)}
.fchip .n{font-family:'DM Mono',monospace;font-size:12px;line-height:1;color:var(--k-label);font-variant-numeric:tabular-nums;min-width:10px;text-align:center;flex:none}
.fchip[aria-pressed="true"] .n{color:var(--co5)}
.fbar-sep{width:1px;height:24px;background:var(--k2)}
.fsort{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:14.5px;color:var(--k5)}
.fsort button{font-family:inherit;font-size:14.5px;font-weight:600;color:var(--k7);background:none;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;padding:6px 8px;border-radius:var(--r8);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}
.fsort button:hover{background:var(--k0);color:var(--co5)}

/* EXPLICATION DU CLASSEMENT */
.rcount{display:flex;align-items:center;gap:12px;margin:22px 0 0;font-size:14.5px;color:var(--k5)}
.rcount span{font-weight:600;color:var(--k8)}
.rcount button{display:inline-flex;align-items:center;gap:5px;font-family:inherit;font-size:14px;font-weight:600;color:var(--co5);background:var(--co0);border:1px solid var(--co1);border-radius:var(--rp);padding:5px 12px;cursor:pointer;min-height:32px}
.rcount button:hover{background:var(--co1)}
/* A zero : opacite seule, jamais de propriete de boite — sinon les puces
   ne s'alignent plus selon la valeur qu'elles affichent. Classe dediee :
   `.empty` est le bloc d'etat vide, pas un etat de puce. */
.fchip-zero{opacity:.42}
.nofilter{text-align:center;padding:44px 24px 40px;border:1px dashed var(--k3);border-radius:var(--r12);background:var(--k0);margin-bottom:8px}
.nofilter h2{font-size:22px;font-weight:700;letter-spacing:-.03em;margin-bottom:10px}
.nofilter p{font-size:15.5px;color:var(--k5);line-height:1.65;max-width:480px;margin:0 auto 20px}
.rank{display:flex;gap:12px;align-items:flex-start;background:var(--l-tint);border:1px solid var(--l-edge);border-radius:var(--r12);padding:14px 16px;margin:22px 0 24px}
.rank-ico{width:34px;height:34px;border-radius:var(--r8);background:#fff;color:var(--lm);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;border:1px solid var(--l-edge)}
.rank-t{font-size:14.5px;font-weight:600;color:var(--lp);margin-bottom:3px}
.rank-x{font-size:14.5px;color:#3C6660;line-height:1.55}
.rank-x a{color:var(--co5);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.rank-close{margin-left:auto;background:none;border:none;color:#3C6660;cursor:pointer;font-size:16px;padding:4px;border-radius:var(--r4);flex-shrink:0}
.rank-close:hover{background:#fff}

/* GROUPES DE RÉSULTATS */
.rgroup{margin-bottom:30px}
.rgroup-h{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.rgroup-h h2{font-size:17px;font-weight:700;letter-spacing:-.02em;color:var(--k8)}
.rgroup-h .n{font-family:'DM Mono',monospace;font-size:13px;color:var(--k-label);background:var(--k1);border-radius:var(--rp);padding:2px 9px}
.rgroup-x{font-size:14.5px;color:var(--k5);line-height:1.55;margin-bottom:16px;max-width:640px}

/* FICHE EN LISTE */
.plist{display:flex;flex-direction:column;gap:10px}
.pcard{display:grid;grid-template-columns:auto 1fr auto;gap:16px;background:#fff;border:1px solid var(--k2);border-radius:var(--r12);padding:16px 18px;transition:border-color .16s,box-shadow .16s}
.pcard:hover{border-color:var(--cat-edge);box-shadow:var(--sh2)}
.pav{width:120px;height:90px;border-radius:var(--r8);background:linear-gradient(135deg,var(--cat-surface),var(--cat-deep));color:var(--cat-ink);display:flex;align-items:center;justify-content:center;font-family:'DM Mono',monospace;font-size:19px;font-weight:500;flex-shrink:0;border:1px solid var(--cat-edge);overflow:hidden}
/* Image a la une : elle remplace le degrade et les initiales */
.pav-img{background:#fff;border-color:var(--k2)}
.pav-img img{width:100%;height:100%;object-fit:cover;display:block}
.pcard.unclaimed .pav.pav-img{background:#fff;border-color:var(--k2)}
.pbody{min-width:0}
.pname{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:5px}
.pname h3{font-size:18px;font-weight:700;letter-spacing:-.025em;color:var(--k8);line-height:1.2}
.pmeta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:14px;color:var(--k5);margin-bottom:9px}
.pmeta span{display:flex;align-items:center;gap:5px}
.pmeta i{font-size:14.5px;color:var(--k4)}
.pmeta b{color:var(--k7);font-weight:600}
.ptags{display:flex;gap:5px;flex-wrap:wrap}
.ptag{font-size:13.5px;color:var(--k6);background:var(--k0);border:1px solid var(--k2);border-radius:var(--r4);padding:3px 8px}
.pacts{display:flex;flex-direction:column;gap:7px;align-items:stretch;justify-content:center;min-width:158px;max-width:210px}
.pacts .btn{justify-content:center;width:100%}
/* Fiche non revendiquee : la mention est un rappel, pas une action */
.pmine{font-size:12.5px;line-height:1.45;color:var(--k-label);text-align:center;margin-top:2px}
.pmine a{display:block;color:var(--co5);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.pwa{background:var(--wa-bg);color:var(--wa-ink);border:1.5px solid var(--wa-edge)}
.pwa:hover{background:#DDF3E6}
.pcall{background:#fff;color:var(--k7);border:1.5px solid var(--k3)}
.pcall:hover{background:var(--k0)}
/* Ce que la fiche ne dit pas est aussi une information */
.pcard.solo{padding:22px 24px}
.pcard.solo .pav{width:148px;height:111px;font-size:24px}
.pcard.solo .pname h3{font-size:21px}
.pdesc{font-size:15px;color:var(--k6);line-height:1.6;margin-bottom:11px;max-width:620px}
.thin a{color:var(--co5);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.thin.st-reel{margin-top:14px}
.pgap{display:flex;align-items:flex-start;gap:6px;font-size:13.5px;color:var(--k-label);margin-top:8px;line-height:1.5}
/* Détail des trois vérifications (verif_identite / verif_telephone / verif_siret) */
.vchk{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.vchk span{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--ok-tx);background:var(--ok-bg);border:1px solid rgba(16,185,129,.22);border-radius:var(--r4);padding:3px 8px}
.vchk span i{font-size:13.5px}
.vchk span.off{color:var(--k-label);background:var(--k0);border-color:var(--k2);font-weight:500}
/* Fiche créée par nos soins, pas encore revendiquée */
.pcard.unclaimed{background:var(--k0);border-style:dashed}
.pcard.unclaimed .pav{background:var(--k1);color:var(--k5);border-color:var(--k2)}
.claim{display:flex;align-items:flex-start;gap:9px;background:#fff;border:1px solid var(--k2);border-radius:var(--r8);padding:10px 12px;margin-top:10px;font-size:13.5px;color:var(--k6);line-height:1.5}
.claim i{font-size:16px;color:var(--k5);flex-shrink:0;margin-top:1px}
.claim a{color:var(--co5);font-weight:600;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.b-unclaimed{background:var(--k0);color:var(--k-label);border-color:var(--k3);border-style:dashed}
/* Horaires : dérivés du répéteur `horaires` */
.phours{display:inline-flex;align-items:center;gap:5px}
/* L'etat d'ouverture se lit a la couleur du texte : vert ouvert,
   rouge ferme. Le badge de confiance, lui, reste un aplat plein —
   les deux ne peuvent pas etre confondus. */
.phours.open{color:var(--ok-solid);font-weight:600}
.phours.open i{color:var(--ok-br)}
.phours.shut{color:var(--er-tx);font-weight:600}
.phours.shut i{color:var(--er-dot)}
.pgap i{font-size:14.5px;color:var(--k4)}

/* ÉTAT MAIGRE / VIDE */
.thin{background:var(--yl0);border:1px solid var(--yl-edge);border-radius:var(--r12);padding:18px 20px;display:flex;gap:14px;align-items:flex-start;margin-top:8px}
.thin-ico{width:38px;height:38px;border-radius:var(--r8);background:#FCEBC0;color:var(--yl4);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.thin-t{font-size:15.5px;font-weight:600;color:var(--yl-ink2);margin-bottom:4px}
.thin-x{font-size:14.5px;color:#6B4A0F;line-height:1.6}

.empty{text-align:center;padding:48px 24px 40px;border:1px dashed var(--k3);border-radius:var(--r12);background:var(--k0)}
.empty-ico{width:64px;height:64px;border-radius:50%;background:#fff;border:1px solid var(--k2);color:var(--k4);display:flex;align-items:center;justify-content:center;font-size:30px;margin:0 auto 18px}
.empty h2{font-size:24px;font-weight:700;letter-spacing:-.03em;margin-bottom:10px}
.empty p{font-size:15.5px;color:var(--k5);line-height:1.65;max-width:520px;margin:0 auto 22px}
.empty-acts{display:flex;gap:9px;justify-content:center;flex-wrap:wrap}

/* AILLEURS */
.elsewhere{margin-top:44px;padding-top:40px;border-top:1px solid var(--k2)}
.elsewhere h2{font-size:17px;font-weight:700;letter-spacing:-.02em;margin-bottom:7px}
.elsewhere p{font-size:14.5px;color:var(--k5);line-height:1.55;margin-bottom:16px;max-width:620px}
.near{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.nearc{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--k2);border-radius:var(--r12);padding:13px 15px;transition:border-color .16s}
.nearc:hover{border-color:var(--co2)}
.nearc-ico{width:36px;height:36px;border-radius:var(--r8);background:var(--l-tint);color:var(--lm);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}
.nearc-n{font-size:15.5px;font-weight:600;letter-spacing:-.01em;margin-bottom:1px}
.nearc-x{font-family:'DM Mono',monospace;font-size:12.5px;color:var(--k-label)}
.otherc{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}
/* Dernier bloc du <main> avant la bande SEO : il doit respirer */
.elsewhere{padding-bottom:var(--sp-sm)}
.otherc a{display:inline-flex;align-items:center;gap:7px;font-size:14.5px;font-weight:600;background:var(--cat-surface);border:1px solid var(--cat-edge);color:var(--cat-ink);border-radius:var(--rp);padding:7px 14px}

/* SEO */
.seo{background:var(--k0);border-top:1px solid var(--k2);padding:var(--sp-sm) 0}
.seo-in{max-width:720px}
.seo h2{font-size:19px;font-weight:700;letter-spacing:-.025em;margin-bottom:12px}
.seo p{font-size:15px;color:var(--k6);line-height:1.72;margin-bottom:13px}
.seo p:last-child{margin-bottom:0}

/* CTA PRO */
.propush{background:var(--lp);color:#fff;padding:var(--sp-sm) 0}
.propush-in{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.propush-c{flex:1;min-width:280px}
.propush-ew{font-family:'DM Mono',monospace;font-size:12.5px;font-weight:500;letter-spacing:.17em;text-transform:uppercase;color:var(--lc);margin-bottom:9px}
.propush h2{font-size:clamp(20px,2.6vw,26px);font-weight:700;letter-spacing:-.035em;line-height:1.12;margin-bottom:9px}
.propush p{font-size:15px;color:rgba(255,255,255,.78);line-height:1.6;max-width:520px}

/* FOOTER */
.ftr{background:var(--lp);color:#DCEDE9;padding:var(--sp-sm) 0 26px;border-top:1px solid rgba(255,255,255,.12)}
.ftr .logo-t{color:#fff}.ftr .logo-t .accent{color:var(--co2)}
.ftr-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,.14)}
.ftr-h{font-family:'DM Mono',monospace;font-size:12px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--lc);margin-bottom:12px}
.ftr-l{display:block;font-size:14.5px;color:rgba(255,255,255,.78);padding:5px 0}
.ftr-l:hover{color:#fff}
.ftr-about{font-size:14.5px;color:rgba(255,255,255,.66);line-height:1.65;margin-top:12px;max-width:290px}
.ftr-bot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:18px}
.ftr-meta{font-family:'DM Mono',monospace;font-size:13px;color:rgba(255,255,255,.55)}

@media (max-width:900px){
  .near{grid-template-columns:1fr}
  .ftr-grid{grid-template-columns:1fr 1fr}
  .pcard{grid-template-columns:auto 1fr;gap:14px}
  .pacts{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:center;min-width:0;max-width:none}
  .pacts .btn{flex:1}
  .pmine{flex-basis:100%;text-align:left;margin-top:0}
  .pmine a{display:inline;margin-left:3px}
}
@media (max-width:720px){
  :root{--hdr-h:106px}          /* deux lignes : logo + recherche */
  .hdr-right{display:none}
  .burger{display:flex;margin-left:auto}
  .hdr-in{gap:10px;flex-wrap:wrap;padding-block:10px}
  .logo-t{font-size:16px}
  .hdr-search{order:3;flex-basis:100%;max-width:none}
  .hs-form select{display:none}
  .fbar-sep,.fsort{display:none}
  .fbar-in{overflow-x:auto;flex-wrap:nowrap;padding-bottom:12px;scrollbar-width:none}
  .fbar-in::-webkit-scrollbar{display:none}
  .fchip{flex-shrink:0}
  .ftr-grid{grid-template-columns:1fr}
  .pcard{grid-template-columns:1fr;gap:12px}
  .pav{width:104px;height:78px;font-size:18px}
}

/* ══ MENU LATÉRAL MOBILE ══
   Le balisage vit dans footer.php, à la racine du <body> et non dans l'en-tête :
   le backdrop-filter de .hdr crée un contexte d'empilement qui piège tout
   position:fixed placé à l'intérieur. Le panneau reste hors du flux en
   permanence (transform + visibility) et n'entre qu'à l'ouverture. */
.mnav-back{position:fixed;inset:0;background:rgba(15,21,18,.42);opacity:0;visibility:hidden;transition:opacity .22s,visibility .22s;z-index:95}
.mnav-back.open{opacity:1;visibility:visible}
.mnav{position:fixed;top:0;right:0;bottom:0;width:min(340px,86vw);background:#fff;z-index:100;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .26s cubic-bezier(.4,0,.2,1);box-shadow:-8px 0 32px rgba(10,61,56,.16);visibility:hidden}
.mnav.open{transform:translateX(0);visibility:visible}
.mnav-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--k2);flex-shrink:0}
.mnav-close{width:36px;height:36px;border-radius:var(--r8);background:var(--k1);border:1.5px solid var(--k2);color:var(--k6);display:flex;align-items:center;justify-content:center;font-size:19px;cursor:pointer}
/* Recherche du tiroir. Elle ne defile pas avec la liste : le panneau de
   suggestions doit pouvoir la recouvrir sans etre coupe. */
.mnav-search{position:relative;flex-shrink:0;padding:12px 18px 14px;border-bottom:1px solid var(--k2);background:#fff;z-index:2}
.mnav-search .sugg{left:18px;right:18px;top:calc(100% - 2px)}

.mnav-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:6px 18px 18px}
.mnav-h{font-family:'DM Mono',monospace;font-size:12px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--k-label);padding:18px 0 6px}
.mnav-l{display:flex;align-items:center;gap:11px;padding:11px 0;font-size:16px;font-weight:600;color:var(--k7);border-bottom:1px solid var(--k1)}
.mnav-l i{font-size:19px;color:var(--k5);width:22px;text-align:center;flex-shrink:0}
.mnav-l:hover{color:var(--co5)}
.mnav-l[aria-current="page"]{color:var(--co5)}
.mnav-dot{width:22px;display:flex;justify-content:center;flex-shrink:0}
.mnav-dot span{width:9px;height:9px;border-radius:3px;background:var(--cat-ink,var(--k4))}
.mnav-c{margin-left:auto;font-family:'DM Mono',monospace;font-size:12px;color:var(--k-label)}
.mnav-foot{flex-shrink:0;border-top:1px solid var(--k2);background:var(--k0);padding:14px 18px;display:flex;flex-direction:column;gap:8px}
.mnav-foot .btn{width:100%;justify-content:center}

/* ── PANNEAU DE SUGGESTIONS ─────────────────────────────────────
   Partagé par la recherche du hero et celle de l'en-tête. Il vivait dans
   accueil.css tant qu'il n'existait qu'à l'accueil ; il est global depuis
   que l'en-tête le porte sur toutes les pages. */

.sugg{position:absolute;top:calc(100% + 12px);left:0;right:0;background:#fff;border:1px solid var(--k2);border-radius:var(--r12);box-shadow:0 12px 32px rgba(10,61,56,.16);padding:6px;z-index:60;max-height:330px;overflow-y:auto;display:none}
.sugg.open{display:block}
.sugg-h{font-family:'DM Mono',monospace;font-size:12px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--k-label);padding:9px 10px 5px}
.sugg-i{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:var(--r8);cursor:pointer;list-style:none}
.sugg-i:hover,.sugg-i.hi{background:var(--k0)}
.sugg-ico{width:32px;height:32px;border-radius:var(--r8);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.sugg-txt{min-width:0;flex:1;display:flex;flex-direction:column;gap:3px}
.sugg-l{display:block;font-size:15px;font-weight:600;color:var(--k8);line-height:1.25}
.sugg-l mark{background:var(--co0);color:var(--co5);padding:0 1px;border-radius:2px}
.sugg-s{display:block;font-size:13.5px;color:var(--k5);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sugg-k{font-family:'DM Mono',monospace;font-size:12px;color:var(--k-label);border:1px solid var(--k2);border-radius:var(--r4);padding:1px 5px;flex-shrink:0}
.sugg-empty{padding:14px 10px;font-size:14.5px;color:var(--k5);line-height:1.6}
.sugg-empty b{color:var(--k8)}

@media (max-width:760px){
  .sugg{max-height:58vh}
}

/* Coordonnees directes en pied de page, premiere colonne.
   Pas de lien vers la page contact ici : il vit dans la colonne
   « La plateforme ». Ce bloc ne porte que ce qui se recopie, d'ou
   le DM Mono sur les valeurs. */
.ftr-contact{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.14)}
.ftr-cl{display:flex;align-items:center;gap:9px;font-size:14.5px;font-weight:600;color:rgba(255,255,255,.86);padding:7px 0;transition:color .14s}
.ftr-cl:hover{color:#fff}
.ftr-cl i{font-size:16px;color:var(--lc);flex:none}
.ftr-cv{font-family:'DM Mono',monospace;font-size:13.5px;font-weight:400;letter-spacing:-.01em;word-break:break-word}
/* Adresse dans le tiroir mobile : meme logique, taille reduite pour tenir
   sur une ligne a 340 px de large. */
.mnav-mail{font-family:'DM Mono',monospace;font-size:14px;font-weight:400;letter-spacing:-.02em;word-break:break-all}

/* \u2500\u2500 Demande multiple \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
   Volontairement discret : bordure et fond neutre, bouton fantome. Ce bloc
   ne doit jamais concurrencer visuellement le choix d'un professionnel. */
.cta-multi{border:0;border-top:1px solid var(--k2);border-radius:0;background:var(--k0);padding:18px 20px;margin-top:26px}
.cta-multi-t{font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--k8);line-height:1.3}
.cta-multi-x{font-size:14.5px;line-height:1.6;color:var(--k6);margin:6px 0 14px}
.cta-multi--fiche{margin-top:16px;padding:15px 17px}
.cta-multi--fiche .cta-multi-t{font-size:15px}
.cta-multi--fiche .cta-multi-x{font-size:14px;margin-bottom:12px}

/* Accueil : une phrase, pas un appel a l'action concurrent. */
.hero-alt{margin-top:14px;font-size:14.5px;line-height:1.6;color:var(--k5)}
.hero-alt a{color:var(--co5);font-weight:600;border-bottom:1px solid var(--co1)}

/* Texte reserve aux lecteurs d'ecran. Retire du flux sans etre masque :
   display:none le rendrait invisible aux technologies d'assistance aussi. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ------------------------------------------------------------------
   Texte reserve aux lecteurs d'ecran.
   La classe etait utilisee dans les gabarits (fiche, header, footer)
   sans etre stylee ailleurs que dans 404.css : le libelle des icones
   sortait donc en clair et se superposait au contenu.
   ------------------------------------------------------------------ */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.screen-reader-text:focus {
	z-index: 100000;
	top: 8px;
	left: 8px;
	width: auto;
	height: auto;
	padding: 12px 20px;
	margin: 0;
	clip-path: none;
	background: var(--ms-lagon, #0A3D38);
	color: #fff;
	font-size: 0.95rem;
	text-decoration: none;
	border-radius: 6px;
}
/* ════════ FICHE EN CARTE ════════
   Meme balisage que la vue liste : seules la disposition et trois blocs
   propres a la carte changent. auto-fill + minmax donne trois colonnes a
   1160px, deux vers 900, une seule sous 660, sans requete media a tenir. */
.plist.vue-cartes{display:grid;grid-template-columns:repeat(auto-fill,minmax(318px,1fr));gap:14px;align-items:stretch}
@media (max-width:660px){.plist.vue-cartes{grid-template-columns:1fr}}


/* Le lien du nom couvre toute la carte ; les boutons repassent au-dessus. */
.pcard.vue-carte .pname h3 a::after{content:'';position:absolute;inset:0;z-index:0;border-radius:var(--r12)}
.pcard.vue-carte .btn,.pcard.vue-carte .pmine,.pcard.vue-carte .pv{position:relative;z-index:1}
.pcard.vue-carte:focus-within{box-shadow:var(--shf)}
/* Hors zone d'intervention : la carte reste lisible mais cesse de reclamer le clic. */
.pcard.vue-carte.far{background:var(--k0)}
.pcard.vue-carte.far .pav{filter:grayscale(.35)}


.pcard.vue-carte .pbody{padding:13px 16px;display:flex;flex-direction:column;gap:9px;flex:1;min-width:0}
.pcard.vue-carte .pname{margin-bottom:0}
.pcard.vue-carte .pname h3{font-size:17.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcard.vue-carte .pmeta{flex-direction:column;align-items:flex-start;gap:5px;font-size:13px;margin-bottom:0}
.pcard.vue-carte .pmeta span{align-items:flex-start}
.pcard.vue-carte .ptag{font-size:12.5px}
.pcard.vue-carte .ptag.more{color:var(--k-label);border-style:dashed}

/* Ligne de couverture : la phrase qui decide du clic. Elle repond a
   « est-ce qu'il vient chez moi », pas a « ou est-il installe ». */
.pcov{display:flex;align-items:flex-start;gap:8px;padding:9px 11px;border-radius:var(--r8);font-size:13.5px;line-height:1.4;background:var(--k0);border:1px solid var(--k2);color:var(--k6);margin:0}
.pcov i{font-size:16px;color:var(--k4);flex:none;margin-top:1px}
.pcov b{color:var(--k8);font-weight:600}
.pcov.here{background:var(--l-tint);border-color:var(--l-edge);color:var(--lp)}
.pcov.here i{color:var(--lm)}
.pcov.away{background:#fff;border-style:dashed;border-color:var(--k3);color:var(--k5)}
.pcard.unclaimed .pcov{background:#fff}

/* Verifications : une jauge a trois segments plutot que trois etiquettes.
   Le decompte est ecrit et ce qui manque est nomme — rien n'est masque,
   mais la grille economise douze pastilles grises. */
.pv{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--k6);margin:0}
.pv-bar{display:flex;gap:3px;flex:none}
.pv-seg{width:16px;height:5px;border-radius:var(--rp);background:var(--k2)}
.pv-seg.on{background:var(--ok-solid,#0E7A45)}
.pv-n{font-weight:600;color:var(--k7);white-space:nowrap}
.pv-x{color:var(--k-label);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv.full .pv-n{color:var(--ok-ink2,#0B5C39)}
.pv.none .pv-n{color:var(--k-label);font-weight:500}

.pcard.vue-carte .pacts{flex-direction:row;flex-wrap:wrap;gap:7px;padding:12px 16px 14px;border-top:1px solid var(--k2);margin-top:auto;min-width:0;max-width:none}
.pcard.vue-carte.unclaimed .pacts{border-top-style:dashed;border-color:var(--k3)}
.pcard.vue-carte .pacts .btn{flex:1 1 44%;min-height:42px;width:auto}
.pcard.vue-carte .pmine{flex-basis:100%;margin-top:2px}
/* Devis : action principale sur une fiche que personne n'a revendiquee. */
.pdev{background:var(--co0);color:var(--co5);border:1.5px solid var(--co1)}
.pdev:hover{background:#FFE7E0;border-color:var(--co2)}
/* ──── CORRECTIFS CARTE ────
   Le gabarit liste aligne le nom et le badge sur une ligne ; en carte,
   une raison sociale longue repoussait le badge hors du regard. */
.pcard.vue-carte .pname{flex-direction:column;align-items:flex-start;gap:6px}

/* L'avertissement d'une fiche non revendiquee etait un texte gris sans
   cadre : lisible dans une ligne large, invisible dans une carte de
   318px. Il devient un bloc, au meme niveau que la ligne de couverture. */
.pcard.vue-carte .pgap{background:#fff;border:1px dashed var(--k3);border-radius:var(--r8);padding:9px 11px;margin:0;font-size:13px;color:var(--k5)}
.pcard.vue-carte .pgap i{color:var(--k-label);margin-top:1px}

/* Deux boutons cote a cote seulement quand les deux libelles sont courts.
   « Demander un devis » ne tient pas a 44% d'une carte : sur les fiches
   non revendiquees, les actions s'empilent. */
.pcard.vue-carte .pacts .btn{flex:1 1 0;min-width:0;padding-inline:12px}

/* ──── CORRECTIFS CARTE v2 ────
   Deux boutons de meme taille sur une ligne, toujours : « Appeler » avec
   « Devis », « WhatsApp » avec « Appeler ». Aucun libelle long ne vient
   plus casser la rangee. */
.pcard.vue-carte .pacts{align-items:stretch}
.pcard.vue-carte .pacts .btn{flex:1 1 0;min-width:0}

/* La revendication est une mention de bas de carte, pas une action :
   une seule ligne, sous les boutons, sans concurrencer le corail. */
.pcard.vue-carte .pmine{flex-basis:100%;margin:2px 0 0;font-size:12.5px;text-align:center;line-height:1.4}
.pcard.vue-carte .pmine a{color:var(--k5);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;font-weight:500}
.pcard.vue-carte .pmine a:hover{color:var(--co5);text-decoration-style:solid}
/* ──── PASTILLE LOGO ────
   Une bande photo pleine largeur donnait un avantage visuel massif aux
   fiches qui ont une image, dans une liste ou l'on promet qu'aucune
   position ne s'achete. La pastille remet tout le monde au meme rang :
   logo s'il existe, initiales sinon. */
.pcard.vue-carte{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:1fr auto;gap:0;padding:0;overflow:hidden;position:relative}
.pcard.vue-carte .pav{width:48px;height:48px;margin:15px 0 0 16px;border-radius:var(--r12);border:1px solid var(--cat-edge);font-size:17px;align-self:start}
/* Un logo se lit entier : on le contient au lieu de le rogner. Une photo
   de facade, elle, remplit la pastille. */
.pcard.vue-carte .pav.pav-img{padding:4px}
.pcard.vue-carte .pav.pav-img img{object-fit:contain}
.pcard.vue-carte .pbody{grid-column:2;padding:14px 16px 12px 12px}
.pcard.vue-carte .pacts{grid-column:1/-1}
/* Mention d'ordre : discrete, mais au-dessus des resultats qu'elle decrit. */
.rorder{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--k5);line-height:1.55;background:var(--k0);border:1px solid var(--k2);border-radius:var(--r8);padding:10px 13px;margin:0 0 18px;max-width:780px}
.rorder i{font-size:16px;color:var(--lm);flex:none;margin-top:1px}
.rorder b{color:var(--k7);font-weight:600}