/* ===== Extincteur Nice — feuille de style ===== */
:root {
  --rouge: #c81324;
  --rouge-fonce: #9c0e1c;
  --noir: #1a1a1a;
  --gris-fonce: #333;
  --gris: #666;
  --gris-clair: #f4f4f4;
  --blanc: #ffffff;
  --vert: #1b7a3d;
  --ombre: 0 4px 16px rgba(0,0,0,0.08);
  --rayon: 8px;
  font-size: 16px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: "Segoe UI", Arial, Helvetica, sans-serif;
  color: var(--gris-fonce);
  background: var(--blanc);
  line-height: 1.6;
}

img { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; }

.container {
  max-width: 1660px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ---- Bandeau urgence ---- */
.bandeau-urgence {
  background: var(--noir);
  color: var(--blanc);
  font-size: 0.9rem;
  padding: 8px 12px;
}
.bandeau-urgence-grille {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
}
.bandeau-txt { font-size: 0.82rem; color: #cfcfcf; }
.bandeau-txt-gauche { text-align: right; }
.bandeau-txt-droite { text-align: left; }
.bandeau-tel {
  justify-self: center;
  color: #ffd54a;
  font-weight: 800;
  font-size: 1.9rem;
  letter-spacing: 0.3px;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}
.bandeau-tel:hover { text-decoration: underline; }
@media (max-width: 640px) {
  .bandeau-urgence-grille { grid-template-columns: 1fr; gap: 2px; text-align: center; }
  .bandeau-txt-gauche { text-align: center; }
  .bandeau-txt-droite { display: none; }
  .bandeau-tel { font-size: 1.6rem; }
}

/* ---- En-tête ---- */
header.site-header {
  background: var(--noir);
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid #2a2a2a;
}
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 20px;
  flex-wrap: wrap;
  gap: 12px;
}
.logo {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--blanc);
  letter-spacing: -0.5px;
}
.logo span { color: #ff5a63; }

nav.nav-principale ul {
  list-style: none;
  display: flex;
  gap: 20px;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
  align-items: center;
}
nav.nav-principale a {
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #e8e8e8;
  padding: 8px 0;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
  white-space: nowrap;
}
nav.nav-principale a:hover,
nav.nav-principale a.actif {
  color: #ff5a63;
  border-color: #ff5a63;
}

.btn-devis {
  background: var(--rouge);
  color: var(--blanc) !important;
  padding: 10px 20px;
  border-radius: 30px;
  font-weight: 700;
  font-size: 0.9rem;
  white-space: nowrap;
  transition: background .15s;
}
.btn-devis:hover { background: var(--rouge-fonce); }

.btn-urgence {
  background: var(--rouge);
  color: var(--blanc) !important;
  padding: 10px 18px;
  border-radius: 30px;
  font-weight: 700;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: nowrap;
  transition: background .15s;
  display: inline-block;
}
.btn-urgence:hover { background: var(--rouge-fonce); }

.tel-header {
  font-weight: 700;
  color: var(--noir);
  font-size: 0.95rem;
}
.tel-header .num { color: var(--rouge); }

/* ---- Hero ---- */
.hero {
  background: linear-gradient(135deg, var(--noir) 0%, #3a0509 100%);
  color: var(--blanc);
  padding: 36px 0;
}
.hero .container {
  display: flex;
  align-items: center;
  gap: 40px;
  flex-wrap: wrap;
}
.hero-texte { flex: 1 1 420px; }
.hero-texte .eyebrow {
  color: #ff8a8a;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-size: 0.8rem;
}
.hero h1 {
  font-size: 2.4rem;
  margin: 10px 0 18px;
  line-height: 1.2;
}
.hero-bandeau-ville {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.25);
  border-radius: 999px; padding: 8px 16px; font-size: 0.88rem; margin: 0 0 16px;
  max-width: fit-content;
}
.hero-bandeau-ville a { color: #ff8a8a; font-weight: 700; text-decoration: underline; }
.hero-bandeau-ville a:hover { color: #ffb3b3; }
.hero-bandeau-ville button {
  background: none; border: none; color: #ccc; cursor: pointer; font-size: 0.9rem;
  padding: 0 0 0 4px; line-height: 1;
}
.hero-bandeau-ville button:hover { color: #fff; }
.hero p { font-size: 1.05rem; color: #ddd; margin-bottom: 26px; max-width: 540px; }
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.btn-outline {
  border: 2px solid var(--blanc);
  color: var(--blanc);
  padding: 10px 22px;
  border-radius: 30px;
  font-weight: 700;
}
.hero-image { flex: 1 1 380px; }
.hero-image img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: 45% center; border-radius: var(--rayon); box-shadow: var(--ombre); }

/* ---- Bandeau chiffres ---- */
.chiffres {
  background: var(--gris-clair);
  padding: 30px 0;
}
.chiffres-grille {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 20px;
  text-align: center;
}
.chiffre .valeur { font-size: 2rem; font-weight: 800; color: var(--rouge); }
.chiffre .label { font-size: 0.85rem; color: var(--gris); text-transform: uppercase; letter-spacing: 0.5px; }

/* ---- Sections génériques ---- */
section { padding: 64px 0; }
.section-titre { text-align: center; max-width: 680px; margin: 0 auto 44px; }
.section-titre .eyebrow {
  color: var(--rouge);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.8rem;
  letter-spacing: 1.5px;
}
.section-titre h2 { font-size: 1.9rem; margin: 8px 0 12px; color: var(--noir); }
.section-titre p { color: var(--gris); }
.fond-clair { background: var(--gris-clair); }

/* ---- Grille services ---- */
.grille-services {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 24px;
}
.carte-service {
  background: var(--blanc);
  border: 1px solid #eee;
  border-radius: var(--rayon);
  padding: 26px;
  box-shadow: var(--ombre);
  transition: transform .15s;
}
.carte-service:hover { transform: translateY(-4px); }
.carte-service .icone {
  width: 48px; height: 48px;
  background: #fdeceb;
  color: var(--rouge);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
  margin-bottom: 16px;
}
.carte-service h3 { margin: 0 0 8px; font-size: 1.1rem; color: var(--noir); }
.carte-service p { margin: 0; color: var(--gris); font-size: 0.92rem; }

/* Carte service avec photo + bandeau de marques (page d'accueil) */
.carte-service-photo { padding: 16px; }
.csp-media {
  display: flex;
  align-items: stretch;
  gap: 10px;
  margin-bottom: 16px;
}
.csp-media .csp-photo {
  width: 72px;
  height: 72px;
  min-width: 72px;
  object-fit: cover;
  border-radius: 10px;
  box-shadow: none;
}
.csp-marques {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  gap: 8px;
  background: var(--gris-clair);
  border-radius: 10px;
  padding: 6px 10px;
}
.csp-marques { min-width: 0; }
.csp-marques img { max-height: 24px; max-width: 30%; min-width: 0; width: auto; height: auto; object-fit: contain; }
.carte-service-photo h3 { font-size: 1.05rem; }

/* ---- Deux colonnes ---- */
.deux-colonnes {
  display: flex;
  gap: 44px;
  align-items: center;
  flex-wrap: wrap;
}
.deux-colonnes.inverse { flex-direction: row-reverse; }
.deux-colonnes > div { flex: 1 1 420px; }
.deux-colonnes img { border-radius: var(--rayon); box-shadow: var(--ombre); }
.liste-check { list-style: none; padding: 0; margin: 18px 0; }
.liste-check li { padding-left: 30px; position: relative; margin-bottom: 10px; }
.liste-check li::before {
  content: "✓";
  position: absolute; left: 0; top: 0;
  color: var(--vert); font-weight: 800;
}

/* ---- Marques partenaires ---- */
.bande-marques {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
}
.pastille-marque {
  background: var(--blanc);
  border: 1px solid #eee;
  border-radius: 30px;
  padding: 10px 22px;
  font-weight: 700;
  color: var(--gris-fonce);
  box-shadow: var(--ombre);
}
.pastille-marque-logo {
  background: var(--blanc);
  border: 1px solid #eee;
  border-radius: 16px;
  padding: 20px 34px;
  box-shadow: var(--ombre);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 118px;
  text-decoration: none;
  transition: box-shadow .15s, transform .15s;
}
.pastille-marque-logo:hover,
a.pastille-marque:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,0.14);
  transform: translateY(-2px);
}
a.pastille-marque { cursor: pointer; }
.pastille-marque-logo img {
  max-height: 72px;
  max-width: 200px;
  width: auto;
  height: auto;
  object-fit: contain;
}
@media (max-width: 640px) {
  .pastille-marque-logo { height: 92px; padding: 14px 24px; }
  .pastille-marque-logo img { max-height: 54px; max-width: 150px; }
}

/* ---- Zone d'intervention ---- */
.grille-villes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
}
.ville-item {
  background: var(--blanc);
  border-left: 4px solid var(--rouge);
  border-radius: 4px;
  padding: 12px 16px;
  box-shadow: var(--ombre);
  font-weight: 600;
}

/* ---- Agences ---- */
.grille-agences {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}
.carte-agence {
  background: var(--blanc);
  border-radius: var(--rayon);
  padding: 20px;
  box-shadow: var(--ombre);
  border-top: 3px solid var(--rouge);
}
.carte-agence h3 { margin: 0 0 6px; font-size: 1.02rem; }
.carte-agence p { margin: 0; color: var(--gris); font-size: 0.9rem; }

/* ---- Références clients ---- */
.bande-clients {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: center;
  align-items: center;
}
.bande-clients span {
  font-weight: 800;
  font-size: 1.05rem;
  color: var(--gris);
  letter-spacing: 0.5px;
}

/* ---- FAQ ---- */
.faq-item {
  background: var(--blanc);
  border: 1px solid #eee;
  border-radius: var(--rayon);
  margin-bottom: 12px;
  overflow: hidden;
}
.faq-item summary {
  padding: 16px 20px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; font-size: 1.3rem; color: var(--rouge); }
.faq-item[open] summary::after { content: "–"; }
.faq-item .reponse { padding: 0 20px 18px; color: var(--gris); }

/* ---- CTA final ---- */
.cta-finale {
  background: var(--rouge);
  color: var(--blanc);
  text-align: center;
  padding: 56px 0;
}
.cta-finale h2 { font-size: 1.8rem; margin-bottom: 12px; }
.cta-finale p { margin-bottom: 26px; opacity: 0.9; }
.cta-finale .btn-outline { border-color: var(--blanc); }

/* ---- Formulaire contact ---- */
.form-contact {
  background: var(--blanc);
  padding: 30px;
  border-radius: var(--rayon);
  box-shadow: var(--ombre);
  display: grid;
  gap: 16px;
}
.form-contact label { font-weight: 600; font-size: 0.9rem; display: block; margin-bottom: 6px; }
.form-contact input,
.form-contact select,
.form-contact textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-family: inherit;
  font-size: 0.95rem;
}
.form-contact button {
  background: var(--rouge);
  color: var(--blanc);
  border: none;
  padding: 14px;
  border-radius: 6px;
  font-weight: 700;
  font-size: 1rem;
  cursor: pointer;
}
.form-contact button:hover { background: var(--rouge-fonce); }

.info-contact {
  display: grid;
  gap: 18px;
}
.info-contact .bloc {
  background: var(--blanc);
  border-radius: var(--rayon);
  padding: 20px;
  box-shadow: var(--ombre);
}
.info-contact .bloc h3 { margin: 0 0 6px; font-size: 1rem; color: var(--rouge); }
.info-contact .bloc p { margin: 0; color: var(--gris-fonce); }

/* ---- Fil d'ariane page interne ---- */
.entete-page {
  background: var(--noir);
  color: var(--blanc);
  padding: 46px 0;
  text-align: center;
}
.entete-page h1 { margin: 0 0 8px; font-size: 2rem; }
.entete-page p { color: #ccc; margin: 0; }

/* Bandeau d'en-tête avec une vraie photo du métier en fond, assombrie
   pour garder le texte blanc lisible (une image différente par page,
   tirée de $s['image']). */
.entete-page.avec-photo {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  isolation: isolate;
}
.entete-page.avec-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10,10,10,.78), rgba(10,10,10,.9));
  z-index: -1;
}
.entete-page.avec-photo p { color: #e2e2e2; }

/* ---- Pied de page ---- */
footer.site-footer {
  background: var(--noir);
  color: #ccc;
  padding: 50px 0 20px;
  font-size: 0.9rem;
}
.footer-grille {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 30px;
  margin-bottom: 30px;
}
.footer-grille h4 { color: var(--blanc); margin: 0 0 14px; font-size: 1rem; }
.footer-grille ul { list-style: none; padding: 0; margin: 0; }
.footer-grille li { margin-bottom: 8px; }
.footer-grille a:hover { color: var(--blanc); }
.footer-bas {
  border-top: 1px solid #333;
  padding-top: 18px;
  text-align: center;
  font-size: 0.82rem;
  color: #888;
}

/* ---- Bouton flottant appel mobile ---- */
.bouton-flottant {
  position: fixed;
  bottom: 18px;
  right: 18px;
  background: var(--rouge);
  color: var(--blanc);
  width: 56px; height: 56px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
  box-shadow: 0 6px 18px rgba(0,0,0,0.3);
  z-index: 60;
}

/* ---- Responsive ---- */
@media (max-width: 820px) {
  .hero h1 { font-size: 1.8rem; }
  .deux-colonnes, .deux-colonnes.inverse { flex-direction: column; }
}

/* ==========================================================
   Réseau d'agences — carte + coordonnées
   ========================================================== */
.reseau{background:#12161d;color:#fff;padding:76px 0}
.reseau .section-titre{text-align:center;margin-bottom:44px}
.reseau .section-titre h2{color:#fff;margin:8px 0 12px}
.reseau .section-titre p{color:#9aa6b5;max-width:60ch;margin:0 auto}
.reseau .eyebrow{color:#ff5a63}

.reseau-grille{
  display:grid;grid-template-columns:232px minmax(0,1fr) 232px;
  gap:22px;align-items:center}
.reseau-colonne{display:grid;gap:14px}
.reseau-carte{
  background:#1b212b;border:1px solid #2a3240;border-radius:10px;padding:16px 18px;
  transition:.18s ease}
.reseau-carte:hover{border-color:#c81324;transform:translateY(-2px)}
.reseau-carte h3{
  color:#ff5a63;font-size:1rem;margin:0 0 9px;font-weight:700;letter-spacing:.01em}
.reseau-carte p{margin:0;font-size:.87rem;line-height:1.55;color:#c3ccd8}
.reseau-carte a{color:#c3ccd8;text-decoration:none}
.reseau-carte a:hover{color:#fff}
.reseau-carte .ligne{display:flex;gap:8px;align-items:flex-start;margin-top:6px}
.reseau-carte .ligne span:first-child{opacity:.55;flex:0 0 auto}
.reseau-visuel img{width:100%;height:auto;display:block;border-radius:12px}
.reseau-note{text-align:center;color:#8894a4;font-size:.88rem;line-height:1.7;margin:22px 0 0}
.reseau-note a{color:#c3ccd8;text-decoration:none}
.reseau-note a:hover{color:#fff}
.reseau-note strong{color:#fff}

@media(max-width:1080px){
  .reseau-grille{grid-template-columns:1fr}
  .reseau-visuel{order:-1;margin-bottom:22px}
  .reseau-colonne{grid-template-columns:1fr 1fr;display:grid}
}
@media(max-width:600px){
  .reseau{padding:54px 0}
  .reseau-colonne{grid-template-columns:1fr}
}

/* ==========================================================
   Navigation : menus déroulants et bouton mobile
   ========================================================== */
.saut-contenu{position:absolute;left:-9999px;top:0;background:var(--rouge);color:#fff;
  padding:12px 18px;z-index:999;border-radius:0 0 6px 0;font-weight:700}
.saut-contenu:focus{left:0}

.nav-principale li.a-sous-menu{position:relative}
.nav-principale .sous-menu{
  position:absolute;top:100%;left:0;min-width:250px;background:#1b212b;
  border:1px solid #2a3240;border-radius:10px;box-shadow:0 12px 34px rgba(0,0,0,.35);
  padding:8px;margin:10px 0 0;display:block;list-style:none;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:.16s ease;z-index:80}
.nav-principale li.a-sous-menu:hover>.sous-menu,
.nav-principale li.a-sous-menu:focus-within>.sous-menu{opacity:1;visibility:visible;transform:none}
.nav-principale .sous-menu li{display:block;margin:0}
.nav-principale .sous-menu a{display:block;padding:10px 12px;border-radius:6px;
  font-size:.82rem;font-weight:600;text-transform:none;letter-spacing:0;white-space:nowrap;color:#dfe4ea;border-bottom:none}
.nav-principale .sous-menu a:hover{background:#262e3a;color:#ff5a63;border-color:transparent}
.nav-principale li.a-sous-menu>a::after{
  content:"";display:inline-block;width:5px;height:5px;margin-left:6px;vertical-align:2px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg);opacity:.6}

.menu-bascule{display:none;background:none;border:1px solid #3a3a3a;border-radius:7px;
  padding:10px 11px;cursor:pointer;margin-left:auto}
.menu-bascule span{display:block;width:20px;height:2px;background:var(--blanc);border-radius:2px}
.menu-bascule span+span{margin-top:4px}

@media(max-width:1080px){
  .menu-bascule{display:block;order:2}
  .nav-principale{display:none;order:3;width:100%;}
  .nav-principale.ouvert{display:block}
  .nav-principale ul{flex-direction:column;align-items:stretch;gap:0}
  .nav-principale a{color:#e8e8e8;padding:11px 4px;border-bottom:1px solid #2a2a2a}
  .nav-principale .sous-menu{position:static;opacity:1;visibility:visible;transform:none;
    box-shadow:none;border:none;background:transparent;padding:0 0 6px 14px;margin:0;min-width:0}
  .nav-principale .sous-menu a{border-bottom:none;padding:8px 4px}
  .nav-principale li.a-sous-menu>a::after{display:none}
}

/* ==========================================================
   Fil d'Ariane
   ========================================================== */
.fil-ariane{background:#fafbfc;border-bottom:1px solid #ebeef1;font-size:.83rem;padding:11px 0}
.fil-ariane a{color:var(--gris);text-decoration:none}
.fil-ariane a:hover{color:var(--rouge)}
.fil-ariane span{margin:0 7px;color:#c2c8d0}
.fil-ariane strong{color:var(--noir);font-weight:600}

/* ==========================================================
   Cartes cliquables et liens
   ========================================================== */
a.carte-lien{text-decoration:none;color:inherit;display:block}
a.carte-lien:hover{text-decoration:none}
.lien-fleche{display:inline-block;margin-top:12px;color:var(--rouge);font-weight:700;font-size:.88rem}
a.carte-lien:hover .lien-fleche{text-decoration:underline}

/* ==========================================================
   Bande de villes / communes
   ========================================================== */
.bande-villes{display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.bande-villes a,.bande-villes span{
  border:1px solid #e0e4e9;background:#fff;border-radius:999px;padding:8px 17px;
  font-size:.9rem;font-weight:600;color:var(--gris-fonce);text-decoration:none}
.bande-villes a:hover{border-color:var(--rouge);color:var(--rouge);text-decoration:none}
.fond-clair .bande-villes a,.fond-clair .bande-villes span{background:#fff}

/* ==========================================================
   Encart agence (pages villes)
   ========================================================== */
.encart-agence{background:var(--gris-clair);border:1px solid #e3e6ea;border-radius:12px;padding:26px}
.encart-agence h3{margin:0 0 14px;color:var(--noir);font-size:1.15rem}
.encart-agence .adresse{font-weight:600;color:var(--noir)}
.encart-agence .tel-fort{font-size:1.4rem;font-weight:800;color:var(--rouge);text-decoration:none}
.encart-agence .mention{font-size:.84rem;color:var(--gris)}
.encart-agence .btn-devis{margin-top:8px}

/* bloc de texte pleine largeur dans les modèles */
.bloc-texte{max-width:820px}

/* cartes agences cliquables */
a.reseau-carte{display:block;text-decoration:none}
a.reseau-carte:hover{text-decoration:none}
.reseau-carte .lien-fleche{color:#ff5a63;font-size:.83rem;margin-top:10px;display:inline-block}
.mention-carte{color:#8894a4;font-weight:600;font-size:.78rem}

/* ---- Galerie vidéos réalisations ---- */
.grille-videos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 280px));
  gap: 22px;
  margin-top: 24px;
}
.carte-video {
  background: var(--blanc);
  border-radius: var(--rayon);
  box-shadow: var(--ombre);
  overflow: hidden;
}
.carte-video video {
  display: block;
  width: 100%;
  aspect-ratio: 9 / 16;
  background: #000;
  object-fit: cover;
}
.carte-video .legende {
  padding: 14px 18px 18px;
}
.carte-video .legende h3 {
  margin: 0 0 6px;
  font-size: 1.02rem;
  color: var(--noir);
}
.carte-video .legende p {
  margin: 0;
  font-size: .92rem;
  color: var(--gris);
}
.grille-realisations {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 26px;
  margin-top: 30px;
}
.carte-realisation .photo-realisation { height: 200px; max-height: none; object-position: center; margin-bottom: 12px; }
.etiquette-categorie {
  display: inline-block;
  background: var(--noir);
  color: var(--blanc);
  font-weight: 700;
  font-size: .78rem;
  padding: 4px 12px;
  border-radius: 20px;
  margin-bottom: 6px;
}
.carte-realisation p { margin: 4px 0 0; font-size: .92rem; }
.badge-partenaire {
  display: inline-block;
  background: var(--rouge);
  color: var(--blanc);
  font-weight: 700;
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 5px 12px;
  border-radius: 20px;
  margin-bottom: 14px;
}
.teaser-realisations {
  display: flex;
  align-items: center;
  gap: 24px;
  background: var(--noir);
  border-radius: var(--rayon);
  padding: 26px 28px;
  color: var(--blanc);
  flex-wrap: wrap;
}
.teaser-realisations img { border-radius: 10px; width: 130px; height: auto; }
.teaser-realisations .txt { flex: 1; min-width: 220px; }
.teaser-realisations h3 { margin: 0 0 6px; font-size: 1.15rem; }
.teaser-realisations p { margin: 0 0 14px; color: #cfd4da; font-size: .93rem; }

/* Photo d'illustration de service : hauteur fixe et recadrée, pour que
   toutes les photos (portrait ou paysage) gardent la même proportion
   nette, sans jamais s'étirer en longueur. */
.photo-service {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 540px;
  margin: 0 auto;
  object-fit: contain;
  border-radius: var(--rayon);
  box-shadow: var(--ombre);
}
@media (max-width: 780px) {
  .photo-service { max-height: 440px; }
}

.photo-realisation {
  width: 100%;
  max-height: 460px;
  object-fit: cover;
  object-position: top center;
  border-radius: var(--rayon);
  box-shadow: var(--ombre);
}

/* Photo au format portrait très allongé (ex : plan d'intervention) :
   on la recadre dans un cadre proche du carré plutôt que de garder
   sa hauteur d'origine, pour qu'elle s'aligne avec la photo voisine. */
.photo-realisation-verticale {
  aspect-ratio: 4 / 5;
  max-height: 420px;
  object-position: top center;
}

/* ---- Avis clients ---- */
.note-avis {
  text-align: center;
  font-weight: 700;
  color: var(--gris-fonce);
  margin-top: 4px;
}
.etoiles-avis { color: #f5a623; letter-spacing: 2px; }
.carousel-avis-wrap {
  position: relative;
  margin-top: 30px;
  padding: 0 46px;
}
.carousel-avis {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 10px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.carousel-avis::-webkit-scrollbar { display: none; }
.carte-avis {
  flex: 0 0 300px;
  scroll-snap-align: start;
  background: var(--blanc);
  border-radius: var(--rayon);
  box-shadow: var(--ombre);
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
}
.carte-avis .texte-avis {
  font-size: .93rem;
  color: var(--gris-fonce);
  flex: 1;
  margin: 10px 0 14px;
}
.carte-avis .auteur-avis {
  font-weight: 700;
  color: var(--noir);
  font-size: .88rem;
}
.carte-avis .date-avis { font-weight: 400; color: var(--gris); }
.carousel-fleche {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid #eee;
  background: var(--blanc);
  box-shadow: var(--ombre);
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
  color: var(--rouge);
  z-index: 2;
}
.carousel-fleche-g { left: 0; }
.carousel-fleche-d { right: 0; }
.carousel-fleche:hover { background: var(--rouge); color: var(--blanc); }
@media (max-width: 640px) {
  .carousel-avis-wrap { padding: 0 40px; }
  .carte-avis { flex-basis: 260px; }
}

/* Menu sur une ligne pleine largeur (ordinateur) */
@media(min-width:1081px){
  .header-inner .nav-principale{order:3;width:100%;border-top:1px solid #2a2a2a;padding-top:6px}
  nav.nav-principale>ul{justify-content:space-between;gap:8px;flex-wrap:nowrap}
  nav.nav-principale>ul>li>a{font-size:.72rem;letter-spacing:0}
  .nav-principale li.a-sous-menu>a::after{margin-left:4px}
  nav.nav-principale>ul>li:last-child>.sous-menu{left:auto;right:0}
}

/* Fonds de page décoratifs */
body { background: #f4f5f7; }
main > section { background-color: #fff;
  background-image: radial-gradient(rgba(200,19,36,.07) 1px, transparent 1.4px);
  background-size: 22px 22px; }
main > section.fond-clair { background-color: #f3f4f7;
  background-image: radial-gradient(circle at 0% 0%, rgba(200,19,36,.10), transparent 45%),
                    radial-gradient(circle at 100% 100%, rgba(26,26,26,.07), transparent 50%); background-size: auto; }
main > section.bande-partenaires { background: linear-gradient(135deg, #1a1a1a 0%, #3a0509 100%); }
.bande-partenaires .eyebrow { color: #ff8a8a; }
.bande-partenaires h2 { color: #fff; }

/* Bloc « Nous trouver » */
main > section.nous-trouver { background: #141414; padding: 56px 0; color: #fff; }
.nt-grille { display: grid; grid-template-columns: 1.1fr 1fr; background: #1b1b1b; border: 1px solid #2c2c2c; border-radius: 14px; overflow: hidden; }
.nt-carte { min-height: 420px; }
.nt-carte iframe { width: 100%; height: 100%; min-height: 420px; border: 0; display: block; }
.nt-infos { padding: 40px; }
.nt-eyebrow { color: #ff5a63; font-weight: 800; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; display: flex; align-items: center; gap: 10px; }
.nt-eyebrow::before { content: ""; width: 26px; height: 2px; background: #ff5a63; }
.nt-gris { color: #9aa0a6; } .nt-gris::before { display: none; }
.nt-infos h2 { color: #fff; font-size: 1.45rem; margin: 12px 0 10px; line-height: 1.3; }
.nt-texte { color: #b9bec4; font-size: .93rem; margin: 0 0 6px; }
.nt-infos hr { border: 0; border-top: 1px solid #2f2f2f; margin: 22px 0; }
.nt-tel-2 { font-size: 1.5rem !important; margin-top: 14px !important; }
.nt-tel { display: block; color: #fff; font-size: 2rem; font-weight: 800; margin: 6px 0 4px; }
.nt-boutons { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0; }
.nt-btn { border: 1px solid #3a3a3a; color: #fff; padding: 12px 20px; border-radius: 8px; font-weight: 700; font-size: .92rem; }
.nt-btn:hover { border-color: #ff5a63; }
.nt-btn-rouge { background: var(--rouge); border-color: var(--rouge); }
.nt-bas { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.nt-badge { border: 1px solid #3a3a3a; border-radius: 999px; padding: 7px 14px; font-size: .82rem; color: #c9cdd2; }
.nt-lien { color: #c9cdd2; text-decoration: underline; font-size: .9rem; }
@media (max-width: 860px) { .nt-grille { grid-template-columns: 1fr; } .nt-carte, .nt-carte iframe { min-height: 300px; } .nt-infos { padding: 26px; } .nt-tel { font-size: 1.6rem; } }

/* Mise en avant Grand Prix de Monaco F1 */
.hero-bandeau-ville[hidden] { display: none; }
.bandeau-f1 { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 18px;
  background: linear-gradient(90deg, rgba(200,19,36,.95), rgba(156,14,28,.85)); color: #fff;
  border: 1px solid rgba(255,255,255,.25); border-radius: 14px; padding: 16px 28px 16px 20px; border-width: 2px;
  box-shadow: 0 8px 24px rgba(0,0,0,.35); transition: transform .15s; }
.bandeau-f1:hover { transform: translateY(-2px); }
.bandeau-f1-drapeau { font-size: 3rem; line-height: 1; }
.bandeau-f1 span:last-child { font-size: 1.75rem; font-weight: 900; line-height: 1.15; }
.bandeau-f1 small { display: block; font-size: .9rem; margin-bottom: 4px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; opacity: .9; }
main > section.section-f1 { padding: 36px 0; }
.section-f1 .teaser-realisations { padding: 30px 34px; gap: 34px; }
.section-f1 .teaser-realisations img { width: 280px; border-radius: 12px; }
.section-f1 .teaser-realisations h3 { font-size: 2rem; font-weight: 900; color: #fff; }
.section-f1 .teaser-realisations p { font-size: 1rem; }
.section-f1 .badge-partenaire { font-size: .8rem; }
@media (max-width: 700px) { .section-f1 .teaser-realisations { flex-direction: column; align-items: flex-start; }
  .section-f1 .teaser-realisations img { width: 100%; } .bandeau-f1 span:last-child { font-size: 1.3rem; } .bandeau-f1-drapeau { font-size: 2.2rem; } }

/* Tarifs */
.grille-tarifs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.carte-tarif{background:#fff;border:1px solid #e6e8eb;border-radius:14px;padding:26px 24px;position:relative;box-shadow:0 4px 16px rgba(0,0,0,.05)}
.carte-tarif h3{font-size:1.05rem;margin:0 0 10px;color:var(--noir)}
.carte-tarif .prix{font-size:2.2rem;font-weight:800;color:var(--rouge);margin:0 0 8px;line-height:1.1}
.carte-tarif .prix small{display:block;font-size:.8rem;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.04em}
.carte-tarif p{margin:0;color:#555;font-size:.93rem}
.carte-tarif.mise-avant{border:2px solid var(--rouge)}
.carte-tarif .ruban{position:absolute;top:-12px;left:20px;background:var(--rouge);color:#fff;font-size:.75rem;font-weight:700;padding:4px 12px;border-radius:20px}
.bandeau-offert{margin-top:26px;background:#fff4e5;border:1px solid #ffd79a;color:#7a4a00;border-radius:12px;padding:16px 20px;text-align:center;font-size:1.02rem}
@media(max-width:900px){.grille-tarifs{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.grille-tarifs{grid-template-columns:1fr}}

/* Bandeau offre pro */
.bandeau-promo{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 18px;padding:12px 16px;background:linear-gradient(90deg,#b71c1c,#e53935);color:#fff;text-decoration:none;text-align:center;font-size:1.05rem}
.bandeau-promo:hover{filter:brightness(1.08)}
.promo-badge{background:#ffd600;color:#b71c1c;font-weight:800;padding:4px 12px;border-radius:30px;letter-spacing:.5px}
.bandeau-promo s,.prix-barre{opacity:.8;font-weight:600;text-decoration-thickness:2px}
.promo-prix{font-size:1.25rem;color:#ffd600}
.promo-zone{font-weight:600}
.carte-tarif .prix-barre{color:#888;font-size:1.3rem;margin-right:6px}
@media(max-width:600px){.bandeau-promo{font-size:.95rem}.promo-prix{font-size:1.1rem}}

/* Barème + aides */
.section-bareme{padding:60px 0;background:#fff}
.bandeau-aides{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;background:#fff4e5;border:2px solid #ff9800;border-radius:14px;padding:16px;margin-bottom:34px;text-align:center;font-weight:600;color:#5d3a00}
.aides-montant{background:#e53935;color:#fff;font-weight:800;font-size:1.3rem;padding:6px 16px;border-radius:30px}
.tableau-scroll{overflow-x:auto}
.tableau-bareme{width:100%;border-collapse:collapse;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 6px 24px rgba(0,0,0,.08)}
.tableau-bareme th{background:#1c1c1c;color:#fff;padding:14px;text-align:left;font-size:.95rem}
.tableau-bareme td{padding:14px;border-bottom:1px solid #eee;color:#333}
.tableau-bareme tbody tr:nth-child(even){background:#fafafa}
.tableau-bareme td:first-child{font-weight:700}
.tableau-bareme .aide{color:#2e7d32;font-weight:800}
.note-bareme{font-size:.85rem;color:#777;margin-top:10px;text-align:center}
@media(max-width:700px){
 .tableau-bareme thead{display:none}
 .tableau-bareme,.tableau-bareme tbody,.tableau-bareme tr,.tableau-bareme td{display:block;width:100%}
 .tableau-bareme tr{border-bottom:3px solid #eee;padding:6px 0}
 .tableau-bareme td{display:flex;justify-content:space-between;gap:10px;border:0;padding:8px 14px;text-align:right}
 .tableau-bareme td::before{content:attr(data-l);font-weight:600;color:#888;text-align:left}
}

/* Case promo kit entreprise */
.section-promo{padding:50px 0 30px;background:#fff}
.carte-promo{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;border:4px dashed #ffd600;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#b71c1c,#e53935);box-shadow:0 14px 40px rgba(183,28,28,.35)}
.promo-photo{background:#ebe0d8;height:100%;display:flex;align-items:center}
.promo-photo img{width:100%;height:auto;display:block}
.promo-contenu{padding:34px;color:#fff;text-align:center}
.promo-titre{display:inline-block;background:#ffd600;color:#b71c1c;font-weight:900;font-size:1.8rem;padding:6px 22px;border-radius:40px;letter-spacing:2px;animation:pulse-promo 1.6s infinite}
@keyframes pulse-promo{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
.promo-contenu h2{color:#fff;font-size:2.1rem;margin:16px 0 6px}
.promo-liste{font-size:1.05rem;opacity:.95;margin:0 0 12px}
.promo-tarif{font-size:1.1rem;margin:0 0 14px}
.promo-tarif strong{font-size:3rem;color:#ffd600;line-height:1}
.promo-tarif s{display:block;font-size:1.1rem;opacity:.85;margin-top:4px}
.promo-code{display:inline-block;background:#fff;color:#1c1c1c;border:3px dashed #b71c1c;border-radius:12px;padding:10px 18px;font-size:1.1rem}
.promo-code strong{color:#b71c1c;font-size:1.5rem;letter-spacing:3px;margin-left:6px}
.promo-zone2{margin:12px 0 16px;font-weight:600}
.btn-promo{display:inline-block;background:#ffd600;color:#b71c1c;font-weight:800;padding:14px 34px;border-radius:40px;text-decoration:none;font-size:1.1rem}
.btn-promo:hover{background:#fff}
.promo-code-mini{background:#fff;color:#b71c1c;padding:1px 8px;border-radius:6px;letter-spacing:1px}
@media(max-width:800px){.carte-promo{grid-template-columns:1fr}.promo-contenu{padding:24px 18px}.promo-tarif strong{font-size:2.5rem}.promo-contenu h2{font-size:1.7rem}}


/* Bouton devis dans l'en-tête */
.btn-devis-header{display:inline-block;background:#fff;color:#1c1c1c;font-weight:700;padding:10px 18px;border-radius:30px;text-decoration:none;font-size:.92rem;border:2px solid #e53935}
.btn-devis-header:hover{background:#e53935;color:#fff}
@media(max-width:1180px){.btn-devis-header{display:none}}


/* ---- Rail de marques sur grand écran ---- */
.rail-marques{display:none}
@media(min-width:1750px){
 .rail-marques{display:flex;flex-direction:column;align-items:center;gap:12px;position:fixed;left:18px;top:50%;transform:translateY(-50%);z-index:30;width:160px}
 .rail-marques .rail-titre{font-size:.68rem;letter-spacing:1.4px;text-transform:uppercase;color:#9aa0a6;margin-bottom:2px;text-align:center}
 .rail-marques a{display:flex;align-items:center;justify-content:center;width:100%;height:68px;background:#fff;border-radius:14px;padding:10px;box-shadow:0 6px 18px rgba(0,0,0,.35);transition:transform .15s ease}
 .rail-marques a:hover{transform:translateX(4px)}
 .rail-marques img{max-width:100%;max-height:46px;width:auto;height:auto;object-fit:contain}
 /* on reserve la gouttiere gauche pour le rail : le contenu ne passe jamais dessous */
 .container{max-width:min(1660px, calc(100vw - 400px))}
}

/* ---- Bande marques : lisible sur téléphone ---- */
@media(max-width:700px){
 .bande-marques{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;justify-content:stretch}
 .bande-marques .pastille-marque-logo{display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #eee;border-radius:14px;padding:12px;min-height:74px;margin:0}
 .bande-marques .pastille-marque-logo img{max-height:42px;max-width:100%;width:auto;height:auto;object-fit:contain}
 .bande-marques .pastille-marque-logo:last-child:nth-child(odd){grid-column:1 / -1}
}


/* ---- Grands écrans : tout respire plus large ---- */
@media(min-width:1500px){
 .hero{padding:52px 0}
 .hero h1{font-size:3rem}
 .hero-texte p{font-size:1.12rem}
 .hero-texte{flex:1 1 560px}
 .hero-image{flex:1 1 620px}
 .nav-principale > ul > li > a{font-size:.9rem}
 .section-titre h2{font-size:2.1rem}
 .grille-tarifs{grid-template-columns:repeat(3,1fr)}
}
@media(min-width:1750px){
 .container{padding-left:200px;padding-right:40px}
 .bandeau-urgence .container,.bandeau-promo{padding-left:0;padding-right:0}
}

@media(min-width:1200px){.container{padding-left:40px;padding-right:40px}}


/* ---- Fenêtre d'accueil (offre) ---- */
.popup-fond{position:fixed;inset:0;background:rgba(10,8,8,.78);display:flex;align-items:center;justify-content:center;z-index:1000;padding:18px;animation:popup-apparait .25s ease}
.popup-fond[hidden]{display:none}
@keyframes popup-apparait{from{opacity:0}to{opacity:1}}
.popup-boite{position:relative;background:linear-gradient(140deg,#1b1b1b 0%,#2a0b0d 100%);color:#fff;border:3px solid #e53935;border-radius:22px;width:min(900px,64vw);min-width:min(560px,94vw);min-height:72vh;display:flex;flex-direction:column;justify-content:center;padding:48px 50px 42px;text-align:center;box-shadow:0 28px 70px rgba(0,0,0,.6);animation:popup-monte .3s ease}
@keyframes popup-monte{from{transform:translateY(16px) scale(.97)}to{transform:none}}
.popup-fermer{position:absolute;top:12px;right:16px;background:rgba(255,255,255,.12);border:0;color:#fff;font-size:1.9rem;line-height:1;width:44px;height:44px;border-radius:50%;cursor:pointer;opacity:.9}
.popup-fermer:hover{opacity:1}
.popup-badge{display:inline-block;background:#ffd600;color:#b71c1c;font-weight:900;letter-spacing:1px;padding:6px 18px;border-radius:40px;font-size:.95rem;margin-bottom:14px}
.popup-boite h2{color:#fff;font-size:2.1rem;margin:0 0 16px;line-height:1.2}
.popup-sous{font-size:1.02rem;margin:0 0 10px;color:#eee}
.popup-sous s{opacity:.7}
.popup-code{background:#fff;color:#b71c1c;padding:2px 10px;border-radius:7px;letter-spacing:2px}
.popup-zone{font-size:.92rem;color:#ffd6d6;margin:0 0 20px}
.popup-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:14px}
.popup-btn{background:#e53935;color:#fff;font-weight:800;padding:14px 30px;border-radius:40px;text-decoration:none}
.popup-btn:hover{background:#fff;color:#b71c1c}
.popup-tel{display:inline-block;border:2px solid rgba(255,255,255,.5);color:#fff;font-weight:700;padding:12px 24px;border-radius:40px;text-decoration:none}
.popup-tel:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.popup-plus-tard{background:none;border:0;color:#bbb;font-size:.88rem;text-decoration:underline;cursor:pointer}
.popup-plus-tard:hover{color:#fff}
@media(max-width:600px){.popup-boite{padding:28px 20px 22px}.popup-boite h2{font-size:1.45rem}.popup-actions{flex-direction:column}.popup-btn,.popup-tel{width:100%}}

.popup-liste{list-style:none;padding:0;margin:0 auto 18px;display:inline-block;text-align:left;color:#f0e9e9;font-size:1rem;line-height:1.9}
@media(max-width:700px){.popup-boite{width:94vw;min-width:0;min-height:78vh;padding:40px 22px 28px}.popup-boite h2{font-size:1.5rem}}

html{scroll-behavior:smooth}
#tarifs,#bareme,#promo{scroll-margin-top:120px}
.hero-actions .btn-outline{white-space:nowrap}

/* ---- Encadré latéral des pages sujet ---- */
.encadre-lateral{flex:0 0 320px;background:var(--gris-clair,#f7f7f8);border:1px solid #e8e8ec;border-radius:var(--rayon);padding:24px;align-self:flex-start;position:sticky;top:150px}
.encadre-lateral h3{margin-top:0;font-size:1.05rem}
.encadre-lateral hr{border:0;border-top:1px solid #e3e3e8;margin:20px 0}
.liste-liens{list-style:none;padding:0;margin:0}
.liste-liens li{margin-bottom:8px}
.liste-liens a{color:var(--rouge,#e53935);font-weight:600;text-decoration:none}
.liste-liens a:hover{text-decoration:underline}
@media(max-width:900px){.encadre-lateral{position:static;flex:1 1 100%}}


/* Offre « formation incendie offerte » dans l'en-tete */
.header-offre{display:none}
@media(min-width:1081px){
  .header-offre{display:flex;align-items:center;gap:12px;flex:1 1 300px;margin:0 22px;
    padding:9px 16px;border:1px solid #ffd600;border-radius:30px;
    background:linear-gradient(90deg,rgba(255,214,0,.14),rgba(214,37,43,.20));
    color:#fff;text-decoration:none;line-height:1.25;transition:background .2s,border-color .2s}
  .header-offre:hover{background:linear-gradient(90deg,rgba(255,214,0,.28),rgba(214,37,43,.34));border-color:#fff}
  .header-offre-badge{flex:none;background:#ffd600;color:#7a1115;font-weight:800;font-size:.68rem;
    letter-spacing:.6px;padding:4px 11px;border-radius:30px;white-space:nowrap}
  .header-offre-txt{font-size:.84rem;color:#f0f0f0}
  .header-offre-txt strong{color:#fff;font-weight:700}
}
.bandeau-offre-mobile{display:none}
@media(max-width:1080px){
  .bandeau-offre-mobile{display:block;text-align:center;padding:10px 16px;font-size:.88rem;
    background:linear-gradient(90deg,#b71c1c,#e53935);color:#fff;text-decoration:none;line-height:1.35}
  .bandeau-offre-mobile strong{color:#ffd600}
}

/* Offre formation dans la fenetre d'accueil */
.popup-offert{display:flex;align-items:flex-start;gap:12px;margin:18px 0 6px;padding:13px 16px;
  border:1px solid #ffd600;border-radius:14px;background:#fffbe9;color:#5c3d00;
  font-size:.95rem;line-height:1.45;text-align:left}
.popup-offert-badge{flex:none;background:#ffd600;color:#7a1115;font-weight:800;font-size:.66rem;
  letter-spacing:.6px;padding:4px 10px;border-radius:30px;white-space:nowrap;margin-top:1px}
.popup-offert strong{color:#3d2800}
@media(max-width:600px){.popup-offert{font-size:.88rem;padding:11px 13px;gap:9px}}

/* ---- Bloc reglementation (accueil) ---- */
.grille-reglement{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.carte-reglement{background:#fff;border:1px solid #ececec;border-left:4px solid var(--rouge);
  border-radius:14px;padding:20px 22px;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.carte-reglement h3{font-size:1.02rem;margin:0 0 8px;color:#1b1b1b}
.carte-reglement p{margin:0;font-size:.93rem;line-height:1.6;color:#4a4a4a}
.carte-reglement strong{color:#1b1b1b}
@media(max-width:1000px){.grille-reglement{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.grille-reglement{grid-template-columns:1fr}}

/* ---- Bloc « Nice quartier par quartier » ---- */
.bloc-nice{display:grid;grid-template-columns:1.9fr 1fr;gap:30px;align-items:start}
.bloc-nice-texte p{line-height:1.75;margin:0 0 14px}
.bloc-nice-atouts{list-style:none;margin:0;padding:22px;background:#fff;border:1px solid #ececec;
  border-radius:16px;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.bloc-nice-atouts li{position:relative;padding:0 0 0 26px;margin:0 0 13px;font-size:.94rem;line-height:1.5}
.bloc-nice-atouts li:last-child{margin-bottom:0}
.bloc-nice-atouts li::before{content:"\2713";position:absolute;left:0;top:0;color:var(--rouge);font-weight:800}
@media(max-width:900px){.bloc-nice{grid-template-columns:1fr}}

/* ---- Bloc « sur le terrain » des pages de ville ---- */
.bloc-terrain{display:grid;grid-template-columns:1.75fr 1fr;gap:34px;align-items:start}
.bloc-terrain-texte p{line-height:1.78;margin:0 0 15px}
.bloc-terrain-profils{background:#fff;border:1px solid #ececec;border-radius:16px;padding:22px 24px;
  box-shadow:0 2px 10px rgba(0,0,0,.04)}
.bloc-terrain-profils h3{font-size:1rem;margin:0 0 14px;color:#1b1b1b;line-height:1.35}
.bloc-terrain-profils dl{margin:0}
.bloc-terrain-profils dt{font-weight:700;font-size:.92rem;color:#1b1b1b;margin-top:13px;
  padding-left:14px;position:relative}
.bloc-terrain-profils dt:first-of-type{margin-top:0}
.bloc-terrain-profils dt::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;
  border-radius:50%;background:var(--rouge)}
.bloc-terrain-profils dd{margin:3px 0 0 14px;font-size:.88rem;line-height:1.55;color:#5a5a5a}
@media(max-width:900px){.bloc-terrain{grid-template-columns:1fr;gap:26px}}