/*
Theme Name: Super C Rally
Theme URI: https://www.supercrally.com/
Author: Super C Rally, LLC
Description: "Open Road Livery" — a lightweight block theme for the Super C Owners Rally, built from core WordPress blocks, a design system in theme.json and a small set of block styles (road-sign plates, livery stripes, photo page tops, a photo slider, a partner logo wall).
Version: 1.0.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: supercrally
*/

/*
 * Tokens live in theme.json. This file holds the component styles that
 * theme.json cannot express. Design spec: docs/design-spec.md in the project.
 * Rules: no radius above 8px, no blurred shadows, no pills.
 */

/* ============ Tokens ============ */

:root {
	--night: var(--wp--preset--color--night);
	--teal: var(--wp--preset--color--teal);
	--sage: var(--wp--preset--color--sage);
	--orange: var(--wp--preset--color--orange);
	--amber: var(--wp--preset--color--amber);
	--redrock: var(--wp--preset--color--redrock);
	--paper: var(--wp--preset--color--paper);
	--sandstone: var(--wp--preset--color--sandstone);
	--ink: var(--wp--preset--color--ink);
	--stone: var(--wp--preset--color--stone);
	--display: var(--wp--preset--font-family--display);
	--body: var(--wp--preset--font-family--body);
	--sp-40: var(--wp--preset--spacing--40);
	--sp-50: var(--wp--preset--spacing--50);
	--sp-60: var(--wp--preset--spacing--60);
	--sp-70: var(--wp--preset--spacing--70);
	--overlap: clamp(2.5rem, 1.2rem + 5.33vw, 6rem);
	--ease-out: cubic-bezier(0, 0, 0.2, 1);
	--focus: var(--teal);
	--link: var(--teal);
	--livery-h: 24px;
	--livery: linear-gradient(var(--orange) 0 6px, transparent 6px 9px, var(--amber) 9px 15px, transparent 15px 18px, var(--sage) 18px 24px);
	--topo: url("assets/images/topo.svg");
}

@media (max-width: 599px) {
	:root {
		--livery-h: 16px;
		--livery: linear-gradient(var(--orange) 0 4px, transparent 4px 6px, var(--amber) 6px 10px, transparent 10px 12px, var(--sage) 12px 16px);
	}
}

/* Dark contexts: headings go white, links and focus rings go amber. */
:is(.is-style-event-card, .wp-block-cover, .site-footer, .has-night-background-color, .has-teal-background-color) {
	--focus: var(--amber);
	--link: var(--amber);
}

.has-teal-background-color {
	--link: #fff;
}

:is(.is-style-event-card, .wp-block-cover, .site-footer, .has-night-background-color, .has-teal-background-color) :is(h1, h2, h3, h4) {
	color: #fff;
}

:is(.is-style-event-card, .site-footer, .has-night-background-color, .has-teal-background-color) a:where(:not(.wp-element-button)) {
	color: var(--link);
}

/* ============ Base ============ */

html {
	scroll-padding-top: 2rem;
}

body {
	-webkit-font-smoothing: antialiased;
	font-variant-numeric: lining-nums;
}

:where(.wp-site-blocks) > * {
	margin-block-start: 0;
}

/* Bands sit flush: no block gap between top-level sections of a page. */
.wp-block-post-content > * {
	margin-block: 0;
}

:where(h1, h2, h3, h4) {
	text-wrap: balance;
}

p {
	text-wrap: pretty;
}

a {
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
	transition: color 150ms var(--ease-out), text-decoration-thickness 150ms var(--ease-out);
}

a:hover {
	text-decoration-thickness: 2px;
}

:focus-visible {
	outline: 3px solid var(--focus);
	outline-offset: 3px;
}

.skip-link.screen-reader-text:focus {
	background: var(--night);
	color: #fff;
	border-radius: 3px;
	font-family: var(--display);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.wp-block-image img,
.wp-block-gallery img,
.wp-block-cover {
	background-color: var(--sandstone);
}

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

.overflow-anywhere,
.overflow-anywhere a {
	overflow-wrap: anywhere;
}

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

.wp-element-button,
.wp-block-button__link {
	min-width: 8.5rem;
	min-height: 52px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: box-shadow 180ms var(--ease-out), background-color 150ms var(--ease-out), color 150ms var(--ease-out);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--night);
	border: 2px solid var(--night);
	box-shadow: none;
	padding: 0.875rem 1.5rem 0.8125rem;
}

.wp-block-button.is-style-outline > .wp-block-button__link:is(:hover, :focus-visible) {
	background: var(--night);
	color: var(--paper);
	box-shadow: none;
}

.wp-block-button.is-style-outline > .wp-block-button__link:active {
	background: var(--ink);
}

:is(.is-style-event-card, .site-footer, .has-night-background-color, .wp-block-cover) .wp-block-button.is-style-outline > .wp-block-button__link {
	color: var(--amber);
	border-color: var(--amber);
}

:is(.is-style-event-card, .site-footer, .has-night-background-color, .wp-block-cover) .wp-block-button.is-style-outline > .wp-block-button__link:is(:hover, :focus-visible) {
	background: var(--amber);
	color: var(--night);
}

.has-teal-background-color .wp-block-button.is-style-outline > .wp-block-button__link {
	color: #fff;
	border-color: #fff;
}

.has-teal-background-color .wp-block-button.is-style-outline > .wp-block-button__link:is(:hover, :focus-visible) {
	background: #fff;
	color: var(--night);
}

/* ============ Header ============ */

.site-header {
	position: relative;
	z-index: 20;
}

.site-header .wp-block-site-logo {
	position: relative;
	z-index: 10;
}

.site-header .wp-block-site-logo img {
	width: 120px;
	background: none;
}

@media (min-width: 1024px) {
	.site-header .wp-block-site-logo img {
		width: 176px;
	}

	/* The badge hangs over the band below like a sticker. */
	.site-header .wp-block-site-logo {
		margin-bottom: -1.75rem;
	}
}

.site-header .wp-block-navigation-item__content {
	padding: 0.625rem 0.5rem;
	color: var(--night);
	text-decoration: none;
	border-radius: 3px;
	transition: color 150ms var(--ease-out);
}

.site-header .wp-block-navigation-item__content:hover {
	text-decoration: underline 3px var(--redrock);
	text-underline-offset: 0.3em;
	color: var(--night);
}

.site-header .wp-block-navigation-item__content[aria-current="page"] {
	background: var(--night);
	color: var(--paper);
	text-decoration: none;
}

/* The five menu links need about 790px on one row; use the overlay menu below 860px to leave some margin. */
@media (max-width: 859px) {
	.site-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.site-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* 44px tap targets; core decides when the open button is shown. */
.site-header .wp-block-navigation__responsive-container-open,
.site-header .wp-block-navigation__responsive-container-close {
	min-width: 44px;
	min-height: 44px;
	justify-content: center;
	align-items: center;
}

.site-header .wp-block-navigation__responsive-container-close {
	color: var(--amber);
}

.site-header .wp-block-navigation__responsive-container.is-menu-open {
	--focus: var(--amber);
	/* The desktop menu is right-justified; the overlay list reads better left-aligned. */
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	padding: calc(var(--livery-h) + 1.25rem) var(--wp--style--root--padding-right) 2rem;
	background: var(--night) var(--topo) center / 600px;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: var(--livery-h);
	background: var(--livery);
}

.site-header .is-menu-open .wp-block-navigation__container {
	gap: 1.25rem;
	align-items: flex-start;
}

.site-header .is-menu-open .wp-block-navigation-item__content {
	color: #fff;
	font-size: 2.25rem;
	font-weight: 800;
	padding-inline: 0;
}

.site-header .is-menu-open .wp-block-navigation-item__content[aria-current="page"] {
	background: none;
	color: var(--amber);
}

/* ============ Livery stripe (hero, page top, event card, footer) ============ */

.is-style-hero,
.is-style-page-hero,
.is-style-event-card,
.site-footer {
	position: relative;
}

.is-style-hero::after,
.is-style-page-hero::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: var(--livery-h);
	background: var(--livery);
	z-index: 1;
}

.is-style-event-card::before,
.site-footer::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: var(--livery-h);
	background: var(--livery);
}

/* ============ Hero and page tops (cover) ============ */

.wp-block-cover.is-style-hero {
	min-height: clamp(34rem, 82svh, 52rem) !important;
	padding-top: var(--sp-70);
	padding-bottom: calc(var(--sp-60) + var(--livery-h));
}

.wp-block-cover.is-style-hero:has(+ .is-style-road-sign) {
	padding-bottom: calc(var(--sp-60) + var(--livery-h) + var(--overlap));
}

/* Inner pages: a shorter photo band with the page title. */
.wp-block-cover.is-style-page-hero {
	min-height: clamp(20rem, 52svh, 34rem) !important;
	padding-top: var(--sp-60);
	padding-bottom: calc(var(--sp-50) + var(--livery-h));
}

.wp-block-cover:is(.is-style-hero, .is-style-page-hero) {
	padding-inline: var(--wp--style--root--padding-left);
}

/* Positioned covers pin a shrunken content box to the corner; put the text on the site's wide grid. */
.wp-block-cover:is(.is-style-hero, .is-style-page-hero) .wp-block-cover__inner-container {
	/* Beats core's width:auto for positioned covers. */
	width: 100% !important;
	max-width: none;
	margin: 0;
}

.wp-block-cover:is(.is-style-hero, .is-style-page-hero) .wp-block-cover__inner-container > .alignwide {
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto !important;
}

.wp-block-cover:is(.is-style-hero, .is-style-page-hero) h1 {
	text-shadow: 0 2px 0 rgb(15 42 54 / 0.35);
}

/* The home title runs high up the photo; shade the left so it stays readable and the right stays bright. */
.is-style-hero .wp-block-cover__gradient-background {
	background-image: linear-gradient(90deg, rgb(15 42 54 / 0.6) 0%, rgb(15 42 54 / 0.35) 40%, rgb(15 42 54 / 0) 68%), var(--wp--preset--gradient--hero-scrim) !important;
}

.is-style-hero h1 {
	font-size: var(--wp--preset--font-size--hero);
	line-height: 0.9;
	letter-spacing: 0;
	max-width: 66%;
}

@media (max-width: 781px) {
	.is-style-hero h1 {
		max-width: none;
	}
}

/* Place, dates and status share one size so neither outranks the other. */
.sc-hero-meta {
	gap: 0.875rem 1.25rem !important;
	align-items: center;
}

.is-style-hero p.is-style-location {
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	text-shadow: 0 2px 0 rgb(15 42 54 / 0.35);
}

/* ============ Plates, tags, labels, places ============ */

p.is-style-plate,
p.is-style-plate-outline {
	width: fit-content;
	margin-block: 0;
	font-family: var(--display);
	font-size: var(--wp--preset--font-size--plate);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	line-height: 1;
	border-radius: 3px;
	padding: 0.42em 0.7em 0.36em;
}

p.is-style-plate {
	background: var(--amber);
	color: var(--night);
	box-shadow: inset 0 0 0 4px var(--amber), inset 0 0 0 6px var(--night);
}

p.is-style-plate-outline {
	color: var(--night);
	box-shadow: inset 0 0 0 2px var(--night);
}

/* A quiet status note ("Sold Out!"): small caps text on an orange rule. */
p.is-style-tag {
	width: fit-content;
	padding: 0.45em 0 0.4em 0.75em;
	border-left: 4px solid var(--orange);
	font-family: var(--body);
	font-size: var(--wp--preset--font-size--label);
	font-weight: 700;
	line-height: 1.1;
	text-transform: uppercase;
	letter-spacing: 0.14em;
}

:is(p, h2, h3).is-style-label {
	font-family: var(--body);
	font-size: var(--wp--preset--font-size--label);
	font-weight: 700;
	line-height: 1.3;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

:is(h2, h3).is-style-label {
	color: var(--redrock);
}

/* A venue or town, set the same size as the date plate beside it. */
p.is-style-location {
	margin-block: 0;
	font-family: var(--display);
	font-size: var(--wp--preset--font-size--plate);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: 0.01em;
}

/* ============ Road-sign quote ============ */

.wp-block-group.is-style-road-sign {
	max-width: 64rem !important;
	margin-inline: auto !important;
	text-align: center;
	background: var(--amber);
	color: var(--night);
	border-radius: 8px;
	box-shadow: inset 0 0 0 12px var(--amber), inset 0 0 0 15px var(--night);
	padding: var(--sp-50) clamp(1.75rem, 5vw, 4.5rem);
	position: relative;
	z-index: 2;
}

.is-style-hero + .is-style-road-sign {
	margin-top: calc(-1 * var(--overlap)) !important;
}

.is-style-road-sign > p:first-child {
	font-family: var(--display);
	font-size: var(--wp--preset--font-size--quote);
	font-weight: 900;
	line-height: 0.95;
	text-transform: uppercase;
	text-wrap: balance;
	margin: 0;
}

.is-style-road-sign > p.is-style-label {
	margin-top: 1rem;
}

@media (max-width: 599px) {
	.wp-block-group.is-style-road-sign {
		box-shadow: inset 0 0 0 8px var(--amber), inset 0 0 0 11px var(--night);
	}
}

/* ============ Long-form text ============ */

/* Subheadings inside running text get room above them. */
.sc-prose > :is(h2, h3):not(:first-child) {
	margin-top: var(--sp-50);
}

/* A photo that stays in view beside a long text column. */
@media (min-width: 782px) {
	.sc-sticky {
		position: sticky;
		top: 2rem;
	}
}

/* ============ Section rule ============ */

.wp-block-group.is-style-section-rule {
	border-top: 2px solid var(--night);
	background: linear-gradient(var(--orange), var(--orange)) 0 0 / 4rem 6px no-repeat;
	padding-top: var(--sp-40);
}

:is(.site-footer, .has-night-background-color, .has-teal-background-color) .wp-block-group.is-style-section-rule {
	border-top-color: var(--sage);
}

/* ============ Images ============ */

.wp-block-image.is-style-offset img {
	box-shadow: 1rem 1rem 0 var(--sage);
}

.wp-block-image.is-style-offset {
	margin-right: 1rem;
	margin-bottom: 1rem;
}

/* Portrait crops get very tall once columns stack. */
@media (max-width: 781px) {
	.wp-block-image.is-style-offset img[style*="aspect-ratio:4/5"] {
		aspect-ratio: 3 / 2 !important;
	}
}

@media (max-width: 599px) {
	.wp-block-image.is-style-offset img {
		box-shadow: 0.5rem 0.5rem 0 var(--sage);
	}

	.wp-block-image.is-style-offset {
		margin-right: 0.5rem;
		margin-bottom: 0.5rem;
	}
}

.wp-block-columns.is-style-stagger > .wp-block-column:nth-child(2) {
	padding-top: var(--sp-50);
}

@media (max-width: 599px) {
	.wp-block-columns.is-style-stagger > .wp-block-column:nth-child(2) {
		padding-top: 1.5rem;
	}
}

/* ============ Feature tiles ============ */

.wp-block-group.is-style-tile-grid {
	display: grid;
	gap: var(--sp-50);
}

.wp-block-group.is-style-tile-grid > * {
	margin: 0 !important;
}

@media (min-width: 700px) {
	.wp-block-group.is-style-tile-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.is-style-tile {
	--accent: var(--orange);
}

.is-style-tile:nth-child(2) {
	--accent: var(--amber);
}

.is-style-tile:nth-child(3) {
	--accent: var(--sage);
}

.is-style-tile .wp-block-image {
	margin: 0;
}

/*
 * The title sits on the bottom of the photo, over a dark fade, with the tile's colour
 * along the edge. A longer title grows upward into the photo, so the paragraphs
 * below all start on the same line.
 */
.wp-block-group.is-style-tile {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-content: start;
}

.is-style-tile > .wp-block-image,
.is-style-tile > :is(h2, h3) {
	grid-area: 1 / 1;
}

.is-style-tile > .wp-block-image {
	margin: 0;
}

.is-style-tile img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

@media (min-width: 700px) {
	.is-style-tile img {
		aspect-ratio: 4 / 5;
	}
}

.is-style-tile > :is(h2, h3) {
	align-self: end;
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 3.5rem 1.25rem 1rem;
	color: #fff;
	background: linear-gradient(to top, rgb(15 42 54 / 0.9) 0%, rgb(15 42 54 / 0.7) 45%, rgb(15 42 54 / 0) 100%);
	border-bottom: 6px solid var(--accent);
	font-size: var(--wp--preset--font-size--subsection);
	line-height: 1.2;
	text-shadow: 0 1px 2px rgb(15 42 54 / 0.5);
}

.is-style-tile > p {
	grid-row: 2;
	margin: 1rem 0 0;
}

/* ============ Guestbook (testimonials) ============ */

.wp-block-group.is-style-guestbook {
	columns: 3 18rem;
	column-gap: var(--sp-50);
	column-rule: 1px solid rgb(15 42 54 / 0.2);
}

.wp-block-group.is-style-guestbook > .wp-block-group {
	break-inside: avoid;
	margin: 0 0 var(--sp-50) !important;
	padding-top: 1rem;
	border-top: 3px solid var(--night);
}

.wp-block-group.is-style-guestbook > .wp-block-group > p:first-child {
	font-weight: 700;
	line-height: 1.3;
	color: var(--redrock);
	margin: 0 0 0.375rem;
}

/* ============ Galleries ============ */

.wp-block-gallery.has-nested-images figure.wp-block-image img {
	border-radius: 0;
}

.wp-block-gallery.is-style-archive figure.wp-block-image {
	overflow: hidden;
}

.wp-block-gallery.is-style-archive {
	gap: 6px !important;
}

@media (hover: hover) {
	.wp-block-gallery.is-style-archive img {
		transition: transform 400ms var(--ease-out);
	}

	.wp-block-gallery.is-style-archive figure:hover img {
		transform: scale(1.04);
	}
}

/* Lightbox trigger stays visible for keyboard users. */
.wp-lightbox-container button:focus-visible {
	opacity: 1;
}

/* ============ Slider ============ */

/*
 * A row of large photos that snaps one at a time. The first photo lines up with
 * the page's wide column; the next one peeks in from the right. assets/js/slider.js
 * adds the buttons and autoplay; without it this is a swipeable row.
 */
.wp-block-gallery.is-style-slider {
	--slider-inset: max(var(--wp--style--root--padding-left), calc((100vw - var(--wp--style--global--wide-size)) / 2));
	position: relative;
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: clamp(0.5rem, 1.2vw, 1rem) !important;
	margin-bottom: 0;
	padding-inline: var(--slider-inset) !important;
	scroll-padding-inline: var(--slider-inset);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
}

.wp-block-gallery.is-style-slider.is-enhanced {
	scrollbar-width: none;
}

.wp-block-gallery.is-style-slider.is-enhanced::-webkit-scrollbar {
	display: none;
}

.wp-block-gallery.is-style-slider figure.wp-block-image {
	flex: 0 0 min(84vw, 54rem) !important;
	width: auto !important;
	margin: 0 !important;
	aspect-ratio: 3 / 2;
	scroll-snap-align: start;
	overflow: hidden;
}

.wp-block-gallery.is-style-slider img {
	width: 100%;
	height: 100% !important;
	object-fit: cover;
}

.sc-slider__controls {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0.5rem;
	max-width: var(--wp--style--global--wide-size);
	margin: 1rem auto 0;
	padding-inline: var(--wp--style--root--padding-left);
	box-sizing: content-box;
}

.sc-slider__controls[hidden] {
	display: none;
}

.sc-slider__status {
	margin: 0 auto 0 0;
	font-size: var(--wp--preset--font-size--small);
	font-variant-numeric: tabular-nums;
	color: var(--stone);
}

.sc-slider__button {
	display: inline-grid;
	place-items: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 2px solid var(--night);
	border-radius: 3px;
	background: transparent;
	color: var(--night);
	cursor: pointer;
	transition: background-color 150ms var(--ease-out), color 150ms var(--ease-out);
}

.sc-slider__button:is(:hover, :focus-visible) {
	background: var(--night);
	color: var(--paper);
}

.sc-slider__next {
	background: var(--orange);
	box-shadow: inset 0 -4px 0 var(--amber);
}

.sc-slider__next:is(:hover, :focus-visible) {
	background: var(--amber);
	color: var(--night);
}

/* ============ Year archive ============ */

/* Year and place on two lines at the same size: neither outranks the other. */
h2.is-style-year-place {
	width: fit-content;
	padding-bottom: 0.3em;
	border-bottom: 6px solid var(--orange);
	box-shadow: 0 6px 0 var(--amber), 0 12px 0 var(--sage);
	margin-bottom: calc(1rem + 12px) !important;
}

@media (min-width: 1024px) {
	.wp-block-group.is-style-year .sc-year-label {
		position: sticky;
		top: 2rem;
	}
}

/* ============ Lists ============ */

/* Bulleted lists: a short orange dash instead of a dot. */
ul.wp-block-list {
	list-style: none;
	padding-left: 0;
}

ul.wp-block-list > li {
	position: relative;
	padding-left: 1.75rem;
	margin-block: 0.625rem;
	break-inside: avoid;
}

ul.wp-block-list > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.75em;
	width: 1rem;
	height: 3px;
	background: var(--orange);
}

@media (min-width: 700px) {
	ul.wp-block-list.sc-two-col {
		columns: 2;
		column-gap: var(--sp-50);
		margin-top: 0;
	}

	ul.wp-block-list.sc-two-col > li:first-child {
		margin-top: 0;
	}
}

p.is-style-spec-line {
	font-size: var(--wp--preset--font-size--lead);
	font-weight: 700;
	line-height: 1.4;
	color: var(--night);
	border-block: 1px solid rgb(15 42 54 / 0.3);
	padding: 0.75rem 0;
}

/* ============ Notice (detour sign) ============ */

.wp-block-group.is-style-notice {
	position: relative;
	max-width: 56rem !important;
	margin-inline: auto !important;
	background: #fff;
	border: 3px solid var(--night);
	padding: calc(var(--sp-50) + 14px) var(--sp-50) var(--sp-50);
}

.wp-block-group.is-style-notice::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 14px;
	background: repeating-linear-gradient(135deg, var(--orange) 0 12px, var(--night) 12px 24px);
}

@media (max-width: 599px) {
	.wp-block-group.is-style-notice::before {
		height: 10px;
	}
}

p.is-style-signoff {
	font-size: var(--wp--preset--font-size--lead);
	font-weight: 700;
	line-height: 1.4;
	color: var(--redrock);
}

p.is-style-signoff:first-of-type {
	border-top: 2px solid var(--night);
	margin-top: var(--sp-40);
	padding-top: 1.25rem;
}

p.is-style-signoff + p.is-style-signoff {
	color: var(--teal);
	margin-top: 0.25rem;
}

/* ============ Event cards ============ */

.wp-block-group.is-style-event-card {
	background: var(--night);
	color: #fff;
	height: 100%;
	padding: calc(var(--sp-50) + var(--livery-h)) var(--sp-50) var(--sp-50);
}

.wp-block-group.is-style-event-card-tba {
	height: 100%;
	border: 2px dashed var(--night);
	color: var(--night);
	padding: var(--sp-50);
}

:is(.is-style-event-card, .is-style-event-card-tba) :is(h2, p.is-style-location) {
	font-size: var(--wp--preset--font-size--plate);
	line-height: 1.1;
}

.is-style-event-card p.is-style-location {
	color: var(--amber);
}

/* ============ Logo walls ============ */

/*
 * Partner logos float on the page with no frames. Both walls take their column
 * count from the Gallery block's own Columns setting, so it can be changed in
 * the editor. Logos are never cropped.
 */
.wp-block-gallery:is(.is-style-logo-wall, .is-style-logo-wall-lead) figure.wp-block-image {
	min-width: 0;
	margin: 0 !important;
	background: none;
}

.wp-block-gallery:is(.is-style-logo-wall, .is-style-logo-wall-lead) img {
	object-fit: contain;
	mix-blend-mode: multiply;
	background: none;
}

.wp-block-gallery:is(.is-style-logo-wall, .is-style-logo-wall-lead) figcaption {
	display: none;
}

/*
 * The current year's partners: large logos in core's gallery grid (Columns
 * setting; two per row on phones). Cells keep the width the setting gives them
 * rather than stretching to fill a short row, and the row is centred.
 */
.wp-block-gallery.is-style-logo-wall-lead {
	--wp--style--unstable-gallery-gap: clamp(1.5rem, 4vw, 4rem);
	gap: var(--wp--style--unstable-gallery-gap) !important;
	align-items: center;
	justify-content: center;
}

.wp-block-gallery.is-style-logo-wall-lead figure.wp-block-image {
	flex-grow: 0 !important;
	padding-block: clamp(0.5rem, 1.5vw, 1.25rem);
}

.wp-block-gallery.is-style-logo-wall-lead img {
	width: 100% !important;
	height: auto !important;
	max-height: 16rem;
}

/*
 * Previous partners: a masonry of CSS columns. Each logo keeps its own shape, so
 * the columns stagger; square marks are capped so they don't tower over
 * wordmarks. The Columns setting applies from 1024px; narrower screens use
 * 2 columns, then up to 3 from 600px.
 */
.wp-block-gallery.is-style-logo-wall {
	--logo-columns: 5;
	display: block !important;
	columns: 2;
	column-gap: clamp(1.5rem, 4vw, 4rem);
}

.wp-block-gallery.is-style-logo-wall.columns-1 { --logo-columns: 1; }
.wp-block-gallery.is-style-logo-wall.columns-2 { --logo-columns: 2; }
.wp-block-gallery.is-style-logo-wall.columns-3 { --logo-columns: 3; }
.wp-block-gallery.is-style-logo-wall.columns-4 { --logo-columns: 4; }
.wp-block-gallery.is-style-logo-wall.columns-5 { --logo-columns: 5; }
.wp-block-gallery.is-style-logo-wall.columns-6 { --logo-columns: 6; }
.wp-block-gallery.is-style-logo-wall.columns-7 { --logo-columns: 7; }
.wp-block-gallery.is-style-logo-wall.columns-8 { --logo-columns: 8; }

.wp-block-gallery.is-style-logo-wall.columns-1 {
	columns: 1;
}

@media (min-width: 600px) {
	.wp-block-gallery.is-style-logo-wall {
		columns: min(3, var(--logo-columns));
	}
}

@media (min-width: 1024px) {
	.wp-block-gallery.is-style-logo-wall {
		columns: var(--logo-columns);
	}
}

.wp-block-gallery.is-style-logo-wall figure.wp-block-image {
	display: block !important;
	width: 100% !important;
	break-inside: avoid;
	padding-block: clamp(0.75rem, 1.6vw, 1.5rem);
}

.wp-block-gallery.is-style-logo-wall img {
	display: block;
	width: auto !important;
	height: auto !important;
	max-width: 100%;
	max-height: 5.5rem;
	margin-inline: auto;
}

/* ============ Texture ============ */

.wp-block-group.has-teal-background-color {
	background-image: var(--topo);
	background-size: 600px;
	background-position: center;
}

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

.site-footer {
	background: var(--night) var(--topo) center / 600px;
	padding-top: calc(var(--sp-60) + var(--livery-h)) !important;
}

.site-footer .sc-footer-phone a {
	font-family: var(--display);
	font-size: var(--wp--preset--font-size--subsection);
	font-weight: 800;
	color: #fff;
	text-decoration: underline 2px var(--amber);
	text-underline-offset: 0.2em;
}

.site-footer :is(.sc-footer-phone, .sc-footer-email) a {
	display: inline-block;
	min-height: 44px;
	padding-block: 0.5rem;
}

.site-footer .sc-footer-bar {
	border-top: 1px solid rgb(159 192 188 / 0.3);
	padding-top: var(--sp-40);
}

.site-footer .wp-block-site-logo img {
	width: 96px;
	background: none;
}

@media (max-width: 599px) {
	.site-footer .wp-block-button,
	.site-footer .wp-block-button__link {
		width: 100%;
	}
}

/* ============ Motion preferences ============ */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}

	.wp-block-gallery figure:hover img {
		transform: none !important;
	}

	.wp-block-gallery.is-style-slider {
		scroll-behavior: auto;
	}
}