/* Extracted from the owned Texly website. Order preserves its final overrides. */


html[lang='fr'] .home-hero h1,
html[lang='es'] .home-hero h1,
html[lang='pl'] .home-hero h1 {
    max-width: 14ch;
    font-size: clamp(2.65rem, 4.5vw + 0.75rem, 4.8rem);
}

    .marketing-shell {
        margin-inline: auto;
        width: min(100%, var(--page-max));
        padding-inline: var(--page-gutter);
    }

    .section-reveal {
        opacity: 0;
        transform: translateY(18px);
        transition:
            opacity var(--dur-slow) var(--ease-out),
            transform var(--dur-slow) var(--ease-out);
    }

    .section-reveal[data-visible='true'] {
        opacity: 1;
        transform: translateY(0);
    }

    .marketing-primary-button,
.marketing-secondary-button {
        display: inline-flex;
        min-height: 2.75rem;
        align-items: center;
        justify-content: center;
        gap: 0.55rem;
        border-radius: var(--radius-medium);
        padding: 0.7rem 1rem;
        font-size: var(--text-sm);
        font-weight: 650;
        line-height: 1;
        text-decoration: none;
        transition:
            color var(--dur-base) var(--ease-out),
            background-color var(--dur-base) var(--ease-out),
            border-color var(--dur-base) var(--ease-out),
            transform var(--dur-base) var(--ease-out),
            box-shadow var(--dur-base) var(--ease-out);
    }

    .marketing-primary-button {
        border: var(--rule-hair) solid var(--color-ink);
        background: var(--color-ink);
        color: var(--color-paper);
    }

    .marketing-primary-button:hover {
        transform: translateY(-1px);
        box-shadow: 0 6px 18px var(--color-shadow);
    }

    .marketing-primary-button svg,
.marketing-secondary-button svg,
.section-copy a svg {
        width: 1rem;
        transition: transform var(--dur-base) var(--ease-out);
    }

    .marketing-primary-button:hover svg,
.marketing-secondary-button:hover svg,
.section-copy a:hover svg {
        transform: translateX(0.18rem);
    }

    .marketing-secondary-button {
        border: var(--rule-hair) solid var(--color-line-strong);
        background: var(--color-surface);
        color: var(--color-ink);
    }

    .marketing-secondary-button:hover {
        border-color: var(--color-ink);
        background: var(--color-paper-subtle);
        transform: translateY(-1px);
    }

    .marketing-primary-button:active,
.marketing-secondary-button:active {
        transform: translateY(1px);
        box-shadow: none;
    }
.marketing-nav {
    position: fixed;
    inset: 0 0 auto;
    z-index: var(--z-sticky);
    padding: 0;
    pointer-events: none;
}

.marketing-nav__inner {
    position: relative;
    display: flex;
    width: 100%;
    height: 5rem;
    align-items: center;
    margin-inline: auto;
    padding-inline: var(--page-gutter);
    border: var(--rule-hair) solid transparent;
    border-bottom-color: var(--color-line);
    background: color-mix(in oklch, var(--color-paper) 94%, transparent);
    backdrop-filter: blur(18px);
    pointer-events: auto;
    view-transition-name: texly-navigation;
    transition:
        width var(--dur-nav) var(--ease-out),
        height var(--dur-nav) var(--ease-out),
        margin-top var(--dur-nav) var(--ease-out),
        padding-inline var(--dur-nav) var(--ease-out),
        border-radius var(--dur-nav) var(--ease-out),
        border-color var(--dur-nav) var(--ease-out),
        box-shadow var(--dur-nav) var(--ease-out),
        background-color var(--dur-nav) var(--ease-out);
}

.marketing-nav.is-floating .marketing-nav__inner {
    width: min(calc(100% - 2rem), 76rem);
    height: 4rem;
    margin-top: 0.75rem;
    padding-inline: 0.8rem;
    border-color: var(--color-line);
    border-radius: var(--radius-pill);
    background: color-mix(in oklch, var(--color-paper) 90%, transparent);
    box-shadow: 0 18px 52px oklch(18% 0 0 / 0.14);
}

.marketing-wordmark {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.55rem;
    color: var(--color-ink);
    font-family: var(--font-family-display);
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.04em;
    text-decoration: none;
}

.marketing-wordmark__mark {
    display: grid;
    width: 1.75rem;
    height: 1.75rem;
    place-items: center;
    border-radius: 0.48rem;
}

.marketing-wordmark__mark img {
    width: 100%;
    height: 100%;
}

.marketing-nav__links {
    display: flex;
    align-items: center;
    gap: 0.1rem;
    margin-inline: auto;
}

.marketing-nav__link,
.marketing-sign-in {
    display: inline-flex;
    min-height: 2.5rem;
    align-items: center;
    gap: 0.28rem;
    border-radius: var(--radius-medium);
    padding-inline: 0.7rem;
    color: var(--color-ink-soft);
    font-size: 0.78rem;
    font-weight: 580;
    text-decoration: none;
    transition:
        color var(--dur-fast),
        background-color var(--dur-fast);
}

.marketing-nav__link:hover,
.marketing-nav__link[aria-expanded='true'],
.marketing-sign-in:hover {
    background: var(--color-paper-subtle);
    color: var(--color-ink);
}

.marketing-nav__link svg {
    transition: transform var(--dur-menu) var(--ease-out);
}

.marketing-nav__link[aria-expanded='true'] svg {
    transform: rotate(180deg);
}

.marketing-nav__actions {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.marketing-nav__actions > .marketing-primary-button {
    min-height: 2.5rem;
    padding: 0.55rem 0.85rem;
    font-size: 0.78rem;
}

.marketing-language {
    position: relative;
}

.marketing-icon-button,
.marketing-mobile-toggle {
    position: relative;
    display: inline-flex;
    min-width: 2.5rem;
    min-height: 2.5rem;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    border-radius: var(--radius-medium);
    color: var(--color-ink-soft);
    transition:
        color var(--dur-fast),
        background-color var(--dur-fast),
        transform var(--dur-fast);
}

.marketing-icon-button:hover,
.marketing-mobile-toggle:hover {
    background: var(--color-paper-subtle);
    color: var(--color-ink);
}

.marketing-icon-button:active,
.marketing-mobile-toggle:active {
    transform: scale(0.96);
}

.marketing-icon-button__text {
    font-family: var(--font-family-mono);
    font-size: 0.65rem;
    font-weight: 600;
}

.marketing-theme-button .theme-icon {
    position: absolute;
    width: 1.1rem;
    height: 1.1rem;
    transition:
        opacity var(--dur-base),
        transform var(--dur-base) var(--ease-out);
}

.marketing-theme-button .theme-icon--dark,
html[data-theme='night'] .marketing-theme-button .theme-icon--light {
    opacity: 0;
    transform: rotate(-35deg) scale(0.72);
}

html[data-theme='night'] .marketing-theme-button .theme-icon--dark {
    opacity: 1;
    transform: rotate(0) scale(1);
}

.marketing-language__menu {
    position: absolute;
    top: calc(100% + 0.65rem);
    right: 0;
    width: 13rem;
    padding: 0.45rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-large);
    background: var(--color-surface-raised);
    box-shadow: var(--shadow-high);
    animation: menu-enter var(--dur-menu) var(--ease-out) both;
}

.marketing-language__option {
    display: flex;
    width: 100%;
    min-height: 2.65rem;
    align-items: center;
    justify-content: space-between;
    border-radius: var(--radius-medium);
    padding-inline: 0.75rem;
    color: var(--color-ink-soft);
    font-size: var(--text-sm);
    text-align: left;
}

.marketing-language__option:hover,
.marketing-language__option[aria-checked='true'] {
    background: var(--color-paper-subtle);
    color: var(--color-ink);
}

.marketing-language__option[aria-checked='true'] span:last-child {
    color: var(--color-accent);
}

.marketing-mega-menu {
    position: absolute;
    top: calc(100% + 0.75rem);
    left: 50%;
    width: min(calc(100vw - 2rem), 64rem);
    padding: 0.75rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-panel);
    background: var(--color-surface-raised);
    box-shadow: var(--shadow-high);
    transform: translateX(-50%);
    transform-origin: 50% 0;
    animation: mega-menu-enter var(--dur-menu) var(--ease-out) both;
}

.marketing-mega-menu::before {
    position: absolute;
    right: 0;
    bottom: 100%;
    left: 0;
    height: 0.75rem;
    content: '';
}

.marketing-mega-menu__content {
    animation: mega-menu-switch 140ms var(--ease-out) both;
}

.marketing-mega-menu__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, 5.5rem);
    gap: 0.25rem;
}

.marketing-mega-menu__item {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: 0.75rem;
    min-height: 5rem;
    align-items: start;
    padding: 0.9rem;
    border-radius: var(--radius-large);
    color: var(--color-ink);
    text-decoration: none;
    transition:
        background-color var(--dur-base),
        transform var(--dur-base) var(--ease-out);
}

.marketing-mega-menu__item > svg {
    box-sizing: content-box;
    padding: 0.55rem;
    border-radius: var(--radius-medium);
    background: var(--color-accent-soft);
    color: var(--color-accent-ink);
}

.marketing-mega-menu__item strong,
.marketing-mega-menu__item small {
    display: block;
}

.marketing-mega-menu__item strong {
    font-size: var(--text-sm);
}

.marketing-mega-menu__item small {
    margin-top: 0.28rem;
    color: var(--color-ink-muted);
    font-size: 0.75rem;
    line-height: 1.45;
}

.marketing-mega-menu__item:hover {
    background: var(--color-paper-subtle);
    transform: translateY(-1px);
}

.marketing-mega-menu__feature {
    display: flex;
    min-height: 3.25rem;
    align-items: center;
    gap: 0.65rem;
    margin-top: 0.5rem;
    padding-inline: 1rem;
    border-radius: var(--radius-large);
    background: var(--color-ink);
    color: var(--color-paper);
    font-size: var(--text-sm);
    font-weight: 620;
    text-decoration: none;
}

.marketing-mega-menu__feature svg:last-child {
    margin-left: auto;
    transition: transform var(--dur-base) var(--ease-out);
}

.marketing-mega-menu__feature:hover svg:last-child {
    transform: translateX(0.2rem);
}

.marketing-mobile-toggle,
.marketing-mobile-dialog {
    display: none;
}
.home-hero {
    display: grid;
    min-height: min(58rem, 100svh);
    place-items: center;
    padding-top: 8.5rem;
    padding-bottom: 4rem;
}

.home-hero__copy {
    display: flex;
    max-width: 66rem;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.home-hero__status {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.46rem 0.72rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-pill);
    color: var(--color-ink-soft);
    font-size: 0.78rem;
    font-weight: 620;
    animation: hero-enter var(--dur-slow) var(--ease-out) both;
}

.home-hero__status span {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: var(--color-accent);
    box-shadow: 0 0 0 0.25rem var(--color-accent-soft);
}

.home-hero h1 {
    max-width: 12ch;
    margin-top: 1.6rem;
    font-size: var(--text-display);
    font-weight: 650;
    letter-spacing: -0.065em;
    line-height: 0.92;
    animation: hero-enter var(--dur-slow) var(--ease-out) 70ms both;
}

.home-hero__body {
    max-width: 49rem;
    margin-top: 1.75rem;
    color: var(--color-ink-muted);
    font-size: clamp(1.05rem, 1.6vw, 1.3rem);
    line-height: 1.6;
    text-wrap: balance;
    animation: hero-enter var(--dur-slow) var(--ease-out) 140ms both;
}

.home-hero__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.65rem;
    margin-top: 2rem;
    animation: hero-enter var(--dur-slow) var(--ease-out) 210ms both;
}

.home-hero__actions a {
    min-height: 3rem;
    padding-inline: 1.2rem;
}

.home-hero__note {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    max-width: 40rem;
    margin-top: 1rem;
    color: var(--color-ink-muted);
    font-size: 0.78rem;
    line-height: 1.5;
    animation: hero-enter var(--dur-slow) var(--ease-out) 280ms both;
}

.home-hero__note svg {
    width: 0.9rem;
    color: var(--color-success);
}

.sample-brand-strip {
    width: 100%;
    margin-top: clamp(4rem, 8vh, 7rem);
    border-top: var(--rule-hair) solid var(--color-line);
    padding-top: 1rem;
    overflow: hidden;
}

.sample-brand-strip > p {
    color: var(--color-ink-muted);
    font-size: 0.65rem;
    letter-spacing: 0.075em;
    text-align: center;
    text-transform: uppercase;
}

.sample-brand-strip__viewport {
    margin-top: 1.35rem;
    overflow: hidden;
    mask-image: linear-gradient(
        90deg,
        transparent,
        #000 8%,
        #000 92%,
        transparent
    );
}

.sample-brand-strip__track {
    display: flex;
    width: max-content;
    animation: brand-marquee 28s linear infinite;
}

.sample-brand-strip__track span {
    width: 13rem;
    color: var(--color-ink-muted);
    font-family: var(--font-family-display);
    font-size: 1.05rem;
    font-weight: 620;
    letter-spacing: -0.03em;
    text-align: center;
}

.integration-section {
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
}

.section-copy > span {
    color: var(--color-ink-muted);
    font-size: var(--text-xs);
    font-weight: 650;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.section-copy h2,
.home-final-cta h2 {
    max-width: 16ch;
    margin-top: 0.85rem;
    font-size: clamp(2.25rem, 4vw, 4.25rem);
    font-weight: 620;
    letter-spacing: -0.058em;
    line-height: 0.98;
}

.section-copy > a {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.45rem;
    color: var(--color-ink);
    font-size: var(--text-sm);
    font-weight: 650;
    text-decoration: none;
}

.section-copy > a:hover {
    text-decoration: underline;
}

.section-copy {
    max-width: 42rem;
}

.section-copy--wide {
    max-width: 54rem;
}

.section-copy > svg {
    width: 2.2rem;
    height: 2.2rem;
    margin-bottom: 1.2rem;
    padding: 0.5rem;
    border-radius: var(--radius-medium);
    background: var(--color-accent-soft);
    color: var(--color-accent-ink);
}

.section-copy p {
    max-width: 42rem;
    margin-top: 1.3rem;
    color: var(--color-ink-muted);
    font-size: 1.05rem;
    line-height: 1.7;
}

.section-copy > a {
    margin-top: 1.6rem;
}

.integration-section__grid small {
    margin-top: 0.3rem;
    color: var(--color-ink-muted);
    font-size: 0.65rem;
}

.integration-section__grid small[data-state='available'] {
    color: var(--color-success);
}

.use-case-section > .marketing-shell {
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
}

.integration-section {
    display: grid;
    grid-template-columns: minmax(18rem, 0.75fr) minmax(0, 1.25fr);
    gap: clamp(3rem, 7vw, 7rem);
    align-items: center;
}

.integration-section__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-panel);
    overflow: hidden;
}

.integration-section__grid > div {
    display: flex;
    min-height: 9rem;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    border-right: var(--rule-hair) solid var(--color-line);
    border-bottom: var(--rule-hair) solid var(--color-line);
    background: var(--color-surface);
    transition:
        background-color var(--dur-base),
        transform var(--dur-base) var(--ease-out);
}

.integration-section__grid > div:nth-child(3n) {
    border-right: 0;
}
.integration-section__grid > div:nth-last-child(-n + 3) {
    border-bottom: 0;
}
.integration-section__grid > div:hover {
    background: var(--color-paper-subtle);
}
.integration-section__grid svg {
    width: 1.15rem;
    color: var(--color-ink-muted);
}
.integration-section__grid strong {
    font-size: var(--text-sm);
}

.home-final-cta {
    background: var(--color-accent);
    color: var(--color-accent-ink);
}

.home-final-cta > div {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 2rem;
    min-height: 27rem;
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.home-final-cta h2 {
    max-width: 12ch;
}

.home-final-cta p {
    max-width: 42rem;
    margin-top: 1.2rem;
    color: color-mix(in oklch, var(--color-charcoal) 82%, var(--color-honey));
    line-height: 1.65;
}

.home-final-cta > div > div:last-child {
    display: flex;
    flex: 0 0 auto;
    gap: 0.65rem;
}

.home-final-cta .marketing-secondary-button {
    border-color: var(--color-charcoal);
    background: transparent;
    color: var(--color-charcoal);
}
.marketing-footer {
    padding-top: clamp(4rem, 8vw, 7rem);
    padding-bottom: 1.5rem;
    background: var(--color-navy);
    color: var(--color-empty);
}

.marketing-footer__lead {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 2rem;
    padding-bottom: clamp(4rem, 8vw, 7rem);
    border-bottom: var(--rule-hair) solid oklch(100% 0 0 / 0.16);
}

.marketing-footer__lead p {
    max-width: 15ch;
    font-family: var(--font-family-display);
    font-size: clamp(2.5rem, 5vw, 5rem);
    font-weight: 580;
    letter-spacing: -0.06em;
    line-height: 0.94;
    text-wrap: balance;
}

.marketing-footer__lead > a {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    gap: 0.5rem;
    padding-inline: 1.1rem;
    border-radius: var(--radius-medium);
    background: var(--color-honey);
    color: var(--color-charcoal);
    font-size: var(--text-sm);
    font-weight: 650;
    text-decoration: none;
}

.marketing-footer__lead > a svg {
    width: 1rem;
    transition: transform var(--dur-base) var(--ease-out);
}

.marketing-footer__lead > a:hover svg {
    transform: translateX(0.2rem);
}

.marketing-footer__index {
    display: grid;
    grid-template-columns: minmax(15rem, 1.6fr) repeat(5, minmax(7.5rem, 1fr));
    gap: 2rem;
    padding-block: 3rem;
    border-bottom: var(--rule-hair) solid oklch(100% 0 0 / 0.16);
}

.marketing-footer .marketing-wordmark {
    color: var(--color-empty);
}

.marketing-footer__brand-head,
.marketing-footer__locale {
    display: flex;
    align-items: center;
}

.marketing-footer__brand-head {
    flex-wrap: wrap;
    gap: 0.75rem;
}

.marketing-footer__locale {
    gap: 0.35rem;
    min-height: 2rem;
    padding-inline: 0.6rem;
    border: var(--rule-hair) solid oklch(100% 0 0 / 0.18);
    border-radius: var(--radius-pill);
    color: var(--color-on-dark-muted);
    font-size: 0.7rem;
}

.marketing-footer__locale svg {
    width: 0.85rem;
}

.marketing-footer__locale select {
    background: transparent;
    color: inherit;
}

.marketing-footer__locale option {
    background: var(--color-navy);
}

.marketing-footer__brand p {
    max-width: 19rem;
    margin-top: 1.2rem;
    color: var(--color-on-dark-muted);
    font-size: var(--text-sm);
    line-height: 1.6;
}

.marketing-footer__index nav {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.marketing-footer__index nav strong {
    margin-bottom: 0.4rem;
    color: var(--color-neutral-soft);
    font-size: var(--text-xs);
    letter-spacing: 0.065em;
    text-transform: uppercase;
}

.marketing-footer__index nav a {
    color: var(--color-on-dark-muted);
    font-size: 0.78rem;
    text-decoration: none;
    transition: color var(--dur-fast);
}

.marketing-footer__index nav a:hover {
    color: var(--color-empty);
}

.marketing-footer__meta {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding-top: 1.25rem;
    color: var(--color-on-dark-muted);
    font-size: 0.72rem;
}

.marketing-footer__meta button {
    color: inherit;
}
.marketing-footer__meta button:hover {
    color: var(--color-empty);
    text-decoration: underline;
}
.marketing-footer__meta p {
    margin-left: auto;
}

.marketing-mobile-dialog {
    margin: auto;
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--color-ink);
}

.marketing-mobile-dialog::backdrop {
    background: var(--color-scrim);
    backdrop-filter: blur(3px);
}

.marketing-mobile-dialog[open] {
    animation: dialog-enter var(--dur-menu) var(--ease-out) both;
}

@media (max-width: 74rem) {
    .marketing-nav__links {
        display: none;
    }
    .marketing-nav__actions {
        margin-left: auto;
    }
    .marketing-mobile-toggle {
        display: inline-flex;
    }
    .marketing-mobile-dialog[open] {
        display: flex;
        width: min(calc(100% - 1.5rem), 31rem);
        max-height: calc(100svh - 1.5rem);
        flex-direction: column;
        border: var(--rule-hair) solid var(--color-line);
        border-radius: var(--radius-panel);
        background: var(--color-surface-raised);
        box-shadow: var(--shadow-high);
    }
    .marketing-mobile-dialog__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1rem;
        border-bottom: var(--rule-hair) solid var(--color-line);
    }
    .marketing-mobile-dialog__links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--rule-hair);
        background: var(--color-line);
        overflow-y: auto;
    }
    .marketing-mobile-dialog__links a {
        min-height: 4rem;
        padding: 1.2rem;
        background: var(--color-surface);
        color: var(--color-ink);
        font-size: var(--text-sm);
        font-weight: 620;
        text-decoration: none;
    }
    .marketing-mobile-dialog__links a:hover {
        background: var(--color-paper-subtle);
    }
    .marketing-mobile-dialog__utilities {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.5rem;
        align-items: center;
        padding: 1rem;
        border-top: var(--rule-hair) solid var(--color-line);
    }
    .marketing-mobile-dialog__utilities label {
        grid-column: 1 / -1;
        color: var(--color-ink-muted);
        font-size: var(--text-xs);
    }
    .marketing-mobile-dialog__utilities select,
.marketing-mobile-dialog__utilities button {
        min-height: 2.75rem;
        padding-inline: 0.75rem;
        border: var(--rule-hair) solid var(--color-line);
        border-radius: var(--radius-medium);
        background: var(--color-surface);
        font-size: var(--text-sm);
    }
    .marketing-mobile-dialog__actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem;
        padding: 1rem;
    }
    .marketing-mobile-dialog__actions :is(a, button) {
        display: inline-flex;
        min-height: 2.75rem;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        border: var(--rule-hair) solid var(--color-line-strong);
        border-radius: var(--radius-medium);
        color: var(--color-ink);
        font-size: var(--text-sm);
        font-weight: 650;
        text-decoration: none;
    }
    .marketing-mobile-dialog__actions :is(a, button):last-child {
        border-color: var(--color-ink);
        background: var(--color-ink);
        color: var(--color-paper);
    }
    .marketing-footer__index {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .marketing-footer__brand {
        grid-column: span 3;
    }
}

@media (max-width: 56rem) {
    .integration-section {
        grid-template-columns: 1fr;
    }
    .home-final-cta > div,
.marketing-footer__lead {
        align-items: start;
        flex-direction: column;
    }
    .marketing-footer__index {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .marketing-footer__brand {
        grid-column: span 2;
    }
}

@media (max-width: 40rem) {
    .section-reveal {
        opacity: 1;
        transform: none;
    }
    .marketing-nav__inner {
        height: 4.25rem;
    }
    .marketing-nav.is-floating .marketing-nav__inner {
        width: calc(100% - 1rem);
        height: 3.75rem;
        margin-top: 0.5rem;
    }
    .marketing-nav__actions > .marketing-primary-button,
.marketing-sign-in,
.marketing-language {
        display: none;
    }
    .home-hero {
        min-height: auto;
        padding-top: 8rem;
        padding-bottom: 3rem;
    }
    .home-hero h1 {
        width: 100%;
        max-width: 12ch;
        font-size: clamp(2.75rem, 13vw, 3.75rem);
    }
    .home-hero__body {
        font-size: 1rem;
    }
    .home-hero__actions {
        width: 100%;
        flex-direction: column;
    }
    .home-hero__actions a {
        width: 100%;
    }
    .home-hero__note {
        align-items: start;
    }
    .sample-brand-strip {
        margin-top: 4rem;
    }
    .sample-brand-strip__track span {
        width: 10rem;
    }
    .integration-section,
.use-case-section > .marketing-shell {
        padding-top: var(--space-3xl);
        padding-bottom: var(--space-3xl);
    }
    .section-copy h2,
.home-final-cta h2 {
        font-size: 2.55rem;
    }
    .integration-section__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .integration-section__grid > div:nth-child(3n) {
        border-right: var(--rule-hair) solid var(--color-line);
    }
    .integration-section__grid > div:nth-child(2n) {
        border-right: 0;
    }
    .integration-section__grid > div:nth-last-child(-n + 3) {
        border-bottom: var(--rule-hair) solid var(--color-line);
    }
    .integration-section__grid > div:nth-last-child(-n + 2) {
        border-bottom: 0;
    }
    .home-final-cta > div {
        min-height: 24rem;
    }
    .home-final-cta > div > div:last-child {
        width: 100%;
        flex-direction: column;
    }
    .marketing-footer__lead > a {
        width: 100%;
        justify-content: center;
    }
    .marketing-footer__index {
        grid-template-columns: 1fr 1fr;
        gap: 2.5rem 1.5rem;
    }
    .marketing-footer__brand {
        grid-column: span 2;
    }
    .marketing-footer__meta {
        align-items: start;
        flex-wrap: wrap;
    }
    .marketing-footer__meta p {
        width: 100%;
        margin-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {

    .section-reveal {
        opacity: 1;
        transform: none;
    }
}

.animated-theme-toggle {
    display: inline-grid;
    width: 2.5rem;
    height: 2.5rem;
    flex: 0 0 auto;
    cursor: pointer;
    place-items: center;
    border: var(--rule-hair) solid transparent;
    border-radius: 50%;
    background: transparent;
    color: var(--color-ink);
    transition:
        border-color var(--dur-fast) var(--ease-out),
        background-color var(--dur-fast) var(--ease-out),
        transform var(--dur-fast) var(--ease-out);
}

.animated-theme-toggle:hover {
    border-color: var(--color-line-strong);
    background: var(--color-paper-subtle);
}

.animated-theme-toggle:active {
    transform: scale(0.96);
}

.animated-theme-toggle svg {
    width: 1.125rem;
    height: 1.125rem;
}

.marketing-mobile-theme {
    display: none;
}

.marketing-mobile-dialog__resource-group {
    display: grid;
    gap: 0.25rem;
    margin-top: 0.75rem;
    padding-top: 1rem;
    border-top: var(--rule-hair) solid var(--color-line);
}

.marketing-mobile-dialog__resource-group > strong {
    padding: 0.5rem 0.75rem;
    color: var(--color-ink-muted);
    font-size: 0.72rem;
}

.pillar-section__grid header svg {
    color: var(--color-honey);
}

.pillar-section {
    background: var(--color-paper);
}

.pillar-section__grid article {
    box-shadow: none;
}

.pillar-section__grid article:hover {
    box-shadow: none;
}

.workspace-showcase {
    padding-bottom: clamp(5rem, 9vw, 8rem);
    background: var(--color-paper);
}

.workspace-showcase__frame {
    overflow: hidden;
    padding: 6rem 5.5rem;
    border-radius: 1.75rem;
    background: #061c3a;
    color: #ffffff;
}

.workspace-showcase__intro {
    max-width: 42.5rem;
}

.workspace-showcase__intro > span,
.workspace-feature__intro > span {
    color: #fdbf2d;
    font-size: 0.8rem;
    font-weight: 650;
}

.workspace-showcase__intro h2 {
    max-width: 12ch;
    margin-top: 1.25rem;
    font-size: clamp(3.75rem, 5vw, 4.25rem);
    font-weight: 650;
    letter-spacing: -0.04em;
    line-height: 0.98;
}

.workspace-showcase__intro p {
    max-width: 40rem;
    margin-top: 1.5rem;
    color: #aab8ca;
    font-size: 1.125rem;
    line-height: 1.65;
}

.workspace-showcase__indicators {
    margin-top: 4rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgb(255 255 255 / 0.1);
}

.workspace-showcase__indicator-label {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-size: 0.75rem;
    font-weight: 650;
}

.workspace-showcase__indicator-label small {
    padding: 0.2rem 0.45rem;
    border: 1px solid rgb(255 255 255 / 0.13);
    border-radius: var(--radius-pill);
    color: #aab8ca;
    font-size: 0.62rem;
    font-weight: 550;
}

.workspace-showcase__indicator-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 1.5rem;
}

.workspace-showcase__indicator-grid article {
    min-width: 0;
    padding-inline: 2rem;
    border-left: 1px solid rgb(255 255 255 / 0.1);
}

.workspace-showcase__indicator-grid article:first-child {
    padding-left: 0;
    border-left: 0;
}

.workspace-showcase__indicator-grid strong,
.workspace-showcase__indicator-grid article > span {
    display: block;
}

.workspace-showcase__indicator-grid strong {
    color: #fdbf2d;
    font-family: var(--font-family-display);
    font-size: clamp(2.75rem, 4vw, 4rem);
    font-weight: 650;
    letter-spacing: -0.04em;
    line-height: 1;
}

.workspace-showcase__indicator-grid strong > span {
    display: inline;
    margin: 0;
    color: inherit;
    font: inherit;
}

.workspace-showcase__indicator-grid article > span {
    margin-top: 0.75rem;
    font-size: 0.95rem;
    font-weight: 650;
}

.workspace-showcase__indicator-grid p {
    max-width: 17rem;
    margin-top: 0.45rem;
    color: #aab8ca;
    font-size: 0.78rem;
    line-height: 1.5;
}

.workspace-showcase__features {
    margin-top: 6.5rem;
}

.workspace-feature {
    display: grid;
    min-height: 30rem;
    grid-template-areas:
        'intro visual'
        'details visual';
    grid-template-columns: minmax(15rem, 0.67fr) minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    gap: 2.5rem clamp(3rem, 6vw, 5.5rem);
    align-items: center;
    padding-block: 6.5rem;
    border-top: 1px solid rgb(255 255 255 / 0.1);
}

.workspace-feature:last-child {
    padding-bottom: 0;
}

.workspace-feature[data-reverse='true'] {
    grid-template-areas:
        'visual intro'
        'visual details';
    grid-template-columns: minmax(0, 1fr) minmax(15rem, 0.67fr);
}

.workspace-feature__intro {
    grid-area: intro;
    align-self: end;
}

.workspace-feature__intro h3 {
    max-width: 12ch;
    margin-top: 1rem;
    font-size: clamp(2.75rem, 4vw, 3.25rem);
    font-weight: 640;
    letter-spacing: -0.04em;
    line-height: 1;
}

.workspace-feature__intro p {
    max-width: 32.5rem;
    margin-top: 1.25rem;
    color: #aab8ca;
    font-size: 1.06rem;
    line-height: 1.62;
}

.workspace-feature__visual {
    grid-area: visual;
    min-width: 0;
}

.workspace-feature__details {
    grid-area: details;
    align-self: start;
}

.workspace-feature__details dl {
    display: grid;
    gap: 1.1rem;
}

.workspace-feature__details dl > div {
    padding-top: 1rem;
    border-top: 1px solid rgb(255 255 255 / 0.1);
}

.workspace-feature__details dt {
    font-size: 1rem;
    font-weight: 650;
}

.workspace-feature__details dd {
    max-width: 31rem;
    margin-top: 0.35rem;
    color: #aab8ca;
    font-size: 0.875rem;
    line-height: 1.55;
}

.workspace-feature__details > a {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1.5rem;
    color: #ffffff;
    font-size: 0.95rem;
    font-weight: 650;
    text-decoration: underline;
    text-decoration-color: rgb(253 191 45 / 0.6);
    text-underline-offset: 0.35rem;
}

.workspace-feature__details > a svg {
    width: 1rem;
    transition: transform var(--dur-base) var(--ease-out);
}

.workspace-feature__details > a:hover svg {
    transform: translateX(0.2rem);
}

.home-integration-section {
    min-height: 32.5rem;
    background: var(--color-paper-subtle);
}

.integration-section__inner {
    max-width: 73.75rem;
    padding-top: 5.5rem;
    padding-bottom: 5.5rem;
    text-align: center;
}

.integration-section__heading {
    max-width: 41.25rem;
    margin-inline: auto;
}

.integration-section__heading > span {
    color: var(--color-ink-muted);
    font-size: 0.8rem;
    font-weight: 650;
}

.integration-section__heading h2 {
    margin-top: 1rem;
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 650;
    letter-spacing: -0.04em;
    line-height: 1;
}

.integration-section__heading p {
    max-width: 36rem;
    margin: 1rem auto 0;
    color: var(--color-ink-muted);
    font-size: 1.05rem;
    line-height: 1.6;
}

.integration-diagram {
    position: relative;
    width: min(100%, 47.5rem);
    height: 18.75rem;
    margin: 2.75rem auto 0;
}

.integration-diagram > svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.integration-diagram__glow {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12rem;
    height: 12rem;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgb(253 191 45 / 0.12),
        transparent 68%
    );
    transform: translate(-50%, -50%);
}

.integration-diagram__path,
.integration-diagram__beam {
    fill: none;
    vector-effect: non-scaling-stroke;
}

.integration-diagram__path {
    stroke: #a8a29e;
    stroke-opacity: 0.18;
    stroke-width: 1.25;
}

.integration-diagram__beam {
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 12 88;
    animation: integration-beam-flow 5s linear infinite;
}

.integration-node {
    position: absolute;
    z-index: var(--z-raised);
    display: grid;
    justify-items: center;
    transform: translate(-50%, -50%);
}

.integration-node__surface {
    position: relative;
    z-index: 1;
    display: grid;
    width: 3.375rem;
    height: 3.375rem;
    place-items: center;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: 50%;
    background: var(--color-surface);
    box-shadow: 0 4px 8px rgb(0 0 0 / 0.08);
    isolation: isolate;
}

.integration-node:not(.integration-node--texly)
    .integration-node__surface
    > img {
    --integration-logo-scale: 1;

    display: block;
    width: 1.65rem;
    height: 1.65rem;
    object-fit: contain;
    transform: scale(var(--integration-logo-scale));
    transform-origin: center;
}

.integration-node[data-status='planned'] .integration-node__surface > img,
.integration-node[data-status='pilot'] .integration-node__surface > img {
    opacity: 0.56;
}

.integration-node[data-integration='webhooks']
    .integration-node__surface
    > img {
    --integration-logo-scale: 1.25;
}

.integration-node[data-integration='make'] .integration-node__surface > img {
    --integration-logo-scale: 1.78;
}

.integration-node[data-integration='salesforce']
    .integration-node__surface
    > img {
    --integration-logo-scale: 1.9;
}

.integration-node[data-integration='zendesk'] .integration-node__surface > img {
    --integration-logo-scale: 1.43;
}

html[data-theme='night']
    .integration-node:is(
        [data-integration='webhooks'],
        [data-integration='zendesk']
    )
    .integration-node__surface
    > img {
    filter: invert(1);
}

.integration-node__name {
    display: none;
    margin-top: 0.35rem;
    color: var(--color-ink);
    font-size: 0.65rem;
    font-weight: 600;
}

.integration-node--left-top {
    top: 19.3%;
    left: 10.8%;
}

.integration-node--left-middle {
    top: 50%;
    left: 10.8%;
}

.integration-node--left-bottom {
    top: 80.7%;
    left: 10.8%;
}

.integration-node--right-top {
    top: 19.3%;
    left: 89.2%;
}

.integration-node--right-middle {
    top: 50%;
    left: 89.2%;
}

.integration-node--right-bottom {
    top: 80.7%;
    left: 89.2%;
}

.integration-node--texly {
    top: 50%;
    left: 50%;
}

.integration-node--texly .integration-node__surface {
    width: 5.25rem;
    height: 5.25rem;
    border-color: rgb(253 191 45 / 0.36);
    box-shadow:
        0 4px 8px rgb(0 0 0 / 0.08),
        0 0 0 0.45rem rgb(253 191 45 / 0.08);
}

.integration-node--texly img {
    width: 2.75rem;
    height: 2.75rem;
    object-fit: contain;
}

.integration-section__footer {
    display: grid;
    justify-items: center;
    gap: 0.65rem;
    margin-top: 1.5rem;
}

.integration-section__footer p {
    max-width: 45rem;
    color: var(--color-ink-muted);
    font-size: 0.82rem;
    line-height: 1.55;
}

.integration-section__footer a {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    gap: 0.4rem;
    color: var(--color-ink);
    font-size: 0.95rem;
    font-weight: 650;
}

.integration-section__footer a svg {
    width: 0.95rem;
    transition: transform var(--dur-base) var(--ease-out);
}

.integration-section__footer a:hover svg {
    transform: translateX(0.2rem);
}

.walkthrough-launch__intro > .section-kicker {
    color: var(--color-ink-muted);
}

@media (max-width: 80rem) {
    .workspace-showcase__frame {
        padding: 5rem 3.5rem;
    }

    .workspace-feature {
        column-gap: 3rem;
    }
}

@media (max-width: 68rem) {
    .workspace-showcase__intro h2 {
        font-size: clamp(2.75rem, 6vw, 3.75rem);
    }

    .workspace-feature,
.workspace-feature[data-reverse='true'] {
        grid-template-columns: minmax(14rem, 0.72fr) minmax(0, 1fr);
        column-gap: 2rem;
    }

    .workspace-feature[data-reverse='true'] {
        grid-template-columns: minmax(0, 1fr) minmax(14rem, 0.72fr);
    }

    .workspace-feature__intro h3 {
        font-size: clamp(2.15rem, 4vw, 2.75rem);
    }
}

@media (max-width: 56rem) {
    .marketing-nav__actions > .marketing-language,
.marketing-nav__actions > .marketing-theme-button,
.marketing-nav__actions > .marketing-nav__demo,
.marketing-nav__actions > .marketing-primary-button {
        display: none;
    }

    .marketing-mobile-theme,
.marketing-mobile-toggle {
        display: inline-grid;
    }

    .marketing-mobile-theme {
        width: 2.75rem;
        height: 2.75rem;
    }

    .workspace-showcase__frame {
        padding: 3.5rem 1.5rem;
        border-radius: 1.25rem;
    }

    .workspace-showcase__intro h2 {
        font-size: clamp(2.5rem, 8vw, 2.75rem);
    }

    .workspace-showcase__indicator-grid {
        gap: 1rem;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
    }

    .workspace-showcase__indicator-grid article {
        min-width: 13rem;
        padding-inline: 1rem;
        scroll-snap-align: start;
    }

    .workspace-showcase__features {
        margin-top: 4.5rem;
    }

    .workspace-feature,
.workspace-feature[data-reverse='true'] {
        min-height: 0;
        grid-template-areas:
            'intro'
            'visual'
            'details';
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto;
        gap: 1.75rem;
        padding-block: 5rem;
    }

    .workspace-feature:last-child {
        padding-bottom: 0;
    }

    .workspace-feature__intro h3 {
        font-size: clamp(2.125rem, 7vw, 2.375rem);
    }

    .workspace-feature__intro p {
        font-size: 1rem;
    }

    .integration-diagram {
        height: 20rem;
    }

    .integration-node__name {
        display: block;
    }

    .integration-node--left-bottom,
.integration-node--right-middle,
.integration-diagram > svg g:nth-of-type(3),
.integration-diagram > svg g:nth-of-type(5) {
        display: none;
    }

    .integration-node--left-top {
        top: 18%;
        left: 12%;
    }

    .integration-node--left-middle {
        top: 72%;
        left: 18%;
    }

    .integration-node--right-top {
        top: 18%;
        left: 88%;
    }

    .integration-node--right-bottom {
        top: 72%;
        left: 82%;
    }

    .integration-node--texly {
        top: 48%;
    }
}

@media (max-width: 40rem) {

    .workspace-showcase {
        padding-bottom: 4.5rem;
    }

    .workspace-showcase > .marketing-shell {
        padding-inline: 0;
    }

    .workspace-showcase__frame {
        border-radius: 0;
    }

    .workspace-showcase__indicator-grid {
        grid-template-columns: repeat(3, minmax(13rem, 1fr));
        margin-right: -1.5rem;
        padding-right: 1.5rem;
    }

    .workspace-showcase__indicator-grid article {
        border-left: 0;
        border-radius: var(--radius-medium);
        background: rgb(255 255 255 / 0.035);
        padding: 1rem;
    }

    .workspace-showcase__indicator-grid p {
        font-size: 0.75rem;
    }

    .integration-section__inner {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .integration-section__heading h2 {
        font-size: clamp(2.375rem, 11vw, 3rem);
    }

    .integration-section__heading p {
        font-size: 1rem;
    }

    .integration-node__surface {
        width: 2.875rem;
        height: 2.875rem;
    }

    .integration-node:not(.integration-node--texly)
        .integration-node__surface
        > img {
        width: 1.45rem;
        height: 1.45rem;
    }

    .integration-node--texly .integration-node__surface {
        width: 4.5rem;
        height: 4.5rem;
    }

    .integration-node--texly img {
        width: 2.375rem;
        height: 2.375rem;
    }
}

@media (prefers-reduced-motion: reduce) {

    .integration-diagram__beam {
        animation: none;
        opacity: 0;
    }

    .workspace-feature__details > a svg,
.integration-section__footer a svg,
.animated-theme-toggle {
        transition-duration: 0.01ms;
    }
}
.marketing-nav__demo:hover {
    border-color: var(--color-line-strong);
    background: var(--color-snow);
    color: var(--color-charcoal);
    transform: translateY(-1px);
}

.marketing-nav .marketing-wordmark__mark img {
    transition: transform 580ms var(--ease-out);
}

@media (hover: hover) {
    .marketing-nav .marketing-wordmark:hover .marketing-wordmark__mark img {
        transform: rotate(180deg);
    }
}

.section-kicker,
.section-copy > .section-kicker,
.control-tower-section__copy > .section-kicker,
.testimonial-section__heading .section-kicker {
    display: inline-flex;
    min-height: 1.9rem;
    align-items: center;
    gap: 0.45rem;
    padding-inline: 0.7rem;
    border: var(--rule-hair) solid var(--color-honey);
    border-radius: var(--radius-pill);
    background: var(--color-neutral-soft);
    color: var(--color-charcoal);
    font-family: var(--font-family-body);
    font-size: 0.7rem;
    font-weight: 660;
    letter-spacing: -0.01em;
    line-height: 1;
    text-transform: none;
}

.section-kicker::before {
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 50%;
    background: var(--color-honey);
    box-shadow: 0 0 0 0.22rem
        color-mix(in srgb, var(--color-honey) 18%, transparent);
    content: '';
}

.home-product-stage {
    --preview-progress: 0;
    position: relative;
    isolation: isolate;
}

.home-product-stage__haze {
    position: absolute;
    z-index: -1;
    right: 10%;
    bottom: 7%;
    left: 10%;
    height: 12rem;
    border-radius: 50%;
    background:
        radial-gradient(
            circle at 28% 55%,
            color-mix(in srgb, var(--color-honey) 34%, transparent),
            transparent 38%
        ),
        radial-gradient(
            circle at 72% 45%,
            color-mix(in srgb, var(--color-neutral-soft) 48%, transparent),
            transparent 42%
        );
    filter: blur(34px);
    opacity: calc(0.34 + var(--preview-progress) * 0.3);
    pointer-events: none;
    transform: translateY(calc(2.5rem - var(--preview-progress) * 2rem));
}

.home-product-preview {
    position: relative;
    z-index: 1;
    opacity: calc(0.7 + var(--preview-progress) * 0.3);
    transform: translate3d(0, calc(6rem - var(--preview-progress) * 6rem), 0)
        scale(calc(0.955 + var(--preview-progress) * 0.045));
    transform-origin: 50% 100%;
    will-change: transform, opacity;
}

.home-product-preview__entrance {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.home-product-preview__entrance[data-ready='true'] {
    animation: home-product-preview-enter 640ms var(--ease-out) both;
    animation-play-state: paused;
}

.home-product-preview__entrance[data-running='true'] {
    animation-play-state: running;
}

.guided-preview {
    box-shadow:
        0 24px 64px oklch(22% 0 0 / 0.13),
        0 0 62px color-mix(in srgb, var(--color-honey) 38%, transparent),
        0 0 118px color-mix(in srgb, var(--color-neutral-soft) 20%, transparent);
}

.guided-preview__event {
    box-shadow: 0 0 28px color-mix(in srgb, var(--color-honey) 18%, transparent);
}

.pillar-section > .section-copy,
.industry-section > .section-copy,
.walkthrough-launch__inner > .section-copy {
    margin-inline: auto;
    text-align: center;
}

.trust-section > .section-copy {
    grid-area: trust-copy;
}

.walkthrough-launch .section-copy p {
    color: var(--color-ink-muted);
}
.faq-section__inner {
    display: block;
    width: min(100%, 68rem);
}

.faq-section__inner > .section-copy {
    margin-inline: auto;
    text-align: center;
}

.faq-section__list {
    margin-top: 2.5rem;
}

.faq-section__list > article {
    border-bottom: var(--rule-hair) solid var(--color-line);
}

.faq-section__list h3 {
    font-family: var(--font-family-body);
}

.faq-section__list h3 > button {
    display: flex;
    width: 100%;
    min-height: 4.6rem;
    cursor: pointer;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: var(--color-ink);
    font-size: 0.9rem;
    font-weight: 650;
    text-align: left;
}

.faq-section__list h3 > button svg {
    width: 1rem;
    flex: 0 0 auto;
    transition: transform 440ms var(--ease-out);
}

.faq-section__list h3 > button[aria-expanded='true'] svg {
    transform: rotate(180deg);
}

.faq-section__answer {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition:
        grid-template-rows 460ms var(--ease-out),
        opacity 300ms var(--ease-out);
}

.faq-section__answer > div {
    overflow: hidden;
}

.faq-section__answer p {
    max-width: 48rem;
    padding: 0 2.5rem 1.5rem 0;
    color: var(--color-ink-muted);
    font-size: 0.82rem;
    line-height: 1.65;
    transform: translateY(-0.35rem);
    transition: transform 460ms var(--ease-out);
}

.faq-section__list > article[data-open='true'] .faq-section__answer {
    grid-template-rows: 1fr;
    opacity: 1;
}

.faq-section__list > article[data-open='true'] .faq-section__answer p {
    transform: translateY(0);
}
.home-final-cta__inner {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--color-white);
    color: var(--color-charcoal);
    box-shadow: 0 20px 64px
        color-mix(in srgb, var(--color-honey) 30%, transparent);
}

.home-final-cta__inner::before {
    position: absolute;
    z-index: -2;
    inset: -45%;
    background:
        radial-gradient(
            circle at 25% 32%,
            color-mix(in srgb, var(--color-neutral-soft) 96%, transparent),
            transparent 27%
        ),
        radial-gradient(
            circle at 74% 31%,
            color-mix(in srgb, var(--color-honey) 78%, transparent),
            transparent 31%
        ),
        radial-gradient(
            circle at 58% 78%,
            color-mix(
                in srgb,
                var(--color-honey) 64%,
                var(--color-neutral-soft)
            ),
            transparent 34%
        );
    content: '';
    filter: blur(30px);
    animation: final-cta-flow 18s var(--ease-in-out) infinite alternate;
}

.home-final-cta__inner::after {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image: radial-gradient(
        color-mix(in srgb, var(--color-black) 24%, transparent) 0.55px,
        transparent 0.7px
    );
    background-size: 4px 4px;
    content: '';
    opacity: 0.16;
    pointer-events: none;
}

.home-final-cta__inner > div {
    position: relative;
    z-index: 1;
}

.home-final-cta h2,
.home-final-cta p {
    color: var(--color-charcoal);
}

.home-final-cta h2 {
    max-width: none;
}

.guided-preview__tower > span {
    color: var(--color-empty);
}

.guided-preview__tower > small {
    color: var(--color-empty);
}

.guided-preview__topbar small,
.guided-preview__topbar > span,
.guided-preview__queue > div:first-child span,
.guided-preview__queue article,
.guided-preview__conversation > header div > span,
.guided-preview__conversation > header > span,
.guided-preview__event span,
.guided-preview__draft > div:first-child span,
.guided-preview__context span,
.guided-preview__context small {
    color: var(--color-ink-soft);
}

.guided-preview__context > div[data-visible='false'] {
    opacity: 0;
    transform: translateY(0.35rem);
}

.guided-preview__context > div[data-visible='true'] {
    opacity: 1;
    transform: translateY(0);
}

.guided-preview__context > div[data-visible] {
    transition:
        opacity 520ms var(--ease-out),
        transform 520ms var(--ease-out);
}

.home-final-cta .section-kicker {
    border-color: color-mix(in srgb, var(--color-black) 35%, transparent);
    background: color-mix(in srgb, var(--color-white) 50%, transparent);
}

.home-final-cta .marketing-primary-button {
    border-color: var(--color-charcoal);
    background: var(--color-charcoal);
    color: var(--color-empty);
    transition:
        color var(--dur-base) var(--ease-out),
        background-color 1ms linear 0ms,
        border-color var(--dur-base) var(--ease-out),
        transform var(--dur-base) var(--ease-out),
        box-shadow var(--dur-base) var(--ease-out);
}

.home-final-cta .marketing-primary-button:hover {
    border-color: var(--color-charcoal);
    background: var(--color-ink-hover);
}

.home-final-cta .marketing-secondary-button,
.home-final-cta .marketing-secondary-button:hover {
    border-color: color-mix(in srgb, var(--color-black) 58%, transparent);
    background: color-mix(in srgb, var(--color-white) 58%, transparent);
    color: var(--color-charcoal);
}

.home-final-cta .marketing-secondary-button:hover {
    background: color-mix(in srgb, var(--color-white) 78%, transparent);
}

@media (max-width: 40rem) {
    .home-product-stage__haze {
        right: 0;
        left: 0;
        height: 9rem;
        filter: blur(25px);
    }

    .home-product-preview {
        transform: translate3d(
                0,
                calc(4rem - var(--preview-progress) * 4rem),
                0
            )
            scale(calc(0.97 + var(--preview-progress) * 0.03));
    }

    .faq-section__answer p {
        padding-right: 1.5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .marketing-nav .marketing-wordmark__mark img,
.marketing-mega-menu,
.marketing-mega-menu__content,
.home-product-preview,
.home-product-stage__haze,
.faq-section__list h3 > button svg,
.faq-section__answer,
.faq-section__answer p {
        transition: none;
        transform: none;
    }

    .home-final-cta__inner::before {
        animation: none;
    }
}
.section-reveal {
    transform: translateY(26px);
}

.marketing-nav__inner {
    display: grid;
    grid-template-columns: auto auto auto;
    column-gap: clamp(1.5rem, 3vw, 3rem);
    justify-content: space-between;
    padding-inline: max(var(--page-gutter), calc((100% - 74rem) / 2));
    border-bottom-color: transparent;
}

.marketing-nav__links {
    position: static;
    left: auto;
    margin-inline: 0;
    transform: none;
}

.marketing-nav__actions {
    grid-column: 3;
    justify-self: end;
}

.marketing-nav.is-floating .marketing-nav__inner {
    width: min(calc(100% - 2rem), 76rem);
    height: 4.5rem;
    padding-inline: 1.2rem;
    border-bottom-color: var(--color-line);
}

.marketing-nav__link,
.marketing-sign-in,
.marketing-icon-button,
.marketing-mobile-toggle {
    transition-timing-function: var(--ease-out);
}

.marketing-nav__link:active,
.marketing-sign-in:active {
    transform: scale(0.97);
}

.home-hero {
    display: block;
    min-height: auto;
    padding-top: clamp(9.5rem, 14vh, 12rem);
    padding-bottom: 0;
}

.home-hero__copy {
    margin-inline: auto;
}

.home-hero h1 {
    max-width: none;
    margin-top: 0;
    font-size: clamp(3.25rem, 6.2vw, 5.6rem);
    font-weight: 680;
    letter-spacing: -0.04em;
    line-height: 0.94;
    animation-duration: 900ms;
}

.home-hero h1 span {
    display: block;
    white-space: nowrap;
}

html[lang='fr'] .home-hero h1,
html[lang='es'] .home-hero h1,
html[lang='pl'] .home-hero h1 {
    max-width: none;
}

.home-hero__body {
    max-width: 44rem;
    animation-duration: 920ms;
    animation-delay: 120ms;
}

.home-hero__actions {
    animation-duration: 940ms;
    animation-delay: 220ms;
}

.home-hero__note {
    animation-duration: 940ms;
    animation-delay: 320ms;
}

.sample-brand-strip {
    position: relative;
    z-index: 1;
    margin-top: clamp(3.5rem, 8vh, 6rem);
    padding-top: 0;
    border-top: 0;
}

.sample-brand-strip__viewport {
    margin-top: 0;
}

.sample-brand-strip__track span {
    color: color-mix(in oklch, var(--color-ink-muted) 82%, transparent);
}

.section-copy h2,
.home-final-cta h2 {
    max-width: 18ch;
    letter-spacing: -0.035em;
    line-height: 1;
}

.integration-section__grid {
    gap: 0.75rem;
    border: 0;
    overflow: visible;
}

.integration-section__grid > div {
    border: 0;
    border-radius: var(--radius-panel);
    box-shadow: inset 0 0 0 var(--rule-hair) var(--color-line);
}

.integration-section__grid > div:nth-child(3n),
.integration-section__grid > div:nth-last-child(-n + 3) {
    border: 0;
}

.integration-section__grid > div:hover {
    background: var(--color-surface);
    transform: translateY(-0.2rem);
    box-shadow: inset 0 0 0 var(--rule-hair)
        color-mix(in oklch, var(--integration-color) 36%, var(--color-line));
}

.integration-section__mark {
    display: grid;
    width: 2.3rem;
    height: 2.3rem;
    place-items: center;
    border-radius: 50%;
    background: color-mix(
        in oklch,
        var(--integration-color) 14%,
        var(--color-empty)
    );
    color: var(--integration-color);
    font-family: var(--font-family-mono);
    font-size: 0.66rem;
    font-weight: 700;
}

.home-final-cta {
    padding: var(--space-3xl) var(--page-gutter);
    background: var(--color-paper);
    color: var(--color-accent-ink);
}

.home-final-cta__inner {
    width: min(100%, 68rem);
    min-height: 21rem;
    padding: clamp(2rem, 5vw, 4rem);
    border-radius: var(--radius-panel);
    background: var(--color-honey);
    box-shadow: 0 0 46px
        color-mix(in oklch, var(--color-accent) 20%, transparent);
}

.home-final-cta__inner > div:first-child {
    max-width: 38rem;
}

.home-final-cta h2 {
    max-width: 14ch;
}

@media (max-width: 80rem) {
    .marketing-nav__links {
        display: none;
    }

    .marketing-nav__actions {
        margin-left: auto;
    }

    .marketing-mobile-toggle {
        display: inline-flex;
    }
}

@media (max-width: 40rem) {
    .section-reveal {
        opacity: 0;
        transform: translateY(18px);
    }

    .section-reveal[data-visible='true'] {
        opacity: 1;
        transform: none;
    }

    .home-hero h1 {
        max-width: 100%;
        font-size: clamp(2.75rem, 13vw, 3.35rem);
    }

    html[lang='pa'] .home-hero h1 {
        font-size: clamp(2.35rem, 11vw, 2.85rem);
    }

    .sample-brand-strip {
        margin-top: 3.25rem;
    }

    .home-final-cta {
        padding-inline: 0.5rem;
    }

    .home-final-cta__inner {
        min-height: 22rem;
        padding: 1.5rem;
    }
}
.marketing-skip-link {
    position: fixed;
    z-index: calc(var(--z-modal) + 1);
    top: 0.75rem;
    left: 0.75rem;
    padding: 0.7rem 0.9rem;
    border-radius: var(--radius-medium);
    background: var(--color-accent);
    color: var(--color-charcoal);
    font-size: 0.78rem;
    font-weight: 700;
    text-decoration: none;
    transform: translateY(calc(-100% - 1rem));
    transition: transform var(--dur-fast) var(--ease-out);
}

.marketing-skip-link:focus-visible {
    transform: translateY(0);
}

.marketing-primary-button {
    border-color: var(--color-accent);
    background: var(--color-accent);
    color: var(--color-charcoal);
}

.marketing-primary-button:hover {
    border-color: var(--color-accent-hover);
    background: var(--color-accent-fill-hover);
}

.marketing-secondary-button,
.marketing-nav__demo {
    border: var(--rule-hair) solid var(--color-line-strong);
    background: var(--color-paper-strong);
    color: var(--color-ink);
}

.marketing-nav__demo {
    display: inline-flex;
    min-height: 2.5rem;
    align-items: center;
    gap: 0.5rem;
    padding-inline: 0.8rem;
    border-radius: var(--radius-medium);
    font-size: 0.76rem;
    font-weight: 650;
    text-decoration: none;
    transition:
        transform var(--dur-base) var(--ease-out),
        background-color var(--dur-base) var(--ease-out),
        border-color var(--dur-base) var(--ease-out);
}

.marketing-nav__demo svg,
.marketing-mobile-dialog__actions :is(a, button) svg {
    width: 1rem;
    transition: transform var(--dur-base) var(--ease-out);
}

.marketing-nav__demo:hover svg,
.marketing-mobile-dialog__actions :is(a, button):hover svg {
    transform: translateX(0.18rem);
}

.marketing-nav__demo:hover {
    border-color: var(--color-empty);
    background: var(--color-empty);
    color: var(--color-charcoal);
    transform: translateY(-1px);
}

.home-hero {
    padding-top: clamp(8rem, 12vh, 9.5rem);
    padding-bottom: clamp(1.75rem, 4vw, 3rem);
}

.home-hero__copy {
    max-width: 58rem;
}

.home-hero h1 {
    font-size: clamp(3.25rem, 6vw, 5.4rem);
}

.home-hero__body {
    max-width: 54rem;
    font-size: clamp(1rem, 1.4vw, 1.16rem);
}

.home-hero__actions {
    margin-top: 1.65rem;
}

.home-hero__walkthrough-link {
    display: inline-flex;
    min-height: 2.5rem;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.65rem;
    color: var(--color-ink-muted);
    font-size: 0.76rem;
    font-weight: 620;
    text-decoration: none;
    transition: color var(--dur-base) var(--ease-out);
}

.home-hero__walkthrough-link svg {
    width: 0.9rem;
    transition: transform var(--dur-base) var(--ease-out);
}

.home-hero__walkthrough-link:hover {
    color: var(--color-ink);
}

.home-hero__walkthrough-link:hover svg {
    transform: translateX(0.18rem);
}

.home-product-preview {
    padding-bottom: var(--space-4xl);
}
.guided-preview {
    overflow: hidden;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-panel);
    background: var(--color-surface);
    box-shadow:
        var(--shadow-high),
        0 0 58px color-mix(in oklch, var(--color-accent) 18%, transparent);
}

.guided-preview__topbar,
.guided-preview__controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 3.5rem;
    padding-inline: 1rem;
    background: var(--color-paper-subtle);
}

.guided-preview__topbar {
    border-bottom: var(--rule-hair) solid var(--color-line);
}

.guided-preview__topbar > div {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.guided-preview__status {
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 50%;
    background: var(--color-success-fill);
    box-shadow: 0 0 0 0.25rem
        color-mix(in oklch, var(--color-success-fill) 18%, transparent);
}

.guided-preview__topbar strong {
    font-size: 0.8rem;
}

.guided-preview__topbar small,
.guided-preview__topbar > span {
    color: var(--color-ink-muted);
    font-size: 0.68rem;
}

.guided-preview__topbar small {
    padding-left: 0.6rem;
    border-left: var(--rule-hair) solid var(--color-line-strong);
}

.guided-preview__workspace {
    display: grid;
    min-height: 34rem;
    grid-template-columns: 14rem minmax(0, 1fr) 15rem;
}

.guided-preview__queue,
.guided-preview__context {
    background: var(--color-paper-subtle);
}

.guided-preview__queue {
    padding: 0.7rem;
    border-right: var(--rule-hair) solid var(--color-line);
}

.guided-preview__queue > div:first-child {
    display: flex;
    min-height: 2.6rem;
    align-items: center;
    justify-content: space-between;
    padding-inline: 0.45rem;
    font-size: 0.7rem;
}

.guided-preview__queue > div:first-child span {
    color: var(--color-ink-muted);
}

.guided-preview__queue article {
    display: grid;
    grid-template-columns: 1.75rem minmax(0, 1fr);
    gap: 0.4rem 0.55rem;
    min-height: 5.5rem;
    align-content: center;
    margin-top: 0.35rem;
    padding: 0.75rem;
    border-radius: var(--radius-large);
    color: var(--color-ink-muted);
}

.guided-preview__queue article[data-active='true'] {
    background: var(--color-surface);
    color: var(--color-ink);
    box-shadow: var(--shadow-low);
}

.guided-preview__queue article > svg {
    grid-row: span 2;
    width: 1rem;
    color: #25d366;
}

.guided-preview__queue article > div {
    min-width: 0;
}

.guided-preview__queue article strong,
.guided-preview__queue article span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guided-preview__queue article strong {
    font-size: 0.73rem;
}

.guided-preview__queue article span,
.guided-preview__queue article small {
    font-size: 0.62rem;
}

.guided-preview__queue article small {
    grid-column: 2;
    width: fit-content;
    padding: 0.22rem 0.4rem;
    border-radius: var(--radius-pill);
    background: var(--color-accent-soft);
    color: var(--color-accent-ink);
}

.guided-preview__conversation {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.guided-preview__conversation > header {
    display: flex;
    min-height: 4.4rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-inline: 1rem;
    border-bottom: var(--rule-hair) solid var(--color-line);
}

.guided-preview__conversation > header strong,
.guided-preview__conversation > header span {
    display: block;
}

.guided-preview__conversation > header strong {
    font-size: 0.82rem;
}

.guided-preview__conversation > header div > span {
    margin-top: 0.25rem;
    color: var(--color-ink-muted);
    font-size: 0.66rem;
}

.guided-preview__conversation > header > span {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    gap: 0.4rem;
    padding-inline: 0.6rem;
    border-radius: var(--radius-pill);
    background: var(--color-paper-subtle);
    color: var(--color-ink-muted);
    font-size: 0.66rem;
    font-weight: 620;
    transition:
        color var(--dur-base) var(--ease-out),
        background-color var(--dur-base) var(--ease-out);
}

.guided-preview__conversation > header > span[data-risk='true'] {
    background: var(--color-warning-soft);
    color: var(--color-warning-ink);
}

.guided-preview__conversation > header > span svg {
    width: 0.85rem;
}

.guided-preview__messages {
    flex: 1;
    padding: clamp(1rem, 3vw, 2rem);
    background: var(--color-paper-subtle);
}

.guided-preview__customer-message {
    max-width: 28rem;
    padding: 0.85rem 1rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: 0 var(--radius-large) var(--radius-large) var(--radius-large);
    background: var(--color-surface);
    font-size: 0.8rem;
    line-height: 1.55;
}

.guided-preview__event {
    display: flex;
    max-width: 31rem;
    align-items: center;
    gap: 0.75rem;
    margin: 1rem auto 0;
    padding: 0.75rem;
    border: var(--rule-hair) solid var(--color-honey);
    border-radius: var(--radius-large);
    background: var(--color-surface);
    animation: guided-event-enter 520ms var(--ease-out) both;
}

.guided-preview__event > svg {
    width: 1rem;
    flex: 0 0 auto;
    color: var(--color-honey);
}

.guided-preview__event strong,
.guided-preview__event span {
    display: block;
}

.guided-preview__event strong {
    font-size: 0.73rem;
}

.guided-preview__event span {
    margin-top: 0.2rem;
    color: var(--color-ink-muted);
    font-size: 0.65rem;
    line-height: 1.45;
}

.guided-preview__draft {
    max-width: 34rem;
    margin: 1rem 0 0 auto;
    padding: 0.9rem;
    border: var(--rule-hair) solid
        color-mix(in oklch, var(--color-accent) 58%, var(--color-line));
    border-radius: var(--radius-large) var(--radius-large) 0 var(--radius-large);
    background: var(--color-surface);
    box-shadow: var(--shadow-low);
    animation: guided-event-enter 620ms var(--ease-out) both;
}

.guided-preview__draft > div:first-child,
.guided-preview__draft > div:last-child {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.guided-preview__draft > div:first-child svg {
    width: 1rem;
    color: var(--color-accent-text);
}

.guided-preview__draft > div:first-child strong {
    font-size: 0.72rem;
}

.guided-preview__draft > div:first-child span {
    margin-left: auto;
    color: var(--color-ink-muted);
    font-size: 0.6rem;
}

.guided-preview__draft > p {
    margin-top: 0.75rem;
    font-size: 0.77rem;
    line-height: 1.55;
}

.guided-preview__draft > div:last-child {
    flex-wrap: wrap;
    margin-top: 0.75rem;
}

.guided-preview__draft > div:last-child > span,
.guided-preview__draft > div:last-child > strong {
    padding: 0.3rem 0.45rem;
    border-radius: var(--radius-pill);
    background: var(--color-paper-subtle);
    color: var(--color-ink-muted);
    font-size: 0.59rem;
}

.guided-preview__draft > div:last-child > strong {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-left: auto;
    background: var(--color-success-soft);
    color: var(--color-success-ink);
}

.guided-preview__draft > div:last-child > strong svg {
    width: 0.75rem;
}

.guided-preview__context {
    padding: 0.85rem;
    border-left: var(--rule-hair) solid var(--color-line);
}

.guided-preview__context > div {
    padding: 0.85rem 0.7rem;
    border-bottom: var(--rule-hair) solid var(--color-line);
}

.guided-preview__context > div[data-visible='false'] {
    opacity: 0.42;
}

.guided-preview__context span,
.guided-preview__context strong,
.guided-preview__context small {
    display: block;
}

.guided-preview__context span {
    color: var(--color-ink-muted);
    font-size: 0.62rem;
}

.guided-preview__context strong {
    margin-top: 0.35rem;
    font-size: 0.73rem;
    line-height: 1.4;
}

.guided-preview__context small {
    margin-top: 0.35rem;
    color: var(--color-ink-muted);
    font-size: 0.59rem;
    line-height: 1.45;
}

.guided-preview__tower {
    margin-top: 0.7rem;
    border: 0 !important;
    border-radius: var(--radius-large);
    background: var(--color-navy);
    color: var(--color-empty);
}

.guided-preview__tower strong {
    color: var(--color-honey);
}

.guided-preview__tower small {
    color: var(--color-on-dark-muted);
}

.guided-preview__controls {
    min-height: 4.25rem;
    border-top: var(--rule-hair) solid var(--color-line);
}

.guided-preview__progress {
    display: flex;
    flex: 1;
    gap: 0.28rem;
}

.guided-preview__progress button {
    position: relative;
    width: 100%;
    height: 0.28rem;
    overflow: hidden;
    border-radius: var(--radius-pill);
    background: var(--color-line-strong);
}

.guided-preview__progress button[data-complete='true'] {
    background: var(--color-accent);
}

.guided-preview__progress button > span {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    background: var(--color-accent);
    animation: guided-progress linear forwards;
}

.guided-preview__controls > p {
    display: grid;
    min-width: 17rem;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0 0.6rem;
    align-items: center;
}

.guided-preview__controls > p strong {
    font-family: var(--font-family-mono);
    font-size: 0.65rem;
}

.guided-preview__controls > p span {
    overflow: hidden;
    color: var(--color-ink-muted);
    font-size: 0.66rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.guided-preview__controls > div:last-child {
    display: flex;
    gap: 0.35rem;
}

.guided-preview__controls > div:last-child button {
    display: grid;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border: var(--rule-hair) solid var(--color-line-strong);
    border-radius: 50%;
    color: var(--color-ink);
    transition:
        transform var(--dur-fast) var(--ease-out),
        background-color var(--dur-base) var(--ease-out);
}

.guided-preview__controls > div:last-child button:hover {
    background: var(--color-surface);
    transform: translateY(-1px);
}

.guided-preview__controls > div:last-child button:active {
    transform: scale(0.94);
}

.guided-preview__controls svg {
    width: 0.95rem;
}
.faq-section {
    background: var(--color-paper-subtle);
}

.faq-section__inner {
    display: grid;
    grid-template-columns: minmax(15rem, 0.7fr) minmax(0, 1.3fr);
    gap: clamp(2.5rem, 7vw, 7rem);
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
}

.faq-section__list {
    border-top: var(--rule-hair) solid var(--color-line-strong);
}

.pillar-section {
    padding-top: var(--space-4xl);
    padding-bottom: var(--space-4xl);
}

.pillar-section__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 2.5rem;
}

.pillar-section__grid article {
    display: flex;
    min-height: 31rem;
    flex-direction: column;
    padding: 1.35rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-panel);
    background: var(--color-surface);
    transition:
        transform var(--dur-base) var(--ease-out),
        box-shadow var(--dur-base) var(--ease-out);
}

.pillar-section__grid article:hover {
    box-shadow: var(--shadow-high);
    transform: translateY(-0.25rem);
}

.pillar-section__grid header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--color-ink-muted);
    font-family: var(--font-family-mono);
    font-size: 0.65rem;
}

.pillar-section__grid header svg {
    width: 1.2rem;
    color: var(--color-accent-text);
}

.pillar-section__grid h3 {
    margin-top: 3rem;
    font-size: 1.8rem;
    font-weight: 650;
    letter-spacing: -0.035em;
}

.pillar-section__grid > article > p {
    margin-top: 0.75rem;
    color: var(--color-ink-muted);
    font-size: 0.8rem;
    line-height: 1.6;
}

.pillar-section__visual {
    display: grid;
    gap: 0.35rem;
    margin-top: auto;
    padding-block: 2rem;
}

.pillar-section__visual span {
    display: grid;
    grid-template-columns: 1.5rem minmax(0, 1fr);
    gap: 0.6rem;
    align-items: center;
    min-height: 2.6rem;
    padding-inline: 0.65rem;
    border-radius: var(--radius-large);
    background: var(--color-paper-subtle);
    color: var(--color-ink-muted);
    font-family: var(--font-family-mono);
    font-size: 0.62rem;
}

.pillar-section__visual span:nth-child(2) {
    margin-left: 0.75rem;
    background: var(--color-accent-soft);
    color: var(--color-accent-ink);
}

.pillar-section__visual strong {
    font-family: var(--font-family-body);
    font-size: 0.68rem;
}

html[data-theme='night'] .pillar-section__visual span:nth-child(2) {
    color: var(--color-honey);
}

.pillar-section__grid article > small {
    padding-top: 1rem;
    border-top: var(--rule-hair) solid var(--color-line);
    color: var(--color-ink-muted);
    font-size: 0.68rem;
    line-height: 1.5;
}

.connection-section .section-copy a,
.trust-section .section-copy a {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    gap: 0.4rem;
    margin-top: 1rem;
    color: var(--color-ink);
    font-size: 0.75rem;
    font-weight: 650;
    text-decoration: none;
}

.connection-section .section-copy a svg,
.trust-section .section-copy a svg {
    width: 0.9rem;
    transition: transform var(--dur-base) var(--ease-out);
}

.connection-section .section-copy a:hover svg,
.trust-section .section-copy a:hover svg {
    transform: translateX(0.18rem);
}

.walkthrough-launch .section-copy > span {
    color: var(--color-honey);
    font-size: 0.7rem;
    font-weight: 650;
    letter-spacing: 0.065em;
    text-transform: uppercase;
}

.walkthrough-launch .section-copy p {
    color: var(--color-on-dark-muted);
}

.walkthrough-launch .section-copy button {
    margin-top: 1.5rem;
}

.faq-section__list details {
    border-bottom: var(--rule-hair) solid var(--color-line);
}

.faq-section__list summary {
    display: flex;
    min-height: 4.4rem;
    cursor: pointer;
    list-style: none;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.86rem;
    font-weight: 650;
}

.faq-section__list summary::-webkit-details-marker {
    display: none;
}

.faq-section__list summary svg {
    width: 1rem;
    flex: 0 0 auto;
    transition: transform var(--dur-base) var(--ease-out);
}

.faq-section__list details[open] summary svg {
    transform: rotate(180deg);
}

.faq-section__list details > p {
    max-width: 45rem;
    padding: 0 2.5rem 1.4rem 0;
    color: var(--color-ink-muted);
    font-size: 0.8rem;
    line-height: 1.65;
    animation: faq-answer-enter 360ms var(--ease-out) both;
}

.home-final-cta__inner {
    background: var(--color-navy);
    color: var(--color-empty);
}

.home-final-cta p {
    color: var(--color-on-dark-muted);
}

.home-final-cta .marketing-secondary-button {
    border-color: var(--color-asphalt);
    background: var(--color-asphalt);
    color: var(--color-charcoal);
}
.marketing-footer__lead > div {
    display: flex;
    flex: 0 0 auto;
    gap: 0.55rem;
}

.marketing-footer__lead > div > :is(a, button) {
    display: inline-flex;
    min-height: 3rem;
    align-items: center;
    gap: 0.5rem;
    padding-inline: 1.1rem;
    border-radius: var(--radius-medium);
    font-size: var(--text-sm);
    font-weight: 650;
    text-decoration: none;
    transition:
        transform var(--dur-base) var(--ease-out),
        background-color var(--dur-base) var(--ease-out);
}

.marketing-footer__lead > div > :is(a, button):first-child {
    background: var(--color-asphalt);
    color: var(--color-charcoal);
}

.marketing-footer__lead > div > :is(a, button):last-child {
    background: var(--color-honey);
    color: var(--color-charcoal);
}

.marketing-footer__lead > div > :is(a, button):hover {
    transform: translateY(-2px);
}

.marketing-footer__lead > div > :is(a, button) svg {
    width: 1rem;
    transition: transform var(--dur-base) var(--ease-out);
}

.marketing-footer__lead > div > :is(a, button):hover svg {
    transform: translateX(0.2rem);
}

.marketing-footer-language {
    position: relative;
}

.marketing-footer-language__trigger {
    display: inline-flex;
    min-height: 2.3rem;
    align-items: center;
    gap: 0.45rem;
    padding-inline: 0.65rem;
    border: var(--rule-hair) solid oklch(100% 0 0 / 0.18);
    border-radius: var(--radius-pill);
    background: var(--color-navy);
    color: var(--color-on-dark-muted);
    font-size: 0.68rem;
    transition:
        color var(--dur-base) var(--ease-out),
        border-color var(--dur-base) var(--ease-out),
        background-color var(--dur-base) var(--ease-out);
}

.marketing-footer-language__trigger:hover,
.marketing-footer-language__trigger[aria-expanded='true'] {
    border-color: var(--color-honey);
    background: oklch(100% 0 0 / 0.06);
    color: var(--color-empty);
}

.marketing-footer-language__trigger svg {
    width: 0.85rem;
}

.marketing-footer-language__trigger svg:last-child {
    transition: transform var(--dur-menu) var(--ease-out);
}

.marketing-footer-language__trigger[aria-expanded='true'] svg:last-child {
    transform: rotate(180deg);
}

.marketing-footer-language__menu {
    position: absolute;
    z-index: var(--z-dropdown);
    bottom: calc(100% + 0.55rem);
    left: 0;
    width: 14rem;
    padding: 0.4rem;
    border: var(--rule-hair) solid oklch(100% 0 0 / 0.16);
    border-radius: var(--radius-large);
    background: var(--color-navy);
    box-shadow: var(--shadow-high);
    animation: footer-language-enter 360ms var(--ease-out) both;
    transform-origin: 0 100%;
}

.marketing-footer-language__menu button {
    display: grid;
    width: 100%;
    min-height: 2.7rem;
    grid-template-columns: 2rem minmax(0, 1fr) 1rem;
    gap: 0.45rem;
    align-items: center;
    padding-inline: 0.65rem;
    border-radius: var(--radius-medium);
    color: var(--color-on-dark-muted);
    text-align: left;
    transition:
        color var(--dur-base) var(--ease-out),
        background-color var(--dur-base) var(--ease-out),
        transform var(--dur-fast) var(--ease-out);
}

.marketing-footer-language__menu button:hover,
.marketing-footer-language__menu button[aria-selected='true'] {
    background: oklch(100% 0 0 / 0.08);
    color: var(--color-empty);
}

.marketing-footer-language__menu button:active {
    transform: scale(0.98);
}

.marketing-footer-language__menu button > span {
    color: var(--color-honey);
    font-family: var(--font-family-mono);
    font-size: 0.61rem;
}

.marketing-footer-language__menu button > strong {
    overflow: hidden;
    font-size: 0.71rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.marketing-footer-language__menu button > svg {
    width: 0.85rem;
    color: var(--color-honey);
}

@media (max-width: 80rem) {
    .marketing-nav__demo {
        display: none;
    }
}

@media (max-width: 68rem) {
    .guided-preview__workspace {
        grid-template-columns: 12rem minmax(0, 1fr);
    }

    .guided-preview__context {
        display: grid;
        grid-column: 1 / -1;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        border-top: var(--rule-hair) solid var(--color-line);
        border-left: 0;
    }

    .guided-preview__context > div {
        border-right: var(--rule-hair) solid var(--color-line);
        border-bottom: 0;
    }

    .guided-preview__tower {
        margin-top: 0;
    }

    .pillar-section__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .faq-section__inner {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 40rem) {
    .home-hero {
        padding-top: 7rem;
        padding-bottom: 1.5rem;
    }

    .home-hero h1 {
        max-width: none;
        font-size: clamp(1.875rem, 7.7vw, 3rem);
        line-height: 0.98;
    }

    .home-hero h1 span {
        white-space: normal;
    }

    .home-hero__actions {
        width: 100%;
    }

    .home-hero__actions a {
        flex: 1;
    }

    .home-product-preview {
        padding-inline: 0.5rem;
        padding-bottom: var(--space-3xl);
    }

    .guided-preview__topbar {
        align-items: start;
        flex-direction: column;
        justify-content: center;
        padding-block: 0.75rem;
    }

    .guided-preview__workspace {
        grid-template-columns: 1fr;
    }

    .guided-preview__queue {
        display: grid;
        grid-template-columns: repeat(3, 11rem);
        overflow-x: auto;
        border-right: 0;
        border-bottom: var(--rule-hair) solid var(--color-line);
    }

    .guided-preview__queue > div:first-child {
        grid-column: 1 / -1;
    }

    .guided-preview__queue article {
        width: 11rem;
        min-width: 0;
    }

    .guided-preview__conversation > header {
        align-items: start;
        flex-direction: column;
        padding-block: 0.8rem;
    }

    .guided-preview__messages {
        min-height: 30rem;
        padding: 0.75rem;
    }

    .guided-preview__context {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .guided-preview__context > div:nth-child(2n) {
        border-right: 0;
    }

    .guided-preview__controls {
        align-items: stretch;
        flex-direction: column;
        padding-block: 0.8rem;
    }

    .guided-preview__controls > p {
        min-width: 0;
    }

    .guided-preview__controls > div:last-child {
        justify-content: end;
    }

    .faq-section__inner,
.pillar-section {
        padding-top: var(--space-3xl);
        padding-bottom: var(--space-3xl);
    }

    .pillar-section__grid {
        grid-template-columns: 1fr;
    }

    .pillar-section__grid article {
        min-height: 28rem;
    }

    .marketing-footer__lead > div {
        width: 100%;
        flex-direction: column;
    }

    .marketing-footer__lead > div > :is(a, button) {
        justify-content: center;
    }

    .marketing-footer-language__menu {
        left: 50%;
        transform: translateX(-50%);
        transform-origin: 50% 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .guided-preview__event,
.guided-preview__draft,
.guided-preview__progress button > span,
.faq-section__list details > p {
        animation: none;
    }
}
.marketing-nav__demo:hover {
    border-color: var(--color-line-strong);
    background: var(--color-snow);
    color: var(--color-charcoal);
    transform: translateY(-1px);
}

.guided-preview {
    box-shadow:
        0 24px 64px oklch(22% 0 0 / 0.13),
        0 0 62px color-mix(in srgb, var(--color-honey) 38%, transparent),
        0 0 118px color-mix(in srgb, var(--color-neutral-soft) 20%, transparent);
}

.walkthrough-launch .section-copy > .section-kicker {
    color: var(--color-charcoal);
    font-size: 0.7rem;
    letter-spacing: -0.01em;
    text-transform: none;
}

.walkthrough-launch .section-copy p {
    color: var(--color-ink-muted);
}

.home-final-cta__inner {
    background: var(--color-honey);
    color: var(--color-charcoal);
    box-shadow: 0 20px 64px
        color-mix(in srgb, var(--color-honey) 30%, transparent);
}

.home-final-cta h2,
.home-final-cta p {
    color: var(--color-charcoal);
}

.home-final-cta .marketing-primary-button,
.home-final-cta .marketing-primary-button:hover {
    border-color: var(--color-charcoal);
    background: var(--color-charcoal);
    color: var(--color-empty);
}

.home-final-cta .marketing-primary-button:hover {
    background: var(--color-ink-hover);
}

.home-final-cta .marketing-secondary-button {
    border-color: color-mix(in srgb, var(--color-black) 58%, transparent);
    background: color-mix(in srgb, var(--color-white) 58%, transparent);
    color: var(--color-charcoal);
}

.home-final-cta .marketing-secondary-button:hover {
    border-color: color-mix(in srgb, var(--color-black) 58%, transparent);
    background: color-mix(in srgb, var(--color-white) 78%, transparent);
    color: var(--color-charcoal);
}

.home-final-cta h2 {
    max-width: none;
}

.guided-preview__tower > span {
    color: var(--color-empty);
}
.section-kicker,
.section-copy > .section-kicker,
.control-tower-section__copy > .section-kicker,
.testimonial-section__heading .section-kicker,
.walkthrough-launch .section-copy > .section-kicker,
.home-final-cta .section-kicker {
    display: block;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--color-ink-muted);
    font-family: var(--font-family-body);
    font-size: 0.7rem;
    font-weight: 650;
    letter-spacing: -0.01em;
    line-height: 1.3;
    text-transform: none;
}

.section-kicker::before {
    display: none;
    content: none;
}

.home-final-cta .section-kicker {
    color: var(--color-ink-muted);
}

.home-hero .sample-brand-strip {
    width: 100%;
    margin-top: clamp(2.5rem, 6vh, 4.5rem);
}

.faq-section__inner {
    display: grid;
    width: min(100%, 68rem);
    grid-template-columns: minmax(15rem, 0.7fr) minmax(0, 1.3fr);
}

.faq-section__inner > .section-copy {
    justify-self: center;
    margin-inline: auto;
    text-align: center;
}

.faq-section__list {
    margin-top: 0;
}

.home-final-cta__inner {
    overflow: hidden;
    border-radius: var(--radius-panel);
    background: var(--color-white);
    background-clip: padding-box;
    box-shadow: 0 26px 30px -28px
        color-mix(in oklch, var(--color-charcoal) 30%, transparent);
}

.home-final-cta__inner::before {
    display: none;
}

.home-final-cta__inner::after {
    display: none;
}

.home-final-cta .marketing-primary-button {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border-color: var(--color-charcoal);
    background: var(--color-honey);
    color: var(--color-empty);
}

.home-final-cta .marketing-primary-button::before {
    position: absolute;
    z-index: 0;
    inset: -1px;
    border-radius: inherit;
    background: var(--color-charcoal);
    clip-path: inset(0 round var(--radius-medium));
    content: '';
    pointer-events: none;
    transition: clip-path 360ms var(--ease-out);
}

.home-final-cta .marketing-primary-button > span {
    position: relative;
    z-index: 1;
}

.home-final-cta .marketing-primary-button:hover {
    border-color: var(--color-honey);
    background: var(--color-honey);
    color: var(--color-black);
    transition:
        color var(--dur-base) var(--ease-out),
        background-color 1ms linear,
        border-color 1ms linear,
        transform var(--dur-base) var(--ease-out),
        box-shadow var(--dur-base) var(--ease-out);
}

.home-final-cta .marketing-primary-button:hover::before {
    clip-path: inset(50% round var(--radius-medium));
}

.home-final-cta .marketing-secondary-button:hover {
    border-color: var(--color-honey);
    color: var(--color-honey);
}

.testimonial-section__heading .section-kicker {
    color: var(--color-on-dark-muted);
}

html[data-theme='night'] .home-final-cta h2 {
    color: var(--color-white);
}

html[data-theme='night'] .home-final-cta__inner {
    background: var(--color-navy);
}

html[data-theme='night'] .home-final-cta p {
    color: var(--color-on-dark-muted);
}

html[data-theme='night'] .home-final-cta .marketing-primary-button {
    border-color: var(--color-white);
    background: var(--color-honey);
    color: var(--color-black);
}

html[data-theme='night'] .home-final-cta .marketing-primary-button::before {
    background: var(--color-white);
}

html[data-theme='night'] .home-final-cta .marketing-primary-button:hover {
    border-color: var(--color-honey);
    background: var(--color-honey);
    color: var(--color-black);
}

html[data-theme='night'] .home-final-cta .marketing-secondary-button {
    border-color: rgb(255 255 255 / 0.52);
    background: rgb(6 28 58 / 0.58);
    color: var(--color-white);
}

html[data-theme='night'] .home-final-cta .marketing-secondary-button:hover {
    border-color: var(--color-honey);
    background: rgb(6 28 58 / 0.72);
    color: var(--color-honey);
}

@media (min-width: 68.01rem) {

    .walkthrough-launch__inner > .section-copy {
        margin-inline: 0;
        text-align: left;
    }
}

@media (max-width: 68rem) {
    .faq-section__inner {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .home-final-cta__inner::before {
        animation: none;
        transform: none;
        will-change: auto;
    }

    .home-final-cta .marketing-primary-button::before {
        transition: none;
    }
}
.sample-brand-strip__track span,
.section-kicker,
.section-copy > .section-kicker,
.control-tower-section__copy > .section-kicker,
.testimonial-section__heading .section-kicker,
.walkthrough-launch .section-copy > .section-kicker {
    color: var(--color-ink-soft);
}

.guided-preview__topbar small,
.guided-preview__topbar > span,
.guided-preview__queue > div:first-child span,
.guided-preview__queue article,
.guided-preview__conversation > header div > span,
.guided-preview__conversation > header > span,
.guided-preview__event span,
.guided-preview__draft > div:first-child span,
.guided-preview__context span,
.guided-preview__context small {
    color: var(--color-ink-soft);
}

.guided-preview__context > div[data-visible='false'] {
    opacity: 0;
}

.guided-preview__tower > strong {
    color: var(--color-neutral-soft);
}

.guided-preview__tower > span,
.guided-preview__tower > small {
    color: var(--color-empty);
}
.home-hero {
    padding-top: clamp(9.25rem, calc(13vh + var(--space-xs)), 10.75rem);
    padding-bottom: clamp(0.75rem, calc(3vw - var(--space-xs)), 1.75rem);
}

.home-product-stage::after {
    position: absolute;
    z-index: 2;
    right: 0;
    bottom: 0;
    left: 0;
    height: clamp(13rem, 18vw, 16rem);
    background: linear-gradient(
        to top,
        var(--color-paper) 0%,
        color-mix(in oklch, var(--color-paper) 72%, transparent) 46%,
        transparent 100%
    );
    content: '';
    filter: blur(12px);
    pointer-events: none;
    transform: translateY(1.25rem);
}

.home-hero .sample-brand-strip {
    margin-top: clamp(2.25rem, 5vh, 3.75rem);
    padding-top: 0;
    border-top: 0;
}

.sample-brand-strip__track {
    animation-duration: 56s;
}
body:has(.home-hero)
    .marketing-nav__inner
    > .marketing-wordmark
    .marketing-wordmark__mark.is-loaded {
    transform-origin: center;
    animation: texly-wordmark-enter 580ms var(--ease-out) both;
    animation-play-state: paused;
}

body:has(.home-hero)
    .marketing-nav__inner
    > .marketing-wordmark
    .marketing-wordmark__mark.is-running {
    animation-play-state: running;
}

.pillar-section__grid article > small {
    padding: 0.85rem;
    border-top: 0;
    border-radius: var(--radius-large);
    background: var(--color-paper-subtle);
}

@media (max-width: 40rem) {
    .home-hero {
        padding-top: 8rem;
        padding-bottom: var(--space-xs);
    }

    .home-product-stage::after {
        height: 10rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    body:has(.home-hero)
        .marketing-nav__inner
        > .marketing-wordmark
        .marketing-wordmark__mark.is-loaded {
        animation: none;
        transform: none;
    }

    .home-product-preview__entrance {
        animation: none;
    }

    .sample-brand-strip__track {
        animation: none;
        transform: none;
    }
}

.pillar-section__grid header svg {
    color: var(--color-honey);
}

.pillar-section {
    background: var(--color-paper);
}

.pillar-section__grid article,
.pillar-section__grid article:hover {
    box-shadow: none;
}

.walkthrough-launch__intro > .section-kicker {
    color: var(--color-ink-muted);
}

@media (max-width: 56rem) {
    .marketing-nav__actions > .marketing-language,
.marketing-nav__actions > .marketing-theme-button,
.marketing-nav__actions > .marketing-nav__demo,
.marketing-nav__actions > .marketing-primary-button {
        display: none;
    }

    .marketing-mobile-theme,
.marketing-mobile-toggle {
        display: inline-grid;
    }
}
main:has(.home-hero) {
    --landing-section-gap: clamp(4rem, 8vw, 8rem);
}

main:has(.home-hero)
    > :is(
        .problem-section,
        .pillar-section,
        .workspace-showcase,
        .home-integration-section,
        .walkthrough-launch,
        .testimonial-section,
        .home-final-cta
    ) {
    margin-block-start: var(--landing-section-gap);
}

main:has(.home-hero) .section-kicker,
main:has(.home-hero) .section-copy > .section-kicker,
main:has(.home-hero) .integration-section__heading > .section-kicker,
main:has(.home-hero) .walkthrough-launch__intro > .section-kicker,
main:has(.home-hero) .testimonial-section__heading .section-kicker,
main:has(.home-hero) .home-final-cta .section-kicker {
    color: var(--color-honey);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.pillar-section {
    padding-top: clamp(3rem, 5svh, 4rem);
    padding-bottom: clamp(3rem, 5svh, 4rem);
    background: var(--color-paper);
}

.pillar-section > .section-copy {
    max-width: 62rem;
    margin-inline: auto;
    text-align: center;
}

.pillar-section > .section-copy h2 {
    max-width: 15ch;
    margin: 0.75rem auto 0;
    font-size: clamp(2.5rem, 4.5vw, 4rem);
    letter-spacing: -0.045em;
    line-height: 0.98;
}

.pillar-section > .section-copy p {
    max-width: 42rem;
    margin: 0.9rem auto 0;
    color: var(--color-ink-muted);
    font-size: 1rem;
    line-height: 1.65;
}

.control-solution-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 1rem;
    margin-top: clamp(1.75rem, 3svh, 2.5rem);
}

.control-solution-card {
    position: relative;
    display: flex;
    min-height: clamp(19rem, 31svh, 21rem);
    flex-direction: column;
    overflow: hidden;
    padding: clamp(1rem, 1.5vw, 1.15rem);
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-panel);
    background: var(--color-surface);
}

.control-solution-card--orchestrate,
.control-solution-card--improve {
    grid-column: span 7;
}

.control-solution-card--know,
.control-solution-card--assist {
    grid-column: span 5;
}

.control-solution-card__copy {
    position: relative;
    z-index: 2;
    max-width: 33rem;
}

.control-solution-card__copy > span {
    color: var(--color-honey);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.control-solution-card__copy h3 {
    max-width: 19ch;
    margin-top: 0.55rem;
    font-size: clamp(1.4rem, 2vw, 1.75rem);
    font-weight: 650;
    letter-spacing: -0.035em;
    line-height: 1.05;
}

.control-solution-card__copy p {
    max-width: 44ch;
    margin-top: 0.55rem;
    color: var(--color-ink-muted);
    font-size: 0.78rem;
    line-height: 1.5;
}

.solution-route-visual,
.solution-assist-visual,
.solution-improve-visual {
    position: relative;
    z-index: 1;
    margin-top: auto;
}

.solution-route-visual {
    display: grid;
    grid-template-columns: minmax(10rem, 1fr) 3.5rem minmax(9rem, 0.82fr);
    align-items: center;
    padding-top: 1rem;
}

.solution-route-visual__queue {
    display: grid;
    gap: 0.4rem;
}

.solution-route-visual__queue > div,
.solution-route-visual__owner {
    border: var(--rule-hair) solid var(--color-line);
    background: var(--color-paper);
}

.solution-route-visual__queue > div {
    display: flex;
    min-height: 2.4rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.5rem 0.7rem;
    border-radius: var(--radius-medium);
    font-size: 0.72rem;
    font-weight: 620;
    transition:
        border-color 420ms var(--ease-out),
        background-color 420ms var(--ease-out),
        transform 520ms var(--ease-out);
    transition-delay: 0ms;
}

.solution-route-visual__queue small {
    color: var(--color-ink-muted);
    font-size: 0.62rem;
}

.solution-route-visual__path {
    position: relative;
    display: grid;
    place-items: center;
}

.solution-route-visual__path::before {
    width: 100%;
    height: var(--rule-hair);
    background: var(--color-line-strong);
    content: '';
}

.solution-route-visual__path i {
    position: absolute;
    left: 0;
    width: 0.38rem;
    height: 0.38rem;
    border-radius: 50%;
    background: var(--color-honey);
    opacity: 0.18;
    transform: scale(0.66);
    transition:
        opacity 360ms var(--ease-in-out),
        transform 520ms var(--ease-in-out);
}

.solution-route-visual__path i:nth-child(2) {
    left: calc(50% - 0.19rem);
}

.solution-route-visual__path i:nth-child(3) {
    right: 0;
    left: auto;
}

.solution-route-visual__owner {
    display: grid;
    gap: 0.35rem;
    min-height: 5rem;
    align-content: center;
    padding: 0.65rem;
    border-radius: var(--radius-medium);
    transition:
        border-color 420ms var(--ease-out),
        background-color 420ms var(--ease-out);
}

.solution-route-visual__owner small,
.solution-route-visual__owner span {
    color: var(--color-ink-muted);
    font-size: 0.62rem;
}

.solution-route-visual__owner strong {
    font-size: 0.88rem;
}

.solution-route-visual__owner span {
    color: var(--color-honey);
    font-weight: 650;
}

.solution-context-visual {
    position: relative;
    display: grid;
    gap: 0.4rem;
    margin-top: auto;
    padding-top: 0.8rem;
}

.solution-context-visual > div,
.solution-context-visual > span {
    display: grid;
    gap: 0.3rem;
    min-height: 2.65rem;
    align-content: center;
    padding: 0.5rem 0.75rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-medium);
    background: var(--color-paper);
    transition:
        opacity 420ms var(--ease-out),
        transform 520ms var(--ease-out);
}

.solution-context-visual > div:nth-child(2) {
    margin-inline: 0.75rem;
}

.solution-context-visual > div:nth-child(3) {
    margin-inline: 1.5rem;
}

.solution-context-visual small {
    color: var(--color-ink-muted);
    font-size: 0.6rem;
}

.solution-context-visual strong {
    font-size: 0.72rem;
    line-height: 1.35;
}

.solution-context-visual > span {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 5.5rem;
    place-content: center;
    border-color: color-mix(in srgb, var(--color-honey) 60%, var(--color-line));
    background: color-mix(in srgb, var(--color-honey) 18%, var(--color-paper));
    opacity: 0;
    text-align: center;
    transform: translateY(1.2rem);
}

.solution-assist-visual {
    display: grid;
    gap: 0.65rem;
    padding: 0.8rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-medium);
    background: var(--color-paper);
}

.solution-assist-visual header,
.solution-assist-visual > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.solution-assist-visual header span {
    font-size: 0.72rem;
    font-weight: 650;
}

.solution-assist-visual header small,
.solution-assist-visual > div span {
    color: var(--color-ink-muted);
    font-size: 0.59rem;
}

.solution-assist-visual p {
    padding: 0.65rem;
    border-radius: var(--radius-small);
    background: var(--color-paper-subtle);
    font-size: 0.7rem;
    line-height: 1.55;
    transition:
        background-color 420ms var(--ease-out),
        box-shadow 420ms var(--ease-out);
}

.solution-assist-visual > div {
    justify-content: flex-start;
}

.solution-assist-visual > div span {
    padding: 0.25rem 0.45rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-pill);
}

.solution-assist-visual__action {
    justify-self: end;
    padding: 0.55rem 0.8rem;
    border-radius: var(--radius-small);
    background: var(--color-charcoal);
    color: var(--color-empty);
    font-size: 0.65rem;
    font-weight: 650;
    transition:
        background-color 420ms var(--ease-out),
        color 420ms var(--ease-out);
}

.solution-improve-visual {
    display: grid;
    grid-template-columns: minmax(8rem, 0.55fr) minmax(12rem, 1fr);
    grid-template-rows: auto auto;
    gap: 0.65rem;
    align-items: end;
    padding-top: 0.75rem;
}

.solution-improve-visual__metric {
    display: grid;
    gap: 0.25rem;
    align-self: start;
}

.solution-improve-visual__metric span,
.solution-improve-visual__metric small,
.solution-improve-visual__finding small,
.solution-improve-visual__finding span {
    color: var(--color-ink-muted);
    font-size: 0.62rem;
}

.solution-improve-visual__metric strong {
    font-family: var(--font-family-display);
    font-size: clamp(2.25rem, 4vw, 3.25rem);
    letter-spacing: -0.05em;
    line-height: 0.95;
}

.solution-improve-visual__metric small {
    color: var(--color-honey);
    font-weight: 650;
}

.solution-improve-visual__chart {
    display: flex;
    height: 5rem;
    align-items: end;
    gap: 0.35rem;
    padding: 0.75rem;
    border-bottom: var(--rule-hair) solid var(--color-line-strong);
}

.solution-improve-visual__chart i {
    width: 100%;
    height: 24%;
    border-radius: 0.2rem 0.2rem 0 0;
    background: var(--color-honey);
    opacity: 0.72;
    transition: height 620ms var(--ease-out);
    transition-delay: 0ms;
}

.solution-improve-visual__finding {
    display: grid;
    grid-column: 1 / -1;
    gap: 0.3rem;
    padding: 0.6rem 0.75rem;
    border: var(--rule-hair) solid var(--color-line);
    border-radius: var(--radius-medium);
    background: var(--color-paper);
    transition:
        border-color 420ms var(--ease-out),
        transform 520ms var(--ease-out);
}

.solution-improve-visual__finding strong {
    font-size: 0.78rem;
}

@media (hover: hover) and (pointer: fine) {
    .control-solution-card--orchestrate:hover
        .solution-route-visual__queue
        > div:first-child {
        border-color: var(--color-honey);
        background: color-mix(
            in srgb,
            var(--color-honey) 14%,
            var(--color-paper)
        );
        transform: translateX(0.65rem);
    }

    .control-solution-card--orchestrate:hover .solution-route-visual__path i {
        opacity: 1;
        transform: scale(1);
    }

    .control-solution-card--orchestrate:hover
        .solution-route-visual__path
        i:first-child {
        transform: translateX(0.5rem) scale(1);
    }

    .control-solution-card--orchestrate:hover
        .solution-route-visual__path
        i:nth-child(3) {
        transform: translateX(-0.5rem) scale(1);
    }

    .control-solution-card--orchestrate:hover .solution-route-visual__owner {
        border-color: var(--color-honey);
        background: color-mix(
            in srgb,
            var(--color-honey) 12%,
            var(--color-paper)
        );
    }

    .control-solution-card--know:hover .solution-context-visual > div {
        opacity: 0.16;
        transform: translateY(2rem) scale(0.96);
    }

    .control-solution-card--know:hover .solution-context-visual > span {
        opacity: 1;
        transform: translateY(0);
    }

    .control-solution-card--assist:hover .solution-assist-visual p {
        background: color-mix(
            in srgb,
            var(--color-honey) 17%,
            var(--color-paper)
        );
        box-shadow: inset 0 -0.16rem var(--color-honey);
    }

    .control-solution-card--assist:hover .solution-assist-visual__action {
        background: var(--color-honey);
        color: var(--color-charcoal);
    }

    .control-solution-card--improve:hover .solution-improve-visual__chart i {
        height: var(--solution-bar);
    }

    .control-solution-card--improve:hover .solution-improve-visual__finding {
        border-color: var(--color-honey);
        transform: translateY(-0.4rem);
    }
}

.workspace-showcase__frame {
    padding: clamp(4rem, 8vw, 7rem) clamp(1.5rem, 6vw, 5.5rem);
}

.workspace-showcase__intro {
    max-width: 58rem;
    margin-inline: auto;
    text-align: center;
}

.workspace-showcase__intro h2 {
    max-width: 16ch;
    margin: 1.25rem auto 0;
    font-size: clamp(3rem, 5.6vw, 4.75rem);
}

.workspace-showcase__intro p {
    max-width: 40rem;
    margin: 1.35rem auto 0;
}

.workspace-showcase__indicator-grid {
    gap: 1rem;
    margin-top: 3rem;
    padding-top: 0;
    border-top: 0;
}

.workspace-showcase__indicator-grid article {
    padding: 1.1rem 1.25rem;
    border: var(--rule-hair) solid rgb(255 255 255 / 0.11);
    border-radius: var(--radius-medium);
    background: rgb(255 255 255 / 0.035);
    text-align: left;
}

.workspace-showcase__indicator-grid article:first-child {
    padding-left: 1.25rem;
    border-left: var(--rule-hair) solid rgb(255 255 255 / 0.11);
}

.workspace-showcase__indicator-grid strong {
    font-size: clamp(2.2rem, 3.5vw, 3.25rem);
}

.workspace-showcase__features {
    margin-top: clamp(4rem, 8vw, 6.5rem);
}

.workspace-feature,
.workspace-feature[data-reverse='true'] {
    display: grid;
    min-height: 0;
    grid-template-areas: 'copy visual';
    grid-template-columns: minmax(15rem, 0.58fr) minmax(0, 1.42fr);
    grid-template-rows: auto;
    gap: clamp(2.5rem, 6vw, 5.5rem);
    align-items: center;
    padding-block: clamp(4rem, 7vw, 6rem);
}

.workspace-feature[data-reverse='true'] {
    grid-template-areas: 'visual copy';
    grid-template-columns: minmax(0, 1.42fr) minmax(15rem, 0.58fr);
}

.workspace-feature:last-child {
    padding-bottom: 0;
}

.workspace-feature__intro {
    grid-area: copy;
    align-self: center;
}

.workspace-feature__intro h3 {
    max-width: 15ch;
    margin-top: 0;
    font-size: clamp(1.8rem, 3vw, 2.7rem);
    line-height: 1.05;
}

.workspace-feature__intro p {
    max-width: 34ch;
    margin-top: 1rem;
    font-size: 0.9rem;
    line-height: 1.6;
}

.workspace-feature__intro a {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    gap: 0.45rem;
    margin-top: 1.15rem;
    color: var(--color-empty);
    font-size: 0.78rem;
    font-weight: 650;
    text-decoration: underline;
    text-decoration-color: rgb(253 191 45 / 0.65);
    text-underline-offset: 0.35rem;
}

.workspace-feature__intro a svg {
    width: 0.9rem;
    transition: transform var(--dur-base) var(--ease-out);
}

.workspace-feature__intro a:hover svg {
    transform: translateX(0.2rem);
}

.workspace-feature__visual {
    position: relative;
    grid-area: visual;
    aspect-ratio: 36 / 25;
    overflow: hidden;
    margin: 0;
    border: var(--rule-hair) solid rgb(255 255 255 / 0.16);
    border-radius: var(--radius-medium);
    background: #f4f5f7;
}

.workspace-feature__visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top left;
}

.workspace-feature__visual figcaption {
    position: absolute;
    right: 0.75rem;
    bottom: 0.75rem;
    padding: 0.35rem 0.55rem;
    border: var(--rule-hair) solid rgb(255 255 255 / 0.22);
    border-radius: var(--radius-pill);
    background: rgb(6 28 58 / 0.84);
    color: var(--color-empty);
    font-size: 0.58rem;
    backdrop-filter: blur(0.5rem);
}

.integration-node[data-integration='salesforce']
    .integration-node__surface
    > img {
    --integration-logo-scale: 2.45;
}

main:has(.home-hero) .home-final-cta .section-kicker {
    display: inline-flex;
    width: fit-content;
    padding: 0.36rem 0.55rem;
    border-radius: var(--radius-small);
    background: var(--color-charcoal);
}

.home-final-cta > .home-final-cta__inner {
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.home-final-cta__copy {
    display: grid;
    max-width: 54rem;
    justify-items: center;
}

.home-final-cta__copy h2 {
    max-width: none;
    margin-inline: auto;
    font-size: clamp(1.95rem, 7vw, 4.25rem);
}

.home-final-cta__copy h2 > span {
    display: block;
    white-space: nowrap;
}

.home-final-cta__copy p {
    margin-inline: auto;
}

.home-final-cta__actions {
    justify-content: center;
}

.workspace-showcase__reveal.section-reveal {
    opacity: 0.28;
    transform: translateY(8px);
    transition-duration: 360ms;
}

.workspace-showcase__reveal.section-reveal[data-visible='true'] {
    opacity: 1;
    transform: translateY(0);
}

@media (max-width: 64rem) {
    .control-solution-card {
        grid-column: span 6;
    }

    .solution-route-visual {
        grid-template-columns: 1fr 2rem;
    }

    .solution-route-visual__owner {
        grid-column: 1 / -1;
        min-height: 5rem;
        margin-top: 0.5rem;
    }

    .workspace-feature,
.workspace-feature[data-reverse='true'] {
        grid-template-areas:
            'copy'
            'visual';
        grid-template-columns: minmax(0, 1fr);
        gap: 2rem;
    }

    .workspace-feature__intro h3,
.workspace-feature__intro p {
        max-width: 40rem;
    }
}

@media (max-width: 45rem) {

    .control-solution-card {
        min-height: 28rem;
        grid-column: 1 / -1;
    }

    .solution-route-visual {
        grid-template-columns: 1fr;
    }

    .solution-route-visual__path {
        display: none;
    }

    .solution-improve-visual {
        grid-template-columns: 1fr;
    }

    .solution-improve-visual__chart,
.solution-improve-visual__finding {
        grid-column: 1;
    }

    .workspace-showcase__frame {
        padding-inline: 1.25rem;
        border-radius: 0;
    }

    .workspace-showcase__indicator-grid {
        grid-template-columns: 1fr;
        overflow: visible;
    }

    .workspace-showcase__indicator-grid article {
        min-width: 0;
    }

    .workspace-feature__visual {
        aspect-ratio: 4 / 3;
    }
}

@media (prefers-reduced-motion: reduce) {
    .workspace-showcase__reveal.section-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .home-final-cta .marketing-primary-button,
.home-final-cta .marketing-primary-button:hover {
        transition: none;
    }

    .solution-route-visual__queue > div,
.solution-route-visual__owner,
.solution-context-visual > div,
.solution-context-visual > span,
.solution-assist-visual p,
.solution-assist-visual__action,
.solution-improve-visual__chart i,
.solution-improve-visual__finding,
.solution-route-visual__path i {
        transition: none;
    }
}
main:has(.home-hero) .testimonial-section {
    display: flex;
    align-items: stretch;
    flex-direction: column;
    justify-content: center;
}

main:has(.home-hero) .testimonial-section__inner,
main:has(.home-hero) .testimonial-section__heading,
main:has(.home-hero) .testimonial-carousel {
    min-width: 0;
    max-width: 100%;
}

main:has(.home-hero) .workspace-showcase .section-kicker {
    color: var(--color-honey);
}

.pillar-section > .section-copy p,
.control-solution-card__copy p,
.solution-route-visual__queue small,
.solution-route-visual__owner small,
.solution-context-visual small,
.solution-assist-visual header small,
.solution-assist-visual > div span,
.solution-improve-visual__metric span,
.solution-improve-visual__finding small,
.solution-improve-visual__finding span {
    color: var(--color-secondary-text);
}

@keyframes menu-enter {
    from {
        opacity: 0;
        transform: translateY(-0.4rem) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes mega-menu-enter {
    from {
        opacity: 0;
        transform: translateX(-50%);
    }
    to {
        opacity: 1;
        transform: translateX(-50%);
    }
}

@keyframes mega-menu-switch {
    from {
        opacity: 0.72;
    }

    to {
        opacity: 1;
    }
}

@keyframes hero-enter {
    from {
        opacity: 0;
        transform: translateY(0.8rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes brand-marquee {
    to {
        transform: translateX(-50%);
    }
}
@keyframes dialog-enter {
    from {
        opacity: 0;
        transform: translateY(0.75rem) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes integration-beam-flow {
    from {
        stroke-dashoffset: 100;
    }

    to {
        stroke-dashoffset: 0;
    }
}

@keyframes home-product-preview-enter {
    from {
        opacity: 0;
        transform: translate3d(0, 1.25rem, 0);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes final-cta-flow {
    from {
        transform: translate3d(-3%, -2%, 0) rotate(-2deg) scale(1.02);
    }
    to {
        transform: translate3d(4%, 3%, 0) rotate(3deg) scale(1.08);
    }
}

@keyframes guided-event-enter {
    from {
        opacity: 0;
        filter: blur(5px);
        transform: translateY(0.65rem);
    }
}

@keyframes guided-progress {
    to {
        width: 100%;
    }
}

@keyframes faq-answer-enter {
    from {
        opacity: 0;
        transform: translateY(-0.35rem);
    }
}

@keyframes footer-language-enter {
    from {
        opacity: 0;
        filter: blur(4px);
        transform: translateY(0.45rem) scale(0.98);
    }
}

@keyframes texly-wordmark-enter {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(180deg);
    }
}
