/* ==========================================================================
   RESPONSIVE.CSS — Mobile First (matching toguezparfums.com breakpoints)
   Breakpoints: 750px (tablet), 990px (desktop)
   ========================================================================== */

/* ═══════════════════════
   MOBILE BASE (<750px)
   ═══════════════════════ */


/* Header (old .header class — kept for legacy, new header uses .header--black)
   The .header--black system has its own responsive CSS in style.css */
/* No conflicting overrides here */


/* Hero — height determined by image aspect-ratio, no min-height needed */

/* Marquee */
.marquee-section { padding: 1.2rem 0; }
.marquee-item { font-size: 1.3rem; }


/* Product grid */
.product-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 4px;
}
.card__information { padding: 0.8rem 0 0; }
.card__name { font-size: 1.3rem; }
.price__sale { font-size: 1.3rem; }
.card__vendor { font-size: 1rem; }
.quick-add { display: none; } /* Hide on mobile, show tap instead */

/* Collection list */
.collection-list {
  grid-template-columns: repeat(2, 1fr);
  gap: 4px;
}

/* Image with text */
.image-with-text { grid-template-columns: 1fr; }
.image-with-text__content { padding: 3.2rem 1.6rem; }
.image-with-text__heading { font-size: calc(var(--font-heading-scale) * 2.4rem); }

/* Testimonials */
.testimonials-grid { grid-template-columns: 1fr; }

/* Email signup */
.email-signup__form { flex-direction: column; border: none; gap: 0; }
.email-signup__input {
  border: 0.1rem solid rgba(255,255,255,0.3);
  margin-bottom: 0.8rem;
  border-radius: 0;
}
.email-signup__submit { width: 100%; }

/* Footer */
.footer__content-top { grid-template-columns: 1fr; }
.footer__content-bottom { flex-direction: column; text-align: center; gap: 0.8rem; }

/* Cart layout */
.cart-contents { grid-template-columns: 1fr; }
.cart-item { grid-template-columns: 8rem 1fr; }
.cart-footer { margin-top: 1.6rem; }

/* Checkout */
.checkout-layout { grid-template-columns: 1fr; }
.order-summary { position: static; order: -1; margin-bottom: 2.4rem; }
.form-row { grid-template-columns: 1fr; }

/* Product page */
.product-layout { grid-template-columns: 1fr !important; }
.product__thumbnails { flex-wrap: wrap; }
.product__thumbnail { width: 6rem; height: 7.5rem; }

/* Shop */
.collection-hero { padding: 2.4rem 0; }
.facets-container { padding: 1.6rem 0; }
.facet-filters { gap: 0.8rem; }
.facet-chip { font-size: 1.2rem; padding: 0.6rem 1.2rem; }
.sort-by { width: 100%; justify-content: space-between; }

/* ═══════════════════════
   TABLET (≥750px)
   ═══════════════════════ */
@media screen and (min-width: 750px) {

  /* Header — .header--black handles its own responsive styles */

  /* Hero */


  /* Products */
  .product-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
  .card__name { font-size: 1.4rem; }
  .quick-add { display: block; }

  /* Collections */
  .collection-list { grid-template-columns: repeat(3, 1fr); gap: 8px; }

  /* Image with text */
  .image-with-text { grid-template-columns: 1fr 1fr; min-height: 54rem; }
  .image-with-text__media { aspect-ratio: auto; }
  .image-with-text__content { padding: 5rem; }
  .image-with-text__heading { font-size: calc(var(--font-heading-scale) * 3.2rem); }

  /* Testimonials */
  .testimonials-grid { grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }

  /* Email signup */
  .email-signup__form { flex-direction: row; gap: 0; border: 0.1rem solid rgba(255,255,255,0.3); }
  .email-signup__input { border: none; margin-bottom: 0; }
  .email-signup__submit { width: auto; }

  /* Footer */
  .footer__content-top { grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3.2rem; }
  .footer__content-bottom { flex-direction: row; text-align: left; }

  /* Cart */
  .cart-contents { grid-template-columns: 1fr 36rem; gap: 4rem; }

  /* Checkout */
  .checkout-layout { grid-template-columns: 1fr 40rem; gap: 5rem; }
  .order-summary { position: sticky; order: 0; }
  .form-row { grid-template-columns: 1fr 1fr; }

  /* Product page */
  .product__thumbnail { width: 8rem; height: 10rem; }

  /* Shop */
  .collection-hero { padding: 4rem 0; }
  .sort-by { width: auto; }
}

/* ═══════════════════════
   DESKTOP (≥990px)
   ═══════════════════════ */
@media screen and (min-width: 990px) {

  /* Header — .header--black handles its own responsive styles */

  /* Hero */


  /* Products */
  .product-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .collection-list { grid-template-columns: repeat(4, 1fr); gap: 8px; }

  /* Image with text */
  .image-with-text__content { padding: 8rem; }
  .image-with-text__heading { font-size: calc(var(--font-heading-scale) * 4rem); }

  /* Product page layout */
  .product-layout {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 6rem;
  }

  /* Collection heading */
  .collection-hero__title { font-size: calc(var(--font-heading-scale) * 4rem); }
}

/* ═══════════════════════
   PRINT
   ═══════════════════════ */
@media print {
  .announcement-bar,
  .header-wrapper,
  .slideshow,
  .marquee-section,
  .email-signup,
  .site-footer,
  .cart-notification,
  .back-to-top,
  .menu-drawer,
  .menu-overlay { display: none !important; }
}

/* ═══════════════════════
   REDUCED MOTION
   ═══════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  .scroll-reveal { opacity: 1; transform: none; }
  .announcement-slider__track { animation: none; }
  .marquee-track { animation: none; }
  .marquee-text { animation: none; }
}