/*
 * Split from components.css. Selectors unchanged.
 * Book page template.
 */

/* ---------- Book page ---------- */

.wpx-page--book .wpx-hero--book.has-media {
	min-height: calc(100svh - 4.5rem);
	overflow: hidden;
	padding-block: var(--sp-10) var(--sp-8);
	color: var(--c-white);
}

.wpx-page--book .wpx-hero--book .wpx-hero__body {
	z-index: 2;
	max-width: var(--w-wide);
}

.wpx-page--book .wpx-hero--book .wpx-eyebrow {
	color: rgb(255 255 255 / 82%);
	font-weight: 400;
}

.wpx-page--book .wpx-hero--book .wpx-hero__title {
	display: grid;
	grid-template-columns: auto auto;
	justify-content: start;
	align-items: end;
	column-gap: 0.7rem;
	max-width: none;
	margin: 0;
	font-weight: 300;
	line-height: 1.05;
}

.wpx-page--book .wpx-hero__title-main {
	grid-column: 1;
	grid-row: 1;
}

.wpx-page--book .wpx-hero__title-aside {
	grid-column: 2;
	grid-row: 1;
	padding-bottom: 0.22em;
	font-size: 0.38em;
	font-weight: 300;
	line-height: 1.2;
	white-space: nowrap;
}

.wpx-page--book .wpx-hero__title-sub {
	grid-column: 1;
	grid-row: 2;
}

.wpx-page--book .wpx-hero--book .wpx-hero__fade {
	z-index: 1;
	background:
		linear-gradient(
			180deg,
			rgb(0 0 0 / 12%) 0%,
			rgb(0 0 0 / 0%) 32%,
			rgb(61 68 35 / 0%) 48%,
			rgb(61 68 35 / 100%) 100%
		),
		linear-gradient(90deg, rgb(0 0 0 / 38%) 0%, rgb(0 0 0 / 0%) 52%);
}

.wpx-book-buy,
.wpx-book-body {
	--c-gold: #eece3f;
	color: var(--c-white);
}

.wpx-book-buy {
	background: linear-gradient(180deg, var(--c-nav) 0%, var(--c-pine) 100%);
}

.wpx-book-buy__grid {
	display: grid;
	gap: var(--sp-8);
	align-items: center;
	padding-bottom: var(--sp-8);
}

@media (width >= 56rem) {
	.wpx-book-buy__grid {
		grid-template-columns: minmax(16rem, 26rem) 1fr;
		column-gap: clamp(2.5rem, 6vw, 6rem);
	}
}

.wpx-book-buy__cover img {
	display: block;
	width: 100%;
	height: auto;
	box-shadow: 0 1.25rem 2.75rem rgb(0 0 0 / 28%);
}

.wpx-book-buy__byline,
.wpx-book-buy__specs {
	margin: var(--sp-4) 0 0;
	color: rgb(255 255 255 / 88%);
	font-size: var(--fs-sm);
	text-align: center;
}

.wpx-book-buy__specs {
	margin-top: var(--sp-2);
}

.wpx-book-buy__blurb {
	max-width: 38rem;
	color: inherit;
	font-size: clamp(1.15rem, 1rem + 0.55vw, 1.45rem);
	font-weight: 400;
	line-height: 1.55;
}

.wpx-book-buy__blurb p {
	margin: 0;
}

.wpx-book-buy__available {
	margin: 0 0 var(--sp-6);
	padding-top: var(--sp-8);
	border-top: 1px solid rgb(255 255 255 / 55%);
	color: rgb(255 255 255 / 78%);
	font-size: var(--fs-sm);
	font-weight: 400;
	text-align: center;
}

.wpx-book-buy__retailers {
	display: grid;
	gap: var(--sp-5) var(--sp-8);
	list-style: none;
	max-width: 44rem;
	margin: 0 auto;
	padding: 0;
}

@media (width >= 40rem) {
	.wpx-book-buy__retailers {
		grid-template-columns: 1fr 1fr;
	}
}

.wpx-book-buy__retailers a {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	min-height: 0;
	padding: 0;
	border: 0;
	color: var(--c-gold);
	text-decoration: none;
}

.wpx-book-buy__retailers a:hover {
	color: var(--c-white);
}

.wpx-book-buy__icon {
	display: block;
	flex-shrink: 0;
	width: 2.35rem;
	height: 2.35rem;
	color: var(--c-white);
	object-fit: contain;
}

.wpx-book-buy__retailers img.wpx-book-buy__icon {
	filter: brightness(0) invert(1);
}

.wpx-book-body {
	padding-top: var(--section-y);
	border-top: 1px solid rgb(255 255 255 / 55%);
	background: var(--c-pine);
}

.wpx-book-body .wpx-prose {
	max-width: var(--w-content);
	color: inherit;
}

.wpx-book-body .wpx-prose a {
	color: var(--c-gold);
}

.wpx-book-body .wpx-prose p {
	margin: 0;
	font-weight: 400;
	line-height: var(--lh-body);
}

.wpx-book-body .wpx-prose p + p {
	margin-top: var(--sp-5);
}