:root {
	--fwf--reveal--distance: 14px;
	--fwf--reveal--duration: 560ms;
	--fwf--reveal--ease: cubic-bezier(0.22, 0.61, 0.36, 1);

	/*
	 * Micro-interaction timings.
	 *
	 * Three speeds, deliberately few. A response to a pointer has to land
	 * inside ~200ms to feel like cause and effect rather than an animation, so
	 * these are far shorter than the reveal durations above. `--tap` is
	 * quicker still: a button that takes 200ms to look pressed feels broken.
	 */
	--fwf--tap: 90ms;
	--fwf--quick: 160ms;
	--fwf--settle: 260ms;
	--fwf--ease-out: cubic-bezier(0.33, 1, 0.68, 1);
}

/* Reveal ------------------------------------------------------------------ */
.fwf-motion .fwf-reveal {
	opacity: 0;
	translate: 0 var(--fwf--reveal--distance);
	transition:
		opacity var(--fwf--reveal--duration) var(--fwf--reveal--ease),
		translate var(--fwf--reveal--duration) var(--fwf--reveal--ease);
	will-change: opacity, translate;
}

.fwf-motion .fwf-reveal.is-revealed {
	opacity: 1;
	translate: none;
	will-change: auto;
}

.fwf-motion .fwf-hero-feature.fwf-reveal,
.fwf-motion .fwf-hero-split.fwf-reveal {
	translate: none;
	transition: opacity 420ms var(--fwf--reveal--ease);
}

.fwf-motion .fwf-mask {
	overflow: hidden;
	padding-block-end: 0.08em;
	margin-block-end: -0.08em;
}

.fwf-motion .fwf-mask__inner {
	display: block;
	transform: translateY(105%);
	transition: transform 720ms var(--fwf--reveal--ease);
	will-change: transform;
}

.fwf-motion .fwf-mask.is-revealed .fwf-mask__inner {
	transform: none;
	will-change: auto;
}

.fwf-motion .fwf-mask.fwf-reveal {
	translate: none;
}

/* Hero sequence ------------------------------------------------------------ */

/*
 * The hero is the one section that opts out of the section-level drift (see
 * the rule above), because moving a full-bleed band is heavy-handed. Its parts
 * move instead, on the ordered schedule animations.js assigns.
 *
 * Distances are larger here than the generic 14px reveal — this is the first
 * thing on the page, with nothing above it for scale, so a small drift simply
 * does not register.
 */
/*
 * The animation lives on `.fwf-hero-anim`, an element animations.js creates at
 * runtime — never on the hero part itself.
 *
 * That is deliberate and hard-won. Applying a start state to an element already
 * painted on screen did not reliably produce a transition here: the browser
 * computed the start and end values in one pass and jumped straight to the end,
 * so the hero looked completely static at 18px and equally static at 120px. A
 * freshly created element gets its own initial style pass, which is precisely
 * why the masked heading was the only thing on the site that ever animated.
 * This copies that.
 */
.fwf-motion .fwf-hero-anim {
	opacity: 0;
	translate: 0 26px;
	transition:
		opacity 700ms var(--fwf--reveal--ease),
		translate 700ms var(--fwf--reveal--ease);
	will-change: opacity, translate;
}

.fwf-motion .fwf-hero-anim.is-revealed {
	opacity: 1;
	translate: none;
	will-change: auto;
}

/* The wrapper must not change how the part it wraps is laid out. */
.fwf-hero-anim--block {
	display: block;
}

.fwf-hero-anim--inline {
	display: inline-flex;
}

/*
 * A masked part is animated by its own inner span, so the part itself only
 * needs to hold still and let the mask do the work.
 */
.fwf-motion .fwf-hero-part.fwf-mask {
	opacity: 1;
	translate: none;
}

/*
 * A masked heading is already carried by its inner span sliding up, so the
 * outer must not also drift — the two together read as a lurch. Fade only.
 */
.fwf-motion .fwf-hero-part.fwf-mask {
	translate: none;
}

/*
 * The badge settles rather than drifts. It is a round stamp overlapping the
 * photograph, and a circle sliding up reads as falling; scaling in reads as
 * being placed.
 */
.fwf-motion .fwf-hero-feature__badge > .fwf-hero-anim {
	translate: none;
	scale: 0.88;
	transition:
		opacity 520ms var(--fwf--reveal--ease),
		scale 520ms var(--fwf--ease-out);
}

.fwf-motion .fwf-hero-feature__badge > .fwf-hero-anim.is-revealed {
	scale: none;
}

/* The tag sits on the image edge, so it arrives along that edge. */
.fwf-motion .fwf-hero-feature__tag > .fwf-hero-anim {
	translate: -10px 0;
}

.fwf-motion .fwf-hero-feature__tag > .fwf-hero-anim.is-revealed {
	translate: none;
}

/* Interaction ------------------------------------------------------------- */

/*
 * Everything below is a response to a pointer, a key or a state change — not a
 * scroll reveal. Two rules hold throughout:
 *
 * 1. Motion goes in `translate` / `scale`, never `transform`, for the reason
 *    given in CLAUDE.md: several of these elements already carry a `transform`
 *    of their own for positioning, and animating the shorthand wipes it.
 *    (`.fwf-mask__inner` above is the deliberate exception — it owns its
 *    transform outright.)
 * 2. Hover effects are wrapped in `@media (hover: hover)`. On a touch screen a
 *    :hover rule sticks after the tap, leaving a card lifted until you touch
 *    something else.
 *
 * Every state here also has a keyboard equivalent. A card that only responds to
 * a mouse is invisible to anyone tabbing through the page.
 */

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

/*
 * One lift, applied to everything card-shaped. These previously had no
 * interaction at all beyond the three that were listed here.
 */
.fwf-service-card,
.wp-block-group.is-style-card,
.wp-block-group.is-style-bordered,
.post-card,
.fwf-badge-split__card {
	transition:
		translate var(--fwf--settle) var(--fwf--ease-out),
		box-shadow var(--fwf--settle) var(--fwf--ease-out),
		border-color var(--fwf--settle) var(--fwf--ease-out);
}

/* No shadow to ease — these move only. */
.fwf-trust-point,
.fwf-step,
.fwf-benefit,
.fwf-include,
.fwf-stat {
	transition: translate var(--fwf--settle) var(--fwf--ease-out);
}

/*
 * Only things that are actually cards get a shadow.
 *
 * A shadow describes an object lifting off the page, so it needs a surface to
 * cast from. `.fwf-trust-point` and `.fwf-include` have no background of their
 * own, and `.fwf-benefit` and `.fwf-stat` are dividers drawn with a single
 * border — a drop shadow on those hangs in the air around nothing, which reads
 * as a rendering fault rather than a hover state. It was worst on the trust
 * diagram, where the points sit over a photograph.
 *
 * They keep the lift. Movement alone is enough to say "this responds".
 */
@media (hover: hover) {
	.fwf-service-card:hover,
	.wp-block-group.is-style-card:hover,
	.wp-block-group.is-style-bordered:hover {
		translate: 0 -2px;
		box-shadow: var(--wp--preset--shadow--md);
	}

	.fwf-trust-point:hover,
	.fwf-step:hover,
	.fwf-benefit:hover,
	.fwf-include:hover,
	.fwf-stat:hover {
		translate: 0 -2px;
	}
}

/*
 * Restore the interaction transition once the reveal is finished.
 *
 * Every card above is also a reveal target, and `.fwf-motion .fwf-reveal` is
 * (0,2,0) while the rule above is (0,1,0) — so the reveal's `transition` won
 * outright and the hover had no easing on box-shadow at all. This is the exact
 * specificity trap in CLAUDE.md: an override has to match or beat the rule it
 * overrides, and source order does not rescue it.
 *
 * Scoping to `.is-revealed` makes this (0,3,0) and confines it to the moment
 * after the reveal has finished, so the two never fight over `translate`.
 */
.fwf-motion .fwf-service-card.is-revealed,
.fwf-motion .wp-block-group.is-style-card.is-revealed,
.fwf-motion .wp-block-group.is-style-bordered.is-revealed,
.fwf-motion .post-card.is-revealed,
.fwf-motion .fwf-trust-point.is-revealed,
.fwf-motion .fwf-step.is-revealed,
.fwf-motion .fwf-benefit.is-revealed,
.fwf-motion .fwf-include.is-revealed {
	transition:
		translate var(--fwf--settle) var(--fwf--ease-out),
		box-shadow var(--fwf--settle) var(--fwf--ease-out),
		border-color var(--fwf--settle) var(--fwf--ease-out);
}

/* The keyboard equivalent of the hover above. */
.fwf-service-card:focus-within,
.wp-block-group.is-style-card:focus-within,
.post-card:focus-within {
	translate: 0 -2px;
	box-shadow: var(--wp--preset--shadow--md);
}

/* Media inside a card ------------------------------------------------------ */

/*
 * A slow, small zoom. `scale` rather than `transform: scale()` so it composes
 * with the reveal's own scale instead of cancelling it.
 */
.post-card__media img,
.entry__content a > img {
	transition: scale 600ms var(--fwf--ease-out);
}

@media (hover: hover) {
	.post-card:hover .post-card__media img,
	.post-card:focus-within .post-card__media img,
	.entry__content a:hover > img {
		scale: 1.03;
	}
}

/* Buttons ------------------------------------------------------------------ */

/*
 * The lift and shadow live in blocks.css with the rest of the button styling.
 * What was missing is the other half of the gesture: a button that rises on
 * hover but does not move when clicked feels unresponsive, because the press
 * is the moment the user is actually looking for feedback.
 *
 * Specificity note: theme.json prints its button rules as
 * `:root :where(.wp-element-button, ...)`, which `:where()` keeps at a single
 * class. These are (0,2,0) and land after it, so they hold.
 */
.wp-block-button__link:active,
.wp-element-button:active,
.fwf-hero-feature__button:active,
.fwf-services-grid__button:active,
.fwf-process-steps__button:active,
.gform_button:active {
	translate: 0 0;
	scale: 0.985;
	box-shadow: var(--wp--preset--shadow--sm);
	transition-duration: var(--fwf--tap);
}

/* The arrow in `is-style-arrow` nudges with the button rather than separately. */
.wp-block-button.is-style-arrow .wp-block-button__link::after {
	transition: translate var(--fwf--quick) var(--fwf--ease-out);
}

/*
 * An icon inside a button leans toward the direction it implies.
 *
 * `fwf_icon()` renders an inline SVG with `.fwf-icon`, currently the phone mark
 * on any tel: CTA. It takes `currentColor` and is sized in `em`, so the only
 * safe thing to move is its position — never its color or box.
 */
.wp-element-button .fwf-icon,
.fwf-hero-feature__button .fwf-icon {
	transition:
		translate var(--fwf--quick) var(--fwf--ease-out),
		scale var(--fwf--quick) var(--fwf--ease-out);
}

@media (hover: hover) {
	.wp-element-button:hover .fwf-icon,
	.fwf-hero-feature__button:hover .fwf-icon {
		scale: 1.1;
	}
}

/*
 * The lift, restated for every button the shared rule in blocks.css misses.
 *
 * blocks.css handles the standard set at (0,1,0); these carry their own
 * component-scoped rules at (0,2,0) that beat it, so the lift has to be
 * declared where it can actually land. Same specificity trap as the cards.
 */
@media (hover: hover) {
	.fwf-hero-feature .fwf-hero-feature__button:hover,
	.fwf-hero-split .fwf-hero-split__button:hover,
	.fwf-process-steps .fwf-process-steps__button:hover,
	.fwf-services-grid .fwf-services-grid__button:hover {
		translate: 0 -2px;
		box-shadow: var(--wp--preset--shadow--md);
	}
}

.fwf-hero-feature .fwf-hero-feature__button:active,
.fwf-hero-split .fwf-hero-split__button:active,
.fwf-process-steps .fwf-process-steps__button:active,
.fwf-services-grid .fwf-services-grid__button:active {
	translate: 0 0;
	scale: 0.985;
	box-shadow: var(--wp--preset--shadow--sm);
	transition-duration: var(--fwf--tap);
}

/*
 * A light sweep across the face of the button on hover.
 *
 * Drawn on `::before`, never `::after` — `is-style-arrow` already owns
 * `::after` for its arrow glyph, and taking it would delete the arrow.
 *
 * The sweep is masked by the button's own rounded box, so `overflow: hidden`
 * is required. That does not clip the focus ring: `outline` is painted outside
 * the border box and is unaffected by overflow.
 */
.wp-block-button__link,
.wp-element-button,
.fwf-hero-feature__button,
.fwf-hero-split__button,
.fwf-services-grid__button,
.fwf-process-steps__button,
.gform_button {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.wp-block-button__link::before,
.wp-element-button::before,
.fwf-hero-feature__button::before,
.fwf-hero-split__button::before,
.fwf-services-grid__button::before,
.fwf-process-steps__button::before,
.gform_button::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(
		100deg,
		transparent 20%,
		rgb(255 255 255 / 0.22) 50%,
		transparent 80%
	);
	translate: -110% 0;
}

@media (hover: hover) {
	.wp-block-button__link:hover::before,
	.wp-element-button:hover::before,
	.fwf-hero-feature__button:hover::before,
	.fwf-hero-split__button:hover::before,
	.fwf-services-grid__button:hover::before,
	.fwf-process-steps__button:hover::before,
	.gform_button:hover::before {
		translate: 110% 0;
		transition: translate 620ms var(--fwf--ease-out);
	}
}

/*
 * A firmer lift than the shared 2px, so the gesture reads on a large CTA as
 * well as a small one, and a deeper shadow to sell the elevation.
 */
@media (hover: hover) {
	.fwf-hero-feature .fwf-hero-feature__button:hover,
	.fwf-hero-split .fwf-hero-split__button:hover,
	.fwf-process-steps .fwf-process-steps__button:hover,
	.fwf-services-grid .fwf-services-grid__button:hover,
	.site-header .site-header__cta .wp-block-button__link:hover {
		translate: 0 -3px;
		box-shadow: var(--wp--preset--shadow--lg);
	}
}

/* Links -------------------------------------------------------------------- */

/*
 * An underline that wipes in from the left instead of appearing all at once.
 * Drawn as a gradient background so it animates `background-size` — a real
 * `text-decoration` cannot be transitioned, and a border would change layout.
 *
 * Scoped to prose. Buttons, cards and nav items are excluded: they have their
 * own treatments, and an underline sliding under a button looks like a mistake.
 */
.entry__content a:not(.wp-element-button):not(.wp-block-button__link):not(.fwf-service-card__link),
.site-footer a:not(.wp-element-button),
.breadcrumbs a {
	background-image: linear-gradient(currentColor, currentColor);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 1px;
	transition:
		background-size var(--fwf--settle) var(--fwf--ease-out),
		color var(--fwf--quick) var(--fwf--ease-out);
}

.entry__content a:not(.wp-element-button):not(.wp-block-button__link):not(.fwf-service-card__link):hover,
.entry__content a:not(.wp-element-button):not(.wp-block-button__link):not(.fwf-service-card__link):focus-visible,
.site-footer a:not(.wp-element-button):hover,
.site-footer a:not(.wp-element-button):focus-visible,
.breadcrumbs a:hover,
.breadcrumbs a:focus-visible {
	background-size: 100% 1px;
}

/* Navigation --------------------------------------------------------------- */

/*
 * The same wipe, drawn as a pseudo-element so it can sit clear of the text and
 * span the whole item rather than just the glyphs.
 */
.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content,
.site-header .site-utility-nav .wp-block-navigation-item__content {
	position: relative;
}

.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after,
.site-header .site-utility-nav .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	inset-block-end: -0.15em;
	height: 2px;
	background: currentColor;
	scale: 0 1;
	transform-origin: left center;
	transition: scale var(--fwf--settle) var(--fwf--ease-out);
}

.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover::after,
.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible::after,
.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::after,
.site-header .site-utility-nav .wp-block-navigation-item__content:hover::after,
.site-header .site-utility-nav .wp-block-navigation-item__content:focus-visible::after {
	scale: 1 1;
}

/* Icons -------------------------------------------------------------------- */

/*
 * Icons take `currentColor` and are sized in `em`, so the only thing safe to
 * move is the icon itself. A small settle, never a spin.
 */
.fwf-service-card__icon,
.fwf-trust-point__icon,
.fwf-process-step__icon,
.fwf-include__icon {
	transition: scale var(--fwf--settle) var(--fwf--ease-out);
}

@media (hover: hover) {
	.fwf-service-card:hover .fwf-service-card__icon,
	.fwf-trust-point:hover .fwf-trust-point__icon,
	.fwf-include:hover .fwf-include__icon {
		scale: 1.08;
	}
}

/* Details / FAQ ------------------------------------------------------------ */

/*
 * core/details ships unstyled. The marker rotating to point down is the whole
 * affordance — without it, opening a question gives no feedback that the
 * control itself changed state.
 */
.wp-block-details summary {
	cursor: pointer;
	transition:
		color var(--fwf--quick) var(--fwf--ease-out),
		background-color var(--fwf--quick) var(--fwf--ease-out);
}

.wp-block-details summary:hover {
	color: var(--wp--preset--color--primary);
}

.wp-block-details summary::marker,
.wp-block-details summary::-webkit-details-marker {
	color: var(--wp--preset--color--primary);
}

/*
 * The panel opening. `grid-template-rows` from 0fr to 1fr is the one way to
 * transition to an unknown content height without measuring it in JS; the
 * inner element needs `min-height: 0` or it refuses to shrink.
 */
.wp-block-details[open] > *:not(summary) {
	animation: fwf-details-open var(--fwf--settle) var(--fwf--ease-out);
}

@keyframes fwf-details-open {
	from {
		opacity: 0;
		translate: 0 -4px;
	}

	to {
		opacity: 1;
		translate: none;
	}
}

/* Form fields -------------------------------------------------------------- */

/*
 * The global :focus-visible ring in base.css covers keyboard focus. This adds
 * the border and glow that tell you which field is live, including when it was
 * reached by pointer — where :focus-visible deliberately does not apply.
 */
.gform_wrapper input:not([type="submit"]),
.gform_wrapper textarea,
.gform_wrapper select,
.wp-block-search__input {
	transition:
		border-color var(--fwf--quick) var(--fwf--ease-out),
		box-shadow var(--fwf--quick) var(--fwf--ease-out);
}

.gform_wrapper input:not([type="submit"]):focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus,
.wp-block-search__input:focus {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px var(--fwf--color--primary-soft);
}

/* Header ------------------------------------------------------------------- */

/*
 * The scroll shadow and the utility-row collapse already live in header.css,
 * driven by the `is-scrolled` class navigation.js sets. Nothing to add here —
 * only the logo, which had no interaction state.
 */
.site-header .site-logo__image {
	transition: scale var(--fwf--settle) var(--fwf--ease-out);
}

@media (hover: hover) {
	.site-header .site-logo:hover .site-logo__image {
		scale: 1.02;
	}
}

/* Counters ----------------------------------------------------------------- */

/*
 * A stat counting up as it arrives. The value is written into the markup and
 * only animated afterwards, so the real figure is what a crawler and a
 * reduced-motion visitor see.
 */
.fwf-stat__value {
	font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {

	/*
	 * Remove the movement, keep the meaning.
	 *
	 * The distinction matters: someone who asks for reduced motion still needs
	 * to see which link is hovered and which field is focused. So transitions
	 * and translations go, while the end states — the underline, the focus
	 * border, the shadow, the color change — stay and simply apply instantly.
	 * Blanking those out would strip the affordances along with the animation.
	 */

	/* Reveals: show everything, move nothing. */
	.fwf-motion .fwf-reveal,
	.fwf-motion .fwf-reveal.is-revealed {
		opacity: 1 !important;
		translate: none !important;
		transition: none !important;
	}

	.fwf-motion .fwf-mask {
		overflow: visible !important;
	}

	.fwf-motion .fwf-mask__inner {
		transform: none !important;
		transition: none !important;
	}

	.fwf-motion .fwf-media-reveal,
		/* The hero sequence: every part visible, in place, at once. */
	.fwf-motion .fwf-hero-anim,
	.fwf-motion .fwf-hero-anim.is-revealed,
	.fwf-motion .fwf-hero-part,
	.fwf-motion .fwf-hero-part.is-revealed {
		opacity: 1 !important;
		translate: none !important;
		scale: none !important;
		transition: none !important;
		transition-delay: 0ms !important;
	}

	/* Interactions: no easing anywhere. */
	.fwf-service-card,
	.wp-block-group.is-style-card,
	.wp-block-group.is-style-bordered,
	.post-card,
	.fwf-trust-point,
	.fwf-step,
	.fwf-benefit,
	.fwf-include,
	.fwf-stat,
	.fwf-badge-split__card,
	.post-card__media img,
	.entry__content a > img,
	.fwf-service-card__icon,
	.fwf-trust-point__icon,
	.fwf-process-step__icon,
	.fwf-include__icon,
	.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after,
	.site-header .site-utility-nav .wp-block-navigation-item__content::after,
	.site-header .site-logo__image,
	.wp-block-details summary,
	.entry__content a,
	.site-footer a,
	.breadcrumbs a,
	.gform_wrapper input:not([type="submit"]),
	.gform_wrapper textarea,
	.gform_wrapper select,
	.wp-block-search__input {
		transition: none !important;
	}

	/* No element should move, scale or lift. */
	.fwf-service-card:hover,
	.wp-block-group.is-style-card:hover,
	.wp-block-group.is-style-bordered:hover,
	.fwf-trust-point:hover,
	.fwf-step:hover,
	.fwf-benefit:hover,
	.fwf-include:hover,
	.fwf-stat:hover,
	.fwf-service-card:focus-within,
	.wp-block-group.is-style-card:focus-within,
	.post-card:focus-within,
	.post-card:hover .post-card__media img,
	.post-card:focus-within .post-card__media img,
	.entry__content a:hover > img,
	.fwf-service-card:hover .fwf-service-card__icon,
	.fwf-trust-point:hover .fwf-trust-point__icon,
	.fwf-include:hover .fwf-include__icon,
	.site-header .site-logo:hover .site-logo__image {
		translate: none !important;
		scale: none !important;
	}

	.wp-block-button__link:active,
	.wp-element-button:active,
	.fwf-hero-feature__button:active,
	.fwf-services-grid__button:active,
	.fwf-process-steps__button:active,
	.gform_button:active,
	.fwf-hero-feature .fwf-hero-feature__button:active,
	.fwf-hero-split .fwf-hero-split__button:active,
	.fwf-process-steps .fwf-process-steps__button:active,
	.fwf-services-grid .fwf-services-grid__button:active,
	.fwf-hero-feature .fwf-hero-feature__button:hover,
	.fwf-hero-split .fwf-hero-split__button:hover,
	.fwf-process-steps .fwf-process-steps__button:hover,
	.fwf-services-grid .fwf-services-grid__button:hover,
	.wp-element-button:hover .fwf-icon,
	.fwf-hero-feature__button:hover .fwf-icon {
		translate: none !important;
		scale: none !important;
	}

	.wp-element-button .fwf-icon,
	.fwf-hero-feature__button .fwf-icon {
		transition: none !important;
	}

	/* The sheen is motion for its own sake; remove it entirely. */
	.wp-block-button__link::before,
	.wp-element-button::before,
	.fwf-hero-feature__button::before,
	.fwf-hero-split__button::before,
	.fwf-services-grid__button::before,
	.fwf-process-steps__button::before,
	.gform_button::before {
		display: none !important;
	}

	.site-header .site-header__cta .wp-block-button__link:hover {
		translate: none !important;
	}

	/* The FAQ panel appears, it does not slide. */
	.wp-block-details[open] > *:not(summary) {
		animation: none !important;
	}

	/*
	 * The nav underline is drawn with `scale`, so the blanket `scale: none`
	 * above would leave it permanently visible under every item. Collapse it by
	 * default and let the hover and current-item rules above expand it — with
	 * no transition, it simply appears.
	 */
	.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after,
	.site-header .site-utility-nav .wp-block-navigation-item__content::after {
		scale: 0 1;
	}

	.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover::after,
	.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:focus-visible::after,
	.site-header .site-nav .wp-block-navigation__responsive-container-content > .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::after,
	.site-header .site-utility-nav .wp-block-navigation-item__content:hover::after,
	.site-header .site-utility-nav .wp-block-navigation-item__content:focus-visible::after {
		scale: 1 1;
	}
}