/**
 * Preluence News — magazine front page: hero mosaic, category blocks, more news.
 */

.pn-front .pn-layout__primary {
	display: flex;
	flex-direction: column;
	gap: clamp(2rem, 4vw, 3rem);
}

/* ---------- Hero mosaic ---------- */
.pn-hero {
	display: grid;
	gap: 6px;
	grid-template-columns: minmax(0, 1fr);
	overflow: hidden;
	border-radius: var(--pn-radius);
}

.pn-hero > .pn-card--overlay:first-child {
	aspect-ratio: 16 / 11;
}

.pn-hero > .pn-card--overlay:not(:first-child) {
	aspect-ratio: 16 / 10;
}

@media (min-width: 600px) and (max-width: 899px) {

	.pn-hero {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pn-hero > .pn-card--overlay:first-child {
		grid-column: 1 / -1;
	}
}

@media (min-width: 900px) {

	.pn-hero {
		grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr);
		grid-template-rows: 1fr 1fr;
		height: clamp(380px, 38vw, 500px);
	}

	.pn-hero > .pn-card--overlay:first-child {
		grid-row: 1 / span 2;
		aspect-ratio: auto;
	}

	.pn-hero > .pn-card--overlay:not(:first-child) {
		aspect-ratio: auto;
	}

	.pn-hero > .pn-card--overlay:first-child .pn-card__title {
		font-size: clamp(1.6rem, 2.6vw, 2.25rem);
	}
}

/* ---------- Category blocks ---------- */
.pn-blocks {
	display: grid;
	gap: clamp(2rem, 4vw, 2.75rem) var(--pn-gap);
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 768px) {

	.pn-blocks {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.pn-block__body {
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}

.pn-block__body > .pn-card--classic .pn-card__title {
	font-size: clamp(1.15rem, 1.8vw, 1.35rem);
}

.pn-block__list {
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
	padding-block-start: 1rem;
	border-block-start: 1px solid var(--pn-border);
}

/* ---------- More news ---------- */
.pn-more-news__cta {
	margin: 2rem 0 0;
	text-align: center;
}

/* ---------- Section rows (section builder) ---------- */
.pn-fp-row + .pn-fp-row {
	margin-block-start: clamp(2rem, 4vw, 3rem);
}

.pn-fp-row--full.pn-fp-bg--surface,
.pn-fp-row--full.pn-fp-bg--dark,
.pn-fp-row--full.pn-fp-bg--brand {
	padding-block: clamp(1.75rem, 4vw, 3rem);
}

.pn-fp-section.pn-fp-bg--surface,
.pn-fp-section.pn-fp-bg--dark,
.pn-fp-section.pn-fp-bg--brand {
	padding: clamp(1.25rem, 3vw, 2rem);
	border-radius: var(--pn-radius);
}

.pn-fp-bg--surface {
	background: var(--pn-surface);
}

.pn-fp-bg--dark {
	--pn-bg: var(--pn-dark-band-bg, #0d1119);
	--pn-surface: color-mix(in srgb, var(--pn-bg) 88%, #fff);
	--pn-text: #eef1f4;
	--pn-text-muted: color-mix(in srgb, #eef1f4 70%, transparent);
	--pn-border: color-mix(in srgb, #eef1f4 14%, transparent);
	--pn-link: #9dbbff;
	background: var(--pn-bg);
	color: var(--pn-text);
}

.pn-fp-bg--brand {
	--pn-text: var(--pn-on-primary);
	--pn-text-muted: color-mix(in srgb, var(--pn-on-primary) 78%, transparent);
	--pn-border: color-mix(in srgb, var(--pn-on-primary) 28%, transparent);
	--pn-link: var(--pn-on-primary);
	background: var(--pn-primary);
	color: var(--pn-text);
}

.pn-fp-bg--brand .pn-section-head {
	--pn-badge: var(--pn-on-primary) !important;
}

.pn-fp-cols {
	display: grid;
	gap: clamp(1.5rem, 3vw, 2.25rem) var(--pn-gap);
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 900px) {

	.pn-fp-cols {
		grid-template-columns: var(--pn-fp-cols);
	}
}

.pn-fp-col {
	display: flex;
	flex-direction: column;
	gap: clamp(1.5rem, 3vw, 2.25rem);
	min-width: 0;
}

.pn-fp-col:empty {
	display: none;
}

/* ---------- Automatic homepage sections ---------- */
.pn-fp-row--bleed {
	position: relative;
}

.pn-fp-row--bleed + .pn-fp-row {
	margin-block-start: clamp(1.5rem, 3.5vw, 2.75rem);
}

/* An edge-to-edge hero first on the page sits flush under the header. */
.pn-main:has(> .screen-reader-text + .pn-fp-row--bleed) {
	padding-block-start: 0;
}

.pn-fp-section--posts > .pn-section-head,
.pn-fp-section--cat > .pn-section-head {
	margin-block-end: clamp(1rem, 2vw, 1.4rem);
}

[data-visual="futuristic"] .pn-fp-bg--dark {
	background:
		radial-gradient(70% 120% at 100% 0%, color-mix(in srgb, var(--pn-secondary, var(--pn-primary)) 22%, transparent), transparent 60%),
		radial-gradient(60% 120% at 0% 100%, color-mix(in srgb, var(--pn-primary) 24%, transparent), transparent 60%),
		var(--pn-bg);
}

/* Call to action band */
.pn-fp-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem 2rem;
}

.pn-fp-cta__title {
	margin: 0 0 0.35rem;
	color: inherit;
	font-size: clamp(1.4rem, 1.1rem + 1.3vw, 2.2rem);
	line-height: 1.15;
}

.pn-fp-cta__text p {
	max-width: 56ch;
	margin: 0;
	opacity: 0.88;
}

.pn-fp-bg--brand .pn-fp-cta__button {
	background: var(--pn-on-primary);
	color: var(--pn-primary);
	box-shadow: 0 12px 30px -14px rgb(0 0 0 / 45%);
}

.pn-fp-bg--brand .pn-fp-cta__button:hover {
	background: var(--pn-on-primary);
	color: var(--pn-primary-strong);
}

[data-visual="futuristic"] .pn-fp-row--full.pn-fp-bg--brand {
	background: var(--pn-gradient);
}
