*,
html,
body {
        margin: 0;
        padding: 0;
        scroll-behavior: smooth;
        font-family: 'Roboto', sans-serif;
}

ul li {
        list-style-type: none;
        margin: 7px auto;
}

a {
        text-decoration: none;
}

@media (max-width: 450px) {

        /* html {
                font-size: 75%;
        } */

        /* === START - HERO === */

        #hero .container-hero .hero-item-1 .hero-title .hero-item span {
                display: flex;
                justify-content: center;
        }

        #hero .container-hero .hero-item-1 .hero-title .hero-item {
                text-align: center;
        }

        #hero .container-hero .hero-item-1 .hero-title .hero-item h4 {
                display: flex;
                justify-content: center;
                text-align: center;
                text-indent: 0;
        }

        #hero .container-hero .hero-item-2 .hero-carousel img {
                max-width: 75%;
        }

        /* === END - HERO === */

        /* === START SECTION WRAPPER-1 === */

        .wrapper-1 .swiper {
                max-width: 15rem;
        }

        .wrapper-1 .container-card-content {
                width: 100%;
        }

        .wrapper-1 .swiper-slide .card .card__img {
                width: auto;
        }

        .wrapper-1 .swiper-slide .card .card__order .button2,
        .wrapper-1 .swiper-slide .card .card__order .button1 {
                padding: 0.5rem;
                margin: auto 0.2rem;
        }

        /* === END SECTION WRAPPER-1 === */


        /* === START SECTION WRAPPER-2 === */

        .wrapper-2 .container-card-plan .card {
                width: 23rem;
        }

        /* === END SECTION WRAPPER-2 === */

}