/* ==========================================================================
   Dual Design & Code — Responsive Rules
   ========================================================================== */

.nav-desktop { display: flex; }
.cta-desktop { display: inline-flex; }
.burger { display: none; }

@media (max-width: 900px) {
  .nav-desktop, .cta-desktop { display: none !important; }
  .burger { display: flex !important; }

  .cases-grid, .contact-grid, .services-grid { grid-template-columns: 1fr !important; }
  .deck { transform: scale(0.72); transform-origin: top center; }
  .stat-divider { display: none !important; }
  .hero, .services-section, .cases-section, .process-section, .faq-section, .contact-section { min-height: auto !important; }
  .whatsapp-fab { width: 48px !important; height: 48px !important; bottom: 76px !important; right: 16px !important; }

  .mobile-cta-bar { display: flex !important; }
  .mobile-cta-bar.is-hidden { display: none !important; }
  .hero { padding-top: 40px !important; padding-bottom: 24px !important; }
  .site-header { padding-top: 16px !important; padding-bottom: 16px !important; }
  .services-panel { padding: 26px !important; }
  .corner { display: none !important; }
  .flow-grid { grid-template-columns: repeat(2,1fr) !important; row-gap: 40px !important; }
  .contact-form { padding-bottom: 40px !important; }

  .section { padding-left: 24px !important; padding-right: 24px !important; }
  .site-header { padding-left: 24px !important; padding-right: 24px !important; }
}

@media (min-width: 701px) and (max-width: 1024px) {
  .flow-grid { grid-template-columns: repeat(3,1fr) !important; row-gap: 36px !important; }
}

@media (max-width: 480px) {
  .hero-stats { flex-wrap: wrap !important; }
  .hero-stats .stat { flex: 0 0 42% !important; }
  .stat-divider { display: none !important; }
  .faq-answer { line-height: 1.85 !important; }
  .hero-title { font-size: clamp(38px, 11vw, 60px); }
}

@media (max-width: 640px) {
  .hero { grid-template-columns: 1fr; }
  .hero-panel-wrap { grid-column: 1; grid-row: 2; max-width: 100%; }
  .hero-content { grid-row: 1; grid-column: 1; }
  .hero-stats { grid-row: 3; }
}
