@charset "UTF-8";
/*
 * Athena XAI — supplementary styles that theme.json cannot express.
 * Loaded on the front end and in the editor (add_editor_style).
 *
 * 1. Colour schemes (light default, dark via OS or toggle)
 * 2. Base & accessibility
 * 3. Header, navigation, footer
 * 4. Section primitives (eyebrow, section heading, buttons)
 * 5. Homepage sections
 * 6. Motion (load-in + scroll reveal; reduced-motion safe)
 * 7. Forms (Contact Form 7), legacy pages, utilities
 */

/* ── 1. Colour schemes ───────────────────────────────────────────── */

:root {
	--athena-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--athena-shadow-raised: 0 1px 2px rgb(3 3 41 / 0.06), 0 8px 24px -8px rgb(3 3 41 / 0.12);
	--athena-shadow-float: 0 1px 2px rgb(3 3 41 / 0.05), 0 24px 48px -24px rgb(52 20 110 / 0.24);
	--athena-header-bg: rgb(255 255 255 / 0.86);
	--athena-glow: rgb(148 49 250 / 0.1);
	--athena-success: #0b7a57;
	/* Boundary of a card or control: at least 3:1 on every surface (WCAG 1.4.11). */
	--athena-border-strong: #82839f;
	color-scheme: light;
}

/* Dark tokens: the same semantic slugs, re-pointed. Fixed slugs (brand, ink, on-ink) never change. */
:root[data-color-scheme="dark"] {
	--wp--preset--color--base: #070720;
	--wp--preset--color--surface: #0d0d2c;
	--wp--preset--color--raised: #12123a;
	--wp--preset--color--border: #34346b;
	--wp--preset--color--muted: #b3b4d1;
	--wp--preset--color--contrast: #f4f4fb;
	--wp--preset--color--accent: #c39bff;
	--wp--preset--color--accent-soft: #221a52;
	--athena-shadow-raised: 0 1px 2px rgb(0 0 0 / 0.4), 0 8px 24px -8px rgb(0 0 0 / 0.5);
	--athena-shadow-float: 0 2px 4px rgb(0 0 0 / 0.3), 0 30px 60px -20px rgb(0 0 0 / 0.7), 0 0 0 1px rgb(255 255 255 / 0.03);
	--athena-header-bg: rgb(7 7 32 / 0.82);
	--athena-glow: rgb(148 49 250 / 0.18);
	--athena-success: #5fd8aa;
	--athena-border-strong: #7474ad;
	/* Small product thumbnails and the demo phone. */
	--athena-tile: #1e1e52;
	--athena-phone-frame: #0a0a26;
	color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-color-scheme="light"]) {
		--wp--preset--color--base: #070720;
		--wp--preset--color--surface: #0d0d2c;
		--wp--preset--color--raised: #12123a;
		--wp--preset--color--border: #34346b;
		--wp--preset--color--muted: #b3b4d1;
		--wp--preset--color--contrast: #f4f4fb;
		--wp--preset--color--accent: #c39bff;
		--wp--preset--color--accent-soft: #221a52;
		--athena-shadow-raised: 0 1px 2px rgb(0 0 0 / 0.4), 0 8px 24px -8px rgb(0 0 0 / 0.5);
		--athena-shadow-float: 0 2px 4px rgb(0 0 0 / 0.3), 0 30px 60px -20px rgb(0 0 0 / 0.7), 0 0 0 1px rgb(255 255 255 / 0.03);
		--athena-header-bg: rgb(7 7 32 / 0.82);
		--athena-glow: rgb(148 49 250 / 0.18);
		--athena-success: #5fd8aa;
		--athena-border-strong: #7474ad;
		--athena-tile: #1e1e52;
		--athena-phone-frame: #0a0a26;
		color-scheme: dark;
	}
}

/* Smooth cross-fade only while the visitor toggles the scheme. */
:root.is-switching-scheme *,
:root.is-switching-scheme *::before,
:root.is-switching-scheme *::after {
	transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease, fill 0.35s ease !important;
}

/* Gradients can't be transitioned, so the hero's two scheme colours are registered
   <color> properties: the fade into the page and the glow then cross-fade with it. */
@property --athena-hero-fade {
	syntax: "<color>";
	inherits: false;
	initial-value: transparent;
}

@property --athena-hero-glow {
	syntax: "<color>";
	inherits: false;
	initial-value: transparent;
}

:root.is-switching-scheme .athena-hero {
	transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease, --athena-hero-fade 0.35s ease, --athena-hero-glow 0.35s ease !important;
}

/* Logos: show the wordmark that matches the surface. */
.athena-logo__img--on-dark {
	display: none !important;
}

:root[data-color-scheme="dark"] .athena-logo__img--on-light {
	display: none !important;
}

:root[data-color-scheme="dark"] .athena-logo__img--on-dark {
	display: block !important;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-color-scheme="light"]) .athena-logo__img--on-light {
		display: none !important;
	}

	:root:not([data-color-scheme="light"]) .athena-logo__img--on-dark {
		display: block !important;
	}
}

/* ── 2. Base & accessibility ─────────────────────────────────────── */

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-padding-top: 6rem; /* in-page anchors land below the sticky header */
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-optical-sizing: auto;
	overflow-x: clip;
}

:where(h1, h2, h3, h4) {
	text-wrap: balance;
}

:where(p, li, dd) {
	text-wrap: pretty;
}

::selection {
	background: color-mix(in srgb, var(--wp--preset--color--brand) 28%, transparent);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
	border-radius: 4px;
}

:where(.wp-element-button, .wp-block-button__link):focus-visible {
	outline-offset: 3px;
	border-radius: 999px;
}

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

.skip-link.screen-reader-text:focus,
.screen-reader-text:focus {
	z-index: 100000;
	top: 0.75rem;
	left: 0.75rem;
	width: auto;
	height: auto;
	padding: 0.75rem 1rem;
	clip: auto;
	border-radius: 8px;
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	font-weight: 700;
	text-decoration: none;
}

img,
svg {
	max-width: 100%;
}

/* ── 3. Header & navigation ──────────────────────────────────────── */

/* Sticky header. WordPress wraps the header part in a div exactly as tall as
   the header, so the wrapper (not .site-header) must be the sticky box. */
.wp-block-template-part:has(> .site-header) {
	position: sticky;
	top: 0;
	z-index: 50;
}

.site-header {
	position: relative;
	background: var(--athena-header-bg);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	backdrop-filter: saturate(160%) blur(14px);
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--border) 70%, transparent);
}

.admin-bar .wp-block-template-part:has(> .site-header) {
	top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
	.admin-bar .wp-block-template-part:has(> .site-header) {
		top: 0;
	}
}

.site-header__inner {
	min-height: 4.75rem;
	gap: 1.5rem;
}

.athena-logo {
	display: flex;
	align-items: center;
	line-height: 0;
}

.site-header .athena-logo__link,
.site-footer .athena-logo__link {
	display: block;
	line-height: 0;
	border-radius: 6px;
}

.athena-logo img {
	height: auto;
}

.site-header__actions {
	gap: 0.6rem !important;
}

.site-header .wp-block-navigation {
	--athena-nav-gap: clamp(1rem, 2vw, 2rem);
	gap: var(--athena-nav-gap);
}

.site-header .wp-block-navigation .wp-block-navigation-item__content {
	padding-block: 0.5rem;
	color: var(--wp--preset--color--contrast);
	transition: color 0.2s ease;
}

.site-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.site-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--accent);
}

.site-header .wp-block-navigation__submenu-container {
	min-width: 20rem !important;
	padding: 0.5rem !important;
	border: 1px solid var(--wp--preset--color--border) !important;
	border-radius: 16px;
	background: var(--wp--preset--color--raised) !important;
	box-shadow: var(--athena-shadow-float);
	color: var(--wp--preset--color--contrast) !important;
}

/* Submenu links: title on its own line, description stacked under it (core
   lays the two spans out as a wrapping row, so they ran into each other). */
.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 0.3rem;
	box-sizing: border-box;
	width: 100%;
	min-height: 2.75rem;
	padding: 0.7rem 0.9rem !important;
	border-radius: 10px;
	line-height: 1.35;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__label {
	font-weight: 650;
}

.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
	background: color-mix(in srgb, var(--wp--preset--color--brand) 9%, var(--wp--preset--color--raised));
	color: var(--wp--preset--color--accent);
}

.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
	outline-offset: -2px;
	border-radius: 10px;
}

/* Current page: accent title plus a bar on the left, so it does not rely on colour alone. */
.site-header .wp-block-navigation__submenu-container .current-menu-item > .wp-block-navigation-item__content {
	box-shadow: inset 3px 0 0 var(--wp--preset--color--accent);
}

.site-header .wp-block-navigation-item__description {
	display: block;
	max-width: 32ch;
	margin: 0;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 450;
	line-height: 1.45;
	white-space: normal;
}

/* Desktop panel (min-width above): wide enough for a title and a one-to-two-line
   description. Six or more links switch to two columns; the grid fills row by
   row, so the reading order and the Tab order stay the DOM order. */
.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container {
	gap: 0.125rem;
}

@media (min-width: 1201px) {
	.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container:has(> .wp-block-navigation-item:nth-child(6)) {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		min-width: 38rem !important;
	}
}

/* Core makes these flex rows, so place-items alone left the icon at the start. */
.site-header .wp-block-navigation__responsive-container-open,
.site-header .wp-block-navigation__responsive-container-close {
	place-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 12px;
	color: var(--wp--preset--color--contrast);
}

/* The full menu (Products, Platform, Integrations, Customers, Pricing, Resources) needs
   ~1170px next to the actions; below 1201px use the overlay (core switches at 600px,
   which is too late for this header). */
@media (min-width: 600px) and (max-width: 1200px) {
	.site-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.site-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* backdrop-filter makes the header the containing block for position:fixed,
   which clipped the full-screen mobile menu to the header's height. Drop the
   blur while the menu is open (the menu has its own solid background). */
.site-header:has(.wp-block-navigation__responsive-container.is-menu-open) {
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

/* The open menu reads as one left-aligned list: the desktop bar is centred
   (items-justified-center), and core carries that into the overlay. */
.site-header .wp-block-navigation__responsive-container.is-menu-open {
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	--navigation-layout-align: flex-start;
	padding: 1.25rem clamp(1.25rem, 4vw, 2.5rem) 2rem;
	background: var(--wp--preset--color--base) !important;
	color: var(--wp--preset--color--contrast) !important;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 3.5rem;
	gap: 0.25rem;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: flex-start;
	text-align: start;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
}

/* .has-child: outranks core's overlay rule, which sets width: auto. */
.site-header .wp-block-navigation__responsive-container.is-menu-open .has-child .wp-block-navigation__submenu-container {
	box-sizing: border-box;
	width: 100%;
	min-width: 0 !important;
	max-width: 24rem;
	margin-inline: 0;
	border: 0 !important;
	box-shadow: none;
	padding: 0 0 0.5rem !important;
	background: transparent !important;
}

/* Both submenus share one column, so Products and Resources line up. */
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu {
	align-self: stretch;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.65rem 0.75rem !important;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__description {
	max-width: 40ch;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 550;
}

.nav-cta-mobile {
	display: none !important;
}

.wp-block-navigation__responsive-container.is-menu-open .nav-cta-mobile {
	display: block !important;
	margin-top: 1rem;
}

.wp-block-navigation__responsive-container.is-menu-open .nav-cta-mobile .wp-block-navigation-item__content {
	display: inline-block;
	padding: 0.85rem 1.5rem !important;
	border-radius: 999px;
	background: var(--wp--preset--color--brand);
	color: #fff !important;
}

/* "All features →", the last link of the Products menu: a full-width row under the
   product links, divided from them, without a description. */
.site-header .wp-block-navigation__submenu-container > .athena-nav-all {
	grid-column: 1 / -1;
	margin-top: 0.25rem;
	padding-top: 0.25rem;
	border-top: 1px solid var(--wp--preset--color--border);
}

.site-header .wp-block-navigation__submenu-container > .athena-nav-all .wp-block-navigation-item__label {
	color: var(--wp--preset--color--accent);
}

/* Visual and Voice Search grouped under Omnispect Search (header.php, nav_groups()): a list
   nested in the Omnispect item, indented behind a thin rule, each still its own link. */
.site-header .wp-block-navigation__submenu-container > .athena-nav-parent {
	flex-direction: column;
	align-items: stretch;
}

.site-header .athena-nav-group {
	display: flex;
	flex-direction: column;
	gap: 0.125rem;
	margin: 0.125rem 0 0 0.9rem;
	padding: 0 0 0 0.5rem;
	border-left: 1px solid var(--wp--preset--color--border);
	list-style: none;
}

.site-header .athena-nav-group > .wp-block-navigation-item {
	display: block;
	margin: 0;
}

/* Desktop: the Omnispect group fills the first column, the other products the second. */
@media (min-width: 1201px) {
	.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container:has(> .athena-nav-parent > .athena-nav-group) {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		min-width: 38rem !important;
	}

	.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container > .athena-nav-parent:has(> .athena-nav-group) {
		grid-row: span 3;
	}
}

/* Breadcrumbs (blocks/breadcrumbs, inc/breadcrumbs.php): Home › Products › page. Quiet
   (owner, 2026-11-06): right under the header, small, one muted grey for links, separators
   and the current page, so the hero leads. The grey is mixed from the scheme's own muted and
   page colours: 5.6:1 on the light page, 7.3:1 on the dark one (WCAG 1.4.3). */
.athena-breadcrumbs {
	--athena-crumb: color-mix(in srgb, var(--wp--preset--color--muted) 85%, var(--wp--preset--color--base));
	margin-block: 0 clamp(1.25rem, 2vw, 1.75rem) !important;
	font-size: 0.8125rem;
	line-height: 1.5;
}

.athena-breadcrumbs__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 0.45rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.athena-breadcrumbs__item {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	color: var(--athena-crumb);
	font-weight: 450;
}

/* Separators lighter than the text; decorative, so screen readers skip them. */
.athena-breadcrumbs__item + .athena-breadcrumbs__item::before {
	content: "›" / "";
	color: color-mix(in srgb, var(--athena-crumb) 55%, var(--wp--preset--color--base));
}

/* The site's 44 px target, without making the row taller than its text: the negative
   margins take the extra height back out of the line. */
.athena-breadcrumbs__item a {
	display: inline-flex;
	align-items: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	margin-block: calc((1.5em - 2.75rem) / 2);
	color: inherit;
	text-decoration: none;
	text-underline-offset: 0.2em;
}

.athena-breadcrumbs__item a:hover,
.athena-breadcrumbs__item a:focus-visible {
	text-decoration: underline;
	text-decoration-thickness: 1px;
}

/* The current page: the same grey and weight; aria-current says which it is. */
.athena-breadcrumbs [aria-current="page"] {
	color: inherit;
	font-weight: inherit;
}

/* Product heroes (Products\hero(), 0.5rem top padding) and the Feature template's header (the
   Serbian legacy product pages) start with the trail: it sits in their top padding, right
   under the header, and the theme's block gap above <main> is dropped on those pages. With
   the 0.125rem here the trail is 10 px under the header (owner, 2026-11-06: "padding 10px
   above and below"; the margin under the trail already leaves 20 px or more). */
.athena-product-hero > .athena-breadcrumbs,
.athena-page-header > .athena-breadcrumbs:first-child {
	margin-top: 0.125rem !important;
}

.athena-page-header:has(> .athena-breadcrumbs:first-child) {
	padding-top: 0.5rem !important;
}

.wp-site-blocks > main:has(> .athena-page-header:first-child > .athena-breadcrumbs:first-child, > .entry-content > .athena-product-hero:first-child > .athena-breadcrumbs) {
	margin-block-start: 0;
}

/* Colour-scheme toggle */
.athena-scheme-toggle {
	display: none;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 20%, transparent);
	border-radius: 999px;
	background: transparent;
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
	transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.4s var(--athena-ease);
}

.has-js .athena-scheme-toggle {
	display: grid;
}

/* Hover devices only: on touch, :hover sticks and left the ring purple after a tap. */
@media (hover: hover) {
	.athena-scheme-toggle:hover {
		border-color: var(--wp--preset--color--brand);
	}
}

.athena-scheme-toggle:active {
	transform: rotate(-20deg) scale(0.94);
}

.athena-scheme-toggle svg {
	grid-area: 1 / 1;
	width: 20px;
	height: 20px;
	transition: opacity 0.3s ease, transform 0.5s var(--athena-ease);
}

.athena-scheme-toggle[aria-pressed="true"] .athena-scheme-toggle__moon,
.athena-scheme-toggle[aria-pressed="false"] .athena-scheme-toggle__sun {
	opacity: 0;
	transform: rotate(-90deg) scale(0.5);
}

/* Language switcher */
.athena-langs {
	--athena-langs-text: var(--wp--preset--color--contrast);
	--athena-langs-hover: var(--wp--preset--color--surface);
	--athena-langs-line: color-mix(in srgb, var(--wp--preset--color--contrast) 20%, transparent);
	--athena-langs-panel: var(--wp--preset--color--raised);
	position: relative;
}

.site-footer .athena-langs {
	--athena-langs-text: #fff;
	--athena-langs-hover: rgb(255 255 255 / 0.1);
	--athena-langs-line: rgb(255 255 255 / 0.28);
	--athena-langs-panel: var(--wp--preset--color--ink);
}

.athena-langs__trigger {
	display: none;
	align-items: center;
	gap: 0.4rem;
	min-height: 2.75rem;
	padding: 0 0.7rem;
	border: 1px solid var(--athena-langs-line);
	border-radius: 999px;
	background: transparent;
	color: var(--athena-langs-text);
	font: inherit;
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.04em;
	cursor: pointer;
}

.has-js .athena-langs__trigger {
	display: inline-flex;
}

.athena-langs__trigger:hover,
.athena-langs.is-open .athena-langs__trigger {
	border-color: var(--wp--preset--color--brand);
}

.athena-langs__flag {
	flex: none;
	width: 20px;
	height: 14px;
	border-radius: 2px;
	box-shadow: 0 0 0 1px rgb(127 127 127 / 0.35);
}

.athena-langs__chevron {
	flex: none;
}

.athena-langs.is-open .athena-langs__chevron {
	transform: rotate(180deg);
}

/* Without JavaScript: the plain list of links. */
.athena-langs__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.15rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.athena-langs__list a {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	min-height: 2.75rem;
	padding: 0 0.6rem;
	border-radius: 10px;
	color: var(--athena-langs-text);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.athena-langs__list a:hover {
	background: var(--athena-langs-hover);
	color: var(--athena-langs-text);
	text-decoration: none;
}

.athena-langs__list a[aria-current="true"] {
	background: var(--athena-langs-hover);
	font-weight: 700;
}

/* With JavaScript: the list is a panel under the trigger. */
.has-js .athena-langs__list {
	display: none;
	position: absolute;
	top: calc(100% + 0.4rem);
	right: 0;
	z-index: 30;
	flex-direction: column;
	flex-wrap: nowrap;
	min-width: 11rem;
	padding: 0.4rem;
	border: 1px solid var(--athena-langs-line);
	border-radius: 14px;
	background: var(--athena-langs-panel);
	box-shadow: var(--athena-shadow-float);
}

.has-js .athena-langs.is-open .athena-langs__list {
	display: flex;
}

/* Set by view.js when the trigger is in the left half of the screen. */
.has-js .athena-langs.is-start .athena-langs__list {
	right: auto;
	left: 0;
}

/* The footer is at the bottom of the page: open upwards. */
.has-js .site-footer .athena-langs__list {
	top: auto;
	bottom: calc(100% + 0.4rem);
}

@media (prefers-reduced-motion: no-preference) {
	.athena-langs__chevron {
		transition: transform 0.2s ease;
	}

	.has-js .athena-langs.is-open .athena-langs__list {
		animation: athena-langs-open 0.16s ease-out;
	}

	@keyframes athena-langs-open {
		from {
			opacity: 0;
			transform: translateY(-0.25rem);
		}
	}
}

/* The copy inside the navigation block only shows in the open mobile menu. */
.site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .athena-langs {
	display: none;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .athena-langs {
	width: 100%;
	margin-top: 1rem;
}

.site-header .is-menu-open .athena-langs__trigger {
	justify-content: flex-start;
	width: 100%;
	font-size: var(--wp--preset--font-size--medium);
}

.site-header .is-menu-open .athena-langs__chevron {
	margin-left: auto;
}

.has-js .site-header .is-menu-open .athena-langs__list {
	position: static;
	width: 100%;
	margin-top: 0.4rem;
	box-shadow: none;
	scroll-margin-block: 1rem;
}

.site-header .is-menu-open .athena-langs__list a {
	font-size: var(--wp--preset--font-size--medium);
}

@media (max-width: 781px) {
	.site-header__cta {
		display: none !important;
	}
}

/* Phones: the switcher lives in the mobile menu, not next to the logo. */
@media (max-width: 599px) {
	.has-js .site-header__actions .athena-langs {
		display: none;
	}
}

/* Below 1201px the navigation is its menu button: the logo takes the free space,
   so the controls on the right sit one even gap apart (space-between had split
   the free space and left a wide hole between the colour toggle and the menu). */
@media (max-width: 1200px) {
	.site-header__inner {
		gap: 0.6rem;
	}

	.site-header .site-header__inner > .athena-logo {
		margin-right: auto;
	}
}

@media (max-width: 400px) {
	/* Tightened so the switcher stays in the header down to 320px. */
	.site-header__inner {
		gap: 0.5rem;
	}

	.site-header .athena-logo img {
		width: 100px;
	}

	.site-header__actions {
		gap: 0.25rem !important;
	}
}

/* ── Footer ──────────────────────────────────────────────────────── */

.site-footer {
	border-top: 1px solid rgb(255 255 255 / 0.06);
}

.site-footer a {
	color: #dcdcef;
	text-decoration: none;
}

.site-footer a:hover {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Brand + the link groups (Products, Platform, Integrations, Company, Support) on one row:
   one equal column per group, however many are shown (a group whose pages are all
   withdrawn is left out, patterns/footer.php), so no column stays empty. */
.site-footer__grid {
	grid-template-columns: minmax(13rem, 1.4fr) !important;
	grid-auto-columns: minmax(8rem, 1fr);
	grid-auto-flow: column;
	gap: 2.5rem 2rem !important;
}

.site-footer__brand {
	max-width: 22rem;
}

@media (max-width: 1180px) {
	.site-footer__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
		grid-auto-flow: row;
	}

	.site-footer__brand {
		grid-column: 1 / -1;
	}
}

/* Four groups on tablets: one row of four, not three and one. */
@media (min-width: 701px) and (max-width: 1180px) {
	.site-footer__grid:has(> :nth-child(5):last-child) {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	}
}

/* Phones: two link groups per row keep the footer short. */
@media (max-width: 700px) {
	.site-footer__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 2rem 1.25rem !important;
	}
}

@media (max-width: 359px) {
	.site-footer__grid {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

.site-footer__heading {
	margin-bottom: 0.75rem;
	color: #fff;
	font-size: var(--wp--preset--font-size--x-small) !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.site-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.55rem;
	font-size: var(--wp--preset--font-size--small);
}

.site-footer__muted,
.site-footer__muted p {
	color: #c9cae0;
}

.site-footer__social a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.site-footer__social svg {
	width: 18px;
	height: 18px;
}

/* ── Back to top ─────────────────────────────────────────────────── */

/* One control for the site (inc/assets.php back_to_top(), assets/js/back-to-top.js): fixed,
   so it takes no space; hidden until the visitor is past the first screen of a page at least
   three screens tall. Hidden means visibility: hidden, so it is never a tab stop. The script
   sets --athena-to-top-lift to clear a consent banner or chat launcher at the bottom. */
.athena-to-top {
	--athena-to-top-lift: 0px;
	position: fixed;
	right: calc(1rem + env(safe-area-inset-right, 0px));
	bottom: calc(1rem + env(safe-area-inset-bottom, 0px) + var(--athena-to-top-lift));
	z-index: 40; /* under the sticky header (50) and its mobile menu */
	display: grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	padding: 0;
	border: 1px solid var(--athena-border-strong);
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	box-shadow: 0 8px 24px -12px rgb(3 3 41 / 0.45);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(0.5rem);
	transition: opacity 0.2s ease, transform 0.2s ease, bottom 0.2s ease, border-color 0.2s ease, color 0.2s ease, visibility 0s linear 0.2s;
}

.athena-to-top[hidden] {
	display: none;
}

.athena-to-top.is-shown {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition-delay: 0s;
}

.athena-to-top:hover {
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--accent);
}

.athena-to-top:focus-visible {
	border-radius: 50%;
}

.athena-to-top svg {
	width: 1.25rem;
	height: 1.25rem;
}

/* The mobile menu covers the page; the button does not show through or above it. */
:root.has-modal-open .athena-to-top,
body:has(.wp-block-navigation__responsive-container.is-menu-open) .athena-to-top {
	opacity: 0;
	visibility: hidden;
}

/* Where the wide content reaches into the button's corner (below 80rem + 2 × 4.5rem), the
   footer keeps a gutter on the right, so the button passes over empty footer, never its links. */
@media (max-width: 89rem) {
	:root.has-back-to-top .site-footer {
		padding-right: max(var(--wp--style--root--padding-right, 0px), calc(4.5rem + env(safe-area-inset-right, 0px)));
	}
}

/* Focus lands on the header after the jump; outlined inside it, not over the page. */
.site-header[tabindex="-1"]:focus {
	outline: none;
}

.site-header[tabindex="-1"]:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: -2px;
	border-radius: 0;
}

@media print {
	.athena-to-top {
		display: none;
	}
}

/* ── 4. Primitives ───────────────────────────────────────────────── */

.is-style-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0;
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 750;
	letter-spacing: 0.14em;
	line-height: 1.3;
	text-transform: uppercase;
}

.is-style-eyebrow::before {
	content: "";
	flex: none;
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: currentColor;
}

.has-text-align-center.is-style-eyebrow {
	justify-content: center;
}

.athena-lead {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.55;
}

.wp-block-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 3rem;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.25s var(--athena-ease), box-shadow 0.25s ease;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
	box-shadow: 0 6px 16px -10px rgb(148 49 250 / 0.55);
}

.wp-block-button .wp-block-button__link:hover {
	transform: translateY(-1px);
}

.wp-block-button .wp-block-button__link:active {
	transform: translateY(0);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	border: 1.5px solid var(--athena-border-strong) !important;
	background: transparent !important;
	color: var(--wp--preset--color--contrast) !important;
	padding-top: calc(0.9rem - 1.5px);
	padding-bottom: calc(0.9rem - 1.5px);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--brand) !important;
	color: var(--wp--preset--color--contrast) !important;
}

.athena-arrow-link a,
a.athena-arrow-link {
	font-weight: 650;
	text-decoration: none;
}

/* A taller touch target: vertical padding on an inline link widens what it
   catches without moving any line, and the link can still wrap. */
.athena-arrow-link a {
	padding-block: 0.65rem;
}

.athena-arrow-link a::after,
a.athena-arrow-link::after {
	content: "\2192"; /* → (escaped so the file stays ASCII-safe in any encoding) */
	display: inline-block;
	margin-left: 0.35rem;
	transition: transform 0.25s var(--athena-ease);
}

.athena-arrow-link a:hover::after,
a.athena-arrow-link:hover::after {
	transform: translateX(4px);
}

/* Link to another Athena site (demo.a-x.ai): north-east arrow, decorative. */
.athena-cta-external .wp-block-button__link::after {
	content: "\2197" / "";
	display: inline-block;
	margin-left: 0.4rem;
	transition: transform 0.25s var(--athena-ease);
}

.athena-cta-external .wp-block-button__link:hover::after,
.athena-cta-external .wp-block-button__link:focus-visible::after {
	transform: translate(2px, -2px);
}

.athena-section {
	position: relative;
}

.athena-section__head {
	max-width: 48rem;
}

/* Editor-only helper for the colour-scheme/language placeholders. */
.athena-editor-chip {
	padding: 0.4rem 0.75rem;
	border: 1px dashed var(--wp--preset--color--border);
	border-radius: 999px;
	font-size: 0.8125rem;
}

/* Pending-approval content (visible to logged-in editors only). */
.is-pending-approval {
	position: relative;
	outline: 2px dashed #b54708;
	outline-offset: 6px;
}

.is-pending-approval::before {
	content: "Pending approval \2014  hidden from visitors";
	position: absolute;
	z-index: 5;
	top: -0.9rem;
	left: 1rem;
	padding: 0.15rem 0.6rem;
	border-radius: 6px;
	background: #b54708;
	color: #fff;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}

/* ── 5. Homepage sections ────────────────────────────────────────── */

/* Grid containers built on flow-layout groups: cancel the flow margins. */
.athena-hero__grid > *,
.athena-pillars__grid > *,
.athena-integrations__grid > *,
.athena-proof__card > *,
.athena-proof__stats > *,
.athena-clients__logos > *,
.athena-cta__row > *,
.site-footer__grid > * {
	margin-block: 0 !important;
}

/* Hero */
/* The glow is a background, not a positioned box: a hero that grows (Category
   Navigation's demo loads more products) moves a box placed at top: -20%, which the
   browser counts as a layout shift. Same placement as that box: a min(60rem, 80vw)
   square, its top 20% of the hero's height above the hero, its right edge 10% of the
   hero's width past the hero's right edge (background-position % = % of hero - glow).
   A short hero (company pages) ends before the glow has faded, which reads as a hard
   line along its bottom edge. The first layer fades the glow out into the page colour
   (every hero sits directly on --base) over the bottom of the hero, so it never ends
   abruptly, whatever the hero's height. */
.athena-hero {
	--athena-glow-size: min(60rem, 80vw);
	position: relative;
	overflow: clip;
	isolation: isolate;
	--athena-hero-fade: var(--wp--preset--color--base);
	--athena-hero-glow: var(--athena-glow);
	background-image:
		linear-gradient(to top, var(--athena-hero-fade), transparent min(16rem, 45%)),
		radial-gradient(closest-side, var(--athena-hero-glow), transparent 70%);
	background-repeat: no-repeat;
	background-size:
		100% 100%,
		var(--athena-glow-size) var(--athena-glow-size);
	background-position:
		0 0,
		calc(110% + 0.1 * var(--athena-glow-size))
		calc(-20% - 0.2 * var(--athena-glow-size));
}

.athena-hero__grid {
	display: grid !important;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: clamp(2rem, 5vw, 5rem) !important;
	align-items: center;
}

.athena-hero__copy {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	max-width: 36rem;
}

.athena-hero__copy > * {
	margin: 0 !important;
}

.athena-hero h1 {
	font-size: clamp(2.375rem, 1.55rem + 3.3vw, 4.25rem);
}

.athena-hero h1 mark {
	background: none;
	color: var(--wp--preset--color--accent);
}

.athena-hero__sub {
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 650;
	line-height: 1.4;
}

.athena-hero__desc {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--medium);
	max-width: 32rem;
}

.athena-hero__visual {
	min-width: 0;
}

@media (max-width: 1240px) {
	.athena-hero__grid {
		grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
		align-items: start;
	}

	.athena-hero__copy {
		padding-top: 1.5rem;
	}
}

@media (max-width: 960px) {
	.athena-hero__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.athena-hero__copy {
		padding-top: 0;
	}

	.athena-hero__copy {
		max-width: 40rem;
	}
}

/* Showcase */
.athena-showcase {
	background: var(--wp--preset--color--surface);
}

/* Pillars: horizontal journey with numbered nodes */
.athena-pillars__grid {
	position: relative;
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.5rem, 4vw, 4rem) !important;
	margin-top: clamp(2.5rem, 5vw, 4rem) !important;
}

.athena-pillars__grid::before {
	content: "";
	position: absolute;
	top: 1.375rem;
	left: 1.375rem;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, var(--wp--preset--color--brand), color-mix(in srgb, #3fcadd 70%, transparent) 60%, transparent);
	opacity: 0.6;
}

.athena-pillar {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}

.athena-pillar > * {
	margin: 0 !important;
}

.athena-pillar__icon {
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	margin-bottom: 0.75rem !important;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--brand) 35%, var(--wp--preset--color--border));
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--accent);
	box-shadow: 0 0 0 6px var(--wp--preset--color--base);
}

.athena-pillar__icon svg {
	width: 22px;
	height: 22px;
}

.athena-pillar__kicker {
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 750;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.athena-pillar p {
	color: var(--wp--preset--color--muted);
}

.athena-pillar .athena-arrow-link {
	margin-top: auto !important;
	padding-top: 0.25rem;
}

/* Each pillar leads to one product page: its link covers the whole pillar
   (single tab stop), with the focus ring around the pillar. */
.athena-pillar .athena-arrow-link a::before {
	content: "";
	position: absolute;
	z-index: 2;
	inset: -0.75rem;
	border-radius: 16px;
}

.athena-pillar .athena-arrow-link a:focus-visible {
	outline: none;
}

.athena-pillar .athena-arrow-link a:focus-visible::before {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 0;
}

.athena-pillar h3 {
	transition: color 0.25s ease;
}

/* Only a pillar with a link reacts to the pointer; one without (its page withdrawn,
   patterns/home-pillars.php) is plain text. */
.athena-pillar:has(.athena-arrow-link a):hover h3 {
	color: var(--wp--preset--color--accent);
}

.athena-pillar:hover .athena-arrow-link a::after {
	transform: translateX(4px);
}

.athena-pillar ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.athena-pillar li {
	padding: 0.25rem 0.65rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
}

@media (max-width: 860px) {
	.athena-pillars__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 2.5rem !important;
	}

	.athena-pillars__grid::before {
		top: 1.375rem;
		bottom: 1.375rem;
		left: 1.375rem;
		right: auto;
		width: 1px;
		height: auto;
		background: linear-gradient(180deg, var(--wp--preset--color--brand), transparent);
	}

	.athena-pillar {
		padding-left: 4rem;
	}

	.athena-pillar__icon {
		position: absolute;
		left: 0;
		top: 0;
	}
}

/* Pillar icons: CSS masks keep the editable content free of markup. */
.athena-pillar::before,
.athena-pillar::after {
	content: "";
	display: block;
	width: 2.75rem;
	height: 2.75rem;
}

.athena-pillar::before {
	margin-bottom: 0.75rem;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--brand) 35%, var(--wp--preset--color--border));
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	box-shadow: 0 0 0 6px var(--wp--preset--color--base);
}

.athena-pillar::after {
	position: absolute;
	top: 0;
	left: 0;
	background: var(--wp--preset--color--accent);
	-webkit-mask: var(--athena-icon) center / 22px no-repeat;
	mask: var(--athena-icon) center / 22px no-repeat;
}

.athena-pillars .athena-pillar {
	gap: 0.85rem;
}

@media (max-width: 860px) {
	.athena-pillar::before {
		position: absolute;
		top: 0;
		left: 0;
		margin: 0;
	}
}

.athena-pillar--discover {
	--athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4.5 4.5'/%3E%3C/svg%3E");
}

.athena-pillar--guide {
	--athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M4.5 6.5a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H11l-4 3.5v-3.5H6.5a2 2 0 0 1-2-2z'/%3E%3Cpath d='M8.5 10.5h7' stroke-linecap='round'/%3E%3C/svg%3E");
}

.athena-pillar--optimize {
	--athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 20V12M12 20V5M19 20v-5'/%3E%3Ccircle cx='5' cy='10' r='2'/%3E%3Ccircle cx='12' cy='3.5' r='0.01'/%3E%3Ccircle cx='19' cy='13' r='2'/%3E%3C/svg%3E");
}

.athena-pillar--measure {
	--athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4v16h16'/%3E%3Cpath d='m7.5 15 4-4.5 3 3L20 7.5'/%3E%3C/svg%3E");
}

/* Four pillars: one row of four from 1200 px, two by two on tablets (the journey line
   only runs along a full row, so it is left out there); one column on phones as before. */
@media (min-width: 1200px) {
	.athena-pillars__grid:has(> :nth-child(4)) {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: clamp(1.5rem, 3vw, 2.75rem) !important;
	}
}

@media (min-width: 861px) and (max-width: 1199px) {
	.athena-pillars__grid:has(> :nth-child(4)) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 3rem !important;
	}

	.athena-pillars__grid:has(> :nth-child(4))::before {
		display: none;
	}
}

@media (max-width: 1200px) {
	.site-header .site-header__nav {
		order: 3;
		flex: 0 0 auto;
	}

	.site-header .wp-block-navigation__responsive-container-open {
		border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 20%, transparent);
		border-radius: 999px;
	}
}

/* Proof */
.athena-proof__card {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: clamp(1.5rem, 4vw, 4rem) !important;
	padding: clamp(1.5rem, 4vw, 3.5rem) !important;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 28px;
	background: var(--wp--preset--color--raised);
}

.athena-proof__stats {
	display: grid !important;
	gap: 1.5rem !important;
	align-content: center;
}

.athena-stat {
	padding-left: 1.25rem;
	border-left: 3px solid var(--wp--preset--color--brand);
}

.athena-stat > * {
	margin: 0 !important;
}

.athena-stat__value {
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1.1;
}

.athena-stat__label {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

.athena-proof__source {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--x-small);
}

/* Client logos: one tone per colour scheme, sized by eye so they read as equals. */
.athena-clients .is-style-eyebrow {
	display: flex;
}

.athena-clients__logos {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 1.75rem clamp(2rem, 4.5vw, 3.75rem) !important;
	margin-top: var(--wp--preset--spacing--30) !important;
}

.athena-client img,
.athena-testimonial__logo img {
	display: block;
	width: auto !important;
	height: var(--athena-client-height, 1.625rem) !important;
	max-width: 100%;
	opacity: 0.62;
	filter: brightness(0);
}

.athena-client--fashion-friends { --athena-client-height: 1.25rem; }
.athena-client--a1 { --athena-client-height: 2.5rem; }
.athena-client--dexyco { --athena-client-height: 1.75rem; }
.athena-client--xyz { --athena-client-height: 2.125rem; }

:root[data-color-scheme="dark"] .athena-client img,
:root[data-color-scheme="dark"] .athena-testimonial__logo img {
	opacity: 0.78;
	filter: brightness(0) invert(1);
}

@media (prefers-color-scheme: dark) {
	:root:not([data-color-scheme="light"]) .athena-client img,
	:root:not([data-color-scheme="light"]) .athena-testimonial__logo img {
		opacity: 0.78;
		filter: brightness(0) invert(1);
	}
}

@media (max-width: 600px) {
	.athena-clients__logos {
		gap: 1.5rem 2rem !important;
	}
	.athena-client img {
		height: calc(var(--athena-client-height, 1.625rem) * 0.85) !important;
	}
}

@media (max-width: 860px) {
	.athena-proof__card {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Integrations */
.athena-integrations__grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem !important;
	margin-top: clamp(2rem, 4vw, 3rem) !important;
}

@media (min-width: 1280px) {
	.athena-integrations__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* Type, title, text and link share rows, so a wrapped title keeps the texts aligned. */
@supports (grid-template-rows: subgrid) {
	.athena-integrations__grid > .athena-integration {
		display: grid;
		grid-row: span 4;
		grid-template-rows: subgrid;
	}
}

.athena-integration {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	padding: 1.75rem !important;
	border: 1px solid var(--athena-border-strong);
	border-radius: 20px;
	background: var(--wp--preset--color--raised);
	transition: translate 0.35s var(--athena-ease), border-color 0.25s ease, box-shadow 0.35s ease;
}

.athena-integration > * {
	margin: 0 !important;
}

/* Only a card that links somewhere lifts; a card without a link (Products\link_card()
   with no URL) stays still. The lift is `translate`, not `transform`, so it still works
   while the scroll reveal (section 6) animates the card's transform. */
.athena-integration:has(h3 a):hover,
.athena-integration:focus-within {
	translate: 0 -3px;
	border-color: var(--wp--preset--color--brand);
	box-shadow: var(--athena-shadow-raised);
}

.athena-integration__type {
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 750;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.athena-integration h3 a {
	color: inherit;
	text-decoration: none;
}

/* Whole card clickable via the heading link (single tab stop); its focus ring
   is drawn around the card. Text stays selectable with the keyboard or a
   double-click on the heading. */
.athena-integration h3 a::after {
	content: "";
	position: absolute;
	z-index: 2;
	inset: 0;
	border-radius: 20px;
}

.athena-integration h3 a:focus-visible {
	outline: none;
}

.athena-integration h3 a:focus-visible::after {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

.athena-integration:hover h3 a {
	color: var(--wp--preset--color--accent);
}

/* "Explore →" is a cue, not a second link: it moves with the card. */
.athena-integration__more {
	transition: transform 0.25s var(--athena-ease);
}

.athena-integration:hover .athena-integration__more,
.athena-integration:focus-within .athena-integration__more {
	transform: translateX(4px);
}

.athena-integration p:not(.athena-integration__type):not(.athena-integration__more) {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

.athena-integration__more {
	margin-top: auto !important;
	padding-top: 0.5rem;
	color: var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 650;
}

.athena-integrations__links {
	gap: 1.5rem 2rem !important;
}

/* Capability card: icon tile, title, text. Product page capabilities and the
   home page's "Why Athena". The icon is a CSS mask, so a card is only text. */
.athena-cap {
	position: relative;
	display: grid;
	align-content: start;
	gap: 0.5rem;
	padding: 1.75rem !important;
	border: 1px solid var(--athena-border-strong);
	border-radius: 20px;
	background: var(--wp--preset--color--raised);
}

.athena-cap > * {
	position: relative;
	z-index: 1;
	margin-block: 0 !important;
}

.athena-cap h3 {
	font-size: var(--wp--preset--font-size--large);
}

.athena-cap p {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

.athena-cap::before {
	content: "";
	position: relative;
	z-index: 1;
	width: 2.75rem;
	height: 2.75rem;
	margin-bottom: 0.5rem;
	border-radius: 12px;
	background-color: var(--wp--preset--color--accent-soft);
	background-image: linear-gradient(var(--wp--preset--color--accent), var(--wp--preset--color--accent));
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	-webkit-mask: var(--athena-icon) center / 1.5rem no-repeat;
	mask: var(--athena-icon) center / 1.5rem no-repeat;
}

/* A soft tile behind the masked icon. */
.athena-cap::after {
	content: "";
	position: absolute;
	z-index: 0;
	top: 1.75rem;
	left: 1.75rem;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 12px;
	background: var(--wp--preset--color--accent-soft);
}

.athena-cap--search { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4.5 4.5'/%3E%3C/svg%3E"); }
.athena-cap--suggest { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='4' width='18' height='6' rx='2'/%3E%3Cpath d='M5 14h14M5 18.5h9'/%3E%3C/svg%3E"); }
.athena-cap--tune { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 7h9M18 7h2M4 17h2M11 17h9'/%3E%3Ccircle cx='15.5' cy='7' r='2.5'/%3E%3Ccircle cx='8.5' cy='17' r='2.5'/%3E%3C/svg%3E"); }
.athena-cap--chart { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 20h16M7 16v-5M12 16V6M17 16v-8'/%3E%3C/svg%3E"); }
.athena-cap--person { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5 20a7.5 7.5 0 0 1 15 0'/%3E%3C/svg%3E"); }
.athena-cap--loop { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14-4.5L4 8.5M4 4v4.5h4.5M4 13a8 8 0 0 0 14 4.5l2-2M20 20v-4.5h-4.5'/%3E%3C/svg%3E"); }
.athena-cap--camera { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M4 8h3.5L9 5.5h6L16.5 8H20a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3Ccircle cx='12' cy='13' r='3.5'/%3E%3C/svg%3E"); }
.athena-cap--crop { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M7 2v15h15M2 7h15v15'/%3E%3C/svg%3E"); }
.athena-cap--box { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='m12 3 8 4.5v9L12 21l-8-4.5v-9zM4 7.5l8 4.5 8-4.5M12 12v9'/%3E%3C/svg%3E"); }
.athena-cap--text { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 6V4.5h14V6M12 4.5v15M9 19.5h6'/%3E%3C/svg%3E"); }
.athena-cap--look { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M9 4 4 7l2 4 2-1v10h8V10l2 1 2-4-5-3c-.5 1.5-1.7 2.2-3 2.2S9.500 5.500 9 4z'/%3E%3C/svg%3E"); }
.athena-cap--mic { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='3.500' width='6' height='11' rx='3'/%3E%3Cpath d='M6 11.500a6 6 0 0 0 12 0M12 17.500v3'/%3E%3C/svg%3E"); }
.athena-cap--phone { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='7' y='2.500' width='10' height='19' rx='2.500'/%3E%3Cpath d='M11 18.500h2'/%3E%3C/svg%3E"); }
.athena-cap--tags { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M3.500 12V4.500h7.500l9.500 9.500-7.500 7.500z'/%3E%3Ccircle cx='8' cy='9' r='1' fill='%23000'/%3E%3C/svg%3E"); }
.athena-cap--shield { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M12 3 5 6v6c0 4.500 3 7.500 7 9 4-1.500 7-4.500 7-9V6z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E"); }
.athena-cap--hand { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='8.500'/%3E%3Cpath d='M9 10v.5M15 10v.5M8.500 14.500a4.500 4.500 0 0 0 7 0'/%3E%3C/svg%3E"); }
.athena-cap--book { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M5 4.500h11a3 3 0 0 1 3 3V20H8a3 3 0 0 1-3-3zM5 17a3 3 0 0 1 3-3h11'/%3E%3C/svg%3E"); }
.athena-cap--compare { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='7.500' height='14' rx='1.500'/%3E%3Crect x='13.500' y='5' width='7.500' height='14' rx='1.500'/%3E%3C/svg%3E"); }
.athena-cap--cart { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h2.200l1.900 10h9.600l1.800-7.500H7'/%3E%3Ccircle cx='9.500' cy='19' r='1.200'/%3E%3Ccircle cx='16.500' cy='19' r='1.200'/%3E%3C/svg%3E"); }
.athena-cap--compass { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.500'/%3E%3Cpath d='m15.500 8.500-2 5-5 2 2-5z'/%3E%3C/svg%3E"); }
.athena-cap--chat { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M4 5h16v11H10l-4 3.500V16H4z'/%3E%3Cpath d='M8 10.500h.01M12 10.500h.01M16 10.500h.01'/%3E%3C/svg%3E"); }
.athena-cap--speed { --athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 17.500a8 8 0 1 1 16 0'/%3E%3Cpath d='m12 15.500 4-4.500'/%3E%3C/svg%3E"); }

/* Why Athena (home): three capability cards in a row, stacked on phones. */
.athena-why__grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem !important;
	margin-top: clamp(2rem, 4vw, 3rem) !important;
}

.athena-why__grid > * {
	margin-block: 0 !important;
}

.athena-why__more {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 2rem;
	margin-top: var(--wp--preset--spacing--40) !important;
}

.athena-why__more > * {
	margin: 0 !important;
}

@media (max-width: 900px) {
	.athena-why__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.athena-why .athena-cap {
		padding: 1.5rem !important;
	}

	.athena-why .athena-cap::after {
		top: 1.5rem;
		left: 1.5rem;
	}
}

@media (max-width: 600px) {
	.athena-integrations__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Client testimonials. Stacked cards are the base (editor, no JavaScript); the
   one-at-a-time viewer applies under .has-js, set before first paint. */
.athena-testimonials .athena-section__head,
.athena-testimonials .athena-testimonials__viewer,
.athena-testimonials .athena-testimonials__slides {
	max-width: 60rem !important;
}

/* The slide shift must never widen the page. */
.athena-testimonials {
	overflow-x: clip;
}

.athena-testimonials .athena-section__head {
	margin-inline: auto;
}

.athena-testimonials__viewer {
	width: 100%;
	margin-inline: auto;
}

.athena-testimonials__slides {
	display: grid;
	gap: 1.5rem;
	margin-top: var(--wp--preset--spacing--30) !important;
	margin-inline: auto;
}

.athena-testimonial {
	--athena-testimonial-pad: clamp(1.25rem, 2.5vw, 1.75rem);
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	min-width: 0;
	padding: var(--athena-testimonial-pad) !important;
	padding-left: calc(var(--athena-testimonial-pad) + 3.25rem) !important;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 20px;
	background:
		radial-gradient(90% 60% at 100% 0%, var(--athena-glow), transparent 70%),
		var(--wp--preset--color--raised);
	box-shadow: var(--athena-shadow-raised);
}

.athena-testimonial::before {
	content: "\201C";
	content: "\201C" / "";
	position: absolute;
	top: calc(var(--athena-testimonial-pad) - 0.25rem);
	left: var(--athena-testimonial-pad);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 4.5rem;
	font-weight: 700;
	line-height: 1;
	background: var(--wp--preset--gradient--brand-signal);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.athena-testimonials__slides > .athena-testimonial,
.athena-testimonial > *,
.athena-testimonial__footer > *,
.athena-testimonial__person > * {
	margin: 0 !important;
}

/* Short quotes sit balanced in the height reserved for the longest one. */
.athena-testimonial .wp-block-quote {
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
	margin-block: auto !important;
	padding: 0;
	border: 0;
}

.athena-testimonial .wp-block-quote p {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: -0.005em;
	text-wrap: pretty;
}

.athena-testimonial--short .wp-block-quote p {
	font-size: 1.5rem;
	line-height: 1.35;
}

.athena-testimonial__footer {
	display: flex;
	align-items: center;
	gap: 0.875rem;
}

.athena-testimonial__photo {
	flex: none;
}

.athena-testimonial__photo img {
	display: block;
	width: 3.5rem !important;
	height: 3.5rem !important;
	border-radius: 50%;
	object-fit: cover;
}

.athena-testimonial__person {
	flex: 1;
	min-width: 0;
}

.athena-testimonial__name {
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.35;
}

.athena-testimonial__role {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--x-small);
	line-height: 1.4;
}

.athena-testimonial__logo {
	--athena-client-height: 1.5rem;
	flex: none;
}

.athena-testimonial__logo--fashion-friends { --athena-client-height: 1.125rem; }
.athena-testimonial__logo--wurth { --athena-client-height: 1.375rem; }

/* Viewer: every slide shares one grid cell, so the tallest reserves the height. */
.athena-testimonials__nav {
	display: none;
}

.has-js .athena-testimonials__viewer .athena-testimonials__slides {
	grid-template-columns: minmax(0, 1fr);
	touch-action: pan-y pinch-zoom;
}

.has-js .athena-testimonials__viewer .athena-testimonial {
	grid-area: 1 / 1;
	visibility: hidden;
}

.has-js .athena-testimonials__viewer .athena-testimonial.is-active {
	visibility: visible;
}

.has-js .athena-testimonials__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	margin-top: 0.75rem;
}

.athena-testimonials__clients {
	display: flex;
	flex: 1;
	gap: 0.375rem;
	min-width: 0;
}

.athena-testimonials__client {
	position: relative;
	display: flex;
	flex: 1 1 0;
	align-items: center;
	gap: 0.625rem;
	min-width: 0;
	min-height: 3.25rem;
	padding: 0.375rem 0.75rem 0.375rem 0.375rem;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--muted) 45%, var(--wp--preset--color--border));
	border-radius: 14px;
	background: transparent;
	color: var(--wp--preset--color--contrast);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}

.athena-testimonials__client:hover {
	border-color: var(--wp--preset--color--accent);
}

.athena-testimonials__client img {
	flex: none;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	object-fit: cover;
}

.athena-testimonials__client-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.athena-testimonials__client-name {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	line-height: 1.25;
}

.athena-testimonials__client-company {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--x-small);
	line-height: 1.3;
}

/* Selected: a 2px outline, raised fill and heavier name, so it is not colour alone. */
.athena-testimonials__client[aria-selected="true"] {
	border-color: var(--wp--preset--color--accent);
	background: var(--wp--preset--color--raised);
	box-shadow: inset 0 0 0 1px var(--wp--preset--color--accent);
}

.athena-testimonials__client[aria-selected="true"] .athena-testimonials__client-name {
	font-weight: 800;
}

.athena-testimonials__arrows {
	display: flex;
	flex: none;
	gap: 0.5rem;
}

.athena-testimonials__arrow {
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 50%;
	background: transparent;
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
	transition: border-color 0.2s ease;
}

.athena-testimonials__arrow:hover {
	border-color: var(--wp--preset--color--accent);
}

@media (max-width: 1023px) {
	.athena-testimonials__client {
		padding-right: 0.5rem;
	}
	.athena-testimonials__client-name {
		font-size: 0.8125rem;
	}
}

@media (max-width: 767px) {
	.athena-testimonial {
		padding-left: var(--athena-testimonial-pad) !important;
	}
	/* Quotation mark and logo share the top row. */
	.athena-testimonial::before {
		position: static;
		display: block;
		width: fit-content;
		height: 1.75rem;
		font-size: 3.5rem;
	}
	.athena-testimonial .wp-block-quote p {
		font-size: 1.0625rem;
		font-weight: 450;
		line-height: 1.45;
		letter-spacing: 0;
	}
	.athena-testimonial--short .wp-block-quote p {
		font-size: 1.125rem;
	}
	.athena-testimonial__logo {
		position: absolute;
		top: var(--athena-testimonial-pad);
		right: var(--athena-testimonial-pad);
	}
	.athena-testimonial__photo img {
		width: 3rem !important;
		height: 3rem !important;
	}
	.athena-testimonials__clients {
		flex: none;
	}
	.athena-testimonials__client {
		flex: none;
		width: 3.25rem;
		height: 3.25rem;
		justify-content: center;
		padding: 0;
		border-radius: 50%;
	}
	.athena-testimonials__client-text {
		display: none;
	}
}

/* Final CTA (always dark) */
.athena-cta__card {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	border-radius: 32px;
	border: 1px solid rgb(255 255 255 / 0.06);
}

.athena-cta__card::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: auto -20% -60% auto;
	width: 70%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(closest-side, rgb(148 49 250 / 0.45), rgb(63 202 221 / 0.08) 60%, transparent 75%);
	pointer-events: none;
}

:root[data-color-scheme="dark"] .athena-cta__card {
	background-image: linear-gradient(160deg, rgb(148 49 250 / 0.14), rgb(255 255 255 / 0.02) 45%);
	border-color: rgb(195 155 255 / 0.2);
}

@media (prefers-color-scheme: dark) {
	:root:not([data-color-scheme="light"]) .athena-cta__card {
		background-image: linear-gradient(160deg, rgb(148 49 250 / 0.14), rgb(255 255 255 / 0.02) 45%);
		border-color: rgb(195 155 255 / 0.2);
	}
}

.athena-cta__card::after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 10%;
	right: 10%;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgb(195 155 255 / 0.6), transparent);
}

.athena-cta__card h2 {
	color: #fff;
	max-width: 22ch;
}

.athena-cta__row {
	gap: 2rem 4rem !important;
}

.athena-cta__text {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	max-width: 40rem;
}

.athena-cta__text > * {
	margin: 0 !important;
}

.athena-cta__card p {
	color: #c9cae0;
}

/* "How pricing works": a text link beside the ask, white on the ink card in both schemes. */
.athena-cta__card .athena-cta__pricing a {
	color: #fff;
	text-decoration: underline;
	text-decoration-color: rgb(255 255 255 / 0.45);
	text-underline-offset: 0.2em;
}

.athena-cta__card .athena-cta__pricing a:hover {
	text-decoration-color: #fff;
}

.athena-cta__card .athena-cta__pricing a:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
	border-radius: 2px;
}

.athena-cta__card .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: rgb(255 255 255 / 0.7) !important;
	color: #fff !important;
}

.athena-cta__card .wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: #fff !important;
}

/* Trust row under the CTA card (and on pages that end without it: inc/product-pages.php
   trust_row()): four static facts, 4 → 2 → 1 columns. Icons are CSS masks chosen by
   the item's class, like the pillars; no class, no icon. */
.athena-trust {
	display: flex;
	justify-content: space-between;
	gap: 1.25rem 2.5rem;
	margin-top: var(--wp--preset--spacing--40);
	padding-inline: clamp(0.25rem, 3vw, 3rem);
}

.athena-trust > .athena-trust__item {
	flex: 0 1 auto;
	max-width: 20rem;
}

.athena-trust__item {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 2.25rem;
	margin: 0 !important;
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 550;
	line-height: 1.45;
}

.athena-trust__item[class*="athena-trust__item--"] {
	padding-left: 3rem;
}

.athena-trust__item[class*="athena-trust__item--"]::before,
.athena-trust__item[class*="athena-trust__item--"]::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 2.25rem;
	height: 2.25rem;
	margin-top: -1.125rem;
	border-radius: 50%;
}

.athena-trust__item[class*="athena-trust__item--"]::before {
	box-sizing: border-box;
	border: 1.5px solid color-mix(in srgb, var(--wp--preset--color--accent) 55%, var(--wp--preset--color--border));
	background: var(--wp--preset--color--surface);
}

.athena-trust__item[class*="athena-trust__item--"]::after {
	background: var(--wp--preset--color--accent);
	-webkit-mask: var(--athena-icon, none) center / 20px no-repeat;
	mask: var(--athena-icon, none) center / 20px no-repeat;
}

.athena-trust__item--certified {
	--athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 5 6v5.5c0 4.2 3 7.6 7 9 4-1.4 7-4.8 7-9V6z'/%3E%3Cpath d='m9 12 2.2 2.2 4.3-4.4'/%3E%3C/svg%3E");
}

.athena-trust__item--gdpr {
	--athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='10.5' width='14' height='10' rx='2'/%3E%3Cpath d='M8.5 10.5v-3a3.5 3.5 0 0 1 7 0v3'/%3E%3C/svg%3E");
}

.athena-trust__item--hosting {
	--athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 18.5h10.5a4 4 0 0 0 .6-7.95A6 6 0 0 0 6.6 9.6 4.5 4.5 0 0 0 7 18.5z'/%3E%3C/svg%3E");
}

.athena-trust__item--launch {
	--athena-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E");
}

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

	.athena-trust > .athena-trust__item {
		max-width: none;
	}
}

@media (max-width: 559px) {
	.athena-trust {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}
}

/* ── 6. Motion ───────────────────────────────────────────────────── */

@media (prefers-reduced-motion: no-preference) {
	/* Hero copy: one staggered rise on load. Starts at 0.01 opacity, never 0. */
	.athena-hero__copy > * {
		animation: athena-rise 0.9s var(--athena-ease) both;
	}

	.athena-hero__copy > :nth-child(2) {
		animation-delay: 0.06s;
	}

	.athena-hero__copy > :nth-child(3) {
		animation-delay: 0.14s;
	}

	.athena-hero__copy > :nth-child(4) {
		animation-delay: 0.2s;
	}

	.athena-hero__copy > :nth-child(5) {
		animation-delay: 0.26s;
	}

	.athena-hero__visual {
		animation: athena-float-in 1.1s var(--athena-ease) 0.15s both;
	}

	/* Scroll reveal: CSS scroll-driven animations only (no JS). Browsers
	   without support simply show the content. */
	@supports (animation-timeline: view()) {
		/* A whole-card link (.athena-integration: its heading link's ::after covers the card)
		   reveals as one piece. An animated transform on the heading would make the heading
		   the containing block of that ::after, so only the title would be clickable. */
		.athena-reveal > *,
		.athena-reveal-items > :not(.athena-integration) > *,
		.athena-reveal-items > .athena-integration {
			animation: athena-reveal linear both;
			animation-timeline: view();
			animation-range: entry 5% entry 45%;
		}

		.site-header {
			animation: athena-header-shade linear both;
			animation-timeline: scroll(root);
			animation-range: 0 120px;
		}
	}
}

@keyframes athena-rise {
	from {
		opacity: 0.01;
		transform: translateY(22px);
	}

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

@keyframes athena-float-in {
	from {
		opacity: 0.01;
		transform: translateY(28px) scale(0.98);
	}

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

@keyframes athena-reveal {
	from {
		opacity: 0;
		transform: translateY(32px);
	}

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

@keyframes athena-header-shade {
	from {
		box-shadow: 0 0 0 transparent;
	}

	to {
		box-shadow: 0 8px 24px -16px rgb(3 3 41 / 0.25);
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}

/* ── 7. Forms, legacy pages, utilities ───────────────────────────── */

.wpcf7-form {
	display: grid;
	gap: 1.1rem;
}

.wpcf7-form p {
	margin: 0;
}

.wpcf7-form label {
	display: grid;
	gap: 0.4rem;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 650;
}

.wpcf7-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.wpcf7-form textarea,
.wpcf7-form select {
	box-sizing: border-box;
	width: 100%;
	min-height: 3rem;
	padding: 0.75rem 0.9rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background: var(--wp--preset--color--raised);
	color: var(--wp--preset--color--contrast);
	font: inherit;
	font-weight: 450;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Placeholders use the muted text colour (8.5:1 light, 8.8:1 dark); the browser default
   grey is too faint on the dark raised surface. */
.wpcf7-form input::placeholder,
.wpcf7-form textarea::placeholder {
	color: var(--wp--preset--color--muted);
	opacity: 1;
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.wpcf7-form select:focus {
	border-color: var(--wp--preset--color--brand);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--wp--preset--color--brand) 18%, transparent);
	outline: none;
}

.wpcf7-form .wpcf7-submit {
	justify-self: start;
	min-height: 3rem;
	padding: 0.9rem 1.75rem;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--brand);
	color: #fff;
	font: inherit;
	font-weight: 650;
	cursor: pointer;
}

.wpcf7-form .wpcf7-submit:hover {
	background: #7b22d9;
}

.wpcf7-not-valid-tip {
	margin-top: 0.3rem;
	color: #d92d20;
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
}

:root[data-color-scheme="dark"] .wpcf7-not-valid-tip {
	color: #fda29b;
}

.wpcf7 form .wpcf7-response-output {
	margin: 0;
	padding: 0.85rem 1rem;
	border-radius: 12px;
}

.athena-form-card {
	padding: clamp(1.5rem, 4vw, 2.5rem) !important;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 24px;
	background: var(--wp--preset--color--raised);
	box-shadow: var(--athena-shadow-raised);
}

.athena-page-header {
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.athena-page-header--feature > * + * {
	margin-top: var(--wp--preset--spacing--30);
}

/* Block-level so the constrained layout aligns it with the title. */
.athena-page-header--feature > .is-style-eyebrow {
	display: flex;
}

.athena-page-lead {
	max-width: 46rem;
}

/* The constrained layout centres a narrower child; start it at the 80rem column instead. */
.athena-page-header--feature > .athena-page-lead {
	margin-left: max(0px, (100% - 80rem) / 2) !important;
}

.athena-page-lead p {
	margin: 0;
}

.athena-last-updated {
	gap: 0.35em !important;
	margin-top: 0.75rem;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
}

.athena-last-updated > * {
	margin: 0 !important;
}

.athena-legal-content {
	overflow-wrap: anywhere;
}

.athena-legal-content :where(h2, h3) {
	line-height: 1.25;
	text-wrap: balance;
}

.athena-legal-content h2 {
	font-size: clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem);
}

.athena-legal-content h3 {
	font-size: 1.125rem;
}

.athena-legal-content :where(ul, ol) {
	padding-inline-start: 1.5rem;
}

.athena-legal-content :where(li + li) {
	margin-top: 0.5rem;
}

/* Table cells get a scrollable frame so wide tables never widen the page. */
.athena-legal-content .wp-block-table {
	overflow-x: auto;
}

/* 404 / 410 page (patterns/hidden-404.php): heading, line and search at reading width, then
   the products and the popular pages as two link lists, side by side from 961 px. */
.athena-not-found > :where(h1, .athena-lead, .athena-not-found__search) {
	max-width: 46rem;
}

.athena-not-found > .athena-lead {
	margin-top: var(--wp--preset--spacing--20);
}

.athena-not-found__search {
	margin-top: var(--wp--preset--spacing--40);
}

.athena-not-found__links {
	display: grid;
	gap: var(--wp--preset--spacing--40) clamp(2rem, 4vw, 4rem);
	margin-top: var(--wp--preset--spacing--50);
}

.athena-not-found__links > *,
.athena-not-found__group > h2 {
	margin: 0;
	font-size: var(--wp--preset--font-size--x-large);
}

.athena-not-found .athena-link-list {
	grid-template-columns: minmax(0, 1fr);
	gap: 0.5rem;
	margin-top: var(--wp--preset--spacing--20) !important;
}

@media (min-width: 961px) {
	.athena-not-found__links {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* The document's other languages, under its title (inc/legal.php). */
.athena-legal-langs ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1.25rem;
	margin: 0.5rem 0 0;
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--small);
}

.athena-legal-langs a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

.athena-legal-langs a[aria-current] {
	color: var(--wp--preset--color--contrast);
	font-weight: 700;
	text-decoration: none;
}

/* "Article N" headings (Terms) read as a label above the article's own title (the H3). */
.athena-legal-content h2:has(+ h3) {
	margin-bottom: 0.25rem;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.athena-legal-content h2 + h3 {
	margin-top: 0;
	font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
}

.athena-legal-content :where(h2[id]) {
	scroll-margin-top: 6.5rem;
}

/* Contents list (inc/legal.php): a closed disclosure above the text, beside it from 1280 px. */
.athena-legal-body {
	position: relative;
}

.athena-legal-toc {
	box-sizing: border-box;
	max-width: calc(40rem + var(--wp--style--root--padding-left) + var(--wp--style--root--padding-right));
	margin: var(--wp--preset--spacing--40) auto 0;
	padding-inline: var(--wp--style--root--padding-left) var(--wp--style--root--padding-right);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.4;
}

.athena-legal-toc__details {
	border: 1px solid var(--athena-border-strong);
	border-radius: 12px;
	background: var(--wp--preset--color--raised);
}

.athena-legal-toc__title {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 0.25rem 1rem;
	font-weight: 700;
	cursor: pointer;
}

.athena-legal-toc__title:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
	border-radius: 12px;
}

.athena-legal-toc__list {
	margin: 0;
	padding: 0 1rem 0.75rem 2.25rem;
}

.athena-legal-toc__list li + li {
	margin-top: 0.15rem;
}

.athena-legal-toc__list a {
	display: inline-block;
	padding-block: 0.4rem;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.athena-legal-toc__list a:hover .athena-legal-toc__label,
.athena-legal-toc__list a:focus-visible .athena-legal-toc__label {
	text-decoration: underline;
}

.athena-legal-toc__name {
	color: var(--wp--preset--color--muted);
}

.athena-legal-toc__name::before {
	content: "· ";
}

@media (min-width: 1280px) {
	/* The text stays centred at 40rem; the list takes the left margin and follows the reader. */
	.athena-legal-toc {
		position: absolute;
		top: var(--wp--preset--spacing--40);
		bottom: 0;
		left: max(var(--wp--style--root--padding-left), calc(50% - 20rem - 19rem));
		width: 16rem;
		max-width: none;
		margin: 0;
		padding: 0;
	}

	.athena-legal-toc__details {
		position: sticky;
		top: 6.5rem;
		max-height: calc(100vh - 8rem);
		overflow-y: auto;
		border: 0;
		background: none;
		scrollbar-width: thin;
	}

	.has-js .athena-legal-toc__title {
		min-height: 0;
		padding: 0 0 0.5rem;
		color: var(--wp--preset--color--muted);
		pointer-events: none;
		list-style: none;
	}

	.has-js .athena-legal-toc__title::-webkit-details-marker {
		display: none;
	}

	.athena-legal-toc__list {
		padding: 0;
		list-style: none;
		border-left: 1px solid var(--wp--preset--color--border);
	}

	.athena-legal-toc__list a {
		padding: 0.3rem 0 0.3rem 0.85rem;
	}
}

@media print {
	.site-header,
	.site-footer,
	.wp-block-template-part:has(.site-header, .site-footer),
	.skip-link,
	.athena-legal-toc {
		display: none !important;
	}

	.athena-page-header--legal,
	.athena-legal-content {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		border: 0;
		color: #000;
		font-size: 11pt;
	}

	.athena-legal-content a {
		color: #000;
	}

	/* The address of every external link, so a printed copy keeps it. */
	.athena-legal-content a[href^="http"]::after,
	.athena-legal-content a[href^="/"]::after {
		content: " (" attr(href) ")";
		font-size: 0.9em;
		overflow-wrap: anywhere;
	}

	.athena-legal-content :where(h2, h3) {
		break-after: avoid;
	}

	.athena-legal-content :where(li, p) {
		orphans: 3;
		widows: 3;
	}
}

/* Contact template: title and intro on the left, form on the right. The page
   content's own .athena-demo columns dissolve into this grid. */
.athena-contact {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	grid-template-rows: auto 1fr;
	gap: var(--wp--preset--spacing--30) clamp(2rem, 5vw, 5rem);
	align-items: start;
}

.athena-contact > * {
	margin: 0 !important;
}

.athena-contact__title {
	grid-column: 1;
}

.athena-contact__content {
	grid-column: 2;
	grid-row: 1 / -1;
}

.athena-contact .athena-contact__content:has(> .athena-demo),
.athena-contact .athena-contact__content > .athena-demo {
	display: contents;
}

.athena-contact .athena-demo > * {
	margin: 0;
}

.athena-contact .athena-demo > :not(.athena-form-card) {
	grid-column: 1;
}

.athena-contact .athena-form-card {
	grid-column: 2;
	grid-row: 1 / -1;
}

@media (max-width: 860px) {
	.athena-contact {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: none;
	}

	.athena-contact__content,
	.athena-contact .athena-demo > :not(.athena-form-card),
	.athena-contact .athena-form-card {
		grid-column: 1;
		grid-row: auto;
	}
}

.athena-legacy-content :where(h2, h3) {
	margin-top: 2.5rem;
}

.athena-legacy-content :where(table) {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--small);
}

.athena-legacy-content :where(th, td) {
	padding: 0.5rem;
	border: 1px solid var(--wp--preset--color--border);
	text-align: left;
}

.wp-block-search__input {
	border-radius: 999px !important;
	padding-inline: 1.1rem !important;
}

/* ── Home: AI Data Generator (static before → after card) ─────── */

.athena-genhome__grid {
	display: grid !important;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: clamp(2rem, 5vw, 4rem) !important;
	align-items: center;
}

.athena-genhome__grid > *,
.athena-genhome__copy > *,
.athena-genhome__card > *,
.athena-genhome__side > * {
	margin-block: 0 !important;
}

.athena-genhome__copy {
	display: grid;
	gap: 1rem;
}

.athena-genhome__card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 2.5rem;
	padding: clamp(1.25rem, 3vw, 1.75rem) !important;
	border: 1px solid var(--athena-border-strong);
	border-radius: 20px;
	background: var(--wp--preset--color--raised);
	box-shadow: var(--athena-shadow-raised);
}

.athena-genhome__side {
	position: relative;
	display: grid;
	align-content: start;
	gap: 0.5rem;
}

.athena-genhome__side--after::before {
	content: "\2192" / "";
	position: absolute;
	top: 45%;
	left: -1.85rem;
	color: var(--wp--preset--color--accent);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1;
}

.athena-genhome__label {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 750;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.athena-genhome__row {
	display: grid;
	gap: 0.1rem;
	padding: 0.5rem 0.7rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 10px;
	background: var(--wp--preset--color--surface);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	overflow-wrap: anywhere;
}

.athena-genhome__row strong {
	color: var(--wp--preset--color--muted);
	font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
}

.athena-genhome__side--before .athena-genhome__row {
	font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	font-weight: 500;
}

@media (max-width: 960px) {
	.athena-genhome__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 600px) {
	.athena-genhome__card {
		grid-template-columns: minmax(0, 1fr);
	}

	.athena-genhome__side--after::before {
		content: "\2193" / "";
		top: -1.9rem;
		left: 0;
	}
}