/**
 * Corps d'article -- la forme du modèle validé par le cabinet (run 749, clients/perinea/modele-article-perinea.src.html),
 * posée sur le site par le run 829 : planche validée par Monsieur (#7 du 23/10/2026), sources repliées à sa demande
 * (« un design plus élégant et discret pour les sources », « ça prend beaucoup de place »).
 *
 * Chargée sur les seuls articles (functions.php). Couleurs : jetons du thème seulement.
 * Spécificité : la colonne de lecture (style.css, `.full-width-content .entry-content > :not(...)`) fixe la largeur
 * maximale (44 rem) et le retrait latéral (1,5 rem) de chaque enfant direct du corps, et l'emporte sur ces règles.
 * Les encadrés en héritent au bureau ; sur téléphone, leur largeur les ramène sur les bords du texte (planche
 * validée, mesurée le 23/10/2026 : 704 px à 1440, 342 px à 390).
 */

/* Titre et intertitres : un titre de patient est long (99 signes pour le premier article) ; à la taille du H1 des
   pages, il prenait quatre lignes à 1440 px. */
.perinea-article .dtb-hero-title {
	max-width: 30ch;
	font-size: clamp(1.75rem, 1.35rem + 1.6vw, 2.625rem);
}

.perinea-article .entry-content > h2:not([class*="dtb-"]) {
	font-size: clamp(1.5rem, 1.25rem + 0.8vw, 1.875rem);
	font-weight: 600;
	line-height: 1.25;
}

.perinea-article .entry-content > h3:not([class*="dtb-"]) {
	font-size: clamp(1.125rem, 1.05rem + 0.3vw, 1.3125rem);
	font-weight: 600;
	line-height: 1.3;
}

/* Encadrés (l'essentiel, sources, signature) : la largeur de la colonne au bureau, les bords du texte sur
   téléphone. */
.perinea-article .entry-content > .essentiel,
.perinea-article .entry-content > .sources,
.perinea-article .entry-content > .signature {
	box-sizing: border-box;
	width: calc(100% - 3rem);
	margin-inline: auto;
}

/* L'essentiel : filet à gauche, fond nude, libellé en petites capitales. */
.perinea-article .entry-content > .essentiel {
	margin-top: 1.5rem;
	padding-block: 1rem;
	border-left: 3px solid var(--dt-primary);
	background: var(--perinea-nude-100);
}

.perinea-article .essentiel .lbl {
	margin: 0 0 0.5rem;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dt-primary);
}

.perinea-article .essentiel p {
	margin: 0;
}

/* Les sources : un cadre fin, replié ; le titre et le nombre de références restent visibles, la liste s'ouvre d'un
   clic. Ouverte, elle est en petit et atténuée, chaque lien réduit au nom du site. */
.perinea-article .entry-content > .sources {
	margin-top: 3rem;
	padding-block: 0;
	border: 1px solid var(--dt-border);
}

.perinea-article .sources > summary {
	display: flex;
	align-items: baseline;
	gap: 0.75rem;
	padding-block: 0.875rem;
	list-style: none;
	cursor: pointer;
	color: var(--dt-text-muted);
}

.perinea-article .sources > summary::-webkit-details-marker {
	display: none;
}

.perinea-article .sources > summary h2 {
	margin: 0;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dt-primary);
}

.perinea-article .sources-nombre {
	font-size: 0.875rem;
}

.perinea-article .sources > summary::after {
	content: "+";
	margin-left: auto;
	font-size: 1.125rem;
	line-height: 1;
	color: var(--dt-primary);
}

.perinea-article .sources[open] > summary::after {
	content: "\2212";
}

.perinea-article .sources > summary:focus-visible {
	outline: 2px solid var(--dt-primary);
	outline-offset: 4px;
}

.perinea-article .sources ol {
	display: grid;
	gap: 0.375rem;
	margin: 0 0 1rem;
	padding-left: 1.75em;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--dt-text-muted);
}

.perinea-article .sources li {
	overflow-wrap: anywhere;
}

.perinea-article .sources li::marker {
	font-variant-numeric: tabular-nums;
}

.perinea-article .sources a {
	color: inherit;
	text-decoration-color: var(--dt-border);
	text-underline-offset: 0.2em;
}

.perinea-article .sources a:hover,
.perinea-article .sources a:focus-visible {
	color: var(--dt-primary);
	text-decoration-color: currentColor;
}

/* La signature : le même cadre fin que les sources. */
.perinea-article .entry-content > .signature {
	margin-top: 1rem;
	padding-block: 0.875rem;
	border: 1px solid var(--dt-border);
	font-size: 0.9375rem;
	color: var(--dt-text-muted);
}

.perinea-article .signature p {
	margin: 0;
}

.perinea-article .signature strong {
	color: var(--dt-primary);
}
