/* ==========================================================================
   John Leary theme — main stylesheet
   Aesthetic: editorial, dark, serif-forward. Less Nashville neon, more
   "singer-songwriter who also writes for The Atlantic." Warm cream and
   deep ink, Playfair Display as the display face, Inter Tight for UI.
   ========================================================================== */

:root {
	/* Color — deep, warm, editorial */
	--color-ink:       #0f1013;   /* near-black, warm */
	--color-ink-soft:  #1a1c21;
	--color-ink-2:     #2b2e36;
	--color-cream:     #f4efe4;   /* off-white, warm */
	--color-cream-2:   #e9e1cf;
	--color-paper:     #faf7ef;
	--color-rust:      #b04a2f;   /* accent — clay red, not neon */
	--color-rust-deep: #8a3820;
	--color-moss:      #4a5c3a;   /* secondary accent for writing side */
	--color-gold:      #c79c4a;
	--color-rule:      rgba(15, 16, 19, 0.14);
	--color-rule-dark: rgba(244, 239, 228, 0.16);

	/* Type */
	--font-display: 'Playfair Display', 'Georgia', serif;
	--font-body:    'Inter Tight', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
	--font-mono:    'JetBrains Mono', 'SF Mono', Menlo, monospace;

	/* Spacing — generous */
	--space-3xs: 0.25rem;
	--space-2xs: 0.5rem;
	--space-xs:  0.75rem;
	--space-sm:  1rem;
	--space-md:  1.5rem;
	--space-lg:  2.5rem;
	--space-xl:  4rem;
	--space-2xl: 6rem;
	--space-3xl: 9rem;

	--radius-sm: 4px;
	--radius-md: 8px;
	--radius-lg: 16px;

	--container-max: 1240px;
	--container-narrow: 760px;

	--transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	--transition-slow: 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================================================
   Reset & base
   ========================================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--font-body);
	font-size: 17px;
	line-height: 1.65;
	color: var(--color-ink);
	background: var(--color-paper);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img, picture, video, iframe {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: inherit;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color var(--transition), opacity var(--transition);
}

a:hover,
a:focus {
	color: var(--color-rust);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-display);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.01em;
	margin: 0 0 var(--space-sm);
	color: var(--color-ink);
}

p {
	margin: 0 0 var(--space-md);
}

p:last-child {
	margin-bottom: 0;
}

.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: var(--color-cream);
	clip: auto !important;
	color: var(--color-ink);
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

.skip-link {
	position: absolute;
	top: -9999px;
	left: 0;
}

.skip-link:focus {
	top: 0;
	z-index: 9999;
}

/* ==========================================================================
   Site header / navigation
   ========================================================================== */

.site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	transition: background-color var(--transition), backdrop-filter var(--transition), box-shadow var(--transition);
	background-color: transparent;
}

body:not(.home-single) .site-header,
.site-header.is-scrolled,
.site-header.is-nav-open {
	background-color: rgba(15, 16, 19, 0.94);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	box-shadow: 0 1px 0 var(--color-rule-dark);
}

.site-header__inner {
	max-width: var(--container-max);
	margin: 0 auto;
	padding: var(--space-md) var(--space-md);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-md);
}

.site-header__brand {
	flex: 0 0 auto;
}

.site-header__wordmark {
	font-family: var(--font-display);
	font-size: 1.4rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--color-cream);
	text-decoration: none;
	display: inline-block;
	line-height: 1;
}

/* Legacy split wordmark — kept as no-ops in case content still references them */
.site-header__wordmark-first,
.site-header__wordmark-last {
	font-style: normal;
	font-weight: inherit;
	opacity: 1;
}

.custom-logo {
	max-height: 48px;
	width: auto;
}

.site-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: var(--space-lg);
	align-items: center;
}

.site-nav__list a {
	color: var(--color-cream);
	text-decoration: none;
	font-size: 0.82rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: var(--space-xs) 0;
	position: relative;
	transition: color var(--transition);
}

.site-nav__list a::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 1px;
	background: var(--color-rust);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--transition);
}

.site-nav__list a:hover::after,
.site-nav__list a:focus::after,
.site-nav__list .current-menu-item > a::after {
	transform: scaleX(1);
}

.site-nav__list a:hover,
.site-nav__list a:focus {
	color: var(--color-cream);
}

/* Mobile nav toggle */
.nav-toggle {
	display: none;
	background: transparent;
	border: none;
	padding: 10px;
	cursor: pointer;
	z-index: 101;
}

.nav-toggle span {
	display: block;
	width: 24px;
	height: 2px;
	background: var(--color-cream);
	margin: 5px 0;
	transition: transform var(--transition), opacity var(--transition);
}

.nav-toggle[aria-expanded="true"] span:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.nav-toggle[aria-expanded="true"] span:nth-child(2) {
	opacity: 0;
}

.nav-toggle[aria-expanded="true"] span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

@media (max-width: 860px) {
	.nav-toggle {
		display: block;
	}

	.site-nav {
		position: fixed;
		inset: 0;
		background: rgba(15, 16, 19, 0.98);
		backdrop-filter: blur(20px);
		transform: translateX(100%);
		transition: transform var(--transition);
		display: flex;
		align-items: center;
		justify-content: center;
		padding: var(--space-2xl) var(--space-md);
	}

	.site-nav.is-open {
		transform: translateX(0);
	}

	.site-nav__list {
		flex-direction: column;
		gap: var(--space-lg);
	}

	.site-nav__list a {
		font-size: 1.1rem;
		letter-spacing: 0.18em;
	}
}

/* ==========================================================================
   Hero — full-bleed performance photo with centered wordmark + tagline.

   Layout: A single section that fills the viewport (or 90vh on most
   displays). Photo as the background, dark gradient overlay so the
   wordmark and tagline remain readable, and two CTA buttons routing
   visitors to Tour Dates or Music.
   ========================================================================== */

.hero {
	position: relative;
	min-height: 92vh;
	min-height: 92dvh;
	background-size: cover;
	background-position: center top;
	background-color: var(--color-ink);
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	padding: var(--space-2xl) clamp(var(--space-md), 6vw, var(--space-2xl)) var(--space-2xl);
	overflow: hidden;
}

.hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg,
		rgba(15, 16, 19, 0.15) 0%,
		rgba(15, 16, 19, 0.3) 40%,
		rgba(15, 16, 19, 0.65) 75%,
		rgba(15, 16, 19, 0.92) 100%);
	z-index: 1;
}

.hero__inner {
	position: relative;
	z-index: 2;
	text-align: left;
	max-width: 820px;
	color: var(--color-cream);
}

.hero__eyebrow {
	display: inline-block;
	font-family: var(--font-body);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--color-rust);
	margin-bottom: var(--space-md);
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.7);
}

/* The centerpiece — clean serif wordmark, all same weight, generous tracking */
.hero__wordmark {
	font-family: var(--font-display);
	font-weight: 700;
	font-style: normal;
	font-size: clamp(3.5rem, 9vw, 7rem);
	line-height: 1;
	letter-spacing: -0.015em;
	color: var(--color-cream);
	margin: 0 0 var(--space-md);
	text-shadow: 0 2px 32px rgba(0, 0, 0, 0.6);
}

.hero__tagline {
	font-family: var(--font-display);
	font-style: italic;
	font-weight: 400;
	font-size: clamp(1.1rem, 1.8vw, 1.4rem);
	line-height: 1.4;
	color: var(--color-cream-2);
	margin: 0 0 var(--space-xl);
	max-width: 580px;
	text-shadow: 0 1px 12px rgba(0, 0, 0, 0.6);
}

.hero__actions {
	display: flex;
	gap: var(--space-sm);
	justify-content: flex-start;
	flex-wrap: wrap;
}

/* Scroll-down indicator */
.hero__scroll {
	position: absolute;
	bottom: var(--space-md);
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	display: block;
	width: 28px;
	height: 44px;
	border: 1px solid rgba(244, 239, 228, 0.5);
	border-radius: 14px;
	transition: border-color var(--transition);
}

.hero__scroll:hover,
.hero__scroll:focus {
	border-color: var(--color-cream);
}

.hero__scroll span {
	display: block;
	width: 3px;
	height: 8px;
	background: var(--color-cream);
	border-radius: 2px;
	margin: 8px auto 0;
	animation: hero-scroll-bounce 1.6s ease-in-out infinite;
}

@keyframes hero-scroll-bounce {
	0%, 100% { transform: translateY(0); opacity: 1; }
	50% { transform: translateY(10px); opacity: 0.4; }
}

@media (prefers-reduced-motion: reduce) {
	.hero__scroll span { animation: none; }
}

/* Mobile sizing */
@media (max-width: 860px) {
	.hero {
		min-height: 88vh;
		padding: var(--space-xl) var(--space-md);
	}
}

@media (max-width: 480px) {
	.hero {
		min-height: 80vh;
		padding: var(--space-lg) var(--space-md);
	}
	.hero__wordmark { font-size: clamp(2.5rem, 13vw, 4rem); }
	.hero__tagline { font-size: 1rem; }
	.hero__actions { flex-direction: column; align-items: stretch; }
	.hero__actions .btn { width: 100%; }
	.hero__scroll { display: none; }
}

/* ==========================================================================
   Section — shared layout
   ========================================================================== */

.section {
	padding: var(--space-2xl) var(--space-md);
	scroll-margin-top: 80px;
}

.section--alt {
	background: var(--color-cream);
}

.section__inner {
	max-width: var(--container-max);
	margin: 0 auto;
}

.section__inner--narrow {
	max-width: var(--container-narrow);
	text-align: center;
}

.section__head {
	margin-bottom: var(--space-xl);
	text-align: center;
}

.section__head--archive {
	text-align: left;
	border-bottom: 1px solid var(--color-rule);
	padding-bottom: var(--space-lg);
}

.section__eyebrow {
	display: inline-block;
	font-family: var(--font-body);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--color-rust);
	margin-bottom: var(--space-sm);
}

.section__title {
	font-family: var(--font-display);
	font-size: clamp(2.25rem, 5vw, 3.75rem);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.02em;
	margin: 0;
}

.section__title--center {
	text-align: center;
}

.section__subhead {
	font-family: var(--font-body);
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--color-ink-2);
	margin: var(--space-xl) 0 var(--space-md);
	padding-bottom: var(--space-xs);
	border-bottom: 1px solid var(--color-rule);
}

.section__subhead--past {
	color: var(--color-ink-2);
	opacity: 0.7;
}

.section__lede {
	font-family: var(--font-display);
	font-size: 1.25rem;
	font-weight: 400;
	font-style: italic;
	line-height: 1.55;
	color: var(--color-ink-2);
	margin: 0 auto var(--space-lg);
	max-width: 640px;
}

.section__lede--center {
	text-align: center;
}

.section__empty {
	text-align: center;
	font-family: var(--font-display);
	font-style: italic;
	font-size: 1.15rem;
	color: var(--color-ink-2);
	padding: var(--space-xl) 0;
}

.section__footer {
	text-align: center;
	margin-top: var(--space-xl);
}

.section__footer--center {
	display: flex;
	gap: var(--space-sm);
	justify-content: center;
	flex-wrap: wrap;
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.btn {
	display: inline-block;
	font-family: var(--font-body);
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	padding: 14px 28px;
	border: 1px solid transparent;
	border-radius: 2px;
	cursor: pointer;
	transition: background-color var(--transition), color var(--transition), border-color var(--transition);
	white-space: nowrap;
}

.btn--solid {
	background-color: var(--color-ink);
	color: var(--color-cream);
}

.btn--solid:hover,
.btn--solid:focus {
	background-color: var(--color-rust);
	color: var(--color-cream);
}

.btn--outline {
	background-color: transparent;
	color: var(--color-ink);
	border-color: var(--color-ink);
}

.btn--outline:hover,
.btn--outline:focus {
	background-color: var(--color-ink);
	color: var(--color-cream);
}

.btn--ghost {
	background-color: transparent;
	color: var(--color-ink);
	border-color: var(--color-rule);
}

.btn--ghost:hover,
.btn--ghost:focus {
	border-color: var(--color-ink);
	color: var(--color-ink);
}

.btn--disabled {
	background: transparent;
	color: var(--color-ink-2);
	border-color: var(--color-rule);
	opacity: 0.55;
	pointer-events: none;
}

/* ==========================================================================
   Tour list
   ========================================================================== */

.tour-list {
	border-top: 1px solid var(--color-rule);
}

.tour-row {
	display: grid;
	grid-template-columns: 110px 1fr auto;
	gap: var(--space-lg);
	align-items: center;
	padding: var(--space-lg) 0;
	border-bottom: 1px solid var(--color-rule);
	transition: background var(--transition);
}

.tour-row:hover {
	background: rgba(176, 74, 47, 0.04);
}

.tour-row__date {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	line-height: 1;
}

.tour-row__month {
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--color-rust);
}

.tour-row__day {
	font-family: var(--font-display);
	font-size: 3rem;
	font-weight: 700;
	color: var(--color-ink);
	margin-top: 2px;
	line-height: 0.9;
	letter-spacing: -0.02em;
}

.tour-row__year {
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.18em;
	color: var(--color-ink-2);
	margin-top: 4px;
}

.tour-row__name {
	font-family: var(--font-display);
	font-size: 1.5rem;
	font-weight: 700;
	margin: 0 0 4px;
	line-height: 1.15;
}

.tour-row__city {
	font-family: var(--font-body);
	font-size: 0.95rem;
	color: var(--color-ink-2);
	margin: 0;
}

.tour-row__time {
	font-size: 0.85rem;
	color: var(--color-ink-2);
	opacity: 0.75;
}

.tour-list--past .tour-row {
	opacity: 0.7;
}

.tour-list--past .tour-row__day {
	color: var(--color-ink-2);
}

@media (max-width: 640px) {
	.tour-row {
		grid-template-columns: 80px 1fr;
		gap: var(--space-md);
	}

	.tour-row__action {
		grid-column: 1 / -1;
		padding-top: var(--space-xs);
	}

	.tour-row__day {
		font-size: 2.25rem;
	}

	.tour-row__name {
		font-size: 1.15rem;
	}
}

/* ==========================================================================
   News grid / cards
   ========================================================================== */

.news-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: var(--space-lg);
}

.news-card {
	background: var(--color-paper);
	display: flex;
	flex-direction: column;
	transition: transform var(--transition);
}

.news-card:hover {
	transform: translateY(-4px);
}

.news-card__image-link {
	display: block;
	overflow: hidden;
	aspect-ratio: 3 / 2;
	background: var(--color-cream-2);
}

.news-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--transition-slow);
}

.news-card:hover .news-card__image {
	transform: scale(1.04);
}

.news-card__image--placeholder {
	background: linear-gradient(135deg, var(--color-cream-2) 0%, var(--color-cream) 100%);
	width: 100%;
	height: 100%;
}

.news-card__body {
	padding: var(--space-md) 0 0;
}

.news-card__date {
	display: block;
	font-family: var(--font-body);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-rust);
	margin-bottom: var(--space-2xs);
}

.news-card__title {
	font-family: var(--font-display);
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.2;
	margin: 0 0 var(--space-xs);
}

.news-card__title a {
	text-decoration: none;
}

.news-card__title a:hover,
.news-card__title a:focus {
	color: var(--color-rust);
}

.news-card__excerpt {
	font-size: 0.95rem;
	color: var(--color-ink-2);
	margin-bottom: var(--space-sm);
}

.news-card__more {
	font-family: var(--font-body);
	font-size: 0.78rem;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-ink);
}

.news-card__more:hover,
.news-card__more:focus {
	color: var(--color-rust);
}

/* ==========================================================================
   Music embeds
   ========================================================================== */

.music-embeds {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
	gap: var(--space-lg);
}

.music-embed {
	background: var(--color-ink);
	padding: var(--space-md);
	border-radius: var(--radius-lg);
}

.music-embed__label {
	font-family: var(--font-body);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--color-cream-2);
	opacity: 0.7;
	margin: 0 0 var(--space-xs);
}

/* ==========================================================================
   About section — image left, bio right (stacks on mobile)
   ========================================================================== */

.about {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: var(--space-2xl);
	align-items: center;
}

.about__media img {
	width: 100%;
	height: auto;
	border-radius: var(--radius-md);
	display: block;
	aspect-ratio: 4 / 5;
	object-fit: cover;
}

.about__body .section__title {
	margin-top: 0;
	margin-bottom: var(--space-md);
}

.about__bio {
	font-size: 1.1rem;
	line-height: 1.7;
	color: var(--color-ink);
}

.about__bio p {
	margin: 0 0 var(--space-md);
}

.about__bio p:last-child {
	margin-bottom: 0;
}

.about__bio a {
	color: var(--color-rust);
	text-decoration-color: rgba(176, 74, 47, 0.35);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.about__bio a:hover,
.about__bio a:focus {
	text-decoration-color: var(--color-rust);
}

.about__booking {
	margin-top: var(--space-lg);
	padding-top: var(--space-md);
	border-top: 1px solid var(--color-rule);
	font-family: var(--font-body);
	font-size: 0.85rem;
	letter-spacing: 0.06em;
	color: var(--color-ink-2);
}

.about__booking a {
	color: var(--color-rust);
	font-weight: 500;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

@media (max-width: 860px) {
	.about {
		grid-template-columns: 1fr;
		gap: var(--space-lg);
	}
	.about__media img {
		max-width: 480px;
		margin: 0 auto;
		aspect-ratio: 3 / 4;
	}
}

/* Section title alignment override */
.section__title--left {
	text-align: left;
}

@media (max-width: 860px) {
	.section__title--left {
		text-align: center;
	}
}

/* Booking CTA line for empty Tour state */
.section__cta-line {
	text-align: center;
	font-family: var(--font-display);
	font-style: italic;
	font-size: 1.05rem;
	color: var(--color-ink-2);
	margin: var(--space-md) 0 0;
}

.section__cta-line a {
	color: var(--color-rust);
	font-style: normal;
	font-weight: 500;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

/* Ghost button variant for use over dark backgrounds (e.g. the hero) */
.btn--ghost-light {
	background-color: transparent;
	color: var(--color-cream);
	border-color: rgba(244, 239, 228, 0.5);
}

.btn--ghost-light:hover,
.btn--ghost-light:focus {
	background-color: var(--color-cream);
	color: var(--color-ink);
	border-color: var(--color-cream);
}

/* ==========================================================================
   Video
   ========================================================================== */

.video-embed {
	position: relative;
	max-width: 960px;
	margin: 0 auto;
}

.video-embed iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	border: 0;
	border-radius: var(--radius-md);
}

.video-caption {
	text-align: center;
	font-family: var(--font-display);
	font-style: italic;
	font-size: 1rem;
	color: var(--color-ink-2);
	margin: var(--space-md) auto 0;
}

/* ==========================================================================
   Mailing list
   ========================================================================== */

.section--subscribe {
	background: var(--color-ink);
	color: var(--color-cream);
}

.section--subscribe .section__title {
	color: var(--color-cream);
}

.section--subscribe .section__lede {
	color: var(--color-cream-2);
	opacity: 0.85;
	font-style: italic;
}

.section--subscribe .section__eyebrow {
	color: var(--color-gold);
}

.mailing-form {
	display: flex;
	gap: var(--space-xs);
	max-width: 520px;
	margin: var(--space-lg) auto 0;
}

.mailing-form input[type="email"] {
	flex: 1;
	background: transparent;
	border: 1px solid rgba(244, 239, 228, 0.3);
	color: var(--color-cream);
	padding: 14px 18px;
	font-family: var(--font-body);
	font-size: 0.95rem;
	border-radius: 2px;
	transition: border-color var(--transition);
}

.mailing-form input[type="email"]:focus {
	outline: none;
	border-color: var(--color-gold);
}

.mailing-form input[type="email"]::placeholder {
	color: rgba(244, 239, 228, 0.5);
}

.mailing-form .btn--solid {
	background: var(--color-cream);
	color: var(--color-ink);
}

.mailing-form .btn--solid:hover,
.mailing-form .btn--solid:focus {
	background: var(--color-gold);
}

@media (max-width: 540px) {
	.mailing-form {
		flex-direction: column;
	}
}

/* ==========================================================================
   Writing archive
   ========================================================================== */

.collection-filter {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-xs);
	margin-bottom: var(--space-xl);
	padding-top: var(--space-md);
}

.collection-filter__item {
	font-family: var(--font-body);
	font-size: 0.78rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-ink-2);
	text-decoration: none;
	padding: 6px 14px;
	border: 1px solid var(--color-rule);
	border-radius: 100px;
	transition: background var(--transition), color var(--transition), border-color var(--transition);
}

.collection-filter__item:hover,
.collection-filter__item:focus,
.collection-filter__item.is-active {
	background: var(--color-ink);
	color: var(--color-cream);
	border-color: var(--color-ink);
}

.writing-list {
	display: flex;
	flex-direction: column;
}

.writing-item {
	padding: var(--space-xl) 0;
	border-bottom: 1px solid var(--color-rule);
	max-width: 800px;
}

.writing-item:first-child {
	padding-top: var(--space-lg);
}

.writing-item__meta {
	display: flex;
	gap: var(--space-sm);
	align-items: center;
	font-family: var(--font-body);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-ink-2);
	margin-bottom: var(--space-sm);
}

.writing-item__collection {
	color: var(--color-rust);
	padding-left: var(--space-sm);
	border-left: 1px solid var(--color-rule);
}

.writing-item__title {
	font-family: var(--font-display);
	font-size: clamp(1.75rem, 3.5vw, 2.5rem);
	font-weight: 700;
	line-height: 1.15;
	margin: 0 0 var(--space-sm);
	letter-spacing: -0.015em;
}

.writing-item__title a {
	text-decoration: none;
}

.writing-item__title a:hover,
.writing-item__title a:focus {
	color: var(--color-rust);
}

.writing-item__excerpt {
	font-size: 1.05rem;
	line-height: 1.65;
	color: var(--color-ink-2);
	margin-bottom: var(--space-sm);
}

.writing-item__more {
	font-family: var(--font-body);
	font-size: 0.78rem;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--color-ink);
	display: inline-flex;
	align-items: center;
	gap: var(--space-2xs);
	transition: gap var(--transition);
}

.writing-item__more:hover,
.writing-item__more:focus {
	gap: var(--space-xs);
	color: var(--color-rust);
}

/* ==========================================================================
   Single post / page
   ========================================================================== */

.single {
	padding-top: 120px;
}

.single__header {
	padding: var(--space-xl) var(--space-md) var(--space-lg);
}

.single__header-inner {
	max-width: 820px;
	margin: 0 auto;
	text-align: center;
}

.single__eyebrow {
	display: inline-block;
	font-family: var(--font-body);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--color-rust);
	margin-bottom: var(--space-md);
}

.single__title {
	font-family: var(--font-display);
	font-size: clamp(2.25rem, 5vw, 3.75rem);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: -0.02em;
	margin: 0 0 var(--space-md);
}

.single__meta {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--space-xs);
	font-family: var(--font-body);
	font-size: 0.82rem;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-ink-2);
}

.single__meta-sep {
	opacity: 0.4;
}

.single__hero {
	max-width: 1200px;
	margin: 0 auto var(--space-xl);
	padding: 0 var(--space-md);
}

.single__hero img {
	width: 100%;
	height: auto;
	border-radius: var(--radius-md);
}

.single__content {
	padding: 0 var(--space-md) var(--space-2xl);
}

.single__content-inner {
	max-width: 720px;
	margin: 0 auto;
	font-size: 1.125rem;
	line-height: 1.75;
}

.single__content-inner h2,
.single__content-inner h3 {
	margin-top: var(--space-xl);
}

.single__content-inner h2 {
	font-size: 1.85rem;
}

.single__content-inner h3 {
	font-size: 1.4rem;
}

.single__content-inner p {
	margin-bottom: var(--space-md);
}

.single__content-inner blockquote {
	border-left: 3px solid var(--color-rust);
	padding-left: var(--space-md);
	margin: var(--space-lg) 0;
	font-family: var(--font-display);
	font-style: italic;
	font-size: 1.3rem;
	line-height: 1.5;
	color: var(--color-ink);
}

.single__content-inner a {
	color: var(--color-rust);
	text-decoration-color: rgba(176, 74, 47, 0.35);
}

.single__content-inner a:hover,
.single__content-inner a:focus {
	text-decoration-color: var(--color-rust);
}

/* Writing post gets the editorial first-letter treatment */
.single--writing .single__content-inner > p:first-of-type::first-letter {
	font-family: var(--font-display);
	font-weight: 900;
	font-size: 4.5rem;
	float: left;
	line-height: 0.85;
	padding: 8px 12px 0 0;
	color: var(--color-rust);
}

/* ==========================================================================
   Pagination
   ========================================================================== */

.pagination {
	margin-top: var(--space-xl);
	display: flex;
	justify-content: center;
}

.pagination .page-numbers {
	font-family: var(--font-body);
	font-size: 0.85rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	padding: 8px 14px;
	margin: 0 2px;
	text-decoration: none;
	color: var(--color-ink);
	border: 1px solid var(--color-rule);
	transition: background var(--transition), color var(--transition);
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover,
.pagination .page-numbers:focus {
	background: var(--color-ink);
	color: var(--color-cream);
	border-color: var(--color-ink);
}

/* ==========================================================================
   Footer

   Layout matches the existing johnleary.org structure:
     - Top row: nav links, social icons, booking email (centered, vertical stack)
     - Credit row: site logo + secondary logo + copyright + site-design credit
   ========================================================================== */

.site-footer {
	background: var(--color-ink);
	color: var(--color-cream);
}

.site-footer__top {
	padding: var(--space-2xl) var(--space-md) var(--space-lg);
	border-bottom: 1px solid var(--color-rule-dark);
}

.site-footer__inner {
	max-width: var(--container-max);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-md);
	text-align: center;
}

.site-footer__booking {
	font-size: 0.9rem;
	color: var(--color-cream-2);
	margin: 0;
	font-family: var(--font-body);
	letter-spacing: 0.04em;
}

.site-footer__booking a {
	color: var(--color-gold);
	text-decoration-color: rgba(199, 156, 74, 0.3);
	margin-left: var(--space-2xs);
}

.site-footer__booking a:hover,
.site-footer__booking a:focus {
	color: var(--color-gold);
	text-decoration-color: var(--color-gold);
}

.site-footer__social {
	display: flex;
	align-items: center;
	justify-content: center;
}

.social-links {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-sm);
}

.social-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--color-rule-dark);
	border-radius: 50%;
	color: var(--color-cream);
	text-decoration: none;
	transition: background var(--transition), border-color var(--transition), color var(--transition);
}

.social-links a:hover,
.social-links a:focus {
	background: var(--color-cream);
	color: var(--color-ink);
	border-color: var(--color-cream);
}

.social-links__icon {
	display: block;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
}

/* Inline SVG data URLs as masks */
.social-links__icon--spotify {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z'/></svg>");
}

.social-links__icon--apple {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M23.994 6.124a9.23 9.23 0 00-.24-2.19c-.225-.966-.827-1.708-1.71-2.108a5.66 5.66 0 00-1.384-.418c-.929-.154-1.864-.198-2.802-.205-.02 0-.242-.003-.264-.003H6.407c-.02 0-.242.003-.264.003-.938.007-1.873.051-2.802.205a5.653 5.653 0 00-1.384.418C1.074 2.225.472 2.968.247 3.934a9.25 9.25 0 00-.24 2.19C0 6.197 0 6.271 0 6.344v11.312c0 .073 0 .147.007.22.003.894.046 1.788.24 2.69.225.966.827 1.708 1.71 2.108.45.204.914.328 1.384.418.929.154 1.864.197 2.802.204.02 0 .242.004.264.004h11.187c.02 0 .242-.004.264-.004.938-.007 1.873-.05 2.802-.204a5.664 5.664 0 001.384-.418c.883-.4 1.485-1.142 1.71-2.108.195-.902.237-1.796.24-2.69.007-.073.007-.147.007-.22V6.344c0-.073 0-.147-.007-.22zM17.873 15.94c-.217.898-.73 1.607-1.54 2.018-.81.412-1.708.525-2.617.525-.909 0-1.793-.164-2.622-.525-.83-.36-1.31-1.12-1.436-1.936-.08-.518-.085-1.04-.085-1.563V8.572c0-.186.042-.31.188-.435.146-.125.34-.188.532-.188.19 0 .386.063.532.188.146.125.188.25.188.435v5.43c0 .425.023.846.22 1.226.196.38.523.6.905.66.383.061.8.061 1.182-.031.383-.092.727-.273 1.013-.507.286-.234.507-.53.635-.862.128-.332.18-.685.18-1.039V6.344c0-.186.042-.31.188-.435.146-.125.34-.188.532-.188.192 0 .386.063.532.188.146.125.188.25.188.435v9.596z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M23.994 6.124a9.23 9.23 0 00-.24-2.19c-.225-.966-.827-1.708-1.71-2.108a5.66 5.66 0 00-1.384-.418c-.929-.154-1.864-.198-2.802-.205-.02 0-.242-.003-.264-.003H6.407c-.02 0-.242.003-.264.003-.938.007-1.873.051-2.802.205a5.653 5.653 0 00-1.384.418C1.074 2.225.472 2.968.247 3.934a9.25 9.25 0 00-.24 2.19C0 6.197 0 6.271 0 6.344v11.312c0 .073 0 .147.007.22.003.894.046 1.788.24 2.69.225.966.827 1.708 1.71 2.108.45.204.914.328 1.384.418.929.154 1.864.197 2.802.204.02 0 .242.004.264.004h11.187c.02 0 .242-.004.264-.004.938-.007 1.873-.05 2.802-.204a5.664 5.664 0 001.384-.418c.883-.4 1.485-1.142 1.71-2.108.195-.902.237-1.796.24-2.69.007-.073.007-.147.007-.22V6.344c0-.073 0-.147-.007-.22zM17.873 15.94c-.217.898-.73 1.607-1.54 2.018-.81.412-1.708.525-2.617.525-.909 0-1.793-.164-2.622-.525-.83-.36-1.31-1.12-1.436-1.936-.08-.518-.085-1.04-.085-1.563V8.572c0-.186.042-.31.188-.435.146-.125.34-.188.532-.188.19 0 .386.063.532.188.146.125.188.25.188.435v5.43c0 .425.023.846.22 1.226.196.38.523.6.905.66.383.061.8.061 1.182-.031.383-.092.727-.273 1.013-.507.286-.234.507-.53.635-.862.128-.332.18-.685.18-1.039V6.344c0-.186.042-.31.188-.435.146-.125.34-.188.532-.188.192 0 .386.063.532.188.146.125.188.25.188.435v9.596z'/></svg>");
}

.social-links__icon--youtube {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z'/></svg>");
}

.social-links__icon--instagram {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 1 0 0 12.324 6.162 6.162 0 0 0 0-12.324zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.406-11.845a1.44 1.44 0 1 0 0 2.881 1.44 1.44 0 0 0 0-2.881z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 1 0 0 12.324 6.162 6.162 0 0 0 0-12.324zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.406-11.845a1.44 1.44 0 1 0 0 2.881 1.44 1.44 0 0 0 0-2.881z'/></svg>");
}

.social-links__icon--facebook {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/></svg>");
}

.social-links__icon--bandcamp {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M0 18.75l7.437-13.5H24l-7.438 13.5H0z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M0 18.75l7.437-13.5H24l-7.438 13.5H0z'/></svg>");
}

/* Footer nav — horizontal pill row above social */
.site-footer__nav .site-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-md);
}

.site-footer__nav a {
	color: var(--color-cream-2);
	text-decoration: none;
	font-size: 0.78rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	font-weight: 500;
	padding: var(--space-2xs) 0;
	transition: color var(--transition);
}

.site-footer__nav a:hover,
.site-footer__nav a:focus {
	color: var(--color-gold);
}

/* Credit row — site logo, secondary logo, copyright */
.site-footer__credit {
	padding: var(--space-xl) var(--space-md);
}

.site-footer__credit-inner {
	max-width: var(--container-max);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-md);
	text-align: center;
}

.site-footer__logo img {
	display: block;
	max-height: 64px;
	width: auto;
	max-width: 240px;
	opacity: 0.9;
	transition: opacity var(--transition);
}

.site-footer__logo:hover img,
.site-footer__logo:focus img {
	opacity: 1;
}

.site-footer__secondary-logo img {
	display: block;
	max-height: 60px;
	width: auto;
	max-width: 120px;
	opacity: 0.85;
}

.site-footer__copyright {
	font-family: var(--font-body);
	font-size: 0.72rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--color-cream-2);
	opacity: 0.65;
	margin: 0;
	padding-top: var(--space-sm);
}

.site-footer__copyright a {
	color: var(--color-gold);
	text-decoration: none;
	margin-left: 4px;
	border-bottom: 1px solid transparent;
	transition: border-color var(--transition);
}

.site-footer__copyright a:hover,
.site-footer__copyright a:focus {
	border-color: var(--color-gold);
}

@media (max-width: 860px) {
	.site-footer__top {
		padding: var(--space-xl) var(--space-md) var(--space-md);
	}
	.site-footer__nav .site-footer__list {
		gap: var(--space-sm);
	}
	.site-footer__credit {
		padding: var(--space-lg) var(--space-md);
	}
	.site-footer__copyright {
		font-size: 0.68rem;
		letter-spacing: 0.14em;
	}
}

/* ==========================================================================
   Reveal on scroll (progressive enhancement)
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {
	.section,
	.news-card,
	.tour-row,
	.writing-item {
		opacity: 0;
		transform: translateY(20px);
		transition: opacity 0.7s ease-out, transform 0.7s ease-out;
	}

	.section.is-visible,
	.news-card.is-visible,
	.tour-row.is-visible,
	.writing-item.is-visible {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ==========================================================================
   Mobile optimizations (applied broadly across the theme)
   ========================================================================== */

@media (max-width: 860px) {
	.section {
		padding: var(--space-xl) var(--space-md);
	}

	.section__head {
		margin-bottom: var(--space-lg);
	}

	.section__lede {
		font-size: 1.05rem;
	}

	.single {
		padding-top: 88px;
	}

	.single__content-inner {
		font-size: 1.05rem;
		line-height: 1.7;
	}

	.single__content-inner blockquote {
		font-size: 1.15rem;
	}

	.single--writing .single__content-inner > p:first-of-type::first-letter {
		font-size: 3.5rem;
	}
}

@media (max-width: 480px) {
	.section {
		padding: var(--space-lg) var(--space-md);
	}

	.site-header__inner {
		padding: var(--space-sm) var(--space-md);
	}

	.site-header__wordmark {
		font-size: 1.35rem;
	}

	.news-grid {
		grid-template-columns: 1fr;
		gap: var(--space-md);
	}

	.music-embeds {
		grid-template-columns: 1fr;
		gap: var(--space-md);
	}

	/* Touch-friendly hit areas for buttons and nav links */
	.btn {
		padding: 14px 24px;
		min-height: 44px;
	}

	.site-nav__list a {
		padding: var(--space-sm) 0;
		min-height: 44px;
	}

	.mailing-form input[type="email"],
	.mailing-form .btn {
		min-height: 48px;
	}

	.tour-row {
		padding: var(--space-md) 0;
	}

	.single__header {
		padding: var(--space-md) var(--space-md) var(--space-md);
	}

	.single__meta {
		flex-wrap: wrap;
		justify-content: center;
	}

	.writing-item {
		padding: var(--space-lg) 0;
	}

	.writing-item__title {
		font-size: 1.5rem;
	}

	.site-footer {
		/* Padding now lives on .site-footer__top and .site-footer__credit */
	}

	.collection-filter {
		gap: 6px;
	}

	.collection-filter__item {
		font-size: 0.72rem;
		padding: 5px 12px;
	}
}