:root{
  --c-brand: #00989d;
  --c-brand-dark: #006987;
  --c-yellow: #f3981d;
  --c-text: #404040;
  --c-muted: #9397a0;
  --c-muted-2: #545354;
  --c-bg: #ffffff;
  --c-pale: rgba(0,152,157,.05);
  --radius: 10px;
  --shadow: 0 10px 30px rgba(0,0,0,.06);
  --page-max: 1024px;
  --content-max: 520px; /* 1024 下依然保持 H5 视觉密度 */
  --gutter: clamp(16px, 3vw, 28px);
  /* 左右取 gutter 与两侧 safe-area 的最大值再对称，避免部分 WebView 单侧 env(safe-area-inset-*) 偏大导致窄屏整页偏左、右侧大块留白 */
  --page-safe-inline: max(
    var(--gutter),
    env(safe-area-inset-left, 0px),
    env(safe-area-inset-right, 0px)
  );
  /* 第三屏正文/签字区 max-width：随视口变窄（勿用 clamp 把下限锁在 343px，会与极窄屏可用宽度脱节） */
  --mayor-max: min(720px, 80vw);
  --discover-scale: 1; /* 第五屏：轮播整体等比缩放 */
  --itinerary-scale: 1; /* 第六屏：列表整体等比缩放 */
  --discover-card-w: calc(271px * var(--discover-scale));
  /* 首页正文窄列（与稿面 343 对齐）；小屏用 width:100%+max-width，勿用 width:min(343px,100%) 以免部分 WebView 居中失效 */
  --layout-col-343: 343px;
}
@media screen and (min-width: 1024px){
  :root{
    --page-max: 90%;
  }
}

*{ box-sizing:border-box; }
/* 避免 button/input 等使用浏览器默认字体，确保与 body 一致（英文站 Gilroy） */
button,
input,
select,
textarea{
  font-family: inherit;
}
html,body{ height:100%; }
/* 禁止整页横向滚动：负 margin / 旧 WebView 对 vw 与百分比宽度计算偏差等 */
html{
  overflow-x: hidden;
  max-width: 100%;
}
body{
  margin:0;
  overflow-x: hidden;
  max-width: 100%;
  /* 英文站主字体由 fonts-en.css 中 --font-sans-site 控制（需在 HTML 中先于本文件引入 fonts-en.css） */
  font-family: var(
    --font-sans-site,
    system-ui,
    -apple-system,
    "Segoe UI",
    Roboto,
    "Helvetica Neue",
    Arial,
    sans-serif
  );
  color: var(--c-text);
  background: var(--c-bg);
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

img,video{ display:block; max-width:100%; }
a{ color: inherit; }

/* 勿用大负值水平移出视口：部分华为/HarmonyOS 会把离屏绝对定位算进文档横向可滚动宽度 */
.skip-link{
  position:absolute;
  left: 8px;
  top: -120px;
  padding: 8px 12px;
  background:#000;
  color:#fff;
  border-radius:8px;
  z-index: 9999;
  transition: top 0.15s ease;
}
.skip-link:focus{
  top: 8px;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0,0,0,.05);
  padding-top: env(safe-area-inset-top);
}

.topbar__inner {
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 10px var(--page-safe-inline) 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.lang-toggle{
  border: 1px solid rgba(0,152,157,.6);
  background: rgba(255,255,255,.6);
  border-radius: 999px;
  padding: 6px 12px;
  display:flex;
  align-items:center;
  gap: 6px;
  cursor:pointer;
  font-size: 12px;
}
.lang-toggle__zh{ color: rgba(0,152,157,.8); }
.lang-toggle__en,
.lang-toggle__sep{ color: var(--c-brand); font-weight: 600; }

.page{
  width: 100%;
  max-width: min(var(--page-max), 100%);
  margin: 0 auto;
  padding-top: 0;
  padding-bottom: 80px;
  padding-left: var(--page-safe-inline);
  padding-right: var(--page-safe-inline);
  box-sizing: border-box;
  overflow-x: hidden;
  min-width: 0;
}

.section{ padding: 22px 0; }
.section--pale{
  background: linear-gradient(180deg, var(--c-pale), rgba(0,152,157,.02));
  border-radius: var(--radius);
  padding: 22px var(--gutter);
  margin: 18px calc(var(--gutter) * -1);
}
@media screen and (min-width: 1024px){
  .section--pale{
    margin: 0;
  }
}


.screen-375{
  width: 100%;
  margin: 0 auto;
}

/* 第三屏：正文/图片左右对齐，且可自适应到 1024px */
.section--mayor.section--pale{
  padding-left: 0;
  padding-right: 0;
}
.section--mayor .screen-375{
  max-width: var(--page-max);
  margin: 0 auto;
  padding-left: var(--page-safe-inline);
  padding-right: var(--page-safe-inline);
}
@media screen and (min-width: 1024px){
  .section--mayor .screen-375{
  max-width: 100%;
  padding: 30px;
  display: flex;
        gap: 100px;
}
}
.section--mayor .section__hd,
.section--mayor .copy{
  max-width: var(--mayor-max);
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 1024px){
  .section--mayor .section__hd,
.section--mayor .copy{
  max-width: 100%;
}
}
.section__hd{
  max-width: var(--content-max);
  margin: 0 auto 14px;
}

@media screen and (min-width: 1024px){
  .section__hd{
    max-width: 100%;
  }
}
.h2{
  margin: 0;
  font-size: clamp(18px, 2.2vw, 20px);
  line-height: 1.4;
}
.h2--center{ text-align:center; }
.sub{
  margin: 6px 0 0;
  color: var(--c-muted);
  font-size: 12px;
  line-height: 1.4;
}

.section__hd--mayor .sub{
  color: #9397a0;
  font-weight: 600;
  line-height: 16px;
}

.title-with-underline{
  display: inline-block;
}
.title-with-underline--center{
  display: inline-flex;
  flex-direction: column;
  align-items: center;
}
.title-with-underline--center .title-underline{
  /* 标题下划线图标：居中对齐（覆盖默认偏移） */
  margin-left: 0;
}
.title-with-underline--left{
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
}
.title-with-underline--left .title-underline{
  /* 左对齐标题下划线：覆盖默认偏移 */
  margin-left: 0;
}
.title-underline{
  display: block;
  width: 48.59px;
  height: 14.28px;
  min-width: 48.59px;
  min-height: 14.28px;
  max-width: none;
  max-height: none;
  aspect-ratio: 47.9236 / 10.9508;
  object-fit: contain;
  object-position: left center;
  margin: 4px 0 8px 17px; /* 按设计稿：下划线在 Message 下方，并与 subtitle 拉开距离 */
  pointer-events: none;
}
.copy{
  max-width: var(--content-max);
  margin: 0 auto;
  font-size: 12px;
  line-height: 1.65;
  color: var(--c-muted-2);
}
.copy p{ margin: 10px 0; }
.lead{ font-size: 14px; font-weight: 600; color: var(--c-muted-2); }

.muted{ color: var(--c-muted); font-size: 12px; line-height: 1.4; }
.center{ text-align:center; }
.mt-8{ margin-top: 8px; }

.hero{ padding: 0 0 18px; }
.hero--secondary{ padding-top: 6px; }

.media--hero{
  aspect-ratio: 375 / 211;
  border-radius: 0;
}

/* Centraliza o container pai na vertical e horizontal */
.hero__text {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    padding: 0 20px;
}

/* Centraliza o container pai na vertical e horizontal */
.hero__text {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    padding: 0 20px;
}

/* ================= LOGO DA BARREIRINHAS (RESPONSIVA) ================= */
.hero__logo {
    display: block;
    width: auto;
    max-width: 85%;
    max-height: 43vh;
    margin: -190px auto 20px;
    object-fit: contain;
}

/* A linha ondulada branca */
.hero__wave {
    display: block;
    width: 150px;
    height: auto;
    margin: 20px 0 16px;
    object-fit: contain;
    pointer-events: none;
}

/* Subtítulo centralizado */
.hero__subtitle {
    margin: 0;
    font-size: clamp(1.2rem, 2.5vw, 1.5rem);
    font-weight: 600;
    text-align: center;
    line-height: 1.3;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

/* ================= RESPONSIVIDADE DO HERO (CORRIGIDO) ================= */

@media screen and (max-width: 480px) {
    .hero__text {
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
    }
    .hero__logo {
        max-width: 40vw;
        max-height: 20vh;
        margin: 0 auto 16px !important;
        align-self: center !important;
        display: block !important;
    }
    .hero__wave {
        width: 60px !important;
        margin: 0 auto 8px !important;
        align-self: center !important;
        display: block !important;
    }
    .hero__subtitle {
        font-size: clamp(0.9rem, 3vw, 1.2rem);
        text-align: center !important;
        margin: 0 auto !important;
        display: block !important;
        align-self: center !important;
        padding: 0 !important;
        width: 100% !important;
    }
}

/* Telas médias (Tablets de 481px a 1023px) */
@media screen and (min-width: 481px) and (max-width: 1023px) {
    .hero__logo {
        max-width: 40vw;
        max-height: 35vh;
        margin: 0 auto 12px;
    }
    .hero__wave {
        width: 30px; /* Linha ondulada média para tablets */
        margin: 10px 0 14px;
    }
    .hero__subtitle {
        font-size: clamp(1.2rem, 2.5vw, 1.8rem);
    }
}



/* A linha ondulada branca */
.hero__wave {
    display: block;
    width: 150px;
    height: auto;
    margin: 20px 0 16px; /* Espaço acima e abaixo da linha */
    object-fit: contain;
    pointer-events: none;
}

/* Subtítulo limpo e centralizado abaixo da linha ondulada */
.hero__subtitle {
    margin: 0;
    font-size: clamp(1.2rem, 2.5vw, 2.5rem);
    font-weight: 600;
    text-align: center;
    line-height: 1.3;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

/* 第二屏风光视频角标：左上（与首屏 hero 文案分区无关，仅 hero--secondary 使用） */
.hero__brand{
  position:absolute;
  left: 14px;
  top: 12px;
  right: auto;
  bottom: auto;
  display:flex;
  align-items:flex-start;
  gap: 10px;
}
.hero__brand-logo{ width: 43.73px; height: 33.13px; object-fit: contain; }
.hero__brand-mark{ width: 52.48px; height: 31.28px; object-fit: contain; opacity:.95; }

.media{
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 0;
  background: #f3f5f6;
}
.media--radius{ border-radius: var(--radius); }
.media--radius8{ border-radius: 8px; }
.media__img,
.media__video{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.media__overlay{
  position:absolute; inset:0;
  pointer-events:none;
}
.media__overlay--bottom{
  background: linear-gradient(180deg, rgba(0,105,135,0) 55%, rgba(0,105,135,.92) 100%);
}

.play{
  position:absolute;
  inset: 0;
  display:grid;
  place-items:center;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.play__icon{
  width: 56px;
  height: 56px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  background: rgba(255,255,255,.86);
  color: rgba(0,0,0,.72);
  font-size: 18px;
}
.play.play--hidden{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

.grid{
  display:grid;
  gap: 12px;
  max-width: var(--content-max);
  margin: 12px auto 0;
}
.grid--2{ grid-template-columns: 1fr; }
.grid--cards{ gap: 12px; }

/* 第三屏：签字区 1:1（343×176）相对定位，可随宽度等比缩放 */
.mayor-media-1to1{
  position: relative;
  width: 100%;
  max-width: var(--mayor-max);
  aspect-ratio: 343 / 176;
  margin: 12px auto 0;
}
.mayor-media-1to1 .media{
  position: absolute;
}
/* 左人物：x=0,y=0,w=169,h=176 */
.mayor-media-1to1__portrait{
  left: 0%;
  top: 0%;
  width: 49.27%;
  height: 100%;
}
/* 右上签字：x=189.675,y=72.214,w=154.48,h=85.113 */
.mayor-media-1to1__sign-a{
  left: 55.30%;
  width: 45.03%;
}
/* 右下署名：x=205.582,y=119.488,w=149.382,h=55.583 */
.mayor-media-1to1__sign-b{
  left: 59.93%;
  width: 43.55%;
}

/* 第三屏：右侧签字/署名需要无圆角 + 透明底 */
.mayor-media-1to1__sign-a{
  border-radius: 0 !important;
  background: transparent !important;
  overflow: visible;
  z-index: 1;
}
.mayor-media-1to1__sign-a .media__img{
  object-fit: contain;
}

/* 调整签名与右下文案的相对布局：签名完整展示，但永不触碰文字区域 */
.mayor-media-1to1__sign-a{
  top: 33%;
  height: 34%;
}
.mayor-media-1to1__sign-b{
  top: 72%;
  height: 26%;
}
.mayor-media-1to1__sign-b{
  position: absolute;
  border-radius: 0 !important;
  background: transparent !important;
  overflow: visible;
  z-index: 2; /* 确保文字永远在签名之上（即使重叠也不遮挡） */
}

.mayor-sign-text{
  width: 100%;
  height: 100%;
  display:flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 6px;
  text-align: right;
}
.mayor-sign-text__name{
  font-family: var(
    --font-sans-site,
    system-ui,
    -apple-system,
    "Segoe UI",
    Roboto,
    "Helvetica Neue",
    Arial,
    sans-serif
  );
  font-weight: 600;
  font-size: 10px;
  letter-spacing: 0.2px;
  color: #1b1b1b;
  line-height: 1.1;
  white-space: nowrap;
}
.mayor-sign-text__title{
  font-family: var(
    --font-sans-site,
    system-ui,
    -apple-system,
    "Segoe UI",
    Roboto,
    "Helvetica Neue",
    Arial,
    sans-serif
  );
  font-weight: 800;
  font-size: 10px;
  letter-spacing: 0.3px;
  color: #1b1b1b;
  line-height: 1.1;
  white-space: nowrap;
}

.card{
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 12px;
}
.contact.card{
  background: rgba(0,152,157,.1);
}
.card--media{ background: transparent; box-shadow:none; padding:0; }

.tabs{
  display:flex;
  gap: 14px;
  align-items:flex-end;
  overflow:auto hidden;
  -webkit-overflow-scrolling: touch;
  padding: 6px 2px 12px;
  margin: 0 auto;
  max-width: var(--content-max);
}
.tab{
  border: 0;
  background: transparent;
  padding: 0 0 8px;
  font-size: 12px;
  color: #5e5d5f;
  border-bottom: 1px solid rgba(94,93,95,.45);
  white-space: nowrap;
  cursor:pointer;
}
.tab.is-active{
  color: var(--c-brand);
  border-bottom-color: var(--c-brand);
}

.carousel{
  max-width: var(--content-max);
  margin: 0 auto;
}
.spotlight{
  border-radius: 20px;
  overflow:hidden;
  box-shadow: var(--shadow);
  background: rgba(0,0,0,.02);
}

/* 第五屏：轮播（carousel，轮播）——主视觉=背景遮罩图+前景完整图 */
.discover-carousel{
  /* 建立容器查询宽度，供 cqw 计算翼边，避免 >500px 后 100% 与可视轨道宽度不一致导致居中/snap 错乱 */
  container-type: inline-size;
  container-name: discover;
  max-width: var(--page-max);
  margin: 0 auto;
  width: 100%;
  min-width: 0;
}
@media screen and (min-width: 1024px){
  .discover-carousel{
    max-width: 100%;
  }
}
.discover-carousel__viewport{
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  width: 100%;
  min-width: 0;
  /* 与轨道 padding 同源；不支持 cqw 时退回 100% */
  scroll-padding-left: max(0px, calc((100% - var(--discover-card-w)) / 2));
  scroll-padding-right: max(0px, calc((100% - var(--discover-card-w)) / 2));
  /* pan-x 会在部分国产浏览器上独占手势，导致轮播区域无法向上滑页面；同时放开纵向 */
  touch-action: pan-x pan-y;
  /* 减少横滑与父级纵向滚动链式（Chrome / 部分国产 WebView） */
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.discover-carousel__viewport::-webkit-scrollbar{ display:none; }
.discover-carousel__track{
  display: flex;
  gap: calc(16px * var(--discover-scale)); /* 贴近设计稿：右侧下一张起点约 339px */
  min-width: 0;
  padding: 0 max(0px, calc((100% - var(--discover-card-w)) / 2));
}
@supports (width: 1cqw){
  .discover-carousel__viewport{
    scroll-padding-left: max(0px, calc((100cqw - var(--discover-card-w)) / 2));
    scroll-padding-right: max(0px, calc((100cqw - var(--discover-card-w)) / 2));
  }
  .discover-carousel__track{
    padding: 0 max(0px, calc((100cqw - var(--discover-card-w)) / 2));
  }
}
@media screen and (min-width: 1024px){
  .discover-carousel__track{
    padding: 0;
  }
}
.discover-slide{
  flex: 0 0 calc(271px * var(--discover-scale)); /* 设计稿卡片宽 */
  scroll-snap-align: center;
  scroll-snap-stop: normal;
  /* 不在 slide 上做 scale：布局宽度与 snap 中心一致，宽屏下不与 transform 错位 */
  opacity: .55;
  transition: opacity 220ms ease;
  /* 与卡片同高，避免多档缩放下相邻列垂直错位 */
  min-height: calc(425px * var(--discover-scale));
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.discover-slide.is-active{
  opacity: 1;
}

.discover-card{
  position: relative;
  width: calc(271px * var(--discover-scale));
  height: calc(425px * var(--discover-scale)); /* 设计稿卡片高 */
  border-radius: 7.406px; /* 设计稿卡片圆角 */
  overflow: hidden;
  box-shadow: var(--shadow);
  background: #dfe7ea;
  transform-origin: center top;
  transition: transform 220ms ease;
}
@media (min-width: 1024px){
  .discover-card{
    transform-origin: center;
  }
}
.discover-slide:not(.is-active) .discover-card{
  transform: scale(0.92);
}
.discover-slide.is-active .discover-card{
  transform: none;
}
.discover-card__bg{
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}
.discover-card__bgmask{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
  transition: background 220ms ease;
}
.discover-slide.is-active .discover-card__bgmask{
  background: rgba(0,0,0,.2);
}

/* 白色内容面板：w=212,h=373，顶部超大圆角约 102.758 */
.discover-panel{
  position: absolute;
  left: calc(30px * var(--discover-scale));  /* (271-212)/2 */
  top: calc(26px * var(--discover-scale));
  width: calc(212px * var(--discover-scale));
  height: calc(373px * var(--discover-scale));
  background: #fff;
  border-radius: calc(103px * var(--discover-scale)) calc(103px * var(--discover-scale)) calc(7px * var(--discover-scale)) calc(7px * var(--discover-scale));
  overflow: hidden;
}
.discover-panel__img{
  position: absolute;
  left: calc(10px * var(--discover-scale));
  top: calc(8px * var(--discover-scale));
  width: calc(192px * var(--discover-scale));
  height: calc(240px * var(--discover-scale));
  border-radius: calc(96px * var(--discover-scale)) calc(96px * var(--discover-scale)) calc(10px * var(--discover-scale)) calc(10px * var(--discover-scale));
  overflow: hidden;
}
.discover-panel__img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.discover-panel__text{
  position: absolute;
  left: calc(16px * var(--discover-scale));
  right: calc(16px * var(--discover-scale));
  top: calc(258px * var(--discover-scale));
}
/* Título do card maior e mais moderno */
.discover-panel__title {
    margin: 0 0 6px 0;
    font-size: clamp(1.1rem, 2vw, 1.2rem); /* Maior e responsivo */
    line-height: 1.2;
    font-weight: 700;
    color: var(--c-text);
}
.discover-panel__sub{
  margin: 4px 0 0;
  font-size: calc(10px * var(--discover-scale));
  line-height: calc(13px * var(--discover-scale));
  color: var(--c-muted-2);
  opacity: .8;
}
.discover-panel__btn{
  position: absolute;
  right: calc(10px * var(--discover-scale));
  bottom: calc(12px * var(--discover-scale));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: calc(6px * var(--discover-scale)) calc(12px * var(--discover-scale));
  border-radius: calc(4px * var(--discover-scale));
  background: var(--c-brand);
  color: #fff;
  font-size: calc(12px * var(--discover-scale));
  line-height: calc(16px * var(--discover-scale));
  text-decoration: none;
}

/* 设计稿无 dots，已移除 */

/* 第五屏：页签在轮播下方（设计稿样式） */
.discover-tabs{
  max-width: var(--page-max);
  margin: 10px auto 0;
  padding: 0 var(--page-safe-inline);
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: clamp(8px, 2.2vw, 16px);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.discover-tabs::-webkit-scrollbar{ display:none; }
.discover-tab{
  appearance: none;
  border: 0;
  background: transparent;
  flex: 0 0 auto;
  padding: calc(10px * var(--discover-scale)) clamp(4px, 1.2vw, 10px) calc(8px * var(--discover-scale));
  font-size: calc(12px * var(--discover-scale));
  line-height: calc(16px * var(--discover-scale));
  color: rgba(94,93,95,.7);
  white-space: nowrap;
  position: relative;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.discover-tab::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: rgba(94,93,95,.35);
}
.discover-tab.is-active{
  color: var(--c-brand);
}
.discover-tab.is-active::after{
  background: var(--c-brand);
  height: 2px;
}

/* 宽屏 Tab：均分剩余空间、文案居中，避免 PC 上挤在一侧 */
@media (min-width: 900px){
  .discover-tabs{
    justify-content: center;
    gap: clamp(12px, 2vw, 28px);
    margin: 0;
    padding: 0;
    max-width: 100%;
  }
  .discover-tab{
    flex: 1 1 0;
    min-width: 0;
    text-align: center;
    font-size: clamp(11px, 0.85vw + 10px, 14px);
  }
}

/* Discover 卡片缩放：多档逻辑宽（360/393/412/428 等）与平板、PC；Itinerary 仍保持 720/1024 两档 */
@media (min-width: 400px){
  :root{ --discover-scale: 1.04; }
}
@media (min-width: 480px){
  :root{ --discover-scale: 1.08; }
}
@media (min-width: 560px){
  :root{ --discover-scale: 1.12; }
}
@media (min-width: 640px){
  :root{ --discover-scale: 1.15; }
}
@media (min-width: 720px){
  :root{
    --discover-scale: 1.18;
    --itinerary-scale: 1.18;
  }
}
@media (min-width: 800px){
  :root{ --discover-scale: 1.21; }
}
@media (min-width: 900px){
  :root{ --discover-scale: 1.24; }
}
@media (min-width: 1024px){
  :root{
    --discover-scale: 1.28;
    --itinerary-scale: 1.28;
  }
}
@media (min-width: 1200px){
  :root{ --discover-scale: 1.3; }
}
@media (min-width: 1440px){
  :root{ --discover-scale: 1.32; }
}

@media (max-width: 390px){
  /* 极窄屏略缩主卡片；非激活态仍保持略小一圈 */
  .discover-slide.is-active .discover-card{ transform: scale(0.98); }
  .discover-slide:not(.is-active) .discover-card{ transform: scale(0.9); }
}
.spotlight__media{ height: 360px; }
.spotlight__mask{
  position:absolute; inset: 14px 14px 70px 14px;
  border-radius: 130px 130px 12px 12px;
  border: 6px solid rgba(255,255,255,.9);
  pointer-events:none;
}
.spotlight__body{
  background:#fff;
  padding: 14px 14px 16px;
}
.h3{
  margin: 0;
  font-size: 14px;
  line-height: 1.3;
}
.h3--sm{ font-size: 13px; }

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 6px;
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 12px;
  text-decoration:none;
  border: 0;
  cursor:pointer;
  user-select:none;
}
.btn--primary{
  background: var(--c-brand);
  color:#fff;
}
.btn--yellow{
  background: var(--c-yellow);
  color:#fff;
  padding: 10px 16px;
  border-radius: 8px;
}
.btn--block{ width: 100%; }

.media-card{
  max-width: var(--content-max);
  margin: 0 auto;
}
.media-card .media{ height: 200px; }
.media-card--video{
  max-width: var(--content-max);
}
@media screen and (min-width: 1024px){
  .media-card--video{
    max-width: 100%;
  }
}
.media-card--video .media{
  height: auto;
}

/* 首页第四屏 Barreirinhas：视频卡严格 343×193；播放后与活动页同为原生 controls */
.media-card.media-card--video .media[data-media-key="cityHighlight"]{
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: none !important;
  height: auto !important;
  aspect-ratio: 343 / 193;
  overflow: hidden;
  border-radius: inherit;
}
.media-card.media-card--video .media[data-media-key="cityHighlight"] .media__video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  /* contain：在 343:193 框内等比缩放 */
  object-fit: contain;
  object-position: center;
  background: #0d0d0d;
  display: block;
}
.media-card.media-card--video .media[data-media-key="cityHighlight"] .play{
  z-index: 3;
}

.itinerary{
  max-width: var(--content-max);
  margin: 0 auto;
  display:flex;
  flex-direction: column;
  gap: 12px;
}

@media screen and (min-width: 1024px){
  .itinerary{
    flex-direction: row;
    gap: 30px;
  }
}

/* 下一屏：Itinerary 1:1（左图120×180，右侧文本与按钮对齐） */
.section--itinerary{
  background: #ffffff; /* 设计稿为白底 */
}
/* 左右安全距离与上文统一：375 宽内左右 16px，内容区 343 对齐 */
.section--itinerary .section__hd,
.section--itinerary .itinerary{
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}
@media screen and (min-width: 1024px){
  .section--itinerary .section__hd,
.section--itinerary .itinerary{
  padding: 0;
  margin: 0;
  margin-bottom: 20px;
  max-width: 100%;
}
}
.section--itinerary .title-with-underline,
.section--itinerary .itinerary-row{
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.itinerary-row{
  display: grid;
  grid-template-columns: calc(120px * var(--itinerary-scale)) 1fr;
  gap: calc(16px * var(--itinerary-scale));
  align-items: start;
  width: 100%;
}
.itinerary-row__thumb{
  position: relative;
  width: calc(120px * var(--itinerary-scale));
  height: calc(180px * var(--itinerary-scale));
  border-radius: calc(4px * var(--itinerary-scale));
  overflow: hidden;
  background: #dfe7ea;
}
.itinerary-row__img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.itinerary-row__badge{
  position: absolute;
  left: 0;
  top: 0;
  max-width: 100%;
  box-sizing: border-box;
  background: rgba(23,36,43,.6);
  color: #fff;
  font-size: calc(10px * var(--itinerary-scale));
  line-height: 1.28;
  padding: calc(4px * var(--itinerary-scale)) calc(6px * var(--itinerary-scale));
  border-radius: calc(4px * var(--itinerary-scale)) 0 calc(4px * var(--itinerary-scale)) 0;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  display: none;
}
/* 窄屏：缩略图更「挤」，角标略小字号与 padding，仍随 --itinerary-scale 放大 */
@media (max-width: 420px){
  .itinerary-row__badge{
    font-size: calc(8.5px * var(--itinerary-scale));
    line-height: 1.25;
    padding: calc(3px * var(--itinerary-scale)) calc(5px * var(--itinerary-scale));
  }
}
@media (max-width: 340px){
  .itinerary-row__badge{
    font-size: calc(7px * var(--itinerary-scale));
    line-height: 1.22;
    padding: calc(2px * var(--itinerary-scale)) calc(4px * var(--itinerary-scale));
  }
}
.itinerary-row__body{
  min-height: calc(180px * var(--itinerary-scale)); /* 与左图等高，保证标题块顶部对齐 */
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0; /* 关键：防止右侧列被内容撑出安全区 */
}
.itinerary-row__content{
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden; /* 关键：内容区有最大高度，避免侵入按钮区域 */
  min-width: 0; /* 关键：允许内部文本/标签正确裁切/滚动 */
}
.itinerary-row__title{
  margin: 0;
  font-size: calc(14px * var(--itinerary-scale));
  line-height: calc(18px * var(--itinerary-scale));
  font-weight: 600;
  color: var(--c-text);
  overflow-wrap: anywhere;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.itinerary-row__chips{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: calc(8px * var(--itinerary-scale));
  row-gap: calc(8px * var(--itinerary-scale));
  margin: calc(8px * var(--itinerary-scale)) 0 calc(10px * var(--itinerary-scale));
  /* 勿依赖横向滚动：父列 .itinerary-row__content 为 overflow:hidden，国产 WebView 内易被裁切；换行可完整展示 */
  max-width: 100%;
  min-width: 0;
}
.itinerary-row__chip{
  border: 1px solid var(--c-brand);
  color: var(--c-brand);
  border-radius: 999px;
  padding: calc(4px * var(--itinerary-scale)) calc(8px * var(--itinerary-scale));
  font-size: calc(10px * var(--itinerary-scale));
  line-height: calc(12px * var(--itinerary-scale));
  background: #fff;
  white-space: nowrap;
  flex: 0 1 auto;
  max-width: 100%;
  box-sizing: border-box;
}
.itinerary-row__desc{
  margin: 0;
  font-size: calc(12px * var(--itinerary-scale));
  line-height: calc(16px * var(--itinerary-scale));
  color: rgba(84,83,84,.8);
  overflow-wrap: anywhere;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.itinerary-row__btn{
  margin-top: auto; /* 关键：按钮永不覆盖文字，不够空间自动下铺 */
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(6px * var(--itinerary-scale));
  padding: calc(6px * var(--itinerary-scale)) calc(12px * var(--itinerary-scale));
  border-radius: calc(4px * var(--itinerary-scale));
  background: var(--c-brand);
  color: #fff;
  font-size: calc(12px * var(--itinerary-scale));
  line-height: calc(16px * var(--itinerary-scale));
  text-decoration: none;
  max-width: 100%;
  white-space: nowrap;
}

.tile{
  background: rgba(0,152,157,.06);
  border-radius: var(--radius);
  padding: 10px;
  display:flex;
  flex-direction: column;
  gap: 8px;
}
.tile__media{ height: 94px; border-radius: 10px; overflow:hidden; }
.tile--cta{ gap: 10px; }

/* Where to stay：标题区勿重复加 gutter（外层 section--pale 与 main.page 已留白） */
.section--stay .section__hd{
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}
@media screen and (min-width: 1024px){
  .section--stay .section__hd{
    margin: 0;
    margin-bottom: 20px;
  }
}

.stay-grid{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(160px, 1fr));
  gap: 8px;
}
.stay-card{
  background: rgba(0,152,157,.06);
  border-radius: 10px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 212px; /* 固定卡片高度基准，避免按钮错行 */
}

/* Where to stay：描述区（标题）高度隔离，按钮固定到底部 */
.section--stay .stay-card .h3{
  margin: 0;
  line-height: 18px;
  max-height: 72px; /* 最多 4 行（18px * 4），不足 4 行不占位 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4; /* <-- CORREÇÃO ADICIONADA */
  overflow: hidden;
}
.section--stay .stay-card .btn{
  margin-top: auto; /* 关键：把按钮推到底部 */
}
.section--stay .stay-btn{
  width: fit-content;
  min-width: 97px; /* 设计稿按钮约 97×24 */
  min-height: 24px;
  height: auto;
  align-self: flex-end; /* 设计稿：按钮靠右 */
  justify-content: center;
  padding: 4px 12px; /* 24px 高度下的精确内边距 */
  border-radius: 3.703px;
  font-size: 12px;
  line-height: 16px;
  white-space: nowrap; /* 与 Learn more 单行一致，避免窄卡内折行撑破布局 */
  box-sizing: border-box;
}
.section--stay .tile__media{
  height: 110px;
  border-radius: 10px;
}

@media (min-width: 720px){
  .stay-grid{
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    max-width: 100%;
  }
  .section--stay .tile__media{
    height: 120px;
  }
}

.qr-block{
  width: 100%;
  background: rgba(0,152,157,.1);
  border-radius: 4px;
  padding: 20px 0;
  min-height: 122px;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
}
.qr{
  width: 100%;
  max-width: var(--layout-col-343);
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: center;
  box-sizing: border-box;
  min-width: 0;
}
/* 二维码固定 82×82，禁止被 flex 子项默认 min-width 挤压变形 */
.qr__code{
  flex: 0 0 82px;
  width: 82px;
  height: 82px;
  min-width: 82px;
  min-height: 82px;
  background: #fff;
}
.qr__code .media__img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.qr__text{
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 189px;
  color: var(--c-brand);
  font-weight: 600;
  font-size: 14px;
  line-height: 18px;
  overflow-wrap: anywhere;
  word-break: break-word;
  box-sizing: border-box;
}

@media (max-width: 374px){
  .qr-block{ padding: 16px 0; }
  .qr{ gap: 14px; }
  .qr__text{
    max-width: 100%;
  }
}

/* 极窄屏：横向放不下时改为上下布局，文案换行，二维码保持清晰尺寸 */
@media (max-width: 309px){
  .qr{
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px;
  }
  .qr__text{
    width: 100%;
    max-width: 100%;
    text-align: center;
    order: 2;
  }
  .qr__code{
    order: 1;
  }
}

.callout{
  width: 100%;
  max-width: var(--layout-col-343);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  background:#fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px 16px;
  display:flex;
  flex-direction: column;
  align-items:center;
  gap: 10px;
}

@media screen and (min-width: 1024px){
  .callout{
    max-width: 90%;
  }

  .callout .muted.center {
    max-width: 400px;
  }
}
.callout-block{
  width: 100%;
  background: linear-gradient(180deg, var(--c-pale), rgba(0,152,157,.02));
  border-radius: var(--radius);
  padding: 22px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
}
.callout .btn--yellow{
  /* 按钮：非整行、居中，避免被其它屏影响 */
  height: 36px;
  padding: 0 18px;
  border-radius: 8px;
}

.section--contact .section__hd{
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 1024px){
  .section--contact .section__hd{
    max-width: 100%;
  }
}
.contact-block{
  width: 100%;
  background: #fff;
  border-radius: 0;
  padding: 22px 0 16px;
  box-sizing: border-box;
}
@media (min-width: 1024px){
  .page-activity-main .contact-block .section__hd, .page-activity-main  .contact-block .contact-wrap, .page-activity-main  .contact-block .social-wrap{
    padding: 0 var(--gutter) 28px;
    max-width: 90%;
  }

  .page-itinerary .contact-block .section__hd, .page-itinerary  .contact-block .contact-wrap, .page-itinerary  .contact-block .social-wrap{
    padding: 0 var(--gutter) 28px;
    max-width: 90%;
  }

  .page-stay .contact-block{
    background: transparent;
  }
}
.contact-wrap{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 0;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 1024px){
  .contact-wrap{
    max-width: 100%;
  }
}
.contact{
  width: 100%;
  max-width: var(--layout-col-343);
  margin-left: auto;
  margin-right: auto;
  position: relative;
  background: rgba(0,152,157,.1);
  border-radius: 10px;
  box-shadow: none;
  padding: 18px 16px 14px;
  display: block;
  box-sizing: border-box;
  overflow: hidden;
}
@media screen and (min-width: 1024px){
  .contact{
    display: flex;
    max-width: 100%;
    padding: 40px 80px;
    overflow: unset;
  }
}
.contact__rows{
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
  /* 窄屏略减小预留，避免右侧大块留白却仍挤文字（Galaxy A 系列 WebView） */
  padding-right: clamp(100px, 30vw, 140px);
}
.contact__row{
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
}
.contact__icon{
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: block;
  flex-shrink: 0;
}
.contact__text{
  flex: 1 1 auto;
  min-width: 0;
  color: #0495a5;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: 0.02em;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.contact__mascot{
  position: absolute;
  right: clamp(8px, 3vw, 14px);
  bottom: 10px;
  width: clamp(108px, 36vw, 140px);
  max-width: calc(100% - 24px);
  aspect-ratio: 132 / 145;
  background: transparent;
  pointer-events: none;
}
@media screen and (min-width: 1024px){
  .contact__mascot{
    position: absolute;
    right: clamp(8px, 8vw, 204px);
    bottom: -60px;
    width: clamp(108px, 36vw, 240px);
    max-width: 215px;
    aspect-ratio: 132 / 145;
    background: transparent;
    pointer-events: none;
  }
}
.contact__mascot .media__img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
/* Figma Group 2121238776：社媒条仅上方一条分隔线，底部无下划线 */
/* 社媒区整体下边距：Figma Frame 2121238764（MCP 不可读稿时默认 24px，请按稿内标注替换） */
.social-wrap{
  width: 100%;
  max-width: min(var(--page-max), 100%);
  margin: 12px auto 0;
  padding: 12px 0 24px;
  border-top: 1px solid rgba(4,149,165,.25);
  border-bottom: 0;
  box-sizing: border-box;
  overflow-x: hidden;
}

.social-wrap.pc {
  display: none;
}

@media screen and (min-width: 1024px){
  .social-wrap{
    display: none;
  }

  .social-wrap.pc {
    display: block;
    width: 40%;
    max-width: min(var(--page-max), 100%);
    margin: 12px auto 0;
    padding: 12px 0 24px;
    border-left: 1px solid rgba(4, 149, 165, .25);
    border-top: 0;
    border-bottom: 0;
    box-sizing: border-box;
    overflow-x: hidden;
  }

  .social-wrap.pc .social {
    display: flex;
    flex-direction: column;
  }
}
/* HarmonyOS 内置浏览器：flex 行内对 button 子项尺寸易算错；社媒固定 5 枚，用 5 列栅格比 auto-fill 更稳 */
.social{
  display: grid;
  grid-template-columns: repeat(5, 40px);
  gap: 14px;
  justify-content: center;
  align-items: center;
  width: max-content;
  max-width: 100%;
  margin: 0 auto;
  margin-left: 36px;
  padding: 0;
  box-sizing: border-box;
}
.social__btn{
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  max-width: 40px;
  max-height: 40px;
  aspect-ratio: 1 / 1;
  flex: 0 0 40px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  /* 脱离 flex：img 绝对定位居中，避免华为 WebView 在 button 内压缩可替换元素 */
  display: block;
  position: relative;
  overflow: hidden;
  line-height: 0;
  font-size: 0;
  -webkit-appearance: none;
  appearance: none;
}
.social__btn img{
  position: absolute;
  left: 50%;
  top: 50%;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  margin-left: -20px;
  margin-top: -20px;
  display: block;
  max-width: none;
  max-height: none;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
}
.social__btn--wechat{
  background: #0495a5;
}
.social__btn--wechat img{
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  margin-left: -12px;
  margin-top: -12px;
  padding: 0;
  max-width: none;
  max-height: none;
  box-sizing: content-box;
  filter: brightness(0) invert(1);
}

/* 微信：Figma Group 2121238528（与分享弹窗同构）；底栏分隔见 Group 2121238776 → .social-wrap */
body.wechat-modal-open,
body.share-modal-open{
  overflow: hidden;
}
.wechat-modal{
  position: fixed;
  inset: 0;
  z-index: 100;
  visibility: hidden;
  pointer-events: none;
}
.wechat-modal.is-open{
  visibility: visible;
  pointer-events: auto;
}
.wechat-modal__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  transition: opacity 0.25s ease;
  cursor: pointer;
}
.wechat-modal.is-open .wechat-modal__backdrop{
  opacity: 1;
}
.wechat-modal__dialog-layer{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: max(20px, env(safe-area-inset-top)) 18px max(24px, env(safe-area-inset-bottom));
  pointer-events: none;
}
.wechat-modal__card{
  position: relative; /* 吐司层相对整张白卡居中；同 Group 2121238528 */
  width: min(318px, calc(100vw - 32px));
  background: #fff;
  border-radius: 16px;
  padding: 12px;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.16);
  transform: scale(0.96) translateY(10px);
  opacity: 0;
  transition: opacity 0.26s ease, transform 0.26s cubic-bezier(0.2, 0.85, 0.2, 1);
}
.wechat-modal.is-open .wechat-modal__card{
  transform: scale(1) translateY(0);
  opacity: 1;
}
.wechat-modal__sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
/* 微信弹窗主体与分享弹窗同布局（Figma Group 2121238528），sheet/吐司等见下方与 .share-modal 合并选择器 */

/* ---------- Where to Stay 子页（Hotel details，对齐 Figma 138:5213） ---------- */
body.page-stay{
  background: rgba(0, 152, 157, 0.05);
}

/* 子页顶栏：Figma Frame 2121238760 → Group 2121238800 → Group 10（返回） */
.topbar--sub .topbar__inner--sub{
  display: grid;
  grid-template-columns: 40px 1fr auto;
  align-items: center;
  gap: 8px;
}
.topbar--sub .topbar__back{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  margin: 0;
  flex-shrink: 0;
  border-radius: 999px;
  overflow: hidden;
  color: var(--c-text);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.topbar--sub .topbar__back:focus-visible{
  outline: 2px solid var(--c-brand);
  outline-offset: 2px;
}
.topbar--sub .topbar__back:active{
  opacity: 0.88;
}
.topbar--sub .topbar__back img{
  width: 36px;
  height: 36px;
  display: block;
  pointer-events: none;
}
.topbar__page-title{
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.03em;
  color: var(--c-text);
  text-align: left;
  justify-self: start;
  max-width: 220px;
  line-height: 1.2;
}
.page--stay-main{
  max-width: var(--page-max);
  margin: 0 auto;
  /* 顶栏已有返回，不再叠面包屑；保留与首屏标题的垂直间距 */
  padding: 12px var(--gutter) 32px;
}
@media screen and (min-width: 1024px){
  .page-stay .page--stay-main{
    padding: 0;
    max-width: 100%;
  }
}
.stay-lead{
  text-align: center;
  padding: 8px 0 20px;
  max-width: 720px;
  margin: 0 auto;
}
.stay-lead .title-with-underline{
  align-items: center;
}
.stay-lead .h2{
  font-size: 20px;
  line-height: 1.35;
  text-wrap: balance;
}
.hotel-list{
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 720px;
  margin: 0 auto 28px;
}
@media screen and (min-width: 1024px){
  .hotel-list{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
    max-width: unset;
    margin: 0 auto 28px;
    margin: unset;
  }
}
.hotel-card{
  background: #fff;
  border-radius: 8px;
  padding: 10px 10px 14px;
  box-shadow: var(--shadow);
}
@media screen and (min-width: 1024px){
  .hotel-card{
    width: calc(33.33% - 16px);
  }
}
.hotel-card__media{
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}
.hotel-card__viewport{
  position: relative;
  height: 181px;
  overflow: hidden;
  border-radius: 8px;
  background: #e8ecec;
}
/* 住宿子页：横向划动轮播时减少整页跟手滚动/回弹，与 stay-page.js 的 is-dragging 配合消抖 */
.page-stay .hotel-card__viewport{
  touch-action: pan-y;
  overscroll-behavior-x: contain;
}
.hotel-card__viewport.is-dragging .hotel-card__track{
  transition: none;
}
/* Resorts 子页：轮播可视区域按设计稿 1938×1080 比例随宽度等比缩放（aspect-ratio，宽高比） */
.page-stay-resorts .hotel-card__viewport{
  height: auto;
  aspect-ratio: 1938 / 1080;
  min-height: 0;
}
.hotel-card__track{
  display: flex;
  height: 100%;
  backface-visibility: hidden;
  transition: transform 0.28s cubic-bezier(0.2, 0.85, 0.2, 1);
}
.hotel-card__slide{
  flex-shrink: 0;
  height: 100%;
}
.hotel-card__slide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.hotel-card__dots{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  row-gap: 6px;
  padding: 0 8px;
  box-sizing: border-box;
  pointer-events: auto;
}
.hotel-card__dot{
  width: 5px;
  height: 5px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.45);
  cursor: pointer;
}
.hotel-card__dot.is-active{
  width: 16px;
  height: 4px;
  border-radius: 100px;
  background: #fff;
}
.hotel-card__title{
  margin: 12px 6px 6px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--c-text);
}
.hotel-card__desc{
  margin: 0 6px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--c-muted-2);
  opacity: 0.9;
}
/* 品牌黄底；图标为 Figma 导出全彩 SVG（Group 2121238526 / 8731），勿加 invert 否则会变纯白在浅底上不可见 */
.fab--accent .fab__btn{
  background: var(--c-yellow);
  box-shadow: 0 10px 22px rgba(243, 152, 29, 0.45);
}

/* 分享弹窗：Figma Group 2121238528；吐司 Frame 2121239225 → .share-modal__toast */
.share-modal{
  position: fixed;
  inset: 0;
  z-index: 100;
  visibility: hidden;
  pointer-events: none;
}
.share-modal.is-open{
  visibility: visible;
  pointer-events: auto;
}
.share-modal__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  transition: opacity 0.25s ease;
  cursor: pointer;
}
.share-modal.is-open .share-modal__backdrop{
  opacity: 1;
}
.share-modal__dialog-layer{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: max(20px, env(safe-area-inset-top)) 18px max(24px, env(safe-area-inset-bottom));
  pointer-events: none;
}
.share-modal__card,
.share-modal__close-fab,
.wechat-modal__card,
.wechat-modal__close-fab{
  pointer-events: auto;
}
.share-modal__card{
  position: relative; /* 吐司层相对整张白卡几何居中 */
  width: min(318px, calc(100vw - 32px));
  background: #fff;
  border-radius: 16px;
  padding: 12px;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.16);
  transform: scale(0.96) translateY(10px);
  opacity: 0;
  transition: opacity 0.26s ease, transform 0.26s cubic-bezier(0.2, 0.85, 0.2, 1);
}
.share-modal.is-open .share-modal__card{
  transform: scale(1) translateY(0);
  opacity: 1;
}
.share-modal__sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
/* 吐司盖住整张卡片居中（Figma Frame 2121239225）；分享 / 微信弹窗共用 */
.share-modal__toast-layer,
.wechat-modal__toast-layer{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 25;
}
.share-modal__inner,
.wechat-modal__inner{
  background: transparent;
  border-radius: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
/* 浅底 sheet + 上区渐变（稿内 Group 2121238528 外层）；微信弹窗同构 */
.share-modal__sheet,
.wechat-modal__sheet{
  background: #ebf7f8;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.share-modal__upper,
.wechat-modal__upper{
  background: linear-gradient(180deg, rgba(0, 152, 157, 0.26) 0%, rgba(235, 247, 248, 0.9) 52%, #ffffff 100%);
  padding: 14px 12px 10px;
}
.share-modal__hero,
.wechat-modal__hero{
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: center;
  gap: 12px;
}
/* 抠图-10 (1) 1：稿内约 84×107 */
.share-modal__mascot,
.wechat-modal__mascot{
  flex: 0 0 auto;
  width: 84px;
  height: 107px;
  align-self: flex-end;
}
.share-modal__mascot img,
.wechat-modal__mascot img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 100%;
}
.share-modal__qr-block,
.wechat-modal__qr-block{
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.share-modal__toast,
.wechat-modal__toast{
  position: relative;
  left: auto;
  top: auto;
  z-index: 2;
  transform: scale(0.96);
  padding: 8px 20px;
  border-radius: 8px;
  background: #006987;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.03em;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
  text-align: center;
  min-width: 88px;
}
.share-modal__toast.is-visible,
.wechat-modal__toast.is-visible{
  opacity: 1;
  transform: scale(1);
}
.share-modal__qr-frame,
.wechat-modal__qr-frame{
  position: relative;
  width: 96px;
  height: 96px;
  flex-shrink: 0;
  background: #fff;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.share-modal__qr-corner,
.wechat-modal__qr-corner{
  position: absolute;
  width: 15px;
  height: 15px;
  z-index: 2;
  pointer-events: none;
}
.share-modal__qr-corner img,
.wechat-modal__qr-corner img{
  width: 100%;
  height: 100%;
  display: block;
}
.share-modal__qr-corner--tl,
.wechat-modal__qr-corner--tl{
  top: 3px;
  left: 3px;
}
.share-modal__qr-corner--tr,
.wechat-modal__qr-corner--tr{
  top: 3px;
  right: 3px;
  transform: rotate(90deg);
}
.share-modal__qr-corner--bl,
.wechat-modal__qr-corner--bl{
  bottom: 3px;
  left: 3px;
  transform: rotate(-90deg);
}
.share-modal__qr-corner--br,
.wechat-modal__qr-corner--br{
  bottom: 3px;
  right: 3px;
  transform: rotate(180deg);
}
.share-modal__qr-img,
.wechat-modal__qr-img{
  position: relative;
  z-index: 1;
  width: 82px;
  height: 82px;
  object-fit: cover;
  display: block;
  border-radius: 2px;
}
.share-modal__qr-logo,
.wechat-modal__qr-logo{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  display: none;
}
.share-modal__qr-logo img,
.wechat-modal__qr-logo img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.share-modal__copydeck,
.wechat-modal__copydeck{
  margin: 0;
  width: 100%;
  text-align: center;
  font-size: 11px;
  line-height: 1.35;
  color: #0495a5;
  white-space: pre-line;
}
.share-modal__rule,
.wechat-modal__rule{
  height: 1px;
  margin: 8px 10px 0;
  flex-shrink: 0;
  background: rgba(4, 149, 165, 0.18);
}
.share-modal__copy,
.wechat-modal__copy{
  width: 100%;
  border: 0;
  background: transparent;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 10px 8px 12px;
  color: #0495a5;
  border-radius: 0;
}
.share-modal__copy:focus-visible,
.wechat-modal__copy:focus-visible{
  outline: 2px solid #0495a5;
  outline-offset: 2px;
}
.share-modal__copy-icon,
.wechat-modal__copy-icon{
  display: flex;
  align-items: center;
  justify-content: center;
}
/* 分享：Group 2121239224「链接 (1) 1」；微信：同组「复制 (1) 1」→ wechat-modal-copy-g2121239224.svg */
.share-modal__copy-icon img,
.wechat-modal__copy-icon img{
  width: 24px;
  height: 24px;
  display: block;
}
.share-modal__copy-label,
.wechat-modal__copy-label{
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.share-modal__close-fab,
.wechat-modal__close-fab{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 0;
  padding: 0;
  background: #0495a5;
  color: #111;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
  transform: translateY(6px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.26s ease 0.04s, transform 0.26s cubic-bezier(0.2, 0.85, 0.2, 1) 0.04s;
}
.share-modal.is-open .share-modal__close-fab,
.wechat-modal.is-open .wechat-modal__close-fab{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.share-modal__close-fab:focus-visible,
.wechat-modal__close-fab:focus-visible{
  outline: 2px solid #fff;
  outline-offset: 3px;
}

/* 全局 FAB：Figma Group 2121238782；上 Group 2121238526（分享）、下 Group 2121238731（回顶） */
.fab{
  position: fixed;
  right: max(12px, var(--page-safe-inline));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 60;
  display: grid;
  grid-auto-rows: 44px;
  row-gap: 10px;
  justify-items: center;
  width: 44px;
  max-width: 44px;
  box-sizing: border-box;
}
@media screen and (min-width: 1024px){
  .fab{
    bottom: 36%;
  }
}
.fab__btn{
  box-sizing: border-box;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  max-width: 44px;
  max-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: 0 10px 22px rgba(0,0,0,.14);
  overflow: hidden;
  cursor: pointer;
  display: block;
  position: relative;
  line-height: 0;
  font-size: 0;
  -webkit-appearance: none;
  appearance: none;
}
.fab__btn img{
  position: absolute;
  left: 50%;
  top: 50%;
  width: 26px;
  height: 26px;
  margin-left: -13px;
  margin-top: -13px;
  display: block;
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}

@media (min-width: 720px){
  :root{ --content-max: 720px; }
  .grid--2{ grid-template-columns: 1fr 1fr; }
  .media-card .media{ height: 260px; }
  .spotlight__media{ height: 420px; }
  .itinerary__item{ grid-template-columns: 180px 1fr; }
  .tile__media{ height: 120px; }
  /* Contact us 按设计稿仍保持卡片 343 居中，不做两列重排 */
}

/* 第三屏：人物+签字永远左右布局（不再锁死 375px 宽） */

@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* =========================
   下一屏：Sazonality 1:1 矫正
   ========================= */
.section--sazonality .section__hd{
  max-width: var(--page-max);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}

/* How to arrive：自检修复（对齐标题样式 + 1024 自适应 + 安全边距） */
.section--arrive .section__hd{
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}
@media screen and (min-width: 1024px){
.section--arrive .section__hd {
  padding: 0;
  margin: 0;
  margin-bottom: 20px;
}
}
.arrive-inner{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
@media screen and (min-width: 1024px){
  .arrive-inner{
    padding: 0;
    margin: 0;
    max-width: 100%;
  }
  }
.arrive-copy{
  max-width: 720px;
  margin: 0 auto 12px;
}

@media screen and (min-width: 1024px){
  .arrive-copy{
    margin: unset;
    margin-bottom: 24px;
  }
}
.arrive-map{
  aspect-ratio: 375 / 211;
  border-radius: 0;
}
.season-grid{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 0;
  display: grid;
  gap: 8px;
  width: 100%;
  min-width: 0; /* 窄屏下避免子轨道 min-content 撑破父级，造成整段左偏、右侧假留白 */
  /* 勿用 minmax(167px,1fr)：两列最小约 350px，<300px 视口必溢出；大屏仍由 max-width 与 gap 控宽 */
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.season-card{
  background: rgba(0,152,157,.06);
  border-radius: 10px;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
  min-width: 0; /* 与 minmax(0,1fr) 配合，允许列在极窄屏下收缩 */
}
.season-card--short{ min-height: 211px; }
.season-card--tall{ min-height: 231px; }
.season-card__media{
  width: 100%;
  aspect-ratio: 151 / 85; /* 设计稿图片窗比例 */
  height: auto;
  border-radius: 10px;
  overflow: hidden;
  background: #dfe7ea;
}
.season-card__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.season-card__title{
  margin: 0;
  font-size: 14px;
  line-height: 18px;
  font-weight: 600;
  color: var(--c-text);
}
.season-card__desc{
  margin: 0;
  font-size: 12px;
  line-height: 16px;
  color: var(--c-muted);
}

@media (min-width: 1024px){
  .section--sazonality .section__hd{
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
  .season-grid{
    /* 四列大屏：用 0 作下限，避免 4×180+gap 在 720px 附近横向溢出 */
    grid-template-columns: repeat(4, minmax(0, 1fr));
    max-width: 100%;
  }
  .season-card--short,
  .season-card--tall{
    min-height: 231px;
  }
}

/* ---------- Activity Details（Figma「Activity Deails」138:4455，与 Homepage 媒体/顶栏规范一致） ---------- */
body.page-activity main.page.page-activity-main{
  padding-left: 0;
  padding-right: 0;
  max-width: 100%;
  width: 100%;
}
body.page-activity .page--stay-main{
  padding-left: var(--gutter);
  padding-right: var(--gutter);
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
}
/* ---------- Itinerary Page（Figma Itinerary Page / 行程详情页 138:5781，首屏轮播复用 activity-p1 样式） ---------- */
body.page-itinerary main.page.page-itinerary-main{
  padding-left: 0;
  padding-right: 0;
  max-width: 100%;
  width: 100%;
}
body.page-itinerary .page--stay-main{
  padding-left: var(--gutter);
  padding-right: var(--gutter);
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
}
/* 行程首屏副标题（独立标题块内） */
.activity-p1 .itinerary-p1__sub{
  margin: 8px 0 0;
  max-width: 343px;
  font-size: 12px;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.92);
}

/*
 * Itinerary 首屏：
 * - Travel Itinerary：独立深青块（与行程详情页稿一致，同 Activity 首屏标题区色系）；
 * - 主视频区 375×211；
 * - 轮播单格 68:38；底条 Group 2121239291。
 */
body.page-itinerary [data-itinerary-p1].activity-p1{
  background: #042a30;
}
body.page-itinerary [data-itinerary-p1] .activity-p1__stage{
  aspect-ratio: 375 / 211;
}
/* 与 .activity-p1__head 同源：不透明白字下的实色深青渐变块 */
body.page-itinerary [data-itinerary-p1] .itinerary-p1__hero-head{
  flex-shrink: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 18px 16px 16px;
  background: linear-gradient(180deg, #007f8f 0%, #00687a 38%, #005f70 100%);
  border-bottom: 1px solid rgba(0, 40, 48, 0.35);
}
body.page-itinerary [data-itinerary-p1] .itinerary-p1__hero-head .activity-p1__head-inner{
  max-width: var(--page-max);
  margin: 0 auto;
}
body.page-itinerary [data-itinerary-p1] .itinerary-p1__hero-head .activity-p1__title{
  text-shadow: 0 1px 3px rgba(0, 20, 28, 0.25);
}
/* 外层 138:5816：375×70，blur 20px + rgba(22,163,178,0.54) */
body.page-itinerary [data-itinerary-p1] .activity-p1__rail{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  box-sizing: border-box;
  margin: 0;
  margin-left: 0;
  margin-right: 0;
  width: 100%;
  max-width: none;
  min-height: 70px;
  padding: 8px 16px calc(8px + env(safe-area-inset-bottom, 0px));
  gap: 0;
  border-radius: 0;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(22, 163, 178, 0.54);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
@media screen and (min-width: 1024px){
  body.page-itinerary [data-itinerary-p1] .activity-p1__rail{
    width: 90%;
    bottom: 20px;
    background: unset;
    backdrop-filter: unset;
  }
}
/* 内层 138:5818：343×54 单条磨砂，左右 Icon + 中间缩略图同在一框内 */
body.page-itinerary [data-itinerary-p1] .itinerary-p1__rail-strip{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  box-sizing: border-box;
  width: 100%;
  min-height: 54px;
  padding: 6px 8px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
body.page-itinerary [data-itinerary-p1] .activity-p1__thumb-scroll{
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  padding: 0;
  margin: 0;
  gap: 6px;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  /* 多项缩略图：单格宽度 = 可视区 1/4（减 gap），一屏完整展示 4 个 case；其余横向滑动 */
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  border-radius: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
/* 138:5847 / 5848：24px Icon、opacity 0.7，衬在磨砂条上无单独圆底 */
body.page-itinerary [data-itinerary-p1] .activity-p1__chev{
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #fff;
  opacity: 0.7;
  font-size: 16px;
  font-weight: 400;
  text-shadow: none;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.48);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 3px rgba(0, 50, 60, 0.12);
  color: rgba(6, 72, 82, 0.9);
  font-size: 16px;
  line-height: 1;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: none;
}
body.page-itinerary [data-itinerary-p1] .activity-p1__chev:active{
  opacity: 1;
}
/* 单格比例 68:38；宽度按滚动可视区均分 4 份（gap 6px×3），与高保真「一屏四个」一致 */
body.page-itinerary [data-itinerary-p1] .activity-p1__thumb{
  position: relative;
  box-sizing: border-box;
  flex: 0 0 calc((100% - 18px) / 4);
  width: calc((100% - 18px) / 4);
  min-width: calc((100% - 18px) / 4);
  max-width: calc((100% - 18px) / 4);
  aspect-ratio: 68 / 38;
  height: auto;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 3px;
  background: transparent;
  overflow: hidden;
  box-shadow: none;
}
body.page-itinerary [data-itinerary-p1] .activity-p1__thumb.is-active{
  border-color: #fff;
}

/* 行程摘要：Figma Group 2121238604（138:5864） */
.itinerary-catch{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 18px var(--gutter) 12px;
  box-sizing: border-box;
}
.itinerary-catch__title{
  margin: 0;
  max-width: 343px;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: 0.4px;
  color: var(--c-brand);
}
.itinerary-catch__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 12px;
}
.itinerary-catch__chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 6px;
  border-radius: 100px;
  border: 1px solid var(--c-brand);
  background: transparent;
  /* 稿中标签字色 #0495a5，与主标题品牌绿区分 */
  color: #0495a5;
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  letter-spacing: -0.2px;
}

/* Travel brief：全宽浅底；标题靠左；正文与主框架一致随 --page-max + gutter + safe-area 撑开 */
.itinerary-brief{
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 24px 0;
  box-sizing: border-box;
  /* 138:5872 Rectangle：#00989d、opacity 5% */
  background: rgba(0, 152, 157, 0.05);
}
.itinerary-brief__title,
.itinerary-brief__text{
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--page-safe-inline);
  padding-right: var(--page-safe-inline);
  width: 100%;
  box-sizing: border-box;
}
.itinerary-brief__title{
  margin-top: 0;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  color: var(--c-brand);
  text-align: start;
}
.itinerary-brief__text{
  margin: 0 auto;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #545354;
  text-align: start;
}

/* Day 标题 + 主题行 */
.itinerary-days{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 8px var(--gutter) 32px;
  box-sizing: border-box;
}
/* 区块标题：Figma 138:5875 */
.itinerary-days__section-title{
  margin: 0 0 12px;
  max-width: 343px;
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  color: var(--c-brand);
}
.itinerary-day{
  margin-top: 20px;
}
.itinerary-day:first-of-type{
  margin-top: 12px;
}
.itinerary-day__row{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
/* DAY 徽章：Figma Group 2121238807 日历矢量作底，文案可编辑、色同稿 #f3981d */
.itinerary-day__badge{
  position: relative;
  flex-shrink: 0;
  width: 40px;
  min-width: 40px;
  height: 34px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 2px;
}
.itinerary-day__badge::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url("https://dcexa.yangwang.tech/barreirinhas/common/assets/itinerary-day-badge-calendar.svg") no-repeat center;
  background-size: contain;
  pointer-events: none;
}
.itinerary-day__badge-label{
  position: relative;
  z-index: 1;
  font-size: 12px;
  font-weight: 600;
  line-height: 10px;
  letter-spacing: -0.24px;
  white-space: nowrap;
  color: var(--c-yellow);
  text-align: center;
  top: 5px;
}
/* Day 主题行：Figma 138:5880，color-7 */
.itinerary-day__theme{
  margin: 4px 0 0;
  flex: 1;
  min-width: 0;
  max-width: 290px;
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
  color: #9397a0;
}

/* 时间轴：22px 槽轴线居中；虚线 2+2、#9397A0；首点 Group 2121238728，其余 Group 2121238652 */
.itinerary-timeline{
  --itinerary-axis: 11px;
  position: relative;
  margin: 4px 0 0;
  padding: 0 0 0 22px;
  list-style: none;
}
/* 多条时不用整段 ol 轴线（易在首末「出头」）；改由相邻节点间分段虚线，假定各行卡片高度一致（min-height 78） */
.itinerary-timeline::before{
  display: none;
}
.itinerary-spot{
  --itinerary-spot-gap: 10px;
  position: relative;
  margin-bottom: var(--itinerary-spot-gap);
}
.itinerary-timeline:not(:has(> .itinerary-spot:only-of-type)) > .itinerary-spot:not(:last-child)::after{
  content: "";
  position: absolute;
  left: calc(var(--itinerary-axis) - 22px);
  top: calc(50% + 7px);
  transform: translateX(-50%);
  width: 1px;
  height: calc(100% + var(--itinerary-spot-gap) - 14px);
  z-index: 0;
  background: repeating-linear-gradient(
    to bottom,
    #9397a0 0,
    #9397a0 2px,
    transparent 2px,
    transparent 4px
  );
  pointer-events: none;
}
.itinerary-spot:last-child{
  margin-bottom: 0;
}
.itinerary-spot__dot{
  position: absolute;
  /* 与轴线对齐：轴线在 ol 内 x=11px，li 自 padding 后起点 x=22px，14px 圆中心需在 11px */
  left: calc(var(--itinerary-axis) - 7px - 22px);
  top: 50%;
  transform: translateY(-50%);
  width: 14px;
  height: 14px;
  z-index: 1;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  box-shadow: none;
  pointer-events: none;
}
.itinerary-timeline > .itinerary-spot:first-child .itinerary-spot__dot{
  background-image: url("https://dcexa.yangwang.tech/barreirinhas/common/assets/itinerary-timeline-node.svg");
}
.itinerary-timeline > .itinerary-spot:not(:first-child) .itinerary-spot__dot{
  background-image: url("https://dcexa.yangwang.tech/barreirinhas/common/assets/itinerary-timeline-node-secondary.svg");
}

/*
 * 行程卡片：
 * - Figma Group 2121238729（138:5886）：单条 + 三层圆角底（内部 Group 2121238727：#e6f5f5 / #cceaeb / #b3e0e2）；
 * - 当日 ≥2 条：Group 2121238739，仅 #e6f5f5、无下层色带。
 * DAY1 单卡使用 .itinerary-card--g2121238729；其它天仅 1 条时 :only-of-type 仍会自动叠底。
 */
.itinerary-card{
  position: relative;
  z-index: 0;
  margin-left: 0;
  padding: 12px 14px 12px 77px;
  min-height: 78px;
  border-radius: 8px;
  box-sizing: border-box;
  background: #e6f5f5;
  border: 0;
  box-shadow: none;
}
.itinerary-card--g2121238729,
.itinerary-timeline > .itinerary-spot:only-of-type .itinerary-card{
  box-shadow:
    0 4px 0 -2px #cceaeb,
    0 9px 0 -4px #b3e0e2;
}
.itinerary-card__thumb{
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 49px;
  height: 49px;
  border-radius: 8px;
  overflow: hidden;
  background: #cceaeb;
}
.itinerary-card__thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.itinerary-card__title{
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
  color: #545354;
}
.itinerary-card__desc{
  margin: 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  color: #9397a0;
}

/* Want to go further?：标题色同 Day 1 to day 3；正文灰；视频区同 main.js data-media-play */
.itinerary-extra{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 16px var(--gutter) 8px;
  box-sizing: border-box;
}
.itinerary-extra__title{
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  color: var(--c-brand);
}
.itinerary-extra__lead{
  margin: 0 0 12px;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  color: #545354;
}
.itinerary-extra__media{
  position: relative;
  width: 100%;
  aspect-ratio: 343 / 193;
  border-radius: 12px;
  overflow: hidden;
  background: #0d3d45;
}
.itinerary-extra__media-inner{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.itinerary-extra__media .media__img,
.itinerary-extra__media .media__video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.itinerary-extra__media .play{
  z-index: 2;
}
.itinerary-tip{
  max-width: var(--page-max);
  margin: 16px auto 0;
  padding: 0 var(--gutter) 20px;
  box-sizing: border-box;
}
.itinerary-tip__head{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
/* Figma Group 2121238747 →「注意 1」24×24（与 2121238573 标题行配套） */
.itinerary-tip__icon{
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  display: block;
  object-fit: contain;
}
/* Figma 138:5985：Gilroy Semibold 20 / 28，品牌绿 */
.itinerary-tip__title{
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  color: var(--c-brand);
}
/* Figma Union 气泡：浅底 + 弱描边；正文 138:6091：14 / 18，#545354 */
.itinerary-tip__bubble{
  position: relative;
  padding: 14px 16px 16px;
  border-radius: 12px;
  background: rgba(0, 152, 157, 0.08);
  border: 1px solid rgba(0, 152, 157, 0.2);
}
.itinerary-tip__bubble::before{
  content: "";
  position: absolute;
  left: 100px;
  top: -8px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid rgba(0, 152, 157, 0.08);
  display: none;
}
.itinerary-tip__text{
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
  color: #545354;
}

.activity-sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* 首屏：大标题（青底 + Lençóis 下黄波浪线）+ 主视频 + 底部缩略条与左右箭头 */
.activity-p1{
  display: flex;
  flex-direction: column;
  width: 100%;
  background: linear-gradient(180deg, #007f8f 0%, #00687a 42%, #005f70 100%);
}
@media screen and (min-width: 1024px){
  .activity-p1{
    position: relative;
  }
}
.activity-p1__head{
  flex-shrink: 0;
  padding: 18px 16px 16px;
  background: linear-gradient(180deg, rgba(0, 120, 135, 0.95) 0%, rgba(0, 105, 125, 0.35) 100%);
}
.activity-p1__head-inner{
  max-width: var(--page-max);
  margin: 0 auto;
}
.activity-p1__title{
  margin: 0;
  font-size: clamp(17px, 4.6vw, 20px);
  font-weight: 600;
  line-height: 1.35;
  color: #fff;
  letter-spacing: -0.02em;
  text-shadow: 0 2px 14px rgba(0, 40, 50, 0.35);
}
.activity-p1__title-mark{
  position: relative;
  display: inline-block;
  vertical-align: baseline;
}
.activity-p1__title-word{
  display: inline-block;
}
.activity-p1__title-wave{
  position: absolute;
  left: 0;
  bottom: -10px;
  width: min(112px, 100%);
  height: auto;
  max-height: 14px;
  object-fit: contain;
  object-position: left center;
  pointer-events: none;
}
.activity-p1__title-tail{
  white-space: normal;
}

/* 主视频区：与首页 Hero 一致 375×211（aspect-ratio） */
.activity-p1__stage{
  position: relative;
  width: 100%;
  flex-shrink: 0;
  aspect-ratio: 375 / 211;
  background: #0a1012;
}
.activity-p1__slide{
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.22s ease, visibility 0.22s ease;
  z-index: 0;
}
.activity-p1__slide.is-active{
  opacity: 1;
  visibility: visible;
  z-index: 2;
}
.activity-p1__media{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.activity-p1__media .media__img,
.activity-p1__media .media__video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.activity-p1__media .play{
  z-index: 4;
}
.activity-p1__hud{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
  padding: 0 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 5;
  pointer-events: none;
}
.activity-p1__hud-btn{
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.22);
  color: #fff;
  cursor: pointer;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.45));
}
.activity-p1__hud-btn:focus-visible{
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.activity-p1__rail{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 10px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  padding: 8px 6px;
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
  width: calc(100% - 28px);
  background: rgba(186, 228, 236, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 14px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
@media screen and (min-width: 1024px){
  .activity-p1__rail{
    position: absolute;
    bottom: 0;
    left: 5%;
    z-index: 2;
  }
}
.activity-p1__chev{
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  /* 浅色轨道上的圆形衬底，圈住箭头（与稿 Icon 外圈一致） */
  background: rgba(255, 255, 255, 0.48);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 1px 3px rgba(0, 50, 60, 0.12);
  color: rgba(6, 72, 82, 0.9);
  font-size: 16px;
  line-height: 1;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: none;
}
.activity-p1__chev:active{
  background: rgba(255, 255, 255, 0.62);
}
.activity-p1__chev:focus-visible{
  outline: 2px solid #fff;
  outline-offset: 2px;
}
/* 缩略条：四项等分铺满可用宽度，单格比例与主视频一致 375:211，画面 cover 撑满格内 */
.activity-p1__thumb-scroll{
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 2px 0;
}
.activity-p1__thumb{
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  aspect-ratio: 375 / 211;
  padding: 0;
  border-radius: 8px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  overflow: hidden;
  cursor: pointer;
  background: #0d3d45;
}
.activity-p1__thumb.is-active{
  border-color: #fff;
  border-width: 3px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35);
}
.activity-p1__thumb img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.activity-p1__thumb-play{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.activity-p1__thumb-play__ico{
  width: clamp(16px, 5vw, 24px);
  height: clamp(16px, 5vw, 24px);
  border-radius: 999px;
  border: 2px solid rgba(255, 255, 255, 0.92);
  background: rgba(0, 0, 0, 0.28);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
  font-size: clamp(7px, 2.2vw, 9px);
  line-height: clamp(16px, 5vw, 24px);
  text-align: center;
  color: #fff;
  padding-left: 2px;
  box-sizing: border-box;
}

.activity-intro{
  padding: 16px 0 12px;
}
.activity-intro__eyebrow{
  margin: 10px 0 0;
  font-size: 12px;
  color: var(--c-muted-2);
}
.activity-intro__lead{
  margin: 12px 0 0;
  font-size: 13px;
  line-height: 1.55;
  color: var(--c-text);
}
/* Must-visit spots：模块头 + 主内容区竖版视频（宽撑满至 720px 封顶，高度随宽等比；悬浮文案 + 底部箭头） */
.activity-must{
  width: 100%;
}
.activity-must__intro{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 8px var(--gutter) 16px;
}
.activity-must__sub{
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--c-muted);
}
.activity-must__screens{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  background: #fff;
}
/* 宽 min(100%, 720px) 居中，>720 左右留白；高由 aspect-ratio 随宽度等比（与竖版素材 375:720 / 原视频一致） */
.activity-must__screen{
  position: relative;
  box-sizing: border-box;
  width: min(100%, 720px);
  margin-inline: auto;
  aspect-ratio: 375 / 720;
  height: auto;
  background: #fff;
}
@media screen and (min-width: 1024px){
  .activity-must__screen{
    width: 100%;
    aspect-ratio: 16 / 9;
  }
}
.activity-must__media{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
  overflow: hidden;
  background: #fff;
  box-sizing: border-box;
}
/* 视频铺满容器，保持比例，超出部分裁剪 */
.activity-must__media .media__video{
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
/* 海报图片同样铺满容器 */
.activity-must__media .media__video::poster{
  object-fit: cover;
}
/* 降级模式：静态图片铺满容器 */
.activity-must__static-img{
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.activity-must__media .media__overlay{
  z-index: 1;
  pointer-events: none;
}
/* 渐变只铺底部，避免盖住 contain 留白区域 */
.activity-must__media .media__overlay.media__overlay--bottom{
  inset: auto 0 0 0;
  top: auto;
  height: 52%;
  background: linear-gradient(180deg, rgba(0, 105, 135, 0) 0%, rgba(0, 105, 135, 0.82) 55%, rgba(0, 105, 135, 0.92) 100%);
}
.activity-must__float{
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 56px;
  z-index: 3;
  color: #fff;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}
@media screen and (min-width: 1024px){
  .activity-must__float{
    text-align: center;
  }
}
.activity-must__float-title{
  margin: 0 0 6px;
  font-size: clamp(17px, 4.5vw, 20px);
  font-weight: 700;
  line-height: 1.25;
}
.activity-must__float-sub{
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.94);
}
/* 底部引导：Figma Group 2121238592 导出 PNG，整体透明度闪烁 */
.activity-must__arrow{
  position: absolute;
  left: 50%;
  bottom: max(10px, env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  z-index: 4;
  width: auto;
  min-width: 44px;
  min-height: 44px;
  padding: 6px 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: default;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
}
.activity-must__arrow:focus-visible{
  outline: 2px solid rgba(255, 255, 255, 0.9);
  outline-offset: 4px;
}
.activity-must__arrow-wrap{
  display: block;
  width: 28px;
  height: 32px;
  animation: activity-must-hint-blink 1.15s ease-in-out infinite;
  will-change: opacity;
}
.activity-must__arrow-img{
  display: block;
  width: 28px;
  height: 32px;
  object-fit: contain;
  pointer-events: none;
}
/* Must visit：微信等禁止自动播时的中央手动播放（自动播成功则保持隐藏） */
.activity-must__playbtn{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 6;
  width: 56px;
  height: 56px;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.48);
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
  -webkit-tap-highlight-color: transparent;
}
.activity-must__playbtn.is-show{
  opacity: 1;
  pointer-events: auto;
}
.activity-must__playbtn:focus-visible{
  outline: 2px solid rgba(255, 255, 255, 0.95);
  outline-offset: 3px;
}
.activity-must__playbtn-ico{
  display: block;
  margin-left: 3px;
  font-size: 22px;
  line-height: 1;
}
@keyframes activity-must-hint-blink{
  0%,
  100%{
    opacity: 0.38;
  }
  50%{
    opacity: 1;
  }
}

/* Figma Group 2121238762：双列 166:167 + 错落；文案展开态 Group 2121239293（品牌青底 + 箭头上翻） */
/* ================= ACTIVITY MOSAIC (DISPLAY: CONTENTS SOLUTION) ================= */
.activity-mosaic {
    width: 100%;
    max-width: var(--page-max);
    margin-left: auto;
    margin-right: auto;
    padding: 18px var(--gutter) 28px;
    background: #fff;
    box-sizing: border-box;
}
@media screen and (min-width: 1024px){
    .activity-mosaic {
        margin-top: 40px;
        margin-bottom: 40px;
    }
}
.activity-mosaic__inner {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}
.activity-mosaic__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px; /* Espaço uniforme entre todos os cards */
    width: 100%;
}
/* ========== A MÁGICA: Ignora as divs das colunas ========== */
.activity-mosaic__col {
    display: contents !important;
}

/* ========== DESKTOP (4 COLUNAS) ========== */
@media screen and (min-width: 1024px) {
    .activity-mosaic__card {
        width: calc(25% - 9px) !important; /* 4 cards perfeitamente alinhados */
        max-width: calc(25% - 9px) !important;
        margin-bottom: 0 !important;
        align-self: stretch !important;
    }
    .activity-mosaic__card--wide {
        width: 100% !important; /* O card largo ocupa a linha inteira */
        max-width: 100% !important;
    }
}
/* ========== TABLET (2 COLUNAS) ========== */
@media screen and (min-width: 481px) and (max-width: 1023px) {
    .activity-mosaic__card {
        width: calc(50% - 6px) !important;
        max-width: calc(50% - 6px) !important;
        align-self: stretch !important;
        margin-bottom: 0 !important;
    }
    .activity-mosaic__card--wide {
        width: 100% !important;
        max-width: 100% !important;
    }
}
/* ========== MOBILE (1 COLUNA) ========== */
@media screen and (max-width: 480px) {
    .activity-mosaic__card {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 12px !important;
    }
}
/* 防止部分 WebView 中 display:flex 等作者样式盖掉 [hidden] 的默认隐藏 */
.activity-mosaic [hidden]{
  display: none !important;
}
.activity-mosaic__col{
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 1.5vw, 12px);
  min-width: 0;
}
@media screen and (min-width: 1024px){
  .activity-mosaic__col{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.activity-mosaic__col--l{
  flex: 166 1 0;
}
.activity-mosaic__col--r{
  flex: 167 1 0;
}
.activity-mosaic__card{
  position: relative;
  width: 100%;
  margin: 0;
  border-radius: 8px;
  overflow: hidden;
  background: #e8f4f6;
}
@media screen and (min-width: 1024px){
  .activity-mosaic__card{
    width: 48%;
  }
}
.activity-mosaic__card--r166x210{
  aspect-ratio: 166 / 210;
}
.activity-mosaic__card--r166x260{
  aspect-ratio: 166 / 260;
}
.activity-mosaic__card--sq166{
  aspect-ratio: 1 / 1;
}
.activity-mosaic__card--r167x260{
  aspect-ratio: 167 / 260;
}
.activity-mosaic__card--sq167{
  aspect-ratio: 1 / 1;
}
.activity-mosaic__card--r167x210{
  aspect-ratio: 167 / 210;
}
.activity-mosaic__card--wide{
  margin-top: clamp(8px, 1.5vw, 12px);
  width: 100%;
  aspect-ratio: 343 / 193;
}
.activity-mosaic__media{
  position: absolute;
  inset: 0;
  border-radius: inherit;
  overflow: hidden;
}
.activity-mosaic__img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.activity-mosaic__shade{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 52%;
  pointer-events: none;
  z-index: 0;
  transition: height 0.22s ease, top 0.22s ease, background 0.22s ease;
  background: linear-gradient(
    180deg,
    rgba(0, 152, 157, 0) 0%,
    rgba(0, 152, 157, 0.55) 55%,
    rgba(0, 152, 157, 0.82) 100%
  );
}
.activity-mosaic__shade--wide{
  height: 58%;
}
/* 展开态：Figma Group 2121239293，整卡品牌青底 */
.activity-mosaic__card.is-expanded .activity-mosaic__shade,
.activity-mosaic__card.is-expanded .activity-mosaic__shade--wide{
  top: 0;
  bottom: 0;
  height: 100%;
  background: rgba(0, 152, 157, 0.94);
}
/* 整块文案区可点：默认贴底；展开后铺满卡片内滚动 */
.activity-mosaic__copy{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  z-index: 2;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 10px 36px 10px 8px;
  border: 0;
  appearance: none;
  background: transparent;
  color: #fff;
  font: inherit;
  text-align: left;
  cursor: pointer;
  text-shadow: 0 1px 8px rgba(0, 30, 40, 0.35);
  -webkit-tap-highlight-color: transparent;
  transition: top 0.22s ease, padding 0.22s ease;
}
.activity-mosaic__copy--wide{
  padding: 12px 40px 12px 8px;
}
.activity-mosaic__card.is-expanded .activity-mosaic__copy{
  top: 0;
  padding-top: 12px;
  padding-bottom: 12px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  text-shadow: none;
}
.activity-mosaic__copy:focus-visible{
  outline: 2px solid rgba(255, 255, 255, 0.95);
  outline-offset: 2px;
}
.activity-mosaic__card-title{
  margin: 0 0 4px;
  font-size: clamp(15px, 2.8vw, 18px);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.02em;
  pointer-events: none;
}
.activity-mosaic__card-desc{
  margin: 0;
  font-size: clamp(11px, 2.1vw, 13px);
  line-height: 1.35;
  font-weight: 500;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2; /* <-- CORREÇÃO ADICIONADA */
  overflow: hidden;
  pointer-events: none;
}
.activity-mosaic__card-desc--wide{
  -webkit-line-clamp: 3;
  line-clamp: 3; /* <-- CORREÇÃO ADICIONADA */
}
.activity-mosaic__card.is-expanded .activity-mosaic__card-desc,
.activity-mosaic__card.is-expanded .activity-mosaic__card-desc--wide{
  display: block;
  -webkit-line-clamp: unset;
  line-clamp: unset; /* <-- CORREÇÃO ADICIONADA */
  overflow: visible;
}
.activity-mosaic__card-chev{
  position: absolute;
  right: 8px;
  bottom: 8px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  pointer-events: none;
  transition: transform 0.22s ease, bottom 0.22s ease;
}
.activity-mosaic__card.is-expanded .activity-mosaic__card-chev{
  transform: rotate(180deg);
}
.activity-mosaic__chev-svg{
  display: block;
  width: 20px;
  height: 20px;
}

/* Activity 子页 Sazonality：标题区 + .season-grid 与首页共用样式（见 activity/index.html） */
.activity-season{
  width: 100%;
  background: #fff;
}
.activity-season__inner{
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
  padding: 22px var(--page-safe-inline) 26px;
  box-sizing: border-box;
}
/* 标题区：与首页共用 .section__hd + .title-with-underline */
.activity-season__inner .section__hd{
  margin-bottom: 16px;
}

/* Figma Group 2121238799：rgba(0,152,157,.1) 外壳 + Let's chat 白卡 + 品牌黄按钮 */
.activity-cooperation{
  width: 100%;
  background: #fff;
}
@media screen and (min-width: 1024px){
  .activity-cooperation{
    padding-top: 20px;
  }
}
.activity-cooperation__inner{
  max-width: var(--page-max);
  margin-left: auto;
  margin-right: auto;
  padding: 0 var(--gutter) 28px;
  box-sizing: border-box;
}
.activity-cooperation__shell{
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  padding: 10px;
  border-radius: 10px;
  background: rgba(0, 152, 157, 0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  box-sizing: border-box;
}
@media screen and (min-width: 1024px){
  .activity-cooperation__shell{
    padding: 40px 80px;
  }
}
.activity-cooperation__panel{
  width: 100%;
  max-width: 323px;
  margin-left: auto;
  margin-right: auto;
  background: #fff;
  box-sizing: border-box;
  border-radius: 10px;
  padding: 16px 16px 14px;
  text-align: center;
}
@media screen and (min-width: 1024px){
  .activity-cooperation__panel{
    max-width: 90%;
  }
  .activity-cooperation__body {
    max-width: 400px;
    margin: 0 auto !important;

  }
}
.activity-cooperation__title{
  margin: 0 0 4px;
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
  color: var(--c-text);
}
.activity-cooperation__wave{
  display: block;
  width: 49px;
  height: auto;
  margin: 0 auto 10px;
  object-fit: contain;
  pointer-events: none;
}
.activity-cooperation__body{
  margin: 0;
  font-size: 12px;
  line-height: 16px;
  color: var(--c-muted-2);
}
.activity-cooperation__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
  padding: 8px 16px;
  border-radius: 4px;
  background: var(--c-yellow);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  text-decoration: none;
  white-space: nowrap;
}
.activity-cooperation__btn:hover{
  filter: brightness(1.05);
}
.activity-cooperation__btn:focus-visible{
  outline: 2px solid var(--c-brand);
  outline-offset: 3px;
}

/* The winds… 区块：浅青底、居中标题、三枚白卡（约 108×158 比例） */
.activity-winds{
  width: 100%;
  background: #f0f8fa;
  border-top: 1px solid rgba(0, 105, 135, 0.1);
  border-bottom: 1px solid rgba(0, 105, 135, 0.08);
}
.activity-winds__inner{
  max-width: var(--page-max);
  margin: 0 auto;
  padding: 22px var(--gutter) 26px;
}
.activity-winds__title{
  margin: 0 0 18px;
  font-size: clamp(16px, 4.2vw, 18px);
  font-weight: 600;
  line-height: 1.45;
  color: var(--c-text);
  text-align: center;
  text-wrap: balance;
}
.activity-winds__mark{
  position: relative;
  display: inline-block;
}
.activity-winds__wave{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -10px;
  width: min(112px, 100%);
  height: auto;
  max-height: 14px;
  object-fit: contain;
  object-position: left center;
  pointer-events: none;
  display: none;
}
.activity-winds__cards{
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 10px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 4px 0 2px;
}
.activity-winds__cards::-webkit-scrollbar{
  display: none;
}
.activity-winds__card{
  flex: 1 1 0;
  min-width: 96px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(0, 60, 80, 0.07);
  padding: 14px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  aspect-ratio: 108 / 158;
  box-sizing: border-box;
}
@media screen and (min-width: 1024px){
  .activity-winds__card{
    aspect-ratio: unset;
    padding: 40px 20px;
  }
}
.activity-winds__card-text{
  margin: 0;
  font-size: clamp(10.5px, 3.1vw, 12px);
  line-height: 1.38;
  font-weight: 600;
  color: var(--c-brand);
}

.page-activity .title-with-underline.title-with-underline--left {
  padding: 0 16px;
}
@media screen and (min-width: 1024px){
  .page-activity .title-with-underline.title-with-underline--left {
    padding: 0;
  }
}
.page-itinerary .title-with-underline.title-with-underline--left {
  padding: 0 16px;
}
@media screen and (min-width: 1024px){
  .page-itinerary .title-with-underline.title-with-underline--left {
    padding: 0;
  }
}

/* ================= SELETOR DE IDIOMAS COM LINKS (MANTENDO ESTRUTURA) ================= */
.lang-toggle {
    border: 1px solid rgba(0,152,157,.6);
    background: rgba(255,255,255,.6);
    border-radius: 999px;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
}
.lang-toggle__item {
    color: var(--c-brand);
    text-decoration: none;
    font-weight: 600;
    transition: opacity 0.2s ease;
}
.lang-toggle__item:hover {
    opacity: 0.7;
}
.lang-toggle__sep {
    color: var(--c-brand);
    font-weight: 600;
}

/* ================= CORREÇÃO DO PULO DO CARROSSEL ================= */
/* Bloqueia o snap durante o carregamento para impedir o pulo da página */
.discover-carousel__viewport {
    scroll-snap-type: unset !important;
}

/* Quando o usuário clicar, o JS vai adicionar a classe 'loaded' e liberar o snap */
.discover-carousel__viewport.snap-loaded {
    scroll-snap-type: x mandatory !important;
}

/* ================= BARRA DE ROLAGEM PERSONALIZADA ================= */
/* Funciona no Chrome, Edge, Safari e navegadores baseados em WebKit */
body::-webkit-scrollbar {
    width: 5px;
}

body::-webkit-scrollbar-track {
    background: #006987;
}

body::-webkit-scrollbar-thumb {
    background: #F3981D;
    border-radius: 3px;
}

/* Para Firefox (opcional, mas recomendado para compatibilidade total) */
html {
    scrollbar-width: thin;
    scrollbar-color: #F3981D;
}

/* ================= MODERNIZAÇÃO DO CARROSSEL ================= */
.discover-card {
    transition: transform 0.4s cubic-bezier(0.2, 0.85, 0.2, 1), box-shadow 0.4s ease;
    cursor: pointer;
}

/* Efeito de elevação do card ao passar o mouse 
.discover-slide.is-active .discover-card:hover {
    transform: scale(1.02) translateY(-8px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}*/

/* Zoom suave na imagem dentro do arco */
.discover-panel__img img {
    transition: transform 0.5s cubic-bezier(0.2, 0.85, 0.2, 1);
}

.discover-slide.is-active .discover-card:hover .discover-panel__img img {
    transform: scale(1.08);
}

/* ================= CORREÇÃO DE LARGURA DO CARROSSEL (DESKTOP) ================= */
@media screen and (min-width: 1024px) {
    
    /* 1. Faz o carrossel ocupar a largura inteira da tela (ignorando o limite da página) */
    .discover-carousel {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* 2. Remove o padding lateral do track para que os cards possam se centralizar */
    .discover-carousel__track {
        padding: 0 !important;
        /* 3. Centraliza os cards perfeitamente no meio da tela */
        justify-content: space-evenly !important;
    }

    /* 4. Remove o scroll-padding que atrapalha o encaixe centralizado no desktop */
    .discover-carousel__viewport {
        scroll-padding-left: 0 !important;
        scroll-padding-right: 0 !important;
    }
}

/* ================= TRANSIÇÃO SUAVE ENTRE PÁGINAS (VIEW TRANSITIONS) ================= */
@view-transition {
    navigation: auto;
}

/* Define a animação de entrada e saída como um Fade suave */
::view-transition-old(root) {
    animation: 0.25s ease-in both fade-out;
}
::view-transition-new(root) {
    animation: 0.25s ease-in both fade-in;
}

/* As animações em si */
@keyframes fade-out {
    from { opacity: 1; }
    to { opacity: 0; }
}
@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* Ajuste para caso o usuário esteja no modo "reduzir movimento" */
@media (prefers-reduced-motion: reduce) {
    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation: none !important;
    }
}

/* ================= RODAPÉ DA POLÍTICA DE PRIVACIDADE ================= */
.site-footer {
    width: 100%;
    background: #ffffff;
    padding: 20px 0 40px;
    margin-top: 10px;
    border-top: 1px solid rgba(0, 152, 157, 0.1);
    text-align: center;
}
.site-footer__inner {
    max-width: var(--page-max);
    margin: 0 auto;
    padding: 0 var(--page-safe-inline);
    box-sizing: border-box;
}
.site-footer__link {
    color: var(--c-brand);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: opacity 0.2s ease;
    letter-spacing: 0.3px;
}
.site-footer__link:hover {
    opacity: 0.7;
    text-decoration: underline;
}