/* ===== Mise en page générale pilier ===== */
.site-main--pilier .entry-content--pilier,
.entry-header--pilier,
.entry-footer--pilier,
.breadcrumb-pilier,
.pilier-cta-wrap,
.pilier-sep {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

/* ===== Fil d’Ariane ===== */
.breadcrumb-pilier {
  padding: .5rem 1rem;
  font-size: .95rem;
  color: #64748b;
}
.breadcrumb-pilier a { color: #0b5fff; text-decoration: none; }
.breadcrumb-pilier a:hover { text-decoration: underline; }

/* ===== Header visuel ===== */
.header-pilier { position: relative; margin: 0 0 2rem; }
.header-pilier-bg {
  position: relative;
  background-size: cover;
  background-position: center;
  height: 300px;
  display: flex; align-items: center; justify-content: center;
}
.header-pilier-overlay {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.40); /* contraste texte */
}
.header-pilier-content {
  position: relative; z-index: 2; color: #fff; text-align: center;
  padding: 0 1rem; max-width: 1000px;
}
.header-pilier .entry-title {
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 2.8rem);
  line-height: 1.2;
}
.header-pilier .entry-chapo {
  font-size: 1.15rem; line-height: 1.55; color: #f1f5f9;
}

/* ===== Contenu ===== */
.site-main--pilier .entry-content--pilier { padding: 0 1rem; }
.entry-content--pilier h2 { margin: 2rem 0 1rem; }
.entry-content--pilier h3 { margin: 1.4rem 0 .6rem; }
.entry-content--pilier p { line-height: 1.7; }

/* Figures / images */
.entry-content figure { margin: 1rem auto; text-align: center; }
.entry-content figure img { height: auto; max-width: 100%; }
.entry-content figure figcaption {
  font-size: .95rem; color:#64748b; margin-top: .4rem;
}

/* Sommaire cliquable (si présent dans le contenu) */
.table-of-contents{
  background:#f8f9fb; border:1px solid #e8ecf3; border-radius:12px;
  padding:16px 18px; margin:18px auto;
}
.table-of-contents h2{ margin:0 0 .6rem; font-size:1.1rem; }
.table-of-contents ol{ margin:0; padding-left:18px; }
.table-of-contents li{ margin:.2rem 0; }
.table-of-contents a{ text-decoration:none; color:#0b5fff; }

/* CTA de fin */
.pilier-sep { border: 0; border-top:1px solid #e8ecf3; margin: 2rem auto; }
.pilier-cta-wrap{
  margin: 0 auto 3rem; padding: 18px;
  background:#f8fafc; border:1px solid #e2e8f0; border-radius:12px; text-align:center;
}
.pilier-cta-title{ margin:.2rem 0 .4rem; font-size:1.4rem; }
.pilier-cta-text{ color:#475569; margin:.2rem 0 .2rem; }
.pilier-cta-wrap a{ color:#0b5fff; text-decoration:none; }
.pilier-cta-wrap a:hover{ text-decoration:underline; }

/* Alignements wide/full WordPress */
.entry-content .alignwide { max-width: 1200px; margin-left: auto; margin-right: auto; }
.entry-content .alignfull {
  width: 100vw; position: relative; left: 50%; right: 50%;
  margin-left: -50vw; margin-right: -50vw;
}

/* ===== Responsive ===== */
@media (max-width: 1024px) {
  .header-pilier-bg { height: 260px; }
}

@media (max-width: 768px) {
  .header-pilier-bg { height: 200px; background-position: center center; }
  .header-pilier .entry-title { font-size: clamp(1.4rem, 5vw, 1.9rem); margin-bottom: .6rem; }
  .header-pilier .entry-chapo { font-size: 1rem; line-height: 1.45; padding: 0 .5rem; }
  .breadcrumb-pilier { font-size: .85rem; padding: .4rem 1rem; }
  .site-main--pilier .entry-content--pilier,
  .breadcrumb-pilier,
  .pilier-cta-wrap { padding-left: .9rem; padding-right: .9rem; }
}

/* Hero header sans image : fond blanc, texte sombre */
.header-pilier-bg{
  background-image: none !important;
  background-color: #fff !important;
  height: 300px;            /* ajuste si besoin */
  border-bottom: 1px solid #e8ecf3; /* liseré discret */
}
.header-pilier-overlay{ display: none !important; }
.header-pilier-content{ color: #0f172a !important; } /* texte foncé */
.header-pilier .entry-title{ color: inherit !important; }
.header-pilier .entry-chapo{ color: #475569 !important; }

.header-pilier-bg{ background-color: #f8fafc !important; }

/* Variante mobile */
@media (max-width:768px){
  .header-pilier-bg{ height: 200px; }
}


/* Très petits écrans */
@media (max-width: 400px) {
  .header-pilier-bg { height: 180px; }
  .header-pilier .entry-title { font-size: 1.35rem; }
  .header-pilier .entry-chapo { font-size: .95rem; }
}


