/* Auténtico Bali — versión móvil (solo <768px; el escritorio no cambia) */
@media (max-width: 767px) {

  /* tipografía de titulares */
  h1 { font-size: 30px !important; letter-spacing: 3px !important; line-height: 1.25 !important; }
  h2 { font-size: 21px !important; letter-spacing: 2px !important; line-height: 1.35 !important; }

  /* medios fluidos */
  html, body { overflow-x: hidden !important; width: 100% !important; }
  [style*="width: 1280px"] { width: 100% !important; }
  [style*="height: 680px"] { height: 480px !important; }
  [style*="left: 56px; right: 56px"] { left: 20px !important; right: 20px !important; }
  [style*="padding: 0 56px"] { padding: 0 12px !important; }
  img, video, svg { max-width: 100% !important; }
  svg { height: auto !important; }

  /* anchos máximos de columnas de texto */
  [style*="max-width: 900px"], [style*="max-width: 860px"], [style*="max-width: 820px"],
  [style*="max-width: 680px"], [style*="max-width: 640px"], [style*="max-width: 620px"],
  [style*="max-width: 560px"], [style*="max-width: 540px"], [style*="max-width: 520px"] { max-width: 100% !important; }

  /* padding lateral de secciones: 56/120px -> 20px */
  [style*="padding: 90px 56px"], [style*="padding: 64px 56px"], [style*="padding: 56px 56px"],
  [style*="padding: 88px 56px"], [style*="padding: 84px 56px"], [style*="padding: 40px 56px"],
  [style*="padding: 66px 56px"], [style*="padding: 34px 56px"], [style*="padding: 70px 56px"],
  [style*="padding: 60px 56px"], [style*="padding: 48px 56px"] {
    padding-left: 20px !important; padding-right: 20px !important;
  }
  [style*="px 120px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding: 44px 50px"] { padding: 30px 20px !important; }
  [style*="padding: 48px 54px"] { padding: 30px 18px !important; }

  /* rejillas a una columna */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  [style*="column-gap: 22px"] { grid-template-columns: 1fr 1fr !important; } /* islas del pie */

  /* filas flexibles que deben apilarse */
  [style*="display: flex"][style*="justify-content: space-between"][style*="align-items: flex-start"],
  [style*="display: flex"][style*="gap: 56px"], [style*="display: flex"][style*="gap: 44px"],
  [style*="display: flex"][style*="gap: 60px"] { flex-direction: column !important; }

  /* menú superior: fila de enlaces con scroll lateral */
  [style*="justify-content: center; gap: 34px"] {
    justify-content: center !important; flex-wrap: wrap !important;
    column-gap: 18px !important; row-gap: 8px !important;
    padding-left: 12px !important; padding-right: 12px !important;
    font-size: 10px !important;
  }
  [style*="justify-content: center; gap: 34px"]::-webkit-scrollbar { display: none; }

  /* barra superior de marca */
  .titulo[style*="font-size: 26px"][style*="letter-spacing: 8px"] { font-size: 13px !important; letter-spacing: 2.5px !important; white-space: nowrap; }
  img[alt*="agency"], img[alt*="since 2010"] { height: 30px !important; width: auto !important; }

  /* filas "tu viaje incluye": título arriba, texto debajo alineado a la izquierda */
  .fila-info { flex-direction: column !important; align-items: flex-start !important; gap: 6px !important; }
  .fila-info [style*="text-align: right"] { text-align: left !important; }

  /* filas de rutas y salidas */
  .salida { flex-wrap: wrap !important; }
  [style*="display: flex"][style*="align-items: center"][style*="justify-content: space-between"] { flex-wrap: wrap !important; row-gap: 10px !important; }

  /* héroe: alturas más contenidas */
  [style*="height: 620px"], [style*="height: 640px"], [style*="height: 560px"] { height: 440px !important; }

  /* trío de fotos de la portada y similares en fila */
  [style*="display: flex"][style*="gap: 22px"][style*="padding: 0 56px"] { flex-direction: column !important; padding: 0 20px !important; }

  /* pastillas: que no desborden */
  .pill { white-space: normal !important; text-align: center; }
}

@media (max-width: 767px) {
  /* héroe limpio: fuera chips duplicados y chip flotante */
  [style*="bottom: 54px"] .anim-3 { display: none !important; }
  [style*="position: absolute; top: 34px; right: 56px"] { display: none !important; }
  [style*="bottom: 54px"] { bottom: 24px !important; gap: 12px !important; }
}

@media (max-width: 767px) {
  /* filas de pasos y otros bloques en fila con hueco grande: apilar */
  [style*="display: flex; gap: 48px"], [style*="display: flex; gap: 40px"],
  [style*="display: flex; gap: 36px"] { flex-direction: column !important; gap: 28px !important; }
  /* mapa del archipiélago: entero, a todo el ancho */
  svg[viewBox="0 0 1150 440"] { width: 100% !important; min-width: 0 !important; height: auto !important; }
  [style*="height: 300px"][style*="overflow: hidden"][style*="justify-content: center"] { height: auto !important; padding: 26px 10px !important; }
}

@media (max-width: 767px) {
  /* filas de las 9 rutas: nombre a línea completa, datos debajo */
  .fila-ruta { flex-wrap: wrap !important; row-gap: 8px !important; column-gap: 12px !important; }
  .fila-ruta > .titulo { flex: 1 1 calc(100% - 60px) !important; letter-spacing: 1.5px !important; }
  .fila-ruta > .mono-label[style*="font-size: 10px"] { margin-left: 46px; flex: 1 1 auto; }
}

@media (max-width: 767px) {
  /* rejillas definidas por clase */
  .mosaico { grid-template-columns: 1fr !important; }
  .bahasa, .anula { grid-template-columns: 1fr 1fr !important; }
  /* filas de destinos: aire lateral y ritmo */
  [style*="padding: 45px 0"][style*="grid-template-columns"] { padding: 40px 20px !important; gap: 24px !important; }
  /* puntitos laterales de navegación: fuera en móvil */
  .dots { display: none !important; }
}

@media (max-width: 767px) {
  /* regla general: cualquier sección con padding lateral 56px pasa a 20px */
  [style*="px 56px"] { padding-left: 20px !important; padding-right: 20px !important; }
  /* filas foto+texto con huecos grandes: apilar (Carolina en Quiénes somos, etc.) */
  [style*="display: flex"][style*="gap: 64px"], [style*="display: flex"][style*="gap: 72px"],
  [style*="display: flex"][style*="gap: 80px"], [style*="display: flex"][style*="gap: 52px"] {
    flex-direction: column !important; gap: 28px !important;
  }
}

@media (max-width: 767px) {
  /* tarjetas foto+texto de las islas: margen contenido y foto a todo el ancho */
  [style*="margin: 30px 120px"] { margin: 20px !important; }
  [style*="width: 380px"] { width: 100% !important; }
  [style*="display: flex"][style*="gap: 44px"][style*="align-items: center"] { flex-direction: column !important; gap: 24px !important; }
}