/*
Theme Name: Naitre en Occitanie
Author: Maiwenn Estrade
Description: Magazine de perinatalite : lecture en colonne unique, pastilles de rubriques, encadres arrondis, typographie douce. Aucune sidebar, structure distincte des autres titres du parc.
Version: 1.0.0
Text Domain: naitre-occitanie
*/

/* DIRECTION : « le cahier de suivi ».
   Ivoire et terre cuite, angles arrondis, colonne unique centree (lecture au telephone
   d'abord, c'est la l'essentiel du public). Les rubriques sont des pastilles, pas un menu
   de journal ; les articles se lisent en liste verticale espacee. */

:root{
  --ivoire:#fbf7f2; --ivoire-2:#f3eae1; --terre:#b4553c; --terre-2:#8f3f2b;
  --encre:#2b2320; --doux:#6d5c54; --sauge:#6f7f6a; --blanc:#fff; --liseré:#e6d8cc;
  --titre:"Fraunces",Georgia,serif;
  --texte:"Nunito Sans","Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ivoire);color:var(--encre);font:400 17.5px/1.72 var(--texte)}
img{max-width:100%;height:auto;display:block}
a{color:var(--terre)}
h1,h2,h3{font-family:var(--titre);font-weight:600;line-height:1.24;margin:0 0 .5em}
.colonne{max-width:760px;margin:0 auto;padding:0 20px}
.colonne-large{max-width:1080px;margin:0 auto;padding:0 20px}

/* en-tete */
.fronton{background:var(--blanc);border-bottom:1px solid var(--liseré)}
.fronton .colonne-large{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;padding-block:20px}
.titre-site{text-decoration:none;color:inherit}
.titre-site b{display:block;font-family:var(--titre);font-size:29px;color:var(--terre-2)}
.titre-site span{display:block;font-size:12.5px;color:var(--doux);margin-top:2px}
.tenue{display:flex;gap:11px;align-items:center;font-size:13px;color:var(--doux);text-align:left}
.tenue img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--ivoire-2)}
.tenue b{display:block;color:var(--encre);font-size:13.5px}

/* pastilles de rubriques */
.pastilles{background:var(--blanc)}
.pastilles .colonne-large{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:18px}
.pastilles a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:var(--ivoire-2);color:var(--encre);text-decoration:none;font-size:14.5px}
.pastilles a:hover{background:var(--terre);color:#fff}

/* ouverture */
.accueil-mot{background:var(--ivoire-2);margin-bottom:8px}
.accueil-mot .colonne{padding-block:32px}
.accueil-mot h1{font-size:30px;margin-bottom:.3em}
.accueil-mot p{margin:0;color:#4d423c}

/* liste d'articles */
.suite-articles{display:grid;gap:26px;padding:26px 0 10px}
.billet{background:var(--blanc);border:1px solid var(--liseré);border-radius:18px;overflow:hidden}
.billet .image img{width:100%;aspect-ratio:16/9;object-fit:cover}
.billet .dedans{padding:18px 20px 22px}
.marque-rubrique{display:inline-block;font-size:12px;color:var(--sauge);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px;text-decoration:none}
.billet h2{font-size:23px;margin:0 0 .3em}
.billet h2 a{color:inherit;text-decoration:none}
.billet h2 a:hover{color:var(--terre)}
.billet .jour{font-size:13px;color:var(--doux)}
.billet p{margin:.7em 0 1em;color:#4a3f39}
.bouton-doux{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--terre);color:#fff;text-decoration:none;font-size:14.5px}
.bouton-doux:hover{background:var(--terre-2)}

/* encadre de confiance */
.confiance{background:var(--blanc);border:1px solid var(--liseré);border-radius:18px;padding:20px;margin:22px 0 34px;display:grid;gap:14px}
.confiance img{width:78px;height:78px;border-radius:50%;object-fit:cover}
.confiance h2{font-size:20px;margin:0}
.confiance p{margin:0;color:#4a3f39}

/* rappel de service */
.rappel{border-left:4px solid var(--sauge);background:#f2f5f0;padding:14px 16px;border-radius:0 12px 12px 0;margin:20px 0;font-size:16px;color:#3d453a}

/* article */
.page-article{background:var(--blanc);border:1px solid var(--liseré);border-radius:20px;padding:22px 20px 30px;margin:22px 0}
.page-article h1{font-size:30px}
.entete-article{font-size:13.5px;color:var(--doux);margin-bottom:16px}
.corps-texte h2{font-size:23px;margin-top:1.6em}
.corps-texte img{border-radius:14px;margin:1.2em 0}
.fin-article{margin-top:28px;padding-top:18px;border-top:1px solid var(--liseré);display:flex;gap:14px;align-items:flex-start}
.fin-article img{width:66px;height:66px;border-radius:50%}

/* pied */
.socle{background:var(--terre-2);color:#f7e9e3;margin-top:34px}
.socle .colonne-large{padding-block:26px;display:grid;gap:12px}
.socle a{color:#fff}
.socle small{color:#e8c9bd}

.pages-liste{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 30px}
.pages-liste .page-numbers{min-height:44px;line-height:44px;padding:0 16px;border-radius:999px;background:var(--blanc);border:1px solid var(--liseré);text-decoration:none;color:var(--encre)}
.pages-liste .current{background:var(--terre);color:#fff;border-color:var(--terre)}

@media (min-width:820px){
  .confiance{grid-template-columns:78px 1fr;align-items:center;column-gap:20px}
  .accueil-mot h1{font-size:36px}
  .page-article{padding:34px 44px 44px}
  .page-article h1{font-size:38px}
}