:root {
	--cream: #f4efe4;
	--paper: #fffdf7;
	--ink: #172720;
	--ink-soft: #42534b;
	--coral: #f36f55;
	--coral-dark: #b33f2d;
	--mint: #90c7ae;
	--mint-light: #cfe5d8;
	--yellow: #efc75e;
	--line: rgba(23, 39, 32, 0.18);
	--shell: 1180px;
	--serif: Georgia, "Times New Roman", serif;
	--sans: Arial, Helvetica, sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--cream);
	color: var(--ink);
	font-family: var(--sans);
	font-size: 16px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}
body, button, summary { font-family: var(--sans); }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--yellow);
	outline-offset: 3px;
	box-shadow: 0 0 0 5px var(--ink);
}
.shell { width: min(calc(100% - 48px), var(--shell)); margin: 0 auto; }

.skip-link {
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 100;
	transform: translateY(-160%);
	background: var(--ink);
	color: white;
	padding: 12px 18px;
	font-weight: 700;
	text-decoration: none;
}
.skip-link:focus { transform: translateY(0); }

.site-header { position: relative; z-index: 20; border-bottom: 1px solid var(--line); background: rgba(244, 239, 228, 0.94); }
.header-inner { display: flex; align-items: center; min-height: 88px; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 11px; min-height: 48px; text-decoration: none; }
.brand-mark {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	background: var(--ink);
	color: var(--cream);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.08em;
}
.brand-name { font-family: var(--serif); font-size: 17px; font-weight: 700; line-height: 0.95; }
.main-nav { display: flex; align-items: center; justify-content: center; gap: 28px; margin-left: auto; }
.main-nav a { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; font-weight: 700; text-decoration: none; }
.main-nav a:hover, .main-nav a:focus-visible { color: var(--coral-dark); }

.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 13px;
	min-height: 54px;
	padding: 14px 22px;
	border: 2px solid var(--ink);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.01em;
	text-align: center;
	text-decoration: none;
	transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.button:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0 var(--ink); }
.button--small { min-height: 44px; padding: 10px 16px; font-size: 12px; }
.button--ink { background: var(--ink); color: var(--cream); }
.button--coral { background: var(--coral); color: var(--ink); }
.button--cream { background: var(--cream); color: var(--ink); }
.text-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	font-size: 13px;
	font-weight: 800;
	text-decoration-thickness: 1px;
	text-underline-offset: 5px;
}
.text-link--dark { font-size: 15px; }

.hero { position: relative; overflow: hidden; padding: 76px 0 74px; }
.hero::before {
	content: "";
	position: absolute;
	top: 42px;
	left: -65px;
	width: 160px;
	height: 160px;
	border: 1px solid var(--line);
	border-radius: 50%;
}
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(420px, 0.97fr); align-items: center; gap: 48px; }
.eyebrow { display: flex; align-items: center; gap: 16px; margin: 0 0 23px; font-size: 11px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.eyebrow span + span { padding-left: 16px; border-left: 1px solid var(--ink); }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--serif); font-weight: 500; letter-spacing: -0.055em; }
h1 { max-width: 700px; margin-bottom: 27px; font-size: clamp(58px, 6.2vw, 93px); line-height: 0.9; }
h1 em, h2 em { color: var(--coral-dark); font-weight: 500; }
.hero-lede { max-width: 590px; margin-bottom: 30px; color: var(--ink-soft); font-size: 19px; line-height: 1.55; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; margin-bottom: 31px; }
.hero-note { display: flex; align-items: center; gap: 11px; margin: 0; font-family: var(--serif); font-size: 16px; font-style: italic; }
.note-star { display: inline-grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--ink); border-radius: 50%; font-family: var(--sans); font-style: normal; }

.book-stage { position: relative; min-height: 520px; }
.stage-sun { position: absolute; top: 0; right: 2%; width: 225px; height: 225px; border-radius: 50%; background: var(--yellow); }
.stage-sun::before, .stage-sun::after { content: ""; position: absolute; top: 50%; left: -50px; width: 325px; height: 1px; background: rgba(23, 39, 32, 0.3); }
.stage-sun::after { transform: rotate(90deg); }
.stage-book {
	position: absolute;
	bottom: 35px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 245px;
	height: 370px;
	padding: 24px 21px;
	border: 2px solid var(--ink);
	box-shadow: 13px 13px 0 rgba(23, 39, 32, 0.13);
	transform-origin: bottom center;
}
.stage-book::before {
	content: "";
	position: absolute;
	inset: 58px 18px 66px;
	border: 1px solid rgba(23, 39, 32, 0.35);
	background-image: linear-gradient(rgba(23, 39, 32, 0.16) 1px, transparent 1px), linear-gradient(90deg, rgba(23, 39, 32, 0.16) 1px, transparent 1px);
	background-size: 24px 24px;
}
.stage-book--one { left: 8px; background: var(--mint); transform: rotate(-9deg); }
.stage-book--two { left: 135px; bottom: 55px; background: var(--yellow); transform: rotate(2deg); }
.stage-book--three { right: 0; background: var(--coral); transform: rotate(9deg); }
.stage-book__series, .stage-book__topic { position: relative; z-index: 1; font-size: 10px; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.stage-book strong { position: relative; z-index: 1; align-self: center; font-family: var(--serif); font-size: 112px; font-weight: 500; line-height: 1; }
.stage-caption { position: absolute; right: 6px; bottom: 0; font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }

.proof-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--paper); }
.proof-grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.proof-grid > div { display: flex; align-items: center; gap: 13px; min-height: 108px; padding: 18px 24px; border-left: 1px solid var(--line); }
.proof-grid > div:last-child { border-right: 1px solid var(--line); }
.proof-grid strong { font-family: var(--serif); font-size: 34px; font-weight: 500; line-height: 1; }
.proof-grid span { font-size: 10px; font-weight: 800; letter-spacing: 0.07em; line-height: 1.35; text-transform: uppercase; }

.section { padding: 118px 0; }
.kicker { margin-bottom: 18px; font-size: 11px; font-weight: 800; letter-spacing: 0.17em; text-transform: uppercase; }
.kicker::before { content: ""; display: inline-block; width: 28px; height: 1px; margin: 0 10px 3px 0; background: currentColor; }
.kicker--light { color: var(--cream); }
h2 { margin-bottom: 28px; font-size: clamp(45px, 5.3vw, 76px); line-height: 0.98; }
h3 { font-family: var(--serif); font-size: 28px; font-weight: 600; letter-spacing: -0.03em; line-height: 1.08; }
.section-heading { display: grid; grid-template-columns: 1.35fr 0.65fr; align-items: end; gap: 70px; margin-bottom: 62px; }
.section-heading h2 { margin-bottom: 0; }
.section-heading > p, .sample-heading > p { max-width: 430px; margin-bottom: 8px; color: var(--ink-soft); font-size: 17px; }

.book-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.volume-card { min-width: 0; border: 1px solid var(--ink); background: var(--paper); }
.volume-visual { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 300px; padding: 22px; overflow: hidden; border-bottom: 1px solid var(--ink); }
.volume-visual::before { content: ""; position: absolute; width: 260px; height: 260px; right: -60px; top: 10px; border: 1px solid rgba(23, 39, 32, 0.4); border-radius: 50%; }
.volume-visual::after { content: ""; position: absolute; right: 72px; top: 0; width: 1px; height: 100%; background: rgba(23, 39, 32, 0.25); transform: rotate(27deg); }
.volume-card--mint .volume-visual { background: var(--mint); }
.volume-card--yellow .volume-visual { background: var(--yellow); }
.volume-card--coral .volume-visual { background: var(--coral); }
.volume-visual__brand, .volume-visual > span:last-child { position: relative; z-index: 1; font-size: 9px; font-weight: 800; letter-spacing: 0.15em; text-transform: uppercase; }
.volume-visual strong { position: relative; z-index: 1; font-family: var(--serif); font-size: 105px; font-weight: 500; line-height: 0.8; }
.volume-content { padding: 29px 26px 31px; }
.volume-label { margin-bottom: 12px; font-size: 10px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.volume-content h3 { margin-bottom: 15px; }
.volume-content > p:not(.volume-label):not(.volume-fact) { min-height: 76px; color: var(--ink-soft); font-size: 14px; }
.theme-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 20px 0; padding: 0; list-style: none; }
.theme-chips li { padding: 6px 9px; border: 1px solid var(--line); font-size: 10px; font-weight: 700; }
.volume-fact { min-height: 74px; padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 12px; line-height: 1.45; }
.volume-fact strong { font-family: var(--serif); font-size: 18px; font-weight: 600; }
.card-link { display: flex; align-items: center; justify-content: space-between; min-height: 48px; margin-top: 12px; font-size: 12px; font-weight: 800; text-decoration: none; }
.card-link:hover { color: var(--coral-dark); }

.routes-section { background: var(--mint-light); }
.routes-grid { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 90px; }
.route-intro { position: sticky; top: 40px; align-self: start; }
.route-list { border-top: 1px solid var(--ink); }
.route-list a { display: grid; grid-template-columns: 54px 1fr 32px; align-items: center; gap: 17px; min-height: 128px; border-bottom: 1px solid var(--ink); text-decoration: none; }
.route-list a:hover i { transform: translateX(7px); }
.route-number { font-family: var(--serif); font-size: 18px; }
.route-list strong, .route-list small { display: block; }
.route-list strong { margin-bottom: 6px; font-family: var(--serif); font-size: 28px; font-weight: 600; }
.route-list small { color: var(--ink-soft); font-size: 13px; }
.route-list i { font-size: 24px; font-style: normal; transition: transform 160ms ease; }

.sample-section { background: var(--paper); }
.sample-heading { display: grid; grid-template-columns: 1.15fr 0.85fr; align-items: end; gap: 80px; margin-bottom: 62px; }
.sample-heading h2 { margin-bottom: 0; }
.sample-layout { display: grid; grid-template-columns: minmax(0, 0.96fr) minmax(330px, 0.74fr); align-items: start; gap: 70px; }
.page-preview { margin: 0; }
.page-frame { padding: 22px; border: 1px solid var(--line); background: var(--cream); }
.page-frame img { width: 100%; box-shadow: 0 22px 42px rgba(23, 39, 32, 0.13); }
.page-preview figcaption { display: flex; justify-content: space-between; gap: 20px; padding-top: 16px; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; }
.sample-side { position: sticky; top: 36px; padding-top: 22px; }
.sample-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 34px; }
.sample-meta span { padding: 7px 10px; border: 1px solid var(--ink); font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.sample-side h3 { font-size: 41px; line-height: 1.04; }
.sample-side > p { color: var(--ink-soft); font-size: 16px; }
.answer-reveal { margin: 32px 0 22px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.answer-reveal summary { display: flex; align-items: center; justify-content: space-between; min-height: 64px; font-size: 13px; font-weight: 800; cursor: pointer; list-style: none; }
.answer-reveal summary::-webkit-details-marker { display: none; }
.answer-reveal summary span { font-size: 26px; font-weight: 400; }
.answer-reveal[open] summary span { transform: rotate(45deg); }
.answer-preview { padding: 0 0 22px; }
.answer-preview img { margin-bottom: 12px; border: 1px solid var(--line); }
.answer-preview p, .sample-side .sample-disclaimer { font-size: 11px; line-height: 1.5; }

.mechanics-section { background: var(--ink); color: var(--cream); }
.mechanics-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 75px 100px; }
.mechanics-copy p:last-child { max-width: 480px; color: rgba(244, 239, 228, 0.72); font-size: 18px; }
.direction-list { display: grid; grid-template-columns: repeat(3, 1fr); align-self: center; border: 1px solid rgba(244, 239, 228, 0.32); }
.direction-list div { display: flex; flex-direction: column; justify-content: center; min-height: 220px; padding: 24px; border-right: 1px solid rgba(244, 239, 228, 0.32); }
.direction-list div:last-child { border-right: 0; }
.direction-list span { font-family: var(--serif); font-size: 72px; line-height: 1; }
.direction-list strong { margin: 23px 0 3px; font-family: var(--serif); font-size: 23px; }
.direction-list small { color: rgba(244, 239, 228, 0.65); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; }
.mechanics-note { grid-column: 1 / -1; display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 18px; padding-top: 32px; border-top: 1px solid rgba(244, 239, 228, 0.25); }
.mechanics-note .note-star { border-color: var(--cream); }
.mechanics-note p { margin: 0; font-family: var(--serif); font-size: 19px; }

.compare-section { background: var(--yellow); }
.compare-grid { display: grid; grid-template-columns: 0.95fr 1.05fr; align-items: center; gap: 100px; }
.compare-art { position: relative; min-height: 440px; }
.letter { position: absolute; display: grid; place-items: center; width: 180px; height: 180px; border: 2px solid var(--ink); background: var(--paper); font-family: var(--serif); font-size: 102px; line-height: 1; box-shadow: 9px 9px 0 rgba(23, 39, 32, 0.14); }
.letter--a { left: 4%; top: 4%; transform: rotate(-7deg); }
.letter--b { right: 6%; top: 0; background: var(--mint); transform: rotate(8deg); }
.letter--c { left: 15%; bottom: 1%; background: var(--coral); transform: rotate(5deg); }
.letter--d { right: 0; bottom: 6%; transform: rotate(-8deg); }
.compare-copy > p:not(.kicker) { max-width: 550px; margin-bottom: 30px; font-size: 18px; }

.about-section { background: var(--paper); }
.about-grid { display: grid; grid-template-columns: 1fr 0.85fr; gap: 100px; }
.about-copy { padding-top: 42px; }
.about-copy p { color: var(--ink-soft); font-size: 18px; }

.final-cta { position: relative; overflow: hidden; background: var(--coral-dark); color: var(--cream); }
.final-cta::before { content: ""; position: absolute; right: -170px; top: -210px; width: 520px; height: 520px; border: 1px solid rgba(244, 239, 228, 0.42); border-radius: 50%; }
.final-cta__inner { position: relative; padding-top: 115px; padding-bottom: 115px; }
.final-cta h2 { font-size: clamp(58px, 7.5vw, 104px); }
.final-cta h2 em { color: var(--yellow); }

.site-footer { padding: 70px 0 25px; background: #101c17; color: var(--cream); }
.footer-grid { display: grid; grid-template-columns: 1.4fr repeat(3, 0.8fr); gap: 55px; padding-bottom: 65px; }
.brand--footer .brand-mark { background: var(--cream); color: var(--ink); }
.footer-grid > div > p, .footer-grid a { color: rgba(244, 239, 228, 0.7); font-size: 12px; }
.footer-grid > div:first-child > p { margin-top: 22px; }
.footer-grid > div:not(:first-child) { display: flex; flex-direction: column; gap: 8px; }
.footer-grid strong { margin-bottom: 8px; font-family: var(--serif); font-size: 17px; }
.footer-grid a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.footer-grid a:hover { color: var(--cream); }
.footer-grid a[aria-current="page"] { color: var(--cream); text-decoration: underline; text-underline-offset: 4px; }
.footer-bottom { display: flex; justify-content: space-between; gap: 30px; padding-top: 24px; border-top: 1px solid rgba(244, 239, 228, 0.2); color: rgba(244, 239, 228, 0.5); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; }

@media (max-width: 1050px) {
	.main-nav { gap: 15px; }
	.main-nav a { font-size: 11px; }
	.hero-grid { grid-template-columns: 1fr 400px; gap: 20px; }
	.book-stage { transform: scale(0.88); transform-origin: center right; }
	.stage-book { width: 220px; }
	.stage-book--two { left: 102px; }
	.proof-grid > div { padding: 15px; }
	.book-grid { gap: 15px; }
	.volume-content { padding: 24px 20px; }
	.mechanics-grid { gap: 60px; }
	.compare-grid, .about-grid { gap: 60px; }
}

@media (max-width: 860px) {
	.shell { width: min(calc(100% - 36px), var(--shell)); }
	.header-inner { flex-wrap: wrap; min-height: 104px; padding: 12px 0; gap: 8px 18px; }
	.main-nav { order: 3; width: 100%; justify-content: flex-start; overflow-x: auto; }
	.header-inner > .button { margin-left: auto; }
	.hero { padding-top: 58px; }
	.hero-grid { grid-template-columns: 1fr; gap: 40px; }
	.hero-copy { position: relative; z-index: 2; }
	.book-stage { width: 560px; max-width: 100%; margin: 0 auto; transform: none; }
	.proof-grid { grid-template-columns: repeat(3, 1fr); }
	.proof-grid > div:nth-child(4), .proof-grid > div:nth-child(5) { border-top: 1px solid var(--line); }
	.proof-grid > div:last-child { border-right: 0; }
	.section { padding: 88px 0; }
	.section-heading, .sample-heading, .routes-grid, .mechanics-grid, .compare-grid, .about-grid { grid-template-columns: 1fr; gap: 38px; }
	.book-grid { grid-template-columns: 1fr; gap: 24px; }
	.volume-card { display: grid; grid-template-columns: minmax(230px, 0.75fr) 1.25fr; }
	.volume-visual { min-height: 100%; border-right: 1px solid var(--ink); border-bottom: 0; }
	.volume-content > p:not(.volume-label):not(.volume-fact), .volume-fact { min-height: auto; }
	.route-intro, .sample-side { position: static; }
	.sample-layout { grid-template-columns: minmax(0, 1fr) minmax(280px, 0.72fr); gap: 36px; }
	.mechanics-note { grid-column: auto; }
	.footer-grid { grid-template-columns: 1.2fr 1fr 1fr; }
	.footer-grid > div:last-child { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
	.shell { width: min(calc(100% - 28px), var(--shell)); }
	.header-inner > .button { display: none; }
	.brand-name { font-size: 15px; }
	.main-nav { gap: 5px; padding-bottom: 2px; }
	.main-nav a { flex: 0 0 auto; padding: 0 9px; }
	.hero-grid, .hero-copy { min-width: 0; }
	.book-stage { width: 100%; max-width: none; }
	h1 { font-size: clamp(50px, 16vw, 72px); }
	.hero-lede { font-size: 17px; }
	.eyebrow { align-items: flex-start; flex-direction: column; gap: 6px; }
	.eyebrow span + span { padding-left: 0; border-left: 0; }
	.book-stage { min-height: 390px; }
	.stage-sun { width: 160px; height: 160px; }
	.stage-book { bottom: 36px; width: 165px; height: 270px; padding: 15px; box-shadow: 7px 7px 0 rgba(23, 39, 32, 0.13); }
	.stage-book::before { inset: 48px 13px 55px; background-size: 18px 18px; }
	.stage-book strong { font-size: 73px; }
	.stage-book--one { left: 1%; }
	.stage-book--two { left: 27%; }
	.stage-book--three { right: 1%; }
	.stage-book__series, .stage-book__topic { font-size: 7px; }
	.proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.proof-grid > div { min-width: 0; min-height: 92px; border-top: 1px solid var(--line); }
	.proof-grid span { min-width: 0; overflow-wrap: anywhere; }
	.proof-grid > div:first-child, .proof-grid > div:nth-child(2) { border-top: 0; }
	.proof-grid strong { font-size: 28px; }
	.proof-grid > div:last-child { grid-column: 1 / -1; }
	.section { padding: 70px 0; }
	h2 { font-size: clamp(42px, 13vw, 60px); }
	.section-heading { margin-bottom: 38px; }
	.volume-card { display: block; }
	.volume-visual { min-height: 260px; border-right: 0; border-bottom: 1px solid var(--ink); }
	.route-list a { grid-template-columns: 38px 1fr 22px; min-height: 112px; }
	.route-list strong { font-size: 23px; }
	.sample-layout { grid-template-columns: 1fr; }
	.page-frame { padding: 10px; }
	.sample-side h3 { font-size: 35px; }
	.direction-list { grid-template-columns: 1fr; }
	.direction-list div { min-height: 120px; border-right: 0; border-bottom: 1px solid rgba(244, 239, 228, 0.32); }
	.direction-list div:last-child { border-bottom: 0; }
	.direction-list span { font-size: 52px; }
	.compare-art { min-height: 330px; }
	.letter { width: 130px; height: 130px; font-size: 75px; }
	.about-copy { padding-top: 0; }
	.final-cta__inner { padding-top: 85px; padding-bottom: 85px; }
	.footer-grid { grid-template-columns: 1fr 1fr; gap: 35px 25px; }
	.footer-grid > div:first-child, .footer-grid > div:last-child { grid-column: 1 / -1; }
	.footer-bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; }
}

/* Series landing page */
.main-nav a[aria-current="page"] { color: var(--coral-dark); text-decoration: underline; text-underline-offset: 6px; }
.series-breadcrumb { display: flex; align-items: center; gap: 9px; min-height: 54px; color: var(--ink-soft); font-size: 11px; }
.series-breadcrumb a { min-height: 44px; display: inline-flex; align-items: center; }
.series-breadcrumb span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.series-hero { position: relative; overflow: hidden; padding: 68px 0 86px; }
.series-hero::after { content: "MIX"; position: absolute; right: -32px; bottom: -145px; color: rgba(23, 39, 32, 0.045); font-family: var(--serif); font-size: 420px; font-weight: 700; line-height: 1; pointer-events: none; }
.series-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(380px, 0.8fr); align-items: center; gap: 84px; }
.series-hero h1 { max-width: 770px; font-size: clamp(61px, 6.6vw, 98px); }
.series-hero__lede { max-width: 720px; color: var(--ink-soft); font-size: 19px; }
.series-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 25px; margin-top: 34px; }
.series-fact-card { position: relative; border: 2px solid var(--ink); background: var(--yellow); box-shadow: 13px 13px 0 var(--ink); transform: rotate(1.5deg); }
.series-fact-card::before { content: ""; position: absolute; top: -26px; right: 22px; width: 54px; height: 54px; border: 2px solid var(--ink); border-radius: 50%; background: var(--coral); }
.series-fact-card > p { margin: 0; padding: 19px 22px; border-bottom: 2px solid var(--ink); font-size: 10px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.series-fact-card ul { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 0; list-style: none; }
.series-fact-card li { display: flex; flex-direction: column; min-height: 112px; padding: 19px 22px; border-bottom: 1px solid rgba(23, 39, 32, 0.38); }
.series-fact-card li:nth-child(odd) { border-right: 1px solid rgba(23, 39, 32, 0.38); }
.series-fact-card li:nth-last-child(-n + 2) { border-bottom: 0; }
.series-fact-card strong { font-family: var(--serif); font-size: 33px; font-weight: 500; line-height: 1; }
.series-fact-card span { margin-top: 8px; font-size: 9px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }

.series-paths { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.series-paths__grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.series-paths a { display: grid; grid-template-columns: 36px 1fr 24px; align-items: center; gap: 12px; min-height: 116px; padding: 22px 28px; border-left: 1px solid var(--ink); text-decoration: none; }
.series-paths a:last-child { border-right: 1px solid var(--ink); }
.series-paths a:hover { background: var(--mint-light); }
.series-paths span { font-family: var(--serif); font-size: 15px; }
.series-paths strong, .series-paths small { display: block; }
.series-paths strong { font-family: var(--serif); font-size: 20px; }
.series-paths small { color: var(--ink-soft); font-size: 10px; }
.series-paths i { font-size: 20px; font-style: normal; }

.series-volumes { background: var(--paper); }
.series-volume-grid { display: grid; gap: 28px; }
.series-volume-card { display: grid; grid-template-columns: 330px 1fr; min-height: 350px; border: 1px solid var(--ink); background: var(--cream); }
.series-volume-card__number { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 28px; overflow: hidden; border-right: 1px solid var(--ink); }
.series-volume-card__number::before { content: ""; position: absolute; inset: 70px 32px 32px; border: 1px solid rgba(23, 39, 32, 0.4); border-radius: 50%; }
.series-volume-card--one .series-volume-card__number { background: var(--mint); }
.series-volume-card--two .series-volume-card__number { background: var(--yellow); }
.series-volume-card--three .series-volume-card__number { background: var(--coral); }
.series-volume-card__number span { position: relative; z-index: 1; font-size: 10px; font-weight: 800; letter-spacing: 0.15em; text-transform: uppercase; }
.series-volume-card__number strong { position: relative; z-index: 1; align-self: center; font-family: var(--serif); font-size: 140px; font-weight: 500; line-height: 1; }
.series-volume-card__body { display: grid; grid-template-columns: 1fr 0.7fr; grid-template-rows: auto 1fr auto; gap: 0 60px; padding: 44px 48px 35px; }
.series-volume-card__body .volume-label, .series-volume-card__body h3 { grid-column: 1; }
.series-volume-card__body h3 { margin-bottom: 14px; font-size: 39px; }
.series-volume-card__body > p:not(.volume-label) { grid-column: 1; color: var(--ink-soft); }
.series-volume-card__body dl { grid-column: 2; grid-row: 1 / 3; align-self: center; margin: 0; border-top: 1px solid var(--line); }
.series-volume-card__body dl div { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 17px 0; border-bottom: 1px solid var(--line); }
.series-volume-card__body dt { color: var(--ink-soft); font-size: 11px; }
.series-volume-card__body dd { margin: 0; font-family: var(--serif); font-size: 25px; }
.series-volume-card__body .card-link { grid-column: 1 / -1; }

.series-mechanics { background: var(--ink); color: var(--cream); }
.series-mechanics__grid { display: grid; grid-template-columns: 0.95fr 1.05fr; align-items: center; gap: 100px; }
.series-mechanics h2 em { color: var(--yellow); }
.series-mechanics__grid > div:first-child > p:last-child { max-width: 570px; color: rgba(244, 239, 228, 0.72); font-size: 18px; }
.series-direction-board { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(244, 239, 228, 0.34); }
.series-direction-board > div { display: flex; flex-direction: column; min-height: 205px; padding: 24px; border-right: 1px solid rgba(244, 239, 228, 0.34); }
.series-direction-board > div:nth-child(3) { border-right: 0; }
.series-direction-board span { font-family: var(--serif); font-size: 76px; line-height: 1; }
.series-direction-board strong { margin-top: auto; font-family: var(--serif); font-size: 19px; }
.series-direction-board > p { grid-column: 1 / -1; margin: 0; padding: 20px 24px; border-top: 1px solid rgba(244, 239, 228, 0.34); color: rgba(244, 239, 228, 0.78); font-size: 13px; }

.series-compare { background: var(--mint-light); }
.series-centered-heading { max-width: 820px; margin: 0 auto 62px; text-align: center; }
.series-centered-heading > p:last-child { max-width: 670px; margin: 0 auto; color: var(--ink-soft); }
.series-compare-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.series-compare-grid article { min-height: 355px; padding: 35px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.compare-dot { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 58px; border: 1px solid var(--ink); border-radius: 50%; font-family: var(--serif); }
.compare-dot--one { background: var(--mint); }
.compare-dot--two { background: var(--yellow); }
.compare-dot--three { background: var(--coral); }
.series-compare-grid h3 { font-size: 31px; }
.series-compare-grid p { min-height: 78px; color: var(--ink-soft); font-size: 13px; }
.series-compare-grid a { display: inline-flex; align-items: center; min-height: 44px; font-size: 12px; font-weight: 800; text-underline-offset: 5px; }

.series-themes { background: var(--yellow); }
.series-themes__grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 100px; }
.series-themes__grid > div > p:last-child { max-width: 440px; font-size: 17px; }
.series-theme-list { margin: 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.series-theme-list li { display: grid; grid-template-columns: 45px 1fr; align-items: center; min-height: 68px; border-bottom: 1px solid var(--ink); font-family: var(--serif); font-size: 21px; }
.series-theme-list span { font-family: var(--sans); font-size: 9px; font-weight: 800; }

.series-samples { background: var(--paper); }
.series-sample-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.series-sample-grid figure { scroll-margin-top: 30px; margin: 0; }
.series-sample-grid figure > div { padding: 14px; border: 1px solid var(--line); background: var(--cream); }
.series-sample-grid img { width: 100%; box-shadow: 0 16px 30px rgba(23, 39, 32, 0.1); }
.series-sample-grid figcaption { display: flex; justify-content: space-between; gap: 15px; padding-top: 15px; font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; }
.series-sample-note { margin: 35px 0 0; color: var(--ink-soft); font-size: 11px; text-align: center; }

.series-faq { background: var(--cream); }
.series-faq__grid { display: grid; grid-template-columns: 0.65fr 1.35fr; gap: 100px; }
.faq-list { border-top: 1px solid var(--ink); }
.faq-list details { border-bottom: 1px solid var(--ink); }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 25px; min-height: 78px; font-family: var(--serif); font-size: 20px; font-weight: 600; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { font-family: var(--sans); font-size: 25px; font-weight: 400; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { max-width: 760px; padding: 0 55px 25px 0; color: var(--ink-soft); font-size: 14px; }

.series-final { overflow: hidden; background: var(--coral-dark); color: var(--cream); }
.series-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.series-final__inner::after { content: "03"; position: absolute; right: -25px; bottom: -115px; color: rgba(244, 239, 228, 0.1); font-family: var(--serif); font-size: 380px; line-height: 1; }
.series-final h2 { position: relative; z-index: 1; font-size: clamp(60px, 7.5vw, 105px); }
.series-final h2 em { color: var(--yellow); }
.series-final__inner > div { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 12px; }
.series-final__inner > div a { display: inline-flex; align-items: center; justify-content: space-between; gap: 30px; min-width: 170px; min-height: 54px; padding: 12px 17px; border: 1px solid var(--cream); font-size: 12px; font-weight: 800; text-decoration: none; }
.series-final__inner > div a:hover { background: var(--cream); color: var(--ink); }

@media (max-width: 980px) {
	.series-hero__grid { grid-template-columns: 1fr 350px; gap: 45px; }
	.series-volume-card { grid-template-columns: 260px 1fr; }
	.series-volume-card__body { gap: 0 35px; padding: 38px 35px 30px; }
	.series-mechanics__grid, .series-themes__grid { gap: 55px; }
	.series-faq__grid { gap: 55px; }
}

@media (max-width: 780px) {
	.series-hero__grid, .series-mechanics__grid, .series-themes__grid, .series-faq__grid { grid-template-columns: 1fr; }
	.series-fact-card { max-width: 550px; transform: none; }
	.series-paths__grid { grid-template-columns: 1fr; }
	.series-paths a, .series-paths a:last-child { border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
	.series-paths a:last-child { border-bottom: 0; }
	.series-volume-card { grid-template-columns: 220px 1fr; }
	.series-volume-card__body { display: block; }
	.series-volume-card__body dl { margin: 22px 0; }
	.series-compare-grid { grid-template-columns: 1fr; }
	.series-compare-grid article { min-height: auto; }
	.series-compare-grid p { min-height: auto; }
	.compare-dot { margin-bottom: 25px; }
	.series-sample-grid { grid-template-columns: 1fr; gap: 50px; }
	.series-sample-grid figure { max-width: 570px; margin: 0 auto; }
}

@media (max-width: 560px) {
	.series-breadcrumb { width: min(calc(100% - 28px), var(--shell)); }
	.series-hero { padding-top: 46px; }
	.series-hero h1 { font-size: clamp(48px, 14.5vw, 72px); }
	.series-hero__lede { font-size: 17px; }
	.series-hero__actions { align-items: flex-start; flex-direction: column; }
	.series-fact-card { box-shadow: 7px 7px 0 var(--ink); }
	.series-fact-card li { min-height: 98px; padding: 16px; }
	.series-fact-card strong { font-size: 28px; }
	.series-volume-card { display: block; }
	.series-volume-card__number { min-height: 250px; border-right: 0; border-bottom: 1px solid var(--ink); }
	.series-volume-card__number::before { inset: 45px 65px 25px; }
	.series-volume-card__number strong { font-size: 102px; }
	.series-volume-card__body { padding: 30px 24px 24px; }
	.series-volume-card__body h3 { font-size: 32px; }
	.series-direction-board { grid-template-columns: 1fr; }
	.series-direction-board > div { min-height: 110px; border-right: 0; border-bottom: 1px solid rgba(244, 239, 228, 0.34); }
	.series-direction-board > div:nth-child(3) { border-bottom: 0; }
	.series-direction-board span { font-size: 48px; }
	.series-theme-list li { grid-template-columns: 34px 1fr; font-size: 17px; }
	.faq-list summary { min-height: 70px; font-size: 17px; }
	.series-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.series-final__inner > div { flex-direction: column; }
}

/* Volume comparison page */
.compare-page-hero { position: relative; overflow: hidden; padding: 70px 0 92px; background: var(--paper); }
.compare-page-hero::before { content: "COMPARE"; position: absolute; left: -18px; bottom: -35px; color: rgba(23, 39, 32, 0.035); font-family: var(--serif); font-size: 155px; font-weight: 700; letter-spacing: -0.07em; line-height: 1; }
.compare-page-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.2fr 0.8fr; align-items: center; gap: 90px; }
.compare-page-hero h1 { max-width: 800px; font-size: clamp(58px, 6.5vw, 94px); }
.compare-page-hero__grid > div:first-child > p:not(.kicker) { max-width: 690px; color: var(--ink-soft); font-size: 19px; }
.compare-page-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 28px; margin-top: 32px; }
.compare-page-hero__art { position: relative; min-height: 480px; }
.compare-stack { position: absolute; display: grid; place-items: center; width: 240px; height: 340px; border: 2px solid var(--ink); font-family: var(--serif); font-size: 112px; box-shadow: 10px 10px 0 rgba(23, 39, 32, 0.16); }
.compare-stack::before { content: "TWS MIX"; position: absolute; top: 20px; left: 20px; font-family: var(--sans); font-size: 9px; font-weight: 800; letter-spacing: 0.16em; }
.compare-stack--one { left: 0; bottom: 25px; background: var(--mint); transform: rotate(-9deg); }
.compare-stack--two { left: 105px; bottom: 58px; z-index: 2; background: var(--yellow); transform: rotate(2deg); }
.compare-stack--three { right: 0; bottom: 18px; z-index: 3; background: var(--coral); transform: rotate(10deg); }

.compare-shared { padding: 105px 0; background: var(--ink); color: var(--cream); }
.compare-shared__intro { display: grid; grid-template-columns: 1fr 1.15fr 0.85fr; align-items: end; gap: 55px; margin-bottom: 48px; }
.compare-shared__intro .kicker { margin-bottom: 7px; }
.compare-shared__intro h2 { margin: 0; font-size: clamp(40px, 4.4vw, 64px); }
.compare-shared__intro > p:last-child { margin: 0; color: rgba(244, 239, 228, 0.68); }
.compare-shared__grid { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; border-top: 1px solid rgba(244, 239, 228, 0.35); border-left: 1px solid rgba(244, 239, 228, 0.35); list-style: none; }
.compare-shared__grid li { display: flex; flex-direction: column; justify-content: center; min-height: 130px; padding: 22px; border-right: 1px solid rgba(244, 239, 228, 0.35); border-bottom: 1px solid rgba(244, 239, 228, 0.35); }
.compare-shared__grid strong { font-family: var(--serif); font-size: 39px; font-weight: 500; line-height: 1; }
.compare-shared__grid span { margin-top: 9px; color: rgba(244, 239, 228, 0.66); font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }

.compare-detail { background: var(--cream); }
.compare-detail__grid { display: grid; gap: 35px; }
.compare-book { display: grid; grid-template-columns: 300px 1fr; border: 1px solid var(--ink); background: var(--paper); }
.compare-book__cover { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 560px; padding: 27px; overflow: hidden; border-right: 1px solid var(--ink); }
.compare-book__cover::before { content: ""; position: absolute; inset: 92px 28px 80px; border: 1px solid rgba(23, 39, 32, 0.38); background-image: linear-gradient(rgba(23, 39, 32, 0.14) 1px, transparent 1px), linear-gradient(90deg, rgba(23, 39, 32, 0.14) 1px, transparent 1px); background-size: 30px 30px; }
.compare-book--one .compare-book__cover { background: var(--mint); }
.compare-book--two .compare-book__cover { background: var(--yellow); }
.compare-book--three .compare-book__cover { background: var(--coral); }
.compare-book__cover span, .compare-book__cover small { position: relative; z-index: 1; font-size: 9px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.compare-book__cover strong { position: relative; z-index: 1; align-self: center; font-family: var(--serif); font-size: 125px; font-weight: 500; }
.compare-book__content { padding: 42px 50px 34px; }
.compare-book__content h3 { margin-bottom: 12px; font-size: 40px; }
.compare-book__summary { color: var(--ink-soft); font-size: 15px; }
.compare-book dl { margin: 28px 0 15px; border-top: 1px solid var(--line); }
.compare-book dl > div { display: grid; grid-template-columns: 185px 1fr; gap: 25px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.compare-book dt { color: var(--ink-soft); font-size: 10px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.compare-book dd { margin: 0; font-size: 13px; }
.compare-book dd strong { font-family: var(--serif); font-size: 18px; }

.compare-interests { background: var(--coral-dark); color: var(--cream); }
.compare-interests__grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 100px; }
.compare-interests h2 em { color: var(--yellow); }
.compare-interests__grid > div:first-child > p:last-child { max-width: 470px; color: rgba(244, 239, 228, 0.72); font-size: 17px; }
.compare-interest-list { border-top: 1px solid rgba(244, 239, 228, 0.55); }
.compare-interest-list article { display: grid; grid-template-columns: 55px 1fr; gap: 22px; padding: 28px 0; border-bottom: 1px solid rgba(244, 239, 228, 0.55); }
.compare-interest-list article > span { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--cream); border-radius: 50%; font-family: var(--serif); }
.compare-interest-list h3 { margin-bottom: 7px; color: var(--cream); font-size: 28px; }
.compare-interest-list p { margin: 0; color: rgba(244, 239, 228, 0.72); font-size: 13px; }

.compare-samples { background: var(--paper); }
.compare-sample-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; }
.compare-sample-grid figure { scroll-margin-top: 30px; margin: 0; }
.compare-sample-grid figure > div { padding: 14px; border: 1px solid var(--line); background: var(--cream); }
.compare-sample-grid img { width: 100%; box-shadow: 0 16px 30px rgba(23, 39, 32, 0.1); }
.compare-sample-grid figcaption { display: flex; justify-content: space-between; gap: 15px; padding-top: 15px; font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; }

.compare-notes { background: var(--yellow); }
.compare-notes__grid { display: grid; grid-template-columns: 0.65fr 1.35fr; gap: 100px; }
.compare-note-list { border-top: 1px solid var(--ink); }
.compare-note-list details { border-bottom: 1px solid var(--ink); }
.compare-note-list summary { display: flex; align-items: center; justify-content: space-between; min-height: 78px; font-family: var(--serif); font-size: 20px; font-weight: 600; cursor: pointer; list-style: none; }
.compare-note-list summary::-webkit-details-marker { display: none; }
.compare-note-list summary span { font-family: var(--sans); font-size: 25px; font-weight: 400; }
.compare-note-list details[open] summary span { transform: rotate(45deg); }
.compare-note-list p { max-width: 760px; padding: 0 55px 24px 0; font-size: 14px; }

.compare-page-final { overflow: hidden; background: var(--mint); }
.compare-page-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.compare-page-final__inner::after { content: "?"; position: absolute; right: 2%; bottom: -145px; color: rgba(23, 39, 32, 0.1); font-family: var(--serif); font-size: 480px; line-height: 1; }
.compare-page-final h2 { position: relative; z-index: 1; max-width: 850px; font-size: clamp(60px, 7.2vw, 100px); }
.compare-page-final h2 em { color: var(--coral-dark); }
.compare-page-final .button { position: relative; z-index: 1; }

@media (max-width: 1020px) {
	.compare-page-hero__grid { grid-template-columns: 1fr 390px; gap: 45px; }
	.compare-page-hero__art { transform: scale(0.88); transform-origin: center right; }
	.compare-shared__intro { grid-template-columns: 0.7fr 1.3fr; }
	.compare-shared__intro > p:last-child { grid-column: 1 / -1; }
	.compare-book { grid-template-columns: 250px 1fr; }
	.compare-book__content { padding: 36px 35px 30px; }
	.compare-interests__grid, .compare-notes__grid { gap: 55px; }
}

@media (max-width: 800px) {
	.compare-page-hero__grid { grid-template-columns: 1fr; }
	.compare-page-hero__art { width: 530px; max-width: 100%; margin: 0 auto; transform: none; }
	.compare-shared__grid { grid-template-columns: repeat(2, 1fr); }
	.compare-book { grid-template-columns: 220px 1fr; }
	.compare-book__content { padding: 30px 26px; }
	.compare-book dl > div { grid-template-columns: 145px 1fr; }
	.compare-interests__grid, .compare-notes__grid { grid-template-columns: 1fr; }
	.compare-sample-grid { grid-template-columns: 1fr; gap: 50px; }
	.compare-sample-grid figure { max-width: 570px; margin: 0 auto; }
}

@media (max-width: 580px) {
	.compare-page-hero { padding-top: 46px; }
	.compare-page-hero h1 { font-size: clamp(47px, 14vw, 70px); }
	.compare-page-hero__grid > div:first-child > p:not(.kicker) { font-size: 17px; }
	.compare-page-hero__actions { align-items: flex-start; flex-direction: column; }
	.compare-page-hero__art { min-height: 360px; }
	.compare-stack { width: 170px; height: 250px; font-size: 80px; }
	.compare-stack--two { left: 27%; }
	.compare-shared__intro { grid-template-columns: 1fr; gap: 20px; }
	.compare-shared__grid li { min-height: 105px; padding: 16px; }
	.compare-shared__grid strong { font-size: 31px; }
	.compare-book { display: block; }
	.compare-book__cover { min-height: 290px; border-right: 0; border-bottom: 1px solid var(--ink); }
	.compare-book__cover::before { inset: 65px 50px 55px; }
	.compare-book__cover strong { font-size: 92px; }
	.compare-book__content h3 { font-size: 32px; }
	.compare-book dl > div { grid-template-columns: 1fr; gap: 4px; padding: 12px 0; }
	.compare-interest-list article { grid-template-columns: 48px 1fr; }
	.compare-note-list summary { min-height: 70px; font-size: 17px; }
	.compare-page-final__inner { padding-top: 82px; padding-bottom: 82px; }
}

/* Features and mechanics page */
.features-hero { padding: 66px 0 92px; overflow: hidden; }
.features-hero__grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(350px, 0.72fr); align-items: center; gap: 90px; }
.features-hero h1 { max-width: 820px; font-size: clamp(60px, 6.5vw, 96px); }
.features-hero__answer { max-width: 720px; color: var(--ink-soft); font-size: 19px; }
.features-hero__answer strong { color: var(--ink); }
.features-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 28px; margin-top: 33px; }
.features-hero__preview { position: relative; padding: 20px 0 28px 22px; }
.features-hero__preview::before { content: "15×15"; position: absolute; right: -30px; top: -34px; z-index: 2; display: grid; place-items: center; width: 108px; height: 108px; border: 2px solid var(--ink); border-radius: 50%; background: var(--yellow); font-family: var(--serif); font-size: 26px; transform: rotate(7deg); }
.features-hero__preview > div { padding: 14px; border: 2px solid var(--ink); background: var(--mint); box-shadow: 14px 14px 0 var(--ink); transform: rotate(2deg); }
.features-hero__preview img { width: 100%; }
.features-hero__preview > span { position: absolute; left: 0; bottom: 0; z-index: 2; padding: 7px 10px; background: var(--ink); color: var(--cream); font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }

.features-quick { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--yellow); }
.features-quick__grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.features-quick__grid > div { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 130px; padding: 22px; border-left: 1px solid var(--ink); }
.features-quick__grid > div:last-child { border-right: 1px solid var(--ink); }
.features-quick__grid > div > span { position: absolute; top: 12px; right: 12px; font-size: 8px; font-weight: 800; }
.features-quick__grid strong { font-family: var(--serif); font-size: 36px; font-weight: 500; line-height: 1; }
.features-quick__grid small { margin-top: 8px; font-size: 9px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }

.features-directions { background: var(--paper); }
.features-direction-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.features-direction-grid article { position: relative; min-height: 440px; padding: 32px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.features-direction-grid article:nth-child(1) { background: var(--mint-light); }
.features-direction-grid article:nth-child(2) { background: var(--cream); }
.features-direction-grid article:nth-child(3) { background: #f7df9c; }
.features-arrow { position: absolute; right: 27px; top: 18px; font-family: var(--serif); font-size: 75px; line-height: 1; }
.features-direction-grid h3 { margin-bottom: 35px; font-size: 31px; }
.features-direction-grid article > p:last-child { margin-top: 30px; color: var(--ink-soft); font-size: 13px; }
.letter-run { display: grid; grid-template-columns: repeat(4, 1fr); max-width: 260px; }
.letter-run i { display: grid; place-items: center; aspect-ratio: 1; border: 1px solid var(--ink); background: var(--paper); font-family: var(--serif); font-size: 25px; font-style: normal; }
.letter-run i + i { border-left: 0; }
.letter-run--vertical { grid-template-columns: 58px; }
.letter-run--vertical i + i { border-top: 0; border-left: 1px solid var(--ink); }
.letter-run--diagonal { position: relative; display: block; height: 220px; }
.letter-run--diagonal i { position: absolute; width: 58px; height: 58px; }
.letter-run--diagonal i:nth-child(1) { left: 0; top: 0; }
.letter-run--diagonal i:nth-child(2) { left: 55px; top: 55px; }
.letter-run--diagonal i:nth-child(3) { left: 110px; top: 110px; }
.letter-run--diagonal i:nth-child(4) { left: 165px; top: 165px; }

.features-no-backward { padding: 112px 0; background: var(--coral-dark); color: var(--cream); }
.features-no-backward__grid { display: grid; grid-template-columns: 1fr 0.9fr; align-items: center; gap: 100px; }
.features-crossed { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(244, 239, 228, 0.62); border-left: 1px solid rgba(244, 239, 228, 0.62); }
.features-crossed::after { content: ""; position: absolute; left: -5%; top: 49%; width: 110%; height: 5px; background: var(--yellow); transform: rotate(-9deg); }
.features-crossed span { display: grid; place-items: center; aspect-ratio: 1; border-right: 1px solid rgba(244, 239, 228, 0.62); border-bottom: 1px solid rgba(244, 239, 228, 0.62); font-family: var(--serif); font-size: 45px; }
.features-no-backward h2 { font-size: clamp(52px, 5.6vw, 80px); }
.features-no-backward__grid > div:last-child > p:not(.kicker) { color: rgba(244, 239, 228, 0.76); font-size: 17px; }
.features-light-link { color: var(--cream); }

.features-proof { background: var(--paper); }
.features-proof__grid { display: grid; grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr); align-items: center; gap: 25px; }
.features-proof figure { margin: 0; }
.features-proof figure > div { padding: 15px; border: 1px solid var(--line); background: var(--cream); }
.features-proof figure img { width: 100%; box-shadow: 0 16px 30px rgba(23, 39, 32, 0.1); }
.features-proof figcaption { display: flex; justify-content: space-between; gap: 15px; padding-top: 15px; font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; }
.features-proof__connector { text-align: center; }
.features-proof__connector span { display: block; font-family: var(--serif); font-size: 68px; }
.features-proof__connector small { font-size: 8px; font-weight: 800; letter-spacing: 0.11em; text-transform: uppercase; }

.features-format { background: var(--mint-light); }
.features-format__grid { display: grid; grid-template-columns: 0.78fr 1.22fr; align-items: center; gap: 100px; }
.features-page-diagram { position: relative; max-width: 390px; padding: 15px 0 0 50px; }
.features-page-diagram > div { position: relative; display: flex; flex-direction: column; justify-content: space-between; width: 300px; height: 450px; padding: 28px; border: 2px solid var(--ink); background: var(--paper); box-shadow: 13px 13px 0 var(--ink); }
.features-page-diagram > div::before { content: ""; position: absolute; inset: 86px 28px 92px; border: 1px solid var(--line); background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 22px 22px; }
.features-page-diagram span { font-size: 9px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.features-page-diagram strong { position: relative; z-index: 1; align-self: center; margin-top: 55px; font-family: var(--serif); font-size: 32px; font-weight: 500; text-align: center; }
.features-page-diagram small { font-size: 10px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.features-page-diagram > i { position: absolute; left: 0; top: 48%; font-family: var(--serif); font-size: 20px; font-style: normal; transform: rotate(-90deg); }
.features-format__grid > div:last-child > p:not(.kicker) { max-width: 620px; color: var(--ink-soft); font-size: 17px; }
.features-format__facts { display: grid; grid-template-columns: repeat(3, 1fr); margin: 35px 0 0; padding: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); list-style: none; }
.features-format__facts li { display: flex; flex-direction: column; min-height: 105px; padding: 18px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.features-format__facts strong { font-family: var(--serif); font-size: 30px; font-weight: 500; }
.features-format__facts span { margin-top: auto; font-size: 8px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }

.features-difficulty { background: var(--cream); }
.features-difficulty__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.features-difficulty__grid article { min-height: 360px; padding: 42px; border: 1px solid var(--ink); }
.features-difficulty__grid article:first-child { background: var(--yellow); }
.features-difficulty__grid article:last-child { background: var(--paper); }
.features-difficulty__tag { display: inline-flex; padding: 6px 9px; border: 1px solid var(--ink); font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.features-difficulty__grid h3 { margin: 45px 0 15px; font-size: 36px; }
.features-difficulty__grid p { max-width: 510px; color: var(--ink-soft); }
.features-difficulty__grid ul { display: flex; flex-wrap: wrap; gap: 7px; margin: 26px 0 0; padding: 0; list-style: none; }
.features-difficulty__grid li { padding: 7px 10px; border: 1px solid var(--ink); font-size: 10px; font-weight: 800; }

.features-volume-choice { background: var(--ink); color: var(--cream); }
.features-volume-choice__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 100px; }
.features-volume-choice h2 em { color: var(--yellow); }
.features-volume-choice__grid > div:first-child > p:last-child { max-width: 540px; color: rgba(244, 239, 228, 0.7); font-size: 17px; }
.features-volume-links { border-top: 1px solid rgba(244, 239, 228, 0.45); }
.features-volume-links a { display: grid; grid-template-columns: 52px 1fr 24px; align-items: center; gap: 18px; min-height: 106px; border-bottom: 1px solid rgba(244, 239, 228, 0.45); text-decoration: none; }
.features-volume-links a:hover { color: var(--yellow); }
.features-volume-links span { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--cream); border-radius: 50%; font-family: var(--serif); }
.features-volume-links strong { font-family: var(--serif); font-size: 23px; }
.features-volume-links i { font-size: 22px; font-style: normal; }

.features-faq { background: var(--paper); }
.features-faq__grid { display: grid; grid-template-columns: 0.65fr 1.35fr; gap: 100px; }
.features-final { overflow: hidden; background: var(--yellow); }
.features-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.features-final__inner::after { content: "15×15"; position: absolute; right: -30px; bottom: -70px; color: rgba(23, 39, 32, 0.07); font-family: var(--serif); font-size: 180px; font-weight: 700; }
.features-final h2 { position: relative; z-index: 1; font-size: clamp(60px, 7vw, 98px); }
.features-final .button { position: relative; z-index: 1; }

@media (max-width: 980px) {
	.features-hero__grid { grid-template-columns: 1fr 330px; gap: 50px; }
	.features-no-backward__grid, .features-format__grid, .features-volume-choice__grid, .features-faq__grid { gap: 55px; }
	.features-direction-grid article { padding: 25px; }
	.features-proof__grid { grid-template-columns: 1fr 70px 1fr; }
}

@media (max-width: 780px) {
	.features-hero__grid, .features-no-backward__grid, .features-format__grid, .features-volume-choice__grid, .features-faq__grid { grid-template-columns: 1fr; }
	.features-hero__preview { max-width: 520px; margin: 0 auto; }
	.features-quick__grid { grid-template-columns: repeat(3, 1fr); }
	.features-quick__grid > div:nth-child(n + 4) { border-top: 1px solid var(--ink); }
	.features-direction-grid { grid-template-columns: 1fr; }
	.features-direction-grid article { min-height: 330px; }
	.features-crossed { max-width: 560px; }
	.features-format__grid { justify-items: start; }
	.features-difficulty__grid { grid-template-columns: 1fr; }
}

@media (max-width: 580px) {
	.features-hero { padding-top: 46px; }
	.features-hero h1 { font-size: clamp(48px, 14vw, 70px); }
	.features-hero__answer { font-size: 17px; }
	.features-hero__actions { align-items: flex-start; flex-direction: column; }
	.features-hero__preview::before { right: -5px; width: 86px; height: 86px; font-size: 21px; }
	.features-quick__grid { grid-template-columns: repeat(2, 1fr); }
	.features-quick__grid > div { min-height: 108px; border-top: 1px solid var(--ink); }
	.features-quick__grid > div:first-child, .features-quick__grid > div:nth-child(2) { border-top: 0; }
	.features-quick__grid > div:last-child { grid-column: 1 / -1; }
	.features-direction-grid article { min-height: 380px; }
	.features-crossed span { font-size: 31px; }
	.features-proof__grid { grid-template-columns: 1fr; gap: 38px; }
	.features-proof__connector { transform: rotate(90deg); }
	.features-page-diagram { padding-left: 30px; }
	.features-page-diagram > div { width: 245px; height: 368px; }
	.features-format__facts { grid-template-columns: 1fr; }
	.features-format__facts li { min-height: 82px; }
	.features-difficulty__grid article { padding: 30px 24px; }
	.features-difficulty__grid h3 { margin-top: 35px; font-size: 31px; }
	.features-volume-links strong { font-size: 19px; }
	.features-final__inner { padding-top: 82px; padding-bottom: 82px; }
}

/* Theme explorer page */
.themes-hero { position: relative; overflow: hidden; padding: 68px 0 92px; background: var(--mint-light); }
.themes-hero__grid { display: grid; grid-template-columns: 1.08fr 0.92fr; align-items: center; gap: 90px; }
.themes-hero h1 { max-width: 830px; font-size: clamp(60px, 6.4vw, 95px); }
.themes-hero__grid > div:first-child > p:not(.kicker) { max-width: 700px; color: var(--ink-soft); font-size: 19px; }
.themes-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 28px; margin-top: 34px; }
.themes-hero__art { position: relative; display: flex; flex-wrap: wrap; align-content: center; justify-content: center; gap: 12px; min-height: 470px; padding: 65px; border: 2px solid var(--ink); border-radius: 50%; background: var(--yellow); transform: rotate(2deg); }
.themes-hero__art::before, .themes-hero__art::after { content: ""; position: absolute; left: 50%; top: -45px; width: 1px; height: calc(100% + 90px); background: rgba(23, 39, 32, 0.35); }
.themes-hero__art::after { transform: rotate(90deg); }
.themes-hero__art span { position: relative; z-index: 1; padding: 9px 13px; border: 1px solid var(--ink); background: var(--paper); font-family: var(--serif); font-size: 18px; transform: rotate(-3deg); }
.themes-hero__art span:nth-child(even) { background: var(--coral); transform: rotate(4deg); }
.themes-hero__art strong { position: relative; z-index: 1; flex-basis: 100%; margin-top: 18px; font-family: var(--serif); font-size: 105px; font-weight: 500; line-height: 0.8; text-align: center; }
.themes-hero__art small { position: relative; z-index: 1; flex-basis: 100%; font-size: 9px; font-weight: 800; letter-spacing: 0.13em; text-align: center; text-transform: uppercase; }

.themes-categories { border-top: 1px solid var(--ink); background: var(--paper); }
.themes-category-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-left: 1px solid var(--ink); }
.themes-category-grid a { display: grid; grid-template-columns: 32px 1fr; grid-template-rows: 1fr auto; gap: 5px 10px; min-height: 145px; padding: 22px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); text-decoration: none; }
.themes-category-grid a:hover { background: var(--yellow); }
.themes-category-grid span { grid-row: 1 / 3; font-family: var(--serif); font-size: 15px; }
.themes-category-grid strong { align-self: end; font-family: var(--serif); font-size: 19px; line-height: 1.12; }
.themes-category-grid small { font-size: 9px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }

.themes-explorer { background: var(--cream); }
.theme-filter-panel { display: grid; grid-template-columns: 1fr 1fr auto auto; align-items: end; gap: 15px; margin-bottom: 38px; padding: 22px; border: 1px solid var(--ink); background: var(--paper); }
.theme-filter-control label { display: block; margin-bottom: 7px; font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.theme-filter-control select { width: 100%; min-height: 48px; padding: 10px 42px 10px 13px; border: 1px solid var(--ink); border-radius: 0; background: var(--paper); color: var(--ink); font: 700 13px var(--sans); }
.theme-filter-clear { min-height: 48px; padding: 10px 17px; border: 1px solid var(--ink); background: var(--ink); color: var(--cream); font-size: 11px; font-weight: 800; cursor: pointer; }
.theme-filter-clear:hover, .theme-filter-clear:focus-visible { background: var(--coral-dark); }
.theme-result-count { align-self: center; min-width: 125px; margin: 0; font-size: 11px; text-align: right; }
.theme-result-count strong { font-family: var(--serif); font-size: 27px; font-weight: 500; }
.theme-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.theme-card { display: flex; flex-direction: column; min-height: 320px; padding: 24px; border: 1px solid var(--ink); background: var(--paper); }
.theme-card[data-category="science"] { border-top: 7px solid var(--yellow); }
.theme-card[data-category="society"] { border-top: 7px solid var(--coral); }
.theme-card[data-category="arts"] { border-top: 7px solid #b9a9d3; }
.theme-card[data-category="nature"] { border-top: 7px solid var(--mint); }
.theme-card[data-category="business"] { border-top: 7px solid #86a7c7; }
.theme-card[data-category="everyday"] { border-top: 7px solid #e6a15d; }
.theme-card[data-category="sports"] { border-top: 7px solid #dc7893; }
.theme-card[data-category="body"] { border-top: 7px solid #9acbd1; }
.theme-card__top { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 25px; font-size: 9px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.theme-card__category { min-height: 30px; margin-bottom: 8px; color: var(--ink-soft); font-size: 10px; }
.theme-card h3 { margin-bottom: 22px; font-size: 28px; }
.theme-card ul { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 22px; padding: 0; list-style: none; }
.theme-card li { padding: 5px 7px; border: 1px solid var(--line); font-size: 9px; }
.theme-card > a { display: flex; align-items: center; justify-content: space-between; gap: 15px; min-height: 44px; margin-top: auto; border-top: 1px solid var(--line); padding-top: 12px; font-size: 11px; font-weight: 800; text-decoration: none; }
.theme-card > a:hover { color: var(--coral-dark); }
.theme-empty { padding: 65px 25px; border: 1px solid var(--ink); background: var(--paper); text-align: center; }
.theme-empty strong { font-family: var(--serif); font-size: 28px; }
.theme-empty p { margin: 8px 0 0; color: var(--ink-soft); }

.themes-sample { background: var(--yellow); }
.themes-sample__grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(350px, 0.8fr); align-items: center; gap: 90px; }
.themes-sample figure { margin: 0; }
.themes-sample figure > div { padding: 16px; border: 2px solid var(--ink); background: var(--paper); box-shadow: 13px 13px 0 var(--ink); transform: rotate(-1.5deg); }
.themes-sample figure img { width: 100%; }
.themes-sample figcaption { display: flex; justify-content: space-between; gap: 18px; padding-top: 20px; font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; }
.themes-sample__grid > div > p:not(.kicker) { color: var(--ink-soft); font-size: 17px; }
.themes-sample__grid > div > ul { margin: 28px 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.themes-sample__grid > div > ul li { padding: 11px 0; border-bottom: 1px solid var(--ink); font-size: 12px; font-weight: 800; }

.themes-volume-guide { background: var(--ink); color: var(--cream); }
.themes-volume-guide__grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 100px; }
.themes-volume-guide h2 em { color: var(--yellow); }
.themes-volume-guide__grid > div:first-child > p:last-child { max-width: 490px; color: rgba(244, 239, 228, 0.7); font-size: 17px; }
.themes-volume-list { border-top: 1px solid rgba(244, 239, 228, 0.44); }
.themes-volume-list article { display: grid; grid-template-columns: 55px 1fr; gap: 22px; padding: 27px 0; border-bottom: 1px solid rgba(244, 239, 228, 0.44); }
.themes-volume-list article > span { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--cream); border-radius: 50%; font-family: var(--serif); }
.themes-volume-list h3 { margin-bottom: 6px; color: var(--cream); font-size: 28px; }
.themes-volume-list p { margin: 0; color: rgba(244, 239, 228, 0.7); font-size: 13px; }

.themes-faq { background: var(--paper); }
.themes-faq__grid { display: grid; grid-template-columns: 0.65fr 1.35fr; gap: 100px; }
.themes-final { overflow: hidden; background: var(--mint); }
.themes-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.themes-final__inner::after { content: "240"; position: absolute; right: -35px; bottom: -120px; color: rgba(23, 39, 32, 0.09); font-family: var(--serif); font-size: 360px; line-height: 1; }
.themes-final h2 { position: relative; z-index: 1; font-size: clamp(60px, 7vw, 100px); }
.themes-final h2 em { color: var(--coral-dark); }
.themes-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.themes-hero__grid { gap: 55px; }
	.themes-hero__art { min-height: 400px; padding: 45px; }
	.themes-category-grid { grid-template-columns: repeat(2, 1fr); }
	.theme-filter-panel { grid-template-columns: 1fr 1fr auto; }
	.theme-result-count { grid-column: 1 / -1; text-align: left; }
	.theme-card-grid { grid-template-columns: repeat(2, 1fr); }
	.themes-sample__grid, .themes-volume-guide__grid, .themes-faq__grid { gap: 55px; }
}

@media (max-width: 780px) {
	.themes-hero__grid, .themes-sample__grid, .themes-volume-guide__grid, .themes-faq__grid { grid-template-columns: 1fr; }
	.themes-hero__art { max-width: 560px; }
	.themes-sample figure { max-width: 570px; }
	.theme-filter-panel { grid-template-columns: 1fr 1fr; }
	.theme-filter-clear { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
	.themes-hero { padding-top: 46px; }
	.themes-hero h1 { font-size: clamp(48px, 14vw, 70px); }
	.themes-hero__grid > div:first-child > p:not(.kicker) { font-size: 17px; }
	.themes-hero__actions { align-items: flex-start; flex-direction: column; }
	.themes-hero__art { min-height: 345px; padding: 35px; }
	.themes-hero__art span { padding: 7px 9px; font-size: 15px; }
	.themes-hero__art strong { font-size: 78px; }
	.themes-category-grid { grid-template-columns: 1fr; }
	.themes-category-grid a { min-height: 112px; }
	.theme-filter-panel { grid-template-columns: 1fr; }
	.theme-filter-clear, .theme-result-count { grid-column: auto; }
	.theme-card-grid { grid-template-columns: 1fr; }
	.theme-card { min-height: 290px; }
	.themes-sample figure > div { padding: 9px; box-shadow: 7px 7px 0 var(--ink); }
	.themes-volume-list article { grid-template-columns: 48px 1fr; }
	.themes-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.themes-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* Playable sample page */
.sample-game-hero { overflow: hidden; padding: 68px 0 90px; background: var(--yellow); }
.sample-game-hero__grid { display: grid; grid-template-columns: 1.08fr 0.92fr; align-items: center; gap: 88px; }
.sample-game-hero h1 { max-width: 800px; font-size: clamp(60px, 6.4vw, 96px); }
.sample-game-hero__grid > div:first-child > p:not(.kicker) { max-width: 690px; color: var(--ink-soft); font-size: 19px; }
.sample-game-hero__grid-art { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); width: min(100%, 510px); border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); background: var(--paper); box-shadow: 14px 14px 0 var(--ink); transform: rotate(2deg); }
.sample-game-hero__grid-art span { display: grid; place-items: center; aspect-ratio: 1; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); font-family: var(--serif); font-size: clamp(32px, 4.4vw, 58px); }
.sample-game-hero__grid-art strong { position: absolute; right: -28px; bottom: -34px; display: grid; place-items: center; width: 116px; height: 116px; border: 2px solid var(--ink); border-radius: 50%; background: var(--coral); font-family: var(--serif); font-size: 52px; font-weight: 500; }
.sample-game-hero__grid-art small { position: absolute; right: -13px; bottom: -52px; width: 86px; font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-align: center; text-transform: uppercase; }

.sample-rules { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.sample-rules__grid { display: grid; grid-template-columns: repeat(4, 1fr); border-left: 1px solid var(--ink); }
.sample-rules__grid > div { display: grid; grid-template-columns: 54px 1fr; grid-template-rows: 1fr 1fr; align-items: center; min-height: 118px; padding: 19px 22px; border-right: 1px solid var(--ink); }
.sample-rules__grid span { grid-row: 1 / 3; font-family: var(--serif); font-size: 35px; }
.sample-rules__grid strong { align-self: end; font-family: var(--serif); font-size: 19px; }
.sample-rules__grid small { align-self: start; color: var(--ink-soft); font-size: 10px; }

.sample-player { background: var(--cream); }
.sample-player__heading { margin-bottom: 45px; }
.sample-theme-picker { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-bottom: 30px; }
.sample-theme-picker button { display: flex; flex-direction: column; min-height: 150px; padding: 22px; border: 1px solid var(--ink); background: var(--paper); color: var(--ink); text-align: left; cursor: pointer; }
.sample-theme-picker button:hover { background: var(--mint-light); }
.sample-theme-picker button[aria-pressed="true"] { background: var(--yellow); box-shadow: inset 0 -7px 0 var(--coral); }
.sample-theme-picker button:focus-visible, .sample-game-actions button:focus-visible, .sample-cell:focus-visible { position: relative; z-index: 3; outline: 4px solid var(--coral); outline-offset: 2px; }
.sample-theme-picker span { font-size: 9px; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.sample-theme-picker strong { margin: auto 0 8px; font-family: var(--serif); font-size: 27px; line-height: 1; }
.sample-theme-picker small { color: var(--ink-soft); font-size: 9px; font-weight: 700; letter-spacing: 0.04em; }

.sample-game-shell { padding: 35px; border: 2px solid var(--ink); background: var(--paper); box-shadow: 12px 12px 0 var(--ink); }
.sample-game-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 35px; padding-bottom: 25px; border-bottom: 1px solid var(--ink); }
.sample-game-toolbar h2 { margin: 5px 0 0; font-size: clamp(42px, 4vw, 62px); }
.sample-game-volume { font-size: 9px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.sample-progress { width: min(100%, 260px); }
.sample-progress > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; }
.sample-progress strong { font-family: var(--serif); font-size: 27px; font-weight: 500; }
.sample-progress span { font-size: 9px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.sample-progress__track { overflow: hidden; height: 9px; border: 1px solid var(--ink); background: var(--cream); }
.sample-progress__track i { display: block; width: 0; height: 100%; background: var(--mint); transition: width 180ms ease; }
.sample-instruction { margin: 22px 0 6px; color: var(--ink-soft); font-size: 13px; }
.sample-status { min-height: 25px; margin-bottom: 18px; color: var(--coral-dark); font-size: 12px; font-weight: 800; }

.sample-game-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; gap: 32px; }
.sample-board-scroll { max-width: 100%; overflow-x: auto; padding: 4px 4px 15px; scrollbar-color: var(--coral) var(--cream); }
.sample-board-scroll:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }
.sample-board { display: grid; grid-template-columns: repeat(15, minmax(0, 1fr)); width: 100%; min-width: 660px; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); background: var(--paper); }
.sample-cell { display: grid; place-items: center; min-width: 0; padding: 0; aspect-ratio: 1; border: 0; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); border-radius: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: clamp(15px, 2vw, 24px); font-weight: 800; line-height: 1; cursor: pointer; }
.sample-cell:hover { background: var(--mint-light); }
.sample-cell.is-start { background: var(--yellow); box-shadow: inset 0 0 0 3px var(--coral-dark); }
.sample-cell.is-found { background: var(--mint); }
.sample-cell.is-answer { background: var(--coral); }
.sample-cell.is-hint { position: relative; z-index: 2; background: var(--yellow); animation: sample-hint-pulse 700ms ease-in-out 3 alternate; }
@keyframes sample-hint-pulse { to { box-shadow: inset 0 0 0 5px var(--coral-dark); } }

.sample-word-panel { border: 1px solid var(--ink); background: var(--cream); }
.sample-word-panel__top { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 60px; padding: 14px 16px; border-bottom: 1px solid var(--ink); }
.sample-word-panel__top p { margin: 0; }
.sample-word-panel__top > span { font-size: 9px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.sample-word-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 0; padding: 10px 16px 14px; list-style: none; }
.sample-word-list li { position: relative; min-width: 0; padding: 8px 5px 8px 18px; overflow-wrap: anywhere; font-size: 10px; font-weight: 800; }
.sample-word-list li::before { content: ""; position: absolute; left: 2px; top: 13px; width: 7px; height: 7px; border: 1px solid var(--ink); border-radius: 50%; }
.sample-word-list li.is-found { color: var(--ink-soft); text-decoration: line-through; }
.sample-word-list li.is-found::before { background: var(--mint); }
.sample-word-list li.is-revealed::before { background: var(--coral); }
.sample-game-actions { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); }
.sample-game-actions button { min-height: 50px; padding: 10px; border: 0; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); color: var(--ink); font-size: 10px; font-weight: 800; cursor: pointer; }
.sample-game-actions button:hover { background: var(--yellow); }
.sample-game-actions button:last-child { grid-column: 1 / -1; border-bottom: 0; }

.sample-complete { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 55px; margin-top: 34px; padding: 34px; border: 1px solid var(--ink); background: var(--mint-light); }
.sample-complete h2 { margin-bottom: 13px; font-size: clamp(40px, 4.5vw, 62px); }
.sample-complete p:not(.kicker) { max-width: 620px; margin-bottom: 0; color: var(--ink-soft); }
.sample-complete > div:last-child { display: flex; align-items: flex-start; flex-direction: column; gap: 12px; }
.sample-noscript { margin-top: 35px; padding: 30px; border: 1px solid var(--ink); background: var(--yellow); }
.sample-noscript img { width: min(100%, 600px); margin-top: 25px; }

.sample-authenticity { background: var(--ink); color: var(--cream); }
.sample-authenticity__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; align-items: center; gap: 100px; }
.sample-authenticity h2 em { color: var(--yellow); }
.sample-authenticity__grid > div > p:last-child { max-width: 560px; color: rgba(244, 239, 228, 0.72); font-size: 17px; }
.sample-authenticity ul { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 0; border-top: 1px solid rgba(244, 239, 228, 0.5); border-left: 1px solid rgba(244, 239, 228, 0.5); list-style: none; }
.sample-authenticity li { display: flex; flex-direction: column; min-height: 150px; padding: 25px; border-right: 1px solid rgba(244, 239, 228, 0.5); border-bottom: 1px solid rgba(244, 239, 228, 0.5); }
.sample-authenticity strong { font-family: var(--serif); font-size: 48px; font-weight: 500; }
.sample-authenticity span { margin-top: auto; font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }

.sample-final { overflow: hidden; background: var(--coral); }
.sample-final__inner { position: relative; padding-top: 110px; padding-bottom: 85px; }
.sample-final__inner::after { content: "15x15"; position: absolute; right: -30px; bottom: -52px; color: rgba(23, 39, 32, 0.08); font-family: var(--serif); font-size: clamp(100px, 16vw, 220px); font-weight: 700; line-height: 0.8; }
.sample-final h2 { position: relative; z-index: 1; font-size: clamp(60px, 7vw, 100px); }
.sample-final h2 em { color: var(--cream); }
.sample-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }
.sample-rights-note { position: relative; z-index: 1; margin: 40px 0 0; font-size: 11px; font-weight: 700; }

@media (max-width: 980px) {
	.sample-game-hero__grid { gap: 50px; }
	.sample-game-layout { grid-template-columns: 1fr; }
	.sample-word-panel { width: 100%; }
	.sample-word-list { grid-template-columns: repeat(3, 1fr); }
	.sample-game-actions { grid-template-columns: repeat(3, 1fr); }
	.sample-game-actions button:last-child { grid-column: auto; border-bottom: 1px solid var(--ink); }
	.sample-authenticity__grid { gap: 55px; }
}

@media (max-width: 780px) {
	.sample-game-hero__grid, .sample-authenticity__grid { grid-template-columns: 1fr; }
	.sample-game-hero__grid-art { max-width: 500px; margin-top: 15px; }
	.sample-rules__grid { grid-template-columns: 1fr 1fr; }
	.sample-theme-picker { grid-template-columns: 1fr; }
	.sample-theme-picker button { min-height: 125px; }
	.sample-game-shell { padding: 24px; box-shadow: 8px 8px 0 var(--ink); }
	.sample-game-toolbar { align-items: stretch; flex-direction: column; }
	.sample-progress { width: 100%; }
	.sample-complete { grid-template-columns: 1fr; gap: 25px; }
}

@media (max-width: 560px) {
	.sample-game-hero { padding-top: 46px; }
	.sample-game-hero h1 { font-size: clamp(48px, 14vw, 70px); }
	.sample-game-hero__grid > div:first-child > p:not(.kicker) { font-size: 17px; }
	.sample-game-hero__grid-art strong { right: -8px; bottom: -23px; width: 88px; height: 88px; font-size: 40px; }
	.sample-game-hero__grid-art small { display: none; }
	.sample-rules__grid > div { grid-template-columns: 42px minmax(0, 1fr); min-width: 0; min-height: 102px; padding: 14px; }
	.sample-rules__grid span { font-size: 27px; }
	.sample-rules__grid strong { min-width: 0; overflow-wrap: anywhere; font-size: 16px; }
	.sample-rules__grid small { min-width: 0; overflow-wrap: anywhere; }
	.sample-game-shell { padding: 17px; }
	.sample-instruction { font-size: 12px; }
	.sample-word-list { grid-template-columns: 1fr 1fr; }
	.sample-game-actions { grid-template-columns: 1fr; }
	.sample-game-actions button:last-child { grid-column: auto; }
	.sample-authenticity ul { grid-template-columns: 1fr; }
	.sample-authenticity li { min-height: 110px; }
	.sample-final__inner { padding-top: 82px; padding-bottom: 72px; }
	.sample-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* Volume 1 detail page */
.volume-one-hero { overflow: hidden; padding: 68px 0 92px; background: var(--mint-light); }
.volume-one-hero__grid { display: grid; grid-template-columns: 1.02fr minmax(380px, 0.72fr); align-items: center; gap: 92px; }
.volume-one-hero h1 { max-width: 800px; font-size: clamp(60px, 6.3vw, 94px); }
.volume-one-hero__answer { max-width: 700px; color: var(--ink-soft); font-size: 19px; }
.volume-one-hero__answer strong { color: var(--ink); }
.volume-one-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 17px 27px; margin-top: 32px; }
.volume-one-hero__note { max-width: 610px; margin: 25px 0 0; padding-top: 17px; border-top: 1px solid var(--ink); font-size: 11px; }
.volume-one-hero__preview { position: relative; margin: 0; }
.volume-one-hero__preview::before { content: "01"; position: absolute; z-index: 2; right: -38px; top: -38px; display: grid; place-items: center; width: 116px; height: 116px; border: 2px solid var(--ink); border-radius: 50%; background: var(--yellow); font-family: var(--serif); font-size: 50px; }
.volume-one-hero__preview > div { padding: 16px; border: 2px solid var(--ink); background: var(--paper); box-shadow: 14px 14px 0 var(--ink); transform: rotate(1.5deg); }
.volume-one-hero__preview img { width: 100%; }
.volume-one-hero__preview figcaption { display: flex; justify-content: space-between; gap: 18px; padding-top: 20px; font-size: 9px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }

.volume-one-facts { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.volume-one-facts__grid { display: grid; grid-template-columns: repeat(5, 1fr); border-left: 1px solid var(--ink); }
.volume-one-facts__grid > div { display: flex; flex-direction: column; min-height: 115px; padding: 21px; border-right: 1px solid var(--ink); }
.volume-one-facts strong { font-family: var(--serif); font-size: 35px; font-weight: 500; line-height: 1; }
.volume-one-facts span { margin-top: auto; font-size: 9px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }

.volume-one-profile { background: var(--cream); }
.volume-one-profile__grid { display: grid; grid-template-columns: 0.78fr 1.22fr; gap: 90px; }
.volume-one-profile__grid > div:first-child { position: sticky; top: 35px; align-self: start; }
.volume-one-profile__grid > div:first-child > p:not(.kicker) { color: var(--ink-soft); font-size: 17px; }
.volume-one-profile__stats { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.volume-one-profile__stats article { display: flex; flex-direction: column; min-height: 305px; padding: 27px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.volume-one-profile__stats article:nth-child(2), .volume-one-profile__stats article:nth-child(3) { background: var(--yellow); }
.volume-one-profile__stats article > span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; }
.volume-one-profile__stats article > strong { margin: 35px 0 18px; font-family: var(--serif); font-size: clamp(50px, 5vw, 75px); font-weight: 500; line-height: 1; }
.volume-one-profile__stats h3 { margin: auto 0 8px; font-size: 23px; }
.volume-one-profile__stats p { margin: 0; color: var(--ink-soft); font-size: 12px; }

.volume-one-preview { background: var(--paper); }
.volume-one-preview__grid { display: grid; grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr); align-items: center; gap: 24px; }
.volume-one-preview figure { margin: 0; }
.volume-one-preview figure > div { padding: 15px; border: 1px solid var(--ink); background: var(--cream); }
.volume-one-preview figure img { width: 100%; box-shadow: 0 18px 35px rgba(23, 39, 32, 0.12); }
.volume-one-preview figcaption { display: flex; justify-content: space-between; gap: 16px; padding-top: 15px; font-size: 9px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.volume-one-preview__connector { text-align: center; }
.volume-one-preview__connector span { display: block; font-family: var(--serif); font-size: 66px; }
.volume-one-preview__connector small { font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.volume-one-preview__actions { display: flex; align-items: center; justify-content: space-between; gap: 35px; margin-top: 38px; padding-top: 28px; border-top: 1px solid var(--ink); }
.volume-one-preview__actions p { max-width: 500px; margin: 0; color: var(--ink-soft); font-size: 12px; text-align: right; }

.volume-one-themes { background: var(--ink); color: var(--cream); }
.volume-one-themes__grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 90px; }
.volume-one-themes h2 em { color: var(--yellow); }
.volume-one-themes__grid > div > p:not(.kicker) { max-width: 520px; color: rgba(244, 239, 228, 0.72); font-size: 17px; }
.volume-one-themes__grid > ul { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 0; border-top: 1px solid rgba(244, 239, 228, 0.45); border-left: 1px solid rgba(244, 239, 228, 0.45); list-style: none; }
.volume-one-themes__grid li { display: grid; grid-template-columns: 35px 1fr; align-items: center; min-height: 82px; padding: 14px 18px; border-right: 1px solid rgba(244, 239, 228, 0.45); border-bottom: 1px solid rgba(244, 239, 228, 0.45); font-family: var(--serif); font-size: 19px; }
.volume-one-themes__grid li span { font-family: var(--sans); font-size: 9px; font-weight: 800; }

.volume-one-difficulty { background: var(--yellow); }
.volume-one-difficulty__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.volume-one-difficulty__grid article { display: flex; flex-direction: column; min-height: 365px; padding: 40px; border: 1px solid var(--ink); background: var(--paper); }
.volume-one-difficulty__grid article > span { align-self: flex-start; padding: 7px 10px; border: 1px solid var(--ink); font-family: var(--serif); font-size: 27px; }
.volume-one-difficulty__grid h3 { margin: auto 0 15px; font-size: 36px; }
.volume-one-difficulty__grid p { color: var(--ink-soft); }

.volume-one-inside { background: var(--mint-light); }
.volume-one-inside__grid { display: grid; grid-template-columns: 1fr 0.9fr; align-items: center; gap: 100px; }
.volume-one-page-map { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 12px 12px 0 var(--ink); }
.volume-one-page-map > div { display: flex; flex-direction: column; min-height: 210px; padding: 25px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); }
.volume-one-page-map > div:nth-child(2) { background: var(--coral); }
.volume-one-page-map > div:nth-child(3) { background: var(--yellow); }
.volume-one-page-map span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; }
.volume-one-page-map strong { margin: auto 0 8px; font-family: var(--serif); font-size: 25px; }
.volume-one-page-map small { color: var(--ink-soft); font-size: 11px; }
.volume-one-inside__grid > div:last-child > p:not(.kicker) { color: var(--ink-soft); font-size: 17px; }
.volume-one-inside__grid > div:last-child > ul { display: grid; grid-template-columns: repeat(3, 1fr); margin: 30px 0 0; padding: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); list-style: none; }
.volume-one-inside__grid > div:last-child > ul li { display: flex; flex-direction: column; min-height: 110px; padding: 16px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.volume-one-inside__grid > div:last-child > ul strong { font-family: var(--serif); font-size: 28px; font-weight: 500; }
.volume-one-inside__grid > div:last-child > ul span { margin-top: auto; font-size: 8px; font-weight: 800; text-transform: uppercase; }

.volume-one-details { background: var(--paper); }
.volume-one-details__grid { display: grid; grid-template-columns: 0.7fr 1.3fr; gap: 90px; }
.volume-one-details__grid > div > p:not(.kicker) { color: var(--ink-soft); font-size: 16px; }
.volume-one-details dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.volume-one-details dl > div { min-height: 92px; padding: 17px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.volume-one-details dt { margin-bottom: 9px; font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.volume-one-details dd { margin: 0; font-family: var(--serif); font-size: 18px; }

.volume-one-faq { background: var(--cream); }
.volume-one-faq__grid { display: grid; grid-template-columns: 0.65fr 1.35fr; gap: 100px; }
.volume-one-final { overflow: hidden; background: var(--mint); }
.volume-one-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.volume-one-final__inner::after { content: "01"; position: absolute; right: -45px; bottom: -128px; color: rgba(23, 39, 32, 0.09); font-family: var(--serif); font-size: 380px; line-height: 1; }
.volume-one-final h2 { position: relative; z-index: 1; font-size: clamp(60px, 7vw, 100px); }
.volume-one-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.volume-one-hero__grid { gap: 55px; }
	.volume-one-profile__grid, .volume-one-themes__grid, .volume-one-inside__grid, .volume-one-details__grid, .volume-one-faq__grid { gap: 55px; }
	.volume-one-preview__grid { grid-template-columns: 1fr 70px 1fr; }
}

@media (max-width: 780px) {
	.volume-one-hero__grid, .volume-one-profile__grid, .volume-one-themes__grid, .volume-one-inside__grid, .volume-one-details__grid, .volume-one-faq__grid { grid-template-columns: 1fr; }
	.volume-one-hero__preview { max-width: 560px; }
	.volume-one-facts__grid { grid-template-columns: repeat(3, 1fr); }
	.volume-one-facts__grid > div:nth-child(n + 4) { border-top: 1px solid var(--ink); }
	.volume-one-profile__grid > div:first-child { position: static; }
	.volume-one-difficulty__grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.volume-one-hero { padding-top: 46px; }
	.volume-one-hero h1 { font-size: clamp(48px, 14vw, 70px); }
	.volume-one-hero__answer { font-size: 17px; }
	.volume-one-hero__actions { align-items: flex-start; flex-direction: column; }
	.volume-one-hero__preview::before { right: -5px; width: 88px; height: 88px; font-size: 38px; }
	.volume-one-facts__grid { grid-template-columns: 1fr 1fr; }
	.volume-one-facts__grid > div { min-height: 98px; border-top: 1px solid var(--ink); }
	.volume-one-facts__grid > div:first-child, .volume-one-facts__grid > div:nth-child(2) { border-top: 0; }
	.volume-one-facts__grid > div:last-child { grid-column: 1 / -1; }
	.volume-one-profile__stats { grid-template-columns: 1fr; }
	.volume-one-profile__stats article { min-height: 260px; }
	.volume-one-preview__grid { grid-template-columns: 1fr; gap: 38px; }
	.volume-one-preview__connector { transform: rotate(90deg); }
	.volume-one-preview__actions { align-items: flex-start; flex-direction: column; }
	.volume-one-preview__actions p { text-align: left; }
	.volume-one-themes__grid > ul { grid-template-columns: 1fr; }
	.volume-one-difficulty__grid article { min-height: 330px; padding: 30px 24px; }
	.volume-one-page-map { grid-template-columns: 1fr; }
	.volume-one-page-map > div { min-height: 165px; }
	.volume-one-inside__grid > div:last-child > ul, .volume-one-details dl { grid-template-columns: 1fr; }
	.volume-one-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.volume-one-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* Volume 2 detail page */
.volume-two-hero { overflow: hidden; padding: 68px 0 92px; background: var(--yellow); }
.volume-two-hero__grid { display: grid; grid-template-columns: 1.02fr minmax(380px, 0.72fr); align-items: center; gap: 92px; }
.volume-two-hero h1 { max-width: 800px; font-size: clamp(60px, 6.3vw, 94px); }
.volume-two-hero__answer { max-width: 700px; color: var(--ink-soft); font-size: 19px; }
.volume-two-hero__answer strong { color: var(--ink); }
.volume-two-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 17px 27px; margin-top: 32px; }
.volume-two-hero__note { max-width: 610px; margin: 25px 0 0; padding-top: 17px; border-top: 1px solid var(--ink); font-size: 11px; }
.volume-two-hero__preview { position: relative; margin: 0; }
.volume-two-hero__preview::before { content: "02"; position: absolute; z-index: 2; right: -38px; top: -38px; display: grid; place-items: center; width: 116px; height: 116px; border: 2px solid var(--ink); border-radius: 50%; background: var(--coral); font-family: var(--serif); font-size: 50px; }
.volume-two-hero__preview > div { padding: 16px; border: 2px solid var(--ink); background: var(--paper); box-shadow: 14px 14px 0 var(--ink); transform: rotate(-1.5deg); }
.volume-two-hero__preview img { width: 100%; }
.volume-two-hero__preview figcaption { display: flex; justify-content: space-between; gap: 18px; padding-top: 20px; font-size: 9px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }

.volume-two-facts { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.volume-two-facts__grid { display: grid; grid-template-columns: repeat(5, 1fr); border-left: 1px solid var(--ink); }
.volume-two-facts__grid > div { display: flex; flex-direction: column; min-height: 115px; padding: 21px; border-right: 1px solid var(--ink); }
.volume-two-facts strong { font-family: var(--serif); font-size: 35px; font-weight: 500; line-height: 1; }
.volume-two-facts span { margin-top: auto; font-size: 9px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }

.volume-two-profile { background: var(--cream); }
.volume-two-profile__grid { display: grid; grid-template-columns: 0.78fr 1.22fr; gap: 90px; }
.volume-two-profile__grid > div:first-child { position: sticky; top: 35px; align-self: start; }
.volume-two-profile__grid > div:first-child > p:not(.kicker) { color: var(--ink-soft); font-size: 17px; }
.volume-two-profile__stats { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.volume-two-profile__stats article { display: flex; flex-direction: column; min-height: 305px; padding: 27px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.volume-two-profile__stats article:nth-child(1), .volume-two-profile__stats article:nth-child(4) { background: var(--mint-light); }
.volume-two-profile__stats article > span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; }
.volume-two-profile__stats article > strong { margin: 35px 0 18px; font-family: var(--serif); font-size: clamp(50px, 5vw, 75px); font-weight: 500; line-height: 1; }
.volume-two-profile__stats h3 { margin: auto 0 8px; font-size: 23px; }
.volume-two-profile__stats p { margin: 0; color: var(--ink-soft); font-size: 12px; }

.volume-two-preview { background: var(--paper); }
.volume-two-preview__grid { display: grid; grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr); align-items: center; gap: 24px; }
.volume-two-preview figure { margin: 0; }
.volume-two-preview figure > div { padding: 15px; border: 1px solid var(--ink); background: var(--cream); }
.volume-two-preview figure img { width: 100%; box-shadow: 0 18px 35px rgba(23, 39, 32, 0.12); }
.volume-two-preview figcaption { display: flex; justify-content: space-between; gap: 16px; padding-top: 15px; font-size: 9px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.volume-two-preview__connector { text-align: center; }
.volume-two-preview__connector span { display: block; font-family: var(--serif); font-size: 66px; }
.volume-two-preview__connector small { font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.volume-two-preview__actions { display: flex; align-items: center; justify-content: space-between; gap: 35px; margin-top: 38px; padding-top: 28px; border-top: 1px solid var(--ink); }
.volume-two-preview__actions p { max-width: 500px; margin: 0; color: var(--ink-soft); font-size: 12px; text-align: right; }

.volume-two-themes { background: var(--coral-dark); color: var(--cream); }
.volume-two-themes__grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 90px; }
.volume-two-themes h2 em { color: var(--yellow); }
.volume-two-themes__grid > div > p:not(.kicker) { max-width: 520px; color: rgba(244, 239, 228, 0.78); font-size: 17px; }
.volume-two-themes__grid > ul { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 0; border-top: 1px solid rgba(244, 239, 228, 0.52); border-left: 1px solid rgba(244, 239, 228, 0.52); list-style: none; }
.volume-two-themes__grid li { display: grid; grid-template-columns: 35px 1fr; align-items: center; min-height: 82px; padding: 14px 18px; border-right: 1px solid rgba(244, 239, 228, 0.52); border-bottom: 1px solid rgba(244, 239, 228, 0.52); font-family: var(--serif); font-size: 19px; }
.volume-two-themes__grid li span { font-family: var(--sans); font-size: 9px; font-weight: 800; }

.volume-two-difficulty { background: var(--mint-light); }
.volume-two-difficulty__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.volume-two-difficulty__grid article { display: flex; flex-direction: column; min-height: 365px; padding: 40px; border: 1px solid var(--ink); background: var(--paper); }
.volume-two-difficulty__grid article > span { align-self: flex-start; padding: 7px 10px; border: 1px solid var(--ink); font-family: var(--serif); font-size: 27px; }
.volume-two-difficulty__grid h3 { margin: auto 0 15px; font-size: 36px; }
.volume-two-difficulty__grid p { color: var(--ink-soft); }

.volume-two-inside { background: var(--yellow); }
.volume-two-inside__grid { display: grid; grid-template-columns: 1fr 0.9fr; align-items: center; gap: 100px; }
.volume-two-page-map { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 12px 12px 0 var(--ink); }
.volume-two-page-map > div { display: flex; flex-direction: column; min-height: 210px; padding: 25px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); }
.volume-two-page-map > div:nth-child(2) { background: var(--mint); }
.volume-two-page-map > div:nth-child(3) { background: var(--coral); }
.volume-two-page-map span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; }
.volume-two-page-map strong { margin: auto 0 8px; font-family: var(--serif); font-size: 25px; }
.volume-two-page-map small { color: var(--ink-soft); font-size: 11px; }
.volume-two-inside__grid > div:last-child > p:not(.kicker) { color: var(--ink-soft); font-size: 17px; }
.volume-two-inside__grid > div:last-child > ul { display: grid; grid-template-columns: repeat(3, 1fr); margin: 30px 0 0; padding: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); list-style: none; }
.volume-two-inside__grid > div:last-child > ul li { display: flex; flex-direction: column; min-height: 110px; padding: 16px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.volume-two-inside__grid > div:last-child > ul strong { font-family: var(--serif); font-size: 28px; font-weight: 500; }
.volume-two-inside__grid > div:last-child > ul span { margin-top: auto; font-size: 8px; font-weight: 800; text-transform: uppercase; }

.volume-two-details { background: var(--paper); }
.volume-two-details__grid { display: grid; grid-template-columns: 0.7fr 1.3fr; gap: 90px; }
.volume-two-details__grid > div > p:not(.kicker) { color: var(--ink-soft); font-size: 16px; }
.volume-two-details dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.volume-two-details dl > div { min-height: 92px; padding: 17px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.volume-two-details dt { margin-bottom: 9px; font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.volume-two-details dd { margin: 0; font-family: var(--serif); font-size: 18px; }

.volume-two-faq { background: var(--cream); }
.volume-two-faq__grid { display: grid; grid-template-columns: 0.65fr 1.35fr; gap: 100px; }
.volume-two-final { overflow: hidden; background: var(--coral); }
.volume-two-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.volume-two-final__inner::after { content: "02"; position: absolute; right: -45px; bottom: -128px; color: rgba(23, 39, 32, 0.09); font-family: var(--serif); font-size: 380px; line-height: 1; }
.volume-two-final h2 { position: relative; z-index: 1; font-size: clamp(60px, 7vw, 100px); }
.volume-two-final h2 em { color: var(--cream); }
.volume-two-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.volume-two-hero__grid { gap: 55px; }
	.volume-two-profile__grid, .volume-two-themes__grid, .volume-two-inside__grid, .volume-two-details__grid, .volume-two-faq__grid { gap: 55px; }
	.volume-two-preview__grid { grid-template-columns: 1fr 70px 1fr; }
}

@media (max-width: 780px) {
	.volume-two-hero__grid, .volume-two-profile__grid, .volume-two-themes__grid, .volume-two-inside__grid, .volume-two-details__grid, .volume-two-faq__grid { grid-template-columns: 1fr; }
	.volume-two-hero__preview { max-width: 560px; }
	.volume-two-facts__grid { grid-template-columns: repeat(3, 1fr); }
	.volume-two-facts__grid > div:nth-child(n + 4) { border-top: 1px solid var(--ink); }
	.volume-two-profile__grid > div:first-child { position: static; }
	.volume-two-difficulty__grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.volume-two-hero { padding-top: 46px; }
	.volume-two-hero h1 { font-size: clamp(48px, 14vw, 70px); }
	.volume-two-hero__answer { font-size: 17px; }
	.volume-two-hero__actions { align-items: flex-start; flex-direction: column; }
	.volume-two-hero__preview::before { right: -5px; width: 88px; height: 88px; font-size: 38px; }
	.volume-two-facts__grid { grid-template-columns: 1fr 1fr; }
	.volume-two-facts__grid > div { min-height: 98px; border-top: 1px solid var(--ink); }
	.volume-two-facts__grid > div:first-child, .volume-two-facts__grid > div:nth-child(2) { border-top: 0; }
	.volume-two-facts__grid > div:last-child { grid-column: 1 / -1; }
	.volume-two-profile__stats { grid-template-columns: 1fr; }
	.volume-two-profile__stats article { min-height: 260px; }
	.volume-two-preview__grid { grid-template-columns: 1fr; gap: 38px; }
	.volume-two-preview__connector { transform: rotate(90deg); }
	.volume-two-preview__actions { align-items: flex-start; flex-direction: column; }
	.volume-two-preview__actions p { text-align: left; }
	.volume-two-themes__grid > ul { grid-template-columns: 1fr; }
	.volume-two-difficulty__grid article { min-height: 330px; padding: 30px 24px; }
	.volume-two-page-map { grid-template-columns: 1fr; }
	.volume-two-page-map > div { min-height: 165px; }
	.volume-two-inside__grid > div:last-child > ul, .volume-two-details dl { grid-template-columns: 1fr; }
	.volume-two-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.volume-two-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* Volume 3 detail page */
.volume-three-hero { overflow: hidden; padding: 68px 0 92px; background: var(--coral); }
.volume-three-hero__grid { display: grid; grid-template-columns: 1.02fr minmax(380px, 0.72fr); align-items: center; gap: 92px; }
.volume-three-hero h1 { max-width: 800px; font-size: clamp(60px, 6.3vw, 94px); }
.volume-three-hero h1 em { color: var(--cream); }
.volume-three-hero__answer { max-width: 700px; color: rgba(23, 39, 32, 0.78); font-size: 19px; }
.volume-three-hero__answer strong { color: var(--ink); }
.volume-three-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 17px 27px; margin-top: 32px; }
.volume-three-hero__note { max-width: 610px; margin: 25px 0 0; padding-top: 17px; border-top: 1px solid var(--ink); font-size: 11px; }
.volume-three-hero__preview { position: relative; margin: 0; }
.volume-three-hero__preview::before { content: "03"; position: absolute; z-index: 2; right: -38px; top: -38px; display: grid; place-items: center; width: 116px; height: 116px; border: 2px solid var(--ink); border-radius: 50%; background: var(--mint); font-family: var(--serif); font-size: 50px; }
.volume-three-hero__preview > div { padding: 16px; border: 2px solid var(--ink); background: var(--paper); box-shadow: 14px 14px 0 var(--ink); transform: rotate(1.5deg); }
.volume-three-hero__preview img { width: 100%; }
.volume-three-hero__preview figcaption { display: flex; justify-content: space-between; gap: 18px; padding-top: 20px; font-size: 9px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }

.volume-three-facts { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.volume-three-facts__grid { display: grid; grid-template-columns: repeat(5, 1fr); border-left: 1px solid var(--ink); }
.volume-three-facts__grid > div { display: flex; flex-direction: column; min-height: 115px; padding: 21px; border-right: 1px solid var(--ink); }
.volume-three-facts strong { font-family: var(--serif); font-size: 35px; font-weight: 500; line-height: 1; }
.volume-three-facts span { margin-top: auto; font-size: 9px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }

.volume-three-profile { background: var(--cream); }
.volume-three-profile__grid { display: grid; grid-template-columns: 0.78fr 1.22fr; gap: 90px; }
.volume-three-profile__grid > div:first-child { position: sticky; top: 35px; align-self: start; }
.volume-three-profile__grid > div:first-child > p:not(.kicker) { color: var(--ink-soft); font-size: 17px; }
.volume-three-profile__stats { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.volume-three-profile__stats article { display: flex; flex-direction: column; min-height: 305px; padding: 27px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.volume-three-profile__stats article:nth-child(2), .volume-three-profile__stats article:nth-child(3) { background: var(--coral); }
.volume-three-profile__stats article > span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; }
.volume-three-profile__stats article > strong { margin: 35px 0 18px; font-family: var(--serif); font-size: clamp(50px, 5vw, 75px); font-weight: 500; line-height: 1; }
.volume-three-profile__stats h3 { margin: auto 0 8px; font-size: 23px; }
.volume-three-profile__stats p { margin: 0; color: var(--ink-soft); font-size: 12px; }

.volume-three-preview { background: var(--paper); }
.volume-three-preview__grid { display: grid; grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr); align-items: center; gap: 24px; }
.volume-three-preview figure { margin: 0; }
.volume-three-preview figure > div { padding: 15px; border: 1px solid var(--ink); background: var(--cream); }
.volume-three-preview figure img { width: 100%; box-shadow: 0 18px 35px rgba(23, 39, 32, 0.12); }
.volume-three-preview figcaption { display: flex; justify-content: space-between; gap: 16px; padding-top: 15px; font-size: 9px; font-weight: 800; letter-spacing: 0.07em; text-transform: uppercase; }
.volume-three-preview__connector { text-align: center; }
.volume-three-preview__connector span { display: block; font-family: var(--serif); font-size: 66px; }
.volume-three-preview__connector small { font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.volume-three-preview__actions { display: flex; align-items: center; justify-content: space-between; gap: 35px; margin-top: 38px; padding-top: 28px; border-top: 1px solid var(--ink); }
.volume-three-preview__actions p { max-width: 500px; margin: 0; color: var(--ink-soft); font-size: 12px; text-align: right; }

.volume-three-themes { background: var(--ink); color: var(--cream); }
.volume-three-themes__grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 90px; }
.volume-three-themes h2 em { color: var(--coral); }
.volume-three-themes__grid > div > p:not(.kicker) { max-width: 520px; color: rgba(244, 239, 228, 0.74); font-size: 17px; }
.volume-three-themes__grid > ul { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 0; border-top: 1px solid rgba(244, 239, 228, 0.48); border-left: 1px solid rgba(244, 239, 228, 0.48); list-style: none; }
.volume-three-themes__grid li { display: grid; grid-template-columns: 35px 1fr; align-items: center; min-height: 82px; padding: 14px 18px; border-right: 1px solid rgba(244, 239, 228, 0.48); border-bottom: 1px solid rgba(244, 239, 228, 0.48); font-family: var(--serif); font-size: 19px; }
.volume-three-themes__grid li span { font-family: var(--sans); font-size: 9px; font-weight: 800; }

.volume-three-difficulty { background: var(--yellow); }
.volume-three-difficulty__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.volume-three-difficulty__grid article { display: flex; flex-direction: column; min-height: 365px; padding: 40px; border: 1px solid var(--ink); background: var(--paper); }
.volume-three-difficulty__grid article > span { align-self: flex-start; padding: 7px 10px; border: 1px solid var(--ink); font-family: var(--serif); font-size: 27px; }
.volume-three-difficulty__grid h3 { margin: auto 0 15px; font-size: 36px; }
.volume-three-difficulty__grid p { color: var(--ink-soft); }

.volume-three-inside { background: var(--mint-light); }
.volume-three-inside__grid { display: grid; grid-template-columns: 1fr 0.9fr; align-items: center; gap: 100px; }
.volume-three-page-map { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 12px 12px 0 var(--ink); }
.volume-three-page-map > div { display: flex; flex-direction: column; min-height: 210px; padding: 25px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); }
.volume-three-page-map > div:nth-child(2) { background: var(--coral); }
.volume-three-page-map > div:nth-child(3) { background: var(--yellow); }
.volume-three-page-map span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; }
.volume-three-page-map strong { margin: auto 0 8px; font-family: var(--serif); font-size: 25px; }
.volume-three-page-map small { color: var(--ink-soft); font-size: 11px; }
.volume-three-inside__grid > div:last-child > p:not(.kicker) { color: var(--ink-soft); font-size: 17px; }
.volume-three-inside__grid > div:last-child > ul { display: grid; grid-template-columns: repeat(3, 1fr); margin: 30px 0 0; padding: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); list-style: none; }
.volume-three-inside__grid > div:last-child > ul li { display: flex; flex-direction: column; min-height: 110px; padding: 16px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.volume-three-inside__grid > div:last-child > ul strong { font-family: var(--serif); font-size: 28px; font-weight: 500; }
.volume-three-inside__grid > div:last-child > ul span { margin-top: auto; font-size: 8px; font-weight: 800; text-transform: uppercase; }

.volume-three-details { background: var(--paper); }
.volume-three-details__grid { display: grid; grid-template-columns: 0.7fr 1.3fr; gap: 90px; }
.volume-three-details__grid > div > p:not(.kicker) { color: var(--ink-soft); font-size: 16px; }
.volume-three-details dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.volume-three-details dl > div { min-height: 92px; padding: 17px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.volume-three-details dt { margin-bottom: 9px; font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.volume-three-details dd { margin: 0; font-family: var(--serif); font-size: 18px; }

.volume-three-faq { background: var(--cream); }
.volume-three-faq__grid { display: grid; grid-template-columns: 0.65fr 1.35fr; gap: 100px; }
.volume-three-final { overflow: hidden; background: var(--yellow); }
.volume-three-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.volume-three-final__inner::after { content: "03"; position: absolute; right: -45px; bottom: -128px; color: rgba(23, 39, 32, 0.09); font-family: var(--serif); font-size: 380px; line-height: 1; }
.volume-three-final h2 { position: relative; z-index: 1; font-size: clamp(60px, 7vw, 100px); }
.volume-three-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.volume-three-hero__grid { gap: 55px; }
	.volume-three-profile__grid, .volume-three-themes__grid, .volume-three-inside__grid, .volume-three-details__grid, .volume-three-faq__grid { gap: 55px; }
	.volume-three-preview__grid { grid-template-columns: 1fr 70px 1fr; }
}

@media (max-width: 780px) {
	.volume-three-hero__grid, .volume-three-profile__grid, .volume-three-themes__grid, .volume-three-inside__grid, .volume-three-details__grid, .volume-three-faq__grid { grid-template-columns: 1fr; }
	.volume-three-hero__preview { max-width: 560px; }
	.volume-three-facts__grid { grid-template-columns: repeat(3, 1fr); }
	.volume-three-facts__grid > div:nth-child(n + 4) { border-top: 1px solid var(--ink); }
	.volume-three-profile__grid > div:first-child { position: static; }
	.volume-three-difficulty__grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.volume-three-hero { padding-top: 46px; }
	.volume-three-hero h1 { font-size: clamp(48px, 14vw, 70px); }
	.volume-three-hero__answer { font-size: 17px; }
	.volume-three-hero__actions { align-items: flex-start; flex-direction: column; }
	.volume-three-hero__preview::before { right: -5px; width: 88px; height: 88px; font-size: 38px; }
	.volume-three-facts__grid { grid-template-columns: 1fr 1fr; }
	.volume-three-facts__grid > div { min-height: 98px; border-top: 1px solid var(--ink); }
	.volume-three-facts__grid > div:first-child, .volume-three-facts__grid > div:nth-child(2) { border-top: 0; }
	.volume-three-facts__grid > div:last-child { grid-column: 1 / -1; }
	.volume-three-profile__stats { grid-template-columns: 1fr; }
	.volume-three-profile__stats article { min-height: 260px; }
	.volume-three-preview__grid { grid-template-columns: 1fr; gap: 38px; }
	.volume-three-preview__connector { transform: rotate(90deg); }
	.volume-three-preview__actions { align-items: flex-start; flex-direction: column; }
	.volume-three-preview__actions p { text-align: left; }
	.volume-three-themes__grid > ul { grid-template-columns: 1fr; }
	.volume-three-difficulty__grid article { min-height: 330px; padding: 30px 24px; }
	.volume-three-page-map { grid-template-columns: 1fr; }
	.volume-three-page-map > div { min-height: 165px; }
	.volume-three-inside__grid > div:last-child > ul, .volume-three-details dl { grid-template-columns: 1fr; }
	.volume-three-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.volume-three-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* About page */
.about-page-hero { overflow: hidden; padding: 78px 0 96px; background: var(--mint); }
.about-page-hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr); align-items: center; gap: 90px; }
.about-page-hero h1 { max-width: 760px; font-size: clamp(58px, 6.4vw, 94px); }
.about-page-hero h1 em { color: var(--coral); }
.about-page-hero__grid > div:first-child > p:not(.kicker) { max-width: 680px; color: var(--ink-soft); font-size: 19px; }
.about-page-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; margin-top: 34px; }
.about-page-hero__numbers { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 13px 13px 0 var(--ink); transform: rotate(1deg); }
.about-page-hero__numbers > div { display: flex; flex-direction: column; min-height: 175px; padding: 25px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); }
.about-page-hero__numbers > div:nth-child(2) { background: var(--yellow); }
.about-page-hero__numbers > div:nth-child(3) { background: var(--coral); }
.about-page-hero__numbers strong { font-family: var(--serif); font-size: clamp(42px, 4.2vw, 64px); font-weight: 500; line-height: 1; }
.about-page-hero__numbers span { max-width: 130px; margin-top: auto; font-size: 9px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }

.about-purpose { background: var(--paper); }
.about-purpose__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 110px; }
.about-purpose__grid > div:last-child { padding-top: 26px; border-top: 1px solid var(--ink); }
.about-purpose__grid > div:last-child p { color: var(--ink-soft); font-size: 18px; }
.about-purpose__grid > div:last-child p:first-child { margin-top: 0; }

.about-creator { background: var(--ink); color: var(--cream); }
.about-creator__grid { display: grid; grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.28fr); align-items: center; gap: 110px; }
.about-creator__mark { position: relative; display: grid; place-items: center; aspect-ratio: 1; border: 2px solid var(--cream); border-radius: 50%; background: var(--coral); color: var(--ink); box-shadow: 18px 18px 0 var(--mint); }
.about-creator__mark span { font-family: var(--serif); font-size: clamp(92px, 12vw, 170px); line-height: 1; }
.about-creator__mark small { position: absolute; bottom: 18%; padding: 7px 10px; border: 1px solid var(--ink); background: var(--yellow); font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.about-creator h2 em { color: var(--coral); }
.about-creator__grid > div:last-child > p:not(.kicker) { max-width: 670px; color: rgba(244, 239, 228, 0.74); font-size: 17px; }
.about-creator dl { display: grid; grid-template-columns: 1fr 1fr; margin: 36px 0 0; border-top: 1px solid rgba(244, 239, 228, 0.45); border-left: 1px solid rgba(244, 239, 228, 0.45); }
.about-creator dl > div { min-height: 92px; padding: 17px; border-right: 1px solid rgba(244, 239, 228, 0.45); border-bottom: 1px solid rgba(244, 239, 228, 0.45); }
.about-creator dt { margin-bottom: 8px; font-size: 8px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.about-creator dd { margin: 0; font-family: var(--serif); font-size: 20px; }

.about-principles { background: var(--cream); }
.about-principles__grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 50px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.about-principles__grid article { display: flex; flex-direction: column; min-height: 340px; padding: 30px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.about-principles__grid article:nth-child(2) { background: var(--yellow); }
.about-principles__grid article:nth-child(3) { background: var(--mint-light); }
.about-principles__grid article > span { font-family: var(--serif); font-size: 36px; }
.about-principles__grid h3 { margin: auto 0 13px; font-size: 29px; }
.about-principles__grid p { margin: 0; color: var(--ink-soft); }

.about-verification { background: var(--coral); }
.about-verification__grid { display: grid; grid-template-columns: 0.72fr 1.28fr; gap: 100px; }
.about-verification__grid > div > p:not(.kicker) { max-width: 520px; color: rgba(23, 39, 32, 0.75); font-size: 17px; }
.about-verification ol { margin: 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.about-verification li { display: grid; grid-template-columns: 68px 1fr; gap: 20px; padding: 24px 0; border-bottom: 1px solid var(--ink); }
.about-verification li > span { font-family: var(--serif); font-size: 32px; }
.about-verification h3 { margin: 2px 0 8px; font-size: 22px; }
.about-verification li p { margin: 0; color: rgba(23, 39, 32, 0.72); }

.about-transparency { background: var(--paper); }
.about-transparency__grid { display: grid; grid-template-columns: 0.78fr 1.22fr; gap: 100px; }
.about-transparency__grid > div > p:not(.kicker) { color: var(--ink-soft); font-size: 17px; }
.about-transparency ul { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 0; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); list-style: none; }
.about-transparency li { display: flex; flex-direction: column; min-height: 185px; padding: 23px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.about-transparency li strong { font-family: var(--serif); font-size: 21px; }
.about-transparency li span { margin-top: auto; color: var(--ink-soft); font-size: 12px; }

.about-timeline { background: var(--mint-light); }
.about-timeline__grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 52px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.about-timeline__grid article { display: flex; flex-direction: column; min-height: 375px; padding: 27px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.about-timeline__grid article:nth-child(2) { background: var(--yellow); }
.about-timeline__grid article:nth-child(3) { background: var(--coral); }
.about-timeline__grid article > span { font-size: 9px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.about-timeline__grid article > strong { margin: 30px 0 0; font-family: var(--serif); font-size: 72px; font-weight: 500; line-height: 1; }
.about-timeline__grid h3 { margin: auto 0 10px; font-size: 30px; }
.about-timeline__grid p { color: var(--ink-soft); }
.about-timeline__grid a { display: inline-flex; justify-content: space-between; gap: 18px; padding-top: 15px; border-top: 1px solid var(--ink); color: var(--ink); font-size: 10px; font-style: normal; font-weight: 800; letter-spacing: 0.07em; text-decoration: none; text-transform: uppercase; }

.about-faq { background: var(--cream); }
.about-faq__grid { display: grid; grid-template-columns: 0.62fr 1.38fr; gap: 100px; }
.about-final { overflow: hidden; background: var(--yellow); }
.about-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.about-final__inner::after { content: "TWS"; position: absolute; right: -65px; bottom: -95px; color: rgba(23, 39, 32, 0.08); font-family: var(--serif); font-size: clamp(190px, 25vw, 360px); line-height: 1; }
.about-final h2 { position: relative; z-index: 1; font-size: clamp(58px, 7vw, 100px); }
.about-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.about-page-hero__grid, .about-creator__grid, .about-purpose__grid, .about-verification__grid, .about-transparency__grid, .about-faq__grid { gap: 55px; }
}

@media (max-width: 780px) {
	.about-page-hero__grid, .about-purpose__grid, .about-creator__grid, .about-verification__grid, .about-transparency__grid, .about-faq__grid { grid-template-columns: 1fr; }
	.about-page-hero__numbers, .about-creator__mark { max-width: 560px; }
	.about-principles__grid, .about-timeline__grid { grid-template-columns: 1fr; }
	.about-principles__grid article { min-height: 260px; }
}

@media (max-width: 560px) {
	.about-page-hero { padding: 48px 0 75px; }
	.about-page-hero h1 { font-size: clamp(48px, 14vw, 68px); }
	.about-page-hero__actions { align-items: flex-start; flex-direction: column; }
	.about-page-hero__numbers { grid-template-columns: 1fr; transform: none; }
	.about-page-hero__numbers > div { min-height: 125px; }
	.about-creator__mark { box-shadow: 10px 10px 0 var(--mint); }
	.about-creator dl, .about-transparency ul { grid-template-columns: 1fr; }
	.about-verification li { grid-template-columns: 48px 1fr; }
	.about-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.about-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* Contact page */
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.contact-hero { overflow: hidden; padding: 76px 0 96px; background: var(--yellow); }
.contact-hero__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(360px, 0.9fr); align-items: center; gap: 95px; }
.contact-hero h1 { max-width: 800px; font-size: clamp(60px, 6.5vw, 96px); }
.contact-hero h1 em { color: var(--coral); }
.contact-hero__grid > div:first-child > p:not(.kicker) { max-width: 680px; color: var(--ink-soft); font-size: 19px; }
.contact-hero__grid > div:first-child > .button { margin-top: 26px; }
.contact-hero__topics { display: grid; grid-template-columns: 74px 1fr; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 13px 13px 0 var(--ink); transform: rotate(1deg); }
.contact-hero__topics > * { display: flex; align-items: center; min-height: 86px; padding: 18px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); }
.contact-hero__topics > span { justify-content: center; background: var(--mint); font-family: var(--serif); font-size: 27px; }
.contact-hero__topics > strong { font-family: var(--serif); font-size: 24px; font-weight: 500; }
.contact-hero__topics > strong:nth-of-type(2) { background: var(--coral); }
.contact-hero__topics > strong:nth-of-type(3) { background: var(--mint-light); }

.contact-main { background: var(--paper); }
.contact-main__grid { display: grid; grid-template-columns: minmax(280px, 0.68fr) minmax(0, 1.32fr); align-items: start; gap: 100px; }
.contact-main__intro { position: sticky; top: 35px; }
.contact-main__intro > p:not(.kicker) { color: var(--ink-soft); font-size: 16px; }
.contact-response-note { margin-top: 32px; padding: 22px; border: 1px solid var(--ink); background: var(--mint-light); }
.contact-response-note strong { font-family: var(--serif); font-size: 20px; }
.contact-response-note p { margin: 9px 0 0; color: var(--ink-soft); font-size: 12px; }
.contact-delivery { display: grid; grid-template-columns: 15px 1fr; gap: 13px; margin-top: 14px; padding: 17px; border: 1px solid var(--ink); }
.contact-delivery > span { width: 13px; height: 13px; margin-top: 3px; border: 1px solid var(--ink); border-radius: 50%; background: var(--coral); }
.contact-delivery--ready > span { background: var(--mint); }
.contact-delivery strong { font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; }
.contact-delivery p { margin: 4px 0 0; color: var(--ink-soft); font-size: 11px; }

.contact-form { position: relative; padding: 42px; border: 2px solid var(--ink); background: var(--cream); box-shadow: 14px 14px 0 var(--ink); }
.contact-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.contact-field { margin-bottom: 22px; }
.contact-field label { display: block; margin-bottom: 8px; font-size: 10px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.contact-field input, .contact-field select, .contact-field textarea { display: block; width: 100%; min-height: 52px; padding: 13px 14px; border: 1px solid var(--ink); border-radius: 0; background: var(--paper); color: var(--ink); font: 700 14px var(--sans); }
.contact-field textarea { min-height: 190px; resize: vertical; line-height: 1.55; }
.contact-field input:focus, .contact-field select:focus, .contact-field textarea:focus { outline: 3px solid var(--coral); outline-offset: 2px; }
.contact-field [aria-invalid="true"] { border-width: 2px; border-color: #a52d24; }
.contact-field small { display: block; margin-top: 7px; color: var(--ink-soft); font-size: 10px; }
.contact-field__error { display: block; margin-top: 7px; color: #8b201a; font-size: 11px; font-weight: 800; }
.contact-form__status { margin-bottom: 25px; padding: 19px 20px; border: 2px solid var(--ink); }
.contact-form__status--success { background: var(--mint); }
.contact-form__status--error { background: #ffd7ce; }
.contact-form__status strong { font-family: var(--serif); font-size: 21px; }
.contact-form__status p { margin: 7px 0 0; font-size: 12px; }
.contact-form__status ul { margin: 12px 0 0; padding-left: 18px; }
.contact-form__status a { color: var(--ink); font-size: 11px; font-weight: 800; }
.contact-form__submit { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 20px; padding-top: 24px; border-top: 1px solid var(--ink); }
.contact-form__submit .button { border: 0; cursor: pointer; white-space: nowrap; }
.contact-form__submit p { margin: 0; color: var(--ink-soft); font-size: 10px; }
.contact-form__submit a { color: var(--ink); font-weight: 800; }
.contact-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

.contact-guide { background: var(--mint-light); }
.contact-guide__grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 50px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.contact-guide__grid article { display: flex; flex-direction: column; min-height: 300px; padding: 28px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.contact-guide__grid article:nth-child(2) { background: var(--coral); }
.contact-guide__grid article:nth-child(3) { background: var(--yellow); }
.contact-guide__grid article > span { font-family: var(--serif); font-size: 34px; }
.contact-guide__grid h3 { margin: auto 0 12px; font-size: 27px; }
.contact-guide__grid p { margin: 0; color: var(--ink-soft); }

.contact-privacy { background: var(--ink); color: var(--cream); }
.contact-privacy__grid { display: grid; grid-template-columns: 0.78fr 1.22fr; gap: 100px; }
.contact-privacy h2 em { color: var(--coral); }
.contact-privacy__grid > div:last-child > p { margin-top: 0; color: rgba(244, 239, 228, 0.76); font-size: 17px; }
.contact-privacy ul { margin: 30px 0 0; padding: 0; border-top: 1px solid rgba(244, 239, 228, 0.4); list-style: none; }
.contact-privacy li { padding: 18px 0 18px 28px; border-bottom: 1px solid rgba(244, 239, 228, 0.4); position: relative; }
.contact-privacy li::before { content: "→"; position: absolute; left: 0; color: var(--coral); font-weight: 800; }

.contact-final { overflow: hidden; background: var(--mint); }
.contact-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.contact-final__inner::after { content: "@"; position: absolute; right: -15px; bottom: -140px; color: rgba(23, 39, 32, 0.09); font-family: var(--serif); font-size: 410px; line-height: 1; }
.contact-final h2 { position: relative; z-index: 1; font-size: clamp(58px, 7vw, 100px); }
.contact-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.contact-hero__grid, .contact-main__grid, .contact-privacy__grid { gap: 55px; }
	.contact-form { padding: 32px; }
}

@media (max-width: 780px) {
	.contact-hero__grid, .contact-main__grid, .contact-privacy__grid { grid-template-columns: 1fr; }
	.contact-hero__topics { max-width: 560px; transform: none; }
	.contact-main__intro { position: static; }
	.contact-guide__grid { grid-template-columns: 1fr; }
	.contact-guide__grid article { min-height: 235px; }
}

@media (max-width: 560px) {
	.contact-hero { padding: 48px 0 75px; }
	.contact-hero h1 { font-size: clamp(48px, 14vw, 68px); }
	.contact-hero__topics { grid-template-columns: 58px 1fr; box-shadow: 8px 8px 0 var(--ink); }
	.contact-hero__topics > * { min-height: 72px; padding: 13px; }
	.contact-hero__topics > strong { font-size: 20px; }
	.contact-form { padding: 25px 20px; box-shadow: 8px 8px 0 var(--ink); }
	.contact-form__row, .contact-form__submit { grid-template-columns: 1fr; }
	.contact-form__submit { align-items: start; }
	.contact-form__submit .button { justify-self: start; }
	.contact-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.contact-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* Privacy page */
.privacy-hero { overflow: hidden; padding: 76px 0 96px; background: var(--mint-light); }
.privacy-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(380px, 0.95fr); align-items: center; gap: 95px; }
.privacy-hero h1 { max-width: 780px; font-size: clamp(60px, 6.5vw, 96px); }
.privacy-hero h1 em { color: var(--coral); }
.privacy-hero__grid > div:first-child > p:not(.kicker) { max-width: 680px; color: var(--ink-soft); font-size: 19px; }
.privacy-hero__grid > div:first-child > .button { margin-top: 26px; }
.privacy-hero__summary { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 13px 13px 0 var(--ink); transform: rotate(1deg); }
.privacy-hero__summary > div { display: flex; flex-direction: column; min-height: 170px; padding: 24px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); }
.privacy-hero__summary > div:nth-child(2) { background: var(--yellow); }
.privacy-hero__summary > div:nth-child(3) { background: var(--coral); }
.privacy-hero__summary > div:nth-child(4) { background: var(--mint); }
.privacy-hero__summary strong { font-family: var(--serif); font-size: clamp(45px, 5vw, 68px); font-weight: 500; line-height: 1; }
.privacy-hero__summary span { max-width: 145px; margin-top: auto; font-size: 9px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }

.privacy-status { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--yellow); }
.privacy-status__inner { display: grid; grid-template-columns: 16px 1fr auto; align-items: center; gap: 18px; padding-top: 20px; padding-bottom: 20px; }
.privacy-status__inner > span { width: 15px; height: 15px; border: 1px solid var(--ink); border-radius: 50%; background: var(--coral); }
.privacy-status__inner strong { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; }
.privacy-status__inner p { margin: 3px 0 0; color: var(--ink-soft); font-size: 11px; }
.privacy-status__inner > a { color: var(--ink); font-size: 10px; font-weight: 800; letter-spacing: 0.06em; text-decoration: none; text-transform: uppercase; }

.privacy-main { background: var(--paper); }
.privacy-main__grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); align-items: start; gap: 105px; }
.privacy-index { position: sticky; top: 32px; padding: 25px; border: 1px solid var(--ink); background: var(--cream); box-shadow: 8px 8px 0 var(--ink); }
.privacy-index ol { margin: 0; padding: 0; counter-reset: privacy-index; list-style: none; }
.privacy-index li { counter-increment: privacy-index; border-top: 1px solid var(--line); }
.privacy-index a { display: grid; grid-template-columns: 26px 1fr; align-items: center; min-height: 46px; color: var(--ink); font-size: 11px; font-weight: 800; text-decoration: none; }
.privacy-index a::before { content: counter(privacy-index, decimal-leading-zero); font-family: var(--serif); font-size: 15px; font-weight: 500; }
.privacy-index a:hover, .privacy-index a:focus-visible { color: var(--coral-dark); }

.privacy-article { min-width: 0; }
.privacy-article > section { position: relative; padding: 0 0 82px; margin-bottom: 82px; border-bottom: 1px solid var(--ink); scroll-margin-top: 30px; }
.privacy-article > section:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.privacy-article__number { display: block; margin-bottom: 30px; font-family: var(--serif); font-size: 62px; line-height: 1; }
.privacy-article h2 { max-width: 760px; font-size: clamp(42px, 5vw, 70px); }
.privacy-article > section > p:not(.kicker) { max-width: 790px; color: var(--ink-soft); font-size: 16px; }
.privacy-article a { color: var(--ink); font-weight: 800; }
.privacy-callout { max-width: 790px; margin-top: 28px; padding: 22px; border: 1px solid var(--ink); background: var(--yellow); }
.privacy-callout strong { font-family: var(--serif); font-size: 21px; }
.privacy-callout p { margin: 8px 0 0; font-size: 12px; }

.privacy-data-grid { display: grid; grid-template-columns: 1fr 1fr; margin-top: 35px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.privacy-data-grid article { display: flex; flex-direction: column; min-height: 270px; padding: 25px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--cream); }
.privacy-data-grid article:nth-child(2) { background: var(--coral); }
.privacy-data-grid article:nth-child(3) { background: var(--mint-light); }
.privacy-data-grid article:nth-child(4) { background: var(--yellow); }
.privacy-data-grid article > span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.privacy-data-grid h3 { margin: 38px 0 12px; font-size: 25px; }
.privacy-data-grid p { margin: 0; color: var(--ink-soft); font-size: 12px; }
.privacy-data-grid small { margin-top: auto; padding-top: 20px; font-size: 9px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }

.privacy-purpose-list { margin: 35px 0 28px; border-top: 1px solid var(--ink); }
.privacy-purpose-list > div { display: grid; grid-template-columns: 0.48fr 1fr; gap: 35px; padding: 22px 0; border-bottom: 1px solid var(--ink); }
.privacy-purpose-list strong { font-family: var(--serif); font-size: 20px; }
.privacy-purpose-list p { margin: 0; color: var(--ink-soft); font-size: 13px; }

.privacy-table-wrap { max-width: 100%; margin: 35px 0 28px; overflow-x: auto; border: 1px solid var(--ink); }
.privacy-table-wrap:focus { outline: 3px solid var(--yellow); outline-offset: 3px; }
.privacy-table-wrap table { width: 100%; min-width: 720px; border-collapse: collapse; background: var(--paper); }
.privacy-table-wrap th, .privacy-table-wrap td { padding: 17px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); text-align: left; vertical-align: top; }
.privacy-table-wrap th:last-child, .privacy-table-wrap td:last-child { border-right: 0; }
.privacy-table-wrap tr:last-child td { border-bottom: 0; }
.privacy-table-wrap th { background: var(--ink); color: var(--cream); font-size: 9px; letter-spacing: 0.09em; text-transform: uppercase; }
.privacy-table-wrap td { color: var(--ink-soft); font-size: 12px; }

.privacy-check-list { max-width: 790px; margin: 30px 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.privacy-check-list li { position: relative; padding: 17px 0 17px 31px; border-bottom: 1px solid var(--ink); color: var(--ink-soft); }
.privacy-check-list li::before { content: "✓"; position: absolute; left: 3px; color: var(--coral-dark); font-weight: 800; }
.privacy-check-list strong { color: var(--ink); }

.privacy-retention { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 35px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.privacy-retention article { min-height: 245px; padding: 24px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.privacy-retention article:nth-child(2) { background: var(--mint-light); }
.privacy-retention article:nth-child(3) { background: var(--yellow); }
.privacy-retention strong { font-family: var(--serif); font-size: 21px; }
.privacy-retention p { margin: 70px 0 0; color: var(--ink-soft); font-size: 12px; }

.privacy-services { background: var(--mint-light); }
.privacy-services__grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 50px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.privacy-services__grid article { display: flex; flex-direction: column; min-height: 320px; padding: 28px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.privacy-services__grid article:nth-child(2) { background: var(--yellow); }
.privacy-services__grid article:nth-child(3) { background: var(--coral); }
.privacy-services__grid article > span { font-family: var(--serif); font-size: 34px; }
.privacy-services__grid h3 { margin: 34px 0 10px; font-size: 27px; }
.privacy-services__grid p { margin: 0; color: var(--ink-soft); }
.privacy-services__grid strong { align-self: flex-start; margin-top: auto; padding: 7px 10px; border: 1px solid var(--ink); font-size: 9px; letter-spacing: 0.09em; text-transform: uppercase; }

.privacy-final { overflow: hidden; background: var(--ink); color: var(--cream); }
.privacy-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.privacy-final__inner::after { content: "01"; position: absolute; right: -25px; bottom: -135px; color: rgba(244, 239, 228, 0.07); font-family: var(--serif); font-size: 390px; line-height: 1; }
.privacy-final h2 { position: relative; z-index: 1; font-size: clamp(58px, 7vw, 100px); }
.privacy-final h2 em { color: var(--coral); }
.privacy-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.privacy-hero__grid { gap: 55px; }
	.privacy-main__grid { grid-template-columns: 220px minmax(0, 1fr); gap: 55px; }
}

@media (max-width: 780px) {
	.privacy-hero__grid, .privacy-main__grid { grid-template-columns: 1fr; }
	.privacy-hero__summary { max-width: 560px; transform: none; }
	.privacy-status__inner { grid-template-columns: 16px 1fr; }
	.privacy-status__inner > a { grid-column: 2; }
	.privacy-index { position: static; box-shadow: 7px 7px 0 var(--ink); }
	.privacy-index ol { columns: 2; column-gap: 28px; }
	.privacy-index li { break-inside: avoid; }
	.privacy-retention, .privacy-services__grid { grid-template-columns: 1fr; }
	.privacy-retention article { min-height: 205px; }
	.privacy-retention p { margin-top: 40px; }
}

@media (max-width: 560px) {
	.privacy-hero { padding: 48px 0 75px; }
	.privacy-hero h1 { font-size: clamp(48px, 14vw, 68px); }
	.privacy-hero__summary { grid-template-columns: 1fr; box-shadow: 8px 8px 0 var(--ink); }
	.privacy-hero__summary > div { min-height: 125px; }
	.privacy-index ol { columns: 1; }
	.privacy-article > section { padding-bottom: 60px; margin-bottom: 60px; }
	.privacy-data-grid, .privacy-purpose-list > div { grid-template-columns: 1fr; }
	.privacy-purpose-list > div { gap: 8px; }
	.privacy-data-grid article { min-height: 235px; }
	.privacy-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.privacy-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* Terms page */
.terms-hero { overflow: hidden; padding: 76px 0 96px; background: var(--coral); }
.terms-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(380px, 0.95fr); align-items: center; gap: 95px; }
.terms-hero h1 { max-width: 780px; font-size: clamp(60px, 6.5vw, 96px); }
.terms-hero h1 em { color: var(--cream); }
.terms-hero__grid > div:first-child > p:not(.kicker) { max-width: 680px; color: rgba(23, 39, 32, 0.78); font-size: 19px; }
.terms-hero__grid > div:first-child > .button { margin-top: 26px; }
.terms-hero__facts { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 13px 13px 0 var(--ink); transform: rotate(1deg); }
.terms-hero__facts > div { display: flex; flex-direction: column; min-height: 170px; padding: 24px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); }
.terms-hero__facts > div:nth-child(2) { background: var(--mint); }
.terms-hero__facts > div:nth-child(3) { background: var(--yellow); }
.terms-hero__facts > div:nth-child(4) { background: var(--mint-light); }
.terms-hero__facts strong { font-family: var(--serif); font-size: clamp(45px, 5vw, 68px); font-weight: 500; line-height: 1; }
.terms-hero__facts span { max-width: 145px; margin-top: auto; font-size: 9px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }

.terms-status { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--yellow); }
.terms-status__inner { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 18px; padding-top: 20px; padding-bottom: 20px; }
.terms-status__inner > span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--ink); border-radius: 50%; background: var(--paper); font-family: var(--serif); font-size: 20px; }
.terms-status__inner strong { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; }
.terms-status__inner p { margin: 3px 0 0; color: var(--ink-soft); font-size: 11px; }
.terms-status__inner > a { color: var(--ink); font-size: 10px; font-weight: 800; letter-spacing: 0.06em; text-decoration: none; text-transform: uppercase; }

.terms-main { background: var(--paper); }
.terms-main__grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); align-items: start; gap: 105px; }
.terms-index { position: sticky; top: 32px; padding: 25px; border: 1px solid var(--ink); background: var(--cream); box-shadow: 8px 8px 0 var(--ink); }
.terms-index ol { margin: 0; padding: 0; counter-reset: terms-index; list-style: none; }
.terms-index li { counter-increment: terms-index; border-top: 1px solid var(--line); }
.terms-index a { display: grid; grid-template-columns: 26px 1fr; align-items: center; min-height: 46px; color: var(--ink); font-size: 11px; font-weight: 800; text-decoration: none; }
.terms-index a::before { content: counter(terms-index, decimal-leading-zero); font-family: var(--serif); font-size: 15px; font-weight: 500; }
.terms-index a:hover, .terms-index a:focus-visible { color: var(--coral-dark); }

.terms-article { min-width: 0; }
.terms-article > section { position: relative; padding: 0 0 82px; margin-bottom: 82px; border-bottom: 1px solid var(--ink); scroll-margin-top: 30px; }
.terms-article > section:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.terms-article__number { display: block; margin-bottom: 30px; font-family: var(--serif); font-size: 62px; line-height: 1; }
.terms-article h2 { max-width: 760px; font-size: clamp(42px, 5vw, 70px); }
.terms-article > section > p:not(.kicker) { max-width: 790px; color: var(--ink-soft); font-size: 16px; }
.terms-article a { color: var(--ink); font-weight: 800; }
.terms-callout { max-width: 790px; margin-top: 28px; padding: 22px; border: 1px solid var(--ink); background: var(--mint-light); }
.terms-callout--coral { background: var(--coral); }
.terms-callout strong { font-family: var(--serif); font-size: 21px; }
.terms-callout p { margin: 8px 0 0; font-size: 12px; }

.terms-service-grid { display: grid; grid-template-columns: 1fr 1fr; margin-top: 35px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.terms-service-grid article { display: flex; flex-direction: column; min-height: 250px; padding: 25px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--cream); }
.terms-service-grid article:nth-child(2) { background: var(--mint-light); }
.terms-service-grid article:nth-child(3) { background: var(--yellow); }
.terms-service-grid article:nth-child(4) { background: var(--coral); }
.terms-service-grid article > span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.terms-service-grid h3 { margin: auto 0 12px; font-size: 25px; }
.terms-service-grid p { margin: 0; color: var(--ink-soft); font-size: 12px; }

.terms-purchase-flow { display: grid; grid-template-columns: 1fr 40px 1fr 40px 1fr; align-items: center; margin: 35px 0; }
.terms-purchase-flow > div { display: flex; flex-direction: column; min-height: 190px; padding: 20px; border: 1px solid var(--ink); background: var(--mint-light); }
.terms-purchase-flow > div:nth-of-type(2) { background: var(--yellow); }
.terms-purchase-flow > div:nth-of-type(3) { background: var(--coral); }
.terms-purchase-flow div > span { font-family: var(--serif); font-size: 27px; }
.terms-purchase-flow strong { margin-top: auto; font-family: var(--serif); font-size: 21px; }
.terms-purchase-flow small { margin-top: 7px; color: var(--ink-soft); font-size: 9px; }
.terms-purchase-flow > i { font-family: var(--serif); font-size: 29px; font-style: normal; text-align: center; }

.terms-rule-list { max-width: 790px; margin: 30px 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.terms-rule-list li { display: grid; grid-template-columns: 48px 1fr; align-items: start; gap: 14px; padding: 17px 0; border-bottom: 1px solid var(--ink); }
.terms-rule-list span { font-family: var(--serif); font-size: 21px; }
.terms-rule-list p { margin: 3px 0 0; color: var(--ink-soft); }

.terms-launch { background: var(--cream); }
.terms-launch__grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 50px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.terms-launch__grid article { display: flex; flex-direction: column; min-height: 320px; padding: 28px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.terms-launch__grid article:nth-child(2) { background: var(--yellow); }
.terms-launch__grid article:nth-child(3) { background: var(--mint); }
.terms-launch__grid article > span { font-family: var(--serif); font-size: 34px; }
.terms-launch__grid h3 { margin: 34px 0 10px; font-size: 27px; }
.terms-launch__grid p { margin: 0; color: var(--ink-soft); }
.terms-launch__grid strong { align-self: flex-start; margin-top: auto; padding: 7px 10px; border: 1px solid var(--ink); font-size: 9px; letter-spacing: 0.09em; text-transform: uppercase; }

.terms-final { overflow: hidden; background: var(--ink); color: var(--cream); }
.terms-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.terms-final__inner::after { content: "T"; position: absolute; right: 5px; bottom: -150px; color: rgba(244, 239, 228, 0.07); font-family: var(--serif); font-size: 420px; line-height: 1; }
.terms-final h2 { position: relative; z-index: 1; font-size: clamp(58px, 7vw, 100px); }
.terms-final h2 em { color: var(--coral); }
.terms-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.terms-hero__grid { gap: 55px; }
	.terms-main__grid { grid-template-columns: 220px minmax(0, 1fr); gap: 55px; }
}

@media (max-width: 780px) {
	.terms-hero__grid, .terms-main__grid { grid-template-columns: 1fr; }
	.terms-hero__facts { max-width: 560px; transform: none; }
	.terms-status__inner { grid-template-columns: 34px 1fr; }
	.terms-status__inner > a { grid-column: 2; }
	.terms-index { position: static; box-shadow: 7px 7px 0 var(--ink); }
	.terms-index ol { columns: 2; column-gap: 28px; }
	.terms-index li { break-inside: avoid; }
	.terms-launch__grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.terms-hero { padding: 48px 0 75px; }
	.terms-hero h1 { font-size: clamp(48px, 14vw, 68px); }
	.terms-hero__facts { grid-template-columns: 1fr; box-shadow: 8px 8px 0 var(--ink); }
	.terms-hero__facts > div { min-height: 125px; }
	.terms-index ol { columns: 1; }
	.terms-article > section { padding-bottom: 60px; margin-bottom: 60px; }
	.terms-service-grid { grid-template-columns: 1fr; }
	.terms-service-grid article { min-height: 220px; }
	.terms-purchase-flow { grid-template-columns: 1fr; gap: 14px; }
	.terms-purchase-flow > i { transform: rotate(90deg); }
	.terms-purchase-flow > div { min-height: 160px; }
	.terms-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.terms-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* Affiliate disclosure page */
.affiliate-hero { overflow: hidden; padding: 76px 0 96px; background: var(--yellow); }
.affiliate-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(380px, 0.95fr); align-items: center; gap: 95px; }
.affiliate-hero h1 { max-width: 800px; font-size: clamp(60px, 6.5vw, 96px); }
.affiliate-hero h1 em { color: var(--coral); }
.affiliate-hero__grid > div:first-child > p:not(.kicker) { max-width: 690px; color: var(--ink-soft); font-size: 19px; }
.affiliate-hero__grid > div:first-child > .button { margin-top: 26px; }
.affiliate-hero__audit { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 13px 13px 0 var(--ink); transform: rotate(1deg); }
.affiliate-hero__audit > div { display: flex; flex-direction: column; min-height: 170px; padding: 24px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); }
.affiliate-hero__audit > div:nth-child(2) { background: var(--mint); }
.affiliate-hero__audit > div:nth-child(3) { background: var(--coral); }
.affiliate-hero__audit > div:nth-child(4) { background: var(--mint-light); }
.affiliate-hero__audit strong { font-family: var(--serif); font-size: clamp(45px, 5vw, 68px); font-weight: 500; line-height: 1; }
.affiliate-hero__audit span { max-width: 145px; margin-top: auto; font-size: 9px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }

.affiliate-status { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--mint); }
.affiliate-status__inner { display: grid; grid-template-columns: 16px 1fr auto; align-items: center; gap: 18px; padding-top: 20px; padding-bottom: 20px; }
.affiliate-status__inner > span { width: 15px; height: 15px; border: 1px solid var(--ink); border-radius: 50%; background: var(--coral); }
.affiliate-status__inner strong { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; }
.affiliate-status__inner p { margin: 3px 0 0; color: var(--ink-soft); font-size: 11px; }
.affiliate-status__inner > a { color: var(--ink); font-size: 10px; font-weight: 800; letter-spacing: 0.06em; text-decoration: none; text-transform: uppercase; }

.affiliate-main { background: var(--paper); }
.affiliate-main__grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); align-items: start; gap: 105px; }
.affiliate-index { position: sticky; top: 32px; padding: 25px; border: 1px solid var(--ink); background: var(--cream); box-shadow: 8px 8px 0 var(--ink); }
.affiliate-index ol { margin: 0; padding: 0; counter-reset: affiliate-index; list-style: none; }
.affiliate-index li { counter-increment: affiliate-index; border-top: 1px solid var(--line); }
.affiliate-index a { display: grid; grid-template-columns: 26px 1fr; align-items: center; min-height: 46px; color: var(--ink); font-size: 11px; font-weight: 800; text-decoration: none; }
.affiliate-index a::before { content: counter(affiliate-index, decimal-leading-zero); font-family: var(--serif); font-size: 15px; font-weight: 500; }
.affiliate-index a:hover, .affiliate-index a:focus-visible { color: var(--coral-dark); }

.affiliate-article { min-width: 0; }
.affiliate-article > section { position: relative; padding: 0 0 82px; margin-bottom: 82px; border-bottom: 1px solid var(--ink); scroll-margin-top: 30px; }
.affiliate-article > section:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.affiliate-article__number { display: block; margin-bottom: 30px; font-family: var(--serif); font-size: 62px; line-height: 1; }
.affiliate-article h2 { max-width: 780px; font-size: clamp(42px, 5vw, 70px); }
.affiliate-article > section > p:not(.kicker) { max-width: 790px; color: var(--ink-soft); font-size: 16px; }
.affiliate-article a { color: var(--ink); font-weight: 800; }
.affiliate-callout { max-width: 790px; margin-top: 28px; padding: 22px; border: 1px solid var(--ink); background: var(--yellow); }
.affiliate-callout strong { font-family: var(--serif); font-size: 21px; }
.affiliate-callout p { margin: 8px 0 0; font-size: 12px; }

.affiliate-interest-grid { display: grid; grid-template-columns: 1fr 1fr; margin-top: 35px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.affiliate-interest-grid article { display: flex; flex-direction: column; min-height: 250px; padding: 25px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--cream); }
.affiliate-interest-grid article:nth-child(2) { background: var(--coral); }
.affiliate-interest-grid article:nth-child(3) { background: var(--mint-light); }
.affiliate-interest-grid article:nth-child(4) { background: var(--yellow); }
.affiliate-interest-grid article > span { font-size: 9px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.affiliate-interest-grid h3 { margin: auto 0 12px; font-size: 25px; }
.affiliate-interest-grid p { margin: 0; color: var(--ink-soft); font-size: 12px; }

.affiliate-link-demo { display: grid; grid-template-columns: 1fr 40px 1fr 40px 1fr; align-items: center; margin: 35px 0; }
.affiliate-link-demo > div { display: flex; flex-direction: column; min-height: 150px; padding: 20px; border: 1px solid var(--ink); background: var(--mint-light); }
.affiliate-link-demo > div:nth-of-type(2) { background: var(--yellow); }
.affiliate-link-demo > div:nth-of-type(3) { background: var(--coral); }
.affiliate-link-demo span { font-size: 9px; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; }
.affiliate-link-demo strong { margin-top: auto; font-family: var(--serif); font-size: 20px; }
.affiliate-link-demo i { font-family: var(--serif); font-size: 29px; font-style: normal; text-align: center; }

.affiliate-checks { max-width: 790px; margin: 32px 0 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.affiliate-checks li { display: grid; grid-template-columns: 60px 1fr; gap: 18px; padding: 22px 0; border-bottom: 1px solid var(--ink); }
.affiliate-checks li > span { font-family: var(--serif); font-size: 28px; }
.affiliate-checks h3 { margin: 2px 0 7px; font-size: 21px; }
.affiliate-checks p { margin: 0; color: var(--ink-soft); font-size: 13px; }

.affiliate-rule-list { max-width: 790px; margin: 30px 0 0; padding: 0; border-top: 1px solid var(--ink); list-style: none; }
.affiliate-rule-list li { position: relative; padding: 17px 0 17px 31px; border-bottom: 1px solid var(--ink); color: var(--ink-soft); }
.affiliate-rule-list li::before { content: "✓"; position: absolute; left: 3px; color: var(--coral-dark); font-weight: 800; }

.affiliate-measure-grid { display: grid; grid-template-columns: 1fr 1fr; margin: 35px 0 28px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.affiliate-measure-grid article { min-height: 190px; padding: 23px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.affiliate-measure-grid article:nth-child(2) { background: var(--yellow); }
.affiliate-measure-grid article:nth-child(3) { background: var(--mint-light); }
.affiliate-measure-grid article:nth-child(4) { background: var(--coral); }
.affiliate-measure-grid strong { font-family: var(--serif); font-size: 23px; }
.affiliate-measure-grid p { margin: 55px 0 0; color: var(--ink-soft); font-size: 12px; }

.affiliate-launch { background: var(--mint-light); }
.affiliate-launch__grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 50px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.affiliate-launch__grid article { display: flex; flex-direction: column; min-height: 320px; padding: 28px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--paper); }
.affiliate-launch__grid article:nth-child(2) { background: var(--yellow); }
.affiliate-launch__grid article:nth-child(3) { background: var(--coral); }
.affiliate-launch__grid article > span { font-family: var(--serif); font-size: 34px; }
.affiliate-launch__grid h3 { margin: 34px 0 10px; font-size: 27px; }
.affiliate-launch__grid p { margin: 0; color: var(--ink-soft); }
.affiliate-launch__grid strong { align-self: flex-start; margin-top: auto; padding: 7px 10px; border: 1px solid var(--ink); font-size: 9px; letter-spacing: 0.09em; text-transform: uppercase; }

.affiliate-final { overflow: hidden; background: var(--ink); color: var(--cream); }
.affiliate-final__inner { position: relative; padding-top: 110px; padding-bottom: 110px; }
.affiliate-final__inner::after { content: "0%"; position: absolute; right: -25px; bottom: -120px; color: rgba(244, 239, 228, 0.07); font-family: var(--serif); font-size: 330px; line-height: 1; }
.affiliate-final h2 { position: relative; z-index: 1; font-size: clamp(58px, 7vw, 100px); }
.affiliate-final h2 em { color: var(--coral); }
.affiliate-final__inner > div { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; }

@media (max-width: 980px) {
	.affiliate-hero__grid { gap: 55px; }
	.affiliate-main__grid { grid-template-columns: 220px minmax(0, 1fr); gap: 55px; }
}

@media (max-width: 780px) {
	.affiliate-hero__grid, .affiliate-main__grid { grid-template-columns: 1fr; }
	.affiliate-hero__audit { max-width: 560px; transform: none; }
	.affiliate-status__inner { grid-template-columns: 16px 1fr; }
	.affiliate-status__inner > a { grid-column: 2; }
	.affiliate-index { position: static; box-shadow: 7px 7px 0 var(--ink); }
	.affiliate-index ol { columns: 2; column-gap: 28px; }
	.affiliate-index li { break-inside: avoid; }
	.affiliate-launch__grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.affiliate-hero { padding: 48px 0 75px; }
	.affiliate-hero h1 { font-size: clamp(48px, 14vw, 68px); }
	.affiliate-hero__audit { grid-template-columns: 1fr; box-shadow: 8px 8px 0 var(--ink); }
	.affiliate-hero__audit > div { min-height: 125px; }
	.affiliate-index ol { columns: 1; }
	.affiliate-article > section { padding-bottom: 60px; margin-bottom: 60px; }
	.affiliate-interest-grid, .affiliate-measure-grid { grid-template-columns: 1fr; }
	.affiliate-interest-grid article { min-height: 220px; }
	.affiliate-link-demo { grid-template-columns: 1fr; gap: 14px; }
	.affiliate-link-demo i { transform: rotate(90deg); }
	.affiliate-link-demo > div { min-height: 130px; }
	.affiliate-checks li { grid-template-columns: 48px 1fr; }
	.affiliate-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.affiliate-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* 404 page */
.not-found-hero { overflow: hidden; padding: 74px 0 96px; background: var(--coral); }
.not-found-hero__grid { display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(380px, 0.94fr); align-items: center; gap: 95px; }
.not-found-hero h1 { max-width: 820px; font-size: clamp(60px, 6.5vw, 96px); }
.not-found-hero h1 em { color: var(--cream); }
.not-found-hero__grid > div:first-child > p:not(.kicker) { max-width: 670px; color: rgba(23, 39, 32, 0.78); font-size: 19px; }
.not-found-hero__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; margin-top: 32px; }
.not-found-hero__number { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 2px solid var(--ink); border-left: 2px solid var(--ink); box-shadow: 13px 13px 0 var(--ink); transform: rotate(1deg); }
.not-found-hero__number > span { display: grid; place-items: center; min-height: 220px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: var(--paper); font-family: var(--serif); font-size: clamp(75px, 8vw, 118px); line-height: 1; }
.not-found-hero__number > span:nth-child(2) { background: var(--yellow); }
.not-found-hero__number > span:nth-child(3) { background: var(--mint); }
.not-found-hero__number small { position: absolute; right: 0; bottom: -39px; padding: 7px 10px; border: 2px solid var(--ink); background: var(--ink); color: var(--cream); font-size: 9px; font-weight: 800; letter-spacing: 0.14em; }

.not-found-routes { background: var(--paper); }
.not-found-routes__grid { display: grid; grid-template-columns: 1fr 1fr; margin-top: 50px; border-top: 1px solid var(--ink); border-left: 1px solid var(--ink); }
.not-found-routes__grid > a { display: grid; grid-template-columns: 55px 1fr 28px; align-items: center; gap: 16px; min-height: 155px; padding: 23px; border-right: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: var(--cream); color: var(--ink); text-decoration: none; }
.not-found-routes__grid > a:nth-child(2) { background: var(--yellow); }
.not-found-routes__grid > a:nth-child(3) { background: var(--mint-light); }
.not-found-routes__grid > a:nth-child(4) { background: var(--coral); }
.not-found-routes__grid > a:hover i, .not-found-routes__grid > a:focus-visible i { transform: translateX(6px); }
.not-found-routes__grid > a > span { font-family: var(--serif); font-size: 29px; }
.not-found-routes__grid h3 { margin: 0 0 6px; font-size: 25px; }
.not-found-routes__grid p { margin: 0; color: var(--ink-soft); font-size: 12px; }
.not-found-routes__grid i { font-family: var(--serif); font-size: 28px; font-style: normal; transition: transform 160ms ease; }

.not-found-help { background: var(--ink); color: var(--cream); }
.not-found-help__grid { display: grid; grid-template-columns: 0.82fr 1.18fr; align-items: center; gap: 100px; }
.not-found-help h2 em { color: var(--coral); }
.not-found-help__grid > div:first-child > p:not(.kicker) { max-width: 520px; color: rgba(244, 239, 228, 0.72); font-size: 16px; }
.not-found-help__grid > div:first-child > .button { margin-top: 24px; }
.not-found-help__steps { border-top: 1px solid rgba(244, 239, 228, 0.46); }
.not-found-help__steps > div { display: grid; grid-template-columns: 68px 1fr; gap: 20px; align-items: center; min-height: 112px; border-bottom: 1px solid rgba(244, 239, 228, 0.46); }
.not-found-help__steps strong { font-family: var(--serif); font-size: 31px; font-weight: 500; }
.not-found-help__steps p { margin: 0; color: rgba(244, 239, 228, 0.82); }

.not-found-final { overflow: hidden; background: var(--mint); }
.not-found-final__inner { position: relative; padding-top: 105px; padding-bottom: 105px; }
.not-found-final__inner::after { content: "404"; position: absolute; right: -40px; bottom: -120px; color: rgba(23, 39, 32, 0.08); font-family: var(--serif); font-size: 330px; line-height: 1; }
.not-found-final h2 { position: relative; z-index: 1; font-size: clamp(58px, 7vw, 100px); }
.not-found-final h2 em { color: var(--coral-dark); }
.not-found-final__inner > div { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 13px; }

@media (max-width: 980px) {
	.not-found-hero__grid, .not-found-help__grid { gap: 55px; }
	.not-found-hero__number > span { min-height: 180px; }
}

@media (max-width: 780px) {
	.not-found-hero__grid, .not-found-help__grid { grid-template-columns: 1fr; }
	.not-found-hero__number { max-width: 560px; transform: none; }
	.not-found-routes__grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
	.not-found-hero { padding: 48px 0 78px; }
	.not-found-hero h1 { font-size: clamp(48px, 14vw, 68px); }
	.not-found-hero__actions { align-items: flex-start; flex-direction: column; }
	.not-found-hero__number { box-shadow: 8px 8px 0 var(--ink); }
	.not-found-hero__number > span { min-height: 125px; font-size: 67px; }
	.not-found-routes__grid > a { grid-template-columns: 42px 1fr 24px; min-height: 140px; padding: 19px; }
	.not-found-help__steps > div { grid-template-columns: 50px 1fr; }
	.not-found-final__inner { padding-top: 82px; padding-bottom: 82px; }
	.not-found-final__inner > div { align-items: flex-start; flex-direction: column; }
}

/* First-party analytics consent */
.analytics-consent { position: fixed; z-index: 1000; right: 22px; bottom: 22px; left: 22px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 28px; max-width: 980px; margin: 0 auto; padding: 22px 24px; border: 2px solid var(--ink); background: var(--cream); box-shadow: 9px 9px 0 var(--ink); color: var(--ink); }
.analytics-consent[hidden] { display: none; }
.analytics-consent strong { display: block; margin-bottom: 5px; font-family: var(--serif); font-size: 25px; font-weight: 600; }
.analytics-consent p { max-width: 700px; margin: 0 0 6px; color: var(--ink-soft); font-size: 13px; line-height: 1.55; }
.analytics-consent a { color: var(--ink); font-size: 12px; font-weight: 800; text-underline-offset: 3px; }
.analytics-consent__actions { display: flex; align-items: center; gap: 10px; }
.analytics-consent__actions .button { min-height: 46px; padding: 12px 17px; white-space: nowrap; }
.analytics-consent__decline { border-color: var(--ink); background: transparent; color: var(--ink); }
.analytics-settings { position: fixed; z-index: 900; right: 14px; bottom: 12px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--ink); border-radius: 0; background: var(--paper); color: var(--ink); font: inherit; font-size: 10px; font-weight: 800; letter-spacing: 0.05em; cursor: pointer; }
.analytics-settings:hover, .analytics-settings:focus-visible { background: var(--yellow); }

@media (max-width: 700px) {
	.analytics-consent { right: 12px; bottom: 12px; left: 12px; grid-template-columns: 1fr; gap: 17px; padding: 19px; box-shadow: 6px 6px 0 var(--ink); }
	.analytics-consent__actions { align-items: stretch; flex-direction: column; }
	.analytics-consent__actions .button { width: 100%; }
}

/* Free puzzle studio */
.puzzle-studio { background: var(--cream); }
.puzzle-mode-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 28px; }
.puzzle-mode-switch button { display: flex; flex-direction: column; min-height: 142px; padding: 23px 25px; border: 2px solid var(--ink); border-radius: 0; background: var(--paper); color: var(--ink); text-align: left; cursor: pointer; }
.puzzle-mode-switch button:hover { background: var(--mint-light); }
.puzzle-mode-switch button[aria-selected="true"] { background: var(--yellow); box-shadow: inset 0 -7px 0 var(--coral); }
.puzzle-mode-switch span { font-size: 9px; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase; }
.puzzle-mode-switch strong { margin: auto 0 7px; font-family: var(--serif); font-size: clamp(24px, 2.6vw, 34px); font-weight: 600; }
.puzzle-mode-switch small { color: var(--ink-soft); font-size: 11px; }
.puzzle-mode-switch button:focus-visible, .puzzle-builder input:focus-visible, .puzzle-builder select:focus-visible, .puzzle-builder textarea:focus-visible, .puzzle-email-form input:focus-visible { outline: 4px solid var(--coral); outline-offset: 2px; }

.puzzle-builder { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-bottom: 30px; padding: 28px; border: 2px solid var(--ink); background: var(--paper); }
.puzzle-builder__field { display: flex; flex-direction: column; min-width: 0; }
.puzzle-builder__field--wide { grid-column: span 2; }
.puzzle-builder__field label, .puzzle-builder__words > label, .puzzle-builder__directions legend { margin-bottom: 8px; font-size: 10px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.puzzle-builder__field input, .puzzle-builder__field select, .puzzle-builder__words textarea { width: 100%; min-height: 48px; padding: 11px 12px; border: 1px solid var(--ink); border-radius: 0; background: var(--cream); color: var(--ink); font: inherit; }
.puzzle-builder__field small, .puzzle-builder__words small { margin-top: 7px; color: var(--ink-soft); font-size: 10px; line-height: 1.45; }
.puzzle-builder__directions { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: 10px 22px; margin: 0; padding: 18px; border: 1px solid var(--ink); }
.puzzle-builder__directions legend { padding: 0 7px; }
.puzzle-builder__directions label { display: flex; align-items: center; gap: 8px; min-height: 44px; font-size: 12px; font-weight: 800; cursor: pointer; }
.puzzle-builder__directions input, .puzzle-check input { width: 20px; height: 20px; accent-color: var(--coral-dark); }
.puzzle-builder__directions span { font-family: var(--serif); font-size: 22px; }
.puzzle-builder__words { grid-column: 1 / -1; display: flex; flex-direction: column; }
.puzzle-builder__words[hidden] { display: none; }
.puzzle-builder__words textarea { min-height: 180px; resize: vertical; }
.puzzle-builder__action { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: 16px 24px; padding-top: 4px; }
.puzzle-builder__action p { margin: 0; color: var(--ink-soft); font-size: 12px; }
.puzzle-preview { scroll-margin-top: 25px; }
.puzzle-preview .sample-board { grid-template-columns: repeat(var(--puzzle-size, 15), minmax(0, 1fr)); }

.puzzle-email-card { display: grid; grid-template-columns: minmax(0, 0.78fr) minmax(420px, 1.22fr); gap: 60px; margin-top: 72px; padding: 46px; border: 2px solid var(--ink); background: var(--yellow); box-shadow: 12px 12px 0 var(--ink); }
.puzzle-email-card__intro h2 { font-size: clamp(43px, 4.7vw, 68px); }
.puzzle-email-card__intro > p:not(.kicker) { color: var(--ink-soft); font-size: 15px; }
.puzzle-delivery { display: grid; grid-template-columns: 13px 1fr; gap: 12px; margin-top: 27px; padding: 17px; border: 1px solid var(--ink); background: var(--paper); }
.puzzle-delivery > span { width: 13px; height: 13px; margin-top: 3px; border: 1px solid var(--ink); border-radius: 50%; background: var(--coral); }
.puzzle-delivery--ready > span { background: var(--mint); }
.puzzle-delivery strong { font-family: var(--serif); font-size: 19px; }
.puzzle-delivery p { margin: 4px 0 0; color: var(--ink-soft); font-size: 11px; }
.puzzle-email-form { padding: 28px; border: 1px solid var(--ink); background: var(--paper); }
.puzzle-email-form .puzzle-builder__field { margin-bottom: 17px; }
.puzzle-check { display: grid; grid-template-columns: 24px 1fr; align-items: start; gap: 12px; margin-top: 12px; padding: 16px; border: 1px solid var(--line); background: var(--cream); cursor: pointer; }
.puzzle-check[hidden] { display: none; }
.puzzle-check input { margin: 1px 0 0; }
.puzzle-check span { display: flex; flex-direction: column; gap: 5px; }
.puzzle-check strong { font-size: 12px; line-height: 1.45; }
.puzzle-check small { color: var(--ink-soft); font-size: 10px; line-height: 1.5; }
.puzzle-check--required { border-color: var(--ink); }
.puzzle-email-form__submit { display: flex; align-items: flex-start; flex-direction: column; gap: 12px; margin-top: 21px; }
.puzzle-email-form__submit p { margin: 0; color: var(--ink-soft); font-size: 10px; line-height: 1.5; }
.puzzle-email-form__submit a { color: var(--ink); font-weight: 800; }
.puzzle-email-form__submit button:disabled { cursor: wait; opacity: 0.6; }
.puzzle-email-form__submit button[aria-disabled="true"] { cursor: not-allowed; }
.puzzle-email-form__status { margin-top: 17px; padding: 14px; border: 1px solid var(--ink); background: var(--cream); font-size: 12px; font-weight: 800; }
.puzzle-email-form__status--success { background: var(--mint-light); }
.puzzle-email-form__status--error { background: #ffe3dc; color: var(--coral-dark); }

@media (max-width: 980px) {
	.puzzle-builder { grid-template-columns: 1fr 1fr; }
	.puzzle-email-card { grid-template-columns: 1fr; gap: 35px; }
}

@media (max-width: 700px) {
	.puzzle-mode-switch, .puzzle-builder { grid-template-columns: 1fr; }
	.puzzle-builder__field--wide, .puzzle-builder__directions, .puzzle-builder__words, .puzzle-builder__action { grid-column: 1; }
	.puzzle-builder { padding: 19px; }
	.puzzle-builder__directions { align-items: flex-start; flex-direction: column; }
	.puzzle-email-card { margin-top: 50px; padding: 24px; box-shadow: 8px 8px 0 var(--ink); }
	.puzzle-email-form { padding: 20px; }
}

/* Free puzzle confirmation and unsubscribe */
.confirmation-page { min-height: 64vh; display: grid; align-items: center; padding: 92px 0; background: var(--yellow); }
.confirmation-page--success { background: var(--mint-light); }
.confirmation-page--limited { background: var(--coral); }
.confirmation-page__inner { max-width: 940px; }
.confirmation-page h1 { max-width: 850px; font-size: clamp(54px, 7vw, 96px); }
.confirmation-page__inner > p:not(.kicker) { max-width: 680px; color: var(--ink-soft); font-size: 18px; }
.confirmation-page__inner > div { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 28px; margin-top: 30px; }

@media (max-width: 560px) {
	.confirmation-page { padding: 72px 0; }
	.confirmation-page h1 { font-size: clamp(46px, 14vw, 65px); }
	.confirmation-page__inner > div { align-items: flex-start; flex-direction: column; }
}
