@charset "UTF-8";
/*!
 * Bella Groove 2026 — main stylesheet
 *
 * Layout language borrowed from an editorial "music venue" poster: full-bleed
 * colour blocks, oversized condensed display type, heavy horizontal rules and
 * a strict two-column editorial grid.
 *
 * Palette is the Bella Groove blue set. Every text/background pair used here
 * has been checked against WCAG 2.2 AA (4.5:1 body, 3:1 large text and UI).
 *
 * Contents
 *  1. Fonts
 *  2. Tokens
 *  3. Reset & base
 *  4. Accessibility utilities
 *  5. Layout primitives
 *  6. Header & navigation
 *  7. Hero & page headers
 *  8. Buttons, arrows, eyebrows
 *  9. Home — front doors
 * 10. Up Next
 * 11. Gig list
 * 12. Card grids
 * 13. Quotes & testimonials
 * 14. Editorial blocks & block styles
 * 15. Records, videos, tracklists
 * 16. Forms — search, Gravity Forms, Bookly
 * 17. Journal
 * 18. CTA band & footer
 * 19. Motion & print
 */

/* ------------------------------------------------------------------ *
 * 1. Fonts — self-hosted, latin subset, swap so text paints instantly
 * ------------------------------------------------------------------ */

@font-face {
	font-family: "Archivo Black";
	src: url("../fonts/archivoblack-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Big Shoulders Display";
	src: url("../fonts/bigshoulders-700.woff2") format("woff2");
	font-weight: 700 800;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("../fonts/barlow-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("../fonts/barlow-500.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("../fonts/barlow-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Barlow";
	src: url("../fonts/barlow-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* ------------------------------------------------------------------ *
 * 2. Tokens
 * ------------------------------------------------------------------ */

:root {
	/* Brand palette. */
	--bg-ink: #12212b;
	--bg-ink-soft: #22333d;
	--bg-paper: #fefefe;
	--bg-mist: #cad6dc;
	--bg-mist-soft: #e9eff2;
	--bg-steel: #347a9c;
	--bg-blue: #2b7eb1;
	--bg-cyan: #1a8bb6;
	--bg-deep: #0f5c7c;
	--bg-coral: #d1533a;
	--bg-coral-deep: #b3402a;
	--bg-rose: #c6564e;

	/* Roles. */
	--c-text: var(--bg-ink);
	--c-muted: #4a5b66;
	--c-link: var(--bg-deep);
	--c-link-hover: var(--bg-coral-deep);
	--c-accent: var(--bg-coral);
	--c-surface: var(--bg-paper);
	--c-surface-alt: var(--bg-mist-soft);
	--c-focus: var(--bg-coral-deep);

	/* Type. */
	--f-body: "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--f-display: "Archivo Black", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--f-condensed: "Big Shoulders Display", "Arial Narrow", sans-serif;

	--fs-body: 1.0625rem;
	--fs-small: 0.9375rem;
	--fs-tiny: 0.8125rem;
	--fs-lede: clamp(1.15rem, 1.8vw, 1.4rem);
	--fs-h1: clamp(2.4rem, 6.5vw, 4.75rem);
	--fs-h2: clamp(1.9rem, 4.2vw, 3.25rem);
	--fs-h3: clamp(1.3rem, 2.2vw, 1.75rem);
	--fs-h4: clamp(1.1rem, 1.6vw, 1.3rem);
	/* The two hero lines are sized so their CAP HEIGHTS come out near-equal,
	   which is what makes the reference poster read as one block split into a
	   wide face and a condensed one. Archivo Black and Big Shoulders have very
	   different cap-height-to-em ratios (0.69 vs 0.81), so the condensed line
	   needs a smaller font-size, not a larger one. Measured on the rendered
	   glyphs, these values put line 2's cap height at 1.08x line 1's, which is
	   the relationship in the reference poster. The ratio is held constant
	   across the whole clamp so it stays true at every viewport. */
	--fs-hero-1: clamp(3.1rem, 11vw, 9.5rem);
	--fs-hero-2: clamp(2.85rem, 10.1vw, 8.7rem);
	--fs-kicker: clamp(2.6rem, 8vw, 6rem);
	--fs-eyebrow: 0.75rem;

	/* Space. */
	--wrap: 1240px;
	--wrap-text: 720px;
	--gutter: clamp(1.25rem, 5vw, 3rem);
	--space-section: clamp(2.5rem, 5vw, 4.5rem);
	--space-block: clamp(1.75rem, 3.5vw, 3rem);

	/* Lines. */
	--rule: 3px solid var(--bg-ink);
	--rule-thin: 1px solid rgba(18, 33, 43, 0.18);
	--radius-pill: 999px;
	--tap: 44px;
}

/* ------------------------------------------------------------------ *
 * 3. Reset & base
 * ------------------------------------------------------------------ */

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 6rem;
}

body {
	margin: 0;
	background-color: var(--c-surface);
	color: var(--c-text);
	font-family: var(--f-body);
	font-size: var(--fs-body);
	line-height: 1.65;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	overflow-wrap: break-word;
}

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

img,
video {
	height: auto;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 0.5em;
	font-family: var(--f-condensed);
	font-weight: 700;
	line-height: 1.03;
	letter-spacing: 0.005em;
	text-wrap: balance;
}

h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }
h4 { font-size: var(--fs-h4); }
h5, h6 {
	font-family: var(--f-body);
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

p, ul, ol, dl, figure, table, pre, blockquote {
	margin: 0 0 1.15em;
}

p:last-child,
ul:last-child,
ol:last-child {
	margin-bottom: 0;
}

a {
	color: var(--c-link);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

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

strong, b { font-weight: 700; }

small { font-size: var(--fs-small); }

hr {
	border: 0;
	border-top: var(--rule);
	margin: var(--space-block) 0;
}

blockquote {
	margin-inline: 0;
	padding-left: 1.25rem;
	border-left: 4px solid var(--c-accent);
}

code, pre, kbd {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.9em;
}

pre {
	padding: 1rem;
	overflow-x: auto;
	background: var(--bg-mist-soft);
	border: var(--rule-thin);
}

table {
	width: 100%;
	border-collapse: collapse;
}

th, td {
	padding: 0.6rem 0.75rem;
	text-align: left;
	border-bottom: var(--rule-thin);
}

th { font-weight: 600; }

::selection {
	background: var(--bg-coral);
	color: #fff;
}

/* ------------------------------------------------------------------ *
 * 4. Accessibility utilities
 * ------------------------------------------------------------------ */

.screen-reader-text,
.bg-searchform__label {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.bg-skip {
	position: absolute;
	top: -100%;
	left: 1rem;
	z-index: 999;
	padding: 0.85rem 1.4rem;
	background: var(--bg-ink);
	color: var(--bg-paper);
	font-weight: 600;
	text-decoration: none;
}

.bg-skip:focus {
	top: 1rem;
	color: var(--bg-paper);
}

:focus-visible {
	outline: 3px solid var(--c-focus);
	outline-offset: 3px;
	border-radius: 2px;
}

/* Reversed focus ring where the ground is dark. */
.bg-hero :focus-visible,
.bg-cta :focus-visible,
.bg-footer :focus-visible,
.bg-pagehead :focus-visible {
	outline-color: #fff;
}

/* ------------------------------------------------------------------ *
 * 5. Layout primitives
 * ------------------------------------------------------------------ */

.bg-wrap {
	width: 100%;
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.bg-main {
	display: block;
}

.bg-section {
	padding-block: var(--space-section);
	border-top: var(--rule);
}

.bg-section:first-child {
	border-top: 0;
}

.bg-section__title {
	font-size: var(--fs-h2);
	text-transform: uppercase;
	margin-bottom: 1rem;
}

.bg-lede {
	max-width: 46ch;
	font-size: var(--fs-lede);
	line-height: 1.5;
	color: var(--c-muted);
}

.bg-empty {
	padding: 2rem 0;
	color: var(--c-muted);
}

.bg-empty__actions {
	margin-top: 1rem;
}

/* ------------------------------------------------------------------ *
 * 6. Header & navigation
 * ------------------------------------------------------------------ */

.bg-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--bg-paper);
	border-bottom: var(--rule);
}

.bg-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	max-width: var(--wrap);
	margin-inline: auto;
	padding: 0.75rem var(--gutter);
}

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

.bg-logo,
.custom-logo-link {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
}

.bg-logo img,
.custom-logo-link img {
	width: auto;
	max-width: none;
	height: 56px;
}

.bg-header__brand .custom-logo-link {
	display: inline-flex;
}

.bg-navtoggle {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	min-height: var(--tap);
	padding: 0.5rem 0.9rem;
	background: transparent;
	border: 2px solid var(--bg-ink);
	border-radius: var(--radius-pill);
	color: var(--bg-ink);
	font-family: var(--f-body);
	font-size: var(--fs-small);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	cursor: pointer;
}

.bg-navtoggle__bars {
	display: grid;
	gap: 4px;
	width: 20px;
}

.bg-navtoggle__bars span {
	display: block;
	height: 2px;
	background: currentColor;
	transition: transform 0.2s ease, opacity 0.2s ease;
}

.bg-navtoggle[aria-expanded="true"] .bg-navtoggle__bars span:nth-child(1) {
	transform: translateY(6px) rotate(45deg);
}

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

.bg-navtoggle[aria-expanded="true"] .bg-navtoggle__bars span:nth-child(3) {
	transform: translateY(-6px) rotate(-45deg);
}

.bg-nav {
	display: none;
	position: absolute;
	inset: 100% 0 auto 0;
	padding: 1rem var(--gutter) 2rem;
	background: var(--bg-paper);
	border-bottom: var(--rule);
	max-height: calc(100vh - 5rem);
	overflow-y: auto;
}

.bg-nav.is-open {
	display: block;
}

.bg-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bg-nav__list > li > a,
.bg-nav ul > li > a {
	display: block;
	padding: 0.85rem 0;
	min-height: var(--tap);
	border-bottom: var(--rule-thin);
	color: var(--bg-ink);
	font-family: var(--f-condensed);
	font-size: 1.5rem;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 0.02em;
}

.bg-nav ul ul a {
	padding-left: 1rem;
	font-size: 1.15rem;
	font-family: var(--f-body);
	text-transform: none;
	letter-spacing: 0;
}

.bg-nav a:hover,
.bg-nav a:focus,
.bg-nav .current-menu-item > a,
.bg-nav .current_page_item > a,
.bg-nav .current-menu-ancestor > a,
.bg-nav .current_page_ancestor > a {
	color: var(--bg-coral-deep);
}

.bg-nav .current-menu-item > a,
.bg-nav .current_page_item > a {
	text-decoration: underline;
	text-decoration-color: var(--bg-coral);
	text-decoration-thickness: 3px;
}

.bg-nav__cta {
	margin: 1.25rem 0 0;
}

@media (min-width: 62em) {
	.bg-header__inner {
		padding-block: 0.5rem;
	}

	.bg-navtoggle {
		display: none;
	}

	.bg-nav {
		display: flex;
		position: static;
		align-items: center;
		gap: clamp(1rem, 2vw, 2rem);
		padding: 0;
		border: 0;
		max-height: none;
		overflow: visible;
	}

	.bg-nav__list {
		display: flex;
		align-items: center;
		gap: clamp(0.85rem, 1.8vw, 1.75rem);
	}

	.bg-nav__list > li {
		position: relative;
	}

	.bg-nav__list > li > a {
		padding: 1.35rem 0;
		border: 0;
		font-size: 1.0625rem;
		letter-spacing: 0.08em;
	}

	/* Sub-menus. */
	.bg-nav__list ul {
		position: absolute;
		top: 100%;
		left: -1rem;
		z-index: 20;
		display: none;
		min-width: 15rem;
		padding: 0.5rem 1rem;
		background: var(--bg-paper);
		border: var(--rule);
	}

	.bg-nav__list li:hover > ul,
	.bg-nav__list li:focus-within > ul {
		display: block;
	}

	.bg-nav__list ul a {
		padding: 0.6rem 0;
		font-size: 1rem;
	}

	.bg-nav__cta {
		margin: 0;
	}
}

/* ------------------------------------------------------------------ *
 * 7. Hero & page headers
 * ------------------------------------------------------------------ */

.bg-hero,
.bg-pagehead {
	background: var(--bg-steel);
	color: #fff;
	border-bottom: var(--rule);
}

.bg-hero {
	padding-block: clamp(2.5rem, 6vw, 4.5rem);
}

.bg-hero > .bg-wrap,
.bg-hero .wp-block-group__inner-container {
	max-width: var(--wrap);
	margin-inline: auto;
}

.bg-hero__title,
.bg-cta__title {
	margin: 0.35em 0 0.5em;
	display: grid;
	line-height: 0.84;
	text-transform: uppercase;
}

.bg-hero__line1,
.bg-cta__line1 {
	font-family: var(--f-display);
	font-size: var(--fs-hero-1);
	font-weight: 400;
	letter-spacing: -0.025em;
}

.bg-hero__line2,
.bg-cta__line2 {
	font-family: var(--f-condensed);
	font-size: var(--fs-hero-2);
	font-weight: 800;
	letter-spacing: 0.005em;
	line-height: 0.78;
}

/* Two-tone display heading: the first line takes the heavy grotesque, the rest the
   ultra-condensed one. Uses ::first-line so the whole heading stays a single
   editable H1 in the block editor — the author just presses Shift+Enter. */
.bg-hero__title--split,
.bg-display-split {
	font-family: var(--f-condensed);
	font-size: var(--fs-hero-2);
	font-weight: 800;
	line-height: 0.8;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	margin: 0.3em 0 0.45em;
	display: block;
}

.bg-hero__title--split::first-line,
.bg-display-split::first-line {
	font-family: var(--f-display);
	font-size: var(--fs-hero-1);
	font-weight: 400;
	letter-spacing: -0.025em;
}

.bg-hero__intro {
	max-width: 48ch;
	font-size: var(--fs-lede);
	line-height: 1.45;
}

.bg-hero__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	margin-top: clamp(1.5rem, 4vw, 3rem);
	padding-top: 1.25rem;
	border-top: 2px solid rgba(255, 255, 255, 0.45);
}

.bg-hero__address {
	margin: 0;
	font-size: var(--fs-tiny);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	line-height: 1.6;
}

.bg-hero--short {
	padding-block: clamp(2.5rem, 6vw, 4rem);
}

.bg-hero a,
.bg-pagehead a,
.bg-cta a {
	color: #fff;
}

.bg-pagehead {
	padding-block: clamp(2.25rem, 5vw, 3.75rem);
}

.bg-pagehead__title {
	margin: 0.1em 0 0;
	font-size: var(--fs-h1);
	text-transform: uppercase;
	line-height: 0.94;
}

.bg-pagehead__intro {
	max-width: 52ch;
	margin-top: 0.85rem;
	font-size: var(--fs-lede);
	line-height: 1.45;
}

/* Breadcrumbs. */
.bg-crumbs {
	border-bottom: var(--rule-thin);
	background: var(--bg-mist-soft);
	font-size: var(--fs-tiny);
}

.bg-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	list-style: none;
	margin: 0;
	padding-block: 0.6rem;
}

.bg-crumbs li + li::before {
	content: "/";
	margin-right: 0.4rem;
	color: var(--c-muted);
}

.bg-crumbs [aria-current="page"] {
	color: var(--c-muted);
}

/* ------------------------------------------------------------------ *
 * 8. Buttons, arrows, eyebrows
 * ------------------------------------------------------------------ */

.bg-eyebrow,
.is-style-bg-eyebrow {
	margin: 0;
	font-family: var(--f-body);
	font-size: var(--fs-eyebrow);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	line-height: 1.4;
}

.bg-btn,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: var(--tap);
	padding: 0.75rem 1.6rem;
	border: 2px solid currentColor;
	border-radius: var(--radius-pill);
	background: transparent;
	color: var(--bg-ink);
	font-family: var(--f-body);
	font-size: var(--fs-small);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.18s ease, color 0.18s ease;
}

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

.bg-btn--solid,
.wp-block-button__link {
	background: var(--bg-ink);
	border-color: var(--bg-ink);
	color: var(--bg-paper);
}

.bg-btn--solid:hover,
.bg-btn--solid:focus,
.wp-block-button__link:hover,
.wp-block-button__link:focus {
	background: var(--bg-coral-deep);
	border-color: var(--bg-coral-deep);
	color: #fff;
}

.bg-btn--small {
	min-height: 38px;
	padding: 0.4rem 1.1rem;
	font-size: var(--fs-tiny);
}

.bg-btn--onDark {
	border-color: #fff;
	background: #fff;
	color: var(--bg-ink);
}

.bg-btn--onDark:hover,
.bg-btn--onDark:focus {
	background: var(--bg-ink);
	border-color: var(--bg-ink);
	color: #fff;
}

.bg-btn--ghost {
	background: transparent;
	color: #fff;
}

.bg-btn--ghost:hover,
.bg-btn--ghost:focus {
	background: #fff;
	color: var(--bg-ink);
}

.bg-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 58px;
	height: 58px;
	border: 2px solid currentColor;
	border-radius: 50%;
	color: var(--bg-ink);
	transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.bg-arrow:hover,
.bg-arrow:focus {
	background: var(--bg-coral-deep);
	border-color: var(--bg-coral-deep);
	color: #fff;
	transform: translateX(3px);
}

.bg-arrow--down:hover,
.bg-arrow--down:focus {
	transform: translateY(3px);
}

/* ------------------------------------------------------------------ *
 * 9. Home — the two front doors
 * ------------------------------------------------------------------ */

.bg-doors {
	display: grid;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: var(--rule);
}

@media (min-width: 48em) {
	.bg-doors {
		grid-template-columns: 1fr 1fr;
	}

	.bg-door + .bg-door {
		border-left: var(--rule);
	}
}

.bg-door + .bg-door {
	border-top: var(--rule);
}

@media (min-width: 48em) {
	.bg-door + .bg-door {
		border-top: 0;
	}
}

.bg-door__link {
	display: grid;
	height: 100%;
	color: var(--bg-ink);
	text-decoration: none;
}

.bg-door__media {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	background: var(--bg-mist);
}

.bg-door__body {
	display: grid;
	align-content: start;
	gap: 0.6rem;
	padding: clamp(1.5rem, 4vw, 2.75rem) var(--gutter) clamp(2rem, 5vw, 3rem);
}

.bg-door__title {
	font-family: var(--f-condensed);
	font-size: clamp(2.1rem, 4.5vw, 3.25rem);
	font-weight: 800;
	line-height: 0.95;
	text-transform: uppercase;
}

.bg-door__copy {
	max-width: 42ch;
	color: var(--c-muted);
}

.bg-door__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 0.4rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-size: var(--fs-small);
	color: var(--bg-coral-deep);
}

.bg-door__link:hover .bg-door__cta,
.bg-door__link:focus .bg-door__cta {
	text-decoration: underline;
	text-underline-offset: 0.3em;
}

.bg-door__link:hover .bg-door__title,
.bg-door__link:focus .bg-door__title {
	color: var(--bg-coral-deep);
}

/* ------------------------------------------------------------------ *
 * 10. Up Next
 * ------------------------------------------------------------------ */

.bg-upnext {
	padding-block: var(--space-section);
}

.bg-upnext__media {
	margin: 0 0 clamp(1.25rem, 3vw, 2.25rem);
}

.bg-upnext__media img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.bg-upnext__kicker {
	margin: 0 0 clamp(1rem, 2.5vw, 1.75rem);
	font-family: var(--f-display);
	font-size: var(--fs-kicker);
	font-weight: 400;
	line-height: 0.9;
	letter-spacing: -0.025em;
	text-transform: none;
}

.bg-upnext__grid {
	display: grid;
	gap: clamp(1.25rem, 3vw, 3rem);
}

@media (min-width: 48em) {
	.bg-upnext__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: start;
	}
}

.bg-upnext__title {
	margin: 0 0 0.25em;
	font-size: clamp(1.7rem, 3.2vw, 2.5rem);
	text-transform: uppercase;
}

.bg-upnext__title a {
	color: inherit;
	text-decoration: none;
}

.bg-upnext__title a:hover,
.bg-upnext__title a:focus {
	color: var(--bg-coral-deep);
	text-decoration: underline;
}

.bg-upnext__venue,
.bg-upnext__when {
	margin: 0 0 0.35rem;
	font-weight: 600;
}

.bg-upnext__when {
	color: var(--c-muted);
}

.bg-upnext__lead .bg-arrow {
	margin-top: 1.25rem;
}

.bg-upnext__note {
	color: var(--c-muted);
	font-size: var(--fs-small);
}

@media (min-width: 62em) {
	.bg-upnext__note {
		text-align: right;
		max-width: 44ch;
		margin-left: auto;
	}
}

/* ------------------------------------------------------------------ *
 * 11. Gig list
 * ------------------------------------------------------------------ */

.bg-giglist {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: var(--rule);
}

.bg-gigrow {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.35rem 1.25rem;
	padding-block: clamp(1.1rem, 2.5vw, 1.75rem);
	border-bottom: var(--rule-thin);
}

@media (min-width: 48em) {
	.bg-gigrow {
		grid-template-columns: 5.5rem minmax(0, 1fr) auto;
		align-items: center;
		gap: 1.75rem;
	}
}

.bg-gigrow__date time {
	display: grid;
	justify-items: center;
	width: 4.5rem;
	padding: 0.5rem 0.25rem;
	border: 2px solid var(--bg-ink);
	line-height: 1;
	text-align: center;
}

.bg-gigrow__month {
	font-family: var(--f-body);
	font-size: var(--fs-tiny);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--bg-coral-deep);
}

.bg-gigrow__day {
	font-family: var(--f-condensed);
	font-size: 2.1rem;
	font-weight: 800;
	line-height: 1;
}

.bg-gigrow__year {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	color: var(--c-muted);
}

.bg-gigrow__title {
	margin: 0 0 0.15rem;
	font-size: clamp(1.25rem, 2.2vw, 1.6rem);
	text-transform: uppercase;
}

.bg-gigrow__title a {
	color: inherit;
	text-decoration: none;
}

.bg-gigrow__title a:hover,
.bg-gigrow__title a:focus {
	color: var(--bg-coral-deep);
	text-decoration: underline;
}

.bg-gigrow__venue {
	margin: 0;
	font-weight: 600;
}

.bg-gigrow__note {
	margin: 0.25rem 0 0;
	font-size: var(--fs-small);
	color: var(--c-muted);
}

.bg-gigrow__meta {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}

@media (min-width: 48em) {
	.bg-gigrow__meta {
		grid-column: auto;
		justify-content: flex-end;
		text-align: right;
	}
}

.bg-gigrow__time {
	margin: 0;
	font-size: var(--fs-tiny);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.bg-giglist--past .bg-gigrow {
	opacity: 0.75;
}

/* ------------------------------------------------------------------ *
 * 12. Card grids
 * ------------------------------------------------------------------ */

.bg-cardgrid {
	display: grid;
	gap: clamp(1.25rem, 3vw, 2.25rem);
	list-style: none;
	margin: 0;
	padding: 0;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
}

.bg-card {
	border: var(--rule);
	background: var(--bg-paper);
}

.bg-card__link,
.bg-card > article {
	display: grid;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.bg-card__media {
	display: block;
	position: relative;
	background: var(--bg-mist);
}

.bg-card__media img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* Album covers are square. The templates request an uncropped size so the
   artwork keeps its own proportions; object-fit then handles any cover that
   is not square rather than squashing it. */
.bg-cardgrid--records .bg-card__media img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

.bg-card__play {
	position: absolute;
	inset: auto auto 0.75rem 0.75rem;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--bg-coral-deep);
	color: #fff;
}

.bg-card__body {
	display: grid;
	align-content: start;
	gap: 0.35rem;
	padding: 1.1rem 1.25rem 1.35rem;
}

.bg-card__title {
	font-family: var(--f-condensed);
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 1.1;
	text-transform: uppercase;
}

.bg-card__title a {
	color: inherit;
	text-decoration: none;
}

.bg-card__title a:hover,
.bg-card__title a:focus {
	color: var(--bg-coral-deep);
	text-decoration: underline;
}

.bg-card__meta {
	margin: 0;
	font-size: var(--fs-tiny);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--c-muted);
}

.bg-card__excerpt {
	margin: 0;
	font-size: var(--fs-small);
	color: var(--c-muted);
}

.bg-card__link:hover,
.bg-card__link:focus {
	background: var(--bg-mist-soft);
}

/* Feature trio — bordered boxes. */
.bg-trio {
	display: grid;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	border: var(--rule);
}

@media (min-width: 48em) {
	.bg-trio {
		grid-template-columns: repeat(3, 1fr);
	}

	.bg-trio > li + li {
		border-left: var(--rule);
		border-top: 0;
	}
}

.bg-trio > li {
	padding: clamp(1.25rem, 3vw, 2rem);
}

.bg-trio > li + li {
	border-top: var(--rule);
}

/* ------------------------------------------------------------------ *
 * 13. Quotes & testimonials
 * ------------------------------------------------------------------ */

.bg-quotes {
	display: grid;
	gap: clamp(1.25rem, 3vw, 2rem);
	list-style: none;
	margin: 0;
	padding: 0;
}

.bg-quotes--grid {
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr));
}

.bg-quotes--stack {
	max-width: var(--wrap-text);
}

.bg-quote figure {
	height: 100%;
	margin: 0;
	padding: clamp(1.35rem, 3vw, 2rem);
	background: var(--bg-mist-soft);
	border: var(--rule);
	display: grid;
	align-content: space-between;
	gap: 1.25rem;
}

.bg-quote__text {
	margin: 0;
	padding: 0;
	border: 0;
	position: relative;
	font-size: 1.0625rem;
	line-height: 1.6;
}

.bg-quote__text::before {
	content: "“";
	display: block;
	font-family: var(--f-display);
	font-size: 3.5rem;
	line-height: 0.6;
	color: var(--bg-coral);
	margin-bottom: 0.35rem;
}

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

.bg-quote__by {
	display: grid;
	gap: 0.15rem;
	padding-top: 1rem;
	border-top: 2px solid var(--bg-ink);
}

.bg-quote__name {
	font-family: var(--f-condensed);
	font-size: 1.3rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.bg-quote__role {
	font-size: var(--fs-tiny);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--c-muted);
}

/* Press pull quote block style. */
.is-style-bg-pullquote {
	padding: clamp(1.25rem, 3vw, 2rem) 0;
	border-left: 0;
	border-top: var(--rule);
	border-bottom: var(--rule);
}

.is-style-bg-pullquote p {
	font-family: var(--f-condensed);
	font-size: clamp(1.5rem, 3.2vw, 2.4rem);
	font-weight: 700;
	line-height: 1.15;
	text-transform: uppercase;
}

.is-style-bg-pullquote cite {
	display: block;
	margin-top: 0.75rem;
	font-family: var(--f-body);
	font-size: var(--fs-tiny);
	font-style: normal;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--bg-coral-deep);
}

/* ------------------------------------------------------------------ *
 * 14. Editorial blocks & block styles
 * ------------------------------------------------------------------ */

.bg-page,
.bg-canvas,
.bg-frontpage {
	display: block;
}

.bg-page__content,
.bg-single .bg-page__content {
	max-width: var(--wrap);
	margin-inline: auto;
	padding: var(--space-section) var(--gutter);
}

.bg-page__content > * {
	max-width: var(--wrap-text);
	margin-inline: 0;
}

.bg-page__content > .alignwide,
.bg-page__content > .bg-cardgrid,
.bg-page__content > .bg-giglist,
.bg-page__content > .bg-quotes,
.bg-page__content > .bg-trio,
.bg-page__content > .wp-block-columns,
.bg-page__content > .wp-block-group.alignwide {
	max-width: var(--wrap);
}

.bg-page__content > .alignfull {
	max-width: none;
	margin-inline: calc(50% - 50vw);
	width: 100vw;
}

.bg-page__media {
	margin: 0;
}

.bg-page__media img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.bg-page__media figcaption {
	max-width: var(--wrap-text);
	margin: 0.6rem auto 0;
	padding-inline: var(--gutter);
	font-size: var(--fs-tiny);
	color: var(--c-muted);
}

/* Alignment support in the block editor output. */
.alignfull {
	max-width: none;
	width: 100%;
}

.alignwide {
	max-width: var(--wrap);
}

.aligncenter {
	margin-inline: auto;
}

.alignleft,
.alignright {
	max-width: 50%;
}

@media (min-width: 48em) {
	.alignleft {
		float: left;
		margin: 0.35rem 2rem 1.25rem 0;
	}

	.alignright {
		float: right;
		margin: 0.35rem 0 1.25rem 2rem;
	}
}

/* Block styles registered by the theme. */
.is-style-bg-band-ink,
.is-style-bg-band-steel,
.is-style-bg-band-mist {
	padding-block: var(--space-section);
	padding-inline: var(--gutter);
}

.is-style-bg-band-ink {
	background: var(--bg-ink);
	color: var(--bg-paper);
}

.is-style-bg-band-ink a { color: #fff; }

.is-style-bg-band-steel {
	background: var(--bg-steel);
	color: #fff;
}

.is-style-bg-band-steel a { color: #fff; }

.is-style-bg-band-mist {
	background: var(--bg-mist-soft);
}

.is-style-bg-ruled {
	border-top: var(--rule);
	border-bottom: var(--rule);
	padding-block: var(--space-section);
}

.is-style-bg-display {
	font-family: var(--f-display);
	font-weight: 400;
	font-size: var(--fs-kicker);
	line-height: 0.88;
	letter-spacing: -0.025em;
	text-transform: uppercase;
}

.is-style-bg-standfirst {
	max-width: 52ch;
	font-size: var(--fs-lede);
	line-height: 1.5;
	color: var(--c-muted);
}

.is-style-bg-ticks {
	list-style: none;
	padding-left: 0;
}

.is-style-bg-ticks li {
	position: relative;
	padding-left: 1.9rem;
	margin-bottom: 0.6rem;
}

.is-style-bg-ticks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.5em;
	width: 0.85rem;
	height: 0.45rem;
	border-left: 3px solid var(--bg-coral-deep);
	border-bottom: 3px solid var(--bg-coral-deep);
	transform: rotate(-45deg);
}

.is-style-bg-cards > .wp-block-column {
	padding: clamp(1.25rem, 3vw, 2rem);
	border: var(--rule);
	background: var(--bg-paper);
}

.is-style-bg-framed img {
	border: var(--rule);
}

.is-style-bg-actions {
	gap: 0.75rem;
}

/* Core block tuning. */
.wp-block-image figcaption,
.wp-block-embed figcaption {
	font-size: var(--fs-tiny);
	color: var(--c-muted);
	text-align: left;
}

.wp-block-separator {
	border-top: var(--rule);
	max-width: none;
}

.wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.wp-block-columns {
	display: grid;
	gap: clamp(1.25rem, 3vw, 2.5rem);
}

@media (min-width: 48em) {
	.wp-block-columns:not(.is-not-stacked-on-mobile) {
		grid-auto-flow: column;
		grid-auto-columns: 1fr;
	}
}

.wp-block-columns .wp-block-column > *:first-child {
	margin-top: 0;
}

/* ------------------------------------------------------------------ *
 * 15. Records, videos, tracklists
 * ------------------------------------------------------------------ */

.bg-record__grid {
	display: grid;
	gap: clamp(1.5rem, 4vw, 3rem);
	padding-block: var(--space-section);
}

@media (min-width: 56em) {
	.bg-record__grid {
		grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
		align-items: start;
	}
}

.bg-record__art img {
	width: 100%;
	border: var(--rule);
}

.bg-record__subhead {
	margin-top: 1.75rem;
	font-size: var(--fs-h3);
	text-transform: uppercase;
}

.bg-record__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bg-record__body,
.bg-record__body.bg-page__content {
	max-width: none;
	padding: 0;
}

.bg-record__body > * {
	max-width: none;
}

.bg-tracklist {
	counter-reset: track;
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: var(--rule);
}

.bg-tracklist__item {
	counter-increment: track;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 0.85rem;
	border-bottom: var(--rule-thin);
}

.bg-tracklist__item::before {
	content: counter(track, decimal-leading-zero);
	font-family: var(--f-condensed);
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--bg-coral-deep);
	min-width: 2.25rem;
}

.bg-tracklist__title {
	flex: 1;
	font-weight: 600;
}

.bg-tracklist__length {
	font-size: var(--fs-tiny);
	font-weight: 600;
	letter-spacing: 0.08em;
	color: var(--c-muted);
}

.bg-video__player {
	max-width: var(--wrap);
	margin-inline: auto;
	padding: var(--space-block) var(--gutter) 0;
}

.bg-video__player iframe,
.wp-block-embed iframe {
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	border: 0;
}

.bg-gig__facts {
	display: grid;
	gap: 1rem;
	margin-bottom: 2rem;
	padding-bottom: 1.5rem;
	border-bottom: var(--rule);
}

@media (min-width: 40em) {
	.bg-gig__facts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.bg-gig__facts dt {
	font-size: var(--fs-tiny);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--bg-coral-deep);
}

.bg-gig__facts dd {
	margin: 0.2rem 0 0;
	font-weight: 600;
}

.bg-gig__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 2rem;
}

/* ------------------------------------------------------------------ *
 * 16. Forms — search, Gravity Forms, Bookly
 * ------------------------------------------------------------------ */

.bg-searchform__row {
	display: flex;
	gap: 0.6rem;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="date"],
select,
textarea,
.bg-searchform__input {
	width: 100%;
	min-height: var(--tap);
	padding: 0.7rem 0.9rem;
	background: var(--bg-paper);
	border: 2px solid var(--bg-ink);
	border-radius: 0;
	color: var(--c-text);
	font-family: var(--f-body);
	font-size: 1rem;
}

textarea {
	min-height: 9rem;
	resize: vertical;
}

label {
	display: inline-block;
	margin-bottom: 0.3rem;
	font-weight: 600;
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--c-focus);
	outline-offset: 2px;
}

/* Gravity Forms. */
.bg-gform .gform_wrapper {
	margin: 0;
}

.bg-gform .gform_wrapper .gform_fields {
	display: grid;
	gap: 1.25rem;
}

.bg-gform .gfield_label,
.bg-gform legend {
	font-family: var(--f-body);
	font-weight: 600;
}

.bg-gform .gfield_required {
	color: var(--bg-coral-deep);
}

.bg-gform .gform_footer input[type="submit"],
.bg-gform .gform_button {
	min-height: var(--tap);
	padding: 0.75rem 1.9rem;
	background: var(--bg-ink);
	border: 2px solid var(--bg-ink);
	border-radius: var(--radius-pill);
	color: var(--bg-paper);
	font-family: var(--f-body);
	font-size: var(--fs-small);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	cursor: pointer;
}

.bg-gform .gform_footer input[type="submit"]:hover,
.bg-gform .gform_footer input[type="submit"]:focus {
	background: var(--bg-coral-deep);
	border-color: var(--bg-coral-deep);
}

.bg-gform .validation_message,
.bg-gform .gform_validation_errors {
	color: #8c2f1c;
	font-weight: 600;
}

/* Bookly. */
.bg-bookly {
	--bookly-accent: var(--bg-coral-deep);
	max-width: var(--wrap);
	margin-inline: auto;
}

.bg-bookly .bookly-form .bookly-btn,
.bg-bookly .bookly-form button.bookly-btn {
	border-radius: var(--radius-pill);
	background: var(--bg-ink);
	border-color: var(--bg-ink);
	font-family: var(--f-body);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	min-height: var(--tap);
}

.bg-bookly .bookly-form .bookly-btn:hover,
.bg-bookly .bookly-form .bookly-btn:focus {
	background: var(--bg-coral-deep);
	border-color: var(--bg-coral-deep);
}

.bg-bookly .bookly-form {
	font-family: var(--f-body);
}

/* ------------------------------------------------------------------ *
 * 17. Journal
 * ------------------------------------------------------------------ */

.bg-archive {
	padding-block: var(--space-section);
}

.bg-archive__search {
	max-width: 34rem;
	margin-bottom: var(--space-block);
}

.bg-meta {
	margin: 0 0 1rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	font-size: var(--fs-tiny);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--c-muted);
}

.bg-meta__sep {
	color: var(--bg-coral);
}

.bg-taglist {
	margin-top: 2rem;
	padding-top: 1.25rem;
	border-top: var(--rule);
}

.bg-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bg-tags a {
	display: inline-block;
	padding: 0.25rem 0.8rem;
	border: 2px solid var(--bg-ink);
	border-radius: var(--radius-pill);
	font-size: var(--fs-tiny);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-decoration: none;
	color: var(--bg-ink);
}

.bg-tags a:hover,
.bg-tags a:focus {
	background: var(--bg-ink);
	color: var(--bg-paper);
}

.bg-postnav {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 1rem;
	padding-block: var(--space-block);
	border-top: var(--rule);
}

.bg-pagination {
	margin-top: var(--space-block);
	padding-top: var(--space-block);
	border-top: var(--rule);
}

.bg-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.bg-pagination .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: var(--tap);
	min-height: var(--tap);
	padding: 0 0.75rem;
	border: 2px solid var(--bg-ink);
	font-weight: 700;
	text-decoration: none;
	color: var(--bg-ink);
}

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

.bg-linklist {
	display: grid;
	gap: 0;
	list-style: none;
	margin: var(--space-block) 0 0;
	padding: 0;
	border-top: var(--rule);
	max-width: 34rem;
}

.bg-linklist a {
	display: block;
	padding: 0.9rem 0;
	border-bottom: var(--rule-thin);
	font-family: var(--f-condensed);
	font-size: 1.35rem;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--bg-ink);
}

.bg-linklist a:hover,
.bg-linklist a:focus {
	color: var(--bg-coral-deep);
}

.bg-comments {
	padding-block: var(--space-section);
	border-top: var(--rule);
}

.bg-comments__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bg-comments__list ul.children {
	list-style: none;
	padding-left: clamp(1rem, 3vw, 2.5rem);
}

.bg-comments__list li {
	padding-block: 1.25rem;
	border-bottom: var(--rule-thin);
}

/* ------------------------------------------------------------------ *
 * 18. CTA band & footer
 * ------------------------------------------------------------------ */

.bg-cta {
	background: var(--bg-steel);
	color: #fff;
	padding-block: clamp(2.5rem, 6vw, 4.5rem);
	border-top: var(--rule);
}

.bg-cta__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.5rem;
	padding-top: 1.25rem;
	border-top: 2px solid rgba(255, 255, 255, 0.45);
}

.bg-cta__address {
	margin: 0;
	font-size: var(--fs-tiny);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	line-height: 1.8;
}

.bg-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin: 0;
}

.bg-footer {
	background: var(--bg-ink);
	color: var(--bg-mist);
	padding-block: clamp(2.5rem, 6vw, 4rem) 2rem;
	font-size: var(--fs-small);
}

.bg-footer a {
	color: #fff;
	text-decoration: none;
}

.bg-footer a:hover,
.bg-footer a:focus {
	text-decoration: underline;
	text-underline-offset: 0.22em;
	text-decoration-color: var(--bg-coral);
}

.bg-footer__grid {
	display: grid;
	gap: clamp(1.75rem, 4vw, 3rem);
}

@media (min-width: 48em) {
	.bg-footer__grid {
		grid-template-columns: 1.4fr 1fr 1fr;
	}
}

@media (min-width: 68em) {
	body:not(.bg-no-footer-widget) .bg-footer__grid {
		grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
	}
}

.bg-footer .bg-logo img {
	height: 74px;
}

.bg-footer__blurb {
	max-width: 34ch;
	margin: 1rem 0 1.25rem;
	color: var(--bg-mist);
}

.bg-footer__heading {
	margin: 0 0 0.85rem;
	font-family: var(--f-condensed);
	font-size: 1.15rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: #fff;
}

.bg-footer__list,
.bg-footer__legallist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.5rem;
}

.bg-footer__list ul {
	list-style: none;
	padding-left: 0.9rem;
	margin: 0.5rem 0 0;
	display: grid;
	gap: 0.4rem;
	border-left: 2px solid rgba(255, 255, 255, 0.2);
}

.bg-footer__list a,
.bg-footer__legallist a {
	display: inline-block;
	min-height: 1.9rem;
}

.bg-footer__address {
	font-style: normal;
	line-height: 1.9;
}

.bg-footer__actions {
	margin-top: 1rem;
}

.bg-social {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bg-social a {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	min-height: 38px;
	padding: 0.3rem 0.8rem;
	border: 2px solid currentColor;
	border-radius: var(--radius-pill);
	font-size: var(--fs-tiny);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.bg-social a:hover,
.bg-social a:focus {
	background: #fff;
	color: var(--bg-ink);
	text-decoration: none;
}

.bg-footer__base {
	display: grid;
	gap: 0.75rem;
	margin-top: clamp(2rem, 4vw, 3rem);
	padding-top: 1.5rem;
	border-top: 2px solid rgba(255, 255, 255, 0.25);
	font-size: var(--fs-tiny);
}

@media (min-width: 56em) {
	.bg-footer__base {
		grid-template-columns: 1fr auto;
		align-items: center;
	}

	.bg-footer__country {
		grid-column: 1 / -1;
	}
}

.bg-footer__country {
	margin: 0;
	max-width: 60ch;
	color: var(--bg-mist);
}

.bg-footer__copy {
	margin: 0;
}

.bg-footer__legallist {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.bg-footer__widget + .bg-footer__widget {
	margin-top: 1.5rem;
}

/* ------------------------------------------------------------------ *
 * 19. Motion & print
 * ------------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
}

@media print {
	.bg-header,
	.bg-footer,
	.bg-cta,
	.bg-crumbs,
	.bg-skip,
	.bg-pagination,
	.bg-postnav {
		display: none !important;
	}

	body {
		background: #fff;
		color: #000;
		font-size: 11pt;
	}

	a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 9pt;
	}
}

/* ------------------------------------------------------------------ *
 * 20. Core button block modifiers
 *
 * The block editor puts a pattern's className on the .wp-block-button
 * wrapper, so the visual treatment has to be applied to the inner link.
 * ------------------------------------------------------------------ */

.wp-block-button.bg-btn--outline > .wp-block-button__link {
	background: transparent;
	border-color: var(--bg-ink);
	color: var(--bg-ink);
}

.wp-block-button.bg-btn--outline > .wp-block-button__link:hover,
.wp-block-button.bg-btn--outline > .wp-block-button__link:focus {
	background: var(--bg-ink);
	color: var(--bg-paper);
}

.wp-block-button.bg-btn--onDark > .wp-block-button__link {
	background: #fff;
	border-color: #fff;
	color: var(--bg-ink);
}

.wp-block-button.bg-btn--onDark > .wp-block-button__link:hover,
.wp-block-button.bg-btn--onDark > .wp-block-button__link:focus {
	background: var(--bg-ink);
	border-color: var(--bg-ink);
	color: #fff;
}

.wp-block-button.bg-btn--onDark.bg-btn--ghost > .wp-block-button__link {
	background: transparent;
	border-color: #fff;
	color: #fff;
}

.wp-block-button.bg-btn--onDark.bg-btn--ghost > .wp-block-button__link:hover,
.wp-block-button.bg-btn--onDark.bg-btn--ghost > .wp-block-button__link:focus {
	background: #fff;
	color: var(--bg-ink);
}

/* Flex layout fallback for pattern groups, so the hero action bar lays out
   correctly even before WordPress prints its own layout support styles. */
.bg-hero__foot.wp-block-group,
.bg-cta__foot.wp-block-group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
}

/* ------------------------------------------------------------------ *
 * 21. Content root layout
 *
 * WordPress's constrained-layout CSS caps block children at the
 * theme.json contentSize (760px, right for body copy, far too narrow for
 * a section band) and does not centre them inside a classic template.
 * These rules take over: every direct child of the content root is
 * centred at --wrap, and the sections that are meant to bleed do.
 * They beat core's rules on specificity — core wraps its selectors in
 * :where(), which has zero specificity — so no !important is needed.
 * ------------------------------------------------------------------ */

.bg-frontpage > *,
.bg-canvas > * {
	max-width: var(--wrap);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

/* Sections that run edge to edge. */
.bg-frontpage > .alignfull,
.bg-canvas > .alignfull,
.bg-frontpage > .bg-hero,
.bg-canvas > .bg-hero,
.bg-frontpage > .bg-doors,
.bg-canvas > .bg-doors,
.bg-frontpage > .bg-cta,
.bg-canvas > .bg-cta {
	max-width: none;
}

/* The doors grid draws its own borders to the viewport edge. */
.bg-frontpage > .bg-doors,
.bg-canvas > .bg-doors {
	padding-inline: 0;
}

/* Full-bleed colour blocks: outer element bleeds, inner content re-wraps. */
.bg-hero > *,
.bg-cta > *,
.bg-pagehead > *,
[class*="is-style-bg-band-"] > * {
	max-width: var(--wrap);
	margin-inline: auto;
}

/* Interior pages: these children get the wide measure, not the text measure. */
.bg-page__content > .bg-section,
.bg-page__content > .bg-upnext,
.bg-page__content > .bg-doors,
.bg-page__content > .bg-trio,
.bg-page__content > .wp-block-group.bg-section {
	max-width: var(--wrap);
}

/* A section used as a top-level block owns its vertical rhythm only —
   horizontal space comes from the content root. */
.bg-frontpage > .bg-section,
.bg-canvas > .bg-section {
	padding-inline: var(--gutter);
}

/* Nested groups inside a section should not re-pad. */
.bg-section > .wp-block-group,
.bg-section > * {
	max-width: none;
}

/* ------------------------------------------------------------------ *
 * 22. Vertical rhythm corrections
 * ------------------------------------------------------------------ */

/* The content wrapper owns the outer rhythm: space under the page header and
   space above the footer. A .bg-section sitting at the very top or bottom
   would double that up, so it drops its own padding in that position — but
   only the section does. A paragraph in the same position keeps the wrapper's
   padding, which is what gives the standfirst room under the header and the
   closing paragraph room above the footer.

   (Zeroing padding on the wrapper itself was the earlier approach. It removed
   the gap from those paragraphs too, which is the bug this replaces.) */
.bg-archive--sections {
	padding-block: 0;
}

.bg-archive--sections > .bg-section:first-child {
	padding-top: var(--space-section);
}

.bg-archive > .bg-section:first-child,
.bg-page__content > .bg-section:first-child {
	border-top: 0;
}

.bg-page__content > .bg-section:first-child {
	padding-top: 0;
}

.bg-page__content > .bg-section:last-child {
	padding-bottom: 0;
}

/* Wide blocks inside a page keep the left rail too. */
.bg-page__content > .bg-section,
.bg-page__content > .bg-upnext,
.bg-page__content > .bg-doors,
.bg-page__content > .bg-trio,
.bg-page__content > .wp-block-group.bg-section,
.bg-page__content > .alignwide {
	margin-inline: 0;
}

/* Tables — the fees page. */
.wp-block-table table {
	border: var(--rule);
}

.wp-block-table th {
	background: var(--bg-ink);
	color: var(--bg-paper);
	font-family: var(--f-condensed);
	font-size: 1.05rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
	background: var(--bg-mist-soft);
}

.wp-block-table td:last-child {
	font-weight: 700;
	white-space: nowrap;
}

/* Gravity Forms — give the radio group room and a proper hit area. */
.bg-gform .gfield_radio {
	display: grid;
	gap: 0.5rem;
	margin-top: 0.4rem;
}

.bg-gform .gchoice {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	min-height: 2.25rem;
}

.bg-gform .gchoice label {
	margin: 0;
	font-weight: 400;
}

.bg-gform input[type="radio"],
.bg-gform input[type="checkbox"] {
	width: 1.15rem;
	height: 1.15rem;
	accent-color: var(--bg-coral-deep);
}

.bg-gform .gform_required_legend {
	font-size: var(--fs-tiny);
	color: var(--c-muted);
}

/* ------------------------------------------------------------------ *
 * 23. Solid buttons on dark grounds
 *
 * Each dark section sets `a { color: #fff }` at 0,2,0 specificity, which
 * outranks the 0,1,0 `.bg-btn--onDark` rule — so a white-filled button
 * inside one rendered white text on a white pill. Restate the button
 * colours at section specificity. Block buttons already win because their
 * selector carries three classes; these are the theme-rendered ones.
 * ------------------------------------------------------------------ */

.bg-hero a.bg-btn--onDark,
.bg-pagehead a.bg-btn--onDark,
.bg-cta a.bg-btn--onDark,
.bg-footer a.bg-btn--onDark,
[class*="is-style-bg-band-"] a.bg-btn--onDark {
	background: #fff;
	border-color: #fff;
	color: var(--bg-ink);
}

.bg-hero a.bg-btn--onDark:hover,
.bg-hero a.bg-btn--onDark:focus,
.bg-pagehead a.bg-btn--onDark:hover,
.bg-pagehead a.bg-btn--onDark:focus,
.bg-cta a.bg-btn--onDark:hover,
.bg-cta a.bg-btn--onDark:focus,
.bg-footer a.bg-btn--onDark:hover,
.bg-footer a.bg-btn--onDark:focus,
[class*="is-style-bg-band-"] a.bg-btn--onDark:hover,
[class*="is-style-bg-band-"] a.bg-btn--onDark:focus {
	background: var(--bg-coral-deep);
	border-color: var(--bg-coral-deep);
	color: #fff;
	text-decoration: none;
}

/* The ghost variant is an outline, so it keeps white text. */
.bg-hero a.bg-btn--ghost,
.bg-pagehead a.bg-btn--ghost,
.bg-cta a.bg-btn--ghost,
.bg-footer a.bg-btn--ghost,
[class*="is-style-bg-band-"] a.bg-btn--ghost {
	background: transparent;
	border-color: #fff;
	color: #fff;
}

.bg-hero a.bg-btn--ghost:hover,
.bg-hero a.bg-btn--ghost:focus,
.bg-pagehead a.bg-btn--ghost:hover,
.bg-pagehead a.bg-btn--ghost:focus,
.bg-cta a.bg-btn--ghost:hover,
.bg-cta a.bg-btn--ghost:focus,
.bg-footer a.bg-btn--ghost:hover,
.bg-footer a.bg-btn--ghost:focus,
[class*="is-style-bg-band-"] a.bg-btn--ghost:hover,
[class*="is-style-bg-band-"] a.bg-btn--ghost:focus {
	background: #fff;
	color: var(--bg-ink);
	text-decoration: none;
}