/* ==========================================================================
   Vrinda Packing House — Responsive Rules
   ========================================================================== */

/* ---------- 1200px ---------- */
@media (max-width: 1200px) {
  .main-nav { gap: 20px; }
  .main-nav a { font-size: 12.5px; }
  .category-grid { grid-template-columns: repeat(3, 1fr); }
  .category-card img { height: 220px; }
  .product-track { grid-auto-columns: calc((100% - 48px) / 4); }
  .footer-grid { grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 28px; }
}

/* ---------- 992px : tablet / nav breakpoint ---------- */
@media (max-width: 992px) {
  :root { --section-pad: 64px; }

  .main-nav { display: none; }
  .hamburger-btn {
    display: flex;
    align-items: center; justify-content: center;
    width: 40px; height: 40px;
    color: var(--dark);
  }
  .header-actions .desktop-only { display: none; }

  .hero, .hero.carousel, .hero .carousel-inner, .hero .carousel-item { height: 540px; min-height: 540px; }
  .hero-slide-content { width: calc(100% - 52px); padding: 48px 0; text-align: left; }
  .hero-slide-media { min-height: 540px; }
  .hero-slide-media img { min-height: 540px; object-position: 62% center; }
  .hero-nav { display: none; }

  .category-grid { grid-template-columns: repeat(3, 1fr); gap: 18px; }

  .about-grid { grid-template-columns: 1fr; gap: 34px; }
  .about-media { order: 1; }
  .about-content { order: 2; }
  .about-content .btn { width: 100%; justify-content: center; }
  .about-content h2, .about-content p.about-copy { max-width: 100%; }

  .product-track { grid-auto-columns: calc(50% - 9px); gap: 18px; }

  .wedding-feature {
    grid-template-columns: 1fr;
    background-image: none;
    background-color: #f8e3e1;
  }
  .wedding-feature::after { display: none; }
  .wedding-feature-media {
    order: 1;
    min-height: 360px;
    background: url("../images/wedding-special-banner-v1.jpg") left center / cover no-repeat;
  }
  .wedding-feature-content {
    order: 2;
    padding: 50px 28px;
    background: linear-gradient(135deg, #fbe9e7 0%, #f8dede 100%);
  }
  .wedding-feature-content h2, .wedding-feature-content p.lead { max-width: 100%; }

  .occasion-grid { grid-template-columns: repeat(2, 1fr); gap: 26px; }
  .why-grid { grid-template-columns: repeat(2, 1fr); gap: 34px 0; }
  .why-item:nth-child(2) { border-right: 0; }
  .gallery-grid { grid-template-columns: repeat(3, 1fr); }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px 24px; padding: 56px 0 30px; }

  .final-cta-actions .btn { flex: 1 1 auto; }
}

/* ---------- 768px ---------- */
@media (max-width: 768px) {
  :root { --section-pad: 55px; --section-pad-sm: 55px; }

  .container { padding: 0 20px; }

  .announce-bar .container { gap: 10px; font-size: 11px; }
  .announce-bar .announce-call span.full { display: none; }

  .site-header .container { height: 76px; }
  .brand-name { font-size: 21px; }
  .brand-tag { font-size: 9px; }

  .hero, .hero.carousel, .hero .carousel-inner, .hero .carousel-item { height: 560px; min-height: 560px; }
  .hero-slide-content { width: calc(100% - 40px); padding: 42px 0 58px; }
  .hero-slide-content h1 { font-size: 38px; max-width: 390px; }
  .hero-slide-content p { max-width: 350px; color: #625656; }
  .hero-slide-media::after { background: linear-gradient(90deg, rgba(255,249,244,.98) 0%, rgba(255,249,244,.92) 56%, rgba(255,249,244,.56) 82%, rgba(255,249,244,.26) 100%); }
  .hero-actions { width: 100%; }
  .hero-actions .btn { flex: 0 1 auto; }

  .section-head { margin-bottom: 34px; }

  .category-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .category-card img { height: 190px; }
  .category-card-label { padding: 16px; }
  .category-card-label h3 { font-size: 17px; }

  .product-track { grid-auto-columns: min(78vw, 320px); }

  .wedding-feature-media { min-height: 310px; }
  .wedding-feature-content { padding: 40px 22px; }

  .occasion-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .occasion-copy { padding: 19px 18px 21px; }
  .why-grid { grid-template-columns: 1fr 1fr; gap: 28px 0; }
  .why-item { padding: 0 18px; }

  .gallery-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }

  .final-cta-actions { flex-direction: column; align-items: stretch; }

  .footer-grid { grid-template-columns: 1fr; padding: 46px 0 24px; gap: 32px; }
  .footer-bottom { flex-direction: column; gap: 10px; text-align: center; }

  .modal-box { padding: 30px 22px; }
  .form-grid-2 { grid-template-columns: 1fr; gap: 0; }

  .whatsapp-float span { display: none; }
  .whatsapp-float { padding: 14px; border-radius: 50%; }
}

/* ---------- 576px ---------- */
@media (max-width: 576px) {
  .hero, .hero.carousel, .hero .carousel-inner, .hero .carousel-item { height: 590px; min-height: 590px; }
  .hero-slide-media { min-height: 590px; }
  .hero-slide-media img { min-height: 590px; object-position: 68% center; }
  .hero-slide-content { padding: 38px 0 70px; justify-content: flex-end; }
  .hero-slide-content h1 { font-size: 34px; max-width: 330px; }
  .hero-slide-content p { font-size: 14px; max-width: 300px; }
  .hero-actions { margin-top: 24px; }
  .hero-actions .btn { width: 100%; }
  .hero .carousel-control-prev, .hero .carousel-control-next { display: none; }

  .occasion-grid { grid-template-columns: 1fr; gap: 18px; }
  .occasion-media { aspect-ratio: 16/9; }

  .why-grid { grid-template-columns: 1fr; gap: 30px; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }

  .section-head h2 { font-size: 28px; }
}

/* ---------- 425px ---------- */
@media (max-width: 425px) {
  .category-grid { grid-template-columns: 1fr; }
  .category-card img { height: 240px; }
  .occasion-grid { grid-template-columns: 1fr; gap: 16px; }
  .occasion-item h3 { font-size: 24px; }
}

/* ---------- 375px / 320px small phones ---------- */
@media (max-width: 375px) {
  .container { padding: 0 16px; }
  .brand-name { font-size: 19px; }
  .btn { padding: 13px 22px; font-size: 12.5px; }
}