/* ===========================================================
   CLIM CONFORT — feuille de style unique (rendu dynamique PHP)
   -----------------------------------------------------------
   Sommaire
     0.  Police locale (Plus Jakarta Sans, sans appel externe)
     1.  Tokens (:root)
     2.  Reset & base + système de sections
     3.  Boutons
     4.  Header / nav desktop
     5.  Nav mobile (burger -> X, sidebar, overlay)
     6.  Hero + formulaire de devis
     7.  Bandeau de réassurance
     8.  SEO + carte (lazy Google Maps)
     9.  Services
     10. Entreprises locales (fiches GMB)
     11. Galerie "nos réalisations"
     12. CTA final
     13. Maillage interne
     14. Footer
     15. Box flottante (pulse + fermeture/réouverture)
     16. Pages simples (page-hero, prose, devis, recherche, listing)
     17. Responsive
   =========================================================== */

/* ---------- 0. POLICE LOCALE ------------------------------ */
/* Plus Jakarta Sans, fichier VARIABLE (un seul .woff2 couvre l'axe de
   graisse 200-800), servi depuis assets/fonts/ : aucune requête vers
   Google Fonts (zéro footprint externe, rendu immédiat). */
@font-face{
  font-family:'Plus Jakarta Sans';
  font-style:normal;font-weight:200 800;font-display:swap;
  src:url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Plus Jakarta Sans';
  font-style:normal;font-weight:200 800;font-display:swap;
  src:url('../fonts/plus-jakarta-sans-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* ---------- 1. TOKENS ------------------------------------- */
:root{
  /* couleurs */
  --navy:#0A2540;
  --navy-2:#123c6b;
  --blue:#1D5FE0;
  --blue-hover:#1749B0;
  --ice:#22B8CF;
  --ice-soft:#E7F6F9;
  --bg:#F5F8FC;
  --surface:#fff;
  --text:#0F1C33;
  --text-2:#33435C;
  --muted:#5B6B85;
  --border:#E3E9F2;
  --border-2:#E9EEF6;
  --blue-soft:#EEF3FB;
  --green:#0B7A38; --green-bg:#E7F7EE; --green-bd:#BFE9CF;
  --red:#C42121;   --red-bg:#FCEAEA;   --red-bd:#F3C7C7;
  --star:#F5A524;
  /* espacement */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-6:24px;
  --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px;
  /* rayons */
  --r-sm:10px; --r-md:12px; --r-lg:16px; --r-xl:20px; --r-2xl:24px; --r-pill:999px;
  /* ombres */
  --sh-sm:0 4px 18px rgba(10,37,64,.06);
  --sh-md:0 12px 34px rgba(10,37,64,.10);
  --sh-lg:0 18px 44px rgba(10,37,64,.13);
  /* typo / gabarit */
  --font:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --maxw:1200px;
  --gutter:clamp(16px,4vw,24px);
}

/* ---------- 2. RESET & BASE ------------------------------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;font-family:var(--font);color:var(--text);background:var(--bg);
  line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:var(--blue);text-decoration:none}
a:hover{color:var(--blue-hover)}
h1,h2,h3,h4,p{margin:0}
button{font-family:inherit}
:focus-visible{outline:3px solid #A9C6FF;outline-offset:2px;border-radius:6px}

/* Cadrage : une section = .section (rythme vertical) + .container (largeur) */
.container{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(48px,7vw,72px)}
.section--alt{background:var(--surface);border-top:1px solid #EEF2F8;border-bottom:1px solid #EEF2F8}
.section--tight{padding-top:0}
.eyebrow{color:var(--blue);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:var(--sp-2)}
.h2{font-size:clamp(26px,3.4vw,32px);font-weight:800;letter-spacing:-.015em}
.lead{color:var(--muted);font-size:clamp(16px,2vw,18px)}
.section-head{max-width:640px;margin:0 auto var(--sp-10);text-align:center}
.stars{color:var(--star);letter-spacing:1px}
.accent{color:var(--ice)}

/* ---------- 3. BOUTONS ------------------------------------ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid transparent;border-radius:var(--r-md);
  padding:14px 22px;font-weight:700;font-size:15px;line-height:1;cursor:pointer;
  white-space:nowrap;text-align:center;
  transition:background .18s,color .18s,border-color .18s,box-shadow .18s,transform .18s;
}
.btn--sm{padding:11px 18px;font-size:14px}
.btn--lg{padding:17px 30px;font-size:17px;border-radius:var(--r-lg)}
.btn--block{width:100%}
.btn--primary{background:var(--blue);color:#fff;box-shadow:0 8px 20px rgba(29,95,224,.26)}
.btn--primary:hover{background:var(--blue-hover);color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(29,95,224,.34)}
.btn--secondary{background:#fff;color:var(--navy);border-color:#CBD6E6}
.btn--secondary:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px)}
.btn--inverse{background:var(--navy);color:#fff}
.btn--inverse:hover{background:#12365c;color:#fff;transform:translateY(-2px)}
.btn--accent{background:var(--ice);color:#062032;box-shadow:0 12px 30px rgba(34,184,207,.35)}
.btn--accent:hover{background:#3ec9dd;color:#062032;transform:translateY(-2px);box-shadow:0 16px 34px rgba(34,184,207,.42)}
.btn--white{background:#fff;color:var(--blue)}          /* sur fond bleu (box flottante) */
.btn--white:hover{background:#EAF1FF;color:var(--blue-hover);transform:translateY(-2px)}

/* ---------- 4. HEADER / NAV ------------------------------- */
.site-header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:85px;padding-block:14px}
.brand{display:flex;align-items:center;gap:10px;color:var(--navy);font-weight:800;font-size:20px;letter-spacing:-.01em}
.brand:hover{color:var(--navy)}
.brand__mark{width:30px;height:30px;border-radius:8px;background:var(--blue);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.brand__mark::after{content:"";width:12px;height:12px;background:var(--ice);border-radius:2px;transform:rotate(45deg)}
.main-nav{display:flex;align-items:center;gap:28px}
.nav-link{position:relative;color:var(--text-2);font-weight:600;font-size:15px;padding-block:4px;transition:color .18s}
.nav-link::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:2px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}
.nav-link:hover{color:var(--blue)}
.nav-link:hover::after{transform:scaleX(1)}

/* ---------- 5. NAV MOBILE --------------------------------- */
/* Burger : 3 barres simples (pas de cadre). Masqué en desktop ; en mobile il est
   FIXE au-dessus de la sidebar (z-index) → il reste visible et se transforme en
   croix pour refermer. Identique au comportement d'avant le redesign. */
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;
  cursor:pointer;padding:6px;z-index:1105}
.burger span{display:block;width:26px;height:3px;background:var(--navy);border-radius:2px;
  transition:transform .3s ease,opacity .3s ease}
.burger.active span:nth-child(1){transform:rotate(45deg) translate(7px,7px)}
.burger.active span:nth-child(2){opacity:0}
.burger.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}
/* Sidebar coulissante */
.sidebar-mobile{position:fixed;top:0;right:-100%;width:80%;max-width:320px;height:100vh;height:100dvh;
  background:#fff;padding:84px var(--sp-6) var(--sp-6);box-shadow:-6px 0 30px rgba(10,37,64,.20);
  transition:right .3s ease;z-index:1100;overflow-y:auto}
.sidebar-mobile.active{right:0}
.sidebar-mobile nav{display:flex;flex-direction:column}
.sidebar-mobile a:not(.btn){padding:14px 2px;color:var(--text-2);font-weight:600;font-size:15px;
  border-bottom:1px solid #EEF2F8}
.sidebar-mobile a:not(.btn):hover{color:var(--blue)}
.sidebar-mobile a.btn{margin-top:var(--sp-6)}
/* Overlay */
.nav-overlay{position:fixed;inset:0;background:rgba(10,37,64,.5);opacity:0;visibility:hidden;
  transition:opacity .3s ease;z-index:1090}
.nav-overlay.active{opacity:1;visibility:visible}

/* ---------- 6. HERO + FORMULAIRE -------------------------- */
.hero{background:linear-gradient(rgba(8,28,52,.72),rgba(8,28,52,.78)),var(--hero-img,linear-gradient(120deg,#123c6b,#0A2540));
  background-size:cover;background-position:center;
  min-height:90vh;display:flex;align-items:center}
.hero__inner{width:100%;padding-top:var(--sp-4);padding-bottom:clamp(48px,7vw,64px)}
.hero__grid{display:grid;grid-template-columns:1fr;gap:36px;align-items:center}
.hero__content{color:#fff}
.hero__content h1{font-size:clamp(32px,5vw,46px);line-height:1.04;font-weight:800;letter-spacing:-.02em;margin:18px 0 16px}
.hero__lead{font-size:clamp(16px,2vw,18px);color:#D5E0F0;max-width:520px;margin-bottom:20px}
.hero__actions{margin-bottom:24px}
.hero__points{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;max-width:520px}
.point{display:flex;align-items:center;gap:10px;font-size:15px;color:#EAF1FB}
.point i{color:var(--ice);font-weight:800;font-style:normal}
.badge-pill{display:inline-flex;align-items:center;gap:8px;background:rgba(34,184,207,.18);color:#9FEAF6;
  border:1px solid rgba(34,184,207,.4);border-radius:var(--r-pill);padding:7px 14px;font-size:13px;font-weight:700}
/* Lien "comment ça marche" */
.play-link{display:inline-flex;align-items:center;gap:12px;color:#fff;font-weight:600;font-size:15px}
.play-link:hover{color:#fff}
.play-link .play{width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.28);display:inline-flex;align-items:center;justify-content:center;
  transition:background .18s,transform .18s}
.play-link:hover .play{background:rgba(255,255,255,.24);transform:scale(1.06)}
.play-link .play::after{content:"";width:0;height:0;border-left:10px solid var(--ice);
  border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
/* Fil d'Ariane (dans le hero sombre) */
.breadcrumb{font-size:13px;color:#B7C6DC;padding:12px 0 24px;list-style:none;margin:0;
  display:flex;flex-wrap:wrap;align-items:center}
.breadcrumb li+li::before{content:"›";opacity:.6;margin-inline:6px}
.breadcrumb a{color:#B7C6DC}
.breadcrumb a:hover{color:#fff}
.breadcrumb li:last-child{color:#fff;font-weight:600}

/* Carte formulaire.
   color est OBLIGATOIRE : la carte est posée dans un en-tête sombre (.hero,
   .page-hero) qui impose color:#fff. Sans reset, le titre « Votre projet de… »
   serait blanc sur blanc, donc invisible. */
.quote-card{background:#fff;color:var(--text);border-radius:var(--r-xl);padding:26px;
  box-shadow:0 24px 60px rgba(4,18,38,.4)}
.quote-card h2{font-size:21px;font-weight:800;margin-bottom:4px}
.quote-card p.sub{font-size:14px;color:var(--muted);margin-bottom:18px}
.quote-form{display:flex;flex-direction:column;gap:12px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.input,.select{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:var(--r-md);
  font:inherit;font-size:15px;background:#fff;transition:border-color .18s,box-shadow .18s}
.select{color:var(--text-2)}
.input:focus,.select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #E1EBFF;outline:none}
/* --muted et non #8A99B2 : sur le blanc de la carte, l'ancien gris ne donnait que
   2,9:1 de contraste (illisible, sous le seuil WCAG AA de 4,5:1). */
.form-note{text-align:center;font-size:12px;color:var(--muted);margin-top:2px}

/* ---------- 7. RÉASSURANCE -------------------------------- */
.trust-strip{background:#fff;border:1px solid var(--border-2);border-radius:var(--r-xl);box-shadow:var(--sh-lg);
  margin-top:-42px;position:relative;z-index:20;padding:22px 30px;display:flex;align-items:center;
  justify-content:space-between;gap:26px;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:13px}
.trust-item strong{font-size:15px;display:block}
.trust-item span{font-size:13px;color:var(--muted)}
.icon-tile{width:48px;height:48px;border-radius:14px;background:var(--ice-soft);color:var(--blue);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.trust-sep{width:1px;height:44px;background:var(--border-2)}
.trust-rating{display:flex;align-items:center;gap:14px}
.trust-note{display:flex;align-items:center;gap:6px}
.trust-avis{font-size:13px;color:var(--muted)}
.avatars{display:flex}
.avatar{width:38px;height:38px;border-radius:50%;border:2px solid #fff;box-shadow:0 1px 3px rgba(10,37,64,.12)}
.avatar+.avatar{margin-left:-12px}
img.avatar{object-fit:cover;background:var(--blue-soft);display:block}
.avatar--more{background:var(--blue-soft);display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:var(--blue)}

/* ---------- 8. SEO + CARTE -------------------------------- */
.seo{display:grid;grid-template-columns:1fr;gap:40px;align-items:center}
.seo__text h2{margin-bottom:16px}
.seo__text p{color:var(--text-2);font-size:16px;margin-bottom:14px}
.seo__sub{font-size:18px;font-weight:700;margin:8px 0 12px}
.adv-list{display:grid;grid-template-columns:1fr;gap:12px 24px;list-style:none;margin:0;padding:0}
.adv-list li{display:flex;align-items:flex-start;gap:10px;font-size:15px;color:var(--text-2)}
.adv-list li::before{content:"→";color:var(--blue);font-weight:800}
/* Carte : placeholder cliquable, iframe Google Maps injectée par app.js */
.map-card{position:relative;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--border);
  box-shadow:var(--sh-md);aspect-ratio:4/3;background:#DCE6F2;cursor:pointer}
.map-placeholder{position:absolute;inset:0;background:linear-gradient(135deg,#E9EFF7,#D6E2F0);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;text-align:center}
.map-pin{width:56px;height:56px;border-radius:50%;background:var(--blue);display:flex;align-items:center;
  justify-content:center;box-shadow:0 8px 20px rgba(29,95,224,.35)}
.map-pin::after{content:"";width:16px;height:16px;background:#fff;border-radius:50%}
.map-placeholder p{color:var(--muted);font-size:14px;max-width:260px}
.map-card iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.map-card.is-open .map-placeholder{display:none}

/* ---------- 9. SERVICES ----------------------------------- */
.services-grid{display:grid;grid-template-columns:1fr;gap:20px}
.service-card{border:1px solid var(--border);border-radius:18px;padding:28px 26px;background:#fff;
  box-shadow:var(--sh-sm);transition:box-shadow .2s,transform .2s}
.service-card:hover{box-shadow:0 18px 40px rgba(10,37,64,.12);transform:translateY(-4px)}
.service-card .icon-tile{width:56px;height:56px;border-radius:16px;margin-bottom:18px}
.service-card h3{font-size:19px;font-weight:700;margin-bottom:8px}
.service-card p{color:var(--muted);font-size:15px;margin-bottom:16px}
.service-card--feature{border:0;color:#fff;background:linear-gradient(155deg,var(--navy-2),var(--navy));
  box-shadow:0 18px 40px rgba(10,37,64,.22)}
.service-card--feature h3{color:#fff}
.service-card--feature p{color:#B9C7DE}
.service-card--feature .icon-tile{background:rgba(34,184,207,.18);color:var(--ice)}
.service-card--feature .check-list{border-top-color:rgba(255,255,255,.14)}
.service-card--feature .check-list li{color:#D5E0F0}
.check-list{display:flex;flex-direction:column;gap:9px;border-top:1px solid #EEF2F8;padding-top:15px;
  list-style:none;margin:0}
.check-list li{display:flex;align-items:flex-start;gap:9px;font-size:14px;color:var(--text-2)}
.check-list li::before{content:"✓";color:var(--ice);font-weight:800}

/* ---------- 10. ENTREPRISES LOCALES (GMB) ----------------- */
.companies-grid{display:grid;grid-template-columns:1fr;gap:18px;margin-top:var(--sp-8)}
.company-card{border:1px solid var(--border);border-radius:var(--r-lg);padding:22px;background:#fff;
  box-shadow:var(--sh-sm);display:flex;flex-direction:column;gap:14px;transition:box-shadow .2s,transform .2s}
.company-card:hover{box-shadow:0 16px 36px rgba(10,37,64,.12);transform:translateY(-3px)}
.company-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.company-id{display:flex;align-items:center;gap:13px}
.company-logo{width:48px;height:48px;border-radius:14px;background:linear-gradient(140deg,#EAF1FF,#E7F6F9);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.company-logo::after{content:"";width:16px;height:16px;background:var(--blue);border-radius:3px;transform:rotate(45deg)}
.company-card h3{font-size:18px;font-weight:700;margin-bottom:3px}
.company-card .cat{font-size:13px;color:var(--muted)}
.rating{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px}
.rating .num{font-weight:700}
.rating .count{color:var(--muted)}
.stars .star{color:#D8DEE6}
.stars .star.on{color:var(--star)}
.company-addr{font-size:14px;color:var(--text-2);display:flex;align-items:flex-start;gap:8px}
.company-addr .pin{color:var(--blue);flex-shrink:0;margin-top:1px}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.action{display:inline-flex;align-items:center;gap:7px;background:var(--blue-soft);color:var(--blue);
  border-radius:var(--r-sm);padding:8px 14px;font-size:13px;font-weight:600;transition:background .18s,transform .18s}
.action:hover{background:#E1EBFF;transform:translateY(-1px)}

/* Badges (statut d'ouverture) */
.badge{display:inline-flex;align-items:center;gap:6px;border-radius:var(--r-pill);padding:5px 11px;
  font-size:12px;font-weight:700;border:1px solid transparent}
.badge--open{background:var(--green-bg);color:var(--green);border-color:var(--green-bd)}
.badge--closed{background:var(--red-bg);color:var(--red);border-color:var(--red-bd)}
.badge .dot{font-size:10px;line-height:1}

/* ---------- 11. GALERIE ----------------------------------- */
.gallery__head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px}
.gallery__nav{display:flex;gap:10px}
.gnav-btn{width:46px;height:46px;border-radius:50%;border:1px solid #CBD6E6;background:#fff;color:var(--navy);
  font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:border-color .18s,color .18s,transform .18s}
.gnav-btn:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px)}
.gallery__track{display:flex;gap:18px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;
  padding-bottom:6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.gallery__track::-webkit-scrollbar{display:none}
.gallery-item{margin:0;flex:0 0 78%;max-width:360px;scroll-snap-align:start}
.gallery-item .frame{aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;background:#DCE6F2;border:1px solid var(--border)}
.gallery-item img{width:100%;height:100%;object-fit:cover}
.gallery-item figcaption{margin-top:10px;font-size:14px;color:var(--muted)}

/* ---------- 12. CTA FINAL --------------------------------- */
.cta__panel{background:linear-gradient(120deg,var(--navy),var(--navy-2));border-radius:var(--r-2xl);
  padding:clamp(36px,5vw,56px) clamp(28px,4vw,48px);display:flex;justify-content:space-between;
  align-items:center;gap:32px;flex-wrap:wrap;overflow:hidden;position:relative}
.cta__blob{position:absolute;right:-40px;top:-40px;width:200px;height:200px;border-radius:50%;background:rgba(34,184,207,.16)}
.cta__text{color:#fff;position:relative;max-width:560px}
.cta__text h2{color:#fff;margin-bottom:10px}
.cta__text p{font-size:17px;color:#D5E0F0}
.cta__panel .btn{position:relative}

/* ---------- 12b. INFORMATIONS SUR LA COMMUNE -------------- */
.infos{display:grid;grid-template-columns:1fr;gap:32px;align-items:start}
.infos-faits{display:grid;grid-template-columns:1fr;gap:10px;margin:0}
.fait{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid var(--border-2);
  border-radius:var(--r-md);padding:13px 15px;transition:border-color .15s,box-shadow .15s,transform .15s}
.fait:hover{border-color:var(--blue);box-shadow:var(--sh-sm);transform:translateY(-1px)}
.fait-ic{width:40px;height:40px;border-radius:11px;background:var(--ice-soft);color:var(--blue);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.fait-txt{min-width:0}
.fait dt{font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.fait dd{margin:3px 0 0;font-size:16px;font-weight:700;color:var(--text);overflow-wrap:anywhere}
.infos-mairie{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);
  padding:22px;box-shadow:var(--sh-sm)}
.infos-mairie h3{font-size:17px;font-weight:700;margin-bottom:14px}
.mairie-ligne{display:flex;align-items:flex-start;gap:9px;font-size:14px;color:var(--text-2);margin-bottom:9px}
.mairie-ligne .pin{color:var(--blue);flex-shrink:0;margin-top:1px}
.horaires{border-top:1px solid #EEF2F8;margin-top:14px;padding-top:12px;display:flex;flex-direction:column;gap:7px}
.horaire{display:flex;justify-content:space-between;gap:14px;font-size:14px;color:var(--text-2)}
.horaire strong{color:var(--text);white-space:nowrap}
.infos-source{margin-top:24px;font-size:12px;color:var(--muted)}

/* ---------- 13. MAILLAGE INTERNE -------------------------- */
.mesh{display:flex;flex-direction:column;gap:32px}
.mesh-group h2{font-size:17px;font-weight:700;margin-bottom:14px}
.mesh-links{display:flex;gap:8px 18px;flex-wrap:wrap}
.mesh-links a{text-decoration:underline}

/* ---------- 14. FOOTER ------------------------------------ */
.site-footer{background:var(--navy);color:#C6D3E6}
.site-footer .container{padding-block:56px 24px}
.footer-grid{display:grid;grid-template-columns:1fr;gap:32px}
.footer-brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;font-size:20px;margin-bottom:14px}
.footer-col h4{color:#fff;font-size:14px;font-weight:700;margin-bottom:14px}
.footer-col p{font-size:14px;color:#9FB2CE;max-width:280px}
.footer-links{display:flex;flex-direction:column;gap:9px;font-size:14px;list-style:none;margin:0;padding:0}
.footer-links a{color:#9FB2CE}
.footer-links a:hover{color:#fff}
.copyright{border-top:1px solid rgba(255,255,255,.1);margin-top:40px;padding-top:20px;font-size:13px;color:#7E93B2}

/* ---------- 15. BOX FLOTTANTE ----------------------------- */
/* Carte carrée empilée (titre > texte > bouton pleine largeur) + halo qui pulse.
   Fermable (croix) → réouvrable (launcher rond). */
.float-cta{position:fixed;right:22px;bottom:22px;z-index:150;width:300px;max-width:calc(100vw - 44px);
  background:linear-gradient(135deg,var(--blue),var(--blue-hover));color:#fff;
  border-radius:var(--r-lg);padding:20px 20px 18px;
  box-shadow:0 16px 40px rgba(10,37,64,.28);animation:floatPulse 2.4s ease-out infinite}
.float-cta:hover{animation-play-state:paused}
.float-title{font-size:1.05rem;font-weight:800;line-height:1.3;margin-bottom:6px;padding-right:22px}
.float-text{font-size:.88rem;color:#DCE7FF;line-height:1.45;margin-bottom:14px}
.float-cta .btn{width:100%}
.float-close{position:absolute;top:9px;right:11px;width:24px;height:24px;border:none;border-radius:50%;
  background:rgba(255,255,255,.22);color:#fff;font-size:16px;line-height:1;cursor:pointer;
  display:flex;justify-content:center;transition:background .15s}
.float-close:hover{background:rgba(255,255,255,.4)}
.float-launcher{position:fixed;right:22px;bottom:22px;z-index:150;display:none;width:60px;height:60px;
  border:none;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--blue-hover));
  color:#fff;cursor:pointer;align-items:center;justify-content:center;
  box-shadow:0 16px 40px rgba(10,37,64,.28);animation:floatPulse 2.4s ease-out infinite}
.float-launcher:hover{animation-play-state:paused;transform:scale(1.05)}
/* Halo autour de la bordure — aucun redimensionnement de la box */
@keyframes floatPulse{
  0%{box-shadow:0 16px 40px rgba(10,37,64,.28), 0 0 0 0 rgba(29,95,224,.55)}
  70%{box-shadow:0 16px 40px rgba(10,37,64,.28), 0 0 0 16px rgba(29,95,224,0)}
  100%{box-shadow:0 16px 40px rgba(10,37,64,.28), 0 0 0 0 rgba(29,95,224,0)}}

/* ---------- 16. PAGES SIMPLES ----------------------------- */
/* Même photo de fond que le hero, mais assombrie davantage : ces pages sont
   surtout du texte, la lisibilité prime sur l'image. */
.page-hero{background:linear-gradient(rgba(8,28,52,.84),rgba(8,28,52,.88)),
    var(--hero-img,linear-gradient(120deg,var(--navy),var(--navy-2)));
  background-size:cover;background-position:center;color:#fff}
.page-hero .container{padding-block:clamp(32px,5vw,56px)}
.page-hero h1{font-size:clamp(30px,4.5vw,42px);font-weight:800;letter-spacing:-.02em;margin:8px 0}
/* Uniquement le chapô de l'en-tête : ce sélecteur ne doit PAS déteindre sur les
   paragraphes des cartes posées dans l'en-tête (la note du formulaire de devis,
   sur fond blanc, devenait illisible en bleu clair). */
.page-hero .container > p{color:#D5E0F0;max-width:640px}
/* En-tête portant le formulaire (page devis) : la carte reste au-dessus de la ligne de flottaison */
.page-hero--form .container{padding-bottom:clamp(40px,6vw,64px)}
.page-hero--form h1{margin:14px 0 12px}
.page-hero--form .hero__grid{margin-top:var(--sp-2)}
/* Tant que la grille est sur 1 colonne (mobile/tablette), le formulaire (dernier
   enfant du DOM) passe AVANT le texte : visible sans scroll. Vaut pour tous les
   héros (accueil, ville, devis). L'ordre du DOM (donc le H1) ne bouge pas. */
@media (max-width:1023px){
  .hero__grid>div:last-child{order:-1}
}
.prose{max-width:760px}
.prose h2{font-size:24px;font-weight:800;margin:32px 0 12px}
.prose p{color:var(--text-2);font-size:16px;margin-bottom:16px}
.prose ul{color:var(--text-2);font-size:16px;padding-left:20px;margin-bottom:16px}
.prose li{margin-bottom:8px}
.seo-bas{max-width:880px;margin-inline:auto}
.seo-bas h2:first-child{margin-top:0}
.devis-wrap{max-width:560px;margin:0 auto}
.devis-wrap .quote-card{box-shadow:var(--sh-md)}
/* Recherche */
.search-form{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:var(--sp-6)}
.search-form .input{flex:1;min-width:240px}
.search-count{color:var(--muted);margin-bottom:var(--sp-4)}

/* ---------- 17. RESPONSIVE -------------------------------- */
@media (max-width:860px){
  .main-nav{display:none}
  /* burger fixe, AU-DESSUS de la sidebar → reste visible comme croix pour fermer */
  .burger{display:flex;position:fixed;top:24px;right:18px}
  .trust-sep{display:none}
  .float-launcher{right:16px;bottom:16px}
}
@media (max-width:520px){
  .float-cta{right:12px;left:12px;bottom:12px;width:auto;max-width:none}
  /* Horaires mairie : jour au-dessus de l'heure */
  .horaire{flex-direction:column;gap:2px;align-items:flex-start}
  /* Fiches entreprises : l'en-tête et l'identité s'empilent */
  .company-head{flex-direction:column;align-items:flex-start;gap:9px}
  .company-id{flex-direction:column;align-items:flex-start;gap:9px}
}
@media (min-width:861px){
  .sidebar-mobile,.nav-overlay{display:none}
}
@media (min-width:768px){
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .companies-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr}
  .gallery-item{flex-basis:360px}
  .adv-list{grid-template-columns:1fr 1fr}
  .infos-faits{grid-template-columns:1fr 1fr}
}
@media (min-width:1024px){
  .hero__grid{grid-template-columns:1.1fr .9fr;gap:44px}
  .seo{grid-template-columns:1.05fr .95fr;gap:48px}
  .services-grid{grid-template-columns:repeat(3,1fr)}
  .infos{grid-template-columns:1.15fr .85fr;gap:40px}
  .infos-faits{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .float-cta,.float-launcher{animation:none}
}
