/* Homepage-only header and hero. Shared styles and interior pages stay intact. */
.home .bh-studio-header {
	--bh-header-background: #18191d;
	border-bottom: 1px solid rgb(25 27 34 / 12%);
	color: #f7f7f4;
}

.home .bh-header-inner,
.home .bh-hero__grid {
	max-width: 100rem;
	padding-inline: clamp(1.5rem, 5vw, 5rem);
}

.home .bh-primary-nav a {
	color: #f7f7f4;
}

.home .bh-header-cta {
	gap: 0.625rem;
	white-space: nowrap;
}

.home .bh-header-cta .bh-platform-icon {
	color: #fff;
	height: 1.5rem;
	width: 1.5rem;
}

.home .bh-header-cta .bh-platform-icon__cutout {
	fill: var(--bh-studio-blue);
}

.home .bh-header-cta:hover .bh-platform-icon__cutout {
	fill: var(--bh-studio-blue-dark);
}

.home .bh-studio-header .bh-pill-button:hover,
.home .bh-hero .bh-pill-button:hover {
	transform: none;
}

.home .bh-hero {
	--bh-hero-ink: #191b22;
	--bh-hero-copy: #5e626a;
	--bh-hero-muted: #626670;
	--bh-hero-surface: #f7f7f4;
	--bh-hero-line: rgb(25 27 34 / 12%);
	/* Darker than the action blue for small text on the stone surface. */
	--bh-hero-link: var(--bh-studio-blue-dark);
	background: #e7e6e2;
	color: var(--bh-hero-ink);
	isolation: isolate;
	overflow: hidden;
	padding-block: 3rem 3.5rem;
	position: relative;
}

.home .bh-hero__grid {
	align-items: start;
	gap: 2.75rem;
	grid-template-areas: none;
	grid-template-columns: minmax(0, 1fr);
	position: relative;
	z-index: 1;
}

.home .bh-hero__left {
	min-width: 0;
}

.home .bh-hero__copy .bh-kicker {
	color: var(--bh-hero-link);
	font-size: 0.875rem;
	letter-spacing: 0.13em;
	margin: 0 0 1.25rem;
}

.home .bh-hero__copy h1 {
	color: var(--bh-hero-ink);
	font-size: clamp(2.625rem, 11vw, 3.375rem);
	font-weight: 800;
	letter-spacing: -0.045em;
	line-height: 1.05;
	margin: 0;
}

.home .bh-hero__headline-line {
	white-space: nowrap;
}

.home .bh-hero__headline-line--ink {
	color: var(--bh-hero-ink);
}

.home .bh-hero__copy h1 .bh-hero__headline-line--blue {
	color: var(--bh-studio-blue);
}

.home .bh-hero__deck {
	color: var(--bh-hero-copy);
	font-size: clamp(1.125rem, 1.3vw, 1.3125rem);
	font-weight: 400;
	line-height: 1.58;
	margin: 1.75rem 0 0;
}

.home .bh-hero__host {
	color: var(--bh-hero-copy);
	font-size: 1.0625rem;
	font-weight: 400;
	line-height: 1.55;
	margin: 0.4rem 0 0;
}

.home .bh-hero__schedule {
	color: var(--bh-hero-ink);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.5;
	margin: 1rem 0 0;
}

.home .bh-hero__actions {
	gap: 0.75rem 1.5rem;
	margin-top: 1.875rem;
}

.home .bh-hero__actions .bh-pill-button {
	font-size: 1rem;
	min-height: 3.5rem;
	padding-inline: 1.75rem;
}

.home .bh-hero__secondary {
	color: var(--bh-hero-ink);
	font-size: 1rem;
	line-height: 1.4;
}

.home .bh-hero__secondary .bh-icon {
	color: var(--bh-hero-link);
}

.home .bh-hero a:focus-visible {
	outline: 3px solid var(--bh-hero-link);
	outline-offset: 5px;
}

.home .bh-hero__secondary:hover,
.home .bh-platforms a:hover,
.home .bh-hero-feature__body .bh-arrow-link:hover {
	color: var(--bh-hero-link);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.home .bh-platforms {
	border-color: var(--bh-hero-line);
	gap: 1rem;
	grid-area: auto;
	margin-top: 2.25rem;
	padding-top: 1.25rem;
}

.home .bh-platforms > p {
	color: var(--bh-hero-muted);
	font-size: 0.75rem;
	letter-spacing: 0.1em;
	margin: 0;
}

.home .bh-platforms > div {
	gap: 0.5rem 1.375rem;
}

.home .bh-platforms a {
	align-items: center;
	color: var(--bh-hero-ink);
	display: inline-flex;
	font: 600 1rem/1.4 var(--bh-studio-heading);
	gap: 0.5rem;
	min-height: 2.75rem;
	white-space: nowrap;
}

.home .bh-platforms .bh-icon--external-link {
	height: 0.9rem;
	width: 0.9rem;
}

.home .bh-platform-icon {
	display: inline-block;
	flex: 0 0 auto;
	height: 1.625rem;
	pointer-events: none;
	width: 1.625rem;
}

.home .bh-platform-icon--youtube { color: #df2027; }
.home .bh-platform-icon--spotify { color: #1db954; }
.home .bh-platform-icon--apple { color: #a83cce; }

.home .bh-hero-feature {
	background: var(--bh-hero-surface);
	border: 1px solid var(--bh-hero-line);
	border-radius: 1.625rem;
	box-shadow: 0 18px 48px rgb(25 27 34 / 10%);
	color: var(--bh-hero-ink);
	grid-area: auto;
	min-width: 0;
}

.home .bh-hero-feature:focus-within {
	outline-color: var(--bh-hero-link);
}

.home .bh-hero-feature__media {
	aspect-ratio: 16 / 9;
	height: auto;
}

.home .bh-hero-feature__media::after {
	content: none;
}

.home .bh-hero-feature__media > img,
.home .bh-hero-feature:hover .bh-hero-feature__media > img {
	display: block;
	transform: none;
	transition: none;
}

.home .bh-hero-feature__play {
	background: var(--bh-hero-surface);
	border: 1px solid rgb(25 27 34 / 8%);
	bottom: 1rem;
	box-shadow: 0 3px 14px rgb(25 27 34 / 14%);
	color: var(--bh-studio-blue);
	font-size: 2.25rem;
	height: 3.5rem;
	right: 1rem;
	width: 3.5rem;
}

.home .bh-hero-feature__play .bh-icon {
	color: inherit;
}

.home .bh-hero-feature__body {
	padding: 1.5rem;
}

.home .bh-hero-feature__meta {
	color: var(--bh-hero-muted);
	font-size: 0.75rem;
	gap: 0.625rem;
	letter-spacing: 0.09em;
	line-height: 1.5;
	margin: 0;
}

.home .bh-hero-feature__meta span:first-child,
.home .bh-hero-feature__body .bh-arrow-link {
	color: var(--bh-hero-link);
}

.home .bh-hero-feature__body h2 {
	color: var(--bh-hero-ink);
	font-size: clamp(1.625rem, 3.9vw, 1.875rem);
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1.13;
	margin: 1rem 0 0;
	overflow-wrap: anywhere;
}

.home .bh-hero-feature__body > p:not(.bh-hero-feature__meta) {
	color: var(--bh-hero-copy);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.6;
	margin: 1rem 0 0;
}

.home .bh-hero-feature__body .bh-arrow-link {
	font-size: 1rem;
	min-height: 2.75rem;
	margin-top: 0.875rem;
}

.home .bh-hero__skyline {
	bottom: 0;
	color: var(--bh-hero-ink);
	display: none;
	height: auto;
	left: 0;
	opacity: 0.055;
	pointer-events: none;
	position: absolute;
	width: min(100%, 90rem);
	z-index: 0;
}

@media (max-width: 29.99rem) {
	.home .bh-hero__actions {
		align-items: flex-start;
		flex-direction: column;
	}
	.home .bh-hero__actions .bh-pill-button { width: 100%; }
}

@media (max-width: 22.49rem) {
	.home .bh-hero__copy h1 { font-size: clamp(2.125rem, 11vw, 2.625rem); }
}

@media (min-width: 48rem) {
	.home .bh-hero { padding-block: 4rem; }
	.home .bh-hero__skyline { display: block; opacity: 0.035; }
}

@media (min-width: 64rem) {
	.home .bh-header-inner {
		gap: clamp(1rem, 2vw, 2rem);
		grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
		min-height: 5.4375rem;
	}
	.home .bh-primary-nav__list,
	.home .bh-primary-nav .menu { gap: clamp(1.25rem, 2.2vw, 2rem); }
	.home .bh-primary-nav__list > li > a { font-size: clamp(1rem, 1.25vw, 1.125rem); }
	.home .bh-header-cta { min-height: 3.375rem; padding-inline: 1.375rem; }
	.home .bh-hero { padding-block: clamp(4.75rem, 5vw, 5.5rem); }
	.home .bh-hero__grid {
		column-gap: clamp(3rem, 4.5vw, 5rem);
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.home .bh-hero__left { padding-top: 1.75rem; }
	.home .bh-hero__copy h1 { font-size: clamp(3.375rem, 5.4vw, 5.5rem); }
	.home .bh-hero__actions { gap: 0.75rem clamp(1.5rem, 2vw, 2rem); }
	.home .bh-hero-feature__body { padding: clamp(1.875rem, 2.25vw, 2.25rem); }
	.home .bh-hero-feature__body h2 { font-size: clamp(2.125rem, 2.5vw, 2.5rem); }
	.home .bh-hero-feature__body > p:not(.bh-hero-feature__meta) { font-size: 1.0625rem; }
	.home .bh-hero-feature__play {
		bottom: 1.25rem;
		height: 4.25rem;
		right: 1.25rem;
		width: 4.25rem;
	}
	.home .bh-hero__skyline { opacity: 0.055; }
}

/* Keep the actions side by side at the compact desktop breakpoint. */
@media (min-width: 64rem) and (max-width: 74.99rem) {
	.home .bh-hero__actions { column-gap: 1.25rem; }
	.home .bh-hero__actions .bh-pill-button {
		font-size: 0.9375rem;
		padding-inline: 1.375rem;
	}
	.home .bh-hero__secondary { font-size: 0.9375rem; gap: 0.5rem; }
}
