.basic_2cols {
    position: relative;

    .basic_2cols__content {
        @media (max-width: 768px) {
            gap: 30px 0px;
        }

        @media (min-width: 769px) {
            .basic_2cols__para {
                position: relative;
                z-index: 1;

                &:after {
                    content: '';
                    background-image: url(../../img/graines_basictwo.svg);
                    background-repeat: no-repeat;
                    position: absolute;
                    width: 50%;
                    height: 100%;
                    top: 70%;
                    transform: translateY(-50%);
                    opacity: 0.05;
                    z-index: 0;
                    pointer-events: none;
                }

                h2, .h2_like {                  
                    padding-left: 0px !important;
                    margin-bottom: 25px;
                }

                > p {
                    color: var(--green-dark1);

                    @media (min-width: 992px) {
                        max-width: 75%;

                        &:not(:last-child) {
                            margin-bottom: 25px;
                        }
                    }
                }

                .cta {
                    margin-top: 40px;
                }
            }

            .basic_2cols__media {
                img {
                    position: absolute;
                    top: 0;
                    height: 100%;
                    width: 47%;
                    object-fit: cover;
                }
            }

            &:not(.reverse) {
                .basic_2cols__media {
                    img {
                        right: 0;
                    }
                }

                .basic_2cols__para {
                    &:after {
                        right: 50%;
                    }
                }
            }

            &.reverse {

                .basic_2cols__media {
                    img {
                        left: 0;
                    }
                }

                .basic_2cols__para {
                    &:after {
                        left: 50%;
                    }
                }
            }
        }
    }
}

@media (min-width: 992px) {
    .basic_2cols:has(.section__title + .container.w_title) {
        margin-top: 200px; 
        
        .section__title {
            margin-top: -200px;
        }
        
        .basic_2cols__para {
            margin-top: 100px;
        }
    }
}
