/* =====================================================================
   Nomad Bee — Sistema de diseño (preview de rediseño)
   Basado en docs/brand-guideline.md v1.2
   Paleta: amarillo #FFD101 · negro #1A1A1A · grises de apoyo
   Tipografía: Poppins (cuerpo) · BrandingSF (titulares, la de nomadbee.es)
   (titulares de marca — 2026-09-18: cambiado desde Archivo Black, que el
   dueño vio "demasiado negrita/infantil"; sigue siendo un sustituto de
   Google Fonts a la espera de autohospedar la fuente real de Drive, no la
   fuente de marca definitiva) · Caveat como sustituto de Laskor (acento
   manuscrito)
   ===================================================================== */

/* Poppins y Caveat alojadas en la propia web (antes @import de Google Fonts: bloqueaba el render en cadena). */
@font-face{ font-family:'Caveat'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/caveat-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Caveat'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/caveat-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Caveat'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/caveat-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Caveat'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/caveat-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Poppins'; font-style:italic; font-weight:500; font-display:swap; src:url('../fonts/poppins-500i-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Poppins'; font-style:italic; font-weight:500; font-display:swap; src:url('../fonts/poppins-500i-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Poppins'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/poppins-400-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Poppins'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/poppins-400-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Poppins'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/poppins-500-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Poppins'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/poppins-500-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Poppins'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/poppins-600-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Poppins'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/poppins-600-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:'Poppins'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/poppins-700-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:'Poppins'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/poppins-700-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Fuente de sustitución con las medidas de Poppins: mientras Poppins carga, el texto ocupa casi lo mismo y al cambiar no se
   mueve la página (en las landings, las filas de salidas saltaban: CLS de 0,09 a 0,14 en móvil lento). */
@font-face{ font-family:'Poppins Fallback'; src:local('Arial'), local('Roboto'), local('Liberation Sans'), local('Helvetica'); size-adjust:112.5%; ascent-override:93%; descent-override:31%; line-gap-override:10%; }

/* Tipografía de marca (la misma que nomadbee.es: Branding Black / Branding Medium) */
@font-face{ font-family:'BrandingSF'; src:url('../fonts/BrandingSF-Medium.woff2') format('woff2'); font-weight:400 600; font-style:normal; font-display:swap; }
@font-face{ font-family:'BrandingSF'; src:url('../fonts/branding-sf-black.woff2') format('woff2'); font-weight:700 900; font-style:normal; font-display:swap; }

:root{
  /* --- Marca (docs/brand-guideline.md §2) --- */
  --nb-yellow: #FFD101;
  --nb-yellow-dark: #E6BC00;
  --nb-black: #1A1A1A;
  --nb-white: #FFFFFF;

  --nb-body: #232323;
  --nb-bg: #FAFAFA;
  --nb-bg-2: #F5F5F7;
  --nb-dark-2: #2C3338;
  --nb-border: #EBEBEE;
  --nb-border-2: #C3C4C7;
  --nb-muted: #6B7078;

  /* estados — tonos contenidos dentro de la paleta de marca, nunca colores
     de plugin sueltos (ver brand-guideline §2, "excluidos de la paleta") */
  --nb-success-bg: #EAF6EC;
  --nb-success-fg: #1E7A34;
  --nb-warn-bg: #FFF4D6;
  --nb-warn-fg: #8A5A00;
  --nb-info-bg: #EEF0F2;
  --nb-info-fg: #4A4F57;

  /* Colores de precio (2026-10-08, pedido explícito del dueño, 2ª ronda):
     el rojo del tachado era el de nomadbee.es real medido en vivo, pero a
     Berto no le gusta ningún precio en rojo — lo corrigió a negro normal.
     El verde (precio con descuento) y el ámbar (precio solo, sin oferta)
     SÍ se quedan como en la web real, le gustan así. */
  --nb-price-old: var(--nb-body);
  /* Reauditoría 29-oct: #16A34A daba 3,3:1 sobre blanco. Mismo verde, más oscuro: #15803D = 5,0:1 (AA). */
  --nb-price-new: #15803D;
  /* Berto, 2-nov: el precio sin descuento, de marca y no marrón. El amarillo como color de letra da 1,4:1 sobre blanco
     (ilegible): va en negro con el rotulador amarillo debajo (.price:not(:has(.old)) .new). */
  --nb-price-plain: var(--nb-black);

  --nb-radius-sm: 8px;
  --nb-radius: 14px;
  --nb-radius-lg: 20px;
  --nb-shadow: 0 2px 8px rgba(26,26,26,.06), 0 1px 2px rgba(26,26,26,.05);
  --nb-shadow-lift: 0 12px 32px rgba(26,26,26,.14);

  --nb-container: 1180px;
  --nb-gutter: clamp(20px, 5vw, 48px);

  --font-display: 'BrandingSF', 'Poppins', 'Poppins Fallback', sans-serif;
  --font-accent: 'Caveat', cursive;
  --font-body: 'Poppins', 'Poppins Fallback', system-ui, sans-serif;
}

*, *::before, *::after{ box-sizing: border-box; }
/* overflow-x:hidden va en html, NO en body: ponerlo en body rompe el scroll
   vertical de toda la página en Chrome (body deja de ser el "scrolling
   element" y scrollTo/scrollTop del documento dejan de funcionar) — bug real
   encontrado y arreglado 2026-10-08 al añadir el .hero-cover a todo el ancho. */
/* scroll-behavior:smooth QUITADO (2026-10-09): en páginas largas con imágenes loading="lazy"
   (todas las destino-pais-*.html), cada imagen que carga tarde desplaza la altura de la página
   a mitad de la animación y el salto a un ancla (#opiniones, #info...) se corta a medio camino
   en vez de llegar al destino — bug real, confirmado con clics reales en la pestaña "Opiniones".
   Salto instantáneo = siempre llega. Los carruseles horizontales (scroll-rail) siguen suaves,
   llevan su propio behavior:'smooth' en el scrollBy() de main.js, no dependen de esta regla. */
html{ overflow-x: hidden; }
body{
  margin: 0;
  font-family: var(--font-body);
  color: var(--nb-body);
  background: var(--nb-white);
  -webkit-font-smoothing: antialiased;
  line-height: 1.6;
}
img{ max-width: 100%; display: block; }
a{ color: inherit; text-decoration: none; }
h1,h2,h3,h4{ font-family: var(--font-display); font-weight:700; line-height: 1.15; margin: 0 0 .5em; letter-spacing: -.01em; }
/* Suelos de clamp() bajados 2026-09-23 (auditoría de tamaños en mobile: h1 a 32px con un
   titular largo — el de la home, "Viaja distinto..." — ocupaba 5 líneas y media pantalla).
   Nunca menos de 1.4rem para no perder jerarquía frente al cuerpo del texto (1rem). */
h1{ font-size: clamp(1.75rem, 3.6vw, 2.9rem); }
h2{ font-size: clamp(1.4rem, 3vw, 2.3rem); }
h3{ font-size: clamp(1.1rem, 2vw, 1.5rem); }
p{ margin: 0 0 1em; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family: inherit; }

.container{
  max-width: var(--nb-container);
  margin-inline: auto;
  padding-inline: var(--nb-gutter);
}

.visually-hidden{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; padding:0; margin:-1px;
}

.skip-link{
  position:absolute; left:12px; top:-60px;
  background:var(--nb-black); color:var(--nb-white); padding:10px 16px;
  border-radius:var(--nb-radius-sm); z-index:200; transition:top .15s ease;
}
.skip-link:focus{ top:12px; }

/* ---------------------------------------------------------------------
   Barra de aviso (banner de preview, no forma parte del sitio real)
--------------------------------------------------------------------- */
.preview-banner{
  background: var(--nb-black);
  color: var(--nb-white);
  font-size: .82rem;
  text-align: center;
  padding: 9px 16px;
  position: relative;
  z-index: 300;
}
.preview-banner strong{ color: var(--nb-yellow); }
.preview-banner a{ text-decoration: underline; color: var(--nb-white); }

/* ---------------------------------------------------------------------
   Banner de urgencia/oferta a nivel de sitio — patrón visto en WeRoad
   (competencia real, ver docs/meta-ads-competitor-research.md): una franja
   fija arriba, no solo badges sueltos en tarjetas. Aquí en amarillo de marca
   (nunca rojo — fuera de paleta, ver docs/brand-guideline.md §2).
--------------------------------------------------------------------- */
.urgency-banner{
  background: var(--nb-yellow); color: var(--nb-black);
  font-size: .78rem; font-weight: 600;
  padding: 7px 0; position: relative; z-index: 290; overflow: hidden;
}
.urgency-banner b{ font-weight: 800; }
/* Berto y Santi, 3-nov: texto quieto y centrado que cambia cada 5 s (main.js), en vez de desplazarse sin parar: se lee y no
   anima nada mientras carga la página. Los mensajes van apilados en la misma celda: la altura es la del más largo y no
   cambia al rotar (sin saltos de la página). */
.urgency-banner__track{ display:grid; text-align:center; padding-inline:16px; }
.urgency-banner__track > span{ grid-area:1 / 1; align-self:center; opacity:0; transition:opacity .45s ease; }
.urgency-banner__track > span:first-child, .urgency-banner__track > span.is-on{ opacity:1; }
.urgency-banner__track.is-rotating > span:first-child:not(.is-on){ opacity:0; }
.urgency-banner__track > span[aria-hidden="true"]{ display:none; } /* copia de la cinta antigua (campaña): ya no hace falta */
@media (prefers-reduced-motion: reduce){ .urgency-banner__track > span{ transition:none; } }

/* ---------------------------------------------------------------------
   Prueba social: rating + nº de opiniones (patrón WeRoad: visible en la
   cabecera del viaje, antes de cualquier scroll, no escondido en una
   página de valoraciones aparte)
--------------------------------------------------------------------- */
.rating-badge{
  display:inline-flex; align-items:center; gap:6px; font-size:.9rem; font-weight:600;
}
.rating-badge .stars{ color: var(--nb-yellow-dark); letter-spacing:1px; }
.rating-badge .score{ color: var(--nb-black); }
.rating-badge .count{ color: var(--nb-muted); font-weight:500; }
.rating-badge a{ text-decoration: underline; }
.rating-badge--sm{ font-size:.78rem; gap:4px; }
.rating-badge--sm .stars{ font-size:.72rem; }

/* ---------------------------------------------------------------------
   Fila de confianza compacta pegada al precio (patrón WeRoad: "Reserva
   con 0€ · Cambio de viaje gratis · Pagos sin intereses" justo bajo el
   precio, antes del botón — aquí adaptada a que SÍ cobramos 150€ de
   reserva, pero el resto de flexibilidad se comunica igual de cerca)
--------------------------------------------------------------------- */
.trust-inline{
  display:flex; flex-wrap:wrap; gap:6px 14px; font-size:.76rem; color:var(--nb-muted);
  margin-block:10px 4px;
}
.trust-inline span{ display:inline-flex; align-items:center; gap:4px; }

/* Teaser de reseñas, un claim corto (patrón WeRoad: "Nuestros viajeros nos
   califican como Excelente, 4,75") en vez de citas sueltas — protagonista
   pero ocupa una sola línea, casi sin scroll. */
.review-claim{
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:10px 18px; padding:22px 0; text-align:center;
}
.review-claim__score{
  display:flex; flex-direction:column; align-items:center; gap:2px; flex-shrink:0;
}
.review-claim__score-top{ display:flex; align-items:center; gap:7px; }
.review-claim__score b{ font-size:1.5rem; font-weight:800; }
.review-claim__stars{ color:var(--nb-yellow-dark); letter-spacing:1px; font-size:1.1rem; }
.review-claim__count{ font-size:.72rem; color:var(--nb-muted); }
.review-claim__text{ margin:0; font-size:.98rem; max-width:48ch; color:var(--nb-muted); }
.review-claim__cta{ font-weight:700; white-space:nowrap; }
@media (max-width:600px){
  .review-claim{ padding:18px 0; gap:8px 14px; }
  .review-claim__text{ font-size:.9rem; }
}

/* Badge compacto de reseñas arriba de las landings de destino: ancla a la sección
   de opiniones de la propia página (patrón de competencia, estilo propio). */
.review-top-badge{
  display:inline-flex; align-items:center; gap:8px; padding:9px 18px;
  background:#fff; border:1px solid var(--nb-border); border-radius:999px;
  text-decoration:none; color:var(--nb-text); box-shadow:var(--nb-shadow);
  transition:transform .15s ease, box-shadow .15s ease;
}
.review-top-badge:hover{ transform:translateY(-1px); box-shadow:var(--nb-shadow-lift); }
.review-top-badge svg{ width:18px; height:18px; flex-shrink:0; }
.review-top-badge b{ font-size:1rem; font-weight:800; }
.review-top-badge__stars{ color:var(--nb-yellow-dark); letter-spacing:1px; font-size:.9rem; }
.review-top-badge__count{ font-size:.82rem; font-weight:700; text-decoration:underline; color:var(--nb-text); }

/* ---------------------------------------------------------------------
   "¿Este viaje es para mí?" — módulo de encaje de viaje (patrón WeRoad):
   ayuda a decidir rápido sin tener que leer todo el itinerario.
--------------------------------------------------------------------- */
.fit-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px 32px; }
.fit-item{ display:flex; align-items:center; gap:12px; font-size:.9rem; }
.fit-item__icon{
  width:32px; height:32px; border-radius:9px; background:var(--nb-bg-2);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.fit-item__icon svg{ width:16px; height:16px; }
.fit-item__label{ flex:1; }
.fit-item .dots{ display:flex; gap:4px; flex-shrink:0; }
.fit-item .dots span{ width:9px; height:9px; border-radius:50%; background: var(--nb-border-2); }
.fit-item .dots span.is-filled{ background: var(--nb-yellow-dark); }
.fit-meta{ display:flex; flex-wrap:wrap; gap:24px; margin-top:18px; font-size:.9rem; }
.fit-meta strong{ display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--nb-muted); font-weight:700; margin-bottom:2px; }

/* ---------------------------------------------------------------------
   Tarjeta de coordinador/a + modal de confianza
--------------------------------------------------------------------- */
.coordinator-card{
  display:flex; align-items:center; flex-wrap:wrap; gap:10px 12px; margin-top:20px; padding:14px 16px;
  border:1px solid var(--nb-border); border-radius:var(--nb-radius);
}
.coordinator-card .btn{ flex:1 0 100%; }
@media (min-width:420px){ .coordinator-card .btn{ flex:0 0 auto; } }
.coordinator-card__photo{
  width:52px; height:52px; border-radius:50%; object-fit:cover;
  border:2px solid var(--nb-yellow); flex-shrink:0;
}
.coordinator-card__body{ display:flex; flex-direction:column; flex:1; min-width:0; }
.coordinator-card__body strong{
  font-size:.7rem; text-transform:uppercase; letter-spacing:.04em; color:var(--nb-muted); font-weight:700;
}
.coordinator-card__name{ font-weight:700; font-size:.98rem; }

dialog.coordinator-modal{
  border:none; border-radius:var(--nb-radius-lg); padding:30px 26px; max-width:360px; width:90vw;
  max-height:85vh; overflow-y:auto; box-shadow:var(--nb-shadow-lift);
  /* Sin position:relative aquí a propósito: <dialog> se centra solo con su
     posicionamiento nativo (top-layer) — sobreescribirlo lo manda fuera de
     pantalla (bug real encontrado 2026-09-18). position:fixed explícito para
     que el botón de cerrar, en position:absolute, tenga dónde anclarse. */
  position:fixed; inset:0; margin:auto;
}
dialog.coordinator-modal::backdrop{ background:rgba(26,26,26,.55); backdrop-filter:blur(2px); }
dialog.coordinator-modal img{
  display:block; width:100px; height:100px; border-radius:50%; object-fit:cover;
  margin:0 auto 14px; border:3px solid var(--nb-yellow);
}
dialog.coordinator-modal h3{ text-align:center; margin-bottom:.3em; }
dialog.coordinator-modal .rating-badge{ justify-content:center; display:flex; margin-bottom:14px; }
.coordinator-modal__close{
  position:absolute; top:12px; right:12px; background:none; border:none; font-size:1.5rem;
  line-height:1; cursor:pointer; width:36px; height:36px; color:var(--nb-muted);
}

.day-item__thumb{ width:64px; height:64px; border-radius:var(--nb-radius-sm); object-fit:cover; flex-shrink:0; }

/* ---------------------------------------------------------------------
   Header / navegación
--------------------------------------------------------------------- */
.site-header{
  position: sticky; top: 0; z-index: 100;
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(180%) blur(10px);
  border-bottom: 1px solid var(--nb-border);
}
.nav-row{
  display:flex; align-items:center; justify-content:space-between;
  gap: 20px; padding-block: 14px;
}
.brand{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.brand img{ height: 40px; width:auto; }

.nav-links{
  display:flex; align-items:center; gap: 28px;
  font-weight: 500; font-size: .96rem;
}
.nav-links a{ padding: 8px 2px; position:relative; }
.nav-links a:hover{ color:#000; }
.nav-links a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:var(--nb-yellow); transform:scaleX(0); transform-origin:left;
  transition:transform .15s ease;
}
.nav-links a:hover::after{ transform:scaleX(1); }

.nav-actions{ display:flex; align-items:center; gap:10px; }

/* Mega-menú "Destinos" — espejo de la arquitectura real nomadbee.es:
   Destinos (país) / Fechas (mes) / Tipos de viaje. Items sin landing propia
   todavía son <span> inertes con .is-soon, nunca <a> — ver nomadvia_site_architecture_rule. */
.nav-item--has-mega{ position:relative; }
.nav-item--has-mega > a{ display:inline-flex; align-items:center; gap:4px; }
.nav-item--has-mega > a::before{ content:none; }
.mega-caret{ font-size:.65rem; transition:transform .15s ease; }
.nav-item--has-mega:hover .mega-caret,
.nav-item--has-mega:focus-within .mega-caret{ transform:rotate(180deg); }

.mega-menu{
  position:absolute; top:100%; left:50%; transform:translateX(-50%);
  width:min(760px, 90vw); background:#fff; border:1px solid var(--nb-border);
  border-radius:16px; box-shadow:0 20px 48px rgba(20,16,8,.14);
  padding:26px 28px; display:grid; grid-template-columns:1.1fr 1.3fr 1fr; gap:28px;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .15s ease, visibility .15s;
  z-index:200;
}
.nav-item--has-mega:hover .mega-menu,
.nav-item--has-mega:focus-within .mega-menu{
  opacity:1; visibility:visible; pointer-events:auto;
}
.mega-menu__col h4{
  margin:0 0 10px; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em;
  color:var(--nb-muted); font-weight:700;
}
.mega-menu__col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.mega-menu__col a, .mega-menu__col .is-soon{
  display:block; padding:6px 8px; margin:0 -8px; border-radius:8px; font-size:.9rem; font-weight:500;
}
.mega-menu__col a:hover{ background:var(--nb-bg-2); color:#000; }
.mega-menu__col .is-soon{ color:var(--nb-muted); opacity:.55; cursor:default; }
.mega-menu__col .is-soon::after{ content:"Próximamente"; display:inline-block; margin-left:6px; font-size:.62rem; text-transform:uppercase; letter-spacing:.03em; vertical-align:middle; color:var(--nb-muted); opacity:.85; }
.mega-menu__col--fechas ul{ display:grid; grid-template-columns:1fr 1fr; gap:0 10px; }
.mega-menu__footer{ grid-column:1 / -1; border-top:1px solid var(--nb-border); margin-top:4px; padding-top:14px; }
.mega-menu__footer a{ font-weight:600; color:var(--nb-text); }
/* Variante de una sola columna para "Tipos de viaje" y "Nomad Bee" — el
   mega-menu de Destinos pesa 3 columnas a propósito, pero un desplegable de
   6-7 enlaces sueltos no necesita 760px de ancho (pedido del dueño 2026-10-15:
   antes estos dos eran enlaces planos sin desplegar nada). */
.mega-menu--simple{ width:240px; grid-template-columns:1fr; left:0; transform:none; padding:14px; }

@media (max-width:1080px){
  .mega-menu{ position:static; transform:none; width:auto; box-shadow:none; border:none; grid-template-columns:1fr; padding:10px 0 0 14px; opacity:1; visibility:visible; pointer-events:auto; display:none; }
  .nav-item--has-mega.is-open .mega-menu{ display:grid; }
}

/* Botones planos, sin sombra decorativa por defecto (ni la sombra dura tipo
   "sello/ticket" de antes, ni la sombra difusa genérica de IA que ya se
   había descartado): pedido del dueño 2026-10-09, quiere algo sobrio y
   propio, no la imagen de otra marca. Solo una elevación sutil al hover. */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight:700; font-size:.95rem; border-radius:var(--nb-radius-sm);
  padding:12px 22px; border:2px solid var(--nb-black); cursor:pointer;
  min-height:44px;
  transition:transform .12s ease, box-shadow .12s ease, background .15s ease;
  /* white-space:normal a propósito, no nowrap: un botón con texto largo (p. ej.
     "¿Quieres ser coordinador/a? Escríbenos por WhatsApp" en /nuestros-coordinadores/)
     con nowrap fuerza al botón — y a toda la página — a ensancharse más allá del
     viewport en mobile. Deja envolver el texto en 2 líneas en vez de romper el
     layout. Encontrado 2026-09-23 en la auditoría de scroll horizontal. */
  white-space:normal; text-align:center; max-width:100%;
}
.btn[hidden]{ display:none; } /* sin esto display:inline-flex gana al atributo hidden (Reintentar, "Ver más artículos") */
.btn:hover{ transform:translateY(-1px); box-shadow:var(--nb-shadow); }
.btn:active{ transform:translateY(0); box-shadow:none; }
.btn-primary{ background:var(--nb-yellow); color:var(--nb-black); }
.btn-primary:hover{ background:var(--nb-yellow-dark); }
.btn-dark{ background:var(--nb-black); color:var(--nb-white); border-color:var(--nb-black); }
.btn-dark:hover{ background:#000; }
.btn-outline{ background:transparent; border-color:var(--nb-black); color:var(--nb-black); }
.btn-outline:hover{ background:var(--nb-black); color:var(--nb-white); }
.btn-whatsapp{ background:#25D366; color:#fff; border-color:#128C3E; }
.btn-whatsapp:hover{ background:#1EBE5A; }
.btn-block{ width:100%; white-space:normal; text-align:center; }
.btn-sm{ padding:9px 16px; font-size:.86rem; min-height:38px; }

.icon{ width:18px; height:18px; flex-shrink:0; }

/* "[Destino] en detalle" estilo Intrepid: rejilla de fichas con icono de
   línea SVG que se abren en acordeón. El texto vive siempre en el HTML
   (nunca se carga por JS al pulsar) — pedido del dueño vía consola SEO,
   2026-10-09, para que Google lo pueda leer sin interacción. Plantilla
   para todos los destinos, no solo Islandia. */
.detail-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; margin-top:18px; align-items:start; }
.detail-card{
  background:#fff; border:1px solid var(--nb-border); border-radius:var(--nb-radius);
  padding:4px 22px;
}
.detail-card summary{
  display:flex; align-items:center; gap:14px; padding:18px 0; cursor:pointer;
  list-style:none; font-weight:700; font-size:1rem;
}
.detail-card summary::-webkit-details-marker{ display:none; }
.detail-card summary .icon-badge{
  width:40px; height:40px; border-radius:10px; background:var(--nb-bg-2);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.detail-card summary::after{ content:"+"; margin-left:auto; font-size:1.3rem; color:var(--nb-muted); font-weight:400; }
.detail-card[open] summary::after{ content:"–"; }
.detail-card__body{ padding:0 0 22px; font-size:.92rem; color:var(--nb-muted); }
.detail-card__body p{ margin:0 0 10px; }
.detail-card__body p:last-child{ margin-bottom:0; }
.detail-card__body table{ width:100%; border-collapse:collapse; font-size:.86rem; margin:12px 0; }
.detail-card__body th, .detail-card__body td{ text-align:left; padding:6px 10px; border-bottom:1px solid var(--nb-border); }
.detail-card__body th{ font-weight:700; color:var(--nb-text); }
.detail-card__body ul{ margin:0 0 10px; padding-left:20px; }
.detail-card__body li{ margin-bottom:4px; }
.detail-card__body a{ text-decoration:underline; }

/* GEO: bloque "Datos clave", tabla de coste real y línea de autoría — pedido
   consola SEO, 2026-10-10, mismo patrón en las 11 landings de destino. */
.key-facts{
  background:var(--nb-bg-2); border:1px solid var(--nb-border); border-radius:var(--nb-radius);
  padding:20px 22px; margin:18px 0 0; display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px 24px;
}
.key-facts dt{ font-size:.74rem; text-transform:uppercase; letter-spacing:.03em; color:var(--nb-muted); font-weight:600; margin-bottom:2px; }
.key-facts dd{ margin:0; font-weight:700; font-size:.95rem; }
.cost-table-wrap{ margin:18px 0; }
.cost-table-wrap table{ width:100%; border-collapse:collapse; font-size:.9rem; margin:14px 0; }
.cost-table-wrap th, .cost-table-wrap td{ text-align:left; padding:8px 12px; border-bottom:1px solid var(--nb-border); }
.cost-table-wrap th{ font-weight:700; color:var(--nb-text); }
.cost-table-wrap p{ font-size:.82rem; color:var(--nb-muted); margin:10px 0 0; }
.author-line{
  display:flex; align-items:center; gap:10px; font-size:.86rem; color:var(--nb-muted);
  padding:10px 0 0; margin:0;
}
.author-line a{ color:inherit; text-decoration:underline; }

/* GEO: resumen de clima por temporadas (sustituye a la tabla mes a mes dentro
   de la ficha "¿Qué tiempo hace en X?" — pedido explícito del dueño
   2026-10-15: info real y legible en cualquier dispositivo, sin tablas que se
   rompan en mobile. Mismo patrón en las 11 landings de destino. */
.season-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin:16px 0;
}
.season-card{
  background:var(--nb-bg-2); border:1px solid var(--nb-border); border-radius:var(--nb-radius);
  padding:18px 20px;
}
.season-card h4{ margin:0 0 6px; font-size:1rem; }
.season-card__stats{ font-weight:700; color:var(--nb-black); margin:0 0 8px; font-size:.9rem; }
.season-card p:last-child{ margin-bottom:0; color:var(--nb-muted); font-size:.9rem; }

.hamburger{
  display:none; background:none; border:none; padding:8px; min-height:44px; min-width:44px;
  align-items:center; justify-content:center; cursor:pointer;
}
.hamburger span{ display:block; width:22px; height:2px; background:var(--nb-black); position:relative; }
.hamburger span::before,.hamburger span::after{
  content:""; position:absolute; left:0; width:22px; height:2px; background:var(--nb-black);
}
.hamburger span::before{ top:-7px; } .hamburger span::after{ top:7px; }

.mobile-panel{
  /* z-index 310: por encima de .preview-banner (300) y .urgency-banner (290) a
     propósito — si no, al abrir el menú esos dos banners fijos tapan
     .mobile-panel__top (logo + botón cerrar), que queda inalcanzable (bug
     real reportado por el dueño 2026-10-16, visto en captura de móvil). */
  position:fixed; inset:0; z-index:310; display:none;
}
.mobile-panel.is-open{ display:block; }
.mobile-panel__backdrop{
  position:absolute; inset:0; background:rgba(26,26,26,.45);
}
.mobile-panel__sheet{
  position:absolute; top:0; right:0; height:100%; width:min(340px,86vw);
  background:#fff; padding:22px; overflow-y:auto;
  box-shadow:var(--nb-shadow-lift);
  display:flex; flex-direction:column; gap:22px;
}
.mobile-panel__top{ display:flex; justify-content:space-between; align-items:center; }
.mobile-panel__close{ background:none; border:none; font-size:1.6rem; line-height:1; cursor:pointer; min-height:44px; min-width:44px; }
.mobile-panel__sheet nav ul{ display:flex; flex-direction:column; gap:4px; }
.mobile-panel__sheet nav a{ display:block; padding:13px 6px; font-weight:600; font-size:1.05rem; border-bottom:1px solid var(--nb-border); }

.mobile-nav-mega{ border-bottom:1px solid var(--nb-border); }
.mobile-nav-mega summary{ padding:13px 6px; font-weight:600; font-size:1.05rem; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; }
.mobile-nav-mega summary::-webkit-details-marker{ display:none; }
.mobile-nav-mega summary::after{ content:"▾"; font-size:.8rem; color:var(--nb-muted); }
.mobile-nav-mega[open] summary::after{ content:"▴"; }
.mobile-nav-mega__body{ padding:0 6px 14px; }
.mobile-nav-mega__body h5{ margin:14px 0 4px; font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--nb-muted); }
.mobile-nav-mega__body ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0; }
.mobile-nav-mega__body a, .mobile-nav-mega__body .is-soon{ display:block; padding:7px 0; font-weight:500; font-size:.92rem; border-bottom:none; }
.mobile-nav-mega__body .is-soon{ color:var(--nb-muted); opacity:.55; }
.mobile-nav-mega__body .is-soon::after{ content:" · Próximamente"; font-size:.72rem; }
.mobile-nav-mega__body > a{ font-weight:700; margin-top:10px; }

/* ---------------------------------------------------------------------
   Botón WhatsApp flotante (no debe tapar contenido — anclado con margen
   seguro y con "safe area" en mobile)
--------------------------------------------------------------------- */
.wa-widget{ position:fixed; right:20px; bottom:20px; z-index:150; }
.wa-float{
  width:56px; height:56px; border-radius:50%; background:#25D366; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(37,211,102,.45);
}
.wa-float svg{ width:28px; height:28px; fill:#fff; }

/* Panel de intención rápida: pedido explícito del dueño — que el propio botón
   de WhatsApp capture una etiqueta cualitativa del motivo de contacto (misma
   idea que el broker con gate humano de Camera Market/nomad-toolkit), para
   que en producción el webhook de WhatsApp Cloud API pueda auto-etiquetar el
   Contacto 360 (`tags`) sin depender de que el agente lo escriba a mano. */
.wa-panel{
  position:absolute; right:0; bottom:70px; width:280px; max-width:calc(100vw - 40px);
  background:#fff; border-radius:var(--nb-radius-lg); box-shadow:var(--nb-shadow-lift);
  padding:16px; border:1px solid var(--nb-border);
  opacity:0; visibility:hidden; transform:translateY(10px) scale(.98);
  transition:opacity .16s ease, transform .16s ease, visibility .16s;
  transform-origin:bottom right;
}
.wa-panel.is-open{ opacity:1; visibility:visible; transform:translateY(0) scale(1); }
.wa-panel__title{ font-weight:700; margin:0 0 2px; padding-right:20px; }
.wa-panel__sub{ font-size:.82rem; color:var(--nb-muted); margin:0 0 10px; }
.wa-panel__option{
  display:flex; align-items:center; gap:10px; padding:9px 8px; border-radius:10px;
  text-decoration:none; color:var(--nb-body); font-size:.88rem; font-weight:600;
  background:none; border:none; width:100%; text-align:left; cursor:pointer; font-family:inherit;
}
.wa-panel__back{
  background:none; border:none; padding:0; margin-bottom:6px; color:var(--nb-muted);
  font-size:.8rem; font-weight:600; cursor:pointer; font-family:inherit;
}
.wa-panel__back:hover{ color:var(--nb-black); }
.wa-panel__option:hover{ background:var(--nb-bg-2); }
.wa-panel__icon{ font-size:1.05rem; flex-shrink:0; width:22px; text-align:center; }
.wa-panel__close{
  position:absolute; top:8px; right:8px; width:26px; height:26px; border-radius:50%;
  border:none; background:var(--nb-bg-2); cursor:pointer; font-size:1rem; line-height:1;
}

/* ---------------------------------------------------------------------
   Hero
--------------------------------------------------------------------- */
.hero{
  position:relative; min-height:min(78vh, 640px); display:flex; align-items:flex-end;
  color:#fff; overflow:hidden; background:var(--nb-black);
}
.hero picture{ position:absolute; inset:0; }
.hero img.hero-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0;
  animation:hero-fade 24s infinite;
}
/* El delay va en el <picture>, no en el <img>: con <picture> cada <img> es el
   único hijo de su propio padre, así que :nth-of-type en el img siempre da 1. */
.hero picture:nth-of-type(1) .hero-bg{ animation-delay:0s; }
.hero picture:nth-of-type(2) .hero-bg{ animation-delay:6s; }
.hero picture:nth-of-type(3) .hero-bg{ animation-delay:12s; }
.hero picture:nth-of-type(4) .hero-bg{ animation-delay:18s; }
@keyframes hero-fade{
  0%{ opacity:0; }
  4%{ opacity:.9; }
  21%{ opacity:.9; }
  25%{ opacity:0; }
  100%{ opacity:0; }
}
@media (prefers-reduced-motion: reduce){
  .hero img.hero-bg{ animation:none; opacity:0; }
  .hero picture:first-of-type .hero-bg{ opacity:.9; }
}
.hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(26,26,26,.15) 0%, rgba(26,26,26,.05) 35%, rgba(26,26,26,.78) 100%);
}
.hero-content{ position:relative; z-index:2; padding-block:56px 40px; width:100%; }
/* Antes era una píldora translúcida con blur (glassmorphism) — el patrón más
   "genérico de IA" que hay. Ahora es un sello/etiqueta de equipaje: amarillo
   sólido, borde negro, sombra desplazada y ligera rotación — reconocible
   como Nomad Bee, no como una plantilla cualquiera (feedback 2026-10-08). */
.hero-eyebrow{
  display:inline-flex; align-items:center; gap:8px; background:var(--nb-yellow);
  border:2px solid var(--nb-black); color:var(--nb-black); padding:7px 16px;
  border-radius:5px; font-size:.82rem; font-weight:800; margin-bottom:18px;
  text-transform:uppercase; letter-spacing:.03em; transform:rotate(-1.5deg);
  box-shadow:3px 3px 0 var(--nb-black);
}
.hero h1{ max-width: 21ch; margin-bottom:.35em; text-shadow:0 2px 18px rgba(0,0,0,.25); }
.hero{ min-height:min(82vh, 680px); }
.hero p.lead{ max-width:52ch; font-size:1.05rem; color:rgba(255,255,255,.92); }

.search-card{
  margin-top:28px; background:#fff; border-radius:var(--nb-radius-lg);
  box-shadow:var(--nb-shadow-lift); padding:14px; color:var(--nb-body);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; gap:10px; align-items:stretch;
}
.search-field{ display:flex; flex-direction:column; gap:4px; padding:8px 14px; border-radius:var(--nb-radius); }
.search-field + .search-field{ border-left:1px solid var(--nb-border); }
.search-field label{ font-size:.72rem; font-weight:600; color:var(--nb-muted); text-transform:uppercase; letter-spacing:.04em; }
.search-field select{
  border:none; font-family:inherit; font-size:.98rem; font-weight:600; color:var(--nb-black);
  background:transparent; padding:2px 0; appearance:none;
}
.search-card .btn{ align-self:center; }

/* ---------------------------------------------------------------------
   Secciones generales
--------------------------------------------------------------------- */
.section{ padding-block: clamp(48px, 7vw, 88px); }

/* Mosaico de categorías editables por prioridad (Confirmados/Oferta/Otoño/
   Fin de año/Islandia) — mismo contenido/lógica que ya usa nomadbee.es real
   (bloques por categoría dinámica, el dueño quiere mantenerlo), con
   tratamiento visual más editorial (foto grande, menos aspecto de listado) —
   ver nomadvia_five_standing_design_principles y el estudio de competencia
   2026-10-02: WeRoad/G Adventures/Feel Free van sin fecha, Huakai SÍ mantiene
   categoría con urgencia real — Nomad Bee sigue el patrón de Huakai. */
/* Scroll horizontal (patrón WeRoad "El viaje en grupo perfecto para ti"):
   tiles de tamaño uniforme, se asoman por el borde para invitar al swipe,
   en vez de un grid que obliga a bajar scroll vertical. */
.cat-mosaic{
  display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:10px;
}
.cat-mosaic::-webkit-scrollbar{ height:8px; }
.cat-mosaic::-webkit-scrollbar-thumb{ background:var(--nb-border-2); border-radius:8px; }
.cat-tile{
  position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end;
  gap:10px; min-height:300px; border-radius:var(--nb-radius-lg); overflow:hidden;
  text-align:left; padding:22px; color:#fff; text-decoration:none;
  box-shadow:var(--nb-shadow);
  flex:0 0 260px; scroll-snap-align:start;
}
.cat-tile img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  transition:transform .35s ease; filter:saturate(1.18) contrast(1.05);
}
.cat-tile:hover img{ transform:scale(1.05); }
/* Degradado solo en el tercio inferior (estilo WeRoad) — deja el color real
   de la foto respirar en vez de oscurecerla entera. */
.cat-tile::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.55) 100%);
}
.cat-tile__title{
  position:relative; z-index:2; font-family:var(--font-display); font-weight:800;
  font-size:1.5rem; line-height:1.15; text-shadow:0 1px 4px rgba(0,0,0,.55), 0 2px 16px rgba(0,0,0,.5); margin:0;
  /* Altura fija a 2 líneas: sin emoji ya no deberían pasar de 2, pero esto
     evita que "Viajes Confirmados" (1 línea) y "Todos los Destinos" (2
     líneas) desalineen el CTA de abajo entre tarjetas (feedback 2026-10-08). */
  min-height:2.3em; display:flex; align-items:flex-end;
}
.cat-tile__sub{
  position:relative; z-index:2; font-size:.88rem; max-width:34ch; margin:0;
  text-shadow:0 1px 4px rgba(0,0,0,.55), 0 2px 12px rgba(0,0,0,.45);
}
.cat-tile__cta{
  position:relative; z-index:2; display:inline-flex; align-items:center; gap:6px;
  font-weight:700; font-size:.86rem; color:#fff; border:1.5px solid rgba(255,255,255,.85);
  border-radius:999px; padding:0 18px; backdrop-filter:blur(2px);
  transition:background .15s ease, color .15s ease;
  /* 29-oct (Berto): botón de tamaño contenido y homogéneo en todas las tarjetas.
     Alto fijo (cabe 1 línea o como mucho 2), nunca crece con el texto ni estira la tarjeta. */
  height:42px; max-width:100%; box-sizing:border-box; line-height:1.15; overflow:hidden; text-wrap:balance;
}
.cat-tile:hover .cat-tile__cta{ background:#fff; color:var(--nb-black); }
@media (max-width:680px){
  .cat-tile{ flex:0 0 58vw; min-height:235px; }
  .cat-tile__cta{ height:40px; padding:0 14px; font-size:.78rem; }
}

.section-title-compact{ margin-bottom:18px; }

/* Destinos sin fecha, patrón "TOP itinerarios del mes" de Huakai: foto a
   sangre completa + degradado + texto blanco encima (owner pidió que se
   pareciera más a sus tarjetas de Marruecos/Jordania: full imagen, letras
   blancas, sin panel). Solo destinos con landing propia construida
   (destino-pais*.html) — nunca se inventa una página que no existe. */
.dest-strip{
  display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:10px;
}
.dest-strip::-webkit-scrollbar{ height:8px; }
.dest-strip::-webkit-scrollbar-thumb{ background:var(--nb-border-2); border-radius:8px; }
.dest-card{
  position:relative; flex:0 0 250px; scroll-snap-align:start; display:flex;
  flex-direction:column; justify-content:flex-end; min-height:380px;
  border-radius:var(--nb-radius-lg); overflow:hidden; box-shadow:var(--nb-shadow);
  text-decoration:none; color:#fff; padding:20px;
  transition:box-shadow .15s ease, transform .15s ease;
}
.dest-card:hover{ box-shadow:var(--nb-shadow-lift); transform:translateY(-2px); }
.dest-card:hover .dest-card__img{ transform:scale(1.05); }
/* El grupo de Azores está muy abajo en la foto original (mucho cielo arriba).
   La tarjeta es más alta que ancha, así que object-fit:cover apenas recorta en
   vertical (cubre por ancho) y casi no se veía gente — object-position solo no
   basta porque no hay margen que desplazar. Se hace zoom real con transform,
   anclado abajo, para que el grupo ocupe la tarjeta igual que en el resto de
   destinos (pedido explícito del dueño, 2026-10-07 y 2026-10-15). */
.dest-card__img[src*="azores-mirador-grupo"]{ transform:scale(1.6); transform-origin:center 100%; }
.dest-card:hover .dest-card__img[src*="azores-mirador-grupo"]{ transform:scale(1.68); }

/* Variante de dest-card para bloques "por qué este destino" con foto real en
   vez de tarjetas planas con icono — pedido explícito del dueño (Maldivas,
   2026-10-15): mismo lenguaje visual vistoso que las tarjetas de destino de
   la home, aquí sin link ni precio, con un párrafo corto en vez de meta. */
.why-card{ min-height:420px; cursor:default; }
.why-card__text{ font-size:.86rem; line-height:1.4; margin:4px 0 0; opacity:.95; }
.dest-card__img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  transition:transform .35s ease;
}
.dest-card::before{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.78) 100%);
}
.dest-card__body{ position:relative; z-index:2; display:flex; flex-direction:column; gap:2px; }
.dest-card__name{
  font-family:var(--font-display); font-weight:800; font-size:1.3rem; text-transform:uppercase;
  margin:0; text-shadow:0 1px 4px rgba(0,0,0,.5);
}
.dest-card__meta{ font-size:.84rem; margin:2px 0 0; opacity:.92; }
.dest-card__price{ font-weight:800; font-size:1.3rem; margin:10px 0 0; }
.dest-card__price .from{ font-weight:400; font-size:.78rem; opacity:.85; display:block; }
@media (max-width:680px){
  .dest-card{ flex:0 0 58vw; min-height:340px; }
}

/* Bloque de filosofía de marca entre los dos scrolls horizontales (categorías
   arriba, destinos abajo) — corta la repetición visual sin meter otro
   carrusel, copy pensado para SEO/GEO (intención/tono del viaje, no datos). */
.philosophy-block{ background:var(--nb-bg-2); }
.philosophy-block__inner{
  display:grid; grid-template-columns:1.1fr 1fr; gap:32px; align-items:center;
}
.philosophy-block__headline{
  font-family:var(--font-display); font-weight:700; line-height:1.2; margin:0;
  font-size:clamp(1.6rem, 3vw, 2.1rem);
}
.philosophy-block__body p{ margin:0 0 16px; color:var(--nb-muted); font-size:1rem; }
@media (max-width:860px){
  .philosophy-block__inner{ grid-template-columns:1fr; text-align:center; gap:18px; }
}

.section--alt{ background:var(--nb-bg); }
.section--dark{ background:var(--nb-dark-2); color:#fff; }
.section--photo{ position:relative; overflow:hidden; }
.section--photo .section-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.5;
}
.section--photo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(26,26,26,.6) 0%, rgba(44,51,56,.92) 100%);
}
.section--photo .container{ position:relative; z-index:1; }
.section-head{ max-width:640px; margin-bottom:36px; }
.section-head.center{ margin-inline:auto; text-align:center; }
/* Barra de acento en vez de píldora redondeada rellena de amarillo (esa
   forma de "tag" pastel con las esquinas muy redondeadas es justo lo que
   Irene/Berto identificaron como "muy estilo Claude" en toda la web,
   2026-10-08) — más editorial/revista de viajes, menos SaaS genérico. */
.eyebrow{
  display:inline-flex; align-items:center; font-size:.76rem; font-weight:800; letter-spacing:.09em;
  text-transform:uppercase; color:var(--nb-black); background:none;
  margin-bottom:14px; line-height:1.3;
}
/* Berto, 3-nov: sin la barrita amarilla a la izquierda ni la rayita encima («muy Claude»): solo el rótulo. */
.section-head.center .eyebrow{ flex-direction:column; align-items:center; }
.lead{ color:var(--nb-muted); font-size:1.05rem; }

.value-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:22px;
}
/* Variante en scroll horizontal (home, pedido explícito del dueño: mismo
   idioma visual que las filas de viajes, tarjetas grandes y visibles, la
   siguiente se asoma un poco para invitar al swipe). */
.value-grid--scroll{
  display:flex; gap:20px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x mandatory;
  margin-inline: calc(var(--nb-gutter) * -1); padding-inline: var(--nb-gutter);
  /* scroll-padding-inline es necesario, no solo decorativo: con
     scroll-snap-type + scroll-snap-align:start en las tarjetas, el navegador
     "engancha" al primer punto de snap en cuanto carga la página y eso se come
     el padding-inline de arriba (la 1ª tarjeta queda pegada al borde). Mismo
     valor que el gutter para que el margen izquierdo se respete de verdad. */
  scroll-padding-inline: var(--nb-gutter);
}
.value-grid--scroll::-webkit-scrollbar{ height:8px; }
.value-grid--scroll::-webkit-scrollbar-thumb{ background:var(--nb-border-2); border-radius:8px; }
.value-grid--scroll .value-card{ scroll-snap-align:start; flex:0 0 240px; }
.value-grid--scroll .value-card__img{ aspect-ratio:4/3; }
@media (max-width:600px){
  .value-grid--scroll .value-card{ flex-basis:64vw; }
}
.value-card{
  background:#fff; border:1px solid var(--nb-border); border-radius:var(--nb-radius);
  padding:26px 22px;
}
.value-card .icon-badge{
  width:46px; height:46px; border-radius:12px; background:var(--nb-bg-2);
  display:flex; align-items:center; justify-content:center; margin-bottom:16px;
}
.value-card--photo{ padding:0; overflow:hidden; }
.value-card__img{
  width:100%; aspect-ratio:4/3; object-fit:cover; display:block;
}
.value-card__img[src*="vg-coordinador"]{ object-position:65% 68%; }
/* Experiencias (destino-pais-X.html): 3x3 en desktop, no 4+2 (pedido explícito
   del dueño 2026-10-08). En mobile, 2 columnas fijas en vez de 1 — con las 6
   tarjetas apiladas se hacía demasiado scroll; repeat(2,1fr) en vez de
   auto-fit evita además que la última fila quede con una sola tarjeta suelta
   y descentrada a ciertos anchos. */
#experiencias .value-grid{ grid-template-columns:repeat(3, 1fr); }
@media (max-width:900px){
  #experiencias .value-grid{ grid-template-columns:repeat(2, 1fr); gap:14px; }
}
@media (max-width:680px){
  #experiencias .value-grid{ gap:10px; }
  #experiencias .value-card__body{ padding:10px 10px 12px; }
  #experiencias .value-card h3{ font-size:.82rem; }
  #experiencias .value-card p{ font-size:.74rem; line-height:1.3; }
}
/* Solo Islandia (2026-10-09, pedido explícito del dueño): el grid 2x2 fijo en
   mobile se veía "muy pequeño" para 6 tarjetas — scroll horizontal en vez de
   grid, mismo idioma visual que .value-grid--scroll en la home. Clase propia
   para no tocar el resto de landings de destino, que siguen con el 2x2. */
@media (max-width:900px){
  #experiencias .value-grid.value-grid--mobile-scroll{
    display:flex; grid-template-columns:none; overflow-x:auto; gap:14px;
    scroll-snap-type:x mandatory; padding-bottom:10px;
    margin-inline: calc(var(--nb-gutter) * -1); padding-inline: var(--nb-gutter);
    scroll-padding-inline: var(--nb-gutter);
  }
  #experiencias .value-grid--mobile-scroll .value-card{
    scroll-snap-align:start; flex:0 0 64vw;
  }
}
@media (max-width:680px){
  #experiencias .value-grid--mobile-scroll .value-card__body{ padding:14px 14px 16px; }
  #experiencias .value-grid--mobile-scroll .value-card h3{ font-size:.95rem; }
  #experiencias .value-grid--mobile-scroll .value-card p{ font-size:.82rem; line-height:1.4; }
}
.value-card__body{ padding:14px 16px 16px; }
.value-card h3{ font-size:.98rem; margin-bottom:.3em; }
.value-card p{ font-size:.84rem; color:var(--nb-muted); margin:0; line-height:1.35; }

/* Coordinador clicable en tarjetas de viaje: avatar de iniciales (sin foto
   real todavía, ver nota en README) + modal genérico compartido por página. */
.coord-mini{
  display:inline-flex; align-items:center; gap:8px; background:var(--nb-bg-2); border:1px solid var(--nb-border);
  border-radius:999px; padding:4px 12px 4px 4px; margin:0; font:inherit; color:inherit; cursor:pointer; text-align:left;
  transition:background .15s ease, border-color .15s ease;
}
.coord-mini:hover{ background:var(--nb-bg-3,#eee); border-color:var(--nb-border-2); }
.coord-mini:hover .coord-mini__label{ text-decoration:underline; }
.coord-mini__label{ font-weight:600; display:flex; flex-direction:column; line-height:1.15; }
.coord-mini__label::before{ content:"Coordi"; font-weight:400; font-size:.62rem; text-transform:uppercase; letter-spacing:.03em; color:var(--nb-muted); }
.coord-mini__avatar{
  width:26px; height:26px; border-radius:50%; background:var(--nb-yellow); color:var(--nb-black);
  display:inline-flex; align-items:center; justify-content:center;
  font-size:.74rem; font-weight:800; flex-shrink:0; overflow:hidden;
  background-size:cover; background-position:center;
}
.coord-mini__avatar img{ width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; }
.coord-mini__avatar--lg{
  width:72px; height:72px; font-size:1.6rem; margin-inline:auto; margin-bottom:12px;
}
.coordinator-modal .coord-mini__avatar--lg{ display:flex; }

/* Fila de viajes en horizontal para desktop (menos scroll vertical) — en
   mobile se mantiene el grid/apilado que ya evita el aspecto "agencia
   clásica" con fotos demasiado grandes (pedido explícito del dueño). */
/* Bloque único de reseñas (no por viaje) — franja horizontal con scroll,
   mismo patrón que el widget real de Google que ya usa nomadbee.es. */
.review-strip{
  display:flex; gap:18px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x mandatory;
  margin-inline: calc(var(--nb-gutter) * -1); padding-inline: var(--nb-gutter);
  scroll-padding-inline: var(--nb-gutter);
}
.review-strip::-webkit-scrollbar{ height:8px; }
.review-strip::-webkit-scrollbar-thumb{ background:var(--nb-border-2); border-radius:8px; }
.review-card{
  scroll-snap-align:start; flex:0 0 260px;
  background:#fff; border:1px solid var(--nb-border); border-radius:var(--nb-radius);
  padding:16px 18px; box-shadow:var(--nb-shadow);
}
.review-card__head{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.review-card__avatar{
  width:36px; height:36px; border-radius:50%; background:var(--nb-bg-2); color:var(--nb-black);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; flex-shrink:0;
  position:relative;
}
.review-card__platform{
  position:absolute; right:-4px; bottom:-4px; width:16px; height:16px; border-radius:50%;
  background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 1.5px #fff;
}
.review-card__platform svg{ width:12px; height:12px; }
.review-card__name{ font-weight:700; font-size:.9rem; }
.review-card__date{ font-size:.75rem; color:var(--nb-muted); }
.review-card__stars{ color:var(--nb-yellow-dark); letter-spacing:1px; margin-bottom:8px; }
.review-card p{ font-size:.86rem; color:var(--nb-body); line-height:1.5; }
.review-card p.is-clamped{
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.review-card__more{
  display:inline-block; margin-top:4px; font-size:.82rem; font-weight:700; color:var(--nb-text);
  text-decoration:underline; cursor:pointer; background:none; border:none; padding:0;
}
.review-summary__platform{ display:flex; align-items:center; gap:6px; margin-top:4px; }
.review-summary__platform svg{ width:16px; height:16px; }
.review-summary__platform span{ font-size:.78rem; color:var(--nb-muted); font-weight:600; }
.review-summary{
  display:flex; align-items:center; gap:14px; flex:0 0 auto; scroll-snap-align:start;
  padding-right:10px; padding-left:2px;
}
.review-summary b{ display:block; font-size:1.6rem; }
/* El "4,9" quedaba pegado al borde izquierdo en mobile — las review-card sí
   tienen aire propio (padding:16px 18px) pero el summary no llevaba ninguno
   adicional al gutter del contenedor. Aviso del dueño 2026-10-04. */
@media (max-width:600px){
  .review-summary{ padding-left:4px; }
}

/* Carrusel horizontal de fotos "Lo que vivirás" en la ficha de viaje. */
.media-carousel{
  display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px;
}
.media-carousel::-webkit-scrollbar{ height:8px; }
.media-carousel::-webkit-scrollbar-thumb{ background:var(--nb-border-2); border-radius:8px; }
.media-carousel__item{ flex:0 0 260px; scroll-snap-align:start; }
.media-carousel__item img{
  width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--nb-radius); display:block;
}
.media-carousel__item p{ margin:10px 0 0; font-weight:600; font-size:.88rem; }
@media (max-width:600px){ .media-carousel__item{ flex-basis:72vw; } }

/* Catálogo (/listado-viajes/), 2026-10-08: ya NO es su propio grid de fotos
   grandes — pedido explícito del dueño ("tenemos homogeneizado en desktop
   todas las tiras con todas las fechas de viaje"), ahora reutiliza el mismo
   patrón de tira compacta (trip-grid--rows) que la home y cada
   destino-pais-X.html, en vez de reinventar un card propio por página. El
   grid plano sigue siendo la fuente para desktop (lista vertical de tiras,
   ver @media min-width:860px de trip-grid--rows) y para el conteo del filtro.
   29-oct (Berto): fuera la vista móvil agrupada por mes (los títulos de mes no
   aportaban nada y además duplicaba el listado): en móvil se ve el mismo listado
   que en escritorio, con la fecha en cada tarjeta. */

.trip-card__dates--on-media{
  position:absolute; left:10px; bottom:10px; z-index:1;
  background:rgba(26,26,26,.75); color:#fff; backdrop-filter:blur(2px);
  font-size:.78rem; font-weight:700; padding:5px 11px; border-radius:999px;
}

/* En desktop, fila horizontal con scroll-snap en vez de grid que envuelve.
   En mobile (pedido explícito 2026-09-30, "viaje por viaje"): también en
   horizontal, pero con 1 tarjeta grande visible por pantalla en vez del
   grid de 2 columnas compacto de rondas anteriores. */
/* .trip-grid.trip-grid--scroll a propósito (no solo .trip-grid--scroll):
   .trip-grid (más abajo en el fichero) pone display:grid con la MISMA
   especificidad de una sola clase, y al estar declarado después ganaba y
   rompía el scroll horizontal en mobile en los 4 sitios que usan esta
   combinación (home, viaje.html, /destinos/europa/islandia/, /destinos/asia/maldivas/)
   — bug real, no decisión de diseño: el scroll horizontal en mobile ya
   estaba documentado como objetivo en README-preview.html. */
.trip-grid.trip-grid--scroll{
  display:flex; flex-wrap:nowrap; overflow-x:auto; scroll-snap-type:x mandatory;
  padding-bottom:14px; margin-bottom:-14px;
}
.trip-grid--scroll::-webkit-scrollbar{ height:8px; }
.trip-grid--scroll::-webkit-scrollbar-thumb{ background:var(--nb-border-2); border-radius:8px; }
/* .trip-grid.trip-grid--scroll a propósito (mismo motivo que el display:flex
   de arriba): .trip-grid .trip-card{ flex-basis:auto } tiene la misma
   especificidad y está declarado después, así que sin el prefijo ganaba y
   la tarjeta crecía al tamaño natural de la foto (carta "gigante" en mobile
   reportada por el dueño justo al arreglar el scroll horizontal). */
.trip-grid.trip-grid--scroll .trip-card{ flex:0 0 78vw; scroll-snap-align:start; }
@media (min-width: 560px){
  .trip-grid.trip-grid--scroll .trip-card{ flex:0 0 270px; }
  .trip-grid.trip-grid--scroll.trip-grid--compact .trip-card{ flex:0 0 200px; }
}

/* ---------------------------------------------------------------------
   Tarjetas de viaje
--------------------------------------------------------------------- */
.trip-scroller{
  display:flex; gap:20px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x mandatory;
  margin-inline: calc(var(--nb-gutter) * -1); padding-inline: var(--nb-gutter);
  scroll-padding-inline: var(--nb-gutter);
}
.trip-scroller::-webkit-scrollbar{ height:8px; }
.trip-scroller::-webkit-scrollbar-thumb{ background:var(--nb-border-2); border-radius:8px; }

.trip-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:22px; }

/* Variante compacta: sustituye al scroll horizontal (pedido explícito del
   dueño — quitar scroll horizontal, que quepan más viajes sin que las
   fotos dominen la pantalla, menos "agencia clásica"). */
.trip-grid--compact{ grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px; }
.trip-grid--compact .trip-card__media{ aspect-ratio:16/9; }
.trip-grid--compact .trip-card__body{ padding:10px; gap:4px; }
.trip-grid--compact .trip-card__title{ font-size:.86rem; }
.trip-grid--compact .trip-card__dates{ font-size:.7rem; }
.trip-grid--compact .trip-card__meta{ font-size:.76rem; }
.trip-grid--compact .price .new{ font-size:.98rem; }
.trip-grid--compact .price .old{ font-size:.76rem; }
.trip-grid--compact .badge{ font-size:.66rem; padding:4px 8px; }

.trip-card{
  scroll-snap-align:start; flex:0 0 280px;
  background:#fff; border:1px solid var(--nb-border); border-radius:var(--nb-radius);
  overflow:hidden; box-shadow:var(--nb-shadow); transition:box-shadow .15s ease, transform .15s ease;
  display:flex; flex-direction:column;
}
.trip-grid .trip-card{ flex-basis:auto; }
.trip-card:hover{ box-shadow:var(--nb-shadow-lift); transform:translateY(-2px); }
.trip-card__media{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.trip-card__media img{ width:100%; height:100%; object-fit:cover; }
.trip-card__badges{ position:absolute; top:10px; left:10px; right:10px; display:flex; justify-content:space-between; gap:8px; }
.badge{ font-size:.72rem; font-weight:700; padding:5px 10px; border-radius:999px; }
.badge-status-confirmed{ background:var(--nb-success-bg); color:var(--nb-success-fg); }
.badge-status-almost{ background:var(--nb-info-bg); color:var(--nb-info-fg); }
.badge-status-last{ background:var(--nb-warn-bg); color:var(--nb-warn-fg); }
.badge-discount{ background:var(--nb-black); color:var(--nb-yellow); }
.badge-earlybee{ background:var(--nb-yellow); color:var(--nb-black); }

.trip-card__body{ padding:16px; display:flex; flex-direction:column; gap:8px; flex:1; }
.trip-card__dates{ font-size:.78rem; color:var(--nb-muted); font-weight:600; text-transform:uppercase; letter-spacing:.03em; }
.trip-card__title{ font-family:var(--font-body); font-weight:700; font-size:1.02rem; margin:0; }
.trip-card__title-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.trip-card__status-pill{ display:none; }
.trip-card__meta{ font-size:.85rem; color:var(--nb-muted); }
.trip-card__footer{ margin-top:auto; display:flex; align-items:flex-end; justify-content:space-between; gap:10px; padding-top:8px; border-top:1px dashed var(--nb-border); }
.price{ display:flex; align-items:baseline; gap:8px; }
.price .old{ text-decoration:line-through; color:var(--nb-price-old); font-size:.85rem; }
.price .new{ font-weight:800; font-size:1.15rem; color:var(--nb-price-plain); }
/* Solo verde cuando hay un precio tachado al lado (rebaja real) — sin :has()
   un .new suelto (sin oferta) se queda en el ámbar de precio normal. */
.price:has(.old) .new{ color:var(--nb-price-new); }
.trip-card__coord{ font-size:.78rem; color:var(--nb-muted); }

/* Calendario de "próximos viajes" en desktop: tiras horizontales, como en
   nomadbee.es/viajes/viajes-confirmados/ — miniatura + info + coordinador +
   precio + CTA en una sola fila. En mobile/tablet sigue siendo trip-grid--scroll
   (tarjetas una a una). */
/* Estas 3 reglas aplican en TODOS los anchos (no solo escritorio): fecha
   centrada en medio de la foto (igual que en nomadbee.es real), solo el
   badge de Early Bee se queda sobre la foto, el estado (confirmado/casi
   confirmado/últimas plazas) pasa a texto plano en la caja de info — nunca
   dentro de la imagen. Pedido explícito del dueño 2026-10-04: antes esto
   solo se aplicaba en escritorio (≥860px) y el mobile seguía mostrando la
   píldora de color sobre la foto y la fecha pegada abajo a la izquierda. */
.trip-grid--rows .trip-card__dates--on-media{
  position:absolute; inset:0; z-index:1; display:flex; flex-direction:row; align-items:center;
  justify-content:center; gap:6px; color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.65);
  background:none; backdrop-filter:none; padding:0; border-radius:0; pointer-events:none;
}
.trip-grid--rows .trip-card__dates--on-media strong{
  font-family:var(--font-display); font-weight:800; font-size:1.5rem; line-height:1;
}
.trip-grid--rows .trip-card__dates--on-media em{
  font-style:normal; font-weight:700; font-size:.92rem; letter-spacing:.02em; text-transform:uppercase;
}
/* En móvil la foto es más grande en proporción (tarjeta en columna) y la
   fecha se quedaba pequeña — en escritorio (≥860px, ver más abajo) la foto
   se encoge a un 22% de ancho, así que ahí el tamaño base ya está bien.
   Tamaños reducidos 2026-10-08 (feedback del dueño: el número quedaba
   desproporcionado frente al mes, sobre todo en desktop). */
@media (max-width:859px){
  .trip-grid--rows .trip-card__dates--on-media strong{ font-size:2.1rem; }
  .trip-grid--rows .trip-card__dates--on-media em{ font-size:1.1rem; }
  /* Pedido del dueño 2026-10-16: mejor aprovechamiento del espacio en móvil
     — precio un poco más grande (el número de fecha se queda como está, ya
     se redujo antes por quedar desproporcionado) y el botón "Coordi" con un
     área de toque más generosa (antes ~34px de alto, por debajo del mínimo
     táctil recomendado de 44px). */
  .trip-grid--rows .trip-card__footer .price .new{ font-size:1.3rem; }
  .trip-grid--rows .trip-card__footer .price .old{ font-size:.82rem; }
  .trip-grid--rows .trip-card__meta .coord-mini{ min-height:40px; padding:6px 14px 6px 6px; }
  .trip-grid--rows .trip-card__meta .coord-mini__avatar{ width:30px; height:30px; }
}
.trip-grid--rows .trip-card__badges{ top:6px; left:6px; right:auto; z-index:1; flex-direction:column; align-items:flex-start; gap:3px; }
/* 2026-10-08: se quitó el badge "Oferta Early Bee 🐝" de las tiras ("añade
   ruido"). 2026-10-09, Berto pide lo contrario explícitamente ("si tiene
   oferta se le ponga y la Early Bee también") — revertido. El estado
   (confirmado/casi confirmado/últimas plazas) se queda oculto aquí porque ya
   se repite como texto plano en .trip-card__status-pill; Early Bee y el
   descuento SÍ se muestran, no están duplicados en ningún otro sitio de la
   tarjeta. */
.trip-grid--rows .trip-card__badges .badge{ display:none; }
.trip-grid--rows .trip-card__badges .badge-earlybee,
.trip-grid--rows .trip-card__badges .badge-discount{ display:inline-block; font-size:.66rem; padding:3px 8px; }
.trip-grid--rows .trip-card__status-pill{
  display:inline-block; font-size:.76rem; font-weight:600; color:var(--nb-muted); white-space:nowrap;
}

/* Pedido explícito del dueño 2026-10-09: en mobile, las fechas de un viaje
   van en columna (una tarjeta debajo de otra), sin scroll horizontal, para
   ver todas sin desplazar — como en nomadbee.es hoy. Sustituye la decisión
   anterior (2026-09-30) de scroll horizontal con 1 tarjeta grande por
   pantalla en mobile; esa sigue existiendo para trip-grid--scroll SIN
   --rows (p. ej. "Nuestros próximos viajes" de la home), solo se quita
   aquí para el patrón de tira/fila. En mobile la tarjeta cae al layout
   normal de .trip-card (foto arriba, cuerpo debajo); el tratamiento de
   "tira horizontal" (foto 22% al lado del texto) sigue siendo solo de
   escritorio, ver @media (min-width:860px) más abajo. */
.trip-grid--scroll.trip-grid--compact.trip-grid--rows .trip-card,
.trip-grid--rows .trip-card{
  flex:1 1 auto; width:100%; max-width:none; overflow:hidden; min-height:0;
}
.trip-grid.trip-grid--scroll.trip-grid--rows{
  display:flex; flex-direction:column; gap:8px; overflow-x:visible; scroll-snap-type:none;
  padding-bottom:0; margin-bottom:0;
}

@media (min-width:860px){
  /* Especificidad reforzada a propósito: .trip-grid--scroll.trip-grid--compact
     .trip-card (más arriba en el fichero) fija flex:0 0 200px para el modo
     tarjeta horizontal — en modo filas (columna) esa misma regla convierte
     ese "ancho de 200px" en ALTURA de 200px, y gana por especificidad aunque
     esta regla esté definida después. De ahí la fila que no bajaba de 200px
     por mucho que se encogieran la foto y el texto. */
  .trip-grid--scroll.trip-grid--compact.trip-grid--rows .trip-card,
  .trip-grid--rows .trip-card{
    flex-direction:row; align-items:center; gap:0;
  }
  /* Foto rectangular ancha (~22% de la tira, no cuadrada) con aspect-ratio FIJO
     — referencia de proporción tomada de las tiras reales de nomadbee.es
     (col-md-3 de un grid de 12, imagen 2.1:1). El aspect-ratio fijo es
     imprescindible: sin él, la altura de cada foto depende de las dimensiones
     naturales de CADA imagen (align-items:stretch/auto), y la fila vuelve a
     estirarse sola — es el bug que ya se repitió dos veces en esta ronda. */
  .trip-grid--rows .trip-card__media{
    width:22%; aspect-ratio:2.3/1; flex:0 0 22%; border-radius:0;
    margin:0; position:relative; overflow:hidden;
  }
  .trip-grid--rows .trip-card__media img{ width:100%; height:100%; object-fit:cover; display:block; }
  .trip-grid--rows .trip-card__media::after{
    content:""; position:absolute; inset:0;
    background:linear-gradient(to top, rgba(0,0,0,.4), rgba(0,0,0,0) 65%);
  }
  .trip-grid--rows .trip-card__body{
    flex-direction:row; align-items:center; gap:14px; padding:8px 14px; flex:1; min-width:0;
  }
  .trip-grid--rows .trip-card__body p{ margin:0; }
  .trip-grid--rows .trip-card__info{ flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; justify-content:center; }
  .trip-grid--rows .trip-card__info > .trip-card__meta{ display:none; }
  /* Columna, no fila: antes el estado (Confirmado/Casi confirmado…) se
     quedaba AL LADO del título cuando era corto y DEBAJO cuando el título
     era largo y envolvía — inconsistente entre tarjetas (feedback
     2026-10-08). Ahora siempre debajo, para todas las tarjetas igual. */
  .trip-grid--rows .trip-card__title-row{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; }
  .trip-grid--rows .trip-card__title{ font-size:.86rem; }
  /* order:-1 quitado a propósito 2026-10-08: ponía la fecha completa ENCIMA
     del título+estado en vez de debajo (el orden real del HTML, y el que
     pide el dueño: título con su píldora primero, fecha como línea de apoyo
     después) — bug heredado de antes de que existiera trip-card__title-row,
     nunca se quitó al añadirlo. */
  .trip-grid--rows .trip-card__dates{ text-transform:none; font-weight:500; letter-spacing:0; font-size:.72rem; color:var(--nb-muted); }
  /* Pedido explícito del dueño 2026-10-07: el chip con fondo de "Coordi" que
     ya se ve bien en móvil debe verse igual en escritorio, no aplanado. */
  .trip-grid--rows .coord-mini{ flex:0 0 auto; gap:7px; }
  .trip-grid--rows .coord-mini__avatar{ width:26px; height:26px; font-size:.78rem; }
  .trip-grid--rows .trip-card__footer{
    margin-top:0; border-top:none; padding-top:0; flex:0 0 auto; flex-direction:row; align-items:center; gap:14px;
  }
}

/* ---------------------------------------------------------------------
   Testimonios / confianza
--------------------------------------------------------------------- */
.stat-row{ display:flex; flex-wrap:wrap; gap:32px; }
.stat{ min-width:120px; }
.stat b{ display:block; font-family:var(--font-display); font-size:2rem; color:var(--nb-yellow); }
.stat span{ font-size:.85rem; color:rgba(255,255,255,.75); }

/* "¿Por qué viajar en grupo con Nomad Bee?" — bloque que se repite en las
   landings reales (/listado-viajes/, 2026-10-08), copy literal de nomadbee.es,
   mismo fondo oscuro con foto que .section--dark .section--photo. */
.why-group-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:32px; margin-top:8px;
}
.why-group-item{ text-align:center; }
.why-group-item__icon{ margin:0 auto 14px; display:block; }
.why-group-item__icon--emoji{ font-size:2.6rem; line-height:1; width:52px; height:52px; }
.why-group-item h3{ color:#fff; font-size:1.05rem; margin-bottom:.4em; }
.why-group-item p{ color:rgba(255,255,255,.78); font-size:.9rem; margin:0; }

/* ---------------------------------------------------------------------
   Footer
--------------------------------------------------------------------- */
.site-footer{ background:var(--nb-black); color:rgba(255,255,255,.82); padding-block:56px 24px; }
.footer-grid{ display:grid; grid-template-columns:minmax(0,1.2fr) repeat(4,minmax(0,1fr)); gap:28px; margin-bottom:40px; }
.footer-grid h4{ color:#fff; font-family:var(--font-body); font-weight:700; font-size:.9rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:14px; }
.footer-grid ul{ display:flex; flex-direction:column; gap:9px; font-size:.9rem; }
.footer-grid a:hover{ color:var(--nb-yellow); }
.footer-brand img{ height:36px; margin-bottom:14px; }
.footer-brand p{ font-size:.85rem; max-width:32ch; color:rgba(255,255,255,.6); }
.social-row{ display:flex; gap:10px; margin-top:16px; }
.social-row a{ width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; }
.social-row a:hover{ background:var(--nb-yellow); color:var(--nb-black); }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.12); padding-top:20px; display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; font-size:.78rem; color:rgba(255,255,255,.55); }
@media (max-width:480px){ .footer-bottom{ padding-right:64px; } } /* el botón de WhatsApp (derecha) no tapa "CICMA nº 4504" al final de la página */

/* ---------------------------------------------------------------------
   Blog — grid
--------------------------------------------------------------------- */
.blog-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:22px; }
.blog-grid .blog-card h3{ font-size:1rem; }
.blog-grid .blog-card p{ font-size:.86rem; }
.blog-card{ display:flex; flex-direction:column; gap:12px; }
.blog-card__media{ position:relative; border-radius:var(--nb-radius); overflow:hidden; aspect-ratio:4/3; }
.blog-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.blog-card:hover .blog-card__media img{ transform:scale(1.04); }
.blog-card__cat{ position:absolute; top:10px; left:10px; background:rgba(26,26,26,.75); color:#fff; font-size:.72rem; font-weight:700; padding:5px 10px; border-radius:999px; backdrop-filter:blur(3px); }
.blog-card__meta{ font-size:.78rem; color:var(--nb-muted); display:flex; gap:10px; align-items:center; }
.blog-card__meta .dot{ width:3px; height:3px; border-radius:50%; background:var(--nb-border-2); }
.blog-card h3{ font-family:var(--font-body); font-weight:700; font-size:1.05rem; margin:0; }
.blog-card p{ font-size:.9rem; color:var(--nb-muted); margin:0; }

/* ---------------------------------------------------------------------
   Artículo de blog
--------------------------------------------------------------------- */
.post-hero{ position:relative; height:min(48vh,420px); }
.post-hero img{ width:100%; height:100%; object-fit:cover; }
.post-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(26,26,26,.05),rgba(26,26,26,.72)); }
.post-hero-content{ position:absolute; z-index:1; left:0; right:0; bottom:0; padding-block:32px; color:#fff; }
.breadcrumb{ font-size:.82rem; color:rgba(255,255,255,.85); margin-bottom:10px; }
.breadcrumb a:hover{ text-decoration:underline; }

.post-layout{ display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:56px; align-items:start; padding-block:44px; }
.post-meta-row{ display:flex; align-items:center; gap:14px; margin-bottom:28px; padding-bottom:22px; border-bottom:1px solid var(--nb-border); }
.avatar{ width:42px; height:42px; border-radius:50%; object-fit:cover; }
.post-meta-row .who b{ display:block; font-size:.92rem; }
.post-meta-row .who span{ font-size:.8rem; color:var(--nb-muted); }

.prose{ font-size:1.05rem; color:var(--nb-body); max-width:68ch; }
.prose p{ margin-bottom:1.2em; text-align:left; }
.prose h2{ margin-top:1.6em; font-size:1.5rem; }
.prose h3{ margin-top:1.3em; font-size:1.2rem; }
.prose img{ border-radius:var(--nb-radius); margin-block:1.4em; }
.prose blockquote{
  margin:1.6em 0; padding:4px 0 4px 20px; border-left:3px solid var(--nb-yellow);
  font-style:italic; color:var(--nb-muted);
}

.toc{ position:sticky; top:96px; background:var(--nb-bg-2); border-radius:var(--nb-radius); padding:20px; }
.toc h4{ font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:12px; color:var(--nb-muted); }
.toc ul{ display:flex; flex-direction:column; gap:9px; font-size:.9rem; }
.toc a{ display:block; padding:2px 0; }
.toc a:hover{ color:var(--nb-black); font-weight:600; }
.toc-cta{ margin-top:18px; padding-top:18px; border-top:1px solid var(--nb-border-2); }
.toc-cta p{ font-size:.85rem; margin-bottom:10px; }

.inline-trip-cta{
  margin-block:2em; padding:22px; border-radius:var(--nb-radius); background:var(--nb-bg-2);
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
}
.inline-trip-cta img{ width:96px; height:72px; object-fit:cover; border-radius:10px; flex-shrink:0; }
.inline-trip-cta .txt{ flex:1; min-width:180px; }
.inline-trip-cta .txt b{ display:block; font-size:.98rem; }
.inline-trip-cta .txt span{ font-size:.85rem; color:var(--nb-muted); }

/* ---------------------------------------------------------------------
   Ficha de viaje
--------------------------------------------------------------------- */
.gallery{
  display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr); grid-template-rows:1fr 1fr; gap:8px;
  border-radius:var(--nb-radius-lg); overflow:hidden; height:min(56vh,460px);
  position:relative;
}
.gallery a{ display:block; height:100%; overflow:hidden; position:relative; }
.gallery img{ width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.gallery a:hover img{ transform:scale(1.04); }
.gallery a:first-child{ grid-row:1/3; }
.gallery-all{
  position:absolute; right:16px; bottom:16px; background:#fff; padding:9px 16px;
  border-radius:999px; font-size:.85rem; font-weight:700; box-shadow:var(--nb-shadow-lift);
  display:flex; align-items:center; gap:8px;
}

/* Landing de destino: una sola foto de portada (el mosaico es solo para la ficha de un viaje
   con fecha exacta, día a día) */
/* Portada de ficha de destino: ancho completo de verdad (como el .hero de la
   home), no solo el ancho del container — antes se quedaba dentro del
   container con bordes redondeados y el h1 iba debajo, no encima de la foto;
   pedido explícito del dueño 2026-10-08: "yo sí que pondría el ancho total de
   toda la web". Técnica 100vw + margen negativo en vez del simple
   margin-inline:-gutter (ese solo cancela el padding del container, no
   rompe su max-width); por eso body necesita overflow-x:hidden (ver más abajo
   en el fichero), si no el 100vw desborda por el ancho de la scrollbar. */
.hero-cover{
  position:relative; width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);
  height:min(56vh,460px); overflow:hidden; display:flex; align-items:flex-end; color:#fff;
}
.hero-cover img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.hero-cover::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(26,26,26,.12) 0%, rgba(26,26,26,.04) 38%, rgba(26,26,26,.78) 100%);
}
.hero-cover__content{
  position:relative; z-index:2; width:100%; max-width:var(--nb-container); margin-inline:auto;
  padding:0 var(--nb-gutter) 32px;
}
.hero-cover__content h1{ color:#fff; text-shadow:0 2px 18px rgba(0,0,0,.3); max-width:26ch; margin-bottom:.3em; }
.hero-cover__content p.lead{ color:rgba(255,255,255,.92); text-shadow:0 1px 10px rgba(0,0,0,.25); max-width:62ch; }

/* Variante centrada: pedido del dueño 2026-10-09 para las landings de
   destino — en la imagen de portada solo va la keyword (H1), centrada,
   sin el párrafo de explicación encima (ese baja a un bloque de texto
   aparte, debajo del hero). */
.hero-cover--center{ align-items:center; justify-content:center; text-align:center; }
.hero-cover--center::after{
  background:linear-gradient(180deg, rgba(26,26,26,.32) 0%, rgba(26,26,26,.18) 45%, rgba(26,26,26,.45) 100%);
}
.hero-cover__content--center{ padding-bottom:0; display:flex; justify-content:center; }
.hero-cover__content--center h1{ max-width:none; }

.trip-header{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; align-items:flex-start; padding-block:28px 8px; }
.trip-header h1{ margin-bottom:.2em; }
.trip-header .facts{ display:flex; gap:18px; flex-wrap:wrap; font-size:.9rem; color:var(--nb-muted); }
.trip-header .facts span{ display:flex; align-items:center; gap:6px; }

.tab-row{
  display:flex; gap:6px; overflow-x:auto; border-bottom:1px solid var(--nb-border);
  position:sticky; top:73px; background:#fff; z-index:50; padding-top:6px;
}
.tab-row a{
  padding:12px 16px; font-weight:600; font-size:.92rem; color:var(--nb-muted);
  border-bottom:3px solid transparent; white-space:nowrap;
}
.tab-row a:hover{ color:var(--nb-black); }
.tab-row a.is-active{ color:var(--nb-black); border-color:var(--nb-yellow); }
.tab-row__deposit{
  margin-left:auto; flex-shrink:0; font-size:.85rem; font-weight:700;
  color:var(--nb-black); background:var(--nb-yellow); padding:8px 14px;
  border-radius:999px; border-bottom:none !important;
}
.tab-row__deposit:hover{ background:var(--nb-yellow-dark); }

.trip-layout{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:56px; align-items:start; padding-block:32px 20px; }

.day-item{ padding-block:4px; border-top:1px solid var(--nb-border); }
.day-item:first-child{ border-top:none; }
.day-item__summary{
  display:flex; align-items:center; gap:16px; padding-block:14px; cursor:pointer; list-style:none;
}
.day-item__summary::-webkit-details-marker{ display:none; }
.day-num{
  flex-shrink:0; width:40px; height:40px; border-radius:50%; background:var(--nb-black); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:.9rem;
}
.day-item__summary h4{ margin:0; font-size:1rem; flex:1; }
.day-item__chevron{
  flex-shrink:0; color:var(--nb-muted); transition:transform .2s ease; font-size:.85rem;
}
.day-item[open] .day-item__chevron{ transform:rotate(180deg); }
.day-item__content{ padding:0 0 18px 80px; }
.day-item__content p{ margin:0; font-size:.92rem; color:var(--nb-muted); }
.day-item__content p + p{ margin-top:8px; }
.day-item__tags{ font-size:.78rem !important; color:var(--nb-muted); opacity:.85; }

/* Bloques "Estilo de viaje" / "Información vuelos" — sin caja de color de
   fondo (WeRoad los deja monocromos), solo un acento sutil a la izquierda
   en el que de verdad importa destacar (vuelos). */
.info-box--plain{ padding:0; background:none; }
.info-box--plain h4{ margin:0 0 6px; font-size:.95rem; }
.info-box--plain p{ margin:0; font-size:.88rem; line-height:1.5; }
.info-box--accent{ padding:14px 16px; background:var(--nb-bg-2); border-radius:var(--nb-radius-sm); }
@media (max-width:600px){ .day-item__content{ padding-left:0; } }

.before-trip-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; margin-top:16px; }
.before-trip-card{
  display:flex; gap:14px; align-items:flex-start; padding:16px; border-radius:14px;
  background:var(--nb-bg-2); border:1px solid var(--nb-border);
}
.before-trip-card__icon{
  flex-shrink:0; width:38px; height:38px; border-radius:50%; background:var(--nb-yellow);
  display:flex; align-items:center; justify-content:center; font-size:1.1rem;
}
.before-trip-card strong{ display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--nb-muted); margin-bottom:4px; }
.before-trip-card p{ margin:0; font-size:.9rem; line-height:1.5; }

.check-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:10px 22px; }
.check-item{ display:flex; gap:10px; font-size:.92rem; align-items:flex-start; }
.check-item svg{ flex-shrink:0; margin-top:3px; }
.check-item__icon{ width:26px; height:26px; flex-shrink:0; object-fit:contain; }
.check-item.is-no{ color:var(--nb-muted); }
.check-item.is-no .x-mark{ color:#D6342C; font-weight:700; }

details.faq-item{ border-top:1px solid var(--nb-border); padding-block:14px; }
details.faq-item:last-child{ border-bottom:1px solid var(--nb-border); }
details.faq-item summary{
  cursor:pointer; font-weight:600; font-size:.98rem; list-style:none; display:flex;
  justify-content:space-between; align-items:center; gap:12px; padding-right:4px;
}
details.faq-item summary::-webkit-details-marker{ display:none; }
details.faq-item summary::after{ content:"+"; font-size:1.4rem; color:var(--nb-muted); flex-shrink:0; }
details.faq-item[open] summary::after{ content:"–"; }
details.faq-item p{ margin:12px 0 0; font-size:.92rem; color:var(--nb-muted); max-width:62ch; }
/* 29-oct: nota aclaratoria bajo una respuesta (letra más pequeña y en cursiva) */
details.faq-item p.faq-note{ margin-top:6px; font-size:.8rem; font-style:italic; }

.booking-card{
  position:sticky; top:132px; border:1px solid var(--nb-border); border-radius:var(--nb-radius-lg);
  box-shadow:var(--nb-shadow-lift); padding:22px; background:#fff;
}
.booking-card .price{ margin-bottom:4px; }
.booking-card .price .new{ font-size:1.6rem; }
.booking-card .price-note{ font-size:.8rem; color:var(--nb-muted); margin-bottom:16px; }
.booking-card .trust{ margin-top:16px; display:flex; flex-direction:column; gap:9px; font-size:.82rem; color:var(--nb-muted); }
.booking-card .trust span{ display:flex; gap:8px; align-items:center; }
.booking-card select{
  width:100%; padding:11px 12px; border-radius:var(--nb-radius-sm); border:1px solid var(--nb-border-2);
  font-family:inherit; font-size:.9rem; margin-bottom:12px; background:#fff;
}
.booking-card__fixed-date{
  padding:10px 12px; margin-bottom:12px; border-radius:var(--nb-radius-sm); background:var(--nb-bg-2);
  display:flex; flex-direction:column; gap:4px;
}
.booking-card__fixed-date > span:first-child{ font-weight:700; font-size:.92rem; }
.booking-card__fixed-date a{ font-size:.8rem; color:var(--nb-muted); text-decoration:underline; }

.sticky-cta-mobile{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:180;
  background:#fff; border-top:1px solid var(--nb-border); padding:10px 16px;
  padding-bottom:calc(10px + env(safe-area-inset-bottom));
  box-shadow:0 -6px 20px rgba(26,26,26,.12);
  align-items:center; gap:12px;
}
.sticky-cta-mobile .price{ flex:1; }
.sticky-cta-mobile .price .new{ font-size:1.05rem; }

/* ---------------------------------------------------------------------
   "Solo pagas la reserva" — precio de depósito vs. total del viaje.
   La cifra grande SIEMPRE es lo que se cobra hoy (la reserva); el total
   del viaje va como nota secundaria, nunca al revés — así no hay
   sorpresa de cobro en ningún punto del funnel (ver docs/mision, memoria
   nomadvia_sales_ops_process: 150€ ahora, resto por link hasta 30 días
   antes de viajar).
--------------------------------------------------------------------- */
.price-deposit-note{ font-size:.78rem; color:var(--nb-muted); margin-top:2px; }
.price-deposit-note b{ color:var(--nb-body); font-weight:700; }

.price-deposit{ display:flex; flex-direction:column; }
.price-deposit .amount{ font-family:var(--font-display); font-size:1.3rem; }
.price-deposit .label{ font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--nb-muted); font-weight:700; }
.price-deposit .price-note{ font-size:.78rem; color:var(--nb-muted); }

.deposit-callout{
  display:flex; gap:10px; align-items:flex-start; background:var(--nb-success-bg); color:var(--nb-success-fg);
  border-radius:var(--nb-radius-sm); padding:12px 14px; font-size:.85rem; margin-block:16px;
}
.deposit-callout b{ display:block; margin-bottom:2px; }

/* ---------------------------------------------------------------------
   Hubs de categoría (destinos, tipos de viaje) y módulos "relacionados"
--------------------------------------------------------------------- */
.category-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.category-card{
  position:relative; border-radius:var(--nb-radius-lg); overflow:hidden; aspect-ratio:4/3;
  display:flex; align-items:flex-end; box-shadow:var(--nb-shadow);
}
.category-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.category-card:hover img{ transform:scale(1.05); }
.category-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(26,26,26,0) 40%,rgba(26,26,26,.75) 100%); }
.category-card__body{ position:relative; z-index:1; padding:18px; color:#fff; }
.category-card__body b{ display:block; font-family:var(--font-display); font-size:1.05rem; }
.category-card__body span{ font-size:.8rem; color:rgba(255,255,255,.85); }

.section-cta-row{ display:flex; justify-content:center; margin-top:32px; }

/* ---------------------------------------------------------------------
   Cabecera de página interior (catálogo, contacto, FAQ, legal...)
--------------------------------------------------------------------- */
.page-hero{ background:var(--nb-bg); padding-block:40px 8px; }
.page-hero h1{ margin-bottom:.25em; }

/* ---------------------------------------------------------------------
   Formularios (contacto, checkout, cuenta)
--------------------------------------------------------------------- */
.field{ display:flex; flex-direction:column; gap:6px; margin-bottom:16px; }
.field label{ font-size:.85rem; font-weight:600; }
.field .req{ color:var(--nb-warn-fg); font-weight:400; }
.field input, .field select, .field textarea{
  border:1px solid var(--nb-border-2); border-radius:var(--nb-radius-sm);
  padding:12px 14px; font-family:inherit; font-size:.95rem; color:var(--nb-body);
  background:#fff; width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:2px solid var(--nb-yellow); outline-offset:1px; border-color:var(--nb-yellow-dark);
}
.field textarea{ resize:vertical; min-height:110px; }
.field-row{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
.checkbox-row{ display:flex; align-items:flex-start; gap:10px; font-size:.85rem; color:var(--nb-muted); margin-bottom:18px; }
.checkbox-row input{ margin-top:3px; }

/* ---------------------------------------------------------------------
   Catálogo de viajes (listado-viajes)
--------------------------------------------------------------------- */
.filter-bar{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  background:#fff; border:1px solid var(--nb-border); border-radius:var(--nb-radius);
  padding:14px; box-shadow:var(--nb-shadow); position:sticky; top:73px; z-index:40; margin-bottom:28px;
}
.filter-bar select{
  border:1px solid var(--nb-border-2); border-radius:999px; padding:9px 14px;
  font-family:inherit; font-size:.86rem; font-weight:600; background:#fff; color:var(--nb-black);
}
/* 29-oct (Berto): filtros del listado con el mismo desplegable propio que el buscador de la home
   (nb-pick, main.js). Misma pinta que .search-card: dos campos con etiqueta y separador. */
.filter-bar[data-nb-pick]{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0; padding:8px;
  border-radius:var(--nb-radius-lg); box-shadow:var(--nb-shadow-lift);
}
.nb-filter{ display:flex; flex-direction:column; gap:4px; padding:8px 14px; border-radius:var(--nb-radius); min-width:0; }
.nb-filter + .nb-filter{ border-left:1px solid var(--nb-border); }
.nb-filter label{ font-size:.72rem; font-weight:600; color:var(--nb-muted); text-transform:uppercase; letter-spacing:.04em; cursor:pointer; }
.nb-filter select{ border:none; border-radius:0; padding:2px 0; font-size:.98rem; background:transparent; }
.nb-filter .nb-pick__btn{ min-width:0; }
.nb-filter .nb-pick__value{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nb-pick__chips--tipo{ grid-template-columns:repeat(2, minmax(0,1fr)); }
.nb-pick .is-none{ opacity:.45; }
.nb-filter:nth-child(2) .nb-pick__panel{ left:auto; right:0; }
@media (max-width:720px){
  .filter-bar[data-nb-pick]{ padding:6px; }
  .nb-filter{ padding:7px 10px; gap:2px; }
  .nb-filter label{ font-size:.66rem; }
  .nb-filter .nb-pick__btn{ font-size:.92rem; gap:6px; }
  /* El panel se abre a lo ancho de la barra (no del campo, que es media pantalla). */
  .filter-bar[data-nb-pick] .nb-pick{ position:static; }
  .filter-bar[data-nb-pick] .nb-pick__panel, .nb-filter:nth-child(2) .nb-pick__panel{ left:0; right:0; width:auto; top:calc(100% + 6px); }
}
/* Muy estrecho: "Cualquier destino" no cabe en media pantalla, un campo debajo del otro (como el buscador de la home). */
@media (max-width:380px){
  .filter-bar[data-nb-pick]{ grid-template-columns:minmax(0,1fr); }
  .nb-filter + .nb-filter{ border-left:none; border-top:1px solid var(--nb-border); }
}
.filter-bar .results-count{ margin-left:auto; font-size:.85rem; color:var(--nb-muted); white-space:nowrap; }
.chip-row{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.chip{
  font-size:.82rem; font-weight:600; padding:7px 14px; border-radius:999px;
  background:var(--nb-bg-2); color:var(--nb-body); border:1px solid transparent; cursor:pointer;
}
.chip.is-active{ background:var(--nb-black); color:#fff; }
.pagination{ display:flex; justify-content:center; gap:8px; margin-top:40px; }
.pagination a{
  width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--nb-border-2); font-weight:600; font-size:.9rem;
}
.pagination a.is-active{ background:var(--nb-black); color:#fff; border-color:var(--nb-black); }

/* ---------------------------------------------------------------------
   Carrito
--------------------------------------------------------------------- */
.cart-layout{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:48px; align-items:start; padding-block:36px 60px; }
.cart-item{ display:grid; grid-template-columns:96px minmax(0,1fr) auto; gap:16px; padding-block:20px; border-top:1px solid var(--nb-border); align-items:center; }
.cart-item:first-child{ border-top:none; }
.cart-item img{ width:96px; height:72px; object-fit:cover; border-radius:var(--nb-radius-sm); }
.cart-item__title{ font-weight:700; font-size:1rem; margin-bottom:4px; }
.cart-item__meta{ font-size:.85rem; color:var(--nb-muted); margin-bottom:8px; }
.cart-item__remove{ font-size:.8rem; color:var(--nb-muted); text-decoration:underline; background:none; border:none; cursor:pointer; padding:0; font-family:inherit; }
.qty-stepper{ display:inline-flex; align-items:center; border:1px solid var(--nb-border-2); border-radius:999px; }
.qty-stepper button{ width:34px; height:34px; border:none; background:none; font-size:1.1rem; cursor:pointer; }
.qty-stepper span{ min-width:24px; text-align:center; font-weight:600; font-size:.9rem; }
.cart-item__price{ text-align:right; font-weight:700; white-space:nowrap; }
.summary-card{
  position:sticky; top:96px; border:1px solid var(--nb-border); border-radius:var(--nb-radius-lg);
  padding:22px; background:var(--nb-bg-2);
}
.summary-row{ display:flex; justify-content:space-between; font-size:.92rem; padding-block:8px; }
.summary-row.total{ border-top:1px solid var(--nb-border-2); margin-top:6px; padding-top:14px; font-weight:800; font-size:1.1rem; }
.promo-row{ display:flex; gap:8px; margin:16px 0; }
.promo-row input{ flex:1; border:1px solid var(--nb-border-2); border-radius:999px; padding:10px 14px; font-family:inherit; }
.empty-state{ text-align:center; padding-block:60px; }
.empty-state .icon-badge{ margin-inline:auto; width:72px; height:72px; }
.empty-state--compact{ padding-block:36px; }
.empty-state--compact p{ margin:0 0 16px; font-size:1.02rem; }
/* Listado (29-oct): la fila de chips de destino es la misma .dest-filter de las landings de fechas */
.dest-filter[data-chip-scroll]{ margin-bottom:10px; }

/* ---------------------------------------------------------------------
   Checkout
--------------------------------------------------------------------- */
.checkout-layout{ display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:48px; align-items:start; padding-block:36px 60px; }
.checkout-step{ margin-bottom:36px; }
.checkout-step__num{
  display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%;
  background:var(--nb-black); color:#fff; font-size:.82rem; font-weight:700; margin-right:10px;
}
.pay-option{
  display:flex; align-items:center; gap:12px; border:1.5px solid var(--nb-border-2); border-radius:var(--nb-radius);
  padding:14px 16px; margin-bottom:10px; cursor:pointer;
}
.pay-option.is-selected{ border-color:var(--nb-black); background:var(--nb-bg-2); }
.pay-option img{ height:22px; }
.order-line{ display:flex; gap:12px; padding-block:12px; border-top:1px solid var(--nb-border); font-size:.88rem; }
.order-line:first-child{ border-top:none; }
.order-line img{ width:52px; height:52px; border-radius:8px; object-fit:cover; flex-shrink:0; }
.trust-strip{ display:flex; flex-wrap:wrap; gap:16px; font-size:.78rem; color:var(--nb-muted); margin-top:18px; }

/* ---------------------------------------------------------------------
   Contacto
--------------------------------------------------------------------- */
.contact-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:48px; padding-block:36px 60px; align-items:start; }
.contact-method{ display:flex; gap:14px; align-items:flex-start; padding-block:16px; border-top:1px solid var(--nb-border); }
.contact-method:first-child{ border-top:none; }
.contact-method .icon-badge{ flex-shrink:0; }
.contact-method h4{ margin:0 0 2px; font-size:.98rem; }
.contact-method p{ margin:0; font-size:.88rem; color:var(--nb-muted); }
.map-placeholder{
  aspect-ratio:16/9; border-radius:var(--nb-radius); background:var(--nb-bg-2);
  display:flex; align-items:center; justify-content:center; color:var(--nb-muted); font-size:.85rem; margin-top:24px;
}

/* ---------------------------------------------------------------------
   FAQ general
--------------------------------------------------------------------- */
.faq-layout{ display:grid; grid-template-columns:260px minmax(0,1fr); gap:48px; padding-block:12px 60px; align-items:start; }
.faq-cat-nav{ position:sticky; top:96px; display:flex; flex-direction:column; gap:2px; }
.faq-cat-nav a{ padding:10px 14px; border-radius:var(--nb-radius-sm); font-weight:600; font-size:.9rem; color:var(--nb-muted); }
.faq-cat-nav a.is-active, .faq-cat-nav a:hover{ background:var(--nb-bg-2); color:var(--nb-black); }
.faq-group{ margin-bottom:44px; }
.faq-group h2{ margin-bottom:6px; }

/* ---------------------------------------------------------------------
   Quiénes somos
--------------------------------------------------------------------- */
.timeline{ display:flex; flex-direction:column; gap:0; }
.timeline-item{ display:grid; grid-template-columns:90px minmax(0,1fr); gap:20px; padding-block:22px; border-top:1px solid var(--nb-border); }
.timeline-item:first-child{ border-top:none; }
.timeline-item b{ font-family:var(--font-display); font-size:1.1rem; }
.team-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:22px; }
.team-card{ text-align:center; }
.team-card img{ border-radius:var(--nb-radius); aspect-ratio:1/1; object-fit:cover; margin-bottom:12px; }
.team-card b{ display:block; font-size:.95rem; }
.team-card span{ font-size:.82rem; color:var(--nb-muted); }

/* ---------------------------------------------------------------------
   Páginas legales
--------------------------------------------------------------------- */
.legal-layout{ display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:56px; align-items:start; padding-block:36px 60px; }
.legal-updated{ font-size:.85rem; color:var(--nb-muted); margin-bottom:28px; }

/* Itinerario resumido día a día (páginas de destino, bloques SEO/GEO
   pedidos 2026-10-08, ver docs/seo-brief-paginas-destino.md) — lista
   numerada con el día en negrita seguido del texto, no tarjetas, para que
   el contenido sea texto real indexable sin depender de JS/slider. */
.itinerary-list{ max-width:70ch; padding-left:0; list-style:none; counter-reset:day; margin-top:18px; }
.itinerary-list li{ position:relative; padding-left:40px; margin-bottom:18px; }
.itinerary-list li::before{
  counter-increment:day; content:counter(day); position:absolute; left:0; top:1px;
  width:26px; height:26px; border-radius:50%; background:var(--nb-yellow); color:var(--nb-black);
  font-weight:800; font-size:.82rem; display:flex; align-items:center; justify-content:center;
}
.itinerary-list b{ display:block; margin-bottom:2px; }

/* Tabla de cookies por servicio (política de cookies) — contenido real
   volcado tal cual del escáner Complianz de la web real, 2026-10-08;
   se presenta en acordeones por servicio en vez de una tabla gigante
   plana, más legible sin cambiar un dato. */
.cookie-services{ margin-top:1.4em; display:flex; flex-direction:column; gap:10px; }
.cookie-service{ border:1px solid var(--nb-border); border-radius:var(--nb-radius); padding:14px 18px; }
.cookie-service summary{ cursor:pointer; display:flex; align-items:center; gap:10px; font-size:.98rem; list-style:none; }
.cookie-service summary::-webkit-details-marker{ display:none; }
.cookie-service summary::before{ content:"▸"; font-size:.8rem; color:var(--nb-muted); }
.cookie-service[open] summary::before{ content:"▾"; }
.cookie-service__cat{ font-size:.74rem; color:var(--nb-muted); font-weight:600; text-transform:uppercase; letter-spacing:.03em; }
.cookie-service__body{ margin-top:10px; }
.cookie-service__body p{ font-size:.92rem; margin-bottom:.6em; }
.cookie-table{ width:100%; border-collapse:collapse; font-size:.82rem; margin-top:8px; }
.cookie-table th, .cookie-table td{ text-align:left; padding:6px 10px; border-bottom:1px solid var(--nb-border); vertical-align:top; }
.cookie-table th{ color:var(--nb-muted); font-weight:600; font-size:.74rem; text-transform:uppercase; letter-spacing:.03em; }
.cookie-table td:first-child{ font-family:monospace; font-size:.78rem; word-break:break-all; }

/* ---------------------------------------------------------------------
   Calendario de puentes (lead magnet, ver docs/mision-claude-code.md y
   memoria nomadvia_lead_magnets_plan — fechas de festivos nacionales 2027
   reales, destinos sugeridos de ejemplo)
--------------------------------------------------------------------- */
.bridge-list{ display:flex; flex-direction:column; gap:18px; }
.bridge-card{
  display:grid; grid-template-columns:200px minmax(0,1fr) auto; gap:22px; align-items:center;
  background:#fff; border:1px solid var(--nb-border); border-radius:var(--nb-radius);
  padding:22px; box-shadow:var(--nb-shadow);
}
.bridge-card--star{ border-color:var(--nb-yellow-dark); box-shadow:var(--nb-shadow-lift); }
.bridge-card__dates{ font-family:var(--font-display); font-weight:700; font-size:1.1rem; }
.bridge-card__dates span{ display:block; font-size:.76rem; font-weight:500; color:var(--nb-muted); font-family:var(--font-body); margin-top:4px; text-transform:uppercase; letter-spacing:.03em; }
.bridge-card__days{ font-size:.9rem; color:var(--nb-muted); margin-bottom:2px; }
.bridge-card__dest{ font-size:.88rem; font-weight:600; }
.bridge-card__dest-label{ font-size:.8rem; font-weight:600; color:var(--nb-muted); margin:10px 0 8px; text-transform:uppercase; letter-spacing:.03em; }
.bridge-card__trips{ display:flex; flex-wrap:wrap; gap:8px; }
.bridge-trip-chip{
  display:flex; flex-direction:column; gap:2px; background:var(--nb-bg-2); border-radius:var(--nb-radius-sm);
  padding:8px 12px; font-size:.82rem; min-width:170px; transition:background .12s ease;
}
.bridge-trip-chip:hover{ background:var(--nb-border-2); }
.bridge-trip-chip__dest{ font-weight:700; }
.bridge-trip-chip__meta{ color:var(--nb-muted); font-size:.78rem; }
.bridge-trip-chip--empty{ color:var(--nb-muted); font-size:.85rem; background:none; padding:0; min-width:0; }
@media (max-width: 720px){
  .bridge-card{ grid-template-columns:minmax(0,1fr); text-align:left; }
}

/* ---------------------------------------------------------------------
   Chequeo de visado/vacunas/seguro (lead magnet) — datos de ejemplo,
   pendiente de matriz real (MAEC / Sanidad Exterior), ver memoria
   nomadvia_lead_magnets_plan
--------------------------------------------------------------------- */
.visa-tool{
  background:#fff; border:1px solid var(--nb-border); border-radius:var(--nb-radius-lg);
  box-shadow:var(--nb-shadow); padding:28px; max-width:660px;
}
.visa-result{ margin-top:22px; padding-top:22px; border-top:1px dashed var(--nb-border); display:none; }
.visa-result.is-visible{ display:block; }
.visa-result .check-grid{ grid-template-columns:minmax(0,1fr); gap:14px; margin-bottom:18px; }
.visa-result [data-visa-known], .visa-result [data-visa-unknown]{ display:none; }
.visa-result [data-visa-known].is-visible, .visa-result [data-visa-unknown].is-visible{ display:block; }
.visa-unknown-text{ font-size:.95rem; color:var(--nb-muted); margin-bottom:14px; }
.visa-unknown-text b{ color:var(--nb-body); }
.visa-source{ font-size:.78rem; color:var(--nb-muted); margin:2px 0 14px; }
.visa-source a{ text-decoration:underline; }
.visa-disclaimer{
  font-size:.8rem; color:var(--nb-muted); background:var(--nb-bg-2); border-radius:var(--nb-radius-sm);
  padding:12px 14px; margin-top:18px;
}

/* ---------------------------------------------------------------------
   Utilidades
--------------------------------------------------------------------- */
.flex-between{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.mt-0{ margin-top:0; }
.text-muted{ color:var(--nb-muted); }
.note-fix{
  border:1px dashed var(--nb-yellow-dark); background:#FFFBEA; border-radius:var(--nb-radius-sm);
  padding:10px 14px; font-size:.8rem; color:#6b5300; margin-block:18px;
}
.note-fix b{ color:#4a3900; }

/* =====================================================================
   Responsive
   ===================================================================== */
@media (max-width: 980px){
  .nav-links, .nav-actions .btn-outline{ display:none; }
  .hamburger{ display:flex; }
  .footer-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  /* minmax(0,1fr), no 1fr a secas: un track "1fr" sin límite inferior sigue
     respetando el ancho mínimo del contenido (min-content) y no se encoge
     por debajo de él — con contenido largo (el aviso de corrección, la
     tarjeta de coordinador...) eso fuerza overflow horizontal en toda la
     página. Encontrado 2026-09-18 al revisar viaje.html en mobile de verdad. */
  .post-layout, .trip-layout, .cart-layout, .checkout-layout, .contact-grid, .faq-layout, .legal-layout{ grid-template-columns:minmax(0,1fr); }
  .toc, .booking-card, .summary-card, .faq-cat-nav{ position:static; }
  .booking-card, .summary-card{ order:-1; }
}

@media (max-width: 720px){
  .search-card{ grid-template-columns:minmax(0,1fr); }
  .search-field + .search-field{ border-left:none; border-top:1px solid var(--nb-border); }
  .footer-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; }
  .gallery{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:auto auto; height:auto; }
  .gallery a{ aspect-ratio:1/1; }
  .gallery a:first-child{ grid-column:1/3; grid-row:auto; aspect-ratio:16/10; }
  .sticky-cta-mobile{ display:flex; }
  .trip-layout .booking-card{ display:none; }
  /* 29-oct: el hueco para la barra fija de reserva solo donde hay barra (antes dejaba una franja blanca de 78 px bajo el pie en todas las páginas). */
  /* overflow-x:clip y no hidden: hidden convertía el body en contenedor de scroll y la cabecera dejaba de ser fija (sticky) en móvil (29-oct). */
  body{ max-width:100vw; overflow-x:clip; }
  body:has(.sticky-cta-mobile){ padding-bottom: calc(var(--nb-sticky-h, 105px) + 24px); } /* alto real de la barra (main.js) + margen */
  .tab-row{ top:65px; }
  .tab-row__deposit{ display:none; }
  /* Grids de 2 columnas escritos como estilo en línea por página (quiénes somos, contacto,
     coordinadores...) — el propio valor de columnas ya lleva minmax(0,...) para no forzar
     overflow, esta regla solo los apila en mobile. Necesita !important porque un estilo en
     línea siempre gana de especificidad a una regla de hoja de estilos. */
  .split-grid{ grid-template-columns: minmax(0,1fr) !important; }
}

@media (max-width: 560px){
  .footer-grid{ grid-template-columns:minmax(0,1fr); gap:28px; }
  .value-grid{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .hero{ min-height:86vh; }
  /* El titular de la home ("Viaja distinto. Conecta con personas que te marcarán para
     siempre.") es mucho más largo que el resto de h1 del sitio — con el suelo general
     de 1.75rem seguía ocupando 4-5 líneas. Un tamaño propio, más pequeño, solo aquí. */
  .hero h1{ font-size:1.55rem; }
}

@media (max-width: 480px){
  /* Debajo de 480px, 2 columnas aprieta demasiado el texto de cada tarjeta
     (reportado por el dueño en "Reserva tus vuelos") — 1 columna. */
  .value-grid{ grid-template-columns:minmax(0,1fr); }
  /* :not(--photo) a propósito: esta regla es para las tarjetas de solo texto
     ("De un vistazo"/"Consejos" en destino-pais*.html) — aplicada sin querer
     también a las tarjetas con foto (Autenticidad, Reserva tus vuelos...),
     que ya traen su propio padding:0 (full-bleed) y se encogían en mobile
     estrecho. Pedido explícito del dueño 2026-10-07: respetar en mobile el
     mismo aspecto de la caja/foto que ya tiene en desktop. */
  .value-card:not(.value-card--photo){ padding:20px 18px; }
  .section-head h2{ font-size:1.5rem; }
}

/* ---------------------------------------------------------------------
   Flechas de scroll en desktop (feedback del dueño 2026-10-08): las tiras
   horizontales (categorías, destinos, "por qué Nomad Bee", próximos viajes)
   ya se movían arrastrando/con la barra, pero en desktop con ratón es más
   cómodo tener flechas visibles a los lados. Solo aparecen desde 860px —
   en mobile el swipe nativo ya es la interacción esperada. Wiring en
   /assets/js/main.js (initScrollRails).
--------------------------------------------------------------------- */
.scroll-rail{ position:relative; }
.scroll-rail__arrow{
  display:none; position:absolute; top:42%; transform:translateY(-50%); z-index:6;
  width:42px; height:42px; border-radius:50%; background:#fff; border:2px solid var(--nb-black);
  align-items:center; justify-content:center; cursor:pointer; box-shadow:2px 2px 0 var(--nb-black);
  font-size:1.2rem; line-height:1; color:var(--nb-black); padding:0; transition:background .15s ease, transform .12s ease;
}
.scroll-rail__arrow:hover{ background:var(--nb-yellow); }
.scroll-rail__arrow:active{ transform:translateY(-50%) translate(1px,1px); box-shadow:1px 1px 0 var(--nb-black); }
.scroll-rail__arrow--prev{ left:-18px; }
.scroll-rail__arrow--next{ right:-18px; }
.scroll-rail__arrow[disabled]{ opacity:.3; cursor:default; pointer-events:none; }
@media (min-width:860px){
  .scroll-rail__arrow{ display:flex; }
  /* Hueco a los lados del contenedor para que las flechas no se monten
     encima de la primera/última tarjeta. */
  .scroll-rail{ padding-inline:30px; margin-inline:-30px; }
}

/* =====================================================================
   CONCEPTO ficha de viaje v2 (viaje-concepto.html, 2026-10-16)
   Benchmark docs/benchmark-intrepid-gadventures-contiki-tourradar-2026-10-16.md
   secciones 7 y 8. Solo lo usa viaje-concepto.html; viaje.html no cambia.
   ===================================================================== */
.concept-banner{
  background:var(--nb-black); color:#fff; font-size:.8rem; text-align:center;
  padding:7px 16px; letter-spacing:.01em;
}
.concept-banner b{ color:var(--nb-yellow); }

/* --- Hero en 2 columnas: galería + tarjeta de datos clave --- */
.trip-title{ margin:14px 0 4px; }
.trip-title h1{ margin:0 0 .15em; }
.trip-title__sub{ color:var(--nb-muted); font-size:.95rem; margin:0; }
.trip-hero{
  display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:24px;
  align-items:start; margin-top:18px;
}
.trip-hero__gallery{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:auto auto; gap:8px;
}
.trip-hero__main{ grid-column:1/5; position:relative; border-radius:var(--nb-radius-lg); overflow:hidden; aspect-ratio:16/10; }
.trip-hero__main img, .trip-hero__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.trip-hero__thumb{
  position:relative; border-radius:var(--nb-radius-sm); overflow:hidden; aspect-ratio:4/3;
  display:block; padding:0; border:0; cursor:pointer; background:var(--nb-bg-2);
}
.trip-hero__thumb--map::after{ content:""; position:absolute; inset:0; background:rgba(26,26,26,.45); }
.trip-hero__thumb-label{
  position:absolute; inset:auto 8px 8px 8px; z-index:2; color:#fff; font-weight:700; font-size:.78rem;
  display:flex; align-items:center; gap:6px; line-height:1.2;
}
.trip-hero__thumb-label svg{ width:16px; height:16px; flex-shrink:0; }
.trip-hero__all{
  position:absolute; right:12px; bottom:12px; z-index:3; background:#fff; color:var(--nb-black);
  border:0; padding:8px 14px; border-radius:999px; font:inherit; font-size:.8rem; font-weight:700;
  box-shadow:var(--nb-shadow-lift); cursor:pointer;
}
.trip-hero__all:hover{ background:var(--nb-yellow); }

.keyfacts{
  border:1px solid var(--nb-border); border-radius:var(--nb-radius-lg); padding:20px;
  background:#fff; box-shadow:var(--nb-shadow);
}
.keyfacts__rating{ display:flex; align-items:center; gap:8px; font-size:.88rem; color:var(--nb-body); margin-bottom:12px; }
.keyfacts__rating svg{ width:18px; height:18px; }
.keyfacts__rating b{ font-size:1.05rem; }
.keyfacts__rating .stars{ color:var(--nb-yellow-dark); letter-spacing:1px; }
.keyfacts__rating a{ text-decoration:underline; color:var(--nb-muted); }
.keyfacts__list{ margin:0; display:grid; grid-template-columns:minmax(0,1fr); }
.keyfacts__row{
  display:grid; grid-template-columns:22px minmax(0,1fr); gap:4px 10px; padding:9px 0;
  border-top:1px solid var(--nb-border); align-items:start;
}
.keyfacts__row svg{ width:20px; height:20px; margin-top:2px; color:var(--nb-black); }
.keyfacts__row dt{ font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--nb-muted); font-weight:700; margin:0; }
.keyfacts__row dd{ margin:0; font-size:.88rem; line-height:1.45; grid-column:2; }
.keyfacts__row dd small{ display:block; color:var(--nb-muted); font-size:.78rem; }
.keyfacts__price{
  display:flex; align-items:flex-end; justify-content:space-between; gap:12px; flex-wrap:wrap;
  margin-top:14px; padding-top:14px; border-top:1px solid var(--nb-border);
}
.keyfacts__price .from{ font-size:.75rem; color:var(--nb-muted); display:block; }
.keyfacts__price .amount{ font-family:var(--font-display); font-size:1.6rem; color:var(--nb-price-new); line-height:1.1; }
.keyfacts__ctas{ display:grid; grid-template-columns:minmax(0,1fr); gap:8px; margin-top:12px; }
.keyfacts__coord{
  display:flex; align-items:center; gap:10px; width:100%; padding:8px; margin-top:12px;
  border:1px solid var(--nb-border); border-radius:var(--nb-radius); background:var(--nb-bg-2);
  font:inherit; text-align:left; cursor:pointer; color:inherit;
}
.keyfacts__coord img{ width:44px; height:44px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.keyfacts__coord span{ display:flex; flex-direction:column; font-size:.78rem; color:var(--nb-muted); line-height:1.3; }
.keyfacts__coord strong{ color:var(--nb-black); font-size:.92rem; }
.keyfacts__coord em{ font-style:normal; text-decoration:underline; font-size:.78rem; margin-left:auto; color:var(--nb-black); white-space:nowrap; }

/* Nivel físico: barra de 5 segmentos (patrón Intrepid). --pending = escala aún
   sin definir por el equipo: segmentos rayados, nunca una cifra inventada. */
.level-bar{ display:inline-flex; gap:3px; vertical-align:middle; margin-right:6px; }
.level-bar span{ width:18px; height:7px; border-radius:2px; background:var(--nb-border); }
.level-bar span.is-on{ background:var(--nb-black); }
.level-bar--pending span{
  background:repeating-linear-gradient(135deg, var(--nb-border) 0 3px, #fff 3px 6px);
  outline:1px dashed var(--nb-border-2); outline-offset:-1px;
}
.pending-tag{
  display:inline-block; font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  background:var(--nb-warn-bg); color:var(--nb-warn-fg); padding:1px 7px; border-radius:999px; vertical-align:middle;
}

/* --- Sub-barra sticky con precio/estado de la salida elegida --- */
.tab-row__summary{
  margin-left:auto; flex-shrink:0; display:flex; align-items:center; gap:10px; padding:4px 0 6px 12px;
}
.tab-row__summary-text{ display:flex; flex-direction:column; line-height:1.2; text-align:right; }
.tab-row__summary-text small{ font-size:.72rem; color:var(--nb-muted); }
.tab-row__summary-text b{ font-size:.92rem; }
.tab-row .tab-row__cta{
  border-bottom:none; background:var(--nb-yellow); color:var(--nb-black); border-radius:999px;
  padding:8px 14px; font-size:.85rem; font-weight:700;
}
.tab-row .tab-row__cta:hover{ background:var(--nb-yellow-dark); }

/* --- Secciones del concepto --- */
.concept-section{ margin-top:56px; scroll-margin-top:140px; }
.concept-section > h2{ margin-bottom:.35em; }
.concept-section__lead{ color:var(--nb-muted); margin-top:0; max-width:68ch; }
.why-list{ list-style:none; margin:18px 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:14px; }
.why-list li{ display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:var(--nb-radius); background:var(--nb-bg-2); }
.why-list__icon{ flex-shrink:0; width:30px; height:30px; border-radius:50%; background:var(--nb-yellow); display:flex; align-items:center; justify-content:center; }
.why-list__icon svg{ width:16px; height:16px; }
.why-list strong{ display:block; font-size:.95rem; margin-bottom:2px; }
.why-list p{ margin:0; font-size:.86rem; color:var(--nb-muted); line-height:1.5; }

/* Qué incluye con contadores */
.include-counters{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr)); gap:12px; margin-top:18px; }
.counter-tile{ border:1px solid var(--nb-border); border-radius:var(--nb-radius); padding:14px; background:#fff; }
.counter-tile__num{ font-family:var(--font-display); font-size:1.7rem; line-height:1; display:block; }
.counter-tile__label{ display:block; font-size:.84rem; margin-top:6px; line-height:1.35; }
.counter-tile__label small{ display:block; color:var(--nb-muted); font-size:.75rem; margin-top:2px; }
.counter-tile--muted{ background:var(--nb-bg-2); }
.counter-tile--muted .counter-tile__num{ color:var(--nb-muted); }
.not-included{
  margin-top:20px; border:1px solid var(--nb-border); 
  border-radius:var(--nb-radius); padding:14px 16px;
}
.not-included h3{ margin:0 0 8px; font-size:1rem; }
.not-included ul{ margin:0; padding:0; list-style:none; display:grid; gap:6px; font-size:.9rem; }
.not-included li{ display:flex; gap:8px; align-items:flex-start; }
.not-included li::before{ content:"✕"; color:#D6342C; font-weight:700; flex-shrink:0; }
.not-included li.is-key{ font-weight:700; }
.money-notes{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:12px; margin-top:14px; }
.money-notes p{ margin:0; padding:12px 14px; border-radius:var(--nb-radius-sm); background:var(--nb-bg-2); font-size:.85rem; color:var(--nb-muted); }
.money-notes b{ color:var(--nb-body); }

/* Itinerario: fichas por día */
.itin-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.itin-legend{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; font-size:.76rem; color:var(--nb-muted); margin:6px 0 14px; }
.day-card{ border:1px solid var(--nb-border); border-radius:var(--nb-radius); margin-top:10px; background:#fff; }
.day-card[open]{ box-shadow:var(--nb-shadow); }
.day-card__summary{ display:flex; align-items:center; gap:14px; padding:12px 14px; cursor:pointer; list-style:none; }
.day-card__summary::-webkit-details-marker{ display:none; }
.day-card__summary img{ width:64px; height:48px; border-radius:var(--nb-radius-sm); object-fit:cover; flex-shrink:0; }
.day-card__head{ flex:1; min-width:0; }
.day-card__head h3{ margin:0; font-size:1rem; line-height:1.3; }
.day-card__place{ display:block; font-size:.78rem; color:var(--nb-muted); margin-top:2px; }
.day-card__chev{ flex-shrink:0; color:var(--nb-muted); transition:transform .2s ease; }
.day-card[open] .day-card__chev{ transform:rotate(180deg); }
.day-card__body{ padding:0 16px 16px; border-top:1px solid var(--nb-border); }
.day-card__body > p{ font-size:.92rem; color:var(--nb-muted); margin:14px 0 0; }
.day-facts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr)); gap:10px 18px; margin:14px 0 0; }
.day-facts > div{ font-size:.84rem; line-height:1.45; }
.day-facts dt{ font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; color:var(--nb-muted); font-weight:700; margin-bottom:3px; }
.day-facts dd{ margin:0; }
.day-facts .is-optional{ color:var(--nb-warn-fg); }
.meal-icons{ display:inline-flex; gap:4px; }
.meal{
  width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  font-size:.68rem; font-weight:800; background:var(--nb-success-bg); color:var(--nb-success-fg);
}
.meal.is-no{ background:var(--nb-bg-2); color:var(--nb-border-2); text-decoration:line-through; }
.place-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.place-chips span{ font-size:.74rem; padding:3px 9px; border-radius:999px; background:var(--nb-bg-2); border:1px solid var(--nb-border); }
.day-card__warn{ font-size:.8rem !important; color:var(--nb-warn-fg) !important; background:var(--nb-warn-bg); padding:8px 10px; border-radius:var(--nb-radius-sm); }
.itin-map{ margin-top:22px; border-radius:var(--nb-radius); overflow:hidden; border:1px solid var(--nb-border); scroll-margin-top:140px; }
.itin-map iframe{ border:0; display:block; width:100%; height:420px; }

/* Dónde dormirás: carrusel */
.stay-rail{ display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px; margin-top:18px; }
.stay-rail::-webkit-scrollbar{ height:8px; }
.stay-rail::-webkit-scrollbar-thumb{ background:var(--nb-border-2); border-radius:8px; }
.stay-card{ flex:0 0 270px; scroll-snap-align:start; border:1px solid var(--nb-border); border-radius:var(--nb-radius); overflow:hidden; background:#fff; }
.stay-card__media{ position:relative; aspect-ratio:16/10; }
.stay-card__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.stay-card__nights{ position:absolute; left:10px; top:10px; background:var(--nb-black); color:#fff; font-size:.72rem; font-weight:700; padding:3px 9px; border-radius:999px; }
.stay-card__body{ padding:12px 14px 14px; font-size:.84rem; }
.stay-card__body h3{ font-size:1rem; margin:0 0 2px; }
.stay-card__place{ color:var(--nb-muted); font-size:.78rem; display:block; margin-bottom:8px; }
.stay-card__body p{ margin:4px 0 0; line-height:1.45; }
.stay-card__body .muted{ color:var(--nb-muted); font-size:.76rem; }
@media (max-width:600px){ .stay-card{ flex-basis:78vw; } }

/* Fechas y precios: filas de salida + panel sticky */
.dep-layout{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:28px; align-items:start; margin-top:18px; }
.dep-list{ display:grid; gap:10px; }
.dep-row{
  display:grid; grid-template-columns:22px minmax(0,1fr) auto; gap:4px 12px; align-items:center;
  border:1.5px solid var(--nb-border); border-radius:var(--nb-radius); padding:12px 14px; cursor:pointer; background:#fff;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.dep-row:hover{ border-color:var(--nb-border-2); }
.dep-row:has(input:checked){ border-color:var(--nb-black); box-shadow:0 0 0 1px var(--nb-black); }
.dep-row input{ accent-color:var(--nb-black); width:18px; height:18px; margin:0; }
.dep-row__main{ min-width:0; }
.dep-row__dates{ font-weight:700; font-size:.95rem; display:block; }
.dep-row__dates small{ font-weight:400; color:var(--nb-muted); font-size:.78rem; }
.dep-row__meta{ display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; margin-top:4px; font-size:.78rem; color:var(--nb-muted); }
.dep-row__price{ text-align:right; }
.dep-row__price .old{ display:block; font-size:.78rem; text-decoration:line-through; color:var(--nb-price-old); }
.dep-row__price .new{ font-family:var(--font-display); font-size:1.15rem; color:var(--nb-price-new); }
.dep-row__price .plain{ font-family:var(--font-display); font-size:1.15rem; color:var(--nb-body); }
.dep-row__price small{ display:block; font-size:.72rem; color:var(--nb-muted); }
.dep-status{ display:inline-flex; align-items:center; gap:5px; font-weight:700; font-size:.76rem; padding:2px 9px; border-radius:999px; }
.dep-status::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.dep-status--ok{ background:var(--nb-success-bg); color:var(--nb-success-fg); }
.dep-status--pending{ background:var(--nb-info-bg); color:var(--nb-info-fg); }
.dep-status--few{ background:#FDECEA; color:#B42318; }
.dep-status--full{ background:var(--nb-bg-2); color:var(--nb-muted); }
.dep-tag{ font-size:.7rem; font-weight:700; padding:2px 8px; border-radius:999px; background:var(--nb-yellow); color:var(--nb-black); }
.dep-tag--soft{ background:var(--nb-bg-2); color:var(--nb-body); border:1px solid var(--nb-border); }

.dep-panel{
  position:sticky; top:140px; border:1px solid var(--nb-border); border-radius:var(--nb-radius-lg);
  box-shadow:var(--nb-shadow-lift); padding:20px; background:#fff;
}
.dep-panel__eyebrow{ font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--nb-muted); }
.dep-panel__dates{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:10px 0 12px; }
.dep-panel__dates div{ background:var(--nb-bg-2); border-radius:var(--nb-radius-sm); padding:8px 10px; font-size:.84rem; }
.dep-panel__dates small{ display:block; font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; color:var(--nb-muted); font-weight:700; }
.room-option{ display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1.5px solid var(--nb-border); border-radius:var(--nb-radius-sm); margin-top:8px; font-size:.86rem; cursor:pointer; }
.room-option:has(input:checked){ border-color:var(--nb-black); }
.room-option input{ accent-color:var(--nb-black); margin-top:3px; }
.room-option small{ display:block; color:var(--nb-muted); font-size:.76rem; }
.room-option.is-disabled{ cursor:default; background:var(--nb-bg-2); }
.dep-panel__price{ display:flex; align-items:baseline; gap:8px; margin-top:14px; }
.dep-panel__price .old{ text-decoration:line-through; font-size:.9rem; }
.dep-panel__price .new{ font-family:var(--font-display); font-size:1.7rem; color:var(--nb-price-new); }
.dep-panel__price small{ color:var(--nb-muted); font-size:.78rem; }
.dep-panel__pay{ margin:10px 0 14px; padding:10px 12px; border-radius:var(--nb-radius-sm); background:var(--nb-success-bg); color:var(--nb-success-fg); font-size:.84rem; line-height:1.45; }
.dep-panel__pay b{ color:#145a26; }
.dep-panel .btn + .btn{ margin-top:8px; }
.dep-panel__fine{ font-size:.75rem; color:var(--nb-muted); margin:10px 0 0; text-align:center; }

.dep-sheet{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:180; background:#fff;
  border-top:1px solid var(--nb-border); box-shadow:0 -6px 20px rgba(26,26,26,.14);
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
}
.dep-sheet__row{ display:flex; align-items:center; gap:12px; }
.dep-sheet__info{ flex:1; min-width:0; line-height:1.25; }
.dep-sheet__info small{ display:block; font-size:.72rem; color:var(--nb-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dep-sheet__info b{ font-size:1rem; }
.dep-sheet__info .new{ color:var(--nb-price-new); font-family:var(--font-display); }

/* Calendario de pago */
.pay-timeline{ list-style:none; margin:18px 0 0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; counter-reset:pay; }
.pay-step{ position:relative; padding:34px 12px 0 0; font-size:.85rem; line-height:1.45; }
.pay-step::before{
  content:""; position:absolute; top:9px; left:0; right:0; height:3px; background:var(--nb-border);
}
.pay-step:first-child::before{ left:9px; }
.pay-step:last-child::before{ right:auto; width:0; }
.pay-step::after{
  content:""; position:absolute; top:2px; left:0; width:17px; height:17px; border-radius:50%;
  background:#fff; border:3px solid var(--nb-black);
}
.pay-step.is-now::after{ background:var(--nb-yellow); }
.pay-step small{ display:block; font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--nb-muted); font-weight:700; }
.pay-step b{ display:block; font-size:1rem; margin:2px 0; }
.pay-step p{ margin:0; color:var(--nb-muted); font-size:.8rem; }
.cancel-lines{ margin-top:22px; border:1px solid var(--nb-border); border-radius:var(--nb-radius); padding:14px 16px; }
.cancel-lines h3{ margin:0 0 8px; font-size:1rem; }
.cancel-lines ol{ margin:0; padding-left:20px; display:grid; gap:6px; font-size:.88rem; }
.cancel-lines a{ text-decoration:underline; font-weight:600; font-size:.88rem; display:inline-block; margin-top:10px; }

/* Reseñas del destino */
.review-head{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:16px 28px; align-items:center; margin-top:16px; }
.review-score{ display:flex; gap:20px; flex-wrap:wrap; }
.review-score__item{ display:flex; flex-direction:column; }
.review-score__item b{ font-family:var(--font-display); font-size:2rem; line-height:1; }
.review-score__item span{ font-size:.78rem; color:var(--nb-muted); }
.review-dist{ display:grid; gap:4px; max-width:420px; font-size:.78rem; }
.review-dist__row{ display:grid; grid-template-columns:52px minmax(0,1fr) 26px; gap:8px; align-items:center; }
.review-dist__bar{ height:8px; border-radius:8px; background:var(--nb-bg-2); overflow:hidden; }
.review-dist__bar i{ display:block; height:100%; background:var(--nb-yellow-dark); }
.review-dist__note{ font-size:.74rem; color:var(--nb-muted); margin-top:4px; }
.review-card__trip{
  display:inline-block; margin-top:2px; font-size:.72rem; font-weight:700; color:var(--nb-success-fg);
  background:var(--nb-success-bg); padding:1px 8px; border-radius:999px;
}
.moments{ display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px; margin-top:12px; }
.moments figure{ margin:0; flex:0 0 190px; scroll-snap-align:start; }
.moments img{ width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:var(--nb-radius); display:block; }
.moments figcaption{ font-size:.75rem; color:var(--nb-muted); margin-top:6px; }

/* Galería completa en diálogo */
.gallery-dialog{ width:min(1000px,94vw); max-height:90vh; border:0; border-radius:var(--nb-radius-lg); padding:20px; }
.gallery-dialog::backdrop{ background:rgba(26,26,26,.7); }
.gallery-dialog__grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr)); gap:10px; margin-top:12px; }
.gallery-dialog__grid img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--nb-radius-sm); display:block; }

/* Franja de confianza antes del pie */
.trust-band{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr)); gap:12px; margin-top:48px; padding:18px; border-radius:var(--nb-radius); background:var(--nb-bg-2); }
.trust-band div{ display:flex; gap:10px; align-items:flex-start; font-size:.84rem; line-height:1.4; }
.trust-band svg{ width:22px; height:22px; flex-shrink:0; }
.trust-band b{ display:block; font-size:.9rem; }

@media (max-width:980px){
  .trip-hero{ grid-template-columns:minmax(0,1fr); }
  .dep-layout{ grid-template-columns:minmax(0,1fr); }
  .dep-panel{ position:static; }
  .tab-row__summary-text{ display:none; }
}
@media (max-width:1240px){ .tab-row__summary-text{ display:none; } }
@media (max-width:720px){
  /* Galería en carrusel deslizable en móvil (benchmark §8). */
  .trip-hero__gallery{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:8px; margin-inline:calc(var(--nb-gutter) * -1); padding-inline:var(--nb-gutter); }
  .trip-hero__main, .trip-hero__thumb{ flex:0 0 86%; scroll-snap-align:start; aspect-ratio:4/3; border-radius:var(--nb-radius); }
  .trip-hero__all{ right:auto; left:12px; }
  .dep-panel{ display:none; }
  .dep-sheet{ display:block; }
  body.has-dep-sheet{ padding-bottom:84px; }
  /* El botón flotante de WhatsApp (widget.js, en shadow DOM) sube por encima de la hoja de salidas:
     se mueve con variables CSS, que sí atraviesan el shadow DOM (29-oct). */
  body.has-dep-sheet{ --nbw-bottom:calc(80px + env(safe-area-inset-bottom)); }
  .tab-row__summary{ display:none; }
  .dep-row{ grid-template-columns:20px minmax(0,1fr); }
  .dep-row__price{ grid-column:2; text-align:left; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
  .dep-row__price .old{ display:inline; }
  .pay-timeline{ grid-template-columns:minmax(0,1fr); }
  .pay-step{ padding:0 0 18px 32px; }
  .pay-step::before{ top:0; bottom:0; left:7px; right:auto; width:3px; height:auto; }
  .pay-step:first-child::before{ left:7px; top:9px; }
  .pay-step:last-child::before{ display:none; }
  .review-head{ grid-template-columns:minmax(0,1fr); }
  .day-card__summary img{ width:52px; height:40px; }
  .itin-map iframe{ height:320px; }
}

/* ---- Fichas de salida generadas (viaje-*.html, 2026-10-19) ---- */
.trip-info-split{ display:grid; grid-template-columns:1fr 1fr; gap:20px 28px; margin-top:26px; }
.trip-info-split .info-box p{ margin:0 0 .6em; }
.trip-info-split .info-box--wide{ grid-column:1 / -1; }
@media (max-width:720px){ .trip-info-split{ grid-template-columns:1fr; } }
.check-item__emoji{ display:inline-flex; align-items:center; justify-content:center; font-size:20px; line-height:1; }
.trip-sub{ margin-top:2.2em; }
.trip-intro p{ margin:0 0 .9em; }
.check-item__tick{ display:inline-flex; width:22px; justify-content:center; font-weight:700; color:var(--nb-success-fg, #1f7a3a); flex-shrink:0; }
.trip-note{ background:var(--nb-bg-2); border-radius:var(--nb-radius); padding:14px 16px; margin-top:14px; font-size:.9rem; color:var(--nb-body); }
.trip-note p{ margin:0; }
#detalles .detail-card{ margin-bottom:10px; }
#detalles .detail-card__body{ padding:0 4px 8px; font-size:.95rem; }
#detalles .detail-card__body p{ margin:0 0 .7em; }
#faq .faq-item p, #faq .faq-item ul{ margin:.4em 0 .6em; }

/* ---- Ficha de viaje v2 (Islandia, feedback 19-oct) ----
   Escala tipográfica única para toda la ficha:
   titulares BrandingSF (h1 2.25rem · h2 1.75rem · h3 1.25rem) · títulos de bloque Poppins 600 1rem
   · texto Poppins 400 .95rem/1.65 · notas pequeñas .82rem */
.trip-v2 h1{ font-size:clamp(1.7rem,3.4vw,2.25rem); }
.trip-v2 h2{ font-size:clamp(1.4rem,2.6vw,1.75rem); }
.trip-v2 h3, .trip-v2 .trip-sub{ font-size:1.25rem; }
.trip-v2 h4, .trip-v2 summary, .trip-v2 .day-item__summary h4{ font-family:var(--font-body); font-size:1rem; font-weight:600; }
.trip-v2 .trip-intro p, .trip-v2 .info-box p, .trip-v2 .day-item__content p, .trip-v2 .day-item__content li,
.trip-v2 .faq-item p, .trip-v2 .faq-item li, .trip-v2 .detail-card__body p, .trip-v2 .detail-card__body li,
.trip-v2 #incluye .text-muted p, .trip-v2 .check-item, .trip-v2 .dash-list li, .trip-v2 .meet-card p,
.trip-v2 .trip-note p, .trip-v2 .before-trip-card p{ font-size:.95rem; line-height:1.65; color:var(--nb-body); }
.trip-v2 .trip-intro p{ font-size:1.02rem; }
.trip-v2 .day-num{ background:var(--nb-yellow); color:var(--nb-black); font-weight:800; font-size:1rem; }
.trip-v2 .day-item__content{ padding-left:56px; }
.trip-facts{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin-top:6px; }
.trip-facts__item{ font-size:.95rem; font-weight:500; color:var(--nb-body); }
.dash-list{ list-style:none; padding:0; margin:12px 0 0; display:flex; flex-direction:column; gap:10px; }
.dash-list li{ position:relative; padding-left:22px; }
.dash-list li::before{ content:"-"; position:absolute; left:4px; top:0; font-weight:700; color:var(--nb-black); }
.meet-card{ margin-top:28px; padding:22px; border-radius:var(--nb-radius); background:var(--nb-bg-2); }
.meet-card h3{ margin-bottom:.4em; }
.meet-card .btn{ margin-top:10px; }
/* Guía / dossier descargable */
.dossier-card{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); margin:28px 0 8px; border-radius:var(--nb-radius); overflow:hidden; background:var(--nb-black); color:#fff; }
.dossier-card__media{ position:relative; min-height:220px; }
.dossier-card__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.dossier-card__tag{ position:absolute; top:14px; left:14px; background:var(--nb-yellow); color:var(--nb-black); font-weight:700; font-size:.78rem; padding:5px 10px; border-radius:999px; }
.dossier-card__body{ padding:26px 26px 24px; }
.dossier-card__body .eyebrow{ background:var(--nb-yellow); color:var(--nb-black); padding:3px 8px; }
.dossier-card__body h3{ color:#fff; font-size:1.35rem; margin:.5em 0 .3em; }
.dossier-card__body p{ color:rgba(255,255,255,.82); font-size:.95rem; margin:0 0 10px; }
.dossier-card__list{ list-style:none; padding:0; margin:0 0 18px; display:flex; flex-direction:column; gap:6px; }
.dossier-card__list li{ font-size:.9rem; color:#fff; padding-left:24px; position:relative; }
.dossier-card__list li::before{ content:"✓"; position:absolute; left:0; color:var(--nb-yellow); font-weight:700; }
@media (max-width:720px){ .dossier-card{ grid-template-columns:1fr; } .dossier-card__media{ min-height:170px; } }
.dossier-modal{ max-width:440px; width:calc(100% - 32px); }
.dossier-form{ display:flex; flex-direction:column; gap:10px; text-align:left; }
.dossier-form label{ display:flex; flex-direction:column; gap:4px; font-size:.85rem; font-weight:600; color:var(--nb-body); }
.dossier-form input, .dossier-form select{ font:inherit; font-weight:400; padding:10px 12px; border:1px solid #d9d9de; border-radius:10px; }
.dossier-form__check{ flex-direction:row !important; align-items:flex-start; gap:8px !important; font-weight:400 !important; }
.dossier-form__check input{ margin-top:3px; }
/* Opciones de pago */
.pay-options{ display:flex; flex-direction:column; gap:8px; margin:14px 0 12px; }
.pay-option{ display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border:1.5px solid #e2e2e6; border-radius:12px; cursor:pointer; background:#fff; }
.pay-option:has(input:checked){ border-color:var(--nb-black); background:#fffbe6; }
.pay-option input{ margin-top:4px; accent-color:var(--nb-black); }
.pay-option__body{ display:flex; flex-direction:column; }
.pay-option__body b{ font-size:.95rem; }
.pay-option__body small{ font-size:.8rem; color:var(--nb-muted); }
.pay-option.is-disabled .pay-option__body{ opacity:.55; }
.pay-option.is-disabled small{ color:#b42318; opacity:1; }
.pay-alert{ background:#fef3f2; border:1.5px solid #f04438; color:#912018; border-radius:12px; padding:12px 14px; font-size:.86rem; line-height:1.5; margin:0 0 12px; }
.pay-alert strong{ display:block; color:#b42318; margin-bottom:2px; }
.pay-alert.is-shake{ animation:payShake .35s ease; }
@keyframes payShake{ 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 75%{transform:translateX(4px)} }
.pay-help{ text-align:center; font-size:.8rem; margin:8px 0 0; }

/* Barra de reserva móvil (19-oct): precio a la izquierda, botón grande a la derecha (patrón WeRoad/Intrepid)
   y la burbuja de WhatsApp sube por encima de la barra para no tapar nada. */
.sticky-cta-mobile{ justify-content:space-between; }
/* 29-oct: el precio y su nota ceden espacio (la nota baja de línea) y el botón nunca se corta ("Reserv"). */
.sticky-cta-mobile .price-deposit{ flex:1 1 auto; min-width:0; }
.sticky-cta-mobile .price-deposit .amount{ line-height:1.1; }
.sticky-cta-mobile .price-deposit .price-note{ white-space:normal; line-height:1.25; overflow-wrap:anywhere; }
.sticky-cta-mobile > .btn{ flex:0 0 auto; white-space:nowrap; padding-block:13px; padding-inline:22px; font-size:1rem; }
@media (max-width:360px){ .sticky-cta-mobile{ gap:10px; padding-inline:12px; } .sticky-cta-mobile > .btn{ padding-inline:16px; } }
@media (max-width: 720px){
  /* el widget vive en shadow DOM: se mueve con variables CSS, que sí atraviesan el shadow DOM */
  body:has(.sticky-cta-mobile){ --nbw-bottom:calc(84px + env(safe-area-inset-bottom)); }
}

/* Antes de viajar (ficha v2) */
.before-box{ margin-top:36px; padding:24px; border-radius:var(--nb-radius); background:var(--nb-bg-2); }
.before-box h3{ margin-bottom:.35em; }
.before-box__lead{ font-size:.95rem; line-height:1.65; color:var(--nb-body); margin:0 0 16px; }
.fit-cards{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.fit-card{ display:flex; gap:12px; align-items:flex-start; background:#fff; border-radius:12px; padding:14px 16px; border:1px solid #ececf0; }
.fit-card__icon{ flex:0 0 38px; height:38px; border-radius:50%; background:var(--nb-yellow); display:flex; align-items:center; justify-content:center; font-size:1.1rem; }
.fit-card__label{ display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.05em; color:var(--nb-muted); margin-bottom:2px; }
.fit-card p{ margin:0; font-size:.92rem; line-height:1.55; color:var(--nb-body); }
.fit-card p b, .fit-card p strong{ color:var(--nb-black); font-weight:700; background:linear-gradient(transparent 62%, rgba(255,209,1,.55) 62%); }
@media (max-width:720px){ .fit-cards{ grid-template-columns:1fr; } .before-box{ padding:18px; } }
.meet-card{ display:grid; gap:4px; }
.booking-card .trust a{ color:inherit; text-decoration:underline; text-underline-offset:2px; }
/* Guía: versión franja compacta para las landings de destino */
.dossier-strip{ display:flex; align-items:center; gap:16px; padding:14px 18px; border-radius:var(--nb-radius); background:var(--nb-black); color:#fff; }
.dossier-strip__icon{ flex:0 0 44px; height:44px; border-radius:12px; background:var(--nb-yellow); color:var(--nb-black); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.8rem; }
.dossier-strip__text{ flex:1; min-width:0; }
.dossier-strip__text strong{ display:block; font-family:var(--font-display); font-size:1.1rem; }
.dossier-strip__text span{ font-size:.86rem; color:rgba(255,255,255,.8); }
@media (max-width:720px){ .dossier-strip{ flex-wrap:wrap; } .dossier-strip .btn{ width:100%; } }
@media (max-width:720px){
  .fit-card{ display:grid; grid-template-columns:32px 1fr; column-gap:10px; padding:14px; }
  .fit-card__icon{ width:32px; height:32px; flex:none; font-size:.95rem; }
  .fit-card > div{ display:contents; }
  .fit-card__label{ align-self:center; margin:0; }
  .fit-card p{ grid-column:1 / -1; margin-top:8px; }
}
.dossier-strip__icon{ position:relative; background:#fff; flex-basis:52px; height:52px; border-radius:14px; }
.dossier-strip__icon img{ width:34px; height:34px; object-fit:contain; }
.dossier-strip__icon em{ position:absolute; right:-6px; bottom:-6px; font-style:normal; font-size:.62rem; font-weight:800; background:var(--nb-yellow); color:var(--nb-black); padding:2px 5px; border-radius:6px; }
.dossier-card__tag{ display:inline-flex; align-items:center; gap:6px; background:#fff; }
.dossier-card__tag img{ width:18px; height:18px; object-fit:contain; }
/* Home "Próximos viajes": 6 en escritorio, 3 en móvil (Clarity: en móvil casi nadie baja tanto) */
@media (max-width:720px){ .home-upcoming > .trip-card:nth-child(n+4){ display:none; } }
/* Sello de fecha sobre la foto, algo más grande (pedido de Berto 20-oct), manteniendo la proporción número/mes */
.trip-grid--rows .trip-card__dates--on-media strong{ font-size:1.9rem; }
.trip-grid--rows .trip-card__dates--on-media em{ font-size:1.08rem; }
@media (max-width:859px){
  .trip-grid--rows .trip-card__dates--on-media strong{ font-size:2.6rem; }
  .trip-grid--rows .trip-card__dates--on-media em{ font-size:1.3rem; }
}

/* ---- Tarjetas de salida más grandes y legibles (feedback de Berto 21-oct) ----
   Todo se veía "muy pequeñito" y sobraba hueco a la derecha: más foto, sello de fecha
   mucho mayor, título/fechas/estado legibles y precio protagonista junto al botón. */
.trip-grid--rows .trip-card__badges .badge-earlybee,
.trip-grid--rows .trip-card__badges .badge-discount{ font-size:.74rem; padding:4px 10px; }
.trip-grid--rows .trip-card__status-pill{ font-size:.9rem; }
.trip-grid--rows .trip-card__dates{ font-size:.95rem !important; color:var(--nb-body) !important; font-weight:500; }
.trip-grid--rows .trip-card__title{ font-size:1.12rem !important; }
.trip-grid--rows .trip-card__footer .price .new{ font-size:1.75rem !important; line-height:1; }
.trip-grid--rows .trip-card__footer .price .old{ font-size:1.05rem !important; }
.trip-grid--rows .trip-card__footer .btn{ padding:12px 24px; font-size:1rem; }
.trip-grid--rows .coord-mini__label{ font-size:.86rem; }
.trip-grid--rows .trip-card__dates--on-media strong{ font-size:3.4rem; }
.trip-grid--rows .trip-card__dates--on-media em{ font-size:1.6rem; }
@media (min-width:860px){
  .trip-grid--rows .trip-card__media{ width:27%; flex:0 0 27%; aspect-ratio:2/1; }
  .trip-grid--rows .trip-card__body{ padding:14px 24px; gap:24px; }
  .trip-grid--rows .trip-card__info{ gap:4px; }
  .trip-grid--rows .trip-card__title-row{ gap:4px; }
  .trip-grid--rows .coord-mini__avatar{ width:34px; height:34px; }
  .trip-grid--rows .trip-card__footer{ gap:22px; }
  .trip-grid--rows .trip-card__footer .price{ display:flex; flex-direction:column; align-items:flex-end; gap:2px; }
  .trip-grid--rows .trip-card__dates--on-media strong{ font-size:2.9rem; }
  .trip-grid--rows .trip-card__dates--on-media em{ font-size:1.35rem; }
}
@media (max-width:859px){
  .trip-grid--rows .trip-card__body{ padding:16px 18px 18px; }
  .trip-grid--rows .trip-card__title{ font-size:1.18rem !important; }
  .trip-grid--rows .trip-card__dates--on-media strong{ font-size:3.6rem; }
  .trip-grid--rows .trip-card__dates--on-media em{ font-size:1.7rem; }
}

/* ---- Tarjeta de salida v3 (feedback 21-oct): línea de estilo, descuento en € junto al precio,
   precio en el hueco central, botón más ancho, estado como pastilla de color y coordi con pinta de botón ---- */
.trip-card__style{ margin:2px 0 0 !important; font-size:.88rem; color:var(--nb-muted); line-height:1.4; }
.trip-grid--rows .trip-card__status-pill{
  display:inline-flex; align-items:center; gap:4px; font-size:.86rem; font-weight:700; padding:4px 10px; border-radius:999px;
}
.trip-grid--rows .trip-card__status-pill.badge-status-confirmed{ background:var(--nb-success-bg); color:var(--nb-success-fg); }
.trip-grid--rows .trip-card__status-pill.badge-status-almost{ background:var(--nb-info-bg); color:var(--nb-info-fg); }
.trip-grid--rows .trip-card__status-pill.badge-status-last{ background:var(--nb-warn-bg); color:var(--nb-warn-fg); }
.trip-card .price{ position:relative; }
.price-off{
  display:inline-block; background:#E8453C; color:#fff; font-weight:800; font-size:.8rem; line-height:1;
  padding:5px 8px; border-radius:8px; transform:rotate(-4deg); box-shadow:0 2px 6px rgba(232,69,60,.3);
}
.trip-grid--rows .coord-mini{
  min-height:46px; padding:6px 16px 6px 6px !important; border:1.5px solid #e3e3e8; background:#fff; border-radius:999px;
  box-shadow:0 1px 3px rgba(0,0,0,.06); cursor:pointer; transition:border-color .15s, box-shadow .15s;
}
.trip-grid--rows .coord-mini:hover{ border-color:var(--nb-black); box-shadow:0 2px 8px rgba(0,0,0,.12); }
.trip-grid--rows .coord-mini__avatar{ width:34px !important; height:34px !important; }
.trip-grid--rows .coord-mini__label{ font-size:.95rem; }
.trip-grid--rows .coord-mini__label::after{ content:"Ver perfil ›"; font-weight:600; font-size:.68rem; color:var(--nb-black); text-decoration:underline; text-underline-offset:2px; }
@media (min-width:860px){
  .trip-grid--rows .trip-card__body{
    display:grid; grid-template-columns:minmax(0,1.5fr) auto minmax(150px,1fr) auto; align-items:center; column-gap:22px;
  }
  .trip-grid--rows .trip-card__footer{ display:contents; }
  .trip-grid--rows .trip-card__footer .price{ justify-self:center; align-items:center !important; text-align:center; }
  .trip-grid--rows .trip-card__footer .price .price-off{ position:absolute; top:-14px; right:-34px; }
  .trip-grid--rows .trip-card__footer .btn{ min-width:170px; padding:14px 28px; font-size:1.02rem; justify-self:end; }
  .trip-grid--rows .trip-card__body > .trip-card__meta{ justify-self:center; }
}
@media (max-width:859px){
  .trip-grid--rows .trip-card__footer{ display:flex; align-items:center; gap:14px; }
  .trip-grid--rows .trip-card__footer .price{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; }
  .trip-grid--rows .trip-card__footer .price .price-off{ align-self:flex-start; margin-bottom:2px; }
  .trip-grid--rows .trip-card__footer .btn{ flex:1; max-width:none; padding:14px 18px; font-size:1.02rem; text-align:center; }
}
@media (min-width:860px){
  .trip-grid--rows .trip-card__body{ grid-template-columns:minmax(210px,1fr) auto auto auto; column-gap:28px; }
  .trip-grid--rows .trip-card__footer .price{ min-width:120px; }
}
@media (min-width:860px) and (max-width:1100px){
  .trip-grid--rows .trip-card__media{ width:22%; flex-basis:22%; }
  .trip-grid--rows .trip-card__body{ column-gap:16px; padding:12px 16px; }
  .trip-grid--rows .coord-mini__label::after{ display:none; }
  .trip-grid--rows .trip-card__footer .btn{ min-width:0; padding:12px 18px; }
  .trip-grid--rows .trip-card__style{ display:none; }
}
@media (min-width:860px){
  /* columnas fijas: con o sin coordinador, precio y botón quedan alineados en todas las tarjetas */
  .trip-grid--rows .trip-card__body{ grid-template-columns:minmax(0,1fr) 170px 150px 180px; }
  .trip-grid--rows .trip-card__info{ grid-column:1; }
  .trip-grid--rows .trip-card__body > .trip-card__meta{ grid-column:2; }
  .trip-grid--rows .trip-card__footer .price{ grid-column:3; }
  .trip-grid--rows .trip-card__footer .btn{ grid-column:4; width:100%; min-width:0; }
}
@media (min-width:860px) and (max-width:1100px){
  .trip-grid--rows .trip-card__body{ grid-template-columns:minmax(0,1fr) 130px 120px 130px; }
}

/* 21-oct (2): sin "Ver perfil" en el coordi; descuento en la esquina superior derecha de la foto;
   estado algo más grande; franja de la guía con letra más legible */
.trip-grid--rows .coord-mini__label::after{ content:none !important; display:none !important; }
.trip-grid--rows .coord-mini{ min-height:48px; padding:6px 18px 6px 6px !important; }
.trip-grid--rows .coord-mini__avatar{ width:36px !important; height:36px !important; }
.trip-grid--rows .coord-mini__label{ font-size:1rem; }
.trip-grid--rows .trip-card__status-pill{ font-size:.95rem; padding:5px 12px; }
.trip-card__media .price-off{
  position:absolute; top:10px; right:10px; z-index:2; transform:rotate(-4deg);
  font-size:.9rem; padding:6px 10px;
}
.dossier-strip{ padding:18px 22px; gap:18px; }
.dossier-strip__text strong{ font-size:1.25rem; line-height:1.25; }
.dossier-strip__text span{ font-size:1rem; line-height:1.45; color:rgba(255,255,255,.88); }
.dossier-strip .btn{ font-size:1rem; padding:12px 22px; }
.dossier-strip__icon{ flex-basis:58px; height:58px; }
.dossier-strip__icon img{ width:38px; height:38px; }
@media (min-width:1101px){
  .trip-grid--rows .trip-card__media{ width:24%; flex-basis:24%; }
  .trip-grid--rows .trip-card__body{ grid-template-columns:minmax(0,1fr) 150px 140px 170px; column-gap:22px; }
}

/* Opiniones: texto largo recortado a 7 líneas, se despliega al tocar */
.reviews-platform-head{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:0 0 16px; }
.reviews-platform-head svg{ width:26px; height:26px; }
.reviews-platform-head h2{ margin:0; }
.reviews-platform-head a{ font-size:.9rem; font-weight:600; margin-left:auto; }
.op-figures{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin-top:18px; }
.op-figure{ background:#fff; border:1px solid #ececf0; border-radius:var(--nb-radius); padding:18px; }
.op-figure b{ display:block; font-family:var(--font-display); font-size:2rem; line-height:1; margin-bottom:6px; }
.op-figure span{ font-size:.92rem; color:var(--nb-body); }
.op-highlights{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; margin-top:18px; }
.op-highlights li{ list-style:none; background:var(--nb-bg-2); border-radius:var(--nb-radius); padding:18px 20px; font-size:.95rem; line-height:1.6; }
.op-highlights{ padding:0; }
.op-summary{ font-size:1.08rem; line-height:1.7; color:var(--nb-body); max-width:75ch; background:#fffbe6;  padding:16px 20px; border-radius:0 12px 12px 0; }

/* 22-oct: descuento algo más grande; estado y precio de la ficha más visibles */
.trip-card__media .price-off{ font-size:1.05rem; padding:7px 12px; border-radius:10px; }
.trip-v2 .trip-facts .badge{ font-size:1rem; padding:7px 14px; border-radius:999px; }
.trip-v2 .trip-facts__item{ font-size:1.02rem; }
.trip-v2 .booking-card__fixed-date > span:first-child{ font-size:1.02rem; }
.pay-option__body b{ font-size:1.02rem; }
.pay-option__body small{ font-size:.9rem; }
.pay-option__price{ font-family:var(--font-display); font-weight:800; font-size:1.35rem; color:var(--nb-black); }

/* 22-oct: escala de letra en móvil. Medido a 375 px: Intrepid, G Adventures y Huakai usan texto de 15-16 px
   y titulares de 29-40 px; nosotros íbamos a 13,8-14,7 px. Subir la base (todo está en rem) lo arregla en bloque. */
@media (max-width:720px){
  html{ font-size:17.5px; }
  h1{ font-size:clamp(1.75rem, 8vw, 2.2rem); }
}
/* Barra móvil: el precio destaca más */
.sticky-cta-mobile .price-deposit .amount{ font-size:1.55rem; font-weight:800; color:var(--nb-black); }
.op-badges{ display:flex; flex-wrap:wrap; gap:12px; margin-top:18px; }
.op-badge{ display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid #ececf0; border-radius:999px; padding:10px 18px 10px 12px; text-decoration:none; color:var(--nb-body); box-shadow:0 1px 3px rgba(0,0,0,.05); }
.op-badge svg{ width:24px; height:24px; }
.op-badge b{ font-family:var(--font-display); font-size:1.3rem; color:var(--nb-black); }
.op-badge span{ font-size:.92rem; }
.op-prose{ max-width:78ch; }
.op-prose p{ font-size:1rem; line-height:1.7; color:var(--nb-body); }
.op-prose ul{ display:grid; gap:10px; padding-left:1.1em; }
.op-prose li{ font-size:1rem; line-height:1.6; }
.op-summary p{ margin:0; }
.op-badges{ margin:6px 0 18px; }
@media (max-width:720px){ .op-summary{ font-size:.95rem; padding:14px 16px; } .op-badge{ width:100%; } }

/* Menú 22-oct: Destinos por continente y Fechas aparte */
.mega-menu--dest{ width:min(820px,92vw); grid-template-columns:repeat(4,1fr); gap:24px; }
.mega-menu--dest h4 a{ display:inline; padding:0; margin:0; font-size:inherit; color:inherit; font-weight:700; }
.mega-menu--fechas{ width:min(560px,92vw); grid-template-columns:1.3fr 1fr; gap:28px; }
.mega-menu__col--meses ul{ display:grid !important; grid-template-columns:1fr 1fr; gap:0 12px; }
.mobile-nav-mega__grid{ display:grid !important; grid-template-columns:1fr 1fr; gap:0 12px; }
.earlybee-note{ text-align:center; max-width:62ch; margin:0 auto 6px; color:var(--nb-body); font-size:1rem; }
.earlybee-note + .earlybee-note{ margin-top:0; }
.earlybee-note:last-of-type{ margin-bottom:18px; }
/* Coordi: algo mayor que al principio pero nunca más grande que "Ver viaje" */
.trip-grid--rows .coord-mini{ min-height:42px; padding:4px 14px 4px 4px !important; }
.trip-grid--rows .coord-mini__avatar{ width:32px !important; height:32px !important; }
.trip-grid--rows .coord-mini__label{ font-size:.9rem; }
/* Barra de confianza (landings de fechas) */
.trust-bar{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.trust-bar__item{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:2px; padding:12px 10px; background:#fff; border:1px solid #ececf0; border-radius:14px; text-decoration:none; color:var(--nb-body); }
.trust-bar__item b{ font-family:var(--font-display); font-size:1.35rem; color:var(--nb-black); line-height:1.1; }
.trust-bar__item span{ font-size:.82rem; line-height:1.35; }
@media (max-width:720px){ .trust-bar{ grid-template-columns:1fr 1fr; } }
/* Bloque atemporal de las landings de fechas */
.ever-block__intro{ max-width:70ch; }
.ever-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin-top:20px; }
.ever-card{ background:var(--nb-bg-2); border-radius:var(--nb-radius); padding:18px 20px; border-top:4px solid var(--nb-yellow); }
.ever-card h3{ font-size:1.1rem; margin:0 0 6px; }
.ever-card p{ margin:0; font-size:.95rem; line-height:1.6; color:var(--nb-body); }
.ever-tips{ margin-top:22px; }
.ever-tips h3{ font-size:1.1rem; }
.ever-tips ul{ display:grid; gap:8px; padding-left:1.1em; }
.ever-tips li{ font-size:.95rem; line-height:1.6; }

/* Garantías (landings de fechas) */
.guarantee{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2px; background:rgba(255,255,255,.08); border-radius:20px; overflow:hidden; background:var(--nb-black); padding:6px; }
.guarantee__item{ display:grid; grid-template-columns:44px 1fr; grid-template-rows:auto auto; column-gap:12px; row-gap:2px; padding:18px 18px; color:#fff; border-radius:14px; }
.guarantee__item:hover{ background:rgba(255,255,255,.04); }
.guarantee__icon{ grid-row:1 / span 2; width:44px; height:44px; border-radius:12px; background:var(--nb-yellow); color:var(--nb-black); display:flex; align-items:center; justify-content:center; }
.guarantee__icon svg{ width:24px; height:24px; }
.guarantee__t{ font-family:var(--font-display); font-weight:800; font-size:1.08rem; color:#fff; text-decoration:none; }
a.guarantee__t{ text-decoration:underline; text-decoration-color:var(--nb-yellow); text-underline-offset:3px; }
.guarantee__d{ font-size:.9rem; line-height:1.5; color:rgba(255,255,255,.78); }
@media (max-width:900px){ .guarantee{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .guarantee{ grid-template-columns:1fr; } .guarantee__item{ padding:14px; } }
/* Filtros por destino */
.dest-filter{ display:flex; gap:8px; overflow-x:auto; padding:4px 0 14px; scrollbar-width:none; }
.dest-filter::-webkit-scrollbar{ display:none; }
.dest-filter .chip{ flex:0 0 auto; display:inline-flex; align-items:center; gap:6px; }
.dest-filter .chip span{ font-size:.75rem; font-weight:700; background:rgba(0,0,0,.08); border-radius:999px; padding:1px 7px; }
.dest-filter .chip.is-active span{ background:rgba(255,255,255,.25); }
/* "Ver todos…": botón secundario, distinto del amarillo de "Ver viaje" */
.btn-all{ background:#fff; color:var(--nb-black); border:2px solid var(--nb-black); padding:12px 26px; font-weight:700; }
.btn-all:hover{ background:var(--nb-black); color:#fff; }
/* Ficha en móvil: "Ver viaje" un poco menos ancho para dar aire al precio */
@media (max-width:859px){
  .trip-grid--rows .trip-card__footer .btn{ flex:0 0 auto; padding:13px 22px; }
}
/* Bloques de texto con foto (landings de Nomad Bee) */
.split-photo{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:44px; align-items:center; }
.split-photo--reverse .split-photo__media{ order:2; }
.split-photo__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:22px; display:block; }
.split-photo__body p{ font-size:1.02rem; line-height:1.7; color:var(--nb-body); }
@media (max-width:860px){ .split-photo{ grid-template-columns:1fr; gap:20px; } .split-photo--reverse .split-photo__media{ order:0; } }
/* "Avísame cuando se confirme" */
.notify-link{ display:block; width:100%; margin-top:12px; background:none; border:1.5px dashed #cfcfd6; border-radius:12px; padding:11px 12px; font:inherit; font-size:.9rem; font-weight:600; color:var(--nb-body); cursor:pointer; }
.notify-link:hover{ border-color:var(--nb-black); }
.notify-earlybee{ background:#fffbe6; border-radius:10px; padding:10px 12px; font-size:.88rem; line-height:1.5; color:var(--nb-body); }
.notify-chip{ display:inline-flex; align-items:center; gap:6px; margin-top:10px; background:#fff; border:1.5px dashed #cfcfd6; border-radius:999px; padding:8px 14px; font:inherit; font-size:.88rem; font-weight:600; color:var(--nb-body); cursor:pointer; }
.notify-chip:hover{ border-color:var(--nb-black); }
.notify-link[hidden], .notify-chip[hidden]{ display:none; } /* "Avísame" oculto con Últimas plazas, confirmada o completa */
.dossier-form__check{ display:block !important; font-weight:400 !important; line-height:1.5; }
.dossier-form__check input{ margin:0 8px 0 0; vertical-align:-2px; }
.form-row-2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.notify-error{ color:#C0392B; font-size:.9rem; margin:0 0 10px; }

/* ===== Viajes de autor (Tipos de viaje): tono expedición, misma línea de marca ===== */
.autor-page{ --autor-night:#12302E; --autor-sand:#F3ECDD; --autor-ink:#E9F1EE; }
.autor-hero{ position:relative; min-height:72vh; display:flex; align-items:flex-end; overflow:hidden; background:var(--autor-night); }
.autor-hero > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.autor-hero::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(18,48,46,.15) 0%,rgba(18,48,46,.88) 85%); }
.autor-hero__content{ position:relative; z-index:1; color:#fff; padding-bottom:56px; }
.autor-hero h1{ color:#fff; font-size:clamp(2.6rem,6vw,4.6rem); margin:.15em 0 .2em; letter-spacing:-.01em; }
.autor-hero p{ font-size:1.15rem; max-width:52ch; color:var(--autor-ink); }
.autor-eyebrow{ display:inline-block; font-size:.78rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#FFD000; }
.autor-hero__ctas{ display:flex; gap:12px; flex-wrap:wrap; margin-top:22px; }
.autor-btn-ghost{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.7); }
.autor-btn-ghost:hover{ background:rgba(255,255,255,.12); }
.autor-dark{ background:var(--autor-night); color:var(--autor-ink); }
.autor-dark h2,.autor-dark h3{ color:#fff; }
.autor-sand{ background:var(--autor-sand); }
.autor-pilares{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; }
.autor-pilar__n{ font-family:var(--font-heading,inherit); color:#FFD000; font-size:1.6rem; font-weight:800; }
.autor-pilar h3{ margin:.3em 0 .4em; font-size:1.15rem; }
.autor-pilar p{ color:var(--autor-ink); opacity:.9; line-height:1.6; margin:0; }
.autor-dests{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.autor-dest{ border:1px solid #e3e3e8; border-radius:20px; padding:24px; background:#fff; display:flex; flex-direction:column; gap:8px; }
.autor-dest h3{ margin:0; font-size:1.25rem; }
.autor-dest p{ margin:0; color:var(--nb-body); line-height:1.6; flex:1; }
.autor-dest__estado{ align-self:flex-start; font-size:.78rem; font-weight:700; padding:5px 12px; border-radius:999px; background:#EEF1F0; color:var(--autor-night,#12302E); }
.autor-dest.is-live{ border-color:var(--autor-night); box-shadow:0 10px 30px rgba(18,48,46,.12); }
.autor-dest.is-live .autor-dest__estado{ background:#FFD000; color:#111; }
.autor-dest.is-prep .autor-dest__estado{ background:var(--autor-sand); }
.autor-dest__link{ align-self:flex-start; background:none; border:0; padding:0; font:inherit; font-weight:700; color:#111; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.autor-filtro{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.autor-filtro__col{ background:#fff; border-radius:20px; padding:26px; }
.autor-filtro__col ul{ list-style:none; padding:0; margin:12px 0 0; display:grid; gap:10px; }
.autor-filtro__col li{ padding-left:30px; position:relative; line-height:1.5; }
.autor-filtro__col.is-si li::before{ content:"✓"; position:absolute; left:0; color:#1E7A34; font-weight:800; }
.autor-filtro__col.is-no li::before{ content:"✕"; position:absolute; left:0; color:#C0392B; font-weight:800; }
.autor-pasos{ list-style:none; padding:0; margin:16px 0 0; display:grid; gap:14px; }
.autor-pasos li{ display:flex; gap:14px; align-items:flex-start; }
.autor-pasos li > span{ flex:0 0 34px; height:34px; border-radius:50%; background:var(--autor-night); color:#FFD000; display:grid; place-items:center; font-weight:800; }
.autor-pasos p{ margin:2px 0 0; color:var(--nb-body); }
.autor-quote{ display:grid; grid-template-columns:200px 1fr; gap:36px; align-items:center; max-width:900px; }
.autor-quote img{ width:200px; height:200px; border-radius:50%; object-fit:cover; border:4px solid #FFD000; }
.autor-quote blockquote{ margin:0; }
.autor-quote p{ font-size:1.2rem; line-height:1.65; color:#fff; }
.autor-quote cite{ display:block; margin-top:10px; font-style:normal; color:#FFD000; font-weight:700; }
@media (max-width:900px){
  .autor-pilares{ grid-template-columns:1fr 1fr; }
  .autor-dests,.autor-filtro{ grid-template-columns:1fr; }
  .autor-quote{ grid-template-columns:1fr; text-align:center; justify-items:center; }
  .autor-quote img{ width:140px; height:140px; }
  .autor-hero{ min-height:64vh; }
}
@media (max-width:520px){ .autor-pilares{ grid-template-columns:1fr; } }
.autor-hero > img{ object-position:center 30%; } .autor-hero{ min-height:78vh; }
@media (max-width:720px){
  .autor-hero{ display:block; min-height:0; }
  .autor-hero > img{ position:relative; height:52vh; object-position:center 40%; }
  .autor-hero::after{ display:none; }
  .autor-hero__content{ padding-top:22px; padding-bottom:34px; }
  .autor-hero h1{ font-size:2.5rem; }
  .autor-hero p{ font-size:1.05rem; }
}
.autor-dests--one{ grid-template-columns:minmax(0,1fr); max-width:720px; }
.autor-dests--one + .autor-next{ margin-top:16px; }
/* Foto a sangre dentro de la tarjeta (29-oct): img{max-width:100%} la dejaba 48px más estrecha que la caja. */
.autor-dest__img{ width:calc(100% + 48px); max-width:none; align-self:stretch; margin:-24px -24px 8px; aspect-ratio:16/9; object-fit:cover; object-position:50% 62%; border-radius:19px 19px 0 0; display:block; }
/* Viajes de autor: portada más contenida (feedback Berto 22-oct) */
.autor-hero{ min-height:0; height:clamp(380px,52vh,520px); }
@media (max-width:720px){ .autor-hero{ height:auto; } .autor-hero > img{ height:38vh; } }

/* ===== Fichas de viaje (22-oct, Berto): la foto con la fecha ocupa la ficha de arriba a abajo en escritorio.
   Misma ficha en home, fechas, tipos de viaje y destinos (cards_unify.py pone las mismas clases). ===== */
@media (min-width:860px){
  .trip-grid--scroll.trip-grid--compact.trip-grid--rows .trip-card,
  .trip-grid--rows .trip-card{ align-items:stretch; min-height:150px; }
  .trip-grid--rows .trip-card__media,
  .trip-grid.trip-grid--rows .trip-card .trip-card__media{
    aspect-ratio:auto !important; align-self:stretch; width:26% !important; flex:0 0 26% !important;
    min-height:150px; margin:0 !important; border-radius:0 !important;
  }
  .trip-grid--rows .trip-card__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .trip-grid--rows .trip-card__body{ padding:16px 20px; }
}

/* ===== Bloque común "¿Por qué viajar en grupo con Nomad Bee?" (why_block.py, 22-oct) ===== */
.nb-why{ background:#FBF7EC; }
.nb-why__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:64px; align-items:center; }
.nb-why__media{ position:relative; min-height:460px; }
.nb-why__img{ position:absolute; object-fit:cover; border-radius:24px; box-shadow:0 18px 40px rgba(0,0,0,.12); }
.nb-why__img--a{ top:0; left:0; width:78%; height:78%; }
.nb-why__img--b{ right:0; bottom:0; width:48%; height:56%; border:6px solid #FBF7EC; }
.nb-why__rating{ position:absolute; left:18px; bottom:22px; background:#fff; border-radius:16px; padding:12px 16px; display:flex; flex-direction:column; text-decoration:none; color:var(--nb-ink,#111); box-shadow:0 10px 26px rgba(0,0,0,.12); }
.nb-why__rating b{ font-size:1.5rem; line-height:1; }
.nb-why__rating span{ font-size:.8rem; color:var(--nb-muted); }
.nb-why__body h2{ margin:.2em 0 .35em; }
.nb-why__list{ list-style:none; padding:0; margin:26px 0 30px; display:grid; grid-template-columns:1fr 1fr; gap:22px 28px; }
.nb-why__item{ display:flex; gap:14px; align-items:flex-start; }
.nb-why__icon{ flex:0 0 44px; height:44px; border-radius:50%; background:#FFD000; color:#111; display:grid; place-items:center; }
.nb-why__icon svg{ width:22px; height:22px; }
.nb-why__item h3{ font-size:1.02rem; margin:2px 0 4px; }
.nb-why__item p{ margin:0; font-size:.92rem; line-height:1.55; color:var(--nb-body); }
.nb-why__ctas{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.nb-why__link{ font-weight:700; color:#111; text-decoration:underline; text-underline-offset:3px; }
@media (max-width:900px){
  .nb-why__grid{ grid-template-columns:1fr; gap:34px; }
  .nb-why__media{ min-height:320px; }
  .nb-why__list{ grid-template-columns:1fr; }
}
/* Fechas y tipos de viaje: cabecera del listado centrada, como el resto de la página (22-oct) */
#salidas .section-head{ text-align:center; margin-inline:auto; }
/* 29-oct (Berto): con justify-content:center, cuando los chips no caben el primero quedaba cortado
   ("aldivas") y sin forma de llegar a él. Centrado con márgenes automáticos: si caben, centrados;
   si no, empiezan pegados al margen y se desplazan. */
#salidas .dest-filter{ justify-content:flex-start; }
.dest-filter > :first-child{ margin-left:auto; }
.dest-filter > :last-child{ margin-right:auto; }
.dest-filter{ scroll-snap-type:x proximity; scroll-padding-inline:var(--nb-gutter); }
.dest-filter .chip{ scroll-snap-align:start; }
/* Degradado en el borde donde quedan más chips (main.js pone has-more-left / has-more-right). */
.dest-filter.has-more-right{ -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 56px), transparent); mask-image:linear-gradient(to right, #000 calc(100% - 56px), transparent); }
.dest-filter.has-more-left{ -webkit-mask-image:linear-gradient(to right, transparent, #000 56px); mask-image:linear-gradient(to right, transparent, #000 56px); }
.dest-filter.has-more-left.has-more-right{ -webkit-mask-image:linear-gradient(to right, transparent, #000 56px, #000 calc(100% - 56px), transparent); mask-image:linear-gradient(to right, transparent, #000 56px, #000 calc(100% - 56px), transparent); }
.scroll-rail--chips .scroll-rail__arrow{ top:calc(50% - 5px); width:36px; height:36px; font-size:1.05rem; }
@media (max-width:859px){
  /* Móvil: la fila llega al borde de la pantalla (como las demás tiras) y el primer chip
     arranca con el margen de la página; el siguiente asoma por la derecha. */
  .dest-filter{ margin-inline:calc(var(--nb-gutter) * -1); padding-inline:var(--nb-gutter); }
}
#salidas .trip-grid--rows{ max-width:1080px; margin-inline:auto; }
/* Más aire entre secciones en las landings (la web tiene que respirar) */
main > .section + .section{ border-top:0; }

/* ===== Portadas de tipos de viaje y fechas: más presencia (22-oct) ===== */
.hero-cover{ height:min(62vh,540px); }
.hero-cover::after{ background:linear-gradient(90deg, rgba(17,17,17,.72) 0%, rgba(17,17,17,.35) 45%, rgba(17,17,17,.05) 75%), linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.45) 100%); }
.hero-cover--center::after{ background:linear-gradient(180deg, rgba(17,17,17,.35) 0%, rgba(17,17,17,.25) 50%, rgba(17,17,17,.55) 100%); }
.hero-cover__content{ padding-bottom:48px; }
.hero-cover__content h1{ font-size:clamp(2.3rem,4.6vw,3.7rem); line-height:1.05; }
.hero-cover__content p, .hero-cover__content p.lead{ color:rgba(255,255,255,.94); max-width:58ch; font-size:1.05rem; }
.section-head--center{ text-align:center; margin-inline:auto; }
.section-head--center .eyebrow{ justify-content:center; }
/* Tarjetas de texto (beneficios, por qué…): más aire y jerarquía */
.value-grid{ grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; }
.value-card{ padding:28px 26px; border-radius:20px; border:1px solid #ECECEF; box-shadow:0 6px 18px rgba(0,0,0,.04); }
.value-card h3{ font-size:1.08rem; margin:0 0 8px; }
.value-card p{ line-height:1.6; }
/* 29-oct (Berto): en las cajas con foto (home "¿Por qué viajar con Nomad Bee?" y
   "Experiencias" de cada destino) la foto va a sangre: toca arriba y los lados de la
   caja. El padding de .value-card de justo arriba la estaba encogiendo. */
.value-card.value-card--photo{ padding:0; }
/* Listados largos: se muestran 10 y el resto con "Ver más salidas" (main.js) */
.trip-card.is-collapsed{ display:none !important; }
.salidas-more{ display:flex; justify-content:center; margin-top:18px; }

/* ===== Contacto (rediseño 22-oct) ===== */
.contact-hero{ background:#FBF7EC; padding:56px 0 46px; text-align:center; }
.contact-hero .lead{ max-width:62ch; margin:0 auto; }
.contact-hero h1{ margin:.15em 0 .3em; }
.contact-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:34px auto 0; max-width:980px; }
.contact-card{ background:#fff; border-radius:20px; padding:26px 22px; display:flex; flex-direction:column; align-items:center; gap:4px; text-decoration:none; color:#111; box-shadow:0 8px 24px rgba(0,0,0,.06); border:1px solid #EEE; transition:transform .15s ease, box-shadow .15s ease; }
.contact-card:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(0,0,0,.1); }
.contact-card b{ font-size:1.1rem; margin-top:8px; }
.contact-card span:not(.contact-card__icon){ font-weight:600; }
.contact-card em{ font-style:normal; font-size:.86rem; color:var(--nb-muted); }
.contact-card__icon{ width:52px; height:52px; border-radius:50%; background:#FFD000; display:grid; place-items:center; }
.contact-card__icon svg{ width:24px; height:24px; }
.contact-card--wa{ border-color:#25D366; }
.contact-card--wa .contact-card__icon{ background:#25D366; color:#fff; }
.contact-hours{ display:inline-flex; align-items:center; gap:8px; margin:22px 0 0; color:var(--nb-body); font-weight:500; }
.contact-hours svg{ width:18px; height:18px; }
.help-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.help-card{ border:1px solid #ECECEF; border-radius:20px; padding:26px; text-decoration:none; color:#111; display:flex; flex-direction:column; gap:8px; background:#fff; }
.help-card h3{ margin:0; font-size:1.08rem; }
.help-card p{ margin:0; color:var(--nb-body); flex:1; }
.help-card span{ font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.help-links{ text-align:center; margin-top:22px; color:var(--nb-muted); }
.help-links a{ color:#111; font-weight:600; }
.contact-form-wrap{ max-width:720px; }
.contact-form-intro{ text-align:center; margin-bottom:22px; }
.contact-form{ background:#fff; border-radius:22px; padding:30px; box-shadow:0 8px 24px rgba(0,0,0,.05); }
.contact-ok{ text-align:center; } .contact-ok p{ margin:0 0 12px; }
.dossier-form[hidden], .contact-form[hidden]{ display:none; } /* display:flex de .dossier-form ganaba al atributo hidden */
@media (max-width:860px){ .contact-cards, .help-grid{ grid-template-columns:1fr; } .contact-form{ padding:22px; } }
.icon-badge--num{ background:#FFD000 !important; font-weight:800; font-size:1.05rem; color:#111; }
.value-card .icon-badge{ background:#FFF4C2; }
/* Rejillas de tarjetas sin "huérfanas": 4 tarjetas = 4 columnas, 5 = 5 en escritorio ancho (22-oct) */
@media (min-width:1000px){
  .value-grid:has(> :nth-child(4):last-child){ grid-template-columns:repeat(4,minmax(0,1fr)); }
  .value-grid:has(> :nth-child(5):last-child){ grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }
  .value-grid:has(> :nth-child(5):last-child) .value-card{ padding:22px 18px; }
}
@media (min-width:1000px){
  .category-grid:has(> :nth-child(5):last-child){ grid-template-columns:repeat(5,minmax(0,1fr)); }
  .category-grid:has(> :nth-child(3):last-child){ grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* ===== Seguro de viaje (22-oct) ===== */
.ins-summary{ list-style:none; padding:0; margin:28px auto 0; max-width:760px; text-align:left; display:grid; gap:10px; }
.ins-summary li{ background:#fff; border-radius:14px; padding:12px 16px 12px 44px; position:relative; box-shadow:0 4px 14px rgba(0,0,0,.04); }
.ins-summary li::before{ content:"✓"; position:absolute; left:16px; top:11px; color:#1E7A34; font-weight:800; }
.ins-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.ins-card{ border:1px solid #ECECEF; border-radius:22px; padding:26px; display:flex; flex-direction:column; gap:10px; background:#fff; box-shadow:0 8px 22px rgba(0,0,0,.04); }
.ins-card:first-child{ border-color:#FFD000; box-shadow:0 12px 30px rgba(255,208,0,.18); }
.ins-card__logo{ display:flex; align-items:center; gap:12px; }
.ins-card__logo img{ width:44px; height:44px; object-fit:contain; border-radius:10px; }
.ins-card__logo b{ font-size:1.25rem; }
.ins-card__for{ font-weight:700; font-size:.9rem; color:#7A5B00; background:#FFF4C2; border-radius:999px; padding:4px 12px; align-self:flex-start; }
.ins-card p{ margin:0; color:var(--nb-body); flex:1; }
.ins-card__code{ flex:0 !important; font-size:.92rem; }
.ins-flex{ display:flex; align-items:center; justify-content:space-between; gap:28px; background:#FBF7EC; border-radius:24px; padding:32px; }
.ins-flex p{ margin:8px 0 0; max-width:70ch; }
@media (max-width:860px){ .ins-grid{ grid-template-columns:1fr; } .ins-flex{ flex-direction:column; align-items:flex-start; } }
/* Fichas dentro de la columna de la ficha de viaje ("Otras fechas"): la columna es estrecha, así que el texto ocupa
   toda la fila y debajo van coordinador, precio y botón (22-oct). */
@media (min-width:860px){
  #fechas .trip-grid--rows .trip-card__media{ width:32% !important; flex-basis:32% !important; }
  #fechas .trip-grid--rows .trip-card__body{ grid-template-columns:auto 1fr auto !important; row-gap:12px; align-content:center; }
  #fechas .trip-grid--rows .trip-card__info{ grid-column:1 / -1; width:auto; }
  #fechas .trip-grid--rows .trip-card__footer .price{ justify-self:end; text-align:right; }
  #fechas .trip-grid--rows .trip-card__footer .btn{ padding:10px 18px; font-size:.95rem; }
}
/* ===== Lo que recomendamos para tu viaje (22-oct) ===== */
.reco-nav{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:24px; }
.reco-nav a{ background:#fff; border:1px solid #E6E1D2; border-radius:999px; padding:8px 16px; font-weight:600; color:#111; text-decoration:none; }
.reco-row{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:48px; align-items:center; }
.reco-row__text p{ color:var(--nb-body); line-height:1.7; }
.ins-grid--one{ grid-template-columns:1fr !important; }
.reco-included{ list-style:none; padding:0; margin:0 auto 18px; max-width:760px; display:grid; gap:8px; }
.reco-included li{ background:#fff; border-radius:12px; padding:10px 16px 10px 40px; position:relative; }
.reco-included li::before{ content:"✓"; position:absolute; left:14px; color:#1E7A34; font-weight:800; }
.reco-note{ max-width:760px; margin:10px auto 26px; color:var(--nb-body); }
.reco-sub{ text-align:center; margin:30px 0 18px; }
@media (max-width:860px){ .reco-row{ grid-template-columns:1fr; gap:22px; } }
.reco-link{ display:block; margin-top:16px; padding:14px 18px; border-radius:14px; background:#FFF4C2; color:#111; text-decoration:none; }
.reco-app{ text-decoration:none; color:#111; display:flex; flex-direction:column; gap:8px; } .reco-app .ins-card__for{ align-self:flex-start; }
.reco-app .ins-card__logo h3{ margin:0; font-size:1.05rem; } .reco-app .ins-card__logo img{ width:40px; height:40px; }
/* Blog real (22-oct): imágenes y tablas del cuerpo y FAQ */
.prose img{ max-width:100%; height:auto; border-radius:14px; }
.prose figure{ margin:24px 0; }
.prose table{ width:100%; border-collapse:collapse; font-size:.92rem; margin:18px 0; display:block; overflow-x:auto; }
.prose th,.prose td{ border:1px solid #E6E6EA; padding:8px 10px; text-align:left; }
.post-faq{ margin-top:40px; }
.post-hero img{ object-fit:cover; }
/* Menú (23-oct): cada entrada en una sola línea y los meses en orden de lectura (columna a columna) */
.nav-links > a, .nav-links > .nav-item--has-mega > a{ white-space:nowrap; }
.mega-menu__col--meses ul{ grid-auto-flow:column !important; grid-template-rows:repeat(6, auto); }
.mobile-nav-mega__grid{ grid-auto-flow:column !important; grid-template-rows:repeat(6, auto); }
/* Flechas solo si de verdad hay scroll (23-oct) */
.scroll-rail.no-scroll .scroll-rail__arrow{ display:none !important; }
/* Home "¿Por qué viajar con Nomad Bee?": en escritorio 4 columnas sin scroll y la foto ocupando toda la tarjeta */
@media (min-width:1000px){
  #tipos .value-grid--scroll{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); overflow:visible; margin-inline:0; padding-inline:0; gap:20px; }
  #tipos .value-grid--scroll .value-card{ flex:none; }
  #tipos .scroll-rail__arrow{ display:none !important; }
}
#tipos .value-card--photo .value-card__img{ width:100%; aspect-ratio:4/3; object-fit:cover; padding:0 !important; display:block; }
/* 23-oct (Berto): fuera el recuadro amarillo de los resúmenes; el texto se queda como entradilla normal */
.op-summary{ background:none !important; border:0 !important; padding:0 !important; border-radius:0 !important; font-size:1.1rem; color:var(--nb-body); }
/* Cómo funciona (23-oct): estados con los emojis de siempre y tarjetas con foto de fondo */
.icon-badge--emoji{ font-size:1.5rem; background:#FFF4C2 !important; }
.value-card--bg{ min-height:260px; display:flex; flex-direction:column; justify-content:flex-end; color:#fff; background-size:cover; background-position:center; border:0 !important; }
.value-card--bg h3, .value-card--bg p{ color:#fff !important; }
.value-card--bg .icon-badge{ background:rgba(255,208,0,.95) !important; }
.header-account{ display:inline-flex; align-items:center; justify-content:center; }

/* Quiénes somos: en móvil, tras la intro va directa la foto de Berto */
@media (max-width: 720px){ .hide-mobile{ display:none !important; } }
/* Quiénes somos: titulares centrados con marcador amarillo (como la página original) */
.qs-title{ text-align:center; margin:28px auto 20px; line-height:1.25; }
.qs-title--big{ font-size:clamp(2rem,5vw,3.2rem); margin:0 auto 36px; }
.mark-yellow{ background:linear-gradient(transparent 55%, #FFD101 55%); padding:0 .12em; }
/* Footer: destinos en dos columnas + continentes en línea */
.footer-grid ul.footer-list--2col{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:24px; row-gap:9px; }
.footer-continents{ margin-top:12px; font-size:.9rem; line-height:1.7; }
.footer-continents a{ color:inherit; opacity:.85; }
@media (min-width: 1081px){ .footer-grid{ grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) repeat(3,minmax(0,1fr)); } }
@media (max-width: 720px){ .footer-grid ul.footer-list--2col{ grid-template-columns:minmax(0,1fr); } }

/* ---------------------------------------------------------------------
   Buscador de la home: desplegables propios (26-oct). El <select> nativo no se puede diseñar;
   main.js lo oculta y pinta este botón + panel (destinos con foto, nº de salidas y precio desde).
   --------------------------------------------------------------------- */
.search-card{ position:relative; }
.nb-pick{ position:relative; cursor:pointer; transition:background .15s; }
.nb-pick:hover, .nb-pick.is-open{ background:#F7F7F8; }
.nb-pick__btn{ all:unset; display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%;
  font-size:1rem; font-weight:700; color:var(--nb-black); cursor:pointer; padding:2px 0; }
.nb-pick__btn:focus-visible{ outline:2px solid var(--nb-yellow-dark); outline-offset:4px; border-radius:6px; }
.nb-pick__value.is-empty{ color:var(--nb-black); }
.nb-pick__chev{ width:9px; height:9px; border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-3px); transition:transform .2s; flex:none; }
.nb-pick.is-open .nb-pick__chev{ transform:rotate(-135deg) translateY(-1px); }
.nb-pick__panel{ position:absolute; z-index:40; top:calc(100% + 14px); left:0; width:min(560px, 92vw);
  background:#fff; border-radius:18px; box-shadow:0 18px 48px rgba(26,26,26,.22), 0 0 0 1px rgba(26,26,26,.05);
  padding:14px; color:var(--nb-body); cursor:default; animation:nbPickIn .16s ease-out; }
.nb-pick__panel--fecha{ width:min(460px, 92vw); }
@keyframes nbPickIn{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:none; } }
.nb-pick__scroll{ max-height:min(56vh, 460px); overflow-y:auto; overscroll-behavior:contain; padding:2px; }
.nb-pick__search{ position:relative; margin-bottom:10px; }
.nb-pick__search::before{ content:""; position:absolute; left:14px; top:50%; width:12px; height:12px; border:2px solid var(--nb-muted);
  border-radius:50%; transform:translateY(-60%); }
.nb-pick__search::after{ content:""; position:absolute; left:26px; top:58%; width:6px; height:2px; background:var(--nb-muted); transform:rotate(45deg); }
.nb-pick__search input{ width:100%; box-sizing:border-box; border:1.5px solid var(--nb-border); border-radius:12px;
  padding:12px 14px 12px 40px; font:inherit; font-size:.98rem; background:#FAFAFB; }
.nb-pick__search input:focus{ outline:none; border-color:var(--nb-yellow); background:#fff; box-shadow:0 0 0 4px rgba(255,209,1,.22); }
.nb-pick__any, .nb-pick__dest, .nb-pick__chip{ all:unset; box-sizing:border-box; cursor:pointer; border-radius:12px; transition:background .12s, box-shadow .12s; }
.nb-pick__any{ display:flex; align-items:center; gap:12px; width:100%; padding:10px; margin-bottom:6px; }
.nb-pick__globe{ display:grid; place-items:center; width:46px; height:46px; border-radius:12px; background:var(--nb-yellow); font-size:1.3rem; flex:none; }
.nb-pick__any b, .nb-pick__dest b{ display:block; font-size:.96rem; color:var(--nb-black); }
.nb-pick__any small, .nb-pick__dest small{ display:block; font-size:.8rem; color:var(--nb-muted); margin-top:2px; }
.nb-pick__group-title{ margin:10px 6px 6px; font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--nb-muted); }
.nb-pick__grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:4px; }
.nb-pick__dest{ display:flex; align-items:center; gap:12px; padding:8px; min-width:0; }
.nb-pick__dest img{ width:46px; height:46px; border-radius:12px; object-fit:cover; flex:none; }
.nb-pick__dest span{ min-width:0; }
.nb-pick__any:hover, .nb-pick__dest:hover, .nb-pick__chip:hover,
.nb-pick__any:focus-visible, .nb-pick__dest:focus-visible, .nb-pick__chip:focus-visible{ background:#F4F4F6; }
.nb-pick [aria-selected="true"]{ background:#FFF6CC; box-shadow:inset 0 0 0 1.5px var(--nb-yellow); }
.nb-pick__chips{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px; }
.nb-pick__chip{ display:flex; flex-direction:column; align-items:flex-start; padding:10px 12px; border:1.5px solid var(--nb-border); }
.nb-pick__chip b{ font-size:.9rem; color:var(--nb-black); }
.nb-pick__chip small{ font-size:.75rem; color:var(--nb-muted); margin-top:2px; }
.nb-pick__chip--special{ border-color:transparent; background:#FFF8D6; }
.nb-pick__chip--special:hover{ background:#FFF0A8; }
.nb-pick__empty{ margin:14px 8px; color:var(--nb-muted); font-size:.92rem; }
.nb-pick__empty a{ color:var(--nb-black); font-weight:600; text-decoration:underline; }
@media (max-width: 720px){
  .nb-pick__panel, .nb-pick__panel--fecha{ left:-14px; right:-14px; width:auto; top:calc(100% + 8px); }
  .nb-pick__grid{ grid-template-columns:minmax(0,1fr); }
  .nb-pick__chips{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .nb-pick__scroll{ max-height:58vh; }
}
/* El hero recorta (overflow:hidden) y cortaba el panel: se recortan solo las fotos de fondo. */
.hero:has(.search-card){ overflow:visible; }
.hero:has(.search-card) > picture, .hero:has(.search-card) .hero-slides{ overflow:hidden; }
.hero:has(.nb-pick.is-open){ z-index:30; }
.nb-pick [hidden]{ display:none !important; }
.nb-pick__chips--special{ grid-template-columns:repeat(2, minmax(0,1fr)); }
/* Filtro por mes desde el buscador de la home */
.salidas-filtro{ margin:0 0 16px; padding:10px 14px; border-radius:12px; background:#FFF8D6; font-size:.95rem; }
.salidas-filtro a{ font-weight:600; color:var(--nb-black); text-decoration:underline; }
#salidas .trip-card[hidden]{ display:none !important; }
/* Cabecera en tablet (revisión de clientes 27-oct, P1.10): entre 981 y 1180 px el menú no cabía (iPad Pro vertical
   salía a 1103 px y cortaba "Buscar viajes"). En ese tramo pasa a hamburguesa, igual que en móvil. */
@media (max-width: 1180px){
  .nav-links, .nav-actions .btn-outline{ display:none; }
  .hamburger{ display:flex; }
}

/* ===== Landings de tipo de viaje: plantilla común (29-oct) =====
   Tarjetas de solo texto (beneficios, por qué, verano infinito…) en el mismo
   carrusel horizontal de la home (.scroll-rail + .value-grid--scroll), algo más
   anchas que las de foto para que el texto no se haga una columna estrecha. */
.value-grid--scroll.value-grid--text .value-card{ flex:0 0 320px; }
.value-grid--scroll.value-grid--text .value-card p{ font-size:.95rem; }
@media (max-width:600px){
  .value-grid--scroll.value-grid--text .value-card{ flex-basis:80vw; padding:22px 20px; }
}
.value-grid--scroll.value-grid--text .value-card--photo{ padding:0; }
.value-grid--scroll.value-grid--text .value-card--photo .value-card__body{ padding:18px 20px 20px; }
.value-grid--scroll.value-grid--text .value-card--photo .value-card__img{ aspect-ratio:16/10; }

/* Icono de calendario en SVG (29-oct): sustituye al emoji 📅 (main.js / [...path].astro). */
.nb-ico-cal{ display:inline-block; width:1.05em; height:1.05em; vertical-align:-.15em; flex:none; }
.nb-pick__globe .nb-ico-cal{ width:24px; height:24px; color:var(--nb-black); }
/* ===== Landings de destino y expedición (auditoría 29-oct) ===== */
/* Desplegables del formulario de la guía: mismo aspecto que los campos de texto, con flecha propia */
.dossier-form input, .dossier-form select{ background-color:#fff; color:var(--nb-black); min-height:44px; }
.dossier-form select{
  -webkit-appearance:none; appearance:none; padding-right:40px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231A1A1A' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:14px;
}
.dossier-form select:invalid{ color:var(--nb-muted); }
.dossier-form select option{ color:var(--nb-black); }
.dossier-form input:focus, .dossier-form select:focus{ outline:none; border-color:var(--nb-black); box-shadow:0 0 0 3px rgba(255,209,1,.35); }
/* Pestañas de la landing: degradado a la derecha mientras quede algo por deslizar (el JS pone .is-end al final) */
.tab-row--fade:not(.is-end){
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);
  mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);
}
/* "4,9 ★★★★★ 415 reseñas en Google →" en una sola línea también a 320 px */
.review-top-badge{ max-width:100%; white-space:nowrap; }
@media (max-width:400px){
  .review-top-badge{ gap:6px; padding:8px 12px; }
  .review-top-badge__stars{ font-size:.78rem; letter-spacing:0; }
  .review-top-badge__count{ font-size:.76rem; }
}
@media (max-width:360px){ .review-top-badge__stars{ display:none; } } /* a 320 px no caben las 5 estrellas: queda "4,9 · 415 reseñas" */
/* Portada: H1 y debajo la línea de datos (desde X€ · días · salidas) */
.hero-cover__content--stack{ flex-direction:column; align-items:center; gap:12px; }
.hero-cover__content--stack h1{ margin-bottom:0; }
/* Datos de la landing, debajo de la foto: en la portada solo va el H1 (Berto, 30-oct) */
.hero-facts-bajo{ margin-top:16px; padding-inline:16px; text-align:center; }
.hero-facts-bajo:has(> [hidden]){ display:none; }
.hero-cover__facts{
  margin:0 auto; max-width:62ch; font-weight:600; font-size:clamp(.9rem,3.4vw,1.05rem);
  text-wrap:balance; line-height:1.45;
}
/* Tablas anchas dentro de "en detalle" (clima de Indonesia): se deslizan en móvil */
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; }
.table-scroll table{ min-width:480px; }
/* Expedición Raja Ampat con los componentes de la web */
.exp-resumen{ list-style:none; margin:0 auto; padding:0; max-width:1080px; display:grid; gap:10px 32px; grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); font-size:.95rem; line-height:1.6; }
.exp-resumen strong{ color:var(--nb-black); }
.exp-days{ margin:12px 0 0; padding:0; list-style:none; display:grid; gap:4px; font-size:.88rem; }
.exp-video{ position:relative; display:block; margin-top:28px; border-radius:20px; overflow:hidden; aspect-ratio:16/9; max-height:520px; width:100%; }
.exp-video img{ width:100%; height:100%; object-fit:cover; display:block; }
.exp-video::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(17,17,17,.05) 40%,rgba(17,17,17,.6) 100%); }
.exp-video__label{ position:absolute; left:20px; right:20px; bottom:18px; z-index:1; display:flex; align-items:center; gap:12px; color:#fff; font-weight:700; font-size:1.02rem; }
.exp-video__play{ flex-shrink:0; width:48px; height:48px; border-radius:50%; background:var(--nb-yellow); color:var(--nb-black); display:grid; place-items:center; font-size:1.05rem; padding-left:3px; }
.exp-video__note{ font-size:.85rem; margin-top:8px; }
.exp-steps{ list-style:none; margin:0; padding:0; display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr)); }
.exp-steps .icon-badge{ margin-bottom:0; }
.exp-steps h3{ font-size:1rem; margin:12px 0 6px; }
.exp-steps p{ font-size:.9rem; color:var(--nb-muted); margin:0; }
.exp-apply{ max-width:70ch; margin:32px auto 0; text-align:center; background:var(--nb-bg-2); border-radius:20px; padding:28px 24px; }
.exp-apply h3{ font-size:1.3rem; margin:0 0 10px; }
.exp-apply p{ font-size:.98rem; line-height:1.7; }
.exp-apply__fine{ font-size:.85rem !important; margin-top:12px; }

/* 29-oct: el botón de WhatsApp (48 px, abajo a la derecha) se ve desde la primera pantalla. A 320x568 el H1 de Viajes de
   autor caía justo debajo: en móvil el texto de esa portada deja libre la franja derecha del botón. */
@media (max-width:720px){
  .autor-hero .autor-hero__content > h1,
  .autor-hero .autor-hero__content > p{ padding-right:56px; }
}

/* Cómo funciona: «Es para ti si... / No es para ti si...» (30-oct). Mismo lenguaje que las value-card de la
   página: tarjeta blanca con borde fino, icon-badge con trazo negro, amarillo de marca solo como acento. */
.fit-compare-card{
  margin-top:56px; background:#fff; border:1px solid var(--nb-border); border-radius:var(--nb-radius-lg);
  padding:clamp(22px, 4vw, 40px);
}
.fit-compare__head{ max-width:62ch; margin-bottom:28px; }
.fit-compare__head h2{ font-size:clamp(1.35rem, 2.6vw, 1.9rem); }
.fit-compare__head p{ color:var(--nb-muted); font-size:1.02rem; margin:0; }
.fit-compare__cols{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:22px; }
.fit-compare__col{
  display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; column-gap:14px; align-content:start;
  border-radius:var(--nb-radius); padding:24px 22px; background:var(--nb-bg); border:1px solid var(--nb-border);
}
.fit-compare__col--yes{ background:#FFFBEA; border-color:#FFE680; }
.fit-compare__col .icon-badge{
  width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:var(--nb-bg-2);
}
.fit-compare__col--yes .icon-badge{ background:#FFD000; }
.fit-compare__col h3{ margin:0; font-size:1.15rem; }
.fit-compare__col ul{ grid-column:1 / -1; list-style:none; margin:18px 0 0; padding:0; display:grid; gap:12px; }
.fit-compare__col li{ position:relative; padding-left:30px; font-size:.95rem; line-height:1.45; color:var(--nb-body); }
.fit-compare__col li::before{
  content:""; position:absolute; left:0; top:.15em; width:19px; height:19px; border-radius:50%;
  background-repeat:no-repeat; background-position:center; background-size:12px 12px;
}
.fit-compare__col--yes li::before{
  background-color:#FFD000;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1A1A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
}
.fit-compare__col--no li::before{
  background-color:#E4E5E8;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A4F57' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E");
}
.fit-compare__note{
  margin:26px 0 0; padding:16px 18px; border-radius:var(--nb-radius-sm); background:var(--nb-bg-2);
  border-radius:0 var(--nb-radius-sm) var(--nb-radius-sm) 0; font-size:.98rem; line-height:1.6; color:var(--nb-body);
}
@media (max-width:760px){
  /* En móvil la tarjeta de fuera se quita (fondo de la sección): las dos columnas ya son tarjetas y así el texto respira. */
  .fit-compare-card{ margin-top:40px; background:none; border:none; padding:0; border-radius:0; }
  .fit-compare__cols{ grid-template-columns:minmax(0,1fr); gap:16px; }
  .fit-compare__col{ padding:20px 18px; }
}

/* ---------------------------------------------------------------------
   Campaña (/assets/js/campana.js, ficha "Campaña" de nomadbee-core). Nada de esto se aplica sin campaña en curso.
   La barra se queda fija arriba y todo lo que ya era fijo baja lo que mide (--nb-bar-h, lo pone campana.js).
--------------------------------------------------------------------- */
.urgency-banner--campana{ background:var(--nb-black); color:var(--nb-white); }
.urgency-banner--campana b{ color:var(--nb-yellow); }
.urgency-banner__link{ display:block; color:inherit; text-decoration:none; }
html.nb-campana-on{ scroll-padding-top:var(--nb-bar-h, 0px); } /* los enlaces a una sección no se quedan debajo de la barra */
html.nb-campana-on .urgency-banner{ position:sticky; top:0; }
html.nb-campana-on .site-header{ top:var(--nb-bar-h, 0px); }
html.nb-campana-on .tab-row,
html.nb-campana-on .filter-bar{ top:calc(73px + var(--nb-bar-h, 0px)); }
html.nb-campana-on .toc,
html.nb-campana-on .summary-card,
html.nb-campana-on .faq-cat-nav{ top:calc(96px + var(--nb-bar-h, 0px)); }
html.nb-campana-on .booking-card{ top:calc(132px + var(--nb-bar-h, 0px)); }
html.nb-campana-on .dep-panel{ top:calc(140px + var(--nb-bar-h, 0px)); }
@media (max-width:720px){
  html.nb-campana-on .tab-row{ top:calc(65px + var(--nb-bar-h, 0px)); }
}
.badge-campana{ background:var(--nb-black); color:var(--nb-yellow); }
.trip-grid--rows .trip-card__badges .badge-campana{ display:inline-block; font-size:.74rem; padding:4px 10px; }
.trip-card__badges .badge-campana{ max-width:calc(100% - 84px); line-height:1.25; } /* no se mete debajo de la pegatina del descuento */
.campana-ahorro{ font-weight:700; color:var(--nb-black); background:var(--nb-yellow); border-radius:8px; padding:4px 10px; margin:6px 0 10px; font-size:.86rem; display:inline-block; }
.sticky-cta-mobile .price-deposit .price-total{ display:block; color:var(--nb-black); font-size:.8rem; }
.sticky-cta-mobile .price-deposit .price-total s{ color:var(--nb-muted); }
[data-campana-card][hidden]{ display:none !important; }
.campana-condiciones{ display:grid; gap:8px; padding-left:1.1em; margin:14px 0 0; }
.campana-fechas{ font-weight:700; }
.campana-vuelve{ text-align:center; }
.campana-vuelve .btn{ margin:8px 6px 0; }

/* Landing de campaña para tráfico de pago (/viajes/black-friday-nomad-bee/, /viajes/black-friday-nomad-bee/): la oferta, la cuenta
   atrás y la primera salida en la primera pantalla del móvil, sin menú, y la tarjeta entera pulsable. */
.campana-sem .campana-header .nav-row{ justify-content:space-between; }
.campana-sem .urgency-banner{ display:none; } /* la cinta de la portada ya dice lo mismo */
.campana-sem .trip-card__badges .badge-campana{ white-space:nowrap; max-width:none; }
.campana-hero{ position:relative; color:var(--nb-white); overflow:hidden; background:radial-gradient(130% 100% at 50% 125%, rgba(255,209,1,.26), transparent 62%), #0b0b0b; }
.campana-cinta{ overflow:hidden; white-space:nowrap; background:var(--nb-yellow); color:var(--nb-black); font-weight:800; font-size:.72rem; letter-spacing:.14em; line-height:1; padding:6px 0; }
.campana-cinta span{ display:inline-block; animation:campana-cinta 40s linear infinite; }
@keyframes campana-cinta{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .campana-cinta span{ animation:none; } }
.campana-hero__txt{ position:relative; padding-block:14px 16px; text-align:center; }
.campana-hero__marca{ color:var(--nb-yellow); font-weight:800; font-size:.86rem; letter-spacing:.2em; text-transform:uppercase; margin:0 0 4px; }
.campana-hero h1{ color:var(--nb-white); font-size:clamp(1.65rem,7.4vw,3.2rem); font-weight:800; line-height:1.08; letter-spacing:-.01em; margin:0 auto 10px; max-width:15em; }
.campana-hero h1 em{ font-style:normal; color:var(--nb-yellow); }
.campana-hero__oferta{ display:inline-block; background:var(--nb-yellow); color:var(--nb-black); font-weight:800; font-size:clamp(1.3rem,6.2vw,2.3rem); line-height:1.15; padding:6px 14px; border-radius:10px; transform:rotate(-1.5deg); margin:0 0 10px; }
.campana-hero__oferta[hidden]{ display:none; }
.campana-hero__txt > .campana-cuenta{ display:flex; justify-content:center; }
.campana-hero__txt > .campana-cuenta[hidden]{ display:none; }
.campana-cuenta{ display:inline-flex; align-items:center; gap:6px; }
.campana-cuenta[hidden]{ display:none; }
.campana-cuenta__txt{ font-size:.82rem; font-weight:700; margin-right:4px; }
.campana-cuenta__box{ display:inline-flex; flex-direction:column; align-items:center; min-width:44px; padding:4px 4px 3px; border-radius:8px; background:var(--nb-yellow); color:var(--nb-black); line-height:1; }
.campana-cuenta__box b{ font-size:1.08rem; font-variant-numeric:tabular-nums; }
.campana-cuenta__box small{ font-size:.62rem; font-weight:600; margin-top:2px; }
.campana-pruebas[hidden]{ display:none; }
.campana-pruebas{ display:flex; flex-direction:column; align-items:center; gap:5px; padding-top:8px; }
.campana-pruebas .review-top-badge{ padding:3px 12px; box-shadow:none; }
.campana-pagos{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:0 5px; margin:0; font-size:.74rem; line-height:1.25; }
.campana-pagos__fl{ display:inline-flex; align-items:center; gap:5px; }
.campana-pagos__fl img{ height:13px; width:auto; }
.campana-pagos small{ flex-basis:100%; text-align:center; font-size:.68rem; color:var(--nb-muted); }
.campana-sem #salidas-campana{ padding-top:8px; }
.campana-sem #salidas-campana .section-head{ margin-bottom:6px; }
.campana-sem #salidas-campana .section-head h2{ font-size:1.05rem; margin:0; }
.campana-buscador{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:8px 0 6px; }
.campana-buscador[hidden]{ display:none; }
.campana-buscador label{ display:block; font-size:.74rem; font-weight:700; }
.campana-buscador select{ display:block; width:100%; margin-top:2px; min-height:44px; padding:8px 28px 8px 10px; border:1.5px solid var(--nb-black); border-radius:10px; background-color:#fff; font:inherit; font-size:.9rem; font-weight:600; color:var(--nb-black); }
.campana-res{ margin:0 0 10px; font-size:.78rem; color:var(--nb-muted); }
.campana-sem #salidas-campana .campana-fechas{ margin:14px 0 0; text-align:center; font-size:.82rem; }
@media (max-width:720px){
  .campana-sem .trip-grid--rows .trip-card__media{ aspect-ratio:21/9; }
}
.campana-mas{ margin-top:14px; text-align:center; }
.campana-mas[hidden]{ display:none; }
.campana-whatsapp{ text-align:center; }
.campana-pie{ padding:22px 0 32px; font-size:.78rem; color:var(--nb-muted); text-align:center; }
.campana-pie .container{ display:flex; flex-wrap:wrap; justify-content:center; gap:6px 14px; }
.campana-pie a{ color:inherit; }
.campana-pie span{ flex-basis:100%; }
/* Tarjeta entera pulsable: el enlace "Ver viaje" se estira sobre toda la tarjeta; el coordinador sigue siendo su propio botón. */
.campana-sem .trip-card{ position:relative; }
.campana-sem .trip-card__footer .btn::after{ content:""; position:absolute; inset:0; z-index:5; }
.campana-sem .trip-card .trip-card__meta, .campana-sem .trip-card .coord-mini{ position:relative; z-index:6; }
/* el botón se mueve al pasar por encima, y eso encogería el enlace estirado al tamaño del botón */
.campana-sem .trip-card__footer .btn:hover, .campana-sem .trip-card__footer .btn:active{ transform:none; }
/* Banner de cookies compacto en móvil: una fila de botones y lo demás en una línea. */
@media (max-width:520px){
  body.campana-sem .nbc{ padding:10px 12px 8px; font-size:.76rem; }
  body.campana-sem .nbc__title{ display:none; }
  body.campana-sem .nbc__msg{ margin:0 0 8px; line-height:1.3; }
  body.campana-sem .nbc__btns .btn{ min-height:38px; padding:6px 10px; font-size:.84rem; }
  body.campana-sem .nbc__cfg{ display:inline-block; width:auto; margin:6px 12px 0 0; padding:2px 0; font-size:.72rem; font-weight:500; }
  body.campana-sem .nbc__links{ display:inline-flex; margin:6px 0 0; gap:2px 10px; font-size:.68rem; vertical-align:top; }
}

/* ===== Plantilla común de landings y fichas (web/src/lib/plantillas.mjs), feedback de Berto del 30-oct ===== */
/* Tarjetas enteras pulsables (Clarity: 12 % de sesiones con clics muertos en las páginas de fechas) */
.trip-card{ position:relative; }
.trip-card__footer .btn::after{ content:""; position:absolute; inset:0; z-index:5; }
.trip-card .trip-card__meta, .trip-card .coord-mini{ position:relative; z-index:6; }
/* el botón se mueve al pasar por encima, y eso encogería el enlace estirado al tamaño del botón */
.trip-card__footer .btn:hover, .trip-card__footer .btn:active{ transform:none; }

/* Banner de cookies compacto en móvil (hoy, 11-31 % de los clics de cada landing) */
@media (max-width:520px){
  body .nbc{ padding:10px 12px 8px; font-size:.76rem; }
  body .nbc__title{ display:none; }
  body .nbc__msg{ margin:0 0 8px; line-height:1.3; }
  body .nbc__btns .btn{ min-height:38px; padding:6px 10px; font-size:.84rem; }
  body .nbc__cfg{ display:inline-block; width:auto; margin:6px 12px 0 0; padding:2px 0; font-size:.72rem; font-weight:500; }
  body .nbc__links{ display:inline-flex; margin:6px 0 0; gap:2px 10px; font-size:.68rem; vertical-align:top; }
}

/* Landing de Islandia: fecha y precio en la primera pantalla del móvil */
.ld-salidas{ display:none; }
.ld-opinion{ display:inline-flex; align-items:center; gap:6px; font-size:.82rem; color:inherit; text-decoration:none; }
.ld-opinion svg{ width:15px; height:15px; flex-shrink:0; }
.ld-opinion .ld-est{ color:var(--nb-yellow-dark); letter-spacing:.5px; }
.ld-opinion u{ font-weight:600; }
@media (max-width:780px){
  .landing-destino .breadcrumb{ margin:6px 0; font-size:.76rem; }
  .landing-destino main > .container:first-child{ padding-top:0 !important; }
  .landing-destino .hero-cover{ height:260px !important; min-height:0 !important; }
  .landing-destino .hero-cover h1{ font-size:1.55rem; margin:0; }
  .landing-destino main > .container:has(> .review-top-badge){ display:none !important; }
  .ld-salidas{ display:block; padding-block:10px 2px; }
  .ld-salidas__head{ display:flex; justify-content:space-between; align-items:center; gap:2px 8px; margin-bottom:6px; } /* siempre en una línea: si dependiera de la fuente, saltaría al cargar */
  .ld-salidas__head > b{ font-size:.94rem; white-space:nowrap; }
  .ld-salidas__head .ld-opinion{ font-size:.72rem; gap:4px; white-space:nowrap; }
  .ld-fila{ display:grid; grid-template-columns:1fr auto; gap:0 10px; align-items:center; padding:9px 12px; margin-bottom:6px; min-height:54px; background:#fff; border:1.5px solid var(--nb-border); border-radius:12px; color:inherit; text-decoration:none; }
  .ld-fila__f{ font-weight:700; font-size:.92rem; line-height:1.2; }
  @media (min-width:380px){ .ld-fila__f{ white-space:nowrap; } }
  @media (max-width:379px){ .ld-salidas__head{ flex-direction:column; align-items:flex-start; } }
  .ld-fila__e{ grid-column:1; font-size:.74rem; color:var(--nb-muted); line-height:1.2; margin-top:2px; }
  .ld-fila .price{ grid-column:2; grid-row:1 / span 2; display:flex; align-items:baseline; gap:6px; margin:0; }
  .ld-fila .price .old{ font-size:.76rem; }
  .ld-fila .price .new{ font-size:1.05rem; }
  .ld-todas{ display:block; text-align:center; font-weight:600; font-size:.86rem; padding:4px 0 8px; }
}

/* Ficha: resumen de "Qué incluye" arriba y barra móvil con total y ahorro */
.fi-incluye{ margin:14px 0 4px; padding:12px 14px; border:1.5px solid var(--nb-border); border-radius:12px; background:#fff; font-size:.86rem; }
.fi-incluye h2{ font-size:.98rem; margin:0 0 6px; }
.fi-incluye h3{ font-size:.86rem; margin:10px 0 5px; }
.fi-incluye ul{ list-style:none; margin:0; padding:0; display:grid; gap:4px; }
.fi-incluye li{ display:flex; gap:7px; line-height:1.3; }
.fi-incluye .si{ color:var(--nb-success-fg); font-weight:800; }
.fi-incluye .no{ color:#b42318; font-weight:800; }
.fi-incluye__no{ margin-top:10px !important; padding-top:8px !important; border-top:1px solid var(--nb-border); }
.fi-incluye .btn{ display:block; width:100%; margin-top:10px; text-align:center; }
@media (min-width:781px){ .fi-incluye > ul:not(.fi-incluye__no){ grid-template-columns:1fr 1fr; gap:4px 18px; } .fi-incluye .btn{ display:inline-block; width:auto; } }

/* Día a día: cada concepto en su línea, con la etiqueta subrayada en amarillo */
.fi-dia-nota{ display:grid; gap:3px; margin-top:10px; font-size:.88rem; line-height:1.35; }
.fi-marca-dia{ font-weight:700; background:linear-gradient(transparent 62%, var(--nb-yellow) 62%, var(--nb-yellow) 92%, transparent 92%); padding:0 2px; }

/* Landing de destino: precio, días y salidas con diseño */
.ld-datos{ display:flex !important; flex-wrap:wrap; justify-content:center; align-items:baseline; gap:2px 16px; margin:0 auto; font-size:.92rem; font-weight:500; color:var(--nb-body); line-height:1.4; }
.ld-datos > *{ white-space:nowrap; }
.ld-datos__desde{ font-family:var(--font-display); font-size:1.28rem; font-weight:800; color:var(--nb-black); }
.ld-datos > span::before{ content:"✓"; margin-right:5px; font-weight:800; color:var(--nb-success-fg); }
.hero-facts-bajo:has(> .ld-datos){ margin-top:10px; }
@media (max-width:780px){
  .ld-datos{ gap:0 12px; font-size:.86rem; }
  .ld-datos__desde{ flex-basis:100%; text-align:center; }
}

/* Early Bee: rotulador de marca, de la misma familia que .hero-eyebrow ("GRUPOS REDUCIDOS") y las creatividades de paid. Es una frase
   con rotulador, no un aviso en caja. Con la campaña en curso lo sustituye ella. */
.eb-marca{ display:flex; flex-wrap:wrap; align-items:center; gap:2px 8px; margin:0 0 12px; padding:0; font-family:var(--font-body); font-size:.9rem; font-weight:600; line-height:1.3; color:var(--nb-black); }
.eb-marca__tag{ display:inline-block; white-space:nowrap; font-family:var(--font-display); font-weight:900; font-size:.8rem; letter-spacing:.04em; text-transform:uppercase; line-height:1; padding:7px 12px 6px; color:var(--nb-black); background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M5 10 C38 3 118 6 195 6 C200 14 199 27 196 34 C140 39 62 37 7 34 C1 27 1 17 5 10 Z' fill='%23FFD101'/%3E%3C/svg%3E") center/100% 100% no-repeat; transform:rotate(-1.5deg); }
.eb-marca__txt{ display:inline-block; }
.section-head.center + .eb-marca, .section-head--center + .eb-marca{ justify-content:center; }
@media (max-width:359px){ .eb-marca{ font-size:.85rem; } .eb-marca__tag{ font-size:.74rem; padding:6px 10px 5px; } }
@media (min-width:1024px){ .eb-marca{ font-size:.95rem; } .eb-marca__tag{ font-size:.84rem; } }
html.nb-campana-on .eb-marca{ display:none; }
@media (max-width:780px){
  .ld-salidas .eb-marca{ margin:0 0 6px; }
  .eb-marca{ font-size:.76rem; gap:2px 6px; }
  .eb-marca__tag{ font-size:.72rem; padding:6px 10px 5px; }
  #salidas > .container > .eb-marca{ display:none; } /* en móvil ya va arriba, con las próximas salidas */
}

/* Portadas de páginas institucionales: mismo formato que las landings; lo que iba dentro de la portada, justo debajo */
@media (max-width:780px){ .portada-simple{ height:260px !important; min-height:0 !important; } .portada-simple h1{ font-size:1.55rem; margin:0; } }
.page-hero.portada-bajo, .contact-hero.portada-bajo{ padding-top:24px; }
section.portada-bajo:not(.page-hero):not(.contact-hero){ padding-block:24px 8px; color:var(--nb-body); }
section.portada-bajo .lead{ color:var(--nb-body); text-shadow:none; }
section.portada-bajo .autor-eyebrow{ color:var(--nb-black); text-shadow:none; }


/* Ficha: caja de reserva en ordenador. Medía 1.063 px y, fija arriba, dejaba el botón fuera de una pantalla de 900 px */
.fi-nowrap{ white-space:nowrap; }
@media (min-width:1000px){
  .trip-v2 aside.booking-card{ max-height:calc(100vh - 148px); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; padding-block:16px; }
  .trip-v2 aside.booking-card .price-deposit-note{ display:none; }
  .trip-v2 aside.booking-card .price-note{ margin-block:2px; font-size:.78rem; }
  .trip-v2 aside.booking-card .trust-inline{ display:flex; flex-wrap:wrap; gap:0 10px; margin-block:4px; font-size:.74rem; }
  .trip-v2 aside.booking-card .booking-card__fixed-date{ padding:8px 10px; margin-block:6px; }
  .trip-v2 aside.booking-card .booking-card__fixed-date > span{ font-size:.86rem; }
  .trip-v2 aside.booking-card .booking-card__fixed-date a{ font-size:.74rem; }
  .trip-v2 aside.booking-card .pay-option{ min-height:0; padding:8px 12px; margin-bottom:6px; }
  .trip-v2 aside.booking-card .pay-option__price{ font-size:1rem; }
  .trip-v2 aside.booking-card .pay-option small{ font-size:.74rem; }
  .trip-v2 aside.booking-card .pay-help{ font-size:.72rem; line-height:1.3; margin-block:6px; }
}

/* Home: bloque de Black Friday justo debajo de la portada */
.campana-home{ display:block; color:#fff; text-decoration:none; overflow:hidden; background:radial-gradient(130% 110% at 50% 130%, rgba(255,209,1,.28), transparent 62%), #0b0b0b; }
.campana-home:hover{ color:#fff; }
.campana-home__cinta{ display:block; overflow:hidden; white-space:nowrap; background:var(--nb-yellow); color:var(--nb-black); font-weight:800; font-size:.72rem; letter-spacing:.14em; line-height:1; padding:6px 0; }
.campana-home__cinta span{ display:inline-block; animation:campana-home-cinta 40s linear infinite; }
@keyframes campana-home-cinta{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .campana-home__cinta span{ animation:none; } }
.campana-home__in{ display:flex; flex-direction:column; align-items:center; gap:8px; max-width:900px; margin:0 auto; padding:18px 16px 20px; text-align:center; }
.campana-home__marca{ color:var(--nb-yellow); font-weight:800; font-size:.86rem; letter-spacing:.2em; text-transform:uppercase; }
.campana-home strong{ font-size:clamp(1.55rem,6.8vw,2.8rem); font-weight:800; line-height:1.08; letter-spacing:-.01em; }
.campana-home strong em{ font-style:normal; color:var(--nb-yellow); }
.campana-home__oferta{ display:inline-block; background:var(--nb-yellow); color:var(--nb-black); font-weight:800; font-size:clamp(1.25rem,5.6vw,2rem); line-height:1.15; padding:5px 14px; border-radius:10px; transform:rotate(-1.5deg); }
.campana-home__cta{ font-weight:700; font-size:.95rem; text-decoration:underline; text-underline-offset:3px; }

/* Reserva: método de pago de un solo toque en la caja de la ficha, con el elegido muy claro */
.pay-option{ position:relative; min-height:72px; padding:14px 16px; }
.pay-option input{ position:absolute; opacity:0; width:100%; height:100%; left:0; top:0; margin:0; cursor:pointer; }
.pay-option:has(input:checked){ border:2.5px solid var(--nb-black); background:#fff7cc; }
.pay-option:has(input:checked) .pay-option__body b::after{ content:" ✓"; color:var(--nb-success-fg); font-weight:800; }
.pay-option:has(input:focus-visible){ outline:3px solid var(--nb-yellow-dark); outline-offset:2px; }

/* Ficha en móvil: barra como la de la web original, y lo que deja de ir en ella, en un recuadro (la caja de reserva no se ve en móvil) */
.sticky-cta-mobile > .price{ display:flex; align-items:baseline; gap:8px; margin:0; }
.sticky-cta-mobile > .price .old{ font-size:.9rem; }
.sticky-cta-mobile > .price .new{ font-size:1.4rem; font-weight:800; }
.fi-reserva{ display:none; }
@media (max-width:720px){
  .fi-reserva{ display:block; margin:12px 0 4px; padding:10px 14px; border-radius:12px; background:var(--nb-yellow-soft, #fff7cc); font-size:.88rem; }
  .fi-reserva p{ margin:0; }
  .fi-reserva .price{ display:inline-flex; align-items:baseline; gap:6px; margin:0; }
  .fi-reserva .price .old{ font-size:.82rem; }
  .fi-reserva .price .new{ font-size:1.02rem; font-weight:800; }
  .fi-reserva__total{ display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 8px; }
  .fi-reserva__ahorro{ padding:0 6px; border-radius:6px; background:var(--nb-yellow); color:var(--nb-black); font-weight:700; font-size:.76rem; white-space:nowrap; }
  .fi-reserva__ahorro[hidden]{ display:none; }
  .fi-reserva__hoy{ margin-top:3px !important; }
  .fi-reserva__hoy small{ display:block; font-size:.78rem; color:var(--nb-muted); }

  /* Fotos: 1 grande + 3 miniaturas */
  .gallery{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .gallery a:first-child{ grid-column:1/-1; }
  .gallery a:nth-child(n+5){ display:none; }
}

/* Home: bloque de campaña justo debajo de la portada. Solo se ve con la campaña en curso (/assets/js/campana.js) */
.campana-home[hidden]{ display:none; }

/* Menú de escritorio (feedback de Berto, 30-oct): los paneles grandes salen desde el inicio del menú, no centrados en su enlace,
   para que no se corten por ningún lado y se llegue a ellos en línea recta con el ratón; regiones con jerarquía y marca, y color al pasar por encima. */
@media (min-width:1181px){
  .nav-links{ position:relative; }
  .nav-item--has-mega:has(> .mega-menu--dest), .nav-item--has-mega:has(> .mega-menu--fechas){ position:static; }
  .mega-menu--dest, .mega-menu--fechas{ left:0; transform:none; top:calc(100% + 13px); }
  .mega-menu--fechas{ width:min(640px,92vw); }
  .mega-menu{ border-top:4px solid var(--nb-yellow); border-radius:0 0 16px 16px; }
  .mega-menu::before{ content:""; position:absolute; left:0; right:0; bottom:100%; height:18px; } /* puente: que no se cierre al bajar el ratón */
  .mega-menu__col h4{ margin:0 0 10px; padding-bottom:6px; border-bottom:2px solid var(--nb-yellow); font-family:var(--font-display); font-size:1.08rem; font-weight:800; letter-spacing:0; text-transform:none; color:var(--nb-black); }
  .mega-menu__col h4 a:hover{ background:none; text-decoration:underline; text-decoration-color:var(--nb-yellow); text-decoration-thickness:3px; text-underline-offset:3px; }
  .mega-menu__col li a{ color:var(--nb-body); transition:background .12s ease, color .12s ease; }
  .mega-menu__col li a:hover{ background:var(--nb-yellow); color:var(--nb-black); }
  .mega-menu__footer{ border-top:0; margin-top:0; padding-top:4px; }
  .mega-menu__footer a{ display:inline-block; padding:8px 14px; border-radius:10px; background:var(--nb-yellow); color:var(--nb-black); font-weight:700; }
  .mega-menu__footer a:hover{ background:var(--nb-yellow-dark); color:var(--nb-black); }
}
.info-intro{ max-width:70ch; margin:0 0 20px; }

/* El grupo de la salida en la ficha: cifras agregadas, nunca nombres (/assets/js/grupo.js) */
.trip-group{ margin:14px 0 0; padding:14px 16px; border:1px solid var(--nb-border); border-radius:var(--nb-radius); background:#fff; }
.trip-group__title{ margin:0 0 10px; font-weight:700; font-size:.95rem; }
.trip-group__wall{ display:flex; flex-wrap:wrap; gap:3px; }
.trip-group__wall i{ display:block; width:22px; height:22px; }
.trip-group__wall svg{ display:block; width:100%; height:100%; }
.trip-group__wall .is-a svg{ fill:var(--nb-yellow); stroke:var(--nb-black); stroke-width:1.2; }
.trip-group__wall .is-o svg{ fill:var(--nb-black); }
.trip-group__who{ margin:6px 0 0; font-size:.86rem; color:var(--nb-muted); }
.trip-group__stats{ display:flex; flex-wrap:wrap; gap:10px 24px; margin-top:12px; padding-top:12px; border-top:1px solid var(--nb-border); }
.trip-group__stats div{ flex:1 1 120px; min-width:0; }
.trip-group__stats b{ display:block; font-size:1.15rem; line-height:1.2; }
.trip-group__stats span{ display:block; font-size:.8rem; line-height:1.3; color:var(--nb-muted); }
.trip-interest{ margin:10px 0 0; font-size:.88rem; font-weight:600; }
.trip-group__who .dot{ display:inline-block; width:10px; height:10px; border-radius:50%; margin:0 5px 0 0; vertical-align:-1px; }
.trip-group__who .dot:not(:first-child){ margin-left:10px; }
.trip-group__who .dot.is-a{ background:var(--nb-yellow); border:1px solid var(--nb-black); }
.trip-group__who .dot.is-o{ background:var(--nb-black); }
@media (max-width:420px){ .trip-group__wall{ gap:2px; } .trip-group__wall i{ width:18px; height:18px; } }
.booking-card .trip-group__wall{ gap:2px; }
.booking-card .trip-group__wall i{ width:18px; height:18px; }
.trip-save{ display:inline-block; margin:10px 8px 0 0; font-size:.9rem; }
.trip-save:has(form){ display:block; margin-right:0; }
.trip-save-btn{ min-height:44px; padding:8px 14px; background:#fff; border:1.5px solid var(--nb-border-2, var(--nb-border)); border-radius:999px; font:inherit; font-size:.88rem; font-weight:600; cursor:pointer; color:inherit; }
.trip-save__form{ display:grid; gap:8px; max-width:360px; }
.trip-save__form .field{ margin:0; }
.trip-save__form input[type=email]{ font-size:16px; min-height:44px; }
.trip-save__why{ margin:0; font-size:.86rem; }
.trip-save__ok{ font-size:.82rem; }
.trip-save__btns{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.trip-save__no{ min-height:44px; padding:0 8px; background:none; border:0; font:inherit; font-size:.86rem; text-decoration:underline; cursor:pointer; color:inherit; }
/* ===== Berto, 2-nov: ficha de viaje única en home, destinos, fechas y tipos de viaje =====
   El coordi nunca va sobre la foto (eso salía de fechas.css). El estado, siempre debajo del título y pegado al mismo margen
   que título y fecha, con un poco más de aire debajo. */
.trip-grid--rows .trip-card__title-row{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.trip-grid--rows .trip-card__status-pill{ margin:0 0 6px; }
.trip-card .coord-mini{ width:max-content; }
.trip-card .coord-mini__label, .trip-card .coord-mini__label::before{ white-space:nowrap; }
/* Precio sin descuento: rotulador amarillo */
.price:not(:has(.old)) .new{ background:linear-gradient(transparent 60%, var(--nb-yellow) 60%, var(--nb-yellow) 94%, transparent 94%); padding:0 3px; }

/* Landing de destino en móvil: precio, datos y salidas con más aire y mejor separados */
@media (max-width:780px){
  .hero-facts-bajo:has(> .ld-datos){ margin-top:18px; }
  .ld-datos{ gap:6px; font-size:.76rem; }
  .ld-datos__desde{ font-size:1.5rem; margin-bottom:4px; }
  .ld-datos > span{ padding:5px 8px; background:#FBF7EC; border-radius:999px; line-height:1.25; }
  .ld-salidas{ margin-top:20px; padding-block:18px 4px; border-top:1px solid var(--nb-border); }
  .ld-salidas__head{ margin-bottom:12px; }
  .ld-salidas__head > b{ font-family:var(--font-display); font-size:1.08rem; }
  .ld-salidas .eb-marca{ margin:0 0 12px; }
  .ld-fila{ padding:13px 14px; margin-bottom:10px; min-height:66px; }
  .ld-fila__e{ margin-top:5px; font-size:.78rem; }
  .ld-todas{ padding:8px 0 14px; }
}

/* «Paga hasta en 12 plazos con Fliinow» en las fichas donde se puede financiar (plantillas.mjs). Sin importe por cuota ni "sin intereses": los intereses los paga el viajero */
.trip-card__plazos{ margin:0; font-size:.8rem; line-height:1.3; color:var(--nb-muted); text-align:center; }
.trip-card__plazos b{ color:var(--nb-black); font-weight:700; }
.trip-nota-fliinow{ margin:10px 0 0; font-size:.75rem; line-height:1.35; color:var(--nb-muted); text-align:center; }
.ld-datos__nota{ margin:4px auto 0; font-size:.72rem; line-height:1.35; color:var(--nb-muted); text-align:center; }
@media (max-width:859px){ .trip-grid--rows .trip-card__plazos{ margin-top:-2px; } }
@media (min-width:860px){
  .trip-grid--rows .trip-card__body:has(> .trip-card__plazos){ row-gap:4px; align-content:center; }
  .trip-grid--rows .trip-card__body:has(> .trip-card__plazos) > .trip-card__info,
  .trip-grid--rows .trip-card__body:has(> .trip-card__plazos) > .trip-card__meta{ grid-row:1 / span 2; }
  .trip-grid--rows .trip-card__plazos{ grid-column:3 / -1; grid-row:2; }
  #fechas .trip-grid--rows .trip-card__plazos{ grid-column:1 / -1; grid-row:auto; text-align:right; }
  #fechas .trip-grid--rows .trip-card__body:has(> .trip-card__plazos) > .trip-card__info,
  #fechas .trip-grid--rows .trip-card__body:has(> .trip-card__plazos) > .trip-card__meta{ grid-row:auto; }
}

/* Botón de WhatsApp en móvil (Berto, 3-nov: 56 px para pulsarlo bien). En las páginas sin barra de reservar, el final del pie
   queda por encima del botón (14 px abajo + 56 de botón + margen). Con barra, ya lo resuelve body:has(.sticky-cta-mobile). */
@media (max-width:720px){
  body:not(:has(.sticky-cta-mobile)):not(.has-dep-sheet) .site-footer{ padding-bottom:calc(24px + 70px + env(safe-area-inset-bottom)); }
}

/* Cabecera y menú (Berto, 3-nov): "Mis viajes" como botón propio, en escritorio con su texto y en el panel móvil a lo ancho y
   debajo de WhatsApp. El carrito ya no va en el menú (consejo de Santi): una reserva a medias sale como aviso flotante. */
.header-account{ gap:7px; white-space:nowrap; }
.nav-actions .btn{ white-space:nowrap; }
.header-account__txt{ font-weight:600; }
@media (max-width:1360px){ .header-account__txt{ display:none; } }
.mobile-panel__account{ margin-top:-10px; gap:8px; display:flex; align-items:center; justify-content:center; }

/* Menú hamburguesa en iPhone (Berto, 3-nov: «pasa algo raro, más responsive»). Alto de la pantalla visible (dvh: con la barra de
   Safari a la vista no se esconde lo de abajo), margen del área segura para que el botón "Mis viajes" no quede bajo la barra,
   el scroll del panel no arrastra la página de detrás y entra deslizándose en vez de aparecer de golpe. */
.mobile-panel{ height:100vh; height:100dvh; }
.mobile-panel__sheet{
  height:100%; padding-bottom:calc(22px + env(safe-area-inset-bottom)); padding-top:calc(22px + env(safe-area-inset-top));
  overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
}
.mobile-panel.is-open .mobile-panel__sheet{ animation:nb-panel-in .22s ease-out; }
.mobile-panel.is-open .mobile-panel__backdrop{ animation:nb-fade-in .22s ease-out; }
@keyframes nb-panel-in{ from{ transform:translateX(100%); } to{ transform:none; } }
@keyframes nb-fade-in{ from{ opacity:0; } to{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .mobile-panel.is-open .mobile-panel__sheet, .mobile-panel.is-open .mobile-panel__backdrop{ animation:none; } }

/* Cinta superior en móvil: el segundo mensaje, corto, para que quepa en una línea (Berto, 3-nov). */
.urgency-banner__corto{ display:none; }
@media (max-width:600px){ .urgency-banner__largo{ display:none; } .urgency-banner__corto{ display:inline; } }

/* Reserva a medias (Berto y Santi, 3-nov): aviso flotante abajo a la izquierda en vez del carrito en el menú. Sube por encima de
   la barra de reservar y deja libre la derecha para el botón de WhatsApp. */
.nb-medias{
  position:fixed; left:14px; right:84px; bottom:calc(14px + env(safe-area-inset-bottom)); z-index:170; max-width:420px;
  display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--nb-black); color:#fff;
  border-radius:var(--nb-radius-sm); box-shadow:0 6px 20px rgba(0,0,0,.25); font-size:.85rem; line-height:1.3;
}
.nb-medias__txt{ flex:1; min-width:0; font-size:.8rem; }
.nb-medias__txt > span{ white-space:nowrap; }
.nb-medias__txt b{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nb-medias a{ color:var(--nb-yellow); font-weight:700; white-space:nowrap; text-decoration:underline; }
.nb-medias button{ background:none; border:0; color:#fff; font-size:1.2rem; line-height:1; cursor:pointer; min-width:32px; min-height:32px; }
body:has(.sticky-cta-mobile) .nb-medias{ bottom:calc(var(--nb-sticky-h, 90px) + 12px); }
body.has-dep-sheet .nb-medias{ bottom:calc(92px + env(safe-area-inset-bottom)); }
@media (min-width:981px){ body:has(.sticky-cta-mobile) .nb-medias{ bottom:24px; } .nb-medias{ bottom:24px; } }

/* iPhone (Berto, 3-nov): la web va con viewport-fit=cover para que la barra de reservar llegue al borde de abajo en Safari.
   Por eso lo que va pegado abajo suma el área segura (la raya de inicio) y, en horizontal, el texto no se mete bajo la cámara. */
@media (max-width:720px){ body{ --nbw-bottom:calc(14px + env(safe-area-inset-bottom)); } }
.container{ padding-left:max(var(--nb-gutter), env(safe-area-inset-left)); padding-right:max(var(--nb-gutter), env(safe-area-inset-right)); }