/* ==========================================================================
   Echo On Video — theme styles
   Signal red on near-black, wide-tracked Jost titles, bold Barlow labels,
   aged paper, scuffed cases, film grain.
   ========================================================================== */

:root {
	--echo-ink: #0a0a0b;
	--echo-ink-2: #121215;
	--echo-ink-3: #1b1b1e;
	--echo-rule: #26262a;
	--echo-line: #3a3a3f;
	--echo-bone: #f2f2f0;
	--echo-smoke: #c9c9c6;
	--echo-ash: #9a9a9a;
	--echo-paper: #e3dac6;
	--echo-paper-dark: #d6ccb5;
	--echo-pinch: #141416;
	--echo-red: #d90f25;
	--echo-red-bright: #fb0122;
	--echo-red-deep: #9e0a1a;
	--echo-red-ink: #b30c1f;
	--echo-title: var(--wp--preset--font-family--jost, Jost, Futura, sans-serif);
	--echo-text: var(--wp--preset--font-family--barlow, Barlow, Arial, sans-serif);
	--echo-type: var(--wp--preset--font-family--typewriter, "Special Elite", monospace);
	--echo-wide: 1320px;
	--echo-gutter: 24px;
	--echo-shadow: 0 22px 44px rgba(0, 0, 0, 0.65);

	/* Textures */
	--echo-grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
	--echo-scratches: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='700' height='700'><filter id='s'><feTurbulence type='fractalNoise' baseFrequency='.004 .9' numOctaves='1' seed='7' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 9 -6.2'/></filter><rect width='100%25' height='100%25' filter='url(%23s)'/></svg>");
	--echo-ink-blot: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='440' height='440'><filter id='i'><feTurbulence type='fractalNoise' baseFrequency='.035' numOctaves='4' seed='3'/><feColorMatrix values='0 0 0 0 .25  0 0 0 0 .02  0 0 0 0 .04  0 0 0 2.4 -1.1'/></filter><rect width='100%25' height='100%25' filter='url(%23i)'/></svg>");
	/* Old paper: tea-coloured blotches, foxing spots and a dried coffee ring */
	--echo-stains: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='560' height='560'><filter id='t'><feTurbulence type='fractalNoise' baseFrequency='.009' numOctaves='4' seed='11' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .42  0 0 0 0 .27  0 0 0 0 .08  0 0 0 1.5 -.76'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>");
	--echo-tide: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='640' height='640'><filter id='e'><feTurbulence type='fractalNoise' baseFrequency='.006' numOctaves='3' seed='29' stitchTiles='stitch'/><feComponentTransfer><feFuncA type='table' tableValues='0 0 0 0 0 .5 0 0 0 0 0'/></feComponentTransfer><feColorMatrix values='0 0 0 0 .36  0 0 0 0 .22  0 0 0 0 .06  0 0 0 .5 0'/><feGaussianBlur stdDeviation='.8'/></filter><rect width='100%25' height='100%25' filter='url(%23e)'/></svg>");
	--echo-foxing: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='f'><feTurbulence type='fractalNoise' baseFrequency='.07' numOctaves='2' seed='5' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .48  0 0 0 0 .28  0 0 0 0 .1  0 0 0 4.2 -2.86'/></filter><rect width='100%25' height='100%25' filter='url(%23f)'/></svg>");
	--echo-coffee: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'><defs><filter id='w' x='-15%25' y='-15%25' width='130%25' height='130%25'><feTurbulence type='fractalNoise' baseFrequency='.04' numOctaves='3' seed='8'/><feDisplacementMap in='SourceGraphic' scale='8' xChannelSelector='R' yChannelSelector='G'/></filter><radialGradient id='r'><stop offset='0' stop-color='%23704512' stop-opacity='.07'/><stop offset='.78' stop-color='%23704512' stop-opacity='.1'/><stop offset='.9' stop-color='%23704512' stop-opacity='.2'/><stop offset='.965' stop-color='%235a300a' stop-opacity='.62'/><stop offset='1' stop-color='%235a300a' stop-opacity='0'/></radialGradient></defs><g filter='url(%23w)'><circle cx='96' cy='96' r='76' fill='url(%23r)'/><path d='M26 132 A84 84 0 0 1 116 18' fill='none' stroke='%235a300a' stroke-opacity='.3' stroke-width='2.4'/><path d='M150 160 A84 84 0 0 1 120 176' fill='none' stroke='%235a300a' stroke-opacity='.22' stroke-width='1.6'/><circle cx='168' cy='170' r='5.5' fill='%23704512' fill-opacity='.24'/><circle cx='181' cy='158' r='2.6' fill='%23704512' fill-opacity='.22'/><circle cx='24' cy='40' r='3.2' fill='%23704512' fill-opacity='.16'/></g></svg>");
	--echo-fibre: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='f'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .35  0 0 0 0 .24  0 0 0 0 .1  0 0 0 .55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23f)'/></svg>");
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

html { scroll-behavior: smooth; }
body { background: var(--echo-ink); color: var(--echo-bone); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: var(--echo-red); color: #fff; }

/* Film grain + tape scratches over the whole page (front end only). */
body.echo-grime::before,
body.echo-grime::after {
	content: "";
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 9998;
	mix-blend-mode: screen;
}
body.echo-grime::before { background-image: var(--echo-grain); opacity: 0.13; }
body.echo-grime::after { background-image: var(--echo-scratches); opacity: 0.09; }
body.echo-grime--light::before { opacity: 0.06; }
body.echo-grime--light::after { opacity: 0.035; }

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}
.screen-reader-text:focus { background: var(--echo-bone); color: var(--echo-ink); clip: auto !important; clip-path: none; height: auto; width: auto; padding: 12px 16px; z-index: 100000; top: 8px; left: 8px; }

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
	outline: 2px solid var(--echo-red-bright);
	outline-offset: 3px;
}

img { max-width: 100%; height: auto; }

.echo-main { margin-block: 0; }
.echo-main--flush > * { margin-block: 0 !important; }
.echo-main--page { padding-block: clamp(2.5rem, 6vw, 5rem) clamp(4rem, 9vw, 7rem); }

/* Shared inner container for full-width sections */
.echo-section { position: relative; overflow-x: clip; }
.echo-section__inner { max-width: var(--echo-wide); margin-inline: auto; padding-inline: var(--echo-gutter); box-sizing: border-box; }
.echo-section { padding-block: clamp(3.5rem, 8vw, 5.5rem) clamp(2rem, 4vw, 3rem); }
.echo-section.is-band { background: var(--echo-ink-2); border-block: 1px solid var(--echo-rule); }
.echo-section.is-band + .echo-section.is-band { border-top: 0; }

/* --------------------------------------------------------------------------
   Labels, headings, kickers
   -------------------------------------------------------------------------- */

.echo-label {
	display: flex; align-items: center; gap: 12px;
	margin: 0;
}
.echo-label::before, .is-style-label::before,
.echo-label--center::after {
	content: ""; width: 28px; height: 2px; background: var(--echo-red-bright); flex: none;
}
.echo-label--center { justify-content: center; }
.echo-label__tag {
	background: var(--echo-red); color: #fff;
	font-family: var(--echo-text); font-weight: 700; font-size: 0.8125rem; line-height: 1.3;
	letter-spacing: 0.3em; text-transform: uppercase;
	padding: 5px 8px 5px 10px;
}
/* Paragraph "Red label" style: same look, built on the paragraph itself. */
p.is-style-label {
	position: relative; display: block; width: fit-content; max-width: 100%;
	padding: 5px 8px 5px 50px; box-sizing: border-box;
	background: linear-gradient(var(--echo-red), var(--echo-red)) no-repeat right center / calc(100% - 40px) 100%;
	color: #fff;
	font-family: var(--echo-text); font-weight: 700; font-size: 0.8125rem; line-height: 1.3; letter-spacing: 0.3em; text-transform: uppercase;
}
p.is-style-label::before { position: absolute; left: 0; top: 50%; margin-top: -1px; }
/* In a centred text column, line the label up with the text rather than centring it. */
.is-layout-constrained > p.is-style-label:not(.has-text-align-center) { margin-left: max(0px, calc((100% - var(--wp--style--global--content-size, 760px)) / 2)) !important; margin-right: auto !important; }

.is-style-kicker, .echo-kicker {
	font-family: var(--echo-text); font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.3em; text-transform: uppercase;
	color: var(--echo-red-bright); margin: 0;
}
.is-style-typewriter, .echo-typewriter { font-family: var(--echo-type); font-size: 1.0625rem; line-height: 1.6; }

.echo-head {
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end;
	gap: 18px 24px; margin-bottom: clamp(1.75rem, 4vw, 2.5rem);
}
.echo-head__text { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.echo-head__title,
.echo-main .echo-head__title {
	margin: 0;
	font-family: var(--echo-title); font-weight: 400; text-transform: uppercase;
	font-size: var(--wp--preset--font-size--xx-large, 3.75rem); line-height: 1; letter-spacing: 0.06em;
	overflow-wrap: anywhere;
}
.echo-head__intro { margin: 0; color: var(--echo-ash); font-size: 1.125rem; }
.echo-head__aside { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.echo-head--page { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; margin-bottom: clamp(2rem, 5vw, 3.5rem) !important; }
.echo-label-date { font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.3em; text-transform: uppercase; }
.echo-label-date.wp-block-post-date { background: var(--echo-red); color: #fff; padding: 5px 8px 5px 10px; }
.echo-post-terms { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--echo-ash); }
.echo-post-terms a { color: var(--echo-ash); text-decoration: none; }

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.echo-btn {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 46px; padding: 0 18px; box-sizing: border-box;
	font-family: var(--echo-text); font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.2em; text-transform: uppercase;
	text-decoration: none !important; line-height: 1.2; text-align: center;
	transition: background-color .15s, color .15s, border-color .15s;
}
.echo-btn--red { background: var(--echo-red); color: #fff !important; }
.echo-btn--red:hover { background: var(--echo-red-bright); color: #fff; }
.echo-btn--line { border: 2px solid var(--echo-bone); color: var(--echo-bone) !important; }
.echo-btn--line:hover { background: var(--echo-bone); color: var(--echo-ink) !important; }
.echo-btn--white { border: 2px solid #fff; color: #fff !important; }
.echo-btn--white:hover { background: #fff; color: var(--echo-red-deep) !important; }
.echo-btn--lg { min-height: 52px; padding: 0 24px; font-size: 0.875rem; }
.echo-btn--block { width: 100%; }
.echo-btn.is-static { opacity: 0.55; cursor: default; }
.echo-btn.is-static:hover { background: none; color: var(--echo-bone) !important; }

.wp-block-button.is-style-outline-bone .wp-block-button__link {
	background: transparent; color: var(--echo-bone); border: 2px solid var(--echo-bone);
}
.wp-block-button.is-style-outline-bone .wp-block-button__link:hover { background: var(--echo-bone); color: var(--echo-ink); }

.echo-arrow {
	font-family: var(--echo-text); font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.22em; text-transform: uppercase;
	text-decoration: none; color: inherit;
}
.echo-arrow::after { content: " →"; }
.echo-arrow--ink { color: var(--echo-red-ink) !important; }

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

.echo-header {
	position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 100;
	border-bottom: 1px solid var(--echo-red);
	padding-block: 12px;
}
/* The blur sits on its own layer: a backdrop-filter on the header itself would
   trap the full-screen mobile menu inside the header bar. */
.echo-header::before {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: rgba(10, 10, 11, 0.94);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
@media (max-width: 600px) { .echo-header { top: 0; } }
.echo-header__bar { gap: 16px 24px; }
.echo-header__nav { gap: 12px 26px; }
.echo-brand { margin: 0; }
.echo-brand a { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--echo-ink); }
.echo-brand__skull { width: 24px; height: auto; }
.echo-wordmark {
	background: var(--echo-red); color: var(--echo-ink);
	font-family: var(--echo-title); font-weight: 500; font-size: 1.375rem; line-height: 1.2;
	letter-spacing: 0.22em; text-transform: uppercase;
	padding: 2px 6px 2px 10px;
}
.echo-brand a:hover .echo-wordmark { background: var(--echo-red-bright); }
/* Logo drips (Publisher details → Logo drips) */
.echo-wordmark { position: relative; --drip: var(--echo-red); }
.echo-brand a:hover .echo-wordmark { --drip: var(--echo-red-bright); }
.echo-drip-layer {
	/* Covers the bottom edge of the box and the space below it; blurred together so drips melt into the box. */
	position: absolute; left: 0; right: 0; top: calc(100% - 6px); height: 110px; pointer-events: none;
	filter: url(#echo-logo-goo);
}
.echo-drip-layer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--drip); }
.echo-drip {
	position: absolute; top: 2px; width: var(--w, 6px); height: 0; margin-left: calc(var(--w, 6px) / -2);
	background: var(--drip); border-radius: 999px; pointer-events: none; transform-origin: 50% 0;
	animation: echo-drip-run var(--t, 3s) cubic-bezier(0.35, 0, 0.45, 1) forwards;
}
.echo-drip__drop {
	position: absolute; left: 50%; top: calc(100% - var(--w, 6px) * 0.4); width: calc(var(--w, 6px) * 1.4); aspect-ratio: 0.82;
	background: var(--drip); border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
	transform: translate(-50%, -50%) scale(0);
	animation: echo-drip-drop var(--t, 3s) linear forwards;
}
@keyframes echo-drip-run {
	0% { height: 0; }
	12% { height: calc(var(--w, 6px) * 0.9); }
	40% { height: calc(var(--l, 12px) + 4px); }
	58% { height: calc(var(--l, 12px) * 1.3 + 4px); }
	66% { height: calc(var(--l, 12px) * 0.9 + 4px); }
	88% { opacity: 1; }
	100% { height: 0; opacity: 0; }
}
@keyframes echo-drip-drop {
	0%, 28% { transform: translate(-50%, -50%) scale(0); opacity: 1; }
	55% { transform: translate(-50%, -40%) scale(1); opacity: 1; animation-timing-function: cubic-bezier(0.55, 0, 1, 0.45); }
	60% { transform: translate(-50%, -20%) scale(0.95, 1.1); opacity: 1; animation-timing-function: cubic-bezier(0.55, 0, 1, 0.45); }
	92% { transform: translate(-50%, 64px) scale(0.85, 1.25); opacity: 0.95; }
	100% { transform: translate(-50%, 72px) scale(0.8, 1.25); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) { .echo-drip, .echo-drip-layer { display: none; } }

.echo-nav .wp-block-navigation-item__content { color: var(--echo-bone); text-decoration: none; padding-block: 6px; }
.echo-nav .wp-block-navigation-item__content:hover,
.echo-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--echo-red-bright); }
/* Active page: red text with a short red bar underneath. */
.echo-nav .wp-block-navigation-item__content { position: relative; }
.echo-nav .current-menu-item > .wp-block-navigation-item__content::after {
	content: ""; position: absolute; left: 0; right: 0.16em; bottom: -2px; height: 2px; background: var(--echo-red-bright);
}
.echo-nav .wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content::after { right: 0; }
.echo-footer__nav .current-menu-item > .wp-block-navigation-item__content { color: var(--echo-red-bright); }
.echo-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--echo-ink) !important; color: var(--echo-bone) !important;
	padding: 24px; position: fixed; inset: 0; z-index: 100000;
}
.echo-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 22px; font-size: 1.25rem; }
.echo-nav .wp-block-navigation__responsive-container-open,
.echo-nav .wp-block-navigation__responsive-container-close { color: var(--echo-bone); }
.echo-header__cta .wp-block-button__link { padding: 12px 16px; font-size: 0.8125rem; }

/* Header search: icon, drop-down bar and live results */
.echo-search-toggle { display: flex; align-items: center; }
.echo-search-toggle__btn {
	display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; margin: 0;
	background: transparent; border: 1px solid transparent; color: var(--echo-bone); cursor: pointer; border-radius: 0;
	transition: color 0.15s, border-color 0.15s, background 0.15s;
}
.echo-search-toggle__btn:hover { color: var(--echo-red-bright); }
.echo-search-toggle__btn:focus-visible { outline: 2px solid var(--echo-red-bright); outline-offset: 2px; }
.echo-search-toggle.is-open .echo-search-toggle__btn { background: var(--echo-red); color: #fff; }
.echo-search-scrim { position: fixed; inset: 0; z-index: -2; background: rgba(0, 0, 0, 0.62); }
.echo-search-scrim[hidden], .echo-search-panel[hidden] { display: none !important; }
.echo-search-panel {
	position: absolute; left: 0; right: 0; top: 100%; z-index: 5;
	background: var(--echo-ink); border-bottom: 2px solid var(--echo-red);
	box-shadow: 0 30px 60px rgba(0, 0, 0, 0.6);
	max-height: calc(100vh - 90px); max-height: calc(100dvh - 90px); overflow-y: auto; overscroll-behavior: contain;
}
.echo-search-panel__inner { max-width: var(--echo-wide); margin-inline: auto; padding: 22px var(--echo-gutter) 26px; box-sizing: border-box; }
.echo-search-panel__form { display: flex; align-items: center; gap: 0; border: 1px solid var(--echo-line); background: var(--echo-ink-2); }
.echo-search-panel__form:focus-within { border-color: var(--echo-red); box-shadow: 0 0 0 1px var(--echo-red); }
.echo-search-panel__form > .echo-search-icon { flex: 0 0 auto; margin-left: 16px; color: var(--echo-ash); }
.echo-search-panel__form input[type="search"] {
	flex: 1 1 auto; min-width: 0; min-height: 60px; margin: 0; padding: 0 16px; box-sizing: border-box;
	background: transparent !important; border: 0 !important; outline: none; border-radius: 0; color: var(--echo-bone);
	font-family: var(--echo-title); font-size: clamp(1.125rem, 2.4vw, 1.625rem); letter-spacing: 0.04em;
	-webkit-appearance: none; appearance: none;
}
.echo-search-panel__form input[type="search"]::placeholder { color: #6a6a70; }
.echo-search-panel__form input[type="search"]::-webkit-search-cancel-button { filter: invert(1) brightness(0.7); }
.echo-search-panel__go {
	flex: 0 0 auto; align-self: stretch; min-height: 60px; padding: 0 22px; border: 0; cursor: pointer; border-radius: 0;
	background: var(--echo-red); color: #fff; font-family: var(--echo-text); font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.2em; text-transform: uppercase;
}
.echo-search-panel__go:hover { background: var(--echo-red-bright); }
.echo-search-panel__close {
	flex: 0 0 auto; align-self: stretch; padding: 0 16px; border: 0; border-left: 1px solid var(--echo-line); cursor: pointer; border-radius: 0;
	background: transparent; color: var(--echo-ash); font-family: var(--wp--preset--font-family--vcr, VT323, monospace); font-size: 1.25rem; letter-spacing: 0.06em;
}
.echo-search-panel__close:hover { color: var(--echo-bone); }
.echo-search-toggle.is-loading .echo-search-panel__form > .echo-search-icon { color: var(--echo-red-bright); animation: echo-blink 0.7s steps(2) infinite; }
@keyframes echo-blink { 50% { opacity: 0.25; } }

.echo-search-panel__results:empty { display: none; }
.echo-search-panel__results { margin-top: 20px; }
.echo-sr { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 20px 40px; }
.echo-sr__group ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.echo-sr__group + .echo-sr__group { margin-top: 18px; }
.echo-sr__label { margin: 0 0 6px; font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--echo-red-bright); }
.echo-sr__item { display: flex; align-items: center; gap: 14px; padding: 8px 10px; margin-inline: -10px; text-decoration: none; color: var(--echo-bone); border-left: 2px solid transparent; }
.echo-sr__item:hover, .echo-sr__item:focus-visible { background: var(--echo-ink-3); border-left-color: var(--echo-red); outline: none; color: var(--echo-bone); }
.echo-sr__thumb { flex: 0 0 auto; width: 44px; height: 64px; overflow: hidden; background: var(--echo-ink-3); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; font-family: var(--echo-title); font-size: 0.875rem; color: var(--echo-ash); }
.echo-sr__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.echo-sr__thumb.is-round { width: 48px; height: 48px; border-radius: 50%; }
.echo-sr__thumb.is-round img { filter: grayscale(0.5); }
.echo-sr__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.echo-sr__title { font-family: var(--echo-title); font-size: 1.0625rem; letter-spacing: 0.06em; text-transform: uppercase; line-height: 1.2; }
.echo-sr__by { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--echo-smoke); }
.echo-sr__meta { font-size: 0.8125rem; color: var(--echo-ash); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.echo-sr mark, .echo-sr__title mark { background: transparent; color: var(--echo-red-bright); }
.echo-sr__item--plain { padding-block: 10px; }
.echo-sr__all { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--echo-rule); }
.echo-sr__none, .echo-sr__hint { margin: 4px 0 0; font-family: var(--echo-type); color: var(--echo-smoke); }
.echo-sr__hint { color: var(--echo-ash); }
@media (max-width: 781px) {
	.echo-sr { grid-template-columns: 1fr; }
	.echo-search-panel__go { display: none; }
	.echo-search-panel__inner { padding-top: 16px; }
}
@media (prefers-reduced-motion: reduce) {
	.echo-search-toggle.is-loading .echo-search-panel__form > .echo-search-icon { animation: none; }
}

/* Search results page */
.echo-results__head { padding-bottom: clamp(2rem, 4vw, 3rem); }
.echo-results__form { max-width: 760px; margin-top: 28px; }
.echo-results__head .echo-head__intro { color: var(--echo-red-bright); font-weight: 700; font-size: 0.75rem; letter-spacing: 0.3em; text-transform: uppercase; }
.echo-results__note { max-width: 620px; transform: rotate(-1deg); display: flex; flex-direction: column; gap: 14px; }
.echo-results__note > * { margin: 0; }
.echo-results__try { display: flex; flex-wrap: wrap; gap: 12px 28px; }
.echo-results__none { padding-top: 24px; }

/* Medium screens: tighter menu, the club button lives on the page instead. */
/* The menu, search and club button stay on one line. */
.echo-header__bar, .echo-header__nav { flex-wrap: nowrap !important; }
.echo-header__nav { gap: 12px 16px; }
.echo-nav .wp-block-navigation__container { gap: 14px; }
.echo-brand, .echo-header__cta { flex-shrink: 0; }
.echo-wordmark, .echo-header__cta .wp-block-button__link { white-space: nowrap; }
/* From 1200px up the menu always sits on one line (below that it's the hamburger). */
@media (min-width: 1200px) {
	.echo-nav .wp-block-navigation__container { flex-wrap: nowrap !important; }
	.echo-nav .wp-block-navigation-item__content { white-space: nowrap; }
}
.echo-nav { letter-spacing: 0.095em; }
@media (max-width: 1360px) {
	.echo-header__bar { flex-wrap: nowrap !important; }
	.echo-nav { font-size: 0.8125rem; letter-spacing: 0.12em; }
	.echo-header__nav { gap: 12px 18px; }
	.echo-nav { --wp--style--block-gap: 18px; }
	.echo-nav .wp-block-navigation__container { gap: 18px; }
	.echo-header .echo-header__cta { display: none !important; }
}
/* Below 1200px the menu folds into the hamburger (WordPress's own breakpoint is 600px). */
@media (max-width: 1199px) {
	.echo-header__nav { flex-wrap: nowrap !important; }
	.echo-header__nav .echo-search-toggle { order: -1; }
	.echo-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
	.echo-nav .wp-block-navigation__responsive-container:not(.is-menu-open):not(.hidden-by-default) { display: none !important; }
	.echo-header__bar { flex-wrap: nowrap !important; }
}

/* --------------------------------------------------------------------------
   Window display (hero)
   -------------------------------------------------------------------------- */

.echo-window {
	position: relative; overflow: hidden;
	border-bottom: 1px solid var(--echo-rule);
	background: var(--echo-ink);
}
.scan, .echo-window__scan {
	position: absolute; inset: 0; pointer-events: none;
	background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.25) 0 1px, transparent 1px 3px);
}
.echo-window__bg {
	position: absolute; inset: 0; pointer-events: none;
	background-size: cover; background-repeat: no-repeat;
}
.echo-window__bg.is-mono { filter: grayscale(1) contrast(1.2) brightness(0.9); }
.echo-window__bg.is-blurred { inset: -40px; filter: blur(14px) brightness(0.95) saturate(1.1); transform: scale(1.06); }
.echo-window__bg.is-mono.is-blurred { filter: grayscale(1) contrast(1.25) brightness(0.9) blur(14px); }
/* Darken towards the bottom so the title and buttons stay readable, then melt into the page. */
.echo-window__fade {
	position: absolute; inset: 0; pointer-events: none;
	background:
		linear-gradient(180deg, rgba(10, 10, 11, 0.1) 0%, rgba(10, 10, 11, 0.45) 60%, var(--echo-ink) 100%),
		radial-gradient(ellipse at 50% 30%, rgba(217, 15, 37, 0.12), transparent 60%);
}
.echo-window__vignette {
	position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(ellipse at 50% 38%, transparent 42%, rgba(0, 0, 0, 0.7) 100%);
}
/* The header plus the window fill the screen exactly. The cover display takes whatever height
   the words leave, so a long title or blurb shrinks the cover rather than pushing the page down.
   --echo-header-h is measured by theme.js (72px until then). */
.echo-window { --echo-window-h: calc(100svh - var(--echo-header-h, 72px) - var(--wp-admin--admin-bar--height, 0px) - 1px); }
.echo-window__inner {
	position: relative; max-width: var(--echo-wide); margin: 0 auto; box-sizing: border-box;
	padding: clamp(1.25rem, 4vh, 4rem) var(--echo-gutter) clamp(1.5rem, 5vh, 4rem);
	display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(10px, 2vh, 22px);
	min-height: var(--echo-window-h);
}
.echo-window__stage {
	position: relative; width: min(520px, 100%, 48svh); aspect-ratio: 1;
	display: flex; align-items: center; justify-content: center;
}
@media (min-height: 560px) {
	.echo-window__inner {
		height: var(--echo-window-h); max-height: 1200px; min-height: 0;
		display: grid; grid-template-rows: minmax(140px, 1fr); grid-auto-rows: auto; justify-items: center; align-content: stretch;
	}
	/* The stage fills its row; the circle and cover size from its shorter side (container units),
	   so they stay square, centred and on screen whatever the text above or below takes up. */
	.echo-window__stage { width: 100%; height: 100%; max-width: none; min-width: 0; min-height: 0; aspect-ratio: auto; container-type: size; }
	.echo-window__stage .echo-circle { width: calc(min(100cqw, 100cqh, 560px) * 0.85); }
	.echo-window__stage .echo-window__case { width: calc(min(100cqw, 100cqh, 560px) * 0.56); }
}
.echo-circle {
	position: absolute; width: 85%; aspect-ratio: 1; border-radius: 50%;
	background-color: var(--echo-red);
	background-image: var(--echo-ink-blot); background-size: cover;
	background-blend-mode: multiply;
}
.echo-window__case { position: relative; display: block; width: 56%; text-decoration: none; }
.echo-window__title {
	margin: 0;
	font-family: var(--echo-title); font-weight: 400; text-transform: uppercase;
	font-size: clamp(2.25rem, min(6.5vw, 8.5vh), 5.5rem); line-height: 0.95; letter-spacing: 0.08em;
	overflow-wrap: anywhere;
}
.echo-window__meta { margin: 0; font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--echo-ash); }
.echo-window__blurb { margin: 0; max-width: 620px; font-size: clamp(1rem, 2vh, 1.1875rem); line-height: 1.55; color: var(--echo-smoke); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
@media (max-height: 820px) { .echo-window__blurb { -webkit-line-clamp: 2; line-clamp: 2; } }
/* VCR counter */
.echo-vcr {
	display: inline-flex; flex-direction: column; align-items: center; gap: clamp(2px, 0.6vh, 6px);
	padding: clamp(6px, 1.2vh, 12px) 22px clamp(6px, 1vh, 10px);
	background: linear-gradient(180deg, #120607, #070304);
	border: 1px solid #2c1214; border-radius: 6px;
	box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 30px rgba(0, 0, 0, 0.6);
	position: relative; overflow: hidden;
}
.echo-vcr::after { /* scanlines on the display glass */
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.35) 0 1px, transparent 1px 3px);
}
.echo-vcr__mode { align-self: flex-start; font-family: var(--wp--preset--font-family--vcr, VT323, monospace); font-size: 1rem; letter-spacing: 0.12em; text-transform: uppercase; color: #ff6a52; text-shadow: 0 0 6px rgba(255, 70, 50, 0.6); }
.echo-vcr__play { display: inline-block; animation: echo-blink 1.6s steps(1) infinite; }
.echo-vcr__digits { display: flex; align-items: flex-start; gap: 4px; }
.echo-vcr__unit { display: flex; flex-direction: column; align-items: center; min-width: 2.2ch; }
.echo-vcr__num, .echo-vcr__sep, .echo-vcr__out {
	font-family: var(--wp--preset--font-family--vcr, VT323, monospace); font-size: clamp(2.25rem, min(7vw, 6vh), 4.25rem); line-height: 0.9;
	color: #ff2a3a; text-shadow: 0 0 4px rgba(255, 42, 58, 0.9), 0 0 18px rgba(255, 20, 40, 0.55);
	font-variant-numeric: tabular-nums;
}
.echo-vcr__sep { animation: echo-blink 1s steps(1) infinite; padding: 0 2px; }
.echo-vcr__cap { margin-top: 4px; font-family: var(--echo-text); font-weight: 700; font-size: 0.625rem; letter-spacing: 0.26em; text-transform: uppercase; color: #8c4b4f; }
.echo-vcr__out { padding: 4px 8px; letter-spacing: 0.08em; }
.echo-vcr__out[hidden], .echo-vcr__digits[hidden] { display: none; }
@keyframes echo-blink { 50% { opacity: 0.15; } }
@media (prefers-reduced-motion: reduce) { .echo-vcr__sep, .echo-vcr__play { animation: none; } }

.echo-window__actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px; margin-top: 4px; }
@media (max-width: 600px) {
	.echo-window__meta { font-size: 0.6875rem; letter-spacing: 0.14em; }
	.echo-window__actions { flex-wrap: nowrap; gap: 10px; margin-top: 0; }
	.echo-window__actions .echo-btn { padding-inline: 14px; font-size: 0.6875rem; letter-spacing: 0.14em; white-space: nowrap; }
}

/* Red censor bar: on placeholders always, on real art only when switched on. */
.echo-censor { display: none; position: absolute; top: 25%; left: 19%; width: 62%; height: clamp(18px, 6%, 30px); background: var(--echo-red); pointer-events: none; z-index: 3; }
.has-censor .echo-censor,
.echo-window__case:has(.echo-case__fallback) .echo-censor,
.echo-book__side--front:has(.echo-case__fallback) .echo-censor { display: block; }

/* --------------------------------------------------------------------------
   Cases (face out)
   -------------------------------------------------------------------------- */

.echo-case {
	position: relative; display: block; aspect-ratio: 0.65;
	background: var(--echo-ink-3);
	box-shadow: 0 18px 32px rgba(0, 0, 0, 0.6), inset 0 0 0 6px rgba(0, 0, 0, 0.4);
	overflow: hidden;
	border-radius: 2px;
}
.echo-case__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(0.88) contrast(1.04); }
.echo-case__fallback {
	position: absolute; inset: 8px; border: 1px dashed rgba(242, 242, 240, 0.16);
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 12px; text-align: center;
}
.echo-case { container-type: inline-size; }
.echo-case__fallback-title { font-family: var(--echo-title); font-size: clamp(0.85rem, 12cqi, 1.6rem); line-height: 1.1; letter-spacing: 0.06em; text-transform: uppercase; color: var(--echo-bone); overflow-wrap: break-word; hyphens: auto; -webkit-hyphens: auto; max-width: 100%; }
.echo-case__fallback-credit { font-weight: 700; font-size: 0.625rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--echo-ash); }
/* 3D mockup covers: no case, shown whole */
.echo-case.echo-case--mockup { background: none; box-shadow: none; border-radius: 0; }
.echo-case--mockup .echo-case__img { object-fit: contain; filter: drop-shadow(0 18px 22px rgba(0, 0, 0, 0.65)) saturate(0.92); }
.echo-case--mockup.scuff::after, .echo-case--mockup .echo-case__track { display: none; }
/* 3D mockups: the sash becomes a tilted label at the top left; stickers bottom left, audio bottom right. */
.echo-case--mockup .echo-sash { top: 6px; left: -4px; width: auto; transform: rotate(-6deg); padding: 5px 12px; font-size: 0.625rem; }
.echo-case--mockup .echo-sash--long { letter-spacing: 0.1em; }
.echo-case--mockup .echo-sticker { bottom: 6px; left: 2px; }
.echo-case--hero { box-shadow: 0 30px 60px rgba(0, 0, 0, 0.75), inset 0 0 0 8px rgba(0, 0, 0, 0.45); }
.echo-case--hero.echo-case--mockup { box-shadow: none; }
/* Book page: the case follows the cover's own shape, and the picture is never cropped. */
.echo-book__side .echo-case__img { object-fit: contain; }
.echo-case--fit { background: none; }
.echo-case--hero .echo-case__fallback-title { font-size: clamp(2rem, 5vw, 3.25rem); font-weight: 300; }
.echo-window__case .echo-case__fallback-title { font-size: clamp(0.9rem, 13cqi, 2.75rem); }

/* Wear and tear on cases, stickers and sashes */
.scuff { position: relative; }
.scuff::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 2;
	background:
		repeating-linear-gradient(112deg, rgba(255, 255, 255, 0.07) 0 1px, transparent 1px 7px),
		repeating-linear-gradient(23deg, rgba(0, 0, 0, 0.18) 0 1px, transparent 1px 13px),
		radial-gradient(ellipse at 90% 8%, rgba(0, 0, 0, 0.45), transparent 42%),
		radial-gradient(ellipse at 4% 96%, rgba(255, 255, 255, 0.08), transparent 35%);
}
.echo-case.scuff::after { mix-blend-mode: normal; }

/* VHS tracking line on hover */
.echo-case__track { position: absolute; left: 0; right: 0; top: -12%; height: 10%; background: rgba(242, 242, 240, 0.12); opacity: 0; pointer-events: none; z-index: 3; }

.echo-sticker {
	/* Stickers (New, Just in, Reserved, Due…, custom) sit at the bottom left; the top is for sashes. */
	position: absolute; bottom: 10px; left: 10px; z-index: 4;
	font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.2em; text-transform: uppercase; line-height: 1.2;
	padding: 5px 8px; transform: rotate(-4deg);
	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.45);
}
.echo-sticker--red { background: var(--echo-red); color: #fff; }
.echo-sticker--paper { background: var(--echo-paper-dark); color: var(--echo-pinch); }
.echo-sash {
	/* A band across the top-right corner, centred on a fixed spot so short and long labels both fit. */
	position: absolute; z-index: 4; left: 78cqi; top: 15cqi; width: 150cqi;
	transform: translate(-50%, -50%) rotate(35deg);
	display: flex; justify-content: center; padding: 1.7cqi 0; box-sizing: border-box;
	background: var(--echo-paper); color: var(--echo-ink);
	font-family: var(--echo-text); font-weight: 700; font-size: clamp(0.5625rem, 5cqi, 0.875rem); letter-spacing: 0.22em; line-height: 1.2; text-transform: uppercase; white-space: nowrap;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
	pointer-events: none;
}
.echo-sash--long { left: 72cqi; top: 21cqi; font-size: clamp(0.5rem, 4.4cqi, 0.8125rem); letter-spacing: 0.12em; }
.echo-sash--video-nasty { background: var(--echo-paper); color: var(--echo-ink); }
.echo-sash--french-extremity { background: #111114; color: #f6f4ef; box-shadow: inset 0 3px 0 #1f4fa8, inset 0 -3px 0 #e2343a, 0 2px 4px rgba(0, 0, 0, 0.5); }
.echo-sash--heavy-metal { background: linear-gradient(180deg, #2b2b30, #09090a); border-block: 1px solid #8d8d92; font-family: var(--echo-title); font-weight: 500; }
.echo-sash--heavy-metal > span { background: linear-gradient(180deg, #ffffff 0%, #d7d7d4 42%, #6c6c72 52%, #f4f4f2 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.echo-sash--reissue { background: var(--echo-red); color: #fff; }
.echo-sash--slasher { background: repeating-linear-gradient(-55deg, var(--echo-bone) 0 12px, #e2ded5 12px 14px); color: var(--echo-red-ink); }
.echo-sash--monsters { background: #7ccf3f; color: #0d1a07; }
.echo-sash--custom { background: var(--echo-red-deep); color: #fff; }
/* Audiobooks: a small headphones tag in its own corner. */
.echo-audio-tag {
	position: absolute; right: 8px; bottom: 8px; z-index: 4;
	display: inline-flex; align-items: center; gap: 4px; padding: 3px 6px 3px 5px;
	background: rgba(10, 10, 11, 0.86); color: var(--echo-bone); border: 1px solid rgba(242, 242, 240, 0.22); border-radius: 2px;
	font-family: var(--echo-text); font-weight: 700; font-size: 0.5625rem; letter-spacing: 0.18em; line-height: 1; text-transform: uppercase;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.45); pointer-events: none;
}
.echo-audio-tag svg { flex: none; color: var(--echo-red-bright); }
.echo-case--hero .echo-audio-tag { right: 12px; bottom: 12px; font-size: 0.6875rem; padding: 5px 9px 5px 7px; }
.echo-case--hero .echo-audio-tag svg { width: 15px; height: 15px; }
/* Small covers (narrow shelves, phones): the audio tag shrinks to just the headphones. */
@container (max-width: 175px) {
	.echo-audio-tag { padding: 4px; }
	.echo-audio-tag span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.echo-sticker { font-size: 0.625rem; letter-spacing: 0.14em; }
}
.echo-case--hero .echo-sticker { font-size: 0.8125rem; padding: 7px 10px; bottom: 14px; left: 14px; }
/* Custom stickers are hand-picked like sashes, so they go at the top, in whichever corner the sash leaves free. */
.echo-sticker--custom { top: 10px; right: 10px; bottom: auto; left: auto; max-width: 48cqi; white-space: normal; text-align: center; transform: rotate(4deg); }
.echo-sash ~ .echo-sticker--custom { right: auto; left: 8px; max-width: 30cqi; font-size: clamp(0.5625rem, 4.6cqi, 0.75rem); letter-spacing: 0.1em; padding: 4px 6px; transform: rotate(-4deg); }
.echo-case--mockup .echo-sticker--custom { top: 8px; right: 4px; bottom: auto; left: auto; transform: rotate(4deg); }
.echo-case--hero .echo-sticker--custom { top: 14px; right: 14px; bottom: auto; left: auto; }
.echo-case--hero .echo-sash ~ .echo-sticker--custom { right: auto; left: 14px; }


.echo-case-item { display: flex; flex-direction: column; gap: 14px; text-decoration: none; color: var(--echo-bone); }
.echo-case-item .echo-case { transition: transform .15s ease; }
.echo-case-item:hover .echo-case { transform: translateY(-6px); }
.echo-case-item:hover .echo-case__track,
.echo-window__case:hover .echo-case__track { opacity: 1; animation: echo-roll 1.1s linear infinite; }
@keyframes echo-roll { from { top: -12%; } to { top: 105%; } }
.echo-case-item__caption { display: flex; flex-direction: column; gap: 4px; }
.echo-case-item__title { font-family: var(--echo-title); font-weight: 500; font-size: 1.125rem; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.2; }
.echo-case-item__author { font-family: var(--echo-title); font-weight: 400; font-size: 0.8125rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--echo-smoke); line-height: 1.3; }
.echo-case-item__credit { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--echo-ash); }
.echo-case-item:hover .echo-case-item__title { color: var(--echo-red-bright); }

/* --------------------------------------------------------------------------
   Shelves
   -------------------------------------------------------------------------- */

.echo-shelf__faces {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(min(170px, 42%), 1fr));
	gap: 36px 28px; align-items: start;
}
.echo-shelf__spines { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 4px; padding-inline: 8px; }
.echo-shelf__faces[hidden], .echo-shelf__spines[hidden] { display: none; }
.echo-shelf__lip {
	height: 10px; margin-top: 20px; background: var(--echo-ink-3);
	border-top: 1px solid var(--echo-red);
	box-shadow: 0 16px 22px rgba(0, 0, 0, 0.7);
}

.echo-spine {
	position: relative;
	display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: 12px;
	width: 60px; height: var(--spine-h, 320px); padding: 14px 4px; box-sizing: border-box;
	background: var(--spine, var(--echo-ink-3));
	box-shadow: inset -4px 0 0 rgba(0, 0, 0, 0.4), inset 2px 0 0 rgba(255, 255, 255, 0.05);
	text-decoration: none; color: var(--echo-bone);
	transition: transform .15s ease;
}
.echo-spine:hover { transform: translateY(-8px); }
.echo-spine--image { width: var(--spine-w, 60px); padding: 0 0 10px; justify-content: flex-end; background: var(--spine) var(--spine-img) center / 100% 100% no-repeat; }
.echo-spine--image .echo-spine__tag { margin: 0 3px; }
.echo-spine:hover .echo-spine__title { color: var(--echo-red-bright); }
.echo-spine__title {
	writing-mode: vertical-rl; transform: rotate(180deg);
	font-family: var(--echo-title); font-size: 1.125rem; letter-spacing: 0.14em; text-transform: uppercase;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-height: calc(100% - 60px);
	position: relative; z-index: 3;
}
.echo-spine__tag {
	position: relative; z-index: 3;
	font-weight: 700; font-size: 0.5625rem; letter-spacing: 0.1em; text-transform: uppercase; line-height: 1.15;
	padding: 4px 3px; text-align: center; max-width: 100%; box-sizing: border-box;
}
.echo-spine__tag--red { background: var(--echo-red); color: #fff; }
.echo-spine__tag--paper { background: var(--echo-paper-dark); color: var(--echo-pinch); }
.echo-spine__skull { width: 20px; height: auto; position: relative; z-index: 3; }

.echo-toggle { display: inline-flex; border: 1px solid var(--echo-line); }
.echo-toggle button {
	min-height: 44px; padding: 0 18px; border: 0; cursor: pointer;
	background: transparent; color: var(--echo-ash);
	font-family: var(--echo-text); font-weight: 700; font-size: 0.75rem; letter-spacing: 0.22em; text-transform: uppercase;
}
.echo-toggle button:hover { color: var(--echo-bone); }
.echo-toggle button[aria-pressed="true"] { background: var(--echo-red); color: #fff; }

/* --------------------------------------------------------------------------
   Countdown & certificate
   -------------------------------------------------------------------------- */

.echo-countdown { display: inline-flex; align-items: center; gap: 12px; border: 1px solid var(--echo-line); padding: 8px 16px; text-align: left; }
.echo-countdown__num { font-family: var(--echo-title); font-weight: 300; font-size: 2.75rem; line-height: 1; color: var(--echo-red-bright); font-variant-numeric: tabular-nums; }
.echo-countdown__txt { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; line-height: 1.5; max-width: 13ch; }

.echo-cert { display: inline-flex; align-items: center; gap: 12px; }
.echo-cert__disc {
	width: 54px; height: 54px; flex: none; border-radius: 50%; border: 2px solid var(--echo-red-bright); color: var(--echo-red-bright);
	display: flex; align-items: center; justify-content: center;
	font-family: var(--echo-title); font-weight: 500; font-size: 1.375rem;
}
.echo-cert__text { display: flex; flex-direction: column; gap: 3px; }
.echo-cert__name { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.22em; text-transform: uppercase; }
.echo-cert__note { font-size: 0.9375rem; color: var(--echo-ash); }

/* --------------------------------------------------------------------------
   Old paper
   -------------------------------------------------------------------------- */

.echo-paper,
.wp-block-group.is-style-paper,
.wp-block-group.is-style-taped-paper {
	position: relative;
	background-color: var(--echo-paper);
	background-image:
		var(--echo-fibre),
		var(--echo-foxing),
		var(--echo-tide),
		var(--echo-stains),
		radial-gradient(ellipse at 12% 8%, rgba(255, 250, 235, 0.35), transparent 45%),
		radial-gradient(ellipse at 95% 100%, rgba(120, 85, 30, 0.22), transparent 55%),
		linear-gradient(170deg, transparent 60%, rgba(100, 70, 25, 0.12));
	color: var(--echo-pinch);
	border-radius: 9px 5px 11px 6px;
	box-shadow: inset 0 0 40px rgba(115, 82, 35, 0.38), inset 0 0 5px rgba(80, 55, 20, 0.55), var(--echo-shadow);
	padding: clamp(28px, 4vw, 44px) clamp(22px, 3.5vw, 40px) clamp(24px, 3vw, 34px);
	box-sizing: border-box;
}
.echo-paper--b { background-color: #ebe3d1; }
.echo-paper--c { background-color: var(--echo-paper-dark); }
.echo-paper--d { background-color: #e0d5bd; }
/* Shift the stains so neighbouring sheets don't share the same marks. */
.echo-paper, .wp-block-group.is-style-paper, .wp-block-group.is-style-taped-paper { background-position: 0 0, 40px 70px, -120px -60px, -60px -200px, 0 0, 0 0, 0 0; }
.echo-paper--b, .echo-friends > .echo-friend:nth-child(3n+2), .echo-authors__item:nth-child(3n+2) .echo-polaroid { background-position: 0 0, -90px 30px, -360px -140px, -300px -40px, 0 0, 0 0, 0 0; }
.echo-paper--c, .echo-friends > .echo-friend:nth-child(3n+3), .echo-authors__item:nth-child(3n+3) .echo-polaroid { background-position: 0 0, 150px -80px, -220px -380px, -420px -310px, 0 0, 0 0, 0 0; }
.echo-paper--d { background-position: 0 0, -40px -150px, -500px -250px, -150px -420px, 0 0, 0 0, 0 0; }
.echo-paper a:where(:not(.wp-element-button, .wp-block-button__link)), .is-style-paper a:where(:not(.wp-element-button, .wp-block-button__link)), .is-style-taped-paper a:where(:not(.wp-element-button, .wp-block-button__link)) { color: var(--echo-red-ink); }
.echo-paper a:where(:not(.wp-element-button, .wp-block-button__link)):hover, .is-style-paper a:where(:not(.wp-element-button, .wp-block-button__link)):hover, .is-style-taped-paper a:where(:not(.wp-element-button, .wp-block-button__link)):hover { color: var(--echo-red); }
.echo-paper :where(h1, h2, h3, h4), .is-style-paper :where(h1, h2, h3, h4), .is-style-taped-paper :where(h1, h2, h3, h4) { color: var(--echo-pinch); }
.echo-paper__kicker { margin: 0; font-weight: 700; font-size: 0.75rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--echo-red-ink); }

/* torn red tape */
.echo-paper--taped::before,
.wp-block-group.is-style-taped-paper::before {
	content: ""; position: absolute; top: -12px; left: 50%; width: 120px; height: 24px; margin-left: -60px;
	background: var(--echo-red); opacity: 0.78; transform: rotate(2deg);
	clip-path: polygon(0 8%, 4% 0, 9% 10%, 14% 2%, 20% 6%, 80% 4%, 86% 0, 91% 9%, 96% 1%, 100% 7%, 98% 92%, 94% 100%, 89% 90%, 84% 98%, 78% 94%, 22% 96%, 16% 100%, 10% 91%, 5% 99%, 1% 90%);
}
/* coffee ring: a dried mug mark with a darker tide line, a second half-ring and drips */
.echo-paper--stain::after {
	content: ""; position: absolute; right: 18px; bottom: 14px; width: 132px; height: 132px; pointer-events: none;
	background: var(--echo-coffee) center / contain no-repeat;
	mix-blend-mode: multiply; transform: rotate(-14deg); z-index: 0;
}

.echo-boxback.echo-paper--stain::after { top: 6px; bottom: auto; right: 10px; transform: rotate(32deg) scale(0.92); }

/* --------------------------------------------------------------------------
   Staff pick + audio pair
   -------------------------------------------------------------------------- */

.echo-pair-wrap { padding-block: clamp(4rem, 9vw, 6rem) clamp(3rem, 7vw, 4.5rem); padding-inline: var(--echo-gutter); }
.echo-pair { gap: 48px !important; align-items: stretch !important; }
.echo-pair > .wp-block-column { display: flex; flex-direction: column; }
.echo-pair > .wp-block-column > * { flex: 1; }

.echo-staff { transform: rotate(-1deg); display: flex; flex-direction: column; gap: 14px; }
.echo-staff__title { margin: 0; font-family: var(--echo-title); font-weight: 400; text-transform: uppercase; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.05; letter-spacing: 0.04em; }
.echo-staff p { margin: 0; }
.echo-staff__sign { color: #57575c; font-size: 0.9375rem !important; }
.echo-staff .echo-arrow { align-self: flex-start; }

.echo-audio {
	display: flex; flex-direction: column; gap: 18px;
	background: var(--echo-red-deep); color: #fff;
	padding: clamp(24px, 3.5vw, 32px); border-radius: 6px;
	background-image: var(--echo-fibre); background-blend-mode: multiply;
}
.echo-audio a { color: #fff; }
.echo-audio__top { display: flex; gap: 18px; align-items: center; }
.echo-audio__art { position: relative; width: 104px; aspect-ratio: 1; flex: none; background: var(--echo-pinch); overflow: hidden; display: block; }
.echo-audio__art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: none; }
.echo-audio__art .echo-case__fallback { inset: 4px; }
.echo-audio__art .echo-case__fallback-title { font-size: 0.75rem; }
.echo-audio__art .echo-case__fallback-credit { display: none; }
.echo-audio__heads { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.echo-audio__label { margin: 0; font-weight: 700; font-size: 0.75rem; letter-spacing: 0.3em; text-transform: uppercase; color: #ffd6da; }
.echo-audio__title { margin: 0; font-family: var(--echo-title); font-weight: 400; text-transform: uppercase; font-size: clamp(1.75rem, 3vw, 2.375rem); line-height: 1; letter-spacing: 0.06em; }
.echo-audio__title a { text-decoration: none; }
.echo-audio__narrator, .echo-audio__text { margin: 0; }
.echo-audio__narrator { color: #ffd6da; font-size: 0.9375rem; }
.echo-audio__text { font-size: 1.0625rem; line-height: 1.55; }
.echo-audio__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: auto; }

.echo-player { display: flex; align-items: center; gap: 16px; background: rgba(0, 0, 0, 0.28); padding: 14px 16px; }
.echo-player--inline { background: var(--echo-ink-2); border: 1px solid var(--echo-rule); }
.echo-player__play {
	width: 48px; height: 48px; flex: none; border-radius: 50%; border: 0; cursor: pointer;
	background: #fff; display: flex; align-items: center; justify-content: center;
}
.echo-player__icon { width: 0; height: 0; border-style: solid; border-width: 9px 0 9px 14px; border-color: transparent transparent transparent var(--echo-red-deep); margin-left: 4px; }
.is-playing .echo-player__icon { width: 14px; height: 16px; border: 0; margin: 0; background: linear-gradient(90deg, var(--echo-red-deep) 0 35%, transparent 35% 65%, var(--echo-red-deep) 65%); }
.echo-player__body { flex: 1; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.echo-player__label { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; }
.echo-player__bar { position: relative; height: 4px; background: rgba(255, 255, 255, 0.28); cursor: pointer; }
.echo-player__bar::before { content: ""; position: absolute; inset: -10px 0; }
.echo-player__fill { display: block; width: 0; height: 100%; background: #fff; }
.echo-player--inline .echo-player__fill { background: var(--echo-red-bright); }
.echo-player__time { font-size: 0.875rem; font-variant-numeric: tabular-nums; opacity: 0.85; }
/* Volume: speaker (mute) + slider */
.echo-player__vol { display: flex; align-items: center; gap: 8px; flex: none; }
.echo-player__mute {
	display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; margin: 0;
	background: transparent; border: 1px solid transparent; border-radius: 0; color: currentColor; cursor: pointer; opacity: 0.9;
}
.echo-player__mute:hover { opacity: 1; border-color: currentColor; }
.echo-player__mute:focus-visible { outline: 2px solid var(--echo-red-bright); outline-offset: 2px; }
.echo-player__cross { display: none; }
.is-muted .echo-player__waves { display: none; }
.is-muted .echo-player__cross { display: inline; }
.echo-player__volume {
	--v: 80%; --track: rgba(255, 255, 255, 0.28); --fill: #fff;
	width: 84px; height: 20px; margin: 0; padding: 0; background: transparent; cursor: pointer;
	-webkit-appearance: none; appearance: none;
}
.echo-player--inline .echo-player__volume { --fill: var(--echo-red-bright); --track: var(--echo-line); }
.echo-player__volume[hidden] { display: none; }
.echo-player__volume::-webkit-slider-runnable-track { height: 4px; background: linear-gradient(90deg, var(--fill) 0 var(--v), var(--track) var(--v)); }
.echo-player__volume::-moz-range-track { height: 4px; background: var(--track); }
.echo-player__volume::-moz-range-progress { height: 4px; background: var(--fill); }
.echo-player__volume::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; margin-top: -4px; border: 0; border-radius: 1px; background: var(--fill); box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.35); }
.echo-player__volume::-moz-range-thumb { width: 12px; height: 12px; border: 0; border-radius: 1px; background: var(--fill); box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.35); }
.echo-player__volume:focus-visible { outline: 2px solid var(--echo-red-bright); outline-offset: 3px; }
@media (max-width: 480px) {
	.echo-player { flex-wrap: wrap; row-gap: 10px; }
	.echo-player__vol { order: 3; width: 100%; padding-left: 64px; box-sizing: border-box; }
	.echo-player__volume { flex: 1; width: auto; }
}

/* --------------------------------------------------------------------------
   Notice board + flyers
   -------------------------------------------------------------------------- */

.echo-flyers,
.echo-flyer-query .wp-block-post-template {
	list-style: none; margin: 0; padding: 0;
	display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 36px 32px;
}
.echo-flyer {
	transform: rotate(var(--tilt, -1deg));
	display: flex; flex-direction: column; gap: 12px;
	padding-top: 30px !important;
}
.echo-flyer-query .wp-block-post:nth-child(4n+1) .echo-flyer { --tilt: -1.5deg; }
.echo-flyer-query .wp-block-post:nth-child(4n+2) .echo-flyer { --tilt: 1deg; background-color: #ebe3d1; }
.echo-flyer-query .wp-block-post:nth-child(4n+3) .echo-flyer { --tilt: -0.8deg; background-color: var(--echo-paper-dark); }
.echo-flyer-query .wp-block-post:nth-child(4n+4) .echo-flyer { --tilt: 1.4deg; background-color: #e0d5bd; }
.echo-flyer > * { margin: 0 !important; }
.echo-flyer__pin,
.echo-flyer-query .echo-flyer::before {
	content: ""; position: absolute; top: -7px; left: 50%; margin-left: -7px; width: 14px; height: 14px; border-radius: 50%;
	background: var(--echo-red); box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5), inset -2px -2px 0 rgba(0, 0, 0, 0.25);
}
.echo-flyer__kicker, .echo-flyer .wp-block-post-date {
	font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--echo-red-ink);
}
.echo-flyer__title, .echo-flyer .wp-block-post-title {
	font-family: var(--echo-title); font-weight: 500; font-size: 1.5rem; line-height: 1.15; letter-spacing: 0.02em; text-transform: none;
	color: var(--echo-pinch) !important; text-decoration: none;
}
.echo-flyer .wp-block-post-title a { color: var(--echo-pinch); text-decoration: none; }
.echo-flyer a.echo-flyer__title::after, .echo-flyer .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; z-index: 3; } /* whole flyer clickable */
.echo-flyer:hover .echo-flyer__title, .echo-flyer:hover .wp-block-post-title a { color: var(--echo-red-ink) !important; }
.echo-flyer__more { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; }
.echo-flyer__more::after { content: " →"; }
.echo-flyer__img { display: block; margin: -6px -6px 4px !important; padding: 6px 6px 18px; background: #f4efe4; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25); transform: rotate(calc(var(--tilt, 0deg) * -1.6)); }
.echo-flyer__img img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; filter: grayscale(0.25) contrast(1.05) sepia(0.12); }
.echo-flyer__excerpt, .echo-flyer .wp-block-post-excerpt { font-size: 0.9375rem; color: #3a3530; }
.echo-flyer .wp-block-post-excerpt__more-text { display: none; }

/* --------------------------------------------------------------------------
   Press strip
   -------------------------------------------------------------------------- */

.echo-press-strip {
	gap: 18px 56px; padding: 30px var(--echo-gutter) !important;
	border-bottom: 1px solid var(--echo-rule);
	margin-block: 0 !important;
}
.echo-press-strip p { margin: 0; }
.echo-press-strip__label { font-weight: 700; font-size: 0.75rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--echo-red-bright); }
.echo-press-strip { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.echo-press-strip__name { font-family: var(--echo-title); font-size: 1.5rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--echo-ash); }
.echo-press-strip__name a { color: inherit; text-decoration: none; }
.echo-press-strip__name a:hover { color: var(--echo-bone); }
.echo-press-strip__name.has-logo { line-height: 0; }
.echo-press-strip__logo { display: block; height: clamp(26px, 3vw, 38px); width: auto; max-width: 190px; object-fit: contain; transition: filter .2s, opacity .2s; }
/* White: any logo becomes a white silhouette, full colour on hover. */
.is-logos-white .echo-press-strip__logo { filter: grayscale(1) brightness(0) invert(1); opacity: 0.6; }
.is-logos-white .echo-press-strip__name:hover .echo-press-strip__logo,
.is-logos-white a:focus-visible .echo-press-strip__logo { filter: none; opacity: 1; }
.is-logos-original .echo-press-strip__logo { opacity: 0.85; }
.is-logos-original .echo-press-strip__name:hover .echo-press-strip__logo { opacity: 1; }

/* --------------------------------------------------------------------------
   Join the club
   -------------------------------------------------------------------------- */

.echo-club { padding-block: clamp(4rem, 9vw, 6rem); scroll-margin-top: 90px; }
.echo-club__inner { display: flex; flex-wrap: wrap; gap: 56px; align-items: center; }
.echo-club__card-wrap { flex: 1 1 min(380px, 100%); min-width: 0; display: flex; justify-content: center; }
.echo-club__text { flex: 1 1 min(440px, 100%); min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.echo-club__intro { margin: 0; font-size: 1.125rem; line-height: 1.6; color: var(--echo-smoke); }

.echo-memcard {
	position: relative; width: 420px; max-width: 100%; aspect-ratio: 1.586; box-sizing: border-box; overflow: hidden;
	display: flex; flex-direction: column; justify-content: space-between;
	padding: 26px 28px;
	background-color: var(--echo-paper);
	background-image: var(--echo-fibre), radial-gradient(ellipse at 10% 0%, rgba(255, 250, 235, 0.3), transparent 50%), linear-gradient(170deg, transparent 55%, rgba(100, 70, 25, 0.16));
	color: var(--echo-pinch);
	border-radius: 16px 12px 18px 13px;
	box-shadow: inset 0 0 34px rgba(115, 82, 35, 0.4), inset 0 0 4px rgba(80, 55, 20, 0.55), 0 30px 60px rgba(0, 0, 0, 0.7);
	transform: rotate(-3deg);
}
.echo-memcard__stripe { position: absolute; left: 0; right: 0; top: 0; height: 10px; background: var(--echo-red); }
.echo-memcard__brand { display: flex; align-items: center; gap: 12px; margin-top: 6px; }
.echo-memcard__brand img { width: 27px; height: auto; }
.echo-memcard__brand > span { display: flex; flex-direction: column; gap: 4px; line-height: 1; }
.echo-memcard__name { font-family: var(--echo-title); font-weight: 500; font-size: 1.3rem; letter-spacing: 0.14em; text-transform: uppercase; }
.echo-memcard__sub { font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.28em; text-transform: uppercase; color: #57575c; }
.echo-memcard__fields { display: flex; flex-direction: column; gap: 10px; font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.2em; text-transform: uppercase; }
.echo-memcard__row { display: flex; gap: 10px; align-items: flex-end; }
.echo-memcard__ink { flex: 1; border-bottom: 1px solid var(--echo-pinch); font-family: var(--echo-type); font-weight: 400; font-size: 1.0625rem; letter-spacing: 0; text-transform: none; color: var(--echo-red-ink); }
.echo-memcard__small { font-size: 0.75rem; color: #57575c; }

/* Make common newsletter plugin forms fit the look */
.echo-club__form form { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.echo-club__form label { display: block; font-weight: 700; font-size: 0.75rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--echo-ash); margin-bottom: 6px; }
.echo-club__form input[type="email"],
.echo-club__form input[type="text"],
.echo-search input[type="search"],
.wp-block-search__input {
	min-height: 52px; box-sizing: border-box; width: 100%;
	background: var(--echo-ink-2) !important; color: var(--echo-bone) !important;
	border: 1px solid var(--echo-line) !important; border-radius: 0 !important;
	font-family: var(--echo-text); font-size: 1.0625rem; padding: 12px 14px;
}
.echo-club__form input[type="submit"],
.echo-club__form button,
.wp-block-search__button {
	min-height: 52px; padding: 0 26px !important; border: 0 !important; border-radius: 0 !important; cursor: pointer;
	background: var(--echo-red) !important; color: #fff !important;
	font-family: var(--echo-text) !important; font-weight: 700 !important; font-size: 0.875rem !important; letter-spacing: 0.2em !important; text-transform: uppercase !important;
}
.echo-club__form input[type="submit"]:hover, .echo-club__form button:hover, .wp-block-search__button:hover { background: var(--echo-red-bright) !important; }
.echo-club__form p { margin: 0; flex: 1 1 260px; }
/* Brevo signup (Publisher details → Brevo signup form) */
.echo-club__form .echo-brevo { display: flex; flex-direction: column; gap: 14px; align-items: stretch; }
.echo-brevo[hidden] { display: none !important; }
.echo-brevo__row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: end; }
.echo-brevo__row:has(> :only-child) { grid-template-columns: 1fr; }
.echo-brevo__row--email { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.echo-club__form .echo-brevo__field { margin: 0; flex: none; }
.echo-brevo__go { min-height: 52px; }
.echo-brevo__go[disabled] { opacity: 0.7; cursor: progress; }
.echo-brevo__trap { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0; }
.echo-club__form .echo-brevo__small { margin: 0; flex: none; font-size: 0.8125rem; color: var(--echo-ash); }
.echo-brevo__captcha { position: absolute; width: 0; height: 0; overflow: hidden; }
.echo-brevo__status { margin: 0; padding: 14px 16px; border-left: 3px solid var(--echo-red); background: var(--echo-ink-2); font-family: var(--echo-type); font-size: 1.0625rem; line-height: 1.5; color: var(--echo-bone); }
.echo-brevo__status[hidden] { display: none; }
.echo-brevo__status.is-error { color: #ff8a92; }
.grecaptcha-badge { visibility: hidden; } /* Brevo's form says "Protected by reCAPTCHA" instead. */
@media (max-width: 480px) { .echo-brevo__row, .echo-brevo__row--email { grid-template-columns: 1fr; } .echo-brevo__go { width: 100%; } }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.echo-footer {
	background: #070708; border-top: 1px solid var(--echo-red);
	padding-block: clamp(3.5rem, 8vw, 4.5rem) 2rem;
	margin-block: 0 !important;
}
.echo-footer__top { gap: 32px; align-items: flex-end !important; }
.echo-rewind {
	margin: 0;
	font-family: var(--echo-title); font-weight: 300; text-transform: uppercase;
	font-size: clamp(3rem, 7vw, 6rem); line-height: 1; letter-spacing: 0.08em;
}
.echo-rewind mark { background: none; color: var(--echo-red-bright); }
.echo-footer__brand { gap: 18px !important; }
.echo-footer__tagline { margin: 0; color: var(--echo-ash); font-size: 1rem; }
.echo-social { gap: 14px !important; margin: 0; }
.echo-social .wp-social-link { color: var(--echo-bone); background: none !important; }
.echo-social .wp-social-link a { padding: 4px !important; }
.echo-social .wp-social-link svg { width: 22px; height: 22px; }
.echo-social .wp-social-link:hover { color: var(--echo-red-bright); transform: none; }
.echo-social:not(:has(li)) { display: none; }
.echo-footer__nav { margin-left: auto; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 48px !important; }
.echo-footer__nav .wp-block-navigation__container { display: contents; }
.echo-footer__nav .wp-block-navigation-item__content { color: var(--echo-bone); text-decoration: none; }
.echo-footer__nav .wp-block-navigation-item__content:hover { color: var(--echo-red-bright); }
.echo-footer__small { border-top: 1px solid var(--echo-rule); padding-top: 20px; margin-top: 44px !important; gap: 12px 24px; font-size: 0.875rem; color: #8a8a8a; }
.echo-footer__small p { margin: 0; }
.echo-footer__small a { color: #8a8a8a; }

/* --------------------------------------------------------------------------
   Book page
   -------------------------------------------------------------------------- */

.echo-book__crumbs-wrap { padding-top: 24px; }
.echo-crumbs { display: flex; flex-wrap: wrap; gap: 10px; font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--echo-ash); }
.echo-crumbs a { color: var(--echo-ash); text-decoration: none; }
.echo-crumbs a:hover { color: var(--echo-red-bright); }
.echo-crumbs [aria-current] { color: var(--echo-bone); }

.echo-book__main { display: flex; flex-direction: column; gap: clamp(32px, 6vw, 64px); align-items: stretch; padding-block: 40px 80px; }
.echo-book__stage { display: flex; flex-direction: column; align-items: center; gap: 24px; }
/* Side by side, with the cover staying in view while you scroll, only once there's room for both
   columns. Stacked (narrower) it scrolls normally, so it can't sit on top of the text. */
@media (min-width: 1040px) {
	.echo-book__main { flex-direction: row; flex-wrap: nowrap; align-items: flex-start; }
	.echo-book__stage { flex: 1 1 380px; min-width: 0; position: sticky; top: calc(var(--echo-header-h, 72px) + var(--wp-admin--admin-bar--height, 0px) + 32px); }
}
.echo-book__case-wrap { position: relative; width: min(480px, 100%); aspect-ratio: 1; display: flex; align-items: center; justify-content: center; }
.echo-book__case-wrap .echo-circle { width: 88%; }
.echo-book__case { position: relative; width: 62%; }
.echo-book__case[data-side="spine"] { width: auto; }
.echo-book__side { position: relative; }
.echo-book__side[hidden] { display: none; }
.echo-book__side--spine .echo-spine { --spine-h: 420px !important; margin: 0 auto; }

.echo-book__info { min-width: 0; display: flex; flex-direction: column; gap: 26px; }
@media (min-width: 1040px) { .echo-book__info { flex: 999 1 540px; } }
.echo-book__titles { display: flex; flex-direction: column; gap: 12px; }
.echo-book__title {
	margin: 0; font-family: var(--echo-title); font-weight: 400; text-transform: uppercase;
	font-size: clamp(3rem, 7.5vw, 7rem); line-height: 0.95; letter-spacing: 0.08em; overflow-wrap: anywhere;
}
.echo-book__author { margin: 2px 0 0; font-family: var(--echo-title); font-weight: 400; font-size: clamp(1.25rem, 2.2vw, 1.75rem); letter-spacing: 0.1em; text-transform: uppercase; color: var(--echo-smoke); }
.echo-book__author a { color: var(--echo-bone); text-decoration-color: var(--echo-red-bright); text-underline-offset: 4px; }
.echo-book__author a:hover { color: var(--echo-red-bright); }
.echo-book__sub { margin: 0; font-weight: 700; font-size: 0.8125rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--echo-ash); }
.echo-book__badges { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; }

.echo-boxback { display: flex; flex-direction: column; gap: 16px; }
.echo-boxback__tagline { margin: 0; font-family: var(--echo-title); font-size: clamp(1.4rem, 2.6vw, 1.75rem); line-height: 1.2; letter-spacing: 0.02em; }
.echo-boxback__blurb { font-size: 1.0625rem; line-height: 1.65; }
.echo-boxback__blurb > * { margin: 0 0 1em; }
.echo-boxback__blurb > *:last-child { margin-bottom: 0; }
.echo-boxback__credits {
	margin: 4px 0 0; border-top: 1px solid var(--echo-pinch); padding-top: 14px;
	font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.2em; line-height: 1.9; text-transform: uppercase; text-align: center; color: #3a3a3f;
	position: relative; z-index: 1;
}

.echo-book__buy { display: flex; flex-direction: column; gap: 16px; }
.echo-formats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; }
.echo-format { display: flex; flex-direction: column; gap: 10px; border: 1px solid var(--echo-rule); background: var(--echo-ink-2); padding: 18px; }
.echo-format__name { font-family: var(--echo-title); font-weight: 500; font-size: 1.25rem; letter-spacing: 0.1em; text-transform: uppercase; }
.echo-format__price { font-size: 0.9375rem; color: var(--echo-ash); min-height: 1.4em; }
.echo-format__note { margin-top: -6px; font-family: var(--echo-type); font-size: 0.9375rem; color: var(--echo-smoke); }
.echo-format.is-soon .echo-format__price { color: var(--echo-red-bright); font-weight: 700; font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase; }
.echo-format .echo-btn { margin-top: auto; }
.echo-format__isbn { font-size: 0.75rem; letter-spacing: 0.08em; color: #7d7d82; font-variant-numeric: tabular-nums; }
.echo-book__retailers { margin: 0; font-size: 0.9375rem; color: var(--echo-ash); }

.echo-specs { background: var(--echo-ink-2); border-block: 1px solid var(--echo-rule); }
.echo-specs__list { margin: 0 auto; padding-block: 30px; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 20px; }
.echo-specs__item { display: flex; flex-direction: column; gap: 6px; }
.echo-specs dt { font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.26em; text-transform: uppercase; color: var(--echo-red-bright); }
.echo-specs dd { margin: 0; font-family: var(--echo-title); font-size: 1.25rem; letter-spacing: 0.08em; text-transform: uppercase; }
.echo-specs dd a { text-decoration: none; }

.echo-book__extras { display: flex; flex-wrap: wrap; gap: 40px; padding-block: 80px 8px; }
.echo-trivia { flex: 1 1 440px; transform: rotate(0.8deg); }
.echo-trivia__title { margin: 10px 0 12px; font-family: var(--echo-title); font-weight: 400; text-transform: uppercase; font-size: clamp(1.75rem, 3vw, 2.25rem); line-height: 1.05; letter-spacing: 0.06em; }
.echo-trivia .echo-typewriter { margin: 0; }
.echo-press { flex: 1 1 360px; border: 1px solid var(--echo-rule); background: var(--echo-ink-2); padding: 32px; display: flex; flex-direction: column; gap: 14px; justify-content: center; }
.echo-press p { margin: 0; }
.echo-press__outlet { font-family: var(--echo-title); font-size: 2rem; letter-spacing: 0.14em; text-transform: uppercase; }
.echo-press__text { color: var(--echo-smoke); font-size: 1.0625rem; line-height: 1.6; }
.echo-book__related { padding-bottom: clamp(4rem, 9vw, 6rem); }

/* About the author */
.echo-author { display: flex; flex-wrap: wrap; gap: clamp(28px, 5vw, 56px); align-items: center; padding-block: 80px 0; }
.echo-author__photo { flex: 0 0 auto; width: min(260px, 70vw); margin: 0; padding: 14px 14px 18px !important; transform: rotate(-2.5deg); display: flex; flex-direction: column; gap: 10px; }
.echo-author__photo img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: grayscale(0.35) contrast(1.05); }
.echo-author__photo figcaption { text-align: center; font-size: 1rem; }
.echo-author__text { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.echo-author__name { margin: 0; font-family: var(--echo-title); font-weight: 400; text-transform: uppercase; font-size: clamp(2rem, 4vw, 3rem); line-height: 1; letter-spacing: 0.06em; }
.echo-author__bio { color: var(--echo-smoke); font-size: 1.0625rem; line-height: 1.7; max-width: 68ch; }
.echo-author__bio p { margin: 0 0 1em; }
.echo-author__bio p:last-child { margin: 0; }

/* --------------------------------------------------------------------------
   Catalogue
   -------------------------------------------------------------------------- */

.echo-catalogue { padding-top: clamp(2.5rem, 6vw, 4rem); padding-bottom: clamp(4rem, 9vw, 6rem); }
.echo-filters { display: flex; flex-direction: column; gap: 14px; margin-bottom: 40px; }
.echo-filters ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.echo-filters__tabs a {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; box-sizing: border-box;
	border: 1px solid var(--echo-line); text-decoration: none; color: var(--echo-ash);
	font-weight: 700; font-size: 0.75rem; letter-spacing: 0.22em; text-transform: uppercase;
}
.echo-filters__tabs a:hover { color: var(--echo-bone); border-color: var(--echo-bone); }
.echo-filters__tabs a[aria-current] { background: var(--echo-red); border-color: var(--echo-red); color: #fff; }
.echo-filters__shelves a {
	display: inline-block; padding: 6px 10px; text-decoration: none;
	background: var(--echo-paper-dark); color: var(--echo-pinch);
	font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase;
	border-radius: 3px 2px 4px 2px;
}
.echo-filters__shelves li:nth-child(odd) a { transform: rotate(-1deg); }
.echo-filters__shelves li:nth-child(even) a { transform: rotate(1deg); }
.echo-filters__shelves a:hover { background: var(--echo-paper); }
.echo-filters__shelves a[aria-current] { background: var(--echo-red); color: #fff; }
.echo-filters__count { margin: 0; font-family: var(--echo-type); color: var(--echo-ash); }
.echo-nothing { padding: 48px 0; }
.echo-nothing__big { font-family: var(--echo-title); font-size: 2rem; text-transform: uppercase; letter-spacing: 0.08em; margin: 0 0 12px; }

/* --------------------------------------------------------------------------
   Pages, posts, prose
   -------------------------------------------------------------------------- */

.echo-prose { font-size: 1.125rem; line-height: 1.7; color: var(--echo-smoke); }
.echo-prose :where(h2, h3, h4) { color: var(--echo-bone); margin-top: 2em; }
.echo-prose a:where(:not(.wp-element-button, .wp-block-button__link)) { color: var(--echo-bone); text-decoration-color: var(--echo-red-bright); text-underline-offset: 3px; }
.echo-prose a:where(:not(.wp-element-button, .wp-block-button__link)):hover { color: var(--echo-red-bright); }
.wp-block-post-featured-image.is-style-scuffed,
.wp-block-image.is-style-scuffed { position: relative; }
.wp-block-post-featured-image.is-style-scuffed img,
.wp-block-image.is-style-scuffed img { filter: saturate(0.85) contrast(1.05); }
.wp-block-post-featured-image.is-style-scuffed::after,
.wp-block-image.is-style-scuffed::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.18) 0 1px, transparent 1px 3px), radial-gradient(ellipse at 50% 50%, transparent 55%, rgba(0, 0, 0, 0.55));
}
.echo-post-nav { margin-top: 4rem !important; border-top: 1px solid var(--echo-rule); padding-top: 2rem; gap: 24px; }
.echo-post-nav a { text-decoration: none; font-family: var(--echo-title); text-transform: uppercase; letter-spacing: 0.06em; }

/* Page patterns */
.echo-page-cols { gap: clamp(28px, 4vw, 48px) !important; }
.echo-page-cols h3 { margin-top: 0.6em; }
.echo-page-card { max-width: 640px; margin-inline: auto !important; }
.echo-page-cols .echo-page-card { max-width: none; width: 100%; margin-inline: 0 !important; height: 100%; display: flex; flex-direction: column; box-sizing: border-box; }
.echo-page-cols .echo-page-card .wp-block-buttons { margin-top: auto; padding-top: 12px; }
.echo-page-card h3 { margin: 0.3em 0 0.4em; color: var(--echo-pinch); }
.echo-link-list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--echo-rule); }
.echo-link-list li { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--echo-rule); }
.echo-link-list strong { min-width: 160px; font-family: var(--echo-text); font-weight: 700; font-size: 0.75rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--echo-red-bright); }
.echo-link-list a { font-family: var(--echo-title); font-size: 1.25rem; letter-spacing: 0.02em; text-decoration: none; color: var(--echo-bone); }

/* Links page: the looping video on an old portable TV, and friends as business cards. */
.echo-tv { position: relative; margin-block: clamp(2rem, 5vw, 3rem) 0 !important; padding: clamp(10px, 1.6vw, 18px); background: linear-gradient(160deg, #26262a, #121215 60%); border: 1px solid var(--echo-line); border-radius: 18px; box-shadow: var(--echo-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.06); box-sizing: border-box; }
.echo-tv video { display: block; width: 100%; height: auto; border-radius: 22px / 16px; background: #000; filter: contrast(1.08) saturate(0.85); }
.echo-tv::after { /* scan lines and glass */
	content: ""; position: absolute; inset: clamp(10px, 1.6vw, 18px); border-radius: 22px / 16px; pointer-events: none;
	background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.22) 0 1px, transparent 1px 3px), radial-gradient(ellipse at 50% 45%, transparent 55%, rgba(0, 0, 0, 0.55));
	box-shadow: inset 0 0 40px rgba(0, 0, 0, 0.7);
}
.echo-friends__heading { margin-top: clamp(2.5rem, 5vw, 3.5rem) !important; margin-bottom: 0 !important; font-size: var(--wp--preset--font-size--large) !important; display: flex; align-items: center; gap: 16px; }
.echo-friends__heading::after { content: ""; flex: 1; height: 1px; background: var(--echo-rule); }
.echo-friends { gap: clamp(28px, 3.5vw, 40px) !important; margin-top: 28px !important; align-items: stretch; }
.echo-friend { display: flex; flex-direction: column; gap: 10px; height: 100%; padding: 18px 18px 22px !important; transform: rotate(var(--tilt, -0.6deg)); }
.echo-friends > .echo-friend:nth-child(3n+2) { --tilt: 0.7deg; background-color: #ebe3d1; }
.echo-friends > .echo-friend:nth-child(3n+3) { --tilt: -0.3deg; background-color: var(--echo-paper-dark); }
.echo-friend > * { margin: 0 !important; }
.echo-friend__logo { background: var(--echo-ink); border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.4), 0 2px 6px rgba(0, 0, 0, 0.3); }
.echo-friend__logo a { display: flex; align-items: center; justify-content: center; height: 140px; padding: 18px; box-sizing: border-box; }
.echo-friend__logo img { display: block; max-width: 100%; max-height: 100%; width: auto !important; height: auto !important; object-fit: contain; transition: transform 0.2s ease; }
.echo-friend__logo a:hover img { transform: scale(1.04); }
.echo-friend__name { margin-top: 6px !important; color: var(--echo-pinch); font-size: 1.375rem !important; letter-spacing: 0.04em; line-height: 1.15; }
.echo-friend p { color: #3a3530; font-size: 1rem; line-height: 1.55; }
.echo-friend .echo-friend__visit { margin-top: auto !important; padding-top: 8px; }
.echo-friend .echo-friend__visit a { color: var(--echo-red-ink); font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; text-decoration: none; }
.echo-friend .echo-friend__visit a:hover { color: var(--echo-red); }
.echo-friend__visit a::after { content: " →"; }
@media (prefers-reduced-motion: reduce) { .echo-friend__logo img { transition: none; } }
.echo-link-list a:hover { color: var(--echo-red-bright); }
.echo-link-list a::after { content: " →"; color: var(--echo-red-bright); }
.echo-contact-email { font-size: clamp(1.5rem, 3.5vw, 2.25rem) !important; text-transform: none !important; letter-spacing: 0.02em !important; overflow-wrap: anywhere; }
.echo-contact-email a { text-decoration-color: var(--echo-red-bright); text-underline-offset: 6px; }
.echo-contact-list { padding-left: 1.1em; display: flex; flex-direction: column; gap: 10px; }
.echo-contact-list strong { font-family: var(--echo-text); font-size: 0.8125rem; letter-spacing: 0.12em; text-transform: uppercase; }
.echo-social--big .wp-social-link svg { width: 30px; height: 30px; }
.echo-main--page .echo-shelf, .echo-main--page .echo-press-strip, .echo-main--page .echo-club { margin-top: clamp(2rem, 5vw, 3.5rem) !important; }

.wp-block-group.is-style-band { background: var(--echo-ink-2); border-block: 1px solid var(--echo-rule); }

.echo-pagination { margin-top: 56px !important; gap: 8px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; font-size: 0.8125rem; }
.echo-pagination a, .echo-pagination .page-numbers { text-decoration: none; padding: 10px 14px; border: 1px solid var(--echo-line); }
.echo-pagination .page-numbers.current { background: var(--echo-red); border-color: var(--echo-red); color: #fff; }

.echo-search { max-width: 640px; margin-bottom: 48px !important; }
.echo-search .wp-block-search__inside-wrapper { border: 0 !important; padding: 0 !important; gap: 8px; }

.echo-404 { padding-block: clamp(3rem, 9vw, 6rem); display: flex; flex-direction: column; gap: 20px; }
.echo-404 .echo-head__title { font-size: clamp(3rem, 9vw, 7rem); }

.echo-empty-note {
	font-family: var(--echo-type); font-size: 0.9375rem; color: var(--echo-pinch);
	background: var(--echo-paper); padding: 14px 18px; border-radius: 6px 4px 7px 5px;
	max-width: 640px; margin: 0 auto;
}

/* --------------------------------------------------------------------------
   Editor tweaks
   -------------------------------------------------------------------------- */

.editor-styles-wrapper { background: var(--echo-ink); }
.echo-editor-preview { pointer-events: auto; }
.editor-styles-wrapper .echo-header { position: relative; top: 0; }
.editor-styles-wrapper .echo-window { --echo-window-h: 820px; }

/* --------------------------------------------------------------------------
   Authors: polaroids pinned to the staff wall
   -------------------------------------------------------------------------- */

.echo-authors {
	list-style: none; margin: 0; padding: 18px 0 0;
	display: grid; grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr)); gap: clamp(40px, 5vw, 56px) clamp(24px, 3vw, 40px);
}
.echo-authors--four { grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr)); }
.echo-authors__item { --tilt: -2deg; min-width: 0; }
.echo-authors__item:nth-child(4n+2) { --tilt: 1.5deg; }
.echo-authors__item:nth-child(4n+3) { --tilt: -0.8deg; }
.echo-authors__item:nth-child(4n+4) { --tilt: 2.4deg; }
.echo-authors__link { display: flex; flex-direction: column; align-items: center; gap: 16px; text-decoration: none; color: inherit; height: 100%; }
.echo-authors__link:focus-visible { outline: 2px solid var(--echo-red-bright); outline-offset: 6px; }

.echo-polaroid {
	display: flex; flex-direction: column; gap: 12px; width: 100%; max-width: 260px;
	padding: 12px 12px 16px !important; border-radius: 3px 4px 2px 5px;
	transform: rotate(var(--tilt, -2deg));
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.echo-polaroid::before { /* pin */
	content: ""; position: absolute; top: -8px; left: 50%; margin-left: -8px; width: 16px; height: 16px; border-radius: 50%; z-index: 2;
	background: var(--echo-red); box-shadow: 0 3px 4px rgba(0, 0, 0, 0.55), inset -2px -2px 0 rgba(0, 0, 0, 0.25), inset 2px 2px 0 rgba(255, 255, 255, 0.18);
}
.echo-polaroid__photo { display: block; position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: #16161a; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25); }
.echo-polaroid__photo img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(0.55) contrast(1.08) sepia(0.12); transition: filter 0.3s ease; }
.echo-polaroid__photo::after { /* faded print */
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: radial-gradient(ellipse at 50% 40%, transparent 55%, rgba(30, 18, 5, 0.35)), linear-gradient(160deg, rgba(255, 240, 210, 0.12), transparent 40%);
}
.echo-polaroid__none {
	display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;
	font-family: var(--echo-title); font-size: clamp(2.5rem, 6vw, 4rem); letter-spacing: 0.08em; color: var(--echo-line);
	background: repeating-linear-gradient(135deg, #18181b 0 10px, #1d1d21 10px 20px);
}
.echo-polaroid__name { display: block; text-align: center; font-size: 1.0625rem; line-height: 1.3; color: var(--echo-pinch); }

.echo-authors__link:hover .echo-polaroid,
.echo-authors__link:focus-visible .echo-polaroid { transform: rotate(0deg) translateY(-6px); box-shadow: inset 0 0 40px rgba(115, 82, 35, 0.38), inset 0 0 5px rgba(80, 55, 20, 0.55), 0 30px 50px rgba(0, 0, 0, 0.75); }
.echo-authors__link:hover .echo-polaroid__photo img { filter: grayscale(0) contrast(1.05); }

.echo-authors__meta { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; max-width: 260px; }
.echo-authors__role { color: var(--echo-smoke); font-size: 0.9375rem; line-height: 1.4; }
.echo-authors__count { font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--echo-red-bright); }
.echo-authors__link:hover .echo-authors__role { color: var(--echo-bone); }

/* Author page */
.echo-profile__hero { padding-block: clamp(2.5rem, 6vw, 4.5rem) clamp(3rem, 7vw, 5rem); }
.echo-profile__inner { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: clamp(36px, 6vw, 80px); align-items: start; }
.echo-profile__photo { padding-top: 12px; }
.echo-profile__photo .echo-polaroid { --tilt: -2.5deg; max-width: 340px; padding: 16px 16px 22px !important; }
.echo-profile__photo .echo-polaroid__name { font-size: 1.25rem; }
.echo-profile__text { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.echo-profile__name { margin: 0; font-family: var(--echo-title); font-weight: 400; text-transform: uppercase; letter-spacing: 0.06em; line-height: 0.95; font-size: clamp(2.5rem, 6vw, 4.75rem); overflow-wrap: anywhere; }
.echo-profile__role { margin: 0; font-family: var(--echo-type); font-size: 1.125rem; color: var(--echo-smoke); }
.echo-profile__count { margin: 0; font-weight: 700; font-size: 0.75rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--echo-red-bright); }
.echo-profile__bio { margin-top: 8px; }
.echo-profile__bio strong, .echo-author__bio strong { color: var(--echo-bone); font-weight: 500; }
.echo-profile__links { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.echo-author__role { margin: -4px 0 0; font-family: var(--echo-type); color: var(--echo-smoke); }
.echo-author + .echo-author { padding-top: 56px; }
@media (max-width: 781px) {
	.echo-profile__inner { grid-template-columns: 1fr; }
	.echo-profile__photo { max-width: 280px; margin-inline: auto; }
}
@media (max-width: 480px) {
	.echo-authors { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 18px; }
	.echo-polaroid { padding: 8px 8px 12px !important; gap: 8px; }
	.echo-polaroid__name { font-size: 0.875rem; }
	.echo-authors__role { font-size: 0.8125rem; }
	.echo-authors__count { font-size: 0.625rem; letter-spacing: 0.16em; }
}
@media (prefers-reduced-motion: reduce) {
	.echo-polaroid { transition: none; }
}

/* --------------------------------------------------------------------------
   Back of the book (printed from the book's details)
   -------------------------------------------------------------------------- */

.echo-back.scuff::after { opacity: 0.45; }
.echo-back { background: radial-gradient(ellipse at 50% -10%, #222226, #0b0b0c 68%); color: var(--echo-bone); }
.echo-back__inner { position: absolute; inset: 0; display: flex; flex-direction: column; gap: 3cqi; padding: 7cqi 7cqi 6cqi; box-sizing: border-box; text-align: left; }
.echo-back__kicker { align-self: flex-start; background: var(--echo-red); color: #fff; padding: 0.7cqi 1.8cqi; font-family: var(--echo-text); font-weight: 700; font-size: 2.5cqi; letter-spacing: 0.3em; text-transform: uppercase; line-height: 1.3; }
.echo-back__tagline { font-family: var(--echo-title); font-weight: 400; font-size: 5.8cqi; line-height: 1.1; letter-spacing: 0.03em; text-transform: uppercase; color: var(--echo-bone); }
.echo-back__stills { display: grid; grid-template-columns: 1.5fr 1fr; gap: 2.4cqi; height: 25cqi; flex: none; padding: 1cqi 1cqi 0; }
.echo-back__still { display: block; overflow: hidden; border: 1cqi solid #ece6d8; box-shadow: 0 1cqi 2cqi rgba(0, 0, 0, 0.6); transform: rotate(-1.6deg); background: #222; }
.echo-back__still--b { transform: rotate(2.2deg) translateY(1cqi); }
.echo-back__still img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; filter: grayscale(0.35) contrast(1.2) sepia(0.2); }
.echo-back__still--b img { object-position: 50% 70%; transform: scale(1.7); filter: grayscale(1) contrast(1.35); }
.echo-back__blurb { flex: 1 1 auto; min-height: 0; overflow: hidden; font-family: var(--echo-text); font-size: 3.1cqi; line-height: 1.45; color: var(--echo-smoke); -webkit-mask-image: linear-gradient(#000 78%, transparent); mask-image: linear-gradient(#000 78%, transparent); }
.echo-back__billing { flex: none; border-top: 1px solid rgba(242, 242, 240, 0.18); padding-top: 2cqi; font-family: var(--echo-text); font-weight: 500; font-size: 2.1cqi; line-height: 1.4; letter-spacing: 0.1em; text-transform: uppercase; text-align: center; color: var(--echo-ash); }
.echo-back__foot { flex: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 3cqi; }
.echo-back__cert { flex: none; width: 10.5cqi; height: 10.5cqi; border-radius: 50%; border: 0.6cqi solid var(--echo-red-bright); color: var(--echo-red-bright); display: flex; align-items: center; justify-content: center; font-family: var(--echo-title); font-weight: 500; font-size: 4.6cqi; box-sizing: border-box; }
.echo-back__cert--blank { visibility: hidden; }
.echo-back__brand { display: flex; align-items: center; gap: 1.4cqi; margin-bottom: 1cqi; }
.echo-back__brand img { width: 3.4cqi; height: auto; }
.echo-back__brand span { background: var(--echo-red); color: var(--echo-ink); font-family: var(--echo-title); font-weight: 500; font-size: 2.8cqi; letter-spacing: 0.2em; text-transform: uppercase; padding: 0.3cqi 1cqi 0.3cqi 1.4cqi; white-space: nowrap; }
.echo-back__code { flex: none; width: 29cqi; background: #f3efe5; padding: 1.6cqi 1.8cqi 0.8cqi; box-sizing: border-box; }
.echo-back__code .echo-barcode { display: block; width: 100%; height: auto; }
.echo-barcode__digits { font-family: var(--echo-text); font-size: 6.5px; letter-spacing: 1.1px; }
.echo-back__code--none { width: auto; background: none; border: 1px dashed var(--echo-line); color: var(--echo-ash); padding: 1.6cqi 2cqi; font-family: var(--echo-text); font-weight: 700; font-size: 1.9cqi; letter-spacing: 0.2em; text-transform: uppercase; }

/* --------------------------------------------------------------------------
   Close-up viewer (book page)
   -------------------------------------------------------------------------- */

.echo-book__case { cursor: zoom-in; }
.echo-book__views { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: 10px; }
.echo-zoom-open {
	display: inline-flex; align-items: center; gap: 8px; padding: 0 16px; min-height: 44px; margin: 0; cursor: zoom-in; border-radius: 0;
	background: transparent; color: var(--echo-bone); border: 1px solid var(--echo-line);
	font-family: var(--echo-text); font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.2em; text-transform: uppercase;
	transition: background 0.15s, border-color 0.15s;
}
.echo-zoom-open:hover, .echo-zoom-open:focus-visible { background: var(--echo-red); border-color: var(--echo-red); color: #fff; outline: none; }
html.echo-zoom-locked { overflow: hidden; }

dialog.echo-zoom {
	position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
	background: #070708; color: var(--echo-bone); overflow: hidden; box-sizing: border-box;
}
dialog.echo-zoom[open] { display: flex; flex-direction: column; }
dialog.echo-zoom::backdrop { background: rgba(0, 0, 0, 0.75); }
.echo-zoom__bar { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; padding: 12px clamp(14px, 3vw, 28px); border-bottom: 1px solid var(--echo-red); background: var(--echo-ink); }
.echo-zoom__title { flex: 1 1 200px; min-width: 0; margin: 0; font-family: var(--echo-title); font-size: 1.125rem; letter-spacing: 0.08em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.echo-zoom__btn {
	min-height: 40px; padding: 0 16px; cursor: pointer; border-radius: 0; border: 1px solid var(--echo-line); background: transparent; color: var(--echo-bone);
	font-family: var(--echo-text); font-weight: 700; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase;
}
.echo-zoom__btn:hover, .echo-zoom__btn[aria-pressed="true"] { border-color: var(--echo-red); background: var(--echo-red); color: #fff; }
.echo-zoom__close { width: 44px; height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--echo-bone); font-size: 2rem; line-height: 1; cursor: pointer; }
.echo-zoom__close:hover { color: var(--echo-red-bright); }
.echo-zoom__view { flex: 1 1 auto; min-height: 0; overflow: auto; display: flex; cursor: zoom-in; overscroll-behavior: contain; outline: none; background: radial-gradient(ellipse at 50% 45%, #1a1a1d, transparent 65%); }
.echo-zoom__view:focus-visible { box-shadow: inset 0 0 0 2px var(--echo-red-bright); }
.echo-zoom.is-zoomed .echo-zoom__view { cursor: grab; }
.echo-zoom.is-dragging .echo-zoom__view { cursor: grabbing; user-select: none; }
.echo-zoom__sizer { position: relative; flex: none; margin: auto; }
.echo-zoom__item { position: absolute; top: 0; left: 0; transform-origin: 0 0; }
.echo-zoom__item .echo-zoom__img { display: block; width: 600px; height: auto; max-width: none; user-select: none; -webkit-user-drag: none; }
.echo-zoom__item--front .echo-zoom__img { filter: drop-shadow(0 20px 30px rgba(0, 0, 0, 0.6)); }
.echo-zoom__item .echo-case { width: 460px; }
.echo-zoom__item .echo-spine { --spine-h: 460px !important; pointer-events: none; }
.echo-zoom__item a { pointer-events: none; }
.echo-zoom__hint { flex: none; margin: 0; padding: 10px 16px 14px; text-align: center; font-family: var(--echo-text); font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--echo-ash); }
@media (max-width: 600px) {
	.echo-zoom__title { flex-basis: 100%; order: -1; font-size: 1rem; }
	.echo-zoom__close { position: absolute; top: 6px; right: 6px; }
	.echo-zoom__hint { font-size: 0.625rem; letter-spacing: 0.12em; }
}

/* --------------------------------------------------------------------------
   Seasonal display (end-cap)
   -------------------------------------------------------------------------- */

.echo-season { position: relative; isolation: isolate; overflow: hidden; }
.echo-season > .echo-section__inner { position: relative; z-index: 1; }
.echo-season__deco { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.echo-season__head { display: flex; align-items: flex-start; gap: 24px 36px; }
.echo-season__head > .echo-head { flex: 1 1 auto; min-width: 0; margin-bottom: 0; }
.echo-season .echo-head { margin-bottom: 0; }
.echo-season__head + * { margin-top: clamp(28px, 4vw, 44px); }
.echo-season__count {
	flex: none; order: -1; margin: 0; width: 128px; height: 128px; box-sizing: border-box; padding: 18px;
	display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 2px;
	background: var(--echo-red); color: #fff; transform: rotate(-9deg);
	clip-path: polygon(50.0% 0.0%, 59.6% 8.1%, 71.7% 5.0%, 76.8% 16.4%, 89.1% 18.8%, 88.7% 31.3%, 98.7% 38.9%, 93.0% 50.0%, 98.7% 61.1%, 88.7% 68.7%, 89.1% 81.2%, 76.8% 83.6%, 71.7% 95.0%, 59.6% 91.9%, 50.0% 100.0%, 40.4% 91.9%, 28.3% 95.0%, 23.2% 83.6%, 10.9% 81.2%, 11.3% 68.7%, 1.3% 61.1%, 7.0% 50.0%, 1.3% 38.9%, 11.3% 31.3%, 10.9% 18.8%, 23.2% 16.4%, 28.3% 5.0%, 40.4% 8.1%);
	filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.5));
}
.echo-season__count-num { font-family: var(--wp--preset--font-family--vcr, VT323, monospace); font-size: 3rem; line-height: 0.85; letter-spacing: 0.02em; }
.echo-season__count-txt { font-family: var(--echo-text); font-weight: 700; font-size: 0.625rem; line-height: 1.25; letter-spacing: 0.14em; text-transform: uppercase; max-width: 84px; }
.echo-season__count.is-today .echo-season__count-num { font-size: 1.75rem; }

/* Spooky: cobwebs in the corners, a spider on a thread, candlelight */
.echo-season.is-look-spooky { background: radial-gradient(ellipse 70% 60% at 50% 115%, rgba(217, 15, 37, 0.16), transparent 70%), radial-gradient(ellipse 50% 40% at 50% 0%, rgba(255, 220, 170, 0.05), transparent 70%); }
.echo-season.is-look-spooky.is-band { background-color: var(--echo-ink-2); }
.echo-season.is-look-spooky::before { /* candle flicker */
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background: radial-gradient(ellipse 45% 35% at 50% 100%, rgba(255, 120, 60, 0.07), transparent 70%);
	animation: echo-flicker 3.2s steps(1) infinite;
}
@keyframes echo-flicker { 0%, 100% { opacity: 1; } 12% { opacity: 0.7; } 14% { opacity: 1; } 47% { opacity: 0.85; } 49% { opacity: 1; } 71% { opacity: 0.6; } 73% { opacity: 0.95; } }
.echo-web { position: absolute; top: -2px; width: clamp(130px, 17vw, 250px); height: auto; color: rgba(242, 242, 240, 0.2); }
.echo-web--left { left: -2px; }
.echo-web--right { right: -2px; transform: scaleX(-1); }
.echo-spider { position: absolute; top: 0; left: 82%; width: 1px; height: 110px; background: linear-gradient(rgba(242, 242, 240, 0.4), rgba(242, 242, 240, 0.25)); animation: echo-spider 9s ease-in-out infinite; }
.echo-spider__body { position: absolute; left: -15px; bottom: -22px; width: 30px; height: 30px; animation: echo-sway 3s ease-in-out infinite alternate; transform-origin: 50% 0; }
@keyframes echo-spider { 0%, 100% { height: 70px; } 45%, 60% { height: 150px; } }
@keyframes echo-sway { from { transform: rotate(-6deg); } to { transform: rotate(6deg); } }

/* Festive: fairy lights along the top, falling snow */
.echo-season.is-look-festive { padding-top: calc(clamp(3.5rem, 8vw, 5.5rem) + 28px); background: radial-gradient(ellipse 80% 50% at 50% 0%, rgba(255, 200, 120, 0.06), transparent 70%); }
.echo-lights { position: absolute; top: 0; left: 0; right: 0; height: 52px; }
.echo-lights__wire { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.echo-lights__bulb {
	--c: #ff2a3d; position: absolute; width: 10px; height: 15px; margin: -1px 0 0 -5px;
	border-radius: 50% 50% 46% 46% / 62% 62% 38% 38%;
	background: radial-gradient(circle at 40% 70%, #fff8 0 2px, transparent 3px), var(--c);
	box-shadow: 0 0 10px 3px color-mix(in srgb, var(--c) 55%, transparent), 0 0 26px 6px color-mix(in srgb, var(--c) 22%, transparent);
	transform: rotate(var(--r, 0deg)); transform-origin: 50% 0;
	animation: echo-twinkle 2.6s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -0.41s);
}
.echo-lights__bulb::before { content: ""; position: absolute; top: -4px; left: 2px; width: 6px; height: 5px; background: #1d2a1f; border-radius: 1px; }
.echo-lights__bulb.is-red { --c: #ff2a3d; }
.echo-lights__bulb.is-amber { --c: #ffb22e; }
.echo-lights__bulb.is-green { --c: #39d47a; }
.echo-lights__bulb.is-white { --c: #fff2cf; }
.echo-lights__bulb.is-blue { --c: #5aa7ff; }
@keyframes echo-twinkle { 0%, 40% { opacity: 1; } 70% { opacity: 0.45; box-shadow: 0 0 4px 1px color-mix(in srgb, var(--c) 40%, transparent); } 100% { opacity: 0.95; } }
.echo-snow {
	position: absolute; inset: -260px 0 0; opacity: 0.55;
	background-image:
		radial-gradient(2px 2px at 20px 30px, #fff, transparent),
		radial-gradient(1.5px 1.5px at 130px 90px, #fff, transparent),
		radial-gradient(2.5px 2.5px at 210px 170px, rgba(255, 255, 255, 0.8), transparent),
		radial-gradient(1.5px 1.5px at 70px 220px, #fff, transparent),
		radial-gradient(2px 2px at 170px 250px, rgba(255, 255, 255, 0.7), transparent);
	background-size: 260px 260px;
	animation: echo-snow 22s linear infinite;
}
@keyframes echo-snow { from { transform: translateY(0); } to { transform: translateY(260px); } }

/* Valentine: blood drips from the top edge (a repeating strip, so drips are never cut off) */
.echo-season.is-look-valentine { padding-top: calc(clamp(3.5rem, 8vw, 5.5rem) + 46px); background: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(217, 15, 37, 0.12), transparent 70%); }
.echo-drips { position: absolute; top: 0; left: 0; width: 100%; height: 170px; overflow: visible; filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 0.5)); }
.echo-drip { transform-box: fill-box; transform-origin: 50% 0; animation: echo-ooze var(--dur, 6s) ease-in-out var(--del, 0s) infinite alternate; }
@keyframes echo-ooze { 0% { transform: scaleY(0.82); } 60% { transform: scaleY(1.06); } 100% { transform: scaleY(1.18); } }
.echo-drop { transform-box: fill-box; animation: echo-drop var(--fall, 8s) cubic-bezier(0.5, 0, 0.9, 0.6) var(--fdel, 0s) infinite; }
@keyframes echo-drop {
	0%, 55% { transform: translateY(0) scale(0.6); opacity: 1; }
	68% { transform: translateY(6px) scale(1); opacity: 1; }
	92% { transform: translateY(150px) scale(0.9, 1.15); opacity: 1; }
	93%, 100% { transform: translateY(150px); opacity: 0; }
}

/* Summer camp: a night in the woods. Stars, a crescent moon, pine treeline, campfire glow, fireflies */
.echo-season.is-look-summer {
	padding-bottom: calc(clamp(2rem, 4vw, 3rem) + 90px);
	background:
		radial-gradient(ellipse 55% 45% at 50% 100%, rgba(255, 120, 30, 0.22), transparent 70%),
		linear-gradient(180deg, #0b1220 0%, #0d121a 35%, var(--echo-ink) 75%);
}
.echo-stars {
	position: absolute; inset: 0 0 35%; opacity: 0.8;
	background-image:
		radial-gradient(1.2px 1.2px at 12px 18px, #fff, transparent), radial-gradient(1px 1px at 96px 64px, #dfe8ff, transparent),
		radial-gradient(1.6px 1.6px at 170px 30px, #fff, transparent), radial-gradient(1px 1px at 230px 110px, #fff, transparent),
		radial-gradient(1.3px 1.3px at 300px 52px, #f6f0d8, transparent), radial-gradient(1px 1px at 52px 140px, #fff, transparent),
		radial-gradient(1px 1px at 140px 170px, #dfe8ff, transparent), radial-gradient(1.4px 1.4px at 268px 186px, #fff, transparent);
	background-size: 320px 200px;
	-webkit-mask-image: linear-gradient(#000 40%, transparent); mask-image: linear-gradient(#000 40%, transparent);
	animation: echo-stars 5s ease-in-out infinite alternate;
}
@keyframes echo-stars { to { opacity: 0.55; } }
.echo-moon {
	position: absolute; top: clamp(28px, 5vw, 56px); right: clamp(24px, 9vw, 150px); width: clamp(40px, 4.5vw, 64px); aspect-ratio: 1; border-radius: 50%;
	box-shadow: inset calc(clamp(40px, 4.5vw, 64px) * -0.24) calc(clamp(40px, 4.5vw, 64px) * 0.06) 0 0 #f1e6c8;
	filter: drop-shadow(0 0 14px rgba(241, 230, 200, 0.35));
	transform: rotate(-18deg);
}
.echo-pines { position: absolute; left: 0; right: 0; bottom: 0; background-repeat: repeat-x; background-position: 0 100%; }
.echo-pines--far { height: 150px; background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='150' viewBox='0 0 700 150'%3E%3Cg fill='%23101a17'%3E%3Cpath d='M9.2 29.4L21.4 80.1H-3.0ZM9.2 58.4L26.3 106.6H-7.8ZM9.2 87.3L31.1 133.1H-12.7ZM7.7 144.0h3V150h-3ZM9.2 29.4L21.4 80.1H-3.0ZM9.2 58.4L26.3 106.6H-7.8ZM9.2 87.3L31.1 133.1H-12.7ZM7.7 144.0h3V150h-3ZM21.7 39.7L34.1 86.0H9.3ZM21.7 66.2L39.0 110.3H4.4ZM21.7 92.6L44.0 134.6H-0.6ZM20.2 144.5h3V150h-3ZM21.7 39.7L34.1 86.0H9.3ZM21.7 66.2L39.0 110.3H4.4ZM21.7 92.6L44.0 134.6H-0.6ZM20.2 144.5h3V150h-3ZM44.8 40.0L57.3 86.2H32.4ZM44.8 66.4L62.3 110.4H27.4ZM44.8 92.8L67.3 134.6H22.4ZM43.3 144.5h3V150h-3ZM44.8 40.0L57.3 86.2H32.4ZM44.8 66.4L62.3 110.4H27.4ZM44.8 92.8L67.3 134.6H22.4ZM43.3 144.5h3V150h-3ZM45.9 62.4L55.5 99.2H36.2ZM45.9 83.4L59.4 118.4H32.4ZM45.9 104.4L63.2 137.7H28.5ZM44.4 145.6h3V150h-3ZM105.4 58.9L115.8 97.1H95.1ZM105.4 80.7L119.9 117.2H90.9ZM105.4 102.6L124.1 137.2H86.8ZM103.9 145.4h3V150h-3ZM164.0 28.5L175.1 79.5H153.0ZM164.0 57.6L179.5 106.3H148.6ZM164.0 86.8L183.9 133.0H144.2ZM162.5 143.9h3V150h-3ZM166.6 80.5L173.1 109.7H160.0ZM166.6 97.2L175.7 125.0H157.4ZM166.6 113.9L178.3 140.3H154.8ZM165.1 146.5h3V150h-3ZM181.5 22.4L194.3 76.0H168.8ZM181.5 53.0L199.4 104.1H163.7ZM181.5 83.7L204.5 132.1H158.6ZM180.0 143.6h3V150h-3ZM210.9 46.1L220.9 89.8H200.9ZM210.9 71.1L224.9 112.6H196.9ZM210.9 96.0L228.9 135.5H192.9ZM209.4 144.8h3V150h-3ZM259.0 54.5L268.4 94.6H249.6ZM259.0 77.4L272.2 115.6H245.8ZM259.0 100.3L275.9 136.6H242.0ZM257.5 145.2h3V150h-3ZM329.2 65.4L338.0 101.0H320.4ZM329.2 85.7L341.5 119.6H316.9ZM329.2 106.0L345.0 138.2H313.3ZM327.7 145.8h3V150h-3ZM333.4 49.1L344.8 91.5H322.1ZM333.4 73.3L349.4 113.7H317.5ZM333.4 97.5L353.9 135.9H312.9ZM331.9 145.0h3V150h-3ZM366.2 42.3L378.5 87.5H354.0ZM366.2 68.1L383.4 111.2H349.1ZM366.2 94.0L388.2 134.9H344.2ZM364.7 144.6h3V150h-3ZM381.0 30.1L394.8 80.4H367.1ZM381.0 58.8L400.3 106.8H361.6ZM381.0 87.6L405.8 133.2H356.1ZM379.5 144.0h3V150h-3ZM413.8 43.0L423.7 87.9H403.9ZM413.8 68.7L427.6 111.5H399.9ZM413.8 94.4L431.6 135.0H396.0ZM412.3 144.7h3V150h-3ZM422.7 29.8L436.5 80.3H409.0ZM422.7 58.6L442.0 106.7H403.5ZM422.7 87.5L447.5 133.2H398.0ZM421.2 144.0h3V150h-3ZM438.0 26.7L450.8 78.5H425.2ZM438.0 56.3L455.9 105.6H420.1ZM438.0 85.9L461.0 132.7H415.0ZM436.5 143.8h3V150h-3ZM444.4 40.0L454.7 86.2H434.1ZM444.4 66.4L458.8 110.4H430.0ZM444.4 92.8L463.0 134.6H425.8ZM442.9 144.5h3V150h-3ZM447.3 31.8L459.6 81.4H435.1ZM447.3 60.2L464.5 107.4H430.2ZM447.3 88.5L469.4 133.5H425.3ZM445.8 144.1h3V150h-3ZM470.0 70.1L477.2 103.6H462.8ZM470.0 89.2L480.0 121.2H459.9ZM470.0 108.4L482.9 138.8H457.1ZM468.5 146.0h3V150h-3ZM518.9 30.2L532.7 80.5H505.1ZM518.9 59.0L538.2 106.9H499.6ZM518.9 87.7L543.7 133.2H494.0ZM517.4 144.0h3V150h-3ZM530.8 83.8L538.0 111.6H523.5ZM530.8 99.7L541.0 126.2H520.6ZM530.8 115.6L543.9 140.7H517.7ZM529.3 146.7h3V150h-3ZM585.5 61.3L593.7 98.5H577.3ZM585.5 82.6L597.0 118.1H574.1ZM585.5 103.9L600.2 137.6H570.8ZM584.0 145.6h3V150h-3ZM586.2 69.4L595.0 103.3H577.4ZM586.2 88.8L598.5 121.0H573.9ZM586.2 108.1L602.1 138.7H570.4ZM584.7 146.0h3V150h-3ZM607.6 28.9L618.4 79.8H596.8ZM607.6 58.0L622.8 106.4H592.5ZM607.6 87.0L627.1 133.0H588.2ZM606.1 143.9h3V150h-3ZM697.0 47.0L706.1 90.2H687.8ZM697.0 71.7L709.8 112.9H684.1ZM697.0 96.4L713.5 135.6H680.4ZM695.5 144.8h3V150h-3Z'/%3E%3Cpath d='M9.2 29.4L21.4 80.1H-3.0ZM9.2 58.4L26.3 106.6H-7.8ZM9.2 87.3L31.1 133.1H-12.7ZM7.7 144.0h3V150h-3ZM9.2 29.4L21.4 80.1H-3.0ZM9.2 58.4L26.3 106.6H-7.8ZM9.2 87.3L31.1 133.1H-12.7ZM7.7 144.0h3V150h-3ZM21.7 39.7L34.1 86.0H9.3ZM21.7 66.2L39.0 110.3H4.4ZM21.7 92.6L44.0 134.6H-0.6ZM20.2 144.5h3V150h-3ZM21.7 39.7L34.1 86.0H9.3ZM21.7 66.2L39.0 110.3H4.4ZM21.7 92.6L44.0 134.6H-0.6ZM20.2 144.5h3V150h-3ZM44.8 40.0L57.3 86.2H32.4ZM44.8 66.4L62.3 110.4H27.4ZM44.8 92.8L67.3 134.6H22.4ZM43.3 144.5h3V150h-3ZM44.8 40.0L57.3 86.2H32.4ZM44.8 66.4L62.3 110.4H27.4ZM44.8 92.8L67.3 134.6H22.4ZM43.3 144.5h3V150h-3ZM45.9 62.4L55.5 99.2H36.2ZM45.9 83.4L59.4 118.4H32.4ZM45.9 104.4L63.2 137.7H28.5ZM44.4 145.6h3V150h-3ZM105.4 58.9L115.8 97.1H95.1ZM105.4 80.7L119.9 117.2H90.9ZM105.4 102.6L124.1 137.2H86.8ZM103.9 145.4h3V150h-3ZM164.0 28.5L175.1 79.5H153.0ZM164.0 57.6L179.5 106.3H148.6ZM164.0 86.8L183.9 133.0H144.2ZM162.5 143.9h3V150h-3ZM166.6 80.5L173.1 109.7H160.0ZM166.6 97.2L175.7 125.0H157.4ZM166.6 113.9L178.3 140.3H154.8ZM165.1 146.5h3V150h-3ZM181.5 22.4L194.3 76.0H168.8ZM181.5 53.0L199.4 104.1H163.7ZM181.5 83.7L204.5 132.1H158.6ZM180.0 143.6h3V150h-3ZM210.9 46.1L220.9 89.8H200.9ZM210.9 71.1L224.9 112.6H196.9ZM210.9 96.0L228.9 135.5H192.9ZM209.4 144.8h3V150h-3ZM259.0 54.5L268.4 94.6H249.6ZM259.0 77.4L272.2 115.6H245.8ZM259.0 100.3L275.9 136.6H242.0ZM257.5 145.2h3V150h-3ZM329.2 65.4L338.0 101.0H320.4ZM329.2 85.7L341.5 119.6H316.9ZM329.2 106.0L345.0 138.2H313.3ZM327.7 145.8h3V150h-3ZM333.4 49.1L344.8 91.5H322.1ZM333.4 73.3L349.4 113.7H317.5ZM333.4 97.5L353.9 135.9H312.9ZM331.9 145.0h3V150h-3ZM366.2 42.3L378.5 87.5H354.0ZM366.2 68.1L383.4 111.2H349.1ZM366.2 94.0L388.2 134.9H344.2ZM364.7 144.6h3V150h-3ZM381.0 30.1L394.8 80.4H367.1ZM381.0 58.8L400.3 106.8H361.6ZM381.0 87.6L405.8 133.2H356.1ZM379.5 144.0h3V150h-3ZM413.8 43.0L423.7 87.9H403.9ZM413.8 68.7L427.6 111.5H399.9ZM413.8 94.4L431.6 135.0H396.0ZM412.3 144.7h3V150h-3ZM422.7 29.8L436.5 80.3H409.0ZM422.7 58.6L442.0 106.7H403.5ZM422.7 87.5L447.5 133.2H398.0ZM421.2 144.0h3V150h-3ZM438.0 26.7L450.8 78.5H425.2ZM438.0 56.3L455.9 105.6H420.1ZM438.0 85.9L461.0 132.7H415.0ZM436.5 143.8h3V150h-3ZM444.4 40.0L454.7 86.2H434.1ZM444.4 66.4L458.8 110.4H430.0ZM444.4 92.8L463.0 134.6H425.8ZM442.9 144.5h3V150h-3ZM447.3 31.8L459.6 81.4H435.1ZM447.3 60.2L464.5 107.4H430.2ZM447.3 88.5L469.4 133.5H425.3ZM445.8 144.1h3V150h-3ZM470.0 70.1L477.2 103.6H462.8ZM470.0 89.2L480.0 121.2H459.9ZM470.0 108.4L482.9 138.8H457.1ZM468.5 146.0h3V150h-3ZM518.9 30.2L532.7 80.5H505.1ZM518.9 59.0L538.2 106.9H499.6ZM518.9 87.7L543.7 133.2H494.0ZM517.4 144.0h3V150h-3ZM530.8 83.8L538.0 111.6H523.5ZM530.8 99.7L541.0 126.2H520.6ZM530.8 115.6L543.9 140.7H517.7ZM529.3 146.7h3V150h-3ZM585.5 61.3L593.7 98.5H577.3ZM585.5 82.6L597.0 118.1H574.1ZM585.5 103.9L600.2 137.6H570.8ZM584.0 145.6h3V150h-3ZM586.2 69.4L595.0 103.3H577.4ZM586.2 88.8L598.5 121.0H573.9ZM586.2 108.1L602.1 138.7H570.4ZM584.7 146.0h3V150h-3ZM607.6 28.9L618.4 79.8H596.8ZM607.6 58.0L622.8 106.4H592.5ZM607.6 87.0L627.1 133.0H588.2ZM606.1 143.9h3V150h-3ZM697.0 47.0L706.1 90.2H687.8ZM697.0 71.7L709.8 112.9H684.1ZM697.0 96.4L713.5 135.6H680.4ZM695.5 144.8h3V150h-3Z' transform='translate(700 0)'/%3E%3Cpath d='M9.2 29.4L21.4 80.1H-3.0ZM9.2 58.4L26.3 106.6H-7.8ZM9.2 87.3L31.1 133.1H-12.7ZM7.7 144.0h3V150h-3ZM9.2 29.4L21.4 80.1H-3.0ZM9.2 58.4L26.3 106.6H-7.8ZM9.2 87.3L31.1 133.1H-12.7ZM7.7 144.0h3V150h-3ZM21.7 39.7L34.1 86.0H9.3ZM21.7 66.2L39.0 110.3H4.4ZM21.7 92.6L44.0 134.6H-0.6ZM20.2 144.5h3V150h-3ZM21.7 39.7L34.1 86.0H9.3ZM21.7 66.2L39.0 110.3H4.4ZM21.7 92.6L44.0 134.6H-0.6ZM20.2 144.5h3V150h-3ZM44.8 40.0L57.3 86.2H32.4ZM44.8 66.4L62.3 110.4H27.4ZM44.8 92.8L67.3 134.6H22.4ZM43.3 144.5h3V150h-3ZM44.8 40.0L57.3 86.2H32.4ZM44.8 66.4L62.3 110.4H27.4ZM44.8 92.8L67.3 134.6H22.4ZM43.3 144.5h3V150h-3ZM45.9 62.4L55.5 99.2H36.2ZM45.9 83.4L59.4 118.4H32.4ZM45.9 104.4L63.2 137.7H28.5ZM44.4 145.6h3V150h-3ZM105.4 58.9L115.8 97.1H95.1ZM105.4 80.7L119.9 117.2H90.9ZM105.4 102.6L124.1 137.2H86.8ZM103.9 145.4h3V150h-3ZM164.0 28.5L175.1 79.5H153.0ZM164.0 57.6L179.5 106.3H148.6ZM164.0 86.8L183.9 133.0H144.2ZM162.5 143.9h3V150h-3ZM166.6 80.5L173.1 109.7H160.0ZM166.6 97.2L175.7 125.0H157.4ZM166.6 113.9L178.3 140.3H154.8ZM165.1 146.5h3V150h-3ZM181.5 22.4L194.3 76.0H168.8ZM181.5 53.0L199.4 104.1H163.7ZM181.5 83.7L204.5 132.1H158.6ZM180.0 143.6h3V150h-3ZM210.9 46.1L220.9 89.8H200.9ZM210.9 71.1L224.9 112.6H196.9ZM210.9 96.0L228.9 135.5H192.9ZM209.4 144.8h3V150h-3ZM259.0 54.5L268.4 94.6H249.6ZM259.0 77.4L272.2 115.6H245.8ZM259.0 100.3L275.9 136.6H242.0ZM257.5 145.2h3V150h-3ZM329.2 65.4L338.0 101.0H320.4ZM329.2 85.7L341.5 119.6H316.9ZM329.2 106.0L345.0 138.2H313.3ZM327.7 145.8h3V150h-3ZM333.4 49.1L344.8 91.5H322.1ZM333.4 73.3L349.4 113.7H317.5ZM333.4 97.5L353.9 135.9H312.9ZM331.9 145.0h3V150h-3ZM366.2 42.3L378.5 87.5H354.0ZM366.2 68.1L383.4 111.2H349.1ZM366.2 94.0L388.2 134.9H344.2ZM364.7 144.6h3V150h-3ZM381.0 30.1L394.8 80.4H367.1ZM381.0 58.8L400.3 106.8H361.6ZM381.0 87.6L405.8 133.2H356.1ZM379.5 144.0h3V150h-3ZM413.8 43.0L423.7 87.9H403.9ZM413.8 68.7L427.6 111.5H399.9ZM413.8 94.4L431.6 135.0H396.0ZM412.3 144.7h3V150h-3ZM422.7 29.8L436.5 80.3H409.0ZM422.7 58.6L442.0 106.7H403.5ZM422.7 87.5L447.5 133.2H398.0ZM421.2 144.0h3V150h-3ZM438.0 26.7L450.8 78.5H425.2ZM438.0 56.3L455.9 105.6H420.1ZM438.0 85.9L461.0 132.7H415.0ZM436.5 143.8h3V150h-3ZM444.4 40.0L454.7 86.2H434.1ZM444.4 66.4L458.8 110.4H430.0ZM444.4 92.8L463.0 134.6H425.8ZM442.9 144.5h3V150h-3ZM447.3 31.8L459.6 81.4H435.1ZM447.3 60.2L464.5 107.4H430.2ZM447.3 88.5L469.4 133.5H425.3ZM445.8 144.1h3V150h-3ZM470.0 70.1L477.2 103.6H462.8ZM470.0 89.2L480.0 121.2H459.9ZM470.0 108.4L482.9 138.8H457.1ZM468.5 146.0h3V150h-3ZM518.9 30.2L532.7 80.5H505.1ZM518.9 59.0L538.2 106.9H499.6ZM518.9 87.7L543.7 133.2H494.0ZM517.4 144.0h3V150h-3ZM530.8 83.8L538.0 111.6H523.5ZM530.8 99.7L541.0 126.2H520.6ZM530.8 115.6L543.9 140.7H517.7ZM529.3 146.7h3V150h-3ZM585.5 61.3L593.7 98.5H577.3ZM585.5 82.6L597.0 118.1H574.1ZM585.5 103.9L600.2 137.6H570.8ZM584.0 145.6h3V150h-3ZM586.2 69.4L595.0 103.3H577.4ZM586.2 88.8L598.5 121.0H573.9ZM586.2 108.1L602.1 138.7H570.4ZM584.7 146.0h3V150h-3ZM607.6 28.9L618.4 79.8H596.8ZM607.6 58.0L622.8 106.4H592.5ZM607.6 87.0L627.1 133.0H588.2ZM606.1 143.9h3V150h-3ZM697.0 47.0L706.1 90.2H687.8ZM697.0 71.7L709.8 112.9H684.1ZM697.0 96.4L713.5 135.6H680.4ZM695.5 144.8h3V150h-3Z' transform='translate(-700 0)'/%3E%3Crect y='144' width='700' height='6'/%3E%3C/g%3E%3C/svg%3E"); background-size: 700px 150px; bottom: 26px; opacity: 0.95; }
.echo-pines--near { height: 170px; background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='170' viewBox='0 0 900 170'%3E%3Cg fill='%23060908'%3E%3Cpath d='M5.8 35.7L20.5 92.1H-8.9ZM5.8 67.9L26.3 121.7H-14.8ZM5.8 100.2L32.2 151.2H-20.6ZM4.3 163.3h3V170h-3ZM5.8 35.7L20.5 92.1H-8.9ZM5.8 67.9L26.3 121.7H-14.8ZM5.8 100.2L32.2 151.2H-20.6ZM4.3 163.3h3V170h-3ZM36.8 51.2L49.7 101.1H23.9ZM36.8 79.7L54.9 127.2H18.8ZM36.8 108.2L60.0 153.4H13.6ZM35.3 164.1h3V170h-3ZM36.8 51.2L49.7 101.1H23.9ZM36.8 79.7L54.9 127.2H18.8ZM36.8 108.2L60.0 153.4H13.6ZM35.3 164.1h3V170h-3ZM72.7 72.4L82.1 113.4H63.4ZM72.7 95.8L85.9 134.9H59.6ZM72.7 119.2L89.6 156.3H55.9ZM71.2 165.1h3V170h-3ZM99.9 29.4L115.0 88.5H84.7ZM99.9 63.2L121.1 119.4H78.6ZM99.9 96.9L127.2 150.3H72.5ZM98.4 163.0h3V170h-3ZM124.7 48.4L135.7 99.5H113.7ZM124.7 77.6L140.1 126.2H109.3ZM124.7 106.8L144.5 153.0H104.9ZM123.2 163.9h3V170h-3ZM141.4 60.0L151.8 106.2H131.1ZM141.4 86.4L155.9 130.4H127.0ZM141.4 112.8L160.0 154.6H122.9ZM139.9 164.5h3V170h-3ZM214.2 58.9L226.5 105.6H202.0ZM214.2 85.6L231.4 130.0H197.1ZM214.2 112.2L236.3 154.4H192.2ZM212.7 164.4h3V170h-3ZM336.0 65.0L347.8 109.1H324.2ZM336.0 90.2L352.5 132.2H319.5ZM336.0 115.4L357.2 155.3H314.7ZM334.5 164.8h3V170h-3ZM341.1 14.0L355.1 79.5H327.2ZM341.1 51.5L360.7 113.9H321.6ZM341.1 88.9L366.2 148.2H316.0ZM339.6 162.2h3V170h-3ZM406.8 51.6L418.8 101.3H394.8ZM406.8 80.0L423.6 127.4H390.0ZM406.8 108.4L428.5 153.4H385.2ZM405.3 164.1h3V170h-3ZM416.7 78.2L425.9 116.8H407.6ZM416.7 100.3L429.5 137.0H403.9ZM416.7 122.3L433.2 157.2H400.2ZM415.2 165.4h3V170h-3ZM452.5 12.0L466.9 78.4H438.1ZM452.5 49.9L472.6 113.1H432.4ZM452.5 87.8L478.4 147.9H426.6ZM451.0 162.1h3V170h-3ZM455.6 35.2L468.0 91.8H443.3ZM455.6 67.6L472.9 121.5H438.4ZM455.6 99.9L477.8 151.1H433.5ZM454.1 163.3h3V170h-3ZM498.8 36.6L513.9 92.6H483.8ZM498.8 68.6L519.9 122.0H477.8ZM498.8 100.6L525.9 151.3H471.8ZM497.3 163.3h3V170h-3ZM555.0 64.8L564.3 109.0H545.7ZM555.0 90.0L568.0 132.1H542.0ZM555.0 115.3L571.7 155.3H538.3ZM553.5 164.7h3V170h-3ZM633.1 73.7L643.0 114.2H623.2ZM633.1 96.8L647.0 135.3H619.3ZM633.1 119.9L651.0 156.5H615.3ZM631.6 165.2h3V170h-3ZM652.6 78.7L660.8 117.0H644.3ZM652.6 100.6L664.1 137.1H641.0ZM652.6 122.5L667.4 157.2H637.7ZM651.1 165.4h3V170h-3ZM779.9 42.7L794.3 96.2H765.5ZM779.9 73.3L800.1 124.2H759.7ZM779.9 103.8L805.9 152.2H753.9ZM778.4 163.6h3V170h-3ZM808.5 48.5L820.5 99.5H796.4ZM808.5 77.7L825.3 126.3H791.6ZM808.5 106.8L830.1 153.0H786.8ZM807.0 163.9h3V170h-3ZM831.4 32.1L843.9 90.0H819.0ZM831.4 65.2L848.9 120.4H814.0ZM831.4 98.3L853.9 150.7H809.0ZM829.9 163.1h3V170h-3Z'/%3E%3Cpath d='M5.8 35.7L20.5 92.1H-8.9ZM5.8 67.9L26.3 121.7H-14.8ZM5.8 100.2L32.2 151.2H-20.6ZM4.3 163.3h3V170h-3ZM5.8 35.7L20.5 92.1H-8.9ZM5.8 67.9L26.3 121.7H-14.8ZM5.8 100.2L32.2 151.2H-20.6ZM4.3 163.3h3V170h-3ZM36.8 51.2L49.7 101.1H23.9ZM36.8 79.7L54.9 127.2H18.8ZM36.8 108.2L60.0 153.4H13.6ZM35.3 164.1h3V170h-3ZM36.8 51.2L49.7 101.1H23.9ZM36.8 79.7L54.9 127.2H18.8ZM36.8 108.2L60.0 153.4H13.6ZM35.3 164.1h3V170h-3ZM72.7 72.4L82.1 113.4H63.4ZM72.7 95.8L85.9 134.9H59.6ZM72.7 119.2L89.6 156.3H55.9ZM71.2 165.1h3V170h-3ZM99.9 29.4L115.0 88.5H84.7ZM99.9 63.2L121.1 119.4H78.6ZM99.9 96.9L127.2 150.3H72.5ZM98.4 163.0h3V170h-3ZM124.7 48.4L135.7 99.5H113.7ZM124.7 77.6L140.1 126.2H109.3ZM124.7 106.8L144.5 153.0H104.9ZM123.2 163.9h3V170h-3ZM141.4 60.0L151.8 106.2H131.1ZM141.4 86.4L155.9 130.4H127.0ZM141.4 112.8L160.0 154.6H122.9ZM139.9 164.5h3V170h-3ZM214.2 58.9L226.5 105.6H202.0ZM214.2 85.6L231.4 130.0H197.1ZM214.2 112.2L236.3 154.4H192.2ZM212.7 164.4h3V170h-3ZM336.0 65.0L347.8 109.1H324.2ZM336.0 90.2L352.5 132.2H319.5ZM336.0 115.4L357.2 155.3H314.7ZM334.5 164.8h3V170h-3ZM341.1 14.0L355.1 79.5H327.2ZM341.1 51.5L360.7 113.9H321.6ZM341.1 88.9L366.2 148.2H316.0ZM339.6 162.2h3V170h-3ZM406.8 51.6L418.8 101.3H394.8ZM406.8 80.0L423.6 127.4H390.0ZM406.8 108.4L428.5 153.4H385.2ZM405.3 164.1h3V170h-3ZM416.7 78.2L425.9 116.8H407.6ZM416.7 100.3L429.5 137.0H403.9ZM416.7 122.3L433.2 157.2H400.2ZM415.2 165.4h3V170h-3ZM452.5 12.0L466.9 78.4H438.1ZM452.5 49.9L472.6 113.1H432.4ZM452.5 87.8L478.4 147.9H426.6ZM451.0 162.1h3V170h-3ZM455.6 35.2L468.0 91.8H443.3ZM455.6 67.6L472.9 121.5H438.4ZM455.6 99.9L477.8 151.1H433.5ZM454.1 163.3h3V170h-3ZM498.8 36.6L513.9 92.6H483.8ZM498.8 68.6L519.9 122.0H477.8ZM498.8 100.6L525.9 151.3H471.8ZM497.3 163.3h3V170h-3ZM555.0 64.8L564.3 109.0H545.7ZM555.0 90.0L568.0 132.1H542.0ZM555.0 115.3L571.7 155.3H538.3ZM553.5 164.7h3V170h-3ZM633.1 73.7L643.0 114.2H623.2ZM633.1 96.8L647.0 135.3H619.3ZM633.1 119.9L651.0 156.5H615.3ZM631.6 165.2h3V170h-3ZM652.6 78.7L660.8 117.0H644.3ZM652.6 100.6L664.1 137.1H641.0ZM652.6 122.5L667.4 157.2H637.7ZM651.1 165.4h3V170h-3ZM779.9 42.7L794.3 96.2H765.5ZM779.9 73.3L800.1 124.2H759.7ZM779.9 103.8L805.9 152.2H753.9ZM778.4 163.6h3V170h-3ZM808.5 48.5L820.5 99.5H796.4ZM808.5 77.7L825.3 126.3H791.6ZM808.5 106.8L830.1 153.0H786.8ZM807.0 163.9h3V170h-3ZM831.4 32.1L843.9 90.0H819.0ZM831.4 65.2L848.9 120.4H814.0ZM831.4 98.3L853.9 150.7H809.0ZM829.9 163.1h3V170h-3Z' transform='translate(900 0)'/%3E%3Cpath d='M5.8 35.7L20.5 92.1H-8.9ZM5.8 67.9L26.3 121.7H-14.8ZM5.8 100.2L32.2 151.2H-20.6ZM4.3 163.3h3V170h-3ZM5.8 35.7L20.5 92.1H-8.9ZM5.8 67.9L26.3 121.7H-14.8ZM5.8 100.2L32.2 151.2H-20.6ZM4.3 163.3h3V170h-3ZM36.8 51.2L49.7 101.1H23.9ZM36.8 79.7L54.9 127.2H18.8ZM36.8 108.2L60.0 153.4H13.6ZM35.3 164.1h3V170h-3ZM36.8 51.2L49.7 101.1H23.9ZM36.8 79.7L54.9 127.2H18.8ZM36.8 108.2L60.0 153.4H13.6ZM35.3 164.1h3V170h-3ZM72.7 72.4L82.1 113.4H63.4ZM72.7 95.8L85.9 134.9H59.6ZM72.7 119.2L89.6 156.3H55.9ZM71.2 165.1h3V170h-3ZM99.9 29.4L115.0 88.5H84.7ZM99.9 63.2L121.1 119.4H78.6ZM99.9 96.9L127.2 150.3H72.5ZM98.4 163.0h3V170h-3ZM124.7 48.4L135.7 99.5H113.7ZM124.7 77.6L140.1 126.2H109.3ZM124.7 106.8L144.5 153.0H104.9ZM123.2 163.9h3V170h-3ZM141.4 60.0L151.8 106.2H131.1ZM141.4 86.4L155.9 130.4H127.0ZM141.4 112.8L160.0 154.6H122.9ZM139.9 164.5h3V170h-3ZM214.2 58.9L226.5 105.6H202.0ZM214.2 85.6L231.4 130.0H197.1ZM214.2 112.2L236.3 154.4H192.2ZM212.7 164.4h3V170h-3ZM336.0 65.0L347.8 109.1H324.2ZM336.0 90.2L352.5 132.2H319.5ZM336.0 115.4L357.2 155.3H314.7ZM334.5 164.8h3V170h-3ZM341.1 14.0L355.1 79.5H327.2ZM341.1 51.5L360.7 113.9H321.6ZM341.1 88.9L366.2 148.2H316.0ZM339.6 162.2h3V170h-3ZM406.8 51.6L418.8 101.3H394.8ZM406.8 80.0L423.6 127.4H390.0ZM406.8 108.4L428.5 153.4H385.2ZM405.3 164.1h3V170h-3ZM416.7 78.2L425.9 116.8H407.6ZM416.7 100.3L429.5 137.0H403.9ZM416.7 122.3L433.2 157.2H400.2ZM415.2 165.4h3V170h-3ZM452.5 12.0L466.9 78.4H438.1ZM452.5 49.9L472.6 113.1H432.4ZM452.5 87.8L478.4 147.9H426.6ZM451.0 162.1h3V170h-3ZM455.6 35.2L468.0 91.8H443.3ZM455.6 67.6L472.9 121.5H438.4ZM455.6 99.9L477.8 151.1H433.5ZM454.1 163.3h3V170h-3ZM498.8 36.6L513.9 92.6H483.8ZM498.8 68.6L519.9 122.0H477.8ZM498.8 100.6L525.9 151.3H471.8ZM497.3 163.3h3V170h-3ZM555.0 64.8L564.3 109.0H545.7ZM555.0 90.0L568.0 132.1H542.0ZM555.0 115.3L571.7 155.3H538.3ZM553.5 164.7h3V170h-3ZM633.1 73.7L643.0 114.2H623.2ZM633.1 96.8L647.0 135.3H619.3ZM633.1 119.9L651.0 156.5H615.3ZM631.6 165.2h3V170h-3ZM652.6 78.7L660.8 117.0H644.3ZM652.6 100.6L664.1 137.1H641.0ZM652.6 122.5L667.4 157.2H637.7ZM651.1 165.4h3V170h-3ZM779.9 42.7L794.3 96.2H765.5ZM779.9 73.3L800.1 124.2H759.7ZM779.9 103.8L805.9 152.2H753.9ZM778.4 163.6h3V170h-3ZM808.5 48.5L820.5 99.5H796.4ZM808.5 77.7L825.3 126.3H791.6ZM808.5 106.8L830.1 153.0H786.8ZM807.0 163.9h3V170h-3ZM831.4 32.1L843.9 90.0H819.0ZM831.4 65.2L848.9 120.4H814.0ZM831.4 98.3L853.9 150.7H809.0ZM829.9 163.1h3V170h-3Z' transform='translate(-900 0)'/%3E%3Crect y='164' width='900' height='6'/%3E%3C/g%3E%3C/svg%3E"); background-size: 900px 170px; background-position: -260px 100%; }
.echo-campfire { position: absolute; left: 50%; bottom: 0; width: min(760px, 90%); height: 220px; transform: translateX(-50%); background: radial-gradient(ellipse 50% 60% at 50% 100%, rgba(255, 140, 40, 0.38), rgba(217, 60, 20, 0.12) 45%, transparent 75%); animation: echo-fire 2.8s ease-in-out infinite alternate; }
@keyframes echo-fire { 0% { opacity: 0.85; } 30% { opacity: 1; } 55% { opacity: 0.75; } 100% { opacity: 0.95; } }
.echo-fireflies {
	position: absolute; inset: 45% 0 40px;
	background-image:
		radial-gradient(3px 3px at 8% 70%, #ffd36b, transparent), radial-gradient(2px 2px at 23% 40%, #ffd36b, transparent),
		radial-gradient(3px 3px at 41% 82%, #ffe08f, transparent), radial-gradient(2px 2px at 63% 55%, #ffd36b, transparent),
		radial-gradient(3px 3px at 78% 76%, #ffe08f, transparent), radial-gradient(2px 2px at 92% 35%, #ffd36b, transparent),
		radial-gradient(2px 2px at 33% 92%, #ffe08f, transparent), radial-gradient(2.5px 2.5px at 86% 90%, #ffd36b, transparent);
	filter: drop-shadow(0 0 4px #ffb22e);
	animation: echo-fireflies 7s ease-in-out infinite alternate;
}
@keyframes echo-fireflies { 0% { opacity: 0.25; transform: translate(0, 0); } 50% { opacity: 0.9; } 100% { opacity: 0.35; transform: translate(12px, -18px); } }
.echo-season.is-look-summer .echo-shelf__lip { position: relative; z-index: 1; }

@media (max-width: 781px) {
	.echo-season__head { flex-wrap: wrap; }
	.echo-season__count { order: 2; width: 104px; height: 104px; padding: 14px; position: absolute; top: -30px; right: -4px; }
	.echo-season__count-num { font-size: 2.4rem; }
	.echo-season__count-txt { font-size: 0.5625rem; max-width: 70px; }
	.echo-season__head > .echo-head { padding-right: 96px; }
	.echo-spider { left: 88%; }
}
@media (prefers-reduced-motion: reduce) {
	.echo-season.is-look-spooky::before, .echo-spider, .echo-spider__body, .echo-lights__bulb, .echo-snow, .echo-stars, .echo-campfire, .echo-fireflies, .echo-drip, .echo-drop { animation: none; }
	.echo-drop { opacity: 0; }
}

/* --------------------------------------------------------------------------
   Contact form: an old counter slip
   -------------------------------------------------------------------------- */

.echo-slip { display: flex; flex-direction: column; gap: 14px; transform: rotate(-0.5deg); padding-top: clamp(32px, 4vw, 46px) !important; }
.echo-slip > * { margin: 0; }
.echo-slip__top { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.echo-slip__no { margin: 0; font-family: var(--echo-type); font-size: 1rem; color: var(--echo-red-ink); letter-spacing: 0.06em; }
.echo-slip__title { margin: 0 !important; font-family: var(--echo-title); font-weight: 400; text-transform: uppercase; letter-spacing: 0.06em; font-size: clamp(1.75rem, 3.2vw, 2.5rem) !important; line-height: 1; color: var(--echo-pinch); }
.echo-slip__form { display: flex; flex-direction: column; gap: 18px; margin-top: 6px; }
.echo-slip__form[hidden] { display: none; }
.echo-slip__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 18px 24px; }
.echo-slip__field { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.echo-slip__field label { font-family: var(--echo-text); font-weight: 700; font-size: 0.6875rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--echo-red-ink); }
.echo-slip__field input,
.echo-slip__field select,
.echo-slip__field textarea {
	width: 100%; box-sizing: border-box; margin: 0; padding: 8px 2px 6px; border: 0; border-radius: 0;
	border-bottom: 1.5px solid rgba(20, 20, 22, 0.55); background: transparent; color: var(--echo-pinch);
	font-family: var(--echo-type); font-size: 1.125rem; line-height: 1.6; outline: none; box-shadow: none;
	-webkit-appearance: none; appearance: none;
}
.echo-slip__field select {
	padding-right: 28px; cursor: pointer;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23b30c1f' stroke-width='2'/></svg>") no-repeat right 4px center;
}
.echo-slip__field textarea {
	resize: vertical; min-height: 9.6em; padding-top: 2px; border: 0; line-height: 1.6em;
	background: repeating-linear-gradient(180deg, transparent 0 calc(1.6em - 1px), rgba(20, 20, 22, 0.28) calc(1.6em - 1px) 1.6em);
	background-attachment: local;
}
.echo-slip__field input:focus,
.echo-slip__field select:focus { border-bottom-color: var(--echo-red); background-color: rgba(255, 255, 255, 0.22); }
.echo-slip__field textarea:focus { background-color: rgba(255, 255, 255, 0.22); }
.echo-slip__field input:user-invalid, .echo-slip__field textarea:user-invalid { border-bottom-color: var(--echo-red); }
.echo-slip__trap { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.echo-slip__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 4px; }
.echo-slip__send { border: 0; cursor: pointer; }
.echo-slip__send[disabled] { opacity: 0.7; cursor: progress; }
.echo-slip__small { margin: 0; font-size: 0.8125rem; color: #5a5348; }
.echo-slip__status { margin: 0; padding: 12px 14px; border-left: 3px solid var(--echo-pinch); background: rgba(255, 255, 255, 0.28); font-family: var(--echo-type); font-size: 1.0625rem; line-height: 1.5; color: var(--echo-pinch); }
.echo-slip__status[hidden] { display: none; }
.echo-slip__status.is-error { border-left-color: var(--echo-red); color: var(--echo-red-ink); }
.echo-slip__stamp {
	align-self: flex-end; margin: 4px 8px 0 0; padding: 10px 22px;
	border: 4px double var(--echo-red-ink); border-radius: 8px; color: var(--echo-red-ink);
	font-family: var(--echo-title); font-weight: 500; font-size: clamp(1.5rem, 3vw, 2.25rem); letter-spacing: 0.24em; text-transform: uppercase;
	transform: rotate(-11deg); opacity: 0.85; mix-blend-mode: multiply;
	background: radial-gradient(circle at 30% 40%, transparent 0 1px, rgba(227, 218, 198, 0.55) 1.5px, transparent 2.5px) 0 0 / 7px 9px; /* worn ink */
	animation: echo-stamp 0.35s cubic-bezier(0.2, 1.6, 0.4, 1) both;
}
.echo-slip__stamp[hidden] { display: none; }
@keyframes echo-stamp { from { transform: rotate(-11deg) scale(1.8); opacity: 0; } to { transform: rotate(-11deg) scale(1); opacity: 0.85; } }
.echo-slip__plugin input:not([type="submit"]), .echo-slip__plugin textarea, .echo-slip__plugin select { width: 100%; box-sizing: border-box; background: rgba(255, 255, 255, 0.35); border: 1px solid rgba(20, 20, 22, 0.35); padding: 10px; font-family: var(--echo-type); color: var(--echo-pinch); }
.echo-contact-cols { align-items: flex-start !important; }
.echo-contact-tips { transform: rotate(0.6deg); }
@media (prefers-reduced-motion: reduce) { .echo-slip__stamp { animation: none; } }

/* --------------------------------------------------------------------------
   Small screens
   -------------------------------------------------------------------------- */

@media (max-width: 781px) {
	.echo-pair { gap: 40px !important; }
	.echo-staff, .echo-trivia { transform: none; }
	.echo-book__main { padding-block: 24px 56px; }
	.echo-header .echo-header__cta { display: none !important; }
	.echo-header__bar { flex-wrap: nowrap !important; }
}
@media (max-width: 480px) {
	:root { --echo-gutter: 16px; }
	.echo-spine { width: 48px; }
	.echo-spine--image { width: calc(var(--spine-w, 60px) * 0.8); }
	.echo-spine__title { font-size: 0.9375rem; }
	.echo-memcard { padding: 18px 20px; }
	.echo-memcard__name { font-size: 1rem; }
	.echo-toggle button { padding: 0 12px; }
	.echo-spine__tag { font-size: 0.5rem; letter-spacing: 0.02em; padding: 3px 2px; }
	.echo-footer__nav { margin-left: 0; width: 100%; grid-template-columns: 1fr 1fr; gap: 12px 24px !important; }
}

/* --------------------------------------------------------------------------
   Motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.echo-case-item:hover .echo-case, .echo-spine:hover { transform: none; }
	.echo-case-item:hover .echo-case__track, .echo-window__case:hover .echo-case__track { animation: none; opacity: 0; }
}

/* --------------------------------------------------------------------------
   Print
   -------------------------------------------------------------------------- */

@media print {
	body.echo-grime::before, body.echo-grime::after, .echo-header, .echo-footer, .echo-toggle { display: none !important; }
	body { background: #fff; color: #000; }
}