/* =============================================================================
   XINREN — PAGE-SPECIFIC STYLES
   Load after common.css
   ============================================================================= */

body { background-color: var(--paper); color: var(--ink); font-family: var(--font-body); font-size: 1rem; line-height: 1.75; }
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 700; line-height: 1.2; color: var(--ink); }
.breadcrumb__list a, .breadcrumb__list span { font-family: var(--font-mono); font-size: 0.65rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mid); text-decoration: none; }
.article-header__glyph { font-family: var(--font-display); font-size: clamp(5rem, 14vw, 10rem); line-height: 0.9; color: var(--paper-tint); display: block; text-align: center; margin-bottom: var(--space-s); border-bottom: 2px solid var(--rule); padding-bottom: var(--space-m); }
@media (min-width: 960px) { .article-header__glyph { font-size: 8rem; text-align: right; color: rgba(212,207,197,0.5); border-bottom: none; padding-bottom: 0; margin-bottom: 0; } }
.trust-progression { margin-block: var(--space-xl); position: relative; }
.trust-progression__caption { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--mid); display: block; margin-bottom: var(--space-l); padding-bottom: var(--space-xs); border-bottom: 1px solid var(--rule); }
.stage { display: grid; grid-template-columns: 3.5rem 1fr; gap: 0; margin-bottom: 0; position: relative; }
.stage__track { display: flex; flex-direction: column; align-items: center; padding-top: var(--space-m); }
.stage__num { width: 2rem; height: 2rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-mono); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.04em; flex-shrink: 0; z-index: 1; position: relative; }
.stage--1 .stage__num { background-color: var(--paper-tint); border: 2px solid var(--rule); color: var(--light); }
.stage--2 .stage__num { background-color: var(--paper-tint); border: 2px solid var(--mid); color: var(--mid); }
.stage--3 .stage__num { background-color: var(--paper); border: 2px solid var(--ink); color: var(--ink); }
.stage--4 .stage__num { background-color: var(--ink); border: 2px solid var(--ink); color: var(--paper); }
.stage--5 .stage__num { background-color: var(--ink); border: 2px solid var(--gold); color: var(--gold); }
.stage__line { width: 2px; flex: 1; min-height: var(--space-l); }
.stage--1 .stage__line { background-color: var(--rule); }
.stage--2 .stage__line { background-color: var(--rule); }
.stage--3 .stage__line { background-color: var(--mid); }
.stage--4 .stage__line { background-color: var(--ink); }
.stage--5 .stage__line { display: none; }
.stage__content { padding: var(--space-m) var(--space-l) var(--space-l) var(--space-m); border-left: 1px solid transparent; margin-bottom: var(--space-s); }
.stage--1 .stage__content { border-left-color: var(--rule); }
.stage--2 .stage__content { border-left-color: var(--rule); }
.stage--3 .stage__content { border-left-color: var(--mid); }
.stage--4 .stage__content { border-left-color: var(--ink); }
.stage--5 .stage__content { border-left-color: var(--gold); }
.stage__name { font-family: var(--font-display); font-size: 1.05rem; font-weight: 700; color: var(--ink); display: block; margin-bottom: 0.2rem; }
.stage__name-zh { font-family: var(--font-mono); font-size: 0.6rem; letter-spacing: 0.08em; color: var(--light); display: block; margin-bottom: var(--space-m); }
.stage__rows { display: grid; grid-template-columns: 1fr; gap: var(--space-s); }
@media (min-width: 500px) {
.stage__rows { grid-template-columns: repeat(3, 1fr); }
}
.stage__row-label { font-family: var(--font-mono); font-size: 0.57rem; letter-spacing: 0.13em; text-transform: uppercase; display: block; margin-bottom: 0.3rem; }
.stage__row-label--entry   { color: var(--mid); }
.stage__row-label--unlocks { color: var(--gold); }
.stage__row-label--setback { color: var(--red); }
.stage__row-text { font-size: 0.84rem; line-height: 1.6; color: var(--ink); margin-bottom: 0; }
.stage--1 .stage__row-text { color: var(--mid); }
@media (max-width: 499px) {
.stage__grid-cell { padding-bottom: var(--space-xs); border-bottom: 1px solid var(--rule); margin-bottom: var(--space-xs); }
.stage__grid-cell:last-child { border-bottom: none; }
.stage { grid-template-columns: 2.5rem 1fr; }
}
.dual-table { display: grid; grid-template-columns: 1fr; gap: var(--space-s); margin-block: var(--space-l); }
@media (min-width: 560px) { .dual-table { grid-template-columns: 1fr 1fr; } }
.dual-col { border: 1px solid var(--rule); }
.dual-col--accelerate { border-top: 3px solid var(--gold); }
.dual-col--reset      { border-top: 3px solid var(--red); }
.dual-col__head { padding: var(--space-s) var(--space-m); border-bottom: 1px solid var(--rule); background-color: var(--paper-tint); }
.dual-col__label { font-family: var(--font-mono); font-size: 0.6rem; letter-spacing: 0.14em; text-transform: uppercase; display: block; }
.dual-col--accelerate .dual-col__label { color: var(--gold); }
.dual-col--reset .dual-col__label      { color: var(--red); }
.dual-col__title { font-family: var(--font-display); font-size: 0.95rem; font-weight: 700; color: var(--ink); margin-top: 0.2rem; }
.dual-col__items { list-style: none; padding: 0; }
.dual-col__items li { padding: var(--space-xs) var(--space-m); border-bottom: 1px solid var(--rule); font-size: 0.86rem; line-height: 1.6; color: var(--ink); display: grid; grid-template-columns: 1rem 1fr; gap: 0.5rem; align-items: start; margin-bottom: 0; }
.dual-col__items li:last-child { border-bottom: none; }
.dual-col--accelerate .dual-col__items li::before { content: '↑'; color: var(--gold); font-family: var(--font-mono); font-size: 0.7rem; padding-top: 0.18rem; }
.dual-col--reset .dual-col__items li::before      { content: '↓'; color: var(--red); font-family: var(--font-mono); font-size: 0.7rem; padding-top: 0.18rem; }

@media print {
  .site-header, .site-nav, .article-sidebar, .site-footer, .breadcrumb { display: none; }
  h1,h2,h3 { page-break-after: avoid; }
  .stage, .field-example, .key-fact { page-break-inside: avoid; }
  .stage__rows, .dual-table { display: block; }
  .wrap, .wrap--wide { max-width: 100%; padding: 0; }
}