/* =========================================================
   子页面样式（about / terms / refund / faq / contact / 404）
   复用 site.css 的按钮、导航、页脚，这里只补「内容页」排版
   ========================================================= */

/* ---------- 页头（比首页 hero 矮，不抢戏） ---------- */
.page-head{
  position:relative;overflow:hidden;
  background:linear-gradient(150deg,#f4f9ff,#eef6ff 55%,#f7fbff);
  border-bottom:1px solid #e2ecff;padding:52px 0 44px;
}
.page-head::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(480px 260px at 12% 10%,rgba(56,189,248,.20),transparent 66%),
    radial-gradient(420px 240px at 88% 20%,rgba(14,165,233,.16),transparent 66%);
  animation:hiBreath 6.5s ease-in-out infinite alternate;
}
.page-head .wrap{position:relative}
.page-title{font-size:31px;font-weight:800;letter-spacing:-.015em}
.page-desc{margin-top:10px;color:var(--muted);font-size:15px;max-width:660px}
/* 面包屑 */
.crumb{font-size:13px;color:var(--muted);margin-bottom:14px}
.crumb a{color:var(--brand)}
.crumb span{margin:0 7px;color:#c3ccd8}

/* ---------- 正文排版 ---------- */
.section.page{padding:54px 0}
.prose{max-width:820px}
.prose p{color:var(--ink-2);font-size:15px;line-height:1.95;margin-bottom:16px}
.prose h2{font-size:22px;font-weight:800;margin:34px 0 14px;scroll-margin-top:90px}
.prose h3{font-size:17px;font-weight:700;margin:24px 0 10px;scroll-margin-top:90px}
.prose ul,.prose ol{margin:0 0 16px 20px;color:var(--ink-2);font-size:15px;line-height:1.9}
.prose li{margin-bottom:6px}
.prose strong{color:var(--ink)}
.prose .note{
  background:#f6f9ff;border:1px solid #e2ecff;border-left:3px solid var(--brand);
  border-radius:0 10px 10px 0;padding:14px 18px;font-size:14.5px;color:var(--ink-2);margin:18px 0;
}
.prose .warn{
  background:#fff7ed;border:1px solid #fde3c4;border-left:3px solid #d97706;
  border-radius:0 10px 10px 0;padding:14px 18px;font-size:14.5px;color:#8a4b06;margin:18px 0;
}
.prose .upd{font-size:13px;color:var(--muted);margin-bottom:26px}

/* ---------- 双栏：侧边目录 + 正文 ---------- */
.doc{display:grid;grid-template-columns:210px 1fr;gap:44px;align-items:start}
.toc{position:sticky;top:88px}
.toc h4{font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--muted);margin-bottom:12px}
.toc a{
  display:block;font-size:14px;color:var(--ink-2);padding:7px 12px;border-radius:8px;
  border-left:2px solid var(--line);transition:.15s;
}
.toc a:hover{color:var(--brand);background:#f5f9ff}
.toc a.on{color:var(--brand);font-weight:600;border-left-color:var(--brand);background:#eef5ff}

/* ---------- 卡片网格（关于页 / 联系页） ---------- */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:8px}
.tile{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;
  animation:floatY 8s ease-in-out infinite alternate, breatheShadow 6.5s ease-in-out infinite alternate;
}
.tile:nth-child(2){animation-delay:-1.4s,-1.1s}
.tile:nth-child(3){animation-delay:-2.8s,-2.2s}
.tile-ico{
  width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:19px;margin-bottom:12px;
  background:linear-gradient(135deg,#e8f0ff,#e6f7ff);box-shadow:0 10px 22px -12px rgba(29,99,237,.7);
}
.tile h3{font-size:16px;font-weight:700;margin-bottom:8px}
.tile p{font-size:14px;color:var(--muted);line-height:1.75}

/* ---------- 时间线（关于页） ---------- */
.timeline{margin-top:8px;position:relative;padding-left:26px}
.timeline::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--brand),var(--brand-2),transparent)}
.tl-item{position:relative;padding-bottom:24px}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{
  content:"";position:absolute;left:-24px;top:6px;width:10px;height:10px;border-radius:50%;
  background:#fff;border:2px solid var(--brand);box-shadow:0 0 0 4px rgba(29,99,237,.12);
}
.tl-date{font-size:12.5px;font-weight:700;color:var(--brand);letter-spacing:.02em}
.tl-item h3{font-size:16px;font-weight:700;margin:4px 0 6px}
.tl-item p{font-size:14px;color:var(--muted);line-height:1.75}

/* ---------- 联系信息条 ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.contact-info{display:grid;gap:14px}
.ci-row{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);padding:16px 18px}
.ci-ico{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:17px;flex:none;background:linear-gradient(135deg,#e8f0ff,#e6f7ff)}
.ci-row b{display:block;font-size:14.5px;font-weight:700}
.ci-row span{font-size:13.5px;color:var(--muted);line-height:1.6}
.ci-row a{color:var(--brand)}

/* ---------- 表单 ---------- */
.form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.field{margin-bottom:16px}
.field label{display:block;font-size:13.5px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
.field input,.field select,.field textarea{
  width:100%;font-family:inherit;font-size:14.5px;color:var(--ink);
  border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff;transition:.15s;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(29,99,237,.12);
}
.field input.bad,.field textarea.bad{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.1)}
.field textarea{min-height:132px;resize:vertical;line-height:1.7}
.field .hint{font-size:12.5px;color:var(--muted);margin-top:6px}
.form-tip{
  font-size:13.5px;border-radius:10px;padding:10px 14px;margin-bottom:14px;line-height:1.6;
}
.form-tip.err{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
.form-tip.ok{background:#f0fdf4;color:#15803d;border:1px solid #bbf7d0}
.form-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.form-foot span{font-size:12.5px;color:var(--muted)}

/* ---------- 页脚底部条款链接 ---------- */
.footer-bottom .footer-links{display:flex;gap:16px;flex-wrap:wrap}
.footer-bottom .footer-links a{color:#63748f;transition:.16s}
.footer-bottom .footer-links a:hover{color:#7dd3fc}

/* ---------- 轻提示（面板未上线时拦截跳转用） ---------- */
#toast{
  position:fixed;left:50%;bottom:96px;transform:translateX(-50%) translateY(14px);
  z-index:90;max-width:min(92vw,460px);
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:12px 18px;font-size:14px;color:var(--ink-2);
  box-shadow:0 18px 40px -18px rgba(15,23,42,.45);
  opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;
}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
#toast a{color:var(--brand);font-weight:600}

/* ---------- 404 ---------- */
.err-wrap{text-align:center;padding:90px 0 100px}
.err-code{
  font-size:96px;font-weight:800;line-height:1;letter-spacing:-.04em;
  background:linear-gradient(135deg,var(--brand),var(--brand-2) 70%,#38bdf8);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.err-wrap h1{font-size:25px;font-weight:800;margin:18px 0 10px}
.err-wrap p{color:var(--muted);font-size:15px;margin-bottom:26px}

/* ---------- 回到顶部 ---------- */
#backTop{
  position:fixed;right:22px;bottom:92px;width:42px;height:42px;border-radius:50%;
  background:#fff;border:1px solid var(--line);color:var(--ink-2);font-size:17px;cursor:pointer;
  display:grid;place-items:center;box-shadow:0 12px 26px -14px rgba(15,23,42,.5);
  opacity:0;pointer-events:none;transition:.22s;z-index:70;
}
#backTop.show{opacity:1;pointer-events:auto}
#backTop:hover{color:var(--brand);border-color:var(--brand);transform:translateY(-2px)}

/* ---------- 响应式 ---------- */
@media (max-width:1000px){
  .doc{grid-template-columns:1fr;gap:0}
  .toc{display:none}
  .card-grid,.contact-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .page-head{padding:38px 0 32px}
  .page-title{font-size:24px}
  .section.page{padding:40px 0}
  .card-grid,.contact-grid{grid-template-columns:1fr;gap:16px}
  .err-wrap{padding:60px 0 70px}
  .err-code{font-size:68px}
  #backTop{right:16px;bottom:86px}
}
