/* MoveArt Mobile UX Fixes — April 2026 */

/* === Touch Targets === */
button, a.btn-gold, a.price-btn, .nav-cta, a[href^="tel:"], a[href^="mailto:"] {
  min-height: 44px;
  min-width: 44px;
  padding: 12px 16px;
}

/* === Form Inputs — prevent iOS zoom === */
input, textarea, select {
  font-size: 16px !important;
}

/* === Tablet Breakpoint === */
@media (min-width: 768px) and (max-width: 1024px) {
  .container { padding: 0 24px; }
  .hero h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
  .pricing-grid { grid-template-columns: repeat(2, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); }
  .research-grid { grid-template-columns: repeat(2, 1fr); }
  .case-study-grid { grid-template-columns: repeat(2, 1fr); }
  .form-row { grid-template-columns: 1fr 1fr; }
}

/* === Small Mobile === */
@media (max-width: 480px) {
  .container { padding: 0 16px; }
  .form-row { grid-template-columns: 1fr; }
  .pricing-grid { grid-template-columns: 1fr; }
  .hero { padding: 100px 16px 60px; }
  section { padding: 60px 16px; }

  /* Navigation */
  .nav-links { display: none; }
  .nav-toggle { display: flex; min-height: 44px; min-width: 44px; }

  /* Stats grid */
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }

  /* Process steps */
  .steps { grid-template-columns: 1fr; }

  /* Case studies */
  .case-study-grid { grid-template-columns: 1fr; }

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

  /* FAQ */
  .faq-q { padding: 16px; font-size: 0.95rem; min-height: 44px; }
  .faq-a { padding: 0 16px 16px; }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr; text-align: center; }
  .footer-links { gap: 12px; }
}

/* === Cookie Banner Mobile Fix === */
@media (max-width: 768px) {
  .cookie-banner {
    flex-direction: column;
    text-align: center;
    gap: 12px;
    padding: 16px;
  }
  .cookie-banner button {
    min-height: 44px;
    width: 100%;
  }
}

/* === Smooth scrolling === */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

/* === Better line heights === */
p, li, label, .faq-a { line-height: 1.6; }
h1, h2, h3, h4 { line-height: 1.3; }