/* Landing — 独立的一屏极简名片
   不渲染站点 header/footer，不加载站点脚本；除联系方式的悬浮高亮与复制提示外，名片内容无动画与过渡。 */

.landing-card *:not(.landing-contact-link):not(.landing-copy-status),
.landing-card *:not(.landing-contact-link):not(.landing-copy-status)::before,
.landing-card *:not(.landing-contact-link):not(.landing-copy-status)::after {
  animation: none !important;
  transition: none !important;
}

/* 小字灰：纸色上对比度约 6.1:1，满足 WCAG AA；
   --grey-3 只有 4.34:1，12px 的标签与正文不够用 */
body.landing-page {
  --landing-muted: #5c5c5c;
}

/* 内容在整屏内垂直居中；底部预留备案号的空间，
   否则矮视口（如横屏手机）居中后备案号会压到联系方式上 */
body.landing-page main {
  position: relative;
  display: flex;
  flex-direction: column;
  padding-bottom: calc(var(--sp-6) + 1.4rem);
  padding-bottom: calc(var(--sp-6) + 1.4rem + env(safe-area-inset-bottom, 0px));
}

.landing-card {
  width: 100%;
  padding: var(--sp-6) 0;
  /* 用 auto 外边距居中：视口过矮、自由空间为负时自动退化为顶部对齐，内容可滚动 */
  margin: auto 0;
}

.landing-eyebrow {
  margin-bottom: var(--sp-7);
  color: var(--landing-muted);
}

.landing-name {
  font-family: var(--sans);
  font-weight: 200;
  font-size: clamp(4rem, 10.5vw, 9rem);
  line-height: 0.9;
  letter-spacing: -0.04em;
  color: var(--ink);
  /* 行高 0.9 会让字形下溢约 .155em（Inter 升部+降部为 1.21em），
     补等量下内边距，与副标的视觉间距才回到 --sp-6 */
  padding-bottom: 0.155em;
}

.landing-tagline {
  margin-top: var(--sp-6);
  max-width: 34ch;
  font-size: clamp(1rem, 1.3vw, 1.25rem);
  font-weight: 300;
  line-height: 1.7;
  color: var(--landing-muted);
}

.landing-rule {
  width: 100%;
  border: 0;
  border-top: 1px solid var(--ink);
  margin: var(--sp-9) 0 var(--sp-7);
}

.landing-contact {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--sp-3) var(--sp-9);
  font-family: var(--mono);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  line-height: 1.6;
  color: var(--landing-muted);
}

.landing-contact-item {
  display: inline-flex;
  align-items: baseline;
  gap: var(--sp-3);
}

.landing-contact-label {
  color: var(--landing-muted);
}

/* 值本身是按钮：点击复制而不是唤起邮件 / 电话应用；
   重置按钮默认外观，保持与相邻文字同一基线、同一字距 */
.landing-contact-link {
  position: relative;
  isolation: isolate;
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--grey-2);
  background: none;
  font: inherit;
  letter-spacing: inherit;
  color: var(--landing-muted);
  cursor: pointer;
  transition: color 0.2s ease;
}

/* 悬浮高亮：浅灰块从下缘向上铺满，盖掉默认下划线；
   绝对定位 + 负 z-index，不占位、不推动任何文字（CLS = 0） */
.landing-contact-link::before {
  content: "";
  position: absolute;
  inset: -2px -4px -3px;
  z-index: -1;
  background: var(--grey-2);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.22s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.landing-contact-link:focus-visible {
  color: var(--ink);
  border-bottom-color: var(--ink);
  outline: 1px solid var(--ink);
  outline-offset: 3px;
}

/* 鼠标专属：触屏不触发悬浮高亮，避免点击后高亮粘住 */
@media (hover: hover) and (pointer: fine) {
  .landing-contact-link:hover {
    color: var(--ink);
    border-bottom-color: var(--ink);
  }

  .landing-contact-link:hover::before {
    transform: scaleY(1);
  }
}

.landing-contact-link:focus-visible::before {
  transform: scaleY(1);
}

/* 复制反馈：紧贴联系方式下方的一行系统提示——
   无边框、无底色，沿用 PLAYER PROFILE 的等宽小字与字距；
   absolute 定位不占位，出现与消失都不推动任何文字（CLS = 0） */
.landing-copy-status {
  position: absolute;
  top: calc(100% + var(--sp-6));
  left: 0;
  margin: 0;
  font-family: var(--mono);
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  line-height: 1.6;
  color: var(--landing-muted);
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.18s ease;
  pointer-events: none;
}

.landing-copy-status[data-visible] {
  opacity: 1;
}

/* 放在上述规则之后，确保能覆盖各处的 transition 声明 */
@media (prefers-reduced-motion: reduce) {
  .landing-contact-link,
  .landing-contact-link::before,
  .landing-copy-status {
    transition: none;
  }
}

/* 备案号：贴底左对齐，与名片文字左缘同一条竖线，不参与名片的居中布局 */
.landing-legal {
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--sp-6);
  bottom: calc(var(--sp-6) + env(safe-area-inset-bottom, 0px));
  padding-left: var(--sp-7);
  padding-right: var(--sp-7);
  padding-left: max(var(--sp-7), env(safe-area-inset-left, 0px));
  padding-right: max(var(--sp-7), env(safe-area-inset-right, 0px));
  text-align: left;
  font-family: var(--mono);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  line-height: 1.6;
  color: var(--landing-muted);
}

.landing-legal a {
  color: inherit;
}

.landing-legal a:hover,
.landing-legal a:focus-visible {
  color: var(--ink);
}