/* ==========================================================================
   ARTICLE — largeur de lecture confortable, typographie éditoriale
   ========================================================================== */

.sc-article { padding-bottom: var(--sc-s6); }

.sc-article__head {
	padding-block: var(--sc-s4) var(--sc-s5);
	max-width: var(--sc-article);
	margin-inline: auto;
}
.sc-article__title {
	font-family: var(--sc-serif);
	font-size: clamp(2rem, 1.3rem + 2.2vw, 3.15rem);
	line-height: 1.12;
	letter-spacing: -0.016em;
	margin: var(--sc-s2) 0 var(--sc-s3);
	text-wrap: balance;
}
.sc-article__lede {
	font-size: clamp(1.1rem, 1rem + .45vw, 1.32rem);
	line-height: 1.6;
	color: var(--sc-text-soft);
	margin-bottom: var(--sc-s4);
}
.sc-article__meta {
	padding-top: var(--sc-s3);
	border-top: var(--sc-border-w) solid var(--sc-border);
}

/* Image principale — largeur généreuse, coins quasi droits (§20) */
.sc-article__figure { margin-bottom: var(--sc-s5); }
.sc-article__figure img {
	width: 100%;
	border-radius: var(--sc-radius-md);
	border: var(--sc-border-w) solid var(--sc-border-light);
}
.sc-article__figure figcaption {
	margin-top: .7rem;
	font-size: var(--sc-fs-sm);
	color: var(--sc-muted);
	text-align: center;
}

/* --------------------------------------------------------------------------
   Corps de texte — 720 px (§21)
   -------------------------------------------------------------------------- */

.sc-prose {
	max-width: var(--sc-article);
	margin-inline: auto;
	font-size: var(--sc-fs-body);
	line-height: var(--sc-lh-body);
	color: var(--sc-text-soft);
}

.sc-prose > * + * { margin-top: 1.5em; }

.sc-prose h2 {
	font-family: var(--sc-serif);
	font-size: clamp(1.6rem, 1.25rem + 1.1vw, 2.15rem);
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--sc-text);
	margin-top: 2.4em;
	margin-bottom: .1em;
	scroll-margin-top: calc(var(--sc-header-h) + 1.5rem);
}
.sc-prose h3 {
	font-family: var(--sc-serif);
	font-size: clamp(1.25rem, 1.1rem + .6vw, 1.55rem);
	line-height: 1.28;
	color: var(--sc-text);
	margin-top: 2em;
	margin-bottom: .1em;
	scroll-margin-top: calc(var(--sc-header-h) + 1.5rem);
}
.sc-prose h4 {
	font-family: var(--sc-sans);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--sc-text);
	margin-top: 1.9em;
}

.sc-prose p { margin-bottom: 0; }

.sc-prose a {
	color: var(--sc-green);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-decoration-color: var(--sc-gold-soft);
	text-underline-offset: 3px;
}
.sc-prose a:hover { text-decoration-color: var(--sc-green); }

.sc-prose strong { font-weight: 600; color: var(--sc-text); }
.sc-prose em { font-style: italic; }

.sc-prose ul, .sc-prose ol { padding-left: 1.3em; }
.sc-prose li + li { margin-top: .55em; }
.sc-prose ul { list-style: none; padding-left: 1.4em; }
.sc-prose ul > li { position: relative; }
.sc-prose ul > li::before {
	content: '';
	position: absolute;
	left: -1.15em; top: .72em;
	width: 5px; height: 5px;
	border-radius: 50%;
	background: var(--sc-gold);
}
.sc-prose ol { list-style: decimal; }
.sc-prose ol > li::marker { color: var(--sc-gold); font-variant-numeric: tabular-nums; }

.sc-prose blockquote {
	margin-inline: 0;
	padding: .3em 0 .3em 1.6rem;
	border-left: 2px solid var(--sc-gold);
	font-family: var(--sc-serif);
	font-size: 1.35rem;
	line-height: 1.5;
	font-style: italic;
	color: var(--sc-green);
}
.sc-prose blockquote p + p { margin-top: .6em; }
.sc-prose blockquote cite {
	display: block;
	margin-top: .8rem;
	font-family: var(--sc-sans);
	font-size: var(--sc-fs-sm);
	font-style: normal;
	color: var(--sc-muted);
}

.sc-prose figure { margin-block: 2.2em; }
.sc-prose figure img { width: 100%; border-radius: var(--sc-radius); }
.sc-prose figcaption {
	margin-top: .65rem;
	font-size: var(--sc-fs-sm);
	line-height: 1.5;
	color: var(--sc-muted);
	text-align: center;
}

.sc-prose code {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: .875em;
	padding: .15em .4em;
	background: var(--sc-bg-warm);
	border-radius: 3px;
}

/* --------------------------------------------------------------------------
   Tableaux (§25)
   -------------------------------------------------------------------------- */

.sc-table-wrap {
	margin-block: 2.2em;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: var(--sc-border-w) solid var(--sc-border);
	border-radius: var(--sc-radius);
}
.sc-prose table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--sc-fs-ui);
	background: var(--sc-surface);
	min-width: 480px;
}
.sc-prose th, .sc-prose td {
	padding: .85rem 1.1rem;
	text-align: left;
	border-bottom: var(--sc-border-w) solid var(--sc-border-light);
	vertical-align: top;
}
.sc-prose thead th {
	background: var(--sc-bg-warm);
	font-family: var(--sc-sans);
	font-size: var(--sc-fs-xs);
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--sc-green);
	border-bottom-color: var(--sc-border);
}
.sc-prose tbody tr:last-child td { border-bottom: 0; }
.sc-prose tbody tr:hover { background: var(--sc-surface-alt); }

/* --------------------------------------------------------------------------
   Sommaire (§23)
   -------------------------------------------------------------------------- */

.sc-toc {
	max-width: var(--sc-article);
	margin: 0 auto var(--sc-s5);
	padding: var(--sc-s3) var(--sc-s4);
	background: var(--sc-surface-alt);
	border: var(--sc-border-w) solid var(--sc-border);
	border-radius: var(--sc-radius);
}
.sc-toc__title {
	font-family: var(--sc-sans);
	font-size: var(--sc-fs-xs);
	font-weight: 600;
	letter-spacing: var(--sc-ls-kicker);
	text-transform: uppercase;
	color: var(--sc-gold);
	margin-bottom: var(--sc-s2);
}
.sc-toc__list { list-style: none; margin: 0; padding: 0; counter-reset: sc-toc; }
.sc-toc__item { line-height: 1.45; }
.sc-toc__item + .sc-toc__item { margin-top: .5rem; }
.sc-toc__item a {
	font-size: var(--sc-fs-ui);
	color: var(--sc-text-soft);
	text-decoration: none;
	transition: color .2s var(--sc-ease);
}
.sc-toc__item a:hover { color: var(--sc-green); text-decoration: underline; }
.sc-toc__item--h2 { counter-increment: sc-toc; }
.sc-toc__item--h2 > a::before {
	content: counter(sc-toc) '.';
	margin-right: .5rem;
	color: var(--sc-gold);
	font-variant-numeric: tabular-nums;
}
.sc-toc__item--h3 { padding-left: 1.55rem; }
.sc-toc__item--h3 > a { font-size: var(--sc-fs-sm); color: var(--sc-muted); }

/* --------------------------------------------------------------------------
   Blocs éditoriaux (§24) — variations très subtiles d'une même palette
   -------------------------------------------------------------------------- */

.sc-note {
	margin-block: 2.2em;
	padding: var(--sc-s3) var(--sc-s4);
	background: var(--sc-surface-alt);
	border: var(--sc-border-w) solid var(--sc-border-light);
	border-left: 3px solid var(--sc-green);
	border-radius: var(--sc-radius);
	font-size: var(--sc-fs-ui);
	line-height: 1.68;
}
.sc-note__label {
	display: flex;
	align-items: center;
	gap: .5rem;
	margin-bottom: .6rem;
	font-family: var(--sc-sans);
	font-size: var(--sc-fs-xs);
	font-weight: 600;
	letter-spacing: var(--sc-ls-kicker);
	text-transform: uppercase;
	color: var(--sc-green);
}
.sc-note__body > * + * { margin-top: .9em; }
.sc-note__body p:last-child { margin-bottom: 0; }

.sc-note--retenir   { border-left-color: var(--sc-green); }
.sc-note--savoir    { border-left-color: var(--sc-u-concentration); }
.sc-note--savoir .sc-note__label { color: var(--sc-u-concentration); }
.sc-note--science   { border-left-color: var(--sc-u-performance); }
.sc-note--science .sc-note__label { color: var(--sc-u-performance); }
.sc-note--conseil   { border-left-color: var(--sc-gold); background: #faf4e9; }
.sc-note--conseil .sc-note__label { color: #8a6220; }
.sc-note--attention { border-left-color: var(--sc-u-longevite); background: #faf1ee; }
.sc-note--attention .sc-note__label { color: var(--sc-u-longevite); }

/* --------------------------------------------------------------------------
   FAQ (§26)
   -------------------------------------------------------------------------- */

.sc-faq { max-width: var(--sc-article); margin: var(--sc-s6) auto 0; }
.sc-faq__title {
	font-family: var(--sc-serif);
	font-size: var(--sc-fs-h2);
	line-height: 1.2;
	margin-bottom: var(--sc-s3);
}
.sc-faq__item { border-top: var(--sc-border-w) solid var(--sc-border); }
.sc-faq__item:last-child { border-bottom: var(--sc-border-w) solid var(--sc-border); }
.sc-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sc-s3);
	padding: 1.25rem 0;
	cursor: pointer;
	list-style: none;
	font-family: var(--sc-serif);
	font-size: 1.2rem;
	line-height: 1.35;
	color: var(--sc-text);
	transition: color .2s var(--sc-ease);
}
.sc-faq__q::-webkit-details-marker { display: none; }
.sc-faq__q:hover { color: var(--sc-green); }
.sc-faq__q .sc-icon { color: var(--sc-gold); flex: none; transition: transform .28s var(--sc-ease); }
.sc-faq__item[open] .sc-faq__q .sc-icon { transform: rotate(45deg); }
.sc-faq__a {
	padding-bottom: 1.35rem;
	font-size: var(--sc-fs-ui);
	line-height: 1.7;
	color: var(--sc-muted);
}
.sc-faq__a > * + * { margin-top: 1em; }

/* --------------------------------------------------------------------------
   Sources (§27)
   -------------------------------------------------------------------------- */

.sc-sources {
	max-width: var(--sc-article);
	margin: var(--sc-s6) auto 0;
	padding-top: var(--sc-s4);
	border-top: var(--sc-border-w) solid var(--sc-border);
}
.sc-sources__title {
	font-family: var(--sc-sans);
	font-size: var(--sc-fs-xs);
	font-weight: 600;
	letter-spacing: var(--sc-ls-kicker);
	text-transform: uppercase;
	color: var(--sc-gold);
	margin-bottom: var(--sc-s3);
}
.sc-sources__body { font-size: var(--sc-fs-sm); line-height: 1.7; color: var(--sc-muted); }
.sc-sources__body ol, .sc-sources__body ul { padding-left: 1.2em; }
.sc-sources__body li + li { margin-top: .5em; }
.sc-sources__body a { color: var(--sc-green); }

/* --------------------------------------------------------------------------
   Auteur en pied d'article (§28)
   -------------------------------------------------------------------------- */

.sc-author {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	gap: var(--sc-s4);
	align-items: start;
	max-width: var(--sc-article);
	margin: var(--sc-s6) auto 0;
	padding: var(--sc-s4);
	background: var(--sc-surface-alt);
	border: var(--sc-border-w) solid var(--sc-border-light);
	border-radius: var(--sc-radius);
}
.sc-author__img { width: 96px; height: 96px; border-radius: 50%; }
.sc-author__name { font-family: var(--sc-serif); font-size: 1.4rem; line-height: 1.2; margin: .3rem 0 .25rem; }
.sc-author__role { font-size: var(--sc-fs-sm); color: var(--sc-gold); font-weight: 500; margin-bottom: .7rem; }
.sc-author__bio { font-size: var(--sc-fs-sm); line-height: 1.65; color: var(--sc-muted); margin-bottom: .9rem; }

/* --------------------------------------------------------------------------
   À lire aussi (§29)
   -------------------------------------------------------------------------- */

.sc-related {
	margin-top: var(--sc-s7);
	padding-top: var(--sc-s5);
	border-top: var(--sc-border-w) solid var(--sc-border);
}
.sc-related__title {
	font-family: var(--sc-serif);
	font-size: var(--sc-fs-h2);
	line-height: 1.2;
	margin-bottom: var(--sc-s2);
}
.sc-related__head .sc-rule { width: 42px; margin-bottom: var(--sc-s4); }