/* ==========================================================================
   RESPONSIVE.CSS — Mobile-first breakpoints: 768px / 1024px / 1200px
   ========================================================================== */

@media (max-width: 1200px) {
  .footer-grid { grid-template-columns: 1fr 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 1024px) {
  .container { padding: 0 20px; }
  .hero-grid, .grid-2, .contact-grid { grid-template-columns: 1fr; gap: 40px; }
  .hero-image-wrap, .story-image { order: -1; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .featured-overlay { max-width: 100%; }
}

@media (max-width: 768px) {
  .navbar-nav, .navbar-cta { display: none; }
  .navbar-toggle { display: flex; }
  .navbar-inner { height: 72px; }
  .navbar-logo { height: 40px; }

  section { padding: 56px 0; }
  .section-header { margin-bottom: 36px; }

  .hero-actions .btn, .form-row .btn { width: 100%; }
  .hero-actions { flex-direction: column; }
  .form-row { grid-template-columns: 1fr; gap: 0; }

  .footer-grid { grid-template-columns: 1fr; gap: 32px; padding-bottom: 40px; }
  .site-footer { padding-top: 56px; }

  .whatsapp-float { width: 52px; height: 52px; font-size: 24px; bottom: 18px; right: 18px; }

  .featured-experience { min-height: 420px; }
  .featured-overlay { padding: 32px; }

  .testimonials-grid, .features-grid, .blog-grid { grid-template-columns: 1fr; }
}

/* Evita overflow horizontal en cualquier viewport */
html, body { max-width: 100%; overflow-x: hidden; }
img, video, iframe { max-width: 100%; }