/* 站点 4 · paper：白色文档风，蓝色强调、细边框、大留白、粘性侧栏与编号步骤。 */

:root {
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-2: #f7f8fa;
  --text: #16181c;
  --muted: #636b76;
  --line: #e7e9ee;
  --accent: #2563eb;
  --accent-2: #f59e0b;
  --accent-contrast: #ffffff;
  --radius: 10px;
  --radius-sm: 6px;
  --head-font: var(--font-sans);
}

body { background: var(--bg); }

h1 { font-weight: 650; letter-spacing: -0.025em; }
h2 { font-weight: 650; letter-spacing: -0.015em; }

.site-head { background: rgba(255, 255, 255, 0.92); border-bottom: 1px solid var(--line); }
.brand-text strong { font-weight: 700; }
.site-nav a { font-size: 0.9rem; }
.site-nav a.is-active { color: var(--accent); box-shadow: none; background: #eef3fe; border-radius: 6px; }
.head-cta { border-radius: 6px; background: var(--accent); }
.sub-nav { background: #fbfcfe; }

.eyebrow { color: var(--accent); letter-spacing: 0.14em; }
.hero--docs { background: linear-gradient(180deg, #f8faff, #ffffff 78%); border-bottom: 1px solid var(--line); }
.hero--docs h1 { font-size: clamp(2rem, 4vw, 3.2rem); }
.doc-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; }
@media (max-width: 560px) {
  .doc-cards { grid-template-columns: 1fr; }
}
.doc-cards a { border: 1px solid var(--line); border-radius: 10px; background: var(--surface); padding: 1rem 1.1rem; transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.doc-cards a:hover { border-color: var(--accent); box-shadow: 0 10px 24px rgba(37, 99, 235, 0.08); }
.doc-cards strong { font-size: 0.96rem; }
.doc-cards strong::before {
  content: attr(data-index);
}
.doc-cards span { font-size: 0.82rem; color: var(--muted); }

.btn { border-radius: 6px; }
.btn--primary { background: var(--accent); }
.btn--ghost { border-color: var(--line); }
.btn--ghost:hover { border-color: var(--accent); color: var(--accent); }

.section-head h2 { font-size: 1.35rem; }
.section-head p { font-size: 0.9rem; }
.card { border-radius: 10px; background: var(--surface); }
.card:hover { border-color: #c9d4e8; box-shadow: 0 8px 24px rgba(16, 24, 40, 0.06); }
.card:hover .cover img { transform: none; }
.card-title { font-size: 0.98rem; }
.card-state { border-radius: 4px; background: #f3f6fb; border-color: #dbe3f0; color: var(--accent); }
.card-note { color: var(--muted); font-size: 0.8rem; }
.chip { border-radius: 4px; }

.topic-grid a { border-radius: 10px; border-color: var(--line); box-shadow: none; }
.topic-grid a:hover { border-color: #c9d4e8; }
.topic-grid strong { font-size: 1rem; }
.topic-grid span { color: var(--accent); font-size: 0.76rem; }

.steps { counter-reset: step; }
.steps li { border-radius: 10px; background: #fbfcfe; }
.step-no { color: var(--accent); }
.steps--vertical li {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 1rem 1.1rem;
  background: var(--surface);
}
.steps--vertical .step-no {
  display: grid;
  place-items: center;
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 50%;
  background: #eef3fe;
  font-size: 0.78rem;
}

details { border-radius: 10px; border-color: var(--line); background: var(--surface); }
details[open] { border-color: #c9d4e8; background: #fbfcfe; }
details summary::after { color: var(--accent); }

@media (min-width: 1025px) {
  .two-col { grid-template-columns: 1.6fr 0.8fr; }
}
.detail-aside { position: sticky; top: 84px; border-radius: 10px; background: #fbfcfe; }
.detail-aside h2 { font-size: 0.88rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.08em; }
.prose h2 { font-size: 1.18rem; }
.prose p { font-size: 0.96rem; }
.info-table { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.info-table th { background: #fafbfd; }
.link-list li { border-bottom-color: var(--line); }
.article-card { border-top: 3px solid var(--accent); }
.article-meta { color: var(--muted); text-transform: none; letter-spacing: 0.02em; }
.guide-grid a { border-radius: 10px; background: var(--surface); }
.guide-grid a:hover { border-color: #c9d4e8; }
.site-foot { background: #fafbfd; }
.cover--fallback { background: linear-gradient(135deg, #eef3fe, #f7f8fa); }