:root{--paper:#f2efe9;--ink:#11110f;--red:#e54a35;--blue:#a8c6da;--line:rgba(17,17,15,.24);--serif:"Newsreader",serif;--sans:"Archivo",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.55 var(--sans)}img{display:block;width:100%;object-fit:cover}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:#fff;padding:12px;z-index:20}header{height:92px;padding:0 3.5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-weight:600;letter-spacing:.06em;line-height:.9}.brand i{font:italic 25px var(--serif)}.brand small{display:block;font-size:7px;letter-spacing:.27em;margin-top:8px}nav{display:flex;gap:34px;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.menu{display:none}
.hero{padding:90px 3.5vw 130px}.hero-title{display:grid;grid-template-columns:1fr 3fr}.hero-title>p,.section-title>p,.eyebrow{text-transform:uppercase;letter-spacing:.15em;font-size:9px}.hero h1{font:400 clamp(68px,9vw,145px)/.82 var(--serif);letter-spacing:-.055em;margin:0}.hero h1 em{font-weight:400;color:var(--red)}.hero-grid{display:grid;grid-template-columns:1.5fr .6fr .55fr;gap:22px;align-items:end;margin-top:85px}.hero figure{margin:0}.hero figure img{height:670px}.hero figure.two img{height:390px}.hero figcaption{text-transform:uppercase;font-size:8px;letter-spacing:.14em;margin-top:10px}.note{padding-bottom:80px}.note span{font:70px var(--serif);color:var(--red)}.note p{font:25px/1.2 var(--serif)}.note a{font-size:10px;text-transform:uppercase;border-bottom:1px solid;padding-bottom:6px}.ticker{overflow:hidden;background:var(--blue);border-block:1px solid var(--ink);padding:17px 0}.ticker p{white-space:nowrap;font-weight:600;letter-spacing:.14em;margin:0}
.work{padding:140px 3.5vw}.section-title{display:grid;grid-template-columns:1fr 3fr;align-items:end}.section-title h2{font:400 clamp(70px,9vw,140px)/.8 var(--serif);margin:0}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px 24px;margin-top:90px;align-items:start}.project-grid article.large{grid-row:span 2}.project-grid article.wide{grid-column:1/3}.project-grid button{border:0;background:transparent;padding:0;text-align:left;width:100%;cursor:pointer}.project-grid img{height:540px}.project-grid .large img{height:950px}.project-grid .wide img{height:650px}.project-grid span{display:flex;justify-content:space-between;margin-top:14px}.project-grid b{font:27px var(--serif)}.project-grid small{text-transform:uppercase;letter-spacing:.1em;font-size:8px}.project-grid img{transition:filter .25s,transform .35s}.project-grid button:hover img{filter:saturate(.7);transform:translateY(-5px)}
.approach{background:var(--ink);color:#fff;padding:140px 6vw;display:grid;grid-template-columns:.4fr 1.6fr;overflow:hidden}.rotate{writing-mode:vertical-rl;transform:rotate(180deg);font:80px/1 var(--serif);color:var(--red)}.approach h2,.studio h2{font:400 clamp(53px,6vw,94px)/.93 var(--serif);margin:45px 0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.25);margin-top:80px}.steps article{background:var(--ink);padding:28px}.steps span{color:var(--red)}.steps h3{font:31px var(--serif);margin-top:70px}.steps p{color:#a7a7a2;font-size:12px}.studio{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;padding:140px 3.5vw;align-items:center}.studio>div{padding-left:5vw}.studio>div>p:last-child{max-width:450px;color:#6b6a65}.studio img{height:680px}.contact{padding:140px 8vw;background:var(--red);color:#fff}.contact>p{text-transform:uppercase;letter-spacing:.15em;font-size:10px}.contact h2{font:400 clamp(62px,8.5vw,130px)/.85 var(--serif);margin:50px 0}.contact h2 em{font-weight:400;color:var(--ink)}.contact a{font-size:18px;border-bottom:1px solid;padding-bottom:7px}footer{padding:35px 3.5vw;display:grid;grid-template-columns:1fr 1fr 2fr;font-size:9px;text-transform:uppercase;letter-spacing:.13em}footer p:last-child{text-align:right}
dialog{width:min(600px,calc(100% - 32px));border:1px solid var(--ink);background:var(--paper);padding:55px;box-shadow:10px 10px 0 var(--red)}dialog::backdrop{background:rgba(0,0,0,.67)}dialog .close{position:absolute;right:16px;top:12px;border:0;background:transparent;font-size:30px;cursor:pointer;width:44px;height:44px}dialog h2{font:55px var(--serif);margin:25px 0}dialog>p{font-size:9px;text-transform:uppercase;letter-spacing:.13em}dialog span{display:block;margin-bottom:35px}dialog a{border-bottom:1px solid}
:focus-visible{outline:3px solid var(--red);outline-offset:4px}@media(max-width:780px){header{height:74px}.menu{display:grid;width:48px;height:48px;border:0;background:transparent;place-content:center;gap:6px}.menu span{width:24px;height:1px;background:var(--ink)}nav{display:none;position:absolute;top:74px;left:0;right:0;background:var(--paper);z-index:5;padding:25px;flex-direction:column}nav.open{display:flex}.hero{padding:70px 22px 90px}.hero-title,.section-title{grid-template-columns:1fr}.hero h1{font-size:65px;margin-top:30px}.hero-grid{grid-template-columns:1fr;margin-top:55px}.hero figure img{height:500px}.note{padding:20px 0}.hero figure.two{display:none}.work{padding:90px 22px}.project-grid{grid-template-columns:1fr;gap:55px}.project-grid article.wide{grid-column:auto}.project-grid img,.project-grid .large img,.project-grid .wide img{height:530px}.approach{grid-template-columns:1fr;padding:90px 22px}.rotate{display:none}.steps{grid-template-columns:1fr}.steps h3{margin-top:30px}.studio{grid-template-columns:1fr;padding:90px 22px}.studio>div{padding-left:0}.studio img{height:500px}.contact{padding:90px 22px}footer{grid-template-columns:1fr;gap:15px}footer p:last-child{text-align:left}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Portfolio QA overrides */
.brand small,.hero-title>p,.section-title>p,.eyebrow,.hero figcaption,.project-grid small,dialog>p,footer{font-size:10px}
.ticker p{width:max-content;animation:studio-ticker 26s linear infinite}
@keyframes studio-ticker{to{transform:translateX(-50%)}}
.contact a{color:var(--ink)}
.contact :focus-visible{outline-color:#fff;box-shadow:0 0 0 5px var(--ink)}
@media(max-width:780px){nav a{display:flex;align-items:center;min-height:44px;padding:10px 4px}.hero figure.two{display:block}.hero figure.two img{height:360px}}
@media(prefers-reduced-motion:reduce){.ticker p{animation:none!important}}