/* =============================================
   TRIP DETAIL PAGE — css/trip-detail.css
   ============================================= */

/* ── HERO ─────────────────────────────────────── */
.td-hero {
  position: relative;
  height: 72vh;
  min-height: 500px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.td-hero-img {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 6s ease-out;
  transform: translateY(var(--motion-parallax, 0)) scale(1.06);
}
.td-hero.loaded .td-hero-img { transform: translateY(var(--motion-parallax, 0)) scale(1.01); }
.td-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.68) 100%);
}
.td-hero-content {
  position: relative;
  z-index: 2;
  padding-bottom: 3.5rem;
  padding-top: 6rem;
  width: 100%;
  animation: tdHeroCopyIn .82s cubic-bezier(.4,0,.2,1) both;
}
.td-breadcrumb {
  color: rgba(255,255,255,.8);
  font-size: .82rem;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .2rem;
}
.td-breadcrumb a { color: rgba(255,255,255,.8); text-decoration: none; }
.td-breadcrumb a:hover { color: #fff; }
.td-breadcrumb .fa-chevron-right { margin: 0 .3rem; font-size: .65rem; opacity: .7; }

.td-hero-badges { display: flex; gap: .5rem; margin-bottom: .8rem; flex-wrap: wrap; }
.td-hero-badge {
  padding: .28rem .8rem;
  border-radius: 20px;
  font-size: .73rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  animation: tdBadgeFloat 4.5s ease-in-out infinite;
}
.td-hero-badge:nth-child(2) { animation-delay:.4s; }
.td-hero-badge:nth-child(3) { animation-delay:.8s; }
.td-hero-badge:nth-child(4) { animation-delay:1.2s; }
.td-badge-seller { background: var(--brand-orange, #ff6b2b); color: #fff; }
.td-badge-hot    { background: #f43f5e; color: #fff; }
.td-badge-new    { background: #10b981; color: #fff; }
.td-badge-adv    { background: #8b5cf6; color: #fff; }
.td-badge-diff   { background: rgba(255,255,255,.18); color: #fff; border: 1px solid rgba(255,255,255,.35); }

.td-hero-title {
  font-size: clamp(1.9rem, 4vw, 3.2rem);
  font-weight: 800;
  color: #fff;
  line-height: 1.15;
  margin-bottom: 1.2rem;
  text-shadow: 0 2px 14px rgba(0,0,0,.45);
}
.td-hero-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  color: rgba(255,255,255,.92);
  font-size: .9rem;
}
.td-hero-stats span { display: flex; align-items: center; gap: .4rem; }
.td-hero-stats i { color: var(--brand-orange, #ff6b2b); }

/* ── STICKY TABS BAR ──────────────────────────── */
.td-tabs-bar {
  display: none;
}
.td-tabs {
  display: flex;
  overflow-x: auto;
  scrollbar-width: none;
}
.td-tabs::-webkit-scrollbar { display: none; }
.td-tab {
  padding: 1rem 1.4rem;
  color: #666;
  text-decoration: none;
  font-size: .875rem;
  font-weight: 500;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
  transition: color .2s, border-color .2s;
}
.td-tab:hover,
.td-tab.active {
  color: var(--brand-orange, #ff6b2b);
  border-bottom-color: var(--brand-orange, #ff6b2b);
}

/* ── MAIN LAYOUT ─────────────────────────────── */
.td-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 2.5rem;
  padding-top: 3rem;
  padding-bottom: 5rem;
  align-items: start;
}

/* ── SECTIONS ────────────────────────────────── */
.td-section {
  margin-bottom: 3rem;
  scroll-margin-top: 64px;
}
.td-section-title {
  font-size: 1.45rem;
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: 1.25rem;
  padding-bottom: .75rem;
  border-bottom: 2px solid #f0f0f5;
  position: relative;
}
.td-section-title::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 44px;
  height: 2px;
  background: var(--brand-orange, #ff6b2b);
}

/* Overview */
.td-overview-text {
  color: #555;
  line-height: 1.82;
  font-size: .97rem;
  margin-bottom: 1.75rem;
}
.td-highlights {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
  gap: .7rem;
}
.td-highlight-item {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  padding: .85rem 1rem;
  background: #f8f9fe;
  border-radius: 10px;
  font-size: .875rem;
  color: #444;
  line-height: 1.45;
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}
.td-highlight-item:hover {
  transform:translateY(-3px);
  background:#fff;
  box-shadow:0 10px 24px rgba(15,23,42,.07);
}
.td-highlight-item i { color: var(--brand-orange, #ff6b2b); margin-top: .1rem; flex-shrink: 0; }

/* ── ITINERARY ────────────────────────────────── */
.td-day {
  border: 1px solid #e8eaed;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: .65rem;
  transition: box-shadow .2s;
}
.td-day:hover { box-shadow: 0 4px 18px rgba(0,0,0,.07); }
.td-day-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  cursor: pointer;
  background: #fff;
  user-select: none;
}
.td-day-num {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--brand-orange, #ff6b2b);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: .75rem;
  font-weight: 700;
  flex-shrink: 0;
  letter-spacing: -.01em;
  position:relative;
}
.td-day-num::after {
  content:'';
  position:absolute;
  inset:-6px;
  border-radius:inherit;
  border:1px solid rgba(255,107,43,.25);
  animation:tdDayPulse 2.8s ease-out infinite;
}
.td-day-title { font-weight: 600; color: #1a1a2e; flex: 1; font-size: .93rem; }
.td-day-toggle { color: #bbb; transition: transform .25s; font-size: .78rem; }
.td-day.open .td-day-toggle { transform: rotate(180deg); }
.td-day-body {
  display: none;
  padding: 0 1.25rem 1.25rem;
  padding-left: calc(1.25rem + 36px + 1rem);
  color: #555;
  font-size: .89rem;
  line-height: 1.78;
  border-top: 1px solid #f5f5f8;
}
.td-day.open .td-day-body { display: block; }

/* ── INCLUSIONS / EXCLUSIONS ─────────────────── */
.td-inc-exc {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}
.td-inc-exc h3 {
  font-size: 1rem;
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: .85rem;
}
.td-inc-list,
.td-exc-list {
  list-style: none;
  padding: 0; margin: 0;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.td-inc-list li,
.td-exc-list li {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  font-size: .875rem;
  color: #555;
  line-height: 1.5;
}
.td-inc-list li i { color: #10b981; flex-shrink: 0; margin-top: .18rem; }
.td-exc-list li i { color: #f43f5e; flex-shrink: 0; margin-top: .18rem; }

/* ── GALLERY ─────────────────────────────────── */
.td-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 195px 195px;
  gap: .7rem;
  border-radius: 16px;
  overflow: hidden;
}
.td-gallery-item {
  overflow: hidden;
  cursor: pointer;
  position: relative;
  background: #eee;
}
.td-gallery-item::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, transparent 20%, rgba(255,255,255,.24) 48%, transparent 74%);
  transform:translateX(-120%);
  transition:transform .75s ease;
}
.td-gallery:hover .td-gallery-item::after {
  transform:translateX(120%);
}
.td-gallery-item:first-child {
  grid-column: span 2;
  grid-row: span 2;
}
.td-gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}
.td-gallery-item:hover img { transform: scale(1.07); }
.td-gallery-more {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.52);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  gap: .4rem;
}

/* ── DEPARTURES ──────────────────────────────── */
.td-departures-table {
  border: 1px solid #e8eaed;
  border-radius: 12px;
  overflow: hidden;
}
.td-dep-row {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1.2fr 0.8fr 1fr auto;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #f0f0f5;
  font-size: .875rem;
}
.td-dep-row:last-child { border-bottom: none; }
.td-dep-row.header {
  background: #f8f9fe;
  font-weight: 600;
  color: #888;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.td-dep-date { font-weight: 600; color: #1a1a2e; }
.td-dep-date i { color: var(--brand-orange, #ff6b2b); margin-right: .35rem; }
.td-dep-seats-low   { color: #f43f5e; font-weight: 600; }
.td-dep-seats-avail { color: #10b981; font-weight: 600; }
.td-dep-price { font-weight: 700; color: var(--brand-orange, #ff6b2b); }
.td-dep-book {
  padding: .42rem .9rem;
  background: var(--brand-orange, #ff6b2b);
  color: #fff;
  border: none;
  border-radius: 7px;
  font-size: .8rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity .2s, transform .15s;
}
.td-dep-book:hover { opacity: .88; transform: translateY(-1px); }

/* ── REVIEWS ─────────────────────────────────── */
.td-reviews-summary {
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 1.5rem 1.75rem;
  background: linear-gradient(135deg, #fff8f5 0%, #fff3ee 100%);
  border: 1px solid rgba(255,107,43,.15);
  border-radius: 14px;
  margin-bottom: 1.5rem;
}
.td-reviews-big {
  font-size: 3.2rem;
  font-weight: 800;
  color: #1a1a2e;
  line-height: 1;
}
.td-reviews-stars { color: #f59e0b; font-size: 1.15rem; margin-bottom: .3rem; }
.td-reviews-total  { font-size: .84rem; color: #888; }
.td-review-card {
  padding: 1.25rem;
  border: 1px solid #e8eaed;
  border-radius: 12px;
  margin-bottom: .75rem;
  transition: box-shadow .2s, transform .2s, border-color .2s;
}
.td-review-card:hover {
  box-shadow: 0 10px 28px rgba(0,0,0,.08);
  transform:translateY(-3px);
  border-color:rgba(255,107,43,.2);
}
.td-review-header {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: .7rem;
}
.td-review-avatar {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: var(--grad-brand, linear-gradient(135deg,#ff6b2b,#ff8c42));
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
  font-size: .95rem;
  flex-shrink: 0;
}
.td-review-name { font-weight: 600; font-size: .9rem; color: #1a1a2e; }
.td-review-date { font-size: .78rem; color: #aaa; margin-top: .1rem; }
.td-review-stars { color: #f59e0b; font-size: .82rem; }
.td-review-text  { font-size: .875rem; color: #555; line-height: 1.7; }

/* ── SIDEBAR ─────────────────────────────────── */
.td-sidebar {
  position: sticky;
  top: calc(var(--nav-height, 64px) + 24px);
  align-self: start;
}
.td-sidebar-card {
  border: 1px solid #e8eaed;
  border-radius: 18px;
  padding: 1.75rem;
  background: #fff;
  box-shadow: 0 8px 36px rgba(0,0,0,.09);
  position:relative;
  overflow:hidden;
}
.td-sidebar-card::before {
  content:'';
  position:absolute;
  inset:-1px;
  background:linear-gradient(135deg, rgba(255,107,43,.16), transparent 45%, rgba(124,58,237,.12));
  pointer-events:none;
}
.td-sidebar-card > * {
  position:relative;
  z-index:1;
}
.td-sidebar-price { margin-bottom: .9rem; }
.td-price-label {
  font-size: .75rem;
  color: #999;
  display: block;
  margin-bottom: .15rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.td-price-val {
  font-size: 2.1rem;
  font-weight: 800;
  color: var(--brand-orange, #ff6b2b);
  line-height: 1.1;
}
.td-price-per { font-size: .84rem; color: #999; margin-left: .1rem; }

.td-sidebar-rating {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .84rem;
  color: #666;
  margin-bottom: 1.35rem;
}
.td-sidebar-rating .stars { color: #f59e0b; font-size: .82rem; }

.td-btn-book {
  width: 100%;
  justify-content: center;
  margin-bottom: .7rem;
  padding: .95rem;
  font-size: 1rem;
  font-weight: 700;
  border-radius: 50px;
}
.td-btn-enquire {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .78rem;
  border: 2px solid var(--brand-orange, #ff6b2b);
  border-radius: 50px;
  background: transparent;
  color: var(--brand-orange, #ff6b2b);
  font-size: .9rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .22s;
  margin-bottom: 1.35rem;
}
.td-btn-enquire:hover { background: var(--brand-orange, #ff6b2b); color: #fff; }

.td-sidebar-meta {
  border-top: 1px solid #f0f0f5;
  padding-top: 1rem;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: .65rem;
  font-size: .84rem;
  color: #555;
}
.td-sidebar-meta > div { display: flex; align-items: center; gap: .65rem; }
.td-sidebar-meta i { color: var(--brand-orange, #ff6b2b); width: 16px; flex-shrink: 0; }

.td-sidebar-trust {
  border-top: 1px solid #f0f0f5;
  padding-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: .45rem;
  font-size: .78rem;
  color: #999;
}
.td-sidebar-trust span { display: flex; align-items: center; gap: .5rem; }
.td-sidebar-trust i { color: #10b981; }

/* ── NOT FOUND ────────────────────────────────── */
.td-not-found {
  text-align: center;
  padding: 6rem 1rem;
  color: #888;
}
.td-not-found i { display: block; margin-bottom: 1.25rem; }
.td-not-found h2 { font-size: 1.8rem; color: #1a1a2e; margin-bottom: .75rem; }
.td-not-found p  { margin-bottom: .5rem; font-size: .95rem; }
.td-not-found a  { color: var(--brand-orange, #ff6b2b); text-decoration: none; font-weight: 600; }

/* ── RESPONSIVE ──────────────────────────────── */
@media (max-width: 980px) {
  .td-layout {
    grid-template-columns: 1fr;
  }
  .td-sidebar { position: static; }
  .td-inc-exc { grid-template-columns: 1fr; gap: 1.5rem; }
}
@media (max-width: 700px) {
  .td-hero { height: 62vh; min-height: 420px; }
  .td-hero-title { font-size: 1.75rem; }
  .td-hero-content { padding-bottom: 20px; }
  .td-hero-stats { gap: .65rem 1rem; }
  .td-gallery {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 160px 160px 160px;
  }
  .td-gallery-item:first-child { grid-column: span 2; }
  .td-dep-row {
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
  }
  .td-dep-row .td-dep-batch,
  .td-dep-row .td-dep-duration,
  .td-dep-row.header .td-dep-batch,
  .td-dep-row.header .td-dep-duration { display: none; }
  .td-highlights { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .td-hero { min-height: 360px; }
  .td-hero-title { font-size: 1.52rem; line-height: 1.08; }
  .td-hero-stats span { width: 100%; }
  .td-gallery {
    grid-template-columns: 1fr;
    grid-template-rows: 220px;
    grid-auto-rows: 140px;
  }
  .td-gallery-item:first-child {
    grid-column: auto;
    grid-row: auto;
  }
  .td-reviews-summary {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    padding: 18px 16px;
  }
  .td-reviews-big { font-size: 2.4rem; }
  .td-sidebar-card { padding: 18px 16px; border-radius: 14px; }
}

@keyframes tdHeroCopyIn {
  from { opacity:0; transform:translateY(28px); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes tdBadgeFloat {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-4px); }
}
@keyframes tdDayPulse {
  0% { transform:scale(.78); opacity:.6; }
  100% { transform:scale(1.55); opacity:0; }
}