/* Category page header (src/components/CatHeader.astro), the same in the three board variants:
   category links, then the /work media strip on the left and title, line and contents on the right.
   The title is smaller than the boards' (112px at 1440 on desktop, 64px below): 72px at 1440. */
.cath { container-type: inline-size; background: #FFFFFF; color: #5E1823; }
.cath-in { padding: 44px var(--gutter) clamp(64px, 6.6667cqw, 112px); }
/* desktop: the first section sits under the 58px nav (the boards' margin-top: -58px) */
.v-d .cath-in { padding-top: calc(58px + clamp(32px, 3.3333cqw, 56px)); }
.cath-g { display: grid; grid-template-columns: 50% minmax(0, 1fr); gap: 5.5556cqw; align-items: start; margin-top: clamp(32px, 3.8889cqw, 64px); }
.cath-h { font-size: clamp(44px, 5cqw, 84px); line-height: 1; color: #5E1823; }
.cath-s { font-size: clamp(18px, 1.6667cqw, 26px); line-height: 1.3; color: #5E1823; max-width: 26em; margin-top: 14px !important; }
.cath-c { margin-top: clamp(36px, 3.8889cqw, 64px); }
.cath-ct { font-size: clamp(17px, 1.25cqw, 20px); color: #5E1823; }
.cath-c ul { margin-top: .6em; }
.cath-c a.lead { padding: .7em 0; color: #5E1823; }
/* the numeral hangs in its own column, so a name that wraps (tablet) lines up under itself */
.cath-c .lab { display: inline-flex; align-items: baseline; font-size: max(11px, .8333cqw); color: #5E1823; }
.cath-c .num { flex: none; min-width: 2.6em; font-size: 1em; letter-spacing: 0; text-transform: none; }
.cath-c .ds { font-size: max(13px, 1.0417cqw); color: #7A3540; white-space: nowrap; }
.cath + .proj { margin-top: 0; }
/* phones: the strip on top, the text under it */
@media (max-width: 640.98px) {
  .cath-in { padding-top: 36px; padding-bottom: 56px; }
  .cath-g { grid-template-columns: 1fr; gap: 28px; margin-top: 24px; }
  .cath-strip { gap: 4px; }
  .cath-c .lab { font-size: 10px; letter-spacing: .16em; }
  .cath-c a.lead { gap: .5em; }
}