/* RampUP25: light editorial visual system. Loaded after rampup.css.
 * Shares gutter, content width and sans typography with the approved Alan Home.
 * Scoped to the event coverage to preserve all other layouts.
 */
body.alan-rampup-light { background: #fff; color: #1d1d1f; }
.rampup-page {
	--rampup-paper: var(--alan-ui-paper, #fff);
	--rampup-ink: var(--alan-ui-ink, #1d1d1f);
	--rampup-muted: var(--alan-ui-muted, #6e6e73);
	--rampup-line: var(--alan-ui-line, rgba(29,29,31,.13));
	--rampup-gutter: var(--alan-ui-gutter, clamp(1.25rem, 4.5vw, 4.5rem));
	--rampup-content-max: var(--alan-ui-content-max, 80rem);
	--rampup-radius: clamp(14px, 1.8vw, 24px);
	--rampup-font: var(--alan-ui-font-sans, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif);
	color: var(--rampup-ink);
	background: var(--rampup-paper);
	font-family: var(--rampup-font);
}
.rampup-page .rampup-hero {
	min-height: 0;
	padding: clamp(12px, 2vw, 30px) var(--rampup-gutter) clamp(48px, 6.5vw, 82px);
	color: var(--rampup-ink);
	background: var(--rampup-paper);
}
.rampup-page .rampup-hero__stage {
	display: flex;
	align-items: flex-end;
	width: min(100%, var(--rampup-content-max));
	height: clamp(370px, 59svh, 670px);
	min-height: 0;
	margin: 0 auto;
	overflow: hidden;
	isolation: isolate;
	border-radius: var(--rampup-radius);
}
.rampup-page .rampup-hero__media {
	border-radius: inherit;
	background: linear-gradient(130deg, #e8eaeb 0%, #d4d8da 51%, #e8e9e8 100%);
}
.rampup-page .rampup-hero__media::before {
	inset: 0;
	opacity: .13;
	background: repeating-linear-gradient(90deg, transparent 0 11.8%, rgba(53,65,77,.18) 11.9%, transparent 12%);
}
.rampup-page .rampup-hero__media::after {
	inset: 0;
	width: auto;
	height: auto;
	min-width: 0;
	min-height: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: linear-gradient(0deg, rgba(244,245,245,.86), rgba(244,245,245,.04) 56%);
}
.rampup-page .rampup-hero__media > .rampup-media-placeholder {
	color: #58616b;
	font-size: .65rem;
}
.rampup-page .rampup-hero__brand {
	position: absolute;
	top: clamp(18px, 3vw, 38px);
	left: clamp(20px, 3.5vw, 48px);
	z-index: 3;
	margin: 0;
	padding: 9px 12px;
	border: 1px solid rgba(29,29,31,.1);
	border-radius: 999px;
	color: #27292b;
	background: rgba(255,255,255,.72);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	font: 550 clamp(.65rem,.82vw,.78rem)/1.1 var(--rampup-font);
	letter-spacing: .025em;
}
.rampup-page .rampup-hero__brand strong { font-weight: 750; letter-spacing: .07em; }
.rampup-page .rampup-hero__brand > span:last-child { font-weight: 500; }
.rampup-page .rampup-hero__title-wrap {
	position: relative;
	z-index: 2;
	padding: 0 clamp(20px, 4vw, 54px) clamp(26px, 4.3vw, 60px);
}
.rampup-page .rampup-hero h1 {
	max-width: 100%;
	color: #1d1d1f;
	font-family: var(--rampup-font);
	font-size: clamp(3.5rem, 9.5vw, 8.7rem);
	font-weight: 600;
	line-height: .95;
	letter-spacing: -.075em;
	text-wrap: balance;
}
.rampup-page .rampup-hero__masthead {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, .85fr);
	gap: clamp(30px, 7vw, 112px);
	align-items: start;
	width: min(100%, var(--rampup-content-max));
	margin: clamp(28px, 4vw, 52px) auto 0;
	color: var(--rampup-ink);
}
.rampup-page .rampup-hero__lede { max-width: 42rem; }
.rampup-page .rampup-hero__lede > .rampup-eyebrow { margin-bottom: 15px; }
.rampup-page .rampup-hero__subtitle {
	max-width: 24ch;
	margin: 0 !important;
	color: var(--rampup-ink);
	font-family: var(--rampup-font);
	font-size: clamp(1.65rem, 2.75vw, 2.75rem);
	font-weight: 500;
	line-height: 1.14;
	letter-spacing: -.05em;
}
.rampup-page .rampup-hero__intro {
	max-width: 53ch;
	color: #555b61;
	font-size: clamp(.98rem, 1.12vw, 1.08rem);
	line-height: 1.65;
}
.rampup-page .rampup-hero__intro > .rampup-eyebrow {
	margin-bottom: 14px;
	color: var(--rampup-muted);
}
.rampup-page .rampup-hero__continue {
	position: static;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: min(100%, var(--rampup-content-max));
	margin: clamp(28px, 4vw, 48px) auto 0;
	padding: 20px 0 0;
	border-top: 1px solid var(--rampup-line);
	color: #44484e !important;
	font-size: .72rem;
}
.rampup-page .rampup-guests {
	padding: clamp(52px, 7vw, 96px) var(--rampup-gutter) clamp(72px, 9vw, 124px);
	background: var(--rampup-paper);
}
.rampup-page .rampup-section-intro,
.rampup-page .rampup-guest-nav,
.rampup-page .rampup-recommendations__grid,
.rampup-page .rampup-recommendations__back { width: min(100%, var(--rampup-content-max)); }
.rampup-page .rampup-interview {
	width: min(calc(100% - (2 * var(--rampup-gutter))), var(--rampup-content-max));
}
.rampup-page .rampup-gallery__grid,
.rampup-page .rampup-gallery__placeholder { width: min(100%, var(--rampup-content-max)); }
.rampup-page .rampup-section-intro h2,
.rampup-page .rampup-interview__heading h2,
.rampup-page .rampup-recommendation__copy strong {
	color: var(--rampup-ink);
	font-family: var(--rampup-font);
	font-weight: 550;
	line-height: 1.05;
	letter-spacing: -.056em;
}
.rampup-page .rampup-section-intro h2 { max-width: 25ch; font-size: clamp(2.55rem, 5.5vw, 5.4rem); }
.rampup-page .rampup-section-intro h2 em {
	color: #6e6e73;
	font: inherit;
}
.rampup-page .rampup-interview__heading h2 { font-size: clamp(2.7rem, 5.5vw, 5rem); }
.rampup-page .rampup-recommendation__copy strong { font-size: clamp(1.4rem, 2.2vw, 2.3rem); }
.rampup-page .rampup-guest-nav__portrait,
.rampup-page .rampup-interview__portrait-frame,
.rampup-page .rampup-player__poster,
.rampup-page .rampup-player__empty,
.rampup-page .rampup-player iframe,
.rampup-page .rampup-gallery__item button,
.rampup-page .rampup-gallery__placeholder,
.rampup-page .rampup-recommendation__media { border-radius: var(--rampup-radius); }
.rampup-page .rampup-player__empty {
	color: #444950;
	background: linear-gradient(135deg, #eaeced, #d9dddf);
}
.rampup-page .rampup-player__empty > .rampup-media-placeholder { color: #626970; }
.rampup-page .rampup-gallery {
	color: var(--rampup-ink);
	background: #fff;
}
.rampup-page .rampup-gallery .rampup-eyebrow,
.rampup-page .rampup-gallery .rampup-section-intro > p:last-child,
.rampup-page .rampup-gallery .rampup-section-intro h2 em,
.rampup-page .rampup-gallery__item figcaption { color: var(--rampup-muted); }
.rampup-page .rampup-gallery__placeholder {
	color: #606970;
	border-color: #cdd1d3;
	background: linear-gradient(135deg, #f2f3f3, #e1e5e6);
}
.rampup-page .rampup-gallery__item button { background: #e4e7e7; }
.rampup-page .rampup-recommendations { background: var(--rampup-paper); }
@media (max-width: 900px) {
	.rampup-page .rampup-hero__masthead { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(25px, 4vw, 42px); }
	.rampup-page .rampup-hero__stage { height: clamp(350px, 51svh, 560px); }
}
@media (max-width: 650px) {
	.rampup-page .rampup-hero { min-height: 0; padding-top: 12px; padding-bottom: 54px; }
	.rampup-page .rampup-hero__stage { width: 100%; height: clamp(290px, 47svh, 460px); min-height: 0; margin: 0 auto; }
	.rampup-page .rampup-hero__title-wrap { padding: 0 18px 28px; }
	.rampup-page .rampup-hero h1 { font-size: clamp(2.85rem, 11.4vw, 5.3rem); letter-spacing: -.07em; }
	.rampup-page .rampup-hero__brand { top: 14px; left: 14px; font-size: .67rem; }
	.rampup-page .rampup-hero__masthead { grid-template-columns: 1fr; gap: 24px; margin-top: 28px; }
	.rampup-page .rampup-hero__subtitle { font-size: clamp(1.6rem, 7vw, 2.4rem); max-width: 24ch; }
	.rampup-page .rampup-hero__continue { justify-content: space-between; margin-top: 28px; padding-top: 18px; }
	.rampup-page .rampup-guests { padding-top: 36px; }
	.rampup-page .rampup-interview { width: auto; margin-inline: var(--rampup-gutter); }
	.rampup-page .rampup-section-intro h2 { font-size: clamp(2.4rem, 10vw, 3.6rem); }
	.rampup-page .rampup-interview__heading h2 { font-size: clamp(2.7rem, 11vw, 4.5rem); }
	.rampup-page .rampup-recommendation__copy strong { font-size: clamp(1.25rem, 5.7vw, 1.8rem); }
}

/* Like the content library shelves: a viewport-wide scrolling area, with
 * in-flow edge padding to align the first/last guest to the section heading.
 * The gutter scrolls away with the cards instead of clipping a portrait. */
.rampup-page .rampup-guests .rampup-guest-nav {
	--guest-gap: clamp(12px, 1.4vw, 22px);
	display: grid;
	grid-template-columns: none;
	grid-auto-flow: column;
	grid-auto-columns: minmax(155px, calc((100% - 4 * var(--guest-gap)) / 5));
	gap: var(--guest-gap);
	width: calc(100% + 2 * var(--rampup-gutter));
	max-width: none;
	margin-inline: calc(-1 * var(--rampup-gutter));
	padding: 0 max(var(--rampup-gutter), calc((100% + 2 * var(--rampup-gutter) - var(--rampup-content-max)) / 2)) 16px;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
}
.rampup-page .rampup-guests .rampup-guest-nav::-webkit-scrollbar { display: none; }
@media (max-width: 600px) {
	.rampup-page .rampup-guests .rampup-guest-nav {
		--guest-gap: 14px;
		grid-auto-columns: minmax(142px, 44vw);
	}
}
