/* =====================================================================
   Todo Tuxpan — versión tablet y móvil
   Se carga DESPUÉS de base.css. Solo contiene media queries.
   Escritorio (> 1100 px): no cambia nada.
   Tablet (768–1100 px): 1 "px de diseño" = 1 px real.
   Móvil (≤ 767 px): igual, pero crece o encoge un poco con la pantalla.
   ===================================================================== */

/* El botón del menú móvil no existe en escritorio */
.tt-hamburguesa { display: none; }
.tt-hamburguesa .fa-xmark { display: none; }
.tt-hamburguesa[aria-expanded="true"] .fa-bars { display: none; }
.tt-hamburguesa[aria-expanded="true"] .fa-xmark { display: inline-block; }

/* Texto solo para lectores de pantalla */
.tt-solo-lector {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* =========================  TABLET Y MÓVIL  ========================= */
@media (max-width: 1100px) {

  :root { --tt-px: 1px; }

  html { -webkit-text-size-adjust: 100%; }
  body { overflow-x: hidden; overflow-x: clip; }
  img { max-width: 100%; }

  .tt-contenedor { width: calc(100% - 64px); }

  /* ---------- Header ---------- */
  .tt-header { padding-block: 10px; }
  .tt-header__interior { gap: 12px; }
  .tt-logo img { height: 44px; }
  .tt-logo__texto { font-size: 22px; }
  .tt-header__acciones { gap: 10px; }

  .tt-hamburguesa {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    background: none;
    border: 1px solid var(--tt-petroleo);
    border-radius: 8px;
    color: var(--tt-petroleo);
    font-size: 20px;
    cursor: pointer;
  }
  .tt-hamburguesa:hover,
  .tt-hamburguesa[aria-expanded="true"] { background: var(--tt-petroleo-15); }

  .tt-notif__boton { width: 44px; height: 44px; }
  .tt-perfil__boton { min-height: 44px; padding: 8px 16px; }

  /* El menú se vuelve un panel que baja del header */
  .tt-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 5;
    flex-direction: column;
    gap: 0;
    padding: 6px 32px 14px;
    background: var(--tt-blanco);
    border-radius: 0 0 20px 20px;
    box-shadow: 0 10px 24px rgb(0 0 0 / 14%);
  }
  .tt-menu.is-abierto { display: flex; }

  .tt-menu a,
  .tt-menu__boton {
    width: 100%;
    padding: 15px 4px;
    border-bottom: 1px solid var(--tt-petroleo-15);
    font-size: 17px;
  }
  .tt-menu > :last-child { border-bottom: 0; }
  .tt-menu__boton { justify-content: flex-start; }
  .tt-menu__flecha { margin-left: auto; }

  /* Categorías: panel a todo el ancho */
  .tt-mega {
    left: 0;
    right: 0;
    top: 100%;
    width: auto;
    max-height: calc(100vh - 70px);
    overflow-y: auto;
    padding: 20px 32px 24px;
    border-radius: 0 0 20px 20px;
  }
  .tt-mega.is-abierto {
    grid-auto-flow: row;
    grid-template-rows: none;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 32px;
    row-gap: 16px;
  }
  .tt-mega__icono { flex-basis: 46px; height: 46px; font-size: 19px; }

  /* Paneles de perfil y notificaciones */
  .tt-perfil,
  .tt-notif {
    top: 100%;
    right: 16px;
    width: min(380px, calc(100% - 32px));
    max-height: calc(100vh - 80px);
    overflow-y: auto;
    padding: 24px 22px;
  }
  .tt-notif { padding: 20px 14px 14px; }
  .tt-notif__lista { max-height: 50vh; }

  /* ---------- Franja decorativa ---------- */
  .tt-franja img { height: 40px; object-fit: cover; }

  /* ---------- Hero ---------- */
  .tt-hero { height: auto; min-height: 520px; padding-block: 56px 72px; }
  .tt-hero__titulo-pequeno { font-size: 40px; }
  .tt-hero__titulo-grande { font-size: 84px; }
  .tt-hero__texto { max-width: 560px; margin-block: 20px; }
  .tt-buscador { width: min(620px, 100%); }
  .tt-hero__dots { bottom: 24px; }

  /* ---------- Títulos y espacios de sección ---------- */
  .tt-titulo-seccion__pequeno { font-size: 30px; }
  .tt-titulo-seccion__grande { font-size: 56px; }
  .tt-titulo-seccion--simple { font-size: 38px; }
  .tt-historia { padding-block: 64px; }
  .tt-categorias,
  .tt-revista,
  .tt-lugares,
  .tt-eventos,
  .tt-negocio,
  .tt-colab { padding-block: 56px; }

  /* ---------- Historia y Revista ---------- */
  .tt-historia__interior,
  .tt-revista__interior { flex-direction: column; align-items: stretch; gap: 32px; }
  .tt-historia__texto,
  .tt-revista__texto { width: 100%; }
  .tt-historia__imagen,
  .tt-revista__imagen { width: 100%; height: 340px; }

  /* ---------- Categorías ---------- */
  .tt-categorias__rejilla { grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .tt-tarjeta-cat__imagen { height: 150px; }

  /* ---------- Carrusel de lugares ---------- */
  .tt-carrusel__flecha { width: 42px; height: 42px; }
  .tt-carrusel__flecha--izq { left: 8px; }
  .tt-carrusel__flecha--der { right: 8px; }
  .tt-carrusel__pista .tt-tarjeta-lugar { flex-basis: 260px; }

  /* ---------- Eventos del inicio ---------- */
  .tt-eventos__rejilla { grid-template-columns: 1fr; }

  /* ---------- Banner "Publica tu negocio" ---------- */
  .tt-negocio__caja { flex-direction: column; align-items: stretch; gap: 28px; padding: 32px; }
  .tt-negocio__texto { width: 100%; }
  .tt-negocio__texto h2 { font-size: 32px; }
  .tt-negocio__imagen { width: 100%; height: 200px; }

  /* ---------- Banners de publicidad ---------- */
  .tt-publi { padding-block: 32px; }
  .tt-publi__caja {
    display: grid;
    width: calc(100% - 64px);
    height: auto;
    min-height: 0;
  }
  .tt-publi__slide { position: relative; inset: auto; grid-area: 1 / 1; min-height: 240px; }
  .tt-publi__contenido { padding: 32px 36px 44px; }
  .tt-publi__titulo { font-size: 32px; }
  .tt-publi__texto { font-size: 16px; }

  /* ---------- Colaboradores y patrocinadores ---------- */
  .tt-colab__patro { width: calc(50% - 14px); height: auto; min-height: 190px; }
  .tt-colab__logo { width: 190px; height: 104px; }

  /* ---------- Banners de páginas internas ---------- */
  .tt-banner-pagina { height: auto; min-height: 220px; padding-block: 36px; }
  .tt-banner-pagina h1 { font-size: 38px; }
  .tt-banner-grande { min-height: 440px; padding-block: 40px; }
  .tt-banner-grande .tt-migas { margin-bottom: 40px; }
  .tt-migas { flex-wrap: wrap; gap: 8px; }

  /* ---------- Footer ---------- */
  .tt-footer__rejilla { flex-wrap: wrap; gap: 36px 48px; padding-bottom: 40px; }
  .tt-footer__logo { flex: 0 0 100%; }
  .tt-footer__logo img { width: 160px; }
  .tt-footer__columna--categorias { flex: 1 1 100%; }

  /* ---------- Avisos, botón de subir y ventanas ---------- */
  .tt-avisos { bottom: 16px; }
  .tt-subir { right: 16px; bottom: 16px; width: 48px; height: 48px; font-size: 18px; }
  .tt-modal--login { width: min(480px, 92vw); }
}

/* ===========================  SOLO MÓVIL  =========================== */
@media (max-width: 767px) {

  /* 1 px de diseño se ajusta suavemente al ancho del teléfono */
  :root { --tt-px: clamp(0.85px, calc(100vw / 390), 1.15px); }

  .tt-contenedor { width: calc(100% - 32px); }

  .tt-logo img { height: 38px; }
  .tt-logo__texto { font-size: 19px; }

  /* Botón de perfil: solo el ícono o la foto */
  .tt-perfil__boton { width: 44px; padding: 0; justify-content: center; }
  .tt-perfil__boton [data-sesion-texto] {
    position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
  }
  .tt-perfil__icono img { width: 30px; height: 30px; }

  .tt-menu { padding-inline: 16px; }
  .tt-mega { padding: 16px 16px 20px; }
  .tt-mega.is-abierto { grid-template-columns: 1fr; row-gap: 14px; }

  .tt-perfil,
  .tt-notif { left: 12px; right: 12px; width: auto; }

  .tt-franja img { height: 28px; }

  /* Hero */
  .tt-hero__slide--movil { background-image: var(--tt-fondo-movil) !important; }
  .tt-hero { min-height: 460px; padding-block: 44px 64px; }
  .tt-hero__titulo-pequeno { font-size: 30px; }
  .tt-hero__titulo-grande { font-size: 60px; }
  .tt-hero__texto { font-size: 15px; }
  .tt-buscador input { padding: 14px 12px; min-width: 0; }

  /* Títulos y espacios */
  .tt-titulo-seccion__pequeno { font-size: 24px; }
  .tt-titulo-seccion__grande { font-size: 42px; }
  .tt-titulo-seccion--simple { font-size: 30px; }
  .tt-subtitulo { margin-bottom: 24px; }
  .tt-historia { padding-block: 44px; }
  .tt-categorias,
  .tt-revista,
  .tt-lugares,
  .tt-eventos,
  .tt-negocio,
  .tt-colab { padding-block: 40px; }
  .tt-centrado { margin-top: 28px; }

  .tt-historia__interior,
  .tt-revista__interior { gap: 24px; }
  .tt-historia__imagen,
  .tt-revista__imagen { height: 270px; }
  .tt-boton { padding: 14px 28px; }

  /* Categorías: 2 columnas */
  .tt-categorias__rejilla { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .tt-tarjeta-cat__imagen { height: 104px; }
  .tt-tarjeta-cat__cuerpo { padding: 12px 12px 14px; }
  .tt-tarjeta-cat__cuerpo h3 { font-size: 15px; }
  .tt-tarjeta-cat__cuerpo p {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    margin-bottom: 10px; font-size: 13px;
  }

  /* Carrusel: se desliza con el dedo, sin flechas */
  .tt-carrusel__flecha { display: none; }
  .tt-carrusel__pista {
    gap: 14px;
    margin-inline: -16px;
    padding-inline: 16px;
    scroll-padding-inline: 16px;
  }
  .tt-carrusel__pista .tt-tarjeta-lugar { flex-basis: 78%; max-width: 300px; }

  /* Eventos del inicio: foto arriba, datos abajo */
  .tt-eventos__rejilla,
  .tt-eventos__lado { gap: 16px; }
  .tt-evento { flex-direction: column; }
  .tt-evento__imagen { order: -1; flex: 0 0 auto; width: 100%; height: 180px; }
  .tt-evento__fecha { margin: 16px 0 0 16px; }
  .tt-evento--destacado .tt-evento__fecha { margin: 0 0 12px; }
  .tt-evento__cuerpo { padding: 18px; }

  /* Publica tu negocio */
  .tt-negocio__caja { padding: 26px 20px; gap: 22px; }
  .tt-negocio__texto h2 { font-size: 26px; }
  .tt-negocio__imagen { height: 150px; }

  /* Banners de publicidad */
  .tt-publi { padding-block: 24px; }
  .tt-publi__caja { width: calc(100% - 32px); }
  .tt-publi__slide { min-height: 230px; }
  .tt-publi__contenido { padding: 26px 22px 42px; }
  .tt-publi__titulo { font-size: 24px; }
  .tt-publi__texto { margin-bottom: 16px; font-size: 14px; }
  .tt-publi__marca { top: 10px; right: 12px; font-size: 11px; }
  .tt-publi__dots { bottom: 12px; }
  .tt-publi::after { background: linear-gradient(0deg, rgb(0 0 0 / 70%), rgb(0 0 0 / 25%)); }
  .tt-publi__slide::after { background: linear-gradient(0deg, rgb(0 0 0 / 72%) 0%, rgb(0 0 0 / 30%) 100%); }

  /* Colaboradores */
  .tt-colab__subtitulo { margin-top: 32px; font-size: 19px; }
  .tt-colab__patrocinadores { gap: 14px; margin-top: 28px; }
  .tt-colab__patro { width: 100%; min-height: 170px; }
  .tt-colab__logo { width: 150px; height: 86px; padding: 14px; }
  .tt-colab__item { padding-right: 12px; }

  /* Páginas internas */
  .tt-banner-pagina { min-height: 190px; padding-block: 28px; }
  .tt-banner-pagina h1 { font-size: 30px; }
  .tt-banner-grande { min-height: 380px; padding-block: 28px; }
  .tt-banner-grande .tt-migas { margin-bottom: 28px; }

  /* Footer */
  .tt-footer { padding-top: 40px; }
  .tt-footer__rejilla { flex-direction: column; gap: 28px; padding-bottom: 32px; }
  .tt-footer__doble { gap: 28px; }
  .tt-footer__columna h4 { margin-bottom: 14px; }
  .tt-footer__columna li { margin-bottom: 10px; }
  .tt-footer__columna a { font-size: 15px; }
  .tt-footer__derechos { padding-block: 24px; }

  /* Avisos más angostos */
  .tt-avisos { width: calc(100vw - 24px); }
  .tt-aviso { padding: 12px 12px 12px 14px; gap: 12px; }
  .tt-aviso__icono { width: 38px; height: 38px; font-size: 17px; }
}

/* Quien prefiere menos movimiento */
@media (prefers-reduced-motion: reduce) {
  .tt-carrusel__pista { scroll-behavior: auto; }
}

/* ---------- Categorías dentro del menú (móvil y tableta) ---------- */
@media (max-width:1100px){
  .tt-menu{max-height:calc(100vh - 90px);max-height:calc(100dvh - 90px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}
  .tt-menu .tt-mega{position:static;width:auto;max-height:none;overflow:visible;padding:6px 0 10px;background:none;border-radius:0;box-shadow:none;border-bottom:1px solid var(--tt-petroleo-15)}
  .tt-menu .tt-mega.is-abierto{display:grid;grid-template-columns:repeat(2,1fr);column-gap:24px;row-gap:12px}
  .tt-menu .tt-mega__icono{flex-basis:40px;height:40px;font-size:17px}
  .tt-menu__flecha{transition:transform .2s}
  .tt-menu__boton[aria-expanded="true"] .tt-menu__flecha{transform:rotate(180deg)}
}
@media (max-width:767px){
  .tt-menu .tt-mega.is-abierto{grid-template-columns:1fr}
}

/* ---------- Botones de fin de sección centrados ---------- */
@media (max-width:1100px){
  .tt-centrado{text-align:center}
  .tt-historia__texto .tt-boton,
  .tt-revista__texto .tt-boton{display:block;width:fit-content;margin-inline:auto}
}

/* ---------- Botón debajo de la imagen (historia, revista, negocio) ---------- */
@media (max-width:1100px){
  .tt-historia__interior,
  .tt-revista__interior,
  .tt-negocio__caja{gap:0}
  .tt-historia__texto,
  .tt-revista__texto,
  .tt-negocio__texto{display:contents}
  .tt-historia__imagen,
  .tt-revista__imagen,
  .tt-negocio__imagen{order:1;margin-top:8px}
  .tt-historia__texto .tt-boton,
  .tt-revista__texto .tt-boton,
  .tt-negocio__texto .tt-boton{order:2;align-self:center;margin:24px auto 0;display:block;width:fit-content}
}

/* ---------- Tarjeta de evento igual que la de lugar (móvil) ---------- */
@media (max-width:767px){
  .tt-evento__imagen{height:160px}
  .tt-evento__fecha{margin:16px 0 0 20px}
  .tt-evento__cuerpo{padding:12px 20px 20px}
  .tt-evento--destacado .tt-evento__cuerpo{padding:16px 20px 20px}
  .tt-evento--destacado .tt-evento__fecha{margin:0 0 12px}
  .tt-evento__cuerpo h3{font-size:16px;margin:0 0 6px}
  .tt-evento__cuerpo p{font-size:14px;margin:0 0 12px}
}

/* Evento = misma estructura que la tarjeta de lugar: fecha sobre la foto, cuerpo empieza con el título */
@media (max-width:767px){
  .tt-evento{position:relative}
  .tt-evento .tt-evento__fecha,
  .tt-evento--destacado .tt-evento__fecha{position:absolute;top:12px;left:12px;z-index:2;margin:0;background:rgb(255 255 255 / 92%);pointer-events:none}
  .tt-evento__imagen{height:160px}
  .tt-evento .tt-evento__cuerpo,
  .tt-evento--destacado .tt-evento__cuerpo{padding:16px 20px 20px}
  .tt-evento__cuerpo h3{margin:0 0 6px}
  .tt-evento__cuerpo p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 12px}
}

/* Eventos del inicio: slider horizontal como Lugares populares (móvil) */
@media (max-width:767px){
  .tt-eventos__rejilla{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding:8px 16px 24px;scroll-padding-inline:16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .tt-eventos__rejilla::-webkit-scrollbar{display:none}
  .tt-eventos__lado{display:contents}
  .tt-eventos__rejilla > .tt-evento,
  .tt-eventos__lado > .tt-evento{flex:0 0 78%;max-width:300px;scroll-snap-align:start}
}

/* Imágenes de tarjetas casi cuadradas (lugares y eventos) */
@media (max-width:1100px){
  .tt-tarjeta-lugar__imagen{height:auto;aspect-ratio:1 / .92}
  .tt-tarjeta-lugar__imagen img{position:absolute;inset:0}
}
@media (max-width:767px){
  .tt-evento__imagen{position:relative;height:auto;aspect-ratio:1 / .92}
  .tt-evento__imagen img{position:absolute;inset:0}
}

/* ---------- Listado de categoría (filtros, píldoras, rejilla, paginación) ---------- */
.tt-filtros__abrir{display:none}
@media (max-width:1100px){
  .tt-listado{padding-block:32px}
  .tt-listado__interior{flex-direction:column;align-items:stretch;gap:20px}
  .tt-filtros{flex:none;width:100%}
  .tt-filtros:not(.is-abierto){display:none}
  .tt-filtros__abrir{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:13px 16px;background:var(--tt-blanco);border:1px solid var(--tt-petroleo);border-radius:10px;color:var(--tt-petroleo);font:600 15px var(--tt-fuente);cursor:pointer}
  .tt-filtros__abrir[aria-expanded="true"]{background:var(--tt-petroleo);color:var(--tt-blanco)}
  .tt-filtros__cuenta{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;background:var(--tt-naranja);border-radius:999px;color:var(--tt-blanco);font-size:12px}
  .tt-filtros__cuenta[hidden]{display:none}
  .tt-filtros form{gap:16px}
  .tt-caja{padding:18px}
  .tt-rapidos{flex-wrap:nowrap;gap:10px;overflow-x:auto;margin:0 -32px 20px;padding:2px 32px 6px;scrollbar-width:none}
  .tt-rapidos::-webkit-scrollbar{display:none}
  .tt-pildora{flex:none;padding:8px 18px;white-space:nowrap}
  .tt-listado__rejilla{grid-template-columns:repeat(2,1fr);gap:24px}
  .tt-paginacion ul{flex-wrap:wrap;gap:8px;margin-top:32px}
  .tt-paginacion li > .page-numbers{width:40px;height:40px}
}
@media (max-width:767px){
  .tt-listado{padding-block:24px}
  .tt-rapidos{margin-inline:-16px;padding-inline:16px}
  .tt-listado__rejilla{grid-template-columns:1fr;gap:20px}
}

/* ======================================================================
   FICHA DEL LUGAR (móvil y tableta) — pegar al final de responsive.css
   ====================================================================== */
@media (max-width:1100px){
  /* Banner */
  .tt-banner-lugar{min-height:0;padding-block:44px 36px}
  .tt-banner-lugar .tt-migas{margin-bottom:22px;flex-wrap:wrap;row-gap:4px}
  .tt-banner-lugar__titulo{font-size:42px}
  .tt-banner-lugar__texto{margin-bottom:18px}
  .tt-banner-lugar__nota{margin-bottom:24px}
  .tt-banner-lugar__nota i{font-size:24px}
  .tt-banner-lugar__nota strong{font-size:20px}
  .tt-acciones{gap:26px}
  .tt-accion span{width:48px;height:48px;font-size:19px}

  /* Cuerpo: una columna, lateral debajo */
  .tt-lugar{padding-block:36px}
  .tt-lugar__interior{flex-direction:column;align-items:stretch;gap:36px}
  .tt-lugar__lateral{flex:none;width:100%;gap:20px}
  .tt-titulo-lugar{font-size:26px;margin-bottom:16px}
  .tt-lugar__texto{margin-bottom:36px}

  /* Galería: flechas dentro de la foto */
  .tt-galeria__visor .tt-carrusel__flecha{display:flex;width:38px;height:38px}
  .tt-galeria__visor .tt-carrusel__flecha--izq{left:8px}
  .tt-galeria__visor .tt-carrusel__flecha--der{right:8px}
  .tt-galeria__minis{gap:10px;margin-top:12px}
  .tt-galeria__mini{flex-basis:calc((100% - 30px) / 4);border-width:2px}

  /* Lateral */
  .tt-compartir{justify-content:space-around}
  .tt-ubicacion__mapa{height:220px}

  /* Habitaciones (hoteles) */
  .tt-habitaciones{margin-top:44px}
  .tt-habitacion__imagen{height:auto;aspect-ratio:1 / .92;position:relative}
  .tt-habitacion__imagen img{position:absolute;inset:0}

  /* Reseñas */
  .tt-resenas-rejilla{grid-template-columns:1fr;gap:16px}
  .tt-resena-tarjeta{padding:18px;gap:14px}
  .tt-resena-tarjeta__avatar{flex-basis:54px;width:54px;height:54px}

  /* Ventanas emergentes */
  .tt-modal--resena,.tt-modal--hab,.tt-modal--login,.tt-modal--editar,.tt-modal--confirmar{width:92vw}
  .tt-resena-form,.tt-resena-gracias{padding:36px 28px 28px}
  .tt-hab-modal{grid-template-columns:1fr;gap:24px;padding:28px}
  .tt-hab-modal__visor .tt-carrusel__flecha{display:flex;width:36px;height:36px}
  .tt-hab-modal__visor .tt-carrusel__flecha--izq{left:8px}
  .tt-hab-modal__visor .tt-carrusel__flecha--der{right:8px}
}
@media (max-width:767px){
  .tt-banner-lugar{padding-block:32px 28px}
  .tt-banner-lugar__titulo{font-size:32px}
  .tt-etiqueta{font-size:13px;padding:5px 16px}
  .tt-acciones{gap:0;justify-content:space-between}
  .tt-accion{font-size:12px}
  .tt-lugar{padding-block:28px}
  .tt-titulo-lugar{font-size:23px}
  .tt-galeria__principal{aspect-ratio:4 / 3}
  .tt-galeria__mini{flex-basis:calc((100% - 20px) / 3)}
  .tt-resena-form,.tt-resena-gracias{padding:32px 20px 22px}
  .tt-resena-form h2,.tt-resena-gracias h2{font-size:24px}
  .tt-resena-form > p{font-size:15px}
  .tt-estrellas-input{gap:4px}
  .tt-estrellas-input button{font-size:30px}
  .tt-resena-form__botones{gap:12px}
  .tt-hab-modal{padding:24px 16px 20px}
  .tt-hab-modal__info h2{font-size:24px}
  .tt-hab-modal__precio strong{font-size:26px}
  .tt-hab-modal__servicios{grid-template-columns:1fr}
  .tt-hab-modal__minis{gap:8px}
}

/* ======================================================================
   FICHA DEL LUGAR (móvil y tableta) — pegar al final de responsive.css
   ====================================================================== */
@media (max-width:1100px){
  /* Banner */
  .tt-banner-lugar{min-height:0;padding-block:44px 36px}
  .tt-banner-lugar .tt-migas{margin-bottom:22px;flex-wrap:wrap;row-gap:4px}
  .tt-banner-lugar__titulo{font-size:42px}
  .tt-banner-lugar__texto{margin-bottom:18px}
  .tt-banner-lugar__nota{margin-bottom:24px}
  .tt-banner-lugar__nota i{font-size:24px}
  .tt-banner-lugar__nota strong{font-size:20px}
  .tt-acciones{gap:26px}
  .tt-accion span{width:48px;height:48px;font-size:19px}

  /* Cuerpo: una columna, lateral debajo */
  .tt-lugar{padding-block:36px}
  .tt-lugar__interior{flex-direction:column;align-items:stretch;gap:36px}
  .tt-lugar__lateral{flex:none;width:100%;gap:20px}
  .tt-titulo-lugar{font-size:26px;margin-bottom:16px}
  .tt-lugar__texto{margin-bottom:36px}

  /* Galería: flechas dentro de la foto */
  .tt-galeria__visor .tt-carrusel__flecha{display:flex;width:38px;height:38px;align-items: center;justify-content: center;}
  .tt-galeria__visor .tt-carrusel__flecha--izq{left:8px}
  .tt-galeria__visor .tt-carrusel__flecha--der{right:8px}
  .tt-galeria__minis{gap:10px;margin-top:12px}
  .tt-galeria__mini{flex-basis:calc((100% - 30px) / 4);border-width:2px}

  /* Lateral */
  .tt-compartir{justify-content:space-around}
  .tt-ubicacion__mapa{height:220px}

  /* Habitaciones (hoteles) */
  .tt-habitaciones{margin-top:44px}
  .tt-habitacion__imagen{height:auto;aspect-ratio:1 / .92;position:relative}
  .tt-habitacion__imagen img{position:absolute;inset:0}

  /* Reseñas */
  .tt-resenas-rejilla{grid-template-columns:1fr;gap:16px}
  .tt-resena-tarjeta{padding:18px;gap:14px}
  .tt-resena-tarjeta__avatar{flex-basis:54px;width:54px;height:54px}

  /* Ventanas emergentes */
  .tt-modal--resena,.tt-modal--hab,.tt-modal--login,.tt-modal--editar,.tt-modal--confirmar{width:92vw}
  .tt-resena-form,.tt-resena-gracias{padding:36px 28px 28px}
  .tt-hab-modal{grid-template-columns:1fr;gap:24px;padding:28px}
  .tt-hab-modal__visor .tt-carrusel__flecha{display:flex;width:36px;height:36px;align-items: center;justify-content: center;}
  .tt-hab-modal__visor .tt-carrusel__flecha--izq{left:8px}
  .tt-hab-modal__visor .tt-carrusel__flecha--der{right:8px}
}
@media (max-width:767px){
  .tt-banner-lugar{padding-block:32px 28px}
  .tt-banner-lugar__titulo{font-size:32px}
  .tt-etiqueta{font-size:13px;padding:5px 16px}
  .tt-acciones{gap:0;justify-content: space-evenly;}
  .tt-accion{font-size:12px}
  .tt-lugar{padding-block:28px}
  .tt-titulo-lugar{font-size:23px}
  .tt-galeria__principal{aspect-ratio:4 / 3}
  .tt-galeria__mini{flex-basis:calc((100% - 20px) / 3)}
  .tt-resena-form,.tt-resena-gracias{padding:32px 20px 22px}
  .tt-resena-form h2,.tt-resena-gracias h2{font-size:24px}
  .tt-resena-form > p{font-size:15px}
  .tt-estrellas-input{gap:4px}
  .tt-estrellas-input button{font-size:30px}
  .tt-resena-form__botones{gap:12px}
  .tt-hab-modal{padding:24px 16px 20px}
  .tt-hab-modal__info h2{font-size:24px}
  .tt-hab-modal__precio strong{font-size:26px}
  .tt-hab-modal__servicios{grid-template-columns:1fr}
  .tt-hab-modal__minis{gap:8px}
}

/* Corrección: la lista de contacto heredaba el relleno de la página "Contacto" (hueco enorme) */
@media (max-width:1100px){
  .tt-lugar__lateral .tt-contacto{padding:0;margin-bottom:22px}
  .tt-lugar__lateral .tt-contacto__interior{display:block}
  .tt-lugar__lateral .tt-caja{padding:20px 18px}
  .tt-galeria__dot {width: calc(7 * var(--tt-px));height: calc(7 * var(--tt-px));}
}

/* Insignia de fecha de "Más eventos" igual a la de los eventos del inicio (borde petróleo, fondo claro) */
.tt-tarjeta-evento .tt-fecha-badge{
  top:12px;left:12px;
  min-width:0;padding:6px 12px;
  background:rgb(255 255 255 / 92%);
  border:2px solid var(--tt-petroleo);
  border-radius:8px;
  color:var(--tt-petroleo);
  line-height:1.1;
}
.tt-tarjeta-evento .tt-fecha-badge strong{font-size:24px;font-weight:700}
.tt-tarjeta-evento .tt-fecha-badge span{font-size:14px;font-weight:600}

/* ======================================================================
   EXPLORAR (móvil y tableta) — pegar al final de responsive.css
   ====================================================================== */
@media (max-width:1100px){
  .tt-banner-explorar{min-height:0;padding-block:40px 44px}
  .tt-banner-explorar .tt-migas{margin-bottom:24px}
  .tt-buscador--explorar{width:100%}
  .tt-sugerencias{gap:10px;margin-top:18px}
  .tt-titulo-mixto{font-size:38px}
  .tt-titulo-mixto--grande{font-size:42px}
  .tt-chips-cat{gap:12px}
}
@media (max-width:767px){
  .tt-banner-explorar{padding-block:28px 32px}
  .tt-buscador--explorar{flex-wrap:wrap;padding:6px;row-gap:2px}
  .tt-buscador--explorar input{flex:1 1 100%;min-width:0;padding:12px 12px}
  .tt-buscador--explorar select{flex:1 1 0;min-width:0;padding:12px 10px;border-left:0;border-top:1px solid var(--tt-petroleo-15);border-radius:0}
  .tt-buscador--explorar button{flex:0 0 44px}
  .tt-sugerencias a{padding:5px 14px;font-size:13px}
  .tt-titulo-mixto{font-size:28px}
  .tt-titulo-mixto--grande{font-size:30px}
  .tt-chips-cat{gap:10px}
  .tt-chips-cat a{padding:8px 16px;font-size:14px}
}

/* ======================================================================
   MAPA (móvil y tableta) — pegar al final de responsive.css
   ====================================================================== */
@media (max-width:1100px){
  .tt-mapa{padding:20px 0 40px}
  .tt-mapa__interior{grid-template-columns:1fr;gap:20px}
  .tt-mapa__lienzo{order:-1;border-radius:12px}
  .tt-mapa__mapa{height:62vh;height:62dvh;min-height:340px}
  .tt-mapa__panel{gap:16px}
  .tt-mapa__lista{max-height:320px}
  .tt-mapa__item-nombre{font-size:16px}
  .tt-mapa__ubicacion{left:12px;bottom:16px;height:44px;padding:0 18px;font-size:15px;gap:8px}
}
@media (max-width:767px){
  .tt-mapa__mapa{height:58vh;height:58dvh;min-height:320px}
  .tt-mapa__atajos button{font-size:15px}
}

/* ======================================================================
   PERFIL, FAVORITOS, RESEÑAS, NOTIFICACIONES, CONFIGURACIÓN, EDITAR,
   PUBLICAR NEGOCIO / EVENTO (móvil y tableta) — pegar al final de responsive.css
   ====================================================================== */
@media (max-width:1100px){
  .tt-perfil-pagina{padding-block:28px}
  .tt-perfil-pagina__interior{flex-direction:column;align-items:stretch;gap:20px}
  .tt-gate{padding-block:36px}
  .tt-gate h2{font-size:26px}

  /* Barra lateral: menú como pestañas deslizables, "Contáctanos" al final */
  .tt-perfil-lateral{display:contents}
  .tt-perfil-lateral > .tt-caja:first-child{order:1}
  .tt-perfil-pagina__principal{order:2;width:100%}
  .tt-perfil-lateral > .tt-caja:not(:first-child){order:3}
  .tt-perfil-lateral__cabecera{flex-direction:row;justify-content:flex-start;gap:14px;margin-bottom:14px;text-align:left}
  .tt-menu-perfil{display:flex;gap:8px;overflow-x:auto;margin-inline:-6px;padding:2px 6px 6px;scrollbar-width:none}
  .tt-menu-perfil::-webkit-scrollbar{display:none}
  .tt-menu-perfil li{flex:none}
  .tt-menu-perfil a,.tt-menu-perfil button{width:auto;gap:10px;padding:10px 16px;border:1px solid var(--tt-petroleo-15);border-radius:999px;font-size:15px;white-space:nowrap}

  /* Tarjeta de perfil */
  .tt-perfil-tarjeta{flex-direction:column;align-items:center;gap:20px;text-align:center}
  .tt-perfil-tarjeta__foto{flex-basis:128px;width:128px;height:128px;font-size:44px}
  .tt-perfil-tarjeta__bio{max-width:none}
  .tt-perfil-bloque{margin-top:40px}
  .tt-sync{gap:14px;margin-bottom:24px;padding:16px 18px}
  .tt-barra-listado{flex-direction:column;gap:12px}
  .tt-barra-listado select{width:100%}
  .tt-pildoras{gap:10px;margin-bottom:20px}
  .tt-otros-bloque{margin-top:40px}
  .tt-otros-grupo__titulo{font-size:20px;margin-bottom:16px}

  /* Notificaciones */
  .tt-notif-filtros{overflow-x:auto;flex-wrap:nowrap;margin:20px -6px 16px;padding:2px 6px 6px;scrollbar-width:none}
  .tt-notif-filtros::-webkit-scrollbar{display:none}
  .tt-notif-filtro{flex:none;white-space:nowrap}
  .tt-notif-pagina .tt-notif-item{padding:16px}
  .tt-notif-pagina .tt-notif-ico{flex-basis:44px;height:44px;font-size:19px}

  /* Configuración */
  .tt-conf{padding:24px 22px}
  .tt-conf__titulo{font-size:20px}
  .tt-conf__texto,.tt-conf__lista{font-size:16px}
  .tt-conf-final{padding-block:36px}
  .tt-conf-final h2{font-size:26px}

  /* Editar perfil */
  .tt-form-perfil{padding:28px 24px}
  .tt-campo--2{grid-column:span 3}
  .tt-foto-editar{gap:24px}

  /* Publicar negocio / evento */
  .tt-form--tarjeta{padding:24px;margin-top:20px}
  .tt-form__seccion{font-size:21px}
  .tt-form input[type="text"],.tt-form input[type="email"],.tt-form input[type="tel"],.tt-form input[type="date"],.tt-form select{height:50px;font-size:16px}
  .tt-form textarea{height:150px;font-size:16px}
  .tt-campo label{font-size:16px}

  /* Ventanas emergentes del perfil */
  .tt-editar{padding:30px 22px 24px}
  .tt-confirmar{padding:32px 22px}
  .tt-login{padding:36px 24px 28px}
  .tt-login h2{font-size:26px}
}
@media (max-width:767px){
  .tt-perfil-pagina{padding-block:20px}
  .tt-perfil-tarjeta__foto{flex-basis:108px;width:108px;height:108px;font-size:38px}
  .tt-perfil-vacio{padding:20px}

  .tt-conf{padding:20px 16px}
  .tt-conf__cuenta{flex-direction:column;align-items:flex-start;gap:16px}
  .tt-conf__foto{flex-basis:72px;width:72px;height:72px;font-size:28px}
  .tt-conf__datos{grid-template-columns:1fr;gap:14px;width:100%}
  .tt-conf__acciones{gap:12px}
  .tt-conf__acciones > *{flex:1 1 100%;justify-content:center;text-align:center}
  .tt-conf__dialogo-botones{flex-wrap:wrap}
  .tt-conf__dialogo-botones > *{flex:1 1 100%;justify-content:center}

  .tt-form-perfil{padding:22px 16px}
  .tt-campos{gap:16px}
  .tt-campo--2,.tt-campo--3,.tt-campo--6{grid-column:1 / -1}
  .tt-campo input,.tt-campo textarea{padding:13px 14px}
  .tt-foto-editar{flex-direction:column;gap:16px;text-align:center}
  .tt-foto-editar__foto{flex-basis:120px;width:120px;height:120px;font-size:44px}
  .tt-foto-editar__botones{justify-content:center}
  .tt-form-perfil__botones{flex-direction:column;gap:12px}
  .tt-form-perfil__botones > *{min-width:0;width:100%}

  .tt-form--tarjeta{padding:20px 16px}
  .tt-form__rejilla{grid-template-columns:1fr;gap:16px}
  .tt-form__seccion{font-size:19px}
  .tt-form__aviso{gap:14px;padding:14px}
  .tt-form__aviso-icono{width:46px;height:46px;font-size:20px}
  .tt-form__aviso p{font-size:14px}
  .tt-form__boton{min-width:0;width:100%}
  .tt-form__ok h3{font-size:22px}
  .tt-form__ok p{font-size:16px}

  .tt-editar__botones,.tt-confirmar__botones{flex-direction:column-reverse}
  .tt-editar__botones > *{width:100%;justify-content:center}
}

/* ======================================================================
   SOBRE NOSOTROS, CONTACTO, PRIVACIDAD Y PUBLICIDAD (móvil y tableta)
   — pegar al final de responsive.css
   ====================================================================== */
@media (max-width:1100px){
  .tt-subtitulo--ancho{max-width:none}

  /* Sobre nosotros */
  .tt-sobre-intro{padding-block:36px 28px}
  .tt-sobre-intro__interior{flex-direction:column;align-items:stretch;gap:28px}
  .tt-sobre-intro__texto{flex:none;width:100%}
  .tt-collage{width:100%;flex:none;height:320px;gap:12px}
  .tt-sobre-pilares,.tt-sobre-encontraras,.tt-sobre-valores{padding-block:28px 36px}
  .tt-pilares__rejilla,.tt-sobre-encontraras .tt-pilares__rejilla{grid-template-columns:repeat(2,1fr);gap:28px}
  .tt-valores__rejilla{grid-template-columns:repeat(2,1fr);gap:20px}
  .tt-valor{padding:26px 24px}

  /* Contacto */
  .tt-contacto{padding-block:28px 48px}
  .tt-contacto__interior{grid-template-columns:1fr;gap:32px}
  .tt-info-card{padding:22px}
  .tt-info-card__bloque,.tt-info-card__intro{font-size:16px}
  .tt-faq__titulo{margin-top:48px}
  .tt-faq{gap:14px;margin-top:20px}
  .tt-faq__item summary{padding:18px 20px;font-size:17px}
  .tt-faq__respuesta{padding:0 20px 20px}
  .tt-faq__respuesta p{font-size:16px}

  /* Privacidad */
  .tt-legal{padding-block:28px 48px}
  .tt-legal__interior{grid-template-columns:1fr;gap:28px}
  .tt-legal__indice{position:static}
  .tt-legal__intro{font-size:17px}
  .tt-legal__seccion{margin-top:32px}
  .tt-legal__seccion h3{font-size:22px}
  .tt-legal__seccion p,.tt-legal__seccion li{font-size:16px}

  /* Publicidad */
  .tt-seccion{padding-block:44px}
  .tt-pub-intro{grid-template-columns:1fr;gap:28px}
  .tt-pub-intro__texto p{font-size:17px}
  .tt-pub-intro__botones{margin-top:24px}
  .tt-beneficios{grid-template-columns:repeat(2,1fr);gap:20px;margin-top:28px}
  .tt-beneficio{padding:24px}
  .tt-beneficio p{font-size:16px}
  .tt-espacios{grid-template-columns:1fr;gap:22px;margin-top:28px}
  .tt-espacio{padding:26px}
  .tt-espacio h3{font-size:22px}
  .tt-pasos{grid-template-columns:repeat(2,1fr);gap:28px 20px;margin-top:28px}
  .tt-paso h3{font-size:19px}
  .tt-paso p{font-size:16px}
}
@media (max-width:767px){
  /* Galería "Impulsamos lo mejor de Tuxpan": slider deslizable en móvil */
  .tt-collage{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;height:260px;gap:10px}
  .tt-collage::-webkit-scrollbar{display:none}
  .tt-collage__img,.tt-collage__img--grande{flex:0 0 82%;height:100%;scroll-snap-align:center}
  .tt-pilares__rejilla,.tt-sobre-encontraras .tt-pilares__rejilla{grid-template-columns:1fr;gap:22px}
  .tt-valores__rejilla{grid-template-columns:1fr;gap:16px}
  .tt-redes-contacto{gap:16px}
  .tt-redes-contacto a{width:50px;height:50px;font-size:23px}
  .tt-seccion{padding-block:36px}
  .tt-pub-intro__botones{flex-direction:column}
  .tt-pub-intro__botones > *{width:100%;text-align:center;justify-content:center}
  .tt-beneficios{grid-template-columns:1fr}
  .tt-paso__numero{width:54px;height:54px;font-size:24px}
}

/* ======================================================================
   HISTORIA Y CULTURA DE TUXPAN (móvil y tableta) — pegar al final de responsive.css
   ====================================================================== */
@media (max-width:1100px){
  .tt-origenes{padding-block:36px 24px}
  .tt-origenes__interior{flex-direction:column;align-items:stretch;gap:28px}
  .tt-origenes__texto{width:100%}
  .tt-origenes__imagen{width:100%;height:300px;border-radius:16px}

  .tt-linea,.tt-cultura,.tt-tradiciones{padding-block:28px}
  .tt-linea__rejilla{grid-template-columns:repeat(2,1fr);gap:20px}
  .tt-hito,.tt-hito--ancho{grid-column:span 1}
  .tt-hito--ancho{grid-column:span 2}
  .tt-hito__imagen{height:200px}
  .tt-hito__cuerpo{padding:18px 20px 22px}

  /* Elementos de la cultura: se deslizan como los demás carruseles */
  .tt-cultura__rejilla{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-32px;padding:6px 32px 20px;scroll-padding-inline:32px;scrollbar-width:none}
  .tt-cultura__rejilla::-webkit-scrollbar{display:none}
  .tt-elemento{flex:0 0 260px;scroll-snap-align:start}

  .tt-tradiciones__interior,.tt-hoy__interior{flex-direction:column;align-items:stretch;gap:28px}
  .tt-tradiciones__texto,.tt-tradiciones__rejilla,.tt-hoy__texto{width:100%}
  .tt-tradiciones__rejilla,.tt-hoy__rejilla{gap:16px}
  .tt-hoy{padding-block:28px 56px}
  .tt-hoy__imagen{width:100%;height:300px;border-radius:16px}
}
@media (max-width:767px){
  .tt-origenes{padding-block:28px 16px}
  .tt-origenes__imagen,.tt-hoy__imagen{height:230px}
  .tt-linea__rejilla{grid-template-columns:1fr;gap:16px}
  .tt-hito--ancho{grid-column:span 1}
  .tt-hito__imagen{height:180px}
  .tt-cultura__rejilla{margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px;gap:14px}
  .tt-elemento{flex-basis:78%;max-width:300px}
  .tt-tradiciones__rejilla,.tt-hoy__rejilla{grid-template-columns:1fr}
  .tt-hoy{padding-block:24px 44px}
}

/* ======================================================================
   REVISTA VIRTUAL (móvil y tableta) — pegar al final de responsive.css
   ====================================================================== */
@media (max-width:1100px){
  .tt-banner-revista{flex-direction:column;align-items:stretch;gap:28px}
  .tt-banner-revista__texto{flex:none;width:100%}
  .tt-banner-revista__imagen{flex:none;width:100%;height:260px}

  .tt-presenta{padding-block:40px}
  .tt-presenta__interior{flex-direction:column;align-items:stretch;gap:28px}
  .tt-presenta__texto{flex:none;width:100%}
  .tt-presenta__texto .tt-lema{font-size:30px;margin-bottom:20px}
  .tt-presenta__botones{gap:16px;margin-top:24px}
  .tt-presenta__imagen{flex:none;width:100%;height:300px}

  .tt-ediciones{padding-block:24px 48px}
  .tt-ediciones__rejilla{gap:20px}

  /* Visor del libro */
  .tt-visor{padding-block:40px}
  .tt-visor__interior{flex-direction:column;align-items:stretch;gap:32px}
  .tt-visor__info{flex:none;width:100%}
  .tt-visor__visor .tt-carrusel__flecha{display:flex;width:38px;height:38px;align-items: center;}
  .tt-visor__visor .tt-carrusel__flecha--izq{left:6px}
  .tt-visor__visor .tt-carrusel__flecha--der{right:6px}
  .tt-visor__barra{flex-wrap:wrap;gap:12px 14px;margin-top:20px}
  .tt-visor__zoom{width:auto;flex:1 1 90px;min-width:90px;max-width:220px}
  .tt-visor__icono{padding:8px;font-size:21px}
}
@media (max-width:767px){
  .tt-banner-revista{gap:22px}
  .tt-banner-revista__imagen{height:200px}
  .tt-presenta{padding-block:32px}
  .tt-presenta__texto .tt-lema{font-size:24px}
  .tt-presenta__botones{flex-direction:column;gap:12px}
  .tt-presenta__botones > *{width:100%;text-align:center}
  .tt-presenta__imagen{height:230px}

  /* Ediciones anteriores: se deslizan */
  .tt-ediciones__rejilla{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding:10px 20px 18px;scroll-padding-inline:20px;scrollbar-width:none}
  .tt-ediciones__rejilla::-webkit-scrollbar{display:none}
  .tt-edicion{flex:0 0 42%;max-width:170px;scroll-snap-align:start}

  .tt-visor{padding-block:32px}
  .tt-visor__barra{justify-content:space-between}
  .tt-visor__contador{margin-left:0}
}

/* ===== REVISTA · correcciones (pegar al FINAL de responsive.css; reemplaza el bloque de ediciones/botones anterior) ===== */

/* Etiqueta de edición: solo móvil/tablet */
.tt-edicion__nombre{display:none}

@media (max-width:1100px){
  /* Botones debajo de la imagen */
  .tt-presenta__interior{display:flex;flex-direction:column;gap:28px}
  .tt-presenta__texto{display:contents}
  .tt-presenta__texto > *{order:0}
  .tt-presenta__imagen{order:1;width:100%;flex:none}
  .tt-presenta__botones{order:2;margin-top:0;justify-content:center}
  .tt-presenta__texto > .tt-presenta__botones{order:2;display: flex;align-items: center;}

  /* Ediciones: dos por fila, sin slider, con nombre debajo */
  .tt-ediciones__rejilla{display:grid;grid-template-columns:repeat(2,1fr);gap:24px 16px;overflow:visible}
  .tt-edicion-item{display:flex;flex-direction:column;gap:10px;min-width:0}
  .tt-edicion-item .tt-edicion{flex:none;max-width:none;width:100%}
  .tt-edicion__nombre{display:block;text-align:center;font-weight:600;font-size:15px;color:var(--tt-petroleo)}
  .tt-edicion-item:has(.is-activa) .tt-edicion__nombre{color:var(--tt-naranja)}
}

@media (max-width:767px){
  .tt-presenta__botones{flex-direction:column;align-items:stretch}
  .tt-presenta__botones .tt-boton{width:100%;text-align:center;width: fit-content;}
  .tt-ediciones__rejilla{display:grid;overflow:visible}
  .tt-edicion{flex:none;max-width:none}
}

/* Visor en UNA sola página (teléfono) */
#visor.is-single .tt-pag--izq{display:none}
#visor.is-single .tt-visor__hoja,
#visor.is-single .tt-visor__hoja.is-portada{transform:none}
#visor.is-single .tt-pag--der{flex:0 0 100%;width:100%}