/*=========================================
   MOBILE RESPONSIVE FIXES
   (loaded last — overrides above as needed)
=========================================*/

html{
    overflow-x:hidden;
    width:100%;
}

body{
    overflow-x:hidden;
    width:100%;
}

/* ---- Hero: safe padding + mobile viewport height ---- */
@media(max-width:768px){

    .hero{
        height:auto;
        min-height:100svh;
        min-height:100vh;
        padding:120px 6% 60px;
    }

    .hero-content{
        max-width:100%;
        padding:0 5px;
    }

}

@media(max-width:400px){

    .hero-content h1{
        font-size:28px;
    }

    .hero-content h3{
        font-size:16px;
        letter-spacing:2px;
    }

    .hero-content p{
        font-size:14px;
    }

    .section-title h2{
        font-size:24px;
    }

}

/* ---- Store info / Google map: prevent overflow on narrow phones ---- */
@media(max-width:480px){

    .store-container{
        grid-template-columns:1fr;
        gap:25px;
    }

    .map-container iframe{
        height:300px;
    }

}

/* ---- Navbar: keep logo + menu icon from crowding on very small screens ---- */
@media(max-width:400px){

    .navbar{
        padding:10px 14px;
    }

    .navbar .logo-text{
        font-size:16px;
    }

    .navbar .logo-img{
        height:36px;
        width:36px;
    }

}

/* ---- Footer: avoid cramped columns on very narrow phones ---- */
@media(max-width:400px){

    .footer-container{
        grid-template-columns:1fr;
    }

}

/* ---- Gold rate cards: single column on very narrow phones ---- */
@media(max-width:380px){

    #goldRateSection .rate-card{
        min-width:100%;
    }

}

/* ---- Product / featured cards: smaller image height on small phones ---- */
@media(max-width:480px){

    .product-card img{
        height:220px;
    }

    .product-card h3{
        font-size:18px;
    }

}

/* ---- Gallery: plain 2-column card grid on mobile (no Swiper) ---- */
@media(max-width:768px){

    .mySwiper.gallery-grid-mobile{
        padding:10px 0 0;
    }

    .mySwiper.gallery-grid-mobile .swiper-wrapper{
        display:grid;
        grid-template-columns:repeat(2,1fr);
        gap:14px;
        transform:none !important;
    }

    .mySwiper.gallery-grid-mobile .swiper-slide{
        width:100%;
        margin:0;
    }

    .mySwiper.gallery-grid-mobile .swiper-slide img{
        height:150px;
    }

    .mySwiper.gallery-grid-mobile .slide-info{
        padding:10px;
    }

    .mySwiper.gallery-grid-mobile .slide-info h4{
        font-size:14px;
        margin-bottom:4px;
    }

    .mySwiper.gallery-grid-mobile .slide-weight{
        font-size:12px;
    }

    .mySwiper.gallery-grid-mobile .slide-price{
        font-size:16px;
        margin-top:4px;
    }

    .mySwiper.gallery-grid-mobile .swiper-pagination,
    .mySwiper.gallery-grid-mobile .swiper-button-next,
    .mySwiper.gallery-grid-mobile .swiper-button-prev{
        display:none;
    }

}

@media(max-width:360px){

    .mySwiper.gallery-grid-mobile .swiper-slide img{
        height:120px;
    }

}