:root{--paper:#ffffff;--ink:#272727;--muted:#767676;--line:#dddddd;--accent:#5f5f5f}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;font-size:16px}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}img{display:block;width:100%;height:auto}button{border:0}main,header,footer{max-width:1800px;margin-inline:auto}.header{padding:35px 4.2%;display:flex;justify-content:space-between;align-items:start}.wordmark{font-size:18px;letter-spacing:-.6px;font-weight:600}.wordmark span{display:block;font-weight:400;font-size:12px;letter-spacing:0;margin-top:7px;color:var(--muted)}nav{display:flex;gap:34px;font-size:14px;padding-top:4px}nav a{padding-bottom:5px;border-bottom:1px solid transparent}nav a:hover{border-color:var(--ink)}nav .contact-link{margin-left:34px}.hero{padding:89px 4.2% 75px}.eyebrow{font-size:12px;letter-spacing:.04em;display:block}.hero .eyebrow{display:flex;align-items:center;gap:9px}.small-symbol{font-size:24px;line-height:1}.hero h1{font-size:clamp(66px,8.5vw,144px);line-height:.99;letter-spacing:-.068em;font-weight:400;margin:36px 0 40px}.period{color:var(--accent)}.hero-bottom{display:flex;justify-content:space-between;align-items:end}.hero-bottom p{max-width:390px;font-size:17px;line-height:1.55;color:#696969;margin:0}.text-link{display:inline-flex;align-items:center;gap:35px;font-size:14px;padding-bottom:7px;border-bottom:1px solid var(--ink)}.work,.brand-section{padding:0 4.2%;scroll-margin-top:28px}.section-heading{border-top:1px solid var(--line);padding-top:23px;margin-bottom:32px;display:flex;align-items:center;justify-content:space-between;gap:20px}.section-heading h2{font-size:15px;font-weight:400;letter-spacing:-.2px;margin:0}.section-heading sup{font-size:10px;color:var(--muted);vertical-align:top;margin-left:6px}.filters{display:flex;gap:5px}.filters button{background:none;border-radius:20px;padding:7px 13px;font-size:12px;color:#666666}.filters button.active{background:var(--ink);color:var(--paper)}.filters button:hover:not(.active){background:#e7e7e7}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:55px 26px}.project-card[hidden]{display:none}.project-image{position:relative;overflow:hidden;background:#ebebeb;aspect-ratio:1.45}.project-image img{height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}.project-link:hover img{transform:scale(1.025)}.project-image.botxd{background:#e6e6e6}.project-image.botxd img{object-fit:cover}.view-arrow{position:absolute;right:18px;bottom:18px;display:grid;place-items:center;background:var(--paper);width:42px;height:42px;border-radius:50%;font-size:24px;opacity:0;transform:translateY(5px);transition:.25s}.project-link:hover .view-arrow,.project-link:focus-visible .view-arrow{opacity:1;transform:none}.project-caption{display:flex;justify-content:space-between;padding-top:17px}.project-caption h3{font-size:19px;font-weight:400;letter-spacing:-.5px;margin:0 0 7px}.project-caption p,figcaption p{font-size:12px;margin:0;color:#6e6e6e}.project-number{font-size:11px;color:var(--muted);padding-top:4px}.brand-section{margin-top:105px}.muted{font-size:12px;color:var(--muted)}.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px 24px}figure{margin:0}.brand-grid .zoom-image{aspect-ratio:1.25;background:#ebebeb}.brand-grid img{height:100%;object-fit:cover;transition:transform .4s}.zoom-image{display:block;width:100%;padding:0;overflow:hidden;background:#e8e8e8;cursor:zoom-in}.zoom-image:hover img{transform:scale(1.02)}figcaption{padding-top:15px}figcaption h3{font-size:15px;font-weight:400;margin:0 0 6px}.about{margin:130px 4.2% 0;padding-top:70px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center}.about-photo{width:70%;max-width:420px;margin:auto}.about-photo img{aspect-ratio:4/5;object-fit:cover;filter:saturate(.7)}.about-copy h2{font-size:clamp(32px,3.6vw,62px);line-height:1.07;font-weight:400;letter-spacing:-.05em;margin:25px 0}.about-copy p{font-size:16px;line-height:1.65;color:#696969;max-width:490px}.about-copy .text-link{margin-top:20px}.contact{padding:130px 4.2% 90px}.contact>a{display:block;position:relative;font-size:clamp(50px,7.7vw,130px);font-weight:400;letter-spacing:-.065em;line-height:1.04;margin-top:25px}.contact>a>span{position:absolute;right:0;top:0;transition:transform .3s}.contact>a:hover>span{transform:translate(6px,-6px)}footer{margin-inline:auto;padding:26px 4.2% 32px;display:flex;justify-content:space-between;gap:20px;font-size:11px;color:#6e6e6e;border-top:1px solid var(--line)}.skip{position:fixed;left:15px;top:-80px;z-index:30;background:var(--ink);color:var(--paper);padding:15px}.skip:focus{top:15px}.case-intro{padding:55px 4.2% 65px}.back{font-size:13px;display:inline-block;margin-bottom:68px}.case-meta{display:flex;gap:25px;color:var(--muted);font-size:12px}.case-intro h1{font-size:clamp(60px,9vw,150px);line-height:1;letter-spacing:-.065em;font-weight:400;margin:25px 0}.case-line{font-size:clamp(22px,2.7vw,40px);letter-spacing:-.035em;max-width:850px;margin:0 0 30px}.case-description{font-size:17px;line-height:1.6;max-width:650px;color:#696969;margin:0 0 0 auto}.case-hero{margin:0 4.2%;background:#e8e8e8}.case-hero img{width:100%;max-height:850px;object-fit:contain}.case-hero.botxd img{max-height:740px;object-fit:cover}.case-story{padding:80px 4.2%}.story-row{display:grid;grid-template-columns:.3fr 1fr 1.35fr;gap:35px;border-top:1px solid var(--line);padding:32px 0}.story-row h2{font-size:24px;line-height:1.15;letter-spacing:-.6px;font-weight:400;max-width:300px;margin:0}.story-row p{font-size:16px;line-height:1.65;color:#696969;max-width:580px;margin:0}.case-gallery{padding:0 4.2%;display:grid;grid-template-columns:1fr 1fr;gap:25px;align-items:start}.case-gallery figure:first-child{grid-column:1/-1}.case-gallery img{object-fit:contain}.original-link{padding:45px 4.2%}.next-project{margin:80px 4.2% 90px;border-top:1px solid var(--line);padding-top:28px}.next-project>a{font-size:clamp(45px,7vw,110px);letter-spacing:-.06em;display:flex;justify-content:space-between;margin-top:25px}dialog{border:0;background:#f5f5f5;color:var(--ink);padding:60px 20px 20px;width:min(1200px,95vw);max-height:94vh}dialog::backdrop{background:#191919dd}dialog img{max-height:76vh;object-fit:contain}dialog p{text-align:center;font-size:13px;margin-bottom:0}.close-lightbox{position:absolute;top:17px;right:20px;background:none;font-size:14px}.no-scroll{overflow:hidden}
@media(min-width:1500px){.hero{padding-top:115px;padding-bottom:95px}}@media(max-width:800px){.header{padding:25px 5%}.wordmark{font-size:16px}.wordmark span{font-size:10px}nav{gap:20px;font-size:12px}nav .contact-link{margin-left:0}.hero{padding:70px 5% 60px}.hero h1{font-size:clamp(52px,9.4vw,78px);margin:30px 0}.hero-bottom p{font-size:15px;max-width:320px}.hero-bottom .text-link{display:none}.work,.brand-section{padding-inline:5%}.project-grid{gap:35px 18px}.project-caption h3{font-size:17px}.project-caption p{font-size:10px}.view-arrow{display:none}.brand-section{margin-top:70px}.brand-grid{grid-template-columns:1fr 1fr;gap:30px 18px}.about{margin:80px 5% 0;gap:7%;padding-top:45px}.about-photo{width:100%}.about-copy p{font-size:14px}.about-copy h2{font-size:34px}.contact{padding:85px 5% 65px}footer{padding-inline:5%}.case-intro{padding:30px 5% 45px}.back{margin-bottom:45px}.case-description{font-size:16px;margin-left:0}.case-story{padding:50px 5%}.story-row{grid-template-columns:30px 1fr;gap:20px}.story-row p{grid-column:2}.case-gallery{gap:16px;padding-inline:5%}}@media(max-width:520px){.header{align-items:center}.wordmark span{max-width:150px}nav{gap:17px}nav .contact-link{display:none}.hero{padding-top:65px}.hero .eyebrow{font-size:10px}.hero h1{font-size:clamp(45px,10.9vw,60px);letter-spacing:-.065em}.hero-bottom p{max-width:290px;font-size:15px}.section-heading{align-items:start;gap:10px}.section-heading h2{font-size:13px;padding-top:7px;white-space:nowrap}.filters{gap:0}.filters button{font-size:10px;padding:7px 9px}.project-grid{grid-template-columns:1fr;gap:34px}.project-image{aspect-ratio:1.35}.project-caption h3{font-size:18px}.project-caption p{font-size:12px}.brand-section .section-heading{align-items:center}.brand-section .muted{font-size:10px}.brand-grid{gap:28px 14px}.brand-grid .zoom-image{aspect-ratio:1}.brand-grid figcaption h3{font-size:14px}.brand-grid figcaption p{font-size:10px;line-height:1.5}.about{grid-template-columns:1fr;gap:35px}.about-photo{width:70%;margin-left:0}.about-copy h2{font-size:40px}.about-copy p{font-size:16px}.contact>a{font-size:clamp(40px,10.5vw,58px)}.contact>a>span{font-size:40px}footer{font-size:10px;flex-wrap:wrap}footer>span:nth-child(2){display:none}.case-intro h1{font-size:60px}.case-meta{gap:15px;font-size:10px}.case-gallery{grid-template-columns:1fr}.case-gallery figure:first-child{grid-column:auto}.case-story{padding-top:35px;padding-bottom:35px}.story-row{padding-block:25px}.story-row h2{font-size:22px}.story-row p{font-size:15px}.next-project{margin-top:45px;margin-bottom:55px}.case-description{font-size:16px}.case-line{font-size:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

.arrow-icon{display:inline-block!important;width:14px!important;height:14px!important;max-width:none;object-fit:contain!important;vertical-align:-2px;flex:0 0 auto}.arrow-se{transform:rotate(90deg)}.arrow-left{transform:rotate(225deg)}.arrow-up{transform:rotate(-45deg)}.arrow-down{transform:rotate(135deg)}

.case-home-photo{display:block;width:48px;height:48px;flex:0 0 auto;border-radius:50%;overflow:hidden}
.case-home-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 32%}
@media(max-width:560px){.case-home-photo{width:44px;height:44px}}

/* Current MSN work and earlier Copilot work are distinct chapters. */
.case-team-intro{padding:65px 4.2% 36px;display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:start}
.case-team-intro h2{font-size:clamp(40px,5vw,76px);font-weight:400;letter-spacing:-.055em;line-height:1;margin:0}
.case-team-intro p{font-size:18px;line-height:1.55;margin:5px 0 0;color:#656565;max-width:650px}
.case-team-section+.case-team-section{border-top:1px solid var(--line)}
.msn-case-hero{position:relative;aspect-ratio:2923/1640;overflow:hidden;border-radius:12px;background:#747474 url("assets/microsoft-sky-optimized-v1.webp") center top/100% auto no-repeat}
.msn-case-hero>img{position:absolute;left:0;bottom:0;width:100%;height:87.37804878%;max-height:none;object-fit:fill;mask-image:linear-gradient(to bottom,transparent,black 16px)}
.msn-process{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;padding:36px 4.2% 80px}
.msn-process h3{font-size:24px;font-weight:400;letter-spacing:-.035em;line-height:1.15;margin:0}
.msn-process p{font-size:17px;line-height:1.6;color:#656565;max-width:650px;margin:0}
/* Match each column's total natural image height without cropping the work. */
.case-gallery.fifa-case-gallery{display:grid;grid-template-columns:1.0858112fr 1fr;gap:20px;align-items:start}
.fifa-gallery-column{display:flex;flex-direction:column;gap:20px;min-width:0}
.fifa-case-gallery .fifa-gallery-column figure{width:100%;margin:0}
@media(max-width:800px){.case-team-intro,.msn-process{grid-template-columns:1fr;gap:22px;padding-inline:5%}.case-team-intro{padding-top:45px}.msn-process{padding-bottom:50px}.case-team-intro p{font-size:16px}.case-gallery.fifa-case-gallery{grid-template-columns:1fr}}
/* Native navigation transitions preserve normal links, history and browser Back. */
@media(prefers-reduced-motion:no-preference){
 @view-transition{navigation:auto}
 ::view-transition-old(root){animation:140ms ease-out both case-page-out}
 ::view-transition-new(root){animation:240ms cubic-bezier(.16,1,.3,1) both case-page-in}
}
@keyframes case-page-out{to{opacity:0;transform:translateY(-5px)}}
@keyframes case-page-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}::view-transition-old(root),::view-transition-new(root){animation:none}}

.case-team-section .story-row h3{font-size:24px;line-height:1.15;letter-spacing:-.6px;font-weight:400;max-width:360px;margin:0}
.case-subheading{font-size:24px;font-weight:400}

/* Match natural image heights so the two Copilot designs meet without blank gaps. */
.copilot-image-pair{display:grid;grid-template-columns:1401fr 1791fr;gap:0;margin:0 4.2%;border-radius:12px;overflow:hidden}
.copilot-image-pair figure{min-width:0;margin:0}
.copilot-image-pair .zoom-image{display:block;width:100%;padding:0;border:0;background:none}
.copilot-image-pair img{display:block;width:100%;height:auto;object-fit:contain;transition:transform 650ms cubic-bezier(.19,1,.22,1)}
@media(max-width:800px){.copilot-image-pair{grid-template-columns:1fr;margin-inline:5%}}
