/* Styles du modèle « Page SEO » — complète Bootstrap, surchargeable par le thème. */

.lm-seo-page {
    --lm-seo-max: 1100px;
    --lm-seo-accent: #16a34a;
    color: #111827;
}

/* En-tête (hero) */
.lm-seo-hero {
    background-size: cover;
    background-position: center;
    padding: 5rem 1.5rem;
    text-align: center;
    color: #fff;
    position: relative;
}
.lm-seo-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .45);
}
.lm-seo-hero__inner {
    position: relative;
}
.lm-seo-hero__title {
    font-size: clamp(2rem, 4vw, 3rem);
    margin: 0 0 1rem;
}
.lm-seo-hero__subtitle {
    font-size: 1.25rem;
    margin: 0 auto 1.5rem;
    max-width: 60ch;
}

/* Sections */
.lm-seo-section { padding: 3rem 1.5rem; }

/* Bannière (image pleine largeur) */
.lm-seo-section--banner { padding: 0; }
.lm-seo-banner__img { display: block; }
.lm-seo-banner__link { display: block; }

/* 2 colonnes : la position gauche/droite est gérée via les classes
   Bootstrap (order-md-first) dans le template. */
.lm-seo-grid__media img { width: 100%; height: auto; }

/* Aucun arrondi sur les images du modèle (neutralise un éventuel
   border-radius imposé par le thème). */
.lm-seo-page img { border-radius: 0; }

/* Couleur de texte choisie (style inline) : la propager aux titres et
   paragraphes du contenu, qui ont parfois leur propre couleur de thème. */
.lm-seo-grid__text[style*="color"] :where(h1, h2, h3, h4, h5, h6, p, li) {
    color: inherit;
}