@charset "UTF-8";
/* =====================================================
   single-tours.css  ·  Plantilla pública de un Tour
   ===================================================== */

/* =====================================================
   VARIABLES DE MARCA
   ===================================================== */
body {
  --grafito:        #34383D;
  --grafito-oscuro: #26292D;
  --grafito-suave:  #5E636A;
  --naranja:        #F26B1D;
  --naranja-hover:  #FF8238;
  --fondo-claro:    #F5F4F2;
  --borde:          #E4E2DF;
  --blanco:         #FFFFFF;
  --texto-claro:    #F3F1EE;
  --texto-claro-suave: #B9BCC0;
  --radio:          20px;
  --ancho:          1200px;
  --pad-x: max(6vw, calc((100% - var(--ancho)) / 2));
  --pad-y: 96px;

  /* Si tu header es fijo (sticky), pon aquí su alto, ej: 80px */
  --alto-header: 0px;

  /* Pinta de naranja los iconos SVG cargados con <img> */
  --icono-naranja: brightness(0) saturate(100%) invert(43%) sepia(95%) saturate(1296%) hue-rotate(350deg) brightness(99%) contrast(93%);

  /* Textura de líneas del bloque grafito */
  --textura: repeating-linear-gradient(115deg, transparent 0 14px, rgba(255, 255, 255, .025) 14px 15px);
  --flecha: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 8h10M9 4l4 4-4 4' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Oculta visualmente (sigue existiendo para Google y lectores de pantalla) */
.tb-oculto {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* border-box en todo el tour (evita que paddings empujen el ancho) */
:is(#tour-hero, #tour-icons, .descripcion-precio-tour-ruta, #tour-cards, #tour-tabs,
    #tour-trip-code, #tour-related-tours, #tour-related-blogs, #tour-related, .tour-modal-overlay),
:is(#tour-hero, #tour-icons, .descripcion-precio-tour-ruta, #tour-cards, #tour-tabs,
    #tour-trip-code, #tour-related-tours, #tour-related-blogs, #tour-related, .tour-modal-overlay) *,
:is(#tour-hero, #tour-icons, .descripcion-precio-tour-ruta, #tour-cards, #tour-tabs,
    #tour-trip-code, #tour-related-tours, #tour-related-blogs, #tour-related, .tour-modal-overlay) *::before,
:is(#tour-hero, #tour-icons, .descripcion-precio-tour-ruta, #tour-cards, #tour-tabs,
    #tour-trip-code, #tour-related-tours, #tour-related-blogs, #tour-related, .tour-modal-overlay) *::after {
  box-sizing: border-box;
}

/* =====================================================
   TÍTULOS
   ===================================================== */
#tour-hero h1,
.descripcion-precio-tour-ruta h2,
.descripcion-precio-tour-ruta h3,
#tour-tabs h2, #tour-tabs h3,
#tour-related-tours h2,
#tour-related-blogs h2,
#tour-related h2 {
  font-weight: 400;          /* Bebas Neue solo tiene 400 */
  line-height: 1.05;
  letter-spacing: .5px;
  margin: 0 0 20px;
}

#tour-related-tours > h2::after,
#tour-related-blogs > h2::after,
#tour-related > h2::after {
  content: "";
  display: block;
  width: 56px;
  height: 4px;
  margin-top: 16px;
  border-radius: 2px;
  background: var(--naranja);
}

#tour-summary p,
#tour-tabs p,
#tour-related-tours p,
#tour-related-blogs p {
  font-weight: 400;
  line-height: 1.75;
}

/* =====================================================
   HERO
   ===================================================== */
#tour-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 78vh;
  padding: 0 var(--pad-x) 140px;
  overflow: hidden;
  isolation: isolate;
  background: var(--grafito-oscuro);
}
#tour-hero-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  z-index: -2;
}
#tour-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(0deg,
    rgba(38, 41, 45, .92) 0%,
    rgba(38, 41, 45, .5) 45%,
    rgba(38, 41, 45, .1) 100%);
}
#tour-hero h1 {
  position: relative;
  z-index: 1;
  max-width: 880px;
  margin: 0;
  padding-left: 24px;
  border-left: 4px solid var(--naranja);
  color: var(--blanco);
}

/* =====================================================
   ÍCONOS DE DATOS RÁPIDOS (flotan sobre el hero)
   ===================================================== */
#tour-icons {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 24px 32px;
  list-style: none;
  margin: -72px var(--pad-x) 0;
  padding: 30px 36px;
  border: 1px solid var(--borde);
  border-radius: 24px;
  background: var(--blanco);
  box-shadow: 0 24px 48px -28px rgba(38, 41, 45, .4);
}
#tour-icons .tour-icon-item {
  display: flex;
  align-items: center;
  gap: 14px;
}
#tour-icons .tour-icon-svg {
  width: 34px;
  height: 34px;
  flex-shrink: 0;
  filter: var(--icono-naranja);
}
#tour-icons .tour-icon-title {
  font-size: 13px;
  color: var(--grafito-suave);
}
#tour-icons .tour-icon-desc {
  font-size: 15px;
  font-weight: 600;
  color: var(--grafito);
}

/* =====================================================
   RUTA + RESUMEN + TARJETA DE PRECIO
   ===================================================== */
.descripcion-precio-tour-ruta {
  display: grid;
  grid-template-columns: 1fr 390px;
  gap: 72px;
  align-items: start;
  padding: var(--pad-y) var(--pad-x);
}

#tour-route {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 36px;
  padding: 18px 24px;
  border: 1px solid var(--borde);
  border-radius: 999px;
  background: var(--fondo-claro);
}
/* Punto naranja de ubicación */
#tour-route::before {
  content: "";
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--naranja);
  box-shadow: 0 0 0 5px rgba(242, 107, 29, .18);
}
#tour-route p {
  margin: 0;
  font-weight: 600;
  line-height: 1.5;
  color: var(--grafito);
}

#tour-summary { color: var(--grafito-suave); }
#tour-summary h2, #tour-summary h3 { color: var(--grafito); }
#tour-summary h2 { font-size: 40px; }
#tour-summary p { margin: 0 0 18px; }
#tour-summary strong, #tour-summary b { font-weight: 600; color: var(--grafito); }

/* ----- Tarjeta de precio ----- */
.tarjeta-precio {
  position: sticky;
  top: calc(var(--alto-header) + 24px);
  overflow: hidden;
  isolation: isolate;
  padding: 40px 34px 34px;
  border-radius: 28px;
  color: var(--texto-claro);
  background: var(--textura), var(--grafito);
}
.tarjeta-precio::before {
  content: "";
  position: absolute;
  top: -110px;
  right: -110px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: var(--naranja);
  z-index: -1;
}
.tarjeta-precio h2 {
  padding-right: 64px;
  font-size: 36px;
  color: var(--texto-claro);
}

#tour-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 8px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}
#tour-price-prefix,
#tour-price-suffix,
#tour-offer-final-prefix,
#tour-offer-final-suffix {
  font-size: 14px;
  color: var(--texto-claro-suave);
}
#tour-price-amount {
  font-size: 44px;
  font-weight: 700;
  line-height: 1;
  color: var(--blanco);
}
.tarjeta-precio:has(#tour-offer) #tour-price-amount {
  font-size: 20px;
  font-weight: 500;
  text-decoration: line-through;
  color: var(--texto-claro-suave);
}

#tour-offer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  margin-top: 12px;
}
#tour-offer-percentage-group {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 14px;
  border-radius: 999px;
  background: var(--naranja);
  color: var(--blanco);
  font-size: 13px;
  font-weight: 600;
}
#tour-offer-final-group {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 8px;
}
#tour-offer-final-price {
  font-size: 48px;
  font-weight: 700;
  line-height: 1;
  color: var(--naranja);
}

/* Dificultad / tamaño de grupo / duración: lista con check */
#tour-highlight-info-end {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 24px 0 28px;
}
#tour-highlight-info-end span {
  position: relative;
  display: block;
  padding-left: 28px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--texto-claro);
}
#tour-highlight-info-end span::before {
  content: "";
  position: absolute;
  left: 5px;
  top: .2em;
  width: 6px;
  height: 12px;
  border: solid var(--naranja);
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(45deg);
}

#tour-contact-cta {
  display: grid;
  gap: 12px;
}

/* Botón "Consulte ahora" */
.boton-reservar a,
.boton-reservar button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  padding: 10px 10px 10px 28px;
  border: none;
  border-radius: 999px;
  background: var(--naranja);
  color: var(--blanco);
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background .25s, color .25s;
}
.boton-reservar a::after,
.boton-reservar button::after {
  content: "";
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  margin-left: auto;
  border-radius: 50%;
  background: var(--grafito-oscuro) var(--flecha) center / 16px no-repeat;
  transition: transform .3s cubic-bezier(.2, .8, .2, 1);
}
.boton-reservar a:hover,
.boton-reservar button:hover {
  background: var(--texto-claro);
  color: var(--grafito-oscuro);
}
.boton-reservar a:hover::after,
.boton-reservar button:hover::after { transform: rotate(-45deg); }

/* ----- Botón de WeTravel (trae estilos propios: se fuerzan con !important) ----- */
#tour-wetravel { width: 100%; }
#tour-wetravel button,
#tour-wetravel a,
#tour-wetravel input[type="submit"],
#tour-wetravel input[type="button"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 14px 24px !important;
  border: 2px solid rgba(243, 241, 238, .5) !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--texto-claro) !important;
  font-family: "Montserrat", sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background .25s, border-color .25s, color .25s !important;
}
#tour-wetravel button:hover,
#tour-wetravel a:hover,
#tour-wetravel input[type="submit"]:hover,
#tour-wetravel input[type="button"]:hover {
  border-color: var(--texto-claro) !important;
  background: var(--texto-claro) !important;
  color: var(--grafito-oscuro) !important;
}
#tour-wetravel button:focus-visible,
#tour-wetravel a:focus-visible {
  outline: 3px solid var(--naranja-hover) !important;
  outline-offset: 3px !important;
}

.des-tour {
  margin: 22px 0 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--texto-claro-suave);
}

/* =====================================================
   TARJETAS: VIDEO / ITINERARIO / MAPA
   ===================================================== */
#tour-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  padding: var(--pad-y) var(--pad-x);
  background: var(--fondo-claro);
}
.tour-card {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  border-radius: 24px;
  background: var(--textura), var(--grafito);
}
.tour-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s cubic-bezier(.2, .8, .2, 1);
}
.tour-card:hover img { transform: scale(1.05); }
.tour-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(38, 41, 45, .75) 0%, rgba(38, 41, 45, 0) 60%);
  pointer-events: none;
}
.tour-card-label {
  position: absolute;
  left: 20px;
  bottom: 20px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 8px 8px 8px 22px;
  border: none;
  border-radius: 999px;
  background: var(--texto-claro);
  color: var(--grafito-oscuro);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background .25s, color .25s;
}
.tour-card-label::after {
  content: "";
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--naranja) var(--flecha) center / 14px no-repeat;
  transition: transform .3s cubic-bezier(.2, .8, .2, 1), background-color .25s;
}
.tour-card-label:hover { background: var(--naranja); color: var(--blanco); }
.tour-card-label:hover::after {
  background-color: var(--grafito-oscuro);
  transform: rotate(-45deg);
}
.tour-card-label:focus-visible {
  outline: 3px solid var(--naranja-hover);
  outline-offset: 3px;
}

/* =====================================================
   MODAL (video y mapa)
   ===================================================== */
.tour-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 72px 24px 24px;
  background: rgba(38, 41, 45, .9);
}
.tour-modal-overlay.is-open { display: flex; }
.tour-modal-inner {
  position: relative;
  width: min(1000px, 100%);
}
.tour-modal-content iframe,
.tour-modal-content video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 16px;
  background: #000;
}
.tour-modal-content img {
  display: block;
  max-width: 100%;
  max-height: 82vh;
  margin: 0 auto;
  border-radius: 12px;
  object-fit: contain;
}
.tour-modal-close {
  position: absolute;
  top: -56px;
  right: 0;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: var(--texto-claro);
  color: var(--grafito-oscuro);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  transition: background .25s, color .25s;
}
.tour-modal-close:hover { background: var(--naranja); color: var(--blanco); }

/* =====================================================
   PESTAÑAS
   ===================================================== */
#tour-tabs {
  padding: 24px var(--pad-x) 40px;
  scroll-margin-top: var(--alto-header);
}

#tour-tabs-nav {
  position: sticky;
  top: var(--alto-header);
  z-index: 50;
  display: flex;
  gap: 10px;
  margin-bottom: 56px;
  padding: 14px 0;
  overflow-x: auto;
  scrollbar-width: none;
  background: var(--blanco);
  border-bottom: 1px solid var(--borde);
  box-shadow: 0 0 0 100vmax var(--blanco);
  clip-path: inset(0 -100vmax);
}
#tour-tabs-nav::-webkit-scrollbar { display: none; }

#tour-tabs-nav > * {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  border: 1px solid var(--borde);
  border-radius: 999px;
  background: var(--blanco);
  color: var(--grafito);
  font-size: 15px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  transition: background .25s, border-color .25s, color .25s;
}
#tour-tabs-nav > *:hover {
  border-color: var(--naranja);
  color: var(--naranja);
}
#tour-tabs-nav > .is-active,
#tour-tabs-nav > .active,
#tour-tabs-nav > [aria-selected="true"] {
  background: var(--grafito);
  border-color: var(--grafito);
  color: var(--blanco);
}
#tour-tabs-nav > *:focus-visible {
  outline: 3px solid var(--naranja-hover);
  outline-offset: 2px;
}

/* ----- Barra con flechas (el JS envuelve el menú en .tour-tabs-barra) ----- */
.tour-tabs-barra {
  position: sticky;
  top: var(--alto-header);
  z-index: 50;
  margin-bottom: 56px;
  background: var(--blanco);
  border-bottom: 1px solid var(--borde);
  box-shadow: 0 0 0 100vmax var(--blanco);
  clip-path: inset(0 -100vmax);
}
.tour-tabs-barra #tour-tabs-nav {
  position: static;
  margin: 0;
  border: 0;
  box-shadow: none;
  clip-path: none;
  background: transparent;
  cursor: grab;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}
.tour-tabs-barra.arrastrando #tour-tabs-nav {
  cursor: grabbing;
  scroll-behavior: auto;
  user-select: none;
}
.tour-tabs-barra.arrastrando #tour-tabs-nav > * { pointer-events: none; }

/* Degradados que avisan que hay más pestañas */
.tour-tabs-barra::before,
.tour-tabs-barra::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 1;
  width: 72px;
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s;
}
.tour-tabs-barra::before { left: 0;  background: linear-gradient(90deg, var(--blanco) 35%, rgba(255, 255, 255, 0)); }
.tour-tabs-barra::after  { right: 0; background: linear-gradient(-90deg, var(--blanco) 35%, rgba(255, 255, 255, 0)); }
.tour-tabs-barra.hay-izq::before,
.tour-tabs-barra.hay-der::after { opacity: 1; }

/* Flechas */
.tour-tabs-flecha {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: none;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin-top: -19px;
  padding: 0;
  border: 1px solid var(--borde);
  border-radius: 50%;
  background: var(--blanco);
  color: var(--grafito);
  cursor: pointer;
  transition: background .25s, border-color .25s, color .25s;
}
.tour-tabs-flecha svg { width: 16px; height: 16px; }
.tour-tabs-flecha:hover {
  background: var(--naranja);
  border-color: var(--naranja);
  color: var(--blanco);
}
.tour-tabs-flecha:focus-visible {
  outline: 3px solid var(--naranja-hover);
  outline-offset: 2px;
}
.tour-tabs-flecha--izq { left: 0; }
.tour-tabs-flecha--der { right: 0; }
.tour-tabs-barra.hay-izq .tour-tabs-flecha--izq,
.tour-tabs-barra.hay-der .tour-tabs-flecha--der { display: inline-flex; }

/* Icono dentro de cada pestaña (siempre naranja) */
.tour-tab-icono {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  color: var(--naranja);
  font-size: 18px;
  line-height: 1;
}
.tour-tab-icono svg,
.tour-tab-icono img {
  display: block;
  width: 100%;
  height: 100%;
}
.tour-tab-icono svg:not([fill]) { fill: currentColor; }
.tour-tab-icono svg [fill]:not([fill="none"]),
.tour-tab-icono svg[fill]:not([fill="none"]) { fill: currentColor; }
.tour-tab-icono svg [stroke]:not([stroke="none"]),
.tour-tab-icono svg[stroke]:not([stroke="none"]) { stroke: currentColor; }
.tour-tab-icono img { filter: var(--icono-naranja); }

/* Paneles */
#tour-tabs-panels > section[hidden] { display: none; }
#tour-tabs.tabs-listos #tour-tabs-panels > section:not([hidden]) {
  animation: tbAparecer .35s ease both;
}
@keyframes tbAparecer {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
#tour-tabs-panels > section { margin-bottom: 56px; }
#tour-tabs.tabs-listos #tour-tabs-panels > section { margin-bottom: 0; }
#tour-tabs-panels > section:focus { outline: none; }

#tour-tabs h3 {
  margin: 0 0 20px;
  font-size: 32px;
  color: var(--grafito);
}
#tour-tabs p { color: var(--grafito-suave); }

/* =====================================================
   DESCRIPCIÓN GENERAL
   ===================================================== */
#tour-highlights-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 48px;
  list-style: none;
  margin: 0;
  padding: 0;
}
#tour-highlights-list li {
  position: relative;
  padding-left: 32px;
  line-height: 1.6;
  color: var(--grafito);
}
#tour-highlights-list li::before {
  content: "";
  position: absolute;
  left: 5px;
  top: .2em;
  width: 7px;
  height: 13px;
  border: solid var(--naranja);
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(45deg);
}
#tour-highlights-images {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin-top: 40px;
}
#tour-highlights-images img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 18px;
}

/* Resumen del itinerario: línea de tiempo numerada */
#tour-itin-summary {
  margin-top: 64px;
  padding: 44px;
  border-radius: 28px;
  background: var(--fondo-claro);
}
#tour-itin-summary ul {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: paso;
}
#tour-itin-summary li {
  position: relative;
  padding: 0 0 28px 60px;
  counter-increment: paso;
}
#tour-itin-summary li::before {
  content: counter(paso);
  position: absolute;
  left: 0;
  top: 0;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 2px solid var(--naranja);
  border-radius: 50%;
  background: var(--blanco);
  color: var(--naranja);
  font-weight: 700;
  font-size: 15px;
}
#tour-itin-summary li::after {
  content: "";
  position: absolute;
  left: 18px;
  top: 42px;
  bottom: 4px;
  width: 2px;
  background: var(--borde);
}
#tour-itin-summary li:last-child { padding-bottom: 0; }
#tour-itin-summary li:last-child::after { display: none; }
.tour-itin-summary-title {
  padding-top: 7px;
  margin-bottom: 4px;
  font-weight: 600;
  color: var(--grafito);
}
.tour-itin-summary-desc {
  line-height: 1.7;
  color: var(--grafito-suave);
}

/* =====================================================
   ITINERARIO (día por día)
   ===================================================== */
.tour-itinerary-day {
  margin-bottom: 24px;
  padding: 40px;
  border: 1px solid var(--borde);
  border-radius: 28px;
  background: var(--blanco);
}
#tour-tabs .tour-itinerary-day-label {
  margin: 0 0 14px;
  font-size: 34px;
  color: var(--naranja);
}
#tour-tabs .tour-itinerary-day-text {
  font-weight: 500;
  color: var(--grafito);
}
.tour-itinerary-day-images {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin: 24px 0;
}
.tour-itinerary-day-images img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 16px;
}

/* Datos del día: comidas, alojamiento, dificultad, distancia, tiempo… */
.tour-itinerary-day-icons {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 20px 24px;
  list-style: none;
  margin: 28px 0 0;
  padding: 24px 28px;
  border: 1px solid var(--borde);
  border-radius: 20px;
  background: var(--fondo-claro);
}
.tour-itinerary-day-icons .tour-icon-item {
  display: grid;
  grid-template-columns: 30px 1fr;
  align-items: center;
  gap: 12px;
}
.tour-itinerary-day-icons .tour-icon-svg {
  width: 30px;
  height: 30px;
  filter: var(--icono-naranja);
}
.tour-itinerary-day-icons .tour-icon-title {
  font-size: 12px;
  line-height: 1.3;
  color: var(--grafito-suave);
}
.tour-itinerary-day-icons .tour-icon-desc {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--grafito);
}

/* =====================================================
   CONTENIDO DEL EDITOR
   (resumen, detalle del día, inclusiones, antes de viajar,
    precios y respuestas de preguntas frecuentes)
   ===================================================== */
#tour-summary,
#tour-tabs .tour-rich-text,
#tour-tabs .tour-itinerary-day-detail,
#tour-tabs .tour-faq-answer {
  min-width: 0;
  color: var(--grafito-suave);
  line-height: 1.75;
  overflow-wrap: break-word;
}
#tour-summary > *:first-child,
#tour-tabs .tour-rich-text > *:first-child,
#tour-tabs .tour-itinerary-day-detail > *:first-child,
#tour-tabs .tour-faq-answer > *:first-child { margin-top: 0; }
#tour-summary > *:last-child,
#tour-tabs .tour-rich-text > *:last-child,
#tour-tabs .tour-itinerary-day-detail > *:last-child,
#tour-tabs .tour-faq-answer > *:last-child { margin-bottom: 0; }

/* Párrafos con separación */
#tour-summary p,
#tour-tabs .tour-rich-text p,
#tour-tabs .tour-itinerary-day-detail p,
#tour-tabs .tour-faq-answer p {
  max-width: none;
  margin: 0 0 18px;
  line-height: 1.75;
}

/* Enlaces */
#tour-summary a,
#tour-tabs .tour-rich-text a,
#tour-tabs .tour-itinerary-day-detail a,
#tour-tabs .tour-faq-answer a {
  color: var(--naranja);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
  transition: color .2s;
}
#tour-summary a:hover,
#tour-tabs .tour-rich-text a:hover,
#tour-tabs .tour-itinerary-day-detail a:hover,
#tour-tabs .tour-faq-answer a:hover { color: var(--grafito); }

#tour-summary strong,
#tour-tabs .tour-rich-text strong,
#tour-tabs .tour-itinerary-day-detail strong,
#tour-tabs .tour-faq-answer strong,
#tour-summary b,
#tour-tabs .tour-rich-text b,
#tour-tabs .tour-itinerary-day-detail b,
#tour-tabs .tour-faq-answer b { font-weight: 600; color: var(--grafito); }

/* Subtítulos dentro del texto */
#tour-summary h2,
#tour-tabs .tour-rich-text h2,
#tour-tabs .tour-itinerary-day-detail h2,
#tour-tabs .tour-faq-answer h2,
#tour-summary h3,
#tour-tabs .tour-rich-text h3,
#tour-tabs .tour-itinerary-day-detail h3,
#tour-tabs .tour-faq-answer h3,
#tour-summary h4,
#tour-tabs .tour-rich-text h4,
#tour-tabs .tour-itinerary-day-detail h4,
#tour-tabs .tour-faq-answer h4 {
  margin: 32px 0 14px;
  font-weight: 400;
  line-height: 1.1;
  color: var(--grafito);
}
#tour-summary h4,
#tour-tabs .tour-rich-text h4,
#tour-tabs .tour-itinerary-day-detail h4,
#tour-tabs .tour-faq-answer h4 { font-size: 20px; }

/* Listas con viñeta naranja */
#tour-summary ul,
#tour-tabs .tour-rich-text ul,
#tour-tabs .tour-itinerary-day-detail ul,
#tour-tabs .tour-faq-answer ul {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
}
#tour-summary ul li,
#tour-tabs .tour-rich-text ul li,
#tour-tabs .tour-itinerary-day-detail ul li,
#tour-tabs .tour-faq-answer ul li {
  position: relative;
  margin-bottom: 10px;
  padding-left: 26px;
}
#tour-summary ul li::before,
#tour-tabs .tour-rich-text ul li::before,
#tour-tabs .tour-itinerary-day-detail ul li::before,
#tour-tabs .tour-faq-answer ul li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: .7em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--naranja);
}
#tour-summary ol,
#tour-tabs .tour-rich-text ol,
#tour-tabs .tour-itinerary-day-detail ol,
#tour-tabs .tour-faq-answer ol {
  margin: 0 0 20px;
  padding-left: 24px;
}
#tour-summary ol li,
#tour-tabs .tour-rich-text ol li,
#tour-tabs .tour-itinerary-day-detail ol li,
#tour-tabs .tour-faq-answer ol li { margin-bottom: 10px; padding-left: 4px; }
#tour-summary ol li::marker,
#tour-tabs .tour-rich-text ol li::marker,
#tour-tabs .tour-itinerary-day-detail ol li::marker,
#tour-tabs .tour-faq-answer ol li::marker { color: var(--naranja); font-weight: 700; }
#tour-summary li > ul,
#tour-tabs .tour-rich-text li > ul,
#tour-tabs .tour-itinerary-day-detail li > ul,
#tour-tabs .tour-faq-answer li > ul,
#tour-summary li > ol,
#tour-tabs .tour-rich-text li > ol,
#tour-tabs .tour-itinerary-day-detail li > ol,
#tour-tabs .tour-faq-answer li > ol { margin: 10px 0 0; }

/* Medios, citas y separadores */
#tour-summary img,
#tour-tabs .tour-rich-text img,
#tour-tabs .tour-itinerary-day-detail img,
#tour-tabs .tour-faq-answer img,
#tour-summary iframe,
#tour-tabs .tour-rich-text iframe,
#tour-tabs .tour-itinerary-day-detail iframe,
#tour-tabs .tour-faq-answer iframe,
#tour-summary video,
#tour-tabs .tour-rich-text video,
#tour-tabs .tour-itinerary-day-detail video,
#tour-tabs .tour-faq-answer video {
  max-width: 100%;
  height: auto;
  border-radius: 14px;
}
#tour-summary blockquote,
#tour-tabs .tour-rich-text blockquote,
#tour-tabs .tour-itinerary-day-detail blockquote,
#tour-tabs .tour-faq-answer blockquote {
  margin: 24px 0;
  padding: 20px 24px;
  border: 1px solid var(--borde);
  border-radius: 16px;
  background: var(--fondo-claro);
  color: var(--grafito);
}
#tour-summary hr,
#tour-tabs .tour-rich-text hr,
#tour-tabs .tour-itinerary-day-detail hr,
#tour-tabs .tour-faq-answer hr {
  height: 1px;
  margin: 28px 0;
  border: 0;
  background: var(--borde);
}

/* Tablas (muy usadas en Precios) */
#tour-summary table,
#tour-tabs .tour-rich-text table,
#tour-tabs .tour-itinerary-day-detail table,
#tour-tabs .tour-faq-answer table {
  width: 100%;
  margin: 0 0 24px;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--borde);
  border-radius: 16px;
  overflow: hidden;
}
#tour-summary th,
#tour-tabs .tour-rich-text th,
#tour-tabs .tour-itinerary-day-detail th,
#tour-tabs .tour-faq-answer th {
  padding: 16px 20px;
  background: var(--grafito);
  color: var(--blanco);
  font-weight: 600;
  text-align: left;
}
#tour-summary td,
#tour-tabs .tour-rich-text td,
#tour-tabs .tour-itinerary-day-detail td,
#tour-tabs .tour-faq-answer td {
  padding: 16px 20px;
  border-top: 1px solid var(--borde);
  color: var(--grafito);
}
#tour-summary tr:nth-child(even) td,
#tour-tabs .tour-rich-text tr:nth-child(even) td,
#tour-tabs .tour-itinerary-day-detail tr:nth-child(even) td,
#tour-tabs .tour-faq-answer tr:nth-child(even) td { background: var(--fondo-claro); }

/* Inclusiones: una sola columna.
   Primer cuadro = lo que incluye (check naranja)
   Segundo cuadro = lo que no incluye (× gris) */
#tour-inclusions {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
#tour-inclusions > h2,
#tour-inclusions > :not(.tour-rich-text) { margin-bottom: 0; }

#tour-inclusions .tour-rich-text {
  padding: 36px 40px;
  border-radius: 28px;
}

/* ----- Incluye ----- */
#tour-inclusions .tour-rich-text:not(.tour-rich-text-2) {
  border: 1px solid rgba(242, 107, 29, .45);
  background: var(--blanco);
}
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) ul li {
  padding-left: 32px;
  color: var(--grafito);
}
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) ul li::before {
  left: 5px;
  top: .2em;
  width: 7px;
  height: 13px;
  border: solid var(--naranja);
  border-width: 0 2.5px 2.5px 0;
  border-radius: 0;
  background: none;
  transform: rotate(45deg);
}

/* ----- No incluye ----- */
#tour-inclusions .tour-rich-text-2 {
  border: 1px solid var(--borde);
  background: var(--fondo-claro);
}
#tour-tabs #tour-inclusions .tour-rich-text-2 ul li {
  padding-left: 32px;
  color: var(--grafito-suave);
}
#tour-tabs #tour-inclusions .tour-rich-text-2 ul li::before {
  left: 2px;
  top: .35em;
  width: 14px;
  height: 14px;
  border-radius: 0;
  background:
    linear-gradient(var(--grafito-suave), var(--grafito-suave)) center / 100% 2px no-repeat,
    linear-gradient(var(--grafito-suave), var(--grafito-suave)) center / 2px 100% no-repeat;
  transform: rotate(45deg);
  opacity: .7;
}
#tour-tabs #tour-inclusions .tour-rich-text-2 strong,
#tour-tabs #tour-inclusions .tour-rich-text-2 b { color: var(--grafito-suave); }

/* Antes de viajar */
#tour-before-you-go .tour-rich-text {
  padding: 44px;
  border-radius: 28px;
  background: var(--fondo-claro);
}

/* =====================================================
   EVITA QUE EL CONTENIDO SE SALGA DE LA PANTALLA
   (neutraliza estilos heredados del plugin)
   ===================================================== */
#tour-tabs-panels,
#tour-tabs-panels > section,
#tour-tabs #tour-itin-summary,
#tour-tabs #tour-faq-list,
#tour-tabs .tour-faq-item {
  min-width: 0 !important;
  max-width: 100% !important;
}
#tour-tabs #tour-itin-summary ul {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
}
#tour-tabs #tour-itin-summary li {
  display: block !important;
  float: none !important;
  width: auto !important;
  max-width: 100% !important;
}
#tour-tabs .tour-itin-summary-title,
#tour-tabs .tour-itin-summary-desc,
#tour-tabs .tour-faq-question h3,
#tour-tabs .tour-faq-answer,
#tour-tabs .tour-faq-answer p,
#tour-tabs .tour-faq-answer li {
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
}
#tour-tabs #tour-faq-list { grid-template-columns: minmax(0, 1fr); }
#tour-tabs .tour-faq-question { min-width: 0; }
#tour-tabs .tour-faq-question h3 { min-width: 0; flex: 1 1 auto; }
#tour-tabs .tour-faq-answer {
  position: static !important;
  width: auto !important;
  max-width: 100% !important;
  transform: none !important;
}

/* =====================================================
   LISTA DE EQUIPAJE
   ===================================================== */
.tour-packing-category { margin-bottom: 48px; }
.tour-packing-items {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 16px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.tour-packing-item {
  padding: 18px 16px;
  border: 1px solid var(--borde);
  border-radius: 20px;
  background: var(--blanco);
  text-align: center;
  transition: border-color .25s;
}
.tour-packing-item:hover { border-color: var(--naranja); }
.tour-packing-item-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
}
.tour-packing-item-name {
  margin-top: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--grafito);
}

/* =====================================================
   PREGUNTAS FRECUENTES
   ===================================================== */
#tour-faq-list {
  display: grid;
  gap: 12px;
}
.tour-faq-item {
  border: 1px solid var(--borde);
  border-radius: 20px;
  background: var(--blanco);
  transition: border-color .25s, background .25s;
}
.tour-faq-item:hover { border-color: var(--naranja); }
.tour-faq-item[open] {
  border-color: var(--naranja);
  background: var(--fondo-claro);
}
.tour-faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 26px;
  list-style: none;
  cursor: pointer;
}
.tour-faq-question::-webkit-details-marker { display: none; }
#tour-tabs .tour-faq-question h3 {
  margin: 0;
  font-size: 24px;
}
.tour-faq-question::after {
  content: "+";
  flex-shrink: 0;
  font-size: 30px;
  font-weight: 400;
  line-height: 1;
  color: var(--naranja);
  transition: transform .3s;
}
.tour-faq-item[open] .tour-faq-question::after { transform: rotate(45deg); }
.tour-faq-answer { padding: 0 26px 24px; }
.tour-faq-answer p { margin: 0 0 12px; }

/* =====================================================
   CÓDIGO DEL TOUR
   ===================================================== */
#tour-trip-code {
  display: flex;
  justify-content: flex-end;
  padding: 0 var(--pad-x) 56px;
  font-size: 13px;
  color: var(--grafito-suave);
}
#tour-trip-code::before {
  content: "Código del tour:";
  margin-right: 6px;
}

/* =====================================================
   RELACIONADOS
   ===================================================== */
#tour-related-tours,
#tour-related-blogs,
#tour-related { padding: var(--pad-y) var(--pad-x); }

/* Tours relacionados: bloque grafito */
#tour-related-tours {
  background: var(--textura), var(--grafito);
  color: var(--texto-claro);
}
#tour-related-tours h2 { color: var(--texto-claro); }
#tour-related-tours-desc { color: var(--texto-claro-suave) !important; }

#tour-related-blogs { background: var(--blanco); }
#tour-related       { background: var(--fondo-claro); }

#tour-related-tours-desc,
#tour-related-blogs-desc {
  max-width: 70ch;
  margin: 0 0 44px;
  color: var(--grafito-suave);
}

.tour-related-full-card-list,
.related-card-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.tour-related-full-card-list > *,
.related-card-list > * {
  overflow: hidden;
  border: 1px solid var(--borde);
  border-radius: 24px;
  background: var(--blanco);
  color: var(--grafito);
  transition: border-color .25s;
}
#tour-related-tours .tour-related-full-card-list > * { border-color: transparent; }
.tour-related-full-card-list > *:hover,
.related-card-list > *:hover { border-color: var(--naranja); }
.tour-related-full-card-list img,
.related-card-list img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

/* =====================================================
   DESCRIPCIÓN GENERAL: detalles de color
   ===================================================== */
#tour-highlights > h3::after,
#tour-itin-summary > h3::after {
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin-top: 12px;
  border-radius: 2px;
  background: var(--naranja);
}

/* Resumen del itinerario en bloque grafito */
#tour-tabs #tour-itin-summary {
  background: var(--textura), var(--grafito);
  color: var(--texto-claro);
}
#tour-tabs #tour-itin-summary > h3 { color: var(--texto-claro); }
#tour-itin-summary li::before {
  border-color: var(--naranja);
  background: var(--naranja);
  color: var(--blanco);
}
#tour-itin-summary li::after { background: rgba(255, 255, 255, .15); }
#tour-tabs .tour-itin-summary-title { color: var(--blanco); }
#tour-tabs .tour-itin-summary-desc  { color: var(--texto-claro-suave); }

/* =====================================================
   PESTAÑAS: mismo estilo que Descripción general
   - Títulos h3 en grafito con rayita naranja
   - Cajas con fondo gris claro de marca (nada tan blanco)
   - Iconos y detalles en naranja
   ===================================================== */

/* Títulos h3 con rayita naranja */
#tour-tabs .tour-itinerary-day-label,
#tour-tabs .tour-packing-category-title {
  font-size: 30px;
  color: var(--grafito);
}
#tour-tabs .tour-itinerary-day-label::after,
#tour-tabs .tour-packing-category-title::after {
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin-top: 12px;
  border-radius: 2px;
  background: var(--naranja);
}

/* Itinerario: cada día en caja gris clara; los datos del día en blanco */
.tour-itinerary-day {
  border-color: var(--borde);
  background: var(--fondo-claro);
}
.tour-itinerary-day-icons { background: var(--blanco); }

/* Inclusiones: ambas cajas con fondo gris claro;
   la de "incluye" se distingue por su borde naranja y el check */
#tour-inclusions .tour-rich-text:not(.tour-rich-text-2) { background: var(--fondo-claro); }
#tour-inclusions .tour-rich-text-2 { background: var(--fondo-claro); }

/* Precios: misma caja que Antes de viajar */
#tour-pricing .tour-rich-text {
  padding: 44px;
  border-radius: 28px;
  background: var(--fondo-claro);
}
#tour-pricing .tour-rich-text td { background: var(--blanco); }
#tour-pricing .tour-rich-text tr:nth-child(even) td { background: var(--fondo-claro); }

/* Lista de equipaje: tarjetas grises claras */
.tour-packing-item { background: var(--fondo-claro); }

/* Preguntas frecuentes: cerradas en gris claro, abierta en blanco con borde naranja */
.tour-faq-item { background: var(--fondo-claro); }
.tour-faq-item[open] {
  border-color: var(--naranja);
  background: var(--blanco);
}

/* =====================================================
   PESTAÑAS CON COLORES SÓLIDOS DE MARCA
   Grafito  → texto blanco / gris claro, detalles naranja
   Naranja  → texto e iconos blancos
   ===================================================== */

/* ----- Cajas grafito ----- */
#tour-tabs .tour-itinerary-day,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2),
#tour-tabs #tour-before-you-go .tour-rich-text,
#tour-tabs #tour-pricing .tour-rich-text,
#tour-tabs .tour-faq-item {
  border-color: var(--grafito) !important;
  background: var(--grafito) !important;
  color: var(--texto-claro-suave);
}
#tour-tabs .tour-itinerary-day p,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) p,
#tour-tabs #tour-before-you-go .tour-rich-text p,
#tour-tabs #tour-pricing .tour-rich-text p,
#tour-tabs .tour-faq-item p,
#tour-tabs .tour-itinerary-day li,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) li,
#tour-tabs #tour-before-you-go .tour-rich-text li,
#tour-tabs #tour-pricing .tour-rich-text li,
#tour-tabs .tour-faq-item li {
  color: var(--texto-claro-suave);
}
#tour-tabs .tour-itinerary-day strong,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) strong,
#tour-tabs #tour-before-you-go .tour-rich-text strong,
#tour-tabs #tour-pricing .tour-rich-text strong,
#tour-tabs .tour-faq-item strong,
#tour-tabs .tour-itinerary-day b,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) b,
#tour-tabs #tour-before-you-go .tour-rich-text b,
#tour-tabs #tour-pricing .tour-rich-text b,
#tour-tabs .tour-faq-item b,
#tour-tabs .tour-itinerary-day h2,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) h2,
#tour-tabs #tour-before-you-go .tour-rich-text h2,
#tour-tabs #tour-pricing .tour-rich-text h2,
#tour-tabs .tour-faq-item h2,
#tour-tabs .tour-itinerary-day h3,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) h3,
#tour-tabs #tour-before-you-go .tour-rich-text h3,
#tour-tabs #tour-pricing .tour-rich-text h3,
#tour-tabs .tour-faq-item h3,
#tour-tabs .tour-itinerary-day h4,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) h4,
#tour-tabs #tour-before-you-go .tour-rich-text h4,
#tour-tabs #tour-pricing .tour-rich-text h4,
#tour-tabs .tour-faq-item h4 {
  color: var(--blanco);
}
#tour-tabs .tour-itinerary-day a,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) a,
#tour-tabs #tour-before-you-go .tour-rich-text a,
#tour-tabs #tour-pricing .tour-rich-text a,
#tour-tabs .tour-faq-item a { color: var(--naranja-hover); }
#tour-tabs .tour-itinerary-day a:hover,
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) a:hover,
#tour-tabs #tour-before-you-go .tour-rich-text a:hover,
#tour-tabs #tour-pricing .tour-rich-text a:hover,
#tour-tabs .tour-faq-item a:hover { color: var(--blanco); }

/* ----- Cajas naranja ----- */
#tour-tabs #tour-inclusions .tour-rich-text-2,
#tour-tabs .tour-itinerary-day-icons {
  border-color: var(--naranja) !important;
  background: var(--naranja) !important;
  color: var(--blanco);
}
#tour-tabs #tour-inclusions .tour-rich-text-2 p,
#tour-tabs .tour-itinerary-day-icons p,
#tour-tabs #tour-inclusions .tour-rich-text-2 li,
#tour-tabs .tour-itinerary-day-icons li,
#tour-tabs #tour-inclusions .tour-rich-text-2 strong,
#tour-tabs .tour-itinerary-day-icons strong,
#tour-tabs #tour-inclusions .tour-rich-text-2 b,
#tour-tabs .tour-itinerary-day-icons b,
#tour-tabs #tour-inclusions .tour-rich-text-2 h3,
#tour-tabs .tour-itinerary-day-icons h3,
#tour-tabs #tour-inclusions .tour-rich-text-2 h4,
#tour-tabs .tour-itinerary-day-icons h4 {
  color: var(--blanco) !important;
}
#tour-tabs #tour-inclusions .tour-rich-text-2 a,
#tour-tabs .tour-itinerary-day-icons a,
#tour-tabs #tour-inclusions .tour-rich-text-2 a:hover,
#tour-tabs .tour-itinerary-day-icons a:hover { color: var(--blanco); }

/* ----- Itinerario ----- */
#tour-tabs .tour-itinerary-day-label,
#tour-tabs .tour-itinerary-day-text { color: var(--blanco); }
#tour-tabs .tour-itinerary-day-icons .tour-icon-svg {
  filter: brightness(0) invert(1);          /* iconos en blanco */
}
#tour-tabs .tour-itinerary-day-icons .tour-icon-title { color: rgba(255, 255, 255, .85); }
#tour-tabs .tour-itinerary-day-icons .tour-icon-desc  { color: var(--blanco); }

/* ----- Inclusiones ----- */
/* Incluye (grafito): check naranja */
#tour-tabs #tour-inclusions .tour-rich-text:not(.tour-rich-text-2) ul li { color: var(--texto-claro); }
/* No incluye (naranja): × blanca */
#tour-tabs #tour-inclusions .tour-rich-text-2 ul li::before {
  background:
    linear-gradient(var(--blanco), var(--blanco)) center / 100% 2px no-repeat,
    linear-gradient(var(--blanco), var(--blanco)) center / 2px 100% no-repeat;
  opacity: 1;
}

/* ----- Antes de viajar y Precios ----- */
#tour-tabs #tour-before-you-go .tour-rich-text,
#tour-tabs #tour-pricing .tour-rich-text { border: 1px solid var(--grafito); }

/* Tabla dentro de la caja grafito: cabecera naranja, filas claras */
#tour-tabs #tour-pricing .tour-rich-text table { border-color: transparent; }
#tour-tabs #tour-pricing .tour-rich-text th {
  background: var(--naranja);
  border-bottom: 0;
  color: var(--blanco);
}
#tour-tabs #tour-pricing .tour-rich-text td {
  border-top-color: var(--borde);
  color: var(--grafito);
}
#tour-tabs #tour-pricing .tour-rich-text td strong,
#tour-tabs #tour-pricing .tour-rich-text td b { color: var(--grafito); }

/* ----- Lista de equipaje ----- */
#tour-tabs .tour-packing-item {
  border-color: var(--grafito);
  background: var(--grafito);
  transition: background .25s, border-color .25s;
}
#tour-tabs .tour-packing-item-image {
  padding: 10px;
  border-radius: 14px;
  background: var(--blanco);
}
#tour-tabs .tour-packing-item-name { color: var(--blanco); }
#tour-tabs .tour-packing-item:hover {
  border-color: var(--naranja);
  background: var(--naranja);
}

/* ----- Preguntas frecuentes ----- */
#tour-tabs .tour-faq-question h3 {
  color: var(--blanco);
  transition: color .25s;
}
#tour-tabs .tour-faq-item:hover .tour-faq-question h3 { color: var(--naranja-hover); }
#tour-tabs .tour-faq-item:hover,
#tour-tabs .tour-faq-item[open] { border-color: var(--naranja) !important; }
#tour-tabs .tour-faq-item[open] .tour-faq-question h3 { color: var(--naranja-hover); }

/* ----- Ajustes finales: equipaje e iconos del itinerario ----- */

/* Equipaje: la imagen cubre todo su espacio, sin fondo blanco */
#tour-tabs .tour-packing-item .tour-packing-item-image {
  padding: 0;
  overflow: hidden;
  border-radius: 14px;
  background: none;
}
#tour-tabs .tour-packing-item .tour-packing-item-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* Itinerario: datos del día sin caja, toman el grafito del día */
#tour-tabs .tour-itinerary-day .tour-itinerary-day-icons {
  padding: 0;
  border: 0 !important;
  background: transparent !important;
}
/* Cada dato encerrado en su propio borde */
#tour-tabs .tour-itinerary-day .tour-itinerary-day-icons .tour-icon-item {
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 14px;
  transition: border-color .25s;
}
#tour-tabs .tour-itinerary-day .tour-itinerary-day-icons .tour-icon-item:hover {
  border-color: var(--naranja);
}
#tour-tabs .tour-itinerary-day .tour-itinerary-day-icons .tour-icon-svg {
  filter: var(--icono-naranja);          /* iconos naranjas sobre grafito */
}
#tour-tabs .tour-itinerary-day .tour-itinerary-day-icons .tour-icon-title { color: var(--texto-claro-suave); }
#tour-tabs .tour-itinerary-day .tour-itinerary-day-icons .tour-icon-desc  { color: var(--blanco); }

/* ----- Itinerario en acordeón (lo arma el JS) ----- */
.tour-itinerary-day { scroll-margin-top: calc(var(--alto-header) + 96px); }
.tour-faq-item      { scroll-margin-top: calc(var(--alto-header) + 96px); }

.tour-itinerary-day-toggle {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  text-align: left;
  cursor: pointer;
}
/* + naranja que gira a × (igual que en preguntas frecuentes) */
.tour-itinerary-day-toggle::after {
  content: "+";
  flex-shrink: 0;
  font-family: "Montserrat", sans-serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1;
  color: var(--naranja);
  transition: transform .3s;
}
.tour-itinerary-day.is-open .tour-itinerary-day-toggle::after { transform: rotate(45deg); }
.tour-itinerary-day-toggle:hover { color: var(--naranja-hover); }
.tour-itinerary-day-toggle:focus-visible {
  outline: 3px solid var(--naranja-hover);
  outline-offset: 6px;
  border-radius: 6px;
}

/* Cerrado: sin espacio extra debajo del título */
#tour-tabs .tour-itinerary-day:not(.is-open) .tour-itinerary-day-label { margin-bottom: 0; }
#tour-tabs .tour-itinerary-day:hover { border-color: var(--naranja) !important; }

/* Apertura suave */
.tour-itinerary-day-cuerpo {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .35s ease;
}
.tour-itinerary-day.is-open .tour-itinerary-day-cuerpo { grid-template-rows: 1fr; }
.tour-itinerary-day-interior {
  min-height: 0;
  overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
  .tour-itinerary-day-cuerpo,
  .tour-itinerary-day-toggle::after { transition: none; }
}

/* ----- Quitar la barra naranja del hover en el título del día
         (venía del estilo general de botones del tema) ----- */
#tour-tabs .tour-itinerary-day .tour-itinerary-day-toggle,
#tour-tabs .tour-itinerary-day .tour-itinerary-day-toggle:hover,
#tour-tabs .tour-itinerary-day .tour-itinerary-day-toggle:focus,
#tour-tabs .tour-itinerary-day .tour-itinerary-day-toggle:active {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  color: var(--blanco) !important;
}
#tour-tabs .tour-itinerary-day .tour-itinerary-day-toggle:hover { color: var(--naranja-hover) !important; }

/* ----- Frase destacada del día (encima de las imágenes) ----- */
#tour-tabs .tour-itinerary-day p.tour-itinerary-day-text {
  position: relative;
  margin: 0 0 24px;
  padding-left: 32px;
  font-size: 18px;
  font-style: italic;
  font-weight: 500;
  line-height: 1.6;
  color: var(--blanco);
}
/* Check naranja delante */
#tour-tabs .tour-itinerary-day p.tour-itinerary-day-text::before {
  content: "";
  position: absolute;
  left: 5px;
  top: .2em;
  width: 7px;
  height: 13px;
  border: solid var(--naranja);
  border-width: 0 2.5px 2.5px 0;
  transform: rotate(45deg);
}

/* =====================================================
   RESPONSIVE: TABLET (hasta 1024px)
   ===================================================== */
@media (max-width: 1024px) {
  body { --pad-y: 72px; }
  #tour-hero h1 { font-size: 56px; }
  #tour-related-tours h2,
  #tour-related-blogs h2,
  #tour-related h2 { font-size: 40px; }
  #tour-tabs h3 { font-size: 28px; }

  #tour-hero { min-height: 62vh; }

  .descripcion-precio-tour-ruta {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .tarjeta-precio {
    position: static;
    order: -1;
  }

  #tour-cards { gap: 16px; }
  .tour-card-label { left: 14px; bottom: 14px; font-size: 14px; padding-left: 16px; }

  #tour-highlights-images { gap: 14px; }

  .tour-related-full-card-list,
  .related-card-list { grid-template-columns: repeat(2, 1fr); }
}

/* =====================================================
   RESPONSIVE: MÓVIL (hasta 767px)
   ===================================================== */
@media (max-width: 767px) {
  body { --pad-y: 56px; --pad-x: 20px; }
  #tour-hero h1 { font-size: 42px; padding-left: 16px; }
  #tour-related-tours h2,
  #tour-related-blogs h2,
  #tour-related h2 { font-size: 34px; }
  #tour-tabs h3 { font-size: 24px; }
  #tour-tabs .tour-itinerary-day-label { font-size: 28px; }
  .tarjeta-precio h2 { font-size: 30px; }

  #tour-hero { min-height: 58vh; padding-bottom: 110px; }

  #tour-icons {
    grid-template-columns: 1fr 1fr;
    gap: 20px 14px;
    margin-top: -60px;
    padding: 22px 18px;
    border-radius: 20px;
  }
  #tour-icons .tour-icon-item { gap: 10px; }
  #tour-icons .tour-icon-svg { width: 28px; height: 28px; }

  #tour-route { border-radius: 18px; padding: 16px 18px; }

  .tarjeta-precio { padding: 32px 22px 24px; border-radius: 24px; }
  .tarjeta-precio::before { width: 160px; height: 160px; top: -80px; right: -80px; }

  #tour-cards { grid-template-columns: 1fr; }
  .tour-card { aspect-ratio: 16 / 10; }

  #tour-tabs-nav { margin-bottom: 36px; padding: 12px 0; gap: 8px; }
  .tour-tabs-barra { margin-bottom: 36px; }
  .tour-tabs-barra #tour-tabs-nav { margin-bottom: 0; }
  .tour-tabs-flecha { width: 34px; height: 34px; margin-top: -17px; }
  #tour-tabs-nav > * { padding: 9px 16px; font-size: 14px; }

  #tour-highlights-list { grid-template-columns: minmax(0, 1fr); }
  /* Fotos: una sola fila que se desliza con el dedo */
  #tour-highlights-images {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 72%;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-bottom: 4px;
  }
  #tour-highlights-images::-webkit-scrollbar { display: none; }
  #tour-highlights-images img { scroll-snap-align: start; }
  #tour-itin-summary { margin-top: 48px; padding: 28px 20px; border-radius: 22px; }

  .tour-itinerary-day { padding: 24px 18px; border-radius: 22px; }

  .tour-itinerary-day-icons {
    grid-template-columns: 1fr 1fr;
    gap: 18px 12px;
    padding: 18px 16px;
  }
  .tour-itinerary-day-icons .tour-icon-item { grid-template-columns: 24px 1fr; gap: 10px; }
  .tour-itinerary-day-icons .tour-icon-svg { width: 24px; height: 24px; }
  .tour-itinerary-day-icons .tour-icon-desc { font-size: 14px; }

  #tour-inclusions { gap: 16px; }
  #tour-inclusions .tour-rich-text,
  #tour-before-you-go .tour-rich-text,
  #tour-pricing .tour-rich-text { padding: 24px 18px; border-radius: 22px; }
  #tour-tabs .tour-itinerary-day-label,
  #tour-tabs .tour-packing-category-title { font-size: 26px; }

  #tour-summary table,
  #tour-tabs .tour-rich-text table,
  #tour-tabs .tour-itinerary-day-detail table,
  #tour-tabs .tour-faq-answer table { display: block; overflow-x: auto; }

  .tour-packing-items { grid-template-columns: repeat(2, 1fr); gap: 12px; }

  .tour-faq-question { padding: 18px; }
  #tour-tabs .tour-faq-question h3 { font-size: 20px; }
  .tour-faq-answer { padding: 0 18px 18px; }

  #tour-trip-code { justify-content: flex-start; }

  .tour-related-full-card-list,
  .related-card-list { grid-template-columns: 1fr; }

  .tour-modal-overlay { padding: 72px 12px 12px; }
}

@media (prefers-reduced-motion: reduce) {
  #tour-tabs *, .tour-card *, .tour-card-label, .tour-card-label::after,
  .boton-reservar a::after, .boton-reservar button::after {
    transition: none !important;
    animation: none !important;
  }
}

/* =====================================================
   RELACIONADOS: evita que los párrafos se salgan
   ===================================================== */

/* Párrafo de descripción de cada sección */
#tour-related-tours-desc,
#tour-related-blogs-desc {
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: break-word;
  word-break: normal;
}

/* Las cards no pueden ser más anchas que su columna */
.tour-related-full-card-list > *,
.related-card-list > * {
  min-width: 0;
  max-width: 100%;
}

/* Texto dentro de las cards de relacionados */
#tour-related-tours p,
#tour-related-blogs p,
#tour-related p,
.tour-related-full-card-list h2,
.tour-related-full-card-list h3,
.related-card-list h2,
.related-card-list h3 {
  max-width: 100%;
  white-space: normal !important;
  overflow-wrap: break-word;
}

/* Imágenes y cualquier contenido embebido */
.tour-related-full-card-list img,
.related-card-list img,
#tour-related-tours iframe,
#tour-related-blogs iframe {
  max-width: 100%;
}