# News & Media — Round 2 reconcile (agent news-r2, 2026-06-17)

Page: `html/news-media.html`. Figma file `R6EY4TpNCvVqUEikM7Lof9`.
Frames: desktop News `3121:24934` / Press `3121:25016` / Video `3121:25098`; mobile `3121:24028`.
Measured by IR + DOM `getBoundingClientRect`/`getComputedStyle` (playwright slot). All hover/tab interactions
triggered and read from computed style — not eyeballed.

## Desktop (1440)

| Section | Figma node | measured vs IR | fixed? | residual |
|---|---|---|---|---|
| Hero left card | 3121:24935 Left | card 723×329 r28 #f4f4f8; H1 Poppins SemiBold 55px lh100% #2b286f; sub Poppins Light 25px #2b286f | already matched (55/600, 25/300, colors ✓) | none |
| Hero image | Rectangle 3 navy r28 628×330, fill 262cf785 | image = correct Figma building fill (md5 identical to existing hero-building.png); removed dup download | n/a (already correct) | none |
| Tab bar | Group 1049 (3121:24982) | 3 tabs 196×50 r7 gap30; text Poppins 22px ls-4% TITLE #2b286f; active=Medium500+#ffcb05 (no border), inactive=Light300+1px navy border | already matched (50h/196w/r7/22px, active yellow w500, inactive white w300) | none |
| Tab hover | →variant 3121:15352 | hover = active styling (yellow bg + Medium 500, text stays navy) | matched (`hover:bg-[#ffcb05] hover:font-medium`) | none |
| Featured big card | 3121:24977 Comp235 | 723×760, img 666×463, title Poppins Reg **25px**, excerpt Reg **20px**, meta y504 | title/excerpt sizes ok; **meta order swapped date-left/source-right** | none |
| Featured right cards | Comp230/231 | 672×380 each, stacked flush (y0/y380), img 617×246, title Reg **20px** | sizes ok; meta order swapped | none |
| **Meta order** | grid 3121:24965 + featured | Figma: calendar+DATE at x=0 (left); source-icon+SOURCE at x=177 (right) | **FIXED** — 6 inline rows + JS template were source-left; swapped to date-left/source-right | — |
| "All News" heading | 3121:24964 | Poppins Light 50px lh100% TITLE #2b286f centered | matched | none |
| All-News grid card | 3121:24965 | 465×388 white 0.5px #2b286f border r0; img 427×246; title Reg 20px; flush no gap | matched (3-col flush, title 20px Normal desktop) | none |
| Grid card hover | →variant 3121:16909 | bg #fff→#2b286f, border→navy, all text→#fff | wired in custom.css; **triggered → fires** (bg navy, text white) ✓ | none |
| Press panel | 3121:25016 / featured 3121:25063 | big 723×644 (no excerpt), right 672×322 img 617×175/176, titles 20/25px | matched (measured big 637h no-excerpt, right 318/319h); meta swapped | none |
| Video panel | 3121:25098 | **no designed content in Figma** | placeholder "Videos coming soon." kept | **CLIENT Q: confirm video-card layout** |

## Mobile (393)

| Section | Figma node | measured vs IR | fixed? | residual |
|---|---|---|---|---|
| Hero | Group 351 (3121:24030) | card 344×152 r17 #f4f4f8 (heading+sub only) then image 344×367 navy r17 below; H1 Poppins **Bold 700 30px** lh37 ls-1.2; sub Poppins **Reg 15px** lh22 ls-0.6 | matched (30/700/37, 15/400/22, stacked card→image) | card renders ~185h (content/CMS-driven; Figma 152 is tight 2-line) |
| Breadcrumb | Group 450 | Home(black)+News And Media(#636262) Poppins Light 15px | present | n/a (shared) |
| Tab bar | Group 1058 (3121:24045) | 2 tabs drawn 147×31 r7 gap20; Light 15px TITLE; active yellow+navy border, inactive white+navy border | **gap fixed 12→20px**; tabs wrap (News+Press row1, Video row2) | Figma drew only 2 tabs; ours wraps all 3 per dynamic-tab rule |
| Featured big card | Group 1087 (3121:24049) | 345×637 r0; img 318×311; title Reg **20px** h90; excerpt Reg **15px**; meta 12px | matched (aspect 318/311, title 20px, excerpt 15px, meta 12px) | none |
| Featured small cards | Frame 1597884749 (3121:24076) | 345×162 horizontal; img-left **89×160**; content x95; meta 12px date\|source; title **Light 18px** | matched (row, photo 89px, title Light 18px) | none |
| All-News grid | Group 1093 (3121:24131) | 8 cards single-col 345×388; img 316×246; meta **15px** date\|source; title **Light 18px** | **FIXED** template: title Light 18px (was Normal 20px), meta 15px (was 12px) | none |
| Overflow | — | scrollWidth 378 ≤ 393 ✓ | — | none |

## Hover / interaction proof (triggered, computed-style read)
- Featured big card hover → bg rgb(43,40,111), border navy, title+meta rgb(255,255,255). ✓
- Grid card hover (desktop) → same full colour-invert. ✓
- Tab switch: click Press → News panel hidden, Press shown, Video hidden; active tab yellow w500, inactive white w300. ✓
- Dynamic tabs: injected 7 tabs incl. long labels → no horizontal overflow, no tab exceeds container right edge (wraps). ✓

## Fixes committed
1. Meta order date-left/source-right (6 inline rows + JS card template).
2. Mobile grid card title Light 18px / desktop Normal 20px; grid meta 15px both; mobile tab gap 20px.

## Open questions
- **Video tab**: Figma has no designed video content (frame 3121:25098 not inspected — design shows hero+tabs only).
  Placeholder empty-state retained. Client must confirm video-card layout.
- Date-left/source-right is the IR-mandated order (calendar group x=0, source group x=177 in every card). Visually
  unusual but matches Figma exactly; flag if client expected source-first.
