/*
Theme Name: Pleine Sève
Theme URI: https://www.fleursetcouleurs.net
Description: Pleine Sève - publication en ligne.
Version: 1.0.eb2779d0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 8.0
License: All rights reserved
Text Domain: fleursetcouleurs
Tags: blog, magazine, custom
*/

/* ========================================================
   Pleine Sève - feuille de styles
   ======================================================== */

@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:wght@300;400;600;700&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&display=swap');

:root {
  --clr-forest: #1F3A2E;
  --clr-accent: #B85C38;
  --clr-cream: #FAF6F0;
  --clr-text: #1F2937;
  --clr-muted: #6B7280;
  --clr-border: #E5DDD4;
  --clr-card-bg: #FFFFFF;
  --clr-overlay: rgba(31, 58, 46, 0.72);

  --ff-serif: 'Crimson Pro', Georgia, serif;
  --ff-sans:  'Plus Jakarta Sans', system-ui, sans-serif;

  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px; --sp-5: 24px;
  --sp-6: 32px; --sp-7: 48px; --sp-8: 64px; --sp-9: 96px;
  --radius-sm: 4px; --radius-md: 10px; --radius-lg: 18px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.08);
  --shadow-md: 0 6px 22px rgba(0,0,0,.10);
  --max-w: 1200px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  background: var(--clr-cream);
  color: var(--clr-text);
  font-family: var(--ff-sans);
  font-size: 1rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: var(--clr-accent); text-decoration: none; }
a:hover { text-decoration: underline; }
ul, ol { list-style: none; }
button, input { font-family: inherit; }

h1, h2, h3, h4 { font-family: var(--ff-serif); line-height: 1.2; color: var(--clr-text); font-weight: 600; }

.fle2-shell-849 { width: 100%; max-width: var(--max-w); margin: 0 auto; padding-left: var(--sp-5); padding-right: var(--sp-5); }
.fle2-shell--narrow-004 { max-width: 900px; }

.fle2-skip-link-78e { position: absolute; left: -9999px; top: 0; background: var(--clr-forest); color: #fff; padding: var(--sp-2) var(--sp-4); z-index: 100; }
.fle2-skip-link-78e:focus { left: var(--sp-3); top: var(--sp-3); }

/* === HEADER : deux niveaux (bandeau + barre de nav) === */
.fle2-site-header-b48 { background: var(--clr-card-bg); border-bottom: 1px solid var(--clr-border); }
.fle2-site-header__top-2b7 { border-bottom: 1px solid var(--clr-border); }
.fle2-site-header__top-2b7 .fle2-shell-849 { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: var(--sp-1); padding-top: var(--sp-5); padding-bottom: var(--sp-4); text-align: center; }
.fle2-brand-369 { font-family: var(--ff-serif); }
.fle2-brand__name-cb0 { display: block; font-size: 2rem; font-weight: 700; }
.fle2-brand__name-cb0 a { color: var(--clr-text); }
.fle2-brand__tagline-480 { display: block; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; color: var(--clr-muted); }

.fle2-site-header__bar-a4c { position: relative; }
.fle2-site-header__bar-a4c .fle2-shell-849 { display: flex; align-items: center; gap: var(--sp-4); min-height: 56px; }
.fle2-nav-main-6bc { flex: 1; }
.fle2-nav-main__list-e9a { display: flex; flex-wrap: wrap; gap: var(--sp-5); justify-content: center; }
.fle2-nav-main__list-e9a a { color: var(--clr-text); font-size: .9rem; font-weight: 500; text-transform: uppercase; letter-spacing: .04em; }
.fle2-nav-main__list-e9a a:hover { color: var(--clr-accent); text-decoration: none; }
.fle2-header-search-494 { margin-left: auto; }
.fle2-header-search-494 .search-form { display: flex; gap: var(--sp-2); align-items: stretch; }
.fle2-header-search-494 .search-field { border: 1px solid var(--clr-border); border-radius: var(--radius-sm); padding: var(--sp-2) var(--sp-3); font-size: .85rem; }
.fle2-header-search-494 .search-submit { border: 1px solid var(--clr-forest); background: var(--clr-forest); color: var(--clr-cream); border-radius: var(--radius-sm); padding: 0 var(--sp-3); font-size: .85rem; cursor: pointer; }

.fle2-nav-switch-e7e { position: absolute; left: -9999px; }
.fle2-nav-toggle-81a { display: none; width: 44px; height: 44px; border: 1px solid var(--clr-border); border-radius: var(--radius-sm); background: var(--clr-card-bg); cursor: pointer; align-items: center; justify-content: center; }
.fle2-nav-toggle__bars-494, .fle2-nav-toggle__bars-494::before, .fle2-nav-toggle__bars-494::after { display: block; width: 20px; height: 2px; background: var(--clr-text); position: relative; }
.fle2-nav-toggle__bars-494::before, .fle2-nav-toggle__bars-494::after { content: ""; position: absolute; left: 0; }
.fle2-nav-toggle__bars-494::before { top: -6px; }
.fle2-nav-toggle__bars-494::after { top: 6px; }

.fle2-site-main-280 { padding-bottom: var(--sp-9); }

/* === Fil d'Ariane === */
.fle2-breadcrumb-c43 { font-size: .85rem; color: var(--clr-muted); margin: var(--sp-5) 0; }
.fle2-breadcrumb-c43 ol { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; }
.fle2-breadcrumb-c43 a { color: var(--clr-muted); }
.fle2-breadcrumb-c43 a:hover { color: var(--clr-accent); }
.fle2-breadcrumbs__sep-c99 { color: var(--clr-border); }

/* === HERO "une" === */
.fle2-hero-346 { background: var(--clr-card-bg); border-bottom: 1px solid var(--clr-border); margin-bottom: var(--sp-8); }
.fle2-hero__inner-119 { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--sp-7); align-items: center; padding-top: var(--sp-8); padding-bottom: var(--sp-8); }
.fle2-hero__media-4b6 { border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 16 / 10; background: var(--clr-border); }
.fle2-hero__img-981 { width: 100%; height: 100%; object-fit: cover; }
.fle2-hero__kicker-0a4 { display: inline-block; font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; color: var(--clr-accent); font-weight: 600; }
.fle2-hero__cat-0a6 { display: inline-block; margin-left: var(--sp-2); font-size: .75rem; color: var(--clr-muted); text-transform: uppercase; letter-spacing: .06em; }
.fle2-hero__title-b92 { font-size: 2.6rem; line-height: 1.1; margin: var(--sp-4) 0; }
.fle2-hero__title-b92 a { color: var(--clr-text); }
.fle2-hero__title-b92 a:hover { color: var(--clr-accent); text-decoration: none; }
.fle2-hero__excerpt-433 { color: var(--clr-muted); font-size: 1.05rem; margin-bottom: var(--sp-4); }
.fle2-hero__meta-9a9 { font-size: .85rem; color: var(--clr-muted); display: flex; gap: var(--sp-3); flex-wrap: wrap; align-items: center; }
.fle2-hero__more-33d { font-weight: 600; }

/* === FEED + GRILLE DE CARTES === */
.fle2-feed-9e7 { margin-bottom: var(--sp-8); }
.fle2-feed__head-fc4 { display: flex; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-6); }
.fle2-feed__flag-a8c { width: 28px; height: 3px; background: var(--clr-accent); border-radius: var(--radius-sm); }
.fle2-feed__title-08b { font-size: 1.5rem; }

.fle2-posts-grid-73e { display: grid; gap: var(--sp-6); grid-template-columns: repeat(3, 1fr); }
.fle2-posts-grid--2-29e { grid-template-columns: repeat(2, 1fr); }

.fle2-post-card-982 { background: var(--clr-card-bg); border: 1px solid var(--clr-border); border-radius: var(--radius-md); overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .2s ease; }
.fle2-post-card-982:hover { box-shadow: var(--shadow-md); }
.fle2-post-card__media-7fd { position: relative; display: block; aspect-ratio: 16 / 10; background: var(--clr-border); }
.fle2-post-card__thumb-2d2 { width: 100%; height: 100%; object-fit: cover; }
.fle2-post-card__badge-3fd { position: absolute; left: var(--sp-3); top: var(--sp-3); background: var(--clr-overlay); color: #fff; font-size: .72rem; padding: var(--sp-1) var(--sp-3); border-radius: var(--radius-sm); text-transform: uppercase; letter-spacing: .04em; }
.fle2-post-card__body-eea { padding: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-3); flex: 1; }
.fle2-post-card__cat-eb2 { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--clr-accent); }
.fle2-post-card__title-978 { font-size: 1.15rem; line-height: 1.25; }
.fle2-post-card__title-978 a { color: var(--clr-text); }
.fle2-post-card__title-978 a:hover { color: var(--clr-accent); text-decoration: none; }
.fle2-post-card__excerpt-b68 { color: var(--clr-muted); font-size: .92rem; }
.fle2-post-card__date-5f9 { font-size: .8rem; color: var(--clr-muted); }
.fle2-post-card__more-8a1 { font-size: .85rem; font-weight: 600; margin-top: auto; }

.fle2-list-empty-7a7 { grid-column: 1 / -1; text-align: center; color: var(--clr-muted); padding: var(--sp-7) 0; }

.fle2-pagination-ba0 { margin-top: var(--sp-7); display: flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.fle2-pagination-ba0 .fle2-page-numbers-138 { padding: var(--sp-2) var(--sp-4); border: 1px solid var(--clr-border); border-radius: var(--radius-sm); color: var(--clr-text); background: var(--clr-card-bg); }
.fle2-pagination-ba0 .fle2-current-78b { background: var(--clr-forest); color: #fff; border-color: var(--clr-forest); }

/* === RAIL "rubriques" (accueil) === */
/* Fond CREME (pas vert) : le footer est vert, deux blocs verts qui se touchent
   laissaient voir le body creme au moindre espace = bandeau parasite. En creme,
   la sequence fle2-hero-346 blanc -> rubriques creme -> footer vert donne 3 zones nettes
   et le bug disparait par construction (2026-07-18). */
.fle2-rail-b86 { margin: var(--sp-8) 0 0; padding: var(--sp-7) 0; background: var(--clr-cream); color: var(--clr-text); }
/* Le fle2-rail-b86 (bande verte) est la derniere section : il doit toucher le footer,
   sinon le fond crème du body apparait en bande (fix 2026-07-18). */
.fle2-site-main-280:has(.fle2-rail-b86) { padding-bottom: 0; }
.fle2-rail__head-d2d { margin-bottom: var(--sp-5); }
.fle2-rail__title-43e { color: var(--clr-forest); font-size: 1.4rem; }
.fle2-rail__grid-31e { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-5); }
.fle2-rail__col-bfd a { color: var(--clr-text); }
.fle2-rail__kicker-32c { display: block; font-weight: 600; margin-bottom: var(--sp-3); border-bottom: 1px solid var(--clr-border); padding-bottom: var(--sp-2); }
.fle2-rail__link-2d2 { display: block; font-size: .92rem; padding: var(--sp-1) 0; }

/* === En-tete d'archive === */
.fle2-archive-head-76c { padding: var(--sp-7) 0; border-bottom: 1px solid var(--clr-border); margin-bottom: var(--sp-7); }
.fle2-archive-head__row-7a1 { display: flex; align-items: center; gap: var(--sp-3); }
.fle2-archive-head__flag-850 { width: 28px; height: 3px; background: var(--clr-accent); border-radius: var(--radius-sm); }
.fle2-archive-head__title-cd0 { font-size: 2.2rem; }
.fle2-archive-head__count-821 { color: var(--clr-muted); font-size: .9rem; margin-top: var(--sp-3); }
.fle2-archive-head__desc-96f { color: var(--clr-muted); margin-top: var(--sp-3); }

/* === SINGLE : 2 colonnes (corps + aside sticky) === */
.fle2-content-layout-802 { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: var(--sp-8); align-items: start; margin-top: var(--sp-7); }
.fle2-content-main-8e7 { min-width: 0; }
.fle2-content-aside-838 { position: sticky; top: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-6); }

.fle2-post-single__cat-85e { display: inline-block; font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--clr-accent); margin-bottom: var(--sp-3); }
.fle2-post-single__title-fe9 { font-size: 2.5rem; line-height: 1.12; margin-bottom: var(--sp-4); }
.fle2-post-single__meta-6ab { font-size: .85rem; color: var(--clr-muted); display: flex; gap: var(--sp-3); flex-wrap: wrap; }
.fle2-post-single__cover-a94 { margin: var(--sp-5) 0 var(--sp-6); border-radius: var(--radius-md); overflow: hidden; }
.fle2-post-single__prose-ef7 { font-size: 1.08rem; }
.fle2-post-single__prose-ef7 > * + * { margin-top: var(--sp-4); }
.fle2-post-single__prose-ef7 h2 { font-size: 1.7rem; margin-top: var(--sp-7); }
.fle2-post-single__prose-ef7 h3 { font-size: 1.3rem; margin-top: var(--sp-6); }
.fle2-post-single__prose-ef7 ul, .fle2-post-single__prose-ef7 ol { margin-left: var(--sp-5); }
.fle2-post-single__prose-ef7 ul { list-style: disc; }
.fle2-post-single__prose-ef7 ol { list-style: decimal; }
.fle2-post-single__prose-ef7 img { border-radius: var(--radius-md); margin: var(--sp-5) 0; }
.fle2-post-single__prose-ef7 table { width: 100%; border-collapse: collapse; margin: var(--sp-5) 0; font-size: .95rem; }
.fle2-post-single__prose-ef7 th, .fle2-post-single__prose-ef7 td { border: 1px solid var(--clr-border); padding: var(--sp-3); text-align: left; }
.fle2-post-single__prose-ef7 th { background: var(--clr-cream); }
.fle2-post-single__footer-f1a { margin-top: var(--sp-7); padding-top: var(--sp-5); border-top: 1px solid var(--clr-border); }

/* TOC (sortie du theme) stylee en aside sticky */
.fle2-toc-e9d { background: var(--clr-card-bg); border: 1px solid var(--clr-border); border-radius: var(--radius-md); padding: var(--sp-4) var(--sp-5); }
.fle2-toc__title-d2c { font-family: var(--ff-serif); font-weight: 600; margin-bottom: var(--sp-3); }
.fle2-toc-e9d ol { list-style: decimal; margin-left: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-2); }
.fle2-toc-e9d a { color: var(--clr-text); font-size: .92rem; }
.fle2-toc-e9d a:hover { color: var(--clr-accent); }

.fle2-aside-block-146 { background: var(--clr-card-bg); border: 1px solid var(--clr-border); border-radius: var(--radius-md); padding: var(--sp-4) var(--sp-5); }
.fle2-aside-block__title-683 { font-family: var(--ff-serif); font-weight: 600; margin-bottom: var(--sp-3); }
.fle2-aside-block__list-23b { display: flex; flex-direction: column; gap: var(--sp-2); }
.fle2-aside-block__list-23b a { color: var(--clr-text); font-size: .92rem; }
.fle2-aside-block__list-23b a:hover { color: var(--clr-accent); }

.fle2-tag-list-b31 { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.fle2-tag-list-b31 a { font-size: .82rem; background: var(--clr-cream); border: 1px solid var(--clr-border); border-radius: var(--radius-sm); padding: var(--sp-1) var(--sp-3); color: var(--clr-muted); }

.fle2-post-nav-5bb { display: flex; justify-content: space-between; gap: var(--sp-4); margin-top: var(--sp-6); }
.fle2-post-nav__prev-319, .fle2-post-nav__next-ca9 { max-width: 48%; color: var(--clr-text); }

.fle2-page-content-c6d { font-size: 1.05rem; }
.fle2-page-content-c6d > * + * { margin-top: var(--sp-4); }
.fle2-page-content-c6d h2 { font-size: 1.5rem; margin-top: var(--sp-6); }

.fle2-error-404-651 { text-align: center; padding: var(--sp-9) 0; }
.fle2-error-404__title-edd { font-size: 2.6rem; margin-bottom: var(--sp-4); }
.fle2-error-404__text-f06 { color: var(--clr-muted); margin-bottom: var(--sp-5); }

/* === FOOTER : grille 3 colonnes === */
/* PAS de margin-top ici : le footer est une bande VERTE. Avec une marge, le fond
   crème du body apparaissait entre le fle2-rail-b86 (vert) et le footer (vert) — c'était la
   vraie cause du bandeau, pas le fle2-rail-b86 ni .fle2-site-main-280 (diagnostic sur DOM servi
   2026-07-18). L'espacement des pages sans fle2-rail-b86 vient de .fle2-site-main-280 padding-bottom. */
.fle2-site-footer-2eb { background: var(--clr-forest); color: var(--clr-cream); }
.fle2-site-footer__grid-4ba { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: var(--sp-7); padding: var(--sp-8) 0 var(--sp-7); }
.fle2-site-footer__brand-256 { font-family: var(--ff-serif); font-size: 1.4rem; font-weight: 700; color: var(--clr-cream); margin-bottom: var(--sp-3); }
.fle2-site-footer__desc-ebb { color: rgba(255,255,255,.8); font-size: .9rem; }
.fle2-site-footer__title-d3b { color: var(--clr-cream); font-size: 1rem; margin-bottom: var(--sp-4); }
.fle2-site-footer__menu-a73 { display: flex; flex-direction: column; gap: var(--sp-2); }
.fle2-site-footer__menu-a73 a { color: rgba(255,255,255,.82); font-size: .92rem; }
.fle2-site-footer__menu-a73 a:hover { color: #fff; }
.fle2-site-footer__bottom-c90 { border-top: 1px solid rgba(255,255,255,.18); padding: var(--sp-5) 0; color: rgba(255,255,255,.7); font-size: .82rem; }

/* === Responsive === */
@media (max-width: 900px) {
  .fle2-hero__inner-119 { grid-template-columns: 1fr; gap: var(--sp-5); }
  .fle2-hero__media-4b6 { order: -1; }
  .fle2-posts-grid-73e { grid-template-columns: repeat(2, 1fr); }
  .fle2-content-layout-802 { grid-template-columns: 1fr; }
  .fle2-content-aside-838 { position: static; }
  .fle2-rail__grid-31e { grid-template-columns: 1fr; }
  .fle2-site-footer__grid-4ba { grid-template-columns: 1fr; gap: var(--sp-6); }
}
@media (max-width: 640px) {
  .fle2-nav-toggle-81a { display: inline-flex; }
  .fle2-nav-main-6bc { display: none; flex-basis: 100%; }
  .fle2-nav-switch-e7e:checked ~ .fle2-nav-main-6bc { display: block; }
  .fle2-nav-main__list-e9a { flex-direction: column; align-items: flex-start; gap: var(--sp-3); padding-bottom: var(--sp-4); justify-content: flex-start; }
  .fle2-header-search-494 { display: none; }
  .fle2-site-header__bar-a4c .fle2-shell-849 { flex-wrap: wrap; }
  .fle2-posts-grid-73e, .fle2-posts-grid--2-29e { grid-template-columns: 1fr; }
  .fle2-hero__title-b92 { font-size: 1.9rem; }
  .fle2-post-single__title-fe9 { font-size: 1.9rem; }
}

/* --- A3-fix 2026-07-18 : classes utilisees en PHP mais non definies (fuite + non stylees) --- */
.fle2-post-date-67c { color: var(--clr-muted); font-family: var(--ff-sans); font-size: 0.85rem; }
.fle2-hero__body-d87 { color: var(--clr-muted); font-size: 1.05rem; max-width: 60ch; margin-top: var(--sp-2); }
.fle2-post-single__header-164 { margin-bottom: var(--sp-6); }
.fle2-site-footer__col-9b8 { display: flex; flex-direction: column; gap: var(--sp-2); min-width: 0; }

/* --- Classes emises par le CONTENU (S3/S6), jamais mutees par A3 (whitelist) ---
   Sans ces regles, l'encadre "Essentiel a retenir" et le sommaire redige tombent
   en prose brute : defaut visuel constate au lot 1 de fleursetcouleurs (2026-07-21).
   Le sommaire n'apparait que sur les sites SANS theme_owns_toc ; la regle est
   inoffensive quand il est absent. */
.essentiel-retenir {
  background: var(--clr-card-bg);
  border-left: 3px solid var(--clr-accent);
  border-radius: var(--radius-md);
  padding: var(--sp-4) var(--sp-5);
  margin: var(--sp-5) 0;
}
.essentiel-retenir p { margin: 0; }
.essentiel-retenir ul { margin: var(--sp-2) 0 0 var(--sp-5); list-style: disc; }
.essentiel-retenir li + li { margin-top: var(--sp-2); }
.sommaire-article {
  background: var(--clr-cream);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-md);
  padding: var(--sp-4) var(--sp-5) var(--sp-4) calc(var(--sp-5) + 1rem);
  margin: var(--sp-5) 0;
  font-family: var(--ff-sans);
  font-size: .95rem;
}
.sommaire-article li + li { margin-top: var(--sp-2); }
.sommaire-article a { color: var(--clr-text); }

/* Le poids 700 de la police sans est charge explicitement plus haut : on fixe la
   valeur ici pour ne pas dependre de la synthese du navigateur. */
strong, b { font-weight: 700; }

/* Racine du bloc BEM `fle2-post-single-624`. Doit exister ICI meme si la mise en forme
   vit dans ses elements : une classe utilisee en PHP mais absente de style.css
   echappe a la mutation A3 et fuite en clair dans le HTML servi (elle arrive par
   post_class(), donc invisible a la lecture des templates). min-width:0 evite en
   prime le debordement de l'article dans la grille a 2 colonnes. */
.fle2-post-single-624 { min-width: 0; }