/* ============================================================
   关于页（wolfeovo.top/about/）
   背景与名片页完全一致：直接复用 style.6.css 的
   .container / .container_bg_warp（固定模糊头像光晕），
   本文件只排内容。改动请换新文件名（about.2.css）。
   ============================================================ */

/* 无 JS 兜底（桌面基准）；移动端由页内脚本按 100/375 覆写 */
html { font-size: 148px; }

.container { padding: 0 .3rem; }

/* ---------- 返回（与首页「分享」同款胶囊） ---------- */
.about-back {
  position: absolute;
  top: .16rem;
  left: .16rem;
  z-index: 100;
  display: inline-flex;
  align-items: center;
  gap: 1px;
  height: 34px;
  padding: 4px 10px 4px 7px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1;
  color: #6b7280;
  background: hsla(0, 0%, 100%, .75);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
  transition: color .15s ease, transform .15s ease;
}
.about-back:hover { color: #121212; transform: translateX(-1px); }
.about-back svg { width: 14px; height: 14px; display: block; }

/* ---------- 内容列 ---------- */
.about-main {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 448px;
  margin: auto;
  padding: .95rem 0 .85rem;
  text-align: center;
  animation: aboutIn .55s cubic-bezier(.22, .61, .36, 1) both;
}
@keyframes aboutIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .about-main { animation: none; }
}

/* 「关于」小标（衬线来自全站 fleet 字体，与页面其余无衬线形成对比） */
.about-eyebrow {
  margin: 0;
  font-size: .11rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .46em;
  text-indent: .46em;
  color: #9aa0a6;
}

/* 主行：© 2026 Wolfe */
.about-hero {
  margin: .18rem 0 0;
  font-size: .3rem;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -.02em;
  color: #16181c;
}

/* 短屏（1024×768 一类）收紧上下留白，避免多出一截滚动 */
@media (max-height: 820px) {
  .about-main { padding: .6rem 0 .55rem; }
}

/* ---------- 鸣谢 ---------- */
.about-section {
  display: flex;
  align-items: center;
  gap: .14rem;
  margin: .46rem 0 .04rem;
  font-size: .11rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .36em;
  color: #9aa0a6;
}
.about-section span {
  display: inline-block;
  text-indent: .36em;
}
.about-section::before,
.about-section::after {
  content: "";
  flex: 1 1 0;
  height: 1px;
  background: rgba(17, 17, 17, .07);
}

.thanks-list {
  margin: .06rem 0 0;
  padding: 0;
  list-style: none;
  text-align: left;
}
.thanks-list li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .14rem;
  padding: .12rem .04rem;
  border-bottom: 1px solid rgba(17, 17, 17, .055);
}
.thanks-list li:last-child { border-bottom: 0; }
.t-name {
  font-size: .16rem;
  font-weight: 500;
  line-height: 1.4;
  color: #16181c;
}
.t-role {
  font-size: .125rem;
  line-height: 1.5;
  color: #7f858e;
  text-align: right;
}
.t-role .heart { font-size: .95em; }

.about-outro {
  margin: .34rem auto 0;
  max-width: 96%;
  font-size: .12rem;
  line-height: 2;
  color: #7f858e;
  text-wrap: balance;
}
