/* ============================================================
   棠院 LA VILLA · 首页方案B
   复刻参考站（tangyuan-site）首页样式：顶部导航 + HERO
   仅覆盖首页视觉区域，其余模块沿用 style.css
   ============================================================ */

/* ───── 顶部导航（复刻参考站） ───── */
.site-v2 .site-header{height:76px;padding:0;background:transparent}
.site-v2 .site-header.scrolled{
  padding:0;background:rgba(251,248,241,.94);
  backdrop-filter:blur(12px);
  box-shadow:0 1px 0 var(--line),0 8px 30px rgba(34,29,22,.08);
}
.site-v2 .header-inner{max-width:1360px;height:100%;position:relative;gap:28px;padding:0 32px}
.site-v2 .brand-cn{font-size:24px;font-weight:700;letter-spacing:.28em}
.site-v2 .brand-en{
  font-family:"Cormorant Garamond",serif;font-size:12px;
  letter-spacing:.42em;color:#C9A86A;white-space:nowrap;
}
.site-v2 .nav-link{padding:8px 16px;font-size:15px;letter-spacing:.2em}
.site-v2 .nav-link::after{
  left:16px;right:16px;bottom:2px;width:auto;height:1px;
  transform:scaleX(0);transform-origin:center;transition:transform .35s;
}
.site-v2 .nav-link:hover::after,.site-v2 .nav-link.active::after{width:auto;transform:scaleX(1)}

/* 右上角：微信咨询按钮 + VIP LINE */
.site-v2 .header-contact{display:flex;align-items:center;gap:14px;margin-left:auto}
.site-v2 .vip-line{flex-direction:column;align-items:flex-end;gap:0;line-height:1.35}
.site-v2 .vip-label{
  font-family:"Cormorant Garamond",serif;font-size:10px;
  letter-spacing:.32em;color:#C9A86A;
}
.site-v2 .vip-num{font-family:"Jost","Noto Serif SC",sans-serif;font-size:19px;letter-spacing:.08em}
.site-v2 .qr-btn{
  display:flex;align-items:center;gap:6px;cursor:pointer;
  border:1px solid rgba(255,255,255,.5);color:#fff;background:transparent;
  padding:7px 14px;border-radius:2px;font-size:13px;letter-spacing:.12em;
  transition:all .3s;
}
.site-v2 .qr-btn:hover{background:#B08D57;border-color:#B08D57;color:#fff}
.site-v2 .site-header.scrolled .qr-btn{border-color:var(--line);color:var(--brown)}
.site-v2 .site-header.scrolled .qr-btn:hover{background:#B08D57;border-color:#B08D57;color:#fff}
.site-v2 .site-header.scrolled .nav-link{color:var(--brown)}
.site-v2 .site-header.scrolled .nav-link.active{color:#8C6D3F}

/* 桌面端：导航绝对居中 */
@media (min-width:769px){
  .site-v2 .main-nav{position:absolute;left:50%;transform:translateX(-50%);gap:6px}
}

/* 移动端：对齐参考站 */
@media (max-width:768px){
  .site-v2 .header-inner{gap:14px;padding:0 18px;height:64px}
  .site-v2 .brand-cn{font-size:20px;letter-spacing:.2em;white-space:nowrap}
  .site-v2 .qr-btn-text{display:none}
  .site-v2 .qr-btn{padding:7px 10px}
  .site-v2 .vip-num{display:block;font-size:15px;letter-spacing:.02em}
  .site-v2 .vip-label{font-size:9px}
  .site-v2 .vip-line{white-space:nowrap}
  .site-v2 .site-header.scrolled .main-nav .nav-link{color:rgba(246,241,230,.85)}
}

/* ───── 首页 Hero（复刻参考站） ───── */

/* 背景：img 视差结构，取消原缩放动画（与视差 transform 冲突） */
.hero-v2 .hero-bg{
  position:absolute;
  inset:-12% 0 0;
  z-index:1;
  will-change:transform;
  animation:none;
  transform:none;
}
.hero-v2 .hero-bg img{width:100%;height:112%;object-fit:cover}

/* 遮罩：与参考站一致的渐变压暗 */
.hero-v2 .hero-overlay{
  position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(24,19,13,.52) 0%,rgba(24,19,13,.30) 45%,rgba(24,19,13,.62) 100%);
}

/* 内容 */
.hero-v2 .hero-content{position:relative;z-index:3;text-align:center;color:#fff;padding:0 24px}
.hero-v2 .hero-eyebrow{
  font-size:14px;letter-spacing:.5em;text-indent:.5em;
  color:rgba(255,255,255,.82);margin-bottom:28px;font-weight:400;
}
.hero-v2 .hero-title{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0}
.hero-v2 .hero-title-cn{
  font-size:clamp(64px,12vw,128px);font-weight:700;
  letter-spacing:.3em;text-indent:.3em;line-height:1.15;
  color:#fff;text-shadow:0 4px 40px rgba(0,0,0,.35);
}
.hero-v2 .hero-title-en{
  font-family:"Cormorant Garamond","Noto Serif SC",serif;
  font-size:clamp(16px,2.4vw,24px);font-weight:500;
  letter-spacing:.85em;text-indent:.85em;color:#C9A86A;
}

/* 分隔线 ✦（重置基础样式中的菱形方块） */
.hero-v2 .hero-divider{display:flex;align-items:center;justify-content:center;gap:14px;margin:34px 0 22px}
.hero-v2 .hero-divider i{display:block;width:72px;height:1px;background:linear-gradient(90deg,transparent,#C9A86A);transform:none}
.hero-v2 .hero-divider i:last-child{background:linear-gradient(90deg,#C9A86A,transparent)}
.hero-v2 .hero-divider em{
  display:inline;width:auto;height:auto;background:none;transform:none;
  font-style:normal;color:#C9A86A;font-size:12px;line-height:1;
}

/* 标语：细体大间距 */
.hero-v2 .hero-slogan{
  font-size:clamp(16px,2.2vw,21px);letter-spacing:.32em;text-indent:.32em;
  font-weight:300;color:#fff;margin:0;
}

/* 双按钮 */
.hero-v2 .hero-actions{display:flex;gap:18px;justify-content:center;margin-top:48px}
.hero-v2 .btn-gold,.hero-v2 .btn-ghost{
  display:inline-block;padding:14px 42px;font-size:15px;
  letter-spacing:.28em;text-indent:.28em;border-radius:2px;
  transition:all .35s;margin-top:0;
}
.hero-v2 .btn-gold{background:#B08D57;color:#fff;border:1px solid #B08D57}
.hero-v2 .btn-gold:hover{background:#8C6D3F;border-color:#8C6D3F;letter-spacing:.28em}
.hero-v2 .btn-ghost{border:1px solid rgba(255,255,255,.55);color:#fff;background:transparent}
.hero-v2 .btn-ghost:hover{border-color:#C9A86A;color:#C9A86A;letter-spacing:.28em}

/* 底部滚动提示：细线 + 金色滑动段 */
.hero-v2 .hero-scroll{
  position:absolute;bottom:34px;left:50%;transform:translateX(-50%);z-index:3;
  width:1px;height:56px;background:rgba(255,255,255,.25);overflow:hidden;
  font-size:0;
}
.hero-v2 .hero-scroll span{
  position:absolute;top:0;left:0;width:100%;height:20px;margin:0;
  background:#C9A86A;animation:heroV2ScrollHint 2s infinite;
}
@keyframes heroV2ScrollHint{0%{top:-20px}100%{top:56px}}

/* 入场延迟（沿用 main.js 的 reveal 机制） */
.hero-v2 .reveal.d1{transition-delay:.1s}
.hero-v2 .reveal.d2{transition-delay:.2s}
.hero-v2 .reveal.d3{transition-delay:.3s}
.hero-v2 .reveal.d4{transition-delay:.4s}

/* 移动端（对齐参考站断点） */
@media (max-width:420px){
  .hero-v2 .hero-actions{flex-direction:column;align-items:center}
  .hero-v2 .hero-eyebrow{letter-spacing:.24em;font-size:12px}
  .hero-v2 .hero-slogan{letter-spacing:.14em;font-size:14px;text-indent:0}
  .hero-v2 .hero-title-cn{letter-spacing:.2em;text-indent:.2em}
  .hero-v2 .hero-title-en{letter-spacing:.5em;text-indent:.5em}
}