/*
 * AYXWORKS shared foundation.
 * Route-specific homepage, editorial and portfolio composition stays outside
 * this global file. WordPress preset values originate in theme.json; these
 * short aliases make the system practical in templates and future modules.
 */

:root {
    --ax-paper: var(--wp--preset--color--paper, #f5f2ea);
    --ax-surface: var(--wp--preset--color--surface, #fff);
    --ax-surface-subtle: var(--wp--preset--color--surface-subtle, #ece9e1);
    --ax-ink: var(--wp--preset--color--ink, #171817);
    --ax-ink-soft: var(--wp--preset--color--ink-soft, #51544f);
    --ax-rule: var(--wp--preset--color--rule, #c9c7be);
    --ax-signal: var(--wp--preset--color--signal, #e45c24);
    --ax-signal-hover: var(--wp--preset--color--signal-hover, #b94317);
    --ax-steel: var(--wp--preset--color--steel, #53646e);
    --ax-good: var(--wp--preset--color--good, #3d6b55);
    --ax-warn: var(--wp--preset--color--warn, #9a5a13);
    --ax-danger: var(--wp--preset--color--danger, #a83f35);
    --ax-graphite: var(--wp--preset--color--portfolio-bg, #111412);
    --ax-graphite-surface: var(--wp--preset--color--portfolio-surface, #1a1e1b);
    --ax-graphite-ink: var(--wp--preset--color--portfolio-ink, #f1efe8);
    --ax-focus: var(--wp--preset--color--focus, #1457d9);
    --ax-sans: var(--wp--preset--font-family--sans, system-ui, sans-serif);
    --ax-serif: var(--wp--preset--font-family--serif, Georgia, serif);
    --ax-mono: var(--wp--preset--font-family--mono, ui-monospace, monospace);
    --ax-content: var(--wp--custom--ax--layout--content, 45rem);
    --ax-wide: var(--wp--custom--ax--layout--wide, 70rem);
    --ax-page: var(--wp--custom--ax--layout--page, 90rem);
    --ax-fast: var(--wp--custom--ax--motion--fast, 140ms);
    --ax-normal: var(--wp--custom--ax--motion--normal, 240ms);
    --ax-slow: var(--wp--custom--ax--motion--slow, 420ms);
    --ax-ease: var(--wp--custom--ax--motion--ease, cubic-bezier(.2, .7, .2, 1));
    --ax-ease-emph: var(--wp--custom--ax--motion--ease-emphasized, cubic-bezier(.2, .85, .25, 1));
    --ax-gutter: var(--wp--preset--spacing--page, clamp(1rem, 4vw, 4rem));
}

html {
    scroll-padding-block-start: 1rem;
    text-size-adjust: 100%;
}

body {
    min-width: 20rem;
    overflow-wrap: break-word;
}

body,
button,
input,
select,
textarea {
    font-family: var(--ax-sans);
}

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

iframe {
    max-width: 100%;
}

:where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid var(--ax-focus);
    outline-offset: 3px;
}

:where(a, button, input, select, textarea, summary):focus:not(:focus-visible) {
    outline: 0;
}

a {
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.18em;
}

a:hover {
    text-decoration-thickness: 0.14em;
}

button,
input,
select,
textarea {
    color: var(--ax-ink);
    font-size: 1rem;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    min-height: 2.75rem;
    min-width: 2.75rem;
}

input:not([type="button"]):not([type="checkbox"]):not([type="radio"]):not([type="reset"]):not([type="submit"]),
select,
textarea {
    background: var(--ax-surface);
    border: 1px solid var(--ax-ink-soft);
    border-radius: 4px;
    box-sizing: border-box;
    min-height: 2.75rem;
    padding: 0.65rem 0.75rem;
    width: 100%;
}

label {
    display: inline-block;
    font-weight: 700;
    margin-block-end: 0.35rem;
}

::placeholder {
    color: var(--ax-ink-soft);
    opacity: 1;
}

::selection {
    background: var(--ax-signal);
    color: var(--ax-ink);
}

.wp-element-button,
.wp-block-button__link {
    align-items: center;
    box-sizing: border-box;
    display: inline-flex;
    justify-content: center;
    min-height: 2.75rem;
    transition: background-color var(--ax-fast) var(--ax-ease), border-color var(--ax-fast) var(--ax-ease);
}

.wp-element-button:hover,
.wp-block-button__link:hover {
    background: var(--ax-signal-hover);
    color: var(--ax-surface);
}

.wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent;
    border-color: var(--ax-ink);
    color: var(--ax-ink);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background: var(--ax-ink);
    color: var(--ax-surface);
}

.skip-link.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

.wp-block-template-skip-link,
.skip-link.screen-reader-text:focus {
    background: var(--ax-ink) !important;
    border-radius: 0 0 4px 0;
    clip: auto;
    color: var(--ax-surface) !important;
    font-weight: 700;
    height: auto;
    left: 0;
    padding: 0.75rem 1rem !important;
    top: 0;
    width: auto;
    z-index: 50;
}

.ax-page,
.ax-wide,
.ax-reading {
    margin-inline: auto;
    width: calc(100% - (2 * var(--ax-gutter)));
}

.ax-page { max-width: var(--ax-page); }
.ax-wide { max-width: var(--ax-wide); }
.ax-reading { max-width: var(--ax-content); }

.ax-stack > * + * {
    margin-block-start: var(--wp--preset--spacing--6, 1.5rem);
}

.ax-cluster {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--wp--preset--spacing--4, 1rem);
}

.ax-site-header,
.ax-site-footer {
    box-sizing: border-box;
    padding-inline: var(--ax-gutter);
}

.ax-site-header {
    --ax-header-admin-offset: 0px;
    background: var(--ax-paper);
    border-bottom: 1px solid var(--ax-rule);
    padding-block-start: env(safe-area-inset-top, 0px);
    position: sticky;
    top: 0;
    z-index: 20;
}

.admin-bar .ax-site-header {
    --ax-header-admin-offset: 32px;
    top: 32px;
}

/* site-header.js: away on a sustained scroll down, back on scroll up. A
   transform only, so nothing reflows; links stay focusable and focusing
   one brings the header back. Reduced motion: the global rule below makes
   it an instant change. */
.ax-js .ax-site-header {
    transition: transform 220ms var(--ax-ease);
}

.ax-header-hidden .ax-site-header {
    transform: translateY(calc(-100% - var(--ax-header-admin-offset)));
}


.ax-site-main {
    min-height: 55vh;
    padding-block: clamp(2.5rem, 6vw, 6rem);
}

.ax-site-footer {
    border-top: 1px solid var(--ax-rule);
    margin-block-start: clamp(3rem, 8vw, 8rem);
}

/* Utilities shared by the theme-rendered navigation and consent UI. */
.screen-reader-text:not(.skip-link) {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
    word-wrap: normal !important;
}

.ax-js .ax-nojs-only,
html:not(.ax-js) .ax-js-only {
    display: none !important;
}

.ax-icon {
    flex-shrink: 0;
}

.ax-icon-button {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
    color: var(--ax-ink);
    cursor: pointer;
    display: inline-flex;
    gap: 0.4rem;
    justify-content: center;
    min-height: 2.75rem;
    min-width: 2.75rem;
    padding: 0 0.6rem;
    text-decoration: none;
}

.ax-icon-button:hover,
.ax-disclosure.is-open > .ax-icon-button {
    background: var(--ax-surface-subtle);
}

/*
 * Header — three states, no per-device breakpoints:
 * compact (< 62rem): brand | language · search · menu
 * hybrid  (≥ 62rem): + Articles, Reviews, Robotics & Automation, Portfolio
 * full    (≥ 80rem): + Topics, Shop, Account and the tagline; no menu button
 */
.ax-site-header .ax-site-header__inner.alignwide {
    max-width: var(--ax-page);
}

.ax-site-header__inner {
    align-items: center;
    gap: clamp(0.75rem, 2.5vw, 2.5rem);
    min-height: 4rem;
    padding-block: 0.5rem;
    position: relative;
}

.ax-site-brand {
    align-items: flex-start !important;
    flex: 0 1 auto;
    gap: 0.2rem !important;
    min-width: 0;
}

.ax-site-brand .wp-block-site-title,
.ax-site-brand .wp-block-site-tagline {
    margin: 0;
}

.ax-site-header .ax-site-brand .wp-block-site-title {
    font-size: clamp(0.9375rem, 0.8rem + 0.5vw, 1.0625rem);
    letter-spacing: 0.08em;
    line-height: 1.15;
}

.ax-site-brand .wp-block-site-title a {
    text-decoration: none;
}

.ax-site-brand .wp-block-site-tagline {
    color: var(--ax-ink-soft);
    display: none;
    font-family: var(--ax-mono);
    font-size: 0.6875rem;
    letter-spacing: 0.1em;
    line-height: 1.35;
    text-transform: uppercase;
}

.ax-nav {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    gap: clamp(0.75rem, 2vw, 2rem);
    justify-content: flex-end;
    min-width: 0;
}

.ax-nav__primary {
    display: none;
}

.ax-nav__list {
    align-items: center;
    display: flex;
    gap: clamp(0.75rem, 1.6vw, 1.75rem);
    list-style: none;
    margin: 0;
    padding: 0;
}

.ax-nav__link {
    align-items: center;
    background: none;
    border: 0;
    color: var(--ax-ink);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--ax-sans);
    font-size: 0.9375rem;
    font-weight: 500;
    gap: 0.2rem;
    min-height: 2.75rem;
    padding: 0;
    position: relative;
    text-decoration: none;
    white-space: nowrap;
}

.ax-nav__link::after {
    background: currentColor;
    bottom: 0.45rem;
    content: "";
    height: 1px;
    inset-inline: 0;
    position: absolute;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--ax-fast) var(--ax-ease);
}

.ax-nav__link:hover::after,
.ax-nav__link:focus-visible::after {
    transform: scaleX(1);
}

.ax-nav__link[aria-current="page"]::after {
    background: var(--ax-signal);
    height: 2px;
    transform: scaleX(1);
}

.ax-nav__item--topics .ax-nav__link::after {
    inset-inline-end: 1.4rem;
}

.ax-disclosure {
    position: relative;
}

.ax-disclosure__toggle .ax-icon--chevron {
    height: 1rem;
    transition: transform var(--ax-fast) var(--ax-ease);
    width: 1rem;
}

.ax-disclosure__toggle[aria-expanded="true"] .ax-icon--chevron {
    transform: rotate(180deg);
}

.ax-disclosure__panel {
    display: none;
}

.ax-disclosure.is-open > .ax-disclosure__panel,
html:not(.ax-js) .ax-disclosure:is(:hover, :focus-within) > .ax-disclosure__panel {
    display: block;
}

/*
 * Header popovers share one quiet surface and the approved V3 motion:
 * Topics/Language open in 280ms and close in 200ms; Search uses 220ms.
 * Closed panels are display:none (no focus, no scroll overflow); the
 * transition runs where allow-discrete/@starting-style are supported and
 * degrades to an instant toggle elsewhere.
 */
.ax-site-header .ax-disclosure > :is(.ax-nav__panel, .ax-lang__panel, .ax-search__panel) {
    display: none;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 200ms cubic-bezier(.22,1,.36,1), transform 200ms cubic-bezier(.22,1,.36,1), display 200ms allow-discrete;
}

.ax-site-header .ax-disclosure > .ax-search__panel {
    transition-duration: 220ms;
}

.ax-site-header .ax-disclosure.is-open > :is(.ax-nav__panel, .ax-lang__panel, .ax-search__panel),
html:not(.ax-js) .ax-site-header .ax-disclosure:is(:hover, :focus-within) > :is(.ax-nav__panel, .ax-lang__panel) {
    display: block;
    opacity: 1;
    transform: translateY(0);
    transition-duration: 280ms;
}

.ax-site-header .ax-disclosure.is-open > .ax-search__panel {
    transition-duration: 220ms;
}

@starting-style {
    .ax-site-header .ax-disclosure.is-open > :is(.ax-nav__panel, .ax-lang__panel, .ax-search__panel) {
        opacity: 0;
        transform: translateY(6px);
    }
}

.ax-search.is-open .ax-search-inline input[type="search"] {
    animation: ax-search-input-reveal 220ms cubic-bezier(.22,1,.36,1) both;
}

@keyframes ax-search-input-reveal {
    from {
        opacity: 0;
        transform: translateY(-0.375rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.ax-nav__panel,
.ax-lang__panel,
.ax-search__panel {
    background: var(--ax-paper);
    border: 1px solid var(--ax-rule);
    border-radius: 4px;
    box-shadow: 0 0.75rem 1.75rem rgb(23 24 23 / 12%);
    box-sizing: border-box;
    position: absolute;
    top: calc(100% + 0.35rem);
    z-index: 40;
}

.ax-nav__panel {
    inset-inline-end: -0.75rem;
    padding: 0.5rem;
    width: max-content;
}

.ax-nav__panel-list {
    display: grid;
    gap: 0 0.5rem;
    grid-template-columns: repeat(2, minmax(9rem, max-content));
    list-style: none;
    margin: 0;
    padding: 0;
}

.ax-nav__panel-link,
.ax-lang__link {
    align-items: center;
    border-radius: 3px;
    color: var(--ax-ink);
    display: flex;
    font-size: 0.9375rem;
    gap: 1rem;
    justify-content: space-between;
    min-height: 2.75rem;
    padding: 0 0.75rem;
    text-decoration: none;
}

.ax-nav__panel-link:hover,
.ax-lang__link:hover {
    background: var(--ax-surface-subtle);
    text-decoration: underline;
}

.ax-nav__utility {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    gap: 0.25rem;
}

.ax-nav__shop,
.ax-nav__account {
    display: none !important;
}

.ax-nav__shop {
    color: var(--ax-ink-soft);
    font-size: 0.875rem;
    margin-inline-end: 0.5rem;
    min-height: 2.75rem;
    align-items: center;
    text-decoration: none;
}

.ax-nav__shop:hover,
.ax-nav__shop[aria-current="page"] {
    color: var(--ax-ink);
    text-decoration: underline;
}

/* Below 37.5rem the Menu label is visually hidden but still names the button. */
.ax-nav__menu-label {
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    font-size: 0.875rem;
    font-weight: 500;
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

/* Search: the panel spans the right side of the header row. */
.ax-search {
    position: static;
}

.ax-search__panel {
    inset-inline-end: 0;
    padding: 0.5rem;
    top: calc(100% + 1px);
    width: min(28rem, 100%);
}

.ax-search-inline {
    display: flex;
    gap: 0.5rem;
}

.ax-search-inline input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
}

.ax-search-inline__submit {
    background: var(--ax-ink);
    border: 0;
    border-radius: 4px;
    color: var(--ax-paper);
    cursor: pointer;
    font-weight: 600;
    padding-inline: 1rem;
}

.ax-search-inline__submit:hover {
    background: var(--ax-signal-hover);
}

/* Language: closed shows only the current code. */
.ax-lang__toggle {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
    color: var(--ax-ink);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--ax-mono);
    font-size: 0.8125rem;
    font-weight: 700;
    gap: 0.15rem;
    letter-spacing: 0.06em;
    min-height: 2.75rem;
    padding: 0 0.4rem 0 0.6rem;
}

.ax-lang__toggle:hover,
.ax-lang.is-open > .ax-lang__toggle {
    background: var(--ax-surface-subtle);
}

.ax-lang__panel {
    inset-inline-end: 0;
    padding: 0.5rem;
    width: max-content;
    min-width: 12rem;
    max-width: calc(100vw - 2 * var(--ax-gutter));
}

.ax-lang__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ax-lang__code {
    color: var(--ax-ink-soft);
    font-family: var(--ax-mono);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
}

.ax-lang__link[aria-current="page"] {
    font-weight: 700;
}

.ax-lang__link[aria-current="page"] .ax-lang__name {
    text-decoration: underline;
    text-decoration-color: var(--ax-signal);
    text-decoration-thickness: 2px;
    text-underline-offset: 0.3em;
}

.ax-lang__list--inline {
    display: flex;
    flex-wrap: wrap;
    gap: 0 1.25rem;
}

.ax-lang__list--inline .ax-lang__link {
    gap: 0.4rem;
    padding: 0;
}

.ax-lang__list--inline .ax-lang__link:hover {
    background: none;
}

/* Compact order from the brief: brand | current locale | search | menu. */
@media (max-width: 61.99rem) {
    .ax-nav__utility .ax-lang {
        order: -1;
    }
}

@media (min-width: 62rem) {
    .ax-nav {
        justify-content: space-between;
    }

    .ax-nav__primary {
        display: block;
    }

    .ax-nav__item--topics {
        display: none;
    }
}

@media (min-width: 80rem) {
    .ax-site-header__inner {
        min-height: 4.75rem;
    }

    .ax-site-brand .wp-block-site-tagline {
        display: block;
    }

    .ax-nav__item--topics {
        display: block;
    }

    .ax-nav__shop {
        display: inline-flex !important;
    }

    .ax-nav__account {
        display: inline-flex !important;
    }

    .ax-nav__menu {
        display: none !important;
    }
}

@media (min-width: 37.5rem) {
    .ax-nav__menu-label {
        clip: auto;
        clip-path: none;
        height: auto;
        overflow: visible;
        position: static;
        width: auto;
    }
}

/* Drawer: a compact, left-aligned modal sheet. */
.ax-drawer {
    background: var(--ax-paper);
    border: 0;
    border-inline-start: 1px solid var(--ax-rule);
    box-sizing: border-box;
    color: var(--ax-ink);
    height: 100dvh;
    inset: 0 0 0 auto;
    margin: 0;
    max-height: 100dvh;
    max-width: 100vw;
    padding: 0;
    width: min(26rem, 100vw);
}

.ax-drawer::backdrop {
    background: rgb(23 24 23 / 38%);
}

.ax-drawer[open] {
    animation: ax-drawer-in var(--ax-normal) var(--ax-ease-emph);
}

@keyframes ax-drawer-in {
    from {
        transform: translateX(1.5rem);
        opacity: 0;
    }
}

html.ax-drawer-open {
    overflow: hidden;
}

.ax-drawer__inner {
    box-sizing: border-box;
    padding: 0 var(--ax-gutter) max(2rem, env(safe-area-inset-bottom, 0px));
}

.ax-drawer__head {
    align-items: center;
    border-bottom: 1px solid var(--ax-rule);
    display: flex;
    justify-content: space-between;
    margin-inline-end: -0.6rem;
    min-height: 4rem;
}

.ax-drawer__title,
.ax-drawer__label {
    color: var(--ax-steel);
    font-family: var(--ax-mono);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin: 0;
    text-transform: uppercase;
}

.ax-drawer__primary,
.ax-drawer__links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ax-drawer__primary {
    padding-block: 0.75rem 0.5rem;
}

.ax-drawer__primary-link {
    color: var(--ax-ink);
    display: flex;
    align-items: center;
    font-family: var(--ax-serif);
    font-size: clamp(1.375rem, 1.2rem + 0.8vw, 1.625rem);
    font-weight: 600;
    line-height: 1.2;
    min-height: 3rem;
    text-decoration: none;
}

.ax-drawer__primary-link:hover,
.ax-drawer__link:hover {
    text-decoration: underline;
}

.ax-drawer__primary-link[aria-current="page"] {
    text-decoration: underline;
    text-decoration-color: var(--ax-signal);
    text-decoration-thickness: 2px;
}

.ax-drawer__group {
    border-top: 1px solid var(--ax-rule);
    padding-block: 1rem;
}

.ax-drawer__label {
    margin-block-end: 0.35rem;
}

.ax-drawer__toggle {
    align-items: center;
    background: none;
    border: 0;
    color: var(--ax-ink);
    cursor: pointer;
    display: flex;
    font-family: var(--ax-sans);
    font-size: 1rem;
    font-weight: 600;
    justify-content: space-between;
    min-height: 2.75rem;
    padding: 0;
    width: 100%;
}

.ax-drawer__links--grid {
    display: grid;
    gap: 0 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-block-end: 0.25rem;
}

.ax-drawer__link {
    align-items: center;
    color: var(--ax-ink);
    display: flex;
    font-size: 1rem;
    min-height: 2.75rem;
    text-decoration: none;
}

/* Footer: a compact grouped index, then one quiet legal/meta row. */
.ax-footer {
    box-sizing: border-box;
    display: grid;
    gap: 2.5rem clamp(2rem, 5vw, 5rem);
    grid-template-columns: minmax(0, 1fr);
    margin-inline: auto;
    max-width: var(--ax-page);
    padding-block: clamp(2.5rem, 5vw, 4rem) 1.5rem;
}

.ax-footer__name {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin: 0 0 0.6rem;
    text-transform: uppercase;
}

.ax-footer__name a {
    color: var(--ax-ink);
    text-decoration: none;
}

.ax-footer__statement {
    color: var(--ax-ink-soft);
    font-family: var(--ax-serif);
    font-size: 1.0625rem;
    line-height: 1.5;
    margin: 0;
    max-inline-size: 30ch;
}

.ax-footer__nav {
    display: grid;
    gap: 2rem clamp(1.5rem, 3vw, 3rem);
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ax-footer__label {
    color: var(--ax-steel);
    font-family: var(--ax-mono);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin: 0 0 0.5rem;
    text-transform: uppercase;
}

.ax-footer__links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ax-external {
    margin-inline-start: 0.25em;
}

.ax-footer__link {
    color: var(--ax-ink);
    display: inline-block;
    font-size: 0.9375rem;
    padding-block: 0.35rem;
    text-decoration: none;
}

.ax-footer__link:hover,
.ax-footer__link[aria-current="page"] {
    text-decoration: underline;
}

.ax-footer__meta {
    align-items: baseline;
    border-top: 1px solid var(--ax-rule);
    color: var(--ax-ink-soft);
    display: flex;
    flex-wrap: wrap;
    font-size: 0.8125rem;
    gap: 0.5rem 1.5rem;
    grid-column: 1 / -1;
    padding-block-start: 1.25rem;
}

.ax-footer__copyright {
    font-family: var(--ax-mono);
    font-size: 0.75rem;
    margin: 0;
}

.ax-footer__legal {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.25rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.ax-footer__legal a,
.ax-footer__consent {
    color: var(--ax-ink-soft);
    display: inline-flex;
    font-size: 0.8125rem;
    min-height: 1.5rem;
    align-items: center;
}

.ax-footer__consent {
    background: none;
    border: 0;
    cursor: pointer;
    min-width: 0;
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.ax-footer__legal a:hover,
.ax-footer__consent:hover {
    color: var(--ax-ink);
}

@media (min-width: 48rem) {
    .ax-footer__nav {
        grid-template-columns: repeat(4, minmax(0, auto));
        justify-content: space-between;
    }
}

@media (min-width: 64rem) {
    .ax-footer {
        grid-template-columns: minmax(14rem, 1fr) minmax(0, 2.4fr);
    }
}

/* Consent: first layer anchored low and narrow; it never covers the page. */
.ax-consent {
    bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
    inset-inline: 0.75rem;
    position: fixed;
    z-index: 60;
}

.ax-consent[hidden] {
    display: none;
}

html.ax-consent-open {
    scroll-padding-block-end: calc(var(--ax-consent-h, 0px) + 1rem);
}

.ax-consent-dialog__head {
    align-items: start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-block-start: -0.5rem;
    margin-inline-end: -0.5rem;
}

.ax-consent-dialog__title {
    padding-block-start: 0.5rem;
}

.ax-consent__inner,
.ax-consent-dialog {
    background: var(--ax-paper);
    border: 1px solid var(--ax-ink);
    border-radius: 4px;
    box-shadow: 0 1rem 2.5rem rgb(23 24 23 / 18%);
    box-sizing: border-box;
    color: var(--ax-ink);
}

.ax-consent__inner {
    max-width: 34rem;
    padding: 1.25rem;
}

.ax-consent__title,
.ax-consent-dialog__title {
    font-family: var(--ax-serif);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 0.5rem;
}

.ax-consent__text,
.ax-consent-dialog__intro {
    color: var(--ax-ink-soft);
    font-size: 0.9375rem;
    line-height: 1.5;
    margin: 0 0 1rem;
}

.ax-consent__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Accept and Reject share one style: equal prominence, no default nudge. */
.ax-consent__button {
    background: var(--ax-paper);
    border: 1px solid var(--ax-ink);
    border-radius: 4px;
    color: var(--ax-ink);
    cursor: pointer;
    /* Never shrink below the label: long translations (eu, fr) wrap the
       button onto its own line instead of overflowing it. */
    flex: 1 0 auto;
    font-weight: 600;
    min-width: 7rem;
    white-space: nowrap;
    min-height: 2.75rem;
    padding: 0.5rem 1rem;
}

.ax-consent__button:hover {
    background: var(--ax-ink);
    color: var(--ax-paper);
}

.ax-consent__settings {
    background: none;
    border: 0;
    color: var(--ax-ink);
    cursor: pointer;
    padding: 0 0.5rem;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

/* Phones: the settings link takes its own line, so a wrapped Accept and
   Reject always keep equal width (equal prominence in every language). */
@media (max-width: 30rem) {
    .ax-consent__settings {
        flex-basis: 100%;
        min-height: 2.75rem;
        text-align: left;
    }
}

.ax-consent-dialog {
    max-height: calc(100dvh - 2rem);
    max-width: min(36rem, calc(100vw - 1.5rem));
    padding: clamp(1.25rem, 3vw, 2rem);
}

.ax-consent-dialog::backdrop {
    background: rgb(23 24 23 / 38%);
}

.ax-consent__options {
    border: 0;
    margin: 0 0 1.25rem;
    padding: 0;
}

.ax-consent__option {
    align-items: start;
    border-top: 1px solid var(--ax-rule);
    column-gap: 0.75rem;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    padding-block: 0.85rem;
}

.ax-consent__option input {
    accent-color: var(--ax-ink);
    block-size: 1.25rem;
    inline-size: 1.25rem;
    margin: 0.1rem 0 0;
}

.ax-consent__option label {
    margin: 0;
}

.ax-consent__option p {
    color: var(--ax-ink-soft);
    font-size: 0.875rem;
    grid-column: 2;
    margin: 0.25rem 0 0;
}

.ax-consent__services {
    color: var(--ax-ink);
}

@media (min-width: 37.5rem) {
    .ax-consent {
        inset-inline: var(--ax-gutter) auto;
    }
}

.is-style-ax-kicker,
.ax-kicker,
.ax-meta {
    color: var(--ax-steel);
    font-family: var(--ax-mono);
    font-size: var(--wp--preset--font-size--meta, 0.8125rem);
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.4;
    text-transform: uppercase;
}

.ax-commercial-relationship {
    color: var(--ax-ink-soft);
    font-family: var(--ax-mono);
    font-size: var(--wp--preset--font-size--meta, 0.8125rem);
    font-weight: 700;
    margin-block: 0.4rem 0;
}

.is-style-ax-kicker,
.ax-kicker {
    color: var(--ax-signal-hover);
}

.is-style-ax-lede {
    color: var(--ax-ink-soft);
    font-family: var(--ax-serif);
    font-size: var(--wp--preset--font-size--lead, 1.2rem);
    line-height: 1.5;
}

.is-style-ax-callout,
.is-style-ax-disclosure,
.is-style-ax-review-summary,
.is-style-ax-surface {
    border: 1px solid var(--ax-rule);
    border-radius: 4px;
    padding: clamp(1rem, 3vw, 2rem);
}

.is-style-ax-callout {
    background: color-mix(in srgb, var(--ax-signal) 5%, var(--ax-paper));
    border-left: 3px solid var(--ax-signal);
}

.is-style-ax-disclosure {
    background: var(--ax-surface-subtle);
}

.is-style-ax-review-summary {
    background: var(--ax-surface);
    border-top: 3px solid var(--ax-ink);
}

.is-style-ax-surface {
    background: var(--ax-surface);
}

.is-style-ax-media-frame img {
    border: 1px solid var(--ax-rule);
    border-radius: 4px;
}

.is-style-ax-source-list {
    border-top: 1px solid var(--ax-rule);
    padding-block-start: 1rem;
}

.is-style-ax-source-list li + li {
    margin-block-start: 0.75rem;
}

.is-style-ax-strong-rule {
    border-top-width: 2px;
    color: var(--ax-ink);
}

.wp-block-table.is-style-ax-table,
.ax-table-wrap {
    margin-inline: 0;
    max-width: 100%;
    overflow-x: auto;
}

.wp-block-table.is-style-ax-table table,
.ax-table-wrap table {
    border-collapse: collapse;
    min-width: 38rem;
    width: 100%;
}

.wp-block-table.is-style-ax-table caption,
.ax-table-wrap caption {
    color: var(--ax-ink-soft);
    font-family: var(--ax-mono);
    font-size: 0.8125rem;
    margin-block-end: 0.75rem;
    text-align: left;
}

.wp-block-table.is-style-ax-table th,
.wp-block-table.is-style-ax-table td,
.ax-table-wrap th,
.ax-table-wrap td {
    border: 0;
    border-bottom: 1px solid var(--ax-rule);
    padding: 0.75rem;
    text-align: left;
    vertical-align: top;
}

.wp-block-table.is-style-ax-table th,
.ax-table-wrap th {
    background: var(--ax-surface-subtle);
    font-weight: 700;
}

.ax-story-card {
    border-top: 1px solid var(--ax-rule);
    display: grid;
    gap: 1rem;
    padding-block: 1.25rem;
}

.ax-story-card h3,
.ax-story-card p {
    margin-block: 0;
}

.ax-story-card h3 a {
    text-decoration: none;
}

.ax-story-card h3 a:hover,
.ax-story-card h3 a:focus-visible {
    text-decoration: underline;
}

.ax-component-sampler > .wp-block-group {
    width: min(100%, var(--ax-wide));
}

.ax-sampler-section {
    border-top: 1px solid var(--ax-rule);
    padding-block: clamp(2rem, 5vw, 4rem);
}

.ax-swatch-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
}

.ax-swatch {
    border: 1px solid var(--ax-rule);
    min-height: 6rem;
    padding: 0.75rem;
}

.ax-swatch p {
    font-family: var(--ax-mono);
    font-size: 0.75rem;
    margin: 0;
}

.ax-swatch--paper { background: var(--ax-paper); }
.ax-swatch--surface { background: var(--ax-surface); }
.ax-swatch--subtle { background: var(--ax-surface-subtle); }
.ax-swatch--ink { background: var(--ax-ink); color: var(--ax-surface); }
.ax-swatch--signal { background: var(--ax-signal); color: var(--ax-ink); }
.ax-swatch--steel { background: var(--ax-steel); color: var(--ax-surface); }

@media (min-width: 48rem) {
    .ax-story-card {
        grid-template-columns: minmax(0, 1.4fr) minmax(14rem, 0.6fr);
    }
}

@media (max-width: 48rem) {
    .admin-bar .ax-site-header {
        --ax-header-admin-offset: 46px;
        top: 46px;
    }
}

@media (max-width: 600px) {
    .admin-bar .ax-site-header {
        --ax-header-admin-offset: 0px;
        top: 0;
    }
}

@media (hover: hover) and (pointer: fine) {
    .is-style-ax-media-frame img {
        transition: border-color var(--ax-fast) var(--ax-ease);
    }

    .is-style-ax-media-frame a:hover img {
        border-color: var(--ax-ink-soft);
    }
}

@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;
        transition-iteration-count: 1 !important;
    }
}

@media (forced-colors: active) {
    :where(a, button, input, select, textarea, summary):focus-visible {
        outline-color: Highlight;
    }

    .is-style-ax-callout,
    .is-style-ax-disclosure,
    .is-style-ax-review-summary,
    .is-style-ax-surface {
        border: 1px solid CanvasText;
    }
}

/* Narrow phones: language remains available inside the menu drawer. */
@media (max-width: 21.875rem) {
    .ax-nav__utility .ax-lang {
        display: none;
    }
}
