/* 问命书公开说明页：像一份可逐条核对的档案卷宗，不把重要边界藏进小字。 */
.legal-page {
  --legal-ink: #252421;
  --legal-muted: #6f6c65;
  --legal-wash: rgba(154, 70, 63, .055);
}

.legal-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px;
  gap: clamp(34px, 7vw, 90px);
  padding: clamp(58px, 8vw, 104px) clamp(24px, 7vw, 96px) clamp(46px, 6vw, 76px);
  border-bottom: 1px solid var(--border-soft);
}

.legal-hero-copy { min-width: 0; }

.legal-hero h1 {
  max-width: 12em;
  margin: 15px 0 22px;
  color: var(--near-black);
  font-family: var(--display);
  font-size: clamp(40px, 5.6vw, 70px);
  font-weight: 600;
  letter-spacing: .045em;
  line-height: 1.22;
}

.legal-hero .knowledge-summary { max-width: 43em; }

.legal-folio {
  align-self: end;
  min-height: 206px;
  padding: 20px;
  border: 1px solid var(--border);
  background: linear-gradient(145deg, rgba(255,255,255,.25), rgba(154,70,63,.035));
  box-shadow: 8px 8px 0 rgba(65, 61, 54, .035);
}

.legal-folio i {
  display: grid;
  width: 47px;
  height: 47px;
  place-items: center;
  border: 2px solid var(--seal);
  border-radius: 50%;
  color: var(--seal);
  font-family: var(--display);
  font-size: 22px;
  font-style: normal;
}

.legal-folio span,
.legal-folio b,
.legal-folio small { display: block; }
.legal-folio span { margin-top: 44px; color: var(--stone); font: 10px/1.5 var(--mono); letter-spacing: .15em; text-transform: uppercase; }
.legal-folio b { margin-top: 7px; color: var(--legal-ink); font: 500 16px/1.5 var(--display); }
.legal-folio small { margin-top: 5px; color: var(--legal-muted); font: 11px/1.6 var(--sans); }

.legal-plain-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 0 clamp(24px, 7vw, 96px);
  border-bottom: 1px solid var(--border-soft);
}

.legal-plain-summary div {
  min-height: 132px;
  padding: 24px 22px 24px 0;
}

.legal-plain-summary div + div { padding-left: 22px; border-left: 1px solid var(--border-soft); }
.legal-plain-summary i { display: block; color: var(--seal); font: normal 10px/1 var(--mono); letter-spacing: .12em; }
.legal-plain-summary b { display: block; margin-top: 12px; color: var(--legal-ink); font: 500 15px/1.55 var(--display); }
.legal-plain-summary p { margin: 7px 0 0; color: var(--legal-muted); font: 12px/1.7 var(--sans); }

.legal-layout {
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  gap: clamp(42px, 7vw, 92px);
  padding: 0 clamp(24px, 7vw, 96px) clamp(70px, 9vw, 116px);
}

.legal-aside { min-width: 0; }
.legal-aside-inner { position: sticky; top: 78px; padding-top: 58px; }
.legal-aside-inner > p { margin: 0 0 15px; color: var(--seal); font: 10px/1.5 var(--mono); letter-spacing: .15em; }
.legal-aside nav { display: grid; border-top: 1px solid var(--border); }
.legal-aside nav a { padding: 10px 0; border-bottom: 1px solid var(--border-soft); color: var(--stone); font: 12px/1.45 var(--sans); text-decoration: none; }
.legal-aside nav a:hover { color: var(--seal); }

.legal-contact-card {
  margin-top: 26px;
  padding: 17px;
  border: 1px solid var(--border-soft);
  background: var(--legal-wash);
}

.legal-contact-card b { display: block; color: var(--near-black); font: 500 14px/1.5 var(--display); }
.legal-contact-card p { margin: 7px 0 12px; color: var(--stone); font: 11px/1.65 var(--sans); }
.legal-contact-card a { color: var(--seal); font: 11px/1.5 var(--mono); overflow-wrap: anywhere; }

.legal-content { min-width: 0; }
.legal-section { padding: 58px 0 50px; border-bottom: 1px solid var(--border-soft); scroll-margin-top: 72px; }
.legal-section:last-child { border-bottom: 0; }

.legal-section-head {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  margin-bottom: 22px;
}

.legal-section-head i { padding-top: 7px; color: var(--seal); font: normal 10px/1 var(--mono); letter-spacing: .1em; }
.legal-section h2 { margin: 0; color: var(--legal-ink); font: 600 clamp(24px, 3vw, 34px)/1.38 var(--display); letter-spacing: .035em; }
.legal-section h3 { margin: 29px 0 10px; color: var(--legal-ink); font: 600 17px/1.55 var(--display); }
.legal-section > p,
.legal-section li { color: #4d4a44; font: 15px/1.95 var(--sans); }
.legal-section > p { margin: 0 0 16px; }
.legal-section ul,
.legal-section ol { margin: 14px 0 20px; padding-left: 1.35em; }
.legal-section li + li { margin-top: 7px; }
.legal-section a { color: var(--seal); text-underline-offset: 3px; }

.legal-note {
  margin: 22px 0;
  padding: 17px 19px;
  border-left: 3px solid var(--seal);
  background: var(--legal-wash);
  color: #4d4a44;
  font: 13px/1.85 var(--sans);
}

.legal-ledger {
  margin: 24px 0 30px;
  border-top: 1px solid var(--border);
}

.legal-ledger-row {
  display: grid;
  grid-template-columns: minmax(120px, .7fr) minmax(0, 1.5fr) minmax(150px, .8fr);
  gap: 20px;
  padding: 18px 0;
  border-bottom: 1px solid var(--border-soft);
}

.legal-ledger-row b { color: var(--legal-ink); font: 500 14px/1.6 var(--display); }
.legal-ledger-row p,
.legal-ledger-row span { margin: 0; color: var(--legal-muted); font: 12px/1.75 var(--sans); }
.legal-ledger-row span { color: var(--seal); }

.legal-table-wrap { overflow-x: auto; margin: 24px 0 28px; }
.legal-table { width: 100%; min-width: 620px; border-collapse: collapse; border-top: 1px solid var(--border); }
.legal-table th,
.legal-table td { padding: 15px 14px 15px 0; border-bottom: 1px solid var(--border-soft); text-align: left; vertical-align: top; }
.legal-table th { color: var(--stone); font: 10px/1.5 var(--mono); letter-spacing: .08em; }
.legal-table td { color: #4d4a44; font: 12px/1.75 var(--sans); }
.legal-table td:first-child { color: var(--legal-ink); font-family: var(--display); font-weight: 600; }

.legal-source-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 22px; background: var(--border-soft); border: 1px solid var(--border-soft); }
.legal-source-list a { min-height: 84px; padding: 17px 18px; background: var(--parchment); text-decoration: none; }
.legal-source-list a span { display: block; color: var(--stone); font: 10px/1.5 var(--mono); }
.legal-source-list a b { display: block; margin-top: 7px; color: var(--legal-ink); font: 500 13px/1.6 var(--sans); }
.legal-source-list a:hover b { color: var(--seal); }

.legal-license-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 23px 0 27px; }
.legal-license-card { padding: 21px; border: 1px solid var(--border-soft); background: rgba(255,255,255,.12); }
.legal-license-card i { color: var(--seal); font: normal 10px/1.5 var(--mono); }
.legal-license-card b { display: block; margin-top: 11px; color: var(--legal-ink); font: 600 16px/1.5 var(--display); }
.legal-license-card p { margin: 8px 0 0; color: var(--legal-muted); font: 12px/1.75 var(--sans); }

@media (max-width: 900px) {
  .legal-hero { grid-template-columns: 1fr 150px; }
  .legal-plain-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .legal-plain-summary div:nth-child(3) { border-left: 0; border-top: 1px solid var(--border-soft); }
  .legal-plain-summary div:nth-child(4) { border-top: 1px solid var(--border-soft); }
  .legal-layout { grid-template-columns: 1fr; gap: 0; }
  .legal-aside-inner { position: static; padding-top: 40px; }
  .legal-aside nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .legal-aside nav a:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--border-soft); }
  .legal-contact-card { max-width: 420px; }
}

@media (max-width: 640px) {
  .legal-hero { grid-template-columns: 1fr; padding-top: 44px; }
  .legal-folio { min-height: 0; }
  .legal-folio span { margin-top: 25px; }
  .legal-plain-summary { grid-template-columns: 1fr; }
  .legal-plain-summary div { min-height: 0; }
  .legal-plain-summary div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--border-soft); }
  .legal-layout { padding-inline: 22px; }
  .legal-aside nav { grid-template-columns: 1fr; }
  .legal-aside nav a:nth-child(even) { padding-left: 0; border-left: 0; }
  .legal-ledger-row { grid-template-columns: 1fr; gap: 5px; }
  .legal-source-list,
  .legal-license-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .legal-page * { scroll-behavior: auto !important; }
}