/*
Theme Name: LNT Couverture
Theme URI: https://lnt-couverture.fr
Author: LNT Couverture
Description: Thème bloc sur mesure pour LNT Couverture, couvreur à Rochefort. Tout le contenu est éditable dans l'éditeur de blocs.
Version: 1.0.8
Requires at least: 6.6
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lnt-couverture
Tags: block-theme, full-site-editing, business
*/

/* Remises à zéro des styles de blocs, placées AVANT les composants :
   à spécificité égale, les règles des composants (plus bas) l'emportent. */
figure.wp-block-image { margin: 0 }

/* =========================================================
   LNT Couverture
   Registre relevé sur la référence : linéales uniquement
   (Anton condensée + Inter), un seul accent saturé (le rouge
   du logo, validé par le client à la place de l'orange),
   bleu vif réservé aux pictogrammes, blanc froid, pilules
   et cartes arrondies (~18 px), titres à gauche.
   ========================================================= */

:root {
  --rouge: #E3120B;
  --rouge-fonce: #C20E08;
  --nuit: #050A21;
  --ardoise: #141F26;
  --bleu: #1A84FA;
  --acier: #577590;
  --acier-clair: #94AECA;
  --blanc-froid: #F2F6FC;
  --gris: #565A60;
  --trait: #DCE4EF;

  --titre: 'Anton', 'Impact', sans-serif;
  --texte: 'Inter', system-ui, sans-serif;

  --gout: 56px;
  --large: min(1320px, 100% - 2 * var(--gout));
  --marge: max(var(--gout), (100vw - 1320px) / 2);
  --ombre-carte: 0 1px 0 rgba(5, 10, 33, .04), 0 22px 44px -30px rgba(5, 10, 33, .32);
  --masque: center / contain no-repeat;
}

/* ---------- socle ---------- */
*, *::before, *::after { box-sizing: border-box }
html { -webkit-text-size-adjust: 100% }
body {
  margin: 0;
  font: 400 17px/1.6 var(--texte);
  color: var(--gris);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto }
figure { margin: 0 }
a { color: inherit; text-decoration: none }
.large { width: var(--large); margin-inline: auto }

/* ---------- typographie partagée ---------- */
.surtitre {
  display: flex; align-items: center; gap: 14px;
  margin: 0 0 22px;
  font: 600 12.5px/1.2 var(--texte);
  letter-spacing: .26em; text-transform: uppercase;
  color: var(--acier);
}
.surtitre::before { content: ''; flex: 0 0 30px; height: 1.5px; background: currentColor }
.surtitre-clair { color: rgba(255, 255, 255, .78) }

.titre-heros, .titre-section {
  margin: 0;
  font-family: var(--titre); font-weight: 400;
  text-transform: uppercase;
  color: var(--nuit);
  hyphens: none; text-wrap: balance;
}
.titre-heros em, .titre-section em { font-style: normal; color: var(--rouge) }
.titre-section { font-size: clamp(42px, 4.7vw, 68px); line-height: 1.02; letter-spacing: .005em }
.titre-clair { color: #fff }

.lien-fleche { margin: 0 }
.lien-fleche a {
  display: inline-flex; align-items: center; gap: 10px;
  font: 600 16px/1 var(--texte); color: var(--rouge);
}
.lien-fleche a::after {
  content: ''; width: 16px; height: 16px; background: currentColor;
  -webkit-mask: var(--ic-fleche) var(--masque); mask: var(--ic-fleche) var(--masque);
  transition: transform .25s;
}
.lien-fleche a:hover::after { transform: translateX(4px) }

/* ---------- boutons (même DOM que core/buttons) ---------- */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 18px }
.wp-block-button { margin: 0 }
.wp-block-button > .wp-block-button__link {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  height: 56px; padding: 0 32px;
  border: 0; border-radius: 999px;
  font: 500 16.5px/1 var(--texte);
  white-space: nowrap; cursor: pointer;
  transition: background-color .2s, transform .2s, box-shadow .2s;
}
.wp-block-button > .wp-block-button__link:hover { transform: translateY(-1px) }
.btn-rouge > .wp-block-button__link { background: var(--rouge); color: #fff; box-shadow: 0 14px 28px -14px rgba(227, 18, 11, .8) }
.btn-rouge > .wp-block-button__link:hover { background: var(--rouge-fonce) }
.btn-rouge > .wp-block-button__link::after {
  content: ''; width: 18px; height: 18px; background: currentColor;
  -webkit-mask: var(--ic-fleche) var(--masque); mask: var(--ic-fleche) var(--masque);
}
.btn-blanc > .wp-block-button__link { background: #fff; color: var(--nuit); font-weight: 600; box-shadow: 0 14px 30px -18px rgba(5, 10, 33, .4) }
.btn-tel > .wp-block-button__link { padding-left: 66px }
.btn-tel > .wp-block-button__link::before {
  content: ''; position: absolute; left: 24px; top: 50%; translate: 0 -50%;
  width: 30px; height: 30px; border-radius: 50%; background: var(--nuit);
}
.btn-tel > .wp-block-button__link::after {
  content: ''; position: absolute; left: 32px; top: 50%; translate: 0 -50%;
  width: 14px; height: 14px; background: #fff;
  -webkit-mask: var(--ic-tel) var(--masque); mask: var(--ic-tel) var(--masque);
}
.btn-bordure > .wp-block-button__link { box-shadow: inset 0 0 0 1px var(--trait) }
.btn-tel-rouge > .wp-block-button__link::after { -webkit-mask-image: var(--ic-tel); mask-image: var(--ic-tel); order: -1; width: 17px; height: 17px }

/* ---------- en-tête ---------- */
.entete { position: fixed; inset: 0 0 auto; z-index: 50; transition: background-color .3s, box-shadow .3s }
.entete-in {
  width: var(--large); margin-inline: auto; height: 96px;
  display: flex; align-items: center; justify-content: space-between; gap: 32px;
  transition: height .3s;
}
.entete.est-defile { background: rgba(5, 10, 33, .9); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 10px 30px -20px rgba(0, 0, 0, .6) }
.entete.est-defile .entete-in { height: 78px }

.logo { display: block; flex: none }
.logo img { width: auto; height: 80px; filter: drop-shadow(0 6px 14px rgba(5, 10, 33, .35)); transition: height .3s }
.est-defile .logo img { height: 62px }

.menu > ul { display: flex; gap: 40px; margin: 0; padding: 0; list-style: none }
.menu li { position: relative }
.menu > ul > li > a {
  display: inline-flex; align-items: center; gap: 8px; padding: 10px 0;
  font: 500 15.5px/1 var(--texte); color: rgba(255, 255, 255, .88);
  transition: color .2s;
}
.menu > ul > li > a:hover, .menu > ul > li.actif > a { color: #fff }
.menu > ul > li.actif > a::before {
  content: ''; position: absolute; left: 0; right: 0; bottom: -9px;
  height: 3px; border-radius: 3px; background: var(--rouge);
}
.a-sous-menu > a::after {
  content: ''; width: 7px; height: 7px; margin-top: -4px;
  border-right: 1.8px solid currentColor; border-bottom: 1.8px solid currentColor;
  rotate: 45deg;
}
.sous-menu {
  position: absolute; top: calc(100% + 14px); left: -22px; min-width: 250px;
  margin: 0; padding: 10px; list-style: none;
  background: #fff; border-radius: 16px;
  box-shadow: 0 30px 60px -24px rgba(5, 10, 33, .45);
  opacity: 0; visibility: hidden; translate: 0 6px;
  transition: opacity .2s, translate .2s, visibility .2s;
}
.sous-menu::before { content: ''; position: absolute; inset: -16px 0 auto; height: 16px }
.a-sous-menu:hover .sous-menu, .a-sous-menu:focus-within .sous-menu { opacity: 1; visibility: visible; translate: 0 0 }
.sous-menu a { display: block; padding: 11px 14px; border-radius: 10px; font: 500 15px/1.3 var(--texte); color: var(--nuit) }
.sous-menu a:hover { background: var(--blanc-froid); color: var(--rouge) }
.entete-cta .wp-block-button > .wp-block-button__link { height: 52px; padding: 0 28px; font-size: 16px }
.burger { display: none }

/* ---------- héros (commun) ---------- */
.heros {
  position: relative; overflow: hidden;
  display: flex; align-items: stretch;
  background: #1b6f8c;
}
.heros-photo { position: absolute; inset: 0 }
.heros-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 72% 50% }
.heros-photo::after { content: ''; position: absolute; inset: 0 }
.heros-in { position: relative; z-index: 2; display: flex; align-items: center; padding: 128px 0 52px }
.heros-texte { max-width: 640px }
.titre-heros { margin-bottom: 22px; font-size: clamp(54px, 6.1vw, 90px); line-height: 1.04; letter-spacing: .008em }
.chapo { max-width: 480px; margin: 0 0 28px; font-size: 18.5px; line-height: 1.5; color: #3f454d }

/* héros d'accueil : voile clair sur le ciel, comme la référence */
.heros-accueil { min-height: clamp(700px, 100svh, 940px) }
.heros-accueil .heros-photo::after {
  background:
    linear-gradient(180deg, rgba(8, 36, 74, .45) 0%, rgba(8, 36, 74, 0) 20%),
    radial-gradient(ellipse 52% 58% at 22% 56%, rgba(244, 248, 253, .9) 0%, rgba(244, 248, 253, .62) 48%, rgba(244, 248, 253, 0) 100%),
    linear-gradient(0deg, rgba(5, 10, 33, .62) 0%, rgba(5, 10, 33, 0) 30%);
}

.atouts { display: flex; gap: 48px; margin: 52px 0 0 }
.atout { position: relative; margin: 0; padding-top: 74px; font-size: 14px; line-height: 1.3; color: rgba(255, 255, 255, .88) }
.atout::before {
  content: ''; position: absolute; top: 0; left: 0; width: 58px; height: 58px;
  border-radius: 13px; background: #fff; box-shadow: 0 12px 26px -12px rgba(5, 10, 33, .5);
}
.atout::after {
  content: ''; position: absolute; top: 14px; left: 14px; width: 30px; height: 30px; background: var(--bleu);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.atout strong { display: block; margin-bottom: 4px; font: 600 16.5px/1.3 var(--texte); color: #fff; text-shadow: 0 1px 12px rgba(5, 10, 33, .35) }

.carte-flottante {
  position: absolute; z-index: 3;
  display: flex; align-items: center; gap: 16px;
  width: 280px; padding: 12px 22px 12px 12px;
  border-radius: 18px;
  background: rgba(242, 246, 252, .9);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 24px 48px -22px rgba(5, 10, 33, .45);
}
.heros > .carte-flottante { top: 31%; left: 46% }
.carte-flottante::after {
  content: ''; position: absolute; top: -20px; right: -18px; width: 34px; height: 34px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 34' fill='none' stroke='%23E3120B' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 4v8M24 9l-6 6M30 21h-9'/%3E%3C/svg%3E") var(--masque);
}
.carte-flottante-photo { flex: none; width: 82px; height: 72px; border-radius: 12px; overflow: hidden }
.carte-flottante-photo img { width: 100%; height: 100%; object-fit: cover }
.carte-flottante p { margin: 0; font: 600 15.5px/1.35 var(--texte); color: var(--nuit) }

.panneau-chiffres {
  display: flex; align-items: center;
  padding: 20px 30px;
  border-radius: 18px;
  background: rgba(20, 31, 38, .94);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  color: #fff;
  box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .7);
}
.heros > .panneau-chiffres { position: absolute; z-index: 3; right: calc((100% - var(--large)) / 2); bottom: 56px }
.chiffre { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 56px; padding-left: 64px }
.chiffre::before {
  content: ''; position: absolute; left: 0; top: 50%; translate: 0 -50%;
  width: 46px; height: 46px; background: var(--rouge);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.chiffre + .chiffre { margin-left: 28px; padding-left: 28px; border-left: 1px solid rgba(255, 255, 255, .16) }
.chiffre-valeur { margin: 0; font: 600 32px/1.05 var(--texte); letter-spacing: -.01em }
.chiffre-valeur a { color: inherit }
.chiffre-legende { margin: 4px 0 0; font-size: 14px; line-height: 1.25; color: rgba(255, 255, 255, .84) }
.chiffre-photos { display: grid; grid-template-columns: auto auto; grid-template-rows: auto auto; column-gap: 16px; align-content: center }
.chiffre-photos::before, .chiffre-sans-ic::before { content: none }
.chiffre-sans-ic { padding-left: 0 }
.pastilles { grid-row: 1 / 3; display: flex; align-items: center; padding-left: 12px }
.pastilles figure { margin-left: -12px }
.pastilles img { width: 46px; height: 46px; border-radius: 50%; border: 2px solid #1d2a33; object-fit: cover }
.chiffre-photos .chiffre-valeur { align-self: end }
.chiffre-photos .chiffre-legende { align-self: start }

/* héros des pages intérieures : bandeau sombre, texte clair */
.heros-page { min-height: clamp(560px, 76svh, 680px); background: var(--nuit) }
.heros-page .heros-in { padding: 150px 0 80px }
.heros-page .heros-photo img { object-position: 100% 50% }
.heros-page .heros-photo::after {
  background:
    linear-gradient(180deg, rgba(5, 10, 33, .55) 0%, rgba(5, 10, 33, 0) 28%),
    linear-gradient(90deg, rgba(5, 10, 33, .55) 0%, rgba(5, 10, 33, .15) 45%, rgba(5, 10, 33, 0) 65%),
    linear-gradient(0deg, rgba(5, 10, 33, .45) 0%, rgba(5, 10, 33, 0) 30%);
}
.heros-page .heros-texte { max-width: 780px }
.heros-page .titre-heros { color: #fff; font-size: clamp(46px, 4.9vw, 74px) }
.heros-page .chapo { max-width: 540px; color: rgba(255, 255, 255, .86) }
.heros-simple { min-height: 0; background: var(--ardoise) }
.heros-simple .heros-in { padding: 170px 0 90px }
.fil { margin: 0 0 26px; font: 500 14px/1.4 var(--texte); color: rgba(255, 255, 255, .62) }
.fil a { color: rgba(255, 255, 255, .86) }
.fil a:hover { color: #fff }
.heros > .panneau-page { padding: 18px 28px }
.panneau-page .chiffre-valeur { font-size: 26px }

/* ---------- services ---------- */
.services { padding: 128px 0 132px; background: var(--blanc-froid) }
.tete-section {
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: end; gap: 64px;
  margin-bottom: 60px;
}
.tete-section-droite p { max-width: 470px; margin: 0 0 20px }
.tete-section-droite p:last-child { margin-bottom: 0 }

.grille-services {
  display: grid; gap: 24px;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr);
}
.carte-service {
  display: flex; flex-direction: column;
  padding: 10px; border-radius: 20px; background: #fff;
  box-shadow: var(--ombre-carte);
}
.carte-service-photo { border-radius: 13px; overflow: hidden; aspect-ratio: 16 / 10 }
.carte-service-photo img { width: 100%; height: 100%; object-fit: cover; transition: scale .6s }
.carte-service:hover .carte-service-photo img { scale: 1.04 }
.carte-service-corps { position: relative; display: flex; flex-direction: column; flex: 1; padding: 44px 18px 18px }
.carte-service-corps::before {
  content: ''; position: absolute; top: -32px; left: 18px;
  width: 60px; height: 60px; border-radius: 13px; background: #fff;
  box-shadow: 0 14px 28px -12px rgba(26, 132, 250, .5);
}
.carte-service-corps::after {
  content: ''; position: absolute; top: -17px; left: 33px; width: 30px; height: 30px; background: var(--bleu);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.carte-service-corps h3 { margin: 0 0 8px; font: 600 20px/1.3 var(--texte); color: var(--nuit) }
.carte-service-corps p { margin: 0 0 18px; font-size: 15.5px; line-height: 1.6 }
.carte-service-corps .lien-fleche { margin: auto 0 0 }
.carte-service-grande { grid-row: 1 / 3; position: relative; min-height: 680px; padding: 0; overflow: hidden }
.carte-service-grande .carte-service-photo { position: absolute; inset: 0; border-radius: 0; aspect-ratio: auto }
.carte-service-grande .carte-service-corps {
  position: absolute; left: 14px; right: 14px; bottom: 14px; flex: none;
  padding: 46px 28px 26px; border-radius: 16px;
  background: rgba(255, 255, 255, .93);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.carte-service-grande .carte-service-corps::before { left: 28px; top: -30px }
.carte-service-grande .carte-service-corps::after { left: 43px; top: -15px }
.carte-service-grande h3 { font-size: 24px }

.carte-urgence {
  grid-column: 1 / -1; position: relative;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 32px;
  padding: 30px 36px 30px 112px; border-radius: 20px;
  background: var(--ardoise); color: rgba(255, 255, 255, .8);
}
.carte-urgence::before {
  content: ''; position: absolute; left: 36px; top: 50%; translate: 0 -50%;
  width: 52px; height: 52px; background: var(--rouge);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.carte-urgence h3 { margin: 0 0 4px; font: 600 22px/1.3 var(--texte); color: #fff }
.carte-urgence p { margin: 0; font-size: 15.5px }

/* ---------- l'artisan (et introductions des pages de service) ---------- */
.artisan {
  display: grid; align-items: center; gap: 96px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  padding: 136px 0;
}
.artisan-visuel { position: relative }
.artisan-photo { aspect-ratio: 1 / 1; max-height: 720px; width: 100%; border-radius: 0 20px 20px 0; overflow: hidden }
.artisan-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 38% }
.carte-flottante-artisan { right: -64px; bottom: 64px; width: 300px }
.artisan-texte { padding-right: var(--marge) }
.artisan-texte > * { max-width: 600px }
.artisan-intro { margin: 0 0 16px; font-size: 18px }
.titre-section + .artisan-intro { margin-top: 26px }
.artisan-intro:last-of-type { margin-bottom: 34px }
.engagements { display: grid; gap: 22px; margin: 0 0 40px }
.engagement { position: relative; margin: 0; padding-left: 80px; min-height: 60px; font-size: 15.5px; line-height: 1.55 }
.engagement::before {
  content: ''; position: absolute; left: 0; top: 0; width: 60px; height: 60px;
  border-radius: 13px; background: var(--blanc-froid);
}
.engagement::after {
  content: ''; position: absolute; left: 15px; top: 15px; width: 30px; height: 30px; background: var(--bleu);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.engagement strong { display: block; padding-top: 4px; margin-bottom: 3px; font: 600 18px/1.35 var(--texte); color: var(--nuit) }

/* ---------- réalisations ---------- */
.realisations { padding: 128px 0 136px; background: var(--ardoise); color: rgba(255, 255, 255, .76) }
.tete-section-sombre .titre-section { color: #fff }
.tete-section-sombre .surtitre { color: var(--acier-clair) }
.mosaique {
  display: grid; gap: 20px;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr) minmax(0, .9fr);
  grid-template-rows: 310px 310px;
}
.projet { position: relative; border-radius: 20px; overflow: hidden; background: #1d2a33 }
.projet img { width: 100%; height: 100%; object-fit: cover; transition: scale .7s }
.projet:hover img { scale: 1.04 }
.projet-a { grid-row: 1 / 3 }
.projet-c { grid-column: 3; grid-row: 1 / 3 }
.projet-d { grid-column: 2; grid-row: 2 }
.projet figcaption {
  position: absolute; left: 14px; bottom: 14px; margin: 0;
  padding: 11px 16px; border-radius: 12px;
  background: rgba(242, 246, 252, .92);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  font-size: 13.5px; line-height: 1.3; color: var(--gris); text-align: left;
}
.projet figcaption strong { display: block; font: 600 15px/1.3 var(--texte); color: var(--nuit) }
.realisations-page { background: var(--blanc-froid); color: var(--gris) }
.realisations-page .tete-section-sombre .titre-section { color: var(--nuit) }
.realisations-page .tete-section-sombre .surtitre { color: var(--acier) }
.mosaique-page { grid-template-rows: 310px 310px 340px }
.mosaique-page .projet-e { grid-column: 1 / 3; grid-row: 3 }
.mosaique-page .projet-f { grid-column: 3; grid-row: 3 }

/* ---------- étapes ---------- */
.etapes { padding: 128px 0 120px }
.etapes-froid { background: var(--blanc-froid) }
.liste-etapes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; align-items: end }
.etape { display: flex; flex-direction: column; padding: 34px 30px 32px; border-radius: 20px; background: var(--blanc-froid) }
.etapes-froid .etape:not(:nth-child(4)) { background: #fff }
.etape:nth-child(2) { margin-bottom: 40px }
.etape:nth-child(3) { margin-bottom: 80px }
.etape:nth-child(4) { margin-bottom: 120px; background: var(--ardoise); color: rgba(255, 255, 255, .8) }
.etape:nth-child(4) strong { color: #fff }
.etape-num { margin: 0 0 18px; font: 400 58px/1 var(--titre); color: var(--rouge) }
.etape-texte { margin: 0; font-size: 15px; line-height: 1.55 }
.etape-texte strong { display: block; margin-bottom: 8px; font: 600 18px/1.3 var(--texte); color: var(--nuit) }

/* ---------- zones ---------- */
.zones { padding: 128px 0; background: var(--blanc-froid) }
.zones-in { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 96px; align-items: center }
.zones-intro { max-width: 500px; margin: 26px 0 0; font-size: 18px }
.communes { display: flex; flex-wrap: wrap; gap: 10px; margin: 30px 0 34px; padding: 0; list-style: none; max-width: 560px }
.communes li {
  position: relative; padding: 10px 17px 10px 36px; border-radius: 999px; background: #fff;
  font: 500 14.5px/1.2 var(--texte); color: var(--nuit);
  box-shadow: 0 8px 18px -14px rgba(5, 10, 33, .35);
}
.communes li::before {
  content: ''; position: absolute; left: 14px; top: 50%; translate: 0 -50%; width: 14px; height: 14px; background: var(--bleu);
  -webkit-mask: var(--ic-pin) var(--masque); mask: var(--ic-pin) var(--masque);
}
.zones-visuel { position: relative }
.zones-photo { aspect-ratio: 6 / 5.4; border-radius: 20px; overflow: hidden }
.zones-photo img { width: 100%; height: 100%; object-fit: cover }
.panneau-zones { position: absolute; left: -56px; bottom: 44px }
.panneau-zones .chiffre-sans-ic .chiffre-valeur { font: 400 40px/1 var(--titre); letter-spacing: .02em; color: var(--rouge) }

/* ---------- questions ---------- */
.faq { padding: 128px 0 }
.faq-in { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 96px; align-items: start }
.faq-tete { position: sticky; top: 120px }
.faq-intro { max-width: 400px; margin: 26px 0 30px; font-size: 18px }
.question {
  margin-bottom: 12px; border-radius: 18px; background: var(--blanc-froid);
  transition: background-color .25s, box-shadow .25s;
}
.question-titre {
  position: relative; margin: 0; padding: 24px 80px 24px 28px;
  font: 600 18px/1.4 var(--texte); color: var(--nuit); cursor: pointer;
}
.question-titre::before {
  content: ''; position: absolute; right: 22px; top: 50%; translate: 0 -50%;
  width: 38px; height: 38px; border-radius: 50%; background: #fff;
  transition: background-color .25s;
}
.question-titre::after {
  content: ''; position: absolute; right: 33px; top: 50%; translate: 0 -50%;
  width: 16px; height: 16px; background: var(--nuit);
  -webkit-mask: var(--ic-plus) var(--masque); mask: var(--ic-plus) var(--masque);
  transition: rotate .25s, background-color .25s;
}
.question-reponse { display: none; margin: 0; padding: 0 80px 26px 28px; font-size: 16.5px }
.question.est-ouvert { background: #fff; box-shadow: inset 0 0 0 1px var(--trait), 0 24px 44px -30px rgba(5, 10, 33, .35) }
.question.est-ouvert .question-titre::before { background: var(--rouge) }
.question.est-ouvert .question-titre::after { background: #fff; rotate: 45deg }
.question.est-ouvert .question-reponse { display: block }

/* ---------- contact ----------
   La photo s'arrête 150 px avant le bas de la section : le formulaire
   déborde sur une bande « nuit », de la couleur du pied de page. */
.contact { position: relative; z-index: 2; padding-top: 130px; background: var(--nuit); color: rgba(255, 255, 255, .82) }
.contact-photo { position: absolute; inset: 0 0 150px; background: var(--ardoise) }
.contact-photo img { width: 100%; height: 100%; object-fit: cover }
.contact-photo::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(5, 10, 33, .9) 0%, rgba(5, 10, 33, .7) 46%, rgba(5, 10, 33, .3) 100%);
}
.contact-in { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 540px); gap: 80px; align-items: start }
.contact-texte { padding-bottom: 136px }
.contact-intro { max-width: 460px; margin: 26px 0 34px; font-size: 18px }
.coordonnees { margin: 0; padding: 0; list-style: none }
.coordonnees li { position: relative; display: flex; align-items: center; min-height: 34px; margin-bottom: 14px; padding-left: 40px; font: 500 17px/1.3 var(--texte); color: #fff }
.coordonnees li::before {
  content: ''; position: absolute; left: 0; top: 50%; translate: 0 -50%; width: 22px; height: 22px; background: var(--rouge);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.coordonnees li:nth-child(1) { --ic: var(--ic-tel); margin-bottom: 22px }
.coordonnees li:nth-child(2) { --ic: var(--ic-mail) }
.coordonnees li:nth-child(3) { --ic: var(--ic-pin) }
.coordonnees li:nth-child(1)::before { width: 28px; height: 28px }
.coordonnees li:nth-child(1) a { font: 400 46px/1 var(--titre); letter-spacing: .02em }

.formulaire {
  position: relative; z-index: 3;
  padding: 40px 40px 38px; border-radius: 20px; background: #fff; color: var(--nuit);
  box-shadow: 0 50px 90px -40px rgba(5, 10, 33, .65);
}
.formulaire-titre { margin: 0 0 24px; font: 400 32px/1.05 var(--titre); text-transform: uppercase; letter-spacing: .01em }
.champs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 22px }
.champ { display: block }
.champ-large { grid-column: 1 / -1 }
.champ span { display: block; margin-bottom: 7px; font: 600 13.5px/1.2 var(--texte) }
.champ input, .champ select, .champ textarea {
  display: block; width: 100%; height: 50px; padding: 0 16px;
  border: 1px solid var(--trait); border-radius: 12px; background: var(--blanc-froid);
  font: 400 15.5px/1.4 var(--texte); color: var(--nuit);
  transition: border-color .2s, background-color .2s;
}
.champ textarea { height: auto; min-height: 112px; padding: 13px 16px; resize: vertical }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: 0; border-color: var(--bleu); background: #fff }
.formulaire-envoi { margin: 0 }
.formulaire-bouton {
  display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%;
  height: 56px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--rouge); color: #fff; font: 500 16.5px/1 var(--texte);
  box-shadow: 0 14px 28px -14px rgba(227, 18, 11, .8);
  transition: background-color .2s;
}
.formulaire-bouton:hover { background: var(--rouge-fonce) }
.formulaire-mention { margin: 14px 0 0; font-size: 13px; line-height: 1.45; color: var(--gris); text-align: center }
.formulaire-mention a { color: var(--nuit); text-decoration: underline; text-underline-offset: 2px }
.formulaire-bouton::after {
  content: ''; width: 18px; height: 18px; background: currentColor;
  -webkit-mask: var(--ic-fleche) var(--masque); mask: var(--ic-fleche) var(--masque);
}

/* contact sur fond clair (page Contact) */
.contact-clair { padding: 110px 0 120px; background: var(--blanc-froid); color: var(--gris) }
.contact-clair .contact-texte { padding-bottom: 0 }
.contact-clair .surtitre-clair { color: var(--acier) }
.contact-clair .titre-clair, .contact-clair .coordonnees li { color: var(--nuit) }
.contact-clair .formulaire { box-shadow: var(--ombre-carte) }

/* ---------- prestations ---------- */
.prestations { padding: 128px 0; background: var(--blanc-froid) }
.grille-prestations { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px }
.prestation {
  position: relative; padding: 104px 30px 30px; border-radius: 20px; background: #fff;
  box-shadow: var(--ombre-carte);
}
.prestation::before {
  content: ''; position: absolute; left: 30px; top: 30px; width: 58px; height: 58px;
  border-radius: 13px; background: var(--blanc-froid);
}
.prestation::after {
  content: ''; position: absolute; left: 44px; top: 44px; width: 30px; height: 30px; background: var(--bleu);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.prestation h3 { margin: 0 0 8px; font: 600 20px/1.3 var(--texte); color: var(--nuit) }
.prestation p { margin: 0; font-size: 15.5px; line-height: 1.6 }

/* ---------- signes ---------- */
.signes { padding: 128px 0; background: var(--ardoise); color: rgba(255, 255, 255, .78) }
.signes-in { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 96px; align-items: center }
.signes-intro { max-width: 460px; margin: 26px 0 34px; font-size: 18px }
.liste-signes { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255, 255, 255, .12) }
.liste-signes li {
  position: relative; padding: 24px 0 24px 58px;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
  font: 500 18.5px/1.4 var(--texte); color: #fff;
}
.liste-signes li::before {
  content: ''; position: absolute; left: 0; top: 50%; translate: 0 -50%;
  width: 36px; height: 36px; border-radius: 50%; background: var(--rouge);
}
.liste-signes li::after {
  content: ''; position: absolute; left: 10px; top: 50%; translate: 0 -50%; width: 16px; height: 16px; background: #fff;
  -webkit-mask: var(--ic-coche) var(--masque); mask: var(--ic-coche) var(--masque);
}

/* ---------- autres services ---------- */
.autres-services { padding: 128px 0; background: var(--blanc-froid) }
.grille-autres { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px }

/* ---------- secteurs ---------- */
.secteurs { padding: 128px 0 }
.grille-secteurs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start }
.secteur { position: relative; padding: 104px 30px 30px; border-radius: 20px; background: var(--blanc-froid) }
.secteur::before {
  content: ''; position: absolute; left: 30px; top: 30px; width: 58px; height: 58px;
  border-radius: 13px; background: #fff;
}
.secteur::after {
  content: ''; position: absolute; left: 44px; top: 44px; width: 30px; height: 30px; background: var(--bleu);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.secteur h3 { margin: 0; font: 600 21px/1.3 var(--texte); color: var(--nuit) }
.communes-secteur { margin: 20px 0 0 }

/* ---------- mentions légales ---------- */
.legal { padding: 90px 0 120px }
.legal-in > * { max-width: 820px }
.legal-titre { margin: 48px 0 14px; font: 400 30px/1.1 var(--titre); text-transform: uppercase; letter-spacing: .01em; color: var(--nuit) }
.legal-titre:first-child { margin-top: 0 }
.legal p { margin: 0 0 8px }

/* ---------- pied de page ---------- */
.pied { padding-top: 84px; background: var(--nuit); color: rgba(255, 255, 255, .66); font-size: 15px }
.pied-in { display: grid; grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, 1fr)) minmax(0, 1.25fr); gap: 48px; padding-bottom: 64px }
.logo-pied img { height: 132px; filter: none }
.pied-marque p { max-width: 340px; margin: 22px 0 0 }
.pied-titre { margin: 4px 0 18px; font: 400 20px/1 var(--titre); letter-spacing: .04em; text-transform: uppercase; color: #fff }
.pied-col ul { margin: 0; padding: 0; list-style: none }
.pied-col li { margin-bottom: 11px }
.pied-col a { transition: color .2s }
.pied-col a:hover { color: #fff }
.pied-contact li { position: relative; padding-left: 28px }
.pied-contact li::before {
  content: ''; position: absolute; left: 0; top: 4px; width: 16px; height: 16px; background: var(--rouge);
  -webkit-mask: var(--ic) var(--masque); mask: var(--ic) var(--masque);
}
.pied-contact li:nth-child(1) { --ic: var(--ic-tel) }
.pied-contact li:nth-child(2) { --ic: var(--ic-mail) }
.pied-contact li:nth-child(3) { --ic: var(--ic-pin) }
.pied-bas { display: flex; justify-content: space-between; gap: 20px; padding: 24px 0 30px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 13.5px }
.pied-bas p { margin: 0 }
.pied-bas a:hover { color: #fff }

/* =========================================================
   Adaptatif
   ========================================================= */
@media (max-width: 1180px) {
  :root { --gout: 36px }
  .menu > ul { gap: 26px }
  .heros > .carte-flottante { display: none }
  .heros-accueil > .panneau-chiffres { bottom: 40px }
  .heros-accueil .heros-in { align-items: flex-start; padding-bottom: 170px }
  .heros > .panneau-page { display: none }
  .artisan { gap: 64px }
  .carte-flottante-artisan { right: -40px }
  .grille-autres { grid-template-columns: repeat(2, minmax(0, 1fr)) }
}

@media (max-width: 980px) {
  .menu, .entete-cta { display: none }
  .burger {
    display: flex; align-items: center; gap: 10px; margin: 0; padding: 0 18px; height: 46px;
    border-radius: 999px; background: rgba(255, 255, 255, .14);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    font: 600 15px/1 var(--texte); color: #fff; cursor: pointer;
  }
  .burger::after {
    content: ''; width: 18px; height: 18px; background: currentColor;
    -webkit-mask: var(--ic-menu) var(--masque); mask: var(--ic-menu) var(--masque);
  }
  .menu-ouvert .burger::after { -webkit-mask-image: var(--ic-croix); mask-image: var(--ic-croix) }
  .menu-ouvert .menu {
    display: block; position: fixed; inset: 0; z-index: -1; padding: 110px var(--gout) 40px;
    background: rgba(5, 10, 33, .98); overflow-y: auto;
  }
  .menu-ouvert .menu > ul { flex-direction: column; gap: 6px }
  .menu-ouvert .menu > ul > li > a { font: 400 38px/1.15 var(--titre); text-transform: uppercase; color: #fff }
  .menu-ouvert .menu > ul > li.actif > a { color: var(--rouge) }
  .menu-ouvert .menu > ul > li.actif > a::before, .menu-ouvert .a-sous-menu > a::after { display: none }
  .menu-ouvert .sous-menu { position: static; opacity: 1; visibility: visible; translate: none; background: none; box-shadow: none; padding: 0 0 10px }
  .menu-ouvert .sous-menu a { color: rgba(255, 255, 255, .75); padding: 8px 0; font-size: 17px }

  .tete-section { grid-template-columns: 1fr; gap: 24px; margin-bottom: 44px }
  .grille-services { grid-template-columns: 1fr 1fr }
  .carte-service-grande { grid-column: 1 / -1; grid-row: auto; min-height: 520px }
  .carte-urgence { grid-template-columns: 1fr; gap: 22px; padding: 104px 30px 30px }
  .carte-urgence::before { top: 30px; translate: none }
  .artisan { grid-template-columns: 1fr; gap: 72px; padding: 104px 0 }
  .artisan-visuel { margin-right: var(--gout) }
  .artisan-photo { aspect-ratio: 4 / 3 }
  .carte-flottante-artisan { right: 24px; bottom: -40px }
  .artisan-texte { padding: 0 var(--gout) }
  .mosaique { grid-template-columns: 1fr 1fr; grid-template-rows: 340px 240px 240px }
  .projet-a { grid-column: 1 / -1; grid-row: 1 }
  .projet-b { grid-column: 1; grid-row: 2 }
  .projet-c { grid-column: 2; grid-row: 2 / 4 }
  .projet-d { grid-column: 1; grid-row: 3 }
  .mosaique-page { grid-template-rows: 340px 240px 240px 280px }
  .mosaique-page .projet-e { grid-column: 1; grid-row: 4 }
  .mosaique-page .projet-f { grid-column: 2; grid-row: 4 }
  .liste-etapes { grid-template-columns: 1fr 1fr }
  .etape:nth-child(n) { margin-bottom: 0 }
  .zones-in, .faq-in, .contact-in, .signes-in { grid-template-columns: 1fr; gap: 56px }
  .panneau-zones { left: 20px }
  .faq-tete { position: static }
  .contact-texte { padding-bottom: 0 }
  .grille-prestations, .grille-secteurs { grid-template-columns: 1fr 1fr }
  .pied-in { grid-template-columns: 1fr 1fr }
}

@media (max-width: 640px) {
  :root { --gout: 20px }
  body { font-size: 16px }
  .entete-in { height: 76px }
  .entete .logo img { height: 60px }
  .heros-accueil { min-height: 0 }
  .heros { flex-direction: column }
  .heros-in { padding: 120px 0 40px; flex-direction: column }
  .heros-accueil .heros-photo img { object-position: 64% 50% }
  .heros-accueil .heros-photo::after {
    background:
      linear-gradient(180deg, rgba(8, 36, 74, .45) 0%, rgba(8, 36, 74, 0) 14%),
      linear-gradient(180deg, rgba(244, 248, 253, 0) 5%, rgba(244, 248, 253, .84) 15%, rgba(244, 248, 253, .82) 72%, rgba(5, 10, 33, .25) 84%, rgba(5, 10, 33, .75) 100%);
  }
  .heros .surtitre { gap: 10px; font-size: 11px; letter-spacing: .16em }
  .heros .surtitre::before { flex-basis: 20px }
  .titre-heros { font-size: clamp(46px, 13.6vw, 60px) }
  .heros-page .titre-heros { font-size: clamp(42px, 12vw, 54px) }
  .heros-page { min-height: 0 }
  .heros-page .heros-in { padding: 120px 0 56px }
  .heros-page .heros-photo img { object-position: 78% 50% }
  .heros-page .heros-photo::after { background: linear-gradient(180deg, rgba(5, 10, 33, .55) 0%, rgba(5, 10, 33, .82) 55%, rgba(5, 10, 33, .9) 100%) }
  .chapo { font-size: 17px }
  .boutons .wp-block-button { flex: 1 1 100% }
  .boutons .wp-block-button > .wp-block-button__link { width: 100% }
  .atouts { flex-direction: column; gap: 16px; margin-top: 44px }
  .atout { padding: 0 0 0 72px; min-height: 58px; display: flex; flex-direction: column; justify-content: center; color: var(--gris) }
  .atout strong { color: var(--nuit); text-shadow: none }
  .heros-accueil > .panneau-chiffres { position: relative; right: auto; bottom: auto; margin: 0 var(--gout) 32px }
  .panneau-chiffres { flex-direction: column; align-items: flex-start; gap: 18px; padding: 22px }
  .chiffre + .chiffre { margin-left: 0; padding-left: 0; border-left: 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .16); width: 100% }
  .chiffre-photos { grid-template-columns: auto 1fr }
  .chiffre-valeur { font-size: 28px }

  .services, .realisations, .etapes, .zones, .faq, .prestations, .signes, .autres-services, .secteurs { padding: 84px 0 }
  .titre-section { font-size: clamp(38px, 11vw, 50px) }
  .grille-services, .grille-prestations, .grille-secteurs, .grille-autres { grid-template-columns: 1fr }
  .carte-service-grande { min-height: 560px }
  .artisan { padding: 84px 0 }
  .carte-flottante-artisan { width: auto; left: 16px; right: 16px; bottom: -48px }
  .mosaique, .mosaique-page { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-rows: 260px }
  .projet-a, .projet-b, .projet-c, .projet-d, .mosaique-page .projet-e, .mosaique-page .projet-f { grid-column: 1; grid-row: auto }
  .liste-etapes { grid-template-columns: 1fr }
  .prestation, .secteur { padding: 24px 22px 24px 96px; min-height: 106px }
  .prestation::before, .secteur::before { left: 22px; top: 24px }
  .prestation::after, .secteur::after { left: 36px; top: 38px }
  .panneau-zones { position: relative; left: auto; bottom: auto; margin: -60px 16px 0 }
  .question-titre { padding: 20px 66px 20px 20px; font-size: 16.5px }
  .question-titre::before { right: 16px }
  .question-titre::after { right: 27px }
  .question-reponse { padding: 0 20px 22px }
  .liste-signes li { font-size: 16.5px; padding: 20px 0 20px 54px }
  .contact { padding-top: 84px }
  .contact-photo { bottom: 140px }
  .coordonnees li:nth-child(1) a { font-size: 38px }
  .formulaire { padding: 28px 22px }
  .champs { grid-template-columns: 1fr }
  .pied-in { grid-template-columns: 1fr; gap: 36px }
  .pied-bas { flex-direction: column }
}

/* =========================================================
   Adaptations WordPress
   Le CSS des blocs est imprimé par WordPress au rendu : toute
   surcharge doit être PLUS spécifique, pas seulement plus tardive.
   ========================================================= */

/* Espacement automatique : coupé dans theme.json (blockGap 0px) ;
   filet de sécurité à spécificité nulle, jamais en .wp-block-group > * */
:where(.wp-block-group) > :where(*), :where(.wp-block-buttons) { margin-block: 0 }
.wp-site-blocks > * { margin-block: 0 }
.wp-block-post-content > * { margin-block: 0 }
:where(.wp-block-group.is-layout-flow) > * { margin-block-start: 0 }

/* liens : pas de soulignement hérité des styles globaux */
:where(.wp-site-blocks) a:where(:not(.wp-element-button)) { text-decoration: none }

/* boutons natifs : les styles du bloc n'imposent ni hauteur ni césure */
.wp-block-buttons > .wp-block-button { display: inline-block; width: auto }
.wp-block-button > .wp-block-button__link { word-break: normal; text-decoration: none }

/* en-tête : logo du site et menu natif (core/site-logo, core/navigation) */
.wp-block-site-logo.logo { line-height: 0 }
.wp-block-site-logo.logo a { display: block }
.wp-block-site-logo.logo img { width: auto; height: 80px; filter: drop-shadow(0 6px 14px rgba(5, 10, 33, .35)); transition: height .3s }
.est-defile .wp-block-site-logo.logo img { height: 62px }
.pied .wp-block-site-logo.logo-pied img { height: 132px; filter: none }

.wp-block-navigation.menu { font: 500 15.5px/1 var(--texte); color: rgba(255, 255, 255, .88) }
.wp-block-navigation.menu .wp-block-navigation__container { gap: 40px }
.wp-block-navigation.menu .wp-block-navigation-item__content { padding: 10px 0; color: rgba(255, 255, 255, .88); transition: color .2s }
.wp-block-navigation.menu .wp-block-navigation-item__content:hover,
.wp-block-navigation.menu .current-menu-item > .wp-block-navigation-item__content { color: #fff }
.wp-block-navigation.menu .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content { position: relative }
.wp-block-navigation.menu .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::before {
  content: ''; position: absolute; left: 0; right: 0; bottom: -9px;
  height: 3px; border-radius: 3px; background: var(--rouge);
}
.wp-block-navigation.menu .wp-block-navigation__submenu-icon { width: 12px; height: 12px; margin-left: 6px; color: currentColor }
.wp-block-navigation.menu .wp-block-navigation__submenu-container {
  top: calc(100% + 14px); left: -22px; min-width: 250px !important;
  padding: 10px; border: 0; border-radius: 16px;
  background: #fff; color: var(--nuit);
  box-shadow: 0 30px 60px -24px rgba(5, 10, 33, .45);
}
.wp-block-navigation.menu .wp-block-navigation__submenu-container::before { content: ''; position: absolute; inset: -16px 0 auto; height: 16px }
.wp-block-navigation.menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  display: block; width: 100%; padding: 11px 14px; border-radius: 10px;
  font: 500 15px/1.3 var(--texte); color: var(--nuit);
}
.wp-block-navigation.menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--blanc-froid); color: var(--rouge) }

/* bouton d'ouverture du menu mobile */
.wp-block-navigation.menu .wp-block-navigation__responsive-container-open {
  display: none; align-items: center; gap: 10px; padding: 0 18px; height: 46px;
  border-radius: 999px; background: rgba(255, 255, 255, .14);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  font: 600 15px/1 var(--texte); color: #fff;
}
.wp-block-navigation.menu .wp-block-navigation__responsive-container-open::before { content: 'Menu' }
/* le panneau mobile s'ouvre blanc sur blanc si on ne le surclasse pas : seul !important justifié */
.wp-block-navigation.menu .wp-block-navigation__responsive-container.is-menu-open {
  padding: 26px var(--gout) 40px;
  background-color: rgba(5, 10, 33, .985) !important;
  color: #fff !important;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__responsive-container-close { color: #fff; top: 26px; right: var(--gout) }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 70px; align-items: flex-start }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container { gap: 6px; align-items: flex-start }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > li > .wp-block-navigation-item__content {
  padding: 4px 0; font: 400 38px/1.15 var(--titre); text-transform: uppercase; color: #fff;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content { color: var(--rouge) }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::before { display: none }
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__submenu-container {
  padding: 0 0 10px; background: none; box-shadow: none; min-width: 0 !important;
}
.wp-block-navigation.menu .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 8px 0; font-size: 17px; color: rgba(255, 255, 255, .75); background: none;
}

/* barre d'administration (connecté) : l'en-tête fixe passe dessous */
.admin-bar .entete { top: 32px }
@media (max-width: 782px) { .admin-bar .entete { top: 46px } }

/* WordPress retire la marge du dernier enfant avec :root :where(.is-layout-flow) > :last-child (0,2,0) :
   on rétablit, plus spécifiquement, celles que le design utilise (relevé de la porte 4) */
.faq .faq-liste > .question { margin-bottom: 12px }
.heros-texte > .titre-heros:last-child { margin-bottom: 22px }
.heros-texte > .chapo:last-child { margin-bottom: 28px }
.zones-texte > .communes:last-child { margin-bottom: 34px }
.legal-in > p:last-child { margin-bottom: 8px }
/* idem pour la marge haute du premier enfant (:first-child) */
.pied-col > .pied-titre:first-child { margin-top: 4px }

/* Contact Form 7 : le formulaire reçoit la classe .formulaire (html_class) */
.wpcf7 { margin: 0 }
.wpcf7 .hidden-fields-container { display: none }
.wpcf7 .screen-reader-response { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px) }
.formulaire .champ .wpcf7-form-control-wrap { display: block; margin: 0; font: inherit }
.formulaire input.formulaire-bouton {
  -webkit-appearance: none; appearance: none;
  padding: 0 52px 0 32px;
  background: var(--rouge) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23fff'%3E%3Cpath d='M224.49,136.49l-72,72a12,12,0,0,1-17-17L187,140H40a12,12,0,0,1,0-24H187L135.51,64.48a12,12,0,0,1,17-17l72,72A12,12,0,0,1,224.49,136.49Z'/%3E%3C/svg%3E") no-repeat calc(50% + 98px) 50% / 18px;
}
.formulaire input.formulaire-bouton:hover { background-color: var(--rouge-fonce) }
.formulaire .wpcf7-spinner { display: none }
.formulaire .wpcf7-not-valid-tip { display: block; margin-top: 6px; font: 500 13px/1.3 var(--texte); color: var(--rouge) }
.formulaire .wpcf7-not-valid { border-color: var(--rouge) }
.formulaire .wpcf7-response-output {
  margin: 16px 0 0; padding: 12px 16px; border: 1px solid var(--trait); border-radius: 12px;
  font-size: 14.5px; line-height: 1.4; color: var(--nuit);
}
.formulaire .wpcf7-response-output:empty { display: none }
.formulaire.sent .wpcf7-response-output { border-color: #2e9d5b; background: #eefaf3 }
.formulaire.invalid .wpcf7-response-output, .formulaire.failed .wpcf7-response-output { border-color: var(--rouge); background: #fff3f2 }

:where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid var(--bleu); outline-offset: 3px; border-radius: 6px }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important } }

@media (max-width: 1180px) {
  .wp-block-navigation.menu .wp-block-navigation__container { gap: 26px }
}
@media (max-width: 980px) {
  .entete .wp-block-buttons.entete-cta { display: none }
  .wp-block-navigation.menu .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex }
  .wp-block-navigation.menu .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none }
}
@media (max-width: 640px) {
  .entete .wp-block-site-logo.logo img { height: 60px }
}