/*
 * Native Cover introductions share one content grid and generous geometry.
 * Editor spacing, typography, image and focal-point controls stay available.
 */
:root {
	--takt-hero-min-height: clamp(51.25rem, calc(84svh + 3.75rem), 61.75rem);
	--takt-hero-content-width: 80rem;
	--takt-hero-gutter: 1.5rem;
	--takt-hero-content-padding: clamp(3rem, 6vw, 6rem);
}

.wp-block-cover.takt-club-hero {
	min-height: var(--takt-hero-min-height);
	padding: var(--takt-hero-content-padding) var(--takt-hero-gutter);
	background-color: #07141d;
	color: #fff;
}

/* A flat club-colour rule connects the image edge to the shared content grid.
 * It does not alter the Cover box, intercept links or clip keyboard focus. */
.wp-block-cover.takt-club-hero::after {
	content: "";
	position: absolute;
	z-index: 2;
	inset-inline: max(var(--takt-hero-gutter), calc((100% - var(--takt-hero-content-width)) / 2));
	inset-block-end: 0;
	block-size: 3px;
	background: var(--wp--preset--color--primary);
	pointer-events: none;
}

/* Include an overlaid header in the available vertical space without moving
 * the copy towards the top edge. Standard headers keep symmetrical padding. */
body.takt-has-hero .wp-site-blocks:has(> .wp-block-template-part .takt-header.is-style-takt-transparent) .wp-block-cover.takt-club-hero {
	padding-block-start: calc(var(--takt-header-h, 4rem) + var(--takt-hero-content-padding));
}

.takt-club-hero > .wp-block-cover__inner-container {
	width: 100%;
	max-width: var(--takt-hero-content-width);
	margin-inline: auto;
	padding-inline: 0;
}

.takt-club-hero__copy {
	padding-inline: 0;
}

.takt-club-hero__copy h1 {
	max-width: 14ch;
	font-size: clamp(2.5rem, 1.5rem + 3.25vw, 4.5rem);
	line-height: 1.04;
	letter-spacing: -0.045em;
	text-wrap: balance;
}

.takt-club-hero__copy p {
	max-width: 32rem;
	line-height: 1.55;
	text-wrap: pretty;
}

.takt-club-hero__copy .wp-block-buttons {
	margin-block-start: 2rem;
	gap: 0.875rem;
}

/* Hero actions have their own photo-safe treatment. Native explicit colours
 * are excluded from these defaults; inline editor settings retain precedence. */
.takt-club-hero .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	padding: 1rem 1.625rem;
	border: 1px solid transparent;
	border-radius: 6px;
	font-weight: 650;
	line-height: 1.25;
	text-align: center;
	text-decoration: none;
	transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}

.takt-club-hero .wp-block-button:not(.has-custom-font-size) > .wp-block-button__link {
	font-size: 1rem;
}

.takt-club-hero .wp-block-button:not(.is-style-outline) > .wp-block-button__link:not(.has-background):not(.has-text-color) {
	background-color: #fff;
	color: #07141d;
}

.takt-club-hero .wp-block-button:not(.is-style-outline) > .wp-block-button__link:not(.has-background):not(.has-text-color):hover {
	background-color: #e5ebf0;
	color: #07141d;
}

.takt-club-hero .wp-block-button.is-style-outline > .wp-block-button__link {
	border-color: currentColor;
}

.takt-club-hero .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background):not(.has-text-color) {
	background-color: rgba(7, 20, 29, 0.24);
	border-color: rgba(255, 255, 255, 0.7);
	color: #fff;
	backdrop-filter: blur(4px);
}

.takt-club-hero .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background):not(.has-text-color):hover {
	background-color: rgba(7, 20, 29, 0.4);
	border-color: #fff;
	color: #fff;
}

.takt-club-hero .wp-block-button__link:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
}

/* The bright Home photograph stays intact; only the letter edges need help
 * where small stadium lights fall behind the introductory paragraph. */
@media (min-width: 782px) {
	.takt-club-hero--action .takt-club-hero__copy p {
		text-shadow: 0 1px 1px rgba(7, 20, 29, 0.85), 0 0 3px rgba(7, 20, 29, 0.65);
	}
}

@media (prefers-reduced-motion: reduce) {
	.takt-club-hero .wp-block-button__link {
		transition: none;
	}
}

.takt-club-hero__support {
	padding-block: var(--wp--preset--spacing--50);
	border-block-end: 1px solid var(--wp--preset--color--line);
}

.takt-club-hero__support > * {
	max-width: none;
}

.takt-club-hero__support > * + * {
	margin-block-start: var(--wp--preset--spacing--20);
}

/* On small screens, every page gives the photograph its own space and places
 * the readable text panel below it. The native image focal point is retained. */
@media (max-width: 781px) {
	.takt-club-hero .wp-block-button__link {
		min-height: 48px;
		padding: 0.8125rem 1.375rem;
	}

	.wp-block-cover.takt-club-hero {
		display: block;
		min-height: 0;
		padding: 0;
	}

	body.takt-has-hero .wp-site-blocks:has(> .wp-block-template-part .takt-header.is-style-takt-transparent) .wp-block-cover.takt-club-hero {
		padding-block-start: 0;
	}

	/* Core may enqueue Cover styles after a nested pattern has queued this
	   sheet. Qualify the surface so its mobile geometry survives either order. */
	.wp-block-cover.takt-club-hero > .wp-block-cover__image-background {
		position: relative;
		inset: auto;
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: 16 / 10;
	}

	.takt-club-hero > .wp-block-cover__background {
		display: none;
	}

	.takt-club-hero > .wp-block-cover__inner-container {
		padding: var(--takt-hero-content-padding) var(--takt-hero-gutter);
	}
}