/*
Theme Name: HRLU
Theme URI: https://hrlu.lu
Author: Addedsense s.à r.l.
Author URI: https://addedsense.lu
Description: Custom theme for HRLU S.à r.l. Payroll and HR in Luxembourg. Content is built with native Gutenberg blocks and the block patterns shipped in /patterns.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: hrlu
*/

/* ==========================================================================
   FONTS
   ========================================================================== */

@font-face {
	font-family: "Satoshi";
	src: url("assets/fonts/Satoshi-Variable.woff2") format("woff2");
	font-weight: 300 900;
	font-style: normal;
	font-display: swap;
}

/*
Signifier (headings) is licensed by the customer. When the files are delivered,
copy them to assets/fonts/ and enable this block. Until then headings use Georgia.

@font-face {
	font-family: "Signifier";
	src: url("assets/fonts/Signifier-Regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
*/

/* ==========================================================================
   TOKENS
   ========================================================================== */

:root {
	/* Colour */
	--as-color-blue: #39BDFF;
	--as-color-blue-dark: #083E61;
	--as-color-sand: #CAC396;
	--as-color-sand-dark: #4C4729;
	--as-color-ink: #1D1D1B;
	--as-color-white: #FFFFFF;
	--as-color-grey: #F2F2F0;
	--as-color-line: rgba(29, 29, 27, 0.18);
	--as-color-line-dark: rgba(8, 62, 97, 0.28);
	--as-color-line-light: rgba(255, 255, 255, 0.28);
	--as-color-error: #B32D2E;
	--as-color-glow: rgba(255, 255, 255, 0.35);

	/* Silhouettes shown in empty photo panels until a real photo is added */
	--as-sil-profile: url("assets/images/sil-profile.svg");
	--as-sil-front: url("assets/images/sil-front.svg");

	/* Fonts */
	--as-font-heading: "Signifier", Georgia, "Times New Roman", serif;
	--as-font-body: "Satoshi", "Segoe UI", Arial, sans-serif;

	/* Weights */
	--as-weight-regular: 400;
	--as-weight-medium: 500;
	--as-weight-bold: 700;

	/* Type scale */
	--as-text-xs: 0.8125rem;
	--as-text-sm: 0.9375rem;
	--as-text-base: 1.0625rem;
	--as-text-lg: clamp(1.1875rem, 1.6vw, 1.375rem);
	--as-text-xl: clamp(1.375rem, 2vw, 1.75rem);
	--as-text-2xl: clamp(1.875rem, 3.2vw, 2.5rem);
	--as-text-3xl: clamp(2.25rem, 5vw, 4.25rem);
	--as-text-hero: clamp(2.5rem, 5.5vw, 4.5rem);
	--as-text-display: clamp(3.5rem, 11vw, 9rem);

	/* Space */
	--as-space-1: 0.25rem;
	--as-space-2: 0.5rem;
	--as-space-3: 0.75rem;
	--as-space-4: 1rem;
	--as-space-5: 1.5rem;
	--as-space-6: 2rem;
	--as-space-7: 3rem;
	--as-space-8: 4.5rem;
	--as-section-y: clamp(3.5rem, 8vw, 7rem);
	--as-gutter: clamp(1.25rem, 4vw, 3rem);

	/* Layout */
	--as-container: 87.5rem;
	--as-container-text: 46rem;
	--as-header-h: 5rem;

	/* Shape */
	--as-radius: 0.75rem;
	--as-radius-sm: 0.5rem;
	--as-radius-lg: 1.25rem;
	--as-radius-pill: 999px;
	--as-shadow-soft: 0 0.75rem 2rem rgba(29, 29, 27, 0.12);
	--as-shadow-tile: 0 1.25rem 2.5rem rgba(29, 29, 27, 0.16);

	/* Motion */
	--as-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--as-duration: 650ms;

	/* Stacking */
	--as-z-header: 100;
	--as-z-nav: 110;
}

/* ==========================================================================
   BASE
   ========================================================================== */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--as-header-h) + var(--as-space-4));
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	background: var(--as-color-white);
	color: var(--as-color-ink);
	font-family: var(--as-font-body);
	font-size: var(--as-text-base);
	font-weight: var(--as-weight-medium);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

img,
svg {
	display: block;
	max-width: 100%;
	height: auto;
}

h1,
h2,
h3,
h4 {
	margin: 0 0 var(--as-space-4);
	font-family: var(--as-font-heading);
	font-weight: var(--as-weight-regular);
	line-height: 1.12;
	letter-spacing: -0.01em;
}

h1 { font-size: var(--as-text-hero); }
h2 { font-size: var(--as-text-2xl); }
h3 { font-size: var(--as-text-xl); }
h4 { font-size: var(--as-text-lg); }

p,
ul,
ol,
address {
	margin: 0 0 var(--as-space-4);
}

address {
	font-style: normal;
}

a {
	color: inherit;
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
}

:focus-visible {
	outline: 3px solid var(--as-color-blue);
	outline-offset: 3px;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.as-skip:focus {
	position: fixed;
	top: var(--as-space-2);
	left: var(--as-space-2);
	z-index: calc(var(--as-z-nav) + 1);
	width: auto;
	height: auto;
	margin: 0;
	padding: var(--as-space-3) var(--as-space-4);
	clip: auto;
	background: var(--as-color-white);
	color: var(--as-color-ink);
}

.as-container {
	width: 100%;
	max-width: calc(var(--as-container) + 2 * var(--as-gutter));
	margin-inline: auto;
	padding-inline: var(--as-gutter);
}

/* Free blocks the editor adds outside a section stay in a readable column. */
.as-content > :not(.as-section):not(.as-hero):not(.as-presence) {
	width: 100%;
	max-width: calc(var(--as-container-text) + 2 * var(--as-gutter));
	margin-inline: auto;
	padding-inline: var(--as-gutter);
}

.as-content--text {
	padding-bottom: var(--as-section-y);
}

/* ==========================================================================
   COMPONENTS
   ========================================================================== */

/* Buttons: the same look for theme links and for the Gutenberg button block. */
.as-btn,
.as-btn-wrap .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--as-space-2);
	padding: 0.7em 1.45em;
	border: 2px solid transparent;
	border-radius: var(--as-radius-pill);
	background: var(--as-color-blue);
	color: var(--as-color-blue-dark);
	font-family: var(--as-font-body);
	font-size: var(--as-text-sm);
	font-weight: var(--as-weight-bold);
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--as-duration) var(--as-ease), color var(--as-duration) var(--as-ease), transform var(--as-duration) var(--as-ease);
}

.as-btn:hover,
.as-btn-wrap .wp-block-button__link:hover {
	transform: translateY(-2px);
}

.as-btn--primary,
.as-btn-wrap--primary .wp-block-button__link {
	background: var(--as-color-blue);
	color: var(--as-color-blue-dark);
}

.as-btn-wrap--navy .wp-block-button__link {
	background: var(--as-color-blue-dark);
	color: var(--as-color-white);
}

.as-btn-wrap--outline .wp-block-button__link {
	background: transparent;
	color: inherit;
	border-color: currentColor;
}

.wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: var(--as-space-3);
	margin: var(--as-space-5) 0 0;
}

/* Section label: a thin line, then the label in the heading face. */
.as-label {
	display: flex;
	align-items: center;
	gap: var(--as-space-4);
	margin-bottom: var(--as-space-6);
	font-family: var(--as-font-heading);
	font-size: var(--as-text-xl);
	line-height: 1.2;
}

.as-label::before {
	content: "";
	flex: 0 0 min(14vw, 9rem);
	height: 1px;
	background: currentColor;
	opacity: 0.55;
}

.as-eyebrow {
	margin-bottom: var(--as-space-4);
	font-size: var(--as-text-sm);
	font-weight: var(--as-weight-bold);
	letter-spacing: 0.05em;
}

.as-lead {
	font-size: var(--as-text-lg);
	line-height: 1.55;
}

.as-statement {
	margin: 0;
	font-family: var(--as-font-heading);
	font-size: var(--as-text-3xl);
	line-height: 1.15;
	letter-spacing: -0.01em;
}

/* "Read more" and similar links get an arrow. */
.as-link-arrow a,
.as-card__link {
	font-weight: var(--as-weight-bold);
	text-decoration: underline;
}

.as-link-arrow a::after,
.as-card__link::after {
	content: "\2192";
	display: inline-block;
	margin-left: 0.4em;
	text-decoration: none;
	transition: transform var(--as-duration) var(--as-ease);
}

.as-link-arrow a:hover::after,
.as-card:hover .as-card__link::after {
	transform: translateX(0.3em);
}

/* Photo panel. The colour shows until a photo is added, so it is also the placeholder. */
.as-media {
	position: relative;
	width: 100%;
	overflow: hidden;
	border-radius: var(--as-radius);
	background: var(--as-color-blue);
}

.as-media--blue { background: var(--as-color-blue); --as-sil-color: var(--as-color-blue-dark); }
.as-media--sand { background: var(--as-color-sand); --as-sil-color: var(--as-color-sand-dark); }
.as-media--blue-dark { background: var(--as-color-blue-dark); --as-sil-color: var(--as-color-blue); }
.as-media--white { background: var(--as-color-white); border: 1px solid var(--as-color-line); }

/* Placeholder: a tonal silhouette with a soft light, hidden by the photo once it is added. */
.as-media::before,
.as-media::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.as-media::before {
	background: var(--as-sil-color, currentColor);
	-webkit-mask: var(--as-sil, var(--as-sil-profile)) var(--as-sil-pos, 50% 100%) / var(--as-sil-size, auto 92%) no-repeat;
	mask: var(--as-sil, var(--as-sil-profile)) var(--as-sil-pos, 50% 100%) / var(--as-sil-size, auto 92%) no-repeat;
	transform: scaleX(var(--as-flip, 1));
}

.as-media::after {
	background: linear-gradient(155deg, var(--as-color-glow), transparent 55%);
}

.as-media--white::before,
.as-media--white::after,
.as-media--flat::before,
.as-media--flat::after {
	display: none;
}

.as-media--portrait { aspect-ratio: 4 / 5; }
.as-media--wide { aspect-ratio: 12 / 5; }
.as-media--hero { aspect-ratio: 16 / 9; }
.as-media--square { aspect-ratio: 1 / 1; }
.as-media--landscape { aspect-ratio: 3 / 2; }

.as-media > .wp-block-image,
.as-media > .wp-block-image img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	object-fit: cover;
}

/* Cards */
.as-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: var(--as-space-5);
	min-height: 21rem;
	padding: var(--as-space-6);
	border-radius: var(--as-radius);
	background: var(--as-card-bg);
	color: var(--as-card-fg);
	text-decoration: none;
	counter-increment: as-card;
	transition: transform var(--as-duration) var(--as-ease), box-shadow var(--as-duration) var(--as-ease), background-color 400ms var(--as-ease), color 400ms var(--as-ease);
}

.as-card-grid,
.as-cards {
	counter-reset: as-card;
}

/* Card number, then title and text, link pinned to the bottom. */
.as-card::before {
	content: counter(as-card, decimal-leading-zero);
	font-family: var(--as-font-heading);
	font-size: var(--as-text-xl);
	line-height: 1;
	opacity: 0.7;
}

.as-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--as-shadow-soft);
	background: var(--as-card-hover-bg);
	color: var(--as-card-hover-fg);
}

.as-card > * {
	margin: 0;
}

.as-card .as-link-arrow,
.as-card__link {
	margin-top: auto;
}

.as-card__title {
	font-size: var(--as-text-2xl);
}

.as-card .as-link-arrow a::before {
	content: "";
	position: absolute;
	inset: 0;
}

/* Each card swaps to the tonal partner colour on hover. */
.as-card--blue { --as-card-bg: var(--as-color-blue); --as-card-fg: var(--as-color-blue-dark); --as-card-hover-bg: var(--as-color-blue-dark); --as-card-hover-fg: var(--as-color-blue); }
.as-card--sand { --as-card-bg: var(--as-color-sand); --as-card-fg: var(--as-color-sand-dark); --as-card-hover-bg: var(--as-color-sand-dark); --as-card-hover-fg: var(--as-color-sand); }
.as-card--white { --as-card-bg: var(--as-color-white); --as-card-fg: var(--as-color-ink); --as-card-hover-bg: var(--as-color-ink); --as-card-hover-fg: var(--as-color-white); border: 1.5px solid var(--as-color-line); }
.as-card--dark { --as-card-bg: var(--as-color-blue-dark); --as-card-fg: var(--as-color-white); --as-card-hover-bg: var(--as-color-blue); --as-card-hover-fg: var(--as-color-blue-dark); }

/* ==========================================================================
   SECTION: HEADER
   ========================================================================== */


/* The header has three looks: solid (default), Dark Blue (service pages) and
   floating over the hero (home, solid again after scrolling). The menu pill
   colours come from the --as-nav-* variables set per look. */
.as-header {
	--as-nav-bg: var(--as-color-grey);
	--as-nav-line: transparent;
	--as-nav-hover: color-mix(in srgb, var(--as-color-blue-dark) 10%, transparent);
	--as-nav-active-bg: var(--as-color-blue-dark);
	--as-nav-active-fg: var(--as-color-white);
	position: sticky;
	top: 0;
	z-index: var(--as-z-header);
	background: var(--as-color-white);
	color: var(--as-color-ink);
	transition: background-color 400ms var(--as-ease), color 400ms var(--as-ease), box-shadow 400ms var(--as-ease);
}

.as-header.is-scrolled {
	box-shadow: 0 1px 0 var(--as-color-line);
}

.as-header--dark,
.js .as-header--overlay:not(.is-scrolled),
.as-header.is-nav-open {
	--as-nav-bg: color-mix(in srgb, var(--as-color-white) 14%, transparent);
	--as-nav-line: color-mix(in srgb, var(--as-color-white) 32%, transparent);
	--as-nav-hover: color-mix(in srgb, var(--as-color-white) 18%, transparent);
	--as-nav-active-bg: var(--as-color-white);
	--as-nav-active-fg: var(--as-color-blue-dark);
	color: var(--as-color-white);
}

.as-header--dark {
	--as-nav-active-bg: var(--as-color-blue);
	background: var(--as-color-blue-dark);
}

/* Floating header: transparent over the hero, frosted white once the page scrolls. */
.js .as-header--overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background: transparent;
	box-shadow: none;
}

.js .as-header--overlay::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: color-mix(in srgb, var(--as-color-white) 90%, transparent);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
	opacity: 0;
	transition: opacity 400ms var(--as-ease);
}

.js .as-header--overlay.is-scrolled::before {
	opacity: 1;
}

/* Over the hero: a soft Dark Blue gradient lifts the contrast of the white logo and menu,
   and the menu pill gets a darker tint. Both fade out once the header turns solid. */
.js .as-header--overlay::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: -1;
	height: calc(100% + 6rem);
	background: linear-gradient(180deg, color-mix(in srgb, var(--as-color-blue-dark) 62%, transparent) 0%, transparent 100%);
	pointer-events: none;
	transition: opacity 400ms var(--as-ease);
}

.js .as-header--overlay.is-scrolled::after {
	opacity: 0;
}

.js .as-header--overlay:not(.is-scrolled) {
	--as-nav-bg: color-mix(in srgb, var(--as-color-blue-dark) 42%, transparent);
}

/* More room above the menu at the top of the page, compact once scrolled. */
.js .as-header--overlay .as-header__inner {
	padding-top: var(--as-space-6);
	transition: padding 400ms var(--as-ease);
}

.js .as-header--overlay.is-scrolled .as-header__inner {
	padding-top: var(--as-space-3);
}

.as-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--as-space-5);
	min-height: var(--as-header-h);
	padding: var(--as-space-3) var(--as-gutter);
}

.as-header__brand {
	position: relative;
	z-index: calc(var(--as-z-nav) + 1);
	display: block;
	flex: 0 0 auto;
}

.as-header__brand .as-logo {
	width: auto;
	height: 2.5rem;
}

.as-logo--white-fallback {
	filter: brightness(0) invert(1);
}

/* Two logos: white on dark or floating headers, colour otherwise. */
.as-logo--top {
	display: none;
}

.as-header--dark .as-logo--top,
.js .as-header--overlay:not(.is-scrolled) .as-logo--top,
.as-header.is-nav-open .as-logo--top {
	display: block;
}

.as-header--dark .as-logo--solid,
.js .as-header--overlay:not(.is-scrolled) .as-logo--solid,
.as-header.is-nav-open .as-logo--solid {
	display: none;
}

.as-header__panel {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	justify-content: space-between;
	gap: var(--as-space-6);
}

/* Menu: one rounded pill, the current page is a filled pill inside it. */
.as-nav {
	display: flex;
	flex: 1 1 auto;
	justify-content: center;
}

.as-nav__list {
	display: flex;
	align-items: center;
	gap: var(--as-space-1);
	margin: 0;
	padding: 0.3rem;
	list-style: none;
	border: 1px solid var(--as-nav-line);
	border-radius: var(--as-radius-pill);
	background: var(--as-nav-bg);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	transition: background-color 400ms var(--as-ease), border-color 400ms var(--as-ease);
}

.as-nav .menu-item {
	position: relative;
}

.as-nav a {
	display: block;
	padding: 0.55rem 1.1rem;
	border-radius: var(--as-radius-pill);
	font-size: var(--as-text-sm);
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 250ms var(--as-ease), color 250ms var(--as-ease);
}

.as-nav a:hover,
.as-nav a:focus-visible {
	background: var(--as-nav-hover);
}

.as-nav .current-menu-item > a,
.as-nav .current-menu-ancestor > a,
.as-nav .current_page_ancestor > a,
.as-nav .current-page-ancestor > a {
	background: var(--as-nav-active-bg);
	color: var(--as-nav-active-fg);
}

.as-nav .menu-item-has-children > a::after {
	content: "";
	display: inline-block;
	width: 0.4em;
	height: 0.4em;
	margin-left: 0.55em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-0.2em) rotate(45deg);
}

/* Services panel: numbered rows in the heading face, arrow slides in on hover. */
.as-nav .sub-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 23rem;
	margin: 0.6rem 0 0;
	padding: 0.5rem;
	list-style: none;
	counter-reset: as-sub;
	border-radius: var(--as-radius);
	background: var(--as-color-white);
	color: var(--as-color-ink);
	box-shadow: var(--as-shadow-soft), 0 0 0 1px var(--as-color-line);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 0.5rem) scale(0.98);
	transform-origin: top center;
	transition: opacity 250ms var(--as-ease), transform 250ms var(--as-ease), visibility 250ms;
}

/* Keeps the panel open while the pointer crosses the gap below the link. */
.as-nav .sub-menu::before {
	content: "";
	position: absolute;
	top: -0.7rem;
	left: 0;
	right: 0;
	height: 0.7rem;
}

.as-nav .menu-item:hover > .sub-menu,
.as-nav .menu-item:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0) scale(1);
}

.as-nav .sub-menu a {
	display: flex;
	align-items: baseline;
	gap: var(--as-space-3);
	padding: 0.85rem 1rem;
	border-radius: var(--as-radius-sm);
	background: transparent;
	color: inherit;
	font-family: var(--as-font-heading);
	font-size: var(--as-text-lg);
	white-space: normal;
	counter-increment: as-sub;
}

.as-nav .sub-menu a::before {
	content: counter(as-sub, decimal-leading-zero);
	font-family: var(--as-font-body);
	font-size: var(--as-text-xs);
	font-weight: var(--as-weight-bold);
	opacity: 0.55;
}

.as-nav .sub-menu a::after {
	content: "\2192";
	margin-left: auto;
	opacity: 0;
	transform: translateX(-0.5rem);
	transition: opacity 250ms var(--as-ease), transform 250ms var(--as-ease);
}

.as-nav .sub-menu a:hover,
.as-nav .sub-menu a:focus-visible {
	background: var(--as-color-blue-dark);
	color: var(--as-color-blue);
}

.as-nav .sub-menu a:hover::after,
.as-nav .sub-menu a:focus-visible::after {
	opacity: 1;
	transform: none;
}

.as-header__actions {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: var(--as-space-3);
}

/* On the floating header the main button turns white, blue would vanish on the blue hero. */
.js .as-header--overlay:not(.is-scrolled) .as-btn--primary {
	background: var(--as-color-white);
	color: var(--as-color-blue-dark);
}

/* Language switch: same pill look as the menu. */
.as-lang {
	display: flex;
	gap: var(--as-space-1);
	margin: 0;
	padding: 0.2rem;
	list-style: none;
	border: 1px solid var(--as-nav-line);
	border-radius: var(--as-radius-pill);
	background: var(--as-nav-bg);
}

.as-header:not(.as-header--dark):not(.is-nav-open) .as-lang {
	border-color: var(--as-color-line);
}

.as-lang__link {
	display: block;
	padding: 0.3rem 0.75rem;
	border-radius: var(--as-radius-pill);
	font-size: var(--as-text-xs);
	font-weight: var(--as-weight-bold);
	text-decoration: none;
}

.as-lang__item.is-active .as-lang__link {
	background: var(--as-nav-active-bg);
	color: var(--as-nav-active-fg);
}

.as-header__toggle {
	display: none;
	position: relative;
	z-index: calc(var(--as-z-nav) + 1);
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	cursor: pointer;
}

.as-header__bars,
.as-header__bars::before,
.as-header__bars::after {
	display: block;
	width: 1.5rem;
	height: 2px;
	margin-inline: auto;
	background: currentColor;
	transition: transform 250ms var(--as-ease), background 250ms;
}

.as-header__bars {
	position: relative;
}

.as-header__bars::before,
.as-header__bars::after {
	content: "";
	position: absolute;
	left: 0;
}

.as-header__bars::before { top: -0.45rem; }
.as-header__bars::after { top: 0.45rem; }

.as-header.is-nav-open .as-header__bars { background: transparent; }
.as-header.is-nav-open .as-header__bars::before { transform: translateY(0.45rem) rotate(45deg); }
.as-header.is-nav-open .as-header__bars::after { transform: translateY(-0.45rem) rotate(-45deg); }

body.as-nav-open {
	overflow: hidden;
}

/* Phones and tablets: full-screen menu with large serif links. */
@media (max-width: 63.99rem) {
	.as-header__toggle {
		display: block;
	}

	.as-header__panel {
		position: fixed;
		inset: 0;
		z-index: var(--as-z-nav);
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		gap: var(--as-space-6);
		padding: calc(var(--as-header-h) + var(--as-space-5)) var(--as-gutter) var(--as-space-6);
		background: var(--as-color-blue-dark);
		color: var(--as-color-white);
		overflow-y: auto;
	}

	.js .as-header__panel {
		display: none;
	}

	.js .as-header__panel.is-open {
		display: flex;
		animation: as-menu-in 400ms var(--as-ease) both;
	}

	.as-nav {
		display: block;
		flex: 0 0 auto;
	}

	.as-nav__list {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--as-space-1);
		padding: 0;
		border: 0;
		background: none;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}

	.as-nav a,
	.as-nav .current-menu-item > a,
	.as-nav .current-menu-ancestor > a {
		padding: 0.15rem 0;
		border-radius: 0;
		background: none;
		color: inherit;
		font-family: var(--as-font-heading);
		font-size: clamp(2rem, 8vw, 2.75rem);
		line-height: 1.15;
	}

	.as-nav .current-menu-item > a,
	.as-nav .current-menu-ancestor > a,
	.as-nav a:hover,
	.as-nav a:focus-visible {
		background: none;
		color: var(--as-color-blue);
	}

	.as-nav .menu-item-has-children > a::after {
		display: none;
	}

	.as-nav .sub-menu {
		position: static;
		width: auto;
		margin: 0;
		padding: 0 0 0 var(--as-space-4);
		background: transparent;
		color: inherit;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.as-nav .sub-menu::before,
	.as-nav .sub-menu a::before,
	.as-nav .sub-menu a::after {
		display: none;
	}

	.as-nav .sub-menu a,
	.as-nav .sub-menu a:hover {
		padding: 0.15rem 0;
		background: none;
		font-size: 1.375rem;
	}

	.as-header__actions {
		flex-wrap: wrap;
	}

	.as-header__panel .as-btn--primary,
	.js .as-header--overlay:not(.is-scrolled) .as-header__panel .as-btn--primary {
		background: var(--as-color-blue);
		color: var(--as-color-blue-dark);
	}
}

@keyframes as-menu-in {
	from { opacity: 0; }
}

/* ==========================================================================
   SECTION: SECTIONS (shared)
   ========================================================================== */

.as-section {
	padding-block: var(--as-section-y);
}

.as-section--grey { background: var(--as-color-grey); }
.as-section--dark { background: var(--as-color-ink); color: var(--as-color-white); }
.as-section--navy { background: var(--as-color-blue-dark); color: var(--as-color-white); }
.as-section--blue { background: var(--as-color-blue); color: var(--as-color-blue-dark); }
.as-section--flush { padding-block: 0; }

.as-section--band {
	padding-block: var(--as-space-7);
}

.as-section__title {
	max-width: 22em;
	font-size: var(--as-text-3xl);
	line-height: 1.12;
}

.as-section__title--center {
	margin-inline: auto;
	text-align: center;
}

.as-section__lead {
	max-width: 40rem;
	font-size: var(--as-text-lg);
	line-height: 1.55;
}

.as-intro-band__text {
	max-width: 56rem;
	margin: 0 auto;
	font-size: var(--as-text-lg);
	text-align: center;
}

.as-split {
	display: grid;
	gap: var(--as-space-7);
	align-items: center;
}

.as-split__media {
	justify-self: center;
	max-width: 34rem;
}

.as-banner {
	max-width: none;
}

.as-duo {
	display: grid;
	gap: var(--as-space-7);
	grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
}

/* ==========================================================================
   SECTION: PAGE HERO
   ========================================================================== */

.as-page-hero {
	padding-block: clamp(2.5rem, 6vw, 5rem) var(--as-space-6);
	text-align: center;
}

.as-page-hero__title {
	margin-bottom: var(--as-space-4);
	font-size: var(--as-text-hero);
}

.as-page-hero__subtitle {
	max-width: 40rem;
	margin: 0 auto;
	font-family: var(--as-font-heading);
	font-size: var(--as-text-xl);
	line-height: 1.35;
	color: var(--as-color-sand-dark);
}

.as-page-hero__action {
	margin-top: var(--as-space-6);
}

.as-page-hero--dark {
	padding-block: clamp(2.5rem, 6vw, 5rem);
	background: var(--as-color-blue-dark);
	color: var(--as-color-white);
}

.as-page-hero--dark .as-page-hero__title { color: var(--as-color-blue); }
.as-page-hero--dark .as-page-hero__subtitle { color: var(--as-color-white); }

/* ==========================================================================
   SECTION: HOME HERO
   ========================================================================== */

/* Full-bleed duotone hero with centred type, like the Italian site. */
.as-hero > .as-container {
	max-width: none;
	padding-inline: 0;
}

.as-hero__panel {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: calc(100svh - var(--as-header-h));
	overflow: hidden;
	isolation: isolate;
	background: linear-gradient(180deg, var(--as-color-blue) 0%, color-mix(in srgb, var(--as-color-blue) 45%, var(--as-color-blue-dark)) 100%);
	color: var(--as-color-white);
	text-align: center;
}

.as-hero__media {
	--as-sil-pos: 50% 100%;
	--as-sil-size: auto 94%;
	position: absolute;
	inset: 0;
	z-index: -1;
	aspect-ratio: auto;
	border-radius: 0;
	background: transparent;
}

/* The floating header sits on top of the hero, so the hero fills the whole screen. */
.as-page--home .as-hero__panel {
	min-height: 100svh;
}

.as-hero__content {
	width: 100%;
	max-width: 64rem;
	margin-inline: auto;
	padding: var(--as-space-7) var(--as-gutter) var(--as-space-6);
}

.as-hero__title {
	max-width: 12em;
	margin-inline: auto;
	font-size: clamp(3rem, 8vw, 7rem);
	line-height: 1.02;
	text-wrap: balance;
}

/* Text enters one line after the other. */
.js .as-hero__content > * {
	animation: as-reveal-in 900ms var(--as-ease) both;
}

.js .as-hero__content > :nth-child(2) { animation-delay: 120ms; }
.js .as-hero__content > :nth-child(3) { animation-delay: 240ms; }
.js .as-hero__content > :nth-child(4) { animation-delay: 360ms; }

.as-hero__lead {
	max-width: 38rem;
	margin-inline: auto;
	font-size: var(--as-text-lg);
	line-height: 1.55;
}

.as-hero__content .wp-block-buttons {
	justify-content: center;
}

.as-hero__strip {
	padding: var(--as-space-4) var(--as-gutter);
	border-top: 1px solid var(--as-color-line-light);
	font-size: var(--as-text-sm);
}

.as-hero__strip-text {
	margin: 0;
}

/* ==========================================================================
   SECTION: MARQUEE (service names, slowly scrolling)
   ========================================================================== */

.as-marquee {
	overflow: hidden;
	padding-block: var(--as-space-5);
	background: var(--as-color-ink);
	color: var(--as-color-white);
}

.as-marquee__track {
	display: flex;
	flex: none;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

.as-marquee__item {
	position: relative;
	margin: 0;
	padding-inline: var(--as-space-6);
	font-family: var(--as-font-heading);
	font-size: var(--as-text-2xl);
	line-height: 1.3;
	white-space: nowrap;
}

.as-marquee__item::after {
	content: "";
	position: absolute;
	right: -0.2rem;
	top: 50%;
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--as-color-blue);
	transform: translateY(-50%);
}

.as-marquee__inner {
	display: flex;
	width: max-content;
	animation: as-marquee 45s linear infinite;
}

.as-marquee__inner .as-marquee__track {
	flex-wrap: nowrap;
}

.as-marquee:hover .as-marquee__inner {
	animation-play-state: paused;
}

@keyframes as-marquee {
	to { transform: translateX(-50%); }
}

/* ==========================================================================
   SECTION: PRESENCE (pinned values panel)
   ========================================================================== */

.as-presence {
	position: relative;
	padding-block: var(--as-section-y);
	background: var(--as-color-blue-dark);
	color: var(--as-color-white);
	transition: background-color 900ms var(--as-ease);
}

/* The background shifts tone with each value: Dark Blue, Dark Sand, Ink. */
.as-presence.is-state-1 { background: var(--as-color-sand-dark); }
.as-presence.is-state-2 { background: var(--as-color-ink); }
.as-presence.is-state-1 .as-presence__word { color: var(--as-color-sand); }

.as-presence__stage {
	display: grid;
	gap: var(--as-space-7);
	align-items: center;
}

.as-presence__word {
	margin: 0;
	font-family: var(--as-font-heading);
	font-size: var(--as-text-display);
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--as-color-blue);
}

.as-presence__text {
	max-width: 26rem;
	margin: var(--as-space-4) 0 0;
	font-size: var(--as-text-lg);
}

.as-presence__media {
	display: grid;
	justify-self: center;
	width: 100%;
	max-width: 26rem;
}

/* Without JavaScript only the first portrait is shown. */
.as-presence__photo:not(:first-child) {
	display: none;
}

.as-presence__photo:nth-child(2) { --as-sil: var(--as-sil-front); }
.as-presence__photo:nth-child(3) { --as-flip: -1; --as-sil-size: auto 104%; }

/* With JavaScript the panel is pinned and one value is shown at a time. */
.js .as-presence {
	height: 320svh;
	padding-block: 0;
}

.js .as-presence__inner {
	position: sticky;
	top: var(--as-header-h);
	display: grid;
	align-items: center;
	height: calc(100svh - var(--as-header-h));
}

.js .as-presence__words,
.js .as-presence__texts {
	display: grid;
}

.js .as-presence__word,
.js .as-presence__text {
	grid-area: 1 / 1;
	opacity: 0;
	transform: translateY(1.25rem);
	transition: opacity var(--as-duration) var(--as-ease), transform var(--as-duration) var(--as-ease), color 900ms var(--as-ease);
}

.js .as-presence__word.is-active,
.js .as-presence__text.is-active {
	opacity: 1;
	transform: none;
}

/* The portraits sit on top of each other and cross-fade with the words. */
.js .as-presence__photo,
.js .as-presence__photo:not(:first-child) {
	display: block;
	grid-area: 1 / 1;
	opacity: 0;
	transform: scale(0.94);
	transition: opacity 900ms var(--as-ease), transform 900ms var(--as-ease);
}

.js .as-presence__photo.is-active {
	opacity: 1;
	transform: none;
}

/* ==========================================================================
   SECTION: SERVICES AND REASONS
   ========================================================================== */

.as-card-grid {
	display: grid;
	gap: var(--as-space-4);
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
	margin-top: var(--as-space-7);
}

.as-cards {
	display: grid;
	gap: var(--as-space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.as-section--cards .as-card {
	min-height: 18rem;
}

.as-partner__title {
	margin-top: var(--as-space-5);
}

.as-partner--card {
	padding: var(--as-space-6);
	border-radius: var(--as-radius);
	background: var(--as-color-white);
}

.as-partner__logo {
	margin-bottom: var(--as-space-5);
}

.as-reasons {
	display: grid;
	gap: var(--as-space-6);
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	margin-top: var(--as-space-6);
}

.as-reason {
	padding-top: var(--as-space-4);
	border-top: 1px solid var(--as-color-line);
}

.as-section--navy .as-reason,
.as-section--dark .as-reason {
	border-top-color: var(--as-color-line-light);
}

/* Centred headings on the services and reasons sections, like the Italian home. */
.as-section--services .as-section__title,
.as-section--services .as-section__lead,
.as-section--why .as-section__title {
	margin-inline: auto;
	text-align: center;
}

.as-section--why .as-label {
	justify-content: center;
}

.as-reason__num {
	margin-bottom: var(--as-space-3);
	font-family: var(--as-font-heading);
	font-size: var(--as-text-3xl);
	line-height: 1;
	color: var(--as-color-blue-dark);
}

.as-section--navy .as-reason__num,
.as-section--dark .as-reason__num {
	color: var(--as-color-blue);
}

.as-reason__title {
	font-size: var(--as-text-xl);
}

.as-stat {
	display: grid;
	gap: var(--as-space-6);
	align-items: center;
}

.as-stat__value {
	margin: 0;
	font-family: var(--as-font-heading);
	font-size: var(--as-text-display);
	line-height: 1;
	color: var(--as-color-blue-dark);
}

/* ==========================================================================
   SECTION: SERVICE PAGE BLOCKS
   ========================================================================== */

.as-checklist {
	display: grid;
	gap: var(--as-space-4) var(--as-space-7);
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: as-check;
}

.as-checklist li {
	position: relative;
	margin: 0;
	padding: var(--as-space-4) 0 var(--as-space-4) 3.5rem;
	border-top: 1px solid var(--as-color-line);
	font-size: var(--as-text-lg);
	counter-increment: as-check;
}

.as-checklist li::before {
	content: counter(as-check, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: var(--as-space-4);
	font-family: var(--as-font-heading);
	font-size: var(--as-text-xl);
	line-height: 1.3;
	color: var(--as-color-blue-dark);
}

.as-back {
	margin: 0;
	padding-block: var(--as-space-8);
	text-align: center;
}

.as-back__link {
	text-decoration: none;
}

.as-back__link::before {
	content: "\2190\00a0";
}

.as-back__target {
	color: var(--as-color-blue-dark);
	font-weight: var(--as-weight-bold);
	text-decoration: underline;
}

/* ==========================================================================
   SECTION: MOSAIC (moving portraits)
   ========================================================================== */

.as-section--mosaic {
	overflow: hidden;
}

.as-mosaic__field {
	position: relative;
	display: grid;
	gap: var(--as-space-3);
	grid-template-columns: repeat(2, 1fr);
	margin-top: var(--as-space-7);
}

.as-mosaic__tile {
	border-radius: var(--as-radius-sm);
	box-shadow: var(--as-shadow-tile);
}

.as-mosaic__tile--d1 { --as-depth: 0.25; }
.as-mosaic__tile--d2 { --as-depth: 0.6; }
.as-mosaic__tile--d3 { --as-depth: 1; }

/* Placeholder silhouettes differ from tile to tile. */
.as-mosaic__tile:nth-child(odd) { --as-sil: var(--as-sil-front); --as-sil-size: auto 96%; }
.as-mosaic__tile:nth-child(3n) { --as-flip: -1; }
.as-mosaic__tile:nth-child(4n + 2) { --as-sil-size: auto 118%; --as-sil-pos: 40% 100%; }
.as-mosaic__tile:nth-child(5n) { --as-sil-size: auto 105%; --as-sil-pos: 60% 100%; }

/* ==========================================================================
   SECTION: CALL TO ACTION
   ========================================================================== */

.as-section--cta {
	text-align: center;
}

.as-section--cta .as-section__title,
.as-section--cta .as-section__lead {
	margin-inline: auto;
}

.as-section--cta .wp-block-buttons {
	justify-content: center;
}

/* ==========================================================================
   SECTION: CONTACT AND FORM
   ========================================================================== */

.as-contact {
	display: grid;
	gap: var(--as-space-7);
}

.as-contact__title {
	font-size: var(--as-text-xl);
}

.as-contact__address,
.as-contact__line {
	font-size: var(--as-text-lg);
}

.as-form p {
	margin: 0;
}

.as-form__grid {
	display: grid;
	gap: var(--as-space-4);
	margin: var(--as-space-6) 0 var(--as-space-4);
}

.as-form__field label {
	display: block;
	margin-bottom: var(--as-space-1);
	font-size: var(--as-text-sm);
	font-weight: var(--as-weight-bold);
}

.as-form__field input,
.as-form__field select,
.as-form__field textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1.5px solid var(--as-color-line);
	border-radius: var(--as-radius-sm);
	background: var(--as-color-white);
	color: var(--as-color-ink);
	font: inherit;
}

.as-form__field input:focus,
.as-form__field select:focus,
.as-form__field textarea:focus {
	outline: 3px solid var(--as-color-blue);
	outline-offset: 1px;
	border-color: var(--as-color-blue-dark);
}

.as-form__consent {
	margin-bottom: var(--as-space-5);
	font-size: var(--as-text-sm);
}

.as-form__consent label {
	display: flex;
	gap: var(--as-space-3);
	align-items: flex-start;
}

.as-form__consent input {
	flex: 0 0 auto;
	margin-top: 0.3em;
}

.as-form__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.as-form__notice {
	margin: var(--as-space-5) 0 0;
	padding: var(--as-space-4);
	border-radius: var(--as-radius-sm);
	font-weight: var(--as-weight-bold);
}

.as-form__notice--ok {
	background: var(--as-color-blue);
	color: var(--as-color-blue-dark);
}

.as-form__notice--error {
	background: var(--as-color-white);
	border: 1.5px solid var(--as-color-error);
	color: var(--as-color-error);
}

/* ==========================================================================
   SECTION: FOOTER
   ========================================================================== */

.as-footer {
	background: var(--as-color-ink);
	color: var(--as-color-white);
	font-size: var(--as-text-sm);
}

.as-footer__grid {
	display: grid;
	gap: var(--as-space-7);
	padding: var(--as-space-8) var(--as-gutter);
}

.as-footer__logo .as-logo {
	width: auto;
	height: 2.75rem;
}

.as-footer__tagline {
	margin: var(--as-space-5) 0 var(--as-space-2);
	font-family: var(--as-font-heading);
	font-size: var(--as-text-xl);
	color: var(--as-color-blue);
}

.as-footer__motto {
	margin-bottom: var(--as-space-4);
	font-family: var(--as-font-heading);
	font-size: var(--as-text-lg);
}

.as-footer__about {
	max-width: 22rem;
	opacity: 0.85;
}

.as-footer__title {
	margin-bottom: var(--as-space-4);
	font-family: var(--as-font-body);
	font-size: var(--as-text-sm);
	font-weight: var(--as-weight-bold);
	letter-spacing: 0.04em;
	color: var(--as-color-blue);
}

.as-footer__list,
.as-footer__legal {
	margin: 0;
	padding: 0;
	list-style: none;
}

.as-footer__list li {
	margin-bottom: var(--as-space-2);
}

.as-footer a {
	text-decoration: none;
}

.as-footer a:hover,
.as-footer a:focus-visible {
	text-decoration: underline;
}

.as-footer__details {
	margin-top: var(--as-space-3);
}

.as-footer__bar {
	background: var(--as-color-blue);
	color: var(--as-color-blue-dark);
	font-size: var(--as-text-xs);
}

.as-footer__bar-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--as-space-2) var(--as-space-5);
	padding: var(--as-space-4) var(--as-gutter);
}

.as-footer__bar p,
.as-footer__bar ul {
	margin: 0;
}

.as-footer__bar ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--as-space-2) var(--as-space-5);
	padding: 0;
	list-style: none;
}

.as-footer__bar li {
	margin: 0;
}

/* ==========================================================================
   MOTION (reveals)
   ========================================================================== */

/* An animation, not a transition, so hover effects on the same element stay untouched. */
.js .as-reveal {
	opacity: 0;
}

.js .as-reveal.is-visible {
	opacity: 1;
	animation: as-reveal-in var(--as-duration) var(--as-ease) var(--as-delay, 0ms) both;
}

@keyframes as-reveal-in {
	from {
		opacity: 0;
		translate: 0 1.5rem;
	}
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (min-width: 48rem) {
	.as-split {
		grid-template-columns: 1.1fr 0.9fr;
	}

	.as-split--flip {
		grid-template-columns: 0.9fr 1.1fr;
	}

	.as-split--flip .as-split__media {
		order: -1;
	}

	.as-presence__stage {
		grid-template-columns: 1.15fr 0.85fr;
	}

	.as-cards {
		grid-template-columns: repeat(2, 1fr);
	}

	.as-checklist {
		grid-template-columns: repeat(2, 1fr);
	}

	.as-stat {
		grid-template-columns: auto 1fr;
	}

	.as-contact {
		grid-template-columns: 1.2fr 0.8fr;
	}

	.as-form__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.as-form__field--full {
		grid-column: 1 / -1;
	}

	.as-footer__grid {
		grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
	}

	/* Mosaic: scattered, overlapping tiles that drift on scroll. */
	.as-mosaic__field {
		display: block;
		aspect-ratio: 16 / 9;
	}

	.as-mosaic__tile {
		position: absolute;
		/* Scroll sets --as-py, the pointer sets --as-mx and --as-my. Nearer tiles (larger depth) move more. */
		transform: translate3d(
			calc(var(--as-mx, 0) * var(--as-depth, 1) * -34px),
			calc(var(--as-py, 0) * var(--as-depth, 1) * 1px + var(--as-my, 0) * var(--as-depth, 1) * -24px),
			0
		);
		transition: transform 700ms var(--as-ease);
		animation: as-float 9s ease-in-out infinite alternate;
		will-change: transform, translate;
	}

	.as-mosaic__tile--d1 { animation-duration: 11s; }
	.as-mosaic__tile--d2 { animation-duration: 8s; animation-delay: -3s; }
	.as-mosaic__tile--d3 { animation-duration: 10s; animation-delay: -6s; }

	.as-mosaic__tile:nth-child(1)  { left: 3%;  top: 6%;  width: 15%; }
	.as-mosaic__tile:nth-child(2)  { left: 17%; top: 22%; width: 20%; }
	.as-mosaic__tile:nth-child(3)  { left: 41%; top: 4%;  width: 16%; }
	.as-mosaic__tile:nth-child(4)  { left: 62%; top: 24%; width: 19%; }
	.as-mosaic__tile:nth-child(5)  { left: 82%; top: 6%;  width: 14%; }
	.as-mosaic__tile:nth-child(6)  { left: 1%;  top: 58%; width: 13%; }
	.as-mosaic__tile:nth-child(7)  { left: 38%; top: 46%; width: 22%; }
	.as-mosaic__tile:nth-child(8)  { left: 68%; top: 62%; width: 16%; }
	.as-mosaic__tile:nth-child(9)  { left: 14%; top: 72%; width: 20%; }
	.as-mosaic__tile:nth-child(10) { left: 85%; top: 50%; width: 13%; }
}

@keyframes as-float {
	from { translate: -0.6rem -1rem; rotate: -1.6deg; }
	to { translate: 0.6rem 1rem; rotate: 1.6deg; }
}

@media (min-width: 64rem) {
	.as-card-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (max-width: 47.99rem) {
	.as-presence__media {
		display: none;
	}

	.as-card {
		min-height: 15rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.js .as-reveal,
	.js .as-reveal.is-visible {
		opacity: 1;
		animation: none;
	}

	.as-mosaic__tile {
		animation: none;
		transform: none;
	}

	.js .as-presence {
		height: auto;
		padding-block: var(--as-section-y);
	}

	.js .as-presence__inner {
		position: static;
		height: auto;
	}

	.js .as-presence__words,
	.js .as-presence__texts {
		display: block;
	}

	.js .as-presence__word,
	.js .as-presence__text {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.js .as-presence__photo {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.js .as-presence__photo:not(:first-child) {
		display: none;
	}

	.js .as-hero__content > * {
		animation: none;
	}

	.as-marquee__inner {
		animation: none;
	}

	.as-btn:hover,
	.as-btn-wrap .wp-block-button__link:hover,
	.as-card:hover {
		transform: none;
	}
}