/* responsive.css — Vraj Jewels Ultra-Luxury Mobile-First Breakpoints
   ══════════════════════════════════════════════════════════════════
   4 Standard Studio Breakpoints:
     1. 480px  — Large Mobile / Phablet
     2. 768px  — Tablet / Small Screen
     3. 1024px — Desktop Showcase
     4. 1440px — Large High-DPI Desktop
*/

/* ══ 480px — Large Mobile ═════════════════════════════════════════ */
@media (min-width: 480px) {
  :root {
    --gutter: 1.5rem;
  }

  .form-row {
    grid-template-columns: 1fr 1fr;
  }

  .collections-matrix {
    grid-template-columns: repeat(2, 1fr);
  }

  .masterpiece-grid {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  }

  .breakdown-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ══ 768px — Tablet ═══════════════════════════════════════════════ */
@media (min-width: 768px) {
  :root {
    --gutter: 2.25rem;
    --header-h: 82px;
  }

  .hero-grid {
    grid-template-columns: 1.15fr 0.85fr;
  }

  .estimator-wrapper {
    grid-template-columns: 1fr 1.2fr;
  }

  .exchange-grid {
    grid-template-columns: 0.9fr 1.1fr;
  }

  .concierge-banner {
    grid-template-columns: 1.25fr 0.75fr;
  }

  .showroom-layout-grid {
    grid-template-columns: 1fr 1.1fr;
  }

  .page-header-grid {
    grid-template-columns: 1.2fr 0.8fr;
  }

  .heritage-split-layout {
    grid-template-columns: 1.2fr 0.8fr;
  }

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

  .nav-links-desktop {
    display: flex;
  }

  .nav-hamburger {
    display: none;
  }

  .breakdown-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ══ 1024px — Desktop ═════════════════════════════════════════════ */
@media (min-width: 1024px) {
  :root {
    --gutter: 3.0rem;
    --header-h: 88px;
  }

  .hero-grid {
    grid-template-columns: 1.2fr 0.8fr;
    gap: 4.5rem;
  }

  .collections-matrix {
    grid-template-columns: repeat(5, 1fr);
  }

  .collection-tile {
    height: 420px;
  }

  .masterpiece-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .pillars-grid {
    grid-template-columns: repeat(5, 1fr);
  }

  /* Desktop floating WhatsApp concierge button appears, mobile bar hidden */
  body {
    padding-bottom: 0;
  }
  .mobile-action-bar {
    display: none;
  }
  .floating-wa-concierge {
    display: flex;
  }
}

/* ══ 1440px — Large Desktop ═══════════════════════════════════════ */
@media (min-width: 1440px) {
  :root {
    --gutter: 4.0rem;
  }

  .hero-headline {
    font-size: 4.75rem;
  }

  .hero-grid {
    gap: 5.5rem;
  }

  .masterpiece-grid {
    gap: 2.5rem 2.0rem;
  }
}

/* ══ Print Styles ═════════════════════════════════════════════════ */
@media print {
  .royal-topbar, .site-header, .sticky-category-rail, .mobile-action-bar,
  .floating-wa-concierge, .btn-royal-cta, .btn-overlay-wa {
    display: none !important;
  }

  body {
    background: #FFFFFF;
    color: #000000;
    padding-bottom: 0;
  }

  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}