/* =========================================================
 * Advenn Article — mise en forme du contenu des articles
 *
 * - Titres, images et blocs divers : pleine largeur de la trame.
 * - Groupes de paragraphes fournis : deux colonnes (desktop),
 *   un paragraphe n'est jamais coupé entre deux colonnes.
 * - Mobile (< 768px) : une seule colonne partout.
 * ========================================================= */

.advenn-article {
	width: 100%;
	max-width: 1280px;
	margin-inline: auto;
	padding-inline: 15px;
	font-family: var(--font-body, "Sora", sans-serif);
	color: var(--color-bleu-atlantique, #004056);
}

/* ---- Blocs pleine largeur (titres, images, listes, citations) ---- */
.advenn-article__block {
	margin-block: 40px;
}
.advenn-article__block > h2,
.advenn-article__block > h3 {
	font-family: var(--font-heading, "Ancizar Sans", sans-serif);
	font-weight: 700;
	line-height: 1.1;
	color: var(--color-bleu-atlantique, #004056);
	margin: 0;
}
.advenn-article__block > h2 {
	font-size: clamp(2rem, 4.5vw, 3.4rem);
}
.advenn-article__block > h3 {
	font-size: clamp(1.5rem, 2.6vw, 2.1rem);
}

/* Images : pleine largeur de la trame */
.advenn-article__block img,
.advenn-article__block figure {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
}
.advenn-article__block figcaption {
	margin-top: 12px;
	font-size: 0.9rem;
	opacity: 0.75;
}

/* ---- Paragraphes ---- */
.advenn-article__prose,
.advenn-article__cols {
	margin-block: 32px;
	font-size: 1.05rem;
	line-height: 1.65;
}
.advenn-article__prose p,
.advenn-article__cols p {
	margin: 0 0 1.2em;
}
.advenn-article__prose p:last-child,
.advenn-article__cols p:last-child {
	margin-bottom: 0;
}

/* Deux colonnes — le texte coule d'une colonne à l'autre pour que
   les deux hauteurs s'équilibrent, même avec des paragraphes très
   inégaux (un paragraphe peut donc être coupé en cours de route). */
.advenn-article__cols {
	column-count: 2;
	column-gap: 60px;
	column-fill: balance;
}
/* Pas de ligne isolée en haut ou en bas d'une colonne */
.advenn-article__cols p {
	orphans: 3;
	widows: 3;
}

/* Liens dans le corps de l'article */
.advenn-article a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.advenn-article a:hover {
	color: var(--color-vert-crozon, #009993);
}

/* =========================================================
   Mobile (< 768px) : une seule colonne, tout pleine largeur
   ========================================================= */
@media (max-width: 767px) {
	.advenn-article {
		padding-inline: 20px;
	}
	.advenn-article__cols {
		column-count: 1;
		column-gap: normal;
	}
	.advenn-article__block {
		margin-block: 28px;
	}
	.advenn-article__prose,
	.advenn-article__cols {
		margin-block: 24px;
		font-size: 1rem;
	}
}
