/* ==========================================================================
   Shared components. Loaded after the legacy stylesheets.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Buttons — one system, four contexts
   -------------------------------------------------------------------------- */

body:not(.wp-admin) main :is(
	.fsra-button,
	.fsra-section-button,
	.fsra-cta__button,
	.fsra-recruitment__button,
	.fsra-sponsor-us__button,
	.fsra-placeholder-button,
	.wp-block-button__link
) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 3rem;
	padding: 0.85rem 1.5rem;
	border-radius: var(--fsra-radius-control);
	font-family: var(--fsra-font-primary);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	white-space: normal;
	cursor: pointer;
	transition:
		background-color var(--fsra-transition-fast),
		border-color var(--fsra-transition-fast),
		color var(--fsra-transition-fast),
		transform 200ms var(--fsra-ease-out),
		box-shadow 200ms ease;
}

body:not(.wp-admin) main :is(
	.fsra-button,
	.fsra-section-button,
	.fsra-cta__button,
	.fsra-recruitment__button,
	.fsra-sponsor-us__button,
	.fsra-placeholder-button,
	.wp-block-button__link
):hover {
	transform: translateY(-2px);
	text-decoration: none;
}

body:not(.wp-admin) main :is(
	.fsra-button,
	.fsra-section-button,
	.fsra-cta__button,
	.fsra-recruitment__button,
	.fsra-sponsor-us__button,
	.fsra-placeholder-button,
	.wp-block-button__link
):active {
	transform: translateY(0);
}

/* --------------------------------------------------------------------------
   2. Eyebrows / kickers — consistent labelling voice
   -------------------------------------------------------------------------- */

body:not(.wp-admin) :is(
	.fsra-eyebrow,
	.fsra-section-header__eyebrow,
	.fsra-vehicles-eyebrow,
	.fsra-recruitment__eyebrow,
	.fsra-landing-hero__eyebrow,
	.fsra-vehicle-detail__eyebrow,
	.fsra-vehicle-detail__spec-kicker,
	.fsra-vehicle-detail__story-kicker
) {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	font-family: var(--fsra-font-primary);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: var(--fsra-tracking-label);
	line-height: 1.35;
	text-transform: uppercase;
	color: var(--fsra-red);
}

body:not(.wp-admin) :is(
	.fsra-eyebrow,
	.fsra-section-header__eyebrow,
	.fsra-vehicles-eyebrow,
	.fsra-recruitment__eyebrow,
	.fsra-landing-hero__eyebrow
)::before {
	content: "";
	display: inline-block;
	width: 1.9rem;
	height: 3px;
	background: currentColor;
	flex: 0 0 auto;
}

/* --------------------------------------------------------------------------
   3. Cards — flatter, crisper, consistent
   -------------------------------------------------------------------------- */

body:not(.wp-admin) main :is(
	.fsra-card,
	.fsra-info-card,
	.fsra-news-card,
	.fsra-team-card,
	.fsra-alumni-card,
	.fsra-vehicle-card,
	.fsra-placeholder-card,
	.fsra-latest-news__card,
	.fsra-stat-card,
	.fsra-department-card,
	.fsra-season-card,
	.fsra-recruitment__card,
	.fsra-sponsor-us__card
) {
	border: 1px solid var(--fsra-card-border);
	border-radius: var(--fsra-radius-card);
	box-shadow: var(--fsra-shadow-card);
	transition:
		box-shadow 240ms ease,
		border-color 240ms ease,
		transform 240ms var(--fsra-ease-out);
}

body:not(.wp-admin) main :is(
	.fsra-card,
	.fsra-news-card,
	.fsra-team-card,
	.fsra-alumni-card,
	.fsra-vehicle-card,
	.fsra-latest-news__card,
	.fsra-season-card
):hover {
	transform: translateY(-3px);
	border-color: rgba(175, 0, 0, 0.28);
	box-shadow: var(--fsra-shadow-card-hover);
}

/* Sponsor cards. */
body:not(.wp-admin) main :is(
	.fsra-sponsor-card,
	.fsra-partner-carousel__item,
	.fsra-featured-partner-card
) {
	border: 1px solid var(--fsra-border);
	border-radius: var(--fsra-radius-card);
	box-shadow: none;
	transition:
		border-color 220ms ease,
		box-shadow 220ms ease,
		transform 220ms var(--fsra-ease-out);
}

body:not(.wp-admin) main :is(
	.fsra-sponsor-card--link,
	a.fsra-partner-carousel__item,
	a.fsra-featured-partner-card
):hover {
	transform: translateY(-2px);
	border-color: rgba(7, 38, 78, 0.3);
	box-shadow: var(--fsra-shadow-card);
}

body:not(.wp-admin) .fsra-sponsor-card__logo,
body:not(.wp-admin) .fsra-partner-carousel__item img {
	filter: grayscale(1);
	opacity: 0.75;
	transition: filter 220ms ease, opacity 220ms ease;
}

body:not(.wp-admin) :is(
	.fsra-sponsor-card:hover,
	.fsra-sponsor-card:focus-visible,
	.fsra-partner-carousel__item:hover,
	.fsra-partner-carousel__item:focus-visible
) img {
	filter: none;
	opacity: 1;
}

/* --------------------------------------------------------------------------
   4. Forms — visible focus, consistent fields
   -------------------------------------------------------------------------- */

body:not(.wp-admin) main :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], textarea, select) {
	border: 1px solid var(--fsra-border);
	border-radius: var(--fsra-radius-control);
	background: var(--fsra-surface);
	color: var(--fsra-text);
	font-family: var(--fsra-font-primary);
	transition: border-color var(--fsra-transition-fast), box-shadow var(--fsra-transition-fast);
}

body:not(.wp-admin) main :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], textarea, select):focus-visible {
	outline: var(--fsra-focus-ring);
	outline-offset: 1px;
	border-color: var(--fsra-blue);
}

/* --------------------------------------------------------------------------
   5. Multilingual text safety (AGENTS.md)
   -------------------------------------------------------------------------- */

body:not(.wp-admin) main :where(
	.fsra-card,
	.fsra-news-card,
	.fsra-team-card,
	.fsra-vehicle-card,
	.fsra-sponsor-card,
	.fsra-department-card
) :where(h2, h3, h4, p, a, span) {
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: normal;
	hyphens: auto;
	min-width: 0;
}

/* --------------------------------------------------------------------------
   6. Shared branded image placeholders
   -------------------------------------------------------------------------- */

body:not(.wp-admin) :is(
	.fsra-news-card__image--placeholder,
	.fsra-vehicle-detail__image-placeholder,
	.fsra-vehicle-row__placeholder,
	.fsra-vehicle-card__placeholder,
	.fsra-vehicle-hero__placeholder,
	.fsra-vehicles-process-placeholder,
	.fsra-gallery-parity-card__placeholder,
	.fsra-formula-story__placeholder
) {
	position: relative;
	overflow: hidden;
	background-color: #07264e !important;
	background-image: url("../media/fsra-placeholder.svg") !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: contain !important;
}

body:not(.wp-admin) img.fsra-placeholder-image {
	display: block;
	width: 100%;
	height: auto;
	background: #07264e;
	object-fit: contain !important;
	object-position: center;
}

body:not(.wp-admin) :is(
	.fsra-news-card__image--placeholder,
	.fsra-vehicle-detail__image-placeholder,
	.fsra-vehicle-row__placeholder,
	.fsra-vehicle-card__placeholder,
	.fsra-vehicle-hero__placeholder,
	.fsra-vehicles-process-placeholder,
	.fsra-gallery-parity-card__placeholder,
	.fsra-formula-story__placeholder
) > img.fsra-placeholder-image {
	height: 100%;
}

body:not(.wp-admin) :is(
	.fsra-about-us__image-placeholder,
	.fsra-team__image-placeholder
):not(:has(> img[src])) {
	min-height: clamp(14rem, 36vw, 32rem);
	background: #07264e url("../media/fsra-placeholder.svg") center / contain no-repeat !important;
}

body:not(.wp-admin) :is(
	.fsra-about-us__image-placeholder,
	.fsra-team__image-placeholder
) > img:not([src]) {
	display: none;
}

body:not(.wp-admin) :is(
	.fsra-vehicle-detail__image-placeholder,
	.fsra-vehicle-row__placeholder,
	.fsra-vehicle-card__placeholder,
	.fsra-vehicle-hero__placeholder,
	.fsra-vehicles-process-placeholder
) > :not(.fsra-placeholder-image) {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

body:not(.wp-admin) .fsra-gallery-parity-card__placeholder > span,
body:not(.wp-admin) :is(
	.fsra-featured-partner-card__fallback,
	.fsra-main-sponsor__fallback,
	.fsra-sponsors-featured__primary-fallback
) {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

body:not(.wp-admin) :is(
	.fsra-featured-partner-card,
	.fsra-main-sponsor__logo-slot,
	.fsra-sponsors-featured__primary-media
):has(> :is(
	.fsra-featured-partner-card__fallback,
	.fsra-main-sponsor__fallback,
	.fsra-sponsors-featured__primary-fallback
)) {
	background: #07264e url("../media/fsra-placeholder.svg") center / contain no-repeat !important;
}

body:not(.wp-admin) .fsra-formula-story__placeholder::before,
body:not(.wp-admin) .fsra-formula-story__placeholder::after {
	content: none !important;
}

body:not(.wp-admin) img[src$="/assets/media/logo_na.png"] {
	content: url("../media/fsra-placeholder.svg");
	background: #07264e;
	object-fit: contain;
}

/* --------------------------------------------------------------------------
   7. Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	body:not(.wp-admin) main :is(
		.fsra-button,
		.fsra-section-button,
		.fsra-cta__button,
		.fsra-recruitment__button,
		.fsra-sponsor-us__button,
		.fsra-placeholder-button,
		.wp-block-button__link,
		.fsra-card,
		.fsra-news-card,
		.fsra-team-card,
		.fsra-alumni-card,
		.fsra-vehicle-card,
		.fsra-latest-news__card,
		.fsra-season-card,
		.fsra-sponsor-card,
		.fsra-partner-carousel__item,
		.fsra-featured-partner-card
	) {
		transition: none;
	}

	body:not(.wp-admin) main :is(
		.fsra-button,
		.fsra-section-button,
		.fsra-cta__button,
		.fsra-recruitment__button,
		.fsra-sponsor-us__button,
		.fsra-placeholder-button,
		.wp-block-button__link,
		.fsra-card,
		.fsra-news-card,
		.fsra-team-card,
		.fsra-alumni-card,
		.fsra-vehicle-card,
		.fsra-latest-news__card,
		.fsra-season-card,
		.fsra-sponsor-card
	):hover {
		transform: none;
	}
}

/* Shared direct-contact box. Fallback values cover pages without the recruitment palette. */
aside.fsra-direct-contact {
	position: relative;
	min-width: 0;
	overflow: hidden;
	padding: clamp(1.6rem, 2.6vw, 2.25rem);
	border: 1px solid var(--fsra-line, #dce3eb);
	border-radius: var(--fsra-radius-lg, 1.25rem);
	background:
		radial-gradient(120% 80% at 100% 0%, rgba(7, 38, 78, 0.06), transparent 62%),
		#fff;
	box-shadow: 0 1.25rem 3rem rgba(7, 26, 51, 0.08);
	color: var(--fsra-ink, #071a33);
}

/* Top accent. */
aside.fsra-direct-contact::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--fsra-red, #af0000), var(--fsra-blue, #07264e));
	content: "";
}

aside.fsra-direct-contact .fsra-direct-contact__title {
	margin: 0 0 0.6rem;
	color: var(--fsra-ink, #071a33);
	font-size: clamp(1.3rem, 1.9vw, 1.55rem);
	line-height: 1.2;
	letter-spacing: -0.01em;
}

aside.fsra-direct-contact .fsra-direct-contact__text {
	margin: 0;
	color: var(--fsra-muted, #526174);
	font-size: 0.95rem;
	line-height: 1.6;
}

aside.fsra-direct-contact .fsra-direct-contact__channels {
	display: grid;
	gap: 0.35rem;
	margin: 1.5rem 0 0;
	padding: 0;
	list-style: none;
}

aside.fsra-direct-contact .fsra-direct-contact__channel {
	position: relative;
	display: grid;
	grid-template-columns: 2.5rem minmax(0, 1fr);
	gap: 0.9rem;
	align-items: center;
	min-width: 0;
	padding: 0.7rem 0;
	border-top: 1px solid var(--fsra-line, #dce3eb);
}

aside.fsra-direct-contact .fsra-direct-contact__channel:first-child {
	border-top: 0;
	padding-top: 0;
}

aside.fsra-direct-contact .fsra-direct-contact__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 0.7rem;
	background: var(--fsra-soft, #f4f7fa);
	color: var(--fsra-blue, #07264e);
	transition: background-color 280ms ease, color 280ms ease;
}

aside.fsra-direct-contact .fsra-direct-contact__icon svg {
	display: block;
	width: 1.25rem;
	height: 1.25rem;
}

aside.fsra-direct-contact .fsra-direct-contact__body {
	display: grid;
	gap: 0.1rem;
	min-width: 0;
}

aside.fsra-direct-contact .fsra-direct-contact__label {
	color: var(--fsra-muted, #526174);
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.13em;
	line-height: 1.3;
	text-transform: uppercase;
}

aside.fsra-direct-contact .fsra-direct-contact__value {
	color: var(--fsra-ink, #071a33);
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

/* Make the full channel row clickable. */
aside.fsra-direct-contact a.fsra-direct-contact__value {
	text-decoration: none;
	text-underline-offset: 0.22em;
	transition: color 200ms ease;
}

aside.fsra-direct-contact a.fsra-direct-contact__value::after {
	position: absolute;
	inset: 0;
	content: "";
}

aside.fsra-direct-contact .fsra-direct-contact__channel:hover a.fsra-direct-contact__value,
aside.fsra-direct-contact a.fsra-direct-contact__value:focus-visible {
	color: var(--fsra-red, #af0000);
	text-decoration: underline;
}

aside.fsra-direct-contact .fsra-direct-contact__channel:hover .fsra-direct-contact__icon {
	background: rgba(175, 0, 0, 0.08);
	color: var(--fsra-red, #af0000);
}

aside.fsra-direct-contact .fsra-social-links ul {
	margin-top: 1.5rem;
	padding-top: 1.35rem;
	border-top: 1px solid var(--fsra-line, #dce3eb);
}

@media (prefers-reduced-motion: reduce) {
	aside.fsra-direct-contact .fsra-direct-contact__icon,
	aside.fsra-direct-contact a.fsra-direct-contact__value {
		transition: none;
	}
}

/* Shared hero for the Contact, Sponsor us, and Join pages. */
.fsra-landing-hero {
	--fsra-hero-ink: var(--fsra-page-text, #071a33);
	--fsra-hero-muted: #425166;
	padding-block: clamp(4.75rem, 7vw, 6.5rem) clamp(4rem, 7vw, 6rem);
	background: var(--fsra-page-bg, #e7ecf2);
	color: var(--fsra-hero-ink);
}

/* Match the shared page width and leave room for the accent. */
.fsra-landing-hero__inner {
	position: relative;
	width: var(--fsra-container-wide, min(82vw, 1440px));
	margin-inline: auto;
	padding-top: clamp(2.5rem, 4vw, 3.5rem);
}

/* Accent rail. */
.fsra-landing-hero__inner::before {
	position: absolute;
	inset: 0 auto auto 0;
	display: block;
	width: clamp(4.5rem, 8vw, 7rem);
	height: 0.3rem;
	background: linear-gradient(90deg, #af0000, #0aa7d9);
	content: "";
	pointer-events: none;
}

.fsra-landing-hero__eyebrow {
	margin: 0 0 clamp(0.85rem, 1.6vw, 1.25rem);
}

/* Hide the default eyebrow accent. */
.fsra-landing-hero__eyebrow::before {
	display: none;
}

.fsra-landing-hero__title {
	max-width: 16ch;
	margin: 0 0 clamp(1.25rem, 2.5vw, 2rem);
	color: var(--fsra-hero-ink);
	font-family: var(--wp--preset--font-family--rubik, inherit);
	font-size: clamp(2.9rem, 5.4vw, 5rem);
	font-weight: 700;
	line-height: 0.95;
	letter-spacing: -0.045em;
	text-align: left;
	text-wrap: balance;
}

.fsra-landing-hero__lead {
	max-width: 54ch;
	margin: 0;
	color: var(--fsra-hero-muted);
	font-size: clamp(1.05rem, 1.4vw, 1.28rem);
	line-height: 1.78;
	text-align: left;
	text-wrap: pretty;
}

@media (max-width: 767px) {
	.fsra-landing-hero__title {
		max-width: none;
		font-size: clamp(2.4rem, 11vw, 3.4rem);
	}
}

/* Landing-page form buttons. The declarations override Contact Form 7 styles. */
body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) :is(
	input[type="submit"],
	button[type="submit"]
) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3rem;
	margin-top: 0.5rem;
	padding: 0.9rem 2rem !important;
	border: 2px solid var(--fsra-red, #af0000) !important;
	border-radius: var(--fsra-radius-control, 0.5rem) !important;
	background: var(--fsra-red, #af0000) !important;
	box-shadow: 0 0.6rem 1.4rem rgba(175, 0, 0, 0.28);
	color: #fff !important;
	font-family: var(--fsra-font-primary);
	font-size: 0.82rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-transform: uppercase;
	cursor: pointer;
	transition:
		background-color 220ms ease,
		border-color 220ms ease,
		box-shadow 220ms ease,
		transform 220ms var(--fsra-ease-out, ease);
}

body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) :is(
	input[type="submit"],
	button[type="submit"]
):hover {
	transform: translateY(-2px);
	border-color: #fff !important;
	background: var(--fsra-red-deep, #8f0000) !important;
	box-shadow: 0 0.9rem 2rem rgba(0, 0, 0, 0.3);
}

body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) :is(
	input[type="submit"],
	button[type="submit"]
):focus-visible {
	outline: 3px solid #fff;
	outline-offset: 3px;
}

body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) :is(
	input[type="submit"],
	button[type="submit"]
):active {
	transform: translateY(0);
}

/* Contact Form 7 submit state. */
body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) form.submitting :is(
	input[type="submit"],
	button[type="submit"]
) {
	opacity: 0.75;
	cursor: progress;
}

/* Hide the empty Contact Form 7 response box. */
body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) .wpcf7-response-output[aria-hidden="true"] {
	display: none !important;
}

body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) .wpcf7-response-output {
	margin: 1.25rem 0 0 !important;
	padding: 0.85rem 1rem;
	border-radius: var(--fsra-radius-control, 0.5rem);
}

/* Remove the trailing form gap. */
body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) > :last-child,
body:not(.wp-admin) :is(main, #wp--skip-link--target) :is(.fsra-recruitment__form, .fsra-sponsor-us__form) form > p:last-child {
	margin-bottom: 0 !important;
}