@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root { --bg:#f7f6f2; --ink:#1d2429; --soft:#e6e4de; --red:#8b3a32; --line:2px; --gutter:clamp(18px,4vw,60px); --max:1440px; --font:Inter,Helvetica,Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--bg); }
body { margin:0; overflow-x:hidden; color:var(--ink); background:var(--bg); font-family:var(--font); line-height:1.5; }
body::before { position:fixed; inset:0; z-index:20; pointer-events:none; opacity:.018; content:""; filter:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3C/svg%3E%23n"); }
a { color:inherit; } img { display:block; max-width:100%; } button { font:inherit; }
.wrap { width:min(calc(100% - var(--gutter)*2),var(--max)); margin-inline:auto; }
.skip-link { position:fixed; top:10px; left:10px; z-index:100; padding:12px 16px; transform:translateY(-180%); color:var(--ink); background:var(--red); font-size:12px; font-weight:900; text-decoration:none; text-transform:uppercase; }
.skip-link:focus { transform:translateY(0); }
a:focus-visible,button:focus-visible { outline:3px solid var(--red); outline-offset:4px; }

.site-header { position:sticky; top:0; z-index:10; border-bottom:var(--line) solid var(--ink); background:rgba(244,242,237,.96); backdrop-filter:blur(10px); }
.header-inner { min-height:74px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:32px; }
.wordmark { font-size:16px; font-weight:900; letter-spacing:-.04em; text-decoration:none; text-transform:uppercase; }
.wordmark span { display:block; margin-top:3px; font-size:8px; font-weight:700; letter-spacing:.13em; }
.nav { display:flex; align-items:center; }
.nav a { min-height:44px; display:inline-flex; align-items:center; padding:0 14px; border-left:1px solid var(--ink); font-size:10px; font-weight:800; letter-spacing:.1em; text-decoration:none; text-transform:uppercase; }
.nav a:last-child { border-right:1px solid var(--ink); }
.nav a:hover,.nav a:focus-visible { color:var(--bg); background:var(--ink); outline:0; }
.nav .nav-cta { background:var(--red); }
.menu-button { display:none; }

.hero { min-height:calc(100vh - 74px); display:flex; flex-direction:column; border-bottom:4px solid var(--ink); background:var(--bg); }
.hero-inner { flex:1; min-height:620px; display:grid; grid-template-columns:1fr minmax(300px,5fr); grid-template-rows:auto 1fr; gap:0; padding-top:clamp(48px,8vw,120px); border-right:var(--line) solid var(--ink); border-left:var(--line) solid var(--ink); background-image:linear-gradient(rgba(8,8,8,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(8,8,8,.04) 1px,transparent 1px); background-size:24px 24px; }
.eyebrow,.section-kicker { margin:0; font-size:10px; font-weight:900; letter-spacing:.18em; text-transform:uppercase; }
.eyebrow { grid-column:2; align-self:start; padding-left:clamp(24px,4vw,64px); }
.eyebrow::before,.section-kicker::before { width:32px; height:4px; display:inline-block; margin-right:12px; vertical-align:middle; background:var(--red); content:""; }
.hero h1 { grid-column:1/-1; align-self:center; max-width:1120px; margin:0; padding:clamp(28px,5vw,72px) clamp(24px,4vw,64px); font-size:clamp(82px,12vw,190px); font-weight:900; letter-spacing:-.095em; line-height:.77; text-transform:uppercase; }
.hero-bottom { grid-column:2; align-self:end; padding:0 clamp(24px,4vw,64px) clamp(46px,7vw,90px); }
.hero-statement { max-width:18ch; margin:0; font-size:clamp(26px,3vw,45px); font-weight:800; letter-spacing:-.06em; line-height:.96; text-transform:uppercase; }
.hero-copy { max-width:58ch; margin:28px 0 0; font-size:14px; line-height:1.7; }
.button { min-height:52px; display:inline-flex; align-items:center; justify-content:space-between; gap:22px; margin-top:30px; padding:0 18px; border:var(--line) solid var(--ink); color:var(--bg); background:var(--ink); font-size:10px; font-weight:900; letter-spacing:.11em; text-decoration:none; text-transform:uppercase; transition:background .16s linear,color .16s linear,transform .16s linear; }
.button:hover { color:var(--ink); background:var(--red); transform:translateY(-2px); }
.proof-strip { border-top:var(--line) solid var(--ink); color:var(--ink); background:var(--soft); }
.proof-strip .wrap { min-height:58px; display:flex; align-items:center; gap:25px; overflow:hidden; white-space:nowrap; font-size:10px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.proof-strip span::after { margin-left:25px; color:var(--red); content:"+"; }

.positioning,.work,.record,.closing { scroll-margin-top:74px; border-bottom:4px solid var(--ink); }
.positioning { background:var(--soft); color:var(--ink); }
.positioning-grid { display:grid; grid-template-columns:70px minmax(300px,6fr) minmax(270px,4fr); gap:clamp(26px,5vw,72px); padding:clamp(82px,11vw,154px) 0; }
.section-number { margin:0; color:var(--red); font-size:12px; font-weight:900; letter-spacing:.1em; }
.positioning h2,.work h2,.record h2,.closing h2 { margin:18px 0 0; font-size:clamp(48px,6vw,94px); font-weight:900; letter-spacing:-.075em; line-height:.87; text-transform:uppercase; text-wrap:balance; }
.positioning-copy { max-width:52ch; font-size:15px; line-height:1.75; }
.positioning-copy p:first-child { margin-top:0; }

.work { padding:clamp(86px,11vw,150px) 0; background:var(--bg); }
.work-head { display:grid; grid-template-columns:70px minmax(300px,7fr) minmax(240px,3fr); gap:clamp(26px,5vw,72px); align-items:end; margin-bottom:clamp(48px,7vw,84px); }
.work-head > div { max-width:760px; }.work-head h2 { max-width:12ch; }.work-head > p:last-child { max-width:38ch; margin:0; padding-top:18px; border-top:4px solid var(--red); font-size:14px; line-height:1.7; }
.work-rooms { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-auto-rows:116px; border:4px solid var(--ink); background:var(--ink); }
.work-room { position:relative; overflow:hidden; min-height:0; border:var(--line) solid var(--ink); color:#fff; text-decoration:none; isolation:isolate; }
.work-room.production { grid-column:span 7; grid-row:span 6; }.work-room.mlb { grid-column:span 5; grid-row:span 4; }.work-room.mls { grid-column:span 5; grid-row:span 4; }.work-room.nba { grid-column:span 4; grid-row:span 5; }.work-room.live { grid-column:span 3; grid-row:span 5; }
.work-room::after { position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(0,0,0,.02) 25%,rgba(0,0,0,.86) 100%); content:""; }
.work-room img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }.work-room:hover img { transform:scale(1.04); }
.room-overlay { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between; padding:20px; }
.room-index,.room-copy small,.room-copy em { font-size:10px; font-style:normal; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.room-index { align-self:flex-start; padding:7px 9px; color:var(--ink); background:var(--red); }
.room-copy { display:grid; gap:9px; }.room-copy strong { font-size:clamp(30px,3.8vw,58px); font-weight:900; letter-spacing:-.07em; line-height:.85; text-transform:uppercase; }.room-copy em { max-width:37ch; font-weight:600; }
.room-arrow { position:absolute; top:18px; right:20px; width:42px; height:42px; display:grid; place-items:center; border:1px solid #fff; font-size:22px; transition:color .16s,background .16s; }.work-room:hover .room-arrow { color:var(--ink); background:var(--red); }

.record { padding:clamp(86px,11vw,150px) 0; background:#e4e1da; }.record-layout { display:grid; grid-template-columns:minmax(290px,4fr) minmax(0,8fr); gap:clamp(44px,8vw,130px); }.record h2 { max-width:560px; }
.record-list { margin:0; padding:0; border-top:4px solid var(--ink); list-style:none; }.record-list li { display:grid; grid-template-columns:110px 1fr; gap:26px; padding:25px 0; border-bottom:var(--line) solid var(--ink); }.record-list span { color:var(--red); font-size:10px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }.record-list h3 { margin:0; font-size:clamp(22px,2.4vw,36px); font-weight:900; letter-spacing:-.055em; line-height:.95; text-transform:uppercase; }.record-list p { max-width:58ch; margin:10px 0 0; font-size:13px; line-height:1.65; }

.closing { color:var(--bg); background:var(--ink); }.closing-inner { display:grid; grid-template-columns:70px minmax(280px,7fr) minmax(260px,4fr); gap:clamp(26px,5vw,72px); padding:clamp(86px,11vw,150px) 0; }.closing .section-kicker { color:var(--bg); }.closing p:last-child { max-width:42ch; font-size:14px; line-height:1.7; }.button.light { color:var(--ink); background:var(--bg); border-color:var(--bg); }.button.light:hover { color:var(--ink); background:var(--red); }
.site-footer { color:var(--bg); background:var(--ink); }.site-footer .wrap { display:grid; grid-template-columns:repeat(4,1fr); border-top:var(--line) solid var(--bg); border-left:var(--line) solid var(--bg); }.site-footer span,.site-footer a { min-height:56px; display:flex; align-items:center; padding:12px; border-right:var(--line) solid var(--bg); border-bottom:var(--line) solid var(--bg); font-size:9px; font-weight:800; letter-spacing:.09em; text-decoration:none; text-transform:uppercase; }.site-footer a:hover { color:var(--ink); background:var(--red); }

@media (max-width:820px) { .header-inner { grid-template-columns:1fr auto; min-height:66px; }.menu-button { width:48px; height:48px; display:flex; flex-direction:column; justify-content:center; gap:6px; padding:10px; border:var(--line) solid var(--ink); background:transparent; }.menu-button span { width:24px; height:3px; background:var(--ink); }.nav { position:absolute; top:100%; right:0; left:0; display:none; flex-direction:column; border-bottom:4px solid var(--ink); background:var(--bg); }.nav.is-open { display:flex; }.nav a,.nav a:last-child { justify-content:space-between; border-right:0; border-bottom:1px solid var(--ink); border-left:0; padding:0 var(--gutter); }.hero-inner { min-height:600px; grid-template-columns:1fr; }.eyebrow,.hero-bottom { grid-column:1; }.hero h1 { font-size:clamp(82px,15vw,135px); }.hero-bottom { padding-top:0; }.positioning-grid,.work-head,.record-layout,.closing-inner { grid-template-columns:1fr; gap:24px; }.work-rooms { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:260px; }.work-room.production,.work-room.mlb,.work-room.mls,.work-room.nba,.work-room.live { grid-column:auto; grid-row:auto; }.work-room.production { grid-column:1/-1; grid-row:span 2; }.record-list li { grid-template-columns:90px 1fr; }.site-footer .wrap { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px) { .site-header { min-height:66px; }.menu-button { position:fixed; top:9px; right:var(--gutter); z-index:30; display:flex !important; }.wordmark span { display:none; }.hero { min-height:calc(100svh - 66px); }.hero-inner { min-height:540px; padding-top:66px; }.eyebrow { padding:0 24px; font-size:8px; }.eyebrow::before { display:none; }.hero h1 { max-width:100%; padding:28px 24px; font-size:clamp(50px,15vw,62px); }.hero-bottom { min-width:0; padding:0 24px 42px; }.hero-statement { font-size:25px; }.hero-copy { max-width:100%; margin-top:18px; overflow-wrap:anywhere; font-size:13px; }.proof-strip .wrap { font-size:9px; }.positioning-grid,.work-head,.closing-inner { padding-top:76px; padding-bottom:76px; }.positioning h2,.work h2,.record h2,.closing h2 { font-size:clamp(44px,13vw,64px); }.positioning-copy { font-size:14px; }.work { padding:76px 0; }.work-rooms { grid-template-columns:1fr; grid-auto-rows:320px; }.work-room.production { grid-column:auto; grid-row:auto; min-height:440px; }.room-copy strong { font-size:46px; }.record { padding:76px 0; }.record-list li { grid-template-columns:1fr; gap:9px; }.site-footer .wrap { grid-template-columns:1fr; } }
/* Hero experience summary */
.hero-inner { min-height:auto; display:grid; grid-template-columns:minmax(0,7fr) minmax(300px,5fr); padding:clamp(52px,7vw,104px) 0 0; }
.eyebrow { grid-column:1 / -1; display:block; padding:0 clamp(24px,4vw,64px); }
.hero-title-block { min-width:0; padding:clamp(32px,5vw,72px) clamp(24px,4vw,64px); }
.hero-portrait { position:relative; min-height:500px; margin:clamp(24px,4vw,56px) clamp(24px,4vw,56px) clamp(32px,5vw,72px) 0; overflow:hidden; border:2px solid var(--ink); background:var(--soft); }
.hero-portrait img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; }
.hero-portrait figcaption { position:absolute; right:0; bottom:0; left:0; padding:11px 14px; color:var(--bg); background:rgba(29,36,41,.92); font-size:9px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.hero h1 { max-width:none; margin:0; padding:0; font-size:clamp(62px,7.8vw,122px); line-height:.8; }
.hero-intro { min-width:0; padding-bottom:6px; }
.hero-statement { max-width:19ch; font-size:clamp(24px,2.7vw,39px); }
.hero-copy { max-width:54ch; }
.hero-experience { grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; margin:0; padding:0; border-top:4px solid var(--ink); background:var(--bg); color:var(--ink); }
.hero-experience > * { min-width:0; min-height:220px; padding:24px; border-right:2px solid var(--ink); border-bottom:2px solid var(--ink); }
.experience-intro { grid-column:span 2; display:flex; flex-direction:column; justify-content:space-between; background:#efede7; color:var(--ink); }
.experience-intro .section-kicker { margin:0; }.experience-intro .section-kicker::before { background:var(--red); }
.experience-intro h2 { max-width:14ch; margin:18px 0 0; font-size:clamp(34px,4.3vw,64px); font-weight:900; letter-spacing:-.07em; line-height:.86; text-transform:uppercase; }
.experience-group { display:flex; flex-direction:column; background:var(--bg); }.experience-group:nth-child(3),.experience-group:nth-child(5) { background:#efede7; }.experience-live { grid-column:span 2; min-height:170px; }
.experience-label { margin:0 0 18px; color:var(--red); font-size:9px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.experience-group ul { display:grid; gap:15px; margin:0; padding:0; list-style:none; }.experience-group li { display:grid; gap:3px; }.experience-group strong { font-size:clamp(18px,2vw,28px); font-weight:900; letter-spacing:-.05em; line-height:1; text-transform:uppercase; }.experience-group span { font-size:11px; line-height:1.55; }
@media (max-width:820px) { .hero-inner { grid-template-columns:1fr; padding-top:70px; }.hero-title-block { padding-bottom:32px; }.hero-portrait { min-height:480px; margin:0 clamp(24px,4vw,56px) 32px; }.hero-experience { grid-template-columns:repeat(2,minmax(0,1fr)); }.experience-intro,.experience-live { grid-column:span 2; } }
@media (max-width:560px) { .hero-inner { grid-template-columns:1fr; padding-top:70px; }.eyebrow { padding:0 24px; }.hero-title-block { padding:34px 24px 32px; }.hero-portrait { min-height:400px; margin:0 24px 28px; }.hero h1 { font-size:clamp(52px,15vw,70px); }.hero-statement { font-size:25px; }.hero-copy { width:280px; max-width:100%; overflow-wrap:anywhere; }.hero-experience { grid-template-columns:1fr; }.hero-experience > *, .experience-intro, .experience-live { grid-column:auto; min-height:auto; padding:24px; }.experience-intro h2 { max-width:100%; overflow-wrap:anywhere; word-break:break-word; font-size:38px; }.experience-group strong { font-size:23px; } }

@media print {
  @page { size: A4; margin: 12mm; }
  *, *::before, *::after { box-shadow: none !important; }
  html, body { background: #fff; color: #1d2429; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  body::before { display: none; }
  .site-header { position: static; background: #fff; }
  .skip-link, .menu-button { display: none !important; }
  .hero { min-height: 0; border-bottom-width: 2px; }
  .hero-inner { width: 100%; display: grid; grid-template-columns: 1.25fr .75fr; padding-top: 12mm; border: 0; }
  .eyebrow { grid-column: 1 / -1; padding: 0 0 8mm; }
  .hero-title-block { padding: 0 8mm 8mm 0; }
  .hero h1 { font-size: 58pt; }
  .hero-statement { font-size: 21pt; }
  .hero-copy { font-size: 10pt; }
  .hero-portrait { min-height: 0; height: 80mm; margin: 0 0 8mm; }
  .hero-experience { grid-column: 1 / -1; grid-template-columns: repeat(2, 1fr); break-inside: avoid; }
  .hero-experience > * { min-height: auto; padding: 5mm; break-inside: avoid; }
  .experience-intro, .experience-live { grid-column: span 2; }
  .experience-intro h2 { font-size: 29pt; }
  .experience-group strong { font-size: 16pt; }
  .experience-group span { font-size: 8pt; }
  .proof-strip { display: none; }
  .positioning, .work, .record, .closing { break-before: page; break-inside: avoid; border-bottom-width: 2px; }
  .positioning-grid, .work-head, .record-layout, .closing-inner { width: 100%; grid-template-columns: 1fr; gap: 7mm; padding: 0; }
  .positioning, .work, .record, .closing { padding: 12mm 0; }
  .positioning h2, .work h2, .record h2, .closing h2 { font-size: 34pt; }
  .work-rooms { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 72mm; break-inside: avoid; }
  .work-room.production { grid-column: span 2; grid-row: span 1; }
  .work-room.mlb, .work-room.mls, .work-room.nba, .work-room.live { grid-column: auto; grid-row: auto; }
  .room-copy strong { font-size: 26pt; }
  .record-list li { break-inside: avoid; }
  .site-footer { break-before: avoid; }
  .site-footer .wrap { width: 100%; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.work-room img,.button { transition:none; } }