/*
 * Webflow site-wide custom code — FOOTER styles.
 *
 * Canonical source for the 2026 Webflow marketing site's Site Settings ->
 * Custom Code "Footer Code" <style> block (Webflow site
 * 6a3f0f590ca9a8fcf0e4fb5c). Served on Vercel from the marketing app's public/
 * dir and referenced from Webflow via a single <link> so the code lives here
 * (versioned, reviewable) instead of being pasted — and clobbered — in the
 * Webflow UI.
 *
 * Edit here, not in Webflow. Uses Webflow Designer CSS variables
 * (--dark-beige, --tangerine-dk) defined by the site's stylesheet.
 */

.mobile-menu.is-open {
    display: block;
}
/* Sticky fix: overflow-x:hidden on html/body creates a scroll container that breaks position:sticky (secondary nav). clip stops horizontal scroll without that side effect. */
html,
body {
    overflow-x: clip;
    overflow-y: visible;
}
/* ===== HOME SECTION CSS ===== */
.sol-tile + .sol-tile {
    border-left: 1px solid var(--dark-beige);
}
.feat-row-inner.reverse {
    direction: rtl;
}
.feat-row-inner.reverse > * {
    direction: ltr;
}
.hiw-step + .hiw-step {
    padding-left: 40px;
    border-left: 1px solid var(--dark-beige);
}
.partners-group-label::before,
.partners-group-label::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--dark-beige);
}
.feat-link:hover,
.sol-ghost:hover {
    color: #7b2b1e;
    opacity: 1;
}
/* FAQ accordion (CMS Collection List items are divs) — icon spins 180° while the upright bar lies flat into the − */
.faq-q {
    cursor: pointer;
}
.faq-a {
    height: 0;
    overflow: hidden;
    transition: height 0.25s ease;
}
.faq-icon {
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.faq-icon::before,
.faq-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: var(--tangerine-dk);
    transform: translate(-50%, -50%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.faq-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}
.faq-item.open .faq-icon {
    transform: rotate(180deg);
}
.faq-item.open .faq-icon::after {
    transform: translate(-50%, -50%) rotate(0deg);
}
.faq-a p {
    margin: 0;
}
/* Secondary-nav scrollspy — active pill = current in-view section; hover = lighter preview of active */
[class$="-anchorband"] a {
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease;
}
[class$="-anchorband"] a:not(.active):hover {
    background-color: color-mix(in srgb, var(--tangerine-dk) 14%, transparent);
    border-color: var(--tangerine-dk);
    color: var(--tangerine-dk);
}
[class$="-anchorband"] a.active {
    background-color: var(--tangerine-dk);
    border-color: var(--tangerine-dk);
    color: #fff;
}
/* Secondary-nav: horizontal scroll on mobile (peek + active pill auto-centers via JS) */
@media (max-width: 767px) {
    [class$="-anchors"] {
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        padding-left: 16px;
        padding-right: 16px;
    }
    [class$="-anchors"]::-webkit-scrollbar {
        display: none;
    }
    [class$="-anchorband"] .inner {
        max-width: none;
        padding-left: 0;
        padding-right: 0;
    }
    [class$="-anchorband"] a {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}
@media (max-width: 991px) {
    .solutions-grid {
        grid-template-columns: 1fr;
    }
    .sol-tile + .sol-tile {
        border-left: none;
        border-top: 1px solid var(--dark-beige);
    }
    .feat-row-inner {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .feat-row-inner.reverse {
        direction: ltr;
    }
    .cta-band-inner {
        grid-template-columns: 1fr;
        gap: 32px;
    }
}
@media (max-width: 767px) {
    .stats-grid {
        grid-template-columns: 1fr;
    }
    .stat-cell {
        padding-right: 0;
    }
    .hiw-steps {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .hiw-step + .hiw-step {
        padding-left: 0;
        border-left: none;
    }
    .partners-slot-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .quote-text {
        font-size: 24px;
    }
    .stats-h2,
    .solutions-h2,
    .hiw-h2,
    .cta-band-h2 {
        font-size: 32px;
    }
    .feat-h2,
    .partners-h2,
    .faq-h2 {
        font-size: 30px;
    }
    .feat-visual {
        aspect-ratio: 16 / 10;
    }
}