
#paquetes, .paquetes {
  --p-rojo: var(--rojo, #c8102e);
  --p-negro: #111;
  --p-tinta: var(--tinta, #2a0a10);
  --p-gap: 24px;
  --p-por-vista: 3;                      
  max-width: none; min-height: 0; margin: 0;
  padding: 96px 24px 104px;
  color: var(--p-tinta); font-family: inherit;
}
#paquetes *, #paquetes *::before, #paquetes *::after { box-sizing: border-box; }
#paquetes :focus-visible { outline: 3px solid var(--p-rojo); outline-offset: 2px; }
.paquetes__titulo {
  text-align: center; color: var(--p-rojo);
  font-size: clamp(2rem, 4vw, 2.75rem); line-height: 1.1; letter-spacing: -.02em;
  margin-bottom: 56px;
}
.paquetes__bloque { max-width: 1200px; margin: 0 auto 72px; }
.paquetes__bloque:last-child { margin-bottom: 0; }
.paquetes__subtitulo {
  text-align: center; font-size: clamp(1.4rem, 2.6vw, 1.9rem); margin-bottom: 28px;
}
.paquetes__subtitulo::after {
  content: ""; display: block; width: 56px; height: 4px; border-radius: 4px;
  background: var(--p-rojo); margin: 12px auto 0;
}
/* ---------- Carrusel (desplazamiento táctil + flechas) ---------- */
.paquetes__pista {
  list-style: none; margin: 0; padding: 8px 4px 24px;
  display: flex; gap: var(--p-gap);
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 4px;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.paquetes__pista::-webkit-scrollbar { display: none; }
.paquetes__tarjeta {
  flex: 0 0 calc((100% - (var(--p-por-vista) - 1) * var(--p-gap)) / var(--p-por-vista));
  scroll-snap-align: start;
  display: flex; flex-direction: column;
  background: #fff; border-radius: 24px;
  box-shadow: 0 14px 34px rgba(155, 13, 35, .12);
}
.paquetes__controles { display: flex; justify-content: center; gap: 16px; }
.paquetes__flecha {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%; border: 0; cursor: pointer;
  background: #fff; color: var(--p-rojo);
  box-shadow: 0 6px 16px rgba(155, 13, 35, .15);
  transition: background .25s, color .25s, opacity .25s;
}
.paquetes__flecha svg { width: 20px; height: 20px; }
.paquetes__flecha:hover:not(:disabled), .paquetes__flecha:focus-visible { background: var(--p-rojo); color: #fff; }
.paquetes__flecha:disabled { opacity: .35; cursor: default; }
/* ---------- Tarjeta de crucero ---------- */
.paquetes__tarjeta--crucero { padding: 14px; }
.paquetes__foto {
  aspect-ratio: 4 / 3; border-radius: 18px; overflow: hidden;
  background: linear-gradient(150deg, #9b0d23, #e63950);   /* se ve si falta la imagen */
}
.paquetes__foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.paquetes__cuerpo { display: flex; flex-direction: column; flex: 1; padding: 18px 8px 6px; }
.paquetes__nombre { font-size: 1.25rem; line-height: 1.2; margin-bottom: 8px; }
.paquetes__descripcion { font-size: .95rem; line-height: 1.55; opacity: .8; margin-bottom: 20px; }
.paquetes__boton {
  margin-top: auto; align-self: flex-start;            /* abajo a la izquierda */
  padding: 11px 24px; border-radius: 999px;
  background: var(--p-rojo); color: #fff; text-decoration: none;
  font: inherit; font-weight: 700; font-size: .95rem;
  transition: background .25s, transform .2s;
}
.paquetes__boton:hover, .paquetes__boton:focus-visible { background: var(--p-negro); color: #fff; }
.paquetes__boton:active { transform: scale(.97); }
/* ---------- Tarjeta de servicio ---------- */
.paquetes__tarjeta--servicio { padding: 32px 28px; }
.paquetes__tarjeta--servicio .paquetes__nombre { text-align: center; color: var(--p-rojo); font-size: 1.3rem; margin-bottom: 14px; }
.paquetes__texto { text-align: justify; hyphens: auto; line-height: 1.7; font-size: .98rem; }
/* ---------- Responsivo ---------- */
@media (max-width: 980px) { #paquetes, .paquetes { --p-por-vista: 2; } }
@media (max-width: 620px) {
  #paquetes, .paquetes { --p-por-vista: 1; --p-gap: 16px; padding: 64px 16px 72px; }
  .paquetes__bloque { margin-bottom: 56px; }
}
@media (prefers-reduced-motion: reduce) { .paquetes__flecha, .paquetes__boton { transition: none; } }