/* ==========================================================================
   Atelier — Eléna Vance · Hand-drawn sketchbook edition
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root {
	--paper: #F8F5EE;
	--paper-2: #F4F0E6;
	--paper-3: #F0ECE1;
	--paper-4: #E8E2D5;
	--card: #FDFCF9;
	--ink: #201E1C;
	--ink-2: #4E4942;
	--pencil: #635D55;
	--muted: #6E685F;
	--line: #CEC7BB;
	--ochre: #A87A3A;
	--tape: rgba(236, 228, 208, .92);
	--ok: #3F6B3A;
	--err: #A3341F;

	--serif: "Playfair Display", Georgia, "Times New Roman", serif;
	--sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--hand: "Caveat", "Segoe Print", cursive;

	--gutter: clamp(1rem, 4vw, 4rem);
	--maxw: 1320px;
	--header-h: 78px;
	--ease: cubic-bezier(.16, 1, .3, 1);
	--ease-in-out: cubic-bezier(.65, 0, .35, 1);

	--r-sketch: 255px 15px 225px 15px / 15px 225px 15px 255px;
	--r-subtle: 185px 12px 195px 14px / 14px 195px 12px 185px;
	--r-pill: 999px 985px 1010px 995px / 990px 1015px 985px 1005px;
	--r-card: 255px 20px 225px 20px / 20px 225px 20px 255px;
	--shadow-ink: 4px 4px 0 var(--ink);
}

@media (max-width: 960px) {
	:root { --header-h: 68px; }
}

/* ---------- 2. Base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	overflow-x: hidden;
}
@supports (overflow: clip) { html { overflow-x: clip; } }

body {
	margin: 0;
	font-family: var(--sans);
	font-size: 16px;
	line-height: 1.65;
	color: var(--ink);
	background-color: var(--paper);
	background-image:
		radial-gradient(#D9D2C6 .75px, transparent .75px),
		radial-gradient(#E8E1D3 .75px, transparent .75px);
	background-size: 24px 24px;
	background-position: 0 0, 12px 12px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
	min-height: 100vh;
}
@supports (overflow: clip) { body { overflow-x: clip; } }
body.nav-open { overflow: hidden; }

img, svg, video, iframe { max-width: 100%; }
img { height: auto; display: block; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	font-family: var(--serif);
	font-weight: 500;
	line-height: 1.15;
	letter-spacing: -.01em;
	color: var(--ink);
	overflow-wrap: break-word;
}
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
::selection { background: #E2DAC9; color: var(--ink); }
:focus-visible { outline: 2px dashed var(--ink); outline-offset: 3px; }
[id] { scroll-margin-top: calc(var(--header-h) + 24px); }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link {
	position: fixed; top: -100px; left: 1rem; z-index: 1000;
	background: var(--ink); color: var(--paper); padding: .75rem 1rem;
}
.skip-link:focus { top: 1rem; }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.icon { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.18em; }
.icon--lg { width: 2.4rem; height: 2.4rem; }

/* ---------- 3. Layout ---------- */
.container {
	width: 100%;
	max-width: var(--maxw);
	margin-inline: auto;
	padding-inline: var(--gutter);
	position: relative;
}
.container--narrow { max-width: calc(780px + 2 * var(--gutter)); }
.container--wide { max-width: calc(1120px + 2 * var(--gutter)); }

.section { padding-block: clamp(3.5rem, 8vw, 6.5rem); position: relative; }
.section--tight-top { padding-top: clamp(1rem, 3vw, 2rem); }
.section--flush-top { padding-top: 0; }
.section--clip { overflow: hidden; }

.grid-2, .grid-3, .grid-4, .cards-2 { display: grid; gap: clamp(1.25rem, 2.6vw, 2.5rem); }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cards-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }

@media (max-width: 1100px) { .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1024px) { .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px)  { .grid-2 { grid-template-columns: 1fr; } }
@media (max-width: 640px)  {
	.grid-3, .grid-4 { grid-template-columns: 1fr; }
	.cards-2 { grid-template-columns: 1fr; }
}

.row-between { display: flex; align-items: center; justify-content: space-between; gap: .5rem 1rem; flex-wrap: wrap; }
.stack > * + * { margin-top: 1rem; }
.actions-row { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.25rem; margin-top: 1.75rem; }
.actions-row--center { justify-content: center; }

/* ---------- 4. Typography ---------- */
.display { font-size: clamp(2.5rem, 6vw, 5.25rem); line-height: 1.03; letter-spacing: -.025em; font-weight: 500; }
.h1 { font-size: clamp(2rem, 4.2vw, 3.35rem); line-height: 1.08; letter-spacing: -.02em; }
.h2 { font-size: clamp(1.6rem, 3vw, 2.35rem); line-height: 1.15; }
.h3 { font-size: clamp(1.35rem, 2.1vw, 1.7rem); line-height: 1.2; }
.h4 { font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1.3; font-weight: 600; }
.lead { font-size: clamp(1.02rem, 1.35vw, 1.16rem); line-height: 1.75; color: var(--ink-2); }
.body-sm { font-size: .9rem; line-height: 1.55; }
.muted { color: var(--ink-2); }
.ochre { color: var(--ochre) !important; }
.dot { color: var(--line); font-weight: 600; }

.hand {
	font-family: var(--hand);
	font-weight: 600;
	font-size: 1.2rem;
	line-height: 1.15;
	color: var(--pencil);
	letter-spacing: .01em;
}
.hand--lg { font-size: clamp(1.3rem, 1.8vw, 1.5rem); }
.hand--xl { font-size: clamp(1.6rem, 2.4vw, 2rem); color: var(--ink); }

.caps {
	font-family: var(--sans);
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	line-height: 1.4;
	color: var(--ink);
}
.caps--muted { color: var(--muted); }

.eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .65rem; margin-bottom: .9rem; }

/* ---------- 5. Sketch shapes ---------- */
.sk {
	border: 2px solid var(--ink);
	border-width: 1.8px 2.4px 2.2px 1.6px;
	border-radius: var(--r-sketch);
}
.sk-subtle {
	border: 1.5px solid #55504A;
	border-width: 1.3px 1.8px 1.5px 1.6px;
	border-radius: var(--r-subtle);
}
.sk-pill {
	border: 1.8px solid var(--ink);
	border-width: 2px 1.6px 1.8px 2.1px;
	border-radius: var(--r-pill);
}
.sk-card {
	position: relative;
	background: var(--card);
	border: 2px solid #2A251D;
	border-radius: var(--r-card);
	box-shadow: 3px 4px 0 rgba(36, 31, 21, .15);
}
.sk-stamp {
	border: 1.5px dashed #4A453E;
	border-radius: 12px 2px 15px 3px / 4px 14px 3px 12px;
}

.tape {
	position: absolute;
	z-index: 4;
	height: 26px;
	min-width: 84px;
	padding: 0 .75rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--tape);
	border-inline: 2px dashed rgba(196, 184, 160, .65);
	box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
	font-family: var(--hand);
	font-size: 1rem;
	font-weight: 700;
	color: var(--pencil);
	white-space: nowrap;
	pointer-events: none;
}
.tape--tl { top: -13px; left: 1.5rem; transform: rotate(-3deg); }
.tape--tr { top: -13px; right: 1.5rem; transform: rotate(3.5deg); }
.tape--tc { top: -13px; left: 50%; transform: translateX(-50%) rotate(var(--tilt, -1.5deg)); }
.tape--br { bottom: -13px; right: 1.5rem; transform: rotate(-4deg); }

.grid-bg {
	background-image:
		linear-gradient(to right, rgba(68, 64, 60, .05) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(68, 64, 60, .05) 1px, transparent 1px);
	background-size: 32px 32px;
}
.hatch {
	background-image: repeating-linear-gradient(-45deg, rgba(50, 45, 40, .035), rgba(50, 45, 40, .035) 1.5px, transparent 1.5px, transparent 7px);
}
.band {
	background-color: var(--paper-2);
	border-block: 1.8px solid rgba(45, 41, 38, .22);
}
.band__watermark {
	position: absolute;
	right: var(--gutter);
	top: -1.25rem;
	font-size: clamp(2rem, 4.4vw, 3.4rem);
	color: rgba(32, 30, 28, .14);
	transform: rotate(3deg);
	pointer-events: none;
	user-select: none;
	white-space: nowrap;
}
@media (max-width: 760px) { .band__watermark { display: none; } }

/* ---------- 6. Buttons & links ---------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	padding: .9rem 1.5rem;
	min-height: 48px;
	font-family: var(--sans);
	font-size: .76rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	line-height: 1.2;
	text-align: center;
	color: var(--ink);
	background: var(--card);
	border: 2px solid var(--ink);
	border-width: 1.8px 2.4px 2.2px 1.6px;
	border-radius: var(--r-sketch);
	box-shadow: 2px 2px 0 var(--ink);
	transition: transform .22s var(--ease), box-shadow .22s var(--ease), background-color .2s, color .2s;
	-webkit-tap-highlight-color: transparent;
}
.btn:hover { transform: translate(-2px, -2px); box-shadow: var(--shadow-ink); }
.btn:active { transform: translate(1px, 1px); box-shadow: 0 0 0 var(--ink); }
.btn--primary { background: var(--ink); color: var(--paper); }
.btn--primary:hover { box-shadow: 4px 4px 0 var(--ochre); }
.btn--sm { padding: .55rem 1rem; min-height: 40px; font-size: .7rem; letter-spacing: .1em; }
.btn--lg { padding: 1.05rem 1.9rem; min-height: 54px; font-size: .8rem; }
.btn--block { width: 100%; }
.hand-arrow {
	font-family: var(--hand);
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	line-height: 1;
	transition: transform .25s var(--ease);
}
.btn:hover .hand-arrow { transform: translateX(4px) rotate(-6deg); }

.link-arrow {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	font-size: .76rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ink);
	position: relative;
	padding-bottom: 3px;
}
.link-arrow .hand { font-size: 1.4rem; color: var(--ink); transition: transform .25s var(--ease); }
.link-arrow:hover .hand { transform: translateX(5px); }
.link-arrow--back:hover .hand { transform: translateX(-5px); }
.link-arrow::after,
.link-line::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 2px;
	background: currentColor;
	border-radius: 40% 60% 50% 50% / 60% 50% 60% 40%;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .35s var(--ease);
}
.link-arrow:hover::after, .link-line:hover::after { transform: scaleX(1); }
.link-line { position: relative; display: inline-flex; align-items: center; gap: .45rem; padding-bottom: 2px; }

/* ---------- 7. Loader ---------- */
.loader { display: none; }
.show-loader .loader {
	position: fixed;
	inset: 0;
	z-index: 2000;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--paper);
	transition: clip-path .9s var(--ease-in-out), opacity .6s;
	clip-path: inset(0 0 0 0);
}
.loader-out .loader { clip-path: inset(0 0 100% 0); }
.loader__inner { display: flex; flex-direction: column; align-items: center; gap: .25rem; }
.loader__name {
	font-family: var(--serif);
	font-size: clamp(2.2rem, 7vw, 3.8rem);
	letter-spacing: -.02em;
	animation: loaderIn 1s var(--ease) both;
}
.loader__line { width: min(280px, 70vw); height: 18px; color: var(--ink); }
.loader__line path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 1.1s .35s var(--ease) forwards; }
.loader__tag { animation: loaderIn 1s .55s var(--ease) both; font-size: 1.35rem; }
@keyframes loaderIn { from { opacity: 0; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }

/* ---------- 8. Header ---------- */
.scroll-progress {
	position: fixed;
	inset: 0 0 auto 0;
	height: 2px;
	z-index: 120;
	background: var(--ink);
	transform-origin: left;
	transform: scaleX(var(--progress, 0));
	pointer-events: none;
}

.site-header {
	position: fixed;
	inset: 0 0 auto 0;
	z-index: 110;
	background: rgba(248, 245, 238, .86);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-bottom: 1.5px solid rgba(32, 30, 28, .16);
	transition: transform .5s var(--ease), background-color .3s, box-shadow .3s;
}
.site-header.is-scrolled { background: rgba(248, 245, 238, .97); box-shadow: 0 10px 24px -18px rgba(32, 30, 28, .45); }
.site-header.is-hidden { transform: translateY(-101%); }
.js .site-header { animation: headerIn .9s .1s var(--ease) both; }
.show-loader:not(.is-loaded) .site-header { animation-play-state: paused; }
@keyframes headerIn { from { translate: 0 -100%; } to { translate: 0 0; } }

.header-inner {
	height: var(--header-h);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
.brand { display: flex; flex-direction: column; line-height: 1; min-width: 0; }
.brand__name {
	font-family: var(--serif);
	font-size: clamp(1.25rem, 2vw, 1.5rem);
	font-weight: 600;
	letter-spacing: -.01em;
	white-space: nowrap;
}
.brand__tag {
	font-family: var(--hand);
	font-size: 1.05rem;
	font-weight: 600;
	color: var(--pencil);
	margin-top: .2rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.main-nav .nav-list { display: flex; align-items: center; gap: clamp(1rem, 2.3vw, 2.4rem); list-style: none; margin: 0; padding: 0; }
.main-nav a {
	position: relative;
	display: inline-block;
	padding: .45rem 0;
	font-size: .76rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ink-2);
	transition: color .2s;
}
.main-nav a::after {
	content: "";
	position: absolute;
	left: -3px; right: -3px; bottom: 0;
	height: 2.4px;
	background: var(--ink);
	border-radius: 40% 60% 50% 50% / 60% 50% 60% 40%;
	transform: scaleX(0) rotate(-1deg);
	transform-origin: left;
	transition: transform .35s var(--ease);
}
.main-nav a:hover,
.main-nav .current-menu-item > a,
.main-nav .current_page_parent > a,
.main-nav a[aria-current="page"] { color: var(--ink); }
.main-nav a:hover::after,
.main-nav .current-menu-item > a::after,
.main-nav .current_page_parent > a::after,
.main-nav a[aria-current="page"]::after { transform: scaleX(1) rotate(-1deg); }

.header-actions { display: flex; align-items: center; gap: .75rem; }
.search-toggle { gap: .5rem; padding-inline: 1rem .75rem; }
.search-toggle .icon { width: 18px; height: 18px; transition: transform .35s var(--ease); }
.search-toggle:hover .icon { transform: rotate(-12deg) scale(1.1); }
.search-toggle__kbd {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 .3rem;
	font-family: var(--sans);
	font-size: .72rem;
	font-weight: 700;
	color: var(--pencil);
	background: var(--paper-3);
	border: 1.2px solid rgba(32, 30, 28, .35);
	border-radius: 5px 3px 6px 3px;
}

.nav-toggle {
	display: none;
	position: relative;
	width: 48px;
	height: 48px;
	padding: 0;
	background: var(--card);
	border: 1.8px solid var(--ink);
	border-radius: var(--r-pill);
	box-shadow: 2px 2px 0 var(--ink);
}
.nav-toggle span {
	position: absolute;
	left: 13px;
	right: 13px;
	height: 2px;
	background: var(--ink);
	border-radius: 2px;
	transition: transform .35s var(--ease), opacity .2s, top .35s var(--ease);
}
.nav-toggle span:nth-child(1) { top: 16px; }
.nav-toggle span:nth-child(2) { top: 22.5px; right: 17px; }
.nav-toggle span:nth-child(3) { top: 29px; }
.nav-open .nav-toggle span:nth-child(1) { top: 22.5px; transform: rotate(45deg); }
.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
.nav-open .nav-toggle span:nth-child(3) { top: 22.5px; transform: rotate(-45deg); }

.mobile-nav {
	position: fixed;
	inset: 0;
	z-index: 105;
	background-color: var(--paper);
	background-image:
		linear-gradient(to right, rgba(68, 64, 60, .05) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(68, 64, 60, .05) 1px, transparent 1px);
	background-size: 32px 32px;
	clip-path: circle(0 at calc(100% - 44px) 38px);
	visibility: hidden;
	transition: clip-path .7s var(--ease-in-out), visibility 0s .7s;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
.nav-open .mobile-nav {
	clip-path: circle(150% at calc(100% - 44px) 38px);
	visibility: visible;
	transition: clip-path .8s var(--ease-in-out), visibility 0s 0s;
}
.mobile-nav__inner {
	min-height: 100%;
	display: flex;
	flex-direction: column;
	padding: calc(var(--header-h) + 2rem) var(--gutter) 2rem;
}
.mobile-nav__kicker { margin-bottom: 1rem; }
.mobile-nav .nav-list { list-style: none; margin: 0; padding: 0; }
.mobile-nav .nav-list li {
	border-bottom: 1.5px dashed rgba(32, 30, 28, .2);
	opacity: 0;
	translate: 0 24px;
	transition: opacity .5s var(--ease), translate .6s var(--ease);
}
.nav-open .mobile-nav .nav-list li { opacity: 1; translate: 0 0; }
.nav-open .mobile-nav .nav-list li:nth-child(1) { transition-delay: .18s; }
.nav-open .mobile-nav .nav-list li:nth-child(2) { transition-delay: .24s; }
.nav-open .mobile-nav .nav-list li:nth-child(3) { transition-delay: .30s; }
.nav-open .mobile-nav .nav-list li:nth-child(4) { transition-delay: .36s; }
.nav-open .mobile-nav .nav-list li:nth-child(5) { transition-delay: .42s; }
.nav-open .mobile-nav .nav-list li:nth-child(6) { transition-delay: .48s; }
.mobile-nav .nav-list a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 0;
	font-family: var(--serif);
	font-size: clamp(1.8rem, 8vw, 2.6rem);
	line-height: 1.1;
}
.mobile-nav .nav-list a::after { content: "⤷"; font-family: var(--hand); font-size: 1.6rem; color: var(--pencil); transition: transform .3s var(--ease); }
.mobile-nav .nav-list a:hover::after { transform: translateX(6px); }
.mobile-nav .current-menu-item > a,
.mobile-nav a[aria-current="page"] { font-style: italic; }
.mobile-nav__foot {
	margin-top: auto;
	padding-top: 2rem;
	display: grid;
	gap: 1.25rem;
	opacity: 0;
	transition: opacity .5s .45s;
}
.nav-open .mobile-nav__foot { opacity: 1; }
.mobile-nav__meta { font-size: .9rem; color: var(--ink-2); }

@media (max-width: 1100px) {
	.main-nav { display: none; }
	.nav-toggle { display: inline-block; }
}
@media (max-width: 1100px) { .search-toggle__kbd { display: none; } }
@media (max-width: 600px) {
	.search-toggle { width: 48px; height: 48px; min-height: 48px; padding: 0; border-radius: var(--r-pill); }
	.search-toggle__label { display: none; }
}
@media (max-width: 480px) {
	.brand__tag { font-size: .95rem; }
}
@media (min-width: 1101px) {
	.mobile-nav { display: none; }
}

.site-main { display: block; }

/* ---------- 9. Hero (home) ---------- */
.hero {
	position: relative;
	min-height: 100vh;
	min-height: 100svh;
	display: flex;
	align-items: center;
	padding: calc(var(--header-h) + clamp(2rem, 5vw, 3.5rem)) 0 clamp(4.5rem, 8vw, 6.5rem);
	overflow: hidden;
}
.hero::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 120px;
	background: linear-gradient(to bottom, transparent, rgba(248, 245, 238, .9));
	pointer-events: none;
}
.hero__watermark {
	position: absolute;
	right: -2vw;
	bottom: 4%;
	font-family: var(--hand);
	font-weight: 700;
	font-size: clamp(7rem, 20vw, 17rem);
	line-height: 1;
	color: rgba(32, 30, 28, .045);
	transform: rotate(-7deg);
	pointer-events: none;
	user-select: none;
	white-space: nowrap;
}
/* Animated pencil-sketch background */
.hero__sketch { position: absolute; inset: 0; z-index: 0; pointer-events: none; color: var(--ink); }
.hero__sketch-svg { width: 100%; height: 100%; display: block; overflow: visible; }
.sk-draw { opacity: .3; }
.sk-draw path {
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	/* draw → brief hold → erase in the same direction → repeat, forever */
	animation: sketchLoop 12s cubic-bezier(.55, .1, .35, 1) infinite;
	animation-delay: calc(var(--g, 0s) + var(--i, 0) * .28s);
}
.sk-draw--slow path { animation-duration: 16s; }
.sk-draw--fast path { animation-duration: 6s; }
@keyframes sketchLoop {
	0%   { stroke-dashoffset: 1; }
	42%  { stroke-dashoffset: 0; }
	62%  { stroke-dashoffset: 0; }
	100% { stroke-dashoffset: -1; }
}

/* Living graphite canvas (generative pencil strokes, drawn by main.js) */
.hero__canvas {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	pointer-events: none;
	-webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, .42) 36%, #000 62%);
	mask-image: linear-gradient(90deg, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, .42) 36%, #000 62%);
	opacity: 0;
	transition: opacity 2s ease;
}
.hero__canvas.is-ready { opacity: 1; }

/* Watercolor washes that slowly bloom and morph */
.hero__wash {
	position: absolute;
	z-index: 0;
	pointer-events: none;
	border-radius: 42% 58% 63% 37% / 45% 41% 59% 55%;
	filter: blur(46px);
	opacity: .75;
	animation: washMorph 20s ease-in-out infinite alternate;
	will-change: transform, border-radius;
}
.hero__wash--a {
	width: min(48vw, 760px);
	aspect-ratio: 1;
	right: -6vw;
	top: 6%;
	background: radial-gradient(circle at 35% 35%, rgba(214, 168, 98, .55), rgba(184, 137, 71, .22) 55%, transparent 72%);
}
.hero__wash--b {
	width: min(30vw, 460px);
	aspect-ratio: 1;
	left: 42%;
	bottom: -8%;
	background: radial-gradient(circle at 50% 50%, rgba(138, 152, 132, .42), rgba(138, 152, 132, .12) 58%, transparent 72%);
	animation-duration: 26s;
	animation-direction: alternate-reverse;
}
.hero__wash--c {
	width: min(22vw, 340px);
	aspect-ratio: 1;
	left: -6vw;
	top: 12%;
	background: radial-gradient(circle at 50% 50%, rgba(196, 120, 92, .28), transparent 70%);
	animation-duration: 30s;
}
@keyframes washMorph {
	0%   { border-radius: 42% 58% 63% 37% / 45% 41% 59% 55%; transform: translate(0, 0) rotate(0deg) scale(1); }
	33%  { border-radius: 63% 37% 41% 59% / 38% 62% 38% 62%; transform: translate(-4%, 5%) rotate(40deg) scale(1.1); }
	66%  { border-radius: 36% 64% 52% 48% / 58% 34% 66% 42%; transform: translate(3%, -3%) rotate(-25deg) scale(.94); }
	100% { border-radius: 55% 45% 38% 62% / 46% 57% 43% 54%; transform: translate(-2%, 2%) rotate(15deg) scale(1.05); }
}

.hero.is-paused .sk-draw path,
.hero.is-paused .hero__wash,
.hero.is-paused .rotator__word,
.hero.is-paused .hero__scribble path,
.hero.is-paused .hero__float-a,
.hero.is-paused .hero__float-b,
.hero.is-paused .hero__float-c,
.hero.is-paused .hero__dabs i { animation-play-state: paused; }
.no-js .sk-draw path { stroke-dashoffset: 0; animation: none; }

@media (max-width: 960px) {
	.sk-draw { opacity: .16; }
	.hero__canvas {
		-webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .22) 0%, rgba(0, 0, 0, .22) 52%, #000 80%);
		mask-image: linear-gradient(180deg, rgba(0, 0, 0, .22) 0%, rgba(0, 0, 0, .22) 52%, #000 80%);
	}
	.hero__wash--a { width: 90vw; right: -30vw; top: 45%; }
	.hero__wash--b { width: 60vw; left: -10vw; bottom: 0; }
	.hero__wash--c { display: none; }
}

/* Rotating headline word: Canvas. → Color. → Texture. → Light. */
.hero__em.rotator { display: inline-grid; vertical-align: baseline; }
.rotator__word {
	grid-area: 1 / 1;
	white-space: nowrap;
	padding-right: .08em;
	background: linear-gradient(100deg, var(--ink) 35%, #8A5A2B 70%, var(--ochre));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	clip-path: inset(-20% 100% -30% -6%);
	animation: rotWord 12s var(--ease) infinite;
	animation-delay: calc(var(--w) * 3s);
}
@keyframes rotWord {
	0%   { clip-path: inset(-20% 100% -30% -6%); translate: 0 0; opacity: 1; }
	7%   { clip-path: inset(-20% -12% -30% -6%); }
	21%  { clip-path: inset(-20% -12% -30% -6%); translate: 0 0; opacity: 1; }
	25%  { clip-path: inset(-20% -12% -30% -6%); translate: 0 -.35em; opacity: 0; }
	26%, 100% { clip-path: inset(-20% 100% -30% -6%); translate: 0 0; opacity: 0; }
}
.is-loaded .hero__scribble path,
.hero__scribble path { animation: scribbleLoop 3s var(--ease) infinite; }
.hero__scribble path + path { animation-delay: .15s; }
@keyframes scribbleLoop {
	0%, 8% { stroke-dashoffset: 1; }
	40%    { stroke-dashoffset: 0; }
	78%    { stroke-dashoffset: 0; }
	96%, 100% { stroke-dashoffset: -1; }
}

/* Floating gallery pieces (individual transform props — no clash with parallax/tilt) */
.hero__visual { transform: perspective(1400px) rotateX(var(--tx, 0deg)) rotateY(var(--ty, 0deg)); transition: transform 1.1s var(--ease); }
.hero__float-a { animation: floatA 9s ease-in-out infinite; }
.hero__float-b { animation: floatB 11s ease-in-out infinite; }
.hero__float-c { animation: floatC 8s ease-in-out infinite; }
@keyframes floatA { 0%, 100% { translate: 0 0; } 50% { translate: 0 -14px; } }
@keyframes floatB { 0%, 100% { translate: 0 0; rotate: 0deg; } 50% { translate: 8px -12px; rotate: 2deg; } }
@keyframes floatC { 0%, 100% { translate: 0 0; rotate: 0deg; } 50% { translate: -6px -10px; rotate: -3deg; } }

/* Paint palette card */
.hero__palette-wrap { position: absolute; right: -1.25rem; bottom: 9%; z-index: 5; }
.hero__palette {
	display: flex;
	flex-direction: column;
	gap: .35rem;
	padding: .7rem .85rem .75rem;
	transform: rotate(5deg);
	box-shadow: 4px 5px 0 rgba(36, 31, 21, .85);
}
.hero__palette .hand { color: var(--ink); font-size: 1.15rem; }
.hero__palette .caps { font-size: .58rem; }
.hero__dabs { display: flex; gap: .4rem; }
.hero__dabs i {
	width: 22px;
	height: 22px;
	background: var(--c);
	border: 1.4px solid rgba(32, 30, 28, .55);
	border-radius: 58% 42% 52% 48% / 46% 60% 40% 54%;
	box-shadow: inset -3px -3px 0 rgba(0, 0, 0, .12), inset 2px 2px 0 rgba(255, 255, 255, .25);
	animation: dab 4.8s ease-in-out infinite;
	animation-delay: calc(var(--k) * .35s);
}
@keyframes dab {
	0%, 100% { scale: 1; border-radius: 58% 42% 52% 48% / 46% 60% 40% 54%; }
	50% { scale: 1.12; border-radius: 44% 56% 61% 39% / 55% 43% 57% 45%; }
}

/* Live pencil + its doodle — top layer, above every image */
.hero__doodle { position: absolute; left: 0; top: 0; z-index: 8; overflow: visible; pointer-events: none; }
.hero__doodle-path { fill: none; stroke: var(--ochre); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.hero__pencil {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 9;
	width: 64px;
	height: 64px;
	pointer-events: none;
	opacity: 0;
	will-change: transform, opacity;
	filter: drop-shadow(3px 5px 4px rgba(32, 30, 28, .22));
}
.hero__pencil svg { display: block; overflow: visible; }
.hero__pencil .hp-body { fill: #EDC65A; stroke: var(--ink); stroke-width: 1.4; }
.hero__pencil .hp-line { fill: none; stroke: rgba(32, 30, 28, .3); stroke-width: 1; }
.hero__pencil .hp-band { fill: #BDB5A8; stroke: var(--ink); stroke-width: 1.4; }
.hero__pencil .hp-eraser { fill: #E09487; stroke: var(--ink); stroke-width: 1.4; }
.hero__pencil .hp-wood { fill: #F3DFBC; stroke: var(--ink); stroke-width: 1.4; stroke-linejoin: round; }
.hero__pencil .hp-lead { fill: var(--ink); }

@media (max-width: 560px) {
	.hero__palette-wrap { right: -.25rem; bottom: 6%; }
	.hero__palette { padding: .5rem .6rem; }
	.hero__dabs i { width: 16px; height: 16px; }
	.hero__pencil { width: 48px; height: 48px; }
	.hero__pencil svg { width: 48px; height: 48px; }
}

.hero__title.display { font-size: clamp(2.5rem, 4.9vw, 4.6rem); }
.hero__title--long.display { font-size: clamp(2.3rem, 4.3vw, 3.9rem); }

/* Featured artwork awaiting its photograph */
.media--pending { display: flex; align-items: center; justify-content: center; background: repeating-linear-gradient(-45deg, rgba(50, 45, 40, .04), rgba(50, 45, 40, .04) 1.5px, transparent 1.5px, transparent 8px), var(--paper-2); }
.pending { display: flex; flex-direction: column; align-items: center; gap: .6rem; width: 62%; color: var(--pencil); text-align: center; }
.pending svg { width: 100%; height: auto; }
.pending svg path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: sketchLoop 9s cubic-bezier(.55, .1, .35, 1) infinite; }
.pending svg path:nth-child(2) { animation-delay: .4s; }
.pending svg path:nth-child(3) { animation-delay: .8s; stroke: var(--ochre); }
.pending svg path:nth-child(4) { animation-delay: 1.1s; stroke: var(--ochre); }
.pending .hand { font-size: 1.05rem; }
@media (prefers-reduced-motion: reduce) { .pending svg path { animation: none !important; stroke-dashoffset: 0 !important; } }
/* Translated visitors: show the hero heading as one complete sentence (translates with real meaning) */
.tr-full { display: none; }
.is-translated .hero__title .line { display: none; }
.is-translated .hero__title .tr-full { display: block; animation: riseIn 1s var(--ease) .3s both; }

/* "Translating…" badge */
.i18n-badge {
	position: fixed;
	left: 50%;
	bottom: 1.25rem;
	translate: -50% 0;
	z-index: 1300;
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	padding: .5rem 1rem;
	background: var(--card);
	font-size: .82rem;
	font-weight: 700;
	box-shadow: 3px 3px 0 var(--ink);
}
.i18n-badge[hidden] { display: none; }
.i18n-badge__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--ochre); animation: pulse 1.4s ease-out infinite; }

/* Painting subtitle (short description under every artwork title) */
/* Same style as the body text in the "Explore the Mediums" boxes */
.art-sub { margin: .15rem 0 .4rem; font-family: var(--sans); font-style: normal; font-weight: 400; font-size: 1rem; line-height: 1.7; letter-spacing: 0; color: var(--ink-2); }
.art-sub--lead { font-size: clamp(1.02rem, 1.35vw, 1.12rem); line-height: 1.75; margin: -.1rem 0 0; }
.art-sub--sm { display: block; margin: .15rem 0 0; font-size: .84rem; line-height: 1.5; }
.art-sub--xs { display: block; margin: 0; font-size: .72rem; line-height: 1.35; }
.hero__cap-text { display: flex; flex-direction: column; min-width: 0; }
.hero__polaroid figcaption.hero__polaroid-cap { display: flex; flex-direction: column; align-items: center; gap: .05rem; padding: .4rem .3rem .6rem; text-align: center; }
.hero__polaroid-cap .hand { font-size: 1.05rem; color: var(--ink); line-height: 1.1; }
@media (max-width: 560px) { .art-sub--xs { display: none; } }
.split__sub { margin: .5rem 0 1.25rem; color: var(--ochre); }
.split__body { font-size: 1.04rem; line-height: 1.85; }
.hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.14fr) minmax(0, .86fr);
	gap: clamp(2.5rem, 5vw, 5rem);
	align-items: center;
	z-index: 1;
}
.hero__pill {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .35rem .6rem;
	padding: .45rem 1.1rem;
	background: rgba(253, 252, 249, .92);
	box-shadow: 2px 2px 0 rgba(45, 41, 38, .18);
	margin-bottom: 1.6rem;
}
.hero__pill .hand { color: var(--ink); font-size: 1.15rem; }
.hero__title { margin-bottom: 1.4rem; }
.hero__title .line { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.hero__title .line--last { padding-bottom: .3em; margin-bottom: -.25em; }
.hero__title .line > span { display: inline-block; }
.hero__em { position: relative; display: inline-block; font-style: italic; font-weight: 400; white-space: nowrap; }
.hero__scribble {
	position: absolute;
	left: -3%;
	bottom: -.2em;
	width: 106%;
	height: .3em;
	color: var(--ochre);
	overflow: visible;
}
.hero__scribble path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.is-loaded .hero__scribble path { animation: draw 1.3s 1.05s var(--ease) forwards; }
.is-loaded .hero__scribble path + path { animation-delay: 1.35s; }
.hero__lead { max-width: 34rem; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.1rem; }
.hero__stats {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem clamp(1.5rem, 3vw, 2.75rem);
	margin: 2.5rem 0 0;
	padding-top: 1.5rem;
	border-top: 1.5px dashed rgba(32, 30, 28, .25);
}
.hero__stats div { display: flex; flex-direction: column-reverse; gap: .2rem; }
.hero__stats dd { margin: 0; font-family: var(--serif); font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1; }
.hero__stats dt { font-size: .66rem; }

.hero__visual { position: relative; padding: 1.5rem 0 3rem 3rem; }
.parallax { transform: translate3d(0, var(--py, 0px), 0); will-change: transform; }
.hero__plate { margin: 0; padding: 12px; transform: rotate(1.4deg); box-shadow: 6px 7px 0 rgba(36, 31, 21, .9); }
.hero__plate-media { position: relative; overflow: hidden; aspect-ratio: 4 / 3.25; background: var(--paper-3); }
.hero__plate-media img { width: 100%; height: 100%; object-fit: cover; animation: kenburns 22s ease-in-out infinite alternate; }
.hero__plate-cap { display: flex; justify-content: space-between; align-items: center; gap: .75rem; flex-wrap: wrap; padding: .75rem .35rem .15rem; }
.hero__polaroid-wrap { position: absolute; left: 0; bottom: 0; width: 34%; z-index: 3; }
.hero__polaroid {
	margin: 0;
	padding: 8px 8px 0;
	transform: rotate(-7deg);
	box-shadow: 4px 5px 0 rgba(36, 31, 21, .85);
}
.hero__polaroid img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 120px 8px 110px 8px / 8px 110px 8px 120px; }
.hero__polaroid figcaption { text-align: center; padding: .35rem 0 .55rem; font-size: 1.15rem; }
.hero__stamp {
	position: absolute;
	top: -.5rem;
	right: -.5rem;
	z-index: 4;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	padding: .35rem .7rem;
	background: rgba(253, 252, 249, .92);
	transform: rotate(3deg);
}
.hero__stamp .hand { color: var(--ink); }
.hero__annot {
	position: absolute;
	right: 4%;
	bottom: -.25rem;
	display: flex;
	align-items: center;
	gap: .25rem;
	font-size: 1.15rem;
	transform: rotate(-3deg);
	z-index: 2;
}
.hero__annot svg { width: 56px; height: 26px; color: var(--pencil); transform: scaleX(-1); }
.hero__scroll {
	position: absolute;
	left: 50%;
	bottom: 1.25rem;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .15rem;
	z-index: 3;
	opacity: .85;
	transition: opacity .2s;
}
.hero__scroll:hover { opacity: 1; }
.hero__scroll svg { width: 18px; height: 22px; color: var(--pencil); animation: nudge 1.8s ease-in-out infinite; }

@media (max-width: 1100px) {
	.hero__visual { padding-left: 2rem; }
}
@media (max-width: 960px) {
	.hero { min-height: 0; padding-bottom: 4rem; }
	.hero__grid { grid-template-columns: 1fr; gap: 3rem; }
	.hero__copy { max-width: 640px; }
	.hero__visual { max-width: 620px; width: 100%; margin-inline: auto; padding: 1rem 0 2.75rem 1.5rem; }
	.hero__scroll { display: none; }
}
@media (max-width: 560px) {
	.hero__actions .btn { flex: 1 1 100%; }
	.hero__visual { padding-left: .75rem; }
	.hero__polaroid-wrap { width: 40%; left: -.25rem; }
	.hero__stamp { right: -.25rem; top: -1rem; }
	.hero__annot { display: none; }
	.hero__stats { gap: 1rem 1.5rem; }
	.hero__stats > div { flex: 1 1 28%; }
}

/* ---------- 10. Ticker ---------- */
.ticker {
	position: relative;
	overflow: hidden;
	background-color: var(--paper-2);
	border-block: 1.8px solid rgba(45, 41, 38, .28);
	padding: 1rem 0;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}
.ticker__track { display: flex; width: max-content; animation: ticker 48s linear infinite; }
.ticker:hover .ticker__track { animation-play-state: paused; }
.ticker__item { display: flex; align-items: center; gap: .75rem; padding-right: 2.5rem; white-space: nowrap; }
.ticker__fig { padding: .1rem .55rem; background: var(--card); color: var(--ink); font-size: 1.1rem; }
.ticker__star { color: var(--ochre); margin-left: 1.5rem; }

/* ---------- 11. Section heads ---------- */
.section-head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.25rem 2.5rem;
	margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
.section-head > p { max-width: 30rem; }
.section-head--inline { align-items: center; justify-content: flex-start; gap: .5rem 1rem; }
.label-stamp { display: inline-block; padding: .15rem .6rem; background: var(--card); margin-bottom: .75rem; }
.side-note {
	position: absolute;
	left: calc(var(--gutter) * .25);
	top: -2.4rem;
	transform: rotate(-8deg);
	color: rgba(32, 30, 28, .35);
	font-size: 1.4rem;
	pointer-events: none;
}
@media (max-width: 1200px) { .side-note { display: none; } }

/* ---------- 12. Media & cards ---------- */
.media { position: relative; display: block; overflow: hidden; background: var(--paper-3); }
.media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease), filter .6s; }
.media--43 { aspect-ratio: 4 / 3; }
.media--34 { aspect-ratio: 3 / 4; }
.media--45 { aspect-ratio: 4 / 5; }
.media--sq { aspect-ratio: 1 / 1; }
.lift:hover .media img, .media:hover img { transform: scale(1.06); }
.media__tag {
	position: absolute;
	top: 1rem;
	left: 1rem;
	padding: .3rem .75rem;
	background: rgba(253, 252, 249, .95);
	z-index: 2;
}
.media__size {
	position: absolute;
	bottom: .6rem;
	right: .6rem;
	padding: .1rem .4rem;
	background: rgba(248, 245, 238, .85);
	font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	font-size: .68rem;
	z-index: 2;
}

.lift { transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
.lift:hover { transform: translate(-3px, -5px); box-shadow: 6px 7px 0 rgba(36, 31, 21, .85); }

.card-foot {
	margin-top: auto;
	padding-top: 1rem;
	border-top: 1.5px dashed rgba(45, 41, 38, .2);
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: .5rem 1rem;
}

.medium-card { display: flex; flex-direction: column; padding: 12px; }
.medium-card__body { display: flex; flex-direction: column; gap: .7rem; flex: 1; padding: clamp(1.25rem, 2.5vw, 2rem); }
.medium-card__body .card-foot { margin-top: auto; }

.art-card { display: flex; flex-direction: column; padding: 14px; }
.art-card .media { margin-bottom: 1rem; cursor: zoom-in; }
.art-card__no { position: absolute; top: .6rem; right: .6rem; z-index: 2; padding: .05rem .45rem; background: rgba(248, 245, 238, .92); font-size: 1rem; color: var(--ink); }
.art-card__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(248, 245, 238, .35);
	opacity: 0;
	transition: opacity .35s var(--ease);
}
.art-card__overlay .btn { translate: 0 12px; transition: translate .4s var(--ease), transform .22s var(--ease), box-shadow .22s; }
.art-card:hover .art-card__overlay { opacity: 1; }
.art-card:hover .art-card__overlay .btn { translate: 0 0; }
@media (hover: none) { .art-card__overlay { display: none; } }
.art-card__body { display: flex; flex-direction: column; flex: 1; gap: .35rem; }
.art-card__medium { font-size: 1.1rem; margin-bottom: .5rem; }

.price { display: block; font-family: var(--serif); font-size: clamp(1.35rem, 2vw, 1.6rem); font-weight: 600; line-height: 1.1; }
.price--sm { font-size: 1.15rem; display: inline; }
.price--sold { text-decoration: line-through; text-decoration-thickness: 1.5px; color: var(--muted); }
.status { font-family: var(--hand); font-size: 1.15rem; font-weight: 700; color: var(--ochre); }
a.status:hover { text-decoration: underline; text-underline-offset: 3px; }
.status--sold { color: var(--pencil); font-style: italic; font-weight: 600; }

/* ---------- 13. Split (artist) ---------- */
.split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2.5rem, 6vw, 5.5rem); align-items: center; }
.split__media { position: relative; }
.portrait-plate { max-width: 520px; margin-inline: auto; padding: 12px; box-shadow: 5px 5px 0 rgba(36, 31, 21, .9); transform: rotate(-1deg); }
.plaque { margin-top: .85rem; padding: .75rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: var(--paper-2); }
.plaque__no { border-left: 1.5px dashed rgba(32, 30, 28, .3); padding-left: .85rem; white-space: nowrap; }
.split__note { position: absolute; right: 4%; bottom: -2.2rem; transform: rotate(5deg); }
.quote { margin: 1.25rem 0 1.5rem; padding-left: 1.5rem; border-left: 2.5px solid var(--ink); }
.quote blockquote { margin: 0 0 .4rem; font-family: var(--serif); font-style: italic; font-size: clamp(1.35rem, 2.3vw, 1.85rem); line-height: 1.4; }
@media (max-width: 960px) {
	.split { grid-template-columns: 1fr; }
	.split__note { position: static; display: block; text-align: right; margin-top: .75rem; transform: rotate(2deg); }
}
@media (max-width: 480px) { .plaque { flex-direction: column; align-items: flex-start; } .plaque__no { border: 0; padding: 0; } }

/* ---------- 14. Spec sheet / standards ---------- */
.spec-sheet { padding: clamp(1.25rem, 3.5vw, 3rem); box-shadow: 4px 4px 0 rgba(36, 31, 21, .9); }
.spec-sheet__head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: .5rem 1rem;
	padding-bottom: 1rem;
	margin-bottom: 1.75rem;
	border-bottom: 1.5px dashed rgba(32, 30, 28, .3);
}
.spec-sheet__head .hand--lg { color: var(--ink); }
.spec { display: flex; flex-direction: column; gap: .6rem; padding: 1.5rem; background: var(--paper-2); transition: background-color .3s, transform .4s var(--ease); }
.spec:hover { background: var(--card); }
.spec__icon .icon { width: 30px; height: 30px; }
.standard-card, .faq-card, .material-card, .liaison { display: flex; flex-direction: column; gap: .6rem; padding: clamp(1.25rem, 2.4vw, 1.9rem); }
.icon-box { width: 52px; height: 52px; display: inline-flex; align-items: center; justify-content: center; background: var(--paper-3); margin-bottom: .5rem; }
.icon-box .icon { width: 24px; height: 24px; }

/* ---------- 15. Page heads ---------- */
.page-head { padding: calc(var(--header-h) + clamp(2rem, 5vw, 4rem)) 0 clamp(2rem, 4vw, 3rem); position: relative; }
.page-head--slim { padding-top: calc(var(--header-h) + clamp(1.25rem, 3vw, 2rem)); }
.page-head__grid { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.page-head__copy { max-width: 48rem; }
.page-head .lead { max-width: 42rem; margin-top: 1rem; }
.kicker-pill { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; padding: .35rem 1rem; background: var(--paper-3); margin-bottom: 1.1rem; }
.kicker-pill .hand { color: var(--ink); }
.title-scribble { width: min(300px, 70%); height: 16px; color: var(--ink); margin-top: .35rem; }
.title-scribble--sm { width: min(220px, 60%); }
.title-scribble .scribble { width: 100%; height: 100%; overflow: visible; }
.title-scribble path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.is-loaded .title-scribble path { animation: draw 1.2s .6s var(--ease) forwards; }
.ledger-stamp { padding: 1.1rem 1.5rem; transform: rotate(-1.5deg); max-width: 320px; }
.ledger-stamp p { display: flex; align-items: baseline; gap: .6rem; }
.ledger-stamp__num { font-family: var(--serif); font-size: 2.4rem; font-weight: 600; line-height: 1; }
.ledger-stamp__label { font-weight: 600; font-size: .92rem; line-height: 1.35; }

.ribbon { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; margin-bottom: 1.5rem; }
.ribbon__left { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .65rem; }
.ribbon__left .hand { color: var(--ink); }
@media (max-width: 640px) { .ribbon__right { display: none; } }

/* ---------- 16. Shop ---------- */
.filter-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem;
	background: var(--paper-2);
	margin-bottom: clamp(2rem, 4vw, 3rem);
}
.filters { display: flex; flex-wrap: wrap; gap: .6rem; }
.chip {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .55rem 1.05rem;
	min-height: 42px;
	font-size: .86rem;
	font-weight: 700;
	color: var(--ink);
	background: var(--card);
	white-space: nowrap;
	transition: background-color .25s, color .25s, transform .25s var(--ease), box-shadow .25s var(--ease);
}
.chip:hover { transform: translateY(-2px); background: var(--paper-4); }
.chip.is-active { background: var(--ink); color: var(--paper); box-shadow: 2px 2px 0 var(--ink); }
.chip.is-active .chip__mark { color: var(--paper); }
.chip__mark { font-size: 1.1rem; color: var(--pencil); }
.chip__count { opacity: .65; font-weight: 600; }
.sort { display: flex; align-items: center; gap: .6rem; }
.select-wrap { position: relative; display: block; }
.select {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	padding: .6rem 2.6rem .6rem 1rem;
	font-size: .88rem;
	font-weight: 700;
	background: var(--card);
	color: var(--ink);
	cursor: pointer;
}
.select:focus { outline: none; border-color: var(--ink); }
.select-wrap__icon { position: absolute; right: .9rem; top: 50%; translate: 0 -50%; pointer-events: none; }
.filters--scroll { margin-top: 2rem; }

@media (max-width: 760px) {
	.filter-bar { padding: .85rem; }
	.filters, .filters--scroll {
		flex-wrap: nowrap;
		overflow-x: auto;
		width: 100%;
		padding-bottom: .4rem;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x proximity;
	}
	.filters::-webkit-scrollbar { display: none; }
	.chip { scroll-snap-align: start; }
	.sort { width: 100%; }
	.sort .select-wrap { flex: 1; }
}

.shop-card { display: flex; flex-direction: column; padding: 1rem; }
.shop-card .tape { font-size: .9rem; letter-spacing: .06em; text-transform: uppercase; }
.shop-card__frame { position: relative; display: block; padding: 10px; background: var(--paper-3); overflow: hidden; cursor: zoom-in; }
.shop-card__frame .media { border-radius: 3px; }
.shop-card__size { position: absolute; right: 1.1rem; bottom: 1.1rem; z-index: 2; padding: .05rem .5rem; background: rgba(253, 252, 249, .92); color: var(--ink); font-size: 1rem; }
.shop-card__zoom {
	position: absolute;
	top: 1.1rem;
	right: 1.1rem;
	z-index: 2;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--card);
	opacity: 0;
	scale: .7;
	transition: opacity .3s, scale .4s var(--ease);
}
.shop-card:hover .shop-card__zoom { opacity: 1; scale: 1; }
@media (hover: none) { .shop-card__zoom { opacity: 1; scale: 1; } }
.shop-card__body { display: flex; flex-direction: column; gap: .5rem; flex: 1; padding-top: 1.1rem; }
.shop-card__foot {
	margin-top: auto;
	padding-top: 1.1rem;
	border-top: 1.5px solid rgba(32, 30, 28, .14);
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: .75rem 1rem;
}
.shop-card__foot .caps { display: block; margin-bottom: .2rem; }
.empty-state { text-align: center; padding: 2rem 0; font-size: 1.5rem; }

.is-filtered-out { display: none !important; }
.is-entering { animation: cardIn .6s var(--ease) both; animation-delay: var(--ed, 0s); }
@keyframes cardIn { from { opacity: 0; translate: 0 20px; scale: .97; } to { opacity: 1; translate: 0 0; scale: 1; } }

/* ---------- 17. Callout ---------- */
.callout { padding: clamp(1.5rem, 4vw, 3.25rem); background: #EEE9DF; overflow: hidden; }
.callout--dark-tone { background: var(--paper-4); }
.callout__mark { position: absolute; right: -.5rem; bottom: -2rem; font-size: 9rem; color: rgba(32, 30, 28, .08); pointer-events: none; }
.callout__note { position: absolute; top: 1rem; right: 2rem; transform: rotate(-5deg); }
.callout__inner { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2rem; }
.callout__copy { max-width: 42rem; display: flex; flex-direction: column; gap: .8rem; }
.callout__copy--wide { max-width: 52rem; position: relative; }
.callout__copy .eyebrow .hand--lg { color: var(--ink); }
.callout__action { display: flex; flex-direction: column; align-items: flex-start; gap: .6rem; }
@media (max-width: 760px) {
	.callout__note { display: none; }
	.callout__action, .callout__action .btn { width: 100%; }
}

/* ---------- 18. About ---------- */
.cinematic { padding: clamp(.5rem, 1.5vw, 1rem); }
.cinematic__media { position: relative; overflow: hidden; aspect-ratio: 21 / 9; min-height: 360px; max-height: 600px; width: 100%; }
.cinematic__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; animation: kenburns 24s ease-in-out infinite alternate; }
.cinematic__shade { position: absolute; inset: 0; background: linear-gradient(to top, rgba(20, 18, 16, .78), rgba(20, 18, 16, .2) 55%, transparent); }
.cinematic__cap {
	position: absolute;
	left: clamp(1rem, 3vw, 2rem);
	right: clamp(1rem, 3vw, 2rem);
	bottom: clamp(1rem, 3vw, 2rem);
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
}
.cinematic__cap .h1 { color: #FAF8F3; max-width: 40rem; text-shadow: 0 2px 20px rgba(0, 0, 0, .25); }
.cinematic__kicker { color: #E9E1CF; display: block; margin-bottom: .35rem; }
.cinematic__badge { background: rgba(248, 245, 238, .92); padding: .3rem .9rem; color: var(--ink); }
@media (max-width: 640px) {
	.cinematic__media { aspect-ratio: 4 / 5; min-height: 0; }
	.cinematic__badge { display: none; }
}

.facts {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.5rem;
	padding: clamp(1.25rem, 3vw, 2rem);
	background: var(--paper-2);
}
.fact { display: flex; flex-direction: column; gap: .2rem; }
.fact + .fact { border-left: 1.5px dashed rgba(32, 30, 28, .2); padding-left: 1.5rem; }
.fact__value { font-weight: 700; font-size: 1.08rem; margin-top: .2rem; }
@media (max-width: 1024px) {
	.facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.fact:nth-child(3) { border-left: 0; padding-left: 0; }
}
@media (max-width: 560px) {
	.facts { grid-template-columns: 1fr; }
	.fact + .fact { border-left: 0; padding-left: 0; border-top: 1.5px dashed rgba(32, 30, 28, .2); padding-top: 1rem; }
}

.story { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.story__copy { display: flex; flex-direction: column; gap: 1.25rem; }
.story__text { display: flex; flex-direction: column; gap: 1.25rem; font-size: clamp(1rem, 1.3vw, 1.1rem); line-height: 1.8; }
.dropcap::first-letter {
	float: left;
	font-family: var(--serif);
	font-size: 4.6rem;
	line-height: .82;
	font-weight: 600;
	padding: .35rem .65rem 0 0;
}
.signature { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; padding-top: 1rem; border-top: 1.5px solid rgba(32, 30, 28, .18); }
.signature__name { font-size: 1.8rem; color: var(--ink); display: inline-flex; align-items: center; gap: .4rem; }
.story__side { display: flex; flex-direction: column; gap: 2.5rem; }
.pull-quote { margin: 0; padding: clamp(1.25rem, 2.5vw, 1.75rem); background: var(--paper-3); transform: rotate(1deg); }
.pull-quote blockquote { margin: .5rem 0 1rem; font-family: var(--serif); font-style: italic; font-weight: 500; font-size: clamp(1.2rem, 1.8vw, 1.4rem); line-height: 1.45; }
.portrait-card { margin: 0; padding: 12px; display: flex; flex-direction: column; gap: .75rem; }
.portrait-card .media { cursor: zoom-in; }
@media (max-width: 960px) {
	.story { grid-template-columns: 1fr; }
	.story__side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; align-items: start; }
}
@media (max-width: 640px) { .story__side { grid-template-columns: 1fr; } }

.material-card { padding: 12px 12px 1.25rem; }
.material-card > *:not(.media):not(.tape) { padding-inline: .6rem; }
.material-card .media { margin-bottom: .5rem; }

.timeline { padding: clamp(1.25rem, 3.5vw, 3rem); }
.timeline__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; padding-bottom: 1.5rem; border-bottom: 2px solid rgba(32, 30, 28, .18); }
.timeline__badge { padding: .25rem .9rem; background: var(--paper-3); color: var(--ink); }
.tl-row {
	display: grid;
	grid-template-columns: 180px minmax(0, 1fr) auto;
	gap: .5rem 2rem;
	align-items: baseline;
	padding: 1.4rem .75rem;
	border-bottom: 1.5px solid rgba(32, 30, 28, .1);
	transition: background-color .3s, padding-left .4s var(--ease);
}
.tl-row:last-child { border-bottom: 0; }
.tl-row:hover { background: var(--paper-2); padding-left: 1.25rem; }
.tl-row__year { display: flex; align-items: baseline; gap: .75rem; flex-wrap: wrap; }
.tl-row__side { text-align: right; display: flex; flex-direction: column; }
@media (max-width: 760px) {
	.tl-row { grid-template-columns: 1fr; }
	.tl-row__side { text-align: left; }
}

.press { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: clamp(1.5rem, 3vw, 2.5rem); align-items: stretch; }
.press__main { display: flex; flex-direction: column; gap: 1.5rem; }
.press__quotes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; flex: 1; }
.press-card { margin: 0; padding: 1.35rem; display: flex; flex-direction: column; gap: .5rem; background: var(--paper-2); }
.press-card blockquote { margin: 0 0 1rem; font-weight: 600; font-style: italic; line-height: 1.6; }
.press-card figcaption { margin-top: auto; padding-top: .75rem; border-top: 1.5px dashed rgba(32, 30, 28, .18); display: flex; flex-direction: column; }
.seal-card { padding: clamp(1.25rem, 2.5vw, 1.75rem); display: flex; flex-direction: column; align-items: center; text-align: center; gap: .75rem; }
.seal-card__head { width: 100%; padding-bottom: .75rem; border-bottom: 1.5px solid rgba(32, 30, 28, .18); }
.seal { position: relative; width: 150px; height: 150px; margin: .75rem 0; }
.seal__ring { width: 100%; height: 100%; animation: spin 26s linear infinite; }
.seal__ring text { font-family: var(--sans); font-size: 13.5px; font-weight: 700; letter-spacing: 2.2px; fill: var(--ink); }
.seal__mono {
	position: absolute;
	inset: 26%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--serif);
	font-size: 2rem;
	font-weight: 600;
	border: 2px solid var(--ink);
	border-radius: 50% 47% 53% 49% / 48% 53% 47% 52%;
	background: var(--paper-2);
}
.seal-card__foot { width: 100%; padding: .6rem; background: var(--paper-3); margin-top: auto; color: var(--ink); }
@media (max-width: 1024px) { .press { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .press__quotes { grid-template-columns: 1fr; } }

/* ---------- 19. Contact ---------- */
.status-ribbon {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .6rem 1.25rem;
	padding: .85rem 1.25rem;
	background: var(--paper-2);
	margin-bottom: clamp(2rem, 4vw, 3rem);
}
.status-ribbon__left, .status-ribbon__right { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .85rem; }
.status-ribbon__text { font-weight: 600; }
.pulse { position: relative; width: 10px; height: 10px; border-radius: 50%; background: var(--ok); flex: none; }
.pulse::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--ok); animation: pulse 2s ease-out infinite; }

.contact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
.contact-info { display: flex; flex-direction: column; gap: 1.75rem; }
.location-card { display: flex; gap: 1.25rem; padding: 1.25rem; align-items: flex-start; }
.location-card__img { flex: 0 0 38%; aspect-ratio: 4 / 3.3; overflow: hidden; }
.location-card__img img { width: 100%; height: 100%; object-fit: cover; }
.location-card__body { display: flex; flex-direction: column; gap: .5rem; min-width: 0; }
.icon-line { display: inline-flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.liaison { background: var(--paper-2); gap: .35rem; }
.liaison__link { font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; overflow-wrap: anywhere; }
.liaison__link:hover { color: var(--ochre); }
.represent { padding: 1.5rem; background: var(--card); display: flex; flex-direction: column; gap: 1.1rem; }
.represent__head { padding-bottom: .6rem; border-bottom: 1.5px solid rgba(32, 30, 28, .18); }
.represent__item { padding: .85rem 1rem; display: flex; flex-direction: column; background: var(--paper); }
.represent__note { display: flex; gap: .75rem; align-items: flex-start; padding-top: 1rem; border-top: 1.5px dashed rgba(32, 30, 28, .25); }
.represent__note .icon { margin-top: .2rem; }

.form-card { padding: clamp(1.25rem, 3vw, 2.25rem); }
.form-card__pin {
	position: absolute;
	top: -14px;
	left: 50%;
	translate: -50% 0;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #6b625a, var(--ink) 60%);
	box-shadow: 0 3px 6px rgba(0, 0, 0, .25);
}
.form-card__head { align-items: flex-start; margin: .5rem 0 .75rem; }
.form-card__sheet { padding: .2rem .8rem; background: var(--paper-3); color: var(--ink); }
.form-card__intro { margin-bottom: 1.5rem; }
.inquiry-form { display: flex; flex-direction: column; gap: 1.25rem; }
.field { display: flex; flex-direction: column; gap: .45rem; min-width: 0; border: 0; margin: 0; padding: 0; }
.field label, .field legend {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .25rem .75rem;
	font-weight: 700;
	font-size: .95rem;
	padding: 0;
	margin-bottom: .1rem;
}
.field label .hand { font-size: 1.05rem; font-weight: 600; }
.req { color: var(--err); }
.field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.input {
	width: 100%;
	padding: .85rem 1.05rem;
	font-size: 1rem;
	color: var(--ink);
	background: var(--paper);
	border: 1.6px solid #55504A;
	border-width: 1.5px 2px 1.8px 1.6px;
	border-radius: var(--r-subtle);
	transition: border-color .2s, background-color .2s, box-shadow .25s var(--ease);
}
.input::placeholder { color: #8F887E; }
.input:focus { outline: none; border-color: var(--ink); background: var(--card); box-shadow: 3px 3px 0 rgba(32, 30, 28, .18); }
textarea.input { resize: vertical; min-height: 140px; line-height: 1.6; border-radius: 30px 12px 26px 14px / 14px 26px 12px 30px; }
select.input { padding-right: 2.6rem; font-weight: 600; }
.radio-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.radio-card {
	display: flex !important;
	justify-content: flex-start !important;
	align-items: center !important;
	gap: .6rem !important;
	padding: .8rem .9rem;
	background: var(--paper);
	font-size: .88rem !important;
	cursor: pointer;
	transition: background-color .2s, box-shadow .25s var(--ease), transform .25s var(--ease);
}
.radio-card:hover { background: var(--paper-3); }
.radio-card input {
	-webkit-appearance: none;
	appearance: none;
	width: 18px;
	height: 18px;
	margin: 0;
	flex: none;
	border: 1.6px solid var(--ink);
	display: grid;
	place-content: center;
	background: var(--card);
	cursor: pointer;
}
.radio-card input::before { content: ""; width: 8px; height: 8px; background: var(--ink); transform: scale(0); transition: transform .2s var(--ease); }
.radio-card input:checked::before { transform: scale(1); }
.radio-card:has(input:checked) { background: var(--paper-3); box-shadow: 2px 2px 0 var(--ink); transform: translate(-1px, -1px); }
.selected-work { padding: .75rem 1rem; background: var(--paper-2); display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .75rem; }
.selected-work .hand--lg { color: var(--ink); }
.form-privacy { text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .35rem; }

.form-flash { display: flex; align-items: center; gap: .5rem; margin-top: .85rem; font-weight: 600; font-size: .92rem; }
.form-flash--ok { color: var(--ok); }
.form-flash--err { color: var(--err); }
.form-flash--box {
	align-items: flex-start;
	padding: 1rem 1.15rem;
	margin: 0 0 1.25rem;
	border: 1.5px dashed currentColor;
	border-radius: 12px 2px 15px 3px / 4px 14px 3px 12px;
	background: var(--paper-2);
	font-weight: 500;
	animation: cardIn .6s var(--ease) both;
}
.form-flash--box .icon { margin-top: .2rem; }

@media (max-width: 1024px) { .contact-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
	.field-row, .radio-cards { grid-template-columns: 1fr; }
	.location-card { flex-direction: column; }
	.location-card__img { flex: none; width: 100%; aspect-ratio: 16 / 9; }
}

.map-card { padding: clamp(1.25rem, 3vw, 2.25rem); }
.map-card__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; padding-bottom: 1.25rem; margin-bottom: 1.5rem; border-bottom: 1.5px solid rgba(32, 30, 28, .18); }
.map-card__badge { padding: .25rem .9rem; background: var(--paper-2); color: var(--ink); }
.map-grid { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 1.5rem; }
.map-frame { position: relative; min-height: 420px; overflow: hidden; background: #EFECE4; }
.map-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(1) sepia(.35) contrast(.92) brightness(1.04); }
.map-frame__label { position: absolute; top: 1rem; left: 1rem; z-index: 2; display: flex; flex-direction: column; max-width: 75%; padding: .7rem .9rem; background: rgba(253, 252, 249, .95); box-shadow: 3px 3px 0 rgba(32, 30, 28, .25); pointer-events: none; }
.map-frame__label .hand--lg { color: var(--ink); }
.map-pin { position: absolute; left: 50%; top: 50%; z-index: 2; translate: -50% -100%; display: flex; flex-direction: column; align-items: center; pointer-events: none; }
.map-pin__dot { width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--ink); color: var(--paper); border: 2px solid var(--paper); box-shadow: 0 6px 14px rgba(0, 0, 0, .3); animation: bob 2.2s ease-in-out infinite; }
.map-pin__dot .icon { width: 22px; height: 22px; }
.map-pin__label { margin-top: .4rem; padding: .2rem .65rem; background: var(--ink); color: var(--paper); font-size: .8rem; font-weight: 700; border-radius: 4px; }
.map-frame__chips { position: absolute; left: 1rem; right: 1rem; bottom: 1rem; z-index: 2; display: flex; flex-wrap: wrap; gap: .5rem; pointer-events: none; }
.map-frame__chips .sk-pill { padding: .25rem .8rem; background: rgba(253, 252, 249, .94); font-size: .82rem; font-weight: 700; }
.protocol { padding: 1.5rem; background: var(--paper-2); display: flex; flex-direction: column; gap: .75rem; }
.protocol ol { margin: .25rem 0 1rem; padding-left: 1.25rem; display: flex; flex-direction: column; gap: .75rem; }
.protocol li::marker { font-family: var(--hand); font-weight: 700; font-size: 1.25rem; }
.protocol .link-arrow { margin-top: auto; align-self: flex-start; }
@media (max-width: 1024px) { .map-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
	.map-frame { min-height: 360px; }
	.map-frame__chips .sk-pill:nth-child(n+2) { display: none; }
}

/* ---------- 20. Blog ---------- */
.blog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; }
.blog-head__copy { max-width: 52rem; }
.margin-note { flex: 0 0 240px; padding: 1.15rem 1.25rem; background: var(--paper-2); transform: rotate(1.5deg); display: flex; flex-direction: column; gap: .4rem; }
.margin-note .hand--lg { color: var(--ink); }
@media (max-width: 1100px) { .margin-note { display: none; } }

.feature-post {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: clamp(1.5rem, 4vw, 3rem);
	align-items: center;
	padding: clamp(1rem, 3vw, 2.5rem);
	transition: box-shadow .4s var(--ease);
}
.feature-post:hover { box-shadow: 6px 7px 0 rgba(36, 31, 21, .3); }
.feature-post__media { position: relative; }
.feature-post__media .media { height: clamp(260px, 36vw, 440px); }
.feature-post:hover .media img { transform: scale(1.05); }
.feature-post__body { display: flex; flex-direction: column; gap: 1rem; }
.feature-post__body .h1 { font-size: clamp(1.7rem, 3.2vw, 2.6rem); }
.feature-post__body .h1 a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat; transition: background-size .5s var(--ease); }
.feature-post__body .h1 a:hover { background-size: 100% 2px; }
@media (max-width: 1024px) { .feature-post { grid-template-columns: 1fr; } }

.meta-row { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; }
.chip-mini { display: inline-block; padding: .05rem .7rem; background: var(--paper-4); color: var(--ink); font-size: 1.05rem; }

.post-card { display: flex; flex-direction: column; padding: 14px; }
.post-card__media { aspect-ratio: 16 / 10; }
.post-card .tape { top: 0; }
.post-card__body { display: flex; flex-direction: column; gap: .7rem; flex: 1; padding: 1.15rem .5rem .35rem; }
.post-card__title a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1.5px no-repeat; transition: background-size .5s var(--ease); }
.post-card:hover .post-card__title a { background-size: 100% 1.5px; }
.post-card--compact .post-card__media { aspect-ratio: 4 / 3; }

.pagination { margin-top: 3rem; }
.pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.pagination .page-numbers {
	min-width: 44px;
	height: 44px;
	padding: 0 .9rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	background: var(--card);
	border: 1.8px solid var(--ink);
	border-radius: var(--r-pill);
	transition: background-color .2s, color .2s, transform .25s var(--ease);
}
.pagination a.page-numbers:hover { transform: translateY(-2px); background: var(--paper-4); }
.pagination .current { background: var(--ink); color: var(--paper); }

.stat-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; padding: clamp(1.25rem, 3vw, 2.5rem); background-color: #F3EFE6; }
.stat-bar__title { display: flex; align-items: center; gap: 1rem; }
.stat-bar__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.stat { display: flex; flex-direction: column; align-items: center; text-align: center; padding: .9rem 1.1rem; background: rgba(253, 252, 249, .85); }
.stat__num { font-size: 2rem; color: var(--ink); line-height: 1; margin-bottom: .25rem; }
@media (max-width: 1024px) { .stat-bar__stats { width: 100%; } }
@media (max-width: 520px) { .stat-bar__stats { grid-template-columns: 1fr; } }

/* ---------- 21. Single post ---------- */
.article-head { padding: calc(var(--header-h) + clamp(2rem, 5vw, 3.5rem)) 0 clamp(2rem, 4vw, 3rem); }
.article-head .meta-row { margin: 1.5rem 0 1rem; }
.article-title { font-size: clamp(2rem, 4.5vw, 3.4rem); }
.article-head .lead { margin-top: 1.1rem; }
.article-cover { margin: 0 0 clamp(2.5rem, 5vw, 4rem); padding: 12px; }
.article-cover .media { aspect-ratio: 16 / 8.5; }
@media (max-width: 640px) { .article-cover .media { aspect-ratio: 4 / 3; } }

.prose { font-size: clamp(1.03rem, 1.3vw, 1.12rem); line-height: 1.85; color: #2C2925; }
.prose > * + * { margin-top: 1.35em; }
.prose h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); margin-top: 2.2em; }
.prose h3 { font-size: clamp(1.25rem, 2vw, 1.5rem); margin-top: 1.8em; }
.prose a { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.prose a:hover { color: var(--ochre); }
.prose ul, .prose ol { padding-left: 1.4em; }
.prose li + li { margin-top: .5em; }
.prose ul li::marker { content: "✎  "; color: var(--pencil); }
.prose blockquote {
	margin-inline: 0;
	padding: 1.25rem 1.5rem;
	border-left: 3px solid var(--ink);
	background: var(--paper-2);
	border-radius: 0 14px 16px 0 / 0 40px 30px 0;
	font-family: var(--serif);
	font-style: italic;
	font-size: 1.25em;
	line-height: 1.5;
}
.prose blockquote p { margin: 0; }
.prose img, .prose figure { border-radius: 8px; max-width: 100%; height: auto; }
.prose figure { margin-inline: 0; }
.prose figcaption { font-family: var(--hand); font-size: 1.15rem; color: var(--pencil); text-align: center; margin-top: .5rem; }
.prose table { width: 100%; border-collapse: collapse; font-size: .95em; display: block; overflow-x: auto; }
.prose th, .prose td { padding: .6rem .8rem; border-bottom: 1px solid var(--line); text-align: left; }
.prose pre { overflow-x: auto; padding: 1rem; background: var(--paper-3); border-radius: 8px; }
.prose hr { border: 0; border-top: 1.5px dashed rgba(32, 30, 28, .3); }

.author-card { display: flex; align-items: center; gap: 1.25rem; padding: 1.25rem 1.5rem; margin: clamp(3rem, 6vw, 4.5rem) 0 2rem; flex-wrap: wrap; }
.author-card > div { flex: 1 1 220px; }
.author-card__img { width: 84px; height: 84px; object-fit: cover; flex: none; }
.post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; padding-top: 1.5rem; border-top: 1.5px dashed rgba(32, 30, 28, .25); }
.post-nav a { display: flex; flex-direction: column; gap: .3rem; transition: transform .3s var(--ease); }
.post-nav a:hover { transform: translateY(-2px); }
.post-nav__next { text-align: right; }
.post-nav__next a { align-items: flex-end; }
@media (max-width: 560px) { .post-nav { grid-template-columns: 1fr; } .post-nav__next { text-align: left; } .post-nav__next a { align-items: flex-start; } }

.page-sheet { padding: clamp(1.5rem, 4vw, 3rem); }

/* ---------- 22. 404 ---------- */
.notfound { min-height: 80vh; display: flex; align-items: center; }
.notfound__card { padding: clamp(2rem, 5vw, 3.5rem); text-align: center; display: flex; flex-direction: column; align-items: center; gap: .85rem; }
.notfound__num { font-family: var(--serif); font-size: clamp(5rem, 16vw, 9rem); line-height: .9; font-weight: 600; }
.notfound__line { width: 220px; height: 16px; color: var(--ochre); }
.notfound__line path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.is-loaded .notfound__line path { animation: draw 1.2s .6s var(--ease) forwards; }

/* ---------- 23. Footer ---------- */
.site-footer {
	margin-top: clamp(2rem, 5vw, 4rem);
	padding: clamp(3.5rem, 7vw, 5.5rem) 0 2rem;
	background-color: #F2EEE5;
	border-top: 2px solid rgba(32, 30, 28, .55);
}
.footer-card { padding: clamp(1.5rem, 4vw, 3rem); margin-bottom: 2.5rem; }
.footer-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 4vw, 3.5rem); align-items: center; }
.footer-news .eyebrow .hand--lg { color: var(--ink); }
.footer-news__text { margin: .75rem 0 1.5rem; max-width: 36rem; }
.footer-news__note { margin-top: .85rem; font-size: 1.05rem; }
.newsletter-form { display: flex; gap: .75rem; max-width: 36rem; }
.newsletter-form .input { flex: 1; min-width: 0; }
.newsletter-form .btn { flex: none; }
.footer-info { display: flex; flex-direction: column; gap: 1.75rem; padding-left: clamp(0rem, 3vw, 2.5rem); border-left: 1.5px solid rgba(32, 30, 28, .18); }
.footer-block { display: flex; flex-direction: column; gap: .4rem; }
.footer-block__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.footer-block__addr { font-weight: 600; }
.footer-block__label { margin-bottom: .35rem; }
.footer-contact { display: flex; flex-direction: column; gap: .4rem; margin-top: .5rem; font-weight: 600; font-size: .95rem; }
.footer-contact a { align-self: flex-start; overflow-wrap: anywhere; }
.footer-social { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; font-weight: 700; font-size: .9rem; }
.footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; font-size: .88rem; color: var(--ink-2); }
.footer-links { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-weight: 600; }
@media (max-width: 960px) {
	.footer-grid { grid-template-columns: 1fr; }
	.footer-info { border-left: 0; padding-left: 0; padding-top: 1.75rem; border-top: 1.5px solid rgba(32, 30, 28, .18); }
}
@media (max-width: 560px) {
	.newsletter-form { flex-direction: column; }
	.newsletter-form .btn { width: 100%; }
	.footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* ---------- 24. Back to top & lightbox ---------- */
.to-top {
	position: fixed;
	right: clamp(1rem, 3vw, 2rem);
	bottom: clamp(1rem, 3vw, 2rem);
	z-index: 90;
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--ink);
	color: var(--paper);
	box-shadow: 3px 3px 0 var(--ochre);
	opacity: 0;
	visibility: hidden;
	translate: 0 16px;
	transition: opacity .35s, translate .45s var(--ease), visibility 0s .45s, transform .25s var(--ease);
}
.to-top.is-visible { opacity: 1; visibility: visible; translate: 0 0; transition: opacity .35s, translate .45s var(--ease), visibility 0s, transform .25s var(--ease); }
.to-top:hover { transform: translateY(-3px); }
.to-top .icon { width: 22px; height: 22px; }

.lightbox {
	position: fixed;
	inset: 0;
	z-index: 1500;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(1rem, 4vw, 3rem) clamp(3.5rem, 8vw, 6rem);
	background: rgba(248, 245, 238, .94);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	opacity: 0;
	visibility: hidden;
	transition: opacity .4s var(--ease), visibility 0s .4s;
}
.lightbox.is-open { opacity: 1; visibility: visible; transition: opacity .4s var(--ease), visibility 0s; }
.lightbox__figure { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; gap: .85rem; scale: .94; transition: scale .5s var(--ease); }
.lightbox.is-open .lightbox__figure { scale: 1; }
.lightbox__img { max-width: 100%; max-height: calc(100vh - 9rem); max-height: calc(100svh - 9rem); width: auto; height: auto; object-fit: contain; border: 10px solid var(--card); box-shadow: 0 20px 40px -15px rgba(31, 31, 31, .25), 5px 6px 0 rgba(36, 31, 21, .85); }
.lightbox__img.is-swapping { opacity: 0; }
.lightbox__img { transition: opacity .25s; }
.lightbox__caption { font-family: var(--hand); font-size: 1.3rem; color: var(--ink); text-align: center; max-width: 46rem; }
.lightbox__close, .lightbox__nav {
	position: absolute;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--card);
	box-shadow: 2px 2px 0 var(--ink);
	transition: transform .25s var(--ease);
}
.lightbox__close:hover, .lightbox__nav:hover { transform: translate(-1px, -2px); }
.lightbox__close { top: 1rem; right: 1rem; }
.lightbox__nav { top: 50%; translate: 0 -50%; }
.lightbox__nav--prev { left: clamp(.5rem, 2vw, 1.5rem); }
.lightbox__nav--next { right: clamp(.5rem, 2vw, 1.5rem); }
.lightbox__nav[hidden] { display: none; }
.lightbox .icon { width: 22px; height: 22px; }
@media (max-width: 640px) {
	.lightbox { padding: 4.5rem .75rem 5.5rem; }
	.lightbox__nav { top: auto; bottom: 1rem; translate: 0 0; }
	.lightbox__nav--prev { left: calc(50% - 60px); }
	.lightbox__nav--next { right: calc(50% - 60px); }
}

/* ---------- 24b. Search ---------- */
.search-panel {
	position: fixed;
	inset: 0;
	z-index: 1400;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	background-color: rgba(248, 245, 238, .97);
	background-image:
		linear-gradient(to right, rgba(68, 64, 60, .05) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(68, 64, 60, .05) 1px, transparent 1px);
	background-size: 32px 32px;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	opacity: 0;
	visibility: hidden;
	transition: opacity .4s var(--ease), visibility 0s .4s;
}
.search-panel.is-open { opacity: 1; visibility: visible; transition: opacity .4s var(--ease), visibility 0s; }
.search-panel__inner {
	max-width: calc(980px + 2 * var(--gutter));
	padding-top: clamp(1.25rem, 4vw, 3rem);
	padding-bottom: 4rem;
	translate: 0 -24px;
	transition: translate .6s var(--ease);
}
.search-panel.is-open .search-panel__inner { translate: 0 0; }
.search-panel__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.search-panel__top .hand--lg { color: var(--ink); }
.search-panel__close {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--card);
	box-shadow: 2px 2px 0 var(--ink);
	transition: transform .3s var(--ease);
}
.search-panel__close:hover { transform: rotate(90deg); }
.search-panel__close .icon { width: 22px; height: 22px; }
.search-panel__line { display: block; width: min(420px, 80%); height: 16px; margin: .25rem 0 1.75rem; color: var(--ochre); }
.search-panel__line path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.search-panel.is-open .search-panel__line path { animation: draw 1s .25s var(--ease) forwards; }

.search-form { position: relative; display: flex; align-items: center; gap: .75rem; }
.search-form__icon { position: absolute; left: 0; width: 30px; height: 30px; color: var(--pencil); pointer-events: none; }
.search-form__input {
	flex: 1;
	min-width: 0;
	padding: .6rem 0 .6rem 2.75rem;
	font-family: var(--serif);
	font-size: clamp(1.6rem, 4.5vw, 3rem);
	line-height: 1.2;
	color: var(--ink);
	background: transparent;
	border: 0;
	border-bottom: 2.5px solid var(--ink);
	border-radius: 0;
	-webkit-appearance: none;
	appearance: none;
}
.search-form__input::placeholder { color: rgba(32, 30, 28, .3); }
.search-form__input:focus { outline: none; }
.search-form__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.search-form__submit { flex: none; }
@media (max-width: 600px) {
	.search-panel .search-form__submit { display: none; }
	.search-form__icon { width: 24px; height: 24px; }
	.search-form__input { padding-left: 2.2rem; }
}

.search-suggest { display: flex; flex-direction: column; gap: .75rem; }
.search-suggest[hidden] { display: none; }
.search-suggest__chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.search-suggest .chip { font-size: .82rem; min-height: 38px; }

.search-results { display: flex; flex-direction: column; gap: 2rem; }
.search-group__title { display: flex; align-items: baseline; gap: .75rem; padding-bottom: .5rem; margin-bottom: .75rem; border-bottom: 1.5px dashed rgba(32, 30, 28, .25); }
.search-group__title .h4 { font-size: 1.15rem; }
.search-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.search-hit {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: .65rem .85rem;
	background: var(--card);
	border: 1.5px solid transparent;
	border-radius: var(--r-subtle);
	opacity: 0;
	animation: cardIn .45s var(--ease) forwards;
	animation-delay: var(--ed, 0s);
	transition: border-color .2s, box-shadow .25s var(--ease), transform .25s var(--ease), background-color .2s;
}
.search-hit:hover, .search-hit.is-active {
	border-color: var(--ink);
	box-shadow: 3px 3px 0 var(--ink);
	transform: translate(-1px, -1px);
}
.search-hit__thumb { flex: none; width: 64px; height: 64px; object-fit: cover; border-radius: 30px 6px 26px 6px / 6px 26px 6px 30px; background: var(--paper-3); }
.search-hit__icon { flex: none; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; background: var(--paper-3); border-radius: 30px 6px 26px 6px / 6px 26px 6px 30px; }
.search-hit__icon .icon { width: 24px; height: 24px; }
.search-hit__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.search-hit__title { font-family: var(--serif); font-size: 1.12rem; font-weight: 600; line-height: 1.3; }
.search-hit__desc { font-size: .86rem; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-hit__meta { flex: none; font-family: var(--hand); font-size: 1.15rem; font-weight: 700; color: var(--ochre); }
.search-hit mark { background: linear-gradient(transparent 55%, rgba(184, 137, 71, .35) 55%); color: inherit; padding: 0; }
.search-empty { text-align: center; padding: 2rem 0; }
.search-empty .hand--lg { display: block; margin-bottom: .5rem; }
.search-all { align-self: flex-start; }
@media (max-width: 560px) {
	.search-hit { gap: .75rem; padding: .55rem .6rem; }
	.search-hit__thumb, .search-hit__icon { width: 52px; height: 52px; }
	.search-hit__meta { display: none; }
}

.search-form--page { margin-top: 2rem; max-width: 760px; padding: .75rem 1rem; background: var(--card); }
.search-form--page .search-form__icon { left: 1rem; }
.search-form--page .search-form__input { font-size: clamp(1.2rem, 2.6vw, 1.6rem); border-bottom: 0; padding-left: 2.6rem; }
.result-page { display: flex; flex-direction: column; gap: .6rem; padding: clamp(1.25rem, 2.4vw, 1.9rem); }

/* ---------- 24c. Language switcher ---------- */
.lang { position: relative; }
.lang__toggle { gap: .45rem; padding-inline: .85rem; }
.lang__toggle .icon { width: 18px; height: 18px; transition: transform .6s var(--ease); }
.lang__toggle:hover .icon, .lang.is-open .lang__toggle .icon { transform: rotate(160deg); }
.lang__current { font-size: .72rem; letter-spacing: .1em; min-width: 1.6em; }
.lang__menu {
	position: absolute;
	top: calc(100% + 14px);
	right: 0;
	z-index: 130;
	width: min(360px, calc(100vw - 2rem));
	padding: 1.1rem;
	box-shadow: 5px 6px 0 rgba(36, 31, 21, .85);
	opacity: 0;
	translate: 0 -8px;
	scale: .97;
	transform-origin: top right;
	transition: opacity .25s var(--ease), translate .35s var(--ease), scale .35s var(--ease);
}
.lang.is-open .lang__menu { opacity: 1; translate: 0 0; scale: 1; }
.lang__menu[hidden] { display: none; }
.lang__head { display: flex; flex-direction: column; gap: .1rem; margin-bottom: .75rem; }
.lang__head .hand--lg { color: var(--ink); }
.lang__filter { padding: .6rem .9rem; font-size: .92rem; margin-bottom: .6rem; }
.lang__scroll {
	max-height: min(56vh, 420px);
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	padding-right: .25rem;
	margin-right: -.25rem;
}
.lang__group {
	position: sticky;
	top: 0;
	z-index: 1;
	margin: .5rem 0 .35rem;
	padding: .3rem 0;
	background: var(--card);
	border-bottom: 1.5px dashed rgba(32, 30, 28, .2);
	font-size: .66rem;
}
.lang__group:first-child { margin-top: 0; }
.lang__group[hidden], .lang__none[hidden] { display: none; }
.lang__none { padding: 1rem 0; text-align: center; }
.lang__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .3rem;
}
.lang__list li[hidden] { display: none; }
.lang__opt {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
	padding: .45rem .65rem;
	text-align: start;
	background: transparent;
	border: 1.5px solid transparent;
	border-radius: var(--r-subtle);
	transition: background-color .2s, border-color .2s;
}
.lang__opt:hover, .lang__opt:focus-visible { background: var(--paper-3); border-color: rgba(32, 30, 28, .35); outline: none; }
.lang__opt.is-current { background: var(--ink); color: var(--paper); }
.lang__opt.is-current .lang__en { color: rgba(248, 245, 238, .7); }
.lang__native { font-weight: 700; font-size: .92rem; line-height: 1.3; overflow-wrap: anywhere; }
.lang__en { font-size: .72rem; color: var(--muted); line-height: 1.3; }
.lang__note { margin-top: .75rem; padding-top: .6rem; border-top: 1.5px dashed rgba(32, 30, 28, .2); font-size: .78rem; }

@media (max-width: 600px) {
	.lang__toggle { width: 48px; height: 48px; min-height: 48px; padding: 0; border-radius: var(--r-pill); }
	.lang__current { display: none; }
	.lang__menu { position: fixed; top: calc(var(--header-h) + 8px); left: 1rem; right: 1rem; width: auto; }
	.lang__scroll { max-height: calc(100svh - var(--header-h) - 15rem); }
}
@media (max-width: 400px) {
	.header-actions { gap: .45rem; }
	.lang__toggle, .search-toggle, .nav-toggle { width: 44px; height: 44px; min-height: 44px; }
	.nav-toggle span { left: 11px; right: 11px; }
	.nav-toggle span:nth-child(1) { top: 14px; }
	.nav-toggle span:nth-child(2) { top: 20.5px; right: 15px; }
	.nav-toggle span:nth-child(3) { top: 27px; }
	.nav-open .nav-toggle span:nth-child(1), .nav-open .nav-toggle span:nth-child(3) { top: 20.5px; }
	.brand__name { font-size: 1.15rem; }
	.brand__tag { max-width: 150px; }
}

/* "View in your language?" prompt */
.lang-toast {
	position: fixed;
	left: clamp(1rem, 3vw, 2rem);
	bottom: clamp(1rem, 3vw, 2rem);
	z-index: 95;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .75rem 1rem;
	max-width: min(440px, calc(100vw - 2rem));
	padding: 1rem 1.15rem;
	box-shadow: 5px 6px 0 rgba(36, 31, 21, .85);
	opacity: 0;
	translate: 0 24px;
	transition: opacity .4s var(--ease), translate .5s var(--ease);
}
.lang-toast.is-visible { opacity: 1; translate: 0 0; }
.lang-toast[hidden] { display: none; }
.lang-toast__icon { width: 26px; height: 26px; color: var(--ochre); }
.lang-toast__text { flex: 1; min-width: 160px; font-weight: 600; }
.lang-toast__actions { display: flex; gap: .5rem; flex-wrap: wrap; }

/* Hide Google Translate's own toolbar, tooltips and highlight so the design stays intact */
.gt-mount { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.goog-te-banner-frame, iframe.goog-te-banner-frame, .goog-te-balloon-frame, #goog-gt-tt, .goog-tooltip, .goog-te-spinner-pos,
body > .skiptranslate, iframe.skiptranslate, .VIpgJd-ZVi9od-ORHb-OEVmcd, .VIpgJd-ZVi9od-aZ2wEe-wOHMyf, .VIpgJd-yAWNEb-L7lbkb {
	display: none !important;
	visibility: hidden !important;
}
html.is-translated, html.is-translated body { top: 0 !important; position: static !important; }
.goog-text-highlight, .VIpgJd-yAWNEb-VIpgJd-fmcmS-sn54Q { background: none !important; box-shadow: none !important; }
font { vertical-align: inherit !important; }

/* Right-to-left languages */
[dir="rtl"] body { text-align: right; }
[dir="rtl"] .lang__menu { right: auto; left: 0; transform-origin: top left; }
[dir="rtl"] .quote, [dir="rtl"] .prose blockquote { border-left: 0; border-right: 2.5px solid var(--ink); padding-left: 0; padding-right: 1.5rem; }
[dir="rtl"] .hand-arrow, [dir="rtl"] .link-arrow .hand { display: inline-block; transform: scaleX(-1); }
[dir="rtl"] .fact + .fact { border-left: 0; padding-left: 0; border-right: 1.5px dashed rgba(32, 30, 28, .2); padding-right: 1.5rem; }
[dir="rtl"] .footer-info { border-left: 0; padding-left: 0; border-right: 1.5px solid rgba(32, 30, 28, .18); padding-right: clamp(0rem, 3vw, 2.5rem); }
[dir="rtl"] .search-form__icon { left: auto; right: 0; }
[dir="rtl"] .search-form__input { padding-left: 0; padding-right: 2.75rem; }
[dir="rtl"] .select-wrap__icon { right: auto; left: .9rem; }
[dir="rtl"] .to-top { right: auto; left: clamp(1rem, 3vw, 2rem); }
@media (max-width: 960px) { [dir="rtl"] .footer-info { border-right: 0; padding-right: 0; } }

/* ---------- 24d. Product page ---------- */
.product { padding: calc(var(--header-h) + clamp(1.25rem, 3vw, 2rem)) 0 clamp(2.5rem, 5vw, 4rem); }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; font-size: .82rem; font-weight: 600; color: var(--ink-2); margin-bottom: clamp(1.25rem, 3vw, 2rem); }
.crumbs span[aria-current] { color: var(--ink); }
.product__grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.product__gallery { position: sticky; top: calc(var(--header-h) + 1.5rem); }
.product__stage { margin: 0; padding: 14px; box-shadow: 6px 7px 0 rgba(36, 31, 21, .85); }
.product__zoom { position: relative; display: block; overflow: hidden; background: var(--paper-3); cursor: zoom-in; aspect-ratio: 4 / 4.4; }
.product__img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	background: var(--paper-3);
	transform-origin: var(--zx, 50%) var(--zy, 50%);
	transition: transform .5s var(--ease), opacity .35s;
}
.product__zoom.is-zooming .product__img { transform: scale(2.1); }
.product__zoom[data-view="detail"] .product__img { transform: scale(2.4); transform-origin: 38% 42%; object-fit: cover; }
.product__zoom[data-view="edge"] .product__img { transform: scale(3.4); transform-origin: 70% 65%; object-fit: cover; }
.product__zoom-hint {
	position: absolute;
	left: 50%;
	bottom: .9rem;
	translate: -50% 0;
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .35rem .85rem;
	font-size: .74rem;
	font-weight: 700;
	white-space: nowrap;
	background: rgba(253, 252, 249, .92);
	transition: opacity .3s;
}
.product__zoom.is-zooming .product__zoom-hint { opacity: 0; }
@media (hover: none) { .product__zoom-hint { display: none; } }
.product__cap { display: flex; justify-content: space-between; padding: .7rem .3rem .1rem; }
.product__thumbs { display: flex; gap: .75rem; margin-top: 1.25rem; }
.product__thumb {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: .3rem;
	padding: 6px;
	background: var(--card);
	transition: transform .3s var(--ease), box-shadow .3s var(--ease), background-color .2s;
}
.product__thumb span { display: block; aspect-ratio: 4 / 3; background-size: cover; background-position: center; border-radius: 4px; }
.product__thumb span.is-detail { background-size: 260%; background-position: 38% 42%; }
.product__thumb span.is-edge { background-size: 380%; background-position: 70% 65%; }
.product__thumb em { font-style: normal; font-size: 1rem; text-align: center; }
.product__thumb:hover { transform: translateY(-3px); }
.product__thumb.is-active { box-shadow: 3px 3px 0 var(--ink); background: var(--paper-3); }

.product__info { display: flex; flex-direction: column; gap: 1rem; }
.product__title { font-size: clamp(2.1rem, 4vw, 3.2rem); }
.product__medium { margin-top: -.25rem; }
.product__price-row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; padding: 1rem 0; border-block: 1.5px dashed rgba(32, 30, 28, .22); }
.product__price-row .caps { display: block; margin-bottom: .2rem; }
.product__price { font-family: var(--serif); font-size: clamp(2rem, 3.4vw, 2.6rem); font-weight: 600; line-height: 1; }
.product__status { display: inline-flex; align-items: center; gap: .5rem; padding: .35rem .9rem; font-size: .8rem; font-weight: 700; background: var(--card); }
.dot-live { width: 9px; height: 9px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 0 rgba(63, 107, 58, .5); animation: livePulse 2s infinite; }
.product__status.is-sold .dot-live { background: var(--ochre); animation: none; }
@keyframes livePulse { 0% { box-shadow: 0 0 0 0 rgba(63, 107, 58, .45); } 80%, 100% { box-shadow: 0 0 0 9px rgba(63, 107, 58, 0); } }
.product__desc { font-size: 1.04rem; line-height: 1.8; }
.product__editions { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.product__editions li {
	display: flex;
	align-items: center;
	gap: .85rem;
	padding: .75rem 1rem;
	background: var(--card);
	border: 1.5px solid rgba(32, 30, 28, .2);
	border-radius: var(--r-subtle);
}
.product__editions li.is-off { opacity: .5; }
.product__ed-icon, .edition__icon { flex: none; width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; background: var(--paper-3); border-radius: 50% 46% 52% 48% / 48% 52% 46% 50%; }
.product__ed-icon .icon, .edition__icon .icon { width: 20px; height: 20px; }
.product__ed-text { flex: 1; display: flex; flex-direction: column; }
.product__ed-text em { font-style: normal; font-size: .82rem; color: var(--ink-2); }
.product__ed-price { font-family: var(--serif); font-size: 1.2rem; font-weight: 600; }
.product__actions { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: .25rem; }
.product__buy { flex: 1 1 260px; }
.product__buy .icon { width: 20px; height: 20px; }
.product__actions .btn:not(.product__buy) { flex: 1 1 180px; }
.product__trust { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: .84rem; font-weight: 600; color: var(--ink-2); }
.product__trust li { display: inline-flex; align-items: center; gap: .4rem; }
.product__specs { margin: .5rem 0 0; padding: 1.25rem 1.5rem; background: var(--paper-2); display: grid; gap: 0; }
.product__specs div { display: grid; grid-template-columns: 130px 1fr; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid rgba(32, 30, 28, .1); }
.product__specs div:last-child { border-bottom: 0; }
.product__specs dt { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); padding-top: .2rem; }
.product__specs dd { margin: 0; font-weight: 500; }
@media (max-width: 960px) {
	.product__grid { grid-template-columns: 1fr; }
	.product__gallery { position: static; }
}
@media (max-width: 480px) {
	.product__specs div { grid-template-columns: 1fr; gap: .1rem; }
	.product__zoom { aspect-ratio: 4 / 4.6; }
}
.shop-card__frame { cursor: pointer; }
.shop-card h2 a, .art-card h3 a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1.5px no-repeat; transition: background-size .45s var(--ease); }
.shop-card:hover h2 a, .art-card:hover h3 a { background-size: 100% 1.5px; }

/* ---------- 24e. Buy sheet ---------- */
.sheet {
	position: fixed;
	inset: 0;
	z-index: 1450;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	visibility: hidden;
	pointer-events: none;
}
.sheet.is-open { visibility: visible; pointer-events: auto; }
.sheet__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(32, 30, 28, .45);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	opacity: 0;
	transition: opacity .45s var(--ease);
}
.sheet.is-open .sheet__backdrop { opacity: 1; }
.sheet__panel {
	position: relative;
	width: min(900px, 100%);
	max-height: calc(100vh - 2rem);
	max-height: calc(100svh - 2rem);
	display: flex;
	flex-direction: column;
	padding: clamp(1.1rem, 3vw, 1.75rem);
	box-shadow: 8px 10px 0 rgba(36, 31, 21, .9);
	opacity: 0;
	translate: 0 40px;
	scale: .96;
	rotate: -1deg;
	transition: opacity .45s var(--ease), translate .6s var(--ease), scale .6s var(--ease), rotate .6s var(--ease);
}
.sheet.is-open .sheet__panel { opacity: 1; translate: 0 0; scale: 1; rotate: 0deg; }
.sheet__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.sheet__art { display: flex; align-items: center; gap: .9rem; min-width: 0; }
.sheet__art img { width: 58px; height: 58px; object-fit: cover; border-radius: 40px 8px 34px 8px / 8px 34px 8px 40px; border: 1.5px solid var(--ink); flex: none; }
.sheet__art .h3 { font-size: clamp(1.2rem, 2.4vw, 1.55rem); }
.sheet__close { width: 44px; height: 44px; flex: none; display: flex; align-items: center; justify-content: center; background: var(--card); box-shadow: 2px 2px 0 var(--ink); transition: transform .3s var(--ease); }
.sheet__close:hover { transform: rotate(90deg); }
.sheet__close .icon { width: 20px; height: 20px; }
.sheet__progress { height: 3px; margin: 1rem 0 1.25rem; background: rgba(32, 30, 28, .1); border-radius: 3px; overflow: hidden; }
.sheet__progress span { display: block; height: 100%; width: 33%; background: var(--ochre); border-radius: 3px; transition: width .6s var(--ease); }
.sheet[data-step="details"] .sheet__progress span { width: 70%; }
.sheet[data-step="done"] .sheet__progress span { width: 100%; background: var(--ok); }
.sheet__body { position: relative; overflow-y: auto; overscroll-behavior: contain; margin: 0 -.5rem; padding: .5rem; }

.step { display: none; flex-direction: column; gap: 1rem; }
.sheet[data-step="choose"] .step--choose,
.sheet[data-step="details"] .step--details,
.sheet[data-step="done"] .step--done { display: flex; animation: stepIn .55s var(--ease) both; }
.sheet.is-back .step { animation-name: stepBack; }
@keyframes stepIn { from { opacity: 0; translate: 40px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes stepBack { from { opacity: 0; translate: -40px 0; } to { opacity: 1; translate: 0 0; } }

.edition-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1rem; }
.edition {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: .5rem;
	padding: 1.25rem;
	text-align: start;
	color: var(--ink);
	background: var(--card);
	cursor: pointer;
	opacity: 0;
	translate: 0 18px;
	transition: transform .35s var(--ease), box-shadow .35s var(--ease), background-color .25s, border-color .25s;
}
.sheet.is-open .edition { animation: editionIn .6s var(--ease) both; }
.sheet.is-open .edition:nth-child(2) { animation-delay: .1s; }
.sheet.is-open .edition:nth-child(3) { animation-delay: .2s; }
@keyframes editionIn { from { opacity: 0; translate: 0 18px; } to { opacity: 1; translate: 0 0; } }
.edition:hover:not(:disabled) { transform: translate(-2px, -4px); box-shadow: 6px 7px 0 rgba(36, 31, 21, .85); }
.edition[aria-checked="true"] { background: #FBF4E6; border-color: var(--ochre); box-shadow: 6px 7px 0 var(--ochre); transform: translate(-2px, -4px); }
.edition:disabled { cursor: not-allowed; opacity: .55 !important; filter: grayscale(.4); }
.edition__check {
	position: absolute;
	top: .9rem;
	right: .9rem;
	width: 26px;
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1.6px solid var(--ink);
	border-radius: 50% 46% 52% 48%;
	background: var(--card);
	transition: background-color .25s, transform .35s var(--ease);
}
.edition__check .icon { width: 15px; height: 15px; opacity: 0; transform: scale(.4); transition: opacity .2s, transform .35s var(--ease); }
.edition[aria-checked="true"] .edition__check { background: var(--ink); color: var(--paper); transform: rotate(-8deg); }
.edition[aria-checked="true"] .edition__check .icon { opacity: 1; transform: scale(1); }
.edition__icon { margin-bottom: .25rem; }
.edition[aria-checked="true"] .edition__icon { background: var(--ochre); color: #fff; }
.edition__name { font-family: var(--serif); font-size: 1.3rem; font-weight: 600; line-height: 1.2; }
.edition__desc { font-size: .86rem; line-height: 1.55; color: var(--ink-2); }
.edition__foot { margin-top: auto; padding-top: .75rem; width: 100%; display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; border-top: 1.5px dashed rgba(32, 30, 28, .2); }
.edition__price { font-family: var(--serif); font-size: 1.6rem; font-weight: 600; }
.sheet__next:disabled { opacity: .45; cursor: not-allowed; transform: none !important; box-shadow: 2px 2px 0 var(--ink) !important; }

/* Art Prints picker (Canvas / Paper → 2 options each) */
.print-picker { display: grid; grid-template-rows: 0fr; opacity: 0; translate: 0 -10px; transition: grid-template-rows .5s var(--ease), opacity .4s var(--ease), translate .5s var(--ease); }
.print-picker.is-open { grid-template-rows: 1fr; opacity: 1; translate: 0 0; }
.print-picker[hidden] { display: none; }
.print-picker__inner { min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: .9rem; padding: 1rem 1.1rem 1.15rem; background: #FBF4E6; border-color: var(--ochre); }
.print-picker__hint { font-size: 1.25rem; color: var(--ink-2); }
.print-tabs { position: relative; display: inline-flex; align-self: flex-start; gap: .3rem; padding: .3rem; background: var(--card); border: 1.5px solid var(--ink); border-radius: 999px; }
.print-tab { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .45rem; padding: .55rem 1.15rem; border: 0 !important; background: none; box-shadow: none !important; font-weight: 700; font-size: .85rem; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-2); cursor: pointer; transition: color .3s var(--ease); }
.print-tab .icon { width: 17px; height: 17px; }
.print-tab.is-active { color: var(--paper); }
.print-tabs__ink { position: absolute; z-index: 0; top: .3rem; bottom: .3rem; left: 0; width: 0; background: var(--ink); border-radius: 999px; transition: transform .45s var(--ease), width .45s var(--ease); }
.print-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.print-opt { display: flex; align-items: center; gap: .8rem; padding: .85rem 1rem; text-align: start; color: var(--ink); background: var(--card); border: 1.5px solid var(--ink); border-radius: 14px 4px 16px 4px / 4px 16px 4px 14px; box-shadow: 3px 3px 0 rgba(36, 31, 21, .8); cursor: pointer; transition: transform .3s var(--ease), box-shadow .3s var(--ease), background-color .25s, border-color .25s; }
.print-opt[hidden] { display: none; }
.print-opt.is-in { animation: printOptIn .45s var(--ease) both; animation-delay: calc(var(--i, 0) * .08s); }
@keyframes printOptIn { from { opacity: 0; translate: 0 12px; scale: .97; } to { opacity: 1; translate: 0 0; scale: 1; } }
.print-opt:hover:not(:disabled) { transform: translate(-1px, -3px); box-shadow: 5px 6px 0 rgba(36, 31, 21, .85); }
.print-opt[aria-checked="true"] { border-color: var(--ochre); box-shadow: 5px 6px 0 var(--ochre); transform: translate(-1px, -3px); }
.print-opt:disabled { opacity: .5; cursor: not-allowed; }
.print-opt__radio { flex: none; width: 20px; height: 20px; border: 1.6px solid var(--ink); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.print-opt__radio::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--ochre); transform: scale(0); transition: transform .3s var(--ease); }
.print-opt[aria-checked="true"] .print-opt__radio::after { transform: scale(1); }
.print-opt__text { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.print-opt__text strong { font-size: .95rem; }
.print-opt__text em { font-style: normal; font-size: .8rem; color: var(--ink-2); line-height: 1.4; }
.print-opt__price { font-family: var(--serif); font-size: 1.2rem; font-weight: 600; white-space: nowrap; }
@media (max-width: 640px) {
	.print-options { grid-template-columns: 1fr; }
	.print-tabs { align-self: stretch; }
	.print-tab { flex: 1; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
	.print-picker, .print-tabs__ink, .print-opt { transition: none; }
	.print-opt.is-in { animation: none; }
}

/* Shop: "original sold" stamp, Studio Standards note, product placeholder */
.shop-card__sold { position: absolute; z-index: 3; right: 1rem; bottom: 1rem; padding: .25rem .8rem; background: var(--card); color: var(--err); font-size: 1.15rem; rotate: -6deg; }
.shop-card.is-sold .shop-card__frame img { filter: saturate(.85); }
.standards-note { position: relative; display: flex; align-items: flex-start; gap: clamp(1rem, 3vw, 2rem); padding: clamp(1.5rem, 4vw, 3rem); }
.standards-note .icon-box { flex: none; }
.standards-note .h2 { margin-bottom: .6rem; }
.standards-note .lead { margin: 0; max-width: 72ch; color: var(--ink-2); }
@media (max-width: 640px) { .standards-note { flex-direction: column; } }
.product__zoom--pending { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 5; cursor: default; }

.sheet__summary { display: flex; align-items: center; gap: .85rem; padding: .75rem 1rem; background: var(--paper-2); }
.sheet__summary > div { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.sheet__sum-price { font-family: var(--serif); font-size: 1.4rem; font-weight: 600; }
.sheet__change { font-size: .8rem; font-weight: 700; background: none; border: 0; padding: 0; cursor: pointer; }
.step--details .field label { font-size: .88rem; }
.step--details .input { padding: .7rem .95rem; font-size: .95rem; }
.ship-fields { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .75rem; }
.ship-fields legend { margin-bottom: .5rem; }
.sheet:not(.needs-shipping) [data-ship-only] { display: none; }
.agree { display: flex; align-items: flex-start; gap: .6rem; font-size: .85rem; cursor: pointer; }
.agree input { margin-top: .2rem; accent-color: var(--ink); width: 16px; height: 16px; }
.sheet__error { padding: .7rem .9rem; border: 1.5px dashed var(--err); color: var(--err); border-radius: 10px 3px 12px 3px; font-weight: 600; font-size: .88rem; }
.sheet__pay { position: relative; gap: .6rem; }
.sheet__pay .icon { width: 18px; height: 18px; }
.sheet__spinner { display: none; width: 18px; height: 18px; border: 2px solid rgba(248, 245, 238, .35); border-top-color: var(--paper); border-radius: 50%; animation: spin .8s linear infinite; }
.sheet__pay.is-loading .sheet__spinner { display: inline-block; }
.sheet__pay.is-loading .icon { display: none; }
.sheet__secure { display: flex; align-items: center; justify-content: center; gap: .45rem; text-align: center; font-size: .8rem; }

.step--done { align-items: center; text-align: center; padding: 1rem 0 .5rem; }
.done-mark { width: 104px; height: 104px; }
.done-mark circle, .done-mark path { fill: none; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; }
.done-mark circle { stroke: var(--ok); }
.done-mark path { stroke: var(--ink); }
.sheet[data-step="done"] .done-mark circle { animation: draw .8s .15s var(--ease) forwards; }
.sheet[data-step="done"] .done-mark path { animation: draw .55s .75s var(--ease) forwards; }
.sheet__done-close { margin-top: .5rem; }

@media (max-width: 640px) {
	.sheet { align-items: flex-end; padding: 0; }
	.sheet__panel {
		width: 100%;
		max-height: 92vh;
		max-height: 92svh;
		border-radius: 28px 22px 0 0 / 20px 26px 0 0;
		translate: 0 100%;
		rotate: 0deg;
		scale: 1;
		box-shadow: 0 -10px 30px rgba(32, 30, 28, .2);
	}
	.sheet.is-open .sheet__panel { translate: 0 0; }
	.edition-grid { grid-template-columns: 1fr; }
	.sheet__panel .tape { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.edition { opacity: 1; translate: 0 0; }
	.done-mark circle, .done-mark path { stroke-dashoffset: 0; }
}

/* Highlight an artwork reached from search (#art-slug) */
.shop-card:target { animation: targetPulse 2.2s var(--ease) .4s 1 both; }
@keyframes targetPulse {
	0% { box-shadow: 3px 4px 0 rgba(36, 31, 21, .15); }
	30% { box-shadow: 0 0 0 6px rgba(168, 122, 58, .45), 6px 7px 0 rgba(36, 31, 21, .85); }
	100% { box-shadow: 3px 4px 0 rgba(36, 31, 21, .15); }
}

/* ==========================================================================
   25. Motion
   ========================================================================== */
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes kenburns { from { transform: scale(1.02) translate(0, 0); } to { transform: scale(1.1) translate(-1.5%, -1%); } }
@keyframes ticker { to { transform: translateX(-50%); } }
@keyframes nudge { 0%, 100% { translate: 0 0; } 50% { translate: 0 6px; } }
@keyframes bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(3); opacity: 0; } }
@keyframes riseIn { from { opacity: 0; translate: 0 28px; } to { opacity: 1; translate: 0 0; } }
@keyframes maskUp { from { translate: 0 110%; } to { translate: 0 0; } }
@keyframes plateIn { from { opacity: 0; translate: 0 50px; scale: .92; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes dropIn { 0% { opacity: 0; translate: -30px -40px; scale: 1.15; } 70% { opacity: 1; scale: .98; } 100% { opacity: 1; translate: 0 0; scale: 1; } }

/* Load-in (above the fold). Uses individual transform properties so elements keep their own rotate(). */
.js [data-anim] { opacity: 0; }
.js .hero__title .line > [data-anim] { opacity: 1; translate: 0 110%; }
.js.is-loaded [data-anim] { animation: riseIn 1s var(--ease) var(--d, 0s) both; }
.js.is-loaded .hero__title .line > [data-anim] { animation: maskUp 1.1s var(--ease) var(--d, 0s) both; }
.js.is-loaded [data-anim="plate"] { animation-name: plateIn; animation-duration: 1.3s; }
.js.is-loaded [data-anim="drop"] { animation-name: dropIn; animation-duration: 1.1s; }

/* Scroll reveal */
.js [data-reveal] {
	opacity: 0;
	translate: 0 34px;
	transition:
		opacity .9s var(--ease) var(--d, 0s),
		translate 1s var(--ease) var(--d, 0s),
		transform .4s var(--ease),
		box-shadow .4s var(--ease),
		background-color .3s;
}
.js [data-reveal="left"] { translate: -44px 0; }
.js [data-reveal="right"] { translate: 44px 0; }
.js [data-reveal].is-visible { opacity: 1; translate: 0 0; }
.no-reveal [data-reveal], .no-reveal [data-anim] { opacity: 1 !important; translate: 0 0 !important; animation: none !important; }
.no-reveal .scribble path, .no-js .scribble path { stroke-dashoffset: 0 !important; }

/* Headline underline draw when a section reveals */
.draw-title { position: relative; display: inline-block; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		transition-delay: 0s !important;
	}
	.js [data-reveal], .js [data-anim], .js .hero__title .line > [data-anim] { opacity: 1 !important; translate: 0 0 !important; }
	.ticker__track, .seal__ring, .hero__plate-media img, .cinematic__media img { animation: none !important; }
	.sk-draw path { animation: none !important; stroke-dashoffset: 0 !important; opacity: 1 !important; }
	.rotator__word { animation: none !important; clip-path: none !important; opacity: 0 !important; }
	.rotator__word:first-child { opacity: 1 !important; }
	.hero__scribble path { animation: none !important; stroke-dashoffset: 0 !important; }
	.hero__wash, .hero__float-a, .hero__float-b, .hero__float-c, .hero__dabs i { animation: none !important; }
	.hero__visual { transform: none !important; }
	.parallax { transform: none !important; }
}

/* ---------- 26. Print ---------- */
@media print {
	.site-header, .mobile-nav, .to-top, .lightbox, .loader, .scroll-progress, .ticker, .search-panel { display: none !important; }
	[data-reveal], [data-anim] { opacity: 1 !important; translate: 0 0 !important; }
}