/* ============================================================
   Hera HPC — charte pour les articles et pages WordPress
   ------------------------------------------------------------
   À déposer dans le thème ENFANT, puis à charger depuis
   functions.php (voir la note de déploiement).

   Ne concerne PAS la page d'accueil, qui est un fichier
   statique servi hors WordPress et porte son propre style.

   Les sélecteurs ciblent les classes WordPress standard.
   Si le thème utilise d'autres noms, ajouter le sélecteur
   à la liste concernée plutôt que de réécrire la règle.
   ============================================================ */

:root {
  --hera-bg:        #0B161D;   /* fond principal, pétrole */
  --hera-bg-2:      #0F1E27;   /* fond secondaire */
  --hera-panel:     #10202A;   /* encadrés, cartes */
  --hera-line:      rgba(233,238,236,.10);
  --hera-line-fort: rgba(233,238,236,.18);
  --hera-text:      #E9EEEC;   /* texte courant */
  --hera-muted:     #96A8AA;   /* texte secondaire */
  --hera-amber:     #E7AC52;   /* accent */
  --hera-amber-2:   #C98D3B;   /* accent profond, filets */
  --hera-ice:       #8FC0CB;   /* accent froid, rare */
  --hera-maxw:      44rem;     /* largeur de lecture confortable */
}

/* Polices : mêmes familles que la page d'accueil.
   Le @import doit rester la première règle utile du fichier. */
@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,300..700;1,300..700&family=Newsreader:ital,opsz,wght@0,6..72,300..500;1,6..72,300..500&display=swap');

/* ---------- Base ---------- */

body {
  background: var(--hera-bg);
  color: var(--hera-text);
  font-family: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 1.05rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--hera-amber); text-decoration: none; }
a:hover { color: var(--hera-text); text-decoration: underline; }

/* ---------- Titres ---------- */

h1, h2, h3, h4,
.entry-title, .page-title {
  font-family: "Archivo", system-ui, sans-serif;
  font-weight: 600;
  letter-spacing: -.015em;
  line-height: 1.15;
  color: var(--hera-text);
}

h1, .entry-title { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: .8em; }
h2 { font-size: clamp(1.3rem, 2.6vw, 1.7rem); margin: 2em 0 .6em; }
h3 { font-size: 1.15rem; margin: 1.6em 0 .5em; }

/* Filet ambre sous les titres de section : signature visuelle du site */
.entry-content h2::after {
  content: ""; display: block;
  width: 30px; height: 2px;
  background: var(--hera-amber-2);
  margin-top: .5em;
}

/* ---------- Corps d'article ---------- */

.entry-content,
.page-content,
.wp-block-post-content {
  max-width: var(--hera-maxw);
  margin: 0 auto;
}

.entry-content p { margin-bottom: 1.2em; }
.entry-content strong { color: #fff; font-weight: 700; }

/* Chapô : premier paragraphe légèrement plus grand */
.entry-content > p:first-of-type {
  font-size: 1.15rem;
  color: #C2CFD2;
}

/* ---------- Listes ---------- */

.entry-content ul { list-style: none; padding-left: 0; }
.entry-content ul li {
  position: relative;
  padding-left: 1.6em;
  margin-bottom: .5em;
}
.entry-content ul li::before {
  content: "";
  position: absolute; left: 0; top: .62em;
  width: 7px; height: 7px;
  background: var(--hera-amber);
  transform: rotate(45deg);
}
.entry-content ol { padding-left: 1.4em; }
.entry-content ol li::marker { color: var(--hera-amber); }

/* ---------- Citations ---------- */

blockquote,
.wp-block-quote {
  font-family: "Newsreader", Georgia, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 1.3rem;
  line-height: 1.45;
  color: var(--hera-text);
  border: 0;
  border-left: 2px solid var(--hera-amber-2);
  padding: .2em 0 .2em 1.4em;
  margin: 2em 0;
}
blockquote cite {
  display: block;
  margin-top: .8em;
  font-family: "Archivo", sans-serif;
  font-style: normal;
  font-size: .72rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--hera-muted);
}

/* ---------- Tableaux ---------- */

.entry-content table {
  width: 100%;
  border-collapse: collapse;
  font-size: .95rem;
  margin: 2em 0;
}
.entry-content th {
  text-align: left;
  font-size: .7rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--hera-muted);
  font-weight: 400;
  padding: 0 1.2em .8em 0;
  border-bottom: 1px solid var(--hera-line-fort);
}
.entry-content td {
  padding: .8em 1.2em .8em 0;
  border-bottom: 1px solid var(--hera-line);
  vertical-align: top;
}

/* ---------- Images et légendes ---------- */

.entry-content img,
.wp-block-image img { max-width: 100%; height: auto; display: block; }

figcaption, .wp-caption-text {
  font-size: .82rem;
  color: var(--hera-muted);
  margin-top: .6em;
}

/* ---------- Encadrés ---------- */
/* Utiliser un bloc « Groupe » avec la classe hera-encadre */

.hera-encadre {
  background: var(--hera-panel);
  border-left: 2px solid var(--hera-amber-2);
  padding: 1.2em 1.5em;
  margin: 2em 0;
}
.hera-encadre p:last-child { margin-bottom: 0; }

/* ---------- Métadonnées et liste d'articles ---------- */

.entry-meta, .posted-on, .byline {
  font-size: .72rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--hera-muted);
}

.post + .post,
article + article {
  border-top: 1px solid var(--hera-line);
  padding-top: 2.5em;
  margin-top: 2.5em;
}

/* ---------- En-tête et pied de page du thème ---------- */

.site-header, .site-footer {
  background: var(--hera-bg-2);
  border-color: var(--hera-line);
}
.site-title a { color: var(--hera-text); }
.site-header a, .site-footer a { color: var(--hera-muted); }
.site-header a:hover, .site-footer a:hover { color: var(--hera-amber); text-decoration: none; }

/* Menu de navigation */
.main-navigation a {
  font-size: .9rem;
  letter-spacing: .02em;
  color: var(--hera-text);
}
.main-navigation .current-menu-item > a { color: var(--hera-amber); }

/* Sélecteur de langue Polylang */
.pll-parent-menu-item a,
.lang-item a {
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.lang-item.current-lang a { color: var(--hera-amber); }

/* ---------- Boutons ---------- */

.wp-block-button__link,
button, input[type="submit"] {
  background: var(--hera-amber);
  color: var(--hera-bg);
  border: 0;
  border-radius: 0;
  font-family: "Archivo", sans-serif;
  font-weight: 500;
  font-size: .92rem;
  padding: .7em 1.5em;
  transition: background .2s ease;
}
.wp-block-button__link:hover,
button:hover, input[type="submit"]:hover { background: #F0BE72; }

/* ---------- Formulaires ---------- */

input[type="text"], input[type="email"], textarea {
  background: var(--hera-panel);
  border: 1px solid var(--hera-line-fort);
  color: var(--hera-text);
  padding: .7em .9em;
  font-family: inherit;
  border-radius: 0;
}
input::placeholder, textarea::placeholder { color: var(--hera-muted); }

/* ---------- Séparateur ---------- */

hr, .wp-block-separator {
  border: 0;
  border-top: 1px solid var(--hera-line);
  margin: 3em 0;
}

/* ---------- Confort de lecture sur mobile ---------- */

@media (max-width: 640px) {
  body { font-size: 1rem; line-height: 1.65; }
  .entry-content > p:first-of-type { font-size: 1.05rem; }
}