/*
 * Faiha homepage — sections after the hero (fast homepage phase):
 * Trust strip, About, How It Works, Payments, FAQ, Contact, plus the
 * shared reveal states used by homepage.js.
 *
 * Content is ordinary block content on the Home page (see
 * src/migrations/2026-09-27-fast-homepage.php). Hero and Services keep
 * their own stylesheets (hero.css, services.css).
 *
 * Themed with the semantic Checkpoint B tokens: light in light mode,
 * a cohesive dark page in dark mode. Surfaces alternate so sections
 * separate without decoration:
 *
 *              light      dark
 *   surface    #FFFFFF    #04111A  (About, Payments, Contact)
 *   alt        #F6F8FA    #071824  (Trust→Services, How, FAQ)
 *   cards      white /    #091D2A on surface, #0C2433 on alt
 *              #F6F8FA
 *
 * Permanently dark: header, hero, location panel, footer.
 * No JavaScript is needed to read or use anything here; homepage.js only
 * adds a one-time reveal. The FAQ uses native <details>/<summary>.
 */

/* ---------------------------------------------------------------- */
/* Tokens for these sections                                         */
/* ---------------------------------------------------------------- */

.faiha-trust,
.faiha-about,
.faiha-how,
.faiha-authorities,
.faiha-payments,
.faiha-faq,
.faiha-contact {
	--fh-line: rgba(4, 17, 26, 0.1);
	--fh-line-strong: rgba(4, 17, 26, 0.16);
	--fh-card: var(--faiha-surface);          /* card on an alt section */
	--fh-card-alt: var(--faiha-surface-alt);  /* card/panel on a surface section */
	--fh-accent: var(--faiha-color-brand-strong); /* normal-size red text on light surfaces */
	--fh-accent-soft: rgba(217, 32, 50, 0.08);
	--fh-shadow: 0 1px 2px rgba(4, 17, 26, 0.04), 0 12px 32px rgba(4, 17, 26, 0.07);
	--fh-theme-transition:
		background-color var(--faiha-duration-theme) var(--faiha-ease-standard),
		border-color var(--faiha-duration-theme) var(--faiha-ease-standard),
		color var(--faiha-duration-theme) var(--faiha-ease-standard);
}

:root[data-theme="dark"] .faiha-trust,
:root[data-theme="dark"] .faiha-about,
:root[data-theme="dark"] .faiha-how,
:root[data-theme="dark"] .faiha-authorities,
:root[data-theme="dark"] .faiha-payments,
:root[data-theme="dark"] .faiha-faq,
:root[data-theme="dark"] .faiha-contact {
	--fh-line: rgba(255, 255, 255, 0.09);
	--fh-line-strong: rgba(255, 255, 255, 0.16);
	--fh-card: var(--faiha-navy-600);
	--fh-card-alt: var(--faiha-navy-700);
	/* Brand red lifted slightly so normal-size red text stays >= 4.5:1 on navy. */
	--fh-accent: color-mix(in srgb, var(--faiha-color-brand) 85%, #fff);
	--fh-accent-soft: rgba(242, 51, 67, 0.12);
	--fh-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
}

/* The page behind the sections follows the theme too (Kadence's site
   background is light), so overscroll/edges never flash white. */
:root[data-theme="dark"] body.home,
:root[data-theme="dark"] body.home #wrapper {
	background-color: var(--faiha-navy-900);
}

body.home,
body.home #wrapper {
	transition: background-color var(--faiha-duration-theme) var(--faiha-ease-standard);
}

/* ---------------------------------------------------------------- */
/* Section shell                                                     */
/* ---------------------------------------------------------------- */

.faiha-about.wp-block-group,
.faiha-how.wp-block-group,
.faiha-authorities.wp-block-group,
.faiha-payments.wp-block-group,
.faiha-faq.wp-block-group,
.faiha-contact.wp-block-group {
	margin-block: 0;
	padding: var(--faiha-space-section) var(--faiha-container-padding);
	background-color: var(--faiha-surface);
	color: var(--faiha-text);
	font-family: var(--faiha-font-primary);
	transition: var(--fh-theme-transition);
}

.faiha-how.wp-block-group,
.faiha-payments.wp-block-group,
.faiha-contact.wp-block-group {
	background-color: var(--faiha-surface-alt);
}

.faiha-about.wp-block-group > *,
.faiha-how.wp-block-group > *,
.faiha-authorities.wp-block-group > *,
.faiha-payments.wp-block-group > *,
.faiha-faq.wp-block-group > *,
.faiha-contact.wp-block-group > *,
.faiha-trust.wp-block-group > * {
	max-width: var(--faiha-container-max);
	margin-inline: auto;
}

.faiha-how.wp-block-group,
.faiha-authorities.wp-block-group,
.faiha-faq.wp-block-group {
	text-align: center;
}

/*
 * Shared intro elements. Section-scoped so they outrank Kadence content
 * typography (e.g. `.single-content p { margin: 0 0 2rem }`).
 */
:is(.faiha-trust, .faiha-about, .faiha-how, .faiha-authorities, .faiha-payments, .faiha-faq, .faiha-contact) .faiha-section__eyebrow {
	margin-block: 0 var(--faiha-space-xs);
	color: var(--fh-accent);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	line-height: 1.4;
}

:is(.faiha-trust, .faiha-about, .faiha-how, .faiha-authorities, .faiha-payments, .faiha-faq, .faiha-contact) .faiha-section__title.wp-block-heading {
	margin-block: 0;
	color: var(--faiha-text);
	font-family: var(--faiha-font-heading);
	font-size: var(--faiha-text-h2);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -0.015em;
	text-wrap: balance;
}

:is(.faiha-trust, .faiha-about, .faiha-how, .faiha-authorities, .faiha-payments, .faiha-faq, .faiha-contact) .faiha-section__text {
	max-width: 40rem;
	margin-block: var(--faiha-space-sm) 0;
	color: var(--faiha-text-secondary);
	font-size: clamp(1rem, calc(0.96rem + 0.2vw), 1.125rem);
	line-height: 1.6;
	text-wrap: pretty;
}

.faiha-how .faiha-section__text,
.faiha-authorities .faiha-section__text,
.faiha-payments .faiha-section__text,
.faiha-faq .faiha-section__text {
	margin-inline: auto;
}

/* Buttons */

:is(.faiha-trust, .faiha-about, .faiha-how, .faiha-authorities, .faiha-payments, .faiha-faq, .faiha-contact) .faiha-section__actions.wp-block-buttons {
	gap: var(--faiha-space-xs);
	margin-block: var(--faiha-space-lg) 0;
}

.faiha-how .faiha-section__actions,
.faiha-payments .faiha-section__actions,
.faiha-faq .faiha-section__actions {
	justify-content: center;
}

.faiha-btn-primary .wp-block-button__link,
.faiha-btn-secondary .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 3rem;
	padding: 0.75rem 1.5rem;
	border: 1px solid transparent;
	border-radius: var(--faiha-radius-button);
	font-family: var(--faiha-font-heading);
	font-size: 1rem;
	font-weight: var(--faiha-weight-button);
	line-height: 1.2;
	text-decoration: none;
	transition:
		background-color var(--faiha-duration-fast) var(--faiha-ease-standard),
		border-color var(--faiha-duration-fast) var(--faiha-ease-standard),
		color var(--faiha-duration-fast) var(--faiha-ease-standard),
		transform var(--faiha-duration-fast) var(--faiha-ease-standard);
}

.faiha-btn-primary .wp-block-button__link {
	background-color: var(--faiha-color-brand-strong);
	color: var(--faiha-text-on-dark);
}

.faiha-btn-primary .wp-block-button__link:hover {
	background-color: color-mix(in srgb, var(--faiha-color-brand-strong) 86%, #000);
	color: var(--faiha-text-on-dark);
	transform: translateY(-1px);
}

.faiha-btn-secondary .wp-block-button__link {
	background-color: transparent;
	border-color: color-mix(in srgb, var(--faiha-text) 30%, transparent);
	color: var(--faiha-text);
}

.faiha-btn-secondary .wp-block-button__link:hover {
	background-color: color-mix(in srgb, var(--faiha-text) 6%, transparent);
	border-color: color-mix(in srgb, var(--faiha-text) 55%, transparent);
	color: var(--faiha-text);
}

.faiha-btn-primary .wp-block-button__link:focus-visible,
.faiha-btn-secondary .wp-block-button__link:focus-visible {
	outline-width: 2px;
	outline-style: solid;
	outline-color: var(--faiha-text);
	outline-offset: 3px;
}

/* ---------------------------------------------------------------- */
/* Trust strip: a card straddling the hero's lower edge              */
/* ---------------------------------------------------------------- */

.faiha-trust.wp-block-group {
	margin-block: 0;
	padding: 0 var(--faiha-container-padding);
	background-color: var(--faiha-surface-alt);
	/* Top half continues the (permanently navy) hero, bottom half the
	   Services surface, so the card visibly bridges the two. */
	background-image:
		linear-gradient(
			to bottom,
			var(--faiha-navy-900) 0,
			var(--faiha-navy-900) 50%,
			var(--faiha-surface-alt) 50%,
			var(--faiha-surface-alt) 100%
		);
	font-family: var(--faiha-font-primary);
	transition: var(--fh-theme-transition);
}

.faiha-trust .faiha-trust__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 0 auto;
	padding: var(--faiha-space-md) var(--faiha-space-2xs);
	border: 1px solid var(--fh-line);
	border-radius: 1.25rem;
	background-color: var(--fh-card);
	box-shadow: 0 18px 44px rgba(4, 17, 26, 0.16);
	list-style: none;
	transition: var(--fh-theme-transition);
}

:root[data-theme="dark"] .faiha-trust .faiha-trust__list {
	background-color: var(--faiha-navy-700);
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.35);
}

.faiha-trust .faiha-trust__list li {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	margin: 0;
	padding: var(--faiha-space-2xs) var(--faiha-space-sm);
	color: var(--faiha-text);
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.35;
	text-align: center;
}

.faiha-trust .faiha-trust__list li + li {
	border-left: 1px solid var(--fh-line);
}

/* Small red marker (decorative). */
.faiha-trust .faiha-trust__list li::before {
	content: "";
	flex: none;
	width: 0.625rem;
	height: 0.625rem;
	border-radius: 50%;
	background-color: var(--faiha-color-brand);
	box-shadow: 0 0 0 4px var(--fh-accent-soft);
}

@media (max-width: 899px) {
	.faiha-trust .faiha-trust__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: var(--faiha-space-2xs);
	}

	.faiha-trust .faiha-trust__list li:nth-child(odd) {
		border-left: 0;
	}
}

@media (max-width: 599px) {
	.faiha-trust .faiha-trust__list {
		padding: var(--faiha-space-sm) var(--faiha-space-3xs);
	}

	.faiha-trust .faiha-trust__list li {
		justify-content: flex-start;
		gap: 0.625rem;
		padding-inline: var(--faiha-space-xs);
		font-size: 0.9375rem;
		text-align: left;
	}
}

/* ---------------------------------------------------------------- */
/* About                                                             */
/* ---------------------------------------------------------------- */

.faiha-about .faiha-about__columns {
	gap: var(--faiha-space-2xl);
	align-items: center;
	margin-block: 0;
}

/* Deliberate 40/60 split on desktop; core Columns still stacks below 782px. */
@media (min-width: 782px) {
	.faiha-about .faiha-about__columns > .faiha-about__lead {
		flex: 0 0 40%;
	}
}

/* Short red rule under the heading. */
.faiha-about .faiha-about__lead .faiha-section__title::after {
	content: "";
	display: block;
	width: 3.5rem;
	height: 3px;
	margin-top: var(--faiha-space-md);
	border-radius: 3px;
	background-color: var(--faiha-color-brand);
}

.faiha-about .faiha-about__body {
	padding: var(--faiha-space-xl);
	border: 1px solid var(--fh-line);
	border-radius: 1.25rem;
	background-color: var(--fh-card-alt);
	transition: var(--fh-theme-transition);
}

.faiha-about .faiha-about__body .faiha-section__text {
	max-width: none;
	margin-top: 0;
	color: var(--faiha-text);
	font-size: clamp(1.1875rem, calc(1.08rem + 0.45vw), 1.5rem);
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: -0.005em;
}

@media (max-width: 599px) {
	.faiha-about .faiha-about__columns {
		gap: var(--faiha-space-lg);
	}

	.faiha-about .faiha-about__body {
		padding: var(--faiha-space-lg);
	}
}

/* ---------------------------------------------------------------- */
/* How It Works: numbered sequence                                   */
/* ---------------------------------------------------------------- */

.faiha-how {
	--how-gap: var(--faiha-space-lg);
	--how-dot: 3.5rem;
}

.faiha-how .faiha-how__steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--how-gap);
	margin-block: var(--faiha-space-xl) 0;
	counter-reset: faiha-step;
	text-align: left;
}

/* Connector through the step numbers (desktop, decorative). */
.faiha-how .faiha-how__steps::before {
	content: "";
	position: absolute;
	top: calc(var(--faiha-space-md) + var(--how-dot) / 2);
	left: calc(var(--faiha-space-md) + var(--how-dot) / 2);
	right: calc((100% - 3 * var(--how-gap)) / 4 - var(--faiha-space-md) - var(--how-dot) / 2);
	height: 2px;
	background: linear-gradient(to right, var(--faiha-color-brand), var(--fh-line-strong));
	opacity: 0.6;
}

.faiha-how .faiha-how__step {
	position: relative;
	counter-increment: faiha-step;
	margin: 0;
	padding: var(--faiha-space-md);
	border: 1px solid var(--fh-line);
	border-radius: var(--faiha-radius-card);
	background-color: var(--fh-card);
	box-shadow: var(--fh-shadow);
	transition: var(--fh-theme-transition);
}

/* Step number: visual only (order is already the DOM/reading order). */
.faiha-how .faiha-how__step::before {
	content: counter(faiha-step, decimal-leading-zero);
	content: counter(faiha-step, decimal-leading-zero) / "";
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--how-dot);
	height: var(--how-dot);
	margin-bottom: var(--faiha-space-md);
	border-radius: 50%;
	background-color: var(--faiha-color-brand-strong);
	box-shadow: 0 0 0 6px var(--fh-card);
	color: var(--faiha-text-on-dark);
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.02em;
}

.faiha-how .faiha-how__title.wp-block-heading {
	margin: 0;
	color: var(--faiha-text);
	font-family: var(--faiha-font-heading);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.3;
}

.faiha-how .faiha-how__text {
	margin: var(--faiha-space-2xs) 0 0;
	color: var(--faiha-text-secondary);
	font-size: 0.9375rem;
	line-height: 1.6;
}

@media (max-width: 1023px) {
	.faiha-how .faiha-how__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.faiha-how .faiha-how__steps::before {
		display: none;
	}
}

@media (max-width: 599px) {
	.faiha-how .faiha-how__steps {
		grid-template-columns: 1fr;
		gap: var(--faiha-space-md);
	}

	.faiha-how {
		--how-dot: 3rem;
	}
}

/* ---------------------------------------------------------------- */
/* Payments: one premium horizontal panel                            */
/*   intro | Tabby + Tamara | qualifications + CTA                   */
/* ---------------------------------------------------------------- */

.faiha-payments .faiha-payments__panel {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.9fr) minmax(0, 1.1fr);
	align-items: stretch;
	margin: 0 auto;
	overflow: hidden;
	border: 1px solid var(--fh-line);
	border-radius: 1.5rem;
	background-color: var(--fh-card);
	box-shadow: var(--fh-shadow);
	text-align: left;
	transition: var(--fh-theme-transition);
}

/* Dark: a deep navy/black panel on the alt section. */
:root[data-theme="dark"] .faiha-payments .faiha-payments__panel {
	border-color: var(--fh-line-strong);
	background-color: var(--faiha-navy-900);
}

.faiha-payments .faiha-payments__intro,
.faiha-payments .faiha-payments__brands,
.faiha-payments .faiha-payments__notes {
	margin: 0;
	padding: var(--faiha-space-xl);
}

.faiha-payments .faiha-payments__intro {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.faiha-payments .faiha-payments__intro .faiha-section__title.wp-block-heading {
	font-size: clamp(1.75rem, calc(1.35rem + 1.2vw), 2.375rem);
}

.faiha-payments .faiha-payments__intro .faiha-section__text {
	margin-inline: 0;
}

.faiha-payments .faiha-payments__brands {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--faiha-space-sm);
	border-inline: 1px solid var(--fh-line);
	background-color: var(--fh-card-alt);
	transition: var(--fh-theme-transition);
}

:root[data-theme="dark"] .faiha-payments .faiha-payments__brands {
	background-color: var(--faiha-navy-800);
}

/* Official brand tiles keep their own backgrounds, so they read in both themes. */
/* Scoped past Kadence .single-content figure.wp-block-image (margin-bottom: 2rem). */
.faiha-payments .faiha-payments__brands .faiha-payments__brand {
	width: min(100%, 11rem);
	margin: 0;
}

.faiha-payments .faiha-payments__brand img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 0.75rem;
	box-shadow: 0 6px 16px rgba(4, 17, 26, 0.12);
}

.faiha-payments .faiha-payments__notes {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.faiha-payments .faiha-payments__text {
	margin: 0 0 var(--faiha-space-sm);
	color: var(--faiha-text);
	font-size: 1rem;
	line-height: 1.6;
}

.faiha-payments .faiha-payments__text-muted {
	color: var(--faiha-text-secondary);
	font-size: 0.9375rem;
}

.faiha-payments .faiha-payments__notes .faiha-section__actions.wp-block-buttons {
	justify-content: flex-start;
	margin-top: var(--faiha-space-2xs);
}

@media (max-width: 1023px) {
	.faiha-payments .faiha-payments__panel {
		grid-template-columns: 1fr;
	}

	.faiha-payments .faiha-payments__brands {
		flex-direction: row;
		border-inline: 0;
		border-block: 1px solid var(--fh-line);
	}
}

@media (max-width: 599px) {
	.faiha-payments .faiha-payments__intro,
	.faiha-payments .faiha-payments__brands,
	.faiha-payments .faiha-payments__notes {
		padding: var(--faiha-space-lg);
	}

	.faiha-payments .faiha-payments__brands .faiha-payments__brand {
		width: calc(50% - var(--faiha-space-sm) / 2);
	}
}

/* ---------------------------------------------------------------- */
/* FAQ (native details/summary)                                      */
/* ---------------------------------------------------------------- */

.faiha-faq .faiha-faq__list {
	max-width: 52rem;
	margin-block: var(--faiha-space-xl) 0;
	padding: var(--faiha-space-2xs) var(--faiha-space-xl);
	border: 1px solid var(--fh-line);
	border-radius: 1.25rem;
	background-color: var(--fh-card-alt);
	box-shadow: var(--fh-shadow);
	text-align: left;
	transition: var(--fh-theme-transition);
}

.faiha-faq .faiha-faq__item {
	margin: 0;
	border-bottom: 1px solid var(--fh-line);
}

.faiha-faq .faiha-faq__item:last-child {
	border-bottom: 0;
}

.faiha-faq .faiha-faq__item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--faiha-space-md);
	min-height: 2.75rem;
	padding-block: var(--faiha-space-md);
	color: var(--faiha-text);
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.4;
	list-style: none;
	cursor: pointer;
	transition: color var(--faiha-duration-fast) var(--faiha-ease-standard);
}

.faiha-faq .faiha-faq__item summary::-webkit-details-marker {
	display: none;
}

/* Plus / minus indicator (decorative; the open state is native). */
.faiha-faq .faiha-faq__item summary::after {
	content: "+";
	content: "+" / "";
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	border: 1px solid var(--fh-line-strong);
	border-radius: 50%;
	color: var(--fh-accent);
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1;
	transition:
		background-color var(--faiha-duration-fast) var(--faiha-ease-standard),
		border-color var(--faiha-duration-fast) var(--faiha-ease-standard),
		color var(--faiha-duration-fast) var(--faiha-ease-standard);
}

.faiha-faq .faiha-faq__item[open] summary {
	color: var(--fh-accent);
}

.faiha-faq .faiha-faq__item[open] summary::after {
	content: "\2212";
	content: "\2212" / "";
	border-color: var(--faiha-color-brand-strong);
	background-color: var(--faiha-color-brand-strong);
	color: var(--faiha-text-on-dark);
}

.faiha-faq .faiha-faq__item summary:hover {
	color: var(--fh-accent);
}

.faiha-faq .faiha-faq__item summary:focus-visible {
	outline-width: 2px;
	outline-style: solid;
	outline-color: var(--fh-accent);
	outline-offset: 4px;
	border-radius: 4px;
}

.faiha-faq .faiha-faq__item p {
	max-width: 44rem;
	margin: 0;
	padding: 0 0 var(--faiha-space-md);
	color: var(--faiha-text-secondary);
	font-size: 1rem;
	line-height: 1.65;
}

@media (max-width: 599px) {
	.faiha-faq .faiha-faq__list {
		padding-inline: var(--faiha-space-md);
	}

	.faiha-faq .faiha-faq__item summary {
		font-size: 1.0625rem;
	}
}

/* ---------------------------------------------------------------- */
/* Authorities & service platforms: logo marquee                     */
/* ---------------------------------------------------------------- */

.faiha-authorities {
	--auth-logo: 11rem;
	--auth-gap: var(--faiha-space-xl);
}

.faiha-authorities .faiha-authorities__marquee {
	position: relative;
	margin-block: var(--faiha-space-xl) 0;
	overflow: hidden;
}

/*
 * Default (no JavaScript, or reduced motion): a clean static, responsive
 * logo grid. homepage.js upgrades it to the moving marquee.
 */
.faiha-authorities .faiha-authorities__track {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--faiha-space-md) var(--faiha-space-lg);
	margin: 0;
}

.faiha-authorities .faiha-authorities__track .faiha-authorities__logo {
	flex: 0 0 auto;
	width: var(--auth-logo);
	margin: 0;
}

.faiha-authorities .faiha-authorities__logo img {
	display: block;
	width: 100%;
	height: auto;
	/* The source files are 900x600 with wide white margins: a slightly
	   wider crop shows the marks larger without distorting them. */
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition:
		filter var(--faiha-duration-theme) var(--faiha-ease-standard),
		opacity var(--faiha-duration-theme) var(--faiha-ease-standard);
}

/*
 * Dark mode: turn the full-colour logos light-grey/monochrome with CSS only.
 * grayscale + invert makes the white tile black and the marks light;
 * screen blending then drops the black into the navy section.
 */
:root[data-theme="dark"] .faiha-authorities .faiha-authorities__logo img {
	/* Pure black tile (blends away) + light-grey marks; no contrast/brightness
	   tweak, which would lift the black and leave a visible box. */
	filter: grayscale(1) invert(1);
	opacity: 0.78;
}

/*
 * The logo files have opaque white backgrounds (inverted to black above).
 * Blend the whole strip, not each image: the animated track and the edge
 * mask create their own compositing layers, so only the strip itself sits
 * directly on the section background. Light: multiply keeps white tiles
 * invisible on white; dark: screen drops the black tiles into the navy.
 */
.faiha-authorities .faiha-authorities__marquee {
	mix-blend-mode: multiply;
}

:root[data-theme="dark"] .faiha-authorities .faiha-authorities__marquee {
	mix-blend-mode: screen;
}

/* Moving marquee (added by homepage.js when motion is allowed). */
.faiha-authorities .faiha-authorities__marquee.is-animated {
	display: flex;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}

.faiha-authorities .faiha-authorities__marquee.is-animated .faiha-authorities__track {
	flex: none;
	flex-wrap: nowrap;
	gap: var(--auth-gap);
	padding-right: var(--auth-gap);
	animation: faiha-marquee 30s linear infinite;
}

/* Pause on hover or keyboard focus. */
.faiha-authorities .faiha-authorities__marquee.is-animated:hover .faiha-authorities__track,
.faiha-authorities .faiha-authorities__marquee.is-animated:focus-within .faiha-authorities__track {
	animation-play-state: paused;
}

@keyframes faiha-marquee {
	to {
		transform: translateX(-100%);
	}
}

.faiha-authorities .faiha-authorities__note {
	max-width: 44rem;
	margin: var(--faiha-space-xl) auto 0;
	color: var(--faiha-text-secondary);
	font-size: 0.8125rem;
	line-height: 1.6;
}

@media (max-width: 599px) {
	.faiha-authorities {
		--auth-logo: 8.5rem;
		--auth-gap: var(--faiha-space-lg);
	}
}

/* ---------------------------------------------------------------- */
/* Contact: icon rows (left) + Google Map (right)                    */
/* ---------------------------------------------------------------- */

.faiha-contact .faiha-contact__columns {
	gap: var(--faiha-space-2xl);
	align-items: stretch;
	margin-block: 0;
}

@media (min-width: 782px) {
	.faiha-contact .faiha-contact__columns > .faiha-contact__info {
		flex: 0 0 48%;
	}
}

.faiha-contact .faiha-contact__items {
	display: grid;
	gap: 0;
	margin: var(--faiha-space-lg) 0 0;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--fh-line);
	border-radius: 1rem;
	background-color: var(--fh-card);
	list-style: none;
	transition: var(--fh-theme-transition);
}

.faiha-contact .faiha-contact__item {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 0;
	padding: 0.75rem var(--faiha-space-md) 0.75rem 4rem;
}

.faiha-contact .faiha-contact__item + .faiha-contact__item {
	border-top: 1px solid var(--fh-line);
}

/* Icon: soft red circle + masked inline-SVG glyph (decorative; each row has a visible label). */
.faiha-contact .faiha-contact__item::before,
.faiha-contact .faiha-contact__item::after {
	content: "";
	position: absolute;
	top: 50%;
}

.faiha-contact .faiha-contact__item::before {
	left: var(--faiha-space-md);
	width: 2.25rem;
	height: 2.25rem;
	margin-top: -1.125rem;
	border-radius: 50%;
	background-color: var(--fh-accent-soft);
}

.faiha-contact .faiha-contact__item::after {
	left: calc(var(--faiha-space-md) + 0.5625rem);
	width: 1.125rem;
	height: 1.125rem;
	margin-top: -0.5625rem;
	background-color: var(--fh-accent);
	-webkit-mask: var(--faiha-icon) center / contain no-repeat;
	mask: var(--faiha-icon) center / contain no-repeat;
}

.faiha-contact .faiha-contact__item strong {
	display: block;
	margin-bottom: 0.125rem;
	color: var(--faiha-text-secondary);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Links inherit text colour; underline + accent on interaction. */
.faiha-contact .faiha-contact__item a,
.faiha-faq .faiha-faq__item a {
	color: var(--faiha-text);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: color-mix(in srgb, var(--fh-accent) 55%, transparent);
	text-underline-offset: 0.2em;
}

.faiha-contact .faiha-contact__item a {
	font-size: 1rem;
	line-height: 1.45;
	text-decoration: none;
	overflow-wrap: anywhere;
}

.faiha-contact .faiha-contact__item.faiha-icon-pin a {
	font-size: 0.9375rem;
	font-weight: 500;
}

.faiha-contact .faiha-contact__item a:hover,
.faiha-faq .faiha-faq__item a:hover {
	color: var(--fh-accent);
	text-decoration: underline;
}

.faiha-contact .faiha-contact__item a:focus-visible,
.faiha-faq .faiha-faq__item a:focus-visible {
	outline-width: 2px;
	outline-style: solid;
	outline-color: var(--fh-accent);
	outline-offset: 2px;
}

/* Google Map fills the right column. */
.faiha-contact .faiha-contact__location {
	display: flex;
}

.faiha-contact .faiha-contact__map {
	position: relative;
	flex: 1;
	min-height: 24rem;
	overflow: hidden;
	border: 1px solid var(--fh-line);
	border-radius: 1.25rem;
	/* Permanently dark chrome behind the map while it loads. */
	background-color: var(--faiha-navy-900);
	box-shadow: var(--fh-shadow);
}

/* Keyboard focus on the embedded map (the iframe itself shows no ring). */
.faiha-contact .faiha-contact__map:focus-within,
.faiha-contact .faiha-contact__map.has-focus {
	outline-width: 2px;
	outline-style: solid;
	outline-color: var(--fh-accent);
	outline-offset: 3px;
}

.faiha-contact .faiha-contact__map iframe {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

@media (max-width: 781px) {
	.faiha-contact .faiha-contact__map {
		flex: none;
		width: 100%;
		height: 20rem; /* ~320px: not an excessively tall map on small screens */
		min-height: 0;
	}
}

@media (max-width: 599px) {
	.faiha-contact .faiha-contact__item {
		padding-left: 3.5rem;
	}

	.faiha-contact .faiha-contact__item::before {
		left: var(--faiha-space-sm);
	}

	.faiha-contact .faiha-contact__item::after {
		left: calc(var(--faiha-space-sm) + 0.5625rem);
	}


	:is(.faiha-trust, .faiha-about, .faiha-how, .faiha-authorities, .faiha-payments, .faiha-faq, .faiha-contact) .faiha-section__actions.wp-block-buttons {
		flex-direction: column;
		align-items: stretch;
	}

	:is(.faiha-trust, .faiha-about, .faiha-how, .faiha-authorities, .faiha-payments, .faiha-faq, .faiha-contact) .faiha-section__actions .wp-block-button,
	:is(.faiha-trust, .faiha-about, .faiha-how, .faiha-authorities, .faiha-payments, .faiha-faq, .faiha-contact) .faiha-section__actions .wp-block-button__link {
		width: 100%;
	}
}

/* ---------------------------------------------------------------- */
/* Homepage visual system (polish pass): the design reference for    */
/* the inner pages. Scoped to :is(body.home, body.faiha-service-page) so the service pages, which  */
/* reuse the FAQ / Contact / card components, are unchanged until    */
/* they are brought onto this system.                                 */
/*                                                                    */
/*   - small red accent line on every eyebrow                        */
/*   - alternating composition: Services and FAQ with a left-aligned  */
/*     intro, How It Works as intro | 2x2 steps; Authorities stays    */
/*     centred                                                        */
/*   - one card language: 16px radius, hairline border, restrained    */
/*     shadow in light mode, navy surface steps in dark mode          */
/*   - one button system: primary (Faiha red) + secondary (outline)   */
/* ---------------------------------------------------------------- */

/* Eyebrow: red accent line before the label (decorative). */
:is(body.home, body.faiha-service-page) :is(.faiha-section__eyebrow, .faiha-services__eyebrow)::before {
	content: "";
	display: inline-block;
	width: 1.5rem;
	height: 2px;
	margin-right: 0.625rem;
	border-radius: 2px;
	background-color: currentColor;
	vertical-align: middle;
	transform: translateY(-1px);
}

:is(body.home, body.faiha-service-page) :is(.faiha-section__eyebrow, .faiha-services__eyebrow) {
	font-family: var(--faiha-font-heading);
	letter-spacing: 0.14em;
}

:is(body.home, body.faiha-service-page) :is(.faiha-section__title, .faiha-services__title).wp-block-heading {
	font-weight: var(--faiha-weight-heading);
	letter-spacing: var(--faiha-tracking-heading);
}

/*
 * Two-column section frame: the section keeps its full-bleed background;
 * its content area is exactly the container width, split into columns.
 */
@media (min-width: 1024px) {
	:is(body.home, body.faiha-service-page) :is(.faiha-services, .faiha-how, .faiha-faq).wp-block-group {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: var(--faiha-space-2xl);
		align-content: start;
		padding-inline: max(var(--faiha-container-padding), calc((100% - var(--faiha-container-max)) / 2));
		text-align: left;
	}

	/*
	 * WordPress core's constrained layout gives every child
	 * `margin-left/right: auto !important`; inside a grid that centres the
	 * item and shrinks it to its content. Only an !important override can
	 * reset it, scoped to these two-column homepage sections.
	 */
	:is(body.home, body.faiha-service-page) :is(.faiha-services, .faiha-how, .faiha-faq).wp-block-group > * {
		max-width: none;
		margin-left: 0 !important;
		margin-right: 0 !important;
		text-align: left;
	}

	/* Services: eyebrow + title left, intro text right, cards full width. */
	:is(body.home, body.faiha-service-page) .faiha-services > .faiha-services__eyebrow {
		grid-column: 1;
		grid-row: 1;
	}

	:is(body.home, body.faiha-service-page) .faiha-services > .faiha-services__title {
		grid-column: 1;
		grid-row: 2;
	}

	:is(body.home, body.faiha-service-page) .faiha-services > .faiha-services__text {
		grid-column: 2;
		grid-row: 1 / 3;
		align-self: end;
		justify-self: end;
		max-width: 32rem;
		margin: 0;
	}

	:is(body.home, body.faiha-service-page) .faiha-services > :is(.faiha-services__grid, .faiha-services__actions) {
		grid-column: 1 / -1;
	}

	:is(body.home, body.faiha-service-page) .faiha-services > .faiha-services__grid {
		justify-content: flex-start;
	}

	/* How It Works: intro left, the four steps as a 2x2 grid right. */
	/*
	 * Narrower intro column, vertically centred against the 2x2 steps
	 * (spacer rows above and below), so the left side no longer reads as
	 * an empty column under a top-aligned heading.
	 */
	:is(body.home, body.faiha-service-page) .faiha-how.wp-block-group {
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		grid-template-rows: 1fr auto auto 1fr;
		column-gap: var(--faiha-space-2xl);
	}

	:is(body.home, body.faiha-service-page) .faiha-how > .faiha-section__eyebrow {
		grid-column: 1;
		grid-row: 2;
	}

	:is(body.home, body.faiha-service-page) .faiha-how > .faiha-section__title {
		grid-column: 1;
		grid-row: 3;
		max-width: 22rem;
	}

	:is(body.home, body.faiha-service-page) .faiha-how > :not(.faiha-section__eyebrow, .faiha-section__title) {
		grid-column: 2;
		grid-row: 1 / -1;
	}

	:is(body.home, body.faiha-service-page) .faiha-how .faiha-how__steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin-block: 0;
	}

	:is(body.home, body.faiha-service-page) .faiha-how .faiha-how__steps::before {
		display: none; /* the connector only suits a single row */
	}

	/* FAQ: intro left, questions right; narrower intro so the two blocks sit together. */
	:is(body.home, body.faiha-service-page) .faiha-faq.wp-block-group {
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
		column-gap: var(--faiha-space-2xl);
	}

	:is(body.home, body.faiha-service-page) .faiha-faq > .faiha-section__eyebrow {
		grid-column: 1;
		grid-row: 1;
	}

	:is(body.home, body.faiha-service-page) .faiha-faq > .faiha-section__title {
		grid-column: 1;
		grid-row: 2;
		max-width: 22rem;
	}

	:is(body.home, body.faiha-service-page) .faiha-faq > .faiha-faq__list {
		grid-column: 2;
		grid-row: 1 / span 4;
		max-width: none;
		margin-block: 0;
	}
}

/* ---------------------------------------------------------------- */
/* Cards                                                             */
/* ---------------------------------------------------------------- */

:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card {
	border-color: var(--svc-border);
	border-radius: var(--faiha-radius-card);
	box-shadow: var(--faiha-shadow-card);
}

:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--faiha-shadow-card-hover);
}

:root[data-theme="dark"] :is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card,
:root[data-theme="dark"] :is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card:hover {
	box-shadow: none;
}

:root[data-theme="dark"] :is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card:hover {
	background-color: color-mix(in srgb, var(--faiha-navy-600) 80%, #fff 4%);
}

/* 48px icon container with a 12px radius. */
@supports selector(:has(a)) {
	:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card__title {
		padding-top: 4rem;
	}

	:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card__title::before {
		width: 3rem;
		height: 3rem;
		border-radius: 0.75rem;
	}

	:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card__title::after {
		top: calc(1.75rem + 0.8125rem);
		left: calc(var(--faiha-space-md) + 0.8125rem);
	}
}

:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card__title {
	font-size: 1.1875rem;
	letter-spacing: -0.01em;
}

:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card__text {
	margin-top: var(--faiha-space-2xs);
	line-height: 1.6;
}

/* How It Works steps: lighter weight than the service cards. */
:is(body.home, body.faiha-service-page) .faiha-how .faiha-how__step {
	padding: var(--faiha-space-lg);
	border-radius: var(--faiha-radius-card);
	box-shadow: none;
}

:root:not([data-theme="dark"]) :is(body.home, body.faiha-service-page) .faiha-how .faiha-how__step {
	box-shadow: var(--faiha-shadow-card);
}

:is(body.home, body.faiha-service-page) .faiha-how {
	--how-dot: 3rem;
}

:is(body.home, body.faiha-service-page) .faiha-how .faiha-how__step::before {
	border-radius: 0.75rem; /* matches the icon containers */
	box-shadow: none;
	font-family: var(--faiha-font-heading);
	font-size: 1rem;
}

:is(body.home, body.faiha-service-page) .faiha-how .faiha-how__title.wp-block-heading {
	font-size: 1.1875rem;
}

:is(body.home, body.faiha-service-page) .faiha-how .faiha-how__text {
	line-height: 1.65;
}

/* Trust strip: the floating panel follows the card system. */
:is(body.home, body.faiha-service-page) .faiha-trust .faiha-trust__list {
	border-radius: 1.125rem;
	box-shadow: var(--faiha-shadow-float);
}

:is(body.home, body.faiha-service-page) .faiha-trust .faiha-trust__list li {
	font-family: var(--faiha-font-heading);
	font-weight: 700;
}

/* FAQ list, payments panel, contact items: one radius and shadow. */
:is(body.home, body.faiha-service-page) :is(.faiha-faq .faiha-faq__list, .faiha-payments .faiha-payments__panel, .faiha-contact .faiha-contact__items) {
	border-radius: 1.125rem;
	box-shadow: var(--faiha-shadow-card);
}

:root[data-theme="dark"] :is(body.home, body.faiha-service-page) :is(.faiha-faq .faiha-faq__list, .faiha-payments .faiha-payments__panel, .faiha-contact .faiha-contact__items, .faiha-trust .faiha-trust__list) {
	box-shadow: none;
}

:is(body.home, body.faiha-service-page) .faiha-faq .faiha-faq__item summary {
	font-family: var(--faiha-font-heading);
	font-size: 1.0625rem;
	font-weight: 700;
}

:is(body.home, body.faiha-service-page) .faiha-faq .faiha-faq__item p {
	line-height: 1.7;
}

/* ---------------------------------------------------------------- */
/* Buttons: primary (Faiha red) and secondary (outline)              */
/* ---------------------------------------------------------------- */

:is(body.home, body.faiha-service-page) :is(.faiha-btn-primary, .faiha-hero__cta--primary, .faiha-services__cta) .wp-block-button__link {
	border-radius: var(--faiha-radius-button);
	background-color: var(--faiha-color-brand-strong);
	color: var(--faiha-text-on-dark);
	font-family: var(--faiha-font-heading);
	font-weight: var(--faiha-weight-button);
	box-shadow: 0 6px 16px color-mix(in srgb, var(--faiha-color-brand-strong) 22%, transparent);
	transform: none;
}

:is(body.home, body.faiha-service-page) :is(.faiha-btn-primary, .faiha-hero__cta--primary, .faiha-services__cta) .wp-block-button__link:hover {
	background-color: color-mix(in srgb, var(--faiha-color-brand-strong) 86%, #000);
	color: var(--faiha-text-on-dark);
	box-shadow: 0 8px 20px color-mix(in srgb, var(--faiha-color-brand-strong) 30%, transparent);
	transform: none;
}

:is(body.home, body.faiha-service-page) .faiha-btn-secondary .wp-block-button__link {
	border-radius: var(--faiha-radius-button);
	border-color: color-mix(in srgb, var(--faiha-text) 22%, transparent);
	font-family: var(--faiha-font-heading);
	font-weight: var(--faiha-weight-button);
}

/* Hero secondary on the permanently dark hero: the same outline style, light text. */
:is(body.home, body.faiha-service-page) .faiha-hero__cta--whatsapp .wp-block-button__link {
	border-radius: var(--faiha-radius-button);
	font-family: var(--faiha-font-heading);
	font-weight: var(--faiha-weight-button);
}

@media (prefers-reduced-motion: reduce) {
	:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card:hover {
		transform: none;
	}
}

/* ---------------------------------------------------------------- */
/* Homepage final polish (review round 2). Small refinements on the  */
/* approved baseline; content unchanged. Scoped to :is(body.home, body.faiha-service-page).        */
/* ---------------------------------------------------------------- */

/* Readability: secondary text a step stronger on the homepage (not larger). */
:is(body.home, body.faiha-service-page) {
	--faiha-text-secondary: #4D5869; /* was #667085; ~7:1 on white */
}

:root[data-theme="dark"] :is(body.home, body.faiha-service-page) {
	--faiha-text-secondary: rgba(255, 255, 255, 0.8); /* was 0.72 */
}

:is(body.home, body.faiha-service-page) :is(.faiha-trust, .faiha-about, .faiha-how, .faiha-authorities, .faiha-payments, .faiha-faq, .faiha-contact) .faiha-section__text {
	line-height: 1.7;
}

/* Hero: eyebrow and supporting copy more legible; headline unchanged. */
:is(body.home, body.faiha-service-page) .faiha-hero .faiha-hero__eyebrow {
	border-color: rgba(255, 255, 255, 0.22);
	color: rgba(255, 255, 255, 0.88);
	font-size: 0.875rem;
	letter-spacing: 0.1em;
}

:is(body.home, body.faiha-service-page) .faiha-hero .faiha-hero__text {
	max-width: 42rem;
	color: rgba(255, 255, 255, 0.86);
	font-size: clamp(1.0625rem, calc(0.98rem + 0.3vw), 1.25rem);
	line-height: 1.65;
}

/* Hero secondary action: clearer outline + faint fill, still secondary to the red button. */
:is(body.home, body.faiha-service-page) .faiha-hero .faiha-hero__cta--whatsapp .wp-block-button__link {
	border-width: 1.5px;
	border-color: rgba(255, 255, 255, 0.55);
	background-color: rgba(255, 255, 255, 0.08);
	color: var(--faiha-text-on-dark);
}

:is(body.home, body.faiha-service-page) .faiha-hero .faiha-hero__cta--whatsapp .wp-block-button__link:hover {
	border-color: rgba(255, 255, 255, 0.85);
	background-color: rgba(255, 255, 255, 0.14);
}

@media (max-width: 600px) {
	:is(body.home, body.faiha-service-page) .faiha-hero .faiha-hero__eyebrow {
		font-size: 0.75rem;
	}
}

/* Services: card descriptions and "View service" a little stronger; card height unchanged. */
:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card__text {
	color: var(--faiha-text-secondary);
	font-size: 0.96875rem; /* 15.5px */
	line-height: 1.55;
}

:is(body.home, body.faiha-service-page) .faiha-services .faiha-service-card::after {
	font-family: var(--faiha-font-heading);
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.005em;
}

/* About: one composed panel — heading side and text side share a frame with a divider. */
@media (min-width: 782px) {
	:is(body.home, body.faiha-service-page) .faiha-about .faiha-about__columns {
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: 0;
		align-items: stretch;
		overflow: hidden;
		border: 1px solid var(--fh-line);
		border-radius: 1.5rem;
		background-color: var(--fh-card-alt);
		box-shadow: var(--faiha-shadow-card);
	}

	:is(body.home, body.faiha-service-page) .faiha-about .faiha-about__columns > .wp-block-column {
		flex-basis: auto;
		width: auto;
		margin: 0;
	}

	:is(body.home, body.faiha-service-page) .faiha-about .faiha-about__lead {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: var(--faiha-space-2xl) var(--faiha-space-xl);
		border-left: 4px solid var(--faiha-color-brand);
	}

	:is(body.home, body.faiha-service-page) .faiha-about .faiha-about__body {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: var(--faiha-space-2xl) var(--faiha-space-xl);
		border: 0;
		border-left: 1px solid var(--fh-line);
		border-radius: 0;
		background-color: transparent;
	}

	:root[data-theme="dark"] :is(body.home, body.faiha-service-page) .faiha-about .faiha-about__columns {
		background-color: var(--faiha-navy-700);
		box-shadow: none;
	}
}

/* How It Works: lighter intro spacing next to the centred column. */
:is(body.home, body.faiha-service-page) .faiha-how > .faiha-section__title {
	margin-bottom: 0;
}

/* Authorities: larger, clearer logos; less dead space around the strip. */
:is(body.home, body.faiha-service-page) .faiha-authorities.wp-block-group {
	padding-block: calc(var(--faiha-space-section) * 0.8);
}

:is(body.home, body.faiha-service-page) .faiha-authorities {
	--auth-logo: 13rem;
}

:is(body.home, body.faiha-service-page) .faiha-authorities .faiha-authorities__marquee {
	margin-block-start: var(--faiha-space-lg);
}

:is(body.home, body.faiha-service-page) .faiha-authorities .faiha-authorities__note {
	margin-top: var(--faiha-space-lg);
	font-size: 0.875rem;
}

:root[data-theme="dark"] :is(body.home, body.faiha-service-page) .faiha-authorities .faiha-authorities__logo img {
	opacity: 0.92;
}

@media (max-width: 599px) {
	:is(body.home, body.faiha-service-page) .faiha-authorities {
		--auth-logo: 9.5rem;
	}
}

/* Payments: more readable intro and eligibility note; Tabby/Tamara stay central. */
:is(body.home, body.faiha-service-page) .faiha-payments .faiha-payments__intro .faiha-section__text {
	font-size: 1.0625rem;
	line-height: 1.7;
}

:is(body.home, body.faiha-service-page) .faiha-payments .faiha-payments__text {
	font-size: 1.0625rem;
	line-height: 1.7;
}

:is(body.home, body.faiha-service-page) .faiha-payments .faiha-payments__text-muted {
	font-size: 1rem;
}

:is(body.home, body.faiha-service-page) .faiha-payments :is(.faiha-payments__intro, .faiha-payments__notes) {
	padding: var(--faiha-space-2xl) var(--faiha-space-xl);
}

@media (max-width: 599px) {
	:is(body.home, body.faiha-service-page) .faiha-payments :is(.faiha-payments__intro, .faiha-payments__notes) {
		padding: var(--faiha-space-lg);
	}
}

/* FAQ: heading block aligned with the first question row. */
@media (min-width: 1024px) {
	:is(body.home, body.faiha-service-page) .faiha-faq > .faiha-section__eyebrow {
		margin-top: var(--faiha-space-md);
	}
}

/* ---------------------------------------------------------------- */
/* Reveal (added by homepage.js only to elements below the fold;     */
/* nothing is ever hidden without JavaScript)                        */
/* ---------------------------------------------------------------- */

.fh-reveal {
	opacity: 0;
	transform: translateY(1.25rem);
}

.fh-reveal.fh-revealing {
	opacity: 1;
	transform: none;
	transition:
		opacity 600ms var(--faiha-ease-standard),
		transform 600ms var(--faiha-ease-standard);
}

@media (prefers-reduced-motion: reduce) {
	body.home,
	.faiha-trust.wp-block-group,
	.faiha-trust .faiha-trust__list,
	.faiha-about.wp-block-group,
	.faiha-about .faiha-about__body,
	.faiha-how.wp-block-group,
	.faiha-how .faiha-how__step,
	.faiha-payments.wp-block-group,
	.faiha-payments .faiha-payments__panel,
	.faiha-faq.wp-block-group,
	.faiha-faq .faiha-faq__list,
	.faiha-faq .faiha-faq__item summary,
	.faiha-faq .faiha-faq__item summary::after,
	.faiha-contact.wp-block-group,
	.faiha-contact .faiha-contact__item,
	.faiha-authorities .faiha-authorities__logo img,
	.faiha-payments .faiha-payments__brands,
	.faiha-contact .faiha-contact__items,
	.faiha-btn-primary .wp-block-button__link,
	.faiha-btn-secondary .wp-block-button__link {
		transition: none;
	}

	.faiha-btn-primary .wp-block-button__link:hover {
		transform: none;
	}

	.fh-reveal {
		opacity: 1;
		transform: none;
	}

	/* Never a moving marquee: static grid, duplicate track hidden. */
	.faiha-authorities .faiha-authorities__marquee.is-animated {
		display: block;
		-webkit-mask-image: none;
		mask-image: none;
	}

	.faiha-authorities .faiha-authorities__marquee.is-animated .faiha-authorities__track {
		flex-wrap: wrap;
		justify-content: center;
		padding-right: 0;
		animation: none;
	}

	.faiha-authorities .faiha-authorities__track[aria-hidden="true"] {
		display: none;
	}
}