/* ============================================================================
   MERIDIAN — Explore (tours listing) cinematic polish.
   SCOPED to .mrd-explore (added on the results card-grid only) so it layers
   ADDITIVELY over the existing app.css .tour-card and never leaks elsewhere.
   Pure hover flourish — no layout/markup change. Reduced-motion safe.
   ========================================================================== */

.mrd-explore .tour-card {
  transition: transform .45s cubic-bezier(.16, 1, .3, 1), box-shadow .45s cubic-bezier(.16, 1, .3, 1);
  overflow: hidden;              /* clip the media zoom cleanly (box-shadow ring is unaffected) */
  will-change: transform;
}
.mrd-explore .tour-card:hover {
  transform: translateY(-7px);
  box-shadow:
    0 34px 70px -28px rgba(3, 10, 18, .55),
    0 0 0 1px color-mix(in oklch, var(--c-turquoise, #00A6A6) 42%, transparent);
}

/* media zoom + saturation within the clipped frame */
.mrd-explore .tour-card-media-link { position: relative; overflow: hidden; display: block; }
.mrd-explore .tour-card-media {
  transition: transform .6s cubic-bezier(.16, 1, .3, 1), filter .6s ease;
}
.mrd-explore .tour-card:hover .tour-card-media { transform: scale(1.07); filter: saturate(1.12); }

/* aurora sheen sweep across the media on hover */
.mrd-explore .tour-card-media-link::after {
  content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: 0;
  background: linear-gradient(115deg, transparent 36%,
    color-mix(in oklch, var(--c-turquoise, #00A6A6) 28%, transparent) 50%, transparent 64%);
  transform: translateX(-32%);
  transition: opacity .5s ease, transform .85s cubic-bezier(.16, 1, .3, 1);
}
.mrd-explore .tour-card:hover .tour-card-media-link::after { opacity: 1; transform: translateX(32%); }

/* CTA arrow nudge */
.mrd-explore .tour-card-cta i { transition: transform .4s cubic-bezier(.16, 1, .3, 1); }
.mrd-explore .tour-card:hover .tour-card-cta i { transform: translateX(4px); }

@media (prefers-reduced-motion: reduce) {
  .mrd-explore .tour-card,
  .mrd-explore .tour-card-media,
  .mrd-explore .tour-card-media-link::after,
  .mrd-explore .tour-card-cta i { transition: none !important; }
  .mrd-explore .tour-card:hover { transform: none; }
  .mrd-explore .tour-card:hover .tour-card-media { transform: none; }
  .mrd-explore .tour-card:hover .tour-card-media-link::after { opacity: 0; }
}
