/* pages/mine/about.wxss
   配色全部走 app.wxss 的暖橙令牌（DESIGN.md §二）。
   原灰金 #D4A853 / 亮橙 #FF8500 / 冷灰底 #F5F5F5 / 两处渐变 / 6×28rpx 的渐变竖条，
   已按 §5.1 与 §四（禁渐变、禁灰金亮橙）收口 */
page {
  background-color: var(--paper);
}

.container {
  min-height: 100vh;
  padding-bottom: 48rpx;
}

/* 品牌信息区：不铺卡面、直接落在纸面上（同首页 hero），去掉原白→暖白渐变。
   纸面本身已是暖白，再叠一层自近白到近白只是噪音，且渐变属硬约束禁止项 */
.brand-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 64rpx 32rpx 48rpx;
}

/* 品牌印记：全页唯一实心块。白色线稿（home-w.png）需要深底才看得见，
   故衬底走 --brand-strong 而非 --brand-soft；阴影用 --shadow-cta 这一档
   暖橙阴影（DESIGN.md §2.3：只给实心 CTA、品牌印记这类小体量元素） */
.logo-wrap {
  width: 160rpx;
  height: 160rpx;
  background: var(--brand-strong);
  border-radius: 36rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-cta);
}

.logo {
  width: 100rpx;
  height: 100rpx;
}

.app-name {
  font-size: 40rpx;
  font-weight: 700;
  color: var(--ink);
  margin-top: 24rpx;
}

.app-slogan {
  font-size: 28rpx;
  font-weight: 500;
  color: var(--brand-ink);
  margin-top: 12rpx;
}

/* 简介区：白卡走「2rpx --line 发丝边 + 中性阴影 + 28rpx 圆角」（DESIGN.md §2.3） */
.intro-section {
  margin: 24rpx 22rpx 0;
  background: var(--white);
  border: 2rpx solid var(--line);
  border-radius: 28rpx;
  padding: 32rpx;
  box-shadow: var(--shadow-card);
}

/* 区块标题：单竖条与全站同一套（8rpx 宽 × 34rpx 高、圆角 4rpx、--brand-strong）。
   原 6×28rpx 走的是灰金→亮橙渐变，换成实色主色。
   字重 600 改 700：中文系统字体通常只有 400/700 两档，600 在真机会随机落回一档 */
.section-title {
  font-size: 32rpx;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 20rpx;
  position: relative;
  padding-left: 20rpx;
}

.section-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 8rpx;
  height: 34rpx;
  background: var(--brand-strong);
  border-radius: 4rpx;
}

.intro-text {
  font-size: 28rpx;
  color: var(--ink-2);
  line-height: 1.8;
  text-align: justify;
}

/* 联系方式：页面尾部的浅橙收口卡，与首页 .quick-item-full、陪诊服务列表页页脚同源。
   浅橙块靠 2rpx --brand-line 描边托形，不加阴影（DESIGN.md §2.3）。
   卡里不再平铺四项——那四项与「联系我们」页完全重合，这里只留一个入口，
   否则同一意图出现两个入口；行内也不再有点击，整块点击行为交给整卡 */
.contact-section {
  margin: 24rpx 22rpx 0;
  background: var(--brand-soft);
  border: 2rpx solid var(--brand-line);
  border-radius: 28rpx;
  padding: 32rpx;
  display: flex;
  align-items: center;
}

.contact-section-hover {
  background: var(--brand-line);
}

.contact-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.contact-name {
  font-size: 32rpx;
  font-weight: 700;
  color: var(--ink);
}

/* 摘要：文案与首页同一张卡一致（人工客服），单行短句，不摊开具体号码 */
.contact-desc {
  margin-top: 8rpx;
  font-size: 26rpx;
  color: var(--muted);
}

/* t-icon 的 color 读不到 CSS 变量，只能硬编码，须与令牌同步（DESIGN.md §2.2）；
   此处对应 --muted #6F655C。项目里 chevron 一律 muted，不抢暖橙焦点 */
.contact-arrow {
  color: #6F655C;
  margin-left: 16rpx;
  flex-shrink: 0;
}

/* 底部版权：元信息一律 --muted，它是全站文字对比度底线，不得再浅（§2.2）；
   .icp 原 22rpx 低于中文最小字号 24rpx，按硬约束 1 提到 24rpx */
.footer-section {
  margin-top: 48rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8rpx;
}

.copyright {
  font-size: 24rpx;
  color: var(--muted);
}

.icp {
  font-size: 24rpx;
  color: var(--muted);
}