#section-cta-1 {
    margin: 150px 0;
}
#section-cta-1-content h3 {
    font-size: 60px;
    line-height: 70px;
    margin: 0 0 40px 0;
    text-align: center;
}

#section-cta-1-text {
    font-size: 16px;
    line-height: 30px;
    text-align: center;
    max-width: 680px;
    margin: 0 auto;
}

#section-cta-1-items {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.section-cta-1-item {
    position: relative;
    display: grid;
    grid-template-areas:
        "image image image image"
        ". title arrow ."
        ". text arrow ."
    ;
    grid-template-columns: 15px 1fr auto 15px;
    grid-template-rows: auto auto auto;
    padding: 20px;
    border-radius: 20px;
    background: #FFF;
    box-shadow: 30px 33px 40px 0 rgba(2, 20, 76, 0.15);
    text-decoration: none;
    color: inherit;
    max-width: 520px;
    width: calc(33.33% - 15px);
}

.section-cta-1-item-image {
    grid-area: image;
    position: relative;
    width: 100%;
    aspect-ratio: 1.5;
    border-radius: 10px;
    margin-bottom: 25px;
    overflow: hidden;
    background-color: var(--bg-color);
}

.section-cta-1-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: all 150ms linear;
}

.section-cta-1-item-image.image-overlap {
    overflow: visible;
}

.section-cta-1-item-image.image-overlap img {
    object-fit: contain;
    margin: -25px 10px 0 10px;
}

.section-cta-1-item-title {
    grid-area: title;
    font-size: 20px;
    line-height: 28px;
    font-weight: 800;
}

.section-cta-1-item-text {
    grid-area: text;
    font-size: 16px;
    line-height: 30px;
}

.section-cta-1-item::after {
    grid-area: arrow;
    content: '';
    display: block;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    background: #02144C;
    align-self: end;

    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="white" d="M439.1 297.4C451.6 309.9 451.6 330.2 439.1 342.7L279.1 502.7C266.6 515.2 246.3 515.2 233.8 502.7C221.3 490.2 221.3 469.9 233.8 457.4L371.2 320L233.9 182.6C221.4 170.1 221.4 149.8 233.9 137.3C246.4 124.8 266.7 124.8 279.2 137.3L439.2 297.3z"/></svg>');
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: center;
    transition: all 150ms linear;
    margin-left: 20px;
}

.section-cta-1-item:hover::after {
    background-position: 15px center;
}

.section-cta-1-item:hover img {
    transform: scale(1.05);
}

#section-cta-1-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-top: 40px;
}

@media only screen and (max-width: 1200px) {
    #section-cta-1-content h3 {
        font-size: 26px;
        line-height: 30px;
    }

    #section-cta-1-text {
        font-size: 14px;
        line-height: 20px;
    }

    .section-cta-1-item-title {
        font-size: 20px;
        line-height: 26px;
    }

    .section-cta-1-item-text {
        font-size: 14px;
        line-height: 20px;
    }
    
    #section-cta-1-buttons {
        gap: 10px;
    }
    .section-cta-1-item {
        position: relative;
        display: grid;
        grid-template-areas:
            "image"
            "title"
            "text"
        ;
        grid-template-columns: 1fr;
        width: 100%;
    }
    .section-cta-1-item::after {
        display: none;
    }

}


@media only screen and (max-width: 900px) {
    #section-cta-1 {
        margin: 50px 0;
    }
    #section-cta-1-items {
        flex-direction: column;
        gap: 20px;
    }
    .section-cta-1-item {
        max-width: 100%;
    }
    .section-cta-1-item-image {
        margin-bottom: 10px;
    }
    .section-cta-1-item-title {
        margin-bottom: 10px;
    }
}