/* TOUR SCOPE V8.1.6 — motion / interaction polish only.
   Purpose: premium scroll rhythm and micro-interactions without changing CMS,
   media, SEO, pricing, routing, MySQL or Cloudinary behavior. */

html { scroll-padding-top: 108px; }
section[id], [id].xp-section { scroll-margin-top: 108px; }

/* Header continuity. Homepage is already fixed; Signature and generated pages now
   keep navigation available during long-form browsing without changing markup. */
.site-header,
.signature-header,
.xp-header {
  transition: top .32s ease, height .32s ease, background-color .32s ease,
              box-shadow .32s ease, border-color .32s ease, transform .32s ease;
}

.site-header.ts-scrolled {
  top: 8px;
  box-shadow: 0 18px 48px rgba(1,19,57,.16);
}

.signature-header {
  position: fixed;
  z-index: 90;
}
.signature-header.ts-scrolled {
  top: 8px;
  background: rgba(253,251,248,.975);
  border-color: rgba(255,255,255,.95);
  box-shadow: 0 18px 48px rgba(1,19,57,.18);
}

.xp-header {
  position: sticky;
  top: 0;
  z-index: 80;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.xp-header.ts-scrolled {
  background: rgba(3,16,43,.985);
  box-shadow: 0 16px 44px rgba(1,13,38,.26);
}

/* Active anchor state on the Homepage. */
.desktop-nav a.ts-nav-active,
.mobile-menu nav a.ts-nav-active {
  color: var(--turquoise, #0c99b1);
}
.desktop-nav a.ts-nav-active::after {
  right: 0;
}

/* Progressive reveal. CSS only takes control after JS explicitly opts in. */
html.ts-motion-ready .ts-motion-item {
  transition-property: opacity, transform;
  transition-duration: .72s;
  transition-timing-function: cubic-bezier(.2,.7,.2,1);
  transition-delay: var(--ts-motion-delay, 0ms);
}
html.ts-motion-ready .ts-motion-item.ts-motion-pending {
  opacity: 0;
  transform: translate3d(0, 28px, 0) scale(.992);
}
html.ts-motion-ready .ts-motion-item.ts-motion-from-left.ts-motion-pending {
  transform: translate3d(-30px, 0, 0);
}
html.ts-motion-ready .ts-motion-item.ts-motion-from-right.ts-motion-pending {
  transform: translate3d(30px, 0, 0);
}
html.ts-motion-ready .ts-motion-item.ts-motion-scale.ts-motion-pending {
  transform: scale(.968);
}

/* Kicker line draws in with the content rather than appearing abruptly. */
html.ts-motion-ready .section-kicker.ts-motion-item > i,
html.ts-motion-ready .signature-kicker.ts-motion-item > i,
html.ts-motion-ready .xp-kicker.ts-motion-item > i {
  transform-origin: left center;
  transition: transform .65s cubic-bezier(.2,.7,.2,1) .08s;
}
html.ts-motion-ready .section-kicker.ts-motion-pending > i,
html.ts-motion-ready .signature-kicker.ts-motion-pending > i,
html.ts-motion-ready .xp-kicker.ts-motion-pending > i {
  transform: scaleX(.12);
}

/* Subtle, global-company-style interaction polish: movement is intentionally small. */
@media (hover:hover) and (pointer:fine) {
  .pillars article,
  .xp-benefit,
  .xp-list-card,
  .xp-suit-panel,
  .signature-suit-cards article,
  .signature-island-grid article,
  .signature-equipment-grid article {
    transition: transform .32s cubic-bezier(.2,.7,.2,1), box-shadow .32s ease,
                border-color .32s ease, background-color .32s ease;
  }

  .pillars article:hover,
  .xp-benefit:hover,
  .xp-list-card:hover,
  .signature-suit-cards article:hover,
  .signature-island-grid article:hover,
  .signature-equipment-grid article:hover {
    transform: translateY(-5px);
    box-shadow: 0 22px 50px rgba(13,39,78,.12);
  }

  .xp-suit-panel:hover {
    transform: translateY(-4px);
    border-color: rgba(21,199,216,.45);
    background: rgba(255,255,255,.085);
  }

  .trip-card {
    transition: transform .32s cubic-bezier(.2,.7,.2,1), border-color .32s ease,
                background .32s ease, box-shadow .32s ease;
  }
  .trip-card:hover {
    box-shadow: 0 22px 48px rgba(0,0,0,.18);
  }

  .trip-detail-button .action-arrow,
  .header-cta .action-arrow,
  .xp-arrow,
  .signature-arrow {
    transition: transform .26s ease;
  }
  .trip-detail-button:hover .action-arrow,
  .header-cta:hover .action-arrow,
  .xp-header-cta:hover .xp-arrow,
  .xp-btn:hover .xp-arrow,
  .signature-header-cta:hover .signature-arrow,
  .signature-button:hover .signature-arrow {
    transform: translateX(3px);
  }
}

/* Generic page hero receives a restrained entrance; Homepage already owns its
   approved hero animation, so it is not touched here. */
html.ts-motion-ready .xp-hero .xp-kicker,
html.ts-motion-ready .xp-hero h1,
html.ts-motion-ready .xp-hero-copy,
html.ts-motion-ready .xp-hero .xp-actions,
html.ts-motion-ready .xp-hero .xp-proof {
  animation: tsHeroIntro .74s cubic-bezier(.2,.7,.2,1) both;
}
html.ts-motion-ready .xp-hero h1 { animation-delay: .08s; }
html.ts-motion-ready .xp-hero-copy { animation-delay: .16s; }
html.ts-motion-ready .xp-hero .xp-actions { animation-delay: .24s; }
html.ts-motion-ready .xp-hero .xp-proof { animation-delay: .34s; }

/* Signature hero already has media motion; only content is sequenced. */
html.ts-motion-ready .signature-hero .signature-kicker,
html.ts-motion-ready .signature-hero h1,
html.ts-motion-ready .signature-hero-copy,
html.ts-motion-ready .signature-hero-actions,
html.ts-motion-ready .signature-proof {
  animation: tsHeroIntro .74s cubic-bezier(.2,.7,.2,1) both;
}
html.ts-motion-ready .signature-hero h1 { animation-delay: .08s; }
html.ts-motion-ready .signature-hero-copy { animation-delay: .16s; }
html.ts-motion-ready .signature-hero-actions { animation-delay: .24s; }
html.ts-motion-ready .signature-proof { animation-delay: .34s; }

@keyframes tsHeroIntro {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Long catalogue: keep horizontal filters easy to scan on touch devices. */
.trip-filters {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.trip-filters::-webkit-scrollbar { display: none; }

@media (max-width: 1050px) {
  html { scroll-padding-top: 92px; }
  section[id], [id].xp-section { scroll-margin-top: 92px; }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 78px; }
  section[id], [id].xp-section { scroll-margin-top: 78px; }

  html.ts-motion-ready .ts-motion-item {
    transition-duration: .54s;
  }
  html.ts-motion-ready .ts-motion-item.ts-motion-pending,
  html.ts-motion-ready .ts-motion-item.ts-motion-from-left.ts-motion-pending,
  html.ts-motion-ready .ts-motion-item.ts-motion-from-right.ts-motion-pending {
    transform: translate3d(0, 16px, 0) scale(.996);
  }
  html.ts-motion-ready .ts-motion-item.ts-motion-scale.ts-motion-pending {
    transform: scale(.985);
  }

  /* The fixed signature header keeps the same safe mobile geometry already
     defined by the approved responsive layer. */
  .signature-header.ts-scrolled { top: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .hero-media,
  .hero-eyebrow,
  .hero h1 .line > span,
  .hero-copy,
  .hero-actions,
  .scope-orbit,
  .signature-hero-media,
  .signature-hero-orbit,
  html.ts-motion-ready .ts-motion-item,
  html.ts-motion-ready .ts-motion-item.ts-motion-pending,
  html.ts-motion-ready .xp-hero .xp-kicker,
  html.ts-motion-ready .xp-hero h1,
  html.ts-motion-ready .xp-hero-copy,
  html.ts-motion-ready .xp-hero .xp-actions,
  html.ts-motion-ready .xp-hero .xp-proof,
  html.ts-motion-ready .signature-hero .signature-kicker,
  html.ts-motion-ready .signature-hero h1,
  html.ts-motion-ready .signature-hero-copy,
  html.ts-motion-ready .signature-hero-actions,
  html.ts-motion-ready .signature-proof {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}
