/*
 * Tusk Travel reusable itinerary detail design.
 * Load after site.css, header.css and footer.css.
 * All rules are scoped to .itinerary-page so other pages are unaffected.
 */

.itinerary-page {
  --trip-accent: var(--tt-coral);
  --trip-dark: var(--tt-teal-dark);
  --trip-mid: var(--tt-teal);
  --trip-paper: #fffdf9;
  --trip-soft: #f5f1eb;
  --trip-line: #e4dcd2;
  overflow: visible;
  background: var(--trip-paper);
}

.itinerary-page section[id] { scroll-margin-top: 76px; }

/* Added by the itinerary page after the shared header is rendered. */
.tt-header.tt-header--scroll-away {
  position: relative !important;
  top: auto !important;
}

/* Hero */
.itinerary-page .tt-trip-hero {
  position: relative;
  display: grid;
  min-height: 525px;
  align-items: end;
  overflow: hidden;
  color: #fff;
  background: var(--trip-dark);
}

.itinerary-page .tt-trip-hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 48%;
  transform: scale(1.002);
}

.itinerary-page .tt-trip-hero__shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background:
    linear-gradient(0deg, rgba(5, 27, 33, .96) 0%, rgba(5, 27, 33, .68) 42%, rgba(5, 27, 33, .12) 79%),
    linear-gradient(90deg, rgba(5, 27, 33, .72), transparent 72%);
}

.itinerary-page .tt-trip-hero__content {
  position: relative;
  z-index: 2;
  padding-block: 152px 62px;
}

.itinerary-page .tt-trip-hero__content > span {
  color: #f4c56f;
  font-size: .77rem;
  letter-spacing: .12em;
}

.itinerary-page .tt-trip-hero h1 {
  max-width: 920px;
  margin: 11px 0 13px;
  font-size: clamp(3rem, 5.4vw, 5.05rem);
  line-height: .99;
  text-wrap: balance;
}

.itinerary-page .tt-trip-hero__content > p {
  margin: 0;
  color: rgba(255, 255, 255, .83);
  font-size: 1.02rem;
  font-weight: 650;
  letter-spacing: .01em;
}

/* Sticky in-page navigation */
.itinerary-page .tt-trip-anchor {
  position: sticky;
  z-index: 90;
  top: 0;
  border-bottom: 1px solid var(--trip-line);
  background: rgba(255, 253, 249, .97);
  box-shadow: 0 7px 20px rgba(23, 33, 40, .04);
}

.itinerary-page .tt-trip-anchor .tt-shell {
  display: flex;
  align-items: center;
  min-height: 57px;
  gap: 34px;
  overflow-x: auto;
  scrollbar-width: none;
}

.itinerary-page .tt-trip-anchor .tt-shell::-webkit-scrollbar { display: none; }

.itinerary-page .tt-trip-anchor a {
  position: relative;
  padding-block: 16px;
  color: #3f4c52;
  font-size: .84rem;
  font-weight: 800;
  white-space: nowrap;
}

.itinerary-page .tt-trip-anchor a:not(.tt-trip-anchor__cta)::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: var(--trip-accent);
  content: "";
  opacity: 0;
  transform: scaleX(.45);
  transition: .2s ease;
}

.itinerary-page .tt-trip-anchor a:hover::after { opacity: 1; transform: scaleX(1); }
.itinerary-page .tt-trip-anchor__cta {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-left: auto;
  border-radius: 999px;
  padding: 8px 19px !important;
  color: #fff !important;
  background: #22cf68;
  box-shadow: 0 8px 20px rgba(34, 207, 104, .2);
}

.itinerary-page .tt-trip-anchor__cta svg,
.itinerary-page .tt-trip-whatsapp-button svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  fill: currentColor;
}

/* Overview */
.itinerary-page .tt-trip-overview { padding-block: 84px; }

.itinerary-page .tt-trip-overview__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) 350px;
  align-items: start;
  gap: clamp(50px, 7vw, 100px);
}

.itinerary-page .tt-trip-overview article { max-width: 830px; }

.itinerary-page .tt-trip-overview article h2 {
  max-width: 780px;
  margin: 10px 0 21px;
  font-size: clamp(2.35rem, 4vw, 3.45rem);
}

.itinerary-page .tt-trip-overview article p {
  max-width: 790px;
  color: #5d686e;
  font-size: 1rem;
  line-height: 1.8;
}

.itinerary-page .tt-trip-overview__lead {
  color: var(--tt-ink) !important;
  font-size: 1.12rem !important;
  font-weight: 600;
  line-height: 1.72 !important;
}

.itinerary-page .tt-trip-overview__copy { position: relative; }

.itinerary-page .tt-trip-overview__text {
  max-height: none;
  overflow: visible;
  transition: max-height .28s ease;
}

.itinerary-page .tt-trip-overview__copy.is-collapsed .tt-trip-overview__text {
  position: relative;
  max-height: 215px;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, #000 82%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 82%, transparent 100%);
}

.itinerary-page .tt-trip-overview__toggle {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  gap: 9px;
  margin-top: 12px;
  border: 1px solid #d7ccc0;
  border-radius: 999px;
  padding: 8px 17px;
  color: var(--trip-mid);
  background: #fff;
  font-size: .86rem;
  font-weight: 800;
}

.itinerary-page .tt-trip-overview__toggle i {
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform .2s ease;
}

.itinerary-page .tt-trip-overview__toggle[aria-expanded="true"] i {
  transform: rotate(225deg) translate(-1px, -1px);
}

.itinerary-page .tt-trip-overview aside {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--trip-line);
  border-radius: 18px;
  padding: 27px;
  background: #f7f3ed;
  box-shadow: 0 15px 36px rgba(23, 33, 40, .06);
}

.itinerary-page .tt-trip-overview aside::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--trip-accent), #e0a83a);
  content: "";
}

.itinerary-page .tt-trip-overview aside h3 {
  margin: 5px 0 17px;
  font-family: var(--font-serif), serif;
  font-size: 1.55rem;
}
.itinerary-page .tt-trip-overview aside > span {
  color: var(--trip-accent);
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.itinerary-page .tt-trip-overview dl { display: grid; gap: 0; margin: 0 0 18px; }
.itinerary-page .tt-trip-overview dl div { display: grid; gap: 3px; border-top: 1px solid var(--trip-line); }
.itinerary-page .tt-trip-overview dl div { padding-block: 12px; }
.itinerary-page .tt-trip-overview dt { color: var(--tt-muted); font-size: .76rem; }
.itinerary-page .tt-trip-overview dd { margin: 0; font-size: .91rem; font-weight: 700; line-height: 1.5; }
.itinerary-page .tt-trip-overview aside > strong { color: var(--trip-mid); }
.itinerary-page .tt-trip-overview aside > p { margin: 7px 0 0; color: var(--tt-muted); font-size: .9rem; line-height: 1.6; }

/* Main itinerary area */
.itinerary-page .tt-trip-itinerary {
  padding-block: 86px 96px;
  background:
    radial-gradient(circle at 12% 0%, rgba(215, 168, 77, .08), transparent 24%),
    #f4f0e9;
}

.itinerary-page .tt-trip-layout {
  display: grid;
  grid-template-columns: minmax(0, 920px) 350px;
  align-items: start;
  justify-content: center;
  gap: 38px;
}

.itinerary-page .tt-trip-main { min-width: 0; }

.itinerary-page .tt-trip-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}

.itinerary-page .tt-trip-heading span,
.itinerary-page .tt-trip-overview article > span,
.itinerary-page .tt-trip-contact .tt-shell > div:first-child > span,
.itinerary-page .tt-trip-faq header > span {
  color: var(--trip-accent);
  font-size: .74rem;
  font-weight: 850;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.itinerary-page .tt-trip-heading > div:first-child { max-width: 760px; }

.itinerary-page .tt-trip-heading h2 {
  margin: 7px 0 9px;
  font-size: clamp(2.35rem, 3.8vw, 3.2rem);
  line-height: 1.08;
}

.itinerary-page .tt-trip-heading p {
  color: #69747a;
  font-size: .96rem;
  line-height: 1.68;
}

.itinerary-page .tt-trip-days { display: grid; gap: 12px; }

.itinerary-page .tt-trip-day {
  overflow: hidden;
  border: 1px solid #ded6cc;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 5px 15px rgba(23, 33, 40, .035);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.itinerary-page .tt-trip-day[open] {
  border-color: #cfc3b5;
  box-shadow: 0 20px 48px rgba(23, 33, 40, .1);
}

.itinerary-page .tt-trip-day__summary {
  display: grid;
  width: 100%;
  min-height: 72px;
  grid-template-columns: 74px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 17px;
  border: 0;
  padding: 14px 18px;
  text-align: left;
  background: #fff;
}

.itinerary-page .tt-trip-day__summary > span {
  display: grid;
  min-height: 41px;
  place-items: center;
  border: 1px solid #cfe0de;
  border-radius: 999px;
  color: var(--trip-mid);
  background: #eef5f4;
  font-size: .78rem;
}

.itinerary-page .tt-trip-day__summary div { display: grid; gap: 4px; }

.itinerary-page .tt-trip-day__summary strong {
  font-size: 1.06rem;
  line-height: 1.35;
}

.itinerary-page .tt-trip-day__summary small {
  color: #798489;
  font-size: .78rem;
}

.itinerary-page .tt-trip-day__summary i {
  display: grid;
  width: 31px;
  height: 31px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--trip-mid);
  font-size: 1rem;
  font-style: normal;
  transition: transform .2s ease;
}

.itinerary-page .tt-trip-day[open] .tt-trip-day__summary i { transform: rotate(45deg); }
.itinerary-page .tt-trip-day__summary::-webkit-details-marker { display: none; }

.itinerary-page .tt-trip-day[open] .tt-trip-day__summary {
  border-bottom: 1px solid var(--trip-line);
  background: #fffdf9;
}

.itinerary-page .tt-trip-day[open] .tt-trip-day__summary > span {
  border-color: var(--trip-accent);
  color: #fff;
  background: var(--trip-accent);
}

/* Large editorial day image on desktop */
.itinerary-page .tt-trip-day__content {
  display: flex;
  flex-direction: column;
  border-top: 0;
  padding: 0;
  background: #fff;
}

.itinerary-page .tt-trip-day__content img {
  order: 2;
  width: calc(100% - 64px);
  height: clamp(320px, 27vw, 410px);
  margin: 0 32px 28px;
  border-radius: 14px;
  object-fit: cover;
  object-position: center;
}

.itinerary-page .tt-trip-day__content > div {
  order: 1;
  max-width: 840px;
  padding: 25px 28px 27px;
}

.itinerary-page .tt-trip-day__content p {
  max-width: 780px;
  margin: 0 0 12px;
  color: #536168;
  font-size: .98rem;
  line-height: 1.68;
}

.itinerary-page .tt-trip-day__content p:last-of-type { margin-bottom: 12px; }

/* Bold emphasis inside day descriptions stays part of the paragraph. */
.itinerary-page .tt-trip-day__content p strong {
  display: inline;
  color: #263f45;
  font-size: inherit;
  font-weight: 750;
}

/* Only the final overnight / status line receives the accent dot. */
.itinerary-page .tt-trip-day__content > div > strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 2px;
  color: var(--trip-mid);
  font-size: .84rem;
  font-weight: 800;
}

.itinerary-page .tt-trip-day__content > div > strong::before {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--trip-accent);
  content: "";
}

.itinerary-page .tt-trip-day__content--text > div {
  max-width: none;
  padding: 27px 30px 29px;
  background: linear-gradient(90deg, #fff, #fffdf9);
}

/* Sticky proposal panel */
.itinerary-page .tt-trip-plan {
  position: sticky;
  top: 180px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 18px;
  padding: 28px;
  background:
    radial-gradient(circle at 100% 0%, rgba(244, 197, 111, .16), transparent 36%),
    var(--trip-dark);
  box-shadow: 0 22px 48px rgba(7, 39, 44, .18);
}

.itinerary-page .tt-trip-plan > span { color: #f4c56f; }

.itinerary-page .tt-trip-plan h2 {
  margin: 8px 0 12px;
  color: #fff;
  font-size: 1.8rem;
  line-height: 1.14;
}

.itinerary-page .tt-trip-plan p,
.itinerary-page .tt-trip-plan li {
  color: rgba(255, 255, 255, .78);
  font-size: .88rem;
  line-height: 1.62;
}

.itinerary-page .tt-trip-plan ul { gap: 9px; margin-block: 19px; }
.itinerary-page .tt-trip-plan ul { display: grid; padding-left: 19px; }

.itinerary-page .tt-trip-plan .tt-button {
  width: 100%;
  min-height: 49px;
  margin: 8px 0 13px;
  border-color: var(--trip-accent);
  background: var(--trip-accent);
}

.itinerary-page .tt-trip-plan > small { display: block; margin-top: 16px; color: rgba(255, 255, 255, .55); text-align: center; line-height: 1.45; }

.itinerary-page .tt-trip-whatsapp-button {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 999px;
  padding: 12px 28px;
  color: #fff;
  background: #22cf68;
  box-shadow: 0 10px 24px rgba(16, 125, 63, .22);
  font-size: .98rem;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
  transition: background-color .2s ease, transform .2s ease;
}

.itinerary-page .tt-trip-whatsapp-button:hover {
  color: #fff;
  background: #18b95a;
  transform: translateY(-1px);
}

.itinerary-page .tt-trip-plan .tt-trip-whatsapp-button { width: 100%; }

.itinerary-page .tt-trip-whatsapp-button span,
.itinerary-page .tt-trip-contact .tt-trip-whatsapp-button span {
  color: #fff;
  font-size: .98rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: none;
}

.itinerary-page .tt-trip-contact .tt-trip-whatsapp-button svg { width: 22px; height: 22px; }

/* Inclusions */
.itinerary-page .tt-trip-inclusions { padding-block: 88px; background: #fff; }

.itinerary-page .tt-trip-inclusions .tt-section__head { margin-bottom: 30px; }

.itinerary-page .tt-trip-inclusions__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }

.itinerary-page .tt-trip-inclusions__grid article {
  border-color: var(--trip-line);
  border-radius: 18px;
  padding: 29px 30px;
  box-shadow: 0 12px 32px rgba(23, 33, 40, .045);
}

.itinerary-page .tt-trip-inclusions__grid .is-included { border-top: 4px solid #3f8b67; background: #fbfefc; }
.itinerary-page .tt-trip-inclusions__grid .is-not-included { border-top: 4px solid #cf725b; background: #fffdfc; }
.itinerary-page .tt-trip-inclusions__grid h3 { font-size: 1.55rem; }
.itinerary-page .tt-trip-inclusions__grid ul { display: grid; gap: 11px; margin: 0; padding-left: 21px; }
.itinerary-page .tt-trip-inclusions__grid li { color: #5b676d; font-size: .94rem; line-height: 1.6; }

/* CTA and FAQs */
.itinerary-page .tt-trip-contact { padding-block: 52px; background: var(--trip-accent); }
.itinerary-page .tt-trip-contact { color: #fff; }
.itinerary-page .tt-trip-contact .tt-shell { display: flex; align-items: center; justify-content: space-between; gap: 35px; }
.itinerary-page .tt-trip-contact h2 { color: #fff; font-size: clamp(2rem, 3vw, 2.55rem); }
.itinerary-page .tt-trip-contact p { margin: 0; color: rgba(255, 255, 255, .8); }

.itinerary-page .tt-trip-faq { padding-block: 88px; background: var(--trip-soft); }
.itinerary-page .tt-trip-faq__layout { display: grid; grid-template-columns: .72fr 1.28fr; align-items: start; gap: 80px; }
.itinerary-page .tt-trip-faq header { position: sticky; top: 185px; }
.itinerary-page .tt-trip-faq header h2 { font-size: 2.55rem; line-height: 1.1; }
.itinerary-page .tt-trip-faq header p { color: var(--tt-muted); line-height: 1.65; }
.itinerary-page .tt-trip-faq details { border-color: #d8cfc4; }
.itinerary-page .tt-trip-faq details { border-bottom: 1px solid #d8cfc4; }
.itinerary-page .tt-trip-faq summary { display: grid; min-height: 66px; grid-template-columns: 38px 1fr 22px; align-items: center; gap: 10px; padding: 17px 0; cursor: pointer; list-style: none; }
.itinerary-page .tt-trip-faq summary strong { font-size: .98rem; }
.itinerary-page .tt-trip-faq summary span { color: var(--trip-accent); font-size: .74rem; }
.itinerary-page .tt-trip-faq summary i { font-style: normal; }
.itinerary-page .tt-trip-faq summary i {
  position: relative;
  display: block;
  width: 34px;
  height: 34px;
  border: 1px solid #c9d8d5;
  border-radius: 50%;
  color: var(--trip-mid);
  background: #fff;
  font-size: 0;
}

.itinerary-page .tt-trip-faq summary i::before,
.itinerary-page .tt-trip-faq summary i::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 13px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  content: "";
  transform: translate(-50%, -50%);
  transition: opacity .18s ease, transform .18s ease;
}

.itinerary-page .tt-trip-faq summary i::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.itinerary-page .tt-trip-faq details[open] summary i {
  color: #fff;
  border-color: var(--trip-mid);
  background: var(--trip-mid);
}

.itinerary-page .tt-trip-faq details[open] summary i::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(0deg);
}

.itinerary-page .tt-trip-faq details:not([open]) > p { display: none; }
.itinerary-page .tt-trip-faq details[open] > p { display: block; }
.itinerary-page .tt-trip-faq details p { margin: 0; padding: 0 48px 20px 48px; color: #5d696f; line-height: 1.7; }

/* Related tours */
.itinerary-page > .tt-section { padding-block: 86px; background: #fff; }
.itinerary-page > .tt-section .tt-tour-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.itinerary-page > .tt-section .tt-tour-card__body { min-height: 295px; }
.itinerary-page > .tt-section .tt-tour-card__actions { margin-top: auto; }

@media (max-width: 1100px) {
  .itinerary-page .tt-trip-overview__layout { grid-template-columns: minmax(0, 1fr) 310px; gap: 42px; }
  .itinerary-page .tt-trip-layout { grid-template-columns: minmax(0, 1fr) 290px; gap: 24px; }
  .itinerary-page .tt-trip-day__content img { height: clamp(270px, 31vw, 340px); }
}

@media (max-width: 820px) {
  .itinerary-page .tt-trip-overview__layout,
  .itinerary-page .tt-trip-layout,
  .itinerary-page .tt-trip-faq__layout { grid-template-columns: 1fr; }
  .itinerary-page .tt-trip-overview article { max-width: none; }
  .itinerary-page .tt-trip-overview aside { max-width: none; }
  .itinerary-page .tt-trip-plan { position: static; }
  .itinerary-page .tt-trip-faq header { position: static; }
}

@media (max-width: 680px) {
  .itinerary-page section[id] { scroll-margin-top: 68px; }

  .itinerary-page .tt-trip-hero { min-height: 480px; }
  .itinerary-page .tt-trip-hero > img { object-position: 57% center; }
  .itinerary-page .tt-trip-hero__shade {
    background: linear-gradient(0deg, rgba(5, 27, 33, .98), rgba(5, 27, 33, .7) 61%, rgba(5, 27, 33, .16));
  }
  .itinerary-page .tt-trip-hero__content { padding-block: 130px 42px; }
  .itinerary-page .tt-trip-hero h1 { font-size: 2.65rem; line-height: 1.02; }
  .itinerary-page .tt-trip-hero__content > p { font-size: .88rem; }

  .itinerary-page .tt-trip-anchor { top: 0; }
  .itinerary-page .tt-trip-anchor .tt-shell { gap: 22px; overflow-x: auto; }
  .itinerary-page .tt-trip-anchor a { padding-block: 14px; font-size: .8rem; }
  .itinerary-page .tt-trip-anchor__cta { min-height: 38px; margin-left: 0; padding: 7px 15px !important; }

  .itinerary-page .tt-trip-overview { padding-block: 58px; }
  .itinerary-page .tt-trip-overview__layout { gap: 28px; }
  .itinerary-page .tt-trip-overview article h2 { font-size: 2.2rem; }
  .itinerary-page .tt-trip-overview article p { font-size: .96rem; line-height: 1.73; }
  .itinerary-page .tt-trip-overview__lead { font-size: 1.04rem !important; }
  .itinerary-page .tt-trip-overview aside { padding: 22px; }

  .itinerary-page .tt-trip-itinerary { padding-block: 58px 64px; }
  .itinerary-page .tt-trip-heading { align-items: stretch; flex-direction: column; gap: 18px; }
  .itinerary-page .tt-trip-heading h2 { font-size: 2.25rem; }
  .itinerary-page .tt-trip-heading p { font-size: .92rem; }
  .itinerary-page .tt-trip-days { gap: 9px; }
  .itinerary-page .tt-trip-day { border-radius: 14px; }
  .itinerary-page .tt-trip-day__summary {
    min-height: 64px;
    grid-template-columns: 61px minmax(0, 1fr) 28px;
    gap: 11px;
    padding: 11px 12px;
  }
  .itinerary-page .tt-trip-day__summary > span { min-height: 36px; font-size: .7rem; }
  .itinerary-page .tt-trip-day__summary strong { font-size: .96rem; line-height: 1.32; }
  .itinerary-page .tt-trip-day__summary small { font-size: .72rem; }
  .itinerary-page .tt-trip-day__summary i { width: 27px; height: 27px; }

  .itinerary-page .tt-trip-day__content img {
    width: calc(100% - 28px);
    height: 195px;
    margin: 0 14px 14px;
    border-radius: 11px;
  }
  .itinerary-page .tt-trip-day__content > div,
  .itinerary-page .tt-trip-day__content--text > div { padding: 20px 19px 22px; }
  .itinerary-page .tt-trip-day__content p { font-size: .95rem; line-height: 1.68; }

  /* The footer already supplies the persistent mobile enquiry actions. */
  .itinerary-page .tt-trip-plan { display: none; }

  .itinerary-page .tt-trip-inclusions { padding-block: 62px; }
  .itinerary-page .tt-trip-inclusions__grid { grid-template-columns: 1fr; }
  .itinerary-page .tt-trip-inclusions__grid article { padding: 23px 21px; }

  .itinerary-page .tt-trip-contact { padding-block: 43px; }
  .itinerary-page .tt-trip-contact .tt-shell { align-items: stretch; flex-direction: column; }
  .itinerary-page .tt-trip-contact h2 { font-size: 2rem; }
  .itinerary-page .tt-trip-contact .tt-trip-whatsapp-button { width: 100%; }

  .itinerary-page .tt-trip-faq { padding-block: 62px; }
  .itinerary-page .tt-trip-faq__layout { gap: 25px; }
  .itinerary-page .tt-trip-faq header h2 { font-size: 2.2rem; }
  .itinerary-page .tt-trip-faq summary { grid-template-columns: 30px 1fr 34px; }
  .itinerary-page .tt-trip-faq summary strong { font-size: .94rem; line-height: 1.4; }
  .itinerary-page .tt-trip-faq details p { padding: 0 22px 18px 40px; font-size: .93rem; }

  .itinerary-page > .tt-section { padding-block: 62px; }
  .itinerary-page > .tt-section .tt-tour-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .itinerary-page > .tt-section .tt-tour-card { width: 100%; min-width: 0; }
  .itinerary-page > .tt-section .tt-tour-card__body { min-height: 0; }
}

@media (max-width: 390px) {
  .itinerary-page .tt-trip-hero h1 { font-size: 2.35rem; }
  .itinerary-page .tt-trip-day__content img { height: 180px; }
}

@media (prefers-reduced-motion: reduce) {
  .itinerary-page *,
  .itinerary-page *::before,
  .itinerary-page *::after { scroll-behavior: auto !important; transition: none !important; }
}
/* =========================================
   SEO INTERNAL LINKS – ITINERARY PAGES
   Paste at the very bottom of itinerary.css
   ========================================= */

.itinerary-page .tt-trip-overview__text a,
.itinerary-page .tt-trip-heading p a,
.itinerary-page .tt-trip-day__content p a,
.itinerary-page .tt-trip-day__content li a,
.itinerary-page .tt-trip-inclusions p a,
.itinerary-page .tt-trip-inclusions li a,
.itinerary-page .tt-trip-faq details p a,
.itinerary-page .tt-trip-faq details li a {
  color: #3f4d53 !important;
  font-weight: 600;
   
   text-underline-offset: 3px;
  transition:
    color 0.2s ease,
    text-decoration-color 0.2s ease;
}

/* Keep visited links consistent */
.itinerary-page .tt-trip-overview__text a:visited,
.itinerary-page .tt-trip-heading p a:visited,
.itinerary-page .tt-trip-day__content p a:visited,
.itinerary-page .tt-trip-day__content li a:visited,
.itinerary-page .tt-trip-inclusions p a:visited,
.itinerary-page .tt-trip-inclusions li a:visited,
.itinerary-page .tt-trip-faq details p a:visited,
.itinerary-page .tt-trip-faq details li a:visited {
  color: #3f4d53 !important;
}

/* Desktop hover */
.itinerary-page .tt-trip-overview__text a:hover,
.itinerary-page .tt-trip-heading p a:hover,
.itinerary-page .tt-trip-day__content p a:hover,
.itinerary-page .tt-trip-day__content li a:hover,
.itinerary-page .tt-trip-inclusions p a:hover,
.itinerary-page .tt-trip-inclusions li a:hover,
.itinerary-page .tt-trip-faq details p a:hover,
.itinerary-page .tt-trip-faq details li a:hover {
  color: #d9634a !important;
  text-decoration-color: currentColor !important;
}

/* Keyboard accessibility */
.itinerary-page .tt-trip-overview__text a:focus-visible,
.itinerary-page .tt-trip-heading p a:focus-visible,
.itinerary-page .tt-trip-day__content p a:focus-visible,
.itinerary-page .tt-trip-day__content li a:focus-visible,
.itinerary-page .tt-trip-inclusions p a:focus-visible,
.itinerary-page .tt-trip-inclusions li a:focus-visible,
.itinerary-page .tt-trip-faq details p a:focus-visible,
.itinerary-page .tt-trip-faq details li a:focus-visible {
  border-radius: 3px;
  outline: 2px solid #d9634a;
  outline-offset: 3px;
}

/* =========================================================
   Shared itinerary product top
   New pages use this block. The older .tt-trip-hero rules above
   remain temporarily so unconverted itinerary pages keep working.
   ========================================================= */
.itinerary-page .tt-trip-top {
  padding: 20px 0 34px;
  background: #fff;
}

.itinerary-page .tt-trip-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
  overflow: hidden;
  color: #858f94;
  font-size: .78rem;
  white-space: nowrap;
}

.itinerary-page .tt-trip-breadcrumb a { color: #56656c; }
.itinerary-page .tt-trip-breadcrumb a:hover { color: var(--trip-mid); }
.itinerary-page .tt-trip-breadcrumb span[aria-current="page"] { overflow: hidden; text-overflow: ellipsis; }

.itinerary-page .tt-trip-mosaic {
  position: relative;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  grid-template-rows: repeat(2, 205px);
  gap: 7px;
  overflow: hidden;
  border-radius: 18px;
  background: #e7e1d9;
}

.itinerary-page .tt-trip-mosaic__item {
  position: relative;
  overflow: hidden;
  border: 0;
  padding: 0;
  background: #ded7ce;
  cursor: zoom-in;
}

.itinerary-page .tt-trip-mosaic__item:first-child { grid-row: 1 / span 2; }

.itinerary-page .tt-trip-mosaic__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .28s ease, filter .28s ease;
}

.itinerary-page .tt-trip-mosaic__item:hover img { transform: scale(1.02); filter: brightness(.98); }

.itinerary-page .tt-trip-mosaic__all {
  position: absolute;
  z-index: 3;
  right: 14px;
  bottom: 14px;
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(23, 33, 40, .12);
  border-radius: 9px;
  padding: 8px 13px;
  color: var(--tt-ink);
  background: rgba(255,255,255,.96);
  box-shadow: 0 5px 16px rgba(23,33,40,.13);
  font-size: .8rem;
  font-weight: 800;
}

.itinerary-page .tt-trip-product {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  align-items: start;
  gap: clamp(36px, 5vw, 70px);
  padding-top: 28px;
}

.itinerary-page .tt-trip-product__eyebrow {
  display: block;
  margin-bottom: 7px;
  color: var(--trip-accent);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.itinerary-page .tt-trip-product h1 {
  max-width: 920px;
  margin: 0 0 17px;
  font-size: clamp(2.6rem, 4.4vw, 4.25rem);
  line-height: 1.03;
}

.itinerary-page .tt-trip-product__meta { display: grid; gap: 9px; }
.itinerary-page .tt-trip-product__meta > div { display: grid; grid-template-columns: 82px minmax(0,1fr); gap: 12px; }
.itinerary-page .tt-trip-product__meta strong { color: #68757b; font-size: .78rem; }
.itinerary-page .tt-trip-product__meta span { color: #46545b; font-size: .92rem; font-weight: 650; line-height: 1.55; }

.itinerary-page .tt-trip-product__booking {
  border-left: 1px solid var(--trip-line);
  padding: 4px 0 2px 28px;
}

.itinerary-page .tt-trip-product__booking > span {
  display: block;
  margin-bottom: 4px;
  color: #7a858a;
  font-size: .76rem;
  font-weight: 750;
}

.itinerary-page .tt-trip-product__price { display: flex; align-items: baseline; gap: 7px; }
.itinerary-page .tt-trip-product__price strong { font-size: 1.9rem; line-height: 1; }
.itinerary-page .tt-trip-product__price small,
.itinerary-page .tt-trip-product__booking > small { color: #778287; font-size: .75rem; }
.itinerary-page .tt-trip-product__request { display: block; margin: 2px 0 5px; font-family: var(--font-serif), serif; font-size: 1.45rem; }

.itinerary-page .tt-trip-product__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 17px;
}

.itinerary-page .tt-trip-product__actions .tt-button,
.itinerary-page .tt-trip-product__actions .tt-trip-whatsapp-button {
  min-height: 45px;
  padding: 10px 13px;
  font-size: .82rem;
}

.itinerary-page .tt-trip-product__booking > p {
  margin: 8px 0 0;
  color: #7b858a;
  font-size: .73rem;
  text-align: center;
}

/* Single-image lightbox */
.tt-trip-lightbox {
  position: fixed;
  z-index: 99999;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(7, 10, 12, .96);
}
.tt-trip-lightbox.is-open { display: flex; }
.tt-trip-lightbox__stage {
  display: flex;
  width: min(1180px, calc(100vw - 110px));
  height: calc(100vh - 90px);
  align-items: center;
  justify-content: center;
}
.tt-trip-lightbox__stage img { max-width: 100%; max-height: 100%; object-fit: contain; }
.tt-trip-lightbox__close,
.tt-trip-lightbox__prev,
.tt-trip-lightbox__next {
  position: absolute;
  z-index: 2;
  border: 0;
  color: #fff;
  background: rgba(255,255,255,.1);
}
.tt-trip-lightbox__close { top: 18px; right: 18px; width: 44px; height: 44px; border-radius: 50%; font-size: 1.7rem; }
.tt-trip-lightbox__prev,
.tt-trip-lightbox__next { top: 50%; width: 46px; height: 56px; border-radius: 9px; font-size: 2rem; transform: translateY(-50%); }
.tt-trip-lightbox__prev { left: 18px; }
.tt-trip-lightbox__next { right: 18px; }
.tt-trip-lightbox__counter {
  position: absolute;
  bottom: 18px;
  left: 50%;
  border-radius: 999px;
  padding: 7px 11px;
  color: #fff;
  background: rgba(0,0,0,.38);
  font-size: .78rem;
  transform: translateX(-50%);
}
body.tt-trip-lightbox-open { overflow: hidden; }

@media (max-width: 900px) {
  .itinerary-page .tt-trip-product { grid-template-columns: 1fr 280px; gap: 28px; }
  .itinerary-page .tt-trip-mosaic { grid-template-columns: 1.6fr 1fr; grid-template-rows: repeat(2, 165px); }
  .itinerary-page .tt-trip-mosaic__item:nth-child(4),
  .itinerary-page .tt-trip-mosaic__item:nth-child(5) { display: none; }
}

@media (max-width: 680px) {
  .itinerary-page .tt-trip-top { padding: 12px 0 24px; }
  .itinerary-page .tt-trip-breadcrumb { margin-bottom: 11px; font-size: .69rem; }

  .itinerary-page .tt-trip-mosaic {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 210px 102px;
    gap: 6px;
    border-radius: 13px;
    background: transparent;
  }
  .itinerary-page .tt-trip-mosaic__item { display: none; border-radius: 10px; }
  .itinerary-page .tt-trip-mosaic__item:nth-child(1) { display: block; grid-column: 1 / -1; grid-row: 1; }
  .itinerary-page .tt-trip-mosaic__item:nth-child(2) { display: block; grid-column: 1; grid-row: 2; }
  .itinerary-page .tt-trip-mosaic__item:nth-child(3) { display: block; grid-column: 2; grid-row: 2; }
  .itinerary-page .tt-trip-mosaic__all { right: 9px; bottom: 9px; min-height: 36px; padding: 7px 10px; font-size: .72rem; }

  .itinerary-page .tt-trip-product { display: block; padding-top: 21px; }
  .itinerary-page .tt-trip-product h1 { margin-bottom: 13px; font-size: 2.35rem; }
  .itinerary-page .tt-trip-product__meta > div { grid-template-columns: 66px minmax(0,1fr); gap: 8px; }
  .itinerary-page .tt-trip-product__meta span { font-size: .84rem; }
  .itinerary-page .tt-trip-product__booking {
    margin-top: 20px;
    border: 1px solid var(--trip-line);
    border-radius: 14px;
    padding: 17px;
    background: #f8f4ee;
  }
  .itinerary-page .tt-trip-product__actions { margin-top: 13px; }

  .itinerary-page .tt-trip-overview__copy.is-collapsed .tt-trip-overview__text { max-height: 285px; }

  .tt-trip-lightbox__stage { width: calc(100vw - 20px); height: calc(100vh - 105px); }
  .tt-trip-lightbox__prev,
  .tt-trip-lightbox__next { top: auto; bottom: 18px; width: 44px; height: 44px; transform: none; }
  .tt-trip-lightbox__prev { left: 16px; }
  .tt-trip-lightbox__next { right: 16px; }
  .tt-trip-lightbox__counter { bottom: 28px; }
}

/* =========================================================
   Premium connected hero + overview
   Gallery/H1 stay simple. Price + essential information live
   in one side card beside the existing overview.
   ========================================================= */

.itinerary-page .tt-trip-top {
  padding: 16px 0 0;
  background: var(--trip-paper);
}

.itinerary-page .tt-trip-mosaic {
  grid-template-rows: repeat(2, 220px);
  border-radius: 17px;
}

.itinerary-page .tt-trip-product {
  display: block;
  max-width: 1040px;
  padding: 24px 0 0;
}

.itinerary-page .tt-trip-product__eyebrow {
  margin-bottom: 7px;
  font-size: .7rem;
  letter-spacing: .105em;
}

.itinerary-page .tt-trip-product h1 {
    max-width: 950px;
    margin: 0 0 10px;
    font-size: clamp(2rem, 3.2vw, 3.12rem);
    line-height: 1.035;
}

.itinerary-page .tt-trip-product__route {
  max-width: 980px;
  margin: 0;
  color: #58666c;
  font-size: .91rem;
  font-weight: 650;
  line-height: 1.58;
}

/* The overview continues directly from the H1 area. */
.itinerary-page .tt-trip-overview {
  padding-block: 30px 58px;
  background: var(--trip-paper);
}

.itinerary-page .tt-trip-overview__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 325px;
  align-items: start;
  gap: clamp(46px, 6vw, 82px);
}

.itinerary-page .tt-trip-overview article {
  max-width: 870px;
}

.itinerary-page .tt-trip-overview article > span {
  font-size: .7rem;
  letter-spacing: .1em;
}

.itinerary-page .tt-trip-overview article h2 {
  max-width: 820px;
  margin: 9px 0 17px;
  font-size: clamp(2.15rem, 3.45vw, 3.05rem);
  line-height: 1.08;
}

.itinerary-page .tt-trip-overview article p {
  max-width: 850px;
}

.itinerary-page .tt-trip-overview__lead {
  font-size: 1.04rem !important;
  line-height: 1.76 !important;
}

.itinerary-page .tt-trip-overview__copy.is-collapsed .tt-trip-overview__text {
  max-height: 190px;
}

/* Premium conversion + essential-information card. */
.itinerary-page .tt-trip-info-card {
  position: relative;
  overflow: hidden;
  border: 1px solid #e4dcd2;
  border-radius: 18px;
  padding: 23px;
  background: #f8f4ee;
  box-shadow: 0 14px 36px rgba(23, 33, 40, .055);
}

.itinerary-page .tt-trip-info-card::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--trip-accent), #e1a742);
  content: "";
}

.itinerary-page .tt-trip-info-card__price > span {
  display: block;
  margin-bottom: 5px;
  color: #7b858a;
  font-size: .69rem;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.itinerary-page .tt-trip-info-card__price > div {
  display: flex;
  align-items: baseline;
  gap: 7px;
}

.itinerary-page .tt-trip-info-card__price strong {
  color: var(--tt-ink);
  font-family: var(--font-serif), serif;
  font-size: 1.9rem;
  line-height: 1.08;
}

.itinerary-page .tt-trip-info-card__price small {
  color: #707c81;
  font-size: .76rem;
  font-weight: 650;
}

.itinerary-page .tt-trip-info-card__price p {
  margin: 6px 0 0;
  color: #7b858a;
  font-size: .78rem;
  line-height: 1.5;
}

.itinerary-page .tt-trip-info-card__request {
  display: block;
  margin-top: 1px;
  font-size: 1.7rem !important;
}

.itinerary-page .tt-trip-info-card__actions {
  display: grid;
  gap: 8px;
  margin-top: 17px;
}

.itinerary-page .tt-trip-info-card__actions .tt-button,
.itinerary-page .tt-trip-info-card__actions .tt-trip-whatsapp-button {
  width: 100%;
  min-height: 45px;
  justify-content: center;
  padding: 10px 14px;
  font-size: .82rem;
  font-weight: 800;
}

.itinerary-page .tt-trip-info-card__details {
  display: grid;
  gap: 0;
  margin-top: 20px;
  border-top: 1px solid #e0d7cc;
}

.itinerary-page .tt-trip-info-card__details > div {
  display: grid;
  gap: 3px;
  padding: 11px 0;
  border-bottom: 1px solid #e7ded4;
}

.itinerary-page .tt-trip-info-card__details span {
  color: #859095;
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.itinerary-page .tt-trip-info-card__details strong {
  color: #35434a;
  font-size: .84rem;
  font-weight: 750;
  line-height: 1.45;
}

.itinerary-page .tt-trip-info-card__note {
  margin-top: 14px;
  border-radius: 999px;
  padding: 8px 11px;
  color: var(--trip-mid);
  background: rgba(18, 63, 70, .07);
  font-size: .72rem;
  font-weight: 800;
  text-align: center;
}

/* Navigation follows the complete introduction. */
.itinerary-page .tt-trip-anchor {
  border-top: 1px solid var(--trip-line);
  background: rgba(255, 253, 249, .98);
  box-shadow: 0 8px 22px rgba(23, 33, 40, .045);
}

@media (max-width: 900px) {
  .itinerary-page .tt-trip-overview__layout {
    grid-template-columns: minmax(0, 1fr) 285px;
    gap: 34px;
  }
}

@media (max-width: 680px) {
  .itinerary-page .tt-trip-top {
    padding: 10px 0 0;
  }

  .itinerary-page .tt-trip-mosaic {
    grid-template-rows: 200px 100px;
  }

  .itinerary-page .tt-trip-product {
    padding-top: 20px;
  }

  .itinerary-page .tt-trip-product h1 {
    margin-bottom: 9px;
    font-size: 2.22rem;
    line-height: 1.04;
  }

  .itinerary-page .tt-trip-product__route {
    font-size: .84rem;
    line-height: 1.55;
  }

  .itinerary-page .tt-trip-overview {
    padding-block: 20px 42px;
  }

  .itinerary-page .tt-trip-overview__layout {
    display: flex;
    flex-direction: column;
    gap: 28px;
  }

  /* On mobile, conversion information appears immediately after H1/route. */
  .itinerary-page .tt-trip-info-card {
    order: -1;
    width: 100%;
    padding: 18px;
    border-radius: 14px;
  }

  .itinerary-page .tt-trip-info-card__actions {
    grid-template-columns: 1fr 1fr;
  }

  .itinerary-page .tt-trip-info-card__details {
    grid-template-columns: 1fr 1fr;
    column-gap: 18px;
  }

  .itinerary-page .tt-trip-info-card__details > div {
    min-width: 0;
  }

  .itinerary-page .tt-trip-overview article h2 {
    margin-bottom: 15px;
    font-size: 2.03rem;
  }

  .itinerary-page .tt-trip-overview__lead {
    font-size: 1rem !important;
  }

  .itinerary-page .tt-trip-overview__copy.is-collapsed .tt-trip-overview__text {
    max-height: 245px;
  }
}

@media (max-width: 410px) {
  .itinerary-page .tt-trip-info-card__actions {
    grid-template-columns: 1fr;
  }

  .itinerary-page .tt-trip-info-card__details {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   Compact premium price / key-info card
   ========================================================= */

.itinerary-page .tt-trip-info-card {
  padding: 18px;
  border-radius: 16px;
}

.itinerary-page .tt-trip-info-card__price > span {
  margin-bottom: 3px;
}

.itinerary-page .tt-trip-info-card__price strong {
  font-size: 1.72rem;
}

.itinerary-page .tt-trip-info-card__price p {
  margin-top: 4px;
  font-size: .75rem;
  line-height: 1.4;
}

.itinerary-page .tt-trip-info-card__request {
  font-size: 1.58rem !important;
}

.itinerary-page .tt-trip-info-card__actions {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: 7px;
  margin-top: 13px;
}

.itinerary-page .tt-trip-info-card__actions .tt-button,
.itinerary-page .tt-trip-info-card__actions .tt-trip-whatsapp-button {
  min-height: 40px;
  padding: 8px 10px;
  font-size: .76rem;
}

.itinerary-page .tt-trip-info-card__details {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 18px;
  margin-top: 15px;
  padding-top: 2px;
}

.itinerary-page .tt-trip-info-card__details > div {
  min-width: 0;
  padding: 8px 0;
}

.itinerary-page .tt-trip-info-card__details > div:nth-child(1),
.itinerary-page .tt-trip-info-card__details > div:nth-child(2) {
  border-bottom: 1px solid #e7ded4;
}

.itinerary-page .tt-trip-info-card__details > div:nth-child(n+3) {
  grid-column: 1 / -1;
}

.itinerary-page .tt-trip-info-card__details span {
  font-size: .63rem;
}

.itinerary-page .tt-trip-info-card__details strong {
  font-size: .8rem;
  line-height: 1.38;
}

.itinerary-page .tt-trip-info-card__note {
  margin-top: 10px;
  padding: 0;
  border-radius: 0;
  color: #647177;
  background: transparent;
  font-size: .69rem;
  font-weight: 750;
  text-align: left;
}

@media (max-width: 680px) {
  .itinerary-page .tt-trip-info-card {
    padding: 16px;
  }

  .itinerary-page .tt-trip-info-card__actions {
    grid-template-columns: 1fr 1fr;
  }

  .itinerary-page .tt-trip-info-card__details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 14px;
  }

  .itinerary-page .tt-trip-info-card__details > div:nth-child(n+3) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 410px) {
  .itinerary-page .tt-trip-info-card__actions {
    grid-template-columns: 1fr;
  }
}
