/**
 * Typographie site — Tout en Papier
 * Display (h1 / marque) : Abril Fatface
 * Secondaire (h2–h4, cartes) : Nunito Sans
 * Corps : Comfortaa (Divi)
 */

:root {
	--tep-font-display: 'Abril Fatface', Georgia, serif;
	--tep-font-secondary: 'Nunito Sans', 'Segoe UI', sans-serif;
	--tep-font-body: Comfortaa, 'Segoe UI', sans-serif;
	--tep-ink: #2d3436;

	/* Interlignages — révision du 2026-08-20 */
	--tep-lh-display: 1.15; /* titres Abril Fatface */
	--tep-lh-titre: 1.25;   /* titres Nunito Sans */
	--tep-lh-texte: 1.65;   /* corps de texte */
}

/* Titres secondaires : lisibles, plus Abril Fatface */
body:not(.et-fb) h2,
body:not(.et-fb) h3,
body:not(.et-fb) h4,
.et_pb_text h2,
.et_pb_text h3,
.et_pb_text h4,
.et_pb_module_header,
.widgettitle,
.widget-title {
	font-family: var(--tep-font-secondary) !important;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: var(--tep-lh-titre);
	color: var(--tep-ink);
}

/* H1 / titre produit : conserver Abril (display) */
body:not(.et-fb) h1,
.et_pb_wc_title h1,
.et_pb_wc_title .product_title,
.logo_container,
#logo {
	font-family: var(--tep-font-display);
}

/* ==================================================================
 * ÉCHELLE TYPOGRAPHIQUE ÉDITORIALE — révision du 2026-08-20
 * Avant : h1 60px avec un interligne de 1,6 ; corps 16px interligne 2,2 ;
 * h2 à peine au-dessus du corps. Titres écrasants, hiérarchie molle,
 * interlignages très au-dessus des usages éditoriaux.
 * Après : échelle fluide (clamp) du mobile au grand écran, interlignes
 * resserrés, hiérarchie h1 > h2 > h3 > corps nettement lisible.
 * Les familles de caractères et les couleurs ne changent pas.
 * ================================================================== */

/* --- H1 : titre d'article et titre de page --- */
body:not(.et-fb) h1,
body:not(.et-fb) .et_pb_title_container h1 {
	font-size: clamp(1.9rem, 1.15rem + 2.6vw, 2.75rem); /* 30 → 44 px */
	line-height: var(--tep-lh-display);
	letter-spacing: -0.005em;
}

/* Titre de l'article seul : bat la règle Divi (60px au-delà de 981px) */
body:not(.et-fb).single .et_post_meta_wrapper h1 {
	font-size: clamp(1.9rem, 1.15rem + 2.6vw, 2.75rem);
	line-height: var(--tep-lh-display);
	padding-bottom: 0.3em;
}

/* --- Titres d'articles en liste : accueil, archives, recherche --- */
body:not(.et-fb).home-posts #left-area .et_pb_post h2,
body:not(.et-fb).archive #left-area .et_pb_post h2,
body:not(.et-fb).search #left-area .et_pb_post h2 {
	font-size: clamp(1.5rem, 1.15rem + 1.15vw, 2.25rem); /* 24 → 36 px */
	line-height: 1.2;
}

/* --- Titres internes de l'article --- */
body:not(.et-fb) h2 {
	font-size: clamp(1.35rem, 1.05rem + 0.9vw, 1.75rem); /* 21,6 → 28 px */
}

body:not(.et-fb) h3 {
	font-size: clamp(1.15rem, 1rem + 0.5vw, 1.375rem); /* 18,4 → 22 px */
	line-height: 1.3;
}

body:not(.et-fb) h4 {
	font-size: 1.05rem;
	line-height: 1.35;
}

/* Les titres de la colonne latérale gardent leur échelle propre */
#sidebar .widgettitle,
#sidebar .widget-title,
#main-footer .widgettitle {
	font-size: 1.125rem;
	line-height: 1.3;
}

/* --- Corps du texte éditorial --- */
#left-area .entry-content p,
#left-area .entry-content li,
#left-area .entry-content td,
#left-area .entry-content blockquote,
#left-area .et_pb_post > p,
.et_pb_post_content p,
.et_pb_post_content li {
	font-size: clamp(1rem, 0.95rem + 0.22vw, 1.0625rem); /* 16 → 17 px */
	line-height: var(--tep-lh-texte);
}

/* --- Rythme vertical : un interligne resserré demande de vraies marges --- */
#left-area .entry-content h2 {
	margin-top: 1.9em;
	padding-bottom: 0.4em;
}

#left-area .entry-content h3 {
	margin-top: 1.6em;
	padding-bottom: 0.3em;
}

#left-area .entry-content p {
	padding-bottom: 1.05em;
}

#left-area .entry-content ul,
#left-area .entry-content ol {
	padding-bottom: 1.2em;
}

#left-area .entry-content figure {
	margin-top: 1.6em;
	margin-bottom: 1.6em;
}

#left-area .entry-content figcaption {
	font-size: 0.8125rem;
	line-height: 1.45;
}

/* Le premier titre après le chapô n'a pas besoin d'autant d'air */
#left-area .entry-content > h2:first-child {
	margin-top: 0;
}

/* Cartes produit (boutique + related) */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2,
ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--tep-font-secondary) !important;
	font-size: 0.95rem !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	letter-spacing: 0 !important;
	padding-bottom: 6px !important;
}
