/* KenhoWeb GSP Beauté v1.0.1 — couche présentation du site du ministère
   « Guidée par Sa Parole » (thème Astra). Identité : bleu nuit #0b1c33,
   doré #c9a227, crème #faf7f0. N'ajoute que de la présentation :
   en-tête et pied aux couleurs du ministère, boutons dorés, fond crème,
   bannière photo + grand titre par page, héros et cartes de l'accueil.
   Toutes les classes du thème ciblées ci-dessous ont été relevées dans
   le HTML public réel du site (audit du 2026-10-16). */

/* ---------- Fond crème des pages (identité) ---------- */
body {
  background-color: #faf7f0;
}

/* ---------- Boutons : dorés, texte bleu nuit (identité) ---------- */
body .wp-block-button:not(.is-style-outline) > .wp-block-button__link {
  background-color: #c9a227;
  color: #0b1c33;
  font-weight: 700;
  border-radius: 999px;
}
body .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover,
body .wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus {
  background-color: #0b1c33;
  color: #ffffff;
}

/* ---------- En-tête Astra : fond bleu nuit, filets dorés ---------- */
.ast-primary-header-bar {
  background-color: #0b1c33 !important;
  border-bottom: 3px solid #c9a227;
}
header.site-header .site-title a,
header.site-header .ast-site-title-wrap .site-title {
  color: #ffffff;
}
header.site-header .main-header-menu > .menu-item > .menu-link,
header.site-header .main-header-menu > .menu-item > a {
  color: #f5efe0;
}
header.site-header .main-header-menu > .menu-item > .menu-link:hover,
header.site-header .main-header-menu > .menu-item > a:hover,
header.site-header .main-header-menu > .current-menu-item > .menu-link,
header.site-header .main-header-menu > .current-menu-item > a {
  color: #c9a227;
}
header.site-header .main-header-menu .sub-menu {
  background-color: #0b1c33;
}
header.site-header .main-header-menu .sub-menu .menu-link,
header.site-header .main-header-menu .sub-menu a {
  color: #f5efe0;
}
header.site-header .main-header-menu .sub-menu .menu-link:hover,
header.site-header .main-header-menu .sub-menu a:hover {
  color: #c9a227;
}
header.site-header .menu-toggle {
  color: #f5efe0;
  border-color: rgba(245, 239, 224, .4);
}
/* Bouton « Faire un don » du menu : pastille dorée, toujours visible */
header.site-header .main-header-menu > .menu-item > .menu-link[href$="faire-un-don/"],
header.site-header .main-header-menu > .menu-item > a[href$="faire-un-don/"] {
  background-color: #c9a227;
  color: #0b1c33;
  font-weight: 700;
  border-radius: 999px;
}

/* ---------- Pied Astra : fond bleu nuit, texte clair, accents dorés ---------- */
footer.site-footer .site-primary-footer-wrap {
  background-color: #0b1c33 !important;
  border-top: 3px solid #c9a227;
}
footer.site-footer .site-below-footer-wrap {
  background-color: #081426 !important;
  border-top: 2px solid #c9a227;
}
footer.site-footer,
footer.site-footer p,
footer.site-footer li,
footer.site-footer .widget,
footer.site-footer .ast-footer-copyright {
  color: #ece5d3;
}
footer.site-footer a {
  color: #f0e7cd;
}
footer.site-footer a:hover,
footer.site-footer a:focus {
  color: #c9a227;
}
footer.site-footer h1,
footer.site-footer h2,
footer.site-footer h3,
footer.site-footer h4,
footer.site-footer strong {
  color: #c9a227;
}

/* ---------- Bannière photo + grand titre (patron Bannières Pages) ----------
   Insérée par le JS comme premier enfant de <main id="main" class="site-main">
   (structure Astra relevée à l'audit : main > article > header.entry-header).
   Le titre existant de la page et tout son contenu restent sous la bannière. */
.kwgsp-banniere {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  max-width: 100vw;
  height: 240px;
  margin: 0 0 22px;
  background-color: #0b1c33;
  background-size: cover;
  background-position: center 38%;
  overflow: hidden;
}
.kwgsp-banniere::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, rgba(7, 20, 40, .82) 0%, rgba(7, 20, 40, .45) 46%, rgba(7, 20, 40, .08) 78%);
}
.kwgsp-banniere-titre {
  position: absolute;
  z-index: 1;
  left: max(18px, calc(50vw - 580px));
  bottom: 20px;
  color: #fff;
  font-size: clamp(28px, 6vw, 50px);
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .55);
}
@media (min-width: 900px) {
  .kwgsp-banniere { height: 300px; }
}

/* ---------- Héros de l'accueil : nom + verset en surimpression ---------- */
.kwgsp-banniere.kwgsp-heros {
  height: 340px;
}
.kwgsp-banniere.kwgsp-heros::after {
  background: linear-gradient(180deg, rgba(7, 20, 40, .52) 0%, rgba(7, 20, 40, .68) 100%);
}
.kwgsp-heros-texte {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 20px;
}
.kwgsp-heros-nom {
  color: #fff;
  font-size: clamp(34px, 7vw, 62px);
  font-weight: 800;
  letter-spacing: .02em;
  line-height: 1.12;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .6);
}
.kwgsp-heros-verset {
  color: #eec95c;
  font-style: italic;
  font-size: clamp(16px, 2.6vw, 23px);
  margin-top: 12px;
  text-shadow: 0 1px 10px rgba(0, 0, 0, .65);
}
.kwgsp-heros-ref {
  color: #fff;
  opacity: .88;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-top: 7px;
}
@media (min-width: 900px) {
  .kwgsp-banniere.kwgsp-heros { height: 430px; }
}

/* ---------- Accueil : sections « Découvrir » en cartes photo ----------
   Le JS regroupe chaque trio (titre + texte + bouton) dans une carte :
   photo en haut, bande bleu nuit portant le titre, fine ligne dorée —
   exactement le style des cartes de l'accueil de l'application. */
.kwgsp-cartes {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  margin: 12px 0 28px;
}
@media (min-width: 800px) {
  .kwgsp-cartes { grid-template-columns: 1fr 1fr; }
}
.kwgsp-carte {
  background: #ffffff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 6px 22px rgba(11, 28, 51, .12);
  display: flex;
  flex-direction: column;
}
.kwgsp-carte-photo {
  height: 160px;
  background-size: cover;
  background-position: center;
  border-bottom: 3px solid #c9a227;
}
.kwgsp-carte-bande {
  background: #0b1c33;
  padding: 12px 18px;
}
.kwgsp-carte-bande h3.wp-block-heading {
  margin: 0;
  color: #ffffff;
  font-size: 21px;
  line-height: 1.25;
}
.kwgsp-carte-corps {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}
.kwgsp-carte-corps p {
  margin: 0;
}
.kwgsp-carte-corps .wp-block-buttons {
  margin-top: auto;
}

/* Accueil : soulignement doré des grands titres de sections */
body.kwgsp-accueil .entry-content > h2.wp-block-heading {
  color: #0b1c33;
  border-bottom: 3px solid #c9a227;
  padding-bottom: 8px;
}

/* ================= v1.0.1 — retours du propriétaire =================
   (1) En-tête déformé : le logo servi (img.custom-logo, attributs
   512×512, sizes 100vw) n'était contraint par AUCUNE règle du thème —
   il s'affichait énorme et le titre du site s'écrasait en colonne.
   (2) Titres doublés : le JS pose la classe .kwgsp-titre-cache sur le
   titre Astra quand la bannière/le héros porte déjà le titre, et sur
   le H1 + verset du contenu de l'accueil (déjà dans le héros).
   (3) Pied professionnel : logo rond ajouté par le JS (.kwgsp-pied-logo),
   réseaux en rangée de boutons ronds (.kwgsp-reseaux), alignements
   uniformes, ligne légale resserrée. */

/* ---------- (1) En-tête : logo à taille normale, titre qui respire ---------- */
header.site-header img.custom-logo {
  height: 46px !important;
  width: auto !important;
}
@media (max-width: 921px) {
  header.site-header img.custom-logo {
    height: 40px !important;
  }
}
header.site-header .site-logo-img {
  flex: 0 0 auto;
  line-height: 0;
}
header.site-header .ast-site-title-wrap {
  min-width: 0;
}
header.site-header .site-title {
  line-height: 1.15;
}
@media (max-width: 921px) {
  header.site-header .site-title {
    font-size: 20px;
  }
}

/* ---------- (1b) Design GSP de la barre d'en-tête ----------
   Nom du ministère en serif élégant crème (Playfair Display si le
   thème la charge un jour, sinon Georgia — aucune police externe
   n'est ajoutée), slogan jamais affiché dans la barre, bouton ☰
   doré, et UN fin liseré doré sous tout l'en-tête (le filet de la
   barre primaire posé en v1.0.0 est neutralisé pour éviter le
   double trait). */
header.site-header .site-title a,
header.site-header .ast-site-title-wrap .site-title {
  font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
  color: #faf7f0;
  letter-spacing: .01em;
}
header.site-header .site-title a {
  text-wrap: balance;
}
header.site-header .site-description {
  display: none !important;
}
header.site-header .menu-toggle {
  color: #c9a227;
  border-color: rgba(201, 162, 39, .55);
}
header.site-header .menu-toggle svg {
  fill: #c9a227 !important;
}
.ast-primary-header-bar {
  border-bottom: none;
}
header.site-header {
  border-bottom: 2px solid #c9a227;
}

/* ---------- (2) Éléments masqués par le JS (titres doublés) ---------- */
.kwgsp-titre-cache {
  display: none !important;
}

/* ---------- (3) Pied professionnel ---------- */
/* Bloc marque : logo rond du ministère au-dessus du nom, bloc centré */
.kwgsp-pied-logo {
  text-align: center;
  margin: 0 0 10px;
  line-height: 0;
}
.kwgsp-pied-logo img {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: inline-block;
}
footer.site-footer .site-footer-primary-section-1 .ast-builder-html-element {
  text-align: center;
}
/* Titres de section du pied : petites capitales dorées resserrées */
footer.site-footer .ast-builder-html-element > p:first-child > strong,
footer.site-footer .widget_block > p:first-child > strong {
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 15px;
}
/* Rythme vertical régulier dans les colonnes du pied */
footer.site-footer .ast-builder-html-element p,
footer.site-footer .widget_block p {
  margin: 0 0 10px;
  line-height: 1.55;
}
footer.site-footer .site-primary-footer-wrap {
  padding-top: 34px;
  padding-bottom: 26px;
}
/* Réseaux : rangée de boutons ronds à icônes (liens d'origine, déplacés par le JS) */
.kwgsp-reseaux {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 12px 0 4px;
}
.kwgsp-reseaux a.kwgsp-reseau {
  width: 42px;
  height: 42px;
  border: 1.5px solid #c9a227;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #f0e7cd;
  background: transparent;
}
.kwgsp-reseaux a.kwgsp-reseau svg {
  width: 19px;
  height: 19px;
  display: block;
}
.kwgsp-reseaux a.kwgsp-reseau:hover,
.kwgsp-reseaux a.kwgsp-reseau:focus {
  background-color: #c9a227;
  color: #0b1c33;
}
/* Ligne légale : petite, centrée, retours propres (fond et filet déjà posés plus haut) */
footer.site-footer .site-below-footer-wrap {
  padding-top: 14px;
  padding-bottom: 14px;
}
footer.site-footer .ast-footer-copyright,
footer.site-footer .ast-footer-copyright p {
  font-size: 13px;
  line-height: 1.6;
  text-align: center;
  margin: 0;
}
/* Mobile : toutes les colonnes du pied centrées, espacements resserrés */
@media (max-width: 768px) {
  footer.site-footer .site-footer-section,
  footer.site-footer .ast-builder-html-element,
  footer.site-footer .widget_block {
    text-align: center;
  }
  footer.site-footer .site-primary-footer-wrap {
    padding-top: 28px;
    padding-bottom: 20px;
  }
  .kwgsp-reseaux {
    justify-content: center;
  }
}