/* ── Global overflow fix — prevents horizontal scroll on mobile ── */
html, body {
    overflow-x: hidden;
    max-width: 100%;
}
*, *::before, *::after {
    box-sizing: border-box;
}

/* ── Nav bar mobile fix ── */
.nav-bar .container {
    max-width: 100%;
    overflow: hidden;
}

/* ── Product card button responsive fix ── */
.product-card .btn-group-vertical {
    width: 100%;
}

@media (max-width: 991px) {
    .search-wrapper { display: none !important; }
    .nav-menu { display: none !important; }
    .hero-main-banner .carousel-item img { height: 250px; }
    .hero-section .container { padding-left: 12px; padding-right: 12px; }
}

@media (max-width: 575px) {
    .container { padding-left: 12px; padding-right: 12px; }
    .hero-main-banner .carousel-item img { height: 200px; }
    .product-card .card-img-wrapper img { height: 180px; }
    .product-card .card-body { padding: 10px; }
    .section-header h2 { font-size: 18px; }
    .feature-strip .col-md-3 { margin-bottom: 8px; }
}

@media (max-width: 400px) {
    .product-card .card-img-wrapper img { height: 150px; }
    .product-card .card-body { padding: 8px; }
}

/* ── Offer Popup Animation ── */
@keyframes popupIn {
    from { opacity: 0; transform: scale(0.85) translateY(20px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}