/*
Theme Name: Espace Maurice Blanchot
Theme URI: https://blanchot.fr
Description: Thème enfant de Backstreet pour l'Espace Maurice Blanchot.
Author: Espace Maurice Blanchot
Template: backstreet
Version: 1.2
Text Domain: emb-blanchot
*/

/* =========================================================
   1. Couleurs
   ========================================================= */

:root {
	--emb-ivoire:       #FBF8F2;
	--emb-ivoire-sourd: #F3EEE4;
	--emb-encre:        #14110E;
	--emb-gris:         #6D6559;
	--emb-filet:        #DCD3C3;
}

body,
.site-content,
.primary-area,
.site-main {
	background-color: var(--emb-ivoire);
	color: var(--emb-encre);
}

.site-header,
.topbar {
	background-color: var(--emb-ivoire);
}

/* =========================================================
   2. Texte courant
   ========================================================= */

body {
	line-height: 1.72;
}

.entry-content p {
	margin: 0 0 1.15em;
}

/* Les métadonnées restent en sans-serif, malgré le réglage
   « heading font » du thème parent qui les emporte avec les titres. */
ul.entry-meta,
ul.entry-meta a,
.entry-meta-container,
.single-tags,
.read-more a,
.pagination .pagi-item,
.pagination .post-page-numbers {
	font-family: Oswald, "Helvetica Neue", Arial, sans-serif;
	font-size: .78rem;
	letter-spacing: .05em;
	color: var(--emb-gris);
}

/* =========================================================
   3. Liens
   ========================================================= */

.entry-content a {
	color: var(--emb-encre);
	text-decoration: none;
	border-bottom: 1px solid var(--emb-filet);
}

.entry-content a:hover {
	border-bottom-color: var(--emb-encre);
	color: var(--emb-encre);
}

/* =========================================================
   4. Listes d'articles — accueil, catégories, archives
   ========================================================= */

.post-item {
	border-bottom: 1px solid var(--emb-filet);
	padding-bottom: 2.2rem;
	margin-bottom: 2.2rem;
}

article.post-default {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 11rem;
	grid-template-rows: auto auto;
	column-gap: 2.5rem;
	align-items: start;
}

article.post-default .entry-header  { grid-column: 1; grid-row: 1; }
article.post-default .entry-content { grid-column: 1; grid-row: 2; }

article.post-default .entry-featured {
	grid-column: 2;
	grid-row: 1 / span 2;
	margin: 0;
}

article.post-default .entry-featured img {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid var(--emb-filet);
}

article.post-default .entry-title {
	font-size: clamp(1.45rem, 3vw, 2rem);
	line-height: 1.16;
	margin: 0 0 .35rem;
}

article.post-default .entry-title a {
	border: 0;
}

.emb-extrait {
	max-width: 36rem;
	margin: .8rem 0 0;
}

.emb-lire {
	display: inline-block;
	margin-top: .8rem;
	font-family: Oswald, "Helvetica Neue", Arial, sans-serif;
	font-size: .78rem;
	letter-spacing: .06em;
	color: var(--emb-gris);
	border-bottom: 1px solid var(--emb-filet);
}

.emb-lire:hover {
	color: var(--emb-encre);
	border-bottom-color: var(--emb-encre);
}

/* Sur petit écran : une seule colonne, image au-dessus et bridée. */
@media (max-width: 48rem) {

	article.post-default {
		display: block;
	}

	article.post-default .entry-featured {
		margin-bottom: 1rem;
	}

	article.post-default .entry-featured img {
		max-height: 60vh;
		width: auto;
		max-width: 100%;
	}
}

/* =========================================================
   5. Page d'article — colonne de lecture
   ========================================================= */

.single .entry-content.article-content {
	max-width: 38rem;
	margin-left: auto;
	margin-right: auto;
}

.single .entry-header-single .entry-title {
	max-width: 38rem;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.06;
}

.single .entry-content blockquote {
	margin: 2em 0;
	padding-left: 1.4rem;
	border-left: 1px solid var(--emb-filet);
	font-size: .97rem;
	line-height: 1.68;
}

.single .entry-content img {
	max-width: 100%;
	height: auto;
}

/* =========================================================
   6. Filets et pied de page
   ========================================================= */

.site-header {
	border-bottom: 1px solid var(--emb-encre);
}

.widget .widget-title {
	border-bottom: 1px solid var(--emb-encre);
	padding-bottom: .4rem;
}

/* =========================================================
   7. Page d'article — images et habillage  (v0.3)
   ========================================================= */

/* Aucune image ne dépasse la colonne, et rien n'habille le texte :
   dans une mesure de 35rem, un texte enroulé autour d'une image
   tombe à trois mots par ligne. */
.single .entry-content img,
.single .entry-content figure {
	max-width: 100%;
	height: auto;
	float: none !important;
	display: block;
	margin: 2.2rem 0;
}

.single .entry-content .alignleft,
.single .entry-content .alignright,
.single .entry-content .aligncenter {
	float: none !important;
	margin: 2.2rem 0;
}

.single .entry-content figcaption,
.single .entry-content .wp-caption-text {
	font-family: Oswald, "Helvetica Neue", Arial, sans-serif;
	font-size: .74rem;
	letter-spacing: .04em;
	color: var(--emb-gris);
	margin-top: .5rem;
}

/* =========================================================
   8. Boutons de partage colorés
   ========================================================= */

.entry-share,
.social-share,
.share-buttons,
.post-share,
.entry-social {
	display: none;
}

/* =========================================================
   9. Logo en texte
   ========================================================= */

.emb-logo {
	display: inline-block;
	border: 0;
	text-decoration: none;
}

.emb-logo__texte {
	font-family: "Cormorant Garamond", Georgia, serif;
	font-weight: 500;
	font-size: clamp(1.7rem, 4.6vw, 3.1rem);
	line-height: 1.02;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--emb-encre);
	white-space: nowrap;
}

.emb-logo--mobile .emb-logo__texte,
.emb-logo--sticky .emb-logo__texte {
	font-size: 1.15rem;
	letter-spacing: .05em;
	white-space: normal;
}

.emb-logo--footer .emb-logo__texte {
	font-size: 1.5rem;
}

@media (max-width: 40rem) {
	.emb-logo__texte {
		white-space: normal;
	}
}

/* =========================================================
   10. Images dans l'article — conteneurs de blocs  (v0.5)
   ========================================================= */

/* Le bloc image de l'éditeur enveloppe la figure dans un div
   qui conserve les marges d'alignement : il faut le neutraliser
   lui aussi, sinon l'image sort de la colonne de lecture. */
.single .entry-content .wp-block-image,
.single .entry-content .wp-block-image figure,
.single .entry-content figure.alignleft,
.single .entry-content figure.alignright,
.single .entry-content figure.aligncenter {
	float: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: 100% !important;
}

.single .entry-content .wp-block-image {
	margin-top: 2.2rem;
	margin-bottom: 2.2rem;
}

.single .entry-content .wp-block-image img {
	max-width: 100% !important;
	height: auto !important;
}

/* =========================================================
   11. Libellés de service — articles liés, commentaires
   ========================================================= */

.related-posts h2,
.related-posts h3,
.related-posts h4,
.entry-comments h2,
.entry-comments h3,
#comments h2,
#comments h3,
.comment-reply-title,
.entry-navigation .nav-label {
	font-family: Oswald, "Helvetica Neue", Arial, sans-serif;
	font-size: .76rem !important;
	font-weight: 500;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--emb-gris);
	border-bottom: 1px solid var(--emb-filet);
	padding-bottom: .4rem;
	margin-bottom: 1.2rem;
}

.entry-navigation {
	border-top: 1px solid var(--emb-filet);
	padding-top: 1.1rem;
	margin-top: 2.5rem;
}

.entry-share,
.entry-share.share-bottom {
	display: none !important;
}

/* =========================================================
   12. Composition du texte  (v0.6)
   ========================================================= */

.single .entry-content.article-content {
	font-size: 1.08rem;
	line-height: 1.78;
	color: #1A1712;

	/* Justification avec césures. Pour revenir au drapeau,
	   supprimer les deux lignes text-align et hyphens. */
	text-align: justify;
	hyphens: auto;
	-webkit-hyphens: auto;

	text-rendering: optimizeLegibility;
	font-kerning: normal;
	font-variant-ligatures: common-ligatures;
}

/* Paragraphes séparés par un blanc, sans alinéa : les notices
   du site sont des paragraphes autonomes, pas un texte continu. */
.single .entry-content.article-content p {
	margin: 0 0 1.3em;
	text-indent: 0;
}

/* Attaque : le premier paragraphe un peu plus ample. */
.single .entry-content.article-content > p:first-of-type {
	font-size: 1.16rem;
	line-height: 1.66;
	margin-bottom: 1.2rem;
}

/* Intertitres */
.single .entry-content.article-content h2,
.single .entry-content.article-content h3 {
	margin: 2.6em 0 .7em;
	line-height: 1.18;
	text-align: left;
}

/* Citations : en retrait, sans guillemets décoratifs. */
.single .entry-content.article-content blockquote {
	font-size: .98rem;
	line-height: 1.7;
	text-indent: 0;
	font-style: normal;
}

.single .entry-content.article-content blockquote p {
	text-indent: 0;
}

/* Liste d'articles : drapeau, jamais de justification —
   les extraits sont trop courts pour tenir un bloc. */
.emb-extrait {
	text-align: left;
	hyphens: none;
	font-size: 1.02rem;
	line-height: 1.7;
	color: #1A1712;
}

/* =========================================================
   13. Hauteur des images  (v0.7)
   ========================================================= */

/* Article : une image ne doit jamais occuper tout l'écran
   avant la première ligne de texte. */
.single .entry-content .wp-block-image img,
.single .entry-content figure img {
	max-height: 62vh;
	width: auto !important;
	max-width: 100% !important;
}

/* Liste : toutes les vignettes à la même hauteur, quitte à
   rogner. Les couvertures et les affiches n'ont pas les mêmes
   proportions, et c'est ce qui casse le rythme de la colonne. */
article.post-default .entry-featured img {
	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: center top;
}

@media (max-width: 48rem) {
	article.post-default .entry-featured img {
		aspect-ratio: auto;
		object-fit: contain;
		max-height: 50vh;
	}
}

/* L'extrait de la liste ne prend jamais l'alinéa. */
.emb-extrait {
	text-indent: 0 !important;
}

/* =========================================================
   14. Pied de page  (v0.9)
   ========================================================= */

.site-footer,
.site-footer.bg-dark {
	background-color: var(--emb-ivoire-sourd);
	color: var(--emb-gris);
	border-top: 1px solid var(--emb-encre);
}

.site-footer a,
.site-footer.bg-dark a {
	color: var(--emb-encre);
	border-bottom: 1px solid var(--emb-filet);
}

.site-footer a:hover,
.site-footer.bg-dark a:hover {
	border-bottom-color: var(--emb-encre);
}

.site-footer .widget-title {
	font-family: Oswald, "Helvetica Neue", Arial, sans-serif;
	font-size: .76rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--emb-gris);
	border-bottom: 1px solid var(--emb-filet);
}

/* Le nuage d'étiquettes, s'il reste : tous les mots au même corps. */
.tagcloud a,
.wp-block-tag-cloud a {
	font-size: .82rem !important;
	font-family: Oswald, "Helvetica Neue", Arial, sans-serif;
	letter-spacing: .04em;
}

/* Icônes sociales : un trait, pas des pastilles pleines. */
.social-icons li a {
	background: none !important;
	color: var(--emb-gris) !important;
	border: 1px solid var(--emb-filet);
	border-radius: 0;
}

.social-icons li a:hover {
	color: var(--emb-encre) !important;
	border-color: var(--emb-encre);
	background: none !important;
}

/* =========================================================
   15. Barre de mentions, en bas du pied  (v1.0)
   ========================================================= */

.copyright,
.copyright.bg-dark,
.footer-bottom,
.footer-bottom.bg-dark,
.footer-copyright,
.site-info,
.site-footer .copyright,
.site-footer .footer-bottom {
	background-color: var(--emb-ivoire) !important;
	color: var(--emb-gris) !important;
	border-top: 1px solid var(--emb-filet);
	font-family: Oswald, "Helvetica Neue", Arial, sans-serif;
	font-size: .74rem;
	letter-spacing: .06em;
	padding-top: 1.4rem;
	padding-bottom: 1.4rem;
}

.copyright a,
.footer-bottom a,
.footer-copyright a,
.site-info a {
	color: var(--emb-encre) !important;
}

/* =========================================================
   16. Liste sur téléphone  (v1.1)
   ========================================================= */

@media (max-width: 48rem) {

	/* Le titre d'abord, l'image ensuite : sur un petit écran,
	   une couverture pleine largeur repousse le titre hors de vue. */
	article.post-default {
		display: flex;
		flex-direction: column;
	}

	article.post-default .entry-header   { order: 1; }
	article.post-default .entry-featured { order: 2; margin: 1.1rem 0 0; }
	article.post-default .entry-content  { order: 3; }

	article.post-default .entry-title {
		font-size: 1.62rem;
		line-height: 1.16;
	}

	/* L'image ne prend plus qu'un tiers d'écran. */
	article.post-default .entry-featured img {
		max-height: 34vh;
		width: auto;
		max-width: 100%;
		object-fit: contain;
		aspect-ratio: auto;
	}

	.emb-extrait {
		font-size: 1rem;
	}

	/* Le titre d'article, sur téléphone, n'a pas besoin
	   de la mesure de lecture. */
	.single .entry-header-single .entry-title {
		font-size: 1.95rem;
	}
}

/* =========================================================
   17. Police du corps forcée  (v1.2)
   ========================================================= */

body,
.entry-content,
.entry-content p,
.emb-extrait,
.chapo,
p, li, dd, dt, td, th,
blockquote,
.entry-excerpt,
.comment-content {
	font-family: "Spectral", Georgia, "Times New Roman", serif;
}

/* Les titres gardent Cormorant. */
h1, h2, h3, h4, h5, h6,
.entry-title,
.emb-logo__texte {
	font-family: "Cormorant Garamond", Georgia, serif;
}

/* Les métadonnées gardent la sans-serif. */
ul.entry-meta,
ul.entry-meta a,
.entry-meta-container,
.repere,
.emb-lire,
.single-tags,
.fil,
nav.principale,
.copyright,
.footer-bottom,
.site-info,
.pagination,
.tagcloud a {
	font-family: Oswald, "Helvetica Neue", Arial, sans-serif;
}