/* ============================================================
   Hero 杂志式排版（加载于 app.css / home-orbit.css 之后，凭同
   等级更高优先级 + 靠后顺序覆盖旧规则）
   设计：大图背景 + 暗部压字；主标题大号高对比宋体；英文眉题；
   元信息小字辅助层；文案左下对齐；CTA 高对比浅色实底置右下。
   ============================================================ */

/* ── 舞台：全出血大图 ── */
body.public-home .home-hero {
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  min-height: clamp(560px, 88vh, 900px);
  padding: 120px 6vw 64px;
  overflow: hidden;
  background: #050816;
}

/* 背景艺术图（占据整个 hero） */
body.public-home .home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  opacity: 1;
  z-index: 0;
  background: url("/assets/img/hero-artwork.jpg") center / cover no-repeat;
  pointer-events: none;
}

/* 暗部渐变压字层：左下最暗（文字区）、右上保留画面高光 */
body.public-home .home-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  opacity: 1;
  z-index: 1;
  background:
    linear-gradient(76deg, rgba(4, 8, 20, .88) 0%, rgba(4, 8, 20, .58) 36%, rgba(4, 8, 20, .16) 66%, rgba(4, 8, 20, .40) 100%),
    linear-gradient(180deg, rgba(4, 8, 20, .42) 0%, rgba(4, 8, 20, .06) 42%, rgba(4, 8, 20, .82) 100%);
  pointer-events: none;
}

/* 旧轨道视觉全部让位给大图（marquee / 轨道环 / 浮动模型卡） */
body.public-home .home-hero .model-cloud,
body.public-home .home-hero .model-orbit-stage,
.public-home .hero-model-cards {
  display: none !important;
}

/* ── 文案：左下对齐 ──
   position 保持 static：绝对定位的 CTA（.hero-actions）需锚定到
   .home-hero；层级靠 flex 子项的 z-index（对 flex item 生效）。 */
body.public-home .home-hero .hero-copy {
  position: static;
  z-index: 2;
  display: block;
  min-height: 0;
  width: 100%;
  max-width: 860px;
  margin: 0;
  text-align: left;
}

/* 英文眉题：小号、字距拉开的辅助层级 */
body.public-home .home-hero .hero-copy .eyebrow {
  display: inline-flex;
  align-items: center;
  width: auto;
  height: auto;
  margin: 0 0 22px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: rgba(255, 255, 255, .78);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .42em;
  text-transform: uppercase;
  text-align: left;
  text-shadow: 0 1px 12px rgba(0, 0, 0, .6);
}

/* 主标题：大号高对比宋体 */
body.public-home .home-hero .hero-copy h1 {
  display: block;
  flex-wrap: nowrap;
  min-height: 0;
  margin: 0 0 20px;
  font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif;
  font-size: clamp(44px, 6vw, 82px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: .015em;
  text-align: left;
  color: #fff;
  text-shadow: 0 2px 28px rgba(0, 0, 0, .55);
  /* 主标题整行显示：防止 balance 把「为你」与打字词拆行 */
  white-space: nowrap;
}

/* 英文文案较长，允许自然换行 */
body[data-lang="en"].public-home .home-hero .hero-copy h1,
html[lang="en"] body.public-home .home-hero .hero-copy h1 {
  white-space: normal;
}

/* 极窄屏允许换行兜底 */
@media (max-width: 360px) {
  body.public-home .home-hero .hero-copy h1 { white-space: normal; }
}

/* 打字词：去掉旧渐变字（-webkit-text-fill-color:transparent 会压过 color，
   必须一并覆盖，否则打字词被透明填充不可见） */
body.public-home .home-hero .hero-copy h1 span {
  display: inline;
  min-width: 0;
  min-height: 0;
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  color: #fff;
  -webkit-text-fill-color: #fff;
  white-space: nowrap;
}

body.public-home .home-hero .hero-copy h1 i {
  color: rgba(255, 255, 255, .85);
}

/* 描述行：小一号的辅助层级 */
body.public-home .home-hero .hero-copy > p:not(.eyebrow) {
  display: block;
  min-height: 0;
  max-width: 540px;
  margin: 0;
  text-align: left;
  color: rgba(255, 255, 255, .8);
  font-size: 16px;
  line-height: 1.85;
  text-shadow: 0 1px 14px rgba(0, 0, 0, .55);
}

/* 元信息行（对应"房源信息"辅助层级）：小字、弱化、左下 */
body.public-home .home-hero .home-metrics {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 8px 28px;
  margin-top: 26px;
  padding: 14px 0 0;
  border-top: 1px solid rgba(255, 255, 255, .18);
  color: rgba(255, 255, 255, .62);
  font-size: 12.5px;
  letter-spacing: .08em;
}

body.public-home .home-hero .home-metrics span {
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  text-align: left;
}

body.public-home .home-hero .home-metrics strong {
  display: inline;
  margin-right: 6px;
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .02em;
}

/* ── CTA：高对比浅色实底，置于右下角 ── */
body.public-home .home-hero .hero-actions {
  position: absolute;
  z-index: 3;
  right: 6vw;
  bottom: 64px;
  display: flex;
  justify-content: flex-end;
  gap: 14px;
  flex-wrap: wrap;
  margin: 0;
}

body.public-home .home-hero .hero-actions .btn {
  min-width: 0;
  height: 52px;
  padding: 0 30px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .04em;
}

/* 主 CTA：浅色实底 + 深色文字（任意背景上对比度最高） */
body.public-home .home-hero .hero-actions .btn.primary {
  background: #fff;
  color: #0a0f1e;
  border: 0;
  box-shadow: 0 10px 32px rgba(0, 0, 0, .42), 0 0 0 1px rgba(255, 255, 255, .35) inset;
}

body.public-home .home-hero .hero-actions .btn.primary:hover {
  background: #f2f4ff;
  transform: translateY(-1px);
}

/* 次按钮（商务合作）：白色幽灵描边 */
body.public-home .home-hero .hero-actions .btn:not(.primary) {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .5);
  color: #fff;
  backdrop-filter: blur(6px);
  text-shadow: 0 1px 10px rgba(0, 0, 0, .5);
}

body.public-home .home-hero .hero-actions .btn:not(.primary):hover {
  background: rgba(255, 255, 255, .16);
}

/* ── 响应式：窄屏恢复文档流，按钮全宽跟随文案 ── */
@media (max-width: 900px) {
  body.public-home .home-hero {
    min-height: 78vh;
    padding: 104px 20px 44px;
  }

  /* 入场动画在窄屏满宽布局下会注入 translateX(-50%)，把整块文案推出屏幕左缘 */
  body.public-home .home-hero .hero-copy {
    transform: none !important;
  }

  body.public-home .home-hero .hero-copy {
    max-width: 100%;
  }

  body.public-home .home-hero .hero-copy h1 {
    font-size: clamp(38px, 10.5vw, 56px);
  }

  body.public-home .home-hero .hero-actions {
    position: static;
    justify-content: flex-start;
    margin-top: 26px;
  }

  body.public-home .home-hero .hero-actions .btn {
    flex: 1 1 auto;
    height: 48px;
  }

  body.public-home .home-hero .home-metrics {
    gap: 6px 18px;
    margin-top: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.public-home .home-hero .hero-copy h1 span {
    animation: none;
  }
}