/* ==========================================================================
   Landing pública – atardecer del Pacífico
   ========================================================================== */
:root {
  --noche: #0b1030;
  --indigo: #2b1b5f;
  --ciruela: #7b2f73;
  --coral: #ff5a4e;
  --naranja: #ff8a3d;
  --sol: #ffcf7a;
  --turquesa: #0f9aa6;
  --arena: #fbf5ec;
  --papel: #ffffff;
  --tinta: #151a2d;
  --texto: #2a3145;
  --gris: #646b7d;
  --linea: #ebe4d8;
  --wa: #1fae5b;
  --sombra: 0 24px 60px -28px rgba(20, 16, 50, .45);
  --f-tit: 'Bricolage Grotesque', 'Plus Jakarta Sans', system-ui, sans-serif;
  --f-txt: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --f-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--papel); color: var(--texto);
  font: 400 16px/1.5 var(--f-txt); -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, h4, p { margin: 0; }
button { font: inherit; }
[hidden] { display: none !important; }
section[id] { scroll-margin-top: 76px; }
.wrap { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.i { width: 20px; height: 20px; flex: none; }
:focus-visible { outline: 3px solid var(--sol); outline-offset: 3px; border-radius: 8px; }
.skip { position: absolute; left: -9999px; top: 12px; z-index: 100; background: #fff; color: var(--tinta); padding: 10px 16px; border-radius: 10px; font-weight: 700; }
.skip:focus { left: 12px; }

/* ---------- Botones ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 22px; border-radius: 999px; border: 0; cursor: pointer;
  font: 700 15px/1.2 var(--f-txt); text-decoration: none; white-space: nowrap;
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn-cta { background: linear-gradient(135deg, var(--coral), var(--naranja)); color: #fff; box-shadow: 0 12px 26px -10px rgba(255, 90, 78, .7); }
.btn-cta:hover { box-shadow: 0 18px 34px -10px rgba(255, 90, 78, .8); }
.btn-dark { background: var(--tinta); color: #fff; }
.btn-light { background: #fff; color: var(--tinta); box-shadow: inset 0 0 0 1.5px var(--linea); }
.btn-wa { background: var(--wa); color: #fff; box-shadow: 0 12px 26px -12px rgba(31, 174, 91, .8); }
.btn-claro { background: #fff; color: var(--tinta); box-shadow: 0 14px 30px -12px rgba(0, 0, 0, .4); }
.btn-borde { background: rgba(255, 255, 255, .06); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .55); }
.btn-lg { padding: 16px 28px; font-size: 16px; }
.btn-sm { padding: 10px 16px; font-size: 14px; }
.btn-block { width: 100%; }
.btn .i { width: 19px; height: 19px; }

/* ---------- Navegación ---------- */
.nav { position: fixed; inset: 0 0 auto; z-index: 50; color: #fff; transition: background-color .3s, box-shadow .3s, backdrop-filter .3s; }
.nav.solido { background: rgba(11, 16, 48, .86); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 10px 30px -18px rgba(0, 0, 0, .6); }
.nav-in { display: flex; align-items: center; gap: 14px; height: 68px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; min-width: 0; }
.brand-logo { width: 42px; height: 42px; flex: none; border-radius: 12px; background: #fff; display: grid; place-items: center; overflow: hidden; padding: 2px; box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .5); }
.brand-logo img { width: 100%; height: 100%; object-fit: contain; }
.brand-logo svg { width: 70%; height: 70%; color: var(--tinta); }
.brand-txt { min-width: 0; }
.brand-txt b { display: block; font: 800 17px/1.1 var(--f-tit); letter-spacing: -.01em; white-space: nowrap; }
.brand-txt small { display: block; font-size: 12px; opacity: .72; white-space: nowrap; }
.nav-links { display: flex; gap: 2px; margin-left: auto; }
.nav-links a { padding: 8px 12px; border-radius: 999px; color: rgba(255, 255, 255, .86); font-weight: 600; font-size: 14.5px; text-decoration: none; transition: background-color .2s; }
.nav-links a:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.nav-actions { display: flex; align-items: center; gap: 8px; }
.nav-ghost { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 999px; color: #fff; font-weight: 600; font-size: 14.5px; text-decoration: none; }
.nav-ghost:hover { background: rgba(255, 255, 255, .1); }
.nav-ghost .i { width: 18px; height: 18px; }
.burger { display: none; width: 42px; height: 42px; border-radius: 12px; border: 0; background: rgba(255, 255, 255, .1); color: #fff; place-items: center; cursor: pointer; }
.cajon { position: fixed; inset: 0; z-index: 60; background: rgba(5, 8, 25, .55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.cajon-panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(86vw, 360px); background: #fff; padding: 72px 22px 28px;
  display: flex; flex-direction: column; gap: 4px; overflow-y: auto; animation: entra .3s ease;
}
.cajon-panel > a:not(.btn) { padding: 14px 6px; font: 700 20px var(--f-tit); color: var(--tinta); text-decoration: none; border-bottom: 1px solid var(--linea); }
.cajon-panel .btn { margin-top: 12px; }
.cajon-x { position: absolute; top: 16px; right: 16px; width: 42px; height: 42px; border-radius: 12px; border: 0; background: #f2eff7; color: var(--tinta); display: grid; place-items: center; cursor: pointer; }
@keyframes entra { from { transform: translateX(40px); opacity: 0; } }

/* ---------- Portada ---------- */
.hero {
  --escena-h: clamp(340px, 36vw, 500px);
  position: relative; isolation: isolate; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: space-between;
  overflow: hidden; color: #fff; background: linear-gradient(180deg, #0b1030 0%, #17143f 45%, #2b1b5f 100%);
}
.cielo-estrellas { position: absolute; top: 0; left: 0; z-index: -3; width: 100%; height: 75%; }
.escena { position: absolute; left: 0; bottom: 0; z-index: -2; width: 100%; height: var(--escena-h); -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 26%); mask-image: linear-gradient(180deg, transparent 0, #000 26%); }
.hero-sombra { position: absolute; inset: 0 0 auto; height: 45%; z-index: -1; background: linear-gradient(180deg, rgba(11, 16, 48, .55), rgba(11, 16, 48, 0)); pointer-events: none; }
.hero-in { padding-top: calc(68px + clamp(18px, 4vh, 48px)); padding-bottom: calc(var(--escena-h) * .66); text-align: center; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 9px; padding: 7px 15px; border-radius: 999px;
  background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-weight: 600; font-size: 13.5px;
}
.pulso { width: 8px; height: 8px; border-radius: 50%; background: #3ee08f; animation: pulso 2s infinite; }
@keyframes pulso { 0% { box-shadow: 0 0 0 0 rgba(62, 224, 143, .7); } 70% { box-shadow: 0 0 0 9px rgba(62, 224, 143, 0); } 100% { box-shadow: 0 0 0 0 rgba(62, 224, 143, 0); } }
.hero h1 {
  margin: 16px auto 0; max-width: 13ch; font: 800 clamp(42px, 7vw, 82px)/.96 var(--f-tit); letter-spacing: -.035em;
  text-wrap: balance; text-shadow: 0 4px 40px rgba(11, 16, 48, .35);
}
.hero h1 em { font-style: normal; background: linear-gradient(90deg, #ffd98a, #ff9a62 55%, #ff6b85); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lead { max-width: 48ch; margin: 16px auto 0; font-size: clamp(16px, 1.7vw, 19px); line-height: 1.55; color: rgba(255, 255, 255, .86); text-wrap: pretty; }
.bajar { position: absolute; left: 50%; bottom: 16px; width: 42px; height: 42px; margin-left: -21px; display: grid; place-items: center; color: #fff; opacity: .75; animation: bota 2.2s ease-in-out infinite; }
@keyframes bota { 50% { transform: translateY(6px); } }

/* Entrada de la portada: solo CSS, no depende de JavaScript */
.hero-in > * { animation: entrada .9s cubic-bezier(.2, .7, .2, 1) backwards; }
.hero-in > :nth-child(2) { animation-delay: .08s; }
.hero-in > :nth-child(3) { animation-delay: .16s; }
.hero-in > :nth-child(4) { animation-delay: .26s; }
@keyframes entrada { from { opacity: 0; transform: translateY(18px); } }

/* Escena SVG */
.estrellas circle { opacity: .7; animation: titila 4s ease-in-out infinite alternate; }
@keyframes titila { from { opacity: .12; } to { opacity: .9; } }
.sol { transform-box: fill-box; transform-origin: center; animation: respira 7s ease-in-out infinite alternate; }
@keyframes respira { to { transform: scale(1.035); } }
.nube { animation: nube 38s ease-in-out infinite alternate; }
.nube.n2 { animation-duration: 52s; animation-direction: alternate-reverse; }
.nube.n3 { animation-duration: 30s; }
@keyframes nube { from { transform: translateX(-50px); } to { transform: translateX(50px); } }
.ave { animation: vuela 16s ease-in-out infinite; }
.ave.a2 { animation-duration: 19s; animation-delay: -4s; }
.ave.a3 { animation-duration: 22s; animation-delay: -9s; }
@keyframes vuela { 0% { transform: translate(0, 0); } 50% { transform: translate(-90px, -26px); } 100% { transform: translate(0, 0); } }
.reflejo rect { animation: brilla 2.4s ease-in-out infinite alternate; }
@keyframes brilla { from { opacity: .2; } to { opacity: .95; } }
.ola { animation: ola 10s linear infinite; }
.ola.o2 { animation-duration: 14s; animation-direction: reverse; }
@keyframes ola { to { transform: translateX(240px); } }
.espuma { animation: espuma 5s linear infinite; }
@keyframes espuma { to { stroke-dashoffset: -132; } }
.palma { transform-box: fill-box; transform-origin: 50% 100%; animation: palma 5s ease-in-out infinite alternate; }
.palma.p2 { animation-duration: 6.5s; animation-delay: -2s; }
.palma.p3 { animation-duration: 5.8s; animation-delay: -1s; }
@keyframes palma { from { transform: rotate(-1.6deg); } to { transform: rotate(1.6deg); } }
.quieto * { animation-play-state: paused !important; }

/* Buscador */
.buscador {
  margin: 28px auto 0; max-width: 1060px; padding: 14px; border-radius: 26px; text-align: left; color: var(--tinta);
  background: rgba(255, 255, 255, .97); box-shadow: 0 34px 90px -24px rgba(8, 6, 30, .7), 0 0 0 1px rgba(255, 255, 255, .5);
}
.bus-top { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; padding: 2px 4px 12px; }
.seg { display: inline-flex; padding: 4px; border-radius: 999px; background: #f1eef8; }
.seg label { position: relative; }
.seg input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.seg span { display: block; padding: 9px 20px; border-radius: 999px; font-weight: 700; font-size: 14.5px; color: #5d5a75; transition: background-color .2s, color .2s, box-shadow .2s; }
.seg input:checked + span { background: #fff; color: var(--tinta); box-shadow: 0 3px 10px rgba(20, 16, 50, .14); }
.seg input:focus-visible + span { outline: 3px solid var(--coral); outline-offset: 1px; }
.bus-precio { font-size: 14.5px; color: var(--gris); }
.bus-precio b { color: var(--coral); font: 800 20px var(--f-tit); }
.bus-grid { display: grid; grid-template-columns: 1fr auto 1fr 1fr auto; gap: 10px; align-items: stretch; }
.buscador.redondo .bus-grid { grid-template-columns: 1fr auto 1fr 1fr 1fr auto; }
.campo {
  display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 10px 14px; border-radius: 16px; cursor: pointer;
  background: #f6f4fa; box-shadow: inset 0 0 0 1.5px transparent; transition: box-shadow .2s, background-color .2s;
}
.campo:hover { background: #f0edf7; }
.campo:focus-within { background: #fff; box-shadow: inset 0 0 0 2px var(--coral); }
.campo-et { font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #807b96; }
.campo select, .campo input {
  width: 100%; min-height: 30px; padding: 2px 0 0; border: 0; outline: 0; background: transparent; color: var(--tinta);
  font: 700 17px var(--f-txt); -webkit-appearance: none; appearance: none; cursor: pointer;
}
.campo select { padding-right: 22px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23807b96' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right center / 16px no-repeat; }
.campo input::-webkit-calendar-picker-indicator { opacity: .55; cursor: pointer; }
.campo small { min-height: 18px; font-size: 12.5px; color: var(--gris); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cambiar {
  align-self: center; width: 44px; height: 44px; border-radius: 50%; border: 0; display: grid; place-items: center; cursor: pointer;
  background: #fff; color: var(--tinta); box-shadow: 0 0 0 1.5px var(--linea), 0 6px 14px -8px rgba(20, 16, 50, .4); transition: transform .35s ease;
}
.cambiar:hover { transform: rotate(180deg); }
.bus-ir { border-radius: 16px; padding: 0 26px; min-height: 64px; }
.bus-vacio { padding: 16px; font-size: 17px; text-align: center; }
.bus-vacio a { color: var(--coral); font-weight: 700; }
.proximas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 4px 2px; font-size: 13.5px; }
.proximas:empty { display: none; }
.proximas .pt { display: inline-flex; align-items: center; gap: 7px; margin-right: 2px; color: var(--gris); font-weight: 700; }
.chip-s {
  display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px; border-radius: 999px; text-decoration: none;
  background: #fff3ee; color: #b5361d; font-weight: 800; box-shadow: inset 0 0 0 1px #ffd9cc; transition: background-color .2s, transform .2s;
}
.chip-s:hover { background: #ffe5da; transform: translateY(-1px); }
.chip-s small { font-weight: 600; color: #8b5c50; font-size: 12.5px; }
.chip-s .mono { font-family: var(--f-mono); }

/* ---------- Cinta ---------- */
.cinta { overflow: hidden; padding: 15px 0; color: #fff; background: linear-gradient(90deg, var(--coral), var(--naranja)); }
.cinta-in { display: flex; width: max-content; animation: cinta 42s linear infinite; }
.cinta span { display: inline-flex; align-items: center; gap: 24px; padding-right: 24px; font: 700 18px var(--f-tit); white-space: nowrap; }
.cinta span::after { content: '✦'; opacity: .7; font-size: 14px; }
@keyframes cinta { to { transform: translateX(-50%); } }

/* ---------- Títulos de sección ---------- */
.seccion { padding: clamp(68px, 9vw, 120px) 0; }
.arena { background: var(--arena); }
.titulo-sec { max-width: 700px; margin: 0 auto 44px; text-align: center; }
.titulo-sec.izq { margin-left: 0; text-align: left; }
.kicker { display: inline-flex; align-items: center; gap: 8px; color: var(--coral); font-weight: 800; font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; }
.kicker .i { width: 16px; height: 16px; }
.seccion h2, .paq-txt h2, .app-txt h2 { margin: 10px 0 14px; color: var(--tinta); font: 800 clamp(32px, 4.8vw, 56px)/1.02 var(--f-tit); letter-spacing: -.03em; text-wrap: balance; }
.titulo-sec p { color: var(--gris); font-size: 17px; line-height: 1.55; text-wrap: pretty; }
.titulo-sec a { color: var(--coral); font-weight: 700; }
.claro h2 { color: #fff; }
.claro p { color: rgba(255, 255, 255, .75); }
.claro .kicker { color: var(--sol); }

/* ---------- Cifras ---------- */
.cifras { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding-top: 48px; }
.cifra { display: flex; flex-direction: column; gap: 8px; padding: 22px; border-radius: 22px; background: var(--papel); box-shadow: inset 0 0 0 1px var(--linea); }
.cifra b { color: var(--tinta); font: 800 clamp(30px, 4vw, 46px)/1 var(--f-tit); letter-spacing: -.03em; }
.cifra span { color: var(--gris); font-size: 14px; line-height: 1.35; }

/* ---------- Tablero de salidas ---------- */
.tablero {
  position: relative; overflow: hidden; max-width: 940px; margin: 0 auto; padding: clamp(16px, 3vw, 30px); border-radius: 30px; color: #fff;
  background: radial-gradient(600px 260px at 100% 0, rgba(123, 47, 115, .55), transparent 70%), #0e1330; box-shadow: var(--sombra);
}
.tab-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; }
.tab-tabs, .tab-dias, .dest-tabs { display: inline-flex; padding: 4px; border-radius: 999px; background: rgba(255, 255, 255, .08); }
.tab-tabs button, .tab-dias button, .dest-tabs button {
  padding: 9px 16px; border: 0; border-radius: 999px; background: transparent; color: rgba(255, 255, 255, .72);
  font-weight: 700; font-size: 14px; cursor: pointer; transition: background-color .2s, color .2s; white-space: nowrap;
}
.tab-tabs button.on, .tab-dias button.on, .dest-tabs button.on { background: #fff; color: #0e1330; }
.tab-ruta { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 10px 4px 22px; }
.tab-ruta b { display: block; font: 800 clamp(20px, 2.8vw, 30px)/1.1 var(--f-tit); letter-spacing: -.02em; }
.tab-ruta small { display: block; margin-top: 2px; color: rgba(255, 255, 255, .58); font-size: 13px; }
.tab-ruta .der { text-align: right; }
.tab-linea { position: relative; height: 2px; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .35) 0 8px, transparent 8px 14px); }
.tab-linea::before, .tab-linea::after { content: ''; position: absolute; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 50%; background: #0e1330; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .6); }
.tab-linea::before { left: -2px; }
.tab-linea::after { right: -2px; }
.tab-linea i { position: absolute; top: 50%; left: 0; width: 26px; height: 12px; margin-top: -7px; border-radius: 3px 7px 3px 3px; background: var(--sol); box-shadow: 0 0 16px rgba(255, 207, 122, .8); animation: recorre 5s ease-in-out infinite alternate; }
.tab-linea em { position: absolute; left: 50%; top: -26px; transform: translateX(-50%); padding: 0 8px; font-style: normal; font-size: 12.5px; color: rgba(255, 255, 255, .65); white-space: nowrap; }
@keyframes recorre { from { left: 0; } to { left: calc(100% - 26px); } }
.tab-filas { display: flex; flex-direction: column; gap: 7px; }
.tab-fila {
  display: grid; grid-template-columns: 1.1fr 1fr 1fr 1.2fr auto; align-items: center; gap: 12px; padding: 13px 16px; border-radius: 16px;
  background: rgba(255, 255, 255, .045); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); color: #fff; text-decoration: none;
  transition: background-color .2s, transform .2s, opacity .2s;
}
a.tab-fila:hover { background: rgba(255, 255, 255, .1); transform: translateX(3px); }
.tab-fila.cab { padding: 0 16px 2px; background: none; box-shadow: none; color: rgba(255, 255, 255, .45); font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.hora { justify-self: start; padding: 3px 9px; border-radius: 8px; font: 700 clamp(22px, 3vw, 30px)/1.1 var(--f-mono); color: var(--sol); letter-spacing: .02em; background: linear-gradient(180deg, #1b2250 50%, #151b42 50%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); }
.llega { font: 500 16px var(--f-mono); color: rgba(255, 255, 255, .78); white-space: nowrap; }
.llega::before { content: '→ '; color: rgba(255, 255, 255, .4); }
.tab-fila.cab .llega::before { content: none; }
.precio-f { font-weight: 700; }
.lugares { font-size: 14px; color: rgba(255, 255, 255, .82); }
.lugares.pocos { color: #ffb36b; font-weight: 700; }
.lugares.lleno { color: #ff8a8a; font-weight: 700; }
.estado { justify-self: end; padding: 8px 13px; border-radius: 999px; font-size: 13px; font-weight: 800; white-space: nowrap; color: #fff; background: linear-gradient(135deg, var(--coral), var(--naranja)); }
.tab-fila.cab .estado { background: none; }
.tab-fila.prox { background: rgba(255, 207, 122, .1); box-shadow: inset 0 0 0 1.5px rgba(255, 207, 122, .55); }
.tab-fila.paso, .tab-fila.cerrada { opacity: .4; pointer-events: none; }
.tab-fila.paso .estado, .tab-fila.cerrada .estado { background: rgba(255, 255, 255, .14); }
.tab-nota { display: flex; align-items: flex-start; gap: 8px; margin-top: 16px; color: rgba(255, 255, 255, .66); font-size: 14px; line-height: 1.5; }
.tab-nota .i { width: 18px; height: 18px; margin-top: 1px; }
.tab-nota b { color: #fff; }

/* ---------- Precios ---------- */
.boletos { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 24px; max-width: 880px; margin: 0 auto; }
.boleto {
  position: relative; display: flex; flex-direction: column; gap: 22px; padding: 28px; border-radius: 26px; background: #fff;
  box-shadow: 0 24px 50px -30px rgba(20, 16, 50, .45);
  -webkit-mask: radial-gradient(circle 15px at 0 160px, transparent 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle 15px at 100% 160px, transparent 97%, #000) right / 51% 100% no-repeat;
  mask: radial-gradient(circle 15px at 0 160px, transparent 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle 15px at 100% 160px, transparent 97%, #000) right / 51% 100% no-repeat;
  transition: transform .3s ease;
}
.boleto:hover { transform: translateY(-4px) rotate(-.4deg); }
.bo-izq { height: 132px; border-bottom: 2px dashed var(--linea); }
.bo-tipo { color: var(--coral); font-weight: 800; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; }
.bo-precio { margin: 4px 0 6px; color: var(--tinta); font: 800 64px/1 var(--f-tit); letter-spacing: -.04em; }
.bo-sub { color: var(--gris); font-size: 14.5px; }
.bo-lista { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.bo-lista li { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.bo-lista .i { color: var(--coral); }
.boleto .btn { margin-top: auto; }
.destacado { color: #fff; background: linear-gradient(160deg, #1a1446, #3a1d5e 55%, #7b2f73); }
.destacado .bo-precio { color: #fff; }
.destacado .bo-sub { color: rgba(255, 255, 255, .7); }
.destacado .bo-izq { border-color: rgba(255, 255, 255, .2); }
.destacado .bo-tipo, .destacado .bo-lista .i { color: var(--sol); }
.bo-ahorro { position: absolute; top: 24px; right: 24px; padding: 7px 13px; border-radius: 999px; background: var(--sol); color: #3a1d00; font-weight: 800; font-size: 13px; transform: rotate(4deg); }
.pagos { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 26px; margin-top: 34px; font-weight: 600; color: var(--texto); }
.pagos span { display: inline-flex; align-items: center; gap: 8px; }
.pagos .i { color: var(--turquesa); }

/* ---------- Pasos ---------- */
.pasos { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; max-width: 1080px; margin: 0 auto; padding: 0; list-style: none; }
.pasos::before { content: ''; position: absolute; top: 28px; left: 12%; right: 12%; border-top: 2px dashed #e6dccb; }
.pasos li { position: relative; padding: 0 8px; text-align: center; }
.paso-n {
  display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 18px; border-radius: 50%; color: #fff;
  font: 800 22px var(--f-tit); background: linear-gradient(135deg, var(--coral), var(--naranja));
  box-shadow: 0 0 0 8px var(--papel), 0 14px 26px -10px rgba(255, 90, 78, .7);
}
.pasos h3 { margin: 0 0 6px; color: var(--tinta); font: 800 21px/1.2 var(--f-tit); }
.pasos p { color: var(--gris); line-height: 1.5; }
.centro { margin-top: 44px; text-align: center; }

/* ---------- Bento ---------- */
.bento { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.b-tile {
  display: flex; flex-direction: column; gap: 10px; min-height: 220px; padding: 26px; border-radius: 26px; background: #fff;
  box-shadow: inset 0 0 0 1px var(--linea); color: inherit; text-decoration: none; transition: transform .3s ease, box-shadow .3s ease;
}
.b-tile:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 1px var(--linea), var(--sombra); }
.b-tile h3 { color: var(--tinta); font: 800 22px/1.15 var(--f-tit); letter-spacing: -.01em; }
.b-tile p { color: var(--gris); line-height: 1.5; }
.b-ico { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: auto; border-radius: 15px; background: #fff0ea; color: var(--coral); }
.b-ico .i { width: 25px; height: 25px; }
.b-grande { grid-column: span 2; justify-content: space-between; gap: 28px; color: #fff; box-shadow: none; background: linear-gradient(135deg, #0b3a5b, #0e5f7a 55%, #14b8c4); }
.b-grande h3 { max-width: 18ch; color: #fff; font-size: clamp(26px, 3.2vw, 36px); }
.b-grande p { max-width: 46ch; margin-top: 10px; color: rgba(255, 255, 255, .82); }
.mini-ruta { display: flex; align-items: center; gap: 14px; font-weight: 700; }
.mini-ruta i { position: relative; flex: 1; height: 2px; border-radius: 2px; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .5) 0 8px, transparent 8px 14px); }
.mini-ruta b { position: absolute; top: 50%; left: 0; width: 36px; height: 15px; margin-top: -9px; border-radius: 4px 9px 3px 3px; background: #fff; box-shadow: 0 0 18px rgba(255, 255, 255, .6); animation: recorre2 6s ease-in-out infinite alternate; }
@keyframes recorre2 { to { left: calc(100% - 36px); } }
.mini-asientos { display: grid; grid-template-columns: repeat(4, 22px); gap: 6px; margin-bottom: auto; }
.mini-asientos span { width: 22px; height: 22px; border-radius: 7px 7px 4px 4px; background: #effaf4; box-shadow: inset 0 0 0 2px #b9e3cf; }
.mini-asientos .x { background: #ebe8f2; box-shadow: inset 0 0 0 2px #d9d4e6; }
.mini-asientos .yo { background: var(--coral); box-shadow: none; animation: latido 1.6s ease-in-out infinite; }
@keyframes latido { 50% { transform: scale(1.18); } }
.b-oscuro { color: #fff; box-shadow: none; background: var(--noche); }
.b-oscuro h3 { color: #fff; }
.b-oscuro p { color: rgba(255, 255, 255, .7); }
.b-oscuro .b-ico { background: rgba(255, 255, 255, .1); color: var(--sol); }
.b-wa { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 18px; min-height: 0; background: #eafaf0; box-shadow: inset 0 0 0 1px #c8eed6; }
.b-wa .b-ico { flex: none; margin: 0; background: var(--wa); color: #fff; }
.b-wa p { margin-top: 4px; }
.b-ir { display: inline-flex; align-items: center; gap: 8px; flex: none; margin-left: auto; padding: 11px 18px; border-radius: 999px; background: var(--wa); color: #fff; font-weight: 700; font-size: 14.5px; }

/* ---------- Destino ---------- */
.noche { color: #fff; background: radial-gradient(1100px 520px at 85% -10%, rgba(123, 47, 115, .6), transparent 60%), radial-gradient(900px 500px at 0 110%, rgba(20, 184, 196, .22), transparent 60%), var(--noche); }
.dest-tabs { margin-top: 20px; }
.postales { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.postal {
  position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; min-height: 310px; overflow: hidden;
  border-radius: 26px; background: var(--cielo); box-shadow: 0 30px 60px -36px rgba(0, 0, 0, .8); transition: transform .35s ease;
}
.postal:hover { transform: translateY(-5px) rotate(-.5deg); }
.postal-arte { position: absolute; inset: 0; z-index: -1; }
.astro { position: absolute; left: var(--sx, 64%); top: var(--sy, 16%); width: var(--sr, 86px); height: var(--sr, 86px); border-radius: 50%; background: var(--astro); box-shadow: 0 0 70px 10px var(--astro); opacity: .95; }
.capa { position: absolute; left: 0; right: 0; bottom: 0; }
.mar .c1 { height: 56%; background: radial-gradient(30px 14px at 30px 0, transparent 97%, var(--c1) 100%) 0 0 / 60px 15px repeat-x, linear-gradient(var(--c1), var(--c1)) 0 14px / 100% 100% no-repeat; animation: marea 9s linear infinite; }
.mar .c2 { height: 38%; background: radial-gradient(40px 18px at 40px 0, transparent 97%, var(--c2) 100%) 0 0 / 80px 19px repeat-x, linear-gradient(var(--c2), var(--c2)) 0 18px / 100% 100% no-repeat; animation: marea 7s linear infinite reverse; }
@keyframes marea { to { background-position-x: 120px, 0; } }
.sierra .c1 { height: 62%; background: var(--c1); clip-path: polygon(0 58%, 14% 30%, 26% 46%, 44% 8%, 60% 38%, 76% 14%, 90% 36%, 100% 26%, 100% 100%, 0 100%); }
.sierra .c2 { height: 42%; background: var(--c2); clip-path: polygon(0 40%, 18% 62%, 36% 22%, 54% 50%, 72% 30%, 100% 58%, 100% 100%, 0 100%); }
.postal-txt { padding: 76px 22px 22px; background: linear-gradient(0deg, rgba(8, 10, 30, .82), rgba(8, 10, 30, .35) 60%, rgba(8, 10, 30, 0)); }
.postal-tag { display: inline-block; padding: 5px 10px; border-radius: 999px; background: rgba(255, 255, 255, .2); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); font-size: 11.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.postal h3 { margin: 10px 0 4px; font: 800 26px/1.1 var(--f-tit); letter-spacing: -.015em; }
.postal p { color: rgba(255, 255, 255, .88); font-size: 15px; line-height: 1.45; }
/* Paletas de cada postal */
.p-z { --cielo: linear-gradient(#4fb8e2, #bfeef5); --astro: #fff3c4; --c1: #0d8db0; --c2: #07607f; --sx: 70%; }
.p-c { --cielo: linear-gradient(#78d3e6, #e9fcff); --astro: #ffffff; --c1: #22c4b5; --c2: #0e9b98; --sx: 22%; --sr: 70px; }
.p-m { --cielo: linear-gradient(#060a24, #1d2c5e); --astro: #eaf1ff; --c1: #0f3c4f; --c2: #18c9c0; --sr: 54px; --sy: 12%; }
.p-b { --cielo: linear-gradient(#ff7a59, #ffc56e); --astro: #fff1b8; --c1: #c2456b; --c2: #7b2f73; --sy: 34%; --sx: 44%; --sr: 110px; }
.p-a { --cielo: linear-gradient(#3a1d5e, #e0586a); --astro: #ffd27a; --c1: #2a1547; --c2: #150c2c; --sx: 18%; --sr: 60px; }
.p-p { --cielo: linear-gradient(#ffb36b, #ff6a5a); --astro: #fff3c4; --c1: #6b2b6b; --c2: #2a1547; --sx: 56%; --sy: 30%; --sr: 100px; }
.p-sd { --cielo: linear-gradient(#78b5df, #eaf5fc); --astro: #fff6cc; --c1: #7aa37a; --c2: #4b7757; }
.p-ma { --cielo: linear-gradient(#f2b866, #fbe5b4); --astro: #fffbe6; --c1: #a3734a; --c2: #6b4a2f; --sx: 24%; }
.p-he { --cielo: linear-gradient(#58b2e6, #d2f1fd); --astro: #ffffff; --c1: #cfc7b1; --c2: #87b3a1; --sr: 70px; }
.p-mn { --cielo: linear-gradient(#ff8a3d, #ffd28c); --astro: #fff3c4; --c1: #b4442c; --c2: #6e2a1c; --sx: 30%; --sy: 24%; }
.p-tu { --cielo: linear-gradient(#9ed6a7, #f0fbea); --astro: #fffbe0; --c1: #3f8a4f; --c2: #23603a; --sx: 74%; }
.p-mz { --cielo: linear-gradient(#2b1b5f, #ff9b52); --astro: #ffd27a; --c1: #3c6e8f; --c2: #1d3a52; --sy: 36%; --sr: 96px; }

/* ---------- Terminales ---------- */
.terminales { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 24px; }
.terminal { display: flex; flex-direction: column; overflow: hidden; border-radius: 26px; background: #fff; box-shadow: inset 0 0 0 1px var(--linea), 0 24px 50px -36px rgba(20, 16, 50, .5); }
.mapa { aspect-ratio: 16 / 9; background: linear-gradient(135deg, #e7eef3, #f4f1ea); }
.mapa iframe { display: block; width: 100%; height: 100%; border: 0; }
.terminal-txt { display: flex; flex-direction: column; gap: 9px; padding: 22px 24px 24px; }
.t-zona { color: var(--coral); font-weight: 800; font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; }
.terminal h3 { color: var(--tinta); font: 800 26px/1.15 var(--f-tit); letter-spacing: -.015em; }
.t-dir, .t-salidas { display: flex; gap: 9px; line-height: 1.5; }
.t-dir .i, .t-salidas .i { width: 18px; height: 18px; margin-top: 3px; color: var(--gris); }
.t-salidas b { font-family: var(--f-mono); color: var(--tinta); }
.t-botones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }

/* ---------- Paquetería ---------- */
.paq { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 64px); align-items: center; }
.paq-arte { position: relative; height: 340px; overflow: hidden; border-radius: 30px; background: radial-gradient(260px 160px at 80% 10%, rgba(255, 255, 255, .55), transparent 70%), linear-gradient(160deg, #ffe7d6, #ffcdb4 60%, #ffb39a); }
.caja { position: absolute; display: grid; place-items: center; border-radius: 12px; background: #c98a4b; box-shadow: inset 0 -10px 0 rgba(0, 0, 0, .08), 0 22px 30px -14px rgba(90, 45, 10, .5); animation: flota 5s ease-in-out infinite; }
.caja .i { width: 58%; height: 58%; color: #f7dcba; stroke-width: 1.3; }
.c-a { width: 128px; height: 128px; left: 14%; bottom: 74px; }
.c-b { width: 96px; height: 96px; left: 47%; bottom: 128px; background: #d99c5d; animation-delay: -1.6s; }
.c-c { width: 74px; height: 74px; left: 70%; bottom: 70px; background: #b97a3f; animation-delay: -3.1s; }
@keyframes flota { 50% { transform: translateY(-12px) rotate(-2deg); } }
.paq-camino { position: absolute; left: 0; right: 0; bottom: 34px; height: 10px; background: rgba(120, 60, 30, .16); }
.paq-camino i { position: absolute; inset: 4px 0 auto; height: 2px; background: repeating-linear-gradient(90deg, rgba(120, 60, 30, .45) 0 14px, transparent 14px 28px); animation: carril 1.4s linear infinite; }
@keyframes carril { to { background-position-x: -28px; } }
.paq-urban { position: absolute; left: -130px; bottom: 30px; width: 112px; height: 60px; filter: drop-shadow(0 10px 12px rgba(90, 45, 10, .3)); animation: reparto 9s linear infinite; }
@keyframes reparto { to { transform: translateX(calc(min(100vw, 620px) + 260px)); } }
.paq-txt p { margin-bottom: 26px; color: var(--gris); font-size: 17px; line-height: 1.55; max-width: 46ch; }

/* ---------- App ---------- */
.app-sec { overflow: hidden; color: #fff; background: radial-gradient(700px 400px at 90% 100%, rgba(255, 138, 61, .35), transparent 70%), linear-gradient(135deg, #1f4fbf, #2b1b5f 70%); }
.app-in { display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; align-items: center; }
.app-txt h2 { color: #fff; }
.app-txt .kicker { color: var(--sol); }
.app-txt p { max-width: 46ch; margin-bottom: 26px; color: rgba(255, 255, 255, .82); font-size: 17px; line-height: 1.55; }
.telefono, .js .telefono.reveal.visto { transform: rotate(-6deg); }
.js .telefono.reveal { transform: translateY(22px) rotate(-6deg); }
.telefono { width: 270px; height: 540px; margin: 0 auto -170px; padding: 12px; border-radius: 46px; background: #0b0f22; box-shadow: 0 50px 90px -30px rgba(0, 0, 0, .7), inset 0 0 0 2px rgba(255, 255, 255, .08); }
.tel-pantalla { display: flex; flex-direction: column; gap: 16px; height: 100%; overflow: hidden; padding: 20px 16px; border-radius: 35px; background: linear-gradient(180deg, var(--noche) 0, var(--noche) 33%, #f4f2fa 33%); }
.tel-head { display: flex; align-items: center; gap: 10px; color: #fff; font: 800 15px var(--f-tit); }
.tel-logo { display: grid; place-items: center; width: 34px; height: 34px; overflow: hidden; border-radius: 10px; background: #fff; }
.tel-logo img { width: 100%; height: 100%; object-fit: contain; }
.tel-card { display: flex; flex-direction: column; gap: 4px; margin-top: 22px; padding: 16px; border-radius: 18px; background: #fff; color: var(--tinta); box-shadow: 0 12px 26px -14px rgba(20, 16, 50, .5); }
.tel-card small { color: var(--gris); font-weight: 600; }
.tel-card b { font: 800 19px var(--f-tit); }
.tel-card span { color: var(--coral); font-weight: 700; }
.tel-qr { align-self: center; width: 132px; height: 132px; padding: 12px; border-radius: 18px; background: #fff; box-shadow: 0 12px 26px -14px rgba(20, 16, 50, .5); }
.tel-qr i { display: block; width: 100%; height: 100%; border-radius: 4px; background:
  linear-gradient(#151a2d, #151a2d) 0 0 / 30% 30% no-repeat, linear-gradient(#151a2d, #151a2d) 100% 0 / 30% 30% no-repeat, linear-gradient(#151a2d, #151a2d) 0 100% / 30% 30% no-repeat,
  repeating-conic-gradient(#151a2d 0 25%, #fff 0 50%) 0 0 / 14px 14px; }
.tel-btn { margin-top: auto; padding: 12px; border-radius: 999px; background: linear-gradient(135deg, var(--coral), var(--naranja)); color: #fff; font-weight: 700; font-size: 14px; text-align: center; }

/* ---------- Preguntas ---------- */
.faq-in { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(28px, 5vw, 64px); align-items: start; }
.faq details { border-bottom: 1px solid var(--linea); }
.faq summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 0; list-style: none; cursor: pointer; color: var(--tinta); font-weight: 700; font-size: 17px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #fff0ea; color: var(--coral); font-size: 22px; font-weight: 500; transition: transform .25s ease; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding: 0 44px 20px 0; color: var(--gris); line-height: 1.6; }

/* ---------- Llamado final ---------- */
.final { position: relative; overflow: hidden; isolation: isolate; padding: clamp(84px, 12vw, 140px) 0 clamp(110px, 13vw, 160px); color: #fff; text-align: center; background: linear-gradient(180deg, #2b1b5f, #7b2f73 45%, #e0586a 80%, #ff9b52); }
.final::before { content: ''; position: absolute; left: 50%; bottom: -200px; z-index: -1; width: 460px; height: 460px; margin-left: -230px; border-radius: 50%; background: radial-gradient(circle, #fff1c2, #ffb347 42%, rgba(255, 140, 80, 0) 70%); }
.final-olas { position: absolute; left: 0; right: 0; bottom: 0; z-index: -1; width: 100%; height: 120px; }
.final h2 { margin: 0 0 14px; font: 800 clamp(40px, 6.4vw, 78px)/1 var(--f-tit); letter-spacing: -.035em; text-wrap: balance; }
.final p { margin-bottom: 30px; color: rgba(255, 255, 255, .88); font-size: 18px; }
.final-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }

/* ---------- Pie ---------- */
.pie { padding: 64px 0 28px; background: #070a1f; color: rgba(255, 255, 255, .7); }
.pie-in { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 32px; }
.pie-marca { display: flex; align-items: flex-start; gap: 14px; }
.pie-marca b { display: block; color: #fff; font: 800 20px var(--f-tit); }
.pie-marca small { display: block; margin-top: 2px; font-size: 12.5px; }
.pie-marca p { max-width: 34ch; margin-top: 10px; font-size: 14px; line-height: 1.5; }
.brand-logo.grande { width: 58px; height: 58px; border-radius: 16px; }
.pie-col { display: flex; flex-direction: column; gap: 10px; }
.pie-col h4 { margin-bottom: 4px; color: #fff; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; }
.pie-col a { color: rgba(255, 255, 255, .7); text-decoration: none; font-size: 15px; }
.pie-col a:hover { color: #fff; }
.pie-bajo { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; margin-top: 44px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 13px; }
.pie-fb { display: inline-flex; align-items: center; gap: 4px; color: #fff; text-decoration: none; vertical-align: middle; }
.pie-fb .i { width: 16px; height: 16px; }

/* ---------- Flotantes ---------- */
.wa-flota {
  position: fixed; right: 22px; bottom: 22px; z-index: 40; display: flex; align-items: center; gap: 0; padding: 14px; border-radius: 999px;
  background: var(--wa); color: #fff; text-decoration: none; font-weight: 700; box-shadow: 0 16px 34px -12px rgba(31, 174, 91, .8); transition: gap .3s, padding .3s;
}
.wa-flota .i { width: 26px; height: 26px; }
.wa-flota span { max-width: 0; overflow: hidden; white-space: nowrap; transition: max-width .35s ease; }
.wa-flota:hover { gap: 10px; padding-right: 20px; }
.wa-flota:hover span { max-width: 200px; }
.barra-movil { position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 40; display: none; gap: 10px; transform: translateY(160%); transition: transform .35s ease; }
.barra-movil.visible { transform: none; }
.barra-movil .btn-cta { min-height: 54px; font-size: 16px; }
.barra-wa { display: grid; place-items: center; flex: none; width: 54px; height: 54px; border-radius: 50%; background: var(--wa); color: #fff; box-shadow: 0 14px 30px -12px rgba(31, 174, 91, .8); }
.barra-wa .i { width: 26px; height: 26px; }

/* ---------- Animación al hacer scroll ---------- */
.js .reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1); }
.js .reveal.visto { opacity: 1; transform: none; }

/* ==========================================================================
   Responsivo
   ========================================================================== */
@media (max-width: 1060px) {
  .nav-links { display: none; }
  .burger { display: grid; }
  .nav-actions { margin-left: auto; }
  .bus-grid, .buscador.redondo .bus-grid { grid-template-columns: 1fr 1fr; }
  .bus-grid .campo:nth-of-type(1), .bus-grid .campo:nth-of-type(2) { grid-column: 1 / -1; }
  .cambiar { grid-column: 1 / -1; justify-self: end; margin: -30px 18px -30px 0; position: relative; z-index: 2; transform: rotate(90deg); }
  .cambiar:hover { transform: rotate(270deg); }
  .bus-grid .campo:nth-of-type(3) { grid-column: 1 / -1; }
  .buscador.redondo .bus-grid .campo:nth-of-type(3) { grid-column: auto; }
  .bus-ir { grid-column: 1 / -1; min-height: 58px; }
  .bento { grid-template-columns: 1fr 1fr; }
  .postales { grid-template-columns: 1fr 1fr; }
  .pie-in { grid-template-columns: 1fr 1fr 1fr; }
  .pie-marca { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .brand-txt small { display: none; }
  .buscador { margin-top: 26px; padding: 12px; border-radius: 22px; }
  .bus-top { padding-bottom: 10px; }
  .seg span { padding: 8px 16px; }
  .cifras { grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 36px; }
  .cifra { padding: 18px; }
  .tab-cab { flex-direction: column; align-items: stretch; }
  .tab-tabs, .tab-dias { display: flex; }
  .tab-tabs button, .tab-dias button { flex: 1; }
  .tab-tabs .desde { display: none; }
  .tab-ruta { grid-template-columns: 1fr 56px 1fr; gap: 10px; }
  .tab-ruta b { font-size: 18px; }
  .lugares { white-space: nowrap; }
  .tab-fila { grid-template-columns: auto 1fr auto; grid-template-areas: 'hora llega estado' 'hora lugares estado'; column-gap: 14px; row-gap: 2px; padding: 12px; }
  .tab-fila.cab { display: none; }
  .tab-fila .hora { grid-area: hora; }
  .tab-fila .llega { grid-area: llega; font-size: 14px; }
  .tab-fila .lugares { grid-area: lugares; font-size: 13px; }
  .tab-fila .estado { grid-area: estado; }
  .tab-fila .oc { display: none; }
  .pasos { grid-template-columns: 1fr; gap: 26px; max-width: 460px; }
  .pasos::before { top: 28px; bottom: 28px; left: 27px; right: auto; border-top: 0; border-left: 2px dashed #e6dccb; }
  .pasos li { display: grid; grid-template-columns: 56px 1fr; column-gap: 18px; padding: 0; text-align: left; }
  .paso-n { grid-row: span 2; margin: 0; }
  .pasos h3 { align-self: end; }
  .bento { grid-template-columns: 1fr; }
  .b-grande { grid-column: auto; }
  .b-tile { min-height: 0; }
  .b-ico, .mini-asientos { margin-bottom: 8px; }
  .b-wa { flex-direction: column; align-items: flex-start; }
  .b-wa .b-ico { margin-bottom: 8px; }
  .b-ir { margin-left: 0; margin-top: 6px; }
  .postales { display: flex; gap: 14px; margin: 0 -20px; padding: 0 20px 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .postales::-webkit-scrollbar { display: none; }
  .postal { flex: 0 0 80%; min-height: 330px; scroll-snap-align: center; }
  .terminales { grid-template-columns: 1fr; }
  .paq, .app-in, .faq-in { grid-template-columns: 1fr; }
  .paq-arte { height: 240px; }
  .c-a { width: 96px; height: 96px; bottom: 60px; }
  .c-b { width: 76px; height: 76px; bottom: 100px; }
  .c-c { width: 58px; height: 58px; bottom: 56px; }
  .paq-urban { bottom: 26px; width: 90px; height: 48px; }
  .app-txt { text-align: center; }
  .app-txt p { margin-left: auto; margin-right: auto; }
  .telefono { width: 230px; height: 460px; margin-bottom: -190px; }
  .faq details p { padding-right: 0; }
  .wa-flota { display: none; }
  .barra-movil { display: flex; }
  .pie { padding-bottom: 100px; }
  .pie-in { grid-template-columns: 1fr 1fr; }
  .pie-col:last-child { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
  .eb-par { display: none; }
}

@media (max-width: 420px) {
  .nav-ghost, .nav-actions .btn-cta { display: none; }
  .brand-txt b { font-size: 15.5px; }
  .bus-precio { font-size: 13px; }
}

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