/* ============================================
   AFNEMO - responsive.css
   All @media queries
   ============================================ */

/* ─── HERO MOBILE (900px) ─── */
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; height: auto; min-height: 100svh; }
  .hero-right { display: none; }
  .hero-left { padding: 8rem 2rem 4rem; justify-content: center; min-height: 100svh; }
  .about-origen, .about-mv-inner { grid-template-columns: 1fr; gap: 2rem; }
  .about-origen, .about-mv { padding: 3rem 1.5rem; }
}

/* ─── TABLET (1024px) ─── */
@media (max-width: 1024px) {
  .about { grid-template-columns: 1fr; gap: 3rem; }
  .programs-grid { grid-template-columns: 1fr 1fr; }
  .news-grid { grid-template-columns: 1fr 1fr; }
  .news-card:first-child { grid-column: span 2; }
  .footer-top { grid-template-columns: 1fr 1fr; }
}

/* ─── MOBILE (768px) ─── */
@media (max-width: 768px) {
  .hero { padding: 0; }
  .hero-left { padding-inline: 1.5rem; }
  .hero h1 { font-size: 2.5rem; }
  .stats-bar { grid-template-columns: 1fr 1fr; }
  .programs-grid { grid-template-columns: 1fr; }
  .news-grid { grid-template-columns: 1fr; }
  .news-card:first-child { grid-column: span 1; }
  .footer-top { grid-template-columns: 1fr; gap: 2rem; }
  .hero-actions { flex-direction: column; align-items: flex-start; }
  .hero-actions a { max-width: 100%; }
  .scroll-indicator { display: none; }
  .cta-actions { flex-direction: column; align-items: center; }
  .arcgis-section { padding: 3rem 1.5rem 2rem; }
}

/* ─── SMALL MOBILE (480px) ─── */
@media (max-width: 480px) {
  #chat-window {
    right: 0.75rem;
    left: 0.75rem;
    width: auto;
    bottom: 5.5rem;
  }
  #chat-bubble { right: 1.2rem; bottom: 1.2rem; }
  .stats-bar { padding: 2rem 1rem; gap: 1rem; }
  .stat-item { padding: 0.5rem; }
}

/* Floating controls remain below navigation and fit short viewports. */
#chat-bubble { z-index: 950; }
#chat-window {
  z-index: 951;
  max-height: calc(100vh - 12rem);
  max-height: calc(100dvh - 12rem);
}
#chat-bubble[hidden], #chat-window[hidden] { display: none; }
#chat-messages { min-height: 0; }
#chat-input { min-width: 0; font-size: 1rem; }
#chat-close, #chat-send { min-width: 44px; min-height: 44px; }
.chat-msg { min-width: 0; }
.chat-msg-bubble { min-width: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.chat-header-info { min-width: 0; }
.chat-header-info > span { color: var(--cream-dark); }
#chat-input::placeholder { color: #6c6259; }
#chat-window :focus-visible, #chat-bubble:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
}

@media (max-height: 520px) {
  #chat-window { bottom: 0.75rem; max-height: calc(100dvh - 6.5rem); }
  #chat-header { padding: 0.5rem 0.75rem; }
  #chat-input-area { padding: 0.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}
