/* ===========================================================================
   ASF G Ballarat — "Betrayal in Ballarat" by Glenda McLachlan
   Golden-hour sheep country that turns to dusk, then night, as you scroll.
   TOKENS: paper #F6EEDF · ink #2A1E17 · burgundy #7A1F1A · gold #C8902E
           amber #E2843A · sage #7F8A5E · dusk #2C2440 · night #12121F
   =========================================================================== */

/* The design is light-only: stop browsers (Chrome/Edge auto-dark, Samsung
   Internet, forced dark on phones) from inverting the parchment palette. */
:root {
	color-scheme: only light;
	--asf-g-paper: #F6EEDF;
	--asf-g-paper-2: #EFE2CB;
	--asf-g-cream: #FFF9EE;
	--asf-g-ink: #2A1E17;
	--asf-g-body: #4A3A2E;
	--asf-g-muted: #7A6656;
	--asf-g-burgundy: #7A1F1A;
	--asf-g-burgundy-d: #5A1511;
	--asf-g-gold: #C8902E;
	--asf-g-gold-l: #EBC27A;
	--asf-g-amber: #E2843A;
	--asf-g-sage: #7F8A5E;
	--asf-g-dusk: #2C2440;
	--asf-g-night: #12121F;
	--asf-g-line: rgba(42, 30, 23, .14);

	--asf-g-display: 'Cormorant Garamond', 'Cormorant', Georgia, 'Times New Roman', serif;
	--asf-g-text: 'Lora', Georgia, 'Times New Roman', serif;

	--asf-g-wrap: 1180px;
	--asf-g-gutter: clamp(20px, 5vw, 64px);
	--asf-g-radius: 6px;
	--asf-g-shadow: 0 30px 60px -28px rgba(42, 20, 8, .45), 0 10px 22px -12px rgba(42, 20, 8, .3);
	--asf-g-ease: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: 88px; -webkit-text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
body {
	margin: 0;
	background: var(--asf-g-paper);
	color: var(--asf-g-body);
	font: 400 1.0625rem/1.75 var(--asf-g-text);
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
p { margin: 0; text-wrap: pretty; }
p + p { margin-top: 1.05em; }
h1, h2, h3, h4 { margin: 0; color: var(--asf-g-ink); font-family: var(--asf-g-display); font-weight: 600; line-height: 1.08; letter-spacing: -.005em; text-wrap: balance; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--asf-g-gold-l); color: var(--asf-g-ink); }
:focus-visible { outline: 3px solid var(--asf-g-burgundy); outline-offset: 3px; border-radius: 2px; }

.asf-g-page { position: relative; isolation: isolate; }
.asf-g-main { position: relative; z-index: 2; }
.asf-g-wrap { width: min(100% - 2 * var(--asf-g-gutter), var(--asf-g-wrap)); margin-inline: auto; }

.asf-g-skip {
	position: fixed; left: 16px; top: -60px; z-index: 100;
	padding: 10px 16px; background: var(--asf-g-ink); color: var(--asf-g-paper);
	border-radius: var(--asf-g-radius); text-decoration: none; transition: top .2s;
}
.asf-g-skip:focus { top: 12px; }

/* ---------- ambient fixed layers ---------- */
.asf-g-sky, .asf-g-sky > div, .asf-g-canvas, .asf-g-grain, .asf-g-glow { position: fixed; inset: 0; pointer-events: none; }
.asf-g-sky {
	z-index: 0;
	background:
		url('../img/paper-texture.webp') repeat,
		linear-gradient(180deg, #F8F0E1 0%, var(--asf-g-paper) 55%, #F2E3C8 100%);
	background-size: 768px, auto;
}
.asf-g-sky__dusk {
	opacity: 0;
	background: linear-gradient(180deg, rgba(236, 196, 150, .55) 0%, rgba(230, 178, 128, .6) 45%, rgba(222, 160, 112, .65) 100%);
}
.asf-g-sky__night {
	opacity: 0;
	background:
		radial-gradient(120% 70% at 70% 110%, rgba(226, 132, 58, .28), transparent 60%),
		linear-gradient(180deg, #0E0F1C 0%, #1B1930 55%, #2C2440 100%);
}
.asf-g-sun {
	position: fixed; z-index: 0; pointer-events: none;
	right: 8vw; top: 16vh; width: 34vmin; height: 34vmin;
	transform: translate3d(0, 0, 0);
	will-change: transform, opacity;
}
.asf-g-sun__halo, .asf-g-sun__disc { position: absolute; border-radius: 50%; }
.asf-g-sun__halo {
	inset: -70%;
	background: radial-gradient(circle, rgba(255, 214, 140, .55) 0%, rgba(240, 168, 80, .22) 35%, transparent 68%);
}
.asf-g-sun__disc {
	inset: 22%;
	background: radial-gradient(circle at 42% 40%, #FFF3D6 0%, #FFD58A 45%, #F2A54D 100%);
	opacity: .32; filter: blur(14px);
	-webkit-mask: radial-gradient(circle, #000 45%, transparent 72%); mask: radial-gradient(circle, #000 45%, transparent 72%);
}
.asf-g-canvas { z-index: 1; width: 100%; height: 100%; }
.asf-g-grain {
	z-index: 60; opacity: .045; /* normal blend: multiply skips scrolling layers and leaves lighter boxes */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.asf-g-glow {
	z-index: 3; inset: auto; left: 0; top: 0; width: 520px; height: 520px; margin: -260px 0 0 -260px;
	border-radius: 50%; opacity: 0; transition: opacity .6s;
	background: radial-gradient(circle, rgba(255, 220, 150, .22), rgba(255, 200, 120, .08) 40%, transparent 70%);
	mix-blend-mode: soft-light;
}
.asf-g-glow.is-on { opacity: 1; }

/* ---------- type helpers ---------- */
.asf-g-eyebrow {
	display: inline-flex; align-items: center; gap: .7em;
	font: 600 0.874rem/1 var(--asf-g-display); letter-spacing: .24em; text-transform: uppercase;
	color: var(--asf-g-burgundy);
}
.asf-g-eyebrow::before { content: ''; width: 34px; height: 1px; background: currentColor; opacity: .6; }
.asf-g-eyebrow--light { color: var(--asf-g-gold-l); }
.asf-g-eyebrow__rule { display: none; }
.asf-g-h2 { font-size: clamp(2.3rem, 5vw, 3.9rem); letter-spacing: -.01em; margin-top: .45em; }
.asf-g-h2--light { color: var(--asf-g-cream); }
.asf-g-lede { font-size: 1.12rem; font-style: italic; color: var(--asf-g-muted); margin-top: 1rem; max-width: 40rem; }
.asf-g-divider { width: min(420px, 70%); margin: 1.8rem auto 0; opacity: .9; }

/* ---------- buttons ---------- */
.asf-g-btn {
	display: inline-flex; align-items: center; gap: .6em; cursor: pointer;
	padding: .95em 1.7em; border: 1px solid var(--asf-g-burgundy); border-radius: 999px;
	background: var(--asf-g-burgundy); color: var(--asf-g-cream);
	font: 600 0.918rem/1 var(--asf-g-display); letter-spacing: .14em; text-transform: uppercase; text-decoration: none;
	box-shadow: 0 10px 24px -12px rgba(90, 21, 17, .7);
	transition: transform .35s var(--asf-g-ease), background .3s, box-shadow .35s, color .3s, border-color .3s;
}
.asf-g-btn:hover { background: var(--asf-g-burgundy-d); transform: translateY(-2px); box-shadow: 0 16px 30px -14px rgba(90, 21, 17, .8); }
.asf-g-btn:active { transform: translateY(1px); }
.asf-g-btn--ghost { background: transparent; color: var(--asf-g-burgundy); box-shadow: none; }
.asf-g-btn--ghost:hover { background: var(--asf-g-burgundy); color: var(--asf-g-cream); }

/* ---------- nav ---------- */
.asf-g-nav {
	position: fixed; inset: 0 0 auto; z-index: 50;
	border-bottom: 1px solid transparent;
	transition: background .4s, border-color .4s, backdrop-filter .4s, color .4s;
	color: var(--asf-g-cream);
}
.asf-g-nav.is-solid, .asf-g-prose-page ~ .asf-g-nav, body:not(.home) .asf-g-nav {
	background: rgba(246, 238, 223, .9); border-bottom-color: var(--asf-g-line);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: var(--asf-g-ink);
}
.asf-g-nav.is-solid.is-night {
	background: rgba(12, 12, 22, .82); border-bottom-color: rgba(235, 194, 122, .14); color: var(--asf-g-cream);
}
.asf-g-nav.is-night .asf-g-nav__cta:hover { background: var(--asf-g-gold); border-color: var(--asf-g-gold); color: #2A1608; }
.asf-g-nav__progress {
	position: absolute; left: 0; bottom: -1px; height: 2px; width: 100%;
	background: linear-gradient(90deg, var(--asf-g-gold), var(--asf-g-burgundy));
	transform-origin: 0 50%; transform: scaleX(0);
}
.asf-g-nav__inner {
	width: min(100% - 2 * var(--asf-g-gutter), 1320px); margin-inline: auto;
	display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 76px;
}
.asf-g-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.asf-g-brand__mark { width: 48px; height: auto; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .25)); }
.asf-g-brand__text { display: flex; flex-direction: column; line-height: 1.1; }
.asf-g-brand__name { font: 600 1.32rem/1.05 var(--asf-g-display); letter-spacing: .01em; }
.asf-g-brand__by { font: italic 400 .8rem/1.3 var(--asf-g-text); opacity: .8; }
.asf-g-nav__drawer { display: flex; align-items: center; gap: 30px; }
.asf-g-nav__links { display: flex; gap: 24px; }
.asf-g-nav__links a {
	position: relative; text-decoration: none; font: 500 1.008rem/1 var(--asf-g-display); letter-spacing: .02em; padding: 6px 0;
}
.asf-g-nav__links a::after {
	content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor;
	transform: scaleX(0); transform-origin: right; transition: transform .4s var(--asf-g-ease);
}
.asf-g-nav__links a:hover::after, .asf-g-nav__links a.is-current::after { transform: scaleX(1); transform-origin: left; }
.asf-g-nav__cta {
	padding: .7em 1.3em; border: 1px solid currentColor; border-radius: 999px; text-decoration: none;
	font: 600 0.829rem/1 var(--asf-g-display); letter-spacing: .16em; text-transform: uppercase; transition: background .3s, color .3s;
}
.asf-g-nav__cta:hover { background: var(--asf-g-burgundy); border-color: var(--asf-g-burgundy); color: var(--asf-g-cream); }
.asf-g-nav__toggle { display: none; }
.asf-g-nav__backdrop { display: none; }

@media (max-width: 1100px) {
	.asf-g-nav__toggle {
		display: grid; place-items: center; width: 46px; height: 46px; border: 0; border-radius: 50%;
		background: transparent; cursor: pointer; position: relative; z-index: 3;
	}
	.asf-g-nav__bars, .asf-g-nav__bars::before, .asf-g-nav__bars::after {
		display: block; width: 22px; height: 1.5px; background: currentColor; border-radius: 2px; transition: transform .35s var(--asf-g-ease), opacity .2s;
	}
	.asf-g-nav__bars { position: relative; }
	.asf-g-nav__bars::before, .asf-g-nav__bars::after { content: ''; position: absolute; left: 0; }
	.asf-g-nav__bars::before { top: -7px; }
	.asf-g-nav__bars::after { top: 7px; }
	.asf-g-nav-open .asf-g-nav__bars { background: transparent; }
	.asf-g-nav-open .asf-g-nav__bars::before { transform: translateY(7px) rotate(45deg); }
	.asf-g-nav-open .asf-g-nav__bars::after { transform: translateY(-7px) rotate(-45deg); }
	.asf-g-nav-open .asf-g-nav { color: var(--asf-g-ink); }

	/* backdrop-filter would make the header the containing block for the
	   fixed drawer (squashing it into the 76px bar), so phones/tablets get a
	   solid bar instead of the frosted one. */
	.asf-g-nav, .asf-g-nav.is-solid { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
	.asf-g-nav.is-solid { background: rgba(246, 238, 223, .97); }
	.asf-g-nav.is-solid.is-night { background: rgba(12, 12, 22, .96); }
	.asf-g-nav-open .asf-g-nav { color: var(--asf-g-ink) !important; background: var(--asf-g-paper) !important; border-bottom-color: var(--asf-g-line) !important; }
	.asf-g-nav-open .asf-g-nav__toggle { background: rgba(122, 31, 26, .08); }

	.asf-g-nav__drawer {
		position: fixed; top: 0; right: 0; bottom: 0; height: 100vh; height: 100dvh; width: min(86vw, 380px); z-index: 2;
		display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0;
		padding: calc(env(safe-area-inset-top, 0px) + 92px) 34px calc(env(safe-area-inset-bottom, 0px) + 34px);
		overflow-y: auto; overscroll-behavior: contain;
		background:
			url('../img/paper-texture.webp') repeat,
			linear-gradient(180deg, #F8F1E4, var(--asf-g-paper));
		background-size: 768px, auto;
		color: var(--asf-g-ink);
		box-shadow: -30px 0 60px -30px rgba(0, 0, 0, .45);
		transform: translateX(105%); visibility: hidden;
		transition: transform .5s var(--asf-g-ease), visibility 0s linear .5s;
	}
	.asf-g-nav-open .asf-g-nav__drawer { transform: none; visibility: visible; transition: transform .5s var(--asf-g-ease), visibility 0s; }
	.asf-g-nav__links { display: flex; flex-direction: column; gap: 0; counter-reset: asfgnav; border-top: 1px solid var(--asf-g-line); }
	.asf-g-nav__links a {
		display: flex; align-items: baseline; gap: 14px; counter-increment: asfgnav;
		padding: 15px 0; border-bottom: 1px solid var(--asf-g-line);
		font: 500 1.6rem/1.15 var(--asf-g-display); color: var(--asf-g-ink);
	}
	.asf-g-nav__links a::before {
		content: counter(asfgnav, decimal-leading-zero);
		font: italic 500 .95rem/1 var(--asf-g-display); color: var(--asf-g-gold); min-width: 1.6em;
	}
	.asf-g-nav__links a::after { display: none; }
	.asf-g-nav__links a.is-current { color: var(--asf-g-burgundy); }
	.asf-g-nav__cta {
		margin-top: 30px; align-self: stretch; text-align: center; padding: 1.05em 1.3em;
		background: var(--asf-g-burgundy); border-color: var(--asf-g-burgundy); color: var(--asf-g-cream);
		font-size: .9rem;
	}
	.asf-g-nav-open .asf-g-nav__drawer .asf-g-nav__cta { color: var(--asf-g-cream); }
	.asf-g-nav__backdrop {
		display: block; position: fixed; inset: 0; z-index: 49; background: rgba(18, 18, 31, .5);
		opacity: 0; pointer-events: none; transition: opacity .4s;
	}
	.asf-g-nav-open .asf-g-nav__backdrop { opacity: 1; pointer-events: auto; }
	.asf-g-nav-open, .asf-g-nav-open body { overflow: hidden; }
}
@media (max-width: 520px) {
	.asf-g-brand__by { display: none; }
	.asf-g-brand__name { font-size: 1rem; }
}

/* ---------- 1 · hero ---------- */
.asf-g-hero {
	position: relative; min-height: 100svh; display: grid; align-items: center;
	padding: 120px 0 110px; overflow: hidden; color: var(--asf-g-cream); background: #3A2416;
}
.asf-g-hero__bg { position: absolute; inset: -4% 0 -8%; z-index: 0; will-change: transform; }
.asf-g-hero__bg picture, .asf-g-hero__bgimg { width: 100%; height: 100%; }
.asf-g-hero__bgimg { object-fit: cover; object-position: 60% 70%; }
.asf-g-hero__fade {
	position: absolute; inset: 0;
	background:
		linear-gradient(90deg, rgba(28, 14, 6, .74) 0%, rgba(28, 14, 6, .5) 38%, rgba(28, 14, 6, .08) 70%),
		linear-gradient(180deg, rgba(20, 10, 4, .35) 0%, transparent 22%, transparent 70%, rgba(246, 238, 223, 1) 100%);
}
.asf-g-hero__grid {
	position: relative; z-index: 2;
	width: min(100% - 2 * var(--asf-g-gutter), 1260px); margin-inline: auto;
	display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(32px, 6vw, 96px); align-items: center;
}
.asf-g-hero__title {
	color: var(--asf-g-cream); font-weight: 700; text-transform: uppercase;
	font-size: clamp(3rem, 6.9vw, 6.6rem); line-height: .92; letter-spacing: .03em;
	text-shadow: 0 4px 30px rgba(20, 8, 2, .45);
}
.asf-g-hero__title em {
	display: inline-block; font-style: italic; font-weight: 500; text-transform: lowercase;
	font-size: .5em; letter-spacing: 0; color: var(--asf-g-gold-l); margin-right: .04em; transform: translateY(-.12em);
}
.asf-g-hero__line { display: block; white-space: nowrap; }
.asf-g-hero__byline {
	margin-top: 1.1rem; font: 500 clamp(1.15rem, 2vw, 1.5rem)/1.2 var(--asf-g-display); letter-spacing: .08em; color: var(--asf-g-gold-l);
}
.asf-g-hero__tag { margin-top: 1.1rem; max-width: 34rem; font-size: 1.1rem; color: rgba(255, 244, 225, .88); }
.asf-g-hero__ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 2rem; }
.asf-g-hero .asf-g-btn { background: var(--asf-g-gold); border-color: var(--asf-g-gold); color: #2A1608; }
.asf-g-hero .asf-g-btn:hover { background: var(--asf-g-gold-l); border-color: var(--asf-g-gold-l); }
.asf-g-hero .asf-g-btn--ghost { background: rgba(255, 249, 238, .06); border-color: rgba(255, 244, 225, .6); color: var(--asf-g-cream); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.asf-g-hero .asf-g-btn--ghost:hover { background: var(--asf-g-cream); color: var(--asf-g-ink); border-color: var(--asf-g-cream); }
.asf-g-hero__book { display: flex; justify-content: center; perspective: 1600px; }
.asf-g-scrollcue {
	position: absolute; z-index: 2; left: 50%; bottom: 26px; transform: translateX(-50%);
	display: flex; flex-direction: column; align-items: center; gap: 10px; text-decoration: none;
	font: italic 400 1.008rem/1 var(--asf-g-display); color: var(--asf-g-burgundy); letter-spacing: .04em;
}
.asf-g-scrollcue__line { width: 1px; height: 46px; background: linear-gradient(var(--asf-g-burgundy), transparent); animation: asfgCue 2.2s var(--asf-g-ease) infinite; transform-origin: top; }
@keyframes asfgCue { 0% { transform: scaleY(0); opacity: 1; } 60% { transform: scaleY(1); opacity: 1; } 100% { transform: scaleY(1); opacity: 0; } }

/* the 3D book */
.asf-g-book3d { position: relative; width: min(340px, 72vw); transform-style: preserve-3d; }
.asf-g-book3d--small { width: min(280px, 64vw); }
.asf-g-book3d__inner {
	position: relative; transform-style: preserve-3d; transform: rotateY(-18deg) rotateX(4deg);
	transition: transform .9s var(--asf-g-ease); will-change: transform;
}
.asf-g-book3d__cover {
	position: relative; z-index: 2; width: 100%; aspect-ratio: 2 / 3; object-fit: cover;
	border-radius: 2px 5px 5px 2px;
	box-shadow: inset 4px 0 6px -2px rgba(255, 255, 255, .25), 0 40px 70px -26px rgba(10, 4, 0, .7), 0 14px 26px -10px rgba(10, 4, 0, .45);
}
.asf-g-book3d__spine {
	position: absolute; z-index: 3; left: 0; top: 0; bottom: 0; width: 16px; border-radius: 2px 0 0 2px;
	background: linear-gradient(90deg, rgba(0, 0, 0, .35), rgba(255, 255, 255, .18) 40%, rgba(0, 0, 0, .12) 70%, transparent);
}
.asf-g-book3d__pages {
	position: absolute; z-index: 1; top: 1.5%; bottom: 1.5%; right: -14px; width: 16px;
	background: repeating-linear-gradient(90deg, #F4ECDC 0 1px, #DCCFB6 1px 2px);
	transform: rotateY(90deg) translateZ(-1px); transform-origin: left; border-radius: 0 2px 2px 0;
}
.asf-g-book3d__shine {
	position: absolute; z-index: 4; inset: 0; pointer-events: none; mix-blend-mode: soft-light;
	background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .55) 48%, transparent 62%);
	background-size: 250% 100%; background-position: var(--asf-g-shine, 80%) 0;
}
.asf-g-book3d__shadow {
	position: absolute; left: 6%; right: -4%; bottom: -26px; height: 30px; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(10, 4, 0, .45), transparent); filter: blur(6px); z-index: -1;
}

@media (max-width: 900px) {
	.asf-g-hero { padding: 108px 0 96px; align-items: end; }
	.asf-g-hero__grid { grid-template-columns: 1fr; }
	.asf-g-hero__fade {
		background:
			linear-gradient(180deg, rgba(28, 14, 6, .3) 0%, rgba(28, 14, 6, .55) 35%, rgba(28, 14, 6, .7) 70%, rgba(246, 238, 223, 1) 100%);
	}
	.asf-g-hero__book { order: -1; }
	.asf-g-hero__book .asf-g-book3d { width: min(200px, 48vw); }
}

/* ---------- 1b · epigraph (front matter) ---------- */
.asf-g-epi { position: relative; padding: clamp(110px, 16vw, 220px) var(--asf-g-gutter) clamp(70px, 10vw, 140px); text-align: center; }
.asf-g-epi__inner { margin: 0 auto; max-width: 52rem; }
.asf-g-epi__rule { display: block; width: 1px; height: 64px; margin: 0 auto 3rem; background: linear-gradient(transparent, var(--asf-g-gold)); }
.asf-g-epi__quote { margin: 0; }
.asf-g-epi__quote p { display: flex; flex-direction: column; gap: .08em; }
.asf-g-epi__line {
	display: block; font: italic 500 clamp(2.2rem, 5.2vw, 4.1rem)/1.15 var(--asf-g-display);
	letter-spacing: -.01em; color: var(--asf-g-ink);
}
.asf-g-epi__line--last {
	margin-top: .55em; font-style: normal; font-weight: 600; text-transform: uppercase;
	font-size: clamp(1.15rem, 2.4vw, 1.75rem); letter-spacing: .22em; color: var(--asf-g-burgundy);
}
.asf-g-epi__cite {
	display: inline-flex; align-items: center; gap: 1em; margin-top: 2.6rem;
	font: 600 0.874rem/1 var(--asf-g-display); letter-spacing: .24em; text-transform: uppercase; color: var(--asf-g-muted);
}
.asf-g-epi__cite::before, .asf-g-epi__cite::after { content: ''; width: 36px; height: 1px; background: var(--asf-g-gold); }
.asf-g-hero__title { margin-top: 1.4rem; }

/* ---------- 2 · about the book ---------- */
/* ---------- 1c · book trailer ---------- */
.asf-g-hero__trailer {
	display: inline-flex; align-items: center; gap: 12px; margin-top: 1.4rem;
	color: var(--asf-g-cream); text-decoration: none; font: 500 1.15rem/1 var(--asf-g-display); letter-spacing: .06em;
	text-shadow: 0 2px 14px rgba(20, 8, 2, .5);
}
.asf-g-hero__trailer-icon {
	position: relative; width: 38px; height: 38px; border-radius: 50%; flex: none;
	border: 1px solid rgba(255, 244, 225, .7); transition: background .3s var(--asf-g-ease), border-color .3s;
}
.asf-g-hero__trailer-icon::after {
	content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-35%, -50%);
	border-style: solid; border-width: 6px 0 6px 10px; border-color: transparent transparent transparent var(--asf-g-gold-l);
}
.asf-g-hero__trailer:hover .asf-g-hero__trailer-icon { background: var(--asf-g-gold); border-color: var(--asf-g-gold); }
.asf-g-hero__trailer:hover .asf-g-hero__trailer-icon::after { border-left-color: #2A1608; }

/* Centred "screening": heading on top, video in the middle, two tilted stills
   either side so the row is balanced edge to edge. */
.asf-g-trailer { position: relative; padding: clamp(10px, 3vw, 40px) 0 clamp(70px, 10vw, 130px); }
.asf-g-trailer__head { text-align: center; max-width: 46rem; margin-inline: auto; }
.asf-g-trailer__head .asf-g-eyebrow { justify-content: center; }
.asf-g-trailer__head .asf-g-eyebrow::after { content: ''; width: 34px; height: 1px; background: currentColor; opacity: .6; }
.asf-g-trailer__head .asf-g-h2 { font-style: italic; font-weight: 500; }
.asf-g-trailer__head .asf-g-lede { margin-inline: auto; }

.asf-g-trailer__stage {
	position: relative; display: grid; align-items: center; justify-content: center;
	grid-template-columns: minmax(0, 250px) minmax(0, 320px) minmax(0, 250px);
	margin-top: clamp(36px, 4vw, 52px);
}
.asf-g-trailer__stage::before { /* warm lamp-light behind the screen */
	content: ''; position: absolute; left: 50%; top: 50%; width: min(900px, 100%); aspect-ratio: 1.6; z-index: 0;
	transform: translate(-50%, -50%); pointer-events: none;
	background: radial-gradient(closest-side, rgba(235, 194, 122, .45), rgba(235, 194, 122, 0));
}
.asf-g-trailer__still {
	position: relative; z-index: 1; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 4px;
	border: 8px solid var(--asf-g-cream); box-shadow: var(--asf-g-shadow);
	filter: sepia(.25) saturate(.9);
}
.asf-g-trailer__still--left { transform: translateX(28px) rotate(-5deg); }
.asf-g-trailer__still--right { transform: translateX(-28px) rotate(5deg); }

.asf-g-trailer__frame {
	position: relative; z-index: 2; margin: 0; aspect-ratio: 9 / 16; border-radius: 10px; overflow: hidden;
	background: #1d140e; box-shadow: var(--asf-g-shadow), 0 0 0 1px rgba(200, 144, 46, .55), 0 0 0 8px rgba(255, 249, 238, .85), 0 0 0 9px rgba(200, 144, 46, .4);
}
.asf-g-trailer__video { display: block; width: 100%; height: 100%; object-fit: cover; }
.asf-g-trailer__play {
	position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
	border: 0; padding: 0; cursor: pointer;
	background: linear-gradient(180deg, rgba(20, 10, 4, 0) 40%, rgba(20, 10, 4, .3) 100%);
	transition: opacity .4s var(--asf-g-ease);
}
.asf-g-trailer__play .asf-g-trailer__icon { margin-top: 62%; }
.asf-g-trailer__meta {
	display: flex; justify-content: center; align-items: center; gap: 14px; margin-top: clamp(36px, 4vw, 52px);
	font: 600 .874rem/1 var(--asf-g-display); letter-spacing: .24em; text-transform: uppercase; color: var(--asf-g-muted);
}
.asf-g-trailer__dot { width: 4px; height: 4px; border-radius: 50%; background: var(--asf-g-gold); }
.asf-g-trailer__icon {
	position: relative; width: 78px; height: 78px; border-radius: 50%;
	background: rgba(200, 144, 46, .92); box-shadow: 0 10px 30px -8px rgba(20, 8, 2, .7);
	transition: transform .35s var(--asf-g-ease), background .3s;
}
.asf-g-trailer__icon::after {
	content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-35%, -50%);
	border-style: solid; border-width: 13px 0 13px 21px; border-color: transparent transparent transparent #2A1608;
}
.asf-g-trailer__play:hover .asf-g-trailer__icon { transform: scale(1.08); background: var(--asf-g-gold-l); }
.asf-g-trailer.is-playing .asf-g-trailer__play { opacity: 0; pointer-events: none; }
@media (max-width: 900px) {
	.asf-g-trailer__stage { grid-template-columns: minmax(0, 200px) minmax(0, 290px) minmax(0, 200px); }
	.asf-g-trailer__still { border-width: 5px; }
	.asf-g-trailer__still--left { transform: translateX(34px) rotate(-6deg); }
	.asf-g-trailer__still--right { transform: translateX(-34px) rotate(6deg); }
}
@media (max-width: 560px) {
	.asf-g-trailer__stage { grid-template-columns: minmax(0, 300px); }
	.asf-g-trailer__still { display: none; }
}

.asf-g-book { position: relative; padding: clamp(80px, 12vw, 160px) 0 clamp(60px, 9vw, 120px); }
.asf-g-book__wattle { position: absolute; right: max(1.5vw, 10px); top: -36px; width: clamp(90px, 10vw, 160px); opacity: .95; pointer-events: none; transform: rotate(10deg); }
.asf-g-book .asf-g-wrap { position: relative; z-index: 1; }
.asf-g-book__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.asf-g-book__head .asf-g-h2 { font-size: clamp(2.2rem, 4vw, 3.3rem); font-style: italic; font-weight: 500; }
.asf-g-book__body { font-size: 1.12rem; padding-top: .5rem; }
.asf-g-book__body > p:first-child::first-letter {
	float: left; font: 700 4.4em/.82 var(--asf-g-display); color: var(--asf-g-burgundy); margin: .06em .1em 0 0;
}
.asf-g-facts { margin: 2.2rem 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--asf-g-line); }
.asf-g-facts__row { padding: 14px 0; border-bottom: 1px solid var(--asf-g-line); }
.asf-g-facts__row:nth-child(odd) { padding-right: 16px; }
.asf-g-facts dt { font: 600 0.784rem/1 var(--asf-g-display); letter-spacing: .2em; text-transform: uppercase; color: var(--asf-g-muted); }
.asf-g-facts dd { margin: 6px 0 0; font: 600 1.2rem/1.3 var(--asf-g-display); color: var(--asf-g-ink); }

.asf-g-themes { margin-top: clamp(70px, 10vw, 130px); text-align: center; }
.asf-g-themes .asf-g-divider { margin: 0 auto 1.6rem; }
.asf-g-themes__title { font-size: clamp(1.5rem, 2.6vw, 2.1rem); font-style: italic; font-weight: 400; }
.asf-g-themes__list {
	list-style: none; margin: 2.4rem 0 0; padding: 0;
	display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; text-align: left;
}
.asf-g-theme {
	position: relative; padding: 26px 22px 28px; border-radius: var(--asf-g-radius);
	background: rgba(255, 249, 238, .72); border: 1px solid var(--asf-g-line);
	box-shadow: 0 18px 30px -26px rgba(42, 20, 8, .5);
	transition: transform .5s var(--asf-g-ease), box-shadow .5s, background .5s;
}
.asf-g-theme:hover { transform: translateY(-6px); background: var(--asf-g-cream); box-shadow: 0 30px 40px -28px rgba(42, 20, 8, .55); }
.asf-g-theme__no { font: italic 500 1.064rem/1 var(--asf-g-display); color: var(--asf-g-gold); }
.asf-g-theme__name { margin: .7rem 0 .55rem; font-size: 1.25rem; }
.asf-g-theme p { font-size: .95rem; line-height: 1.6; }
.asf-g-theme::after {
	content: ''; position: absolute; left: 22px; right: 22px; bottom: 0; height: 2px;
	background: linear-gradient(90deg, var(--asf-g-gold), var(--asf-g-burgundy)); transform: scaleX(0); transform-origin: left;
	transition: transform .6s var(--asf-g-ease);
}
.asf-g-theme:hover::after { transform: scaleX(1); }

@media (max-width: 1000px) {
	.asf-g-themes__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.asf-g-theme:last-child { grid-column: 1 / -1; }
}
@media (max-width: 800px) {
	.asf-g-book__grid { grid-template-columns: 1fr; }
	.asf-g-book__wattle { width: 90px; top: 20px; opacity: .6; }
}
@media (max-width: 520px) {
	.asf-g-themes__list { grid-template-columns: 1fr; }
}

/* ---------- 3 · story ---------- */
.asf-g-story { position: relative; padding: clamp(60px, 8vw, 110px) 0 clamp(80px, 10vw, 140px); }
.asf-g-story__wrap { position: relative; width: min(100% - 2 * var(--asf-g-gutter), var(--asf-g-wrap)); margin-inline: auto; }
.asf-g-story__head { text-align: center; max-width: 46rem; margin: 0 auto clamp(60px, 9vw, 120px); }
.asf-g-story__head .asf-g-lede { margin-inline: auto; }
.asf-g-rail { position: absolute; left: 50%; top: 260px; bottom: 380px; width: 2px; margin-left: -1px; }
.asf-g-rail::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(180deg, rgba(122, 31, 26, .22) 0 6px, transparent 6px 14px); }
.asf-g-rail__thread { position: absolute; inset: 0; background: linear-gradient(180deg, var(--asf-g-gold), var(--asf-g-burgundy)); transform-origin: top; }
.asf-g-rail__dot {
	position: absolute; left: 50%; top: 0; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; opacity: 0;
	background: radial-gradient(circle, #FFF3D6, var(--asf-g-gold)); box-shadow: 0 0 0 5px rgba(200, 144, 46, .2), 0 0 24px 6px rgba(240, 180, 90, .55);
}
.asf-g-story__inner { position: relative; display: flex; flex-direction: column; gap: clamp(70px, 11vw, 150px); }
.asf-g-step { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(56px, 9vw, 130px); align-items: center; }
.asf-g-step--alt .asf-g-step__art { order: 2; }
.asf-g-step__art { position: relative; }
.asf-g-step__frame {
	position: relative; overflow: hidden; border-radius: 3px;
	padding: 12px 12px 12px; background: var(--asf-g-cream);
	box-shadow: var(--asf-g-shadow); transform: rotate(-.6deg);
}
.asf-g-step--alt .asf-g-step__frame { transform: rotate(.7deg); }
.asf-g-step__frame .asf-g-art { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 1px; }
.asf-g-step__tape {
	position: absolute; top: -12px; left: 50%; width: 110px; height: 28px; margin-left: -55px; transform: rotate(-3deg);
	background: rgba(235, 210, 160, .7); box-shadow: 0 2px 4px rgba(0, 0, 0, .08); -webkit-backdrop-filter: blur(1px); backdrop-filter: blur(1px);
}
.asf-g-step__text { position: relative; }
.asf-g-step__no {
	display: flex; align-items: center; gap: 14px;
	font: 600 0.874rem/1 var(--asf-g-display); letter-spacing: .22em; text-transform: uppercase; color: var(--asf-g-burgundy);
}
.asf-g-step__num { font: italic 400 2.8rem/1 var(--asf-g-display); letter-spacing: 0; color: var(--asf-g-gold); }
.asf-g-step__no i { width: 30px; height: 1px; background: currentColor; opacity: .5; }
.asf-g-step__quote { margin: 1.6rem 0 0; padding: 0; position: relative; }
.asf-g-step__quote::before {
	content: '“'; position: absolute; left: -.48em; top: -.1em; font: 700 4.6rem/1 var(--asf-g-display); color: var(--asf-g-gold); opacity: .3;
}
.asf-g-step__quote p { position: relative; font: italic 500 clamp(1.55rem, 2.6vw, 2.1rem)/1.32 var(--asf-g-display); color: var(--asf-g-ink); }
.asf-g-step__note { margin-top: 1.2rem; padding-left: 1rem; border-left: 2px solid var(--asf-g-gold); color: var(--asf-g-muted); font-size: 1rem; }

.asf-g-close {
	position: relative; overflow: hidden; border-radius: 4px; text-align: center; color: var(--asf-g-cream);
	padding: clamp(70px, 10vw, 130px) clamp(24px, 6vw, 80px); box-shadow: var(--asf-g-shadow);
}
.asf-g-close__bg, .asf-g-close__bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.asf-g-close__bg::after { content: ''; position: absolute; inset: 0; background: radial-gradient(120% 120% at 50% 50%, rgba(40, 18, 6, .55), rgba(40, 18, 6, .85)); }
.asf-g-close__inner { position: relative; max-width: 40rem; margin-inline: auto; }
.asf-g-close__a { margin-top: 1.4rem; font: italic 500 clamp(1.6rem, 3.1vw, 2.4rem)/1.36 var(--asf-g-display); color: var(--asf-g-cream); }
.asf-g-close__rule { display: block; width: 60px; height: 1px; margin: 1.6rem auto; background: var(--asf-g-gold-l); }
.asf-g-close__b { color: rgba(255, 244, 225, .85); margin-bottom: 2rem; }
.asf-g-close .asf-g-btn { background: var(--asf-g-gold); border-color: var(--asf-g-gold); color: #2A1608; }
.asf-g-close .asf-g-btn:hover { background: var(--asf-g-gold-l); }

@media (max-width: 860px) {
	.asf-g-rail { left: 0; margin-left: 0; top: 230px; }
	.asf-g-step { grid-template-columns: 1fr; gap: 28px; padding-left: 22px; }
	.asf-g-step--alt .asf-g-step__art { order: 0; }
	.asf-g-close { margin-left: 0; }
}

/* the "developing print" effect: JS drives --asf-g-dev 0 → 1 */
[data-asf-g-develop] .asf-g-art {
	filter: sepia(calc(1 - var(--asf-g-dev, 1))) saturate(calc(.35 + .65 * var(--asf-g-dev, 1))) contrast(calc(.82 + .18 * var(--asf-g-dev, 1))) brightness(calc(1.12 - .12 * var(--asf-g-dev, 1)));
	transform: scale(calc(1.06 - .06 * var(--asf-g-dev, 1)));
	transition: filter .2s linear;
}

/* ---------- 4 · country ---------- */
.asf-g-country { position: relative; overflow: hidden; padding: clamp(150px, 17vw, 230px) 0 clamp(190px, 20vw, 270px); color: rgba(255, 244, 225, .9); }
/* The dusk painting and its shade fade to transparent at both ends, so the
   section melts into the parchment sky behind it instead of ending on a hard edge. */
.asf-g-country {
	-webkit-mask-image: linear-gradient(180deg, transparent 0, #000 clamp(110px, 12vw, 170px), #000 calc(100% - clamp(150px, 16vw, 230px)), transparent 100%);
	mask-image: linear-gradient(180deg, transparent 0, #000 clamp(110px, 12vw, 170px), #000 calc(100% - clamp(150px, 16vw, 230px)), transparent 100%);
}
.asf-g-country__bg { position: absolute; inset: -12% 0; will-change: transform; }
.asf-g-country__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 60%; }
.asf-g-country__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14, 12, 28, .85) 0%, rgba(14, 12, 28, .55) 50%, rgba(14, 12, 28, .25) 100%); }
.asf-g-country__wrap { position: relative; z-index: 2; }
.asf-g-country__grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(36px, 7vw, 110px); align-items: center; }
.asf-g-country__head p { margin-top: 1.4rem; font-size: 1.12rem; max-width: 34rem; }
.asf-g-country__art { margin: 0; }
.asf-g-country__frame { padding: 12px; background: #F4EBDA; box-shadow: 0 40px 70px -30px rgba(0, 0, 0, .8); transform: rotate(1.2deg); }
.asf-g-country__frame .asf-g-art { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: sepia(.45) contrast(1.05); }
.asf-g-country__art figcaption { margin-top: 1rem; text-align: right; font: italic .9rem/1.4 var(--asf-g-display); color: rgba(255, 244, 225, .7); }
.asf-g-places { list-style: none; margin: clamp(60px, 9vw, 110px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid rgba(235, 194, 122, .35); }
.asf-g-place { position: relative; padding: 30px 26px 10px 0; }
.asf-g-place + .asf-g-place { padding-left: 26px; border-left: 1px solid rgba(235, 194, 122, .2); }
.asf-g-place__pin { position: absolute; top: -6px; width: 11px; height: 11px; border-radius: 50%; background: var(--asf-g-gold-l); box-shadow: 0 0 0 4px rgba(235, 194, 122, .2), 0 0 18px rgba(235, 194, 122, .6); }
.asf-g-place h3 { color: var(--asf-g-cream); font-size: 1.3rem; margin-bottom: .5rem; }
.asf-g-place p { font-size: .96rem; color: rgba(255, 244, 225, .75); }
@media (max-width: 900px) {
	.asf-g-country__grid { grid-template-columns: 1fr; }
	.asf-g-places { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.asf-g-place:nth-child(3) { padding-left: 0; border-left: 0; }
}
@media (max-width: 520px) {
	.asf-g-places { grid-template-columns: 1fr; }
	.asf-g-place + .asf-g-place { padding-left: 0; border-left: 0; }
}

/* ---------- 5 · album (drag / swipe carousel) ---------- */
.asf-g-album { position: relative; overflow-x: clip; padding: clamp(80px, 11vw, 150px) 0 clamp(60px, 8vw, 110px); }
.asf-g-album__head { text-align: center; }
.asf-g-album__head .asf-g-lede { margin-inline: auto; }
.asf-g-album__viewport {
	margin-top: clamp(30px, 5vw, 56px); overflow-x: auto; overflow-y: hidden;
	overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: max(var(--asf-g-gutter), calc((100vw - var(--asf-g-wrap)) / 2));
	-webkit-overflow-scrolling: touch; scrollbar-width: none; touch-action: pan-x pan-y; cursor: grab; outline: none;
}
.asf-g-album__viewport::-webkit-scrollbar { display: none; }
.asf-g-album__viewport:focus-visible { box-shadow: inset 0 0 0 2px var(--asf-g-burgundy); }
.asf-g-album__viewport.is-dragging { scroll-snap-type: none; cursor: grabbing; user-select: none; }
.asf-g-album__viewport.is-dragging .asf-g-print { pointer-events: none; }
.asf-g-album__viewport.has-dragcursor, .asf-g-album__viewport.has-dragcursor * { cursor: none; }
.asf-g-album__track {
	list-style: none; margin: 0; display: flex; gap: clamp(22px, 3vw, 40px); width: max-content;
	/* generous top/bottom room so the prints' soft shadows fade out inside the scroller (it clips) */
	padding: 40px max(var(--asf-g-gutter), calc((100vw - var(--asf-g-wrap)) / 2)) 96px;
}
.asf-g-print { flex: 0 0 auto; width: clamp(250px, 27vw, 380px); scroll-snap-align: start; transform: rotate(var(--asf-g-tilt, 0deg)); transition: transform .6s var(--asf-g-ease); }
.asf-g-print:hover { transform: rotate(0deg) translateY(-8px); }
.asf-g-print figure { margin: 0; padding: 14px 14px 18px; background: #FBF5E9; box-shadow: var(--asf-g-shadow); }
.asf-g-print__img { overflow: hidden; }
.asf-g-print__img .asf-g-art { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; -webkit-user-drag: none; filter: sepia(.55) contrast(1.04) brightness(1.02); transition: filter .8s, transform 1.2s var(--asf-g-ease); }
.asf-g-print:hover .asf-g-art { filter: sepia(.15) contrast(1.08); transform: scale(1.04); }
.asf-g-print figcaption { margin-top: 14px; text-align: center; font: italic 500 1.25rem/1.3 var(--asf-g-display); color: var(--asf-g-ink); }

.asf-g-album__controls { display: flex; align-items: center; gap: 22px; margin-top: -40px; position: relative; }
.asf-g-album__progress { position: relative; flex: 1; height: 2px; background: rgba(42, 30, 23, .14); overflow: hidden; border-radius: 2px; }
.asf-g-album__progress span { position: absolute; left: 0; top: 0; bottom: 0; width: 30%; background: linear-gradient(90deg, var(--asf-g-gold), var(--asf-g-burgundy)); border-radius: 2px; transition: transform .15s linear; }
.asf-g-album__arrow {
	flex: 0 0 auto; width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
	border: 1px solid rgba(122, 31, 26, .35); background: rgba(255, 249, 238, .7); color: var(--asf-g-burgundy);
	transition: background .3s, color .3s, border-color .3s, opacity .3s, transform .3s var(--asf-g-ease);
}
.asf-g-album__arrow svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.asf-g-album__arrow:hover:not(:disabled) { background: var(--asf-g-burgundy); border-color: var(--asf-g-burgundy); color: var(--asf-g-cream); transform: scale(1.06); }
.asf-g-album__arrow:disabled { opacity: .35; cursor: default; }

/* the "Drag" cursor (mouse only, shown by JS while over the strip) */
.asf-g-dragcursor {
	position: fixed; left: 0; top: 0; z-index: 70; pointer-events: none;
	width: 96px; height: 96px; margin: -48px 0 0 -48px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center; gap: 6px;
	background: rgba(122, 31, 26, .92); color: var(--asf-g-cream);
	box-shadow: 0 14px 30px -12px rgba(60, 10, 6, .6);
	font: 600 0.806rem/1 var(--asf-g-display); letter-spacing: .2em; text-transform: uppercase;
	opacity: 0; scale: .4; transition: opacity .25s, scale .35s var(--asf-g-ease);
}
.asf-g-dragcursor.is-on { opacity: 1; scale: 1; }
.asf-g-dragcursor.is-down { scale: .82; }
.asf-g-dragcursor__arrow { font: 400 1.1rem/1 var(--asf-g-display); letter-spacing: 0; opacity: .8; transition: transform .35s var(--asf-g-ease); }
.asf-g-dragcursor.is-down .asf-g-dragcursor__arrow:first-child { transform: translateX(-4px); }
.asf-g-dragcursor.is-down .asf-g-dragcursor__arrow:last-child { transform: translateX(4px); }
@media (hover: none), (pointer: coarse) { .asf-g-dragcursor { display: none; } }
@media (max-width: 760px) {
	.asf-g-print { width: 78vw; scroll-snap-align: center; }
	.asf-g-album__arrow { width: 44px; height: 44px; }
}

/* ---------- 6 · sample ---------- */
.asf-g-sample { position: relative; overflow: hidden; padding: clamp(90px, 12vw, 170px) 0; background: #3B2618; }
.asf-g-sample__bg { position: absolute; inset: -12% 0; will-change: transform; }
.asf-g-sample__bg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.55) saturate(.9); }
.asf-g-page-sheet {
	position: relative; max-width: 44rem; margin-inline: auto;
	padding: clamp(40px, 7vw, 80px) clamp(26px, 7vw, 86px) clamp(36px, 5vw, 56px);
	background:
		url('../img/paper-texture.webp') repeat,
		linear-gradient(180deg, #FBF5E8, #F3E8D2);
	background-size: 768px, auto;
	box-shadow: 0 50px 90px -40px rgba(0, 0, 0, .75), 0 0 0 1px rgba(122, 31, 26, .08);
	border-radius: 2px;
}
.asf-g-page-sheet::before { content: ''; position: absolute; inset: 14px; border: 1px solid rgba(122, 31, 26, .14); pointer-events: none; }
.asf-g-page-sheet__head { text-align: center; }
.asf-g-page-sheet__title { margin-top: .8rem; font-size: clamp(2rem, 4vw, 2.8rem); font-style: italic; font-weight: 500; }
.asf-g-page-sheet__kicker { margin-top: .4rem; font-size: .92rem; color: var(--asf-g-muted); font-style: italic; }
.asf-g-page-sheet__body { margin-top: 2rem; font-size: 1.1rem; line-height: 1.85; color: var(--asf-g-ink); hyphens: auto; }
.asf-g-page-sheet__body p { text-indent: 1.6em; }
.asf-g-page-sheet__body p:first-child { text-indent: 0; }
.asf-g-page-sheet__body p:first-child::first-letter { float: left; font: 700 3.6em/.8 var(--asf-g-display); color: var(--asf-g-burgundy); margin: .08em .1em 0 0; }
.asf-g-page-sheet__foot { margin-top: 2.4rem; display: flex; flex-direction: column; align-items: center; gap: 1.4rem; }
.asf-g-page-sheet__folio { font: italic .9rem/1 var(--asf-g-display); color: var(--asf-g-muted); }

/* ---------- 7 · author ---------- */
.asf-g-author { position: relative; overflow-x: clip; padding: clamp(90px, 12vw, 170px) 0; }
.asf-g-author__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(40px, 8vw, 120px); align-items: center; }
.asf-g-author__portrait { position: relative; margin: 0; }
.asf-g-author__frame { position: relative; overflow: hidden; padding: 12px; background: var(--asf-g-cream); box-shadow: var(--asf-g-shadow); transform: rotate(-1.2deg); }
.asf-g-author__frame .asf-g-art { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.asf-g-author__portrait figcaption { margin-top: 1rem; font: italic .92rem/1.4 var(--asf-g-display); color: var(--asf-g-muted); text-align: right; padding-right: 6px; }
.asf-g-author__corner { position: absolute; left: -46px; bottom: 20px; width: 48%; pointer-events: none; z-index: 2; }
.asf-g-author__copy > p { font-size: 1.1rem; margin-top: 1.4rem; }
.asf-g-author__copy > p + p { margin-top: 1rem; }
.asf-g-author__sign { margin-top: 2rem !important; font: italic 500 2.4rem/1 var(--asf-g-display) !important; color: var(--asf-g-burgundy); }
@media (max-width: 860px) {
	.asf-g-author__grid { grid-template-columns: 1fr; }
	.asf-g-author__portrait { max-width: 420px; }
	.asf-g-author__corner { left: -20px; width: 50%; }
}

/* ---------- 8 · get the book ---------- */
.asf-g-buy { position: relative; overflow: hidden; padding: clamp(100px, 13vw, 180px) 0; color: rgba(255, 244, 225, .88); background: #1E1A26; }
.asf-g-buy__bg { position: absolute; inset: -12% 0; will-change: transform; }
.asf-g-buy__bg img { width: 100%; height: 100%; object-fit: cover; }
.asf-g-buy__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(18, 14, 24, .35) 0%, rgba(18, 14, 24, .7) 45%, rgba(18, 14, 24, .88) 100%); }
.asf-g-buy .asf-g-wrap { position: relative; z-index: 2; }
.asf-g-buy__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(40px, 8vw, 110px); align-items: center; }
.asf-g-buy__book { display: flex; justify-content: center; perspective: 1400px; }
.asf-g-preorder { margin-top: 1.6rem; }
.asf-g-preorder__title { color: var(--asf-g-gold-l); font-size: 1.5rem; font-style: italic; font-weight: 400; }
.asf-g-preorder p { margin-top: .8rem; max-width: 34rem; }
.asf-g-formats { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; gap: 14px; }
.asf-g-format { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 24px; border: 1px solid rgba(235, 194, 122, .3); border-radius: var(--asf-g-radius); background: rgba(255, 249, 238, .06); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.asf-g-format__name { color: var(--asf-g-cream); font-size: 1.35rem; }
.asf-g-format p { font-size: .95rem; margin-top: .3rem; }
.asf-g-buy .asf-g-btn { background: var(--asf-g-gold); border-color: var(--asf-g-gold); color: #2A1608; }
.asf-g-buy .asf-g-btn:hover { background: var(--asf-g-gold-l); border-color: var(--asf-g-gold-l); }
.asf-g-buy .asf-g-btn--ghost { background: transparent; color: var(--asf-g-gold-l); }
@media (max-width: 860px) {
	.asf-g-buy__grid { grid-template-columns: 1fr; }
	.asf-g-buy__shade { background: linear-gradient(180deg, rgba(18, 14, 24, .5), rgba(18, 14, 24, .88)); }
}

/* ---------- forms ---------- */
.asf-g-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.asf-g-form { margin-top: 1.8rem; }
.asf-g-form__label { display: block; font: 600 0.829rem/1 var(--asf-g-display); letter-spacing: .2em; text-transform: uppercase; margin-bottom: .8rem; color: var(--asf-g-gold-l); }
.asf-g-form__row { display: flex; gap: 10px; flex-wrap: wrap; max-width: 34rem; }
.asf-g-form__row input { flex: 1 1 220px; }
.asf-g-form input, .asf-g-form select, .asf-g-form textarea {
	width: 100%; padding: .95em 1.1em; border-radius: var(--asf-g-radius); border: 1px solid var(--asf-g-line);
	background: var(--asf-g-cream); color: var(--asf-g-ink); font-size: 1rem; transition: border-color .3s, box-shadow .3s;
}
.asf-g-form--inline input { border-color: rgba(235, 194, 122, .5); background: rgba(255, 249, 238, .95); border-radius: 999px; padding-inline: 1.4em; }
.asf-g-form input:focus, .asf-g-form select:focus, .asf-g-form textarea:focus { outline: none; border-color: var(--asf-g-gold); box-shadow: 0 0 0 4px rgba(200, 144, 46, .22); }
.asf-g-form__note { margin-top: .8rem; font-size: .9rem; opacity: .85; }
.asf-g-form__note.is-ok { color: var(--asf-g-sage); opacity: 1; }
.asf-g-buy .asf-g-form__note.is-ok { color: var(--asf-g-gold-l); }
.asf-g-form__note.is-err { color: #B3261E; opacity: 1; }
.asf-g-buy .asf-g-form__note.is-err { color: #FFB4A8; }
.asf-g-form.is-busy button { opacity: .6; pointer-events: none; }

/* ---------- 9 · contact ---------- */
/* The contact section ends in a painted dusk (paper → apricot → rose → dusk
   violet → night), never paper-over-dark, which would read as grey. */
.asf-g-contact {
	position: relative; z-index: 2; overflow: hidden; padding: clamp(90px, 12vw, 160px) 0 clamp(300px, 28vw, 380px);
	background: linear-gradient(180deg,
		var(--asf-g-paper) 0%,
		var(--asf-g-paper) calc(100% - 300px),
		#F3E0C6 calc(100% - 262px),
		#EDC79E calc(100% - 224px),
		#DFA37C calc(100% - 186px),
		#B97A6C calc(100% - 146px),
		#7E5466 calc(100% - 104px),
		#463453 calc(100% - 60px),
		#221E37 100%);
}
.asf-g-contact__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 7vw, 100px); align-items: start; }
.asf-g-contact__head p { margin-top: 1.2rem; font-size: 1.1rem; }
.asf-g-contact__corner { position: absolute; right: -60px; top: 30px; width: clamp(200px, 26vw, 380px); transform: scaleX(-1) rotate(-6deg); opacity: .85; pointer-events: none; }
.asf-g-form--card {
	margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 20px;
	padding: clamp(26px, 4vw, 44px); background: rgba(255, 249, 238, .85); border: 1px solid var(--asf-g-line); border-radius: 8px;
	box-shadow: 0 30px 60px -40px rgba(42, 20, 8, .5);
}
.asf-g-field { display: flex; flex-direction: column; gap: 8px; }
.asf-g-field label { font: 600 0.829rem/1 var(--asf-g-display); letter-spacing: .16em; text-transform: uppercase; color: var(--asf-g-ink); }
.asf-g-field--full { grid-column: 1 / -1; }
.asf-g-form textarea { resize: vertical; min-height: 140px; }
.asf-g-form__actions { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 16px; }
.asf-g-form__actions .asf-g-form__note { margin: 0; color: var(--asf-g-muted); }
@media (max-width: 860px) {
	.asf-g-contact__grid { grid-template-columns: 1fr; }
	.asf-g-form--card { grid-template-columns: 1fr; }
}

/* ---------- 10 · closing (night) ---------- */
.asf-g-closing::before {
	content: ''; position: absolute; left: 0; right: 0; top: 0; height: 220px; pointer-events: none; z-index: -1;
	background: linear-gradient(180deg, #221E37 0%, rgba(34, 30, 55, .6) 45%, rgba(34, 30, 55, 0) 100%);
}
.asf-g-closing { position: relative; z-index: 2; min-height: 92vh; display: grid; place-items: center; text-align: center; padding: 120px var(--asf-g-gutter) 140px; color: rgba(255, 244, 225, .9); }
.asf-g-closing__hat { width: clamp(150px, 18vw, 230px); margin: 0 auto 2.6rem; filter: drop-shadow(0 20px 30px rgba(0, 0, 0, .5)); }
.asf-g-closing__verse { margin: 0; }
.asf-g-closing__verse p { display: flex; flex-direction: column; gap: .15em; font: italic 500 clamp(1.85rem, 4vw, 3.1rem)/1.28 var(--asf-g-display); color: var(--asf-g-cream); }
.asf-g-closing__verse cite { display: block; margin-top: 2rem; font: 600 0.874rem/1 var(--asf-g-display); font-style: normal; letter-spacing: .24em; text-transform: uppercase; color: var(--asf-g-gold-l); }

/* ---------- footer (centred, symmetrical) ---------- */
.asf-g-footer { position: relative; z-index: 2; background: #0C0C16; color: rgba(255, 244, 225, .7); padding: clamp(64px, 8vw, 96px) 0 0; border-top: 1px solid rgba(235, 194, 122, .15); }
.asf-g-footer__wrap { width: min(100% - 2 * var(--asf-g-gutter), var(--asf-g-wrap)); margin-inline: auto; text-align: center; }
.asf-g-footer__brand { display: flex; flex-direction: column; align-items: center; }
.asf-g-footer__emblem { width: 76px; height: auto; margin-bottom: 16px; }
.asf-g-footer__title { font: 600 clamp(1.7rem, 2.7vw, 2.2rem)/1.1 var(--asf-g-display); color: var(--asf-g-cream); letter-spacing: .01em; }
.asf-g-footer__by { margin-top: .6rem; font-style: italic; font-size: .98rem; }
.asf-g-footer__by i { margin: 0 .6em; font-style: normal; color: var(--asf-g-gold); }
.asf-g-footer__nav {
	display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 0;
	margin: clamp(34px, 4vw, 46px) auto 0; padding: 22px 0; max-width: 56rem;
	border-top: 1px solid rgba(235, 194, 122, .16); border-bottom: 1px solid rgba(235, 194, 122, .16);
}
.asf-g-footer__nav a { position: relative; padding: 0 clamp(14px, 2vw, 26px); font: 500 1.075rem/1.4 var(--asf-g-display); letter-spacing: .02em; }
.asf-g-footer__nav a + a::before { content: ''; position: absolute; left: 0; top: 50%; width: 3px; height: 3px; margin-top: -1.5px; border-radius: 50%; background: var(--asf-g-gold); opacity: .7; }
.asf-g-footer a { text-decoration: none; transition: color .3s; }
.asf-g-footer a:hover { color: var(--asf-g-gold-l); }
.asf-g-footer__bottom {
	display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px 30px;
	max-width: 56rem; margin: 0 auto; padding: 26px 0 34px;
	font: 400 .86rem/1.5 var(--asf-g-text);
}
.asf-g-footer__copy { text-align: left; }
.asf-g-footer__meta { display: flex; gap: 10px; justify-content: center; }
.asf-g-footer__meta:empty { display: block; }
.asf-g-footer__credit { margin: 0; text-align: right; color: rgba(235, 194, 122, .8); }
@media (max-width: 760px) {
	.asf-g-footer__by span { display: block; }
	.asf-g-footer__by i { display: none; }
	.asf-g-footer__nav { display: grid; grid-template-columns: repeat(3, auto); justify-content: center; gap: 12px 22px; }
	.asf-g-footer__nav a { padding: 0; }
	.asf-g-footer__nav a + a::before { display: none; }
	.asf-g-footer__bottom { grid-template-columns: 1fr; text-align: center; gap: 6px; padding-bottom: 96px; }
	.asf-g-footer__copy, .asf-g-footer__credit { text-align: center; }
	.asf-g-footer__meta:empty { display: none; }
}

/* floating back-to-top with a reading-progress ring */
.asf-g-totop {
	position: fixed; right: clamp(16px, 2.4vw, 32px); bottom: clamp(16px, 2.4vw, 32px); z-index: 55;
	width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center;
	background: rgba(18, 16, 30, .78); color: var(--asf-g-gold-l);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	box-shadow: 0 12px 28px -12px rgba(0, 0, 0, .6);
	opacity: 0; transform: translateY(16px) scale(.9); pointer-events: none;
	transition: opacity .4s var(--asf-g-ease), transform .4s var(--asf-g-ease), background .3s, color .3s;
}
.asf-g-totop.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.asf-g-nav-open .asf-g-totop { opacity: 0; pointer-events: none; }
.asf-g-totop:hover { background: var(--asf-g-gold); color: #2A1608; }
.asf-g-totop:hover .asf-g-totop__arrow { transform: translateY(-2px); }
.asf-g-totop__ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.asf-g-totop__ring circle { fill: none; stroke-width: 2; }
.asf-g-totop__track { stroke: rgba(235, 194, 122, .2); }
.asf-g-totop__fill { stroke: var(--asf-g-gold); stroke-linecap: round; stroke-dasharray: 163.4; stroke-dashoffset: 163.4; }
.asf-g-totop__arrow { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s var(--asf-g-ease); }

/* ---------- plain pages ---------- */
.asf-g-prose-page { padding: 150px 0 110px; min-height: 70vh; }
.asf-g-prose { width: min(100% - 2 * var(--asf-g-gutter), 46rem); margin-inline: auto; }
.asf-g-prose--center { text-align: center; }
.asf-g-prose__body { margin-top: 1.6rem; }
.asf-g-prose__body h2, .asf-g-prose__body h3 { margin: 1.8em 0 .6em; }
.asf-g-prose__body a { color: var(--asf-g-burgundy); }
.asf-g-prose .asf-g-btn { margin-top: 1.6rem; }

/* ---------- image placeholder ---------- */
.asf-g-imgph { display: grid; place-items: center; aspect-ratio: 4 / 3; background: repeating-linear-gradient(135deg, #EDE1CA 0 12px, #E6D7BC 12px 24px); color: var(--asf-g-muted); font: italic 1rem var(--asf-g-display); text-align: center; padding: 20px; }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
	.asf-g-canvas, .asf-g-glow { display: none; }
	[data-asf-g-develop] .asf-g-art { filter: none; transform: none; }
}