/* ═══════════════════════════════════════
   移动端优先 — MOBILE FIRST FRAMEWORK
═══════════════════════════════════════ */

/* 汉堡菜单 */
.mobile-nav-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  cursor: pointer;
  border: none;
  background: transparent;
  padding: 0;
  position: relative;
  z-index: 101;
}

.mobile-nav-toggle span {
  display: block;
  width: 24px;
  height: 2px;
  background: currentColor;
  margin: 5px 0;
  transition: all .3s ease;
  border-radius: 1px;
}

.mobile-menu {
  display: none;
  position: fixed;
  top: 44px;
  left: 0;
  right: 0;
  background: rgba(8, 15, 10, .95);
  backdrop-filter: blur(10px);
  flex-direction: column;
  z-index: 99;
  max-height: calc(100vh - 44px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.mobile-menu.show {
  display: flex;
}

.mobile-menu a {
  padding: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  color: #fff;
  text-decoration: none;
  min-height: 44px;
  display: flex;
  align-items: center;
  font-size: 15px;
  transition: background .3s ease;
}

.mobile-menu a:active {
  background: rgba(255, 255, 255, .1);
}

/* 返回顶部按钮 */
.back-to-top {
  position: fixed;
  bottom: 90px;
  right: clamp(16px, 3vw, 20px);
  width: clamp(48px, 7vw, 56px);
  height: clamp(48px, 7vw, 56px);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: #2b6045;
  color: #fff;
  border: none;
  font-size: clamp(18px, 4vw, 22px);
  opacity: 0;
  visibility: hidden;
  transition: all .3s ease;
  z-index: 1000;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
}

.back-to-top.show {
  opacity: 1;
  visibility: visible;
}

.back-to-top:active {
  transform: scale(.9);
}

/* 电话链接优化 */
a[href^="tel:"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  min-width: 44px;
  padding: 10px 14px;
}

/* 平板及以上隐藏汉堡菜单 */
@media (min-width: 768px) {
  .mobile-nav-toggle {
    display: none !important;
  }
  
  .mobile-menu {
    display: none !important;
  }
}

/* ═══════════════════════════════════════
   移动端容器优化 — 最大宽度 + 内边距
═══════════════════════════════════════ */
@media (max-width: 767px) {
  /* 所有main容器添加内边距 */
  main > section {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  
  /* 导航优化 */
  #nav {
    padding: 12px 16px;
    gap: 12px;
  }

  .nav-links {
    display: none;
  }

  /* 手机端天气显示在导航栏右侧 */
  .nav-weather {
    display: flex;
    font-size: 11px;
    padding: 6px 10px;
    gap: 4px;
  }
  .weather-icon {
    font-size: 12px;
  }
  
  /* 英雄区优化 */
  .hero {
    padding: 32px 16px;
  }
  
  .h-hero {
    font-size: clamp(28px, 8vw, 42px);
  }
  
  /* 所有卡片容器添加内边距 */
  .pool-gallery,
  .garden-grid,
  .outdoor-row1,
  .outdoor-row2,
  .rooms-grid-4,
  .ext-row3 {
    padding: 0 16px !important;
    margin-left: -16px !important;
    margin-right: -16px !important;
  }
  
  /* 调整gap为统一的16px */
  .pool-gallery,
  .garden-grid,
  .outdoor-row1,
  .outdoor-row2,
  .rooms-grid-4,
  .ext-row3 {
    gap: 16px;
  }
  
  /* 优化CTA部分 */
  #cta-sec {
    padding: 48px 16px;
  }
  
  .cta-phone-block {
    text-align: center;
  }
  
  .cta-btns {
    flex-direction: column;
  }
  
  .cta-btns .btn {
    width: 100%;
  }
  
  /* Footer优化 */
  footer {
    padding: 40px 16px 20px;
  }
}

/* ═══════════════════════════════════════
   TOKENS  v7 — Design Refresh
═══════════════════════════════════════ */
:root {
  /* ── 色彩系统 ── */
  --ink:        #080f0a;           /* 更纯粹的深墨绿黑 */
  --forest:     #142e1e;
  --moss:       #2b6045;
  --sage:       #4e8f67;
  --gold:       #b8923c;
  --gold-lt:    #d4b378;           /* #cfa95a → #d4b378，提升金色可读性 on 浅米色背景 */
  --gold-pale:  #e8d5a3;           /* 极淡金，用于文字高光 */
  --gold-dim:   rgba(184,146,60,.14);
  --gold-glow:  rgba(184,146,60,.22);
  --sand:       #f6f2e9;
  --warm:       #eee9de;
  --white:      #ffffff;
  --off-white:  #faf9f5;           /* 稍暖的白，替代纯白背景段落 */

  /* ── 文字色阶 */
  --t900: #0d1a10;
  --t700: #2a3d2e;
  --t600: #2d3f32;                /* #3a4d3d → #2d3f32，加深提升对比 */
  --t500: #3a4d3d;                /* 新增中等灰色 */
  --t400: #5a6d5f;                /* #667a6a → #5a6d5f，加深整体 */
  --t200: #a2b3a6;
  --t100: #cdd8cf;

  /* ── 字号 — 响应式优化 ── */
  --fs-xs:   clamp(10px, 2vw, 11px);
  --fs-sm:   clamp(12px, 2.5vw, 13px);
  --fs-base: clamp(14px, 3vw, 15.5px);    /* 正文响应式 */
  --fs-md:   clamp(15px, 3.5vw, 17px);
  --fs-xl:   clamp(22px, 4vw, 42px);      /* 小屏优化 */
  --fs-2xl:  clamp(28px, 6vw, 56px);      /* 标题响应式，最大改为 56px 提升克制 */
  --fs-hero: clamp(42px, 10vw, 100px);    /* 英雄区：最大 100px，较之前 120px 更克制 */

  /* ── 布局 ── */
  --gap:   24px;
  --sec:   120px;
  --wrap:  1340px;
  --pad:   68px;
  --r:     12px;
  --r-lg:  24px;
  --ease:  cubic-bezier(.22,1,.36,1);   /* 弹性缓动 */
  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-smooth: cubic-bezier(.4,0,.2,1);  /* 平滑缓动 */
  --ease-bounce: cubic-bezier(.68,.55,.265,1.55);  /* 弹跳感 */
  --dur:   .48s;
  --dur-fast: .32s;
  --dur-slow: .72s;
}

/* 超宽屏 1920px+ 特殊处理 */
@media (min-width: 1920px) {
  :root {
    --fs-hero: clamp(42px, 8vw, 100px);  /* 加强克制，limit 到 100px */
    --fs-2xl: clamp(28px, 4vw, 56px);
  }
  
  .h-hero {
    letter-spacing: 0.01em;              /* 加大字间，空间感更足 */
    line-height: 1.12;                   /* 多行时呼吸感 */
  }
  
  .h-sec {
    max-width: 800px;                    /* 限制标题宽度，避免过宽 */
    margin: 0 auto;
  }
  
  /* PC 导航优化 */
  .nav-links {
    display: flex;
    gap: 24px;
  }
  
  .nav-links a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 8px 12px;
    border-radius: 6px;
    transition: background var(--dur), color var(--dur);
  }
  
  .nav-links a:hover {
    background: rgba(0, 0, 0, 0.04);
  }
  
  .nav-zh {
    font-size: 13px;
    font-weight: 500;
    color: var(--t900);
  }
  
  .nav-en {
    font-size: 10px;
    color: rgba(0, 0, 0, 0.5);
    letter-spacing: 0.05em;
    text-transform: uppercase;
  }
  
  /* 隐藏汉堡菜单 */
  .nav-menu-btn {
    display: none !important;
  }

  /* PC端天气组件 */
  .nav-weather {
    margin-left: 16px;
  }
}

/* PC 段落行宽优化 */
@media (min-width: 1024px) {
  .body-copy {
    max-width: 680px;        /* 段落最大宽度，提升可读性 */
    line-height: 2.0;        /* 2.2 → 2.0，长行时避免过松散 */
    font-size: clamp(14px, 1.1vw, 16px);
  }
  
  .intro-copy .body-copy {
    max-width: 520px;
  }
}

/* ═══════════════════════════════════════
   RESET
═══════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Noto Serif SC','PingFang SC',serif;color:var(--t900);background:var(--off-white);overflow-x:hidden;line-height:1.8;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{display:block;width:100%;height:100%;object-fit:cover}
a{text-decoration:none;color:inherit}
ul{list-style:none}
/* 更精致的滚动条 */
::-webkit-scrollbar{width:2px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--gold);border-radius:2px;opacity:.5}

/* ═══════════════════════════════════════
   TYPE SYSTEM  v9
   Playfair Display  — 大标题，1780s 古典复古，大字号极美
   Cormorant Garamond — 英文标签 + 数字展示，纤细贵气
   Noto Serif SC      — 中文主体，精准
═══════════════════════════════════════ */
.f-display { font-family: 'Playfair Display', Georgia, serif; }
.f-label   { font-family: 'Cormorant Garamond', Georgia, serif; }
.f-body    { font-family: 'Noto Serif SC', serif; }

/* ── Kicker（段落标签）── */
.kicker {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: 'Cormorant Garamond', serif;
  font-size: 11px; letter-spacing: .42em; text-transform: uppercase;
  color: var(--gold);
  font-weight: 500;
  line-height: 1;
  margin-bottom: 0;           /* 间距由父容器 gap 控制 */
}
.kicker::before,.kicker::after {
  content:''; display:inline-block;
  width:18px; height:1px; background:currentColor; flex-shrink:0;
  opacity: .6;
}
.kicker-lt { color: rgba(212,179,120,.82); }  /* 透明度提升，增强对比 */
.kicker-lt::before,.kicker-lt::after { background: rgba(207,169,90,.38); }

/* ── 标题 ── */
.h-hero {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: var(--fs-hero);
  font-weight: 400;
  line-height: 1.05;          /* .98 → 1.05，超大字号的空间感优先 */
  letter-spacing: -.008em;    /* -.02 → -.008em，避免字母贴紧，特别是大小写混合 */
  color: var(--white);
}
.h-hero em { font-style: italic; color: var(--gold-pale); }

.h-sec {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: var(--fs-2xl);
  font-weight: 400;
  line-height: 1.12;          /* 多行标题行距略微放开 */
  letter-spacing: -.012em;    /* -.018→-.012em，kerning 调和，大屏下字母对不会贴得太紧 */
  color: var(--forest);
}
.h-sec-lt { color: var(--white); }

/* ── 中文副标题 ── */
.h-sub-zh {
  font-family: 'Noto Serif SC', serif;
  font-weight: 300;
  font-size: clamp(13.5px, 1.25vw, 18px);
  letter-spacing: .18em;      /* .16→.18em，字间距拉开，副标题呼吸感更足 */
  color: var(--t400);
  margin-top: 0;              /* 由 sec-head gap 控制，避免双重间距 */
  line-height: 1.65;          /* 1.6→1.65，多行副标题不会贴得太紧 */
}
.h-sub-zh-lt { color: rgba(255,255,255,.62); }  /* .42 → .62, 对比度提升至 WCAG AA */

/* ── 正文 ── */
.body-copy {
  font-family: 'Noto Serif SC', serif;
  font-size: var(--fs-base);
  font-weight: 300;
  color: var(--t900);  /* --t500 → --t900，对比度提升 */
  line-height: 2.2;           /* 2.1→2.2，中文衬线特征下视觉密度高，需要略松 */
  letter-spacing: .03em;
}
.body-copy + .body-copy { margin-top: 1.4em; }  /* 1.35→1.4em，段落间呼吸感更足 */
.body-copy-lt { 
  color: rgba(255,255,255,.75);  /* .68 → .75，亮色背景上对比度提升 */
  line-height: 2.2;
}

/* ═══════════════════════════════════════
   LAYOUT
═══════════════════════════════════════ */
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--pad); }
.sec  { padding: var(--sec) 0; }
.sec-warm { background: var(--warm); }
.sec-sand { background: var(--sand); }
.sec-ink  { background: var(--ink); }
.sec-off  { background: var(--off-white); }

.sec-head {
  display: flex; flex-direction: column;
  align-items: center; text-align: center;
  gap: 16px;                  /* 统一用 gap 控制子元素间距，消除散乱 margin */
  margin-bottom: 68px;        /* 64→68px，与整体节奏更和谐，content 周围呼吸感更足 */
}
.sec-head .h-sec { max-width: 580px; }  /* 600→580px，多行标题换行更自然 */
.sec-head .h-sub-zh { max-width: 420px; }  /* 440→420px */
.sec-head .body-copy { max-width: 460px; }  /* 480→460px，段落主体不显得太"拧巴" */

/* 装饰性分隔线（用于某些 section 底部） */
.divider-gold {
  display: block; width: 40px; height: 1px;
  background: linear-gradient(to right, transparent, var(--gold), transparent);
  margin: 0 auto;
}

/* ═══════════════════════════════════════
   ANIMATIONS  v8 — 高级入场与交互
═══════════════════════════════════════ */
.up {
  opacity: 0;
  transform: translateY(24px) scale(.98);
  transition: opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-bounce);
}
.up.show { opacity: 1; transform: none; }
.up.t1{transition-delay:.08s}
.up.t2{transition-delay:.16s}
.up.t3{transition-delay:.24s}
.up.t4{transition-delay:.32s}

/* 图片悬停：增强 3D 深度感 */
.intro-main img,
.intro-pip img,
.am-cell img,
.pool-gallery-item img,
.room-feature-img img,
.room-card-sm-img img,
.garden-cell img,
.od-item img,
.ext-hero img,
.ext-row3-item img {
  transition: transform var(--dur-slow) var(--ease-smooth), filter .6s var(--ease-smooth);
}

/* 卡片悬停增强 — 阴影+发光 */
.rv-card,
.surr-item,
.room-card-sm,
.room-feature {
  will-change: transform, box-shadow, border-color;
}

/* ═══════════════════════════════════════
   MOBILE MENU & NAV OVERLAY
═══════════════════════════════════════ */
.nav-menu-btn {
  display: none;
}

.mobile-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(8,15,10,.98);
  backdrop-filter: blur(20px) saturate(180%);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--dur) var(--ease), visibility var(--dur);
}

.mobile-menu-overlay.active {
  opacity: 1;
  visibility: visible;
}

.mobile-menu {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 280px;
  background: rgba(8,15,10,.95);
  backdrop-filter: blur(15px);
  padding: 80px 40px 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  transform: translateX(100%);
  transition: transform var(--dur) var(--ease-out);
}

.mobile-menu-overlay.active .mobile-menu {
  transform: translateX(0);
}

.mobile-menu-close {
  position: absolute;
  top: 24px;
  right: 24px;
  font-size: 32px;
  color: var(--gold-lt);
  cursor: pointer;
  line-height: 1;
  transition: color var(--dur);
}

.mobile-menu-close:hover {
  color: var(--white);
}

.mobile-menu-item {
  font-family: 'Noto Serif SC', serif;
  font-size: 16px;
  font-weight: 300;
  color: rgba(255,255,255,.7);
  letter-spacing: .12em;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
  transition: color var(--dur);
}

.mobile-menu-item:hover {
  color: var(--gold-lt);
}

.mobile-menu-book {
  margin-top: 20px;
  background: linear-gradient(135deg, var(--gold) 0%, #c9a045 100%);
  color: var(--ink);
  text-align: center;
  padding: 16px;
  border-radius: 50px;
  font-weight: 500;
  letter-spacing: .15em;
  border: none;
}

/* ═══════════════════════════════════════
   NAV  v7
═══════════════════════════════════════ */
#nav {
  position: fixed; inset: 0 0 auto; z-index: 900;
  height: 76px;
  display: flex; align-items: center;
  padding: 0 var(--pad);
  gap: 16px;
  transition: background var(--dur) var(--ease), box-shadow var(--dur) var(--ease), height var(--dur) var(--ease);
}
.nav-brand { flex-shrink: 0; }
.nav-links { flex: 1; justify-content: center; }
.nav-weather { flex-shrink: 0; }
.nav-menu-btn { flex-shrink: 0; }
#nav.solid {
  background: rgba(7,14,9,.97);
  backdrop-filter: blur(28px) saturate(180%);
  box-shadow: 0 1px 0 rgba(255,255,255,.04);
  height: 68px;
}
.nav-brand { display: flex; align-items: center; gap: 13px; }
.nav-seal {
  width: 42px; height: 42px; border-radius: 50%;
  border: 1px solid rgba(184,146,60,.5);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  transition: border-color var(--dur);
}
#nav.solid .nav-seal { border-color: rgba(184,146,60,.7); }
.nav-seal span {
  font-family: 'Noto Serif SC', serif; font-size: 15px; font-weight: 700;
  color: var(--gold-lt);
}
.nav-brand > div:last-child { display: inline-flex; flex-direction: column; align-items: stretch; }
.nav-name-zh {
  font-family: 'Noto Serif SC', serif; font-size: 15px; font-weight: 500;
  color: var(--white); line-height: 1;
  display: flex; justify-content: space-between;
  letter-spacing: .18em;      /* 字间距撑开，品牌感强 */
}
.nav-name-en {
  font-family: 'Cormorant Garamond', serif; font-size: 8.5px; letter-spacing: .36em;
  color: rgba(255,255,255,.26); margin-top: 6px; text-transform: uppercase;
  display: block; white-space: nowrap;
}

.nav-links { display: flex; align-items: center; gap: 4px; }
.nav-links a {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  width: 62px;                /* 固定等宽，所有项对齐 */
  padding: 6px 0;
  color: rgba(255,255,255,.58); position: relative;
  transition: color var(--dur);
  text-decoration: none;
  text-align: center;
}
.nav-links a::after {
  content: ''; position: absolute; bottom: -5px; left: 0; right: 0;
  height: 1px; background: var(--gold-lt);
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--dur) var(--ease);
}
.nav-links a:hover { color: var(--gold-pale); }
.nav-links a:focus { outline: 2px solid var(--gold-lt); outline-offset: 2px; border-radius: 4px; }
.nav-links a:hover::after { transform: scaleX(1); }

.nav-zh {
  font-family: 'Noto Serif SC', serif; font-size: 11px; font-weight: 400;  /* 12.5→11px */
  letter-spacing: .1em; line-height: 1;    /* 字间距微调，横向布局下不过稠 */
}
.nav-en {
  font-family: 'Cormorant Garamond', serif; font-size: 7.2px; letter-spacing: .14em;  /* 6.5→7.2px, .1→.14em */
  text-transform: uppercase; color: rgba(255,255,255,.28); line-height: 1;
  transition: color var(--dur); white-space: nowrap;
}
.nav-links a:hover .nav-en { color: rgba(255,255,255,.5); }

.nav-weather {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  color: rgba(255,255,255,.8);
  font-size: 12px;
  background: rgba(255,255,255,.08);
  border-radius: 20px;
  backdrop-filter: blur(4px);
  transition: background var(--dur);
  margin-left: auto;
  order: 1;
  position: relative;
  cursor: pointer;
}
.nav-weather:hover {
  background: rgba(255,255,255,.15);
}
.weather-icon {
  font-size: 14px;
}
.weather-temp {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
}

/* 天气卡片 */
.weather-card {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 8px;
  width: 300px;
  background: rgba(7,14,9,.98);
  border: 1px solid rgba(184,146,60,.3);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 8px 32px rgba(0,0,0,.3);
  backdrop-filter: blur(12px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all var(--dur) var(--ease);
  z-index: 1000;
}
.weather-card.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.weather-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  margin-bottom: 12px;
}
.weather-location {
  font-size: 13px;
  color: var(--gold-lt);
  font-weight: 500;
}
.weather-close {
  font-size: 20px;
  color: rgba(255,255,255,.6);
  cursor: pointer;
  line-height: 1;
  padding: 4px;
  transition: color var(--dur);
}
.weather-close:hover {
  color: rgba(255,255,255,1);
}
.weather-current {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
}
.weather-current-icon {
  font-size: 32px;
}
.weather-current-temp {
  font-size: 28px;
  font-weight: 600;
  color: var(--gold-lt);
}
.weather-current-desc {
  font-size: 13px;
  color: rgba(255,255,255,.7);
}
.weather-forecast {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.forecast-item {
  text-align: center;
  padding: 8px 4px;
  border-radius: 8px;
  transition: background var(--dur);
}
.forecast-item:hover {
  background: rgba(255,255,255,.05);
}
.forecast-day {
  font-size: 10px;
  color: rgba(255,255,255,.6);
  margin-bottom: 4px;
}
.forecast-icon {
  font-size: 16px;
  margin: 4px 0;
}
.forecast-temp {
  font-size: 11px;
  color: rgba(255,255,255,.9);
  font-weight: 500;
}
.forecast-rain {
  font-size: 9px;
  color: rgba(100,180,255,.8);
  margin-top: 2px;
}

.nav-book {
  border: 1px solid rgba(207,169,90,.5) !important;
  color: var(--gold-lt) !important; padding: 9px 18px;        /* 横向布局，padding 缩小 */
  width: auto !important;     /* 预订按钮不受等宽限制 */
  border-radius: 50px;        /* 完全胶囊形 */
  transition: background var(--dur), color var(--dur), border-color var(--dur) !important;
  flex-direction: row;         /* 改为横向 */
  align-items: center;
  gap: 8px;                   /* 中英文之间的间距 */
  min-width: auto;
  line-height: 1;
}
.nav-book::after { display: none !important; }\n/* 中英文之间的分隔 */\n.nav-book .nav-en::before {\n  content: '·';\n  margin-right: 6px;\n  color: rgba(207,169,90,.4);\n  font-size: 6px;\n}
.nav-book:focus {
  outline: 2px solid var(--gold-lt) !important;
  outline-offset: 2px !important;
}
.nav-book:hover {
  background: var(--gold) !important;
  color: var(--ink) !important;
  border-color: var(--gold) !important;
}
.nav-book:hover .nav-en { color: rgba(11,23,16,.6) !important; }

/* ═══════════════════════════════════════
   BUTTONS  v8 — 增强动画和光泽
═══════════════════════════════════════ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: 50px;
  font-family: 'Noto Serif SC', serif; font-size: 13.5px; font-weight: 400; letter-spacing: .12em;
  transition: all var(--dur) var(--ease-out); cursor: pointer; white-space: nowrap;
  position: relative; overflow: hidden;
  outline: 2px solid transparent;
  outline-offset: 3px;
  min-height: 48px;  /* 移动端触点最小48px高度 */
  touch-action: manipulation;
}
.btn:focus { outline-color: var(--gold-lt); }
.btn::before {
  content: '';
  position: absolute; top: 0; left: -100%; width: 60%; height: 100%;
  background: linear-gradient(to right, transparent, rgba(255,255,255,.22), transparent);
  transform: skewX(-20deg);
  transition: left .6s var(--ease-out);
}
.btn:hover::before { left: 150%; }

.btn-gold {
  background: linear-gradient(135deg, var(--gold) 0%, #c9a045 100%);
  color: var(--ink); padding: 15px 44px;
  box-shadow: 0 6px 28px rgba(184,146,60,.38), 0 1px 0 rgba(255,255,255,.2) inset;
  font-weight: 500;
  letter-spacing: .14em;
  transform: translateZ(0);  /* 强制 GPU 加速 */
  will-change: transform, filter;
  animation: pulse 3s ease-in-out infinite;
}
.btn-gold:hover {
  background: linear-gradient(135deg, #c9a045 0%, var(--gold-lt) 100%);
  transform: translateY(-4px) translateZ(0);
  box-shadow: 0 14px 44px rgba(184,146,60,.52), 0 1px 0 rgba(255,255,255,.3) inset;
  animation: none;
}
.btn-gold:active {
  transform: translateY(-2px) scale(0.98);
  box-shadow: 0 8px 24px rgba(184,146,60,.35), 0 1px 0 rgba(255,255,255,.2) inset;
}
.btn-outline-lt {
  border: 1.2px solid rgba(255,255,255,.4); color: rgba(255,255,255,.85); padding: 14px 38px;
}
.btn-outline-lt:hover {
  border-color: rgba(255,255,255,.85); background: rgba(255,255,255,.12); transform: translateY(-3px);
}
.btn-outline-gold {
  border: 1px solid rgba(184,146,60,.45); color: var(--gold); padding: 14px 38px;
}
.btn-outline-gold:hover { background: var(--gold); color: var(--ink); }

/* ═══════════════════════════════════════
   HERO  v7
═══════════════════════════════════════ */
#hero {
  position: relative; height: 100svh; min-height: 740px;
  display: flex; align-items: flex-end; overflow: hidden;
}
.hero-bg {
  position: absolute; inset: 0;
  background: url('images/villa-overview.jpg') center 45%/cover no-repeat;
  transform: scale(1.03);
  transition: transform 14s ease-out;
  will-change: transform;
}
#hero.loaded .hero-bg { transform: scale(1); }
/* 英雄区背景优化 - 添加渐变遮罩 */
.hero-grad {
  position: absolute; inset: 0;
  background:
    linear-gradient(to top,  rgba(5,11,7,.98) 0%, rgba(5,11,7,.65) 35%, rgba(5,11,7,.25) 65%, rgba(5,11,7,0) 100%),
    linear-gradient(to right, rgba(5,11,7,.5) 0%, rgba(5,11,7,.15) 50%, rgba(5,11,7,0) 85%);
  animation: gradientShift 12s ease-in-out infinite;
}
@keyframes gradientShift {
  0%, 100% { opacity: 1; }
  50% { opacity: 1.05; }
}

/* CTA 按钮脉冲动效 */
@keyframes pulse {
  0%, 100% {
    box-shadow: 0 6px 28px rgba(184,146,60,.38), 0 1px 0 rgba(255,255,255,.2) inset, 0 0 0 0 rgba(184,146,60,.4);
  }
  50% {
    box-shadow: 0 6px 28px rgba(184,146,60,.38), 0 1px 0 rgba(255,255,255,.2) inset, 0 0 0 12px rgba(184,146,60,0);
  }
}

/* ═══════════════════════════════════════
   LAZY LOADING & BLUR-UP EFFECT
═══════════════════════════════════════ */
img {
  will-change: filter;
  transform: translateZ(0);  /* GPU 加速 */
}

img[loading="lazy"] {
  filter: blur(8px);
  transition: filter .6s var(--ease-smooth);
  background: linear-gradient(
    90deg,
    rgba(0,0,0,.05) 0%,
    rgba(0,0,0,.08) 50%,
    rgba(0,0,0,.05) 100%
  );
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}

img[loading="lazy"].loaded,
img.loaded {
  filter: blur(0);
  animation: none;
}

/* 图片加载占位符 */
.img-placeholder {
  position: relative;
  background: rgba(43,96,69,.04);
  overflow: hidden;
}

.img-placeholder::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, 
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.1) 50%,
    rgba(255,255,255,0) 100%);
  animation: shimmer 2s infinite;
}

@keyframes shimmer {
  0% { background-position: 200% 0; transform: translateX(-100%); }
  100% { background-position: -200% 0; transform: translateX(100%); }
}
/* 左下角竖向金线装饰 */
.hero-body {
  position: relative; z-index: 2;
  padding: 0 var(--pad) 96px; width: 100%;
  display: flex; flex-direction: column;
}
.hero-kicker {
  display: flex; align-items: center; gap: 14px; margin-bottom: 28px;
  font-family: 'Cormorant Garamond', serif; font-size: 11px; letter-spacing: .36em;
  color: rgba(255,255,255,.38);
}
.hero-kicker-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--gold); flex-shrink: 0; }

.hero-title-en {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: var(--fs-hero); font-weight: 400; line-height: .98;
  color: var(--white); letter-spacing: -.025em; margin-bottom: 16px;
}
.hero-title-en em { font-style: italic; color: var(--gold-pale); }

.hero-title-zh {
  font-family: 'Noto Serif SC', serif; font-weight: 300;
  font-size: clamp(15px, 1.7vw, 22px); letter-spacing: .3em;
  color: rgba(255,255,255,.38); margin-bottom: 36px;
}
.hero-sub {
  font-family: 'Noto Serif SC', serif; font-size: 13.5px; font-weight: 300;
  color: rgba(255,255,255,.48); letter-spacing: .1em; line-height: 2.2; margin-bottom: 48px;
}
.hero-actions { display: flex; gap: 12px; }

/* stat bar */
.hero-stats {
  position: absolute; right: 0; bottom: 0; z-index: 3;
  display: flex;
  background: rgba(7,14,9,.72);
  backdrop-filter: blur(28px) saturate(180%);
  border-top: 1px solid rgba(255,255,255,.06);
  border-left: 1px solid rgba(255,255,255,.05);
  border-top-left-radius: 16px;
}
.hs-item {
  padding: 22px 28px; border-right: 1px solid rgba(255,255,255,.05);
  text-align: center; min-width: 104px;
}
.hs-item:last-child { border-right: none; }
.hs-num {
  font-family: 'Playfair Display', serif; font-size: 27px; font-weight: 400; line-height: 1;
  color: var(--gold-lt);
  letter-spacing: -.01em;
}
.hs-lbl {
  font-family: 'Cormorant Garamond', serif; font-size: 9.5px; letter-spacing: .22em;
  color: rgba(255,255,255,.3); margin-top: 5px; text-transform: uppercase;
}

/* scroll cue — 停用无限闪烁动画 */
.scroll-cue {
  position: absolute; left: var(--pad); bottom: 38px; z-index: 3;
  display: flex; align-items: center; gap: 12px;
  font-family: 'Cormorant Garamond', serif; font-size: 9.5px; letter-spacing: .3em;
  color: rgba(255,255,255,.22);
}
.scroll-bar {
  width: 1px; height: 42px;
  background: linear-gradient(to bottom, rgba(207,169,90,.65), transparent);
  /* animation: scrl 2.6s ease-in-out infinite; 删除 */
}
@keyframes scrl { 0%,100%{opacity:1} 50%{opacity:.15} }

/* ═══════════════════════════════════════
   PERFORMANCE — prefers-reduced-motion
   低性能设备 + 前庭平衡障碍用户无缝体验
═══════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .scroll-bar { animation:none; opacity:.3; }
  img { transition:none !important; }
  .btn::before { animation:none; left:-100%; }
  .fab::before { animation:none; }
}

/* ═══════════════════════════════════════
   INTRO  v7
═══════════════════════════════════════ */
.intro-grid {
  display: grid; grid-template-columns: 1.05fr 1fr;
  gap: 88px; align-items: center;
}
.intro-imgs { position: relative; padding-bottom: 40px; padding-left: 24px; }
.intro-main {
  aspect-ratio: 4/3; border-radius: var(--r-lg); overflow: hidden;
  box-shadow: 0 32px 80px rgba(0,0,0,.16);
  background: rgba(43,96,69,.04);
  position: relative;
}
.intro-main::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(184,146,60,.08), rgba(184,146,60,.04));
  pointer-events: none;
  z-index: 1;
}
.intro-main img { 
  transition: transform 1.2s var(--ease-smooth), filter .7s var(--ease-smooth);
  position: relative;
  z-index: 0;
}
.intro-imgs:hover .intro-main img { transform: scale(1.06); filter: brightness(1.08) contrast(1.05); }
.intro-pip {
  position: absolute; bottom: -32px; right: -32px; width: 50%;
  aspect-ratio: 16/9; border-radius: var(--r);
  overflow: hidden; border: 4px solid var(--off-white);
  box-shadow: 0 16px 48px rgba(0,0,0,.18);
}
.intro-pip img { transition: transform 1.2s var(--ease-smooth), filter .7s var(--ease-smooth); }
.intro-imgs:hover .intro-pip img { transform: scale(1.08); filter: brightness(1.1); }
.intro-badge {
  position: absolute; top: -20px; left: -20px;
  width: 64px; height: 64px; border-radius: 50%;  /* 80 → 64px */
  background: linear-gradient(135deg, var(--gold) 0%, #c9a045 100%);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  box-shadow: 0 8px 28px rgba(184,146,60,.42); z-index: 3;
}
.intro-badge-num { font-family: 'Cormorant Garamond', serif; font-size: 24px; font-weight: 300; font-style: italic; color: var(--ink); line-height: 1; }  /* 30 → 24px */
.intro-badge-sub { font-size: 9px; letter-spacing: .1em; color: rgba(11,23,16,.55); margin-top: 2px; }

.intro-copy { padding-right: 8px; }
.intro-copy .kicker     { margin-bottom: 20px; }
.intro-copy .h-sec      { margin-bottom: 12px; }
.intro-copy .h-sub-zh   { margin-bottom: 28px; }  /* 副标题到正文距离拉开，层次更清晰 */
.intro-copy .body-copy  { margin-bottom: 0; }      /* 段落间距由 .body-copy + .body-copy 控制 */

.intro-tags {
  display: flex; flex-wrap: wrap;
  gap: 8px;
  margin-top: 32px; padding-top: 28px;
  border-top: 1px solid rgba(43,96,69,.12);
  position: relative;
}
/* 装饰金点 */
.intro-tags::before {
  content: ''; position: absolute; top: -1px; left: 0;
  width: 32px; height: 1px; background: var(--gold); opacity: .6;
}
.tag {
  flex: 1 1 calc(25% - 8px); min-width: 0;
  padding: 12px 8px;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(43,96,69,.18); border-radius: 40px;
  font-family: 'Noto Serif SC', serif; font-size: 12px; font-weight: 400; letter-spacing: .06em;
  color: var(--moss); background: rgba(43,96,69,.03);
  text-align: center; white-space: nowrap;
  transition: border-color var(--dur), background var(--dur), color var(--dur), transform var(--dur);
  cursor: pointer;
  touch-action: manipulation;
}
.tag:hover {
  border-color: var(--gold); background: var(--gold-dim); color: var(--forest);
  transform: translateY(-2px);
}
.tag:active {
  transform: translateY(0) scale(0.98);
}
.intro-tags .tag:nth-child(n+5) { flex: 1 1 calc(20% - 8px); }

/* ═══════════════════════════════════════
   AMENITIES  v7
═══════════════════════════════════════ */
.amenity-grid {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 2px; background: rgba(43,96,69,.08); border-radius: var(--r-lg); overflow: hidden;
}
.am-cell {
  position: relative; aspect-ratio: 4/3;
  overflow: hidden; cursor: pointer; background: var(--ink);
}
.am-cell img { transition: transform .8s var(--ease-smooth), filter .6s var(--ease-smooth); }
.am-cell:hover img { transform: scale(1.09); filter: brightness(1.12) saturate(1.1); }
.am-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(5,12,8,.85) 0%, rgba(5,12,8,.15) 55%, transparent 100%);
  display: flex; align-items: flex-end; padding: 16px 18px;
  opacity: 0; transition: opacity var(--dur);
}
.am-cell:hover .am-overlay { opacity: 1; }
.am-label strong {
  display: block; font-family: 'Noto Serif SC', serif; font-size: 14px; font-weight: 500;
  color: var(--white); letter-spacing: .06em;
}
.am-label span { font-family: 'Cormorant Garamond', serif; font-size: 12px; color: rgba(255,255,255,.55); letter-spacing: .1em; }

/* ═══════════════════════════════════════
   POOL  v7
═══════════════════════════════════════ */
#pool-sec {
  position: relative; height: 90vh; min-height: 640px;
  display: flex; align-items: center; overflow: hidden;
}
.pool-bg {
  position: absolute; inset: 0;
  background: url('images/pool-night.jpg') center 55%/cover no-repeat;
  transform: scale(1.06); transition: transform 14s ease-out;
}
#pool-sec.pop .pool-bg { transform: scale(1); }
.pool-veil {
  position: absolute; inset: 0;
  background:
    linear-gradient(110deg, rgba(4,10,6,.94) 0%, rgba(4,10,6,.6) 42%, rgba(4,10,6,.2) 100%),
    linear-gradient(to top, rgba(4,10,6,.75) 0%, transparent 28%);
}
.pool-inner {
  position: relative; z-index: 2; max-width: 580px;
  padding-bottom: 200px;
}
.pool-inner .kicker-lt   { margin-bottom: 20px; }
.pool-inner .h-sec-lt   { margin-bottom: 10px; }
.pool-inner .h-sub-zh-lt { margin-bottom: 24px; }
.pool-inner .body-copy-lt { margin-bottom: 32px; }
.pool-dots { display: flex; flex-wrap: nowrap; gap: 7px; margin-bottom: 36px; }
.pool-dot {
  padding: 10px 16px;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.15); border-radius: 40px;
  font-family: 'Noto Serif SC', serif; font-size: 11px; letter-spacing: .08em;
  color: rgba(255,255,255,.62); white-space: nowrap;
  background: rgba(255,255,255,.04);
  transition: border-color var(--dur), background var(--dur), transform var(--dur);
  cursor: pointer;
  touch-action: manipulation;
}
.pool-dot:hover { 
  border-color: rgba(207,169,90,.5); 
  background: rgba(207,169,90,.08);
  transform: translateY(-2px);
}
.pool-dot:active {
  transform: translateY(0) scale(0.98);
}

/* 底部全宽3图横条 - 优化响应式 */
.pool-gallery {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 2px; height: clamp(120px, 25vw, 180px);
}
.pool-gallery-item { overflow: hidden; position: relative; background: rgba(43,96,69,.04); }
.pool-gallery-item img { 
  transition: transform .65s var(--ease-smooth), filter .6s var(--ease-smooth);
  height: 100%;
  object-position: center;
}
.pool-gallery-item::after {
  content: ''; position: absolute; inset: 0;
  background: rgba(0,0,0,0);
  transition: background var(--dur);
}
.pool-gallery-item:hover img { transform: scale(1.1); filter: brightness(1.15) contrast(1.08); }
.pool-gallery-item:hover::after { background: rgba(207,169,90,.06); }

/* ═══════════════════════════════════════
   ROOMS  v7
═══════════════════════════════════════ */
.rooms-wrap {
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap);
}
.room-feature {
  border-radius: var(--r-lg); overflow: hidden;
  background: var(--ink);
  box-shadow: 0 12px 40px rgba(0,0,0,.12), 0 1px 3px rgba(0,0,0,.04);
  border: 1px solid rgba(184,146,60,.05);
  transition: all var(--dur) var(--ease-bounce);
}
.room-feature-img { 
  aspect-ratio: 4/3; 
  overflow: hidden;
  background: rgba(43,96,69,.04);
}
.room-feature-img img { 
  transition: transform 1s var(--ease-out);
  object-fit: cover;
  object-position: center;
}
.room-feature:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 60px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.06);
  border-color: rgba(184,146,60,.15);
}
.room-feature:hover .room-feature-img img { transform: scale(1.05) brightness(1.05); }
.room-feature-body { padding: 30px 34px 38px; }
.room-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  background: linear-gradient(135deg, var(--gold) 0%, #c9a045 100%);
  color: var(--ink);
  font-family: 'Cormorant Garamond', serif; font-size: 10px; font-weight: 600; letter-spacing: .2em;
  padding: 8px 16px; border-radius: 20px; margin-bottom: 14px;
  text-transform: uppercase;
  transition: transform var(--dur), box-shadow var(--dur);
  cursor: pointer;
  touch-action: manipulation;
}
.room-badge:hover {
  transform: translateY(-2px);
}
.room-badge:active {
  transform: translateY(0) scale(0.98);
}
.room-title {
  font-family: 'Playfair Display', Georgia, serif; font-size: 22px;
  color: var(--white); letter-spacing: .01em; margin-bottom: 5px; line-height: 1.18;
}
.room-title-zh {
  font-family: 'Noto Serif SC', serif; font-size: 12px; font-weight: 300;
  color: rgba(255,255,255,.34); letter-spacing: .14em; margin-bottom: 16px;
}
.room-desc {
  font-size: 13px; color: rgba(255,255,255,.46); line-height: 1.95; margin-bottom: 20px; font-weight: 300;
  letter-spacing: .04em;
}
.room-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.room-tag {
  background: rgba(255,255,255,.06); color: rgba(255,255,255,.5);
  padding: 6px 14px;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px; font-size: 11px; letter-spacing: .06em;
  border: 1px solid rgba(255,255,255,.06);
  transition: background var(--dur), color var(--dur), transform var(--dur);
  cursor: pointer;
  touch-action: manipulation;
}
.room-feature:hover .room-tag { 
  background: rgba(207,169,90,.1); 
  color: rgba(207,169,90,.8); 
  border-color: rgba(207,169,90,.2);
}
.room-tag:hover {
  transform: translateY(-1px);
}
.room-tag:active {
  transform: translateY(0) scale(0.98);
}

.rooms-grid-4 { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: var(--gap); }
.room-card-sm {
  border-radius: var(--r); overflow: hidden;
  background: var(--ink);
  box-shadow: 0 8px 24px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.03);
  border: 1px solid rgba(184,146,60,.03);
  transition: transform var(--dur) var(--ease-bounce), box-shadow var(--dur) var(--ease-smooth), border-color var(--dur);
}
.room-card-sm:hover { 
  transform: translateY(-6px) scale(1.01);
  box-shadow: 0 16px 40px rgba(0,0,0,.16), 0 2px 6px rgba(0,0,0,.05);
  border-color: rgba(184,146,60,.08);
}
.room-card-sm-img { 
  aspect-ratio: 4/3; 
  overflow: hidden;
  background: rgba(43,96,69,.04);
}
.room-card-sm-img img { 
  transition: transform .8s var(--ease-out);
  object-fit: cover;
}
.room-card-sm:hover .room-card-sm-img img { transform: scale(1.07); }
.room-card-sm-body { padding: 14px 18px 18px; }
.room-card-sm .room-badge { font-size: 9px; padding: 3px 11px; margin-bottom: 7px; }
.room-card-sm .room-title { font-size: 16px; margin-bottom: 4px; }
.room-card-sm .room-title-zh { font-size: 11px; margin-bottom: 6px; }
.room-card-sm .room-desc { font-size: 12px; margin-bottom: 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ═══════════════════════════════════════
   GARDEN LIGHT  v7
═══════════════════════════════════════ */
.garden-grid {
  display: grid; grid-template-columns: repeat(2,1fr);
  gap: 2px; border-radius: var(--r-lg); overflow: hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.08);
}
.garden-cell {
  position: relative; aspect-ratio: 4/3;
  overflow: hidden; background: rgba(43,96,69,.04);
  cursor: pointer;
}
.garden-cell img { transition: transform .9s var(--ease-out); }
.garden-cell:hover img { transform: scale(1.05); }
.garden-cell-cap {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 36px 24px 20px;
  background: linear-gradient(transparent, rgba(4,10,6,.72));
  opacity: 0; transition: opacity var(--dur); pointer-events: none;
}
.garden-cell:hover .garden-cell-cap { opacity: 1; }
.garden-cell-cap span {
  font-family: 'Cormorant Garamond', serif; font-style: italic;
  font-size: 18px; color: rgba(255,255,255,.82); letter-spacing: .1em;
}

/* ═══════════════════════════════════════
   OUTDOOR  v7 — 优化图片布局
═══════════════════════════════════════ */
.outdoor-row1 {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 2px;
  border-radius: var(--r-lg) var(--r-lg) 0 0; overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}
.od-item { 
  position: relative; 
  overflow: hidden;
  background: rgba(43,96,69,.04);
}
.outdoor-row1 .od-item { aspect-ratio: clamp(1, 4/3, 4/3); }
.od-item img { 
  transition: transform .8s var(--ease-out), filter .6s var(--ease-smooth);
  object-fit: cover;
  object-position: center;
}
.od-item:hover img { transform: scale(1.06) brightness(1.05); }
.outdoor-row2 { 
  margin-top: 2px; 
  border-radius: 0 0 var(--r-lg) var(--r-lg); 
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}
.outdoor-row2 .od-item { aspect-ratio: clamp(12/5, 16/6, 16/6); }
.outdoor-row2 .od-item img { object-position: center 35%; }
.od-caption {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 32px 26px 22px;
  background: linear-gradient(transparent, rgba(4,10,6,.76)); pointer-events: none;
}
.od-caption strong {
  display: block; font-family: 'Playfair Display', serif;
  font-size: 16px; color: var(--white); letter-spacing: .05em; margin-bottom: 3px;
}
.od-caption span {
  font-family: 'Cormorant Garamond', serif;
  font-size: 12px; color: rgba(255,255,255,.55); letter-spacing: .1em;
}

/* ═══════════════════════════════════════
   EXTERIOR  v7 — 优化外观展示
═══════════════════════════════════════ */
.ext-hero {
  aspect-ratio: clamp(12/5, 16/6, 16/6);
  border-radius: var(--r-lg) var(--r-lg) 0 0;
  overflow: hidden; 
  position: relative;
  background: rgba(43,96,69,.04);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}
.ext-hero img { 
  object-position: center 40%;
  transition: transform 1s var(--ease-out), filter .6s var(--ease-smooth);
  object-fit: cover;
}
.ext-hero:hover img { transform: scale(1.04) brightness(1.05); }
.ext-hero-label {
  position: absolute; bottom: 28px; left: 32px;
  font-family: 'Cormorant Garamond', serif; font-style: italic;
  font-size: 18px; letter-spacing: .14em; color: rgba(255,255,255,.65);
}
.ext-row3 {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 2px; margin-top: 2px;
  border-radius: 0 0 var(--r-lg) var(--r-lg); 
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}
.ext-row3-item { 
  aspect-ratio: 4/3; 
  position: relative; 
  overflow: hidden;
  background: rgba(43,96,69,.04);
}
.ext-row3-item img { 
  transition: transform .8s var(--ease-out), filter .6s var(--ease-smooth);
  object-fit: cover;
}
.ext-row3-item:hover img { transform: scale(1.06) brightness(1.05); }
.ext-row3-lbl {
  position: absolute; bottom: 18px; left: 20px;
  font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 13px; letter-spacing: .12em;
  color: rgba(255,255,255,.62);
}

/* ═══════════════════════════════════════
   PANORAMA & VIDEO  v7
═══════════════════════════════════════ */

/* 720°全景容器 */
.panorama-wrapper {
  position: relative;
}

.panorama-container {
  width: 100%;
  height: 600px;
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.25), 0 4px 12px rgba(0,0,0,.1);
  background: rgba(0,0,0,.5);
  border: 1px solid rgba(184,146,60,.15);
  position: relative;
  cursor: grab;
}

.panorama-container:active {
  cursor: grabbing;
}

/* Three.js canvas */
.panorama-container canvas {
  width: 100% !important;
  height: 100% !important;
  outline: none;
  display: block;
}

/* 加载指示器 */
.panorama-container::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
  border: 3px solid rgba(184,146,60,.3);
  border-top-color: var(--gold-lt);
  border-radius: 50%;
  animation: panoramaSpin 1s linear infinite;
  z-index: 1;
}

@keyframes panoramaSpin {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

/* 加载完成后隐藏 */
.panorama-container.loaded::before {
  display: none;
}

/* 按钮悬停效果 */
.panorama-controls button:hover,
.panorama-scene-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(184,146,60,.3);
}

/* 活跃场景按钮 */
.panorama-scene-btn.active {
  background: var(--gold-lt) !important;
  color: var(--ink-dk) !important;
  box-shadow: 0 2px 8px rgba(184,146,60,.4);
  transform: translateY(-1px);
}

/* 场景按钮悬停 */
.panorama-scene-btn:hover {
  background: rgba(255,255,255,0.12) !important;
  transform: translateY(-1px);
}

/* 活跃按钮悬停 */
.panorama-scene-btn.active:hover {
  background: var(--gold-lt) !important;
  transform: translateY(-1px);
}

/* 加载中按钮 */
.panorama-scene-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* 场景分组标题 */
.panorama-scenes > div > div:first-child {
  text-transform: uppercase;
  font-weight: 600;
}

/* 移动端响应式优化 */
@media (max-width: 768px) {
  .panorama-scenes {
    max-width: 100% !important;
    margin-top: 12px !important;
  }

  .panorama-scenes > div {
    gap: 5px !important;
  }

  .panorama-scenes button {
    padding: 6px 10px !important;
    font-size: 11px !important;
    border-radius: 12px !important;
  }

  .panorama-scenes button.active {
    padding: 7px 12px !important;
    font-size: 12px !important;
  }

  /* 分隔符在移动端隐藏 */
  .panorama-scenes span {
    display: none;
  }

  /* 小屏幕时换行更频繁 */
  .panorama-scenes > div {
    justify-content: center !important;
  }
}

.panorama-iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.panorama-caption {
  margin-top: 20px;
  text-align: center;
}

/* 视频容器 */
.video-wrapper {
  position: relative;
}

.video-container {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  aspect-ratio: 16/9;
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.25), 0 4px 12px rgba(0,0,0,.1);
  background: rgba(0,0,0,.3);
  border: 1px solid rgba(184,146,60,.08);
}

.video-iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.video-caption {
  margin-top: 20px;
  text-align: center;
}

/* ═══════════════════════════════════════
   REVIEWS  v7
═══════════════════════════════════════ */
.reviews-top {
  display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 48px;
  padding-bottom: 40px; border-bottom: 1px solid var(--warm);
}
.score-big {
  font-family: 'Cormorant Garamond', serif; font-size: 84px; font-weight: 300; font-style: italic; line-height: 1;
  color: var(--gold-lt); letter-spacing: .02em;
}
.score-stars { font-size: 16px; color: var(--gold); letter-spacing: .16em; margin-top: 5px; }
.score-meta  { font-family: 'Cormorant Garamond', serif; font-size: 11.5px; color: var(--t400); margin-top: 7px; letter-spacing: .1em; }
.reviews-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--gap); }
/* 英雄区卡片深度增强 */
.rv-card {
  background: var(--white); border-radius: var(--r); padding: 30px 28px;
  border: 1px solid rgba(43,96,69,.05);
  border-bottom: 2px solid transparent;
  box-shadow: 0 8px 24px rgba(0,0,0,.08), 0 1px 3px rgba(0,0,0,.04);
  transition: transform var(--dur) var(--ease-bounce), box-shadow var(--dur) var(--ease-smooth), border-color var(--dur), background var(--dur);
  position: relative;
}
.rv-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(to right, transparent, rgba(184,146,60,.22), transparent);
}
.rv-card:hover {
  transform: translateY(-12px);
  box-shadow: 0 24px 60px rgba(0,0,0,.14), 0 4px 8px rgba(0,0,0,.06);
  border-color: var(--gold);
  background: rgba(255,255,255,.98);
}
.rv-stars { color: var(--gold); font-size: 12px; letter-spacing: .16em; margin-bottom: 16px; }
.rv-text {
  font-size: 13.5px; font-weight: 300; color: var(--t600);
  line-height: 1.92;          /* 评语字号小，行高控制在1.92比2.0更紧凑 */
  margin-bottom: 22px; font-style: italic; letter-spacing: .03em;
}
.rv-text::before {
  content: '\201C'; font-family: 'Playfair Display', serif; font-size: 32px;  /* 48 → 32px */
  color: var(--sage); line-height: 0; vertical-align: -12px; margin-right: 2px; font-style: normal;
  opacity: .48;  /* .55 → .48 */
}
.rv-who { display: flex; align-items: center; gap: 12px; padding-top: 18px; border-top: 1px solid rgba(43,96,69,.07); }
.rv-ava {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--moss), var(--forest));
  display: flex; align-items: center; justify-content: center;
  font-family: 'Noto Serif SC', serif; font-size: 13px; font-weight: 700; color: var(--white);
}
.rv-name { font-size: 12.5px; font-weight: 600; color: var(--forest); letter-spacing: .05em; }
.rv-sub  { font-family: 'Cormorant Garamond', serif; font-size: 11px; color: var(--t400); margin-top: 2px; letter-spacing: .06em; }
.rv-platform {
  display: inline-block; margin-top: 4px;
  background: rgba(43,96,69,.07); color: var(--moss);
  padding: 2px 9px; border-radius: 10px; font-size: 10px; letter-spacing: .08em;
}

/* ═══════════════════════════════════════
   SURROUNDINGS  v7
═══════════════════════════════════════ */
.surr-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }

.nearby-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 48px; margin-bottom: 56px;
  padding-bottom: 48px; border-bottom: 1px solid rgba(43,96,69,.12);
}
.nearby-head-left { flex: 1; }
.nearby-head-right {
  flex-shrink: 0;
  display: flex; align-items: stretch; gap: 0;
  border: 1px solid rgba(43,96,69,.12); border-radius: var(--r);
  overflow: hidden; background: var(--white);
}
.nearby-stat {
  padding: 28px 32px; text-align: center;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.nearby-stat-num {
  font-family: 'Cormorant Garamond', serif; font-size: clamp(40px,4.4vw,58px);
  font-weight: 300;           /* 纤细高挑，数字更有品质感 */
  color: var(--forest); line-height: 1; letter-spacing: .04em;
  font-style: italic;         /* 斜体让数字更有古典气质 */
}
.nearby-stat-label {
  font-family: 'Cormorant Garamond', serif; font-size: 11px; letter-spacing: .22em;
  text-transform: uppercase; color: var(--t400);              /* 从 var(--t400) 直接取，不再过淡 */
  margin-top: 6px; white-space: nowrap;
}
.nearby-stat-divider {
  width: 1px; background: rgba(43,96,69,.1); flex-shrink: 0;
}
.surr-label {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 0 4px; margin-top: 8px;
  border-bottom: 1px solid rgba(43,96,69,.1);
}
.surr-ring-icon { display: flex; align-items: center; flex-shrink: 0; }
.surr-ring {
  font-family: 'Cormorant Garamond', serif; font-size: 12.5px; letter-spacing: .22em;
  font-weight: 400; font-style: italic;   /* 斜体与整体系统统一 */
  padding: 3px 14px; border-radius: 20px;
}
.surr-ring-30 { color: #2b6045; background: rgba(43,96,69,.08); }
.surr-ring-45 { color: #8a6820; background: rgba(184,146,60,.1); }
.surr-ring-zh { font-family: 'Noto Serif SC', serif; font-size: 11px; color: var(--t400); letter-spacing: .06em; }
.surr-item {
  display: flex; align-items: flex-start; gap: 13px; padding: 17px 18px;
  background: var(--white); border-radius: var(--r);
  border-left: 3px solid var(--gold-dim);
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
  transition: transform var(--dur) var(--ease-smooth), border-color var(--dur), box-shadow var(--dur), background var(--dur);
}
.surr-item:hover {
  transform: translateX(6px);
  border-color: var(--gold);
  box-shadow: 0 8px 24px rgba(0,0,0,.1);
  background: rgba(184,146,60,.03);
}
.surr-icon { font-size: 19px; flex-shrink: 0; margin-top: 1px; width: 28px; text-align: center; }
.surr-name {
  font-family: 'Noto Serif SC', serif; font-size: 13px !important; font-weight: 500;
  color: var(--forest); letter-spacing: .05em; margin-bottom: 4px; line-height: 1.4;
}
.surr-dist { font-family: 'Cormorant Garamond', serif; font-size: 12px !important; color: var(--t400); letter-spacing: .06em; line-height: 1.5; }

/* ═══════════════════════════════════════
   CTA  v7
═══════════════════════════════════════ */
#cta-sec { position: relative; padding: 144px 0; overflow: hidden; }
.cta-bg { position: absolute; inset: 0; background: url('images/night-view.jpg') center 45%/cover no-repeat; }
.cta-veil {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(4,10,6,.95) 0%, rgba(4,10,6,.65) 100%);
}
/* 底部金色辉光 */
.cta-veil::after {
  content: '';
  position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
  width: 60%; height: 1px;
  background: linear-gradient(to right, transparent, rgba(184,146,60,.25), transparent);
}
.cta-inner {
  position: relative; z-index: 2;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: 0;                     /* 内部间距由各元素 margin 精确控制 */
}
.cta-inner .kicker-lt   { margin-bottom: 22px; }
.cta-inner .h-sec-lt    { margin-bottom: 10px; }
.cta-inner .h-sub-zh-lt { margin-bottom: 18px; }
.cta-inner .body-copy-lt { max-width: 480px; margin-bottom: 56px; line-height: 2.0; }
.cta-phone-main {
  display: block; font-family: 'Playfair Display', serif; font-style: italic;
  font-size: clamp(36px,4.6vw,58px); color: var(--gold-lt); letter-spacing: .06em; line-height: 1;
  transition: color var(--dur);
  margin-bottom: 14px;        /* 主号与备用号之间加间距 */
}
.cta-phone-main:hover { color: var(--white); }
.cta-phone-alt {
  display: inline-flex; align-items: center; gap: 4px;
  margin-right: 24px; font-family: 'Noto Serif SC', serif;
  font-size: 16px; font-weight: 300; color: rgba(255,255,255,.4); letter-spacing: .12em;
  white-space: nowrap;
}
.cta-phone-alts { display: inline-flex; gap: 0; align-items: center; }
.cpa-label { white-space: nowrap; }
.cpa-dot   { margin: 0 3px; font-size: 12px; }
.cpa-num   { white-space: nowrap; }
.cta-phone-note { font-family: 'Cormorant Garamond', serif; font-size: 11px; color: rgba(255,255,255,.22); letter-spacing: .26em; margin-top: 16px; }
.cta-phone-block { margin-bottom: 48px; }
.cta-btns { display: flex; gap: 14px; justify-content: center; width: 100%; max-width: 540px; }
.cta-btns .btn { flex: 1; }

/* ═══════════════════════════════════════
   FOOTER  v7
═══════════════════════════════════════ */
footer { background: var(--ink); padding: 80px 0 36px; }
.footer-grid {
  display: grid; grid-template-columns: 1.8fr 1fr 1fr 1.3fr 1.1fr; gap: 40px;
  padding-bottom: 60px; border-bottom: 1px solid rgba(255,255,255,.06); margin-bottom: 32px;
  align-items: stretch;  /* 各列等高 */
}
/* Footer 列内容垂直分布 */
.footer-grid > div {
  display: flex;
  flex-direction: column;
}
.footer-grid > div > .footer-col {
  flex: 1;
  display: flex;
  flex-direction: column;
}
/* 品牌列底部对齐 */
.footer-grid > div:nth-child(1) {
  justify-content: flex-start;
}
.footer-grid > div:nth-child(1) > .footer-trust-badges {
  margin-top: auto;  /* 让认证胶囊推到底部 */
  margin-bottom: 0;
}
/* Contact 列最后一行底部对齐 */
.footer-grid > div:nth-child(4) > .footer-col {
  justify-content: flex-start;
}
.footer-grid > div:nth-child(4) > .footer-col::after {
  content: '';
  flex: 1;
  min-height: 0;
}
/* 社交媒体列底部对齐 */
.footer-grid > div:nth-child(5) > .social-links-compact {
  justify-content: space-between;
  height: 100%;
}
/* Quick Nav、Booking 列底部对齐 */
.footer-grid > div:nth-child(2) > .footer-col::after,
.footer-grid > div:nth-child(3) > .footer-col::after {
  content: '';
  flex: 1;
  min-height: 0;
}
.footer-brand-name {
  font-family: 'Playfair Display', serif; font-style: italic;
  font-size: 18px; font-weight: 400; color: var(--white);
  letter-spacing: .08em; margin-bottom: 6px;
  display: block;
}
.footer-brand-en {
  font-family: 'Cormorant Garamond', serif; font-size: 10.5px; letter-spacing: .32em;
  color: rgba(255,255,255,.2); margin-bottom: 18px; white-space: nowrap;
}
.footer-brand-text {
  display: inline-flex; flex-direction: column; align-items: stretch;
}
.footer-brand-text .footer-brand-name {
  text-align: justify; text-align-last: justify; width: 100%;
}
.footer-brand-desc { font-size: 12px; line-height: 2.15;  /* 2.0→2.15，品牌描述段落呼吸感更足 */
  color: rgba(255,255,255,.33); font-weight: 300; letter-spacing: .04em; margin-top: 16px; }  /* .28→.33 */
.footer-scores { display: flex; gap: 22px; margin-top: 22px; }
.footer-score-val { font-family: 'Cormorant Garamond', serif; font-size: 26px; font-weight: 300; font-style: italic; color: var(--gold-lt); line-height: 1; }
.footer-score-lbl { font-family: 'Cormorant Garamond', serif; font-size: 10px; letter-spacing: .14em; color: rgba(255,255,255,.22); margin-top: 4px; }
.footer-col-title {
  font-family: 'Cormorant Garamond', serif; font-size: 10px; letter-spacing: .32em;
  text-transform: uppercase; color: rgba(207,169,90,.7);
  margin-bottom: 18px;
  position: relative;
}
.footer-col-title::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 24px;
  height: 1px;
  background: linear-gradient(90deg, rgba(207,169,90,0.5) 0%, transparent 100%);
}
.footer-col { list-style: none; padding: 0 !important; margin: 0 !important; }
.footer-col li { margin: 0 !important; padding: 0 !important; margin-bottom: 11px !important; }
.footer-col a { font-size: 12px; color: rgba(255,255,255,.48);
  letter-spacing: .07em; transition: color var(--dur); line-height: 1.7; }
.footer-col a:hover { color: var(--gold-lt); }
.footer-contact-row {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 11.5px; color: rgba(255,255,255,.4);
  margin-bottom: 11px; line-height: 1.8;
  letter-spacing: .04em;
}
.footer-contact-row a:hover {
  color: var(--gold-lt);
}
.fci { flex-shrink: 0; opacity: .4; margin-top: 1px; font-size: 13px; }
.footer-bottom {
  display: flex; justify-content: space-between; align-items: center;
  font-family: 'Cormorant Garamond', serif; font-size: 11px; letter-spacing: .12em;
  color: rgba(255,255,255,.16);
}
.footer-license-link {
  color: rgba(255,255,255,.3);
  text-decoration: none;
  transition: color var(--dur);
}
.footer-license-link:hover {
  color: var(--gold-lt);
}
.footer-trust-badges {
  display: flex;
  gap: 16px;
  margin-top: 20px;
  margin-bottom: 0;  /* 确保底部对齐 */
}
.trust-badge-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: rgba(255,255,255,0.08);
  border-radius: 20px;
  font-size: 11px;
  color: rgba(255,255,255,0.5);
  border: 1px solid rgba(255,255,255,0.1);
  transition: all var(--dur);
}
.trust-badge-item:hover {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,215,0,0.3);
  color: var(--gold-lt);
  transform: translateY(-2px);
}
.trust-icon {
  font-size: 14px;
}
.trust-text {
  font-size: 11px;
  letter-spacing: 0.05em;
}
.social-links {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 16px;
}
.social-links-compact {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 2px;  /* 与其他列第一个元素对齐 */
  flex: 1;
}
.social-link-compact {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  background: linear-gradient(135deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%);
  border-radius: 6px;
  color: rgba(255,255,255,0.6);
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.08);
  transition: all var(--dur);
  backdrop-filter: blur(10px);
}
.social-link-compact:hover {
  background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.05) 100%);
  border-color: rgba(255,215,0,0.3);
  transform: translateX(2px);
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.social-link-qr {
  width: 36px;
  height: 36px;
  border-radius: 6px;
  object-fit: cover;
  flex-shrink: 0;
  background: #f6f2e9;
  box-shadow: 0 1px 4px rgba(0,0,0,0.15);
  border: 1px solid rgba(255,255,255,0.1);
}
.social-link-text {
  font-size: 11px;
  letter-spacing: 0.02em;
  font-weight: 400;
  color: rgba(255,255,255,0.6);
}
.social-link-compact {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.04);
  border-radius: 8px;
  color: rgba(255,255,255,0.5);
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.06);
  transition: all var(--dur);
}
.social-link-compact:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,215,0,0.25);
  color: var(--gold-lt);
}
.social-qr-small {
  width: 120px;
  height: 120px;
  border-radius: 12px;
  overflow: hidden;
  background: linear-gradient(135deg, #f6f2e9 0%, #ede6d3 100%);
  box-shadow: 0 6px 20px rgba(43, 96, 69, 0.12),
              0 2px 4px rgba(0, 0, 0, 0.08);
  flex-shrink: 0;
  border: 1px solid rgba(184, 146, 60, 0.1);
  transition: transform .3s ease, box-shadow .3s ease;
}
.social-link-compact:hover .social-qr-small {
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(43, 96, 69, 0.18),
              0 2px 4px rgba(0, 0, 0, 0.1);
}
.social-qr-small img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.social-link-text {
  font-size: 11px;
  letter-spacing: 0.03em;
  font-weight: 500;
}
.share-buttons {
  display: flex;
  gap: 12px;
  margin-left: 16px;
}
.share-btn {
  width: clamp(44px, 6vw, 52px);
  height: clamp(44px, 6vw, 52px);
  border-radius: 50%;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.2);
  color: white;
  font-size: clamp(18px, 4vw, 22px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all var(--dur);
}
.share-btn:hover {
  background: rgba(255,255,255,0.2);
  border-color: rgba(255,215,0,0.4);
  transform: translateY(-2px);
}
.share-btn:active {
  transform: translateY(0);
}
@media (max-width: 768px) {
  .hero-actions {
    flex-direction: column;
    gap: 12px;
    align-items: stretch;
  }
  .share-buttons {
    margin-left: 0;
    justify-content: center;
  }
}

/* ═══════════════════════════════════════
   微信二维码联系方式 — WeChat Contact
   色彩搭配：深绿#2b6045 + 奶白#f6f2e9 + 金色#b8923c
═══════════════════════════════════════ */
.wechat-contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  position: relative;
}

.wechat-qr {
  width: 120px;
  height: 120px;
  border-radius: 12px;
  overflow: hidden;
  background: linear-gradient(135deg, #f6f2e9 0%, #ede6d3 100%);
  box-shadow: 0 6px 20px rgba(43, 96, 69, 0.12),
              0 2px 4px rgba(0, 0, 0, 0.08);
  flex-shrink: 0;
  border: 1px solid rgba(184, 146, 60, 0.1);
  transition: transform .3s ease, box-shadow .3s ease;
}

.wechat-qr:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(43, 96, 69, 0.18),
              0 2px 4px rgba(0, 0, 0, 0.1);
}

.wechat-qr img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.wechat-info {
  text-align: center;
}

/* 社交媒体统一样式（客服 + 公众号 + 抖音 + 小红书） */
.social-links-compact {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}
.social-link-compact {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: rgba(255,255,255,0.04);
  border-radius: 6px;
  color: rgba(255,255,255,0.5);
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.06);
  transition: all var(--dur);
}
.social-link-compact:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,215,0,0.25);
  color: var(--gold-lt);
}
.social-link-icon {
  font-size: 18px;
  line-height: 1;
  flex-shrink: 0;
}
.social-link-text {
  font-size: 12px;
  letter-spacing: 0.03em;
  font-weight: 400;
}


.wechat-name {
  font-family: 'Noto Serif SC', serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 6px;
  letter-spacing: 0.08em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.wechat-desc {
  font-family: 'Noto Serif SC', serif;
  font-size: 11px;
  color: rgba(184, 146, 60, 0.8);
  margin-bottom: 8px;
  font-weight: 500;
}

.wechat-hours {
  font-family: 'Noto Serif SC', serif;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.5);
  letter-spacing: .04em;
  line-height: 1.5;
}

/* ═══════════════════════════════════════
   FAB  v8 — 优化移动端体验
═══════════════════════════════════════ */
.fab {
  position: fixed;
  right: clamp(20px, 4vw, 28px);
  bottom: clamp(20px, 4vw, 28px);
  z-index: 500;
  width: clamp(56px, 12vw, 64px);
  height: clamp(56px, 12vw, 64px);
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold) 0%, #c9a045 100%);
  color: var(--ink);
  display: flex; align-items: center; justify-content: center;
  font-size: clamp(24px, 5vw, 32px);
  box-shadow: 0 8px 32px rgba(184,146,60,.48), 0 1px 0 rgba(255,255,255,.25) inset;
  transition: transform var(--dur) var(--ease-bounce), box-shadow var(--dur);
  cursor: pointer;
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.fab:focus {
  outline-color: rgba(184,146,60,.6);
  outline-offset: 4px;
}
.fab::before {
  content: '';
  position: absolute; inset: 0; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.3), transparent);
  animation: fabPulse 3.2s ease-in-out infinite;
}
@keyframes fabPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(184,146,60,.4); }
  50% { box-shadow: 0 0 0 8px rgba(184,146,60,.1); }
}
.fab:hover {
  transform: scale(1.12) translateY(-4px);
  box-shadow: 0 12px 40px rgba(184,146,60,.68), 0 1px 0 rgba(255,255,255,.3) inset;
}

/* ═══════════════════════════════════════
   RESPONSIVE — TABLET  ≤1024px
═══════════════════════════════════════ */
@media (max-width:1024px) {
  :root { --pad:40px; --sec:88px; --gap:16px; }

  .nav-links { gap:2px; }
  .nav-links a { width:52px; }
  .nav-en { display:none; }

  .intro-grid { gap:52px; }

  .rooms-wrap { grid-template-columns:1fr; }
  .rooms-grid-4 { grid-template-columns:repeat(4,1fr); grid-template-rows:auto; }

  /* Amenity 网格间距调整 */
  .amenity-grid { grid-template-columns:repeat(3,1fr); gap: 1px; }
  .am-overlay { padding: 12px 14px; }
  .am-label strong { font-size: 13px; }
  .am-label span { font-size: 11px; }

  .footer-grid { grid-template-columns:1fr 1fr; gap:36px; }
}

/* ═══════════════════════════════════════
   RESPONSIVE — MOBILE  ≤768px
   优化移动端视效和交互
═══════════════════════════════════════ */
@media (max-width:768px) {
  :root {
    --pad:20px; 
    --sec:72px; 
    --gap:14px;
    --fs-hero: clamp(36px, 9vw, 56px);  /* 更小的起点 */
    --fs-2xl: clamp(24px, 5.5vw, 38px);
  }

  /* ═══ NAV — 极简汉堡菜单 ═══ */
  #nav {
    padding: 0 20px;
    height: 64px;     /* 56 → 64px，提升呼吸感 */
    background: transparent;
    transition: background var(--dur), backdrop-filter var(--dur);
  }
  #nav.solid {
    background: rgba(8,15,10,.95);
    backdrop-filter: blur(20px);
    box-shadow: 0 2px 12px rgba(0,0,0,.1);
  }
  .nav-brand {
    transform: none;
    gap: 10px;       /* 添加品牌元素间距 */
  }
  .nav-seal {
    width: 40px;     /* 36 → 40px */
    height: 40px;
    border: 1.5px solid rgba(184,146,60,.6);
    border-radius: 4px;
    transition: transform var(--dur), border-color var(--dur);
  }
  
  .nav-seal:hover {
    transform: scale(1.05);
    border-color: var(--gold);
  }
  
  .nav-seal span {
    font-size: 14px;  /* 13 → 14px */
    font-weight: 500;
  }
  .nav-name-zh {
    font-size: 14px;  /* 13 → 14px */
    letter-spacing: .2em;
    font-weight: 500;
  }
  .nav-name-en {
    font-size: 8px;   /* 7 → 8px */
    letter-spacing: .25em;
    margin-top: 2px;
    opacity: 0.7;
  }
  
  /* 隐藏桌面导航，显示汉堡菜单 */
  .nav-links {
    display: none;
  }
  
  /* 移动菜单按钮优化 */
  .nav-menu-btn {
    width: 44px;
    height: 44px;
    cursor: pointer;
    transition: transform var(--dur);
  }
  
  .nav-menu-btn.active {
    transform: rotate(180deg);  /* 添加旋转反馈 */
  }
  .nav-menu-btn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 24px;
    height: 24px;
    cursor: pointer;
    padding: 4px;
  }
  .nav-menu-btn span {
    display: block;
    width: 100%;
    height: 1.5px;
    background: var(--gold-lt);
    transition: all .3s var(--ease);
  }
  .nav-menu-btn.active span:nth-child(1) {
    transform: rotate(45deg) translate(4px, 4px);
  }
  .nav-menu-btn.active span:nth-child(2) {
    opacity: 0;
  }
  .nav-menu-btn.active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
  }

  /* ═══ HERO — 全屏沉浸式优化 ═══ */
  #hero {
    height: 100svh;
    min-height: 600px;  /* 640→600px，小屏优化 */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
  
  /* 小屏 Hero 标题优化 */
  @media (max-width: 600px) {
    .h-hero {
      letter-spacing: 0;     /* 小屏移除负字间，回到正常 */
      line-height: 1.08;     /* 保持略松 */
    }
  }
  .hero-bg {
    background-position: center center !important;
    background-size: cover !important;
  }
  .hero-grad {
    background:
      linear-gradient(to top, rgba(5,11,7,.98) 0%, rgba(5,11,7,.72) 35%, rgba(5,11,7,.28) 65%, rgba(5,11,7,0) 100%),
      linear-gradient(to right, rgba(5,11,7,.42) 0%, rgba(5,11,7,.1) 50%, rgba(5,11,7,0) 85%);
  }
  .hero-body {
    padding: 0 var(--pad) 32px;
    position: relative;
    z-index: 2;
  }
  .hero-kicker {
    margin-bottom: 16px;
    font-size: clamp(9px, 2vw, 10px);
    letter-spacing: .26em;
    color: rgba(255,255,255,.52);
  }
  .hero-title-en {
    font-size: var(--fs-hero);
    line-height: .95;
    letter-spacing: -.02em;
    margin-bottom: 8px;
  }
  .hero-title-zh {
    font-size: clamp(13px, 3vw, 16px);    /* 11px → 13px，提升到合理可读性 */
    letter-spacing: .08em;                 /* .18em → .08em，避免字间距过大 */
    color: rgba(255,255,255,.74);         /* .62 → .74，对比度提升 */
    margin-bottom: 28px;                  /* 24px → 28px，与英文间距更协调 */
    font-weight: 400;                     /* 提升文字分量感 */
    line-height: 1.6;                     /* 多行时避免贴紧 */
  }
  .hero-sub {
    font-size: clamp(11px, 2.8vw, 12px);
    line-height: 1.9;
    color: rgba(255,255,255,.48);
    margin-bottom: 32px;
    max-width: 100%;
  }
  .hero-actions {
    flex-direction: column;
    gap: 10px;
    margin-bottom: 36px;
  }
  .hero-actions .btn {
    width: 100%;
    padding: 14px 28px !important;
    font-size: clamp(12px, 3vw, 13px) !important;
    letter-spacing: .14em;
    min-height: 48px;
  }
  .btn-gold {
    background: var(--gold);
    box-shadow: 0 4px 20px rgba(184,146,60,.3);
  }
  .btn-outline-lt {
    border-color: rgba(255,255,255,.3);
    background: rgba(255,255,255,.05);
  }

  /* ═══ STATS — 优雅数据展示 ═══ */
  .hero-stats {
    position: relative;
    right: auto;
    bottom: auto;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background: transparent;
    backdrop-filter: none;
    border: none;
    border-top: 1px solid rgba(255,255,255,.1);
    padding-top: 24px;
  }
  .hs-item {
    padding: 0;
    border: none;
    text-align: center;
  }
  .hs-item:not(:last-child) {
    border-right: 1px solid rgba(255,255,255,.08);
  }
  .hs-num {
    font-size: clamp(18px, 5vw, 24px);
    font-weight: 300;
    color: var(--gold-lt);
    margin-bottom: 4px;
    line-height: 1;
  }
  .hs-lbl {
    font-size: clamp(7px, 1.8vw, 9px);
    letter-spacing: .12em;
    color: rgba(255,255,255,.35);
  }
  .scroll-cue {
    display: none;
  }

  /* ═══ INTRO — 大图 + 极简 ═══ */
  .intro-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .intro-pip { display:none; }
  .intro-imgs {
    padding-bottom: 0;
    padding-left: 0;
    position: relative;
  }
  .intro-main {
    aspect-ratio: 16/9;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0,0,0,.2);
  }
  .intro-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .intro-badge {
    top: -14px;
    left: -14px;
    width: clamp(56px, 14vw, 72px);
    height: clamp(56px, 14vw, 72px);
    box-shadow: 0 6px 20px rgba(184,146,60,.35);
  }
  .intro-badge-num {
    font-size: clamp(20px, 5vw, 28px);
  }
  .intro-copy {
    padding-right: 0;
    text-align: left;
  }
  .kicker {
    font-size: clamp(9px, 2vw, 10px);
    margin-bottom: 14px;
  }
  .h-sec {
    font-size: var(--fs-2xl);
    line-height: 1.18;
    margin-bottom: 10px;
  }
  .h-sub-zh {
    font-size: clamp(12px, 3vw, 14px);
    margin-bottom: 20px;
  }
  .body-copy {
    font-size: clamp(13px, 3vw, 14px);
    line-height: 2;
    margin-bottom: 24px;
  }
  .intro-tags {
    gap: 8px;
    margin-top: 24px;
    padding-top: 20px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  }
  .intro-tags .tag {
    flex: none;                           /* 移除 flex 百分比 */
    padding: 12px 10px;
    font-size: clamp(10px, 2.5vw, 11px);
    min-width: 0;
    min-height: 48px;                     /* 确保最小高度 */
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  /* 极小屏 ≤360px，变成 2 列 */
  @media (max-width: 360px) {
    .intro-tags {
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
    }
    .intro-tags .tag {
      padding: 12px 8px;
      font-size: 10px;
    }
  }
  
  /* 手机端 375-480px，3 列 */
  @media (min-width: 361px) and (max-width: 480px) {
    .intro-tags {
      grid-template-columns: repeat(3, 1fr);
    }
  }

  /* ═══ SECTIONS — 移动端统一布局 ═══ */
  .sec-head {
    margin-bottom: 36px;
    gap: 12px;
  }
  .sec-head .kicker {
    font-size: clamp(9px, 2vw, 10px);
  }
  .sec-head .h-sec {
    font-size: var(--fs-2xl);
    max-width: 100%;
  }
  .sec-head .h-sub-zh {
    font-size: clamp(12px, 2.8vw, 14px);
    max-width: 100%;
  }
  .sec-head .body-copy {
    max-width: 100%;
    font-size: clamp(13px, 2.8vw, 13px);
  }

  /* ═══ AMENITIES — 网格优化 ═══ */
  .amenity-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    border-radius: 0;
    overflow: visible;
  }
  
  .am-cell {
    aspect-ratio: 1 / 1;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0,0,0,.12);
    position: relative;
    transition: transform 0.3s ease;
  }
  
  .am-cell:active {
    transform: scale(0.98);
  }
  
  .am-cell img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .am-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px;
    background: linear-gradient(to top, rgba(8,15,10,0.95) 0%, rgba(8,15,10,0.5) 70%, rgba(8,15,10,0) 100%);
    color: var(--white);
  }
  
  .am-label strong {
    font-size: 13px;
    font-weight: 500;
    color: var(--white);
    display: block;
    margin-bottom: 3px;
  }
  
  .am-label span {
    font-size: 11px;
    color: rgba(255,255,255,.7);
    line-height: 1.4;
    display: block;
  }

  /* ═══ POOL — 全屏沉浸优化 ═══ */
  #pool-sec {
    height: auto;
    min-height: auto;
    padding: 60px 0 80px;
    position: relative;
  }
  
  .pool-inner {
    max-width: 100%;
    padding-bottom: 32px;
    padding-left: 16px;
    padding-right: 16px;
    z-index: 2;
    position: relative;
  }
  
  .pool-inner .kicker-lt {
    margin-bottom: 16px;
    font-size: 11px;
    letter-spacing: 0.12em;
    color: rgba(255, 255, 255, 0.7) !important;
    font-weight: 600;
  }
  
  .pool-inner .h-sec-lt {
    font-size: 32px;
    line-height: 1.2;
    margin-bottom: 12px;
    color: #ffffff !important;
    font-weight: 500;
    word-wrap: break-word;
  }
  
  .pool-inner .h-sub-zh-lt {
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.9) !important;
  }
  
  .pool-inner .body-copy-lt {
    max-width: 100%;
    margin-bottom: 20px;
    font-size: 14px;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.8) !important;
  }
  
  .pool-dots {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px;
    margin-top: 12px;
  }
  
  .pool-dot {
    padding: 10px 14px;
    font-size: 12px;
    background: rgba(207, 169, 90, 0.12);
    color: rgba(207, 169, 90, 0.9) !important;
    border: 1px solid rgba(207, 169, 90, 0.3);
    border-radius: 24px;
    font-weight: 500;
    display: inline-block;
    white-space: normal;
    word-wrap: break-word;
    transition: all 0.3s ease;
  }
  
  .pool-dot:active {
    background: rgba(207, 169, 90, 0.2);
    border-color: rgba(207, 169, 90, 0.5);
    transform: scale(0.98);
  }
  
  .pool-inner .btn {
    margin-top: 8px;
    padding: 14px 32px;
    width: 100%;
    max-width: 100%;
    display: block !important;
    text-align: center;
  }
  
  /* ═══ POOL — 手机端单列瀑布流（优化版） ═══ */
  .pool-gallery {
    height: auto !important;
    gap: 16px;
    grid-template-columns: 1fr;
    margin-top: 32px;
    padding: 0 16px !important;
    position: relative;
    z-index: 2;
  }
  
  .pool-gallery-item {
    aspect-ratio: 4 / 3;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), 
                box-shadow 0.3s ease,
                filter 0.3s ease;
    background: rgba(43,96,69,.04);
  }
  
  .pool-gallery-item:active {
    transform: scale(0.96);
    box-shadow: 0 4px 12px rgba(0,0,0,.12);
  }
  
  .pool-gallery-item:hover {
    box-shadow: 0 12px 32px rgba(0,0,0,.18);
  }
  
  .pool-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  /* ═══ ROOMS — 手机端单列瀑布流（优化版） ═══ */
  .rooms-grid-4 {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: 16px;
    grid-auto-flow: row;
    padding: 0 16px;
  }
  
  /* 所有卡片统一单列呈现 */
  .room-card-sm:nth-child(1) {
    grid-column: auto;
    grid-row: auto;
    min-height: 320px;
  }
  
  .room-card-sm:nth-child(2) {
    grid-column: auto;
    grid-row: auto;
    min-height: 280px;
  }
  
  .room-card-sm:nth-child(3) {
    grid-column: auto;
    grid-row: auto;
    min-height: 280px;
  }
  .room-card-sm {
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0,0,0,.12);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), 
                box-shadow 0.3s ease;
    position: relative;
    height: 100%;
  }
  
  .room-card-sm:active {
    transform: scale(0.96);
    box-shadow: 0 6px 16px rgba(0,0,0,.1);
  }
  
  .room-card-sm:hover {
    box-shadow: 0 16px 40px rgba(0,0,0,.15);
  }
  
  .room-card-sm-img {
    aspect-ratio: 1 / 1;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  
  .room-card-sm-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .room-card-sm-body {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 14px;
    background: linear-gradient(to top, rgba(8,15,10,0.95) 0%, rgba(8,15,10,0.7) 60%, rgba(8,15,10,0) 100%);
    color: var(--white);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
  .room-card-sm .room-badge {
    font-size: 10px;
    padding: 4px 8px;
    margin-bottom: 6px;
    background: var(--gold);
    color: var(--ink);
    width: fit-content;
    border-radius: 4px;
    font-weight: 500;
    letter-spacing: 0.05em;
    display: inline-block;
  }
  
  .room-card-sm .room-title {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 2px;
    color: var(--white);
    line-height: 1.2;
  }
  
  .room-card-sm .room-title-zh {
    font-size: 11px;
    margin-bottom: 6px;
    color: rgba(255,255,255,.75);
    line-height: 1.4;
  }
  
  .room-card-sm .room-desc {
    font-size: 11px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.6;
    color: rgba(255,255,255,.65);
  }
  .room-tag {
    padding: 6px 12px;
    font-size: 10px;
  }

  /* ═══ GARDEN — 手机端单列，每张一行（优化版） ═══ */
  .garden-grid {
    grid-template-columns: 1fr;
    gap: 16px;
    border-radius: 0;
    overflow: visible;
    padding: 0 16px;
  }
  
  .garden-cell {
    aspect-ratio: 4 / 3;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0,0,0,.12);
    position: relative;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), 
                box-shadow 0.3s ease;
  }
  
  .garden-cell:active {
    transform: scale(0.96);
    box-shadow: 0 6px 16px rgba(0,0,0,.1);
  }
  
  .garden-cell:hover {
    box-shadow: 0 16px 40px rgba(0,0,0,.15);
  }
  
  .garden-cell img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .garden-cell-cap {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    background: linear-gradient(to top, rgba(8,15,10,0.95) 0%, rgba(8,15,10,0.5) 70%, rgba(8,15,10,0) 100%);
    color: var(--white);
  }
  
  .garden-cell-cap span {
    font-size: 13px;
    line-height: 1.6;
    color: rgba(255,255,255,.8);
    display: block;
  }

  /* ═══ PANORAMA & VIDEO — 手机端响应式优化 ═══ */
  .panorama-container {
    height: 400px;
    border-radius: 14px;
  }
  
  .video-container {
    max-width: 100%;
    border-radius: 14px;
  }
  
  .panorama-caption h3,
  .video-caption h3 {
    font-size: 18px;
  }
  
  .panorama-caption p,
  .video-caption p {
    font-size: 12px;
  }

  /* ═══ OUTDOOR — 手机端单列，每张一行（优化版） ═══ */
  .outdoor-row1 {
    grid-template-columns: 1fr;
    border-radius: 0;
    gap: 16px;
    overflow: visible;
    padding: 0 16px;
  }
  
  .outdoor-row1 .od-item {
    aspect-ratio: 4 / 3;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0,0,0,.12);
    height: auto;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), 
                box-shadow 0.3s ease;
  }
  
  .outdoor-row1 .od-item:active {
    transform: scale(0.96);
    box-shadow: 0 6px 16px rgba(0,0,0,.1);
  }
  
  .outdoor-row1 .od-item:hover {
    box-shadow: 0 16px 40px rgba(0,0,0,.15);
  }
  
  .outdoor-row1 .od-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .outdoor-row2 {
    border-radius: 0;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 0;
    padding: 0 16px;
  }
  
  .outdoor-row2 .od-item {
    aspect-ratio: 4 / 3;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0,0,0,.12);
    height: auto;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), 
                box-shadow 0.3s ease;
  }
  
  .outdoor-row2 .od-item:active {
    transform: scale(0.96);
    box-shadow: 0 6px 16px rgba(0,0,0,.1);
  }
  
  .outdoor-row2 .od-item:hover {
    box-shadow: 0 16px 40px rgba(0,0,0,.15);
  }
  
  .outdoor-row2 .od-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .od-caption {
    padding: 16px 0;
    background: transparent;
    border: none;
  }
  
  .od-caption strong {
    font-size: 14px;
    font-weight: 500;
    color: var(--t900);
    display: block;
    margin-bottom: 4px;
  }
  
  .od-caption span {
    font-size: 12px;
    color: var(--t500);
    line-height: 1.6;
    display: block;
  }

  /* ═══ ESTATE — 手机端单列高端呈现（优化版） ═══ */
  .ext-hero {
    aspect-ratio: 4 / 3;
    border-radius: 14px;
    overflow: hidden;
    position: relative;
    background: rgba(43,96,69,.04);
    box-shadow: 0 12px 32px rgba(0,0,0,.12);
    margin: 0 16px 16px 16px;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), 
                box-shadow 0.3s ease;
  }
  
  .ext-hero:active {
    transform: scale(0.96);
    box-shadow: 0 6px 16px rgba(0,0,0,.1);
  }
  
  .ext-hero:hover {
    box-shadow: 0 16px 40px rgba(0,0,0,.15);
  }
  
  .ext-hero img {
    object-position: center 40%;
    transition: transform 1s ease-out;
    object-fit: cover;
    width: 100%;
    height: 100%;
  }
  
  .ext-hero:hover img {
    transform: scale(1.05);
  }
  
  .ext-hero-label {
    position: absolute;
    bottom: 16px;
    left: 16px;
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-size: 13px;
    letter-spacing: .12em;
    color: rgba(255,255,255,.75);
  }
  
  .ext-row3 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 0;
    border-radius: 0;
    overflow: visible;
    padding: 0 16px;
  }
  
  .ext-row3-item {
    aspect-ratio: 4 / 3;
    position: relative;
    overflow: hidden;
    background: rgba(43,96,69,.04);
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(0,0,0,.12);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), 
                box-shadow 0.3s ease;
  }
  
  .ext-row3-item:active {
    transform: scale(0.96);
    box-shadow: 0 6px 16px rgba(0,0,0,.1);
  }
  
  .ext-row3-item:hover {
    box-shadow: 0 16px 40px rgba(0,0,0,.15);
  }
  
  .ext-row3-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .8s ease-out;
  }
  
  .ext-row3-item:hover img {
    transform: scale(1.05);
  }
  
  .ext-row3-lbl {
    position: absolute;
    bottom: 12px;
    left: 12px;
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-size: 11px;
    letter-spacing: .12em;
    color: rgba(255,255,255,.70);
  }

  /* ═══ REVIEWS — 响应式评价 ═══ */
  .reviews-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding-bottom: 28px;
  }
  .score-big {
    font-size: clamp(48px, 12vw, 72px);
  }
  .reviews-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .rv-card {
    border-radius: var(--r);
    padding: clamp(20px, 4vw, 24px);
  }
  .rv-stars {
    font-size: clamp(12px, 2.8vw, 14px);
    margin-bottom: 10px;
  }
  .rv-text {
    font-size: clamp(12px, 2.8vw, 13px);
    line-height: 1.85;
    margin-bottom: 14px;
  }
  .rv-ava {
    width: 40px;
    height: 40px;
    font-size: 14px;
  }
  .rv-name {
    font-size: 13px;
  }
  .rv-sub {
    font-size: 10px;
    margin-top: 3px;
  }

  /* ═══ NEARBY — 简洁列表 ═══ */
  .nearby-head {
    flex-direction: column;
    gap: 32px;
    padding-bottom: 32px;
  }
  .nearby-head-right {
    width: 100%;
  }
  .nearby-stat {
    padding: 20px;
  }
  .nearby-stat-num {
    font-size: 36px;
  }
  .surr-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .surr-label {
    grid-column: 1 / -1;
  }
  .surr-item {
    padding: 16px;
    border-left-width: 2px;
  }
  .surr-icon {
    font-size: 18px;
  }
  .surr-name {
    font-size: 13px;
  }
  .surr-dist {
    font-size: 11px;
  }

  /* ═══ CTA — 居中优雅 ═══ */
  #cta-sec {
    padding: 100px 0;
  }
  .cta-inner .kicker-lt {
    margin-bottom: 16px;
  }
  .cta-inner .h-sec-lt {
    font-size: var(--fs-2xl);
    margin-bottom: 12px;
  }
  .cta-inner .h-sub-zh-lt {
    margin-bottom: 16px;
  }
  .cta-inner .body-copy-lt {
    max-width: 100%;
    margin-bottom: 32px;
    font-size: 13px;
    line-height: 1.9;
  }
  .cta-phone-main {
    font-size: clamp(32px, 7.5vw, 42px);
    margin-bottom: 10px;
  }
  .cta-phone-alt {
    font-size: 13px;
    margin-right: 16px;
  }
  .cta-phone-block {
    margin-bottom: 32px;
  }
  .cta-btns {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    width: 100%;
    max-width: none;
  }
  .cta-btns .btn {
    width: 100%;
    padding: 16px 32px !important;
  }

  /* ═══ FOOTER — 极简 ═══ */
  footer {
    padding: 60px 0 32px;
  }
  .footer-grid {
    grid-template-columns: 1fr;
    gap: 40px;
    padding-bottom: 40px;
  }
  .footer-brand-name {
    font-size: 16px;
  }
  .footer-brand-en {
    font-size: 9px;
  }
  .footer-brand-desc {
    font-size: 11px;
    line-height: 2;
  }
  .footer-score-val {
    font-size: 20px;
  }
  .footer-col-title {
    font-size: 9px;
    margin-bottom: 16px;
  }
  .footer-col a {
    font-size: 11px;
    line-height: 2;
  }
  .footer-contact-row {
    font-size: 11px;
    line-height: 2;
  }
  
  /* ═══ 微信二维码 — 手机端优化 ═══ */
  .wechat-qr {
    width: 128px;
    height: 128px;
    box-shadow: 0 6px 16px rgba(43, 96, 69, 0.12),
                0 1px 2px rgba(0, 0, 0, 0.06);
  }

  .wechat-qr:hover {
    transform: none;
  }

  .wechat-contact {
    gap: 12px;
  }

  .wechat-name {
    font-size: 12px;
  }

  /* 社交媒体链接移动端适配 */
  .social-links-compact {
    gap: 6px;
  }
  .social-link-compact {
    padding: 8px 10px;
    gap: 10px;
  }
  .social-link-icon {
    font-size: 16px;
  }
  .social-link-text {
    font-size: 11px;
  }

    margin-bottom: 4px;
  }
  
  .wechat-desc {
    font-size: 10px;
    margin-bottom: 6px;
  }
  
  .wechat-hours {
    font-size: 9px;
  }

  /* ═══ FAB — 优化位置 ═══ */
  .fab {
    right: 20px;
    bottom: 20px;
    width: 56px;
    height: 56px;
    font-size: 24px;
  }

/* ── 极小屏 ≤360px ── */
@media (max-width:360px) {
  :root { --fs-hero: clamp(40px, 11vw, 60px); }
  .intro-tags .tag { flex:1 1 100%; }
  .nav-book { padding:6px 14px; font-size:11px; }
  .nav-zh { font-size:10px; }
}

}

/* ═══════════════════════════════════════
   RESPONSIVE — LANDSCAPE & ULTRA-SMALL
═══════════════════════════════════════ */
@media (max-height:500px) and (orientation:landscape) {
  :root { --sec:48px; }
  #hero { min-height:520px; height:auto; padding-top:0; }
  .hero-bg { background-position: center center !important; background-size: cover !important; }
  .hero-body { padding-bottom:140px; margin-top:0; }
  .hero-stats { flex-wrap:wrap; }
  .hs-item { padding:12px 16px; min-width:80px; }
  .hs-num { font-size:20px; }
}

@media (max-width:280px) {
  :root { --pad:12px; --fs-hero: clamp(32px, 10vw, 48px); --sec:48px; }
  .nav-links a { padding:3px 5px !important; font-size:9px !important; }
  .nav-book { padding:3px 6px !important; font-size:9px !important; }
  .intro-badge { top:-10px; left:-6px; width:56px; height:56px; }
  .intro-badge-num { font-size:18px; }
  .btn { padding:12px 28px; font-size:12px; }
  .room-card-sm-body { padding:10px 12px 12px; }
  .room-card-sm .room-badge { font-size:8px; padding:2px 8px; }
  .sec-head .h-sec { max-width:100%; font-size:clamp(24px, 5vw, 32px); }
  #nav { height:56px; }
  .hs-item { padding:10px 6px; min-width:0; }
  .hs-num { font-size:18px; }
  .hero-body { padding:0 var(--pad) 180px; }
  .footer-col a { font-size:11px; }
  .footer-contact-row { font-size:10.5px; }
}

/* ═══════════════════════════════════════
   RESPONSIVE — SMALL MOBILE  ≤480px
═══════════════════════════════════════ */
@media (max-width:480px) {
  :root { --pad:16px; }
  .hs-item { flex:1 1 50%; }
  .hs-item:nth-child(5) { flex:1 1 100%; border-right:none; border-top:1px solid rgba(255,255,255,.06); }
  .rooms-grid-4 { grid-template-columns:1fr; }
  .amenity-grid { grid-template-columns:1fr 1fr 1fr; }
  .pool-gallery { height:110px; }
  .nearby-head-right { flex-wrap:wrap; }
  .nearby-stat { flex:1 1 33%; }
  .btn { font-size:13px; }
}


.faq-section{max-width:1080px;margin:0 auto;padding:64px 20px 40px;}
.faq-section h2{font-size:28px;text-align:center;margin:0 0 6px;color:var(--ink-dk,#1a1a1a);letter-spacing:1px;}
.faq-section .faq-sub{text-align:center;color:#8a8a8a;margin:0 0 34px;font-size:15px;}
.faq-item{border:1px solid rgba(0,0,0,.08);border-radius:14px;margin-bottom:13px;background:#fff;overflow:hidden;transition:box-shadow .2s;}
.faq-item[open]{box-shadow:0 6px 22px rgba(0,0,0,.07);}
.faq-item summary{cursor:pointer;list-style:none;padding:17px 22px;font-weight:600;font-size:16px;display:flex;justify-content:space-between;align-items:center;gap:14px;color:#222;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";font-size:22px;font-weight:400;color:var(--gold,#b8924f);transition:transform .2s;flex:0 0 auto;}
.faq-item[open] summary::after{content:"\2212";}
.faq-item .faq-a{padding:0 22px 20px;color:#4a4a4a;line-height:1.85;font-size:15px;}