/* ============================================================
   SH COMMUNITY — Pulido móvil
   Se carga la última en todas las páginas para tener prioridad.
   ============================================================ */

/* ─── BASE: evita desbordes y ajustes raros de iOS ─── */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
html { overflow-x: clip; }
body {
  overflow-x: hidden;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, video, iframe, svg { max-width: 100%; }

/* Nada debe romper el ancho por palabras largas (emails, URLs) */
p, li, .info-value, .qs-value, .review-text, .section-body,
.srv-body, .zona-item-desc, .legal-body p, .legal-body li {
  overflow-wrap: break-word;
  word-break: break-word;
}

/* Sin retardo de 300 ms al tocar */
a, button, [role="button"], .servicio-card, .plan-banner,
.qs-item, .vgrid-item, .fcarousel-slide, .eqcarousel-slide {
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(0,0,0,0.06);
}

/* ─── ALTURAS: svh/dvh evitan el salto de la barra del navegador ─── */
@supports (height: 100svh) {
  .hero { height: 100svh; }
  .page-hero { height: 70svh; }
  .sh-mobile-menu { height: 100dvh; }
}
@media (max-width: 900px) {
  @supports (height: 100svh) {
    .page-hero { height: 62svh; }
  }
}

/* ─── NOTCH / ÁREA SEGURA (iPhone) ─── */
@supports (padding: max(0px)) {
  nav {
    padding-left: max(1.25rem, env(safe-area-inset-left));
    padding-right: max(1.25rem, env(safe-area-inset-right));
  }
  footer {
    padding-bottom: max(2rem, calc(env(safe-area-inset-bottom) + 1.25rem));
  }
  .shm-theme-btn { bottom: max(1.5rem, calc(env(safe-area-inset-bottom) + 0.75rem)); }
  .shc-banner { padding-bottom: max(1.3rem, calc(env(safe-area-inset-bottom) + 0.75rem)); }
  .sh-mobile-menu { padding-bottom: max(2.25rem, calc(env(safe-area-inset-bottom) + 1.5rem)); }
}

/* ════════════════ ≤ 900 px ════════════════ */
@media (max-width: 900px) {

  /* Zonas táctiles mínimas de 44 px */
  .nav-cta, .btn-primary, .btn-ghost, .btn-dark, .btn-outline-dark,
  .srv-link, .centro-link, .text-link, .cta-actions a, .wa-link,
  .sh-mm-cta, .shc-btn {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .footer-links a, .sh-mm-contact a { display: inline-block; padding: 0.35rem 0; }

  /* Botones redondos de carrusel */
  .srv-carousel-btn, .fcarousel-btn, .eqcarousel-btn,
  .team-carousel-btn, .vgrid-item-play {
    min-width: 44px; min-height: 44px;
  }

  /* Secciones a pantalla completa sin scroll lateral */
  section, .nosotros, .plan-banner, .cta-banner { max-width: 100vw; }

  /* El hero de servicios/nosotros no debe ocupar toda la pantalla */
  .srv { min-height: auto; }

  /* Carruseles: cursor normal (no hay hover en táctil) */
  .fcarousel-slide, .eqcarousel-slide { cursor: default; }

  /* Sin efectos de hover que se quedan "pegados" al tocar */
  .servicio-card:hover, .qs-item:hover, .horario-card:hover,
  .zona-item:hover, .info-row:hover, .espacio-feature:hover {
    background: inherit;
    padding-left: inherit;
  }
  .nosotros:hover .nosotros-img img,
  .srv-carousel:hover .srv-carousel-slide.active img { transform: none; }

  /* Mapa de contacto con altura usable */
  .contact-right { min-height: 340px; }
  .contact-right iframe { filter: grayscale(0%); }

  /* Tablas de las páginas legales */
  .data-table, .data-table tbody, .data-table tr { display: block; width: 100%; }
  .data-table td { display: block; width: 100% !important; padding-right: 0; }
}

/* ════════════════ ≤ 600 px ════════════════ */
@media (max-width: 600px) {
  .marquee-wrap { padding: 2rem 0; }
  .mq-word { font-size: 1.7rem; }
  .plan-banner-arrow { width: 52px; height: 52px; }
  .plan-banner-arrow svg { width: 20px; height: 20px; }
  .horario-value { font-size: 1.7rem; }
  .stat-num { font-size: 2.1rem; }
  .review-card { padding: 1.5rem 1.25rem; }
}

/* ════════════════ ≤ 380 px (iPhone SE) ════════════════ */
@media (max-width: 380px) {
  section { padding: 2.75rem 1.1rem; }
  nav { padding: 0.9rem 1.1rem; }
  nav .logo-img { height: 38px; }
  .hero-content, .page-hero-content { padding-left: 1.1rem; padding-right: 1.1rem; }
  .sh-mm-links a { font-size: 1.85rem; padding: 0.8rem 0; }
  .footer-links { gap: 0.6rem 1rem; }
  footer .logo-img { height: 32px; }
}

/* ─── Horizontal en móvil ─── */
@media (max-width: 900px) and (orientation: landscape) {
  .hero { min-height: 380px; }
  .hero-content { padding-bottom: 2.5rem; }
  .marquee-wrap { padding: 0.8rem 0; }
  .page-hero { height: auto; min-height: 340px; padding-top: 5rem; }
  .sh-mm-links a { font-size: 1.7rem; padding: 0.6rem 0; }
  .sh-mobile-menu { padding-top: 4.5rem; }
}

/* ─── Accesibilidad: menos movimiento ─── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1 !important; transform: none !important; }
}

/* ─── Foco visible para navegación por teclado ─── */
:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* ════════════════ CORRECCIONES DE MAQUETA ════════════════ */
@media (max-width: 900px) {

  /* Los hijos de un grid/flex deben poder encogerse (evita cortes) */
  .intro-strip > *, .contact-main > *, .servicios-inner > *,
  .centro-inner > *, .nosotros > *, .horarios > *, .quick-strip > * { min-width: 0; }

  /* Franja de intro + estadísticas: una columna, sin cortes */
  .intro-strip {
    grid-template-columns: 1fr;
    gap: 2.5rem;
    padding: 0 1.5rem 3.5rem;
  }
  .intro-strip-left { padding-top: 2.5rem; }
  .intro-text { max-width: 100%; }

  /* Las 4 estadísticas entran completas */
  .intro-strip-right { grid-template-columns: 1fr 1fr; align-self: stretch; }
  .stat-box { padding: 1.5rem 1rem; }
  .stat-num { font-size: 2rem; line-height: 1; }
  .stat-label { font-size: 0.58rem; letter-spacing: 0.1em; line-height: 1.4; }

  /* Contacto: columnas apiladas sin desborde */
  .contact-main { grid-template-columns: 1fr; }
  .contact-left { padding: 3rem 1.5rem; }

  /* Puntos de carrusel: área táctil de 44px sin cambiar su aspecto */
  .srv-carousel-dot, .fcarousel-dot, .eqcarousel-dot, .team-carousel-dot {
    position: relative;
  }
  .srv-carousel-dot::after, .fcarousel-dot::after,
  .eqcarousel-dot::after, .team-carousel-dot::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    width: 44px; height: 44px;
    transform: translate(-50%, -50%);
  }
  .srv-carousel-dots, .fcarousel-dots, .eqcarousel-dots, .team-carousel-dots {
    gap: 10px;
  }

  /* Enlaces de contacto: más altos para el dedo */
  .info-value a, .qs-value, .map-overlay-link { display: inline-block; padding: 0.3rem 0; }

  /* Migas de pan legibles */
  .breadcrumb { padding: 0.4rem 0; }
}

@media (max-width: 480px) {
  .intro-strip-right { grid-template-columns: 1fr 1fr; }
  .stat-num { font-size: 1.75rem; }
  .stat-label { font-size: 0.54rem; }
  .intro-strip { padding: 0 1.25rem 3rem; }
}

/* Bloque "Nosotros" de la home: el min-height forzaba 520px de ancho */
@media (max-width: 900px) {
  .nosotros { grid-template-columns: 1fr; }
  .nosotros-img {
    aspect-ratio: 1;
    min-height: 0;
    width: 100%;
    max-width: 100%;
  }
  .nosotros-content { padding: 3rem 1.5rem; }
}
@media (max-width: 480px) {
  .nosotros-content { padding: 2.5rem 1.25rem; }
}

/* ─── Pantallas muy estrechas (320 px) ─── */
@media (max-width: 340px) {
  section { padding: 2.5rem 1rem; }
  nav { padding: 0.85rem 1rem; }
  nav .logo-img { height: 34px; }
  .hero-content, .page-hero-content { padding-left: 1rem; padding-right: 1rem; }
  .sh-mm-links a { font-size: 1.6rem; }
  .stat-num { font-size: 1.5rem; }
  .stat-label { font-size: 0.5rem; }
  .shc-btn { font-size: 0.56rem; padding: 0.85rem 0.4rem; }
  .qs-value { font-size: 0.8rem; }
}