@import url("animations.css?v=9");

/**
 * @file
 * Subtheme specific CSS.
 */
html,
body {
    background:#ffffff!important;
}

.dialog-off-canvas-main-canvas {
    overflow:hidden;
}

/* Colors */
:root {
    --primary: rgba(247, 187, 62, 1);
    --secondary:rgba(47, 48, 71, 1);
    --tertiary:rgba(149, 199, 243, 1);
    --interior-background: rgba(242, 240, 227, 1);
}

#page {
    container-type: inline-size;
    position: relative;
}

/* Shared typography scale; variables do not restyle Drupal's editing controls. */
#page-wrapper {
    --font-body: 'Lexend Deca', sans-serif;
    --font-copy: var(--font-body);
    --font-heading: 'Urbanist', sans-serif;
    --font-hero: 'Lexend', sans-serif;
    --font-display: 'Anton', sans-serif;
    --text-body: clamp(1rem, 1.2732vw, 1.375rem);
    --text-small: clamp(1rem, 1.3889vw, 1.5rem);
    --text-caption: clamp(.875rem, 1.1574vw, 1.25rem);
    --text-heading: clamp(2.25rem, 5.5556vw, 6rem);
    --text-section: clamp(2rem, 4.1667vw, 4.5rem);
    --section-space: clamp(48px, 9.2593vw, 160px);
    --section-gap: clamp(24px, 5.5556vw, 96px);
    --column-gap: clamp(20px, 2.5463vw, 44px);
    --leading-body: 1.454545;
    --leading-heading: 1.25;
}

/* Base typography: public content only; keep editing UI isolated. */
:where(#page) :is(a, p, h1, h2, h3, h4, h5, h6):not(:where(
    .btn, .tabs *, .toolbar *, .contextual *, .local-actions *,
    .ui-dialog *, #drupal-off-canvas *
)) {
    font-family: var(--font-body);
    overflow-wrap: break-word;

    &:where(a) {
        color: inherit;
        text-decoration: underline;
        text-decoration-thickness: .08em;
        text-underline-offset: .18em;
    }

    &:where(a:hover) {
        text-decoration-thickness: .15em;
    }

    &:where(a:focus-visible) {
        outline: 2px solid currentColor;
        outline-offset: 3px;
        border-radius: 2px;
    }

    &:where(p) {
        max-width: 65ch;
        margin-block: 0 1.25em;
        font-family: var(--font-copy);
        font-size: var(--text-body);
        font-weight: 300;
        line-height: var(--leading-body);
        letter-spacing: .02em;

        & a {
            font-family: inherit;
        }
    }

    &:where(h1, h2, h3, h4, h5, h6) {
        margin-block: 1.25em .5em;
        font-family: var(--font-heading);
        font-weight: 500;
        letter-spacing: .02em;
        line-height: var(--leading-heading);
        text-wrap: balance;
    }

    &:where(h1) {
        font-size: var(--text-heading);
        font-weight: 700;
    }

    &:where(h2) {
        font-size: var(--text-section);
    }

    &:where(h3) {
        font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem);
    }

    &:where(h4) {
        font-size: clamp(1.25rem, 1.125rem + .5vw, 1.5rem);
    }

    &:where(h5) {
        font-size: 1.125rem;
    }

    &:where(h6) {
        font-size: 1rem;
    }
}

/* Shared editorial labels and headings from the Figma typography scale. */
#page .eyebrow {
    margin: 0 0 12px;
    font-family: var(--font-heading);
    font-size: var(--text-small);
    font-weight: 900;
    line-height: var(--leading-heading);
    letter-spacing: .02em;
}

#page .section-heading {
    margin: 0 0 clamp(24px, 2.78vw, 48px);
    font-family: var(--font-heading);
    font-size: var(--text-section);
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: .02em;
}

/* Shared page spacing. */
#page {
    --masthead-height: clamp(150px, 18.52vw, 240px);
    --page-gutter: 6.02%;
    --page-gutter-width: 6.02cqw;
}

/* Shared telephone links. */
#page a[href^="tel:"] svg {
    display: none;
}

#page a[href^="tel:"] {
    text-decoration: none;
}
