/* ==========================================================================
   Creative Interiors — Responsive Rules
   ========================================================================== */

/* ---------- Tablet ≤1024px ---------- */
@media (max-width: 1024px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .service-grid { grid-template-columns: repeat(2, 1fr); }
  .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
  .testimonial-track { grid-template-columns: repeat(2, 1fr); }
  .pricing-grid { grid-template-columns: 1fr; max-width: 480px; margin-inline: auto; }
  .price-card.featured { transform: none; }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .process-timeline { grid-template-columns: repeat(2, 1fr); row-gap: var(--space-lg); }
  .process-timeline::before { display: none; }
  .footer-grid { grid-template-columns: 1fr 1fr; row-gap: var(--space-lg); }
  .project-detail-grid { grid-template-columns: 1fr; }
  .insta-grid { grid-template-columns: repeat(4, 1fr); }
  .stats-strip { grid-template-columns: repeat(2, 1fr); row-gap: var(--space-md); }
}

/* ---------- Mobile ≤768px ---------- */
@media (max-width: 768px) {
  :root { --space-xl: 4.5rem; --space-2xl: 6rem; }

  .main-nav { display: none; }
  .nav-toggle { display: flex; }
  body.menu-open .main-nav {
    display: flex; position: fixed; inset: 0; top: 0; z-index: 490;
    background: var(--color-primary); flex-direction: column; align-items: flex-start;
    padding: 7rem 2rem 2rem; gap: 2rem;
  }
  body.menu-open .main-nav ul { flex-direction: column; gap: 1.6rem; }
  body.menu-open .main-nav a { color: var(--color-white); font-size: 1.3rem; font-family: var(--font-display); }
  body.menu-open .main-nav .header-actions { flex-direction: column; align-items: flex-start; width: 100%; }
  .header-actions .btn-accent.book-btn { display: none; }
  body.menu-open .header-actions .btn-accent.book-btn { display: inline-flex; }

  .grid-3, .grid-4, .grid-2, .service-grid, .portfolio-grid, .testimonial-track, .blog-grid { grid-template-columns: 1fr; }
  .process-timeline { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: var(--space-md); }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
  .stats-strip { grid-template-columns: repeat(2, 1fr); }
  .insta-grid { grid-template-columns: repeat(3, 1fr); }
  .section-head.split { flex-direction: column; align-items: flex-start; }
  .cta-band { flex-direction: column; align-items: flex-start; text-align: left; }
  .awards-strip { justify-content: center; }

  .hero { min-height: 92vh; align-items: flex-end; }
  .hero-content { padding-block: 6rem 5.5rem; }
  .hero h1 { max-width: 12ch; }
  .scroll-indicator { display: none; }

  .mobile-sticky-bar { display: block; }
  body { padding-bottom: 62px; }
  .floating-actions { bottom: 5.2rem; }
  .back-to-top { bottom: 5.2rem; }

  .consultation-drawer { width: 100%; padding: 2rem 1.4rem; }
  section { padding-block: var(--space-xl); }
}

@media (max-width: 480px) {
  .stats-strip { grid-template-columns: 1fr 1fr; }
  .insta-grid { grid-template-columns: repeat(3, 1fr); }
  .price-card { padding: 2rem 1.5rem; }
  .btn { width: 100%; }
  .hero-actions .btn { width: auto; }
}