/* ============================================================
   4SHQ · English locale overrides
   Loaded after main.css, only on /en pages.
   Latin typography: tighter tracking, shorter leading,
   serif stack that renders well outside macOS.
   ============================================================ */

:root{
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,"Noto Sans",sans-serif;
}

body{line-height:1.72; letter-spacing:0}
p{margin:0 0 1.05em}

/* ---------- headings: negative tracking for Latin ---------- */
.h-display{letter-spacing:-.018em; line-height:1.1}
.h2{letter-spacing:-.014em; line-height:1.2}
.h3{letter-spacing:-.01em; line-height:1.34}
.lead{line-height:1.7; max-width:66ch}
.hero h1{letter-spacing:-.022em; line-height:1.06; max-width:19ch}
.phead h1{letter-spacing:-.022em; line-height:1.1; max-width:none}
.hero__sub{line-height:1.72; max-width:50ch}
.hero__eyebrow{letter-spacing:.2em}
.phead .lead{max-width:58ch}
.kicker{letter-spacing:.18em}

/* ---------- header ---------- */
.brand-txt b{letter-spacing:.14em; font-size:16px}
.brand-txt span{letter-spacing:.1em; font-size:8px; white-space:normal; max-width:210px; line-height:1.55}
.nav{gap:clamp(12px,1.8vw,26px)}
.nav a{font-size:13px; letter-spacing:.01em}
.hd__cta{font-size:12px; letter-spacing:.05em; padding:11px 18px}

/* language switch styling lives in main.css so both locales share it */

/* ---------- hero epigraph (replaces the vertical Chinese verse) ---------- */
.epi{
  max-width:358px; padding-left:clamp(20px,2.6vw,36px);
  border-left:1px solid var(--line-light);
}
.epi__cap{
  font-family:var(--mono); font-size:9px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--blue-l); line-height:1.9; margin-bottom:clamp(18px,2.4vw,28px);
}
.epi__verse p{
  font-family:var(--serif); font-size:clamp(.96rem,1.12vw,1.1rem); line-height:1.5;
  letter-spacing:-.005em; margin:0; padding:11px 0;
  border-bottom:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.88);
}
.epi__verse p:last-child{border-bottom:0; padding-bottom:0}
.epi__verse p:nth-child(2){color:rgba(255,255,255,.79)}
.epi__verse p:nth-child(3){color:rgba(255,255,255,.71)}
.epi__verse p:nth-child(4){color:rgba(255,255,255,.63)}

/* ---------- verse block for the brand-story section ---------- */
.verse{border-top:1px solid var(--ink); padding-top:4px}
.verse > div{
  display:grid; grid-template-columns:32px 1fr; gap:14px; align-items:baseline;
  padding:15px 0; border-bottom:1px solid var(--line-soft);
}
.verse span{font-family:var(--mono); font-size:9.5px; letter-spacing:.16em; color:var(--gold)}
.verse p{
  font-family:var(--serif); font-size:clamp(1rem,1.42vw,1.22rem); line-height:1.42;
  letter-spacing:-.006em; margin:0; color:var(--text);
}
.verse > div:nth-child(2) p{opacity:.9}
.verse > div:nth-child(3) p{opacity:.79}
.verse > div:nth-child(4) p{opacity:.68}
.verse p.verse__src{
  font-family:var(--mono); font-size:9.5px; letter-spacing:.15em; text-transform:uppercase;
  color:var(--muted); opacity:.75; line-height:1.8; margin:18px 0 0;
}

/* ---------- dense text blocks ---------- */
.facts h4{letter-spacing:.03em; line-height:1.4}
.facts p{line-height:1.68}
.cl__row{grid-template-columns:58px 1.2fr 1.52fr minmax(46px,auto); gap:clamp(16px,2.6vw,40px)}
.cl__name{letter-spacing:-.004em; line-height:1.32}
.cl__name em{letter-spacing:.12em; font-size:10.5px; margin-top:8px}
.cl__desc{line-height:1.7; font-size:14px}
.dir__cell p{line-height:1.7}
.dir__cell li{line-height:1.55; padding:10px 0}
.card h4,.proc h4,.mission h4{letter-spacing:-.004em; line-height:1.34}
.card p{line-height:1.7}
.mission p{line-height:1.7}
.notes li{line-height:1.72}
.ft__brand b{letter-spacing:.02em; line-height:1.35; max-width:26ch}
.ft__brand span{letter-spacing:.1em}
.ft__bot{letter-spacing:.1em; text-transform:none}
.ft__copy{line-height:1.9}
.ft a{line-height:1.5}

/* ---------- tables ---------- */
.tbl{font-size:13.2px}
.tbl caption{letter-spacing:-.005em; line-height:1.4}
.tbl td{line-height:1.6}
.tbl thead th{letter-spacing:.13em}
.tbl td:first-child{width:56px}
.formula p{letter-spacing:0}

/* ---------- legal ---------- */
.legal p,.legal li{line-height:1.75}
.legal h4{letter-spacing:.01em}
.legal h5{letter-spacing:.01em}

/* ---------- buttons ---------- */
.btn{letter-spacing:.03em}
.hd__cta span{letter-spacing:.04em}

/* ---------- misc ---------- */
.err-links b{letter-spacing:-.005em}
.err-links em{line-height:1.6}
.notebox{line-height:1.75}

/* ---------- responsive ---------- */
@media (max-width:1120px){
  .brand-txt span{max-width:150px}
  .nav{gap:14px}
  .nav a{font-size:12.5px}
  .hd__cta{padding:10px 14px; font-size:11.5px}
}
@media (max-width:1080px){
  .epi{display:none}
}
@media (max-width:860px){
  .brand-txt span{max-width:150px}
}
@media (max-width:560px){
  .brand-txt span{display:none}
  .hd__cta{display:none}
}