/* ============================================================
   ZH 中文 TWIN — Global ZH override sheet (UI-Architect §10)
   Kano reserves ONE shared file for all ZH pages.
   Linked AFTER tailwind.css + global-enhancements.css on each ZH page.
   ============================================================ */

/* ---- Self-hosted Noto Serif SC webfont (BigT-approved, Option 1) ----
   879-glyph variable subset (wght 200-900) from the system NotoSerifSC-VF,
   covering every Han + Latin char used on the ZH twin. Loaded on ALL devices
   so the editorial eye-serif renders consistently (no SimSun/Songti roulette). */
@font-face {
  font-family: 'Noto Serif SC';      /* same name as the declared stack, fronts it */
  src: url('./fonts/NotoSerifSC-subset.woff') format('woff');
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* §10 — CJK serif-first display font. The @font-face above fronts the stack,
     so 'Noto Serif SC' resolves to our subset on every system, then falls back
     to Source Han Serif / Songti / SimSun / Georgia if ever needed. */
  --font-headline: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", Georgia, serif;
}

/* ---- BigT: FONT SIZE 80% (homepage first, then roll to sub-pages) ---------
   Scale ALL Chinese text to 80% of the English-equivalent size.
   The site's Tailwind text utilities are rem-based, so shrinking the root
   html font-size scales every rem text unit (headings, body, nav, footer,
   buttons, captions, and JS-injected copy sharing the same classes).
   rem-based spacing scales proportionally too, so layout stays intact. */
html {
  font-size: 80%;
}

/* BigT-approved typography fix #1: on MOBILE bump the readable body/labels
   back up to ~93% (desktop stays at the elegant 80%). Headlines may also
   relax slightly so the CJK serif isn't crammed at 390px. */
@media (max-width: 640px) {
  html { font-size: 92%; }
}

/* BigT-approved typography fix #3: clean CJK line-breaks on display headings
   (hero h1, section h2, card titles) — avoids orphans/widows mid-phrase. */
.font-headline h1,
.font-headline,
h1.font-headline,
h2.font-headline,
h3.font-headline,
.stage-title,
.right-heading {
  text-wrap: balance;
}


/* Neutralize over-wide letter-spacing on uppercase/Latin section labels so
   Han text does not render with dotted gaps. Applies to the shared label classes. */
.text-nv-lime.text-xs,
.text-nv-blue.text-xs,
.text-nv-terracotta.text-xs,
.hero-label,
.stage-subtitle,
.row-label,
.footer-label,
.cat-nav .cat-label,
.view-nav > span {
  letter-spacing: 0.12em !important;
}

/* ---- §1.2 Homepage RECENT COLLABORATIONS overlay cards ---------
   Prevent absolute-overlay ZH text from overrunning the fixed 4:3 box.
   Taller portrait ratio so project name + 2 description lines fit.
   Applied only inside the ZH homepage project cards. */
.zh-proj-card {
  aspect-ratio: 4 / 5;
}
.zh-proj-card .zh-proj-overlay {
  max-height: 100%;
  overflow: hidden;
}

/* ---- §8 List-view image distortion fix (Selected Works) ---------
   In list view the 280px photo would stretch to the height of the long ZH
   description. Force a sane ratio instead of min-height:100%. */
#view-list:checked ~ .projects .project-card .project-image {
  min-height: 0;
  height: auto;
  aspect-ratio: 4 / 3;
}

/* ---- BigT-approved typography fix #2: card text breathing room ----
   Dense CJK descriptions (Selected Works + Leadership cards) get relaxed
   leading + a sensible gap under the card title so they don't read cramped. */
.project-card .project-content,
.project-card .project-description,
.project-card p,
.team-card p,
.team-card .p-6 p,
[class*='team-card'] p {
  line-height: 1.75;
}
.project-card .project-title,
.project-card h3,
.team-card h3 {
  margin-bottom: 0.5rem;
}

/* Optional polish: keep project content pinned to top of card in grid view */
#view-grid:checked ~ .projects .project-card .project-content {
  align-self: flex-start;
}

/* ---- §6.2 Connect: office city label — normalize tracking for Han */
.zh-office-city {
  letter-spacing: normal;
  text-transform: none;
}

/* Keep body stack untouched — body uses PingFang SC / Microsoft YaHei already. */