/* ============================================================
   Kennen · sub-page dimension layouts (张弛 rhythm system)
   loose = 弛 (big serif, whitespace) · tight = 张 (anchored block)
   ============================================================ */

.page-main { padding-top: 96px; }
.page-hero { position: relative; padding: clamp(90px, 14vh, 170px) 0 clamp(50px, 8vh, 90px); }
.page-hero .kicker { display: block; }
.page-hero h1 { font-size: clamp(34px, 5.2vw, 66px); margin: 20px 0 16px; line-height: 1.12; }
.page-hero .lede { font-size: clamp(15px, 1.5vw, 19px); color: var(--moon); max-width: 40em; }
/* 子页 Hero 的魂(本维专属图作背景,右置、混合、文字浮上) */
.page-hero .hbg { position: absolute; right: -4%; top: 50%; transform: translateY(-50%);
  width: min(52vw, 700px); max-height: 150%; object-fit: contain;
  mix-blend-mode: lighten; opacity: .95; z-index: 0; pointer-events: none; }
.page-hero .kicker, .page-hero h1, .page-hero .lede { position: relative; z-index: 1; }
@media (max-width: 880px) { .page-hero .hbg { width: 100vw; right: -18%; opacity: .38; } }

/* 手机端:子页/首页导航维度链接保持可见 */
@media (max-width: 900px) {
  .nav-links { display: flex !important; gap: 12px; }
  .nav-links a { font-size: 11.5px !important; letter-spacing: .02em; }
}
@media (max-width: 560px) { .nav-links a:nth-child(n+5) { display: none; } }

/* 谁归谁表:小屏横向滚动 */
@media (max-width: 760px) { .owns { display: block; overflow-x: auto; white-space: normal; } }

/* 弛 — big breathing statements */
.loose {
  font-family: var(--zh-serif); font-weight: 500;
  font-size: clamp(21px, 2.9vw, 38px); line-height: 1.55;
  color: var(--moon-pure); max-width: 27em;
  margin: clamp(70px, 11vh, 150px) auto;
}
html[data-lang="en"] .loose { font-family: var(--serif); font-weight: 400; }
.loose strong { color: var(--dusk-glow); font-weight: inherit; }
.loose .dim { color: var(--mono-blue); }
.loose.center { text-align: center; }

/* 张 — grounded anchor blocks */
.tight {
  border: 1px solid var(--line); border-left: 2px solid var(--dusk-glow);
  background: rgba(20, 21, 42, .35);
  padding: clamp(26px, 3.2vw, 44px);
  max-width: 50em; margin: clamp(50px, 7vh, 100px) auto;
}
.tight .k {
  font-family: var(--mono); font-size: 12px; letter-spacing: .26em;
  color: var(--dusk-glow); display: block; margin-bottom: 16px; text-transform: uppercase;
}
.tight p { font-size: clamp(14.5px, 1.32vw, 17.5px); line-height: 1.85; margin-bottom: 14px; }
.tight p:last-child { margin-bottom: 0; }
.tight strong { color: var(--moon-pure); font-weight: 600; }
.tight .src { font-family: var(--mono); font-size: 11.5px; color: var(--mono-blue); letter-spacing: .04em; }

/* archival quote card (时代 · 腾讯双响) */
.archive {
  border: 1px solid var(--line); background: var(--ink-2, rgba(12,14,29,.6));
  padding: clamp(22px, 2.6vw, 36px); margin: 18px 0;
}
.archive .adate { font-family: var(--mono); font-size: 12px; color: var(--amber); letter-spacing: .2em; display: block; margin-bottom: 10px; }
.archive .aq { font-family: var(--zh-serif); font-size: clamp(16px, 1.6vw, 20px); color: var(--moon-pure); line-height: 1.7; }
html[data-lang="en"] .archive .aq { font-family: var(--serif); }
.archive .asrc { font-family: var(--mono); font-size: 11px; color: var(--mono-blue); display: block; margin-top: 12px; letter-spacing: .06em; }

/* compare bars (机器 · 12% vs 4%) */
.bars { max-width: 46em; margin: 26px auto 0; }
.bar-row { display: grid; grid-template-columns: minmax(120px, 200px) 1fr 64px; align-items: center; gap: 14px; margin-bottom: 16px; }
.bar-row .bl { font-size: 13.5px; color: var(--moon); }
.bar-row .bt { height: 10px; background: rgba(78,81,128,.18); position: relative; }
.bar-row .bt i { position: absolute; inset: 0 auto 0 0; display: block; }
.bar-row.cold .bt i { background: var(--dusk); }
.bar-row.warm .bt i { background: var(--amber); box-shadow: 0 0 12px -2px var(--amber); }
.bar-row .bv { font-family: var(--mono); font-size: 14px; color: var(--moon-pure); text-align: right; }

/* who-owns-what table (机器) */
.owns { width: 100%; max-width: 54em; margin: 26px auto 0; border-collapse: collapse; }
.owns th, .owns td { border: 1px solid var(--line); padding: 13px 16px; font-size: clamp(13px,1.15vw,15.5px); text-align: left; vertical-align: top; }
.owns th { font-family: var(--mono); font-size: 11.5px; letter-spacing: .14em; color: var(--mono-blue); font-weight: 400; text-transform: uppercase; }
.owns td { color: var(--moon); }
.owns tr.star td { color: var(--moon-pure); background: rgba(227,160,98,.05); border-left: 2px solid var(--amber); }
.owns td b { color: var(--dusk-glow); font-weight: 600; }
.owns tr.star td b { color: var(--amber); }

/* status badges (机器 · 四锚) */
.anchors { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 54em; margin: 26px auto 0; }
.anchor-card { border: 1px solid var(--line); padding: 22px 24px; }
.anchor-card .an { font-family: var(--zh-serif); font-size: 17px; color: var(--moon-pure); margin-bottom: 8px; }
html[data-lang="en"] .anchor-card .an { font-family: var(--serif); }
.anchor-card .ad2 { font-size: 13.5px; color: var(--mono-blue); line-height: 1.7; }
.badge { font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; padding: 3px 9px; border-radius: 2px; margin-left: 8px; vertical-align: 2px; }
.badge.live { color: #9be29b; border: 1px solid rgba(155,226,155,.35); }
.badge.build { color: var(--amber); border: 1px solid rgba(227,160,98,.4); }

/* evidence trio cards (机器 · 外部铁证) */
.trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 60em; margin: 26px auto 0; }
.trio .tcard { border: 1px solid var(--line); padding: 22px; }
.trio .tt { font-family: var(--mono); font-size: 11px; letter-spacing: .2em; color: var(--dusk-glow); display: block; margin-bottom: 10px; }
.trio p { font-size: 13.5px; color: var(--moon); line-height: 1.75; }
.trio b { color: var(--moon-pure); }

/* cold vs warm compare (个人) */
.cw { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 56em; margin: 26px auto 0; }
.cw .cwc { border: 1px solid var(--line); padding: clamp(20px,2.4vw,32px); }
.cw .cwc.warm { border-color: rgba(227,160,98,.45); background: rgba(227,160,98,.04); }
.cw .cwh { font-family: var(--mono); font-size: 11px; letter-spacing: .22em; display: block; margin-bottom: 12px; color: var(--mono-blue); }
.cw .cwc.warm .cwh { color: var(--amber); }
.cw p { font-size: 14px; line-height: 1.8; color: var(--moon); }
.cw .cwc.warm p { color: var(--moon-pure); }

/* origin timeline */
.timeline { position: relative; max-width: 780px; margin: 0 auto; padding-left: 46px; }
.timeline::before { content: ""; position: absolute; left: 13px; top: 6px; bottom: 6px; width: 1px;
  background: linear-gradient(to bottom, rgba(123,126,224,.55), rgba(78,81,128,.12)); }
.tnode { position: relative; margin-bottom: clamp(52px, 8vh, 92px); }
.tnode::before { content: ""; position: absolute; left: -37px; top: 9px; width: 9px; height: 9px; border-radius: 50%;
  background: var(--amber); box-shadow: 0 0 16px rgba(227,160,98,.8); }
.tnode .tdate { font-family: var(--mono); font-size: 12px; letter-spacing: .22em; color: var(--dusk-glow); display: block; margin-bottom: 10px; text-transform: uppercase; }
.tnode h3 { font-family: var(--zh-serif); font-size: clamp(19px, 2vw, 26px); color: var(--moon-pure); margin-bottom: 12px; font-weight: 500; }
html[data-lang="en"] .tnode h3 { font-family: var(--serif); font-weight: 400; }
.tnode p { font-size: clamp(14px, 1.3vw, 16.5px); color: var(--moon); max-width: 36em; }
.interlude { font-family: var(--zh-serif); font-style: normal; font-size: clamp(15px, 1.5vw, 19px);
  color: var(--mono-blue); margin: -26px 0 clamp(52px,8vh,92px); padding-left: 2px; max-width: 34em; line-height: 1.8; }
html[data-lang="en"] .interlude { font-family: var(--serif); font-style: italic; }

/* page image */
.pimg { display: block; width: 100%; max-width: 880px; margin: clamp(44px,6vh,80px) auto; mix-blend-mode: lighten; }
.pimg.small { max-width: 460px; }

/* four lenses list (时代 · 殊途同归) */
.lenses { max-width: 50em; margin: 22px auto 0; }
.lenses li { list-style: none; border-top: 1px solid var(--line); padding: 16px 4px; font-size: clamp(14px,1.3vw,16.5px); color: var(--moon); line-height: 1.8; }
.lenses li b { color: var(--moon-pure); }
.lenses li:last-child { border-bottom: 1px solid var(--line); }

/* two-sides (时代 · 平权×兑现) */
.sides { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 56em; margin: 30px auto 0; }
.sides .side { border: 1px solid var(--line); padding: clamp(22px,2.6vw,36px); }
.sides .sh { font-family: var(--zh-serif); font-size: 18px; color: var(--moon-pure); display: block; margin-bottom: 10px; }
html[data-lang="en"] .sides .sh { font-family: var(--serif); }
.sides p { font-size: 14px; color: var(--moon); line-height: 1.8; }

/* next-doors footer nav on sub-pages */
.next-doors { display: flex; gap: 22px; justify-content: center; flex-wrap: wrap; margin: clamp(60px,9vh,110px) auto clamp(40px,6vh,70px); }
.next-doors a { font-family: var(--mono); font-size: 13px; letter-spacing: .08em; color: var(--mono-blue); text-decoration: none; border-bottom: 1px solid transparent; padding-bottom: 3px; transition: color .3s, border-color .3s; }
.next-doors a:hover { color: var(--dusk-glow); border-color: var(--dusk-glow); }

/* homepage doors */
.overture-beats { text-align: center; padding-block: clamp(90px, 13vh, 170px); }
.overture-beats .vision-line { font-family: var(--zh-serif); font-weight: 500; font-size: clamp(24px, 3.6vw, 46px); line-height: 1.4; color: var(--moon-pure); max-width: 22em; margin: 0 auto 26px; }
html[data-lang="en"] .overture-beats .vision-line { font-family: var(--serif); font-weight: 400; }
.overture-beats .vision-line strong { color: var(--dusk-glow); font-weight: inherit; }
.overture-beats .hook { font-family: var(--zh-serif); font-size: clamp(15px, 1.6vw, 20px); color: var(--mono-blue); max-width: 34em; margin: 0 auto clamp(48px,7vh,80px); line-height: 1.9; }
html[data-lang="en"] .overture-beats .hook { font-family: var(--serif); font-style: italic; }
.overture-beats .doors-q { font-family: var(--mono); font-size: 12.5px; letter-spacing: .26em; color: var(--mono-blue); display: block; margin-bottom: 26px; text-transform: uppercase; }
.doors { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; max-width: 1120px; margin: 0 auto; text-align: left; }
.door { border: 1px solid var(--line); padding: 26px 22px 24px; text-decoration: none; display: block; position: relative; transition: border-color .4s var(--ease), background .4s, transform .4s var(--ease); }
.door:hover { transform: translateY(-4px); background: var(--ink-2, rgba(20,21,42,.5)); }
.door .dnum { font-family: var(--mono); font-size: 11px; letter-spacing: .24em; color: var(--mono-blue); display: block; margin-bottom: 14px; }
.door .dt { font-family: var(--zh-serif); font-size: clamp(19px, 1.8vw, 24px); color: var(--moon-pure); display: block; margin-bottom: 4px; font-weight: 500; }
html[data-lang="en"] .door .dt { font-family: var(--serif); font-weight: 400; }
.door .den { font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--mono-blue); display: block; margin-bottom: 12px; }
.door .dd { font-size: 13px; color: var(--moon); opacity: .85; line-height: 1.7; }
.door.d-age:hover { border-color: rgba(123,126,224,.6); }
.door.d-person:hover { border-color: rgba(227,160,98,.55); }
.door.d-machine:hover { border-color: rgba(123,126,224,.6); }
.door.d-origin:hover { border-color: rgba(233,231,242,.4); }

@media (max-width: 980px) { .doors { grid-template-columns: 1fr 1fr; } .trio { grid-template-columns: 1fr; } .anchors { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .doors { grid-template-columns: 1fr; } .cw, .sides { grid-template-columns: 1fr; } .timeline { padding-left: 36px; } }

/* 第五扇缝(首页 Say No 入口) */
.no-seam { display: block; max-width: 1120px; margin: 26px auto 0; padding: 26px 28px;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  text-decoration: none; text-align: center; position: relative;
  transition: border-color .45s var(--ease), background .45s; }
.no-seam:hover { border-color: rgba(227,160,98,.5); background: rgba(227,160,98,.03); }
.no-seam .ns-line { display: block; font-family: var(--zh-serif); font-size: clamp(15px,1.6vw,20px); color: var(--moon); margin-bottom: 10px; }
html[data-lang="en"] .no-seam .ns-line { font-family: var(--serif); }
.no-seam .ns-line b { color: var(--moon-pure); font-weight: 600; }
.no-seam .ns-cta { font-family: var(--mono); font-size: 12.5px; letter-spacing: .18em; color: var(--amber); }

/* ===== 首页插画布局修正:宽图一律全宽成"带",Hero 魂放大占住画面 ===== */
.hero-soul { opacity: 1; }
.hero-soul img { object-position: 72% center; transform: scale(1.15); transform-origin: 72% 45%; }
@media (max-width: 880px) { .hero-soul img { transform: none; object-position: right center; } }

/* 哲学区:wissen→kennen 宽图从半栏改为全宽横带(文上图下) */
.philo-grid { grid-template-columns: 1fr !important; }
.philo-soul { order: 2; width: 100% !important; min-height: 0 !important; margin-top: clamp(26px, 4vh, 54px); }

/* 证据区:时间序列宽图同样全宽 */
.evidence-head { grid-template-columns: 1fr !important; }
.evidence-soul { width: 100% !important; min-height: 0 !important; margin-top: 12px; }

/* 收口区:生长之树宽图放大 */
.closing-soul { width: min(1020px, 92vw) !important; }