/* ------------------------------------------------------------------
   BGBC — page Fanzine
   Palette : blanc / noir uniquement, pas d'accent couleur.
   Typo : Courier Prime pour les libellés, une serif de lecture
   pour le corps de texte (reprend la charte du site).
------------------------------------------------------------------ */

.bgbc-fanzine-page {
	max-width: 900px;
	margin: 0 auto;
	padding: 40px 24px 80px;
	background: #ffffff;
	color: #111111;
}

.bgbc-fanzine-title {
	font-family: 'Courier Prime', 'Courier New', monospace;
	font-size: 22px;
	font-weight: 400;
	letter-spacing: 0.5px;
	margin: 0 0 8px;
}

.bgbc-fanzine-intro {
	font-family: Georgia, serif;
	font-size: 14px;
	color: #555555;
	margin: 0 0 36px;
	max-width: 480px;
	line-height: 1.6;
}

/* Grille — 4 par ligne, repasse à 2 puis 1 sur petits écrans */
.bgbc-fanzine-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	max-width: 480px;
}

@media (max-width: 780px) {
	.bgbc-fanzine-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 460px) {
	.bgbc-fanzine-grid {
		grid-template-columns: 1fr;
	}
}

.bgbc-fanzine-cover {
	background: none;
	border: none;
	padding: 0;
	cursor: inherit;
	text-align: left;
	font: inherit;
	color: inherit;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.bgbc-fanzine-cover img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	display: block;
	filter: grayscale(100%);
	transition: filter 0.15s ease;
}

.bgbc-fanzine-cover:hover img,
.bgbc-fanzine-cover:focus-visible img {
	filter: grayscale(0%);
}

.bgbc-fanzine-cover:focus-visible {
	outline: 2px solid #111111;
	outline-offset: 4px;
}

.bgbc-fanzine-cover-title {
	font-family: 'Courier Prime', 'Courier New', monospace;
	font-size: 11px;
	letter-spacing: 0.3px;
	color: #111111;
}

/* Liseuse */
.bgbc-fanzine-reader {
	margin-top: 56px;
	padding-top: 32px;
	border-top: 1px solid #111111;
}

.bgbc-fanzine-close {
	background: none;
	border: 1px solid #111111;
	font-family: 'Courier Prime', 'Courier New', monospace;
	font-size: 11px;
	padding: 6px 14px;
	cursor: pointer;
	margin-bottom: 24px;
}

.bgbc-fanzine-close:hover {
	background: #111111;
	color: #ffffff;
}

.bgbc-fanzine-flipbook {
	max-width: 1100px;
	margin: 0 auto;
}

@media (max-width: 640px) {
	.bgbc-fanzine-flipbook {
		display: flex;
		justify-content: center;
	}
}

/* Cette page a besoin de plus de place que le reste du site
   pour que la liseuse ne soit pas à l'étroit — desktop uniquement */
@media (min-width: 641px) {
	.page-template-page-fanzine-php .bgbc-content,
	.page-template-page-fanzine .bgbc-content {
		max-width: 1160px;
	}
}

/* Sur mobile, cette page garde la largeur normale du site */
@media (max-width: 640px) {
	.page-template-page-fanzine-php .bgbc-content,
	.page-template-page-fanzine .bgbc-content {
		max-width: none;
		width: 100%;
	}
}
