/* =====================================================================
   PRESTA'CONNECT — Mise en relation avec des artisans et professionnels
   Direction artistique : plateforme de confiance, sobre et rassurante.
   Navy profond + orange signal (repris du logo), cartes arrondies,
   typographie géométrique moderne.
   ===================================================================== */

/* Polices embarquées (fonctionne hors ligne, dans les applications) */
@font-face{font-family:'Sora';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/sora-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Sora';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/sora-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Sora';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/sora-latin-700-normal.woff2') format('woff2');}
@font-face{font-family:'Sora';font-style:normal;font-weight:800;font-display:swap;src:url('../assets/fonts/sora-latin-800-normal.woff2') format('woff2');}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/work-sans-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/work-sans-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/work-sans-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/work-sans-latin-700-normal.woff2') format('woff2');}


:root{
  --navy: #152447;
  --navy-deep: #0d1830;
  --navy-soft: #445071;
  --orange: #f0812f;
  --orange-deep: #d1671c;
  --paper: #f5f7fb;
  --paper-deep: #eaeef6;
  --line: #dbe1ee;
  --panel-bg: #ffffff;
  --ink: #1b2333;
  --ink-soft: #5b6478;
  --success: #2f9e6e;
  --shadow: 0 10px 30px -14px rgba(21,36,71,0.35);
  --radius: 12px;
  --display: 'Sora', 'Segoe UI', sans-serif;
  --sans: 'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

:root:not([data-theme="light"]){
  @media (prefers-color-scheme: dark){
    --paper: #10182c; --paper-deep: #0b1220; --ink: #e7ecf7; --ink-soft: #aab3c8;
    --line: #263049; --panel-bg: #16203a; --shadow: 0 10px 30px -14px rgba(0,0,0,0.6);
  }
}
:root[data-theme="dark"]{
  --paper: #10182c; --paper-deep: #0b1220; --ink: #e7ecf7; --ink-soft: #aab3c8;
  --line: #263049; --panel-bg: #16203a; --shadow: 0 10px 30px -14px rgba(0,0,0,0.6);
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  overflow:hidden;
}

/* ---------- layout shell ---------- */
#app{
  display:grid;
  grid-template-columns: 372px 1fr;
  grid-template-rows: 64px 1fr;
  grid-template-areas:
    "topbar topbar"
    "sidebar map";
  height:100%;
  width:100%;
}

/* ---------- brand / header ---------- */
.brand{
  grid-area:brand;
  display:flex;
  align-items:center;
  gap:.65rem;
  padding:0 1.25rem;
  background:var(--navy);
  color:#fff;
}
.brand img{ width:28px; height:28px; }
.brand__mark{
  font-family:var(--display);
  font-weight:700;
  font-size:1.08rem;
  letter-spacing:-.01em;
}
.brand__mark em{ color:var(--orange); font-style:normal; }
.brand__tag{
  font-size:.6rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#a9b3cc;
  border-left:1px solid rgba(255,255,255,.2);
  padding-left:.6rem;
  margin-left:.1rem;
}

.topbar{
  grid-area:topbar;
  display:flex;
  align-items:center;
  gap:1rem;
  padding:0 1.25rem;
  background:var(--panel-bg);
  border-bottom:1px solid var(--line);
}
.search-box{ flex:1; max-width:520px; position:relative; }
.search-box input{
  width:100%;
  padding:.62rem .9rem .62rem 2.2rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:.9rem;
  outline:none;
  transition:border-color .15s, box-shadow .15s;
}
.search-box input:focus{ border-color:var(--orange); box-shadow:0 0 0 3px rgba(240,129,47,.15); }
.search-box svg{ position:absolute; left:.75rem; top:50%; transform:translateY(-50%); width:15px; height:15px; opacity:.5; }

.view-toggle{ display:flex; border:1px solid var(--line); border-radius:999px; overflow:hidden; }
.view-toggle button{
  border:none; background:transparent; color:var(--ink-soft);
  padding:.55rem .95rem; font-family:var(--sans); font-size:.78rem; font-weight:600;
  cursor:pointer; display:flex; align-items:center; gap:.35rem;
  transition:background .15s, color .15s;
}
.view-toggle button.active{ background:var(--navy); color:#fff; }

.result-count{ font-family:var(--display); font-size:.85rem; color:var(--ink-soft); white-space:nowrap; }
.result-count strong{ color:var(--orange-deep); font-weight:700; }

.btn-import{
  margin-left:auto;
  background:var(--orange); color:#fff; border:none;
  padding:.6rem 1.05rem; border-radius:999px;
  font-family:var(--sans); font-weight:600; font-size:.8rem; cursor:pointer;
  display:flex; align-items:center; gap:.4rem;
  box-shadow:0 4px 10px -4px rgba(240,129,47,.6);
  transition:transform .12s, background .15s;
}
.btn-import:hover{ background:var(--orange-deep); transform:translateY(-1px); }

/* ---------- sidebar ---------- */
.sidebar{
  grid-area:sidebar;
  background:var(--panel-bg);
  border-right:1px solid var(--line);
  overflow-y:auto;
  padding:1.1rem 1.1rem 2rem;
}
.sidebar::-webkit-scrollbar{ width:8px; }
.sidebar::-webkit-scrollbar-thumb{ background:var(--line); border-radius:4px; }

.section-title{
  font-family:var(--display);
  font-size:.7rem; text-transform:uppercase; letter-spacing:.14em;
  color:var(--orange-deep);
  margin:1.4rem 0 .6rem;
  display:flex; align-items:center; gap:.5rem;
}
.section-title::after{ content:''; flex:1; height:1px; background:var(--line); }
.section-title:first-child{ margin-top:0; }

.filter-group{ margin-bottom:.85rem; }
.filter-group label{ display:block; font-size:.74rem; color:var(--ink-soft); margin-bottom:.3rem; font-weight:600; }
.filter-group select, .filter-group input[type=text]{
  width:100%; padding:.5rem .65rem; border:1px solid var(--line); border-radius:8px;
  background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:.83rem;
}
.chip-row{ display:flex; flex-wrap:wrap; gap:.4rem; }
.chip{
  border:1px solid var(--line); background:var(--paper); color:var(--ink-soft);
  padding:.34rem .65rem; border-radius:999px; font-size:.72rem; cursor:pointer;
  user-select:none; transition:all .12s; white-space:nowrap;
}
.chip:hover{ border-color:var(--orange); }
.chip.active{ background:var(--navy); border-color:var(--navy); color:#fff; }
.clear-filters{ font-size:.72rem; color:var(--orange-deep); background:none; border:none; cursor:pointer; padding:0; text-decoration:underline; margin-top:.4rem; }

.stat-grid{ display:grid; grid-template-columns:1fr 1fr; gap:.55rem; }
.stat-card{ background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:.6rem .7rem; }
.stat-card .num{ font-family:var(--display); font-size:1.35rem; font-weight:700; color:var(--navy); line-height:1; }
.stat-card .lbl{ font-size:.66rem; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.06em; margin-top:.25rem; }
.bar-list{ display:flex; flex-direction:column; gap:.4rem; margin-top:.3rem; }
.bar-row{ font-size:.72rem; }
.bar-row .bar-label{ display:flex; justify-content:space-between; color:var(--ink-soft); margin-bottom:2px; }
.bar-track{ height:6px; background:var(--paper-deep); border-radius:3px; overflow:hidden; }
.bar-fill{ height:100%; background:var(--navy); border-radius:3px; }

/* ---------- map area ---------- */
.map-wrap{ grid-area:map; position:relative; }
#map{ position:absolute; inset:0; background:var(--paper-deep); }

.legend{
  position:absolute; left:14px; bottom:14px;
  background:var(--panel-bg); border:1px solid var(--line); border-radius:10px;
  box-shadow:var(--shadow); padding:.7rem .85rem; font-size:.72rem; max-width:230px; z-index:500;
}
.legend h4{ margin:0 0 .4rem; font-family:var(--display); font-size:.7rem; text-transform:uppercase; letter-spacing:.09em; color:var(--orange-deep); }
.legend-item{ display:flex; align-items:center; gap:.4rem; margin-bottom:.2rem; color:var(--ink-soft); }

.cluster-icon{
  background:var(--navy); color:#fff; border:3px solid rgba(255,255,255,.9); border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700;
  box-shadow:0 3px 10px -3px rgba(0,0,0,.5);
}
.marker-pin{
  display:flex; align-items:center; justify-content:center; width:26px; height:26px;
  background:var(--panel-bg); border:2px solid var(--orange); border-radius:50% 50% 50% 0;
  transform:rotate(-45deg); box-shadow:0 3px 8px -2px rgba(0,0,0,.4);
}
.marker-pin span{ transform:rotate(45deg); font-size:13px; }

.leaflet-popup-content-wrapper{ background:var(--panel-bg); border-radius:10px; box-shadow:var(--shadow); }
.leaflet-popup-content{ font-family:var(--sans); margin:.8rem .9rem; }
.popup-title{ font-family:var(--display); font-weight:700; font-size:.95rem; margin-bottom:.15rem; color:var(--ink); }
.popup-sub{ font-size:.75rem; color:var(--ink-soft); margin-bottom:.4rem; }
.popup-link{ font-size:.75rem; color:var(--orange-deep); cursor:pointer; text-decoration:underline; }

.detail-panel{
  position:absolute; top:0; right:0; bottom:0; width:340px;
  background:var(--panel-bg); border-left:1px solid var(--line);
  box-shadow:-14px 0 30px -18px rgba(0,0,0,.35);
  transform:translateX(100%); transition:transform .25s ease; z-index:600;
  overflow-y:auto; padding:1.2rem 1.3rem 2rem;
}
.detail-panel.open{ transform:translateX(0); }
.detail-panel .close-btn{ position:absolute; top:.9rem; right:.9rem; background:none; border:none; cursor:pointer; font-size:1.1rem; color:var(--ink-soft); }
.detail-eyebrow{ font-family:var(--display); text-transform:uppercase; letter-spacing:.1em; font-size:.66rem; color:var(--orange-deep); }
.detail-title{ font-family:var(--display); font-size:1.3rem; font-weight:700; margin:.25rem 0 .1rem; }
.detail-sub{ color:var(--ink-soft); font-size:.85rem; margin-bottom:1rem; }
.detail-block{ margin-bottom:1.1rem; }
.detail-block h5{ font-size:.68rem; text-transform:uppercase; letter-spacing:.1em; color:var(--navy); margin:0 0 .45rem; }
.detail-row{ display:flex; justify-content:space-between; gap:1rem; font-size:.8rem; padding:.3rem 0; border-bottom:1px dashed var(--line); }
.detail-row span:first-child{ color:var(--ink-soft); }
.detail-row span:last-child{ text-align:right; font-weight:600; word-break:break-word; overflow-wrap:anywhere; }
.tag-list{ display:flex; flex-wrap:wrap; gap:.35rem; }
.tag{ background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:.25rem .6rem; font-size:.72rem; color:var(--ink-soft); }
.na{ color:#98a1b5; font-style:italic; }
.detail-loading{ font-size:.85rem; color:var(--ink-soft); padding:2rem 0; text-align:center; }
.btn-contact{
  display:inline-flex; align-items:center; gap:.4rem; margin-top:.3rem;
  background:var(--navy); color:#fff; text-decoration:none; padding:.55rem 1rem;
  border-radius:999px; font-size:.8rem; font-weight:600;
}
.btn-contact.secondary{ background:var(--paper); color:var(--ink); border:1px solid var(--line); }

/* import modal */
.modal-backdrop{ position:fixed; inset:0; background:rgba(13,24,48,.55); display:none; align-items:center; justify-content:center; z-index:1000; }
.modal-backdrop.open{ display:flex; }
.modal{ background:var(--panel-bg); border-radius:14px; width:480px; max-width:90vw; padding:1.5rem; box-shadow:var(--shadow); }
.modal h3{ font-family:var(--display); margin-top:0; }
.modal p{ font-size:.85rem; color:var(--ink-soft); line-height:1.5; }
.dropzone{
  border:2px dashed var(--line); border-radius:10px; padding:1.6rem; text-align:center;
  color:var(--ink-soft); font-size:.85rem; margin:1rem 0; cursor:pointer; transition:border-color .15s, background .15s;
}
.dropzone.drag{ border-color:var(--orange); background:rgba(240,129,47,.06); }
.modal-actions{ display:flex; justify-content:flex-end; gap:.6rem; margin-top:1rem; }
.modal-actions button{ border:none; border-radius:999px; padding:.55rem 1.1rem; font-family:var(--sans); font-weight:600; font-size:.8rem; cursor:pointer; }
.btn-secondary{ background:var(--paper); border:1px solid var(--line) !important; color:var(--ink); }
.btn-primary{ background:var(--orange); color:#fff; }
.import-log{ max-height:140px; overflow-y:auto; font-family:monospace; font-size:.72rem; background:var(--paper); border:1px solid var(--line); border-radius:8px; padding:.5rem .65rem; margin-top:.6rem; display:none; }
.import-log.show{ display:block; }
.import-log .err{ color:#c0392b; }
.import-log .ok{ color:var(--success); }

.boot-overlay{
  position:absolute; inset:0; background:var(--paper); z-index:800;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.9rem;
  transition:opacity .3s ease;
}
.boot-overlay.hidden{ opacity:0; pointer-events:none; }
.boot-spinner{
  width:38px; height:38px; border-radius:50%;
  border:4px solid var(--line); border-top-color:var(--orange);
  animation:spin .8s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
.boot-overlay p{ font-family:var(--display); font-size:.85rem; color:var(--ink-soft); }

/* responsive */
@media (max-width: 880px){
  #app{
    grid-template-columns: 1fr; grid-template-rows: auto 1fr;
    grid-template-areas: "topbar" "map";
  }
  .sidebar{
    position:fixed; left:0; top:120px; bottom:0; width:86vw; max-width:360px;
    transform:translateX(-100%); transition:transform .2s ease; z-index:900; grid-area:unset;
  }
  .sidebar.open{ transform:translateX(0); }
  .topbar{ flex-wrap:wrap; height:auto; padding:.6rem 1rem; gap:.5rem; }
  .detail-panel{ width:88vw; }
}

/* =====================================================================
   NAVIGATION GLOBALE + PAGES (accueil, favoris, devenir prestataire)
   ===================================================================== */

.topnav{
  position:fixed; top:0; left:0; right:0; height:60px; z-index:2000;
  background:var(--navy); display:flex; align-items:center; padding:0 1.25rem; gap:.5rem;
}
.topnav__brand{ display:flex; align-items:center; gap:.5rem; color:#fff; font-family:var(--display); font-weight:700; font-size:1.05rem; text-decoration:none; }
.topnav__brand img{ width:26px; height:26px; }
.topnav__brand em{ color:var(--orange); font-style:normal; }
.topnav__links{ display:flex; gap:.2rem; margin-left:1.5rem; }
.topnav__links a{ color:#c7cee3; text-decoration:none; font-size:.85rem; font-weight:600; padding:.55rem .85rem; border-radius:8px; transition:background .15s,color .15s; }
.topnav__links a:hover{ color:#fff; background:rgba(255,255,255,.08); }
.topnav__links a.active{ color:#fff; background:rgba(255,255,255,.16); }
.topnav__cta{ margin-left:auto; background:var(--orange); color:#fff; text-decoration:none; font-size:.82rem; font-weight:700; padding:.55rem 1.05rem; border-radius:999px; }
.topnav__cta:hover{ background:var(--orange-deep); }
.topnav__burger{ display:none; margin-left:auto; background:none; border:none; color:#fff; font-size:1.4rem; cursor:pointer; }

.view-shell{ position:fixed; top:60px; left:0; right:0; bottom:0; }
.view{ display:none; height:100%; }
.view.active{ display:block; }
.view.scrollable{ overflow-y:auto; background:var(--paper); }
#view-app.active{ display:block; }

/* ---- Accueil ---- */
.hero{
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  color:#fff; padding:4.5rem 1.5rem 5rem; text-align:center; position:relative; overflow:hidden;
}
.hero::after{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at 80% 20%, rgba(240,129,47,.25), transparent 55%);
  pointer-events:none;   /* halo décoratif : ne doit pas bloquer les clics sur la recherche */
}
.hero__inner{ position:relative; z-index:1; max-width:760px; margin:0 auto; }
.hero h1{ font-family:var(--display); font-size:2.4rem; font-weight:800; line-height:1.15; margin:0 0 1rem; }
.hero h1 em{ color:var(--orange); font-style:normal; }
.hero p{ font-size:1.05rem; color:#c7cee3; margin:0 auto 2rem; max-width:560px; }
.hero-search{
  background:#fff; border-radius:999px; padding:.4rem .4rem .4rem 1.2rem;
  display:flex; align-items:center; gap:.5rem; max-width:620px; margin:0 auto; box-shadow:0 20px 40px -20px rgba(0,0,0,.5);
}
.hero-search input{ flex:1; border:none; outline:none; font-family:var(--sans); font-size:.92rem; padding:.6rem 0; color:var(--ink); }
.hero-search select{ border:none; outline:none; font-family:var(--sans); font-size:.85rem; color:var(--ink-soft); background:none; padding:.6rem .4rem; }
.hero-search button{
  background:var(--orange); color:#fff; border:none; border-radius:999px; padding:.75rem 1.4rem;
  font-family:var(--sans); font-weight:700; font-size:.88rem; cursor:pointer; white-space:nowrap;
}
.hero-search button:hover{ background:var(--orange-deep); }
.hero-stats{ display:flex; justify-content:center; gap:2.2rem; margin-top:2.5rem; flex-wrap:wrap; }
.hero-stats div{ text-align:center; }
.hero-stats .n{ font-family:var(--display); font-size:1.6rem; font-weight:800; color:#fff; }
.hero-stats .l{ font-size:.72rem; color:#a9b3cc; text-transform:uppercase; letter-spacing:.08em; }

.section{ max-width:1080px; margin:0 auto; padding:3.5rem 1.5rem; }
.section h2{ font-family:var(--display); font-size:1.7rem; font-weight:700; text-align:center; margin:0 0 .6rem; color:var(--ink); }
.section > p.lead{ text-align:center; color:var(--ink-soft); max-width:560px; margin:0 auto 2.5rem; }

.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.step-card{ background:var(--panel-bg); border:1px solid var(--line); border-radius:var(--radius); padding:1.6rem; text-align:center; }
.step-card .num{ width:36px; height:36px; border-radius:50%; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700; margin:0 auto 1rem; }
.step-card h3{ font-family:var(--display); font-size:1.02rem; margin:0 0 .5rem; }
.step-card p{ font-size:.85rem; color:var(--ink-soft); margin:0; line-height:1.5; }

.trade-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(190px,1fr)); gap:1rem; }
.trade-card{
  background:var(--panel-bg); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.2rem; text-align:left; cursor:pointer; transition:transform .12s, box-shadow .12s, border-color .12s;
  text-decoration:none; color:var(--ink); display:block;
}
.trade-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--orange); }
.trade-card .emoji{ font-size:1.6rem; }
.trade-card h3{ font-family:var(--display); font-size:.95rem; margin:.6rem 0 .2rem; }
.trade-card .count{ font-size:.76rem; color:var(--ink-soft); }

.cta-band{ background:var(--paper-deep); text-align:center; padding:3.5rem 1.5rem; }
.cta-band h2{ font-family:var(--display); font-size:1.5rem; margin:0 0 .6rem; }
.cta-band p{ color:var(--ink-soft); margin:0 0 1.5rem; }
.btn-lg{ display:inline-flex; align-items:center; gap:.5rem; background:var(--orange); color:#fff; text-decoration:none; font-weight:700; padding:.85rem 1.7rem; border-radius:999px; font-size:.92rem; border:none; cursor:pointer; }
.btn-lg:hover{ background:var(--orange-deep); }
.btn-lg.secondary{ background:var(--navy); }

.site-footer{ text-align:center; padding:2rem 1.5rem 3rem; color:var(--ink-soft); font-size:.76rem; }
.site-footer a{ color:var(--ink-soft); }

/* ---- Favoris ---- */
.page-header{ max-width:1080px; margin:0 auto; padding:2.2rem 1.5rem 0; }
.page-header h1{ font-family:var(--display); font-size:1.6rem; margin:0 0 .3rem; }
.page-header p{ color:var(--ink-soft); margin:0; font-size:.9rem; }

.fav-grid{ max-width:1080px; margin:1.5rem auto 0; padding:0 1.5rem 3rem; display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem; }
.fav-card{ background:var(--panel-bg); border:1px solid var(--line); border-radius:var(--radius); padding:1.1rem; position:relative; }
.fav-card .remove{ position:absolute; top:.8rem; right:.8rem; background:none; border:none; cursor:pointer; color:var(--ink-soft); font-size:1rem; }
.fav-card .trade-eyebrow{ font-size:.68rem; text-transform:uppercase; letter-spacing:.08em; color:var(--orange-deep); font-family:var(--display); }
.fav-card h3{ font-family:var(--display); font-size:1rem; margin:.25rem 0 .2rem; }
.fav-card .city{ font-size:.82rem; color:var(--ink-soft); margin-bottom:.8rem; }
.fav-card .actions{ display:flex; gap:.5rem; flex-wrap:wrap; }
.fav-card .actions a, .fav-card .actions button{
  font-size:.76rem; font-weight:600; padding:.4rem .75rem; border-radius:999px; text-decoration:none;
  border:1px solid var(--line); background:var(--paper); color:var(--ink); cursor:pointer;
}
.fav-empty{ max-width:1080px; margin:0 auto; padding:3rem 1.5rem; text-align:center; color:var(--ink-soft); }

.compare-wrap{ max-width:1080px; margin:0 auto; padding:0 1.5rem 3rem; overflow-x:auto; }
.compare-table{ width:100%; border-collapse:collapse; background:var(--panel-bg); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.compare-table th, .compare-table td{ padding:.7rem .9rem; border-bottom:1px solid var(--line); font-size:.82rem; text-align:left; }
.compare-table th{ background:var(--paper); font-family:var(--display); color:var(--navy); }
.compare-table td.lbl{ color:var(--ink-soft); font-weight:600; white-space:nowrap; }

/* ---- Devenir prestataire ---- */
.form-wrap{ max-width:620px; margin:0 auto; padding:2.5rem 1.5rem 4rem; }
/* ---- Champs de formulaire (réutilisés dans .form-wrap ET dans les modales) ---- */
.field{ margin-bottom:1rem; }
.field label{ display:block; font-size:.82rem; font-weight:600; margin-bottom:.35rem; }
.field input, .field select, .field textarea{
  width:100%; padding:.65rem .8rem; border:1px solid var(--line); border-radius:8px;
  background:var(--panel-bg); color:var(--ink); font-family:var(--sans); font-size:.88rem;
}
.field textarea{ min-height:90px; resize:vertical; }

.form-wrap .field{ margin-bottom:1rem; }
.form-wrap label{ display:block; font-size:.82rem; font-weight:600; margin-bottom:.35rem; }
.form-wrap input, .form-wrap select, .form-wrap textarea{
  width:100%; padding:.65rem .8rem; border:1px solid var(--line); border-radius:8px;
  background:var(--panel-bg); color:var(--ink); font-family:var(--sans); font-size:.88rem;
}
.form-wrap textarea{ min-height:90px; resize:vertical; }
.form-row2{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-note{ font-size:.78rem; color:var(--ink-soft); background:var(--paper-deep); border-radius:8px; padding:.8rem 1rem; margin-bottom:1.2rem; }
.form-success{ background:#eafaf2; border:1px solid #bfe9d4; color:#1f6f4c; border-radius:10px; padding:1rem 1.2rem; font-size:.88rem; margin-bottom:1.2rem; }

/* ---- Avis (dans la fiche détail) ---- */
.stars{ color:var(--orange); font-size:.95rem; letter-spacing:1px; }
.stars .off{ color:var(--line); }
.review-item{ border-bottom:1px dashed var(--line); padding:.6rem 0; }
.review-item .who{ font-size:.78rem; font-weight:600; }
.review-item .cmt{ font-size:.82rem; color:var(--ink-soft); margin-top:.2rem; }
.review-form select, .review-form textarea{
  width:100%; margin-top:.4rem; padding:.5rem .65rem; border:1px solid var(--line); border-radius:8px;
  font-family:var(--sans); font-size:.82rem; background:var(--paper);
}
.review-form button{ margin-top:.5rem; background:var(--navy); color:#fff; border:none; border-radius:999px; padding:.5rem 1rem; font-size:.8rem; font-weight:600; cursor:pointer; }
.btn-fav{ background:none; border:1px solid var(--line); border-radius:999px; padding:.55rem 1rem; font-size:.8rem; cursor:pointer; color:var(--ink); }
.btn-fav.active{ background:#fdecdc; border-color:var(--orange); color:var(--orange-deep); }

/* ---- Modal devis ---- */
.quote-summary{ background:var(--paper); border-radius:8px; padding:.7rem .9rem; font-size:.82rem; margin-bottom:1rem; }

@media (max-width: 880px){
  .topnav{ height:auto; flex-wrap:wrap; padding:.6rem .8rem; row-gap:.4rem; }
  .topnav__links{ margin-left:0; order:3; width:100%; justify-content:space-between; gap:0; }
  .topnav__links a{ padding:.4rem .5rem; font-size:.72rem; flex:1; text-align:center; }
  .topnav__cta{ font-size:.74rem; padding:.45rem .8rem; }
  .view-shell{ top:96px; }
  .steps{ grid-template-columns:1fr; }
  .form-row2{ grid-template-columns:1fr; }
  .hero h1{ font-size:1.8rem; }
  .hero-search{ flex-wrap:wrap; border-radius:18px; padding:.8rem; }
  .hero-search select{ order:2; }
  .hero-search button{ order:3; width:100%; }
  #btnToggleSidebar{ display:inline-flex !important; }
  .sidebar{
    position:fixed; left:0; top:96px; bottom:0; width:86vw; max-width:360px;
    transform:translateX(-100%); transition:transform .2s ease; z-index:1500;
  }
  .sidebar.open{ transform:translateX(0); box-shadow:20px 0 40px -20px rgba(0,0,0,.4); }
}


/* =====================================================================
   v2 — 190 000 professionnels : filtres étendus, liste de zone,
   regroupements Supercluster, fiche SIRENE
   ===================================================================== */
.stat-grid .stat-card .num{ font-size:1.15rem; }
.filter-group.checks{ display:flex; flex-direction:column; gap:.35rem; }
.filter-group label.check{ display:flex; align-items:center; gap:.45rem; font-weight:500; color:var(--ink); font-size:.8rem; margin:0; cursor:pointer; }
.filter-group label.check input{ accent-color:var(--orange); width:15px; height:15px; }

.result-count .rc-total{ opacity:.55; }

.vis-list{ display:flex; flex-direction:column; gap:.3rem; }
.vis-list .hint{ font-size:.76rem; color:var(--ink-soft); margin:.2rem 0; line-height:1.45; }
.vis-item{
  display:flex; align-items:flex-start; gap:.55rem; width:100%; text-align:left; cursor:pointer;
  background:var(--paper); border:1px solid var(--line); border-radius:9px; padding:.45rem .6rem;
  font-family:var(--sans); color:var(--ink); transition:border-color .12s, transform .12s;
}
.vis-item:hover{ border-color:var(--orange); transform:translateX(2px); }
.vis-emoji{ font-size:1rem; line-height:1.2; }
.vis-main{ display:flex; flex-direction:column; min-width:0; }
.vis-name{ font-weight:600; font-size:.8rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vis-sub{ font-size:.7rem; color:var(--ink-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.cluster-icon{ position:relative; cursor:pointer; }
.cluster-icon span{ position:relative; z-index:1; background:var(--navy); border-radius:999px; padding:0 .3em; line-height:1.5; }
.cluster-icon:not([style*="gradient"]) span{ background:transparent; padding:0; }
.popup-list{ max-height:220px; overflow-y:auto; display:flex; flex-direction:column; gap:.25rem; margin:.3rem 0; }

.legend-src{ margin-top:.4rem; padding-top:.4rem; border-top:1px dashed var(--line); font-size:.64rem; }
.boot-progress{ font-family:var(--sans) !important; font-size:.75rem !important; margin-top:-.4rem; font-variant-numeric:tabular-nums; }

.detail-panel{ width:380px; }
.detail-actions{ margin:.6rem 0 1.1rem; display:flex; gap:.5rem; flex-wrap:wrap; }
.verified-badge{
  display:inline-flex; align-items:center; gap:.35rem; font-size:.72rem; font-weight:600;
  color:var(--success); background:rgba(47,158,110,.1); border:1px solid rgba(47,158,110,.35);
  padding:.25rem .6rem; border-radius:999px; margin:-.4rem 0 .2rem;
}
.ext-links{ display:flex; flex-direction:column; gap:.35rem; margin-top:.7rem; }
.ext-link{ font-size:.78rem; color:var(--orange-deep); text-decoration:none; font-weight:600; }
.ext-link:hover{ text-decoration:underline; }
.detail-row a{ color:var(--orange-deep); }
.sources-note{ text-align:center; color:var(--ink-soft); font-size:.78rem; max-width:720px; margin:-1.6rem auto 2rem; line-height:1.5; }
.form-note a{ color:var(--orange-deep); font-weight:600; }

@media (max-width: 880px){
  .detail-panel{ width:100%; }
}
details.legend{ padding:.5rem .75rem; max-width:250px; }
details.legend summary{ cursor:pointer; font-family:var(--display); font-size:.7rem; text-transform:uppercase; letter-spacing:.09em; color:var(--orange-deep); font-weight:700; list-style:none; }
details.legend summary::-webkit-details-marker{ display:none; }
details.legend summary::after{ content:' ▾'; }
details.legend:not([open]) summary::after{ content:' ▸'; }
details.legend[open] summary{ margin-bottom:.35rem; }
.legend-src{ display:block; line-height:1.4; }
@media (max-width: 880px){ details.legend{ max-width:200px; } }

/* =====================================================================
   v3 — base nationale (≈ 1,1 M), recherche à suggestions, fiches riches
   ===================================================================== */
.search-box{ position:relative; }
.search-suggest{
  position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:1500; display:none;
  background:var(--panel-bg); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow);
  max-height:420px; overflow-y:auto; padding:.3rem;
}
.search-suggest.open{ display:block; }
.sg-item{ padding:.5rem .65rem; border-radius:8px; cursor:pointer; font-size:.84rem; color:var(--ink); line-height:1.35; }
.sg-item span{ color:var(--ink-soft); font-size:.74rem; margin-left:.25rem; }
.sg-item.active, .sg-item:hover{ background:var(--paper); }

.map-notice{
  position:absolute; top:12px; left:50%; transform:translateX(-50%); z-index:550; display:none;
  background:var(--navy); color:#fff; border-radius:999px; padding:.45rem 1rem; font-size:.78rem;
  box-shadow:var(--shadow); max-width:min(640px, calc(100% - 120px)); text-align:center;
}
.map-notice.show{ display:block; }
.map-notice.soft{ background:var(--panel-bg); color:var(--ink-soft); border:1px solid var(--line); }
.map-notice .link-btn{ color:var(--orange); }
.active-chips{ position:absolute; top:56px; left:12px; right:12px; z-index:540; display:none; flex-wrap:wrap; gap:.35rem; justify-content:center; pointer-events:none; }
.active-chips.show{ display:flex; }
.achip{ pointer-events:auto; background:var(--panel-bg); border:1px solid var(--line); border-radius:999px; padding:.25rem .6rem; font-size:.72rem; cursor:pointer; box-shadow:0 2px 8px -4px rgba(0,0,0,.3); }
.achip b{ color:var(--orange-deep); margin-left:.2rem; }
.active-chips .link-btn{ pointer-events:auto; background:var(--panel-bg); border-radius:999px; padding:.25rem .6rem; border:1px solid var(--line); }
.link-btn{ background:none; border:none; color:var(--orange-deep); font-weight:600; cursor:pointer; font-size:.74rem; text-decoration:underline; font-family:var(--sans); }
.locate-btn{ position:absolute; right:10px; bottom:128px; z-index:500; width:34px; height:34px; border-radius:8px; border:1px solid var(--line); background:var(--panel-bg); color:var(--ink); font-size:1.1rem; cursor:pointer; box-shadow:var(--shadow); }
.spin{ display:inline-block; width:12px; height:12px; border:2px solid rgba(255,255,255,.35); border-top-color:var(--orange); border-radius:50%; animation:spin .8s linear infinite; vertical-align:-2px; margin-right:.3rem; }
.detail-loading .spin, .hint .spin{ border-color:var(--line); border-top-color:var(--orange); }

.filter-row2{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.stat-scope{ font-size:.72rem; color:var(--ink-soft); margin:-.2rem 0 .5rem; }
.bar-row.clickable{ cursor:pointer; }
.bar-row.clickable:hover .bar-label span:first-child{ color:var(--orange-deep); }
.clear-filters.pill{ text-decoration:none; border:1px solid var(--line); border-radius:999px; padding:.35rem .8rem; }
.clear-filters.pill.danger{ color:#c0392b; }

.national-results{ display:none; margin-bottom:1rem; border:1px solid var(--orange); border-radius:12px; padding:.7rem; background:rgba(240,129,47,.05); }
.national-results.open{ display:block; }
.nr-head{ display:flex; justify-content:space-between; align-items:center; gap:.5rem; font-size:.84rem; margin-bottom:.4rem; }
.close-x{ background:none; border:none; cursor:pointer; color:var(--ink-soft); font-size:1rem; }
.nr-list{ display:flex; flex-direction:column; gap:.3rem; max-height:360px; overflow-y:auto; }

.vis-badges{ display:flex; flex-wrap:wrap; gap:.2rem; margin-top:.2rem; }
.mini-badge{ font-style:normal; font-size:.62rem; font-weight:600; background:var(--paper-deep); color:var(--ink-soft); border-radius:4px; padding:.05rem .3rem; }
.mini-badge.rge{ background:rgba(47,158,110,.14); color:var(--success); }
.mini-badge.muted{ font-weight:500; }
.popup-badges{ display:flex; gap:.25rem; margin:.1rem 0 .45rem; }
.pp-list{ margin:.3rem 0 .5rem; }
.pp-row{ display:flex; justify-content:space-between; gap:.8rem; font-size:.74rem; padding:.1rem 0; color:var(--ink-soft); }
.pp-row b{ color:var(--ink); }

.cluster-icon.is-agg{ background:var(--orange-deep); }
.marker-pin{ position:relative; }
.marker-pin.approx{ border-style:dashed; opacity:.85; }
.pin-badge{ position:absolute; top:-7px; right:-7px; transform:rotate(45deg); background:var(--success); color:#fff; border-radius:50%; width:13px; height:13px; font-size:9px; font-style:normal; display:flex; align-items:center; justify-content:center; border:1.5px solid #fff; }

/* fiche */
.detail-panel{ width:420px; }
.badges{ display:flex; flex-wrap:wrap; gap:.3rem; margin:.1rem 0 .3rem; }
.badge{ font-size:.68rem; font-weight:600; border-radius:999px; padding:.2rem .55rem; background:var(--paper); border:1px solid var(--line); color:var(--ink-soft); }
.badge.ok{ color:var(--success); border-color:rgba(47,158,110,.4); background:rgba(47,158,110,.08); }
.badge.rge{ color:#fff; background:var(--success); border-color:var(--success); }
.badge.warn{ color:#fff; background:#c0392b; border-color:#c0392b; }
.alert-box{ border:1px solid rgba(192,57,43,.45); background:rgba(192,57,43,.07); border-radius:10px; padding:.7rem .8rem; font-size:.8rem; margin-bottom:1rem; line-height:1.45; }
.alert-box b{ color:#c0392b; }
.block-note{ font-size:.74rem; color:var(--ink-soft); margin:.2rem 0 .5rem; line-height:1.45; }
.rge-item{ border:1px solid var(--line); border-left:3px solid var(--success); border-radius:8px; padding:.5rem .6rem; margin-bottom:.45rem; }
.rge-item.expired{ border-left-color:#98a1b5; opacity:.7; }
.rge-name{ font-weight:700; font-size:.8rem; }
.rge-meta{ font-size:.72rem; color:var(--ink-soft); margin:.15rem 0 .3rem; }
.rge-doms{ display:flex; flex-wrap:wrap; gap:.25rem; margin-bottom:.3rem; }
.rge-doms .tag{ font-size:.66rem; padding:.12rem .45rem; }
.fin-kpis{ display:grid; grid-template-columns:1fr 1fr; gap:.5rem; margin-bottom:.5rem; }
.fin-kpis > div{ background:var(--paper); border:1px solid var(--line); border-radius:8px; padding:.5rem .6rem; }
.fin-kpis .k{ font-family:var(--display); font-weight:700; font-size:1.05rem; color:var(--navy); }
.fin-kpis .l{ font-size:.66rem; color:var(--ink-soft); }
.neg{ color:#c0392b !important; }
.trend{ display:block; font-weight:700; margin-top:.1rem; }
.trend.up{ color:var(--success); } .trend.down{ color:#c0392b; }
.fin-table{ width:100%; border-collapse:collapse; font-size:.74rem; margin-bottom:.4rem; font-variant-numeric:tabular-nums; }
.fin-table th, .fin-table td{ text-align:right; padding:.25rem .3rem; border-bottom:1px dashed var(--line); }
.fin-table th:first-child, .fin-table td:first-child{ text-align:left; }
.fin-table th{ color:var(--ink-soft); font-weight:600; }
.mono{ font-family:ui-monospace, Menlo, Consolas, monospace; }
.copy-btn{ font-size:.66rem; border:1px solid var(--line); background:var(--paper); border-radius:4px; cursor:pointer; color:var(--ink-soft); margin-left:.3rem; }
.src-list{ margin:0; padding-left:1.1rem; font-size:.74rem; color:var(--ink-soft); line-height:1.5; }
:root[data-theme="dark"] .fin-kpis .k, :root[data-theme="dark"] .stat-card .num{ color:var(--ink); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .fin-kpis .k{ color:var(--ink); } }

/* accueil */
.kpi-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:.8rem; max-width:1080px; margin:0 auto; padding:0 1.5rem; }
.kpi{ background:var(--panel-bg); border:1px solid var(--line); border-radius:12px; padding:1rem; text-align:center; }
.kpi-e{ font-size:1.3rem; }
.kpi-n{ font-family:var(--display); font-weight:800; font-size:1.45rem; color:var(--navy); margin:.2rem 0; font-variant-numeric:tabular-nums; }
.kpi-l{ font-size:.76rem; color:var(--ink-soft); }
.src-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:.8rem; max-width:1080px; margin:0 auto; padding:0 1.5rem; }
.src-card{ background:var(--panel-bg); border:1px solid var(--line); border-radius:12px; padding:1rem 1.1rem; }
.src-card h4{ margin:0 0 .4rem; font-family:var(--display); font-size:.9rem; color:var(--orange-deep); }
.src-card p{ margin:0; font-size:.8rem; color:var(--ink-soft); line-height:1.5; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .kpi-n{ color:var(--ink); } }
@media (max-width: 880px){
  .detail-panel{ width:100%; }
  .map-notice{ max-width:calc(100% - 24px); border-radius:12px; top:8px; }
  .active-chips{ top:auto; bottom:10px; }
}
.map-wrap:has(.detail-panel.open) .leaflet-bottom.leaflet-right, .map-wrap:has(.detail-panel.open) .locate-btn{ margin-right:420px; }
@media (max-width: 880px){ .map-wrap:has(.detail-panel.open) .leaflet-bottom.leaflet-right, .map-wrap:has(.detail-panel.open) .locate-btn{ margin-right:0; } }
@media (max-width: 880px){ #btnOpenImport{ display:none; } }

/* =====================================================================
   v4 — UI/UX : thème sombre fiable, navigation mobile, listes triées,
   outils de fiche, notifications, impression, accessibilité
   ===================================================================== */
html.is-dark{
  --paper:#0f1729; --paper-deep:#0a1120; --ink:#e7ecf7; --ink-soft:#a9b3c9; --line:#26314a; --panel-bg:#151f36;
  --shadow:0 12px 32px -14px rgba(0,0,0,.7); color-scheme:dark;
}
html.is-dark body{ background:var(--paper); }
html.is-dark .stat-card .num, html.is-dark .kpi-n, html.is-dark .fin-kpis .k, html.is-dark .detail-block h5{ color:var(--ink); }
html.is-dark .leaflet-tile-pane{ filter:brightness(.72) invert(1) contrast(.9) hue-rotate(200deg) saturate(.35) brightness(.95); }
html.is-dark .leaflet-popup-content-wrapper, html.is-dark .leaflet-popup-tip{ background:var(--panel-bg); color:var(--ink); }
html.is-dark .leaflet-control-zoom a, html.is-dark .leaflet-bar a{ background:var(--panel-bg); color:var(--ink); border-color:var(--line); }
html.is-dark .leaflet-control-attribution{ background:rgba(21,31,54,.8); color:var(--ink-soft); }
html.is-dark .leaflet-control-attribution a{ color:var(--orange); }
html.is-dark .step-card, html.is-dark .trade-card, html.is-dark .fav-card, html.is-dark .form-wrap, html.is-dark .compare-table{ background:var(--panel-bg); color:var(--ink); border-color:var(--line); }
html.is-dark input, html.is-dark select, html.is-dark textarea{ background:var(--paper); color:var(--ink); border-color:var(--line); }
html.is-dark .chip.active{ background:var(--orange-deep); border-color:var(--orange-deep); }
html.is-dark .view-toggle button.active{ background:var(--orange-deep); }

:focus-visible{ outline:2px solid var(--orange); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; animation:none !important; scroll-behavior:auto !important; } }
button{ font-family:var(--sans); }

.topnav__tools{ display:flex; gap:.4rem; margin-left:auto; margin-right:.6rem; align-items:center; }
.topnav__tools + .topnav__cta{ margin-left:0; }
.icon-btn{ background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); color:#fff; border-radius:999px; height:34px; min-width:34px; padding:0 .6rem;
  cursor:pointer; font-size:.9rem; display:inline-flex; align-items:center; gap:.3rem; font-weight:600; }
.icon-btn:hover{ background:rgba(255,255,255,.2); }
.icon-btn span{ font-size:.78rem; }
[hidden]{ display:none !important; }

.list-tools{ display:flex; gap:.4rem; align-items:center; margin:-.2rem 0 .6rem; }
.list-tools select{ flex:1; padding:.4rem .55rem; border:1px solid var(--line); border-radius:8px; background:var(--paper); color:var(--ink); font-size:.78rem; font-family:var(--sans); }
.pill-btn{ border:1px solid var(--line); background:var(--panel-bg); color:var(--ink); border-radius:999px; padding:.38rem .7rem; font-size:.75rem; font-weight:600; cursor:pointer; white-space:nowrap; }
.pill-btn:hover{ border-color:var(--orange); }
.vis-item{ position:relative; }
.vis-dist{ position:absolute; right:.6rem; top:.45rem; font-size:.68rem; font-weight:700; color:var(--orange-deep); }
.vis-item .vis-main{ padding-right:3.2rem; }
.mini-badge.warn{ background:rgba(192,57,43,.14); color:#c0392b; }
.empty{ text-align:center; padding:1.2rem .5rem; color:var(--ink-soft); font-size:.82rem; }
.empty-e{ font-size:1.8rem; }
.sg-title{ font-size:.66rem; text-transform:uppercase; letter-spacing:.1em; color:var(--ink-soft); padding:.35rem .65rem .15rem; }

.detail-tools{ display:flex; gap:.35rem; flex-wrap:wrap; margin:-.5rem 0 1rem; }
.tool-btn{ border:1px dashed var(--line); background:transparent; color:var(--ink-soft); border-radius:8px; padding:.3rem .55rem; font-size:.72rem; cursor:pointer; }
.tool-btn:hover{ color:var(--ink); border-color:var(--orange); border-style:solid; }
.detail-panel{ box-shadow:-18px 0 40px -20px rgba(0,0,0,.45); }
.detail-panel .close-btn{ width:32px; height:32px; border-radius:50%; background:var(--paper); }

.toast-box{ position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom)); transform:translateX(-50%); z-index:5000; display:flex; flex-direction:column; gap:.4rem; align-items:center; pointer-events:none; }
.toast{ background:var(--navy); color:#fff; padding:.55rem 1rem; border-radius:999px; font-size:.8rem; box-shadow:var(--shadow); opacity:0; transform:translateY(8px); transition:opacity .2s, transform .2s; }
.toast.show{ opacity:1; transform:none; }
html.is-dark .toast{ background:#f0812f; }

.recent-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:.6rem; max-width:1080px; margin:0 auto; padding:0 1.5rem; }
.recent-card{ display:flex; gap:.6rem; align-items:center; background:var(--panel-bg); border:1px solid var(--line); border-radius:12px; padding:.7rem .8rem; text-decoration:none; color:var(--ink); transition:border-color .15s, transform .15s; }
.recent-card:hover{ border-color:var(--orange); transform:translateY(-2px); }
.recent-card .rc-e{ font-size:1.3rem; }
.recent-card b{ display:block; font-size:.85rem; }
.recent-card small{ color:var(--ink-soft); font-size:.72rem; }
.recent-grid .link-btn{ grid-column:1/-1; justify-self:center; }

.legal{ max-width:760px; margin:0 auto; padding:0 1.5rem 3rem; line-height:1.6; font-size:.9rem; }
.legal h2{ font-family:var(--display); font-size:1.05rem; margin-top:1.8rem; }
.legal a{ color:var(--orange-deep); }

.mobile-switch, .bottomnav, .mobile-list, .sheet-head{ display:none; }

@media (max-width: 880px){
  .topnav{ flex-wrap:nowrap; height:56px; padding:0 .8rem; }
  .topnav__links, .topnav__cta{ display:none; }
  .topnav__tools{ margin-right:0; }
  .icon-btn span{ display:none; }
  .view-shell{ top:56px; bottom:calc(60px + env(safe-area-inset-bottom)); }
  .bottomnav{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:2100; background:var(--panel-bg); border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom); height:calc(60px + env(safe-area-inset-bottom)); box-shadow:0 -6px 20px -12px rgba(0,0,0,.3); }
  .bottomnav a{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.1rem; font-size:.66rem; font-weight:600;
    color:var(--ink-soft); text-decoration:none; position:relative; }
  .bottomnav a span{ font-size:1.2rem; line-height:1; filter:grayscale(.6); }
  .bottomnav a.active{ color:var(--orange-deep); }
  .bottomnav a.active span{ filter:none; transform:translateY(-1px); }
  .bottomnav a b{ position:absolute; top:6px; left:calc(50% + 6px); background:var(--orange); color:#fff; font-size:.6rem; border-radius:999px; padding:0 .3rem; }
  .bottomnav a b:empty{ display:none; }

  #app{ grid-template-rows:auto 1fr; }
  .topbar{ padding:.5rem .6rem .4rem; gap:.4rem; }
  .topbar .search-box{ width:100%; flex:1 1 100%; }
  .topbar .view-toggle{ flex:1; }
  .topbar .view-toggle button{ flex:1; font-size:.72rem; padding:.4rem .3rem; }
  .topbar .result-count{ font-size:.72rem; width:100%; order:5; }
  #btnToggleSidebar{ display:none !important; }

  .mobile-switch{ display:flex; position:absolute; z-index:950; left:50%; transform:translateX(-50%); bottom:14px; background:var(--panel-bg);
    border:1px solid var(--line); border-radius:999px; box-shadow:var(--shadow); padding:3px; gap:2px; }
  #app{ position:relative; }
  .mobile-switch button{ border:none; background:transparent; color:var(--ink); padding:.55rem .85rem; border-radius:999px; font-size:.78rem; font-weight:700; cursor:pointer; white-space:nowrap; }
  .mobile-switch button.active{ background:var(--navy); color:#fff; }
  html.is-dark .mobile-switch button.active{ background:var(--orange-deep); }
  .mobile-switch b{ font-size:.66rem; background:var(--orange); color:#fff; border-radius:999px; padding:0 .3rem; margin-left:.15rem; }
  .mobile-switch b:empty{ display:none; }

  .mobile-list{ display:block; position:absolute; inset:0; z-index:900; background:var(--paper); overflow-y:auto; padding:.8rem .8rem 80px;
    transform:translateY(100%); transition:transform .25s ease; visibility:hidden; }
  .mobile-list.open{ transform:none; visibility:visible; }
  .ml-head{ display:flex; flex-direction:column; gap:.5rem; margin-bottom:.6rem; }
  .ml-head .list-tools{ margin:0; }
  .mobile-list .vis-item{ padding:.7rem .75rem; margin-bottom:.35rem; background:var(--panel-bg); }
  .mobile-list .vis-name{ font-size:.9rem; white-space:normal; }

  .sidebar{ top:auto !important; bottom:0; left:0 !important; right:0; width:100% !important; max-width:none !important; height:82%;
    border-radius:18px 18px 0 0; transform:translateY(105%) !important; z-index:1200 !important; box-shadow:0 -20px 40px -20px rgba(0,0,0,.5); padding-top:.4rem; }
  .sidebar.open{ transform:none !important; }
  .sheet-head{ display:flex; justify-content:space-between; align-items:center; position:sticky; top:-.4rem; background:var(--panel-bg); padding:.6rem 0; z-index:2; }
  .sheet-head::before{ content:''; position:absolute; left:50%; top:0; width:40px; height:4px; border-radius:2px; background:var(--line); transform:translateX(-50%); }
  body.sheet-open .map-wrap::after{ content:''; position:absolute; inset:0; background:rgba(0,0,0,.35); z-index:1100; }
  .legend{ display:none; }
  .locate-btn{ bottom:70px; }
  .detail-panel{ z-index:1300; }
  .active-chips{ top:8px; bottom:auto; }
  .map-notice{ top:auto; bottom:70px; }
  .hero h1{ font-size:1.7rem; }
  .hero-search{ flex-direction:column; border-radius:16px; padding:.5rem; gap:.4rem; }
  .hero-search input, .hero-search select, .hero-search button{ width:100%; }
}

@media print{
  body.print-detail .topnav, body.print-detail .bottomnav, body.print-detail .topbar, body.print-detail .sidebar, body.print-detail #map,
  body.print-detail .legend, body.print-detail .mobile-switch, body.print-detail .map-notice, body.print-detail .active-chips,
  body.print-detail .locate-btn, body.print-detail .detail-actions, body.print-detail .detail-tools, body.print-detail .close-btn,
  body.print-detail .review-form, body.print-detail .toast-box{ display:none !important; }
  body.print-detail, body.print-detail .view-shell, body.print-detail #app, body.print-detail .map-wrap{ position:static !important; overflow:visible !important; height:auto !important; display:block !important; }
  body.print-detail .detail-panel{ position:static !important; transform:none !important; width:100% !important; box-shadow:none !important; border:none !important; overflow:visible !important; }
}
@media (max-width: 880px){ .leaflet-control-zoom, .leaflet-control-scale{ display:none; } .locate-btn{ bottom:72px; right:12px; } }
html.is-dark .hero-search{ background:var(--panel-bg); border-color:var(--line); }
html.is-dark .hero-search input, html.is-dark .hero-search select{ background:transparent; border:none; color:var(--ink); }
html.is-dark .section h2, html.is-dark .page-header h1{ color:var(--ink); }
html.is-dark .cta-band{ background:#0b1427; }
html.is-dark .site-footer{ color:var(--ink-soft); }

/* ================= v5 : statistiques, horaires, diagnostics, CT, devis groupé ================= */
.more-link{ text-align:center; margin:.9rem 0 0; }
.more-link a{ color:var(--orange-deep); font-weight:600; text-decoration:none; }
.stats-page{ max-width:1180px; margin:0 auto; padding:0 1.5rem 3rem; }
.stat-controls{ display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; margin-bottom:1rem; }
.stat-controls select{ padding:.55rem .7rem; border:1px solid var(--line); border-radius:10px; background:var(--panel-bg); color:var(--ink); font:inherit; min-width:240px; }
.seg{ display:inline-flex; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--panel-bg); }
.seg button{ border:0; background:transparent; color:var(--ink-soft); padding:.55rem .85rem; font:inherit; cursor:pointer; }
.seg button.active{ background:var(--navy); color:#fff; }
.stat-kpis{ padding:0; margin-bottom:1rem; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); }
.stat-grid{ display:grid; grid-template-columns: minmax(0, 2.3fr) minmax(260px, 1fr); gap:1rem; align-items:start; }
.sp-card{ background:var(--panel-bg); border:1px solid var(--line); border-radius:14px; padding:1rem; min-width:0; }
.sp-card h3{ font-family:var(--display); font-size:1rem; margin:0 0 .7rem; }
.stat-scroll{ overflow:auto; max-height:70vh; }
.stat-table{ width:100%; border-collapse:collapse; font-size:.82rem; font-variant-numeric:tabular-nums; }
.stat-table th{ position:sticky; top:0; background:var(--panel-bg); text-align:right; padding:.5rem .45rem; border-bottom:2px solid var(--line); cursor:pointer; white-space:nowrap; color:var(--ink-soft); font-weight:600; }
.stat-table th:first-child, .stat-table td:first-child{ text-align:left; }
.stat-table th.sorted{ color:var(--ink); }
.stat-table th.sorted.desc::after{ content:' ▾'; } .stat-table th.sorted.asc::after{ content:' ▴'; }
.stat-table td{ padding:.42rem .45rem; border-bottom:1px solid var(--line); text-align:right; white-space:nowrap; }
.stat-table td small{ display:block; color:var(--ink-soft); font-size:.72rem; }
.stat-table .rank{ display:inline-block; min-width:1.9rem; color:var(--ink-soft); font-size:.72rem; }
.bar-cell{ position:relative; min-width:90px; }
.stat-controls .btn-secondary{ padding:.55rem .9rem; border-radius:10px; }
#view-stats .page-header{ max-width:1180px; margin-left:auto; margin-right:auto; padding-left:1.5rem; padding-right:1.5rem; }
@media (max-width: 1250px){ .stat-grid{ grid-template-columns:1fr; } }
.bar-cell .dbar{ position:absolute; left:.2rem; top:50%; height:8px; transform:translateY(-50%); background:linear-gradient(90deg, rgba(240,129,47,.25), rgba(240,129,47,.55)); border-radius:4px; max-width:calc(100% - 3.5rem); }
.bar-cell b{ position:relative; }
.trade-rows{ display:flex; flex-direction:column; gap:.25rem; max-height:70vh; overflow:auto; }
.trow{ display:grid; grid-template-columns: minmax(0, 1fr) 70px; grid-template-areas:'l n' 'b b' 'p p'; gap:.15rem .5rem; text-align:left; border:1px solid transparent; background:transparent; color:var(--ink); padding:.4rem .5rem; border-radius:10px; cursor:pointer; font:inherit; }
.trow:hover{ background:var(--paper); } .trow.active{ border-color:var(--orange); background:rgba(240,129,47,.08); }
.trow .tl{ grid-area:l; font-size:.84rem; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.trow .tn{ grid-area:n; text-align:right; font-size:.82rem; font-variant-numeric:tabular-nums; }
.trow .tb{ grid-area:b; height:6px; background:var(--paper-deep); border-radius:3px; overflow:hidden; }
.trow .tb span{ display:block; height:100%; border-radius:3px; }
.trow .tp{ grid-area:p; font-size:.7rem; color:var(--ink-soft); }
@media (max-width: 880px){ .stat-grid{ grid-template-columns:1fr; } .stats-page{ padding:0 .8rem 5rem; } .stat-controls select{ min-width:0; flex:1 1 100%; } .seg{ flex:1 1 100%; } .seg button{ flex:1; padding:.55rem .3rem; font-size:.8rem; } }

.hours{ display:flex; flex-direction:column; align-items:flex-end; gap:.1rem; }
.open-now{ font-size:.72rem; font-weight:700; padding:.1rem .5rem; border-radius:999px; margin-bottom:.15rem; }
.open-now.yes{ background:rgba(47,158,110,.14); color:var(--success); }
.open-now.no{ background:rgba(192,57,43,.12); color:#c0392b; }
.cert-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:.4rem; margin:.4rem 0 .6rem; }
.cert{ border:1px solid var(--line); border-left:3px solid var(--success); border-radius:8px; padding:.4rem .55rem; }
.cert b{ display:block; font-size:.82rem; } .cert small{ color:var(--ink-soft); font-size:.72rem; }
.ct-table td:nth-child(3){ white-space:nowrap; }
.fav-bar{ display:flex; flex-wrap:wrap; gap:.6rem; max-width:1080px; margin:0 auto 1rem; padding:0 1.5rem; }
.fav-bar button[disabled]{ opacity:.5; cursor:not-allowed; }
@media (max-width: 880px){
  .stat-kpis{ grid-template-columns:1fr 1fr; gap:.5rem; }
  .stat-kpis .kpi{ padding:.6rem .4rem; } .stat-kpis .kpi-n{ font-size:1.15rem; }
  .stat-kpis .kpi:first-child{ grid-column:1 / -1; }
  .stat-controls .btn-secondary{ flex:1 1 100%; }
  .fav-bar{ padding:0 .8rem; } .fav-bar button{ flex:1 1 100%; }
}

/* ================= v5 : page Télécharger ================= */
.hero-apps{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.6rem; margin:.9rem 0 .2rem; }
.hero-apps span{ color:rgba(255,255,255,.75); font-size:.82rem; }
.app-pill{ display:inline-block; background:#fff; color:var(--navy); font-weight:700; text-decoration:none; padding:.5rem 1rem; border-radius:999px; font-size:.9rem; box-shadow:var(--shadow); }
.app-pill:hover{ background:var(--orange); color:#fff; }
.dl-page{ max-width:1080px; margin:0 auto; padding:0 1.5rem 4rem; }
.dl-detected{ color:var(--ink-soft); font-size:.88rem; margin-bottom:1rem; }
.dl-detected a{ color:var(--orange-deep); }
.dl-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:1rem; }
.dl-card{ position:relative; background:var(--panel-bg); border:1px solid var(--line); border-radius:16px; padding:1.4rem 1.1rem 1.1rem; text-align:center; display:flex; flex-direction:column; align-items:center; gap:.35rem; }
.dl-card.recommended{ border:2px solid var(--orange); box-shadow:var(--shadow); }
.dl-rec{ position:absolute; top:-.7rem; left:50%; transform:translateX(-50%); background:var(--orange); color:#fff; font-size:.7rem; font-weight:700; padding:.15rem .6rem; border-radius:999px; white-space:nowrap; }
.dl-icon{ font-size:2.2rem; }
.dl-card h3{ font-family:var(--display); margin:.1rem 0 0; font-size:1.05rem; }
.dl-card p{ margin:0 0 .5rem; color:var(--ink-soft); font-size:.8rem; }
.dl-btn{ display:inline-block; margin-top:auto; background:var(--navy); color:#fff; border:0; font:inherit; font-weight:600; padding:.65rem 1rem; border-radius:10px; text-decoration:none; cursor:pointer; width:100%; }
.dl-btn:hover{ background:var(--orange-deep); }
.dl-btn.secondary{ background:var(--paper-deep); color:var(--ink); }
.dl-btn.disabled{ background:var(--paper-deep); color:var(--ink-soft); cursor:default; }
html.is-dark .dl-btn{ background:#2b3a63; }
.dl-alt{ font-size:.78rem; color:var(--ink-soft); } .dl-alt a{ color:var(--orange-deep); }
.dl-help{ margin-top:1.6rem; display:flex; flex-direction:column; gap:.5rem; }
.dl-help details{ background:var(--panel-bg); border:1px solid var(--line); border-radius:12px; padding:.7rem 1rem; }
.dl-help summary{ cursor:pointer; font-weight:600; }
.dl-help p{ margin:.6rem 0 .2rem; color:var(--ink-soft); font-size:.88rem; line-height:1.5; }
@media (max-width: 880px){ .dl-page{ padding:0 .8rem 5rem; } }

/* v5.0.1 : la zone de saisie occupe la barre ; le choix du métier est un bouton compact à droite */
.hero-search{ cursor:text; }
.hero-search input{ flex:1 1 auto; min-width:0; cursor:text; }
.hero-search select{ flex:0 0 auto; width:190px; cursor:pointer; border-left:1px solid var(--line) !important; padding-left:.7rem; margin-right:.4rem; }
.hero-search input::placeholder{ color:var(--ink-soft); }
@media (max-width: 880px){ .hero-search select{ width:100%; border-left:none !important; } }

/* v6 : métiers regroupés par univers */
.chip-group{ display:flex; flex-wrap:wrap; gap:.35rem; width:100%; margin-bottom:.45rem; }
.chip-group-title{ width:100%; text-align:left; background:none; border:0; padding:.2rem 0 0; font:inherit; font-size:.7rem; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; color:var(--orange-deep); cursor:pointer; }
.chip-group-title:hover{ text-decoration:underline; }
.trade-group-title{ grid-column:1 / -1; font-family:var(--display); font-size:1.05rem; margin:1rem 0 0; color:var(--ink); }
.trade-group-title small{ font-family:var(--sans); font-weight:500; font-size:.8rem; color:var(--ink-soft); margin-left:.4rem; }
.trade-group-title:first-child{ margin-top:0; }

/* ================= v7 : présentation, certifications, recherche avancée ================= */
.presentation p{ margin:.2rem 0 .4rem; line-height:1.55; font-size:.88rem; }
.cert-card{ border:1px solid var(--line); border-left:4px solid var(--success); border-radius:10px; padding:.6rem .75rem; margin:.5rem 0; font-size:.83rem; display:flex; flex-direction:column; gap:.2rem; }
.cert-card.agr{ border-left-color:#1f5f99; } .cert-card.qo{ border-left-color:#3f51b5; } .cert-card.epv{ border-left-color:#b8860b; }
.cert-card .cc-h{ font-weight:700; font-size:.9rem; } .cert-card .cc-h small{ font-weight:500; color:var(--ink-soft); margin-left:.3rem; }
.cert-card .tags{ display:flex; flex-wrap:wrap; gap:.25rem; margin-top:.2rem; }
.tag.muted{ opacity:.7; }
.adv{ display:grid; grid-template-columns:340px minmax(0,1fr); gap:1rem; max-width:1500px; margin:0 auto; padding:0 1.5rem 3rem; align-items:start; }
.adv-crit{ background:var(--panel-bg); border:1px solid var(--line); border-radius:14px; padding:.4rem .9rem .9rem; position:sticky; top:.5rem; max-height:calc(100vh - 90px); overflow:auto; }
.adv-sec{ border-bottom:1px solid var(--line); padding:.7rem 0; display:flex; flex-direction:column; gap:.35rem; }
.adv-sec:last-child{ border-bottom:0; }
.adv-sec h4{ margin:0; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--orange-deep); }
.adv-sec label{ font-size:.8rem; color:var(--ink-soft); }
.adv-sec input[type=search], .adv-sec input[type=number], .adv-sec select{ width:100%; padding:.45rem .55rem; border:1px solid var(--line); border-radius:8px; background:var(--panel-bg); color:var(--ink); font:inherit; font-size:.85rem; }
.adv-sec select[multiple]{ font-size:.8rem; }
.adv-2{ display:grid; grid-template-columns:1fr 1fr; gap:.4rem; }
.adv-checks{ display:flex; flex-direction:column; gap:.15rem; } .adv-checks .check{ font-size:.82rem; color:var(--ink); }
.adv-grp{ border:1px solid var(--line); border-radius:8px; padding:.25rem .5rem; }
.adv-grp summary{ cursor:pointer; display:flex; justify-content:space-between; align-items:center; font-size:.84rem; font-weight:600; }
.adv-grp summary label{ color:var(--ink); font-size:.84rem; } .adv-grp summary small{ color:var(--ink-soft); font-weight:400; }
.adv-grp-items{ display:flex; flex-direction:column; gap:.1rem; padding:.3rem 0 .2rem .2rem; }
.adv-grp-items .check{ font-size:.8rem; color:var(--ink); } .adv-grp-items small{ color:var(--ink-soft); }
.adv-ac{ position:relative; }
.adv-sug{ display:none; position:absolute; left:0; right:0; top:100%; z-index:20; background:var(--panel-bg); border:1px solid var(--line); border-radius:8px; box-shadow:var(--shadow); max-height:320px; overflow:auto; }
.adv-sug.open{ display:block; }
.adv-sug .sg-item{ padding:.4rem .6rem; font-size:.82rem; cursor:pointer; border-bottom:1px solid var(--line); }
.adv-sug .sg-item:hover{ background:var(--paper); } .adv-sug small{ display:block; color:var(--orange-deep); font-size:.68rem; }
.adv-chips, .adv-presets{ display:flex; flex-wrap:wrap; gap:.3rem; }
.adv-chips .achip small{ color:var(--orange-deep); }
.adv-presets{ margin:.2rem 0 .6rem; } .adv-presets .achip{ cursor:pointer; }
.hint{ font-size:.72rem; color:var(--ink-soft); margin:0; }
.adv-seg{ display:flex; gap:.8rem; font-size:.8rem; }
.adv-range{ display:flex; align-items:center; gap:.4rem; } .adv-range input{ flex:1; }
.adv-res{ min-width:0; }
.adv-head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.6rem; margin-bottom:.4rem; }
.adv-count{ font-size:1.05rem; } .adv-count b{ font-family:var(--display); font-size:1.5rem; color:var(--orange-deep); }
.adv-actions{ display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; }
.adv-actions select{ padding:.45rem .5rem; border:1px solid var(--line); border-radius:8px; background:var(--panel-bg); color:var(--ink); font:inherit; font-size:.85rem; }
.adv-break{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; margin-bottom:.6rem; }
.adv-break h5{ margin:0 0 .3rem; font-size:.7rem; text-transform:uppercase; color:var(--ink-soft); }
.adv-break .bk{ display:inline-block; margin:0 .3rem .3rem 0; padding:.2rem .5rem; border:1px solid var(--line); border-radius:999px; font-size:.75rem; cursor:pointer; background:var(--panel-bg); }
.adv-break .bk:hover{ border-color:var(--orange); }
.adv-scroll{ overflow:auto; background:var(--panel-bg); border:1px solid var(--line); border-radius:14px; }
.adv-table{ width:100%; border-collapse:collapse; font-size:.8rem; }
.adv-table th{ text-align:left; padding:.55rem .6rem; border-bottom:2px solid var(--line); color:var(--ink-soft); font-weight:600; white-space:nowrap; position:sticky; top:0; background:var(--panel-bg); }
.adv-table td{ padding:.5rem .6rem; border-bottom:1px solid var(--line); vertical-align:top; }
.adv-table td small{ display:block; color:var(--ink-soft); font-size:.7rem; }
.adv-table a{ color:var(--ink); text-decoration:none; } .adv-table a:hover{ color:var(--orange-deep); }
.adv-flags{ min-width:140px; } .adv-flags .mini-badge{ margin:0 .15rem .15rem 0; }
.adv-pager{ display:flex; justify-content:center; align-items:center; gap:.8rem; margin:.8rem 0; font-size:.85rem; }
.adv-pager button{ border:1px solid var(--line); background:var(--panel-bg); color:var(--ink); padding:.4rem .8rem; border-radius:8px; cursor:pointer; font:inherit; }
.adv-pager button[disabled]{ opacity:.4; cursor:default; }
.adv-loading, .empty{ padding:2rem; text-align:center; color:var(--ink-soft); }
.spin{ display:inline-block; width:14px; height:14px; border:2px solid var(--line); border-top-color:var(--orange); border-radius:50%; animation:spin .8s linear infinite; vertical-align:-2px; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.mini-badge.ok{ background:rgba(47,158,110,.14); color:var(--success); }
@media (max-width: 980px){ .adv{ grid-template-columns:1fr; padding:0 .8rem 5rem; } .adv-crit{ position:static; max-height:none; } .adv-break{ grid-template-columns:1fr; } }
.adv-jump{ display:none; }
@media (max-width: 980px){ .adv-jump{ display:block; position:fixed; left:50%; transform:translateX(-50%); bottom:calc(70px + env(safe-area-inset-bottom)); z-index:600;
  background:var(--orange); color:#fff; border:0; border-radius:999px; padding:.7rem 1.2rem; font:inherit; font-weight:700; box-shadow:var(--shadow); } }