/*
 * Curiosity4U homepage sections (hero shelf, Featured Books, Explore by
 * Interest with the EditorialWordGrid, Mythos and Legends teaser, About).
 * Ported verbatim from the committed, owner-approved M2 preview
 * (prototypes/home-m2-preview/styles.css at commit 2d1ddd0); every rule is
 * scoped to .c4u-home. Shared components (.wrap, .button, .meta, .badge,
 * .cover-img, .section-title) come from c4u-catalog.css. The series artwork
 * placeholder and the unapproved logo are not part of the WordPress page.
 */

.c4u-home .cover--6x9 { --in: 6; --h: 9; aspect-ratio: 6 / 9; }

.c4u-home .cover--7x10 { --in: 7; --h: 10; aspect-ratio: 7 / 10; }

.c4u-home .cover--8x10 { --in: 8; --h: 10; aspect-ratio: 8 / 10; }

.c4u-home .cover--85x11 { --in: 8.5; --h: 11; aspect-ratio: 8.5 / 11; }

.c4u-home .cover--stone { background-color: var(--tone-stone); }

.c4u-home .cover--mist { background-color: var(--tone-mist); }

.c4u-home .cover--clay { background-color: var(--tone-clay); }

.c4u-home .cover--wheat { background-color: var(--tone-wheat); }

.c4u-home .cover--slate { background-color: var(--tone-slate); }

.c4u-home .cover--flat {
	box-shadow: 0 0 0 1px rgba(35, 43, 48, 0.1);
}

.c4u-home .hero {
	padding-block: clamp(40px, 6vw, 80px) clamp(56px, 7vw, 96px);
}

.c4u-home .hero__grid {
	display: grid;
	gap: clamp(40px, 6vw, 64px);
}

.c4u-home .hero__title {
	max-width: 16ch;
	font-size: var(--fs-6);
	line-height: 1.04;
	letter-spacing: -0.015em;
}

.c4u-home .hero__lede {
	max-width: 34ch;
	margin-top: var(--c4u-space-6);
	font-size: var(--fs-3);
	line-height: 1.45;
}

.c4u-home .hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--c4u-space-4) var(--c4u-space-8);
	margin-top: var(--c4u-space-8);
}

.c4u-home .hero__shelf {
	margin: 0;
}

.c4u-home .shelf {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding-inline: 1.6%;
}

.c4u-home .shelf::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 1px;
	background: var(--shelf-line);
}

.c4u-home .shelf__book {
	flex: none;
	width: calc(var(--in) * 3.15%);
	margin-inline: -1.6%;
	z-index: 2;
}

.c4u-home .shelf__book--outer {
	z-index: 1;
}

.c4u-home .shelf__book .cover__tag {
	max-width: 6em;
	font-size: 0.6875rem;
}

.c4u-home .shelf__book--left .cover__trim {
	align-self: flex-start;
}

.c4u-home .shelf__book--right {
	text-align: right;
}

.c4u-home .shelf__book--right .cover__tag {
	align-self: flex-end;
}

.c4u-home .shelf__book--lead {
	z-index: 3;
	box-shadow:
		0 0 0 1px rgba(35, 43, 48, 0.07),
		0 1px 1px rgba(35, 43, 48, 0.16),
		0 14px 20px -14px rgba(35, 43, 48, 0.5);
}

.c4u-home .hero__caption {
	margin-top: var(--c4u-space-4);
}

@media (max-width: 767px) {
	.c4u-home .shelf {
			padding-inline: 2%;
}

	.c4u-home .shelf__book {
			width: calc(var(--in) * 5%);
			margin-inline: -2%;
}

	.c4u-home .shelf__book--outer {
			display: none;
}
}

@media (min-width: 1024px) {
	.c4u-home .hero__grid {
			grid-template-columns: repeat(12, minmax(0, 1fr));
			align-items: center;
			gap: var(--c4u-space-8);
}

	.c4u-home .hero__text {
			grid-column: 1 / span 5;
}

	.c4u-home .hero__shelf {
			grid-column: 6 / span 7;
}

	.c4u-home .shelf {
			padding-inline: 0;
}

	.c4u-home .shelf__book {
			width: calc(var(--in) * 5.15%);
			margin-inline: -4%;
}

	.c4u-home .shelf__book--outer {
			display: none;
}

	.c4u-home .shelf__book--left:not(.shelf__book--outer) {
			margin-left: 0;
}

	.c4u-home .shelf__book--right:not(.shelf__book--outer) {
			margin-right: 0;
}

	.c4u-home .shelf .cover__tag,
	.c4u-home .shelf .cover__trim {
			font-size: var(--fs-1);
}
}

.c4u-home .featured {
	padding-block: var(--section-space);
}

.c4u-home .spread {
	display: grid;
	gap: var(--c4u-space-12);
}

.c4u-home .feature {
	display: grid;
	gap: var(--c4u-space-6);
	align-items: end;
}

.c4u-home .feature__stage {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding-top: var(--c4u-space-6);
	border-bottom: 1px solid var(--shelf-line);
}

.c4u-home .feature__cover {
	width: min(calc(var(--in) * 7.4%), 300px);
}

.c4u-home .feature__body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--c4u-space-3);
}

.c4u-home .feature__title {
	font-size: 1.625rem;
	font-weight: 600;
	line-height: 1.1;
}

.c4u-home .feature__title a {
	text-decoration: none;
}

.c4u-home .feature__title a:hover {
	text-decoration: underline;
}

.c4u-home .feature__pitch {
	max-width: 38ch;
}

.c4u-home .feature__body .button {
	margin-top: var(--c4u-space-3);
}

.c4u-home .book-list {
	display: grid;
	gap: var(--c4u-space-2);
	align-content: start;
}

.c4u-home .book-row {
	position: relative;
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	gap: var(--c4u-space-6);
	align-items: end;
	padding: var(--c4u-space-3);
	margin-inline: calc(-1 * var(--c4u-space-3));
	border-radius: var(--c4u-radius);
	transition: background-color 0.25s;
}

.c4u-home .book-row:hover {
	background: var(--tone);
}

.c4u-home .book-row__stage {
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
}

.c4u-home .book-row__cover {
	height: calc(var(--h) * 13.6px);
	padding: 0;
}

@media (max-width: 1279px) {
	.c4u-home .book-row {
			grid-template-columns: 96px minmax(0, 1fr);
			gap: var(--c4u-space-4);
}

	.c4u-home .book-row__cover {
			height: calc(var(--h) * 11.2px);
}
}

@media (min-width: 768px) {
	.c4u-home .feature__title {
			font-size: 1.875rem;
}
}

@media (min-width: 1024px) and (max-width: 1199px) {
	.c4u-home .feature__title {
			font-size: 2rem;
}

	.c4u-home .book-list {
			padding-left: var(--c4u-space-6);
}

	.c4u-home .book-row {
			grid-template-columns: 80px minmax(0, 1fr);
}

	.c4u-home .book-row__cover {
			height: calc(var(--h) * 9.8px);
}

	.c4u-home .feature {
			grid-column: 1 / span 7;
}

	.c4u-home .book-list {
			grid-column: 8 / span 5;
}
}

@media (max-width: 767px) {
	.c4u-home .book-row {
			grid-template-columns: 96px minmax(0, 1fr);
}

	.c4u-home .book-row__cover {
			height: calc(var(--h) * 11.2px);
}
}

.c4u-home .book-row__title {
	font-size: var(--fs-3);
	font-weight: 600;
	line-height: 1.15;
}

.c4u-home .book-row__link {
	text-decoration: none;
}

.c4u-home .book-row__link::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: var(--c4u-radius);
}

.c4u-home .book-row:hover .book-row__title {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

.c4u-home .book-row__cta {
	display: inline-block;
	margin-top: var(--c4u-space-2);
	color: var(--c4u-aegean);
	font-size: var(--fs-1);
	font-weight: 600;
}

.c4u-home .book-row .meta {
	margin-top: var(--c4u-space-1);
}

@media (max-width: 767px) {
	.c4u-home .feature__cover {
			width: calc(var(--in) * 7.4%);
}
}

.c4u-home .spread__note {
	margin-top: var(--c4u-space-6);
}

@media (min-width: 1200px) {
	.c4u-home .feature {
			gap: var(--c4u-space-6);
}

	.c4u-home .feature__title {
			font-size: 2.25rem;
}

	.c4u-home .book-list {
			padding-left: var(--c4u-space-12);
}

	.c4u-home .feature__stage {
			justify-content: flex-start;
}
}

@media (min-width: 768px) and (max-width: 1023px) {
	.c4u-home .spread {
			grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
			gap: var(--c4u-space-8);
			align-items: start;
}

	.c4u-home .feature__cover {
			width: calc(var(--in) * 9.4%);
}
}

@media (min-width: 1024px) {
	.c4u-home .feature {
			grid-template-columns: minmax(0, 13fr) minmax(0, 10fr);
			gap: var(--c4u-space-8);
}

	.c4u-home .feature__cover {
			width: min(calc(var(--in) * 11.8%), 400px);
}

	.c4u-home .spread {
			grid-template-columns: repeat(12, minmax(0, 1fr));
			gap: var(--c4u-space-8);
			align-items: start;
}

	.c4u-home .feature {
			grid-column: 1 / span 8;
}

	.c4u-home .book-list {
			grid-column: 9 / span 4;
}
}

.c4u-home .collections-a {
	padding-block: var(--section-space);
	background: var(--tone);
}

.c4u-home .collections-a__grid {
	display: grid;
	gap: var(--c4u-space-12);
	align-items: center;
}

.c4u-home .collection-index {
	display: grid;
	gap: var(--c4u-space-6);
	margin-top: var(--c4u-space-8);
}

.c4u-home .collection-index__item {
	position: relative;
	max-width: 36ch;
}

.c4u-home .collection-index__name {
	font-size: var(--fs-4);
	font-weight: 600;
	line-height: 1.15;
}

@media (max-width: 767px) {
	.c4u-home .collection-index__name {
			font-size: 1.5rem;
}
}

.c4u-home .collection-index__name a {
	text-decoration: underline;
	text-decoration-color: rgba(35, 85, 107, 0.4);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: color 0.2s, text-decoration-color 0.2s;
}

.c4u-home .collection-index__name a:hover {
	color: var(--c4u-aegean);
	text-decoration-color: currentColor;
}

.c4u-home .collection-index__text {
	margin-top: var(--c4u-space-1);
}

.c4u-home .collections-a__figure {
	margin: 0;
}

.c4u-home .wordgrid-page {
	display: grid;
	justify-content: center;
	padding: clamp(18px, 3.4vw, 44px);
	background: var(--c4u-white);
}

.c4u-home .wordgrid {
	--cell: clamp(21px, 5.9vw, 38px);
	display: grid;
	grid-template-columns: repeat(14, var(--cell));
	grid-template-rows: repeat(10, var(--cell));
	justify-content: center;
	font-size: calc(var(--cell) * 0.5);
	font-weight: 500;
	line-height: 1;
	color: rgba(88, 97, 105, 0.82);
	user-select: none;
}

.c4u-home .wordgrid > span,
.c4u-home .wordgrid__word > span {
	display: grid;
	place-items: center;
}

.c4u-home .wordgrid__word {
	display: grid;
	border: 1.5px solid var(--c4u-terracotta);
	border-radius: 999px;
	color: var(--c4u-ink);
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.25s;
}

.c4u-home .wordgrid__word--h {
	grid-template-columns: subgrid;
}

.c4u-home .wordgrid__word--v {
	grid-template-rows: subgrid;
	margin-inline: 3px;
}

.c4u-home .wordgrid__word--ws { grid-row: 2; grid-column: 3 / span 10; }

.c4u-home .wordgrid__word--kf { grid-row: 7; grid-column: 1 / span 13; }

.c4u-home .wordgrid__word--sp { grid-row: 2 / span 8; grid-column: 14; }

.c4u-home .wordgrid__word:hover,
.c4u-home .collections-a:has(.collection-index__item--ws a:hover,
.c4u-home .collection-index__item--ws a:focus-visible) .wordgrid__word--ws,
.c4u-home .collections-a:has(.collection-index__item--kf a:hover,
.c4u-home .collection-index__item--kf a:focus-visible) .wordgrid__word--kf,
.c4u-home .collections-a:has(.collection-index__item--sp a:hover,
.c4u-home .collection-index__item--sp a:focus-visible) .wordgrid__word--sp {
	background: rgba(200, 117, 81, 0.16);
}

.c4u-home .wordgrid__caption {
	margin-top: var(--c4u-space-4);
	text-align: center;
}

@media (min-width: 1024px) {
	.c4u-home .collections-a__grid {
			grid-template-columns: repeat(12, minmax(0, 1fr));
			gap: var(--c4u-space-8);
}

	.c4u-home .collections-a__text {
			display: contents;
}

	.c4u-home .collections-a__text .section-title {
			grid-column: 1 / -1;
			grid-row: 1;
}

	.c4u-home .collections-a__figure {
			grid-column: 1 / span 7;
			grid-row: 2;
}

	.c4u-home .collection-index {
			grid-column: 8 / span 5;
			grid-row: 2;
			align-self: center;
			margin-top: 0;
}

	.c4u-home .wordgrid {
			--cell: clamp(28px, 2.85vw, 40px);
}
}

.c4u-home .series {
	padding-block: clamp(64px, 9vw, 112px);
	background: var(--c4u-aegean);
	color: var(--on-aegean);
}

.c4u-home .series :focus-visible {
	outline-color: var(--on-aegean);
}

.c4u-home .series__title {
	max-width: 18ch;
	font-size: var(--fs-5);
	line-height: 1.06;
	letter-spacing: -0.01em;
}

.c4u-home .series__status {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--c4u-space-3);
	margin-top: var(--c4u-space-6);
}

.c4u-home .series__book cite {
	font-family: var(--font-display);
	font-size: var(--fs-3);
	font-style: normal;
	font-weight: 600;
	line-height: 1;
}

.c4u-home .series__lede {
	max-width: 46ch;
	margin-top: var(--c4u-space-4);
	margin-bottom: var(--c4u-space-8);
	color: var(--on-aegean);
}

.c4u-home .series__grid {
	display: grid;
	gap: var(--c4u-space-12);
	align-items: center;
}

/* Book 1 cover (8.5 x 11), as in the approved M2 preview's series artwork slot. */
.c4u-home .series__art {
	max-width: 200px;
	margin: 0;
}

.c4u-home .series__art img {
	display: block;
	width: 100%;
	height: auto;
	box-shadow: 0 24px 40px -24px rgba(12, 28, 36, 0.8);
}

@media (max-width: 767px) {
	.c4u-home .series__text {
			order: 1;
}

	.c4u-home .series__art {
			order: 2;
			max-width: 180px;
}
}

@media (min-width: 768px) {
	.c4u-home .series__grid {
			grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

	.c4u-home .series__art {
			max-width: 300px;
			justify-self: center;
}
}

.c4u-home .about {
	padding-block: var(--section-space);
}

.c4u-home .about__grid {
	display: grid;
	gap: var(--c4u-space-6);
}

.c4u-home .about__body p {
	max-width: 34em;
	font-family: var(--font-display);
	font-size: var(--fs-4);
	font-weight: 500;
	line-height: 1.38;
}

.c4u-home .about__body .text-link {
	margin-top: var(--c4u-space-6);
}

.c4u-home .about__logo {
	margin: var(--c4u-space-6) 0 0;
}

.c4u-home .about__logo img {
	display: block;
	width: clamp(140px, 14vw, 180px);
	height: auto;
}

@media (max-width: 767px) {
	.c4u-home .about__body p {
			font-size: var(--fs-3);
			line-height: 1.45;
}
}

@media (min-width: 1024px) {
	.c4u-home .about__grid {
			grid-template-columns: repeat(12, minmax(0, 1fr));
			gap: var(--c4u-space-8);
}

	.c4u-home .about__intro {
			grid-column: 1 / span 4;
}

	.c4u-home .about__body {
			grid-column: 5 / span 8;
}
}

.c4u-home .book-row__cover.cover-img {
	width: auto;
	height: calc(var(--h) * 13.6px);
	box-shadow: 0 0 0 1px rgba(35, 43, 48, 0.1);
}

@media (max-width: 1279px) {
	.c4u-home .book-row__cover.cover-img {
			height: calc(var(--h) * 11.2px);
}
}

@media (min-width: 1024px) and (max-width: 1199px) {
	.c4u-home .book-row__cover.cover-img {
			height: calc(var(--h) * 9.8px);
}
}

.c4u-home .shelf--real,
.c4u-home .shelf.shelf--real {
	gap: 2.5%;
	padding-inline: 0;
}

.c4u-home .shelf--real .shelf__book,
.c4u-home .shelf--real .shelf__book--left,
.c4u-home .shelf--real .shelf__book--right {
	width: 29%;
	margin-inline: 0;
}

.c4u-home .shelf--real .shelf__book--lead {
	width: 37%;
}

.c4u-home .feature__subtitle {
	max-width: 32ch;
	font-family: var(--font-display);
	font-size: var(--fs-3);
	font-weight: 500;
	line-height: 1.3;
	font-variant-numeric: lining-nums;
}

@media (min-width: 768px) and (max-width: 1023px) {
	.c4u-home .book-list {
			align-self: center;
}
}

@media (min-width: 1280px) {
	.c4u-home .shelf--real,
	.c4u-home .shelf.shelf--real {
			gap: 2%;
}

	.c4u-home .shelf--real .shelf__book,
	.c4u-home .shelf--real .shelf__book--left,
	.c4u-home .shelf--real .shelf__book--right {
			width: 28%;
}

	.c4u-home .shelf--real .shelf__book--lead {
			width: 40%;
}
}

.c4u-home .feature .feature__body {
	gap: 0;
}

.c4u-home .feature__subtitle {
	margin-top: var(--c4u-space-2);
}

.c4u-home .feature__byline {
	margin-top: var(--c4u-space-4);
}

.c4u-home .feature__body .feature__pitch {
	margin-top: var(--c4u-space-6);
}

.c4u-home .feature__format {
	margin-top: var(--c4u-space-4);
}

.c4u-home .feature__body .button {
	margin-top: var(--c4u-space-8);
}

.c4u-home .book-row__subtitle {
	margin-top: var(--c4u-space-1);
	font-family: var(--font-display);
	font-size: var(--fs-2);
	font-weight: 500;
	line-height: 1.3;
	font-variant-numeric: lining-nums;
}

.c4u-home .book-row .meta {
	margin-top: var(--c4u-space-2);
}

.c4u-home .book-list {
	gap: var(--c4u-space-4);
}

.c4u-home .book-row {
	grid-template-columns: 136px minmax(0, 1fr);
}

.c4u-home .book-row__cover.cover-img {
	height: calc(var(--h) * 16px);
}

@media (max-width: 1279px) {
	.c4u-home .book-row {
			grid-template-columns: 112px minmax(0, 1fr);
}

	.c4u-home .book-row__cover.cover-img {
			height: calc(var(--h) * 13.2px);
}
}

@media (min-width: 1024px) and (max-width: 1199px) {
	.c4u-home .book-row {
			grid-template-columns: 96px minmax(0, 1fr);
}

	.c4u-home .book-row__cover.cover-img {
			height: calc(var(--h) * 11.3px);
}
}

@media (min-width: 1200px) {
	.c4u-home .book-list {
			padding-left: var(--c4u-space-6);
}
}

@media (min-width: 1280px) {
	.c4u-home .book-row {
			grid-template-columns: 120px minmax(0, 1fr);
			gap: var(--c4u-space-4);
}

	.c4u-home .book-row__cover.cover-img {
			height: calc(var(--h) * 14.2px);
}
}

@media (min-width: 1024px) and (max-width: 1279px) {
	.c4u-home .book-list {
			padding-left: var(--c4u-space-4);
}

	.c4u-home .book-row {
			gap: var(--c4u-space-4);
}

	.c4u-home .book-row__subtitle {
			display: none;
}
}

@media (min-width: 1024px) and (max-width: 1099px) {
	.c4u-home .book-list {
			padding-left: 0;
}
}

/* ---------- WordPress block wrappers ---------- */

/* Neve is a classic theme, so core wraps group content in an inner container.
   Make it layout-neutral so the M2 grids apply to the real children. */
.c4u-home .wp-block-group__inner-container {
	display: contents;
}