/* Hallmark · macrostructure: Long Document · genre: editorial · tone: clinique-éditorial
 * theme: custom (paper light · display roman-serif · accent chromatic-green)
 * nav: N6 rail · footer: Ft5 statement · enrichment: none (typography only)
 * pre-emit critique: P5 H5 E4 S5 R5 V4
 */
/*
Theme Name: Corpelia
Theme URI: https://corpelia.com
Description: Child theme GeneratePress pour Corpelia — rééducation périnéale et santé pelvienne.
Author: Souade Taje
Template: generatepress
Version: 2.0.0
Text Domain: corpelia
*/

/* ═══════════════════════════════════════════════════════════
   1 · JETONS
   Contrastes vérifiés 25/07/2026 — voir CHARTE-GRAPHIQUE.md §2.
   Les tons clairs sont des SURFACES, les foncés des TEXTES.
   ═══════════════════════════════════════════════════════════ */
:root {
  /* Encres */
  --cp-ardoise:        #2C4A63;
  --cp-ardoise-fonce:  #1F3A5F;
  --cp-texte:          #23272E;
  --cp-gris:           #636A78;

  /* Vert */
  --cp-sauge:          #7A9E7E;
  --cp-sauge-texte:    #4C6E52;
  --cp-sauge-fond:     #54785A;
  --cp-sauge-clair:    #E8F0E9;

  /* Terracotta */
  --cp-terracotta:       #C97B5A;
  --cp-terracotta-texte: #A85C3D;

  /* Papiers */
  --cp-papier:   #FFFFFF;
  --cp-sable:    #F5F2ED;
  --cp-sable-2:  #EFEBE4;
  --cp-bordure:  #E3E1DC;
  --cp-filet:    #D8D4CC;

  /* Familles — polices système, aucune requête externe (RGPD) */
  --cp-serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --cp-sans:  system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Échelle typographique — ratio 1.26, ancrée sur 17px */
  --cp-t-xs:   0.76rem;
  --cp-t-sm:   0.875rem;
  --cp-t-base: 1.0625rem;
  --cp-t-md:   1.2rem;
  --cp-t-lg:   1.5rem;
  --cp-t-xl:   1.9rem;
  --cp-t-2xl:  2.4rem;
  --cp-display: clamp(2.3rem, 1.4rem + 3.1vw, 3.9rem);

  /* Espacement — pas de 4pt */
  --cp-s-1: 0.25rem;  --cp-s-2: 0.5rem;   --cp-s-3: 0.75rem;
  --cp-s-4: 1rem;     --cp-s-5: 1.5rem;   --cp-s-6: 2rem;
  --cp-s-7: 3rem;     --cp-s-8: 4rem;     --cp-s-9: 6rem;

  /* Mesures */
  --cp-mesure: 34rem;        /* colonne de lecture */
  --cp-mesure-large: 46rem;  /* blocs qui débordent */

  /* Mouvement */
  --cp-ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --cp-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --cp-dur-1: 120ms;
  --cp-dur-2: 220ms;

  --cp-radius: 3px;
}

html, body { overflow-x: clip; }

/* ═══════════════════════════════════════════════════════════
   2 · TYPOGRAPHIE
   ═══════════════════════════════════════════════════════════ */
body {
  font-family: var(--cp-sans);
  font-size: var(--cp-t-base);
  color: var(--cp-texte);
  background: var(--cp-papier);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  font-family: var(--cp-serif);
  color: var(--cp-ardoise-fonce);
  font-weight: 600;
  overflow-wrap: anywhere;
  min-width: 0;
  text-wrap: balance;
}

h1 { font-size: var(--cp-display); line-height: 1.06; letter-spacing: -0.018em; }
h2 { font-size: var(--cp-t-xl);  line-height: 1.18; letter-spacing: -0.012em; margin: var(--cp-s-8) 0 var(--cp-s-4); }
h3 { font-size: var(--cp-t-lg);  line-height: 1.25; letter-spacing: -0.008em; margin: var(--cp-s-6) 0 var(--cp-s-3); }

.entry-content p,
.entry-content li { line-height: 1.72; }
.entry-content p  { margin: 0 0 var(--cp-s-5); }
.entry-content li { margin-bottom: var(--cp-s-2); }

/* Chapeau d'article */
.cp-intro {
  font-family: var(--cp-serif);
  font-size: var(--cp-t-md);
  line-height: 1.62;
  color: var(--cp-ardoise);
}

/* Liens de corps — soulignement fin qui s'épaissit, jamais de couleur criarde */
.entry-content a:not(.cp-go):not(.cp-card) {
  color: var(--cp-ardoise);
  text-decoration: underline;
  text-decoration-color: var(--cp-sauge);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  transition: text-decoration-thickness var(--cp-dur-1) var(--cp-ease-out);
}
.entry-content a:not(.cp-go):not(.cp-card):hover { text-decoration-thickness: 2px; }

:focus-visible {
  outline: 2px solid var(--cp-ardoise);
  outline-offset: 2px;
  border-radius: 1px;
}

/* ═══════════════════════════════════════════════════════════
   3 · GRILLE DE DOCUMENT
   Colonne de lecture étroite, marge de gauche pour les notes.
   ═══════════════════════════════════════════════════════════ */
.single .entry-content,
.page .entry-content,
.cp-doc {
  display: grid;
  grid-template-columns: [note] minmax(0, 13rem) [texte] minmax(0, var(--cp-mesure)) [fin];
  column-gap: var(--cp-s-7);
  justify-content: center;
  padding: 0 var(--cp-s-5);
  max-width: none;
}
.single .entry-content > *,
.page .entry-content > *,
.cp-doc > * { grid-column: texte; }

.single .entry-content > .cp-note,
.page .entry-content > .cp-note,
.cp-doc > .cp-note { grid-column: note; }

.single .entry-content > .cp-large,
.page .entry-content > .cp-large,
.cp-doc > .cp-large { grid-column: note / fin; max-width: var(--cp-mesure-large); }

@media (max-width: 1080px) {
  .single .entry-content,
  .page .entry-content,
  .cp-doc { grid-template-columns: minmax(0, var(--cp-mesure)); }
  .single .entry-content > *, .page .entry-content > *, .cp-doc > * { grid-column: 1; }
}

/* Note de marge — dispositif éditorial, rare sur un site d'affiliation */
.cp-note {
  font-size: var(--cp-t-xs);
  line-height: 1.55;
  color: var(--cp-gris);
  border-top: 2px solid var(--cp-sauge);
  padding-top: var(--cp-s-2);
  align-self: start;
  text-align: right;
}
.cp-note strong { display: block; color: var(--cp-ardoise-fonce); font-weight: 600; }
@media (max-width: 1080px) {
  .cp-note { text-align: left; border-top: none; border-left: 2px solid var(--cp-sauge);
             padding: 0 0 0 var(--cp-s-3); margin: 0 0 var(--cp-s-5); }
}

/* ═══════════════════════════════════════════════════════════
   4 · EN-TÊTE D'ARTICLE
   Le bloc qui nous sépare des comparatifs sans auteur.
   ═══════════════════════════════════════════════════════════ */
.cp-article-header {
  padding: var(--cp-s-9) var(--cp-s-5) var(--cp-s-6);
  max-width: 52rem;
  margin: 0 auto;
}
.cp-kicker {
  font-family: var(--cp-sans);
  font-size: var(--cp-t-xs);
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--cp-sauge-texte);
  margin-bottom: var(--cp-s-4);
}
.cp-article-header h1 { margin: 0; max-width: 20ch; }

.cp-byline {
  display: flex; flex-wrap: wrap; align-items: baseline;
  gap: var(--cp-s-2) var(--cp-s-4);
  margin-top: var(--cp-s-5);
  padding-top: var(--cp-s-4);
  border-top: 1px solid var(--cp-filet);
  font-size: var(--cp-t-sm);
  color: var(--cp-gris);
}
.cp-byline strong { color: var(--cp-texte); font-weight: 600; }
.cp-byline .cp-qualite { font-style: italic; }
.cp-byline-sep { color: var(--cp-filet); }

/* ═══════════════════════════════════════════════════════════
   5 · BLOCS ÉDITORIAUX
   ═══════════════════════════════════════════════════════════ */

/* Mention d'affiliation — obligation légale, en tête */
.cp-affiliate-notice {
  background: var(--cp-sable);
  border-left: 3px solid var(--cp-terracotta);
  padding: var(--cp-s-4) var(--cp-s-5);
  margin: 0 0 var(--cp-s-7);
  font-size: var(--cp-t-sm);
  line-height: 1.6;
}
.cp-affiliate-notice strong { color: var(--cp-terracotta-texte); }

/* Encadré méthode — ce qui a été testé, ce qui ne l'a pas été */
.cp-methodo {
  background: var(--cp-sauge-clair);
  padding: var(--cp-s-5) var(--cp-s-6);
  margin: var(--cp-s-7) 0;
  border-radius: var(--cp-radius);
}
.cp-methodo h3 { margin-top: 0; font-size: var(--cp-t-md); }
.cp-methodo h3:not(:first-child) { margin-top: var(--cp-s-5); }
.cp-methodo ul { margin-bottom: 0; }

/* Verdict — filet épais, corps serré */
.cp-verdict {
  border-top: 3px solid var(--cp-ardoise-fonce);
  padding-top: var(--cp-s-4);
  margin: var(--cp-s-8) 0;
}
.cp-verdict h3 { margin-top: 0; }

/* Bouton sortant */
.cp-go {
  display: inline-block;
  background: var(--cp-ardoise-fonce);
  color: #fff !important;
  padding: var(--cp-s-3) var(--cp-s-5);
  border-radius: var(--cp-radius);
  text-decoration: none !important;
  font-weight: 600;
  font-size: var(--cp-t-sm);
  letter-spacing: .01em;
  transition: background var(--cp-dur-1) var(--cp-ease-out),
              transform var(--cp-dur-1) var(--cp-ease-out);
}
.cp-go:hover  { background: var(--cp-sauge-fond); }
.cp-go:active { transform: translateY(1px); }
.cp-go-note   { display: block; font-size: var(--cp-t-xs); color: var(--cp-gris); margin-top: var(--cp-s-2); }

/* Tableau comparatif — chiffres alignés */
.cp-table {
  width: 100%; border-collapse: collapse;
  margin: var(--cp-s-6) 0; font-size: var(--cp-t-sm);
  font-variant-numeric: tabular-nums;
}
.cp-table th {
  text-align: left; padding: var(--cp-s-3);
  border-bottom: 2px solid var(--cp-ardoise-fonce);
  font-weight: 600; color: var(--cp-ardoise-fonce);
}
.cp-table td { padding: var(--cp-s-3); border-bottom: 1px solid var(--cp-bordure); }

/* Encart autrice */
.cp-author-box {
  display: grid; grid-template-columns: auto minmax(0,1fr);
  gap: var(--cp-s-5); align-items: start;
  border-top: 1px solid var(--cp-filet);
  padding-top: var(--cp-s-5); margin-top: var(--cp-s-9);
}
.cp-author-box img { width: 76px; height: 76px; border-radius: 50%; object-fit: cover; }
.cp-author-box h3 { margin: 0 0 var(--cp-s-2); font-size: var(--cp-t-md); }
.cp-author-box p  { margin: 0; font-size: var(--cp-t-sm); line-height: 1.65; color: var(--cp-gris); }
@media (max-width: 560px) { .cp-author-box { grid-template-columns: minmax(0,1fr); } }

/* ═══════════════════════════════════════════════════════════
   6 · ACCUEIL
   ═══════════════════════════════════════════════════════════ */
.cp-hero {
  padding: var(--cp-s-9) var(--cp-s-5) var(--cp-s-8);
  max-width: 56rem; margin: 0 auto;
}
.cp-hero h1 { max-width: 16ch; margin: 0 0 var(--cp-s-5); }
.cp-hero-lede {
  font-family: var(--cp-serif);
  font-size: var(--cp-t-md); line-height: 1.6;
  color: var(--cp-ardoise); max-width: 42ch; margin: 0;
}
.cp-hero-meta {
  margin-top: var(--cp-s-6); padding-top: var(--cp-s-4);
  border-top: 1px solid var(--cp-filet);
  font-size: var(--cp-t-sm); color: var(--cp-gris);
}

/* Rail de silos — liste numérotée, pas des cartes à ombre */
.cp-rail { max-width: 56rem; margin: 0 auto; padding: 0 var(--cp-s-5) var(--cp-s-9); }
.cp-rail ol { list-style: none; margin: 0; padding: 0; counter-reset: silo; }
.cp-rail li { counter-increment: silo; border-top: 1px solid var(--cp-bordure); }
.cp-rail a.cp-card {
  display: grid; grid-template-columns: 3rem minmax(0,1fr);
  gap: var(--cp-s-4); align-items: baseline;
  padding: var(--cp-s-5) 0; text-decoration: none; color: inherit;
  transition: background var(--cp-dur-2) var(--cp-ease-out);
}
.cp-rail a.cp-card:hover { background: var(--cp-sable); }
.cp-rail a.cp-card::before {
  content: counter(silo, decimal-leading-zero);
  font-size: var(--cp-t-xs); font-weight: 600; letter-spacing: .1em;
  color: var(--cp-sauge-texte);
}
.cp-rail h3 { margin: 0 0 var(--cp-s-2); font-size: var(--cp-t-lg); }
.cp-rail p  { margin: 0; font-size: var(--cp-t-sm); color: var(--cp-gris); line-height: 1.6; }
@media (max-width: 560px) { .cp-rail a.cp-card { grid-template-columns: minmax(0,1fr); gap: var(--cp-s-2); } }

/* Déclaration — Ft5 */
.cp-statement {
  background: var(--cp-ardoise-fonce); color: #fff;
  padding: var(--cp-s-9) var(--cp-s-5);
}
.cp-statement-inner { max-width: 44rem; margin: 0 auto; }
.cp-statement p {
  font-family: var(--cp-serif); font-size: var(--cp-t-lg);
  line-height: 1.45; margin: 0 0 var(--cp-s-4);
}
.cp-statement p:last-child { margin-bottom: 0; }
.cp-statement .cp-sig { font-family: var(--cp-sans); font-size: var(--cp-t-sm); color: #B9C4D0; }

/* ═══════════════════════════════════════════════════════════
   7 · CHROME
   ═══════════════════════════════════════════════════════════ */
.site-header { border-bottom: 1px solid var(--cp-bordure); }
.main-navigation { background: transparent; }
.main-navigation a { font-size: var(--cp-t-sm); letter-spacing: .01em; }

.rank-math-breadcrumb {
  max-width: 52rem; margin: 0 auto; padding: var(--cp-s-4) var(--cp-s-5) 0;
  font-size: var(--cp-t-xs); color: var(--cp-gris);
}

.site-footer, .site-info { background: var(--cp-sable); border-top: 1px solid var(--cp-bordure); }
.site-info { font-size: var(--cp-t-xs); color: var(--cp-gris); }

/* ═══════════════════════════════════════════════════════════
   8 · MOUVEMENT RÉDUIT
   ═══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}