/* ==========================================================================
   The Art of Aleph — theme styles
   Mobile first. Colours, fonts and sizes come from theme.json variables.
   ========================================================================== */

:root {
	--paper: var(--wp--preset--color--paper);
	--paper-deep: var(--wp--preset--color--paper-deep);
	--ink: var(--wp--preset--color--ink);
	--ink-soft: var(--wp--preset--color--ink-soft);
	--teal: var(--wp--preset--color--teal);
	--lilac: var(--wp--preset--color--lilac);
	--serif: var(--wp--preset--font-family--serif);
	--radius-organic: 26px 34px 28px 32px;
	--ease-story: cubic-bezier(.6, .05, .28, 1);
	/* Paper grain: a tiny SVG noise tile (about 0.4 KB), no image download. */
	--grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .38 0 0 0 0 .3 0 0 0 0 .2 .3 0 0 0 -.1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
::selection { background: var(--lilac); color: var(--ink); }

/* ---------- Inside the book ----------
 * The cover opens to the left (see the intro), so we are on the right-hand page.
 * Phones: the screen is the page; a soft binding shadow on the left, page edges
 * on the right, and the ribbon bookmark in the binding.
 * Laptops and up (960px+): the page becomes a sheet of paper 25px wider than the
 * content on each side, lying on the dark desk. On its left is the open cover
 * (with the binding and the ribbon at the fold); on its right the stacked
 * edges of the pages. Everything is CSS, nothing extra to download. */
:root {
	--cover: #22404f;
	--sheet-w: 100%;
	--ribbon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 520' preserveAspectRatio='none'%3E%3Cpath d='M4.6 0 L5.3 20 L5.6 40 L5.6 60 L5.4 80 L5.2 100 L5.0 120 L5.0 140 L5.2 160 L5.5 180 L5.8 200 L6.0 220 L6.0 240 L5.7 260 L5.0 280 L4.1 300 L3.1 320 L2.2 340 L1.5 360 L1.2 380 L1.2 400 L1.5 420 L1.9 440 L2.4 460 L2.7 480 L2.9 500 L2.9 504 L2.9 518 L7.1 505 L11.3 518 L11.3 504 L11.3 500 L11.1 480 L10.8 460 L10.3 440 L9.9 420 L9.6 400 L9.6 380 L9.9 360 L10.6 340 L11.5 320 L12.5 300 L13.4 280 L14.1 260 L14.4 240 L14.4 220 L14.2 200 L13.9 180 L13.6 160 L13.4 140 L13.4 120 L13.6 100 L13.8 80 L14.0 60 L14.0 40 L13.7 20 L13.0 0Z' fill='%23b0313a'/%3E%3Cpath d='M11.4 0 L12.1 20 L12.4 40 L12.4 60 L12.2 80 L12.0 100 L11.8 120 L11.8 140 L12.0 160 L12.3 180 L12.6 200 L12.8 220 L12.8 240 L12.5 260 L11.8 280 L10.9 300 L9.9 320 L9.0 340 L8.3 360 L8.0 380 L8.0 400 L8.3 420 L8.7 440 L9.2 460 L9.5 480 L9.7 500 L9.7 504 L9.7 515 L11.3 518 L11.3 504 L11.3 500 L11.1 480 L10.8 460 L10.3 440 L9.9 420 L9.6 400 L9.6 380 L9.9 360 L10.6 340 L11.5 320 L12.5 300 L13.4 280 L14.1 260 L14.4 240 L14.4 220 L14.2 200 L13.9 180 L13.6 160 L13.4 140 L13.4 120 L13.6 100 L13.8 80 L14.0 60 L14.0 40 L13.7 20 L13.0 0Z' fill='%2386242b'/%3E%3C/svg%3E");
}
body { background-image: var(--grain); }
body .aleph-section--tint, body .book-intro__page { background-image: var(--grain); }
body::before, body::after {
	content: "";
	position: fixed;
	top: 0;
	bottom: 0;
	z-index: 60;
	pointer-events: none;
}
body::before { /* binding / gutter */
	left: 0;
	width: 22px;
	background: linear-gradient(to right, rgba(25, 46, 58, .16), rgba(25, 46, 58, .05) 45%, transparent);
}
body::after { /* fore-edge: thin stacked pages */
	right: 0;
	width: 7px;
	background:
		linear-gradient(to right, rgba(25, 46, 58, .14), transparent 70%),
		repeating-linear-gradient(to right, #d8cbb5 0 1px, #f4efe4 1px 3px);
	box-shadow: -1px 0 0 rgba(25, 46, 58, .12), inset -1px 0 0 rgba(25, 46, 58, .18);
}
.aleph-intro body::before, .aleph-intro body::after { opacity: 0; }

/* The ribbon bookmark: hangs from the top of the book down the binding, gently wavy. */
.wp-site-blocks { position: relative; }
.wp-site-blocks::before {
	content: "";
	position: absolute;
	z-index: 61;
	top: -6px;
	left: 3px;
	width: 13px;
	height: min(520px, 62vh);
	background: var(--ribbon) no-repeat 0 0 / 100% 100%;
	filter: drop-shadow(1px 2px 1.5px rgba(25, 46, 58, .28));
	pointer-events: none;
}

@media (min-width: 960px) {
	:root { --sheet-w: min(1230px, 100vw - 7rem); }
	html { scrollbar-gutter: stable; }
	html body { position: relative; background-color: var(--ink); background-image: none; }

	/* The page: paper, with the fold shadow along its left edge */
	.wp-site-blocks {
		width: var(--sheet-w);
		margin: 1.25rem auto 0;
		background-color: var(--paper);
		background-image: linear-gradient(to right, rgba(25, 46, 58, .2), rgba(25, 46, 58, .06) 12px, transparent 26px), var(--grain);
		box-shadow: 0 30px 70px -30px rgba(0, 0, 0, .65);
		--wp--style--root--padding-left: 25px;
		--wp--style--root--padding-right: 25px;
	}
	.wp-site-blocks::before { left: 5px; width: 14px; height: min(600px, 70vh); top: -10px; }
	/* Right: the stacked edges of the pages underneath */
	.wp-site-blocks::after {
		content: "";
		position: absolute;
		z-index: 0;
		top: 6px;
		bottom: 0;
		right: -10px;
		width: 10px;
		border-radius: 0 3px 0 0;
		background:
			linear-gradient(to right, rgba(25, 46, 58, .22), transparent 80%),
			repeating-linear-gradient(to right, #d8cbb5 0 1px, #f4efe4 1px 3px);
		pointer-events: none;
	}
	.aleph-footer { z-index: 1; box-shadow: 12px 0 0 var(--ink); }

	/* Left: the open cover lying flat, its inner frame, and the dark fold at the spine */
	html body::before {
		position: absolute;
		z-index: 0;
		top: .6rem;
		bottom: 0;
		left: auto;
		right: calc(50% + var(--sheet-w) / 2);
		width: var(--sheet-w);
		border-radius: 12px 0 0 0;
		background: var(--cover);
		box-shadow:
			inset -30px 0 28px -22px rgba(0, 0, 0, .55),
			inset 0 0 0 26px var(--cover),
			inset 0 0 0 27.5px rgba(229, 221, 237, .32);
	}
	html body::after { display: none; }
}

@view-transition { navigation: auto; }
::view-transition-old(root) { animation: page-turn-out .5s var(--ease-story) both; transform-origin: left center; }
::view-transition-new(root) { animation: page-turn-in .35s ease .15s both; }
@keyframes page-turn-out { to { transform: perspective(1800px) rotateY(-28deg); opacity: 0; } }
@keyframes page-turn-in { from { opacity: 0; } }
/* The header stays put while the page underneath turns. */
.aleph-header { view-transition-name: aleph-header; }
::view-transition-group(aleph-header), ::view-transition-old(aleph-header), ::view-transition-new(aleph-header) { animation: none; }
@media (prefers-reduced-motion: reduce) {
	::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--teal);
	outline-offset: 3px;
	border-radius: 4px;
}

.aleph-main { padding-block: var(--wp--preset--spacing--50); }
.aleph-main--home { padding-block: 0; }
.aleph-main--flush { padding-top: 0; }
.aleph-article { padding-top: var(--wp--preset--spacing--50); }
.aleph-article .wp-block-post-content { max-width: 68ch; }

.aleph-kicker {
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--teal);
	font-weight: 500;
	margin-bottom: .25rem;
}
.aleph-kicker a { color: inherit; text-decoration: none; }
.aleph-lead { font-size: var(--wp--preset--font-size--lead); color: var(--ink-soft); }
.aleph-page-title { margin-bottom: .5rem; }

/* Outline button */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--ink);
	border: 1.5px solid var(--ink);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--ink); color: var(--paper); }
.wp-block-button__link { min-height: 44px; display: inline-flex; align-items: center; transition: background-color .2s, color .2s, transform .2s; }
.wp-block-button__link:hover { transform: translateY(-1px); }

/* ---------- Header ---------- */
/* The name and menu sit on a lavender band whose bottom edge waves into the page,
 * like the lavender band that waves into the footer at the bottom. */
.aleph-header {
	position: relative;
	z-index: 5;
	padding-block: .9rem;
	background-color: var(--lilac);
	background-image: var(--grain);
}
.aleph-header::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -17px;
	height: 18px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 24' preserveAspectRatio='none'%3E%3Cpath d='M0 0v12c140 9 250-7 380-1s220 11 340 3 220-12 330-5 110 6 150 3V0z' fill='%23E5DDED'/%3E%3C/svg%3E") no-repeat 0 0 / 100% 100%;
	pointer-events: none;
}
.aleph-brand { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 600; font-size: 1.3rem; line-height: 1; }
.aleph-brand a { color: var(--ink); text-decoration: none; }
.aleph-nav { font-size: 1rem; font-weight: 500; }
.aleph-nav .wp-block-navigation-item__content { text-decoration: none; padding: .5rem .15rem; min-height: 44px; display: inline-flex; align-items: center; }
.aleph-nav .wp-block-navigation-item__content:hover { color: var(--teal); }
.aleph-nav__cta .wp-block-navigation-item__content {
	border: 1.5px solid var(--ink);
	border-radius: 999px;
	padding-inline: 1rem !important;
}
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3rem; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: var(--serif); font-size: 1.6rem; }

/* ---------- Mobile menu: a little storybook contents page ----------
 * Lavender page, chapters numbered i, ii, iii, links slide in one after another,
 * a twinkling star and the tagline at the bottom. */
.aleph-header .wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--lilac) !important;
	background-image: radial-gradient(circle at 88% 92%, rgba(255, 255, 255, .6), transparent 45%), var(--grain);
	padding: 1.25rem 1.5rem 2rem 2.25rem;
}
.is-menu-open .wp-block-navigation__responsive-close { max-width: none; }
.is-menu-open .wp-block-navigation__responsive-container-close { color: var(--ink); }
.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start !important; padding-top: 4rem !important; }
.is-menu-open .wp-block-navigation__container { align-items: flex-start !important; gap: .35rem !important; counter-reset: chapter; }
.is-menu-open .wp-block-navigation-item {
	counter-increment: chapter;
	opacity: 0;
	translate: -16px 0;
	animation: menu-in .55s var(--ease-story) forwards;
}
.is-menu-open .wp-block-navigation-item:nth-child(1) { animation-delay: .05s; }
.is-menu-open .wp-block-navigation-item:nth-child(2) { animation-delay: .12s; }
.is-menu-open .wp-block-navigation-item:nth-child(3) { animation-delay: .19s; }
.is-menu-open .wp-block-navigation-item:nth-child(4) { animation-delay: .26s; }
.is-menu-open .wp-block-navigation-item:nth-child(5) { animation-delay: .36s; }
@keyframes menu-in { to { opacity: 1; translate: 0 0; } }
.is-menu-open .wp-block-navigation-item:not(.aleph-nav__cta) .wp-block-navigation-item__content { font-size: 2.2rem !important; font-style: italic; color: var(--ink); }
.is-menu-open .wp-block-navigation-item:not(.aleph-nav__cta) .wp-block-navigation-item__content::before {
	content: counter(chapter, lower-roman) ".";
	display: inline-block;
	width: 2.4rem;
	font-family: var(--serif);
	font-size: 1rem;
	color: var(--teal);
}
.is-menu-open .wp-block-navigation-item__label {
	text-decoration: underline wavy transparent;
	text-decoration-thickness: 1.5px;
	text-underline-offset: 7px;
	transition: text-decoration-color .25s;
}
.is-menu-open .wp-block-navigation-item__content:hover .wp-block-navigation-item__label,
.is-menu-open .wp-block-navigation-item__content:focus-visible .wp-block-navigation-item__label,
.is-menu-open .current-menu-item .wp-block-navigation-item__label { text-decoration-color: var(--teal); }
.is-menu-open .aleph-nav__cta { margin-top: 1.4rem; }
.is-menu-open .aleph-nav__cta .wp-block-navigation-item__content {
	background: var(--ink);
	border-color: var(--ink) !important;
	color: var(--paper) !important;
	font-family: inherit;
	font-size: 1.05rem !important;
	padding: .7rem 1.5rem !important;
}
.aleph-header .is-menu-open::before {
	content: "\2726";
	position: absolute;
	top: 11rem;
	right: 2.6rem;
	font-size: 1.9rem;
	line-height: 1;
	color: var(--teal);
	animation: twinkle 3.5s ease-in-out infinite;
}
.aleph-header .is-menu-open::after {
	content: "\2727  Small stories. Extraordinary worlds.";
	position: absolute;
	left: 2.25rem;
	right: 1.5rem;
	bottom: 2.2rem;
	font-family: var(--serif);
	font-style: italic;
	font-size: 1.05rem;
	color: var(--ink-soft);
}
@media (prefers-reduced-motion: reduce) {
	.is-menu-open .wp-block-navigation-item { opacity: 1; translate: none; }
}

/* ---------- Hero ---------- */
.aleph-hero { padding-block: calc(var(--wp--preset--spacing--30) + 18px) var(--wp--preset--spacing--50); }
.aleph-hero__cols { gap: var(--wp--preset--spacing--40); }
.aleph-hero__title { margin-top: .25rem; }
.aleph-hero__title em { font-style: italic; font-weight: 400; color: var(--teal); }
.aleph-hero .wp-block-buttons { margin-top: 1.5rem; }

.scene {
	position: relative;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	border-radius: var(--radius-organic);
	background: var(--lilac);
	box-shadow: 0 1px 0 rgba(25, 46, 58, .08), 0 18px 40px -24px rgba(25, 46, 58, .45);
	isolation: isolate;
}
.scene__layer {
	position: absolute;
	inset: -6% -3%;
	width: 106%;
	height: 112%;
	max-width: none;
	object-fit: cover;
	will-change: transform;
	pointer-events: none;
}
.scene__placeholder {
	position: absolute;
	left: .75rem;
	bottom: .6rem;
	z-index: 2;
	font-size: .75rem;
	background: rgba(247, 243, 235, .9);
	color: var(--ink);
	padding: .2rem .55rem;
	border-radius: 999px;
}

/* Hero with a single finished illustration (Elif's artwork) */
.scene--art { aspect-ratio: 1 / 1; background: #12303a; }
@media (min-width: 782px) { .scene--art { aspect-ratio: 10 / 11; } }
.scene__art { inset: -5% 0; width: 100%; height: 110%; object-fit: cover; object-position: 50% 60%; }
.aleph-awake .scene__art { transition: scale 1.8s var(--ease-story); }
.aleph-intro:not(.aleph-awake) .scene__art { scale: 1.12; }
.scene__fireflies { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.scene__fireflies i { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: radial-gradient(circle, #fffbe6 0, rgba(255, 251, 230, .6) 40%, transparent 70%); box-shadow: 0 0 10px 3px rgba(255, 248, 214, .4); opacity: 0; animation: firefly 7s ease-in-out infinite; }
.scene__fireflies i:nth-child(1) { left: 30%; top: 22%; animation-delay: 0s; }
.scene__fireflies i:nth-child(2) { left: 58%; top: 14%; animation-delay: 1.6s; animation-duration: 8s; }
.scene__fireflies i:nth-child(3) { left: 70%; top: 34%; animation-delay: 3.1s; }
.scene__fireflies i:nth-child(4) { left: 22%; top: 48%; animation-delay: 4.4s; animation-duration: 9s; }
.scene__fireflies i:nth-child(5) { left: 47%; top: 30%; animation-delay: 2.3s; width: 4px; height: 4px; }
.scene__fireflies i:nth-child(6) { left: 80%; top: 58%; animation-delay: 5.2s; width: 4px; height: 4px; }
@keyframes firefly { 0% { opacity: 0; transform: translate(0, 0); } 20% { opacity: .9; } 55% { transform: translate(8px, -14px); } 80% { opacity: .6; } 100% { opacity: 0; transform: translate(-6px, -26px); } }
.aleph-about__portrait { overflow: hidden; }
.aleph-about__portrait img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; display: block; }

/* ---------- Sections ---------- */
.aleph-section { padding-block: var(--wp--preset--spacing--60); }
.aleph-section--tint { background: var(--paper-deep); }
.aleph-section__title { margin-top: 0; }
.aleph-section__note { color: var(--ink-soft); }

.aleph-families { gap: 1rem; }
.aleph-family {
	background: var(--wp--preset--color--white);
	padding: 1.5rem;
	border-radius: 18px;
	border: 1px solid rgba(25, 46, 58, .08);
	transition: transform .25s ease, box-shadow .25s ease;
}
.aleph-family h3 { margin-top: 0; }
.aleph-family h3 a { color: var(--ink); text-decoration: none; }
.aleph-family:not(.aleph-family--soon):hover { transform: translateY(-3px); box-shadow: 0 14px 30px -22px rgba(25, 46, 58, .5); }
.aleph-family__link a { font-weight: 500; text-decoration: none; }
.aleph-family--soon { background: transparent; border-style: dashed; border-color: rgba(25, 46, 58, .25); }
.aleph-badge {
	display: inline-block;
	font-size: .8rem;
	font-weight: 500;
	background: var(--lilac);
	padding: .15rem .6rem;
	border-radius: 999px;
	margin: 0 0 .5rem;
}

/* Product cards (from the Aleph Shop Cards plugin) */
.aleph-products {
	list-style: none;
	padding: 0;
	margin: 1.5rem 0 2.75rem;
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 559px) {
	.aleph-products { gap: .75rem; }
	.aleph-product__link { padding: .5rem .5rem .8rem; border-radius: 14px; gap: .25rem; }
	.aleph-product__img { border-radius: 10px; margin-bottom: .25rem; }
	.aleph-product__type { font-size: .72rem; line-height: 1.3; padding-inline: .15rem; }
	.aleph-product__title { font-size: 1rem; padding-inline: .15rem; }
	.aleph-product__cta { font-size: .85rem; padding-inline: .15rem; }
}
@media (min-width: 960px) { .aleph-products { grid-template-columns: repeat(3, 1fr); } }
.aleph-product__link {
	display: flex;
	flex-direction: column;
	gap: .35rem;
	height: 100%;
	color: var(--ink);
	text-decoration: none;
	background: var(--wp--preset--color--white);
	border-radius: 18px;
	padding: .75rem .75rem 1.1rem;
	transition: transform .25s ease, box-shadow .25s ease;
}
.aleph-product__link:hover { transform: translateY(-3px) rotate(-.4deg); box-shadow: 0 16px 32px -22px rgba(25, 46, 58, .55); }
.aleph-product__img { display: block; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 12px; background: var(--paper-deep); margin-bottom: .4rem; }
.aleph-product__img img { width: 100%; height: 100%; object-fit: contain; display: block; }
.aleph-product__noimg { display: grid; place-items: center; height: 100%; padding: 1rem; text-align: center; font-family: var(--serif); font-style: italic; color: var(--ink-soft); }
.aleph-product__type { font-size: .8rem; color: var(--ink-soft); padding-inline: .25rem; }
.aleph-product__title { font-family: var(--serif); font-weight: 600; font-size: 1.15rem; line-height: 1.25; padding-inline: .25rem; }
.aleph-product__cta { margin-top: auto; padding: .35rem .25rem 0; font-weight: 500; color: var(--teal); font-size: .95rem; }

/* Post cards */
.aleph-card { display: flex; flex-direction: column; gap: .4rem; }
.aleph-card .wp-block-post-featured-image img { border-radius: 14px; }
.aleph-card__title { font-size: 1.25rem; margin: 0; }
.aleph-card__title a { color: var(--ink); text-decoration: none; }
.aleph-card__title a:hover { color: var(--teal); }

/* About */
.aleph-about__portrait {
	max-width: 340px;
	margin-inline: auto;
	aspect-ratio: 4 / 5;
	border-radius: var(--radius-organic);
	background: var(--lilac);
	display: grid;
	place-items: center;
	color: var(--ink-soft);
	font-size: .9rem;
}

/* CTA */
.aleph-cta { padding-block: var(--wp--preset--spacing--60); text-align: center; }
.aleph-cta__star { width: 28px; height: 28px; fill: var(--teal); margin: 0 auto -.5rem; display: block; }

/* Meta */
.aleph-meta { gap: .75rem; color: var(--ink-soft); font-size: var(--wp--preset--font-size--small); }
.aleph-meta__updated::before { content: "Updated "; }

/* Article figures and tables */
.aleph-figure { margin: 2rem 0; }
.aleph-figure svg { width: 100%; height: auto; display: block; }
.aleph-figure figcaption, .wp-block-table figcaption { font-size: .9rem; color: var(--ink-soft); margin-top: .5rem; }
.wp-block-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.wp-block-table table { font-size: .95rem; border-collapse: collapse; min-width: 520px; }
.wp-block-table th, .wp-block-table td { border: 1px solid rgba(25, 46, 58, .15); padding: .55rem .7rem; text-align: left; vertical-align: top; }
.wp-block-table thead th { background: var(--lilac); }
.aleph-article .aleph-products { margin-block: 1.5rem 2rem; }

/* ---------- Footer ---------- */
.aleph-footer { position: relative; padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40); margin-top: 0; }
.aleph-footer__edge { position: absolute; left: 0; right: 0; top: -23px; width: 100%; max-width: none !important; margin: 0 !important; height: 24px; color: var(--ink); }
.aleph-section .wp-block-buttons { position: relative; z-index: 1; }
.aleph-section__note { margin-top: .5rem !important; }
.aleph-footer a { color: var(--paper); text-decoration: none; }
.aleph-footer a:hover { text-decoration: underline; }
.aleph-brand--light a { color: var(--paper); }
.aleph-footer__lead { opacity: .8; max-width: 30ch; }
.aleph-footer__h { font-family: var(--wp--preset--font-family--sans); font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; color: var(--lilac); font-weight: 500; }
.aleph-footer__list { list-style: none; padding: 0; margin: 0; }
.aleph-footer__list li { padding-block: .3rem; }
.aleph-footer__legal { font-size: .85rem; opacity: .7; margin-top: var(--wp--preset--spacing--50); }

/* ---------- Cookie consent banner ---------- */
.aleph-consent {
	position: fixed;
	left: 1rem;
	right: 1rem;
	bottom: 1rem;
	z-index: 9999;
	max-width: 560px;
	margin-inline: auto;
	background: var(--ink);
	color: var(--paper);
	border-radius: 16px;
	padding: 1rem 1.1rem;
	box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .5);
	font-size: .95rem;
	line-height: 1.5;
}
.aleph-consent p { margin: 0 0 .75rem; }
.aleph-consent a { color: var(--lilac); }
.aleph-consent__actions { display: flex; gap: .6rem; justify-content: flex-end; }
.aleph-consent__actions button {
	min-height: 44px;
	min-width: 110px;
	padding: .5rem 1rem;
	border-radius: 999px;
	border: 1.5px solid var(--paper);
	background: transparent;
	color: var(--paper);
	font: inherit;
	font-weight: 500;
	cursor: pointer;
}
.aleph-consent__actions button[data-consent="granted"] { background: var(--paper); color: var(--ink); }
.aleph-footer__legal a.aleph-cookie-settings { cursor: pointer; }

/* ---------- Motion: "I'm here too" ---------- */
.ink-line { display: block; width: min(220px, 60%); height: 24px; margin-bottom: .75rem; }
.ink-line path { fill: none; stroke: var(--teal); stroke-width: 2.5; stroke-linecap: round; }
.js .ink-draw path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.4s var(--ease-story); }
.js .ink-draw.is-in path { stroke-dashoffset: 0; }

.js .reveal { opacity: 0; translate: 0 14px; transition: opacity .7s ease, translate .7s var(--ease-story); }
.js .reveal.is-in { opacity: 1; translate: 0 0; }
.no-io .reveal { opacity: 1 !important; translate: none !important; }
.no-io .ink-draw path { stroke-dashoffset: 0 !important; }

.twinkle, .scene__layer--twinkle { animation: twinkle 4.5s ease-in-out infinite; }
@keyframes twinkle { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

/* ---------- Motion: opening intro (front page, once per session) ---------- */
.book-intro { display: none; }
.aleph-intro { overflow: hidden; }
.aleph-intro .book-intro {
	display: block;
	background: transparent;
	position: fixed;
	inset: 0;
	z-index: 100000;
	perspective: 1800px;
	cursor: pointer;
}
.book-intro__page {
	/* Invisible timer: its animationend tells the JS the book is open. */
	position: absolute;
	inset: 0;
	pointer-events: none;
	animation: intro-page .1s linear 1.95s forwards;
}
/* The closed cover sits exactly on the page, hinged at the binding, and swings open flat to the left. */
.book-intro__cover {
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(50% - var(--sheet-w) / 2);
	width: var(--sheet-w);
	background: var(--cover);
	color: var(--paper);
	transform-origin: left center;
	transform-style: preserve-3d;
	display: grid;
	place-items: center;
	box-shadow: 30px 0 60px rgba(0, 0, 0, .25), inset 0 0 0 26px var(--cover), inset 0 0 0 27.5px rgba(229, 221, 237, .32);
	animation: intro-cover 1.45s var(--ease-story) .5s forwards;
}
/* Inside of the cover, seen once it has swung past halfway */
.book-intro__cover::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--cover);
	box-shadow: inset -30px 0 28px -22px rgba(0, 0, 0, .55), inset 0 0 0 26px var(--cover), inset 0 0 0 27.5px rgba(229, 221, 237, .32);
	transform: rotateY(180deg);
	backface-visibility: hidden;
}

.book-intro__frame {
	backface-visibility: hidden;
	width: min(78vw, 420px);
	aspect-ratio: 3 / 4;
	border: 1.5px solid var(--lilac);
	outline: 1px solid rgba(229, 221, 237, .45);
	outline-offset: 7px;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 2rem;
	animation: intro-frame .45s ease both;
}
.book-intro__star { width: 30px; height: 30px; fill: var(--lilac); margin-bottom: 1rem; }
.book-intro__title { font-family: var(--serif); font-style: italic; font-size: clamp(2rem, 7vw, 2.8rem); line-height: 1.1; margin: 0; }
.book-intro__sub { font-size: .95rem; opacity: .75; margin: .75rem 0 0; }
.book-intro__skip {
	position: absolute;
	right: 1rem;
	bottom: 1rem;
	z-index: 2;
	min-height: 44px;
	padding: .5rem 1rem;
	border-radius: 999px;
	border: 1px solid rgba(247, 243, 235, .4);
	background: transparent;
	color: var(--paper);
	font: inherit;
	font-size: .9rem;
	cursor: pointer;
	animation: intro-page .3s ease .6s forwards;
}
@keyframes intro-frame { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: none; } }
@keyframes intro-cover { 0% { transform: rotateY(0); } 100% { transform: rotateY(-180deg); box-shadow: none; } }
@keyframes intro-page { to { opacity: 0; visibility: hidden; } }

/* Scene "wakes up" as the cover opens: layers rise into place one by one. */
.aleph-intro:not(.aleph-awake) .scene__layer:not(:first-child) { translate: 0 8%; opacity: 0; }
.aleph-awake .scene__layer { transition: translate 1.1s var(--ease-story), opacity .8s ease; }
.aleph-awake .scene__layer:nth-child(2) { transition-delay: .25s; }
.aleph-awake .scene__layer:nth-child(3) { transition-delay: .05s; }
.aleph-awake .scene__layer:nth-child(4) { transition-delay: .15s; }
.aleph-awake .scene__layer:nth-child(5) { transition-delay: .25s; }

/* ---------- Desktop ---------- */
@media (min-width: 782px) {
	.aleph-header { padding-block: 1.25rem; }
	.aleph-nav { gap: 1.5rem; }
	.aleph-hero { padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60); }
	.aleph-families { gap: 1.5rem; }
}

/* ---------- Reduced motion: everything calm and in place ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
	.js .reveal { opacity: 1; translate: none; }
	.js .ink-draw path { stroke-dashoffset: 0; }
	.scene__layer { transform: none !important; }
}