/*
 * Art Cross Cultures · Site stylesheet
 * ------------------------------------
 * The single home for ACC's signature components. Replaces the per-page
 * inline <style> blocks and the Global-Styles CSS blob ("Mobile Optimization v19").
 *
 * Tokens come from theme.json:
 *   colors:  --wp--preset--color--{foreground|background|primary|secondary|tertiary|quaternary|text|accent}
 *   type:    --wp--preset--font-size--{display|lead|heading-1..6|...}
 *   space:   --wp--preset--spacing--{10..80|body-gutter}
 *
 * Conventions: no !important unless fighting core-block inline styles is
 * unavoidable; mobile breakpoint 781px to match Björk.
 */

/* ---------------------------------------------------------------------------
 * 1. Editorial primitives
 * ------------------------------------------------------------------------- */

/* Eyebrow / section label: uppercase mono micro-label with a leading rule */
.acc-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.85rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.7rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--foreground);
	margin-block: 0 2.25rem;
}

.acc-eyebrow::before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 1px;
	background: var(--wp--preset--color--accent);
}

.acc-eyebrow.is-plain::before {
	content: none;
}

/* Section: hairline-topped editorial block */
.acc-section {
	border-top: 2px solid var(--wp--preset--color--foreground);
	padding-block: var(--wp--preset--spacing--80);
}

.acc-section.is-borderless {
	border-top: 0;
}

/* Sand zone: a soft-sand band replaces the hairline as section divider */
.acc-section.has-quaternary-background-color {
	border-top: 0;
	border-radius: 4px;
}

/* Smooth in-page scrolling (motion-safe) */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* Hero: fills the entire first viewport, content vertically centered.
   The next section starts below the fold; the scroll cue signals more. */
.acc-hero {
	position: relative;
	min-height: calc(100svh - var(--wp--preset--spacing--body-gutter, 64px));
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--80);
}

/* Scroll cue: hairline + mono word, quietly breathing */
.acc-scroll-cue {
	position: absolute;
	left: 0;
	bottom: var(--wp--preset--spacing--50);
	margin: 0;
}

.acc-scroll-cue a {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.75rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.65rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--wp--preset--color--secondary);
	transition: color 0.2s ease;
}

.acc-scroll-cue a:hover {
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}

.acc-scroll-cue a::before {
	content: "";
	width: 1px;
	height: 44px;
	background: currentColor;
	transform-origin: top;
	animation: acc-scroll-cue-breathe 2.4s ease-in-out infinite;
}

@keyframes acc-scroll-cue-breathe {
	0%, 100% {
		transform: scaleY(0.45);
	}
	50% {
		transform: scaleY(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	.acc-scroll-cue a::before {
		animation: none;
	}
}

.acc-hero > * {
	width: 100%;
}

/* Display headline (home hero), set in Fraunces via the heading element */
.acc-display {
	font-size: var(--wp--preset--font-size--display);
	font-weight: 380;
	line-height: 1.04;
	letter-spacing: -0.02em;
	max-width: 17ch;
}

/* Lead paragraph: italic, light, limited measure */
.acc-lead {
	font-size: var(--wp--preset--font-size--lead);
	font-style: italic;
	font-weight: 300;
	line-height: 1.45;
	color: var(--wp--preset--color--ink-soft);
	max-width: 38em;
}

/* Statement: the upright cousin of the lead (intro columns) */
.acc-statement {
	font-size: var(--wp--preset--font-size--lead);
	font-style: italic;
	font-weight: 300;
	line-height: 1.45;
	color: var(--wp--preset--color--foreground);
	margin: 0;
}

/* Meta line (e.g. "2026 – 2027 · China"): mono, the print-system signature */
.acc-meta {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--secondary);
}

/* Arrow link: uppercase underlined text link, terracotta on hover */
.acc-link-arrow a {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--wp--preset--color--foreground);
	border-bottom: 1px solid var(--wp--preset--color--foreground);
	padding-bottom: 3px;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.acc-link-arrow a:hover {
	color: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	text-decoration: none;
}

/* Pull quote attribution */
.acc-attribution {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--secondary);
}

/* ---------------------------------------------------------------------------
 * 2. Buttons (sizing + hover; colors and type come from theme.json)
 * ------------------------------------------------------------------------- */

.wp-block-button__link {
	padding: 1rem 2.25rem;
	border: 1px solid var(--wp--preset--color--foreground);
	transition: background 0.2s ease, color 0.2s ease;
}

.wp-block-button__link:hover {
	background: var(--wp--preset--color--background);
	color: var(--wp--preset--color--foreground);
}

.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--foreground);
}

.is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--foreground);
	color: var(--wp--preset--color--background);
}

/* ---------------------------------------------------------------------------
 * 3. Cards and media
 * ------------------------------------------------------------------------- */

/* Explore / teaser cards: equal height, links aligned on one baseline */
.acc-explore .wp-block-column {
	display: flex;
}

.acc-card {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

.acc-card .acc-card-sub {
	flex-grow: 1;
}

.acc-card figure {
	overflow: hidden;
	border-radius: 4px;
	margin: 0 0 1.25rem 0;
}

.acc-card figure img {
	width: 100%;
	aspect-ratio: 3 / 2;
	height: auto;
	object-fit: cover;
	display: block;
	transition: transform 0.5s ease;
}

.acc-card:hover figure img {
	transform: scale(1.04);
}

.acc-card h3 {
	font-size: var(--wp--preset--font-size--heading-3);
	font-weight: 500;
	margin: 0 0 0.4rem 0;
}

.acc-card .acc-card-sub {
	font-size: 0.95rem;
	line-height: 1.5;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 1.25rem 0;
}

/* Featured media-text: image matches the height of the text column */
.acc-featured .wp-block-media-text {
	align-items: stretch;
}

/* Variant: full image in its natural ratio, text centered beside it
   (used when the image must not be cropped, e.g. Projects current cycle) */
.acc-featured.is-natural .wp-block-media-text {
	align-items: center;
}

.acc-featured.is-natural .wp-block-media-text__media {
	position: static;
	min-height: 0;
	align-self: center;
}

.acc-featured.is-natural .wp-block-media-text__media img {
	position: static;
	width: 100%;
	height: auto;
	/* No aspect-ratio override: the img keeps its width/height attribute
	   ratio, so the box is reserved correctly before a lazy image loads */
	object-fit: unset;
	border-radius: 4px;
}

.acc-featured .wp-block-media-text__media {
	position: relative;
	align-self: stretch;
	min-height: 320px;
}

.acc-featured .wp-block-media-text__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 4px;
}

/* Hero call-to-action row: one primary button, one quiet text link */
.acc-cta-row {
	display: flex;
	align-items: center;
	gap: 2rem;
	flex-wrap: wrap;
}

.acc-cta-row > * {
	margin-block: 0;
}

/* Programme strip: the multi-year cycle, ACC's signature content */
.acc-programme .wp-block-column {
	border-top: 1px solid var(--wp--preset--color--tertiary);
	padding-top: 1.25rem;
}

.acc-prog-year {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 0.85rem 0;
	/* Two lines reserved so titles align even when a status line is present */
	min-height: 3em;
}

.acc-prog-year .acc-prog-current {
	display: block;
	color: var(--wp--preset--color--accent);
}

.acc-programme h3 {
	font-size: var(--wp--preset--font-size--heading-3);
	margin: 0 0 0.35rem 0;
}

.acc-programme .acc-prog-region {
	font-size: 0.95rem;
	color: var(--wp--preset--color--secondary);
	margin: 0;
}

.acc-programme .acc-link-arrow {
	margin-top: var(--wp--preset--spacing--60);
}

/* Navigation: a small accent hairline grows in on hover and stays on the
   active page. Same language as the eyebrow dash and the scroll cue. */
.site-sidebar .wp-block-navigation-item a {
	position: relative;
	transition: padding-left 0.25s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.site-sidebar .wp-block-navigation-item a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 0;
	height: 1px;
	background: var(--wp--preset--color--accent);
	transition: width 0.25s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.site-sidebar .wp-block-navigation-item a:hover,
.site-sidebar .wp-block-navigation-item a[aria-current="page"] {
	padding-left: 26px;
	text-decoration: none;
}

.site-sidebar .wp-block-navigation-item a:hover::before,
.site-sidebar .wp-block-navigation-item a[aria-current="page"]::before {
	width: 18px;
}

.wp-block-navigation a[aria-current="page"] {
	font-weight: 600;
}

/* Text selection in the accent tone */
::selection {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--background);
}

/* Anchor targets land with breathing room (scroll cue, footer links) */
:target {
	scroll-margin-top: var(--wp--preset--spacing--60);
}

/* External links carry a quiet marker */
.acc-footer a[target="_blank"]::after,
.acc-cta-row a[target="_blank"]::after {
	content: " ↗";
	font-size: 0.85em;
}

/* Scroll reveal: only when JS is present; respects reduced motion */
html.acc-js .acc-reveal {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.65s cubic-bezier(0.22, 0.61, 0.36, 1), transform 0.65s cubic-bezier(0.22, 0.61, 0.36, 1);
}

html.acc-js .acc-reveal.is-visible {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html.acc-js .acc-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * Subpage components (shared by all interior pages)
 * ------------------------------------------------------------------------- */

/* Page hero: eyebrow + H1 + lead, generous but not full-viewport */
.acc-page-hero {
	padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--60);
}

.acc-page-hero h1 {
	font-size: var(--wp--preset--font-size--heading-1);
	margin: 0 0 1.25rem 0;
	max-width: 22ch;
}

.acc-page-hero .acc-lead {
	margin: 0;
}

/* Facts grid: hairline-topped columns (team, partner points, glance bar) */
.acc-facts .wp-block-column {
	border-top: 1px solid var(--wp--preset--color--tertiary);
	padding-top: 1.25rem;
}

.acc-fact-label {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 0.85rem 0;
}

.acc-facts h3 {
	font-size: var(--wp--preset--font-size--heading-4);
	margin: 0 0 0.35rem 0;
}

.acc-fact-note {
	font-size: 0.95rem;
	line-height: 1.55;
	color: var(--wp--preset--color--secondary);
	margin: 0;
}

/* Pull quote: Fraunces italic with mono attribution */
.wp-block-pullquote.acc-pullquote {
	border: 0;
	padding: 0;
	text-align: left;
	margin-block: 0;
}

.acc-pullquote blockquote {
	margin: 0;
}

.acc-pullquote p {
	font-family: var(--wp--preset--font-family--fraunces);
	font-size: var(--wp--preset--font-size--extra-large);
	font-style: italic;
	font-weight: 350;
	line-height: 1.35;
	color: var(--wp--preset--color--foreground);
	max-width: 26em;
}

.acc-pullquote cite {
	display: block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.74rem;
	font-style: normal;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--secondary);
	margin-top: 1.5rem;
}

/* Timeline rows: mono year column + entry */
.acc-timeline p {
	display: grid;
	grid-template-columns: minmax(7.5rem, 10rem) 1fr;
	gap: 1.5rem;
	align-items: baseline;
	border-top: 1px solid var(--wp--preset--color--tertiary);
	padding-block: 0.9rem;
	margin: 0;
}

.acc-tl-year {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--secondary);
}

/* Cover hero (project pages): light text on the image, regardless of
   theme heading colors. */
.acc-cover-hero {
	border-radius: 4px;
	overflow: hidden;
}

.acc-cover-hero h1,
.acc-cover-hero p {
	color: var(--wp--preset--color--background);
}

.acc-cover-hero .acc-eyebrow::before {
	background: var(--wp--preset--color--background);
}

/* Images in editorial flow */
.acc-img-cover img {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: 4px;
}

/* Donation embed (RaiseNow): centered column, breathing room */
.acc-donate-embed {
	max-width: 640px;
	margin: 0;
}

/* Donate stays a quiet nav item, marked only by the accent tone.
   !important: core navigation emits equal-specificity color:inherit rules
   that land later in the cascade. */
.wp-block-navigation .wp-block-navigation-item a[href*="/donate"] {
	color: var(--wp--preset--color--accent) !important;
}

/* Sidebar contact line (desktop sidebar only) */
.acc-sidebar-contact a {
	color: var(--wp--preset--color--secondary);
	text-decoration: none;
	letter-spacing: 0.04em;
}

.acc-sidebar-contact a:hover {
	color: var(--wp--preset--color--foreground);
	text-decoration: none;
}

/* ---------------------------------------------------------------------------
 * 4. Footer
 * ------------------------------------------------------------------------- */

.site-footer .acc-footer {
	border-top: 2px solid var(--wp--preset--color--foreground);
}

.acc-footer-label {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--secondary);
	margin: 0 0 0.35rem 0;
}

.acc-footer a {
	text-decoration: none;
	white-space: nowrap;
}

/* Footer columns get cramped before Björk's 781px breakpoint; stack earlier. */
@media (max-width: 920px) {
	.acc-footer .wp-block-columns {
		flex-wrap: wrap !important;
	}

	.acc-footer .wp-block-column {
		flex-basis: 100% !important;
	}
}

.acc-footer a:hover {
	text-decoration: underline;
}

.acc-footer-legal {
	font-size: var(--wp--preset--font-size--tiny);
	color: var(--wp--preset--color--secondary);
}

/* ---------------------------------------------------------------------------
 * 4b. Cookie banner (Complianz), fully dressed in ACC's language:
 *     compact bottom-right card, ink top rule, mono eyebrow, quiet buttons.
 *     !important throughout: the banner ships its own generated stylesheet.
 * ------------------------------------------------------------------------- */

/* Doubled class beats the banner's own generated variables regardless of
   stylesheet order. */
.cmplz-cookiebanner.cmplz-cookiebanner {
	--cmplz_banner_width: 384px;
	--cmplz_slider_active_color: #9b3d2e;
	--cmplz_slider_inactive_color: #d8d4cc;
	--cmplz_slider_bullet_color: #ffffff;
	--cmplz_category_header_always_active_color: #9b3d2e;
}

.cmplz-cookiebanner.cmplz-bottom-right,
.cmplz-cookiebanner.cmplz-bottom-left,
.cmplz-cookiebanner.cmplz-center,
.cmplz-cookiebanner.cmplz-bottom {
	inset: auto 24px 24px auto !important;
	transform: none !important;
	width: 384px !important;
	max-width: calc(100vw - 48px) !important;
	max-height: calc(100vh - 48px) !important;
	height: auto !important;
	overflow: auto !important;
	margin: 0 !important;
	padding: 20px 24px !important;
	background: #ffffff !important;
	border: 0 !important;
	border-top: 2px solid var(--wp--preset--color--foreground) !important;
	border-radius: 0 0 4px 4px !important;
	box-shadow: 0 10px 40px rgba(26, 26, 26, 0.14) !important;
	display: block !important;
	font-family: var(--wp--preset--font-family--default) !important;
}

.cmplz-cookiebanner .cmplz-header {
	display: flex !important;
	align-items: center !important;
	min-height: 0 !important;
	margin: 0 0 10px !important;
	padding: 0 !important;
}

.cmplz-cookiebanner .cmplz-title {
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.7rem !important;
	font-family: var(--wp--preset--font-family--mono) !important;
	font-size: 0.66rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.15em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--secondary) !important;
	padding: 0 !important;
}

.cmplz-cookiebanner .cmplz-title::before {
	content: "" !important;
	display: inline-block !important;
	width: 20px !important;
	height: 1px !important;
	background: var(--wp--preset--color--accent) !important;
}

.cmplz-cookiebanner .cmplz-logo,
.cmplz-cookiebanner .cmplz-close,
.cmplz-cookiebanner .cmplz-divider,
.cmplz-cookiebanner .cmplz-links {
	display: none !important;
}

.cmplz-cookiebanner li {
	list-style: none !important;
}

.cmplz-cookiebanner li:empty {
	display: none !important;
}

.cmplz-cookiebanner .cmplz-message {
	font-size: 0.85rem !important;
	line-height: 1.55 !important;
	color: var(--wp--preset--color--ink-soft) !important;
	margin: 0 0 16px !important;
	padding: 0 !important;
}

.cmplz-cookiebanner .cmplz-buttons {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	margin: 0 !important;
	padding: 0 !important;
	min-height: 0 !important;
}

.cmplz-cookiebanner .cmplz-btn {
	flex: 0 0 auto !important;
	width: auto !important;
	min-height: 0 !important;
	height: auto !important;
	padding: 0.7em 1.35em !important;
	border-radius: 2px !important;
	font-family: var(--wp--preset--font-family--default) !important;
	font-size: 11.5px !important;
	font-weight: 500 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
	cursor: pointer !important;
	box-sizing: border-box !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-accept {
	background: var(--wp--preset--color--foreground) !important;
	color: var(--wp--preset--color--background) !important;
	border: 1px solid var(--wp--preset--color--foreground) !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-accept.cmplz-accept:hover {
	background: var(--wp--preset--color--background) !important;
	color: var(--wp--preset--color--foreground) !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-deny,
.cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences {
	background: transparent !important;
	color: var(--wp--preset--color--foreground) !important;
	border: 1px solid var(--wp--preset--color--foreground) !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-deny.cmplz-deny:hover,
.cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences.cmplz-save-preferences:hover {
	background: var(--wp--preset--color--foreground) !important;
	color: var(--wp--preset--color--background) !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences {
	background: none !important;
	border: 0 !important;
	padding: 0.7em 0 !important;
	margin-left: auto !important;
	color: var(--wp--preset--color--secondary) !important;
	font-family: var(--wp--preset--font-family--mono) !important;
	font-size: 0.62rem !important;
	letter-spacing: 0.12em !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences.cmplz-view-preferences:hover {
	color: var(--wp--preset--color--accent) !important;
}

/* Preferences view: hairline category rows, quiet toggles */
.cmplz-cookiebanner .cmplz-categories {
	margin: 0 0 14px !important;
}

.cmplz-cookiebanner .cmplz-categories .cmplz-category {
	background: #ffffff !important;
	border: 0 !important;
	border-top: 1px solid var(--wp--preset--color--tertiary) !important;
	border-radius: 0 !important;
	margin: 0 !important;
}

.cmplz-cookiebanner .cmplz-category .cmplz-category-header {
	padding: 9px 0 !important;
	align-items: center !important;
}

.cmplz-cookiebanner .cmplz-category .cmplz-category-title {
	font-size: 0.85rem !important;
	font-weight: 500 !important;
	color: var(--wp--preset--color--foreground) !important;
}

.cmplz-cookiebanner .cmplz-category .cmplz-always-active {
	font-family: var(--wp--preset--font-family--mono) !important;
	font-size: 0.6rem !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
}

.cmplz-cookiebanner .cmplz-category-toggle {
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	color: var(--wp--preset--color--secondary) !important;
	padding: 0 4px !important;
}

.cmplz-cookiebanner .cmplz-category .cmplz-description {
	font-size: 0.78rem !important;
	color: var(--wp--preset--color--secondary) !important;
	padding: 0 0 10px !important;
}

/* Small screens: full-width bottom sheet */
@media (max-width: 600px) {
	.cmplz-cookiebanner.cmplz-bottom-right,
	.cmplz-cookiebanner.cmplz-bottom-left,
	.cmplz-cookiebanner.cmplz-center,
	.cmplz-cookiebanner.cmplz-bottom {
		inset: auto 12px 12px 12px !important;
		width: auto !important;
		max-width: none !important;
	}

	.cmplz-cookiebanner .cmplz-buttons {
		flex-wrap: wrap !important;
	}
}

/* State classes MUST win over the display:block above, or the banner can
   never be dismissed (Complianz's own hide rule has no !important). */
.cmplz-cookiebanner.cmplz-dismissed.cmplz-dismissed,
.cmplz-cookiebanner.cmplz-hidden.cmplz-hidden {
	display: none !important;
}

/* Consent management embedded on the Datenschutz page */
.cmplz-manage-consent-container .cmplz-category {
	background: #ffffff !important;
	border: 0 !important;
	border-top: 1px solid var(--wp--preset--color--tertiary) !important;
	border-radius: 0 !important;
}

/* ---------------------------------------------------------------------------
 * 5. Accessibility
 * ------------------------------------------------------------------------- */

:where(a, button, .wp-block-button__link):focus-visible {
	outline: 2px solid var(--wp--preset--color--foreground);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.acc-card figure img,
	.wp-block-button__link,
	.acc-link-arrow a {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * 6. Mobile (≤ 781px, Björk's breakpoint)
 *    Root padding comes from theme.json body-gutter; no per-group padding.
 * ------------------------------------------------------------------------- */

/* Core stacks media-text at 600px, but the sidebar-less mobile layout runs
   to 781px. In the 601–781px band the text column gets too narrow beside
   the image, so we stack across the whole mobile range (mirrors core's
   own stacked rules; !important fights the inline grid-template-columns). */
@media (max-width: 781px) {
	main .wp-block-media-text.is-stacked-on-mobile {
		grid-template-columns: 100% !important;
	}

	main .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
		grid-column: 1;
		grid-row: 1;
	}

	main .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
		grid-column: 1;
		grid-row: 2;
		padding-left: 0;
		padding-right: 0;
	}
}

/* In the wider part of that band, a full-bleed square image would tower
   over the text; cap it and keep the editorial left axis. */
@media (min-width: 601px) and (max-width: 781px) {
	main .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
		max-width: 560px;
	}
}

@media (max-width: 781px) {

	.acc-display {
		max-width: none;
	}

	.acc-hero {
		min-height: 0;
		padding-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--70) !important;
	}

	/* On mobile the page flows naturally; no cue needed */
	.acc-scroll-cue {
		display: none;
	}

	/* Stacked media-text: back to natural flow with a fixed ratio */
	.acc-featured .wp-block-media-text__media {
		position: static;
		min-height: 0;
	}

	.acc-featured:not(.is-natural) .wp-block-media-text__media img {
		position: static;
		aspect-ratio: 4 / 3;
		height: auto;
	}

	.acc-section {
		padding-block: var(--wp--preset--spacing--70);
	}

	.acc-eyebrow {
		margin-block-end: 1.5rem;
	}

	/* Hero CTA row stacks: full-width button, centered text link */
	.acc-cta-row {
		flex-direction: column;
		align-items: stretch;
		gap: 1.25rem;
	}

	.acc-cta-row .wp-block-button,
	.acc-cta-row .wp-block-button__link {
		width: 100%;
		text-align: center;
	}

	.acc-cta-row .acc-link-arrow {
		text-align: center;
	}

	/* Teaser images get a calmer ratio on small screens */
	.acc-card figure img {
		aspect-ratio: 16 / 10;
	}

	/* Programme years: the two-line reservation only aligns side-by-side
	   columns; stacked, it reads as a hole between year and title. */
	.acc-prog-year {
		min-height: 0;
	}

	/* Timeline stacks: year above the entry, entry keeps the full measure */
	.acc-timeline p {
		grid-template-columns: 1fr;
		gap: 0.3rem;
	}

	/* Sand boxes and the cover hero: a slimmer inner gutter keeps the
	   measure readable on top of the root padding (fights inline padding) */
	.acc-section.has-quaternary-background-color,
	.acc-cover-hero {
		padding-left: var(--wp--preset--spacing--40) !important;
		padding-right: var(--wp--preset--spacing--40) !important;
	}

	/* Cover hero: never taller than a small-phone fold */
	.acc-cover-hero {
		min-height: min(520px, 80svh) !important;
	}

	/* --- Touch targets ------------------------------------------------
	   Quiet mono links keep their look; padding + negative margin grows
	   the hit area without moving anything. */
	.acc-link-arrow a {
		display: inline-block;
		padding: 14px 6px;
		margin: -14px -6px;
	}

	.acc-footer a,
	.acc-footer-legal a {
		display: inline-block;
		padding-block: 0.45em;
		margin-block: -0.45em;
	}

	/* Hamburger: 48px tap area, icon inset to the content edge */
	.site-header .wp-block-navigation__responsive-container-open {
		padding: 12px;
		margin-block: -12px;
		margin-right: calc(var(--wp--preset--spacing--body-gutter, 32px) - 12px);
	}

	/* Overlay: bigger close button, comfortable item taps */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		padding: 12px;
		margin: -12px;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
		padding-block: 0.35em;
		margin-block: -0.35em;
	}
}