/*
Theme Name: SANIPURE.fr
Theme URI: https://sanipure.fr
Author: SANIPURE
Description: Thème bloc SANIPURE.fr, design system SANIPURE Valence. Contenus historiques de sanipure.fr conservés à l'identique (convertis depuis Divi). Installation des contenus : Outils → Installer SANIPURE.fr.
Version: 0.9.3
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: sanipure-fr
Tags: block-theme, full-site-editing, one-column
*/

/* ==========================================================================
   SANIPURE — feuille de marque commune (agences locales)
   Dérivée du thème SANIPURE Grenoble 1.18 (style « Technological Worker »).
   Contenu local : maquette/config/<ville>.yml. Pictogrammes : pictos.css (généré).
   Ordre : polices · jetons · socle · surfaces · mise en page · typographie ·
   boutons · preuves · en-tête · composants · pied de page · mouvement · responsive.
   ========================================================================== */

/* ---------- Polices (auto-hébergées, sous-ensemble latin) ---------- */
@font-face { font-family: "Google Sans Flex"; font-style: normal; font-weight: 400 700; font-stretch: 75% 100%; font-display: swap; src: url("assets/fonts/google-sans-flex-latin-var.woff2") format("woff2"); }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("assets/fonts/manrope-latin-var.woff2") format("woff2"); }
@font-face { font-family: "Google Sans Code"; font-style: normal; font-weight: 300 800; font-display: swap; src: url("assets/fonts/google-sans-code-latin-var.woff2") format("woff2"); }
/* Replis ajustés pour limiter le décalage de mise en page pendant le chargement */
@font-face { font-family: "Titre repli"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Arial"); font-weight: 500 800; size-adjust: 98%; }
@font-face { font-family: "Texte repli"; src: local("Arial"), local("ArialMT"); font-weight: 400 800; size-adjust: 100.5%; ascent-override: 106%; descent-override: 30%; line-gap-override: 0%; }
@property --scan { syntax: "<percentage>"; inherits: false; initial-value: 0%; }

/* ---------- Jetons ---------- */
:root {
  color-scheme: dark;
  /* Couleurs de marque */
  --carbone: #0B0C0D;
  --graphite: #121416;
  --acier: #1A1D20;
  --filet-sombre: #262A2E;
  --gris-1: #A3A8AE;
  --gris-2: #858B92;
  --papier: #F0F0EC;
  --blanc-tech: #F3F3F0;
  --blanc: #FFFFFF;
  --jaune: #FFAE00;
  --jaune-pale: #FFF4DA;
  --encre-claire: #0B0C0D;
  --encre-claire-2: #454A50;
  --encre-claire-3: #5F656B;
  --filet-clair: #D6D7D2;

  /* Typographie */
  --titre: "Google Sans Flex", "Titre repli", system-ui, sans-serif; /* titres : Google Sans, textes : Manrope (12/10/2026) */
  --titre-graisse: 700;
  --titre-graisse-forte: 700;
  --titre-largeur: 100%;
  --titre-approche: -.025em;
  --texte: "Manrope", "Texte repli", system-ui, sans-serif;
  --mono: "Google Sans Code", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --t-h1: clamp(1.45rem, 1.05rem + 1.05vw, 2.1rem);
  --t-h2: clamp(1.25rem, .95rem + .9vw, 1.8rem);
  --t-h3: clamp(1.08rem, 1rem + .3vw, 1.28rem);
  --t-chapeau: clamp(16px, 15px + .25vw, 17.5px);
  --t-texte: 16px;
  --t-petit: 14.5px;
  --t-etiquette: 11.5px;

  /* Mise en page */
  --largeur: 1320px;
  --marge: clamp(16px, 4vw, 60px);
  --section: clamp(88px, 10vw, 150px);
  --gouttiere: clamp(16px, 2vw, 28px);
  --entete-h: 76px;

  /* Formes */
  --r-carte: 10px;
  --r-photo: 8px;
  --r-bouton: 6px;
  --r-tag: 3px;

  /* Mouvement : scan (photos), module (blocs), tracé (filets, progression), micro (survol) */
  --ease: cubic-bezier(.2, .8, .2, 1);
  --ease-scan: cubic-bezier(.65, 0, .35, 1);
  --t-scan: 950ms;
  --t-module: 500ms;
  --t-trace: 420ms;
  --t-micro: 180ms;
}

/* ---------- Socle ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--entete-h) + 16px); }
body { margin: 0; background: var(--carbone); color: var(--blanc-tech); font: 400 var(--t-texte)/1.7 var(--texte); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip; }
img { display: block; max-width: 100%; height: auto; }
figure, h1, h2, h3, h4, p, ul, ol, dl, dd { margin: 0; }
ul[role="list"], ol[role="list"] { padding: 0; list-style: none; }
a { color: inherit; }
button { font: inherit; color: inherit; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--jaune); outline-offset: 3px; }
.lien-evitement { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: var(--r-bouton); background: var(--jaune); color: var(--carbone); font-weight: 700; text-decoration: none; }
.lien-evitement:focus { top: 12px; }
.sur-mobile { display: none; }
@media (max-width: 899px) { .sur-ordinateur { display: none; } .sur-mobile { display: inline; } }
.visuellement-cache { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---------- Surfaces : chaque section déclare son fond, les composants lisent les variables ---------- */
.surface, .section { --fond: var(--carbone); --encre: var(--blanc-tech); --encre-2: var(--gris-1); --encre-3: var(--gris-2); --filet: var(--filet-sombre); --carte: var(--graphite); --bord-bouton: #3A3F45; --ruban-encre: var(--carbone);
  background: var(--fond); color: var(--encre); }
.surface--graphite { --fond: var(--graphite); --carte: var(--acier); --filet: #2A2E33; }
.surface--papier, .surface--blanc { --encre: var(--encre-claire); --encre-2: var(--encre-claire-2); --encre-3: var(--encre-claire-3); --filet: var(--filet-clair); --carte: var(--blanc); --bord-bouton: #B4B6B1; color-scheme: light; }
.surface--papier { --fond: var(--papier); }
.surface--blanc { --fond: var(--blanc); --carte: var(--papier); }
.surface--jaune { --fond: var(--jaune); --encre: var(--carbone); --encre-2: #3B2A00; --encre-3: #4A3700; --filet: rgba(11, 12, 13, .28); --carte: rgba(255, 255, 255, .22); --bord-bouton: var(--carbone); --ruban-encre: var(--jaune); color-scheme: light; }

/* ---------- Mise en page ---------- */
.section { padding-block: var(--section); }
.section--serree { padding-block: clamp(56px, 7vw, 96px); }
.conteneur { width: 100%; max-width: var(--largeur); margin-inline: auto; padding-inline: var(--marge); }
.conteneur--etroit { max-width: 900px; }
.pile > * + * { margin-top: var(--pile, 18px); }

/* En-tête de section façon fiche technique : filet, surtitre, titre à gauche, chapeau à droite */
.entete-section { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(32px, 5vw, 88px); align-items: end; margin-bottom: clamp(48px, 6vw, 80px); padding-top: 22px; border-top: 1px solid var(--filet); }
.entete-section > .surtitre { grid-column: 1 / -1; }
.entete-section > h2 { grid-column: 1; }
.entete-section > :not(.surtitre):not(h2) { grid-column: 2; padding-bottom: 6px; }
.entete-section--simple { display: block; }
.entete-section--simple > h2 + * { margin-top: 20px; }

/* ---------- Typographie ---------- */
.surtitre { display: block; margin: 0 0 22px; font: 500 10.5px/1.3 var(--mono); letter-spacing: .18em; text-transform: uppercase; color: var(--encre-2); }
.surtitre::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 10px; vertical-align: 1px; border-radius: 2px; background: var(--jaune); }
.surface--jaune .surtitre::before { background: var(--carbone); }
.etiquette { font: 500 var(--t-etiquette)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--encre-2); }
.titre-1 { font-family: var(--titre); font-weight: var(--titre-graisse); font-stretch: var(--titre-largeur); font-size: var(--t-h1); line-height: 1.08; letter-spacing: var(--titre-approche); text-wrap: balance; }
.titre-1 em { font-style: normal; color: var(--jaune); }
h2, .titre-2 { font-family: var(--titre); font-weight: var(--titre-graisse); font-stretch: var(--titre-largeur); font-size: var(--t-h2); line-height: 1.38; letter-spacing: var(--titre-approche); color: var(--encre); text-wrap: balance; }
h3, .titre-3 { font-family: var(--titre); font-weight: var(--titre-graisse); font-stretch: var(--titre-largeur); font-size: var(--t-h3); line-height: 1.2; color: var(--encre); text-wrap: balance; }
h4, .titre-4 { font-family: var(--titre); font-weight: 500; font-size: 1.15rem; line-height: 1.25; color: var(--encre); }
/* Ruban d’étiquetage (comme SANIPURE Grenoble) : la partie en <em> d’un titre est surlignée en jaune, texte carbone */
:is(h2, .titre-2) em, .ruban { font-style: normal; color: var(--ruban-encre); padding: .05em .16em; background: linear-gradient(var(--jaune), var(--jaune)) 0 50% / 100% 100% no-repeat; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.surface--jaune :is(h2, .titre-2) em { background-image: linear-gradient(var(--carbone), var(--carbone)); }
.chapeau { font-size: var(--t-chapeau); line-height: 1.65; color: var(--encre-2); max-width: 58ch; }
.chapeau strong { color: var(--encre); font-weight: 650; }
.texte { color: var(--encre-2); max-width: 66ch; }
.texte strong { color: var(--encre); font-weight: 650; }
.petit { font-size: var(--t-petit); line-height: 1.55; }
.chiffres { font-variant-numeric: tabular-nums; }

/* ---------- Boutons et liens ---------- */
.groupe-boutons { display: flex; flex-wrap: wrap; gap: 10px; }
/* Boutons : règles identiques à SANIPURE Grenoble (tech.css 1.18.1, .tw-bouton).
   Au survol, les couleurs ne changent pas : un contour jaune apparaît autour du bouton. */
.bouton { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 0 22px; border-radius: var(--r-bouton); border: 1px solid transparent; background: none;
  font: 700 15px/1.2 var(--texte); letter-spacing: .005em; color: var(--encre); text-decoration: none; white-space: nowrap; outline: 2px solid transparent; outline-offset: 2px; cursor: pointer;
  transition: outline-color var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease), transform var(--t-micro) var(--ease); }
.bouton:hover, .bouton.est-survol { outline-color: var(--jaune); }
.bouton:active, .bouton.est-actif { transform: translateY(1px); }
.bouton:focus-visible, .bouton.est-focus { outline: 2px solid var(--jaune); outline-offset: 3px; box-shadow: 0 0 0 1px var(--fond); }
.surface--jaune .bouton:hover, .surface--jaune .bouton:focus-visible { outline-color: var(--carbone); }
.bouton--jaune { background: var(--jaune); color: var(--carbone); }
.bouton--contour { border-color: var(--bord-bouton); background: transparent; color: var(--encre); }
.bouton--contour:hover, .bouton--contour.est-survol { border-color: var(--jaune); }
.surface--jaune .bouton--contour:hover { border-color: var(--carbone); }
.bouton--noir { background: var(--carbone); color: var(--blanc-tech); }
.bouton--fleche::after { content: "→"; font: 500 15px/1 var(--mono); transition: transform var(--t-micro) var(--ease); }
.bouton--fleche:hover::after, .bouton--fleche.est-survol::after { transform: translateX(3px); }
.bouton--petit { min-height: 38px; padding: 0 14px; font-size: 13.5px; }
.bouton .picto { --picto-t: 18px; }
.bouton[disabled] { opacity: .45; cursor: not-allowed; }
/* Bouton « Devis » de l'en-tête mobile, comme Grenoble (.btn-devis-mobile) */
@media (max-width: 899px) { .entete-actions .bouton--jaune { min-height: 36px; padding: 0 16px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; } }
.lien-fleche { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 3px; border-bottom: 1px solid var(--filet); font: 500 12px/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--encre); text-decoration: none; transition: border-color var(--t-micro) var(--ease); }
.lien-fleche::after { content: "→"; color: var(--jaune); transition: transform var(--t-micro) var(--ease); }
.surface--papier .lien-fleche::after, .surface--blanc .lien-fleche::after { color: var(--encre); }
.lien-fleche:hover { border-color: var(--jaune); }
.lien-fleche:hover::after { transform: translateX(3px); }
.lien-texte { color: var(--encre); text-decoration: underline; text-decoration-color: var(--jaune); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* ---------- Preuves (avis, qualifications) ---------- */
.preuves { display: flex; flex-wrap: wrap; gap: 10px; }
.preuve { display: inline-flex; align-items: center; gap: 12px; min-height: 52px; padding: 6px 18px 6px 6px; border: 1px solid #343A42; border-radius: 999px; background: rgba(26, 29, 32, .9); color: var(--blanc-tech); font: 500 15px/1.2 var(--texte); text-decoration: none; transition: border-color var(--t-micro) var(--ease); }
a.preuve:hover { border-color: var(--jaune); }
.preuve img { flex: none; }
.preuve--google img { width: 30px; height: 30px; margin-left: 8px; }
.preuve--google strong { font-weight: 750; font-variant-numeric: tabular-nums; }
.preuve--google .preuve-detail { color: var(--gris-1); }
.preuve-etoiles { color: var(--jaune); font-size: 15px; letter-spacing: .12em; }
.preuve--label { padding: 6px 16px; }
.preuve--label img { width: auto; height: 38px; }

/* ---------- En-tête ---------- */
.entete { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; background: rgba(11, 12, 13, .94); border-bottom: 1px solid var(--filet-sombre); -webkit-backdrop-filter: saturate(140%) blur(10px); backdrop-filter: saturate(140%) blur(10px); }
.entete-barre { display: flex; align-items: center; gap: 28px; max-width: 1680px; min-height: var(--entete-h); margin-inline: auto; padding-inline: var(--marge); }
.entete-logo { flex: none; display: block; }
.entete-logo img { width: 168px; height: auto; }
.entete-nav { display: flex; gap: 4px; margin-left: auto; }
.entete-nav a { position: relative; white-space: nowrap; padding: 10px 12px; font: 600 14.5px/1 var(--texte); color: var(--gris-1); text-decoration: none; transition: color var(--t-micro) var(--ease); }
.entete-nav a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px; height: 2px; background: var(--jaune); transform: scaleX(0); transform-origin: 0 50%; transition: transform var(--t-trace) var(--ease); }
.entete-nav a:hover, .entete-nav a[aria-current="page"] { color: var(--blanc-tech); }
.entete-nav a:hover::after, .entete-nav a[aria-current="page"]::after { transform: none; }
.entete-actions { display: flex; align-items: center; gap: 10px; }
.entete-tel { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border: 1px solid var(--filet-sombre); border-radius: 999px; font: 500 13px/1 var(--mono); letter-spacing: .06em; color: var(--blanc-tech); text-decoration: none; white-space: nowrap; transition: border-color var(--t-micro) var(--ease); font-variant-numeric: tabular-nums; }
.entete-tel:hover { border-color: var(--jaune); }
.entete-tel .picto { --picto-t: 15px; color: var(--jaune); }
.entete-menu { display: none; width: 46px; height: 46px; padding: 0; border: 1px solid var(--filet-sombre); border-radius: var(--r-bouton); background: none; cursor: pointer; }
.entete-menu span { display: block; width: 18px; height: 1.5px; margin: 4px auto; background: var(--blanc-tech); transition: transform var(--t-micro) var(--ease), opacity var(--t-micro) var(--ease); }
.entete-menu[aria-expanded="true"] span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.entete-menu[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.entete-menu[aria-expanded="true"] span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
/* Menu mobile compact (13/10/2026) : groupes étiquetés, liens de 17 px, ouverture en fondu */
.menu-mobile { position: fixed; top: var(--menu-haut, var(--entete-h)); left: 0; right: 0; bottom: 0; z-index: 49; overflow-y: auto; padding: 14px var(--marge) calc(24px + env(safe-area-inset-bottom, 0px)); background: var(--carbone); border-top: 1px solid var(--filet-sombre); animation: menu-entree 220ms var(--ease) both; }
@keyframes menu-entree { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .menu-mobile { animation: none; } }
.menu-mobile nav { max-width: 520px; margin-inline: auto; }
.menu-mobile-groupe { margin: 14px 0 4px; font: 500 11.5px/1.3 var(--mono); letter-spacing: .16em; text-transform: uppercase; color: var(--gris-2); }
.menu-mobile ul { margin: 0; padding: 0; list-style: none; }
.menu-mobile nav a { position: relative; display: flex; justify-content: space-between; align-items: center; min-height: 46px; padding: 0 2px; border-bottom: 1px solid rgba(243, 243, 240, .07); font: 600 17px/1.2 var(--texte); color: var(--blanc-tech); text-decoration: none; }
.menu-mobile nav a::after { content: "→"; font: 500 14px/1 var(--mono); color: var(--jaune); opacity: .7; transition: transform var(--t-micro) var(--ease), opacity var(--t-micro) var(--ease); }
.menu-mobile nav a:hover::after, .menu-mobile nav a:focus-visible::after { opacity: 1; transform: translateX(3px); }
.menu-mobile nav a[aria-current="page"] { padding-left: 14px; color: var(--jaune); }
.menu-mobile nav a[aria-current="page"]::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 2px; background: var(--jaune); }
.menu-mobile-actions { display: grid; gap: 10px; max-width: 520px; margin: 22px auto 0; }
.menu-mobile-actions .bouton { min-height: 48px; font-size: 15px; }

/* ---------- Photos ---------- */
.photo { position: relative; overflow: hidden; border-radius: var(--r-photo); background: var(--acier); isolation: isolate; }
.photo img { width: 100%; height: 100%; object-fit: cover; }
.photo-legende { position: absolute; left: 16px; top: 16px; z-index: 2; display: inline-flex; gap: 8px; padding: 6px 9px; background: rgba(11, 12, 13, .84); font: 500 10.5px/1.2 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--blanc-tech); }
.photo-legende span { color: var(--jaune); }
/* Repères annotés posés sur une photo (coordonnées en % via --x / --y) */
.reperes { position: absolute; inset: 0; z-index: 3; margin: 0; padding: 0; list-style: none; pointer-events: none; }
.repere { position: absolute; left: calc(var(--x) * 1%); top: calc(var(--y) * 1%); }
.repere::before { content: ""; position: absolute; left: -7px; top: -7px; width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid var(--jaune); background: radial-gradient(circle, var(--jaune) 0 2.5px, rgba(11, 12, 13, .35) 3px); }
.repere span { position: absolute; left: 18px; top: -13px; padding: 6px 10px; border-left: 2px solid var(--jaune); background: rgba(11, 12, 13, .86); font: 500 10.5px/1.2 var(--mono); letter-spacing: .09em; text-transform: uppercase; color: var(--blanc-tech); white-space: nowrap; }
.repere--gauche span { left: auto; right: 18px; border-left: 0; border-right: 2px solid var(--jaune); }

/* ---------- Carte service : photo, titre, texte, lien ---------- */
.carte-service { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; border-radius: var(--r-carte); background: var(--carte); color: var(--encre); text-decoration: none; outline: 1px solid var(--filet); outline-offset: -1px; transition: outline-color var(--t-micro) var(--ease); }
.carte-service .photo { border-radius: 0; aspect-ratio: 4 / 3; }
.carte-service .photo img { transition: transform 900ms var(--ease); }
.carte-service-corps { display: flex; flex-direction: column; gap: 10px; flex: 1; padding: 22px 22px 24px; }
.carte-service-corps p { color: var(--encre-2); font-size: var(--t-petit); line-height: 1.55; }
.carte-service-corps .lien-fleche { align-self: flex-start; margin-top: auto; padding-top: 8px; border-bottom: 0; }
.carte-service-tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.carte-service-tete .picto { color: var(--encre-3); --picto-t: 22px; transition: color var(--t-micro) var(--ease); }
.carte-service:hover, .carte-service:focus-visible { outline-color: var(--jaune); }
.carte-service:hover .photo img, .carte-service:focus-visible .photo img { transform: scale(1.045); }
.carte-service:hover .carte-service-tete .picto { color: var(--jaune); }
.carte-service:hover .lien-fleche::after { transform: translateX(3px); }
/* Lien étendu à toute la carte */
.carte-service h3 a { color: inherit; text-decoration: none; }
.carte-service h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }

/* ---------- Carte lieu : photo pleine, étiquette mono, texte en pied ---------- */
.carte-lieu { --encre: var(--blanc-tech); --encre-2: #C9CDD1; position: relative; display: grid; min-width: 0; overflow: hidden; border-radius: var(--r-carte); background: var(--acier); color: var(--blanc-tech); isolation: isolate; }
.carte-lieu .photo { grid-area: 1 / 1; border-radius: 0; aspect-ratio: 3 / 4; }
.carte-lieu .photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 12, 13, 0) 30%, rgba(11, 12, 13, .55) 55%, rgba(11, 12, 13, .94) 100%); }
.carte-lieu-corps { grid-area: 1 / 1; align-self: end; z-index: 2; display: grid; gap: 8px; padding: 22px; }
.carte-lieu-corps p { color: #C9CDD1; font-size: var(--t-petit); line-height: 1.5; }
.carte-lieu .photo-legende { z-index: 3; }

/* ---------- Colonnes numérotées séparées par des filets (étapes réelles) ---------- */
.colonnes { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); }
.colonne { position: relative; display: grid; align-content: start; gap: 12px; padding: 26px 24px 8px 0; border-top: 1px solid var(--filet); }
.colonne + .colonne { padding-left: 24px; border-left: 1px solid var(--filet); }
.colonne::before { content: ""; position: absolute; left: 0; top: -1px; width: 48px; height: 2px; background: var(--jaune); transform-origin: 0 50%; }
.colonne + .colonne::before { left: 24px; }
.colonne-num { font: 500 var(--t-etiquette)/1 var(--mono); letter-spacing: .12em; color: var(--encre-3); font-variant-numeric: tabular-nums; }
.colonne p { color: var(--encre-2); font-size: var(--t-petit); line-height: 1.55; }

/* ---------- Fiche technique (liste de définitions) ---------- */
.fiche { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--filet); }
.fiche > div { display: grid; grid-template-columns: minmax(110px, 2fr) minmax(0, 5fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--filet); }
.fiche dt { font: 500 var(--t-etiquette)/1.5 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--encre-3); }
.fiche dd { color: var(--encre); font-size: var(--t-petit); line-height: 1.5; }

/* ---------- Onglets ---------- */
.onglets-liste { display: flex; gap: 0; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--filet); }
.onglets-liste::-webkit-scrollbar { display: none; }
.onglet { position: relative; flex: 1 0 auto; display: grid; gap: 6px; min-width: 180px; padding: 18px 22px 18px 0; border: 0; background: none; text-align: left; cursor: pointer; color: var(--encre-3); }
.onglet + .onglet { padding-left: 22px; }
.onglet-num { font: 500 var(--t-etiquette)/1 var(--mono); letter-spacing: .12em; }
.onglet-titre { font: var(--titre-graisse) clamp(1.2rem, 1rem + .6vw, 1.55rem)/1.1 var(--titre); font-stretch: var(--titre-largeur); color: var(--encre-2); transition: color var(--t-micro) var(--ease); }
.onglet::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--jaune); transform: scaleX(0); transform-origin: 0 50%; transition: transform var(--t-trace) var(--ease); }
.onglet + .onglet::after { left: 22px; }
.onglet:hover .onglet-titre { color: var(--encre); }
.onglet[aria-selected="true"] { color: var(--jaune); }
.onglet[aria-selected="true"] .onglet-titre { color: var(--encre); }
.onglet[aria-selected="true"]::after { transform: none; }
.onglet-panneau { padding-top: clamp(28px, 4vw, 48px); }
.onglet-panneau:focus-visible { outline-offset: 8px; }

/* ---------- Questions fréquentes ---------- */
.questions { border-top: 1px solid var(--filet); }
.question { border-bottom: 1px solid var(--filet); }
.question summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px 0; cursor: pointer; list-style: none; font: var(--titre-graisse) clamp(1.1rem, 1rem + .4vw, 1.35rem)/1.25 var(--titre); color: var(--encre); }
.question summary::-webkit-details-marker { display: none; }
.question summary::after { content: ""; flex: none; width: 28px; height: 28px; border: 1px solid var(--filet); border-radius: 50%; background: linear-gradient(var(--encre), var(--encre)) center / 10px 1.5px no-repeat, linear-gradient(var(--encre), var(--encre)) center / 1.5px 10px no-repeat; transition: transform var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease); }
.question summary:hover::after { border-color: var(--jaune); }
.question[open] summary::after { transform: rotate(45deg); }
.question-reponse { padding: 0 0 26px; max-width: 70ch; color: var(--encre-2); }
.question-reponse > * + * { margin-top: 12px; }

/* ---------- Champs de formulaire ---------- */
.champ { display: grid; gap: 8px; min-width: 0; }
.champ label, .champ legend { padding: 0; font: 600 14px/1.3 var(--texte); color: var(--encre); }
.champ .aide { font-size: 13px; color: var(--encre-3); }
.saisie { width: 100%; min-height: 52px; padding: 0 16px; border: 1px solid var(--bord-bouton); border-radius: var(--r-bouton); background: var(--carte); color: var(--encre); font: 500 16px/1.2 var(--texte); transition: border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease); }
textarea.saisie { min-height: 120px; padding: 14px 16px; line-height: 1.5; resize: vertical; }
.saisie::placeholder { color: var(--encre-3); }
.saisie:hover { border-color: var(--encre-3); }
.saisie:focus { outline: none; border-color: var(--jaune); box-shadow: 0 0 0 3px rgba(255, 174, 0, .25); }
.saisie[aria-invalid="true"] { border-color: #E5484D; }
.erreur { font-size: 13px; color: #FF8A8E; }
.surface--papier .erreur, .surface--blanc .erreur { color: #C4282D; }
fieldset.champ { margin: 0; padding: 0; border: 0; }
.choix { display: flex; flex-wrap: wrap; gap: 8px; }
.choix label { position: relative; display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 16px; border: 1px solid var(--bord-bouton); border-radius: var(--r-bouton); background: var(--carte); font: 600 14.5px/1.2 var(--texte); color: var(--encre); cursor: pointer; transition: border-color var(--t-micro) var(--ease), background-color var(--t-micro) var(--ease); }
.choix label .picto { --picto-t: 20px; color: var(--encre-3); }
.choix input { position: absolute; opacity: 0; pointer-events: none; }
.choix label:hover { border-color: var(--encre-3); }
.choix label:has(input:checked) { border-color: var(--jaune); background: rgba(255, 174, 0, .12); }
.choix label:has(input:checked) .picto { color: var(--jaune); }
.choix label:has(input:focus-visible) { outline: 2px solid var(--jaune); outline-offset: 2px; }
.surface--papier .choix label:has(input:checked), .surface--blanc .choix label:has(input:checked) { background: var(--jaune-pale); }
.surface--papier .choix label:has(input:checked) .picto, .surface--blanc .choix label:has(input:checked) .picto { color: var(--carbone); }

/* ---------- Bande signal (une par page au plus) ---------- */
.signal { position: relative; overflow: hidden; }
.signal-chiffre { white-space: nowrap; font: var(--titre-graisse) clamp(3rem, 1.2rem + 7vw, 7rem)/.92 var(--titre); font-stretch: var(--titre-largeur); letter-spacing: -.02em; color: var(--carbone); font-variant-numeric: tabular-nums; }
.regle { position: relative; height: 34px; margin-top: clamp(28px, 4vw, 48px); border-top: 2px solid var(--carbone); background: repeating-linear-gradient(90deg, var(--carbone) 0 1px, transparent 1px 100%) 0 0 / calc(100% / 36) 9px no-repeat, repeating-linear-gradient(90deg, var(--carbone) 0 2px, transparent 2px 100%) 0 0 / calc(100% / 6) 16px no-repeat; transform-origin: 0 50%; }
.regle-graduations { display: flex; justify-content: space-between; margin-top: 2px; font: 500 10.5px/1 var(--mono); letter-spacing: .08em; color: var(--encre-2); font-variant-numeric: tabular-nums; }

/* ---------- Pied de page ---------- */
.pied { padding-block: clamp(56px, 7vw, 88px) 28px; background: var(--carbone); color: var(--gris-1); border-top: 1px solid var(--filet-sombre); }
.pied-haut { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; padding-bottom: 36px; border-bottom: 1px solid var(--filet-sombre); }
.pied-colonnes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; padding-block: 40px; }
.pied-colonnes h2 { margin-bottom: 16px; font: 500 var(--t-etiquette)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--gris-2); }
.pied-colonnes ul { display: grid; gap: 10px; padding: 0; list-style: none; font-size: var(--t-petit); }
.pied-colonnes a { color: var(--blanc-tech); text-decoration: none; }
.pied-colonnes a:hover { color: var(--jaune); }
.pied-bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 22px; border-top: 1px solid var(--filet-sombre); font: 500 11px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--gris-2); }
.pied-bas a { color: inherit; text-decoration: none; }
.pied-bas a:hover { color: var(--blanc-tech); }

/* ---------- Mouvement ----------
   Rien n'est masqué sans JavaScript : le script pose .js sur <html>, puis .a-reveler
   sur les éléments situés hors de l'écran au chargement, et .est-visible à leur arrivée. */
@keyframes sp-monte { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes sp-fondu { from { opacity: 0; } to { opacity: 1; } }
@keyframes sp-glisse { from { transform: translateY(16px); } to { transform: none; } } /* premier écran : visible dès le départ (LCP), mouvement seul */
@keyframes sp-recul { from { transform: scale(1.05); } to { transform: none; } }
@keyframes sp-devoile { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes sp-ligne { 0% { --scan: 0%; opacity: 1; } 88% { opacity: 1; } 100% { --scan: 100%; opacity: 0; } }
@keyframes sp-trait { from { transform: scaleX(0); } to { transform: none; } }
@keyframes sp-pop { from { opacity: 0; transform: scale(.3); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: no-preference) {
  /* module : blocs qui montent, décalés par --i */
  .js .a-reveler.module { opacity: 0; transform: translateY(16px); }
  .js .a-reveler.module.est-visible { opacity: 1; transform: none; transition: opacity var(--t-module) var(--ease), transform var(--t-module) var(--ease); transition-delay: calc(var(--i, 0) * 70ms); }
  /* scan : la photo est dévoilée de haut en bas, une ligne jaune suit le front */
  .scan { position: relative; }
  .scan::after { content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none; opacity: 0; background: linear-gradient(var(--jaune), var(--jaune)) 0 var(--scan) / 100% 1px no-repeat; }
  .js .a-reveler.scan img { clip-path: inset(0 0 100% 0); }
  .js .a-reveler.scan.est-visible img { clip-path: inset(0 0 0 0); transition: clip-path var(--t-scan) var(--ease-scan); }
  .js .a-reveler.scan.est-visible::after { animation: sp-ligne var(--t-scan) var(--ease-scan) both; }
  /* tracé : filets et règles qui se dessinent */
  .js .a-reveler.trace .colonne::before, .js .a-reveler.trace .regle { transform: scaleX(0); }
  .js .a-reveler.trace.est-visible .colonne::before, .js .a-reveler.trace.est-visible .regle { transform: none; transition: transform var(--t-trace) var(--ease); transition-delay: calc(var(--i, 0) * 90ms + 120ms); }
  /* ouverture du premier écran (~1,4 s) */
  .ouverture-photo img { animation: sp-recul 1600ms var(--ease) 60ms both; }
  .ouverture-photo::after { animation: sp-ligne var(--t-scan) var(--ease-scan) 80ms both; }
  .ouverture-seq { animation: sp-glisse var(--t-module) var(--ease) var(--d, 0ms) both; }
  .ouverture-photo .repere { animation: sp-pop 260ms var(--ease) calc(500ms + var(--y) * 9ms) both; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
  .carte-service:hover .photo img { transform: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
  .entete-nav a { padding-inline: 9px; font-size: 14px; }
  .entete-tel { display: none; }
  .entete-barre { gap: 20px; }
}
@media (max-width: 1023px) {
  .colonnes { --n: 2 !important; row-gap: 28px; }
  .colonne:nth-child(odd) { padding-left: 0; border-left: 0; }
  .colonne:nth-child(odd)::before { left: 0; }
  .pied-colonnes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
  :root { --entete-h: 66px; }
  .entete-nav, .entete-actions .bouton--contour { display: none; }
  .entete-actions { margin-left: auto; }
  .entete-menu { display: block; }
  .entete-logo img { width: 142px; }
  .entete-section { grid-template-columns: minmax(0, 1fr); row-gap: 20px; }
  .entete-section > :not(.surtitre):not(h2) { grid-column: 1; }
}
@media (max-width: 599px) {
  .colonnes { --n: 1 !important; }
  .colonne, .colonne + .colonne { padding-left: 0; border-left: 0; }
  .colonne + .colonne::before { left: 0; }
  .fiche > div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .pied-colonnes { grid-template-columns: minmax(0, 1fr); }
  .groupe-boutons .bouton { flex: 1 1 100%; }
  .bouton { white-space: normal; text-align: center; }
}

/* ==========================================================================
   Composants de page (accueil et pages services)
   ========================================================================== */

/* ---------- Premier écran ---------- */
.hero { background: var(--carbone); }
.hero-grille { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: center; column-gap: clamp(32px, 4vw, 72px); max-width: 1680px; min-height: min(calc(100svh - var(--entete-h) - 96px), 780px); margin-inline: auto; padding: clamp(28px, 4vh, 48px) var(--marge); }
.hero-texte { max-width: 600px; }
.hero .surtitre { color: var(--gris-1); }
.hero .titre-1 { color: var(--blanc-tech); }
.hero-desc { margin-top: 22px; max-width: 54ch; font-size: clamp(16px, 15px + .3vw, 17.5px); line-height: 1.6; color: var(--gris-1); }
.hero-notes { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 22px; padding: 0; list-style: none; font: 500 11px/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; color: var(--gris-1); }
.hero-notes li::before { content: "✓"; margin-right: 8px; color: var(--jaune); }
.hero .groupe-boutons { margin-top: 30px; }
.hero .preuves { margin-top: 22px; }
.hero-photo { justify-self: end; width: 100%; aspect-ratio: 1.45; }
.hero-photo img { object-position: 50% 45%; }
.specs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); max-width: 1680px; margin-inline: auto; padding-inline: var(--marge); }
.specs > div { padding: 18px 16px 22px 0; border-top: 1px solid var(--filet-sombre); }
.specs > div + div { padding-left: 18px; border-left: 1px solid var(--filet-sombre); }
.specs dt { font: 500 10.5px/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--gris-2); }
.specs dd { margin-top: 8px; font: var(--titre-graisse) clamp(1.05rem, .9rem + .35vw, 1.3rem)/1.15 var(--titre); font-stretch: var(--titre-largeur); color: var(--blanc-tech); font-variant-numeric: tabular-nums; }
.specs dd a { text-decoration: none; }
.specs dd a:hover { color: var(--jaune); }

/* ---------- Domaines d'expertise : mosaïque éditoriale ---------- */
.domaines { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gouttiere); }
.domaines > * { grid-column: span 3; }
.domaines > :nth-child(1) { grid-column: span 7; }
.domaines > :nth-child(2) { grid-column: span 5; }
.domaines > :nth-child(-n + 2) .photo { aspect-ratio: auto; height: clamp(240px, 25vw, 360px); }
.domaines > :nth-child(-n + 2) .carte-service-corps { padding: 26px 28px 28px; }
.domaines > :nth-child(-n + 2) h3 { font-size: clamp(1.7rem, 1.3rem + 1vw, 2.3rem); }
.domaines > :nth-child(-n + 2) p { font-size: 15.5px; max-width: 46ch; }

/* ---------- Expertise : photo fixe, séquence numérotée ---------- */
.expertise { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 88px); align-items: start; }
.expertise-photo { position: sticky; top: calc(var(--entete-h) + 32px); aspect-ratio: 4 / 5; }
.expertise-photo img { object-position: 60% 50%; }
.sequence { counter-reset: etape; border-top: 1px solid var(--filet); }
.sequence li { position: relative; display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 8px 20px; padding: 28px 0; border-bottom: 1px solid var(--filet); }
.sequence li::before { content: ""; position: absolute; left: 0; top: -1px; width: 84px; height: 2px; background: var(--jaune); transform-origin: 0 50%; }
.sequence-num { grid-row: span 2; font: var(--titre-graisse) clamp(2.2rem, 1.6rem + 1.4vw, 3.2rem)/.9 var(--titre); font-stretch: var(--titre-largeur); color: var(--encre-3); font-variant-numeric: tabular-nums; }
.sequence h3 { font-size: clamp(1.3rem, 1.1rem + .6vw, 1.7rem); }
.sequence p { color: var(--encre-2); max-width: 56ch; }
@media (prefers-reduced-motion: no-preference) {
  .js .sequence li.a-reveler::before { transform: scaleX(0); }
  .js .sequence li.a-reveler.est-visible::before { transform: none; transition: transform var(--t-trace) var(--ease) 200ms; }
  .sequence li .sequence-num { transition: opacity var(--t-module) var(--ease) 300ms; }
  .js .sequence li.a-reveler:not(.est-visible) .sequence-num { opacity: .2; }
}

/* ---------- Traitements : grille d'onglet ---------- */
.traitement { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.traitement .photo { aspect-ratio: 16 / 10; }
.traitement h3 { margin-bottom: 14px; }
.traitement .texte { margin-bottom: 22px; }
.traitement .lien-fleche { margin-top: 24px; }
.avertissement { display: flex; gap: 12px; align-items: flex-start; margin-top: clamp(32px, 4vw, 48px); padding: 16px 18px; border: 1px solid var(--filet); border-radius: var(--r-carte); color: var(--encre-2); font-size: var(--t-petit); }
.avertissement .picto { --picto-t: 20px; color: var(--jaune); margin-top: 1px; }

/* ---------- Lieux ---------- */
.lieux { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--gouttiere); }
.lieux > * { grid-column: span 2; }
.lieux > :nth-child(n + 4) { grid-column: span 3; }
.lieux .carte-lieu .photo { aspect-ratio: auto; height: clamp(380px, 34vw, 500px); }
.lieux .carte-lieu-corps { gap: 10px; padding: 26px; }
.lieux .carte-lieu-corps p { max-width: 46ch; }

/* ---------- Déroulé ---------- */
.deroule-pied { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: clamp(40px, 5vw, 64px); padding-top: 28px; border-top: 1px solid var(--filet); }
.deroule-pied p { color: var(--encre-2); }

/* ---------- Photo immersive pleine largeur ---------- */
.immersion { position: relative; display: grid; align-items: end; min-height: clamp(560px, 82vh, 860px); overflow: hidden; background: var(--carbone); color: var(--blanc-tech); isolation: isolate; }
.immersion-photo { position: absolute; inset: 0; z-index: -1; }
.immersion-photo picture, .immersion-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 30% 40%; }
.immersion-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11, 12, 13, .1) 0%, rgba(11, 12, 13, .2) 40%, rgba(11, 12, 13, .88) 78%), linear-gradient(0deg, rgba(11, 12, 13, .75) 0%, rgba(11, 12, 13, 0) 45%); }
.immersion-contenu { display: grid; justify-items: start; gap: 26px; width: 100%; padding-block: clamp(56px, 8vw, 110px); }
.immersion-texte { justify-self: end; display: grid; gap: 24px; max-width: 620px; }
.immersion .titre-2 { --encre: var(--blanc-tech); font-size: clamp(1.5rem, 1.05rem + 1.3vw, 2.3rem); line-height: 1.25; }
.immersion .titre-2 span { display: block; }
.immersion .chapeau { color: #C9CDD1; }
.immersion-cartouche { display: flex; flex-wrap: wrap; gap: 6px 18px; font: 500 10.5px/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--gris-1); }
.immersion-cartouche span::before { content: "■ "; color: var(--jaune); }
@media (prefers-reduced-motion: no-preference) {
  .js .immersion.a-reveler img { transform: scale(1.08); }
  .js .immersion.a-reveler.est-visible img { transform: none; transition: transform 1800ms var(--ease); }
}

/* ---------- Confiance ---------- */
.preuves-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gouttiere); }
.preuve-bloc { display: grid; align-content: start; gap: 14px; padding: 28px; border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.preuve-bloc .preuve-bloc-valeur { font: var(--titre-graisse) clamp(2.6rem, 1.8rem + 2vw, 3.6rem)/1 var(--titre); font-stretch: var(--titre-largeur); color: var(--encre); font-variant-numeric: tabular-nums; }
.preuve-bloc-valeur small { font-size: .45em; color: var(--encre-3); }
.preuve-bloc p:not([class]) { color: var(--encre-2); font-size: var(--t-petit); line-height: 1.55; }
.preuve-bloc .etoiles { color: var(--jaune); letter-spacing: .14em; font-size: 18px; -webkit-text-stroke: .4px #A86F00; }
.preuve-bloc .lien-fleche { justify-self: start; margin-top: 6px; }
.preuve-bloc img.label { width: 220px; height: auto; padding: 10px 14px; border-radius: var(--r-bouton); background: var(--carbone); }
.avis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gouttiere); margin-top: var(--gouttiere); }
.avis blockquote { display: grid; align-content: space-between; gap: 22px; margin: 0; padding: 26px 28px; border-top: 2px solid var(--jaune); background: var(--carte); }
.avis blockquote p { font: 600 clamp(1.1rem, 1rem + .35vw, 1.3rem)/1.35 var(--titre); color: var(--encre); }
.avis footer { font: 500 11px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); }
.logos { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; margin-top: 22px; padding: 0; list-style: none; border-radius: var(--r-carte); overflow: hidden; background: var(--filet); outline: 1px solid var(--filet); }
.logos li { display: grid; place-items: center; padding: 16px; background: var(--blanc); }
.logos img { width: 100%; max-width: 150px; mix-blend-mode: multiply; filter: grayscale(1) contrast(1.05); opacity: .78; transition: filter var(--t-micro) var(--ease), opacity var(--t-micro) var(--ease); }
.logos li:hover img { filter: none; opacity: 1; }

/* ---------- Zone d'intervention ---------- */
.zone { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(32px, 5vw, 88px); align-items: center; }
.zone-departements { display: grid; gap: 0; margin-top: 32px; border-top: 1px solid var(--filet); }
.zone-departements > div { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 6px 18px; padding: 22px 0; border-bottom: 1px solid var(--filet); }
.zone-departements .num { grid-row: span 2; font: var(--titre-graisse) 2.2rem/1 var(--titre); font-stretch: var(--titre-largeur); color: var(--jaune); font-variant-numeric: tabular-nums; }
.zone-departements h3 { font-size: 1.45rem; }
.zone-departements p { color: var(--encre-2); font-size: var(--t-petit); }
.zone-schema { width: 100%; height: auto; }
.zone-schema text { font-family: var(--mono); letter-spacing: .12em; text-transform: uppercase; }

/* ---------- Conversion finale ---------- */
.conversion { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 5vw, 88px); align-items: end; }
.conversion .titre-2 { font-size: clamp(1.5rem, 1.05rem + 1.3vw, 2.3rem); line-height: 1.25; }
.conversion-actions { display: grid; gap: 18px; }
.conversion .chapeau { color: var(--encre); margin-top: 22px; }

/* ---------- Barre d'action mobile (téléphone toujours visible) ---------- */
.barre-mobile { display: none; }
@media (max-width: 899px) {
  /* Barre flottante : fond transparent, boutons posés sur la page avec une ombre portée douce */
  .barre-mobile { position: fixed; left: 0; right: 0; bottom: 0; z-index: 48; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 var(--marge) calc(12px + env(safe-area-inset-bottom, 0px)); background: none; pointer-events: none; }
  .barre-mobile .bouton { min-height: 50px; padding: 0 12px; font-size: 14.5px; pointer-events: auto; box-shadow: 0 10px 28px rgba(11, 12, 13, .32), 0 2px 6px rgba(11, 12, 13, .18); }
  .barre-mobile .bouton--contour { --encre: var(--blanc-tech); background: rgba(11, 12, 13, .92); border-color: rgba(243, 243, 240, .22); color: var(--blanc-tech); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
  body:has(.barre-mobile) { padding-bottom: calc(74px + env(safe-area-inset-bottom, 0px)); }
  body:has(.menu-mobile:not([hidden])) .barre-mobile { display: none; }
}

/* ---------- Responsive des composants de page ---------- */
@media (max-width: 1180px) {
  .specs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .specs > div:nth-child(3n + 1) { padding-left: 0; border-left: 0; }
}
@media (max-width: 1023px) {
  .domaines > *, .domaines > :nth-child(1), .domaines > :nth-child(2) { grid-column: span 6; }
  .domaines > :nth-child(-n + 2) .photo { height: auto; aspect-ratio: 4 / 3; }
  .expertise, .traitement, .zone, .conversion { grid-template-columns: minmax(0, 1fr); }
  .expertise-photo { position: relative; top: 0; aspect-ratio: 16 / 10; }
  .lieux > *, .lieux > :nth-child(n + 4) { grid-column: span 3; }
  .lieux > :last-child { grid-column: 1 / -1; }
  .preuves-grille, .avis { grid-template-columns: minmax(0, 1fr); }
  .logos { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .zone-schema { max-width: 520px; }
}
@media (max-width: 899px) {
  .hero-grille { display: flex; flex-direction: column; min-height: 0; padding: 0; }
  .hero-photo { order: -1; width: 100%; aspect-ratio: 1.5; border-radius: 0; }
  .hero-texte { max-width: none; padding: 28px var(--marge) 36px; }
  .hero .repere span { font-size: 9.5px; padding: 5px 8px; }
  .immersion-texte { justify-self: start; }
  .immersion-photo::after { background: linear-gradient(0deg, rgba(11, 12, 13, .95) 0%, rgba(11, 12, 13, .7) 45%, rgba(11, 12, 13, .1) 80%); }
}
@media (max-width: 599px) {
  .specs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .specs > div:nth-child(3n + 1) { padding-left: 18px; border-left: 1px solid var(--filet-sombre); }
  .specs > div:nth-child(odd) { padding-left: 0; border-left: 0; }
  .domaines > *, .domaines > :nth-child(1), .domaines > :nth-child(2), .lieux > *, .lieux > :nth-child(n + 4) { grid-column: 1 / -1; }
  .lieux .carte-lieu .photo { height: 340px; }
  .sequence li { grid-template-columns: 56px minmax(0, 1fr); }
  .sequence li::before { width: 56px; }
  .logos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero .repere:nth-child(n + 3) { display: none; }
}

/* ---------- Sélecteur de nuisibles (cartes en boucle, inspiré du hero France Dératisation) ----------
   Sans JavaScript : simple piste défilante avec aimantation. Avec : boucle infinie, carte centrale
   mise en avant, voisines assombries (--dim), défilement lent qui s'arrête au survol, au toucher et au focus. */
.selecteur { position: relative; margin-top: clamp(8px, 2vw, 24px); }
.selecteur-piste { --cw: clamp(236px, 19vw, 292px); position: relative; display: flex; gap: clamp(10px, 1.2vw, 16px); margin: 0; padding: 6px calc(50% - var(--cw) / 2) 10px; list-style: none; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.selecteur-piste::-webkit-scrollbar { display: none; }
.selecteur-piste.est-glissant, .selecteur-piste.est-saut { scroll-snap-type: none; scroll-behavior: auto; }
.selecteur-carte { --dim: 0; position: relative; display: grid; flex: 0 0 var(--cw); aspect-ratio: 3 / 4.15; scroll-snap-align: center; overflow: hidden; border-radius: var(--r-carte); background: var(--acier); isolation: isolate; outline: 1px solid var(--filet-sombre); outline-offset: -1px; transition: outline-color var(--t-micro) var(--ease); }
.selecteur-carte picture, .selecteur-carte img { position: absolute; inset: 0; width: 100%; height: 100%; }
.selecteur-carte img { z-index: -2; object-fit: cover; object-position: var(--pos, 50% 50%); transition: transform 900ms var(--ease); }
.selecteur-carte::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(11, 12, 13, .05) 30%, rgba(11, 12, 13, .6) 62%, rgba(11, 12, 13, .94) 100%); }
.selecteur-carte::after { content: ""; position: absolute; inset: 0; z-index: 2; background: var(--carbone); opacity: calc(var(--dim) * .58); pointer-events: none; transition: opacity 200ms linear; }
.selecteur-carte.est-active { outline-color: var(--jaune); }
.selecteur-corps { grid-area: 1 / 1; align-self: end; z-index: 1; display: grid; gap: 6px; padding: 18px; color: var(--blanc-tech); }
.selecteur-num { font: 500 10.5px/1 var(--mono); letter-spacing: .12em; color: var(--gris-1); font-variant-numeric: tabular-nums; }
.selecteur-num::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 1.5px; background: var(--jaune); }
.selecteur-amorce { font: 600 14px/1.3 var(--texte); color: #D9DCDF; }
.selecteur-cta { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 50px; margin-top: 6px; padding: 0 6px 0 16px; border: 1px solid rgba(243, 243, 240, .38); border-radius: var(--r-bouton); background: rgba(11, 12, 13, .35); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: var(--blanc-tech); font: var(--titre-graisse-forte) clamp(.82rem, .76rem + .22vw, .96rem)/1.15 var(--titre); font-stretch: var(--titre-largeur); letter-spacing: .02em; text-transform: uppercase; text-decoration: none; transition: background-color var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease), color var(--t-micro) var(--ease), transform var(--t-micro) var(--ease); }
.selecteur-cta::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.selecteur-fleche { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 4px; background: var(--blanc-tech); color: var(--carbone); font: 500 16px/1 var(--mono); transition: transform var(--t-micro) var(--ease); }
.selecteur-carte.est-active .selecteur-cta { border-color: var(--jaune); background: var(--jaune); color: var(--carbone); -webkit-backdrop-filter: none; backdrop-filter: none; }
.selecteur-carte.est-active .selecteur-fleche { background: var(--carbone); color: var(--jaune); }
.selecteur-cta:focus-visible { outline: 2px solid var(--jaune); outline-offset: 3px; }
@media (hover: hover) {
  .selecteur-carte:hover { outline-color: var(--jaune); }
  .selecteur-carte:hover img { transform: scale(1.04); }
  .selecteur-carte:hover .selecteur-cta { border-color: var(--jaune); }
  .selecteur-carte:hover .selecteur-fleche { transform: translateX(2px); }
}
.selecteur-pied { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 22px; padding-inline: var(--marge); }
.selecteur-bouton { display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 1px solid var(--filet-sombre); border-radius: var(--r-bouton); background: none; color: var(--blanc-tech); font: 500 17px/1 var(--mono); cursor: pointer; transition: border-color var(--t-micro) var(--ease), transform var(--t-micro) var(--ease); }
.selecteur-bouton:hover { border-color: var(--jaune); }
.selecteur-bouton:active { transform: translateY(1px); }
.selecteur-points { display: flex; align-items: center; gap: 0; }
.selecteur-points button { position: relative; width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; transition: width var(--t-trace) var(--ease); }
.selecteur-points button::before { content: ""; position: absolute; left: 5px; right: 5px; top: 50%; height: 3px; margin-top: -1.5px; border-radius: 2px; background: var(--filet-sombre); transition: background-color var(--t-micro) var(--ease); }
.selecteur-points button[aria-current="true"] { width: 40px; }
.selecteur-points button[aria-current="true"]::before { background: var(--jaune); }
.selecteur-compteur { min-width: 54px; font: 500 11px/1 var(--mono); letter-spacing: .1em; color: var(--gris-1); text-align: center; font-variant-numeric: tabular-nums; }
.selecteur-compteur b { color: var(--blanc-tech); font-weight: 600; }
@media (max-width: 899px) {
  .selecteur-piste { --cw: min(56vw, 210px); }
  .selecteur-carte { aspect-ratio: 5 / 6; }
  .selecteur-corps { gap: 4px; padding: 12px; }
  .selecteur-amorce { font-size: 13px; }
  .selecteur-cta { font-size: 15px; }
  .selecteur-cta { min-height: 42px; padding-left: 13px; }
  .selecteur-fleche { width: 34px; height: 34px; }
  .selecteur-pied { gap: 12px; }
  .selecteur-points { display: none; }
}

/* Onglets : sur téléphone, les trois tiennent dans la largeur */
@media (max-width: 599px) {
  .onglet { flex: 1 1 0; min-width: 0; padding-right: 10px; }
  .onglet + .onglet { padding-left: 10px; }
  .onglet + .onglet::after { left: 10px; }
  .onglet-titre { font-size: 1.05rem; }
}

/* ==========================================================================
   Pages internes (services, contact)
   ========================================================================== */

/* ---------- Fil d'Ariane et premier écran de page ---------- */
.ariane { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 0 0 22px; padding: 0; list-style: none; font: 500 11px/1.4 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--gris-2); }
.ariane li + li::before { content: "/"; margin-right: 10px; color: var(--filet-sombre); }
.ariane a { color: var(--gris-1); text-decoration: none; }
.ariane a:hover { color: var(--jaune); }
.ariane [aria-current] { color: var(--blanc-tech); }
.hero--page .hero-grille { min-height: 0; padding-block: clamp(32px, 5vw, 72px); }
.hero--page .titre-1 { font-size: clamp(1.4rem, 1rem + 1vw, 1.95rem); }
.sommaire-page { border-top: 1px solid var(--filet-sombre); background: var(--carbone); }
.sommaire-page ol { display: flex; gap: 0; max-width: 1680px; margin: 0 auto; padding: 0 var(--marge); list-style: none; overflow-x: auto; scrollbar-width: none; counter-reset: sommaire; }
.sommaire-page ol::-webkit-scrollbar { display: none; }
.sommaire-page li { flex: 1 0 auto; counter-increment: sommaire; }
.sommaire-page a { display: flex; align-items: baseline; gap: 10px; padding: 18px 20px 20px 0; font: 600 14px/1.2 var(--texte); color: var(--gris-1); text-decoration: none; white-space: nowrap; transition: color var(--t-micro) var(--ease); }
.sommaire-page li + li a { padding-left: 20px; border-left: 1px solid var(--filet-sombre); }
.sommaire-page a::before { content: counter(sommaire, decimal-leading-zero); font: 500 10.5px/1 var(--mono); letter-spacing: .1em; color: var(--jaune); }
.sommaire-page a:hover { color: var(--blanc-tech); }

/* ---------- Chapitre : titre à gauche, texte à droite ---------- */
.chapitre { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 88px); align-items: start; }
.chapitre .texte p + p { margin-top: 14px; }
.texte-lead { font: 600 clamp(1.15rem, 1rem + .5vw, 1.45rem)/1.4 var(--titre); color: var(--encre); max-width: 40ch; }
.risques { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(40px, 5vw, 64px); }

/* ---------- Fiches espèces ---------- */
.especes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gouttiere); }
.espece { display: grid; align-content: start; gap: 18px; padding: 26px; border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.espece-tete { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.espece-tete .picto { --picto-t: 30px; color: var(--jaune); }
.espece .etiquette { color: var(--encre-3); }
.espece .fiche > div { grid-template-columns: minmax(0, 1fr); gap: 4px; }

/* ---------- Indices ---------- */
.indices { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gouttiere); }
.indice { display: grid; align-content: start; gap: 12px; padding: 24px; border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.indice .picto { --picto-t: 26px; color: var(--jaune); }
.indice h3 { font-size: clamp(1.2rem, 1.05rem + .4vw, 1.45rem); }
.indice p { color: var(--encre-2); font-size: var(--t-petit); line-height: 1.55; }
.indices-note { margin-top: clamp(28px, 4vw, 44px); max-width: 70ch; color: var(--encre-2); }
.indices-note strong { color: var(--encre); }

/* ---------- Encadré ---------- */
.encadre { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; padding: clamp(22px, 3vw, 34px); border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.encadre > .picto { --picto-t: 28px; color: var(--jaune); }
.encadre h3 { margin-bottom: 10px; }
.encadre p + p { margin-top: 10px; }
.encadre p { color: var(--encre-2); }

/* ---------- Méthode d'une page service : étapes détaillées ---------- */
.etapes-detail { display: grid; gap: 0; border-top: 1px solid var(--filet); }
.etape-detail { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(20px, 4vw, 64px); padding-block: clamp(32px, 4vw, 52px); border-bottom: 1px solid var(--filet); }
.etape-detail-tete { display: grid; align-content: start; gap: 10px; }
.etape-detail-tete .sequence-num { color: var(--encre); background: linear-gradient(var(--jaune), var(--jaune)) 0 100% / 100% .14em no-repeat; padding-bottom: .1em; }
.etape-detail-corps > * + * { margin-top: 18px; }
.etape-detail-corps p { color: var(--encre-2); }
.liste-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 24px; margin: 0; padding: 0; list-style: none; }
.liste-points li { position: relative; padding-left: 22px; color: var(--encre); font-size: var(--t-petit); line-height: 1.5; }
.liste-points li::before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; border-radius: 2px; background: var(--jaune); }
.dispositifs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.dispositif { display: grid; grid-template-columns: minmax(150px, 2fr) minmax(0, 5fr); gap: 6px 22px; align-items: start; padding: 20px 22px; border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.dispositif h4 { font: var(--titre-graisse) 1.2rem/1.15 var(--titre); font-stretch: var(--titre-largeur); }
.dispositif p { font-size: var(--t-petit); line-height: 1.55; }

/* ---------- Citation signal ---------- */
.citation-signal { margin: 0; font: var(--titre-graisse) clamp(1.6rem, 1.05rem + 2vw, 3rem)/1.12 var(--titre); font-stretch: var(--titre-largeur); letter-spacing: -.01em; color: var(--carbone); text-wrap: balance; max-width: 22ch; }
.citation-signal-pied { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 12px 28px; align-items: center; justify-content: space-between; }
.citation-signal-pied p { max-width: 56ch; color: var(--encre); }

/* ---------- Lieux par groupe ---------- */
.groupes-lieux { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gouttiere); }
.groupe-lieu { display: grid; align-content: start; gap: 16px; padding-top: 22px; border-top: 2px solid var(--jaune); }
.groupe-lieu ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.groupe-lieu li { padding: 8px 12px; border: 1px solid var(--filet); border-radius: var(--r-tag); font-size: 14px; color: var(--encre); background: var(--carte); }
.immeuble { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(24px, 4vw, 64px); align-items: center; margin-top: clamp(48px, 6vw, 80px); }
.immeuble .photo { aspect-ratio: 16 / 11; }
.immeuble .texte p + p { margin-top: 12px; }

/* ---------- Prix et engagements ---------- */
.prix { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(28px, 5vw, 88px); align-items: start; }
.criteres { counter-reset: critere; margin: 22px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--filet); }
.criteres li { counter-increment: critere; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--filet); color: var(--encre); font-size: 15px; }
.criteres li::before { content: counter(critere, decimal-leading-zero); font: 500 11px/1.9 var(--mono); letter-spacing: .1em; color: var(--encre-3); }
.engagements { display: grid; gap: 22px; padding: clamp(24px, 3vw, 36px); border-radius: var(--r-carte); background: var(--carbone); color: var(--blanc-tech); --encre: var(--blanc-tech); --encre-2: var(--gris-1); --filet: var(--filet-sombre); }
.engagements .liste-points { grid-template-columns: minmax(0, 1fr); }
.engagements .liste-points li { color: var(--blanc-tech); font-size: 15px; }
.engagements .liste-points li::before { content: "✓"; top: 0; width: auto; height: auto; background: none; color: var(--jaune); font-weight: 700; }

/* ---------- Formulaire de demande ---------- */
.contact-grille { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.formulaire { display: grid; gap: clamp(28px, 4vw, 40px); padding: clamp(22px, 3.5vw, 44px); border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.formulaire fieldset { display: grid; gap: 22px; min-width: 0; margin: 0; padding: 0; border: 0; }
.formulaire-etape { display: flex; align-items: baseline; gap: 14px; padding: 0 0 14px; width: 100%; border-bottom: 1px solid var(--filet); font: var(--titre-graisse) clamp(1.35rem, 1.1rem + .7vw, 1.75rem)/1.1 var(--titre); font-stretch: var(--titre-largeur); color: var(--encre); }
.formulaire-etape span { font: 500 11px/1 var(--mono); letter-spacing: .12em; color: var(--jaune); }
.surface--papier .formulaire-etape span, .surface--blanc .formulaire-etape span { color: #A86F00; }
.champs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.champs .champ--large { grid-column: 1 / -1; }
.requis { color: #A86F00; font-weight: 700; }
.choix--cases label { min-height: 44px; padding: 0 14px; font-size: 14px; }
.choix-indicateur { width: 18px; height: 18px; flex: none; border: 1.5px solid var(--bord-bouton); border-radius: 3px; background: var(--fond); transition: background-color var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease); }
.choix label:has(input:checked) .choix-indicateur { border-color: var(--carbone); background: var(--carbone) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFAE00' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 14px no-repeat; }
.choix--radio .choix-indicateur { border-radius: 50%; }
.choix--radio label:has(input:checked) .choix-indicateur { background: var(--fond); box-shadow: inset 0 0 0 4px var(--carbone); }
.saisie-unite { position: relative; }
.saisie-unite .saisie { padding-right: 48px; }
.saisie-unite span { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font: 500 13px/1 var(--mono); color: var(--encre-3); pointer-events: none; }
.pot-de-miel { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.formulaire-envoi { display: grid; gap: 14px; }
.formulaire-envoi .bouton { justify-self: start; min-width: 260px; }
.formulaire-mentions { font-size: 13px; line-height: 1.5; color: var(--encre-3); }
.formulaire-mentions a { color: inherit; }
.formulaire-alerte { padding: 14px 16px; border-radius: var(--r-bouton); border: 1px solid #E5484D; background: rgba(229, 72, 77, .08); color: var(--encre); font-size: 14px; }
.formulaire-merci { display: grid; gap: 14px; padding: clamp(28px, 4vw, 48px); border-radius: var(--r-carte); background: var(--carbone); color: var(--blanc-tech); }
.formulaire-merci h2 { --encre: var(--blanc-tech); font-size: clamp(2rem, 1.4rem + 2vw, 3rem); }
.formulaire-merci p { color: var(--gris-1); max-width: 56ch; }
.contact-aside { position: sticky; top: calc(var(--entete-h) + 24px); display: grid; gap: var(--gouttiere); }
.carte-appel { display: grid; gap: 10px; padding: 26px; border-radius: var(--r-carte); background: var(--jaune); color: var(--carbone); text-decoration: none; }
.carte-appel .etiquette { color: #3B2A00; }
.carte-appel strong { font: var(--titre-graisse) clamp(2rem, 1.6rem + 1.4vw, 2.8rem)/1 var(--titre); font-stretch: var(--titre-largeur); font-variant-numeric: tabular-nums; }
.carte-appel span:last-child { font-size: 14px; }
.carte-appel:hover strong { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; }
.bloc-info { display: grid; gap: 14px; padding: 24px; border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.bloc-info p, .bloc-info li { color: var(--encre-2); font-size: var(--t-petit); line-height: 1.55; }
.bloc-info ol { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; counter-reset: suite; }
.bloc-info ol li { counter-increment: suite; display: grid; grid-template-columns: 30px minmax(0, 1fr); }
.bloc-info ol li::before { content: counter(suite, decimal-leading-zero); font: 500 11px/1.9 var(--mono); color: var(--encre-3); }
.bloc-info strong { color: var(--encre); }

@media (max-width: 1023px) {
  .chapitre, .prix, .contact-grille, .immeuble { grid-template-columns: minmax(0, 1fr); }
  .especes, .dispositifs { grid-template-columns: minmax(0, 1fr); }
  .indices, .groupes-lieux { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .risques { --n: 3; }
  .etape-detail { grid-template-columns: minmax(0, 1fr); }
  .contact-aside { position: static; }
}
@media (max-width: 599px) {
  .indices, .groupes-lieux, .champs, .liste-points { grid-template-columns: minmax(0, 1fr); }
  .risques { grid-template-columns: minmax(0, 1fr); row-gap: 28px; }
  .formulaire-envoi .bouton { justify-self: stretch; min-width: 0; }
  .sommaire-page a { padding-block: 14px 16px; }
}

/* Grille de cartes autoadaptative (liens vers d'autres traitements) */
.grille-cartes { display: grid; gap: var(--gouttiere); grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.dispositif .etiquette { grid-column: 1; }
.dispositif h4 { grid-column: 1; }
.dispositif p { grid-column: 2; grid-row: 1 / span 2; }
@media (max-width: 599px) { .dispositif { grid-template-columns: minmax(0, 1fr); } .dispositif p { grid-column: 1; grid-row: auto; } }

/* ---------- Composants signatures des pages services ---------- */
/* Flux : étapes reliées par une flèche (piste des fourmis, cheminement) */
.flux { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: flux; }
.flux li { position: relative; display: grid; align-content: start; gap: 10px; padding: 22px 28px 22px 0; border-top: 2px solid var(--filet); }
.flux li + li { padding-left: 28px; }
.flux li::before { content: ""; position: absolute; top: -2px; left: 0; width: 100%; height: 2px; background: var(--jaune); transform-origin: 0 50%; }
.flux li:not(:last-child)::after { content: "→"; position: absolute; top: -13px; right: -10px; z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--fond); color: var(--jaune); font: 600 14px/1 var(--mono); }
.flux .picto { --picto-t: 28px; color: var(--jaune); }
.flux h3 { font-size: clamp(1.25rem, 1.05rem + .5vw, 1.55rem); }
.flux p { color: var(--encre-2); font-size: var(--t-petit); }
@media (prefers-reduced-motion: no-preference) {
  .js .flux.a-reveler li::before { transform: scaleX(0); }
  .js .flux.a-reveler.est-visible li::before { transform: none; transition: transform var(--t-trace) var(--ease); }
  .js .flux.a-reveler.est-visible li:nth-child(2)::before { transition-delay: 240ms; }
  .js .flux.a-reveler.est-visible li:nth-child(3)::before { transition-delay: 480ms; }
  .js .flux.a-reveler.est-visible li:nth-child(4)::before { transition-delay: 720ms; }
}

/* Tableau de situations */
.tableau-cadre { overflow-x: auto; border-radius: var(--r-carte); outline: 1px solid var(--filet); outline-offset: -1px; background: var(--carte); }
.tableau { width: 100%; min-width: 680px; border-collapse: collapse; font-size: var(--t-petit); }
.tableau th, .tableau td { padding: 18px 20px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--filet); }
.tableau thead th { font: 500 10.5px/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--encre-3); }
.tableau tbody th { font: var(--titre-graisse) 1.15rem/1.2 var(--titre); font-stretch: var(--titre-largeur); color: var(--encre); width: 22%; }
.tableau td { color: var(--encre-2); line-height: 1.55; }
.tableau tr:last-child > * { border-bottom: 0; }

/* Comparatif deux colonnes (nettoyage / désinfection, avant / après) */
.comparatif { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gouttiere); }
.comparatif > div { display: grid; align-content: start; gap: 16px; padding: clamp(22px, 3vw, 34px); border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.comparatif > div.comparatif-fort { background: var(--carbone); --encre: var(--blanc-tech); --encre-2: var(--gris-1); --encre-3: var(--gris-2); --filet: var(--filet-sombre); color: var(--blanc-tech); outline-color: var(--carbone); }
.comparatif-fort .liste-points li { color: var(--blanc-tech); }
.comparatif h3 { font-size: clamp(1.5rem, 1.2rem + .8vw, 2rem); }
.comparatif p { color: var(--encre-2); }

/* Grille d'insectes (liens vers les pages dédiées) */
.insectes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: var(--gouttiere); }
.insecte { position: relative; display: grid; align-content: start; gap: 12px; padding: 24px; border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; transition: outline-color var(--t-micro) var(--ease); }
.insecte .picto { --picto-t: 30px; color: var(--jaune); }
.insecte h3 { font-size: 1.45rem; }
.insecte h3 a { color: inherit; text-decoration: none; }
.insecte h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.insecte p { color: var(--encre-2); font-size: var(--t-petit); line-height: 1.55; }
.insectes--offres { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.insectes--offres .insecte { gap: 16px; padding: clamp(24px, 3vw, 36px); }
.insectes--offres .liste-points { grid-template-columns: minmax(0, 1fr); }
.insecte .lien-fleche { justify-self: start; margin-top: 4px; border-bottom: 0; }
.insecte:has(a):hover { outline-color: var(--jaune); }
.insecte:not(:has(a)) .lien-fleche { display: none; }

/* Photo + texte côte à côte */
.duo { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.duo .photo { aspect-ratio: 16 / 11; }
.duo .texte > * + * { margin-top: 14px; }

@media (max-width: 1023px) {
  .flux { --n: 2 !important; row-gap: 24px; }
  .flux li:nth-child(odd) { padding-left: 0; }
  .flux li:nth-child(2):not(:last-child)::after { display: none; }
  .duo { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 599px) {
  .flux { --n: 1 !important; }
  .flux li, .flux li + li { padding-left: 0; }
  .flux li:not(:last-child)::after { display: none; }
  .comparatif { grid-template-columns: minmax(0, 1fr); }
}

/* Note sous les critères de prix : déplacement et paiement */
.prix-note { display: flex; gap: 12px; align-items: flex-start; margin-top: 18px; padding: 14px 16px; border-radius: var(--r-bouton); background: var(--jaune-pale); color: var(--encre-claire); font-size: var(--t-petit); line-height: 1.5; }
.prix-note .picto { --picto-t: 20px; color: var(--carbone); margin-top: 1px; }

/* ---------- Pages légales ---------- */
.legal { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(28px, 5vw, 88px); align-items: start; }
.legal-sommaire { position: sticky; top: calc(var(--entete-h) + 24px); display: grid; gap: 14px; padding: 22px; border-radius: var(--r-carte); background: var(--papier); }
.legal-sommaire ol { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.legal-sommaire a { display: block; padding: 7px 10px; border-left: 2px solid transparent; border-radius: 0 var(--r-tag) var(--r-tag) 0; font-size: 14px; line-height: 1.35; color: var(--encre-2); text-decoration: none; transition: color var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease), background-color var(--t-micro) var(--ease); }
.legal-sommaire a:hover { color: var(--encre); border-color: var(--jaune); background: var(--blanc); }
.prose { max-width: 72ch; color: var(--encre-2); font-size: 16px; line-height: 1.7; }
.prose > * + * { margin-top: 14px; }
.prose h2 { margin-top: clamp(40px, 5vw, 56px); padding-top: 18px; border-top: 1px solid var(--filet); font-size: clamp(1.5rem, 1.2rem + .9vw, 2rem); line-height: 1.15; scroll-margin-top: calc(var(--entete-h) + 24px); }
.prose h2:first-child { margin-top: 0; }
.prose h3 { margin-top: 28px; font-size: 1.25rem; }
.prose strong { color: var(--encre); font-weight: 650; }
.prose ul, .prose ol { padding-left: 1.2em; }
.prose li + li { margin-top: 6px; }
.prose li::marker { color: #A86F00; }
.prose a { color: var(--encre); text-decoration: underline; text-decoration-color: var(--jaune); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.prose-contact { margin-top: clamp(40px, 5vw, 56px) !important; padding: 18px 20px; border-radius: var(--r-bouton); background: var(--jaune-pale); color: var(--encre); }
@media (max-width: 1023px) {
  .legal { grid-template-columns: minmax(0, 1fr); }
  .legal-sommaire { position: static; }
}

/* Titres principaux en capitales, comme la signature du logo (« EXPERTS ANTI NUISIBLES ») */
.titre-1, h2, .titre-2 { text-transform: none; letter-spacing: -.02em; } /* titres en minuscules (direction « Structon », 13/10/2026) */
.titre-1 { line-height: 1.15; }
.prose h2, .pied-colonnes h2 { text-transform: none; letter-spacing: normal; }
.pied-colonnes h2 { text-transform: uppercase; letter-spacing: .12em; }

/* ---------- Mots forts en arrière-plan (lettrage géant en dégradé, décoratif) ----------
   <section class="… a-mot-fond"><span class="mot-fond" aria-hidden="true">Valence</span>…</section> */
.a-mot-fond { position: relative; overflow: hidden; isolation: isolate; }
:where(.a-mot-fond > :not(.mot-fond)) { position: relative; z-index: 1; } /* spécificité nulle : un composant positionné (photo plein cadre) garde sa position */
.mot-fond { position: absolute; z-index: 0; left: 50%; bottom: var(--mot-bas, -.1em); transform: translateX(-50%); white-space: nowrap; pointer-events: none; user-select: none;
  font: 800 clamp(4.5rem, 1rem + 16vw, 17rem)/.82 var(--titre); letter-spacing: -.035em; text-transform: uppercase;
  background: linear-gradient(90deg, var(--mot-a) 0%, var(--mot-b) 55%, var(--mot-c) 100%); -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-mask-image: linear-gradient(180deg, #000 20%, rgba(0, 0, 0, .15) 100%); mask-image: linear-gradient(180deg, #000 20%, rgba(0, 0, 0, .15) 100%);
  --mot-a: rgba(243, 243, 240, .1); --mot-b: rgba(243, 243, 240, .045); --mot-c: rgba(255, 174, 0, .16); }
.mot-fond--haut { top: var(--mot-haut, .35em); bottom: auto; }
.surface--papier .mot-fond, .surface--blanc .mot-fond { --mot-a: rgba(11, 12, 13, .07); --mot-b: rgba(11, 12, 13, .03); --mot-c: rgba(255, 174, 0, .28); }
.surface--jaune .mot-fond { --mot-a: rgba(11, 12, 13, .13); --mot-b: rgba(11, 12, 13, .05); --mot-c: rgba(255, 255, 255, .3); }
@media (prefers-reduced-motion: no-preference) {
  .js .a-reveler.a-mot-fond .mot-fond, .js .a-mot-fond.a-reveler .mot-fond { opacity: 0; transform: translate(-50%, .15em); }
  .js .a-mot-fond.est-visible .mot-fond { opacity: 1; transform: translateX(-50%); transition: opacity 1200ms var(--ease), transform 1400ms var(--ease); }
}

/* En-tête : le numéro passe dans le bouton d’appel sous 1320 px pour laisser la place au menu */
@media (max-width: 1320px) { .entete-tel { display: none; } .entete-nav a { padding-inline: 9px; font-size: 14px; } }
@media (max-width: 1040px) and (min-width: 900px) { .entete-nav a { padding-inline: 6px; font-size: 13px; } .entete-logo img { width: 140px; } }
/* 900–980 px : bouton d'en-tête en version courte (« Devis ») pour garder le menu sur une ligne */
@media (max-width: 980px) and (min-width: 900px) { .entete-actions .sur-ordinateur { display: none; } .entete-actions .sur-mobile { display: inline; } }

/* =============================================================================
   FORMULAIRE DE DEVIS ET PAGE CONTACT — repris de sanipure-grenoble.fr (thème 1.18.1, tech.css) le 12/10/2026,
   demande SANIPURE : même présentation, mêmes étapes, mêmes champs obligatoires. Règles copiées telles quelles
   (ordre conservé) ; seules adaptations : polices de Valence et titre H1 au style du site (capitales + ruban).
   ========================================================================== */
.cc { --gris-2: #80868D; }
.contact-formulaire { overflow: hidden; border: 1px solid var(--filet); border-radius: 12px; background: var(--graphite); }
.contact-formulaire::before { content: "Configurateur de devis · 3 étapes · proposition par e-mail"; display: block; padding: 14px 24px; border-bottom: 1px solid var(--filet); font: 500 10.5px/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--gris-2); }
.formulaire-sanipure { padding: clamp(22px, 4vw, 40px); }
.demande { margin: 0; }
.demande-progression { display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-areas: "retour barre" "retour compteur"; gap: 10px 14px; align-items: center; margin-bottom: 30px; }
.demande-retour { grid-area: retour; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 1px solid var(--filet); border-radius: var(--r-bouton); background: transparent; color: var(--blanc-tech); cursor: pointer; transition: border-color var(--t-micro) var(--ease); }
.demande-retour::before { content: "←"; font: 500 16px/1 var(--mono); }
.demande-retour:hover { border-color: var(--jaune); }
.demande-retour[hidden] { display: inline-flex !important; visibility: hidden; }
.demande-barre { grid-area: barre; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 0; padding: 0; list-style: none; }
.demande-barre li { position: relative; height: 4px; overflow: hidden; background: var(--acier); }
.demande-barre li span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.demande-barre li::after { content: ""; position: absolute; inset: 0; width: 0; background: var(--blanc-tech); transition: width 350ms var(--ease); }
.demande-barre li.est-faite::after, .demande-barre li.est-active::after { width: 100%; }
.demande-barre li.est-active::after { background: var(--jaune); }
.demande-compteur { grid-area: compteur; font: 500 11px/1.3 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--gris-2); }
.demande-compteur b { margin-left: 6px; font-weight: 600; color: var(--blanc-tech); }
.demande.est-pret .demande-etape:not(.est-active) { display: none; }
.demande:not(.est-pret) .demande-etape + .demande-etape { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--filet); }
.demande-question { margin: 0 0 6px; font-family: var(--titre); font-weight: 700; font-stretch: 75%; font-size: clamp(1.7rem, 1.3rem + 1vw, 2.3rem); line-height: 1.05; color: var(--blanc-tech); outline: none; }
.demande-question .demande-aide { display: block; margin-top: 8px; font: 400 15px/1.5 var(--texte); color: var(--gris-1); }
.demande-groupe { min-width: 0; margin: 28px 0 0; padding: 0; border: 0; }
.demande-question-petite { margin-bottom: 14px; padding: 0; font: 600 16px/1.35 var(--texte); }
.demande-question-petite .demande-aide { display: inline; margin: 0 0 0 6px; font-size: 13.5px; }
.demande-facultatif { font-weight: 400; color: var(--gris-2); }
.demande-options { display: flex; flex-wrap: wrap; gap: 8px; }
.demande-choix { position: relative; cursor: pointer; }
.demande-choix input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.demande-choix span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid #343940; border-radius: var(--r-bouton); background: var(--carbone); font-size: 15px; font-weight: 500; color: var(--blanc-tech); transition: background-color 200ms var(--ease), border-color 200ms var(--ease), color 200ms var(--ease); }
.demande-choix:hover span { border-color: var(--gris-2); }
.demande-choix input:checked + span { background: var(--jaune); border-color: var(--jaune); color: var(--carbone); font-weight: 700; }
.demande-choix input:focus-visible + span { outline: 2px solid var(--jaune); outline-offset: 2px; }
.demande-champ { margin-top: 24px; }
.demande-champ label { display: block; margin-bottom: 8px; font-size: 14.5px; font-weight: 600; color: var(--blanc-tech); }
.demande-champ input, .demande-champ textarea { width: 100%; min-height: 52px; padding: 0 16px; border: 1px solid #343940; border-radius: var(--r-bouton); background: var(--carbone); color: var(--blanc-tech); font: 400 16px/1.4 var(--texte); outline: none; transition: border-color 200ms var(--ease); }
.demande-champ textarea { min-height: 120px; padding: 14px 16px; resize: vertical; }
.demande-champ input::placeholder, .demande-champ textarea::placeholder { color: #5E646B; }
.demande-champ input:focus, .demande-champ textarea:focus { border-color: var(--jaune); }
.demande-champ input[aria-invalid="true"] { border-color: #FF6961; }
.demande-aide-champ { margin-top: 8px !important; font-size: 13.5px; color: var(--gris-2); }
.demande-champ-chambres-nb, .demande-champ-depuis-nb { max-width: 300px; }
.demande-erreur { margin-top: 8px !important; font-size: 13.5px; color: #FF8A80; }
.demande-erreur:empty { display: none; }
.demande-ligne { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.demande-resume, .demande-offre { margin: 14px 0 0 !important; font-size: 14.5px; color: var(--gris-1); }
.demande-resume strong, .demande-offre strong { color: var(--blanc-tech); }
.demande-modifier { margin-left: 8px; padding: 0; border: 0; background: none; color: var(--blanc-tech); font: 600 14px/1 var(--texte); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.demande-piege { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.demande-echec { display: none; margin: 24px 0 0 !important; padding: 14px 18px; border-left: 3px solid #FF6961; border-radius: var(--r-tag); background: rgba(255, 105, 97, .1); font-size: 14.5px; line-height: 1.5; color: #FFB4AB; }
.demande.est-en-echec .demande-echec { display: block; }
.demande-echec a { color: inherit; font-weight: 700; }
.demande-navigation { margin-top: 32px; }
.demande-bouton { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 54px; margin-top: 28px; padding: 0 24px; border: 0; border-radius: var(--r-bouton); background: var(--jaune); color: var(--carbone); font: 700 16px/1 var(--texte); cursor: pointer; outline: 2px solid transparent; outline-offset: 2px; transition: outline-color var(--t-micro) var(--ease), transform var(--t-micro) var(--ease); }
.demande-bouton::after { content: "→"; font: 500 16px/1 var(--mono); }
.demande-navigation .demande-bouton { margin-top: 0; }
.demande-bouton:hover { outline-color: var(--jaune); }
.demande-bouton:active { transform: translateY(1px); }
.demande-bouton:focus-visible { outline-color: var(--blanc-tech); }
.demande-bouton[disabled] { opacity: .6; cursor: progress; }
.demande-merci { display: none; padding: 24px 0; text-align: center; outline: none; }
.demande-merci:target, .demande-merci.est-visible { display: block; }
.formulaire-sanipure:has(.demande-merci:target) .demande, .formulaire-sanipure.est-envoye .demande { display: none; }
.demande-merci-titre { margin-bottom: 10px !important; font: 700 clamp(1.8rem, 1.4rem + 1vw, 2.4rem)/1.05 var(--titre); font-stretch: 75%; color: var(--blanc-tech); }
.demande-merci-titre::before { content: "✓"; display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 20px; border-radius: var(--r-bouton); background: var(--jaune); color: var(--carbone); font: 600 24px/1 var(--mono); }
.demande-merci-erreur .demande-merci-titre::before { content: "!"; background: rgba(255, 105, 97, .16); color: #FF8A80; }
.demande-merci p:is(:not([class]), [class="wp-block-paragraph"]) { max-width: 440px; margin: 0 auto !important; font-size: 16px; line-height: 1.6; color: var(--gris-1); }
.demande-merci a { color: var(--blanc-tech); font-weight: 600; }
.contact-formulaire { border: 1px solid #23272B; border-radius: 24px; background: #131518; overflow: visible; }
.contact-formulaire::before { display: none; }
.formulaire-sanipure { padding: clamp(20px, 4vw, 44px); }
.demande-progression { grid-template-columns: 40px minmax(0, 1fr); grid-template-areas: "retour barre"; gap: 14px; margin-bottom: 34px; }
.demande-retour { width: 40px; height: 40px; border: 0; border-radius: 50%; background: #1E2125; }
.demande-retour:hover { background: #262A2F; }
.demande-barre { gap: 10px; }
.demande-barre li { height: auto; padding-top: 14px; overflow: visible; background: none; }
.demande-barre li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; border-radius: 99px; background: #262A2E; }
.demande-barre li::after { inset: 0 auto auto 0; height: 4px; border-radius: 99px; }
.demande-barre li span { position: static; display: block; width: auto; height: auto; overflow: visible; clip: auto; font: 600 12.5px/1.2 var(--texte); color: var(--gris-2); transition: color 250ms var(--ease); }
.demande-barre li.est-active span { color: var(--blanc-tech); }
.demande-barre li.est-faite span { color: var(--gris-1); }
.demande-compteur { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.demande-question { font-stretch: 100%; font-size: clamp(1.55rem, 1.25rem + .9vw, 2.05rem); line-height: 1.15; letter-spacing: -.015em; }
.demande-question .demande-aide { margin-top: 10px; font-size: 15.5px; }
.demande-groupe { margin-top: 30px; }
.demande-question-petite { margin-bottom: 12px; font-size: 15.5px; font-weight: 700; letter-spacing: -.005em; }
.demande-options { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.demande-choix { display: block; }
.demande-choix span { display: flex; justify-content: space-between; gap: 12px; width: 100%; min-height: 58px; padding: 10px 14px 10px 18px; border: 1.5px solid transparent; border-radius: 16px; background: #1B1E22; font-size: 15.5px; font-weight: 600; line-height: 1.25; color: var(--blanc-tech); transition: background-color 200ms var(--ease), border-color 200ms var(--ease), transform 150ms var(--ease); }
.demande-choix span::after { content: ""; flex: none; width: 22px; height: 22px; border: 1.5px solid #4A4F56; border-radius: 50%; background: transparent center / 14px no-repeat; transition: background-color 200ms var(--ease), border-color 200ms var(--ease); }
.demande-choix input[type="checkbox"] + span::after { border-radius: 7px; }
.demande-choix:hover span { border-color: #3A3F45; }
.demande-choix:active span { transform: scale(.985); }
.demande-choix input:checked + span { border-color: var(--jaune); background: rgba(255, 174, 0, .09); color: var(--blanc-tech); font-weight: 700; }
.demande-choix input:checked + span::after { border-color: var(--jaune); background-color: var(--jaune); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7' fill='none' stroke='%230B0C0D' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.demande-choix input:focus-visible + span { outline: 2px solid var(--jaune); outline-offset: 2px; }
.demande-options-compactes { display: flex; flex-wrap: wrap; }
.demande-options-compactes .demande-choix span { justify-content: center; min-width: 64px; min-height: 52px; padding: 0 18px; text-align: center; white-space: nowrap; }
.demande-options-compactes .demande-choix span::after { display: none; }
.demande-options-compactes .demande-choix input:checked + span { background: var(--jaune); color: var(--carbone); }
.demande-champ { margin-top: 26px; }
.demande-champ label { font-size: 15px; font-weight: 700; }
.demande-champ input, .demande-champ textarea { min-height: 58px; padding: 0 18px; border: 1.5px solid transparent; border-radius: 16px; background: #1B1E22; font-size: 16.5px; transition: border-color 200ms var(--ease), background-color 200ms var(--ease); }
.demande-champ textarea { min-height: 130px; padding: 16px 18px; }
.demande-champ input:hover, .demande-champ textarea:hover { border-color: #3A3F45; }
.demande-champ input:focus, .demande-champ textarea:focus { border-color: var(--jaune); background: #101214; }
.demande-champ input::placeholder, .demande-champ textarea::placeholder { color: #6A7078; }
.demande-champ input[aria-invalid="true"] { border-color: #FF6961; background: rgba(255, 105, 97, .06); }
.demande-resume:not([hidden]), .demande-offre:not([hidden]) { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 12px 16px; border-radius: 14px; background: #1B1E22; }
.demande-modifier { margin-left: auto; color: var(--jaune); text-decoration: none; }
.demande-navigation { position: sticky; bottom: 14px; z-index: 3; margin-top: 34px; }
.demande-bouton { min-height: 58px; border-radius: 16px; font-size: 17px; letter-spacing: -.005em; }
.demande-echec { border-left: 0; border-radius: 14px; }
.demande-merci-titre::before { border-radius: 50%; }
@media (max-width: 599px) {
  .contact-formulaire { border-radius: 20px; }
  .formulaire-sanipure { padding: 20px 16px 22px; }
  .demande-options { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .demande-choix span { min-height: 56px; padding: 10px 12px 10px 14px; font-size: 15px; }
  .demande-barre li span { font-size: 11.5px; }
}
.contact-formulaire { border-color: #FFFFFF; background: #FFFFFF; color: var(--carbone); }
.contact-formulaire .demande-question, .contact-formulaire .demande-question-petite, .contact-formulaire .demande-champ label, .contact-formulaire .demande-merci-titre { color: var(--carbone); }
.contact-formulaire .demande-question .demande-aide, .contact-formulaire .demande-aide-champ, .contact-formulaire .demande-facultatif, .contact-formulaire .demande-question-petite .demande-aide { color: #6B7178; }
.contact-formulaire .demande-retour { background: #F0F0EC; color: var(--carbone); }
.contact-formulaire .demande-retour:hover { background: #E4E4DF; }
.contact-formulaire .demande-barre li::before { background: #E4E4DF; }
.contact-formulaire .demande-barre li::after { background: var(--carbone); }
.contact-formulaire .demande-barre li.est-active::after { background: var(--jaune); }
.contact-formulaire .demande-barre li span { color: #8A9097; }
.contact-formulaire .demande-barre li.est-active span { color: var(--carbone); }
.contact-formulaire .demande-barre li.est-faite span { color: #454A50; }
.contact-formulaire .demande-choix span { background: #F2F2EF; color: var(--carbone); }
.contact-formulaire .demande-choix span::after { border-color: #B4B6B1; background-color: #FFFFFF; }
.contact-formulaire .demande-choix:hover span { border-color: #C9CBC6; }
.contact-formulaire .demande-choix input:checked + span { border-color: var(--jaune); background: #FFF6E0; color: var(--carbone); }
.contact-formulaire .demande-choix input:checked + span::after { border-color: var(--jaune); background-color: var(--jaune); }
.contact-formulaire .demande-options-compactes .demande-choix input:checked + span { background: var(--jaune); }
.contact-formulaire .demande-choix input:focus-visible + span { outline-color: var(--carbone); }
.contact-formulaire .demande-champ input, .contact-formulaire .demande-champ textarea { background: #F2F2EF; color: var(--carbone); }
.contact-formulaire .demande-champ input:hover, .contact-formulaire .demande-champ textarea:hover { border-color: #C9CBC6; }
.contact-formulaire .demande-champ input:focus, .contact-formulaire .demande-champ textarea:focus { border-color: var(--jaune); background: #FFFFFF; }
.contact-formulaire .demande-champ input::placeholder, .contact-formulaire .demande-champ textarea::placeholder { color: #8A9097; }
.contact-formulaire .demande-champ input[aria-invalid="true"] { border-color: #C4321C; background: #FFF1EE; }
.contact-formulaire .demande-erreur { color: #B3261E; }
.contact-formulaire .demande-resume, .contact-formulaire .demande-offre { background: #F2F2EF; color: #454A50; }
.contact-formulaire .demande-resume strong, .contact-formulaire .demande-offre strong { color: var(--carbone); }
.contact-formulaire .demande-modifier { color: var(--carbone); text-decoration: underline; text-underline-offset: 3px; }
.contact-formulaire .demande-echec { background: #FFF1EE; color: #8C1D18; }
.contact-formulaire .demande-bouton:focus-visible { outline-color: var(--carbone); }
.contact-formulaire .demande-merci p:is(:not([class]), [class="wp-block-paragraph"]) { color: #454A50; }
.contact-formulaire .demande-merci a { color: var(--carbone); }
@media (max-width: 599px) {
  .demande-ligne { grid-template-columns: minmax(0, 1fr); }
  .contact-formulaire::before { padding: 12px 18px; }
  .formulaire-sanipure { padding: 22px 18px; }
  .demande-choix span { min-height: 42px; padding: 0 14px; font-size: 14.5px; }
}
:is(.btn > .wp-block-button__link, .tw-bouton, .demande-bouton) { --bloc: var(--jaune); outline: 0 !important; box-shadow: 0 0 0 0 var(--bloc); transition: transform 90ms linear, box-shadow 90ms linear, border-color 90ms linear; }
:is(.btn-jaune > .wp-block-button__link, .tw-bouton-jaune, .demande-bouton) { --bloc: var(--encre, var(--blanc-tech)); }
.contact-formulaire .demande-bouton { --bloc: var(--carbone); }
:is(.btn > .wp-block-button__link, .tw-bouton, .demande-bouton):hover { transform: translate(-4px, -4px); box-shadow: 4px 4px 0 0 var(--bloc); }
:is(.btn > .wp-block-button__link, .tw-bouton, .demande-bouton):active { transform: translate(0, 0); box-shadow: 0 0 0 0 var(--bloc); transition-duration: 40ms; }
:is(.btn-fleche > .wp-block-button__link, .tw-bouton-fleche, .demande-bouton)::after { transition: transform 90ms steps(2, end); }
:is(.btn-fleche > .wp-block-button__link, .tw-bouton-fleche, .demande-bouton):hover::after { transform: translateX(5px); }
:is(.btn > .wp-block-button__link, .tw-bouton, .demande-bouton):focus-visible { outline: 2px solid var(--jaune) !important; outline-offset: 3px; }
@media (hover: none) {
  :is(.btn > .wp-block-button__link, .tw-bouton, .demande-bouton):hover { transform: none; box-shadow: 0 0 0 0 var(--bloc); }
}
@media (prefers-reduced-motion: reduce) {
  :is(.btn > .wp-block-button__link, .tw-bouton, .demande-bouton) { transition: none; }
  :is(.btn > .wp-block-button__link, .tw-bouton, .demande-bouton):hover { transform: none; box-shadow: 0 0 0 2px var(--bloc); }
  :is(.btn-fleche > .wp-block-button__link, .tw-bouton-fleche, .demande-bouton):hover::after { transform: none; }
}
.demande-bouton { min-height: 50px; font-weight: 600; font-size: 15.5px; letter-spacing: .01em; }
.cc { --fond: #F5F5F7; --encre: #1D1D1F; --encre-2: #6E6E73; --encre-3: #86868B; --filet: #D2D2D7; --carte: #FFFFFF; --bord-bouton: #B4B6B1; background: var(--fond); color: var(--encre-2); }
.cc-page { padding: clamp(40px, 6vw, 92px) 0 clamp(56px, 7vw, 110px); }
.cc-centre { max-width: 780px; margin: 0 auto; text-align: center; }
.cc-tete { margin: 0 auto; }
.cc .chapeau { max-width: 40ch; margin: 16px auto 0 !important; font-size: clamp(16px, 1rem + .25vw, 19px); line-height: 1.5; color: var(--encre-2); }
.cc-carte { margin-top: clamp(28px, 4vw, 44px); overflow: hidden; border-radius: 28px; background: #FFFFFF; text-align: left; box-shadow: 0 1px 2px rgba(0, 0, 0, .03), 0 28px 64px -36px rgba(0, 0, 0, .22); }
.cc .contact-formulaire { border: 0; border-radius: 0; background: #FFFFFF; box-shadow: none; }
.cc .formulaire-sanipure { padding: clamp(22px, 3.4vw, 44px); }
.cc .demande-progression { margin-bottom: 28px; }
.cc-suite { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 28px 48px; align-items: start; margin-top: clamp(32px, 4vw, 48px); padding: clamp(24px, 3vw, 34px) clamp(22px, 3vw, 40px); border-radius: 24px; background: #FFFFFF; text-align: left; }
.cc-etapes { position: relative; display: grid; gap: 20px; margin: 0; padding: 0; list-style: none; counter-reset: etape; }
.cc-etapes::before { content: ""; position: absolute; left: 15px; top: 16px; bottom: 16px; width: 1px; background: var(--filet); }
.cc-etapes li { position: relative; min-height: 32px; padding: 4px 0 0 46px; font-size: 14.5px; line-height: 1.5; color: var(--encre-2); counter-increment: etape; }
.cc-etapes li::before { content: counter(etape, decimal-leading-zero); position: absolute; left: 0; top: 0; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; box-sizing: border-box; border: 1px solid var(--filet); border-radius: 50%; background: #FFFFFF; font: 500 10.5px/1 var(--mono); letter-spacing: .04em; color: var(--encre); }
.cc-etapes li:first-child::before { border-color: var(--jaune); background: var(--jaune); color: var(--carbone); }
.cc-etapes strong { display: block; margin-bottom: 2px; font-family: var(--titre); font-stretch: 100%; font-size: 16px; font-weight: 600; letter-spacing: -.01em; color: var(--encre); }
.cc-garanties { display: grid; gap: 14px; margin: 0 !important; padding: 0 0 0 48px; border-left: 1px solid var(--filet); list-style: none; }
.cc-garanties li { position: relative; padding-left: 30px; font-family: var(--titre); font-stretch: 100%; font-size: 15.5px; font-weight: 500; line-height: 1.45; letter-spacing: -.005em; color: var(--encre); }
.cc-garanties li::before { content: ""; position: absolute; left: 0; top: 1px; width: 19px; height: 19px; border-radius: 50%; background: #FFF1CC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5.2 9.3l2.4 2.4 5.2-5.4' fill='none' stroke='%23111214' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 19px no-repeat; }
.cc-autre { margin-top: 26px !important; font-size: 14.5px; line-height: 1.6; color: var(--encre-2); }
.cc-autre a { color: var(--encre); font-weight: 600; text-decoration: none; }
.cc-autre a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cc .formulaire-rgpd { margin: 18px auto 0 !important; font-size: 12px; color: var(--encre-2); }
.cc .formulaire-rgpd a { color: var(--encre-2); }
@media (max-width: 767px) {
  .cc-suite { grid-template-columns: minmax(0, 1fr); }
  .cc-garanties { padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--filet); }
}
@media (max-width: 599px) {
  .cc-page { padding-top: 28px; }
  .cc-suite { margin-top: 22px; padding: 22px 18px; border-radius: 20px; }
  .cc .chapeau { margin-top: 10px !important; font-size: 15.5px; }
  .cc-carte { margin-top: 22px; border-radius: 22px; }
  .cc .formulaire-sanipure { padding: 20px 16px 22px; }
}
.formulaire-sanipure > p:empty { display: none; }
/* Valence : H1 au style du site sur fond clair */
.cc .titre-1 { max-width: 24ch; margin: 0 auto; color: var(--encre); }
.cc .titre-1 em { color: var(--carbone); padding: .05em .16em; background: linear-gradient(var(--jaune), var(--jaune)) 0 50% / 100% 100% no-repeat; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.cc .demande-merci .etiquette { margin-top: 14px; color: var(--encre-3); }

/* =============================================================================
   PAGES TERRITORIALES ET HUBS (lot A SEO/GEO, 12/10/2026) : chiffres INSEE, secteurs, liens entre communes,
   sous-menu « Autres traitements », section de devis intégrée.
   ========================================================================== */
.groupes-lieux--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.groupes-lieux--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.groupes-lieux--textes .groupe-lieu p { color: var(--encre-2); line-height: 1.6; }
.groupes-lieux--textes .groupe-lieu h3 { color: var(--encre); }
.groupes-lieux--textes .groupe-lieu h3 a { color: inherit; text-decoration: underline; text-decoration-color: var(--jaune); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.groupes-lieux--textes .groupe-lieu h3 a:hover { text-decoration-color: currentColor; }
.chiffres-cles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: clamp(28px, 4vw, 48px) 0 0; border-top: 1px solid var(--filet); }
.chiffres-cles > div { display: grid; align-content: start; gap: 6px; padding: 22px 22px 22px 0; border-bottom: 1px solid var(--filet); }
.chiffres-cles > div + div { padding-left: 22px; border-left: 1px solid var(--filet); }
.chiffres-cles dt { font: 500 var(--t-etiquette)/1.3 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--encre-2); }
.chiffres-cles dd { margin: 0; font: var(--titre-graisse) clamp(1.9rem, 1.4rem + 1.4vw, 2.8rem)/1 var(--titre); color: var(--encre); font-variant-numeric: tabular-nums; }
.chiffres-cles p { font-size: 14px; line-height: 1.5; color: var(--encre-2); }
.source { margin-top: 18px; font: 500 12px/1.5 var(--mono); letter-spacing: .02em; color: var(--encre-3); }
.encadre-texte { max-width: 80ch; margin-top: clamp(24px, 3vw, 36px); padding: 18px 22px; border-left: 3px solid var(--jaune); background: var(--carte); color: var(--encre-2); line-height: 1.65; }
.encadre-texte .lien-fleche { margin-left: 6px; }
.secteurs { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--gouttiere); }
.secteur { padding-top: 18px; border-top: 2px solid var(--jaune); }
.secteur h3 { margin-bottom: 12px; color: var(--encre); }
.secteur ul { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.secteur li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--filet); color: var(--encre); }
.secteur li > span:last-child, .secteur-liens { font-size: 13px; color: var(--encre-2); text-align: right; }
.secteur a, .liens-communes a, .liens-croises a { color: var(--encre); text-decoration: underline; text-decoration-color: var(--jaune); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.secteur a:hover, .liens-communes a:hover, .liens-croises a:hover { text-decoration-color: currentColor; }
.liens-communes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--filet); }
.liens-communes li { display: flex; justify-content: space-between; gap: 10px; padding: 16px 18px 16px 0; border-bottom: 1px solid var(--filet); font-weight: 600; color: var(--encre); }
.liens-communes li span:last-child { font: 500 12px/1.4 var(--mono); color: var(--encre-2); }
.liens-croises { margin-top: clamp(28px, 4vw, 44px); }
.liens-croises ul { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 12px 0 0; padding: 0; list-style: none; }
.liens-croises li { color: var(--encre-2); }
.etapes-detail--compact .etape-detail { grid-template-columns: minmax(0, 1fr); gap: 10px; padding-block: 22px; }
.cc-section { padding: clamp(56px, 7vw, 110px) 0; }
.cc-section h2 { color: var(--encre); }
.cc-section .surtitre { justify-content: center; }
.cc-garanties--ligne { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px; margin-top: clamp(24px, 3vw, 36px) !important; padding: 0; border: 0; }
.entete-sous-menu { position: relative; }
.entete-sous-menu summary { list-style: none; cursor: pointer; white-space: nowrap; padding: 10px 12px; font: 600 14.5px/1 var(--texte); color: var(--gris-1); }
.entete-sous-menu summary::-webkit-details-marker { display: none; }
.entete-sous-menu summary::after { content: " ▾"; font-size: 11px; }
.entete-sous-menu[open] summary, .entete-sous-menu summary:hover { color: var(--blanc-tech); }
.entete-sous-menu > div { position: absolute; top: calc(100% + 8px); left: 0; z-index: 20; display: grid; min-width: 220px; padding: 8px; border: 1px solid var(--filet-sombre); border-radius: 8px; background: var(--graphite); box-shadow: 0 18px 40px -20px rgba(0, 0, 0, .6); }
.entete-sous-menu > div a { padding: 10px 12px; }
@media (max-width: 1023px) {
  .chiffres-cles, .liens-communes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .chiffres-cles > div:nth-child(odd) { padding-left: 0; border-left: 0; }
  .groupes-lieux--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599px) {
  .chiffres-cles, .liens-communes, .groupes-lieux--3, .groupes-lieux--2 { grid-template-columns: minmax(0, 1fr); }
  .chiffres-cles > div { padding-left: 0 !important; border-left: 0 !important; }
}
/* Menu complet (7 entrées, décision du 12/10/2026) : téléphone masqué sous 1500 px, espacement réduit, menu repliable sous 1200 px */
@media (max-width: 1499px) { .entete--complet .entete-tel { display: none; } }
@media (max-width: 1399px) { .entete--complet .entete-nav a, .entete--complet .entete-sous-menu summary { padding-inline: 8px; font-size: 14px; } .entete--complet .entete-nav { gap: 0; } }
@media (max-width: 1199px) {
  .entete--complet .entete-nav { display: none; }
  .entete--complet .entete-actions { margin-left: auto; }
  .entete--complet .entete-menu { display: block; }
}
@media (max-width: 1279px) and (min-width: 1200px) { .entete--complet .entete-nav a, .entete--complet .entete-sous-menu summary { padding-inline: 6px; font-size: 13.5px; } .entete--complet .entete-logo img { width: 150px; } .entete--complet .entete-barre { gap: 14px; } }

/* Photo d'illustration sous le titre d'un chapitre (pages nuisibles et départementales) */
.chapitre-photo { margin-top: clamp(24px, 3vw, 36px); aspect-ratio: 3 / 2; max-width: 100%; }
.chapitre-photo img { width: 100%; height: 100%; object-fit: cover; }
.bandeau-photo { margin-top: clamp(32px, 4vw, 48px); aspect-ratio: 21 / 9; max-width: 100%; }
@media (max-width: 767px) { .bandeau-photo { aspect-ratio: 4 / 3; } }

/* Guides (lot F) : colonne de lecture */
.guide { max-width: 760px; margin-inline: auto; display: grid; gap: clamp(36px, 5vw, 56px); }
.guide-essentiel .titre-encadre { font-size: 1.3rem; margin-bottom: 14px; }
.guide-essentiel .liste-points { grid-template-columns: minmax(0, 1fr); }
.guide-partie { display: grid; gap: 16px; }
.guide-partie h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); }
.guide-partie p { color: var(--encre-2); line-height: 1.75; }
.guide-partie .liste-points { grid-template-columns: minmax(0, 1fr); margin-top: 4px; }
.guide-liens { margin-top: 0; }
.guide-date { color: var(--encre-2); font: 500 12px/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; }

/* Mobile : petits textes agrandis et cibles tactiles plus grandes (contrôle mobile du 13/10/2026) */
@media (max-width: 767px) {
  :root { --t-etiquette: 12px; }
  .surtitre { font-size: 12px; letter-spacing: .14em; }
  .hero-notes { font-size: 12px; }
  .ariane { gap: 0 8px; margin-top: -8px; font-size: 12px; }
  .ariane li { display: inline-flex; align-items: center; min-height: 40px; }
  .ariane a { display: inline-flex; align-items: center; min-height: 40px; }
  .demande-compteur, .demande-numero { font-size: 12px; }
  .demande-modifier { display: inline-flex; align-items: center; min-height: 44px; padding-inline: 10px; margin-block: -12px; }
  .photo-legende { font-size: 11px; }
  .repere span { font-size: 11px; }
  .specs dt, .selecteur-num, .selecteur-compteur, .immersion-cartouche, .regle-graduations span, .demande-barre span, .pied-bas, .pied-bas a { font-size: 12px; }
  .avis footer { font-size: 12px; }
  .entete-logo { padding-block: 9px; margin-block: -9px; }
}

/* Très petits écrans (320 à 359 px) : l'en-tête tient sur une ligne (contrôle mobile du 13/10/2026) */
@media (max-width: 359px) {
  .entete-logo img { width: 118px; }
  .entete-actions { gap: 6px; }
  .entete-actions .bouton--jaune { padding: 0 10px; letter-spacing: .06em; }
  .entete-actions .bouton--jaune::after { display: none; }
  .entete-menu { width: 42px; height: 42px; }
}

/* =====================================================================================
   Direction inspirée de « Structon » (Dribbble, 13/10/2026) : bandeau d'infos, boutons pilule,
   premier écran pleine largeur à titre bicolore, bande de services inclinée.
   ===================================================================================== */

/* Bandeau d'informations au-dessus de l'en-tête */
.bandeau-infos { display: flex; justify-content: center; align-items: center; gap: clamp(18px, 3vw, 44px); min-height: 40px; padding: 6px var(--marge); background: #FFAE00; color: var(--carbone); font: 600 13.5px/1.3 var(--texte); }
.bandeau-infos p { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.bandeau-infos a { display: inline-flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; }
.bandeau-infos a:hover { text-decoration: underline; text-underline-offset: 3px; }
.bandeau-infos .picto { --picto-t: 16px; color: var(--carbone); }
@media (max-width: 767px) { .bandeau-infos { gap: 16px; font-size: 12.5px; white-space: nowrap; } .bandeau-infos-option, .bandeau-infos-rdv { display: none !important; } }
@media (max-width: 359px) { .bandeau-infos p:first-child { display: none; } }

/* Boutons pilule, flèche dans une pastille */
.bouton { border-radius: 999px; }
.bouton--fleche { padding-right: 6px; gap: 14px; }
.bouton--fleche::after { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--carbone); color: var(--jaune); font-size: 16px; }
.bouton--contour.bouton--fleche::after { background: transparent; color: currentColor; width: 30px; }
.bouton--petit.bouton--fleche { padding-right: 4px; }
.bouton--petit.bouton--fleche::after { width: 30px; height: 30px; font-size: 14px; }
.surface--jaune .bouton--jaune.bouton--fleche::after, .bouton--noir.bouton--fleche::after { background: var(--jaune); color: var(--carbone); }

/* Premier écran pleine largeur */
.hero--plein { position: relative; isolation: isolate; overflow: hidden; display: grid; align-content: end; min-height: min(calc(100svh - var(--entete-h) - 40px), 860px); padding-bottom: clamp(96px, 10vw, 132px); background: var(--carbone); }
.hero-fond { position: absolute; inset: 0; z-index: -2; margin: 0; }
.hero-fond picture, .hero-fond img { width: 100%; height: 100%; }
.hero-fond img { object-fit: cover; filter: brightness(.72) saturate(.85); }
.hero--plein::before { content: ""; position: absolute; inset: 0; z-index: -1; background:
  linear-gradient(90deg, rgba(11, 12, 13, .96) 0%, rgba(11, 12, 13, .9) 34%, rgba(11, 12, 13, .62) 56%, rgba(11, 12, 13, .2) 82%, rgba(11, 12, 13, .1) 100%),
  linear-gradient(0deg, rgba(11, 12, 13, .85) 0%, rgba(11, 12, 13, 0) 45%); }
.hero-plein-contenu { width: 100%; max-width: 1680px; margin-inline: auto; padding: clamp(56px, 8vw, 120px) var(--marge) 0; }
.hero-confiance { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 22px; padding: 8px 14px; border: 1px solid rgba(243, 243, 240, .22); border-radius: 999px; background: rgba(11, 12, 13, .45); color: var(--blanc-tech); font: 500 14px/1.2 var(--texte); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.hero-etoiles { color: var(--jaune); letter-spacing: .08em; }
.hero-confiance-google { display: inline-flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; }
.hero-confiance-google:hover span:last-child { text-decoration: underline; text-underline-offset: 3px; }
.hero-confiance-google img { width: 20px; height: 20px; }
.hero-confiance-sep { align-self: stretch; width: 1px; margin-inline: 4px; background: rgba(243, 243, 240, .25); }
.hero-confiance-certibiocide { width: auto; height: 26px; }
.hero-titre { max-width: 21ch; margin: 0; font-family: var(--titre); font-weight: var(--titre-graisse); font-stretch: var(--titre-largeur); font-size: clamp(40px, 4.7vw, 78px); line-height: 1; letter-spacing: -.025em; color: var(--blanc-tech); text-transform: none; text-wrap: balance; }
.hero-titre-jaune { display: block; color: var(--jaune); }
.hero--plein .hero-desc { max-width: 58ch; margin-top: 26px; color: #D9DCDF; }
.hero--plein .groupe-boutons { margin-top: 32px; }
.hero--plein .bouton--contour { border-color: rgba(243, 243, 240, .55); color: var(--blanc-tech); }

/* Bande de services inclinée, défilante */
.bande-services { position: absolute; left: -2%; right: -2%; bottom: 26px; overflow: hidden; padding-block: 16px; background: #FFAE00; transform: rotate(-1.6deg); box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.bande-piste { display: flex; width: max-content; animation: bande-defile 38s linear infinite; }
.bande-piste span { display: inline-flex; align-items: center; gap: 26px; padding-right: 26px; font: 700 clamp(18px, 2vw, 26px)/1 var(--titre); letter-spacing: -.01em; color: var(--carbone); white-space: nowrap; }
.bande-piste span::before { content: "//"; font-style: italic; font-weight: 800; letter-spacing: -.12em; color: var(--carbone); }
@keyframes bande-defile { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .bande-piste { animation: none; } }
.hero-suite { background: var(--carbone); }

@media (max-width: 899px) {
  .hero--plein { min-height: auto; padding-bottom: 104px; }
  .hero--plein::before { background: linear-gradient(0deg, rgba(11, 12, 13, .96) 0%, rgba(11, 12, 13, .86) 55%, rgba(11, 12, 13, .55) 100%); }
  .hero-plein-contenu { padding-top: 64px; }
  .hero-titre { font-size: clamp(36px, 10vw, 54px); }
  .hero--plein .groupe-boutons { flex-direction: column; align-items: stretch; }
  .bande-services { bottom: 22px; padding-block: 12px; }
}

/* Titres en minuscules : sur fond sombre, la partie en <em> passe en jaune (sans ruban) ; le ruban reste sur fond clair */
h2, .titre-2 { line-height: 1.22; }
:is(.surface:not(.surface--papier):not(.surface--blanc):not(.surface--jaune), .surface--graphite) :is(h2, .titre-2) em { padding: 0; background: none; color: var(--jaune); }
.surface--jaune :is(h2, .titre-2) em { padding: 0; background: none; color: var(--carbone); text-decoration: underline; text-decoration-thickness: .08em; text-underline-offset: .12em; }

/* Premier écran pleine largeur des pages de contenu */
.hero--page.hero--plein { min-height: min(calc(86svh - var(--entete-h)), 780px); }
.hero--plein .hero-titre em { display: block; font-style: normal; color: var(--jaune); }
.hero--plein .ariane { margin-bottom: 20px; }
.hero--plein .ariane a { color: #C9CDD1; }
.hero--plein .hero-notes { margin-top: 20px; color: #C9CDD1; }
.hero--page .hero-titre { font-size: clamp(36px, 4.2vw, 68px); max-width: 22ch; }
.sommaire-page--plein { position: relative; z-index: 1; }
@media (max-width: 899px) {
  .hero--page.hero--plein { min-height: auto; }
  .hero--page .hero-titre { font-size: clamp(32px, 8.6vw, 46px); }
  .hero-confiance { flex-wrap: nowrap; gap: 8px; max-width: 100%; padding: 6px 12px 6px 10px; font-size: 13.5px; }
  .hero-confiance-google { gap: 6px; white-space: nowrap; }
  .hero-confiance-google img { width: 18px; height: 18px; }
  .hero-etoiles { font-size: 12px; letter-spacing: .02em; }
  .hero-confiance-libelle { display: none; }
  .hero-confiance-sep { align-self: center; height: 18px; margin-inline: 2px; }
  .hero-confiance-certibiocide { height: 20px; }
}
@media (max-width: 359px) { .hero-etoiles { display: none; } .barre-mobile .bouton { gap: 8px; padding-inline: 12px 4px; font-size: 14px; white-space: nowrap; } .barre-mobile .bouton--fleche::after { width: 32px; height: 32px; } }

/* En-tête mobile : bouton « Devis » et bouton menu assortis (pastilles de même hauteur, 13/10/2026) */
@media (max-width: 1199px) {
  .entete-menu { width: 40px; height: 40px; border-radius: 50%; border-color: rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .06);
    transition: background-color var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease); }
  .entete-menu:hover, .entete-menu[aria-expanded="true"] { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .24); }
  .entete-menu span { width: 16px; height: 2px; margin: 4px auto; border-radius: 2px; }
  .entete-menu span:nth-child(2) { width: 10px; margin-right: calc(50% - 8px); }
  .entete-menu[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .entete-menu[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
}
@media (max-width: 899px) {
  .entete-actions { gap: 8px; }
  .entete-actions .bouton--jaune { min-height: 40px; gap: 10px; padding: 0 5px 0 16px; font: 700 14px/1 var(--titre); letter-spacing: .01em; text-transform: none;
    box-shadow: 0 6px 18px rgba(255, 174, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .35); }
  .entete-actions .bouton--jaune::after { display: inline-grid; width: 30px; height: 30px; font-size: 15px; }
}
@media (max-width: 359px) {
  .entete-actions { gap: 6px; }
  .entete-actions .bouton--jaune { gap: 8px; padding: 0 4px 0 12px; font-size: 13.5px; }
  .entete-actions .bouton--jaune::after { width: 28px; height: 28px; }
  .entete-menu { width: 38px; height: 38px; }
}

/* Pilule de confiance : cinq étoiles dorées en SVG (dégradé or), visibles à toutes les largeurs (13/10/2026) */
.hero-etoiles { height: 15px; }
@media (max-width: 899px) { .hero-etoiles { height: 13px; } }
@media (max-width: 359px) { .hero-etoiles { display: block; height: 11px; } .hero-confiance { gap: 6px; padding-inline: 10px 10px; } .hero-confiance-certibiocide { height: 18px; } }

/* H1 plus fins et plus petits, rendu plus premium (demande SANIPURE du 13/10/2026) : graisse 500 au lieu de 700 */
h1.titre-1, .hero-titre { font-weight: 400; letter-spacing: -.025em; }
.hero-titre { font-size: clamp(34px, 3.8vw, 62px); line-height: 1.04; }
.hero--page .hero-titre { font-size: clamp(30px, 3.3vw, 54px); }
@media (max-width: 899px) {
  .hero-titre { font-size: clamp(30px, 8.4vw, 44px); }
  .hero--page .hero-titre { font-size: clamp(27px, 7.4vw, 38px); }
}

/* Étoiles d'avis partout (pilule, preuves, avis) : SVG partagé, jaune uni des étoiles Google #FBBC04 (13/10/2026) */
.etoiles-or { display: block; flex: none; width: auto; height: 15px; fill: #FBBC04; filter: none; }
.preuve-etoiles { height: 14px; }
.preuve-bloc .etoiles { height: 20px; margin-bottom: 4px; }
.avis footer { display: grid; justify-items: start; gap: 8px; }
.avis-etoiles { height: 13px; }

/* Logo Certibiocide sur fond transparent dans les cartes claires (variante texte noir, agree-certibiocide-fond-clair.png, 13/10/2026) */
.preuve-bloc img.label { width: 240px; padding: 0; border-radius: 0; background: none; }

/* Avis : logo G devant les étoiles et pastille d'initiale façon compte Google dans l'angle (13/10/2026) */
.note-google { display: inline-flex; align-items: center; gap: 8px; }
.note-google img { flex: none; width: 18px; height: 18px; }
.preuve-bloc .note-google { display: flex; margin-bottom: 4px; }
.preuve-bloc .note-google img { width: 22px; height: 22px; }
.avis blockquote { position: relative; }
.avis blockquote p { padding-right: 52px; }
.avis-avatar { position: absolute; top: 22px; right: 22px; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: #fff; font: 500 19px/1 var(--titre); }

/* H1 « filigrane » (modèle O retenu le 13/10/2026) : mot clé de la page en grandes capitales derrière le titre, même dégradé
   que les grands mots des sections (.mot-fond). Taille calculée pour tenir dans la largeur du premier écran : --n = nombre de lettres.
   La partie en <em> du H1 passe en blanc gras, sans soulignement ni couleur. */
.hero-filigrane { position: relative; z-index: -1; display: block; width: max-content; max-width: none; white-space: nowrap; pointer-events: none; user-select: none;
  font: 700 clamp(30px, calc((100vw - 2 * var(--marge)) / (var(--n, 10) * .66)), 230px)/.82 var(--titre); letter-spacing: -.035em; text-transform: uppercase;
  margin: -.12em 0 -.68em -.04em;
  background: linear-gradient(90deg, rgba(243, 243, 240, .16) 0%, rgba(243, 243, 240, .07) 55%, rgba(255, 174, 0, .3) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  -webkit-mask-image: linear-gradient(180deg, #000 25%, rgba(0, 0, 0, .2) 100%); mask-image: linear-gradient(180deg, #000 25%, rgba(0, 0, 0, .2) 100%); }
.hero-plein-contenu { min-width: 0; } /* le mot ne peut pas élargir la grille du premier écran */
:is(h1.titre-1, h1.hero-titre) em, .hero-titre-jaune, .cc h1.titre-1 em, .hero--plein h1.hero-titre em {
  padding: 0; background: none; color: inherit; font-style: normal; font-weight: 600; text-decoration: none; }
.cc h1.titre-1 em { color: var(--encre); }

/* Formulaire : information RGPD sous le bouton d'envoi (13/10/2026, reprend la page /rgpd/) */
.demande-rgpd { margin: 14px 0 0; max-width: 62ch; color: var(--encre-3); font: 500 12.5px/1.5 var(--texte); }
.demande-rgpd a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.demande-rgpd a:hover { color: var(--encre); }

/* Pied de page : badges Google et Certibiocide au format de la pilule de confiance du premier écran (13/10/2026) */
.pied .preuves { gap: 8px; }
.pied .preuve { gap: 8px; min-height: 0; padding: 7px 14px; font-size: 14px; }
.pied .preuve--google img { width: 20px; height: 20px; margin-left: 0; }
.pied .preuve-etoiles { height: 15px; }
.pied .preuve--label { padding: 7px 14px; }
.pied .preuve--label img { height: 26px; }
@media (max-width: 899px) {
  .pied .preuve { padding: 6px 12px; font-size: 13.5px; }
  .pied .preuve--google img { width: 18px; height: 18px; }
  .pied .preuve-etoiles { height: 13px; }
  .pied .preuve--label img { height: 20px; }
  .pied .preuve--google .preuve-detail { display: none; }
}

/* Pied de page compact et plus premium (13/10/2026) : marque + accroche, badges et réseaux sociaux à droite, colonnes resserrées */
.pied { padding-block: clamp(40px, 5vw, 64px) 20px; }
.pied-haut { align-items: flex-start; gap: 20px 40px; padding-bottom: 28px; }
.pied-marque { display: grid; gap: 12px; max-width: 36ch; }
.pied-accroche { margin: 0; color: var(--gris-1); font: 500 13.5px/1.55 var(--texte); }
.pied-droite { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.pied-reseaux { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pied-reseaux a { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #343A42; border-radius: 50%; background: rgba(26, 29, 32, .9); color: var(--blanc-tech); }
.pied-reseaux a:hover, .pied-reseaux a:focus-visible { border-color: var(--jaune); background: var(--jaune); color: var(--carbone); }
.pied-reseaux svg { display: block; width: 16px; height: 16px; }
.pied-colonnes { gap: 24px 32px; padding-block: 28px; }
.pied-colonnes h2 { margin-bottom: 12px; font-size: 11px; color: var(--gris-2); }
.pied-colonnes ul { gap: 8px; font-size: 14px; }
.pied-colonnes a { color: #C9CDD1; }
.pied-colonnes a:hover { color: var(--jaune); }
.pied-colonnes li { color: var(--gris-1); }
.pied-colonnes .pied-tel { color: var(--blanc-tech); font-weight: 700; }
.pied-colonnes .pied-devis { color: var(--jaune); font-weight: 600; }
.pied-bas { padding-top: 16px; }
.pied-bas a:hover { color: var(--jaune); }
@media (max-width: 899px) {
  .pied-haut { flex-direction: column; gap: 18px; padding-bottom: 24px; }
  .pied-droite { gap: 10px; }
  .pied-colonnes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 20px; padding-block: 24px; }
}

/* Formulaire une question par écran (13/10/2026) : chapitres remplis progressivement (transform), compteur visible, grande question */
.demande--questions .demande-progression { grid-template-areas: "retour barre" ". compteur"; row-gap: 10px; margin-bottom: 28px; }
.demande--questions .demande-barre li::after { width: 100%; transform: scaleX(var(--remplissage, 0)); transform-origin: left center; transition: transform 350ms var(--ease); }
.demande--questions .demande-compteur { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; grid-area: compteur; margin: 0; font: 500 11.5px/1.3 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--gris-2); }
.demande--questions .demande-compteur b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.demande--questions .demande-resume:not([hidden]) { margin: -10px 0 22px !important; }
.demande--questions .demande-etape > .demande-question, .demande--questions legend.demande-question, .demande--questions label.demande-question { display: block; width: 100%; margin: 0 0 20px; padding: 0; }
.demande--questions .demande-champ > label.demande-question + .demande-aide-champ { margin: -10px 0 14px; }
.demande--questions .demande-etape { min-height: 220px; }
.demande--questions .demande-etape .demande-champ + .demande-champ { margin-top: 16px; }
.contact-formulaire .demande--questions .demande-compteur { color: #6B7178; }
@media (prefers-reduced-motion: reduce) { .demande--questions .demande-barre li::after { transition: none; } }

/* Généré par tools/pictos.rb (source : thème SANIPURE Grenoble) — ne pas modifier à la main. */
:root {
  --p-loupe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.6-3.6'/%3E%3C/svg%3E");
  --p-reglages: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1.5 14h5M9.5 8h5M17.5 16h5'/%3E%3C/svg%3E");
  --p-discretion: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11 12 4l9 7'/%3E%3Cpath d='M5 9.8V20h14V9.8'/%3E%3Cpath d='M9.5 14.5h5'/%3E%3Ccircle cx='12' cy='11.5' r='1'/%3E%3C/svg%3E");
  --p-bulle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 14.5a2 2 0 0 1-2 2H8l-5 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3Cpath d='M8 9h8M8 12.5h5'/%3E%3C/svg%3E");
  --p-taches: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='8' r='1.7' fill='%23000' stroke='none'/%3E%3Ccircle cx='14' cy='6' r='1.2' fill='%23000' stroke='none'/%3E%3Ccircle cx='16.5' cy='12.5' r='1.9' fill='%23000' stroke='none'/%3E%3Ccircle cx='9' cy='14.5' r='1.3' fill='%23000' stroke='none'/%3E%3Ccircle cx='12.5' cy='18.5' r='1.1' fill='%23000' stroke='none'/%3E%3Ccircle cx='5.5' cy='18' r='.9' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  --p-goutte: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3s6 6.4 6 11a6 6 0 0 1-12 0c0-4.6 6-11 6-11z'/%3E%3C/svg%3E");
  --p-insecte: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='14.2' rx='4.6' ry='5.8'/%3E%3Cpath d='M12 8.4V6.2'/%3E%3Ccircle cx='12' cy='5' r='1.4'/%3E%3Cpath d='M7.6 11.5 4.6 9.8M7.4 14.5H4M7.9 17.4l-2.4 2.3M16.4 11.5l3-1.7M16.6 14.5H20M16.1 17.4l2.4 2.3'/%3E%3C/svg%3E");
  --p-oeufs: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='8.5' cy='13.5' rx='3' ry='4.2'/%3E%3Cellipse cx='15.8' cy='11.2' rx='2.6' ry='3.6'/%3E%3Cellipse cx='15' cy='18.6' rx='1.8' ry='2.2'/%3E%3C/svg%3E");
  --p-vehicule: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 16.5V12l2.2-5h12.6l2.2 5v4.5z'/%3E%3Cpath d='M3.5 12h17'/%3E%3Ccircle cx='7.5' cy='16.8' r='1.9'/%3E%3Ccircle cx='16.5' cy='16.8' r='1.9'/%3E%3C/svg%3E");
  --p-document: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6.5a1.5 1.5 0 0 0-1.5 1.5v15A1.5 1.5 0 0 0 6.5 21h11a1.5 1.5 0 0 0 1.5-1.5V8z'/%3E%3Cpath d='M14 3v5h5'/%3E%3Cpath d='m9 14.5 2 2 4-4'/%3E%3C/svg%3E");
  --p-bouclier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4.5 6v6c0 4.8 3.3 8 7.5 9 4.2-1 7.5-4.2 7.5-9V6z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
  --p-immeuble: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='1.5'/%3E%3Cpath d='M9 7h1.5M13.5 7H15M9 11h1.5M13.5 11H15M9 15h1.5M13.5 15H15'/%3E%3Cpath d='M10.5 21v-3h3v3'/%3E%3C/svg%3E");
  --p-maison: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11 12 4l9 7'/%3E%3Cpath d='M5 9.8V20h14V9.8'/%3E%3Cpath d='M10 20v-5.5h4V20'/%3E%3C/svg%3E");
  --p-lit: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 19V6.5'/%3E%3Cpath d='M3 14.5h18V19'/%3E%3Cpath d='M21 14.5V13a3 3 0 0 0-3-3h-7v4.5'/%3E%3Ccircle cx='7' cy='11.5' r='2'/%3E%3C/svg%3E");
  --p-certificat: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='13' rx='2'/%3E%3Cpath d='M7 8.5h7M7 12h4.5'/%3E%3Ccircle cx='16.5' cy='12' r='2'/%3E%3Cpath d='m15.5 13.8-.8 5.2 1.8-1 1.8 1-.8-5.2'/%3E%3C/svg%3E");
  --p-medaille: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='6'/%3E%3Cpath d='M8.6 14 7 21.5l5-2.8 5 2.8-1.6-7.5'/%3E%3Cpath d='m9.8 9 1.5 1.5 3-3'/%3E%3C/svg%3E");
  --p-repere: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12S4 16 4 10a8 8 0 0 1 16 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
  --p-vapeur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.5 20c-1.4-1.5-1.4-3.5 0-5s1.4-3.5 0-5-1.4-3.5 0-5'/%3E%3Cpath d='M12 20c-1.4-1.5-1.4-3.5 0-5s1.4-3.5 0-5-1.4-3.5 0-5'/%3E%3Cpath d='M16.5 20c-1.4-1.5-1.4-3.5 0-5s1.4-3.5 0-5-1.4-3.5 0-5'/%3E%3C/svg%3E");
  --p-euro: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.5 6.6A7.2 7.2 0 1 0 17.5 17.4'/%3E%3Cpath d='M4 10.2h9M4 13.8h9'/%3E%3C/svg%3E");
  --p-liste: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6h11M9 12h11M9 18h11'/%3E%3Cpath d='m3.5 6 1 1 2-2M3.5 12l1 1 2-2M3.5 18l1 1 2-2'/%3E%3C/svg%3E");
  --p-carte: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4 3.5 6v14L9 18l6 2 5.5-2V4L15 6z'/%3E%3Cpath d='M9 4v14M15 6v14'/%3E%3C/svg%3E");
  --p-telephone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.9.6 2.8.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E");
  --p-courriel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3.5 6.5 8.5 6.5 8.5-6.5'/%3E%3C/svg%3E");
  --p-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --p-appareil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h3l1.8-2.8h6.4L17 8h3v11.5H4z'/%3E%3Ccircle cx='12' cy='13.3' r='3.6'/%3E%3C/svg%3E");
  --p-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5.5M12 7.6v.2'/%3E%3C/svg%3E");
  --p-canape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 11V8a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v3'/%3E%3Cpath d='M2.5 12.5a2 2 0 0 1 4 0V14h11v-1.5a2 2 0 0 1 4 0V18h-19z'/%3E%3Cpath d='M5 18v2M19 18v2'/%3E%3C/svg%3E");
  --p-pulverisateur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.5 21h7a1 1 0 0 0 1-1v-7.5a3 3 0 0 0-3-3h-3a3 3 0 0 0-3 3V20a1 1 0 0 0 1 1z'/%3E%3Cpath d='M10 9.5V6.5h4v3'/%3E%3Cpath d='M14 6.5h2.5L18 5'/%3E%3Cpath d='M20 3.5l1.5-.5M20.5 6h1.5M20 8.5l1.5.5'/%3E%3C/svg%3E");
  --p-sac: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8h12l-1 12.5H7z'/%3E%3Cpath d='M9 8V6.5a3 3 0 0 1 6 0V8'/%3E%3Cpath d='M9.5 12h5'/%3E%3C/svg%3E");
  --p-lavage: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Ccircle cx='12' cy='13' r='4.6'/%3E%3Cpath d='M7 6.5h2.5M15.5 6.5h1'/%3E%3C/svg%3E");
  --p-aeration: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8h10.5A2.5 2.5 0 1 0 11 5.5'/%3E%3Cpath d='M3 12h15a3 3 0 1 1-3 3'/%3E%3Cpath d='M3 16h7'/%3E%3C/svg%3E");
  --p-aspirateur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 20.5h7'/%3E%3Cpath d='M9.5 20.5V9a4 4 0 0 1 8 0v1.5'/%3E%3Cpath d='M17.5 10.5 20 20.5'/%3E%3Ccircle cx='17.5' cy='10.5' r='1.3'/%3E%3C/svg%3E");
  --p-alerte: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9 2.4 18a2 2 0 0 0 1.7 3h15.8a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cpath d='M12 9.5v4.5M12 17.3v.2'/%3E%3C/svg%3E");
  --p-interdit: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m5.7 5.7 12.6 12.6'/%3E%3C/svg%3E");
  --p-cle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7.5' cy='15.5' r='3.5'/%3E%3Cpath d='m10 13 10-10M17 6l2.5 2.5M14.5 8.5 16.5 10.5'/%3E%3C/svg%3E");
  --p-thermometre: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 14.8V5a2 2 0 0 0-4 0v9.8a4 4 0 1 0 4 0z'/%3E%3Cpath d='M12 9v7'/%3E%3C/svg%3E");
  --p-flocon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5v19M3.8 7.2l16.4 9.6M20.2 7.2 3.8 16.8'/%3E%3Cpath d='m9.5 4 2.5 2 2.5-2M9.5 20l2.5-2 2.5 2'/%3E%3C/svg%3E");
  --p-equipe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.2'/%3E%3Cpath d='M3 20.5c0-3.4 2.7-6 6-6s6 2.6 6 6'/%3E%3Ccircle cx='17.2' cy='9' r='2.5'/%3E%3Cpath d='M15.8 14.3c2.9.3 5.2 2.8 5.2 6'/%3E%3C/svg%3E");
  --p-horloge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5.2l3.2 2'/%3E%3C/svg%3E");
  --p-calendrier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4.5' width='18' height='16.5' rx='2'/%3E%3Cpath d='M8 2.5v4M16 2.5v4M3 10h18'/%3E%3Cpath d='m9 15.2 2 2 4-4'/%3E%3C/svg%3E");
  --p-valise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='8' width='16' height='12.5' rx='2'/%3E%3Cpath d='M9 8V5h6v3'/%3E%3Cpath d='M8.5 8v12.5M15.5 8v12.5'/%3E%3C/svg%3E");
  --p-prise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.5' y='4' width='15' height='16' rx='3.5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M10.5 12h.01M13.5 12h.01'/%3E%3C/svg%3E");
  --p-rongeur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 15c0-3.3 3.1-6 7-6 3.4 0 6 2 6.8 4.5L21 15l-3 1.2c-.6 1.6-2.3 2.8-4.6 2.8H8.5C6 19 4 17.3 4 15z'/%3E%3Ccircle cx='14.5' cy='9.6' r='1.6'/%3E%3Cpath d='M4.4 16.5C2.6 17 2 18.6 3 20'/%3E%3Ccircle cx='17.4' cy='13.2' r='.6' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  --p-fourmi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='12' r='2.2'/%3E%3Cellipse cx='11.3' cy='12' rx='1.8' ry='1.5'/%3E%3Cellipse cx='17' cy='12' rx='3.3' ry='2.4'/%3E%3Cpath d='M10.2 10.8 8.6 7.6M12.4 10.8 14 7.6M10.2 13.2l-1.6 3.2M12.4 13.2l1.6 3.2M5 10 3.4 7.4M7 10l1-2.8'/%3E%3C/svg%3E");
  --p-couverts: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3v7a2 2 0 0 0 2 2v9M11 3v7a2 2 0 0 1-2 2M9 3v6'/%3E%3Cpath d='M17 21V3c-2 1.5-3 4-3 7v3h3'/%3E%3C/svg%3E");
  --p-vitrine: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9.5V20h16V9.5'/%3E%3Cpath d='M3 4h18l-1 5.5H4z'/%3E%3Cpath d='M10 20v-6h4v6'/%3E%3C/svg%3E");
}
.picto { display: inline-block; flex: none; width: var(--picto-t, 24px); height: var(--picto-t, 24px); background: currentColor; -webkit-mask: var(--picto) center / contain no-repeat; mask: var(--picto) center / contain no-repeat; }
.picto--loupe { --picto: var(--p-loupe); }
.picto--reglages { --picto: var(--p-reglages); }
.picto--discretion { --picto: var(--p-discretion); }
.picto--bulle { --picto: var(--p-bulle); }
.picto--taches { --picto: var(--p-taches); }
.picto--goutte { --picto: var(--p-goutte); }
.picto--insecte { --picto: var(--p-insecte); }
.picto--oeufs { --picto: var(--p-oeufs); }
.picto--vehicule { --picto: var(--p-vehicule); }
.picto--document { --picto: var(--p-document); }
.picto--bouclier { --picto: var(--p-bouclier); }
.picto--immeuble { --picto: var(--p-immeuble); }
.picto--maison { --picto: var(--p-maison); }
.picto--lit { --picto: var(--p-lit); }
.picto--certificat { --picto: var(--p-certificat); }
.picto--medaille { --picto: var(--p-medaille); }
.picto--repere { --picto: var(--p-repere); }
.picto--vapeur { --picto: var(--p-vapeur); }
.picto--euro { --picto: var(--p-euro); }
.picto--liste { --picto: var(--p-liste); }
.picto--carte { --picto: var(--p-carte); }
.picto--telephone { --picto: var(--p-telephone); }
.picto--courriel { --picto: var(--p-courriel); }
.picto--chevron { --picto: var(--p-chevron); }
.picto--appareil { --picto: var(--p-appareil); }
.picto--info { --picto: var(--p-info); }
.picto--canape { --picto: var(--p-canape); }
.picto--pulverisateur { --picto: var(--p-pulverisateur); }
.picto--sac { --picto: var(--p-sac); }
.picto--lavage { --picto: var(--p-lavage); }
.picto--aeration { --picto: var(--p-aeration); }
.picto--aspirateur { --picto: var(--p-aspirateur); }
.picto--alerte { --picto: var(--p-alerte); }
.picto--interdit { --picto: var(--p-interdit); }
.picto--cle { --picto: var(--p-cle); }
.picto--thermometre { --picto: var(--p-thermometre); }
.picto--flocon { --picto: var(--p-flocon); }
.picto--equipe { --picto: var(--p-equipe); }
.picto--horloge { --picto: var(--p-horloge); }
.picto--calendrier { --picto: var(--p-calendrier); }
.picto--valise { --picto: var(--p-valise); }
.picto--prise { --picto: var(--p-prise); }
.picto--rongeur { --picto: var(--p-rongeur); }
.picto--fourmi { --picto: var(--p-fourmi); }
.picto--couverts { --picto: var(--p-couverts); }
.picto--vitrine { --picto: var(--p-vitrine); }

/* =============================================================================
   SANIPURE.fr — compléments au design system SANIPURE Valence (sanipure.css, inchangé).
   Uniquement les composants nécessaires aux contenus historiques de sanipure.fr ;
   mêmes jetons (couleurs, rayons, typographies, durées), aucune nouvelle couleur.
   ============================================================================= */

/* ---------- Premier écran : titre + vidéo historique « Léa de Sanipure » ---------- */
.hero-plein-contenu--video { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(32px, 5vw, 88px); align-items: end; }
.hero-colonne { min-width: 0; }
.hero-valeurs { display: flex; flex-wrap: wrap; gap: 10px 0; margin-top: 26px; }
.hero-valeurs h2 { display: inline-flex; align-items: center; margin: 0; font: 500 clamp(15px, 14px + .3vw, 17.5px)/1.3 var(--texte); letter-spacing: 0; text-transform: none; color: #D9DCDF; }
.hero-valeurs h2 + h2::before { content: ""; width: 6px; height: 6px; margin: 0 16px; border-radius: 1.5px; background: var(--jaune); }
.hero-video { position: relative; justify-self: end; width: min(100%, 420px); aspect-ratio: 1; border-radius: var(--r-carte); overflow: hidden; background: var(--carbone); outline: 1px solid rgba(243, 243, 240, .18); box-shadow: 0 30px 80px rgba(0, 0, 0, .45); }
.hero-video::before { content: ""; position: absolute; left: 0; top: 0; z-index: 2; width: 64px; height: 3px; background: var(--jaune); pointer-events: none; }
.hero-video video { display: block; width: 100%; height: 100%; object-fit: cover; }
.hero-confiance-google > span { color: var(--blanc-tech); }
@media (max-width: 1023px) {
  .hero-plein-contenu--video { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .hero-video { justify-self: start; width: min(100%, 360px); }
}
@media (max-width: 599px) {
  .hero-valeurs { flex-direction: column; gap: 8px; }
  .hero-valeurs h2::before, .hero-valeurs h2 + h2::before { content: ""; flex: none; width: 6px; height: 6px; margin: 0 12px 0 0; border-radius: 1.5px; background: var(--jaune); }
  .hero-video { width: 100%; }
}

/* ---------- Nos services : cartes photo (composant carte-lieu de Valence) ---------- */
.services-fr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gouttiere); margin-top: clamp(36px, 4vw, 56px); padding: 0; list-style: none; }
.services-fr-carte .photo { aspect-ratio: auto; height: clamp(340px, 30vw, 440px); }
.services-fr-carte { outline: 1px solid var(--filet-sombre); transition: outline-color var(--t-micro) var(--ease); }
.services-fr-lien { display: flex; align-items: center; gap: 12px; color: var(--blanc-tech); text-decoration: none; }
.services-fr-lien::after { content: ""; position: absolute; inset: 0; z-index: 4; } /* toute la carte est cliquable */
.services-fr-nom { flex: 1; font: var(--titre-graisse) clamp(1.15rem, 1rem + .4vw, 1.45rem)/1.15 var(--titre); letter-spacing: var(--titre-approche); }
.services-fr-carte:hover, .services-fr-carte:focus-within { outline-color: var(--jaune); }
.services-fr-carte:hover .selecteur-fleche { background: var(--jaune); color: var(--carbone); transform: translateX(2px); }
@media (max-width: 1023px) { .services-fr { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 479px) { .services-fr { grid-template-columns: minmax(0, 1fr); } .services-fr-carte .photo { height: 300px; } }

/* ---------- Comment ça marche : trois étapes (texte de l'infographie historique) ---------- */
.etapes-fr { margin-top: clamp(32px, 4vw, 48px); }
.etapes-fr .etapes-fr-texte { font: var(--titre-graisse) clamp(1.2rem, 1rem + .7vw, 1.6rem)/1.2 var(--titre); letter-spacing: var(--titre-approche); color: var(--encre); }
@media (max-width: 767px) {
  .etapes-fr { grid-template-columns: minmax(0, 1fr); }
  .etapes-fr .colonne + .colonne { padding-left: 0; border-left: 0; }
  .etapes-fr .colonne + .colonne::before { left: 0; }
}

/* ---------- Visuels historiques (infographie, BFM TV, qui sommes nous) ---------- */
.visuel-historique img { display: block; width: 100%; height: auto; }
.visuel-historique--large { max-width: 1040px; margin: clamp(28px, 4vw, 48px) auto 0; border-radius: var(--r-carte); overflow: hidden; outline: 1px solid var(--filet-clair); }
.duo-media { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 88px); align-items: center; }
.duo-media .photo { border-radius: var(--r-photo); overflow: hidden; outline: 1px solid var(--filet-sombre); }
.expertise-photo.visuel-historique { aspect-ratio: auto; background: var(--blanc); }
.expertise-photo.visuel-historique img { object-fit: contain; }
.qui-texte { margin-top: 28px; }
@media (max-width: 1023px) { .duo-media { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Zones d'intervention : 12 liens historiques ---------- */
.villes-fr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: clamp(36px, 4vw, 56px); padding: 0; list-style: none; border-radius: var(--r-carte); overflow: hidden; background: var(--filet); outline: 1px solid var(--filet); }
.villes-fr li { position: relative; display: grid; gap: 10px; padding: 22px 20px 24px; background: var(--blanc); color: var(--encre-claire); font: var(--titre-graisse) clamp(.98rem, .9rem + .3vw, 1.15rem)/1.2 var(--titre); letter-spacing: .01em; }
.villes-fr .num { font: 500 10.5px/1 var(--mono); letter-spacing: .12em; color: #5F656B; }
.villes-fr .num::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 1.5px; background: var(--jaune); }
.villes-fr a { color: var(--encre-claire); text-decoration: none; background: linear-gradient(var(--jaune), var(--jaune)) 0 100% / 0 2px no-repeat; transition: background-size var(--t-micro) var(--ease); }
.villes-fr a::after { content: " →"; font-family: var(--mono); color: #A86F00; }
.villes-fr a:hover, .villes-fr a:focus-visible { background-size: 100% 2px; }
@media (max-width: 1023px) { .villes-fr { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 599px) { .villes-fr { grid-template-columns: repeat(2, minmax(0, 1fr)); } .villes-fr li { padding: 18px 14px; } }

/* ---------- Ils parlent de nous : deux galeries historiques ---------- */
.logos--presse { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); }
.logos--presse a { display: grid; place-items: center; padding: 18px; background: var(--blanc); }
.logos--presse img { max-width: 140px; height: auto; }
.logos--presse a:hover img { filter: none; opacity: 1; }
@media (max-width: 1023px) { .logos--presse { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 599px) { .logos--presse { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Pages populaires : deux cartes historiques ---------- */
.populaires-fr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gouttiere); margin-top: clamp(36px, 4vw, 56px); }
.populaires-fr .carte-lieu > img { grid-area: 1 / 1; width: 100%; height: clamp(300px, 30vw, 420px); object-fit: cover; }
.populaires-fr .carte-lieu::after { content: ""; grid-area: 1 / 1; z-index: 1; background: linear-gradient(180deg, rgba(11, 12, 13, 0) 35%, rgba(11, 12, 13, .9) 100%); }
.populaires-fr .carte-lieu-corps a { color: inherit; text-decoration: none; }
.populaires-fr .carte-lieu-corps a::after { content: ""; position: absolute; inset: 0; z-index: 4; }
.populaires-fr-carte { outline: 1px solid transparent; transition: outline-color var(--t-micro) var(--ease); }
.populaires-fr-carte:hover, .populaires-fr-carte:focus-within { outline-color: var(--jaune); }
.populaires-fr .carte-lieu-corps h2 { font-size: clamp(1.3rem, 1.1rem + .7vw, 1.8rem); line-height: 1.15; color: var(--blanc-tech); }
@media (max-width: 767px) { .populaires-fr { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Pourquoi choisir Sanipure : six arguments (séquence numérotée sur fond graphite) ---------- */
.sequence--fr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(32px, 5vw, 80px); margin-top: clamp(36px, 4vw, 56px); border-top-color: var(--filet-sombre); }
.sequence--fr li { border-bottom-color: var(--filet-sombre); }
.sequence--fr h3 { color: var(--blanc-tech); }
.sequence--fr p { color: #C9CDD1; }
.sequence--fr .sequence-num { color: #858B92; }
@media (max-width: 1023px) { .sequence--fr { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Notre expertise : onglets, texte historique intégral ---------- */
.onglets-fr { margin-top: clamp(36px, 4vw, 56px); }
.expertise-fr { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(28px, 4vw, 64px); align-items: start; padding-top: clamp(28px, 3vw, 40px); }
.expertise-fr-photo { position: sticky; top: calc(var(--entete-h) + 32px); aspect-ratio: 4 / 5; border-radius: var(--r-photo); overflow: hidden; }
.expertise-fr .prose { max-width: 78ch; }
.expertise-fr .prose h4 { margin-top: 26px; font: var(--titre-graisse) 1.15rem/1.25 var(--titre); color: var(--encre); }
.expertise-fr .prose > p:first-child strong { display: inline-block; padding: 6px 10px; border-radius: var(--r-tag); background: var(--jaune-pale); font: 500 12px/1.3 var(--mono); letter-spacing: .1em; color: var(--encre); }
@media (max-width: 1023px) { .expertise-fr { grid-template-columns: minmax(0, 1fr); } .expertise-fr-photo { position: relative; top: 0; aspect-ratio: 16 / 9; } }

/* ---------- Pied de page : visuels historiques et note d'avis ---------- */
.preuve-avis { display: flex; align-items: center; gap: 12px; color: var(--blanc-tech); font-weight: 600; }
.pied-visuels { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 1px; margin: 36px 0 0; padding: 0; list-style: none; border-radius: var(--r-carte); overflow: hidden; background: var(--filet-sombre); outline: 1px solid var(--filet-sombre); }
.pied-visuels li { display: grid; place-items: center; padding: 14px; background: var(--blanc); }
.pied-visuels img { width: 100%; height: auto; max-height: 110px; object-fit: contain; }
@media (max-width: 1023px) { .pied-visuels { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pied-visuels li:first-child { grid-column: 1 / -1; } }

@media (prefers-reduced-motion: reduce) {
  .services-fr-carte, .villes-fr a, .services-fr-carte .selecteur-fleche { transition: none; }
}

/* =============================================================================
   PAGES INTERNES (modèles A à E) — contenu historique converti (scripts/convertir.pl)
   Structure : section.bloc > div.rangee[.rangee--colonnes > div.col] > .m (module)
   ============================================================================= */
.page-contenu { --fond: var(--blanc); --encre: var(--encre-claire); --encre-2: var(--encre-claire-2); --encre-3: var(--encre-claire-3); --filet: var(--filet-clair); --carte: var(--papier); --bord-bouton: #B4B6B1; color-scheme: light; background: var(--blanc); color: var(--encre-claire-2); }
.page-contenu > .bloc { padding-block: clamp(44px, 6vw, 96px); background: var(--fond); }
.page-contenu > .bloc:nth-of-type(odd):not(.bloc--entete) { --fond: var(--papier); --carte: var(--blanc); }
.page-contenu .rangee { display: grid; gap: 20px; width: 100%; max-width: 920px; margin-inline: auto; padding-inline: var(--marge); }
.page-contenu .rangee--colonnes { max-width: var(--largeur); grid-template-columns: repeat(var(--n, 2), minmax(0, 1fr)); gap: clamp(28px, 4vw, 64px); align-items: start; }
.page-contenu .rangee + .rangee { margin-top: clamp(32px, 4vw, 56px); }
.page-contenu .col { display: grid; align-content: start; gap: 18px; min-width: 0; }
.page-contenu .m { min-width: 0; }
.page-contenu .prose { max-width: none; color: var(--encre-2); }
.page-contenu .prose :is(h1, h2, h3, h4, h5, h6) { color: var(--encre); text-wrap: balance; }
.page-contenu .prose h1 { font: var(--titre-graisse) clamp(2rem, 1.4rem + 2.2vw, 3.4rem)/1.08 var(--titre); letter-spacing: var(--titre-approche); }
.page-contenu .prose h2 { margin-top: 0; padding-top: 0; border-top: 0; font: var(--titre-graisse) clamp(1.5rem, 1.2rem + 1vw, 2.2rem)/1.15 var(--titre); letter-spacing: var(--titre-approche); }
.page-contenu .prose * + h2 { margin-top: clamp(28px, 3vw, 40px); }
.page-contenu .prose h3 { font: var(--titre-graisse) clamp(1.2rem, 1.05rem + .5vw, 1.5rem)/1.2 var(--titre); }
.page-contenu .prose :is(h4, h5, h6) { font: var(--titre-graisse) 1.08rem/1.3 var(--titre); }
.page-contenu .prose h2:empty, .page-contenu .prose h1:empty, .page-contenu .prose p:empty { display: none; } /* titres vides hérités de Divi : conservés dans le HTML, sans espace vide */
.page-contenu .prose img { height: auto; border-radius: var(--r-photo); }
.page-contenu .prose table { width: 100%; border-collapse: collapse; font-size: var(--t-petit); background: var(--carte); border-radius: var(--r-carte); overflow: hidden; outline: 1px solid var(--filet); outline-offset: -1px; }
.page-contenu .prose :is(th, td) { padding: 14px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--filet); }
.page-contenu .prose th { font: 600 13px/1.35 var(--texte); color: var(--encre); background: color-mix(in srgb, var(--jaune) 14%, var(--carte)); }
.page-contenu .prose tr:last-child > * { border-bottom: 0; }
.page-contenu .m--texte:has(table), .page-contenu .m--code:has(table) { overflow-x: auto; }
.page-contenu .m--image { margin: 0; }
.page-contenu .m--image img { display: block; width: 100%; height: auto; border-radius: var(--r-photo); }
.page-contenu .m--image--large img { border-radius: 0; }
.page-contenu .m--video { margin: 0; }
.page-contenu .m--video :is(video, iframe) { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: var(--r-photo); background: var(--carbone); }
.page-contenu audio { width: 100%; }
.page-contenu .m--bouton { margin: 0; }
.page-contenu .col > .m--bouton + .m--bouton, .page-contenu .rangee > .m--bouton + .m--bouton { margin-top: -8px; }
.page-contenu .m--carte-info { display: grid; gap: 10px; align-content: start; padding: 24px; border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.page-contenu .m--carte-info img { width: 64px; height: auto; }
.page-contenu .m--carte-info :is(h2, h3, h4) { font-size: 1.15rem; }
.page-contenu .m--temoignage { margin: 0; padding: 24px; border-left: 3px solid var(--jaune); background: var(--carte); border-radius: 0 var(--r-carte) var(--r-carte) 0; }
.page-contenu .m--tarifs { display: grid; gap: 16px; padding: 26px; border-radius: var(--r-carte); background: var(--carbone); color: var(--blanc-tech); --encre: var(--blanc-tech); --encre-2: #C9CDD1; }
.page-contenu .m--tarifs :is(h2, h3) { color: var(--jaune); }
.page-contenu .m--galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.page-contenu .m--galerie img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; border-radius: var(--r-photo); }
.page-contenu .m--question { border-top: 1px solid var(--filet); }
.page-contenu .m--question + .m--question { border-top: 0; }
.page-contenu .m--question { border-bottom: 1px solid var(--filet); }
.page-contenu .question summary :is(h2, h3, h4, h5, h6) { margin: 0; font: inherit; color: inherit; }
.page-contenu .m--onglets .onglets-liste { margin-bottom: 24px; }
.page-contenu .m--separateur { border: 0; border-top: 1px solid var(--filet); margin: 8px 0; }
.page-contenu .ancre { display: block; scroll-margin-top: calc(var(--entete-h) + 24px); }
.page-contenu [id] { scroll-margin-top: calc(var(--entete-h) + 24px); }

/* Premier écran d'une page : la section historique qui porte le H1, sur fond carbone */
.page-contenu > .bloc--entete { --fond: var(--carbone); --encre: var(--blanc-tech); --encre-2: #D9DCDF; --encre-3: var(--gris-2); --filet: var(--filet-sombre); --carte: var(--graphite); --bord-bouton: #3A3F45; color-scheme: dark;
  position: relative; isolation: isolate; overflow: hidden; color: #D9DCDF; padding-block: clamp(56px, 7vw, 112px);
  background: radial-gradient(120% 90% at 85% 10%, rgba(255, 174, 0, .12) 0%, rgba(255, 174, 0, 0) 55%), var(--carbone); }
.page-contenu > .bloc--entete::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: -1; height: 3px; background: var(--jaune); }
.page-contenu > .bloc--entete .prose h1 { color: var(--blanc-tech); font-size: clamp(2.2rem, 1.4rem + 3vw, 4rem); }
.page-contenu > .bloc--entete .prose a { color: var(--blanc-tech); }
.page-contenu > .bloc--entete .m--image img { border-radius: var(--r-carte); box-shadow: 0 30px 80px rgba(0, 0, 0, .45); }

@media (max-width: 1023px) { .page-contenu .rangee--colonnes { grid-template-columns: minmax(0, 1fr); } }
/* Images historiques à fond transparent (texte noir) dans le premier écran sombre : posées sur une carte blanche */
.page-contenu > .bloc--entete .m--image { padding: clamp(10px, 1.4vw, 18px); border-radius: var(--r-carte); background: var(--blanc); box-shadow: 0 30px 80px rgba(0, 0, 0, .45); }
.page-contenu > .bloc--entete .m--image img { border-radius: calc(var(--r-carte) - 4px); box-shadow: none; }

/* --- Pages refondues dans les gabarits Valence (pilote /punaises-de-lit-paris/, 13/10/2026) --- */
.video-cadre { position: relative; overflow: hidden; border-radius: var(--r-photo); background: var(--carbone); aspect-ratio: 16 / 9; }
.video-cadre iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.galerie-interventions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gouttiere); margin-top: clamp(28px, 4vw, 48px); }
.galerie-interventions .photo { aspect-ratio: 4 / 5; }
.galerie-interventions .photo a { display: block; height: 100%; }
.prix-montant { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; margin-top: 22px; }
.prix-montant strong { font: var(--titre-graisse) clamp(2.4rem, 1.6rem + 3vw, 4rem)/1 var(--titre); letter-spacing: var(--titre-approche); color: var(--encre); }
.engagements figure img { border-radius: var(--r-carte); }
.zone-carte { align-self: start; background: var(--blanc); }
.zone-carte img { height: auto; object-fit: contain; }
.actus-lien { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(24px, 4vw, 56px); align-items: center; margin-top: clamp(40px, 5vw, 64px); padding-top: clamp(28px, 4vw, 44px); border-top: 1px solid var(--filet); }
.actus-lien img { border-radius: var(--r-carte); }
.actus-lien .chapeau { margin-top: 10px; }
.surface--graphite .comparatif a img { border-radius: var(--r-carte); }
@media (max-width: 1023px) {
  .galerie-interventions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .actus-lien { grid-template-columns: minmax(0, 1fr); }
}
.comparatif > div > h2 { margin-top: 10px; font: var(--titre-graisse) clamp(1.6rem, 1.2rem + 1.3vw, 2.3rem)/1.14 var(--titre); letter-spacing: var(--titre-approche); }
.comparatif > div > h2 + h3 { font-size: clamp(1.05rem, .98rem + .3vw, 1.25rem); line-height: 1.35; }
.criteres--deux { max-width: 880px; }
.sous-titre-section { margin-top: clamp(30px, 4vw, 44px); font: var(--titre-graisse) clamp(1.15rem, 1.05rem + .4vw, 1.4rem)/1.3 var(--titre); color: var(--encre); }
.surface--graphite .sous-titre-section { color: var(--blanc-tech, #F2F3F1); }
.photo--bandeau { aspect-ratio: 21 / 9; margin-top: clamp(28px, 4vw, 48px); }
.texte-colonne { max-width: 76ch; margin-top: clamp(22px, 3vw, 32px); color: var(--encre-2); }
.texte-colonne p + p { margin-top: 14px; }
.groupes-lieux + .texte-colonne { margin-top: clamp(26px, 3vw, 36px); }
.video-cadre--large { max-width: 1040px; margin-top: clamp(28px, 4vw, 48px); }
.fiche--colonnes { margin-top: clamp(26px, 3vw, 36px); grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(24px, 4vw, 56px); }
@media (max-width: 767px) {
  .photo--bandeau { aspect-ratio: 4 / 3; }
  .fiche--colonnes { grid-template-columns: minmax(0, 1fr); }
}

/* --- Gabarit Valence appliqué à toutes les pages converties (0.3.0, 13/10/2026) --- */
/* Premier écran : modules historiques (H1, introduction, boutons) posés sur la photo plein format */
.hero--gabarit .hero-modules { display: grid; gap: 0; }
.hero--gabarit .hero-modules .m { margin: 0; }
.hero--gabarit .hero-module--titre { color: var(--blanc-tech); }
.hero--gabarit .hero-module--titre h1 { max-width: 22ch; margin: 0; color: var(--blanc-tech); font-family: var(--titre); font-weight: var(--titre-graisse); font-size: clamp(36px, 4.2vw, 68px); line-height: 1.02; letter-spacing: -.025em; text-wrap: balance; }
.hero--gabarit .hero-module--titre :is(p, h2, h3) { margin-top: 18px; max-width: 58ch; color: #D9DCDF; font: 500 clamp(16px, 15px + .3vw, 18px)/1.55 var(--texte); }
.hero--gabarit .hero-module--desc { max-width: 60ch; margin-top: 24px !important; color: #D9DCDF; font-size: clamp(16px, 15px + .3vw, 17.5px); line-height: 1.6; }
.hero--gabarit .hero-module--desc :is(p, li) { color: #D9DCDF; }
.hero--gabarit .hero-module--desc a { color: var(--blanc-tech); }
.hero--gabarit .hero-module--ariane { order: -1; margin-bottom: 18px !important; font: 500 11px/1.4 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--gris-2); }
.hero--gabarit .hero-module--ariane :is(p, a) { color: var(--gris-1); font: inherit; text-decoration: none; }
.hero--gabarit .hero-module--bouton { display: inline-flex; margin-top: 28px !important; margin-right: 12px !important; }
.hero--gabarit .hero-module--bouton + .hero-module--bouton { margin-top: 12px !important; }
.hero--gabarit .hero-module--bouton ~ .hero-module--bouton .bouton { background: transparent; color: var(--blanc-tech); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .45); }
.hero--gabarit .hero-modules > .hero-module--bouton:first-of-type { margin-top: 30px !important; }
@media (min-width: 640px) {
  .hero--gabarit .hero-modules { grid-template-columns: max-content max-content 1fr; }
  .hero--gabarit .hero-modules > :not(.hero-module--bouton) { grid-column: 1 / -1; }
}
.hero--gabarit .ancre { display: block; }

/* Corps des pages : une colonne, rythme et titres façon Valence */
.page-contenu > .bloc { padding-block: clamp(56px, 7vw, 112px); }
.page-contenu .rangee--colonnes { grid-template-columns: minmax(0, 1fr); max-width: 920px; gap: clamp(22px, 3vw, 36px); }
.page-contenu .rangee--colonnes .col { gap: 20px; }
.page-contenu .m--image img { max-height: 620px; width: auto; max-width: 100%; margin-inline: auto; object-fit: contain; }
.page-contenu .m--image { display: flex; justify-content: center; }
.page-contenu .prose h2 { position: relative; padding-top: 22px; font-size: clamp(1.7rem, 1.25rem + 1.6vw, 2.6rem); line-height: 1.1; letter-spacing: -.02em; }
.page-contenu .prose h2::before { content: ""; position: absolute; left: 0; top: 0; width: 44px; height: 3px; background: var(--jaune); }
.page-contenu .prose h2:empty::before { display: none; }
.page-contenu .prose h3 { font-size: clamp(1.25rem, 1.1rem + .5vw, 1.6rem); }
.page-contenu .prose p, .page-contenu .prose li { font-size: clamp(16px, 15.5px + .2vw, 17.5px); line-height: 1.7; }
.page-contenu .prose a { color: var(--encre); text-decoration-color: var(--jaune); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.page-contenu .m--carte-info { padding: 24px; border-radius: var(--r-carte); background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.page-contenu .bloc--suite-entete { padding-top: clamp(40px, 5vw, 72px); }
.hero--gabarit .hero-modules :is(strong, b, em, span, mark) { color: inherit; background: none; }
.hero--gabarit .hero-module--titre h1 :is(strong, b) { font-weight: inherit; }
/* Vague 1 (15/10/2026) : bloc « réponse immédiate » placé juste après le premier écran */
.page-contenu > .bloc--reponse { padding-block: clamp(32px, 4vw, 56px); }
.page-contenu .reponse-immediate { display: grid; gap: 14px; padding: clamp(20px, 3vw, 32px); border-left: 4px solid var(--jaune); border-radius: 0 var(--r-carte) var(--r-carte) 0; background: var(--carte); outline: 1px solid var(--filet); outline-offset: -1px; }
.page-contenu .reponse-immediate > p:not(.reponse-immediate-titre) { margin: 0; font-size: 1.08rem; line-height: 1.6; color: var(--encre); }
.page-contenu .reponse-immediate .reponse-immediate-titre { margin: 0; font: 600 12px/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); }
.page-contenu .reponse-immediate h2 { margin-top: clamp(12px, 2vw, 20px); font-size: clamp(1.25rem, 1.1rem + .6vw, 1.6rem); }
.page-contenu .reponse-immediate table th:first-child { white-space: nowrap; }

/* =============================================================================
   Refonte 2026 — modèle éditorial (guides nationaux) et modèle commercial
   Lecture confortable, sommaire, encadrés, tableaux, FAQ, atlas. Animations légères (prefers-reduced-motion respecté).
   ============================================================================= */
.page-contenu > .bloc--guide, .page-contenu > .bloc--commercial { padding-block: clamp(40px, 5vw, 80px); background: var(--blanc); --fond: var(--blanc); --carte: var(--papier); }
.guide { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; width: 100%; max-width: 1180px; margin-inline: auto; padding-inline: var(--marge); }
@media (min-width: 1100px) {
  .guide { grid-template-columns: 250px minmax(0, 760px); justify-content: center; column-gap: 64px; }
  .guide--sans-sommaire { grid-template-columns: minmax(0, 760px); }
  .guide-sommaire { position: sticky; top: calc(var(--entete-h) + 28px); align-self: start; max-height: calc(100vh - var(--entete-h) - 56px); overflow-y: auto; }
}
.guide-sommaire { font-size: 14px; }
.guide-sommaire details { border-radius: var(--r-carte); }
.guide-sommaire summary { cursor: pointer; padding: 12px 0; font: 600 12px/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); }
.guide-sommaire ol { list-style: none; margin: 4px 0 0; padding: 0; border-left: 2px solid var(--filet); }
.guide-sommaire li a { display: block; margin-left: -2px; padding: 6px 0 6px 14px; border-left: 2px solid transparent; color: var(--encre-2); line-height: 1.35; text-decoration: none; }
.guide-sommaire li a:hover, .guide-sommaire li a[aria-current="true"] { color: var(--encre); border-left-color: var(--jaune); }
@media (max-width: 1099px) { .guide-sommaire details { padding: 0 18px 10px; background: var(--papier); outline: 1px solid var(--filet); outline-offset: -1px; } }
.guide-corps, .commercial-corps { font-size: 1.04rem; line-height: 1.72; color: var(--encre-2); }
.commercial-corps { max-width: 920px; }
.guide-corps :is(h2, h3, h4), .commercial-corps :is(h2, h3, h4) { scroll-margin-top: calc(var(--entete-h) + 20px); }
.guide-corps h2::after, .commercial-corps h2::after { content: ""; display: block; width: 44px; height: 3px; margin-top: 14px; background: var(--jaune); }
.guide-corps p, .guide-corps ul, .guide-corps ol { margin-block: 0 1em; }
.guide-meta { margin: 0 0 28px; font: 500 12px/1.5 var(--mono); letter-spacing: .04em; color: var(--encre-3); }
.guide-meta a { color: inherit; }
.guide-section + .guide-section { margin-top: clamp(36px, 4vw, 56px); }
.guide-figure { margin: 26px 0; overflow: hidden; border-radius: var(--r-photo); }
.guide-figure img { display: block; width: 100%; height: auto; }
.guide-figure figcaption { padding-top: 8px; font-size: 13px; color: var(--encre-3); }
.encadre { margin: 26px 0; padding: 18px 22px; border-radius: var(--r-carte); background: var(--papier); outline: 1px solid var(--filet); outline-offset: -1px; }
.encadre > :last-child { margin-bottom: 0; }
.encadre--retenir { border-left: 4px solid var(--jaune); border-radius: 0 var(--r-carte) var(--r-carte) 0; }
.encadre--retenir::before { content: "À retenir"; display: block; margin-bottom: 10px; font: 600 12px/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); }
.encadre--retenir ul { margin: 0; padding-left: 1.1em; }
.cartes-signes { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin: 22px 0; padding: 0; list-style: none; }
.cartes-signes li { display: grid; gap: 6px; padding: 18px 20px; border-radius: var(--r-carte); background: var(--papier); outline: 1px solid var(--filet); outline-offset: -1px; font-size: .97rem; line-height: 1.55; }
.cartes-signes .carte-titre { color: var(--encre); }
.etapes-liste { counter-reset: etape; margin: 22px 0; padding: 0; list-style: none; }
.etapes-liste > li { counter-increment: etape; position: relative; margin: 0 0 18px; padding-left: 52px; }
.etapes-liste > li::before { content: counter(etape); position: absolute; left: 0; top: -2px; width: 34px; height: 34px; border-radius: 50%; background: var(--jaune); color: #101010; font: 700 15px/34px var(--titre); text-align: center; }
.tableau-defile { margin: 22px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tableau-defile:focus-visible { outline: 2px solid var(--jaune); outline-offset: 2px; }
.page-contenu .tableau-defile table { min-width: 520px; }
.guide-corps .faq-item, .commercial-corps .faq-item { border-bottom: 1px solid var(--filet); }
.faq-item summary { position: relative; cursor: pointer; padding: 18px 40px 18px 0; list-style: none; font-weight: 600; color: var(--encre); line-height: 1.4; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; position: absolute; right: 6px; top: 14px; font: 400 24px/1 var(--titre); color: var(--encre-3); }
.faq-item[open] summary::after { content: "–"; }
.faq-reponse { padding-bottom: 14px; }
.sources-liste { padding-left: 1.2em; font-size: 14px; line-height: 1.55; color: var(--encre-3); }
.sources-liste a { overflow-wrap: anywhere; }
.guides-lies { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin: 20px 0; padding: 0; list-style: none; }
.guides-lies li a { display: block; height: 100%; padding: 16px 18px; border-radius: var(--r-carte); background: var(--papier); outline: 1px solid var(--filet); outline-offset: -1px; color: var(--encre); font-weight: 600; text-decoration: none; }
.guides-lies li a:hover { outline-color: var(--jaune); }
.guide-action { margin: 26px 0; }
.guide-video { aspect-ratio: 16 / 9; margin: 24px 0; }
.guide-video iframe { width: 100%; height: 100%; border: 0; border-radius: var(--r-photo); }
/* Atlas des nuisibles */
.atlas-filtres { display: grid; gap: 12px; margin: 8px 0 28px; padding: 18px; border-radius: var(--r-carte); background: var(--papier); outline: 1px solid var(--filet); outline-offset: -1px; }
.atlas-filtres label { font: 600 12px/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); }
.atlas-filtres input { width: 100%; padding: 12px 14px; border: 1px solid var(--filet); border-radius: var(--r-bouton); font: inherit; background: var(--blanc); color: var(--encre); }
.atlas-pieces { display: flex; flex-wrap: wrap; gap: 8px; }
.atlas-pieces button { padding: 8px 14px; border: 1px solid var(--filet); border-radius: 999px; background: var(--blanc); color: var(--encre); font: 500 14px/1.2 var(--texte); cursor: pointer; }
.atlas-pieces button[aria-pressed="true"] { background: var(--jaune); border-color: var(--jaune); color: #101010; }
.atlas-compte { margin: 0; font-size: 14px; color: var(--encre-3); }
.fiche-espece { margin: 0 0 18px; padding: clamp(18px, 3vw, 28px); border-radius: var(--r-carte); background: var(--papier); outline: 1px solid var(--filet); outline-offset: -1px; scroll-margin-top: calc(var(--entete-h) + 20px); }
.fiche-espece[hidden] { display: none; }
.fiche-espece h2 { margin-bottom: 14px; }
.fiche-espece-donnees { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px 24px; margin: 0; }
@media (min-width: 700px) { .fiche-espece-donnees { grid-template-columns: 170px minmax(0, 1fr); } }
.fiche-espece-donnees dt { padding-top: 10px; font: 600 12px/1.4 var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--encre-3); }
.fiche-espece-donnees dd { margin: 0; padding: 8px 0; border-bottom: 1px solid var(--filet); font-size: .97rem; line-height: 1.55; }
.fiche-espece-liens { margin: 14px 0 0; font-size: 14px; }
.fiche-lien-principal { font-weight: 600; }
/* Progression de lecture et apparitions */
.progression-lecture { position: fixed; top: 0; left: 0; right: 0; z-index: 60; height: 3px; background: var(--jaune); transform: scaleX(0); transform-origin: 0 50%; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  .js-apparition { opacity: 0; transform: translateY(14px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
  .js-apparition.est-visible { opacity: 1; transform: none; }
  .guide-figure img { transition: transform .5s var(--ease); }
  .guide-figure:hover img { transform: scale(1.02); }
}
@media print { .guide-sommaire, .progression-lecture, .atlas-filtres { display: none; } }
.guide-corps, .commercial-corps { overflow-wrap: break-word; }
/* Accueil — refonte du 15/10/2026 : familles de nuisibles, guides consultés, sites locaux, FAQ */
.familles-fr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
@media (max-width: 1023px) { .familles-fr { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 559px) { .familles-fr { grid-template-columns: minmax(0, 1fr); } }
.familles-fr a { position: relative; display: grid; gap: 8px; height: 100%; padding: 22px 48px 22px 22px; border-radius: var(--r-carte); background: var(--blanc); outline: 1px solid var(--filet-clair); outline-offset: -1px; color: var(--encre-claire); text-decoration: none; }
.familles-fr a:hover { outline-color: var(--jaune); }
.familles-fr-nom { font: var(--titre-graisse) 1.2rem/1.2 var(--titre); }
.familles-fr-indice { font-size: 14px; line-height: 1.5; color: var(--encre-claire-3); }
.familles-fr .selecteur-fleche { position: absolute; right: 20px; top: 22px; }
.familles-fr-atlas { margin: 28px 0 0; }
.guides-accueil { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; margin: 36px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--filet-clair); }
@media (max-width: 767px) { .guides-accueil { grid-template-columns: minmax(0, 1fr); } }
.guides-accueil a { display: flex; justify-content: space-between; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--filet-clair); color: var(--encre-claire); font-weight: 600; text-decoration: none; }
.guides-accueil a:hover { color: #000; text-decoration: underline; text-decoration-color: var(--jaune); }
.sites-locaux { margin: 28px 0 0; font-size: 15px; line-height: 1.8; color: var(--encre-2); }
.sites-locaux span { font: 600 12px/1.3 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.sites-locaux a { color: inherit; }
.faq-accueil { max-width: 860px; }
.faq-accueil .faq-item { border-bottom: 1px solid var(--filet-clair); }
.faq-accueil .faq-item summary { color: var(--encre-claire); }
.faq-accueil .faq-reponse { color: var(--encre-claire-2); line-height: 1.7; }
/* Plan du site (audit final 15/10/2026) */
.plan-site-liste { columns: 2 300px; column-gap: 40px; padding-left: 1.1em; }
.plan-site-liste li { break-inside: avoid; margin-bottom: 6px; }
/* Audit final : liens longs du pied (adresse e-mail) coupés sur très petit écran (320 px) */
.pied-colonnes a { overflow-wrap: anywhere; }
.guide-video video { display: block; width: 100%; height: 100%; border-radius: var(--r-photo); background: var(--carbone); }
/* Visuels de marque (15/10/2026) : remplacent des illustrations génériques dans tous les gabarits de contenu */
picture.visuel-marque { display: block; max-width: 100%; overflow: hidden; border-radius: var(--r-photo); }
picture.visuel-marque img { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.hero picture img, .hero-fond picture img { aspect-ratio: auto; }
/* Libellés d'appel plus longs (« Obtenir un devis personnalisé ») : retour à la ligne sur petit écran, jamais de débordement */
@media (max-width: 599px) {
  .bouton { white-space: normal; max-width: 100%; text-align: center; }
  .groupe-boutons, .guide-action { flex-wrap: wrap; max-width: 100%; }
}
/* Bandeau des services incliné : jamais de défilement horizontal du document (clip ne crée pas de conteneur de défilement : sticky préservé) */
html { overflow-x: clip; }
/* Accueil : vidéo « Léa de Sanipure » dans la section « Pourquoi choisir SANIPURE ? » (déplacée du premier écran) */
.pourquoi-video { position: relative; }
.pourquoi-video video { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--r-photo); background: var(--carbone); }
.pourquoi-video::before { content: ""; position: absolute; left: 0; top: 0; z-index: 2; width: 64px; height: 3px; background: var(--jaune); pointer-events: none; }
/* Accueil : zone d'intervention (15/10/2026) — régions en cartes sombres, plus de grille blanche */
.zones-fr { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.zones-fr-intro { position: sticky; top: 110px; }
.zones-fr-intro .entete-section { margin-bottom: 0; }
.zones-fr-chiffre { display: flex; align-items: center; gap: 18px; margin: clamp(26px, 3vw, 40px) 0 14px; }
.zones-fr-chiffre strong { font: 800 clamp(4.5rem, 3rem + 5vw, 7.5rem)/.85 var(--titre, var(--texte)); color: var(--jaune); letter-spacing: -.04em; }
.zones-fr-chiffre span { font: 600 1.05rem/1.25 var(--texte); color: var(--blanc-tech, #fff); text-transform: uppercase; letter-spacing: .06em; }
.zones-fr-dispo { display: flex; align-items: center; gap: 10px; margin: 0 0 26px; font: 500 .95rem/1.4 var(--texte); color: var(--gris-1); }
.zones-fr-dispo .picto { --picto-t: 18px; color: var(--jaune); }
.zones-fr-regions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.zones-fr-region { padding: 24px 24px 12px; border: 1px solid rgba(255, 255, 255, .09); border-radius: var(--r-carte, 18px); background: #1A1B1C; }
.zones-fr-region h3 { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 0 10px; padding-bottom: 14px; border-bottom: 2px solid var(--jaune); font-size: 1.15rem; color: var(--blanc-tech, #fff); }
.zones-fr-region h3 span { font: 500 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--gris-1); white-space: nowrap; }
.zones-fr-region ul { margin: 0; padding: 0; list-style: none; }
.zones-fr-region li + li { border-top: 1px solid rgba(255, 255, 255, .07); }
.zones-fr-region a { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 14px 4px; color: var(--blanc-tech, #fff); text-decoration: none; transition: background-color .2s ease; border-radius: 8px; }
.zones-fr-region a:hover, .zones-fr-region a:focus-visible { background: rgba(255, 174, 0, .08); }
.zones-fr-num { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 8px; background: rgba(255, 174, 0, .12); font: 600 12px/1 var(--mono); color: var(--jaune); letter-spacing: .06em; }
.zones-fr-ville { display: grid; gap: 3px; font: 700 1.05rem/1.2 var(--texte); }
.zones-fr-ville small { font: 500 .82rem/1.3 var(--texte); color: var(--gris-1); }
.zones-fr-lien { font: 500 10.5px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--jaune); white-space: nowrap; }
.zones-fr .sites-locaux { grid-column: 1 / -1; margin-top: 8px; }
@media (max-width: 1023px) {
  .zones-fr { grid-template-columns: minmax(0, 1fr); }
  .zones-fr-intro { position: static; }
}
@media (max-width: 599px) {
  .zones-fr-regions { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .zones-fr-region:first-child { grid-row: auto; }
  .zones-fr-region { padding: 20px 16px 8px; }
  .zones-fr-lien { display: none; }
  .zones-fr-region a { grid-template-columns: 44px minmax(0, 1fr) 16px; }
  .zones-fr-region a::after { content: "→"; font-family: var(--mono); color: var(--jaune); }
}
/* Titres surlignés en jaune (fonds clairs) : sur deux lignes, un espace net sépare les bandes (demande du 15/10/2026) */
:is(.surface--blanc, .surface--papier) :is(h2, .titre-2):has(em) { line-height: 1.5; }
:is(.surface--blanc, .surface--papier) :is(h2, .titre-2) em { padding: .02em .16em; }
/* Page contact (15/10/2026) : trois cartes de contact à la place des gros boutons empilés */
.contact-cartes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; width: 100%; margin-top: clamp(16px, 2vw, 28px); }
.contact-carte { position: relative; display: grid; align-content: start; gap: 8px; padding: 26px 24px 24px; border: 1px solid var(--filet, #E3E3DE); border-radius: var(--r-carte, 10px); background: var(--blanc, #fff); overflow: hidden; }
.contact-carte::before { content: ""; position: absolute; left: 0; top: 0; width: 64px; height: 3px; background: var(--jaune); }
.contact-carte .picto { --picto-t: 20px; display: inline-grid; place-items: center; width: 44px; height: 44px; margin-bottom: 6px; border-radius: 50%; background: rgba(255, 174, 0, .16); color: var(--carbone, #111); }
.contact-carte-etiquette { margin: 0; font: 500 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: #6B7075; }
.contact-carte-valeur { justify-self: start; font: 700 clamp(1.15rem, 1rem + .5vw, 1.4rem)/1.25 var(--titre, var(--texte)); color: var(--encre, #111); text-decoration: none; overflow-wrap: anywhere; background: linear-gradient(var(--jaune), var(--jaune)) 0 100% / 0 2px no-repeat; transition: background-size .25s ease; }
.contact-carte-valeur:hover, .contact-carte-valeur:focus-visible { background-size: 100% 2px; }
.contact-carte-detail { margin: 0; font: 400 .92rem/1.45 var(--texte); color: #5F656B; }
@media (max-width: 899px) { .contact-cartes { grid-template-columns: minmax(0, 1fr); gap: 14px; } }

/* Premier écran de l'accueil sur le modèle de SANIPURE Grenoble (16/10/2026) : texte à gauche, photo encadrée à droite,
   sans voile ; sur mobile et tablette, la photo passe au-dessus du texte. La bande de services suit la grille. */
.hero--grenoble { position: relative; overflow: hidden; }
.hero--grenoble .hero-grille { grid-template-columns: minmax(0, 12fr) minmax(0, 13fr); min-height: min(calc(100svh - var(--entete-h) - 110px), 720px); padding-block: clamp(28px, 4vh, 48px) clamp(20px, 3vh, 32px); }
.hero--grenoble .hero-texte { min-width: 0; max-width: 600px; }
.hero--grenoble .surtitre { margin-bottom: 20px; font-size: 11.5px; letter-spacing: .12em; color: var(--gris-1); }
.hero--grenoble .hero-titre { max-width: none; font-weight: 700; font-size: clamp(2.6rem, 1.2rem + 2.6vw, 4rem); letter-spacing: -.004em; }
.hero--grenoble .hero-valeurs { margin-top: 22px; }
.hero--grenoble .hero-desc { margin-top: 16px; font-size: 15.5px; }
.hero--grenoble .groupe-boutons { margin-top: 28px; }
.hero--grenoble .bouton--contour { border-color: rgba(243, 243, 240, .55); color: var(--blanc-tech); }
.hero--grenoble .hero-notes { margin-top: 20px; color: var(--gris-2); }
.hero--grenoble .preuves { margin-top: 22px; }
.hero--grenoble .hero-photo { justify-self: end; width: min(100%, calc((100svh - var(--entete-h) - 150px) * 1.3)); aspect-ratio: 1.3; margin: 0; }
.hero--grenoble .hero-photo::before { content: ""; position: absolute; inset: 14px; z-index: 3; pointer-events: none; --c: rgba(255, 255, 255, .78); --l: 18px;
  background: linear-gradient(var(--c), var(--c)) top left / var(--l) 1px no-repeat, linear-gradient(var(--c), var(--c)) top left / 1px var(--l) no-repeat,
              linear-gradient(var(--c), var(--c)) top right / var(--l) 1px no-repeat, linear-gradient(var(--c), var(--c)) top right / 1px var(--l) no-repeat,
              linear-gradient(var(--c), var(--c)) bottom left / var(--l) 1px no-repeat, linear-gradient(var(--c), var(--c)) bottom left / 1px var(--l) no-repeat,
              linear-gradient(var(--c), var(--c)) bottom right / var(--l) 1px no-repeat, linear-gradient(var(--c), var(--c)) bottom right / 1px var(--l) no-repeat; }
.hero--grenoble .hero-photo picture, .hero--grenoble .hero-photo img { display: block; width: 100%; height: 100%; }
.hero--grenoble .bande-services { position: relative; bottom: auto; margin: 6px 0 30px; }
@media (max-width: 1180px) {
  .hero--grenoble .hero-grille { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .hero--grenoble .hero-titre { font-size: clamp(2.4rem, 1rem + 2.6vw, 3.2rem); }
}
@media (max-width: 899px) {
  .hero--grenoble .hero-grille { display: flex; flex-direction: column; min-height: 0; padding: 0; }
  .hero--grenoble .hero-photo { order: -1; justify-self: auto; width: 100%; aspect-ratio: 1.6; border-radius: 0; }
  .hero--grenoble .hero-photo::before { inset: 10px; --l: 14px; }
  .hero--grenoble .hero-texte { width: 100%; max-width: 680px; padding: 22px var(--marge) 26px; }
  .hero--grenoble .hero-titre { font-size: clamp(2.1rem, 1.3rem + 3.4vw, 3rem); }
  .hero--grenoble .groupe-boutons { flex-direction: column; align-items: stretch; }
  .hero--grenoble .bande-services { margin: 0 0 26px; }
}
@media (max-width: 599px) {
  .hero--grenoble .surtitre { font-size: 10.5px; letter-spacing: .1em; }
  .hero--grenoble .hero-desc { font-size: 15px; }
  .hero--grenoble .preuve { min-height: 46px; gap: 9px; font-size: 14px; }
  .hero--grenoble .preuve--google img { width: 26px; height: 26px; margin-left: 6px; }
  .hero--grenoble .preuve--label img { height: 30px; }
}
.hero--grenoble .hero-titre .hero-titre-jaune { font-weight: 700; color: var(--jaune); } /* comme le H1 de SANIPURE Grenoble */
@media (max-width: 899px) { .hero--grenoble .hero-photo img { object-position: 55% 26%; } }

/* Bloc « Observations de terrain » (bibliothèque d'expertise terrain, 17/10/2026) : constats réels issus des rapports
   d'intervention, signés collectivement (pastille pictogramme) ou par un technicien réel (pastille photo, avec son accord). */
.terrain { margin: 0; padding: clamp(20px, 3vw, 32px); border-left: 4px solid var(--jaune); border-radius: 0 var(--r-carte) var(--r-carte) 0; background: var(--carte, #F7F6F1); outline: 1px solid var(--filet, #E4E2DC); outline-offset: -1px; }
.terrain .terrain-entete { display: flex; align-items: center; gap: 14px; margin: 0 0 18px; }
.terrain .terrain-entete > div { min-width: 0; }
.terrain-pastille { flex: none; display: grid; place-items: center; width: 56px; height: 56px; overflow: hidden; border-radius: 50%; background: var(--jaune); color: var(--carbone); box-shadow: 0 0 0 3px #fff, 0 0 0 4px rgba(11, 12, 13, .08); }
.terrain-pastille img { width: 100%; height: 100%; object-fit: cover; }
.prose .terrain p.terrain-surtitre, .terrain p.terrain-surtitre { margin: 0; max-width: none; font: 600 11px/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--encre-3, #6B7075); }
.prose .terrain p.terrain-signature, .terrain p.terrain-signature { margin: 3px 0 0; max-width: none; font: 600 15px/1.3 var(--titre); color: var(--encre, #0B0C0D); }
.terrain h2 { margin-top: 0; }
.terrain-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 20px 0 4px; }
.terrain-photos--1 { grid-template-columns: minmax(0, 560px); }
.terrain-photo { margin: 0; }
.terrain-photo img { display: block; width: 100%; height: auto; max-height: 440px; object-fit: cover; border-radius: var(--r-photo, 8px); }
.prose .terrain .terrain-photo figcaption, .terrain .terrain-photo figcaption { margin-top: 8px; font: 400 .88rem/1.45 var(--texte); color: var(--encre-2, #5F656B); }
.prose .terrain p.terrain-note, .terrain p.terrain-note { margin: 14px 0 0; font: italic 400 .86rem/1.5 var(--texte); color: var(--encre-3, #6B7075); }
@media (max-width: 599px) { .terrain-photos { grid-template-columns: minmax(0, 1fr); } .terrain-pastille { width: 48px; height: 48px; } }
.prose .terrain p.terrain-lien, .terrain p.terrain-lien { margin: 14px 0 0; font: 600 .92rem/1.4 var(--texte); }



/* ==========================================================================
   Adaptations WordPress (thème bloc)
   ========================================================================== */
/* Les enveloppes ajoutées par WordPress ne doivent pas casser la mise en page (en-tête collant, barre mobile) */
.wp-site-blocks { padding: 0; }
.wp-block-template-part, .wp-block-post-content { display: contents; }
.wp-site-blocks > * + *, .wp-block-post-content > * + *, main.wp-block-group > * + * { margin-block-start: 0; }
main.wp-block-group { display: block; }
/* Barre d'administration WordPress (connecté) */
body.admin-bar .entete { top: 32px; }
@media (max-width: 782px) { body.admin-bar .entete { top: 46px; } }
@media (max-width: 600px) { body.admin-bar .entete { top: 0; } }

/* Archives (catégories, auteur, dates) : structure historique (image, titre H2, « par … | date | catégorie », extrait) */
.page-archive .rangee { max-width: 920px; }
.archive-articles { display: grid; gap: clamp(32px, 4vw, 48px); margin: 0; padding: 0; list-style: none; }
.archive-articles > li { display: grid; gap: 12px; padding-bottom: clamp(32px, 4vw, 48px); border-bottom: 1px solid var(--filet); }
.archive-articles .wp-block-post-featured-image img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--r-photo); }
.archive-articles .wp-block-post-title { font: var(--titre-graisse) clamp(1.4rem, 1.2rem + .8vw, 2rem)/1.15 var(--titre); letter-spacing: var(--titre-approche); }
.archive-articles .wp-block-post-title a { color: var(--encre); text-decoration: none; }
.archive-articles .wp-block-post-title a:hover { text-decoration: underline; text-decoration-color: var(--jaune); text-decoration-thickness: 2px; }
.archive-meta { display: flex; flex-wrap: wrap; gap: 6px; font: 500 12px/1.4 var(--mono); letter-spacing: .06em; color: var(--encre-3); }
.archive-meta > * { margin: 0; }
.archive-meta a { color: var(--encre-2); }
.page-archive .wp-block-query-pagination { display: flex; justify-content: space-between; gap: 16px; margin-top: 32px; font-weight: 600; }
.page-archive .wp-block-query-pagination a { color: var(--encre); }