/**
 * Aeon News – Broadsheet and Digest front pages (inc/front/).
 *
 * Mobile first. Breakpoints 768 / 1025 / 1280. Typefaces follow each site's own settings:
 * headlines --aeon-front-headline (Bold 1–2 typography), light headlines --aeon-front-light,
 * labels and times --aeon-front-meta (Metadata typography), text --aeon-font.
 */

/* ---------- Tokens ---------- */

.aeon-front {
	--f-ink: var(--aeon-ink, #1d1d1d);
	--f-text: #333;
	--f-muted: #626569;
	--f-line: #e1e1e1;
	--f-rule: var(--aeon-ink, #1d1d1d);
	--f-accent: var(--aeon-accent, var(--primary-color, #69043b));
	--f-paper: color-mix(in srgb, var(--f-accent) 5%, #f7f4ee);
	--f-head: var(--aeon-front-headline, Georgia, "Times New Roman", serif);
	--f-light: var(--aeon-front-light, var(--f-head));
	--f-serif: var(--aeon-font, Georgia, serif);
	--f-sans: var(--aeon-front-meta, "Roboto", "Helvetica Neue", Arial, sans-serif);
	--f-gap: 24px;
	color: var(--f-ink);
}

:is(html.aeon-dark-mode-active, body.dark-mode) .aeon-front {
	--f-ink: #ececec;
	--f-text: #d4d4d4;
	--f-muted: #a8a8a8;
	--f-line: #393939;
	--f-rule: #8a8a8a;
	--f-accent: color-mix(in srgb, var(--aeon-accent, #69043b) 45%, #fff);
	--f-paper: #242220;
}

/* The band layouts use the whole container: no classic column widths. */
.aeon-front-bands #first_col.aeon-front {
	float: none;
	width: 100%;
	max-width: none;
	padding: 0;
	margin: 0;
}

@media (max-width: 767px) {
	.aeon-front-bands #first_col.aeon-front {
		padding: 0 15px;
	}

	.aeon-front-bands .aeon-front-container {
		padding-left: 0;
		padding-right: 0;
	}
}

.aeon-front-bands .aeon-front-container {
	padding-top: 8px;
	padding-bottom: 24px;
}

/* ---------- Bands ---------- */

.aeon-band {
	padding: 22px 0 26px;
}

.aeon-band + .aeon-band {
	border-top: 1px solid var(--f-line);
}

.aeon-band__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 16px;
	padding-top: 10px;
	border-top: 2px solid var(--f-rule);
}

.aeon-band + .aeon-band .aeon-band__head,
.aeon-package .aeon-band__head,
.aeon-sections__col .aeon-band__head,
.aeon-ranked .aeon-band__head {
	border-top-width: 2px;
}

.aeon-front .aeon-band__title {
	margin: 0;
	font-family: var(--f-head);
	font-size: 21px;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.005em;
	color: var(--f-ink);
}

.aeon-front .aeon-band__title a {
	color: inherit;
	text-decoration: none;
}

.aeon-front .aeon-band__title a:hover {
	color: var(--f-accent);
}

.aeon-front .aeon-band__title i {
	margin-left: 8px;
	font-size: 0.62em;
	vertical-align: 0.12em;
	color: var(--f-accent);
}

.aeon-band__count {
	font-family: var(--f-sans);
	font-size: 12.5px;
	color: var(--f-muted);
	white-space: nowrap;
}

.aeon-band__more {
	margin: 18px 0 0;
	font-family: var(--f-sans);
	font-size: 14px;
	font-weight: 600;
}

.aeon-band__more a {
	color: var(--f-accent);
	text-decoration: none;
}

.aeon-band__more i {
	margin-left: 6px;
	font-size: 0.8em;
}

/* A band without an earlier neighbour still gets breathing room under the header. */
.aeon-front > .aeon-band:first-of-type {
	padding-top: 12px;
}

/* ---------- Grids ---------- */

.aeon-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0;
}

/* ---------- Teaser ---------- */

.aeon-teaser {
	position: relative;
	margin: 0;
	min-width: 0;
}

.aeon-teaser__media {
	display: block;
	overflow: hidden;
	background: color-mix(in srgb, var(--f-ink) 6%, transparent);
}

.aeon-teaser__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform 0.35s ease;
}

/* The lead keeps the proportion of the original article images (1170 × 600); small thumbnails stay 3:2. */
.aeon-teaser--hero .aeon-teaser__media img {
	aspect-ratio: 39 / 20;
}

.aeon-teaser--compact .aeon-teaser__media img {
	aspect-ratio: 3 / 2;
}

.aeon-teaser:hover .aeon-teaser__media img {
	transform: scale(1.015);
}

.aeon-front .aeon-teaser__kicker {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
	margin: 0 0 6px;
	font-family: var(--f-sans);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--f-accent);
}

.aeon-front .aeon-teaser__kicker.is-sponsored {
	color: var(--f-muted);
}

.aeon-front .aeon-teaser__title {
	margin: 0;
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 19px;
	line-height: 1.18;
	letter-spacing: -0.01em;
	color: var(--f-ink);
	text-wrap: balance;
}

.aeon-front .aeon-teaser__title a {
	color: inherit;
	text-decoration: none;
}

.aeon-front .aeon-teaser__title a:hover {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

/* The whole card is clickable without nesting links: the title link stretches over it. */
.aeon-front .aeon-teaser__title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.aeon-front .aeon-teaser__kicker,
.aeon-front .aeon-teaser__meta a,
.aeon-front .aeon-lead__related a {
	position: relative;
	z-index: 1;
}

.aeon-front .aeon-teaser__standfirst {
	margin: 8px 0 0;
	font-family: var(--f-serif);
	font-size: 15.5px;
	line-height: 1.45;
	color: var(--f-text);
}

.aeon-front .aeon-teaser__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 2px;
	margin: 8px 0 0;
	font-family: var(--f-sans);
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--f-muted);
}

.aeon-front .aeon-teaser__byline {
	font-weight: 600;
	color: var(--f-text);
}

.aeon-front .aeon-teaser__meta .aeon-archive-label {
	margin-left: 8px;
}

.aeon-teaser--sponsored {
	background: color-mix(in srgb, var(--f-ink) 3%, transparent);
}

/* Standard: image on top. */
.aeon-teaser--standard .aeon-teaser__media {
	margin-bottom: 11px;
}

/* Hero (lead package). */
.aeon-teaser--hero .aeon-teaser__media {
	margin: 0 -15px 14px;
}

.aeon-front .aeon-teaser--hero .aeon-teaser__title {
	font-size: 30px;
	line-height: 1.06;
	letter-spacing: -0.015em;
}

.aeon-front .aeon-teaser--hero .aeon-teaser__standfirst {
	font-size: 17px;
}

/* Feature: a large card. */
.aeon-teaser--feature .aeon-teaser__media {
	margin-bottom: 14px;
}

.aeon-front .aeon-teaser--feature .aeon-teaser__title {
	font-size: 24px;
	line-height: 1.12;
}

/* Compact: image beside the headline. */
.aeon-teaser--compact {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 112px;
	gap: 0 14px;
	align-items: start;
}

.aeon-teaser--compact .aeon-teaser__media {
	grid-column: 2;
	grid-row: 1;
}

.aeon-teaser--compact .aeon-teaser__body {
	grid-column: 1;
	grid-row: 1;
}

.aeon-teaser--compact.aeon-teaser--no-image {
	grid-template-columns: minmax(0, 1fr);
}

.aeon-front .aeon-teaser--compact .aeon-teaser__title {
	font-size: 17px;
	line-height: 1.22;
}

.aeon-front .aeon-teaser--compact .aeon-teaser__standfirst {
	font-size: 14.5px;
}

/* Text: no image. */
.aeon-front .aeon-teaser--text .aeon-teaser__title {
	font-size: 20px;
}

/* Headline only (lists). */
.aeon-teaser--headline {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 0 10px;
	padding: 9px 0;
	border-top: 1px solid var(--f-line);
}

.aeon-teaser--headline .aeon-teaser__body {
	display: contents;
}

.aeon-front .aeon-teaser--headline .aeon-teaser__title {
	grid-column: 2;
	font-size: 15.5px;
	line-height: 1.28;
}

.aeon-front .aeon-teaser--headline .aeon-teaser__meta {
	grid-column: 1;
	grid-row: 1;
	margin: 1px 0 0;
	font-weight: 700;
	color: var(--f-accent);
}

.aeon-front .aeon-teaser--headline .aeon-archive-label {
	display: none;
}

/* Ranked (most read). */
.aeon-teaser--ranked {
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 0 12px;
	align-items: start;
}

.aeon-teaser__rank {
	font-family: var(--f-head);
	font-size: 32px;
	font-weight: 500;
	line-height: 0.9;
	color: color-mix(in srgb, var(--f-accent) 70%, var(--f-ink));
	font-variant-numeric: lining-nums tabular-nums;
}

.aeon-front .aeon-teaser--ranked .aeon-teaser__title {
	font-size: 17px;
	line-height: 1.22;
}

.aeon-front .aeon-teaser--ranked .aeon-teaser__kicker {
	font-size: 11px;
}

/* Opinion: portrait, writer, headline. */
.aeon-teaser--opinion {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	gap: 0 14px;
	align-items: start;
}

.aeon-teaser__portrait {
	display: block;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	overflow: hidden;
	background: color-mix(in srgb, var(--f-accent) 14%, #fff);
}

.aeon-teaser__portrait img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 8%;
}

.aeon-teaser__portrait .aeon-teaser__avatar {
	border-radius: 50%;
}

.aeon-teaser__portrait .aeon-avatar--initials,
.aeon-teaser__portrait .aeon-teaser__avatar--initials {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	font-family: var(--f-sans);
	font-size: 17px;
	font-weight: 700;
	color: var(--f-accent);
}

.aeon-front .aeon-teaser__writer {
	margin: 0 0 3px;
	font-family: var(--f-sans);
	font-size: 13.5px;
	font-weight: 700;
	color: var(--f-ink);
}

.aeon-front .aeon-teaser--opinion .aeon-teaser__title {
	font-family: var(--f-light);
	font-weight: 400;
	font-size: 19px;
	line-height: 1.22;
}

/* Briefing (Digest): headline and key points. */
.aeon-front .aeon-teaser--briefing .aeon-teaser__title {
	font-size: 19px;
	line-height: 1.2;
}

.aeon-teaser__points {
	margin: 7px 0 0;
	padding: 0;
	list-style: none;
	font-family: var(--f-serif);
	font-size: 14.5px;
	line-height: 1.42;
	color: var(--f-text);
}

.aeon-teaser__points li {
	position: relative;
	margin: 0 0 3px;
	padding-left: 14px;
}

.aeon-teaser__points li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.62em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--f-accent);
}

/* ---------- Lead package ---------- */

.aeon-lead {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
}

.aeon-lead__related {
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}

.aeon-lead__related li {
	padding: 9px 0;
	border-top: 1px solid var(--f-line);
	font-family: var(--f-head);
	font-size: 16px;
	font-weight: 700;
	line-height: 1.25;
}

.aeon-lead__related a {
	color: var(--f-ink);
	text-decoration: none;
}

.aeon-lead__related a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.aeon-lead__rel-kicker {
	font-family: var(--f-sans);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--f-accent);
}

.aeon-lead__second {
	padding-top: 18px;
	border-top: 1px solid var(--f-line);
}

.aeon-lead__wire {
	padding: 12px 0 6px;
	border-top: 2px solid var(--f-ink);
}

.aeon-front .aeon-lead__wire-title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 6px;
	font-family: var(--f-sans);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--f-ink);
}

.aeon-live-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #d6112f;
	box-shadow: 0 0 0 0 rgba(214, 17, 47, 0.45);
	animation: aeon-live-pulse 2.4s ease-out infinite;
}

@keyframes aeon-live-pulse {
	0% { box-shadow: 0 0 0 0 rgba(214, 17, 47, 0.45); }
	70% { box-shadow: 0 0 0 7px rgba(214, 17, 47, 0); }
	100% { box-shadow: 0 0 0 0 rgba(214, 17, 47, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.aeon-live-dot { animation: none; }
	.aeon-teaser:hover .aeon-teaser__media img { transform: none; }
}

.aeon-lead__wire .aeon-teaser--headline:first-child {
	border-top: 0;
}

/* Phones: five latest, the rest on wider screens. */
.aeon-lead__wire .aeon-teaser--headline:nth-child(n+6) {
	display: none;
}

/* ---------- Opinion: a scroller on phones, a row on desktop ---------- */

.aeon-band--opinion {
	position: relative;
}

.aeon-front .aeon-band--opinion {
	margin: 0 -15px;
	padding: 20px 15px 22px;
	background: var(--f-paper);
	border-top: 0;
}

.aeon-front .aeon-band--opinion + .aeon-band {
	border-top: 0;
}

.aeon-band--opinion .aeon-band__head {
	border-top-color: var(--f-accent);
}

.aeon-scroller {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 78%;
	gap: 18px;
	margin: 0 -15px;
	padding: 2px 15px 10px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0 15px;
	overscroll-behavior-x: contain;
	scrollbar-width: thin;
}

.aeon-scroller > * {
	scroll-snap-align: start;
}

.aeon-scroller .aeon-teaser--opinion {
	padding: 14px;
	background: var(--aeon-surface-container, #fff);
	border-radius: 2px;
	box-shadow: 0 1px 0 var(--f-line);
}

@media (max-width: 1024px) {
	:is(html.aeon-dark-mode-active, body.dark-mode) .aeon-scroller .aeon-teaser--opinion {
		background: #1c1c1c;
	}
}

/* ---------- Packages (threads) ---------- */

.aeon-package {
	padding-bottom: 18px;
}

.aeon-package + .aeon-package {
	padding-top: 6px;
}

.aeon-package__more {
	margin-top: 12px;
}

.aeon-package .aeon-teaser--headline {
	grid-template-columns: minmax(0, 1fr);
}

.aeon-front .aeon-package .aeon-teaser--headline .aeon-teaser__title {
	grid-column: 1;
	grid-row: 1;
}

.aeon-front .aeon-package .aeon-teaser--headline .aeon-teaser__meta {
	grid-column: 1;
	grid-row: 2;
	margin-top: 3px;
	font-weight: 400;
	color: var(--f-muted);
}

/* ---------- Section ---------- */

.aeon-section {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0;
}

.aeon-section__list > .aeon-teaser,
.aeon-band--row .aeon-grid > .aeon-teaser + .aeon-teaser,
.aeon-band--pairs .aeon-grid > .aeon-teaser,
.aeon-band--stream .aeon-grid > .aeon-teaser {
	padding: 14px 0;
	border-top: 1px solid var(--f-line);
}

/* ---------- Most read ---------- */

.aeon-ranked {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 26px;
}

.aeon-ranked__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.aeon-ranked__list > li {
	padding: 12px 0;
	border-top: 1px solid var(--f-line);
}

.aeon-ranked__list > li:first-child {
	border-top: 0;
	padding-top: 0;
}

/* ---------- Widgets in bands ---------- */

.aeon-band-widgets {
	display: grid;
	gap: 20px;
	justify-items: center;
}

.aeon-band-widgets > .widget {
	width: 100%;
	margin: 0;
}

/* ---------- Digest ---------- */

.aeon-edition {
	margin: 4px 0 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--f-rule);
	box-shadow: 0 3px 0 -2px var(--f-rule);
}

.aeon-front .aeon-edition__date {
	margin: 0 0 4px;
	font-family: var(--f-sans);
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--f-accent);
}

.aeon-front .aeon-edition__title {
	margin: 0;
	font-family: var(--f-head);
	font-size: 28px;
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.015em;
}

.aeon-briefing {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 22px;
}

.aeon-briefing__list {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: aeon-brief;
}

.aeon-briefing__list > li {
	position: relative;
	padding: 14px 0 14px 42px;
	border-top: 1px solid var(--f-line);
	counter-increment: aeon-brief;
}

.aeon-briefing__list > li:first-child {
	border-top: 2px solid var(--f-rule);
}

.aeon-briefing__list > li::before {
	content: counter(aeon-brief);
	position: absolute;
	left: 0;
	top: 12px;
	font-family: var(--f-head);
	font-size: 30px;
	font-weight: 700;
	line-height: 1;
	color: var(--f-accent);
}

.aeon-front--digest .aeon-teaser--feature .aeon-teaser__title {
	font-size: 28px;
}

.aeon-front--digest .aeon-briefing__feature .aeon-teaser__title {
	font-size: 32px;
	line-height: 1.04;
}

.aeon-front--digest .aeon-briefing__feature .aeon-teaser__standfirst {
	font-size: 17.5px;
}

.aeon-front--digest .aeon-briefing__feature .aeon-teaser__media {
	margin-left: -15px;
	margin-right: -15px;
}

/* The Digest lead uses the archive's own 1170 × 600 proportion, like the Broadsheet lead. */
.aeon-front--digest .aeon-briefing__feature .aeon-teaser__media img {
	aspect-ratio: 39 / 20;
}

/* Essays: text-led, portrait on top. */
.aeon-teaser--essay {
	display: block;
	padding: 18px 0;
	border-top: 1px solid var(--f-line);
}

.aeon-teaser--essay .aeon-teaser__portrait {
	float: right;
	width: 92px;
	height: 92px;
	margin: 0 0 8px 14px;
}

.aeon-front .aeon-teaser--essay .aeon-teaser__title {
	font-size: 23px;
	line-height: 1.16;
}

.aeon-front .aeon-teaser--essay .aeon-teaser__standfirst {
	clear: none;
	font-size: 15.5px;
}

.aeon-band--features .aeon-grid > .aeon-teaser + .aeon-teaser {
	margin-top: 24px;
}

.aeon-sections__col + .aeon-sections__col {
	margin-top: 24px;
}

.aeon-sections__col .aeon-teaser--standard {
	margin-bottom: 4px;
}

.aeon-sections__col .aeon-teaser--headline {
	grid-template-columns: minmax(0, 1fr);
}

.aeon-front .aeon-sections__col .aeon-teaser--headline .aeon-teaser__title {
	grid-column: 1;
}

.aeon-front .aeon-sections__col .aeon-teaser--headline .aeon-teaser__meta {
	display: none;
}

/* ---------- Tablet and up ---------- */

@media (min-width: 768px) {
	.aeon-band {
		padding: 26px 0 30px;
	}

	.aeon-front .aeon-band__title {
		font-size: 23px;
	}

	.aeon-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--f-gap); }
	.aeon-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 var(--f-gap); }
	.aeon-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px var(--f-gap); }

	/* Column rules between grid cells, like a printed page. */
	.aeon-grid--3 > *,
	.aeon-grid--4 > * {
		position: relative;
	}

	.aeon-band--row .aeon-grid > .aeon-teaser + .aeon-teaser {
		padding: 0;
		border-top: 0;
	}

	.aeon-band--pairs .aeon-grid > .aeon-teaser {
		padding: 16px 0;
	}

	.aeon-band--pairs .aeon-teaser--compact {
		grid-template-columns: 42% minmax(0, 1fr);
	}

	.aeon-band--pairs .aeon-teaser--compact .aeon-teaser__media { grid-column: 1; }
	.aeon-band--pairs .aeon-teaser--compact .aeon-teaser__body { grid-column: 2; }

	.aeon-front .aeon-band--pairs .aeon-teaser--compact .aeon-teaser__title {
		font-size: 19px;
	}

	.aeon-band--stream .aeon-grid > .aeon-teaser {
		padding: 14px 0;
	}

	.aeon-teaser--hero .aeon-teaser__media {
		margin: 0 0 14px;
	}

	.aeon-front--digest .aeon-briefing__feature .aeon-teaser__media {
		margin-left: 0;
		margin-right: 0;
	}

	.aeon-scroller {
		grid-auto-columns: calc((100% - 2 * 18px) / 3);
	}

	.aeon-section {
		grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
		gap: 0 var(--f-gap);
	}

	.aeon-section__list > .aeon-teaser:first-child {
		padding-top: 0;
		border-top: 0;
	}

	.aeon-ranked--with-rail {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
		gap: 0 32px;
	}

	.aeon-ranked__list {
		columns: 2;
		column-gap: var(--f-gap);
	}

	.aeon-ranked__list > li {
		break-inside: avoid;
	}

	.aeon-ranked__list > li:nth-child(4) {
		border-top: 0;
		padding-top: 0;
	}

	.aeon-sections__col + .aeon-sections__col,
	.aeon-band--features .aeon-grid > .aeon-teaser + .aeon-teaser {
		margin-top: 0;
	}

	.aeon-band--essays .aeon-grid > .aeon-teaser--essay {
		padding-top: 0;
		border-top: 0;
	}

	.aeon-front .aeon-edition__title {
		font-size: 36px;
	}
}

/* ---------- Desktop ---------- */

@media (min-width: 1025px) {
	.aeon-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

	.aeon-grid--3 > * + *::before,
	.aeon-grid--4 > * + *::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: calc(var(--f-gap) / -2);
		border-left: 1px solid var(--f-line);
	}

	/* Lead: the lead story (text left, image right) beside a column with the next story and
	   the latest news, as on a broadsheet's front. */
	.aeon-lead {
		grid-template-columns: minmax(0, 8.4fr) minmax(0, 3.6fr);
		grid-template-areas:
			"main wire"
			"main second";
		grid-template-rows: auto 1fr;
		gap: 0 40px;
	}

	.aeon-lead__main { grid-area: main; }
	.aeon-lead__wire { grid-area: wire; align-self: start; }
	.aeon-lead__second { grid-area: second; align-self: start; margin-top: 22px; padding-top: 16px; border-top: 2px solid var(--f-ink); }

	/* The lead: one story, image above the text, the only big headline on the page. */
	.aeon-lead .aeon-teaser--hero .aeon-teaser__media {
		margin: 0 0 18px;
	}

	.aeon-front .aeon-teaser--hero .aeon-teaser__title {
		max-width: 22ch;
		font-size: clamp(34px, 3.1vw, 46px);
	}

	.aeon-front .aeon-lead .aeon-teaser--hero .aeon-teaser__standfirst {
		max-width: 62ch;
	}

	.aeon-front .aeon-lead__second .aeon-teaser__title {
		font-size: 22px;
		line-height: 1.2;
	}

	.aeon-lead .aeon-teaser--hero.aeon-teaser--no-image {
		grid-template-columns: minmax(0, 1fr);
	}

	.aeon-front .aeon-lead .aeon-teaser--hero.aeon-teaser--no-image .aeon-teaser__title {
		font-size: clamp(40px, 3.6vw, 54px);
	}

	.aeon-lead__wire .aeon-teaser--headline:nth-child(n+6) {
		display: grid;
	}

	.aeon-front .aeon-teaser--standard .aeon-teaser__title {
		font-size: 20px;
	}

	.aeon-front .aeon-section__main .aeon-teaser__title {
		font-size: 25px;
	}

	.aeon-scroller {
		display: grid;
		grid-auto-flow: row;
		grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
		margin: 0;
		padding: 0;
		overflow: visible;
	}

	.aeon-scroller .aeon-teaser--opinion {
		padding: 0;
		background: none;
		box-shadow: none;
		grid-template-columns: minmax(0, 1fr);
	}

	.aeon-scroller .aeon-teaser--opinion .aeon-teaser__portrait {
		width: 92px;
		height: 92px;
		margin-bottom: 12px;
	}

	.aeon-front .aeon-band--opinion {
		margin: 8px 0;
		padding: 22px 26px 26px;
	}

	/* Digest */
	.aeon-briefing {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		gap: 0 40px;
	}

	.aeon-front--digest .aeon-briefing__feature .aeon-teaser__title {
		font-size: clamp(34px, 3.1vw, 46px);
	}

	.aeon-front .aeon-edition__title {
		font-size: 44px;
	}

	.aeon-front--digest .aeon-band--features .aeon-teaser__title {
		font-size: 24px;
	}
}

@media (min-width: 1280px) {
	.aeon-front { --f-gap: 30px; }
}

/* ---------- Phones: compact rhythm ---------- */

@media (max-width: 767px) {
	/* After the first card of a row, stories become compact rows (image beside headline). */
	.aeon-band--row .aeon-grid > .aeon-teaser--standard + .aeon-teaser--standard {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 112px;
		gap: 0 14px;
	}

	.aeon-band--row .aeon-grid > .aeon-teaser--standard + .aeon-teaser--standard .aeon-teaser__media {
		grid-column: 2;
		grid-row: 1;
		margin: 0;
	}

	.aeon-band--row .aeon-grid > .aeon-teaser--standard + .aeon-teaser--standard .aeon-teaser__body {
		grid-column: 1;
		grid-row: 1;
	}

	.aeon-front .aeon-band--row .aeon-grid > .aeon-teaser--standard + .aeon-teaser--standard .aeon-teaser__title {
		font-size: 17px;
	}

	.aeon-front .aeon-band--pairs .aeon-teaser__standfirst,
	.aeon-front .aeon-band--stream .aeon-teaser__standfirst {
		display: none;
	}

	.aeon-band--threads .aeon-package {
		padding-top: 4px;
	}

	.aeon-band--threads .aeon-package + .aeon-package {
		margin-top: 8px;
		border-top: 1px solid var(--f-line);
		padding-top: 18px;
	}

	.aeon-ranked__list > li:nth-child(n+6) {
		display: none;
	}

	.aeon-band--features .aeon-teaser--feature .aeon-teaser__media {
		margin-left: -15px;
		margin-right: -15px;
	}

	.aeon-front .aeon-teaser--essay .aeon-teaser__title {
		font-size: 21px;
	}
}

/* Two stories under the lead story fill the main column beside the latest news. */
.aeon-lead__below {
	margin-top: 18px;
	padding-top: 18px;
	border-top: 1px solid var(--f-line);
}

@media (max-width: 767px) {
	.aeon-lead__below .aeon-teaser--standard {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 112px;
		gap: 0 14px;
		padding: 14px 0;
		border-top: 1px solid var(--f-line);
	}

	.aeon-lead__below .aeon-teaser--standard:first-child {
		padding-top: 0;
		border-top: 0;
	}

	.aeon-lead__below .aeon-teaser--standard .aeon-teaser__media { grid-column: 2; grid-row: 1; margin: 0; }
	.aeon-lead__below .aeon-teaser--standard .aeon-teaser__body { grid-column: 1; grid-row: 1; }
	.aeon-front .aeon-lead__below .aeon-teaser__title { font-size: 17px; }
}

@media (min-width: 1025px) {
	.aeon-front .aeon-lead__below .aeon-teaser__title { font-size: 18px; }
}

/* ---------- Desktop polish (2026-10-25) ----------
 * The band fronts sit inside the bordered site container; give the content an
 * inner inset so images and rules no longer touch the frame, let the opinion
 * band bleed to the frame, and label sponsored teasers instead of tinting them. */
.aeon-teaser--sponsored {
	background: none;
}

@media (min-width: 768px) {
	.aeon-front-bands .aeon-front-container {
		--f-inset: clamp(18px, 2.1vw, 30px);
		padding: 14px var(--f-inset) 36px;
	}

	.aeon-front .aeon-band--opinion {
		margin-left: calc(var(--f-inset) * -1);
		margin-right: calc(var(--f-inset) * -1);
		padding-left: var(--f-inset);
		padding-right: var(--f-inset);
	}
}