/* T4-D4-A: shared reading scale for all three real case studies. */
.t4c-case{
  --case-type-display:'Instrument Serif',Georgia,serif;
  --case-type-reading:Inter,'Noto Sans SC','Microsoft YaHei',sans-serif;
  --case-type-h1:clamp(68px,6.55vw,96px);
  --case-type-h2:clamp(31px,2.7vw,39px);
  --case-type-h3:21px;
  --case-type-body:17px;
  --case-type-caption:14px;
  font-family:var(--case-type-reading);
}
.t4c-case .case-hero{padding-top:clamp(52px,5vw,76px)}
.t4c-case .case-heading{gap:clamp(44px,5vw,76px)}
.t4c-case .case-hero h1{
  font-family:var(--case-type-display);
  font-size:var(--case-type-h1);
  line-height:.96;
  letter-spacing:-.036em;
  text-wrap:balance;
}
.t4c-case .case-hero h1>span{font-size:25px;letter-spacing:-.015em;line-height:1.35}
.t4c-case .case-statement{
  font-size:clamp(25px,2.15vw,31px);
  line-height:1.5;
  letter-spacing:-.025em;
  max-width:25ch;
  margin-top:28px;
  text-wrap:pretty;
}
.t4c-case .case-intro{font-size:var(--case-type-body);line-height:1.85;max-width:40ch}
.t4c-case .case-kicker{font-size:14px;letter-spacing:.025em;line-height:1.7}
.t4c-case .case-section{padding-block:72px}
.t4c-case .case-section h2{
  font-family:var(--case-type-reading);
  font-size:var(--case-type-h2);
  font-weight:500;
  line-height:1.38;
  letter-spacing:-.03em;
  max-width:26ch;
  margin-bottom:28px;
  text-wrap:pretty;
}
.t4c-case .case-section h3{font-size:var(--case-type-h3);line-height:1.42;letter-spacing:-.018em}
.t4c-case .case-text>p,.t4c-case .case-section>p{font-size:var(--case-type-body);line-height:1.86;max-width:64ch}
.t4c-case .case-caption,.t4c-case .case-image>figcaption{font-size:var(--case-type-caption)!important;line-height:1.7;letter-spacing:.005em}
.t4c-case .case-toc{font-size:14px;line-height:1.5}
.t4c-case .case-meta dt{font-size:14px;line-height:1.5}
.t4c-case .case-meta dd{font-size:15px;line-height:1.7}
.t4c-case .case-section summary{font-size:15px;line-height:1.6}
.t4c-case .case-pagination{font-size:15px}
.t4c-case .case-section :is(h2,h3){scroll-margin-top:110px}
.d3-case.t4c-case .case-statement{font-size:clamp(27px,2.3vw,33px);max-width:22ch}
.d3-case.t4c-case .case-intro{font-size:18px;line-height:1.82}

@media(max-width:767px){
  .t4c-case{
    --case-type-h1:clamp(48px,12.8vw,56px);
    --case-type-h2:clamp(27px,7.4vw,32px);
    --case-type-h3:19px;
    --case-type-body:15px;
    --case-type-caption:12px;
  }
  .t4c-case .case-hero{padding-top:36px}
  .t4c-case .case-heading{display:block}
  .t4c-case .case-hero h1{line-height:1.01;letter-spacing:-.03em}
  .t4c-case .case-hero h1>span{font-size:20px;margin-top:8px}
  .t4c-case .case-statement,.d3-case.t4c-case .case-statement{font-size:22px;line-height:1.5;margin-top:20px;max-width:100%}
  .t4c-case .case-intro,.d3-case.t4c-case .case-intro{font-size:15px;line-height:1.85;max-width:100%}
  .t4c-case .case-section{padding-block:48px}
  .t4c-case .case-section h2{line-height:1.45;margin-bottom:20px;max-width:100%}
  .t4c-case .case-section h3{line-height:1.5}
  .t4c-case .case-text>p,.t4c-case .case-section>p{font-size:15px;line-height:1.85;max-width:100%}
  .t4c-case .case-toc{font-size:12px}
  .t4c-case .case-meta dt{font-size:12px}.t4c-case .case-meta dd{font-size:14px}
}
