/* =====================================================================
   Corrections de mise en page — pages "contenu" (Qui sommes-nous, Contact)
   Ajouté lors du clonage statique. Chargé uniquement sur ces 2 pages,
   donc sans effet sur les pages Elementor (accueil, isolation, etc.).
   ===================================================================== */

:root { --mdc-teal: #265858; --mdc-teal-2: #54b6b6; }

/* Le header est "sticky" (fixe, 80px) : on dégage le contenu pour qu'il ne
   passe jamais dessous, et on gère les ancres proprement. */
html { scroll-padding-top: 100px; }
.page-header .entry-title,
.page-content h2,
.page-content h3 { scroll-margin-top: 100px; }

/* ------------------------- Qui sommes-nous ------------------------- */

/* En-tête de page : titre centré, en teal, bien dégagé du header */
.page-header { text-align: center; padding: 110px clamp(20px, 5vw, 40px) 4px; }
.page-header .entry-title { font-size: 2.4rem; color: var(--mdc-teal); margin: 0; }

/* Colonne de lecture centrée, marges latérales confortables et responsives */
.site-main { padding-bottom: 96px; }
.site-main .page-content {
  max-width: 820px;
  margin: 0 auto;
  padding: 32px clamp(20px, 5vw, 40px) 0;
}

/* Masquer les images placeholder cassées (et les <p> qui ne contenaient qu'elles) */
.page-content img[src*="placeholder.png"] { display: none !important; }
.page-content p:has(> img[src*="placeholder.png"]) { display: none !important; }

/* Masquer le H1 dupliqué dans le contenu (déjà affiché dans .page-header) */
.page-content > h1:first-of-type { display: none; }

/* Rythme vertical lisible */
.page-content h2,
.page-content h3 {
  color: var(--mdc-teal);
  margin: 2.2rem 0 .55rem;
  line-height: 1.3;
}
.page-content h3 + h3 { margin-top: .15rem; }   /* label + sous-titre qui se suivent */
.page-content p {
  margin: 0 0 1.15rem;
  line-height: 1.75;
  font-size: 1.05rem;
}

/* ----------------------------- Contact ---------------------------- */

/* Le contenu brut (h1/h2/p) est encapsulé dans .clone-page → centré + aéré */
.clone-page {
  max-width: 720px;
  margin: 0 auto;
  padding: 110px clamp(20px, 5vw, 40px) 100px;
  text-align: center;
}
.clone-page h1 { font-size: 2.4rem; color: var(--mdc-teal); margin: 0 0 .3rem; }
.clone-page h2 { font-size: 1.5rem; color: var(--mdc-teal-2); font-weight: 600; margin: 0 0 1.6rem; }
.clone-page p { line-height: 1.8; font-size: 1.08rem; margin: 0 0 1.1rem; color: #444; }
.clone-page a { color: var(--mdc-teal); font-weight: 600; text-decoration: none; }
.clone-page a:hover { text-decoration: underline; }