/* ═══════════════════════════════════════════════════════════
   Responsive — Mobile-first breakpoints
   480 (small phone) | 640 (large phone) | 768 (tablet) | 1024 (desktop)
═══════════════════════════════════════════════════════════ */

/* ── Base overrides for screens < 1024px ── */
@media (max-width: 1024px) {
  .roi-wrapper { grid-template-columns: 1fr; }
  .roi-industry-grid { grid-template-columns: repeat(3, 1fr); }
  .testimonials-grid { grid-template-columns: 1fr 1fr; }
  .modules-grid { grid-template-columns: 1fr 1fr; }
  .industries-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── Tablet: <= 768px ── */
@media (max-width: 768px) {
  section { padding: 56px 0; }
  .container { padding: 0 20px; }

  /* Sticky CTA bar clearance at page bottom */
  footer { padding-bottom: 72px; }

  /* Hero (V2 overrides handled in hero.css) */

  /* Nav */
  .site-nav-links { display: none; }

  /* Section headers */
  .section-header { margin-bottom: 0; }
  .section-header h2 { font-size: clamp(26px, 6vw, 40px); }
  .section-header p { font-size: 14px; }

  /* Grids to 1 column */
  .modules-grid { grid-template-columns: 1fr; gap: 16px; margin-top: 40px; }
  .testimonials-grid { grid-template-columns: 1fr; gap: 16px; margin-top: 40px; }
  .industries-grid { grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 40px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .problem-grid { grid-template-columns: 1fr; }
  .ai-tools-grid { grid-template-columns: repeat(2, 1fr); }

  /* ROI */
  .roi-number-input {
    display: block;
    width: 70px;
    padding: 6px 8px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 8px;
    color: var(--white);
    font-family: var(--font-mono);
    font-size: 14px;
    text-align: center;
    outline: none;
    flex-shrink: 0;
  }
  .roi-wrapper { grid-template-columns: 1fr; gap: 32px; margin-top: 36px; }
  .roi-industry-grid { grid-template-columns: repeat(2, 1fr); }
  .roi-result { position: static; }
  .roi-big-number { font-size: clamp(44px, 10vw, 64px); }

  /* Timeline */
  .timeline { margin-top: 40px; }
  .timeline::before { left: 19px; }
  .timeline-step { grid-template-columns: 40px 1fr; gap: 0 20px; padding-bottom: 40px; }
  .timeline-node { width: 40px; height: 40px; }
  .timeline-node svg { width: 16px; height: 16px; }
  .timeline-title { font-size: 18px; }
  .timeline-details { flex-direction: column; gap: 6px; }

  /* Industry cards */
  .industry-head { padding: 24px 20px 20px; }
  .industry-name { font-size: 22px; }
  .industry-bg-num { font-size: 70px; }

  /* Industry modal */
  .ind-overlay { padding: 12px; align-items: flex-end; }
  .ind-modal-header { padding: 24px 20px 16px; }
  .ind-modal-body { padding: 20px 20px 28px; }
  .ind-close { top: 16px; right: 16px; }
  .ind-modal-title { font-size: clamp(26px, 6vw, 40px); }
  .ind-modal { border-radius: 20px 20px 0 0; max-height: 88vh; }

  /* Module cards */
  .module-card { padding: 28px 22px; }
  .module-features li { font-size: 11px; }

  /* Demo flow */
  .flow-steps { padding-left: 0; }
  .flow-step { padding-left: 0; }
  .step-node { width: 36px; height: 36px; flex-shrink: 0; }
  .step-content { padding-left: 0; }

  /* CTA */
  .cta-title { font-size: clamp(24px, 6vw, 38px); }
  .cta-actions { flex-direction: column; gap: 10px; align-items: center; }
  .cta-actions .btn { width: 100%; max-width: 320px; text-align: center; justify-content: center; padding: 15px 20px; font-size: 13px; border-radius: 12px; }
  .cta-desc { font-size: 13px; margin-bottom: 32px; }
  .cta-proof { gap: 20px; padding-top: 32px; }
  .cta-proof-num { font-size: 24px; }

  /* Contact */
  .contact-grid { grid-template-columns: 1fr; gap: 36px; }
  .contact-promise { display: none; }
  .cf-row { grid-template-columns: 1fr; gap: 0; }

  /* Testimonials */
  .testimonial-card { padding: 24px 20px; }
  .metric-val { font-size: 30px; }

  /* Stats */
  .stat-item { padding: 24px 16px; }
  .stat-number { font-size: clamp(28px, 8vw, 48px); }

  /* Buttons */
  .btn { padding: 13px 22px; font-size: 13px; }

  /* Social proof */
  .social-proof-bar { gap: 16px; padding: 18px 20px; flex-wrap: wrap; }

  /* Footer */
  .footer-inner { padding: 0 20px; }
  .footer-row1 { flex-direction: column; gap: 10px; }
  .footer-row2 { flex-direction: column; align-items: flex-start; gap: 10px; }
  .footer-firm-data { flex-direction: column; gap: 4px; }

  /* Chat — positioned above sticky CTA bar (see components.css overrides) */
  #sw-chat-window { width: calc(100vw - 20px); right: 10px; border-radius: 18px; }
}

/* ── Large phone: <= 640px ── */
@media (max-width: 640px) {
  section { padding: 48px 0; }
  .container { padding: 0 16px; }
  /* Hero V2 responsive is self-contained in hero.css */

  .industries-grid { grid-template-columns: 1fr; }
  .roi-industry-grid { grid-template-columns: repeat(3, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }

  .flow-container { padding: 0; }
  .section-header { padding-bottom: 0; }
  .modules-grid { margin-top: 32px; }
  .contact-form-card { padding: 24px 16px; }
}

/* ── Small phone: <= 480px ── */
@media (max-width: 480px) {
  .container { padding: 0 14px; }
  /* Hero V2 responsive is self-contained in hero.css */

  .stats-grid { grid-template-columns: 1fr; }
  .ai-tools-grid { grid-template-columns: 1fr; }
  .roi-industry-grid { grid-template-columns: repeat(2, 1fr); }
  .roi-ind-btn { font-size: 10px; padding: 8px 6px; }

  .timeline-step { grid-template-columns: 36px 1fr; gap: 0 14px; }
  .timeline-node { width: 36px; height: 36px; }
  .timeline::before { left: 17px; }

  #sw-chat-window { width: 100vw; right: 0; bottom: 72px; border-radius: 16px 16px 0 0; }
  .sw-chat-messages { max-height: 52vh; }
}

/* ── Disable custom cursor on touch/mobile ── */
@media (hover: none), (max-width: 768px) {
  .cursor, .cursor-ring { display: none !important; }
  * { cursor: auto !important; }
  button, a, input, select, textarea, [onclick] { cursor: pointer !important; }
}