feat(site-kit): single-language header and a footer with business details (D-029)

[jlc488]

Summary

Nine header and footer options that FM덴탈서비스's landing needs and the kit could not draw (D-029). The props are optional; a product that passes none gets the same markup.

• SiteHeader locale optional — no language picker without it.
• SiteBrand.label names the header brand link; a wordmark logo with name: "" prints once (no empty <strong> in the footer).
• Narrow-screen menu closes on Escape (focus back on the menu button) and when a link inside it is followed. Buttons, new-tab links, an Escape a control inside the header already handled (flag menu), and an Escape from an aria-modal element leave it open.
• SiteFooter details (block under the brand line) and linksLabel (named <nav>); SiteLink.emphasis.
• scroll-margin-block-start on sections and the hero (--site-header-block-size); --site-hero-eyebrow-tracking / --site-hero-eyebrow-weight.
• Header and footer read brand (and details) once — D-027/D-028 extended to directly mounted chrome.

Applies to every consumer

• Touch: brand, navigation, footer and footer-language links are 44px targets.
• At 720px and below the closed header's first row is 64px with no block padding. Products without a global box-sizing: border-box reset (TraceLinq, BookLinq) get phone headers 89px → 65px; a 44px menu button product 69 → 65. Check the phone header when upgrading.
• Footer links baseline-aligned; a row with details aligns on its first line; the 16px footer mark size applies only beside a printed name.
• Type change: SiteHeaderProps["locale"] is optional — BookLinq's MarketingFrame (props.header.locale.locale) must narrow it when it upgrades.

Verification

• Component tests (16 new), a development-build hydration test for directly mounted chrome with getter props, source contracts, and browser geometry at fine and coarse pointers. Each was checked to fail on the code/CSS it guards (old chrome: 12 of 14 fail; old CSS: 5 browser tests fail; removing the memos: Hydration Mismatch).
• A five-lens review before this PR (compatibility with the four family consumers, a11y, hydration, CSS, tests/docs) confirmed 15 findings; all are fixed or documented in D-029 and the changeset.
• Local run of every CI step: all pass except verify:canary:preview, which times out on this Windows machine (the canary server needs 8–16s, the smoke waits 5s). The canary depends only on dds-table, untouched here.

---

요약

FM덴탈서비스 랜딩에 필요한데 kit으로는 그릴 수 없던 헤더·푸터 옵션 9가지(D-029). props는 선택이고, 아무것도 넘기지 않는 제품은 같은 마크업을 받는다.

• SiteHeader의 locale 선택 — 없으면 언어 메뉴 없음.
• SiteBrand.label로 헤더 브랜드 링크 이름. 워드마크 logo + name: ""이면 한 번만 찍힘(푸터에 빈 <strong> 없음).
• 좁은 화면 메뉴가 Esc로 닫히고(포커스는 메뉴 버튼으로) 안의 링크를 따라가면 닫힘. 버튼·새 탭 링크·헤더 안 컨트롤이 처리한 Esc(국기 메뉴)·aria-modal 안의 Esc는 메뉴를 그대로 둔다.
• SiteFooter의 details(브랜드 줄 아래 블록)와 linksLabel(이름 있는 <nav>), SiteLink.emphasis.
• 섹션·히어로의 scroll-margin-block-start(--site-header-block-size), --site-hero-eyebrow-tracking·--site-hero-eyebrow-weight.
• 헤더·푸터가 brand(와 details)를 한 번만 읽음 — D-027·D-028을 직접 마운트에도.

모든 소비자에 적용

• 터치: 브랜드·내비게이션·푸터·푸터 언어 링크 44px.
• 720px 이하 닫힌 헤더 첫 줄 64px·위아래 패딩 없음. 전역 box-sizing: border-box 리셋이 없는 제품(TraceLinq, BookLinq)은 휴대폰 헤더 89px → 65px, 메뉴 버튼 44px인 제품은 69 → 65. 올릴 때 휴대폰 헤더 확인.
• 푸터 링크 기준선 정렬, details가 있는 줄은 첫 줄 정렬, 푸터 16px 마크 크기는 이름 옆 아이콘에만.
• 타입 변경: SiteHeaderProps["locale"]이 선택 — BookLinq MarketingFrame(props.header.locale.locale)은 올릴 때 좁혀야 함.

검증

• 컴포넌트 테스트 16개, 게터 props로 직접 마운트한 헤더·푸터의 개발 빌드 하이드레이션 테스트, 소스 계약, 마우스·터치 두 포인터의 브라우저 기하. 각각 지키는 코드·CSS가 없으면 실패함을 확인(옛 헤더·푸터: 14개 중 12개 실패, 옛 CSS: 브라우저 5개 실패, 메모 제거: Hydration Mismatch).
• PR 전 5개 관점 리뷰(가족 소비자 4곳 호환, 접근성, 하이드레이션, CSS, 테스트·문서)에서 확인된 지적 15건 — 모두 고치거나 D-029·changeset에 기록.
• 모든 CI 단계를 로컬에서 실행: verify:canary:preview만 이 Windows 기기에서 시간 초과(카나리 서버가 8–16초 걸리는데 스모크는 5초 대기). 카나리는 dds-table만 쓰고 이 PR은 건드리지 않음.