/* GOCHI TRAVELS — components/destinos.css (extraído de styles.css en ET-8.1, Fase 4) */

/* =============================================================
   Destinos Premium (ET-8.0, Fase 6) — slider infinito + glassmorphism
   ============================================================= */
.destinos-section { position: relative; overflow: hidden; }

/* Fondo desenfocado dinámico: cambia según el destino activo (hover) */
.destinos-bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  filter: blur(28px) saturate(1.05);
  transform: scale(1.15); /* evita bordes duros del blur */
  opacity: 0.35;
  transition: background-image .5s var(--ease-soft);
  z-index: 0;
}
.destinos-bg::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, var(--cream) 0%, rgba(250,246,238,0.88) 40%, var(--cream) 100%);
}
.destinos-section .container { position: relative; z-index: 1; }

.destinos-slider-viewport {
  overflow-x: auto;
  overflow-y: visible;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  padding-block: 40px; /* espacio para que las tarjetas centrales "crezcan" sin recortarse */
}
.destinos-slider-viewport::-webkit-scrollbar { display: none; }
.destinos-slider-track {
  display: flex;
  gap: 20px;
  width: max-content;
  padding-inline: calc(50% - 140px); /* permite centrar la primera/última tarjeta */
}

.destino-card {
  position: relative;
  width: 280px; flex-shrink: 0;
  scroll-snap-align: center;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: box-shadow .35s var(--ease-out);
  will-change: transform, opacity;
}
.destino-card:hover {
  box-shadow: 0 0 0 1px rgba(239,159,39,0.25), 0 20px 40px rgba(34,28,20,0.18), 0 0 32px rgba(239,159,39,0.25);
}
.destino-media { aspect-ratio: 3/4; overflow: hidden; }
.destino-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease-out); }
.destino-card:hover .destino-media img { transform: scale(1.08); }

/* Glassmorphism 2.0: panel translúcido con blur, superpuesto sobre la foto */
.destino-glass {
  position: absolute; left: 10px; right: 10px; bottom: 10px;
  background: var(--glass-bg-strong);
  backdrop-filter: blur(var(--glass-blur)) saturate(1.6);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.6);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-md);
  box-shadow: var(--glass-shadow);
  padding: 16px;
}
.destino-pais { font-size: 11px; font-weight: 700; color: var(--accent-ink); text-transform: uppercase; letter-spacing: .04em; }
.destino-glass h3 { margin-top: 4px; margin-bottom: 6px; font-size: 1.1rem; }
.destino-glass .lede { font-size: 13px; margin-bottom: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.destino-glass .btn { width: 100%; font-size: 13px; padding: 10px 16px; }