/* ========================================
   PAGES-EXPEDITION.CSS - 極地探險行程介紹頁
   Expedition Adventure
   ======================================== */


/* ===== EXPEDITION HERO ===== */

.expedition-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
}

/* 電腦 / 平板：橫幅（landscape） */
.expedition-hero__image {
  width: 100%;
  height: 660px;
  object-fit: cover;
  display: block;
}

@media (max-width: 1199px) {
  .expedition-hero__image {
    height: 520px;
  }
}

/* 手機：直式（portrait）*/
@media (max-width: 767px) {
  .expedition-hero__image {
    height: 85vh;
    min-height: 560px;
    object-position: center;
  }
}

/* 漸層疊層（由上往下漸暗，讓頂部文字清晰可讀） */
.expedition-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.60) 0%,
    rgba(0, 0, 0, 0.20) 55%,
    transparent 100%
  );
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 80px;
}

/* 文字 + 按鈕 內容塊：靠上置中 */
.expedition-hero__content {
  padding: var(--space-8) var(--space-12) 0;
  color: var(--color-white);
  max-width: 700px;
  width: 100%;
  text-align: center;
}

@media (max-width: 1199px) {
  .expedition-hero__content {
    padding: var(--space-8) var(--space-8) 0;
  }
}

@media (max-width: 767px) {
  .expedition-hero__content {
    padding: var(--space-6) var(--space-4) 0;
    max-width: 100%;
  }
}

/* 英文標題（上方小字） */
.expedition-hero__en {
  font-family: var(--font-sans);
  font-size: var(--text-md);
  font-weight: var(--fw-regular);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--color-primary-light);
  margin-bottom: var(--space-2);
}

@media (max-width: 767px) {
  .expedition-hero__en {
    font-size: var(--text-sm);
  }
}

/* 中文主標題 */
.expedition-hero__title {
  font-family: var(--font-serif);
  font-size: var(--text-4xl);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  color: var(--color-white);
  margin-bottom: var(--space-3);
}

@media (max-width: 767px) {
  .expedition-hero__title {
    font-size: var(--text-3xl);
  }
}

/* 副標題說明文字 */
.expedition-hero__subtitle {
  font-size: var(--text-sm);
  font-weight: var(--fw-light);
  color: rgba(255, 255, 255, 0.85);
  line-height: var(--lh-loose);
  margin-bottom: var(--space-8);
  max-width: 460px;
  margin-inline: auto;
}

@media (max-width: 767px) {
  .expedition-hero__subtitle {
    font-size: var(--text-xs);
    margin-bottom: var(--space-6);
    max-width: 100%;
  }
}

/* 按鈕群組 */
.expedition-hero__buttons {
  display: flex;
  gap: var(--space-4);
  flex-wrap: wrap;
  justify-content: center;
}

/*
  Outline 按鈕在深色 hero 背景上改為白色，
  保持 button--outline 的 token 結構，只做情境覆寫
*/
.expedition-hero__buttons .button--outline {
  color: var(--color-white);
  border-color: var(--color-white);
}

.expedition-hero__buttons .button--outline:hover {
  background-color: rgba(255, 255, 255, 0.15);
}


/* ===== EXPEDITION NAV BAR ===== */
/*
  只在電腦 / 平板顯示（>= 768px）
  手機（<= 767px）隱藏
*/
.expedition-nav {
  background-color: var(--color-dark);
  border-bottom: 1px solid var(--color-border);
  box-shadow: var(--shadow-sm);
  position: sticky;
  top: 4rem; /* 貼齊 site-header 高度 */
  z-index: 90;
  height: 48px; /* 明確高度，讓子元素可以垂直置中 */
}

@media (max-width: 767px) {
  .expedition-nav {
    display: none;
  }
}

.expedition-nav__list {
  list-style: none;
  display: flex;
  height: 100%;         /* 填滿 nav 的 48px */
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: var(--space-6);
}

.expedition-nav__item {
  flex: 1;
  display: flex;
}

.expedition-nav__link {
  flex: 1;
  display: flex;
  flex-direction: row;
  align-items: center;      /* 垂直置中 */
  justify-content: center;  /* 水平置中 */
  gap: var(--space-2);
  padding-inline: var(--space-3);  /* 只保留左右 padding，垂直由容器高度決定 */
  color: var(--color-text-lighter);
  text-decoration: none;
  transition: color var(--transition-base);
  white-space: nowrap;
}

.expedition-nav__link:hover {
  color: var(--color-primary);
}

.expedition-nav__link.is-active {
  color: var(--color-primary);
}

/*
  SVG Icon 預留空間
  在 <span class="expedition-nav__icon"> 裡直接貼上 SVG 即可
*/
.expedition-nav__icon {
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  flex-shrink: 0;
}

.expedition-nav__icon svg {
  width: 100%;
  height: 100%;
}

/* 導覽列文字標籤 */
.expedition-nav__label {
  font-size: var(--text-sm);
  font-weight: var(--fw-medium);
  font-family: var(--font-serif);
  letter-spacing: 0.04em;
}

/* 平板尺寸縮小一點 */
@media (max-width: 1199px) {
  .expedition-nav__link {
    padding: var(--space-2) var(--space-2);
    gap: var(--space-1);
  }

  .expedition-nav__label {
    font-size: var(--text-xs);
  }
}


/* ========================================
   OVERVIEW SECTION — 行程總覽
   ======================================== */

/* Smooth scroll（全站錨點滾動） */
html {
  scroll-behavior: smooth;
}

/* 區塊本體 */
.overview-section {
  padding-block: var(--space-16);
  scroll-margin-top: 7rem; /* sticky header(4rem) + nav 高度 */
  background-color: var(--color-primary-Pale);
}

/* ── 版型 Grid ──
   桌機：左(文字/圖) 右(卡片) 兩欄
   平板 + 手機：單欄直式堆疊
*/
.overview-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: var(--space-12);
  align-items: start;
}

@media (max-width: 1199px) {
  .overview-grid {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }
}


/* ── LEFT COLUMN ── */

/* 區段標籤（金色左邊線 ＋ 中英文） */
.overview-label {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-5);
  padding-left: var(--space-4);
  border-left: 3px solid var(--color-primary);
}

.overview-label__text {
  font-family: var(--font-serif);
  font-size: var(--text-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
}

.overview-label__sub {
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  color: var(--color-text-lighter);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* 主標題「啟程  Departure」 */
.overview-title {
  font-family: var(--font-serif);
  font-size: var(--text-3xl);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
  margin-bottom: var(--space-6);
  display: flex;
  align-items: baseline;
  gap: var(--space-4);
}

.overview-title__en {
  font-family: var(--font-sans);
  font-size: var(--text-lg);
  font-weight: var(--fw-light);
  color: var(--color-primary);
  letter-spacing: 0.08em;
}

/* 圖片 */
.overview-img-wrap {
  overflow: hidden;
  margin-bottom: var(--space-6);
}

.overview-img {
  width: 100%;
  height: 340px;
  object-fit: cover;
  display: block;
  transition: transform var(--transition-slow);
}

.overview-img-wrap:hover .overview-img {
  transform: scale(1.03);
}

@media (max-width: 1199px) {
  .overview-img { height: 300px; }
}

@media (max-width: 767px) {
  .overview-img { height: 240px; }
}

/* 內文 */
.overview-body {
  font-family: var(--font-serif);
  font-size: var(--text-md);
  color: var(--color-text);
  line-height: var(--lh-loose);
  text-align: justify;
}


/* ── RIGHT COLUMN ── */

.overview-right {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
}


/* ── Hello, Sweden! CARD ── */



.overview-hello-card__title {
  font-family: var(--font-serif);
  font-size: var(--text-2xl);
  font-weight: var(--fw-regular);
  color: var(--color-primary);
  margin-bottom: var(--space-6);
}

/* 兩個統計並排（手機也維持並排） */
.overview-hello-card__stats {
  display: flex;
  align-items: flex-start;
  gap: 10rem;
}

/* 每個 stat：金色左邊線 + 大數字 + 小標籤 */
.overview-hello-card__stat {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-left: var(--space-4);
  border-left: 2px solid var(--color-primary);
}

.overview-hello-card__stat-num {
  font-family: var(--font-serif);
  font-size: var(--text-4xl);
  font-weight: var(--fw-bold);
  color: var(--color-dark);
  line-height: 1;
}

.overview-hello-card__stat-label {
  font-family: var(--font-serif);
  font-size: var(--text-sm);
  color: var(--color-text);
}


/* ── 航班資訊 SECTION ── */

/* section wrapper：無外框，flex 垂直排列 */
.overview-flight-section {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

/* Section 標題 */
.overview-flight-card__title {
  font-family: var(--font-serif);
  font-size: var(--text-2xl);
  font-weight: var(--fw-regular);
  color: var(--color-primary);
  margin-bottom: var(--space-6);
}

.overview-flight-card__title-en {
  font-family: var(--font-serif);
  font-size: var(--text-2xl);
  font-weight: var(--fw-regular);
  color: var(--color-primary);
  margin-bottom: var(--space-6);
}


/* ── FLIGHT CARD（去程 / 回程 各一張，無外框）── */

.flight-card {
  background-color: var(--color-white);
  padding: var(--space-5) var(--space-6);
}

/* 卡片標頭：方向標籤 左 ／ 飛機 icon 右 */
.flight-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-4);
}

.flight-card__dir {
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* 飛機 icon（右上角，淡灰色） */
.flight-card__plane-icon {
  color: var(--color-text-lighter);
  opacity: 0.45;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.flight-card__plane-icon svg {
  width: 22px;
  height: 22px;
}

/* 回程卡片：飛機水平翻轉 */
.flight-card--return .flight-card__plane-icon {
  transform: scaleX(-1);
}


/* ── 路線列（endpoints + track）── */

.flight-card__route {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--space-3);
  padding-top: 20px; /* 為轉機代碼保留上方空間 */
}

/* 出發地 / 目的地 */
.flight-card__endpoint {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.flight-card__endpoint--right {
  text-align: right;
}

/* 大 IATA 代碼 */
.flight-card__iata {
  font-family: var(--font-sans);
  font-size: var(--text-3xl);
  font-weight: var(--fw-bold);
  color: var(--color-dark);
  line-height: 1;
  letter-spacing: 0.02em;
}

/* 城市名 */
.flight-card__city {
  font-family: var(--font-serif);
  font-size: var(--text-xs);
  color: var(--color-text-lighter);
}

/* 時間 */
.flight-card__time {
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  color: var(--color-text-lighter);
  letter-spacing: 0.04em;
}

.flight-card__endpoint--right .flight-card__time {
  text-align: right;
}


/* ── 連接線 TRACK ── */

.flight-card__track {
  position: relative;
  height: 1px;
  background-color: var(--color-border);
  overflow: visible; /* 讓 via-point 顯示在線的上方 */
}

/* 箭頭（→）疊在線的右端 */
.flight-card__track::after {
  content: '→';
  position: absolute;
  right: -2px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-text-lighter);
  font-size: var(--text-sm);
  line-height: 1;
  background-color: var(--color-white);
  padding-left: 4px;
}

/*
  轉機點：via-code 在上，via-dot 在線上
  transform: translate(-50%, calc(-100% + 3px))
    → 往上移自身高度，再補回 dot-radius(3px)，使 dot 中心對齊線
*/
.flight-card__via-point {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, calc(-100% + 3px));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

/* 轉機城市代碼（線上方小字） */
.flight-card__via-code {
  font-family: var(--font-sans);
  font-size: 10px;
  color: var(--color-text-lighter);
  white-space: nowrap;
  letter-spacing: 0.04em;
}

/* 轉機小圓點（落在線上） */
.flight-card__via-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: var(--color-text-lighter);
}


/* ════════════════════════════
   FLIGHT ROUTE COMPONENT
   ════════════════════════════

   視覺示意：
         SK 6842          SK 1423
   TPE ●——————————● CDG ——————————● ARN

   原理：align-items: flex-end 讓全部底部對齊，
   connector 的 margin-bottom 把虛線頂到圓點水平位置。
*/

.flight-route {
  display: flex;
  align-items: flex-end;
  width: 100%;
}

/* 城市端點（出發 / 轉機 / 目的） */
.flight-route__point {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  flex-shrink: 0;
}

/* 端點圓點 */
.flight-route__circle {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid var(--color-text-lighter);
  background-color: var(--color-white);
  flex-shrink: 0;
}

.flight-route__circle--filled {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

/* IATA 城市代碼 */
.flight-route__code {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--fw-bold);
  color: var(--color-dark);
  letter-spacing: 0.04em;
}

.flight-route__code--via {
  font-size: 11px;
  font-weight: var(--fw-regular);
  color: var(--color-text-lighter);
}

/* 航段連接器（航班號 + 虛線）
   margin-bottom = IATA高度(~21px) + gap(3px) + 圓點半徑(5px) ≈ 29px
   讓虛線對齊圓點的水平中心 */
.flight-route__connector {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  margin-bottom: 29px;
  min-width: 0;
}

.flight-route__flt-no {
  font-family: var(--font-sans);
  font-size: 10px;
  color: var(--color-text-lighter);
  letter-spacing: 0.06em;
  white-space: nowrap;
}

/* 虛線 */
.flight-route__bar {
  width: 100%;
  border-bottom: 1.5px dashed var(--color-border);
  display: block;
}



/* ========================================
   EXPEDITION BANNERS
   ======================================== */
.expedition-banner {
  width: 100%;
  height: 480px;
  overflow: hidden;
  scroll-margin-top: 4rem;
}

/* 平板：直式圖片，加高容器 */
@media (max-width: 1199px) {
  .expedition-banner {
    height: 600px;
  }
}

/* 手機：直式圖片，以 vh 撐高 */
@media (max-width: 767px) {
  .expedition-banner {
    height: 75vh;
    min-height: 480px;
  }
}

.expedition-banner__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}



/* ========================================
   ROUTE MAP SECTION — 行程地圖介紹
   ======================================== */
.route-map-section {
  background-color: var(--color-white);
  padding-block: var(--space-20);
  background-color: var(--color-primary-Pale);

}

.route-map-intro {
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: var(--space-6);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-16);
  align-items: center;
}

.route-map-intro__image-wrap {
  width: 100%;
}

/* 行程地圖輪播：固定 4:3 比例容器，圖片全滿版堆疊 */
.route-map-intro .carousel-slides {
  aspect-ratio: 4 / 3;
}

.route-map-intro .carousel-slider__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1s ease-out;
  aspect-ratio: auto;
}

.route-map-intro .carousel-slider__image.active {
  opacity: 1;
}

.route-map-intro__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

/* .route-map-intro__label {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 2px;
} */

.route-map-intro__title {
  font-family: var(--font-serif);
  font-size: var(--text-3xl);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
  line-height: var(--lh-tight);
}

.route-map-intro__body {
  font-family: var(--font-serif);
  font-size: var(--text-md);
  color: var(--color-text);
  line-height: var(--lh-loose);
  text-align: justify;
}

/* Tablet */
@media (max-width: 1199px) {
  .route-map-intro {
    grid-template-columns: 1fr;
    gap: var(--space-10);
  }
}

/* Mobile */
@media (max-width: 767px) {
  .expedition-banner {
    height: 330px;
  }

  .route-map-section {
    padding-block: var(--space-12);
  }

  .route-map-intro {
    padding-inline: var(--space-4);
    gap: var(--space-8);
  }

  .route-map-intro__image-wrap {
    order: 2;
  }

  .route-map-intro__content {
    order: 1;
  }

  .route-map-intro__title {
    font-size: var(--text-2xl);
  }
}



/* ========================================
   TRIP HIGHLIGHTS SECTION — 行程亮點
   ======================================== */
.trip-highlights {
  background-color: var(--color-primary-Pale);
  padding-block: var(--space-20);
  scroll-margin-top: 7rem;
}

/* 標題區 */
.trip-highlights__header {
  text-align: center;
  margin-bottom: var(--space-12);
  padding-inline: var(--space-4);
}

.trip-highlights__title {
  font-family: var(--font-serif);
  font-size: var(--text-3xl);
  color: var(--color-primary);
  line-height: var(--lh-tight);
}

/* .trip-highlights__title-en {
  font-family: var(--font-sans);
  font-size: var(--text-lg);
  color: var(--color-primary);
  font-weight: var(--fw-light);
  margin-top: var(--space-1);
} */

/* 分區小標題（景點與體驗 / 旅館與餐飲） */
.trip-highlights__section-label {
  font-family: var(--font-sans);
  font-size: var(--text-lg);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: var(--space-4);
}

/* 內容 panel 容器 */
.trip-highlights__panel {
  max-width: 820px;
  margin-inline: auto;
  padding-inline: var(--space-6);
}

.trip-highlights__panel + .trip-highlights__panel {
  margin-top: var(--space-16);
}

/* 地點切換 tabs bar */
.location-tabs {
  background-color: var(--color-white);
  display: flex;
  justify-content: center;
  align-items: stretch;
  overflow-x: auto;
  scrollbar-width: none;
  margin-bottom: 16px;
}

.location-tabs::-webkit-scrollbar {
  display: none;
}

.location-tab {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  padding: var(--space-3) var(--space-5);
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  color: var(--color-text-light);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: var(--space-2);
  transition: color var(--transition-base), border-color var(--transition-base);
  white-space: nowrap;
}

.location-tab.is-active {
  color: var(--color-dark);
  border-bottom-color: var(--color-primary);
}

.location-tab__dot {
  width: 6px;
  height: 6px;
  border-radius: var(--radius-full);
  background-color: var(--color-primary);
  flex-shrink: 0;
  display: none;
}

.location-tab.is-active .location-tab__dot {
  display: block;
}

/* ── Module 1：景點與體驗（全幅圖片 + 下方文字） ── */
.sight-slide {
  display: none;
}

.sight-slide.is-active {
  display: block;
}

.sight-slide__image {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

.sight-slide__text {
  background-color: var(--color-white);
  padding: var(--space-6) var(--space-8);
  font-family: var(--font-serif);
  font-size: var(--text-md);
  color: var(--color-text);
  line-height: var(--lh-loose);
  text-align: justify;
}

/* ── Module 2：旅館與餐飲（圖文並列） ── */
.hotel-slide {
  display: none;
}

.hotel-slide.is-active {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
}

.hotel-slide__image {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
}

.hotel-slide__text {
  background-color: var(--color-white);
  padding: var(--space-8);
  font-family: var(--font-serif);
  font-size: var(--text-md);
  color: var(--color-text);
  line-height: var(--lh-loose);
  text-align: justify;
}

/* Tablet */
@media (max-width: 1199px) {
  .trip-highlights__panel {
    max-width: 100%;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .trip-highlights {
    padding-block: var(--space-12);
  }

  .trip-highlights__header {
    margin-bottom: var(--space-8);
  }

  .trip-highlights__panel {
    padding-inline: 0;
  }

  .hotel-slide.is-active {
    grid-template-columns: 1fr;
  }

  .sight-slide__text,
  .hotel-slide__text {
    padding: var(--space-5);
  }
}



/* ========================================
   DAILY ITINERARY SECTION — 每日行程
   ======================================== */
.daily-section {
  background-color: var(--color-primary-Pale);
  scroll-margin-top: 4rem;
}

/* ── Default (mobile + tablet): natural single-column flow ── */
.daily-split {
  display: grid;
  grid-template-columns: 1fr;
}

.daily-content {
  padding: var(--space-12) var(--space-4);
}

.daily-header {
  margin-bottom: var(--space-8);
}

.daily-eyebrow {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: var(--space-2);
}

.daily-title {
  font-family: var(--font-serif);
  font-size: var(--text-3xl);
  font-weight: var(--fw-bold);
  color: var(--color-dark);
  line-height: var(--lh-tight);
  margin-bottom: var(--space-3);
}

.daily-hint {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  color: var(--color-text-lighter);
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.daily-hint-arrow {
  display: inline-flex;
  align-items: center;
  color: var(--color-primary);
}

.daily-hint-arrow svg {
  width: 18px;
  height: 18px;
  display: block;
}

/* ── Vertical timeline ── */
.daily-timeline {
  position: relative;
  margin-top: var(--space-8);
  padding-left: var(--space-5);
}

.daily-timeline::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background-color: var(--color-border);
}

.daily-day {
  position: relative;
  margin-bottom: var(--space-10);
}

.daily-day__label {
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin-bottom: var(--space-1);
}

.daily-day__title {
  font-family: var(--font-serif);
  font-size: var(--text-lg);
  font-weight: var(--fw-semibold);
  color: var(--color-dark);
  line-height: var(--lh-snug);
  margin-bottom: var(--space-3);
}

.daily-day__body {
  font-family: var(--font-serif);
  font-size: var(--text-md);
  color: var(--color-text);
  line-height: var(--lh-loose);
  text-align: justify;
  margin-bottom: var(--space-4);
}

.daily-day__meal {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  color: var(--color-text-light);
  line-height: var(--lh-normal);
}

.daily-day__meal-icon {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  color: var(--color-primary);
  margin-top: 2px;
}

/* Inline image — shown on mobile/tablet, hidden on desktop */
.daily-day__image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  margin-top: var(--space-5);
  border-radius: var(--radius-sm);
}

/* ── Right: image panel — hidden on mobile/tablet, desktop only ── */
.daily-image-panel {
  display: none;
}

.daily-image-panel__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  pointer-events: none; /* 隱藏中的圖片不攔截點擊 */
  transition: opacity 0.8s ease-out;
  display: block;
  /* P8-86：所有非 active 圖預設 z-index 1（後層），切換時舊圖被新圖蓋住
     避免 cross-fade 期間看到「閃過其他行程圖片影子」 */
  z-index: 1;
}

.daily-image-panel__img.is-active {
  opacity: 1;
  pointer-events: auto;
  /* active 立即升到上層蓋住舊圖（z-index 不 transition），讓舊圖 fade-out
     被新圖視覺上掩蓋，使用者看不到殘影 */
  z-index: 2;
}

/* ── Tablet: more breathing room ── */
@media (min-width: 768px) and (max-width: 1199px) {
  .daily-content {
    padding: var(--space-16) var(--space-8);
  }

  .daily-header {
    margin-bottom: var(--space-10);
  }

  .daily-timeline {
    padding-left: var(--space-8);
    margin-top: var(--space-10);
  }

  .daily-day {
    margin-bottom: var(--space-14);
  }

  .daily-title {
    font-size: var(--text-4xl);
  }

  .daily-day__title {
    font-size: var(--text-xl);
  }
}

/* ── Desktop: sticky 50/50 split, max-width 1280px centered ── */
@media (min-width: 1200px) {
  .daily-split {
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow: hidden;
    max-width: 1280px;
    margin-inline: auto;
    width: 100%;
  }

  .daily-content {
    overflow: hidden;
    height: 100%;
    padding: var(--space-20) var(--space-12);
  }

  .daily-header {
    margin-bottom: var(--space-10);
  }

  .daily-timeline {
    padding-left: var(--space-8);
    margin-top: var(--space-10);
  }

  .daily-day {
    margin-bottom: var(--space-20);
  }

  .daily-title {
    font-size: var(--text-4xl);
    margin-bottom: var(--space-4);
  }

  .daily-day__title {
    font-size: var(--text-xl);
  }

  .daily-image-panel {
    display: block;
    position: relative;
    height: 100%;
    overflow: hidden;
  }

  .daily-day__image {
    display: none;
  }
}


/* ========================================
   備用圖文區塊 INFO BLOCKS
   ======================================== */
.info-blocks {
  background-color: var(--color-primary-Pale);
  padding-block: var(--space-20);
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
}

/* 區塊標題 */
.info-blocks__header {
  text-align: center;
  padding-inline: var(--space-6);
}

.info-blocks__title {
  font-family: var(--font-serif);
  font-size: var(--text-3xl);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
}

/* 共用 panel 容器 */
.info-block {
  max-width: 820px;
  margin-inline: auto;
  width: 100%;
}

/* ── 上下排版 ── */
.info-block--stack .info-block__image {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

.info-block--stack .info-block__text {
  background-color: var(--color-white);
  padding: var(--space-6) var(--space-8);
}

/* ── 左右排版 ── */
.info-block--side {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
}

.info-block--side .info-block__image {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
}

.info-block--side .info-block__text {
  background-color: var(--color-white);
  padding: var(--space-8);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* 共用文字元素 */
.info-block__label {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: var(--space-3);
}

.info-block__heading {
  font-family: var(--font-serif);
  font-size: var(--text-2xl);
  font-weight: var(--fw-bold);
  color: var(--color-dark);
  line-height: var(--lh-tight);
  margin-bottom: var(--space-4);
}

.info-block__body {
  font-family: var(--font-serif);
  font-size: var(--text-md);
  color: var(--color-text);
  line-height: var(--lh-loose);
  text-align: justify;
}

/* Tablet */
@media (max-width: 1199px) {
  .info-block {
    max-width: 100%;
    padding-inline: var(--space-6);
  }

  .info-block--side {
    padding-inline: 0;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .info-blocks {
    padding-block: var(--space-12);
    gap: var(--space-10);
  }

  .info-block {
    padding-inline: 0;
  }

  /* 左右排版 → 改為上下堆疊 */
  .info-block--side {
    grid-template-columns: 1fr;
  }

  .info-block--side .info-block__image {
    aspect-ratio: 16 / 9;
  }
}

/* ========================================
   P8-37 — 費用說明區塊（前台新增，讀 trip.includes / trip.excludes）
   ======================================== */
.pricing-section {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--space-16) var(--space-6);
}

.pricing-section__header {
  text-align: center;
  margin-bottom: var(--space-10);
}

.pricing-section__title {
  font-family: var(--font-serif);
  font-size: var(--text-3xl);
  font-weight: var(--fw-bold);
  color: var(--color-dark);
  margin-bottom: var(--space-2);
}

.pricing-section__subtitle {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 3px;
}

.pricing-section__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-8);
}

.pricing-col {
  background: var(--color-white);
  border: 1px solid #E5E5E5;
  border-radius: 12px;
  padding: var(--space-8);
}

.pricing-col__title {
  font-family: var(--font-serif);
  font-size: var(--text-xl);
  font-weight: var(--fw-bold);
  color: var(--color-dark);
  margin-bottom: var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 2px solid var(--color-primary);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.pricing-col__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  font-weight: var(--fw-bold);
  font-size: 14px;
}

.pricing-col--includes .pricing-col__icon {
  background: #E6F4EA;
  color: #1E7E34;
}

.pricing-col--excludes .pricing-col__icon {
  background: #FDECEA;
  color: #B91C1C;
}

.pricing-col__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.pricing-col__item {
  font-family: var(--font-serif);
  font-size: var(--text-md);
  color: var(--color-text);
  line-height: var(--lh-loose);
  padding-left: var(--space-5);
  position: relative;
  white-space: pre-wrap;
}

.pricing-col__item::before {
  content: '•';
  position: absolute;
  left: 0;
  color: var(--color-primary);
  font-weight: var(--fw-bold);
}

.pricing-col__item--empty {
  color: #999;
  padding-left: 0;
}

.pricing-col__item--empty::before {
  content: '';
}

/* 平板 */
@media (max-width: 1199px) {
  .pricing-section {
    padding: var(--space-12) var(--space-5);
  }
  .pricing-section__grid {
    gap: var(--space-6);
  }
  .pricing-col {
    padding: var(--space-6);
  }
}

/* 手機：單欄 */
@media (max-width: 767px) {
  .pricing-section {
    padding: var(--space-10) var(--space-4);
  }
  .pricing-section__grid {
    grid-template-columns: 1fr;
    gap: var(--space-5);
  }
  .pricing-col {
    padding: var(--space-5);
  }
  .pricing-section__title {
    font-size: var(--text-2xl);
  }
}

/* ========================================
   P8-32 — 內文區塊支援斷行（保留換行符號不要壓成一行）
   ======================================== */
.overview-body,
.overview-body p,
.route-map-intro__body,
.sight-slide__text,
.hotel-slide__text,
.info-block__body,
.daily-day__body,
.daily-day__meal,
.feature-card__desc,
.feature-card__text,
.trip-highlights__section-label,
.info-block__label {
  white-space: pre-wrap;
}

/* ========================================
   P8-28 — 啟程下方橫幅圖 1 與 2 完整顯示（不裁切）
   - Banner 1: .expedition-banner:first-of-type
   - Banner 2: .expedition-banner#map
   - Banner 3 (closing): 不動，維持固定高度 object-fit: cover
   P8-75 — 手機 min-height:480px 殘留導致圖下方空白（媒體規則漏蓋）
   ======================================== */
.expedition-banner:first-of-type,
.expedition-banner#map {
  height: auto;
  min-height: 0; /* P8-75 蓋掉 mobile @media 的 min-height:480px，避免圖下留白 */
}
.expedition-banner:first-of-type .expedition-banner__img,
.expedition-banner#map .expedition-banner__img {
  height: auto;
  width: 100%;
  object-fit: initial;
  display: block;       /* P8-75 防 inline baseline gap */
  vertical-align: top;
}
/* P8-75 picture wrapper inline 會產生 baseline 空隙，強制 block */
.expedition-banner#map picture {
  display: block;
  line-height: 0;
}