/* ActiveSheets theme foundation. */

:root {
    /* Semantic colors map WordPress presets to implementation-independent tokens. */
    --as-color-background: var(--wp--preset--color--background);
    --as-color-surface: var(--wp--preset--color--surface);
    --as-color-surface-alt: var(--wp--preset--color--surface-alt);
    --as-color-text: var(--wp--preset--color--text);
    --as-color-text-muted: var(--wp--preset--color--muted);
    --as-color-primary: var(--wp--preset--color--primary);
    --as-color-primary-strong: var(--wp--preset--color--primary-dark);
    --as-color-border: var(--wp--preset--color--border);
    --as-color-success: var(--wp--preset--color--success);
    --as-color-warning: var(--wp--preset--color--warning);
    --as-color-error: var(--wp--preset--color--error);
    --as-color-information: var(--wp--preset--color--information);

    /* Typography. */
    --as-font-body: var(--wp--preset--font-family--system);
    --as-font-heading: var(--wp--preset--font-family--system);
    --as-font-size-xs: var(--wp--preset--font-size--x-small);
    --as-font-size-sm: var(--wp--preset--font-size--small);
    --as-font-size-md: 1.125rem;
    --as-font-size-lg: var(--wp--preset--font-size--large);
    --as-font-size-xl: var(--wp--preset--font-size--x-large);
    --as-font-size-2xl: var(--wp--preset--font-size--2-x-large);
    --as-font-size-hero: var(--wp--preset--font-size--hero);
    --as-font-weight-regular: 400;
    --as-font-weight-medium: 500;
    --as-font-weight-semibold: 600;
    --as-font-weight-bold: 700;
    --as-line-height-tight: 1.15;
    --as-line-height-heading: 1.2;
    --as-line-height-body: 1.45;
    --as-letter-spacing-tight: -0.025em;
    --as-letter-spacing-label: 0.06em;
    --as-text-measure: 68ch;

    /* Spacing. */
    --as-space-3xs: var(--wp--preset--spacing--10);
    --as-space-2xs: var(--wp--preset--spacing--20);
    --as-space-xs: var(--wp--preset--spacing--30);
    --as-space-sm: var(--wp--preset--spacing--40);
    --as-space-md: var(--wp--preset--spacing--50);
    --as-space-lg: var(--wp--preset--spacing--60);
    --as-space-xl: var(--wp--preset--spacing--70);
    --as-space-2xl: var(--wp--preset--spacing--80);
    --as-space-3xl: var(--wp--preset--spacing--90);

    /* Layout. */
    --as-content-width: 47.5rem;
    --as-medium-width: 54.5rem;
    --as-standard-width: 75rem;
    --as-wide-width: 90rem;
    --as-reading-width: 42rem;
    --as-page-gutter: var(--as-space-md);
    --as-section-space: var(--as-space-2xl);

    /* Borders, elevation, and interaction. */
    --as-border-width: 1px;
    --as-radius-xs: 0.25rem;
    --as-radius-sm: 0.5rem;
    --as-radius-md: 0.875rem;
    --as-radius-lg: 1.125rem;
    --as-radius-pill: 999px;
    --as-shadow-sm: 0 0.5rem 1.5rem rgba(23, 32, 51, 0.08);
    --as-shadow-md: 0 1rem 2.5rem rgba(23, 32, 51, 0.12);
    --as-shadow-lg: 0 1.5rem 4rem rgba(23, 32, 51, 0.16);
    --as-transition-fast: 120ms ease;
    --as-transition: 160ms ease;
    --as-transition-slow: 240ms ease;
    --as-focus-ring: 0 0 0 3px color-mix(in srgb, var(--as-color-primary) 30%, transparent);
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--as-color-text);
    background: var(--as-color-background);
    font-family: var(--as-font-body);
    font-size: var(--as-font-size-md);
    font-weight: var(--as-font-weight-regular);
    line-height: var(--as-line-height-body);
    text-rendering: optimizeLegibility;
}

:where(h1, h2, h3, h4, h5, h6) {
    margin-block-start: 0;
    margin-block-end: var(--as-space-sm);
    color: var(--as-color-text);
    font-family: var(--as-font-heading);
    font-weight: var(--as-font-weight-bold);
    line-height: var(--as-line-height-heading);
    letter-spacing: var(--as-letter-spacing-tight);
    text-wrap: balance;
}

h1 {
    font-size: var(--as-font-size-2xl);
    line-height: var(--as-line-height-tight);
}

h2 {
    font-size: clamp(2.25rem, 3vw, 2.5rem);
    line-height: 1.2;
}

h3 {
    font-size: clamp(1.5rem, 2vw, 1.75rem);
    line-height: 1.28;
}

h4 {
    font-size: var(--as-font-size-md);
}

h5,
h6 {
    font-size: var(--as-font-size-sm);
    letter-spacing: normal;
}

h5 {
    font-weight: var(--as-font-weight-bold);
}

h6 {
    color: var(--as-color-text-muted);
    font-weight: var(--as-font-weight-semibold);
    letter-spacing: var(--as-letter-spacing-label);
    text-transform: uppercase;
}

:where(p, ul, ol, blockquote) {
    margin-block-start: 0;
    margin-block-end: var(--as-space-sm);
}

:where(p, li) {
    text-wrap: pretty;
}

:where(ul, ol) {
    padding-inline-start: 1.5em;
}

:where(li + li) {
    margin-block-start: var(--as-space-2xs);
}

:where(ul, ol) ::marker {
    color: var(--as-color-primary);
}

:where(a:not(.wp-element-button)) {
    color: var(--as-color-primary);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.18em;
}

:where(a:not(.wp-element-button)):hover,
:where(a:not(.wp-element-button)):focus-visible {
    color: var(--as-color-primary-strong);
    text-decoration-thickness: 0.12em;
}

:where(strong, b) {
    font-weight: var(--as-font-weight-bold);
}

:where(small, .as-text-small, .as-meta) {
    color: var(--as-color-text-muted);
    font-size: var(--as-font-size-sm);
    line-height: 1.5;
}

.as-meta {
    font-weight: var(--as-font-weight-medium);
    letter-spacing: var(--as-letter-spacing-label);
    text-transform: uppercase;
}

.wp-site-blocks {
    min-height: 100vh;
}

.as-site-main {
    width: 100%;
    min-height: 40vh;
}

.as-site-main--home .as-page-shell {
    padding-block: 0;
}

.as-site-header {
    position: relative;
    z-index: 20;
    background: var(--as-color-background);
}

.as-site-header__inner,
.as-site-footer__inner {
    width: 100%;
}

.as-site-title a {
    color: var(--as-color-text);
    text-decoration: none;
}

.as-site-title a:hover,
.as-site-title a:focus-visible {
    color: var(--as-color-primary);
}

.as-primary-navigation {
    flex: 1 1 auto;
}

.as-primary-navigation .wp-block-navigation-item__content {
    color: var(--as-color-text);
    font-weight: var(--as-font-weight-semibold);
    text-decoration: none;
}

.as-primary-navigation .wp-block-navigation-item__content:hover,
.as-primary-navigation .wp-block-navigation-item__content:focus-visible {
    color: var(--as-color-primary);
}

.as-primary-navigation .wp-block-navigation__submenu-container {
    min-width: 15rem;
    padding: var(--as-space-2xs);
    border: var(--as-border-width) solid var(--as-color-border);
    border-radius: var(--as-radius-sm);
    background: var(--as-color-background);
    box-shadow: var(--as-shadow-sm);
}

.as-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    box-sizing: border-box;
    width: 100%;
    padding: 0.65rem var(--as-space-xs);
    border-radius: var(--as-radius-xs);
    font-weight: var(--as-font-weight-medium);
}

.as-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.as-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
    background: var(--as-color-surface);
}

.as-primary-navigation__solutions > .wp-block-navigation__submenu-container {
    min-width: 18rem;
}

.as-breadcrumbs-wrapper {
    width: 100%;
}

.as-breadcrumbs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--as-space-2xs);
    margin: 0;
    padding: 0;
    color: var(--as-color-text-muted);
    font-size: var(--as-font-size-sm);
    list-style: none;
}

.as-breadcrumbs__item {
    display: inline-flex;
    align-items: center;
    gap: var(--as-space-2xs);
}

.as-breadcrumbs__item:not(:last-child)::after {
    content: "/";
    color: var(--as-color-border);
}

.as-breadcrumbs__link {
    color: inherit;
    text-decoration: none;
}

.as-breadcrumbs__link:hover,
.as-breadcrumbs__link:focus-visible {
    color: var(--as-color-primary);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.as-breadcrumbs__current {
    color: var(--as-color-text);
    font-weight: var(--as-font-weight-semibold);
}

.as-hero {
    overflow: hidden;
}

.as-hero__content {
    max-width: 56rem;
}

.as-hero__eyebrow {
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.as-cta-panel {
    border: var(--as-border-width) solid var(--as-color-border);
    border-radius: var(--as-radius-md);
    box-shadow: var(--as-shadow-sm);
}

.as-site-footer a {
    color: inherit;
}

.as-site-footer a:hover,
.as-site-footer a:focus-visible {
    color: var(--as-color-primary);
}

@media (max-width: 781px) {
    :root {
        --as-page-gutter: var(--as-space-sm);
        --as-section-space: var(--as-space-xl);
    }

    .as-site-header__inner {
        align-items: flex-start;
    }
}
