/* ==========================================================================
   Dry Out Masters — Responsive Breakpoints
   Mobile: 320px–767px | Tablet: 768px–1023px | Desktop: 1024px+
   ========================================================================== */

/* ── Mobile-First Base (320px+) ── */
.hero__content { grid-template-columns: 1fr; }
.hero__form-card { order: -1; }
.services-grid { grid-template-columns: 1fr; }
.trust-grid { grid-template-columns: repeat(2, 1fr); }
.process-grid { grid-template-columns: 1fr; }
.testimonials-slider { grid-template-columns: 1fr; }
.footer__grid { grid-template-columns: 1fr; }
.gallery-grid { grid-template-columns: 1fr; }
.blog-grid { grid-template-columns: 1fr; }
.contact-grid { grid-template-columns: 1fr; }

/* ── Small screens ── */
@media (max-width: 374px) {
  .hero__title { font-size: 1.75rem; }
  .hero__actions { flex-direction: column; }
  .hero__actions .btn { width: 100%; }
  .hero__trust { flex-direction: column; gap: var(--space-3); }
  .trust-grid { grid-template-columns: 1fr; }
}

/* ── Tablet (768px+) ── */
@media (min-width: 768px) {
  .hero__form-card { order: 0; }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .trust-grid { grid-template-columns: repeat(4, 1fr); }
  .process-grid { grid-template-columns: repeat(2, 1fr); }
  .testimonials-slider { grid-template-columns: repeat(2, 1fr); }
  .footer__grid { grid-template-columns: 2fr 1fr 1fr 1fr; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-grid { grid-template-columns: 1fr 1fr; }
}

/* ── Desktop (1024px+) ── */
@media (min-width: 1024px) {
  .hero__content { grid-template-columns: 1fr 420px; }
  .services-grid { grid-template-columns: repeat(3, 1fr); }
  .process-grid { grid-template-columns: repeat(4, 1fr); }
  .testimonials-slider { grid-template-columns: repeat(3, 1fr); }
  .gallery-grid { grid-template-columns: repeat(3, 1fr); }
  .blog-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ── Large Desktop (1280px+) ── */
@media (min-width: 1280px) {
  .services-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ── Touch-Friendly Overrides ── */
@media (pointer: coarse) {
  .btn { min-height: 48px; min-width: 48px; }
  .nav-mobile__link { min-height: 56px; display: flex; align-items: center; }
  .faq-item__question { min-height: 56px; }
  .form-input,
  .form-select,
  .form-textarea { min-height: 48px; font-size: 16px; }
}

/* ── Print Styles ── */
@media print {
  .emergency-banner,
  .header,
  .sticky-cta,
  .nav-mobile,
  .mobile-toggle,
  .cta-section { display: none !important; }
  body { color: #000; background: #fff; }
  .hero { min-height: auto; background: none; color: #000; }
  .hero__overlay { display: none; }
  .section { padding-block: 1.5rem; }
}