/*FONTS https://fonts.googleapis.com/css2?family=Archivo:wght@500;700;900&family=Public+Sans:wght@400;600&display=swap */
/* CHANTIER : BTP (maçon, couvreur, plombier, charpentier, terrassier).
   Grotesque très bold, contrastes francs, anthracite + accent sécurité, angles nets. */

:root {
  --bg: #F4F5F4;
  /* Alternance des fonds : une section sur deux (base.css, classes bande-a / bande-b
     posées par build.js selon le RANG de la section, pas son nom). */
  --bande-a: #F4F5F4;
  --bande-b: #FFFFFF;
  --surface: #FFFFFF;
  --ink: #1E2226;
  --muted: #5C6369;
  --line: #D5D9DC;
  --accent: #E4A50F;
  --accent-fonce: #96700B;
  --sur-accent: #1E2226;
  --font-display: "Archivo", "Arial Black", sans-serif;
  --font-body: "Public Sans", "Segoe UI", sans-serif;
  --poids-titre: 900;
  --radius: 0;
  --radius-img: 0;
  --header-bg: #1E2226;
  --vitesse-reveal: 0.4s;
  --sobre-bg: #1E2226;
  --sobre-ink: #F4F5F4;
  --sobre-accent: #E4A50F;
  --hero-voile: linear-gradient(to top, rgba(18, 20, 23, 0.82) 0%, rgba(18, 20, 23, 0.3) 50%, rgba(18, 20, 23, 0.12) 100%);
}

h1, h2 { text-transform: uppercase; letter-spacing: 0.01em; }
h2 { border-left: 6px solid var(--accent); padding-left: 18px; }

.site-header { border-bottom: none; }
.site-header .brand-name, .site-header .header-tel { color: #F4F5F4; }
/* en-tête sombre : un logo en encre noire y disparaîtrait, on lui donne un fond clair */
.site-header .brand-logo { background: #FFFFFF; padding: 5px 9px; }
.site-header .header-tel { color: var(--accent); }

.hero-metier { color: var(--accent-fonce); }
.hero-plein .hero-metier { color: var(--accent); }

.btn { font-weight: 700; text-transform: uppercase; font-size: 0.92rem; letter-spacing: 0.04em; }

.service { border-top: 2px solid var(--ink); }
.service:last-child { border-bottom: 2px solid var(--ink); }
.service h3 { text-transform: uppercase; font-size: 1.05rem; letter-spacing: 0.03em; }

.contact {
  background: #1E2226; color: #F0F1F1;
  --muted: #AEB4B9; --line: #3A4046; --champ-bg: #292E33;
  --ink: #F0F1F1; --accent-fonce: var(--accent);
}
.contact h2 { color: #F0F1F1; }

/* Footer sombre : redéfinir les jetons pour que le contenu reste lisible */
.site-footer {
  background: #16191C; border-top: none; color: #AEB4B9;
  --muted: #AEB4B9; --ink: #F0F1F1; --accent-fonce: var(--accent);
}
.site-footer .footer-nap strong { color: #F0F1F1; }

/* réglages de style de la fiche */
:root { --radius-img: 0; --radius-photo: 0; --radius: 4px; }
.site-header { background: #0a4a94; }

/* accent client */
:root { --accent: #ef2329; --accent-fonce: #c60e14; --sur-accent: #FFFFFF; --sobre-bg: #281011; --sobre-accent: #e57679; }
:root { --marque-fond: #ffffff; }

/* DA libre du client (content.json → style.css) */
body, h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; }
.site-header { border-bottom: 4px solid var(--accent); }
.hero { background-color: #0a4a94; color: white; box-shadow: 0 0 0 100vmax #0a4a94; clip-path: inset(0 -100vmax); }
.hero h1, .hero .hero-sous, .hero .hero-metier { color: white !important; }
.site-header .brand-logo { height: clamp(55px, 8vw, 80px) !important; max-width: 250px !important; }
.site-header .brand-name { display: none !important; }