/* ═══════════════════════════════════════════════════════════════════════════
   KAGDI JEWELLERS — Responsive  (v2 — Premium Polish)
   Breakpoints: 1100px (tablet) · 768px · 540px (mobile) · 380px (xs)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   TABLET — ≤ 1100px
   ══════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {

  /* Nav: hide links, show hamburger */
  .navbar__nav,
  .navbar__cta { display: none; }
  .navbar__hamburger { display: flex; }

  /* Hero: stack brand + collage */
  .hero--editorial {
    min-height: auto;
  }
  .hero__inner--split {
    grid-template-columns: 1fr;
    gap: var(--sp-10);
    padding-top: calc(var(--nav-h) + var(--sp-10));
    padding-bottom: var(--sp-12);
    text-align: center;
  }
  .hero__content {
    align-items: center;
    text-align: center;
    max-width: 36rem;
    margin-inline: auto;
  }
  .hero__eyebrow { justify-content: center; }
  .hero__title { max-width: 16ch; }
  .hero__subtitle { margin-inline: auto; }
  .hero__actions { justify-content: center; }
  .hero__trust { justify-content: center; margin-inline: auto; }
  .hero-collage {
    max-width: 520px;
    max-height: none;
    aspect-ratio: 1 / 1;
  }
  .hero__title {
    font-size: clamp(2.4rem, 6vw, 3.6rem);
  }

  /* Collections / collage */
  .collection-tiles {
    grid-template-columns: repeat(2, 1fr);
  }
  .collection-tile,
  .collection-tile:nth-child(4),
  .collection-tile:nth-child(5) {
    grid-column: span 1;
    min-height: 240px;
  }

  .collage {
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: minmax(120px, 28vw);
  }
  .collage__item,
  .collage__item--lg,
  .collage__item--wide,
  .collage__item--tall {
    grid-column: span 3;
    grid-row: span 2;
  }

  /* Story split */
  .story-split__inner    { grid-template-columns: 1fr; }
  .story-split__image-wrap { max-width: 460px; margin-inline: auto; }

  /* About */
  .about-story { grid-template-columns: 1fr; }

  /* Offerings */
  .offerings-grid { grid-template-columns: 1fr 1fr; }

  /* Highlight grid */
  .highlight-grid { grid-template-columns: 1fr 1fr; }

  /* Footer */
  .footer__grid { grid-template-columns: 1fr 1fr; gap: var(--sp-10); }

  /* Product detail */
  .product-detail__grid { grid-template-columns: 1fr; }
  .product-detail__sticky { position: static; }

  /* Contact */
  .contact-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   MOBILE — ≤ 768px
   ══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  :root {
    --nav-h: 66px;
    --section-y:    clamp(3.5rem, 8vw, 5rem);
    --section-y-sm: clamp(2.5rem, 5vw, 3.5rem);
    --section-y-lg: clamp(4rem, 9vw, 6rem);
  }

  /* Product grid — 2 col */
  .product-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--sp-4);
  }
  /* Featured grid — 2 col on tablet */
  #featured-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Highlight grid — 2 col */
  .highlight-grid { grid-template-columns: 1fr 1fr; gap: var(--sp-3); }

  /* Hero */
  .hero__title { font-size: clamp(2.15rem, 8vw, 2.85rem); max-width: 12ch; }
  .hero--editorial { min-height: auto; }
  .hero__actions { flex-direction: column; align-items: stretch; width: 100%; max-width: 320px; margin-inline: auto; }
  .hero__actions .btn { width: 100%; justify-content: center; }
  .hero-collage {
    max-width: 100%;
    aspect-ratio: 1.05 / 1;
    max-height: none;
  }
  .hero-collage__cell--1  { left: 0;    top: 0;    width: 48%; height: 58%; }
  .hero-collage__cell--2  { left: 50%;  top: 0;    width: 50%; height: 36%; }
  .hero-collage__cell--3  { left: 50%;  top: 38%;  width: 50%; height: 28%; }
  .hero-collage__cell--4  { left: 0;    top: 60%;  width: 42%; height: 40%; }
  .hero-collage__cell--5  { left: 44%;  top: 68%;  width: 56%; height: 32%; }
  .hero-collage__cell--6,
  .hero-collage__cell--7,
  .hero-collage__cell--8,
  .hero-collage__cell--9,
  .hero-collage__cell--10 { display: none; }

  .collection-tiles { grid-template-columns: 1fr; }
  .collection-tile { min-height: 220px; }

  .collage {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: minmax(160px, 42vw);
  }
  .collage__item,
  .collage__item--lg,
  .collage__item--wide,
  .collage__item--tall {
    grid-column: span 1;
    grid-row: span 1;
  }
  .collage__item--lg { grid-column: span 2; grid-row: span 2; }

  /* Filter bar */
  .filter-bar__label { width: 100%; margin-bottom: var(--sp-1); }

  /* Collection meta */
  .collection-meta { flex-direction: column; align-items: flex-start; gap: var(--sp-4); }

  /* Footer */
  .footer__grid { grid-template-columns: 1fr; gap: var(--sp-8); }
  .footer__bottom { flex-direction: column; gap: var(--sp-4); text-align: center; }

  /* Offerings */
  .offerings-grid { grid-template-columns: 1fr; }

  /* Specs row */
  .specs-row { flex-direction: column; gap: var(--sp-1); }
  .specs-row__label { flex: none; }

  /* CTA banner */
  .cta-banner .btn-group { flex-direction: column; align-items: stretch; }
  .cta-banner .btn-group .btn { width: 100%; max-width: 340px; margin-inline: auto; justify-content: center; }

  /* Contact form row */
  .contact-form__row { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   SMALL MOBILE — ≤ 540px
   ══════════════════════════════════════════════════════════ */
@media (max-width: 540px) {
  /* Highlight grid — single column */
  .highlight-grid { grid-template-columns: 1fr; gap: var(--sp-3); }

  /* Product gallery thumbs */
  .product-gallery__thumbs { flex-wrap: wrap; }
  .product-gallery__thumb  { width: 64px; height: 64px; }

  /* Breadcrumb — wrap */
  .breadcrumb { flex-wrap: wrap; }
}

/* ══════════════════════════════════════════════════════════
   XS — ≤ 380px
   ══════════════════════════════════════════════════════════ */
@media (max-width: 380px) {
  .product-grid { grid-template-columns: 1fr; }
  #featured-grid { grid-template-columns: 1fr; }
  .hero__title  { font-size: clamp(2rem, 9vw, 2.4rem); }
}

/* ══════════════════════════════════════════════════════════
   LARGE DESKTOP — ≥ 1400px
   ══════════════════════════════════════════════════════════ */
@media (min-width: 1400px) {
  .product-grid { grid-template-columns: repeat(4, 1fr); }
}