@media(max-width:991px) {

    .header-search {

        width: 100%;
    }

    .top-content {

        font-size: 12px;
        gap: 10px;
    }

    .logo {

        height: 45px;
    }

    .mobile-search {

        background: #fff;
        padding: 15px 0;
    }

    .category-scroll {

        padding-bottom: 15px;
    }

}

@media(max-width:576px) {

    .top-content {

        justify-content: center;
    }

    .cat-item {

        padding: 8px 15px;
        font-size: 14px;
    }

}

/* HERO */

@media(max-width:991px) {

    .carousel-item img {

        height: 420px;
    }

    .slider-text {

        text-align: center;

        margin: auto;
    }

    .slider-text h1 {

        font-size: 42px;
    }

}

@media(max-width:768px) {

    .carousel-item img {

        height: 340px;
    }

    .slider-text {

        max-width: 90%;
    }

    .slider-text h1 {

        font-size: 32px;
    }

    .slider-text p {

        font-size: 15px;
    }

    .shop-btn {

        padding: 12px 28px;
    }

    .carousel-control-next,
    .carousel-control-prev {

        display: none;
    }

}

.collections-section {

    padding: 50px 0;
}

@media(max-width:768px) {

    .section-header {

        flex-direction: column;

        align-items: flex-start;

        gap: 10px;
    }

    .section-header h2 {

        font-size: 28px;
    }

    .collection-card {

        padding: 20px 10px;
    }

    .collection-icon {

        font-size: 32px;
    }

    .collection-card h6 {

        font-size: 14px;
    }

}

/*=========================
    PROMO BANNER
==========================*/

@media(max-width:991px) {

    .promo-banner {

        padding: 40px 30px;

        text-align: center;
    }

    .promo-banner h2 {

        font-size: 36px;
    }

    .promo-banner p {

        margin: auto auto 25px;
    }

    .promo-image {

        margin-top: 35px;

        max-height: 260px;
    }

}

@media(max-width:576px) {

    .promo-banner {

        border-radius: 20px;

        padding: 30px 20px;
    }

    .promo-banner h2 {

        font-size: 28px;
    }

    .offer-badge {

        font-size: 13px;
    }

    .promo-btn {

        width: 100%;
    }

}

/*============================
        PRODUCTS
=============================*/

@media(max-width:992px) {

    .product-name {

        font-size: 17px;

        min-height: auto;
    }

    .offer-price {

        font-size: 24px;
    }

}

@media(max-width:576px) {

    .product-section {

        padding: 40px 0;
    }

    .section-heading h2 {

        font-size: 24px;
    }

    .view-all {

        font-size: 14px;
    }

    .product-card {

        border-radius: 14px;
    }

    .product-image {

        padding: 12px;
    }

    .product-body {

        padding: 14px;
    }

    .brand {

        font-size: 10px;
    }

    .product-name {

        font-size: 15px;

        line-height: 1.4;
    }

    .offer-price {

        font-size: 22px;
    }

    .actual-price {

        font-size: 13px;
    }

    .btn-view {

        font-size: 13px;

        padding: 8px;
    }

    .btn-cart {

        width: 40px;
    }

}

@media(max-width:768px) {

    .testimonial-card {

        padding: 65px 18px 20px;
    }

    .testimonial-card p {

        min-height: auto;
    }

}

/*=========================
        FOOTER
==========================*/

@media(max-width:768px) {

    .footer-features {

        padding: 30px 0;
    }

    .feature-box {

        margin-bottom: 25px;
    }

    .main-footer {

        text-align: center;
    }

    .main-footer h5::after {

        left: 50%;

        transform: translateX(-50%);
    }

    .footer-social {

        justify-content: center;
    }

    .contact-list {

        text-align: left;
    }

    .footer-bottom {

        text-align: center;
    }

    .footer-bottom .col-md-6:last-child {

        margin-top: 10px;
    }

}