.values {
    padding-left: 24px;
    padding-right: 24px;

    .values__heading {
        padding-bottom: 32px;

    }

    .values__content {
        gap: 24px;

        .values__card {
            width: 100%;
            border-radius: 32px !important;
            padding: 24px !important;
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.10);

            figure,
            h2,
            p {
                max-width: 100%;
            }

            figure {
                img {
                    width: 64px;
                    height: 64px;
                }
            } 

            h2 {
                font-size: 20px !important;
                padding-top: 1em;
            }
        }
    }

    .btns {
        padding-top: 48px;
        gap: 24px;
    }
}

@media only screen and (min-width: 768px) {
    .values {
        .values__heading {
            padding-bottom: 32px;
    
        }
    
        .values__content {
            gap: 24px;
            align-items: stretch;
    
            .values__card {
                width: 48%;
            }
        }
    }

}



@media only screen and (min-width: 1300px) {
    .values {
        padding-left: 4.16vw;
        padding-right: 4.16vw;

        .values__content {
            padding: 24px 0;

            .values__card {
                width: 23%;
            }
        }
 
    }

}


@media only screen and (min-width: 1800px) {

    .values {
        
        .values__content {

            .values__card {
                padding: 32px !important;
            }
        }
 
    }
}