:root {
  --f-body: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-display: 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif;
  --f-mono: 'DM Mono', ui-monospace, monospace;
}
body { font-family: var(--f-body); }
h1 { font-family: var(--f-display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(52px,7vw,96px); line-height: .98; letter-spacing: -.02em; max-width: 16ch; }
.eyebrow, .address { font-family: var(--f-mono); }
.caption { font-size: 16px; line-height: 1.35; }
.caption small { margin-bottom: 7px; font-family: var(--f-mono); font-size: 11px; }
.viewer-head h2 { font-weight: 600; }
.shell { overflow: clip; }
.cta { background: var(--orange-primary); color: var(--fg); }
#discuss { background: var(--orange-primary); color: var(--fg); }
#discuss:hover { background: var(--orange-support); color: var(--fg); }
.cta.secondary { background: #fff; }
.layout { grid-template-columns: 230px minmax(0, 1fr); }
.filter { display: flex; align-items: center; justify-content: space-between; gap: 10px; white-space: nowrap; }
.filter small { float: none; flex-shrink: 0; margin-left: auto; }
@media (min-width: 601px) and (max-width: 900px) {
  .layout { grid-template-columns: 210px minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .filter { flex-shrink: 0; }
  .filters { top: calc(64px + env(safe-area-inset-top, 0px)); z-index: 20; }
  .caption { font-size: 16px; }
  header { padding-bottom: 28px; }
}

/* Match popup action alignment and readable icon sizing on small screens. */
.contact .cta{justify-content:center;text-align:center;line-height:1.2}
@media(max-width:600px){
 .contact .actions a{font-size:15px;gap:7px;min-height:48px}
 .contact .actions svg{width:22px;height:22px}
}

/* Long category names wrap on the sidebar while counts keep their own space. */
@media(min-width:601px){.filter{white-space:normal;min-width:0}.filter small{margin-left:8px}}
