/*
 * Banner de presentación de las páginas internas.
 *
 *   Contenedor sección        → page-banner page-banner--<color>
 *     Contenedor texto        → page-banner__copy
 *       Texto corto           → page-banner__eyebrow
 *       Título (H1)           → page-banner__title
 *       Texto                 → page-banner__lead
 *     Imagen                  → page-banner__photo
 */

.page-banner {
	--banner-tint: #F1EFF6;
	--banner-accent: var(--color-ink);
	--row-gap: 32px;
	--column-gap: 56px;

	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: center;
	padding: 32px var(--wrap-gutter) 56px;
	background: var(--banner-tint);
}

.page-banner--blue   { --banner-tint: #EDF2FF; --banner-accent: #1F57C3; }
.page-banner--red    { --banner-tint: #FFEFEB; --banner-accent: #D7261E; }
.page-banner--green  { --banner-tint: #E9F6EE; --banner-accent: #0E6B3A; }
.page-banner--purple { --banner-tint: #F3EDFE; --banner-accent: #7A3FC4; }

.page-banner__copy { display: block; }

.page-banner__eyebrow {
	padding-bottom: var(--space-4);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--banner-accent);
}
.page-banner__eyebrow p { margin: 0; }

.page-banner__title .elementor-heading-title {
	font-family: var(--font-display);
	font-weight: 800;
	font-size: clamp(40px, 6vw, 88px);
	letter-spacing: -.045em;
	line-height: 1;
	color: var(--color-ink);
}
.page-banner__title span { color: var(--banner-accent); }

.page-banner__lead { max-width: 30em; margin-top: var(--space-6); font-size: 19px; color: var(--color-muted); }
.page-banner__lead p { margin: 0; }

.page-banner__photo img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 32px;
	box-shadow: 0 30px 60px rgba(41, 33, 31, .16);
}

@media (min-width: 1025px) {
	.page-banner {
		grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
		padding-top: 56px;
		padding-bottom: 88px;
	}
}
