/*
 * Druette — blog : liste des articles, rubriques, article. Chargée seulement sur ces pages (inc/assets.php).
 * Les cartes d'article sont dans theme.css (communes avec la section « Le blog » de l'accueil).
 */

/* ---------- Liste et rubriques ---------- */

.dru-blog-head__title {
	font-size: clamp(2rem, 5vw, 2.75rem);
}

.dru-blog-head .dru-accroche > * {
	margin: 0;
}

.dru-main--blog > .dru-category-nav {
	margin-top: calc(36 * var(--px));
}

.dru-main--blog > .dru-post-list {
	margin-top: calc(64 * var(--px));
}

.dru-post-card__cat {
	margin: calc(28 * var(--px)) 0 0;
	color: var(--dru-corail);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2;
	text-transform: uppercase;
}

.dru-post-card__cat + .dru-post-card__title {
	margin-top: 0.4rem;
}

.dru-post-list__empty {
	font-size: 1.125rem;
	font-weight: 600;
	text-align: center;
}

/* ---------- Article ---------- */

.dru-main--single {
	padding-bottom: calc(80 * var(--px));
}

.dru-article {
	margin-top: calc(40 * var(--px)) !important;
}

.dru-article > * {
	margin-block: 0;
}

.dru-article > .dru-surtitre {
	font-size: 0.9375rem;
}

.dru-article > .dru-page-title {
	margin: calc(12 * var(--px)) 0 0;
	font-size: clamp(2rem, 5vw, 2.75rem);
}

.dru-article > .dru-post-date {
	margin-top: 0.75rem;
	font-size: 0.9375rem;
}

.dru-article > .dru-post-image {
	margin-top: calc(40 * var(--px));
	overflow: hidden;
	border-radius: var(--dru-radius);
}

.dru-article > .dru-prose {
	margin-top: calc(40 * var(--px));
	font-size: 1.0625rem;
}

/* « À lire aussi » : sous l'article, sur toute la largeur du contenu. */
.dru-main--after {
	padding-top: 0;
}

.dru-related-posts {
	padding-top: calc(72 * var(--px));
	border-top: 2px dotted var(--dru-sable);
}

.dru-related-posts .dru-post-grid {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 410px));
	justify-content: center;
	margin-top: calc(48 * var(--px));
}

.dru-related-posts__all {
	margin: calc(56 * var(--px)) 0 0;
	text-align: center;
}