/* ==========================================================================
   CTA
   ========================================================================== */

.cta {
    padding-block: var(--space-650);

    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(99, 154, 175, 0.22) 0%,
            rgba(99, 154, 175, 0.10) 32%,
            transparent 64%
        ),
        color-mix(in srgb, var(--hero-background) 95%, white);
    color: var(--color-white);
}

.cta__inner {
    max-width: 700px;
    margin-inline: auto;

    text-align: center;
}

.cta__title {
    margin-bottom: var(--space-250);

    color: var(--color-white);

    font-size: clamp(
        var(--font-size-600),
        calc(1.5rem + 0.8vw),
        var(--font-size-625)
    );
    font-weight: var(--font-weight-600);
    line-height: var(--line-height-tight);
    letter-spacing: -0.01em;
}

.cta__description {
    max-width: 48ch;
    margin-inline: auto;

    color: var(--color-gray-300);

    font-size: var(--font-size-350);
    line-height: var(--line-height-body);
}

.cta__actions {
    display: flex;
    justify-content: center;

    margin-top: var(--space-400);
}


/* ==========================================================================
   Responsive
   ========================================================================== */

@media (min-width: 1440px) and (min-height: 900px) {

    .cta {
        padding-block: calc(var(--space-650) + var(--space-200));
    }

}

@media (max-width: 1199px) {

    .cta {
        padding-block: var(--space-575);
    }

    .cta__title {
        font-size: clamp(
            var(--font-size-500),
            calc(1rem + 1.25vw),
            var(--font-size-600)
        );
    }

    .cta__description {
        font-size: var(--font-size-300);
    }

}

@media (max-width: 1023px) {

    .cta__description {
        font-size: var(--font-size-250);
    }

    .cta__actions {
        margin-top: var(--space-575);
    }

}