/* Figma gave this as a fixed 1440px box with 120px 273px padding.
   273px is column 3 on the 12-col grid, so the inset is expressed as a
   column span instead — it holds at every breakpoint. */
.cta-left__wrap {
    /* background: var(--teal-100); */
    padding: 120px 0;
}

.cta-left {
    grid-column: 3 / -3;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.cta-left__title {
    color: var(--neutral-30);
}

/* The component's gap owns the rhythm — drop the global eyebrow margin. */
.cta-left__eyebrow.eyebrow:has(+ *) {
    margin-bottom: 32px;
}

.cta-left__button {
    margin-top: 40px;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 1024px) {
    .cta-left__wrap {
        padding: 100px 0;
    }
    .cta-left {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767px) {
    .cta-left__wrap {
        padding: 80px 0;
    }
}