Typography & Proportion Fix Pass — refer_landing_page

Task: t_612a91e3 Date: 2026-06-16 Scope: issues #6, #7, #10, #11, #13, #17 from docs/LAYOUT_AUDIT.md. (Items #1, #2, #3, #5, #8, #9 are handled by the sibling pass.)

Files changed (5)

File	Change
`tailwind.config.ts`	`display` cap 9rem → 7rem; `display-sm` cap 4.5rem → 3.75rem.
`components/PageHeader.tsx`	h1: `text-4xl sm:text-5xl lg:text-6xl` → `text-3xl sm:text-4xl lg:text-5xl` + `break-keep` + `text-balance`; display paragraph switches between `display` and `display-sm` based on whether the optional `display` prop is set.
`app/globals.css`	`.corner-label`: `text-sm` → `text-base`.
`components/Counter.tsx`	Added optional `static` prop (skips IntersectionObserver; renders value as plain text).
`app/intro/page.tsx`	`figures` entries now carry `size` + `static`; the 2026 year is `static: true, size: "display-sm"`; Counter invocation wires both through.

Catalogue issues resolved

#6 (Korean h1 no break-keep) — fixed: break-keep + text-balance added to <h1> in PageHeader. Korean titles now break only at spaces, and multi-line wrap is balanced.
#7 (intro "Standards" overflows col-span-7 at 1280+) — fixed: display cap reduced from 9rem to 7rem. "Standards" at 7rem Fraunces ≈ 595px wide; col-span-7 ≈ 720px → fits with margin. Also bumps the intro cover scale down a step to match the rest of the page.
#10 (PageHeader display fallback uses long en at 9rem) — fixed: when display prop is absent, the fallback now uses display-sm (3.75rem cap) so "Standardization" (14 chars) and "Publications" (12 chars) never overflow the col-span-8 column.
#11 (Counter year 2026 ticks 0→2026) — fixed: Counter gained a static prop; app/intro/page.tsx sets static: true for the year entry, so it renders as static text on first paint with no observer / animation.
#13 (Counter cards different magnitudes) — fixed: the year is now display-sm (3.75rem) while 2 and 4 stay at full display (7rem). The 4-digit "2026" no longer pushes cell padding; visual weight is now balanced.
#17 (SectionLabel text-sm too small) — fixed: .corner-label bumped from text-sm (14px) to text-base (16px) so the "01 / 05" spread number reads as page furniture, not body copy.

Catalogue items deliberately not addressed in this pass

#12 (publications list rail) — audit marked it "Verified fine; no fix".
#16 (Header h-[4.25rem] arbitrary) — header height is not a typography concern; sibling pass may review.

Verification

npx tsc --noEmit — passes (zero errors).
npx next build — passes (all 5 routes static; 8/8 static pages generated; sizes match previous build).
Dev server (port 4510) — /intro, /members, /publications all return 200 with current edits in place.
Production CSS verified to contain new clamp(2.75rem, 9vw, 7rem) for .text-display (was clamp(3rem, 10vw, 9rem)).

Rationale for the font-size scale (kept consistent)

The editorial system has two display scales — display (cover, magazine-spread) and display-sm (headline, secondary). Previously:

display clamp(3rem, 10vw, 9rem) line-height 0.92
display-sm clamp(2.25rem, 6vw, 4.5rem) line-height 0.98

The 9rem cap and 0.92 line-height were tuned for a much larger column / longer headlines than the col-span-7/8 grids actually deliver. After the audit's 1280+ overflow math, the upper cap needed to come down. The new pair:

display clamp(2.75rem, 9vw, 7rem) line-height 0.95
display-sm clamp(2rem, 5.5vw, 3.75rem) line-height 1.02

The 2:1 ratio between display and display-sm (was 2:1, still 2:1) and the reduced 0.95 / 1.02 line-heights give a slightly airier feel that matches the rest of the editorial type stack. The h1 in PageHeader also stepped down one notch (5xl → 4xl lg) for the same reason — a 6xl Korean h1 was a stretched-out 60px serif dominating the col-span-8 unnecessarily.

Regressions introduced

None verified at the source level. The static prop on Counter is opt-in (default false), so other pages' Counters (members figures, publications figures, standardization figures) are unchanged in behavior.

4.2 KiB Raw Blame History