/* ── Creator Events ───────────────────────────────────────────────
 * Shared by the Los Angeles and New York page templates: a dark band on
 * the city background (.creator-events--la / --ny) with the section title
 * and a grid of .creator-event-card tiles — label / creator name / role
 * line, the live date + time from the linked `event` post, and a
 * "View Event Page" CTA. Card markup lives in
 * template-parts/creator-event-card.php. Extracted from la-page.css when
 * the NY page adopted the same section.
 * ────────────────────────────────────────────────────────────────── */

.creator-events {
	background-color: var(--color-black);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: var(--space-07) 0;
}

.creator-events--la {
	background-image: image-set(url(../../assets/kodanshahouse-background--los-angeles.avif) type("image/avif"), url(../../assets/kodanshahouse-background--los-angeles.webp) type("image/webp"), url(../../assets/kodanshahouse-background--los-angeles.png) type("image/png"));
}

.creator-events--ny {
	background-image: image-set(url(../../assets/kodanshahouse-background--new-york.avif) type("image/avif"), url(../../assets/kodanshahouse-background--new-york.webp) type("image/webp"), url(../../assets/kodanshahouse-background--new-york.png) type("image/png"));
}

.creator-events__title {
	margin: 0 0 var(--space-05);
	font-size: 4.115rem; /* 65.84px — family + tracking from .kodansha-black */
	line-height: 1.1;
	color: var(--color-white);
}

.creator-events__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-05);
	align-items: stretch;
}

.creator-event-card {
	display: flex;
	flex-direction: column;
	background: var(--color-background-pale);
	padding: var(--space-05);
}

.creator-event-card__body {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: var(--space-04);
}

.creator-event-card__label {
	margin: 0;
	font-family: Maax;
	font-weight: 400;
	font-size: 1.0625rem;
	line-height: 1.3;
	color: var(--color-text-2);
}

.creator-event-card__name {
	margin: 0;
	font-size: 2rem;
	line-height: 1.05;
	color: var(--color-text);
}

.creator-event-card__meta {
	margin: 0;
	font-family: "Maax Bold";
	font-weight: 400;
	font-size: 1.0625rem;
	line-height: 1.3;
	color: var(--color-text);
}

.creator-event-card__when {
	margin: 0;
	font-family: Maax;
	font-weight: 400;
	font-size: 1.0625rem;
	line-height: 1.35;
	color: var(--color-text);
}

.creator-event-card__date,
.creator-event-card__time {
	display: block;
}

.creator-event-card__cta {
	margin-top: var(--space-05);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

@media (max-width: 768px) {

	.creator-events__grid {
		grid-template-columns: 1fr;
	}
}
