/**
 * Shared closer — legacy cta-banner layout.
 * Tokens only. No arrow motion.
 */

.site-cta {
    --site-cta-tone: color-mix(in srgb, var(--wp--preset--color--hero-blue) 72%, var(--wp--preset--color--text-main));
    padding-block: clamp(var(--wp--preset--spacing--48), 6vw, var(--wp--preset--spacing--96));
    background: var(--wp--preset--color--bg);
}

.site-cta__panel,
.site-cta__copy,
.site-cta__action {
    min-width: 0;
    box-sizing: border-box;
}

.site-cta__panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: clamp(var(--wp--preset--spacing--24), 4vw, var(--wp--preset--spacing--48));
    align-items: center;
    padding: clamp(var(--wp--preset--spacing--32), 4vw, var(--wp--preset--spacing--48));
    background: var(--wp--preset--color--surface);
    color: var(--wp--preset--color--text-main);
    border-radius: var(--t1-radius-panel, var(--wp--custom--radius--panel, 16px));
}

.site-cta__eyebrow {
    margin: 0 0 var(--wp--preset--spacing--12);
    font-family: var(--wp--preset--font-family--body);
    font-size: var(--wp--preset--font-size--xs);
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--site-cta-tone);
}

.site-cta h2 {
    margin: 0;
    max-width: 18ch;
    font-family: var(--wp--preset--font-family--heading);
    font-size: var(--wp--preset--font-size--2xl);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--wp--preset--color--text-main);
    text-wrap: balance;
}

.site-cta__support {
    margin: var(--wp--preset--spacing--8) 0 0;
    max-width: 34rem;
    font-size: var(--wp--preset--font-size--sm);
    line-height: 1.5;
    color: var(--wp--preset--color--text-muted);
}

.site-cta__stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wp--preset--spacing--16) var(--wp--preset--spacing--32);
    margin-top: var(--wp--preset--spacing--24);
}

.site-cta__stats > div {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--8);
    min-width: 0;
}

.site-cta__stat-value {
    font-family: var(--wp--preset--font-family--heading);
    font-size: var(--wp--preset--font-size--xl);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1;
    color: var(--site-cta-tone);
}

.site-cta__stat-label {
    font-size: var(--wp--preset--font-size--xs);
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--wp--preset--color--text-muted);
}

.site-cta__action {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--wp--preset--spacing--12);
}

.site-cta .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--wp--preset--spacing--8);
    width: auto;
    max-width: 100%;
    min-height: 52px;
    padding: var(--wp--preset--spacing--12) var(--wp--preset--spacing--32);
    border: 1px solid transparent;
    border-radius: var(--t1-radius-button);
    box-sizing: border-box;
    text-decoration: none;
    font-family: var(--wp--preset--font-family--body);
    font-size: var(--wp--preset--font-size--base);
    font-weight: 600;
    line-height: 1;
}

.site-cta .btn .arrow-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.site-cta .btn-primaer {
    background: var(--wp--preset--color--hero-blue);
    color: var(--wp--preset--color--card);
    border-color: var(--wp--preset--color--hero-blue);
}

.site-cta .btn-primaer:hover {
    background: var(--wp--preset--color--text-main);
    color: var(--wp--preset--color--card);
    border-color: var(--wp--preset--color--text-main);
}

.site-cta__note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--wp--preset--spacing--8);
    margin: 0;
    font-size: var(--wp--preset--font-size--xs);
    color: var(--wp--preset--color--text-muted);
}

.site-cta__note svg {
    flex-shrink: 0;
}

@media (max-width: 900px) {
    .site-cta__panel {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .site-cta h2,
    .site-cta__support {
        max-width: none;
    }

    .site-cta__stats {
        justify-content: center;
    }

    .site-cta__action {
        align-items: stretch;
        width: min(24rem, 100%);
    }

    .site-cta .btn {
        width: 100%;
        max-width: 100%;
        justify-content: center;
    }
}
