:root{
  --text:#111;
  --muted:#9a9a9a;
  --line:#d8d8d8;
  --bg:#fff;
  --max:1320px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Helvetica Neue',Arial,sans-serif;font-size:16px;letter-spacing:.16em;line-height:1.8;font-weight:400}
a{color:inherit;text-decoration:none}
.site-header{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:44px 52px 0;min-height:74px}
.logo{font-size:22px;font-weight:600;letter-spacing:.12em;text-align:center;white-space:nowrap}.nav-left{justify-self:start}.nav-right{justify-self:end;display:flex;gap:35px}.nav-link{font-size:14px;color:var(--muted);letter-spacing:.13em}.nav-link.active,.nav-link:hover{color:#000}.page-title{text-align:center;font-size:46px;letter-spacing:.12em;font-weight:400;margin:145px 0 185px}.work-grid{max-width:var(--max);margin:0 auto 70px;padding:0 40px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.tile{position:relative;overflow:hidden;background:#ddd;min-height:520px;display:block}.tile.wide{grid-column:1/-1;min-height:560px}.tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease,filter .35s ease}.tile:after{content:"";position:absolute;inset:0;background:#000;opacity:0;transition:opacity .35s ease}.tile-title{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;z-index:2;opacity:0;transition:opacity .35s ease;font-size:18px;letter-spacing:.14em;padding:20px}.tile:hover img{filter:brightness(.72);transform:scale(1.015)}.tile:hover:after{opacity:.16}.tile:hover .tile-title{opacity:1}.about-main{max-width:500px;margin:0 auto 90px;padding:0 30px}.about-main img{width:100%;display:block;margin-bottom:34px}.body-copy{letter-spacing:.12em;color:#999;font-size:16px;line-height:1.9}.contact-main{max-width:700px;margin:0 auto 100px;padding:0 30px}.contact-details{color:#999;margin-bottom:82px}.contact-form label{display:block;color:#999;letter-spacing:.13em;margin-top:22px}.contact-form small{font-size:11px}.contact-form input,.contact-form textarea{width:100%;height:42px;border:1px solid #aaa;background:#fff;font:inherit;letter-spacing:.04em;padding:8px}.contact-form textarea{height:96px;resize:vertical}.submit-wrap{text-align:center;margin-top:22px}.btn{border:2px solid #000;border-radius:999px;background:#fff;padding:14px 42px;font-weight:700;letter-spacing:.04em;font-size:14px;cursor:pointer}.portfolio-title{text-align:center;font-size:30px;letter-spacing:.14em;font-weight:400;margin:85px 0 145px}.video-wrap{max-width:1240px;margin:0 auto 110px;padding:0 40px}.video-card{position:relative;background:#111;aspect-ratio:16/9;overflow:hidden}.video-card img{width:100%;height:100%;object-fit:cover;display:block}.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:96px;height:96px;border-radius:50%;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center}.play:before{content:"";border-top:22px solid transparent;border-bottom:22px solid transparent;border-left:32px solid #fff;margin-left:8px}.video-bar{position:absolute;bottom:0;left:0;right:0;height:42px;background:linear-gradient(transparent,rgba(0,0,0,.65));color:#fff;font-size:12px;letter-spacing:.05em;display:flex;align-items:end;padding:0 16px 9px}.portfolio-copy{max-width:760px;margin:0 auto 110px;padding:0 30px;color:#999;letter-spacing:.1em}.footer{height:80px}@media(max-width:800px){.site-header{padding:28px 22px 0;grid-template-columns:1fr;gap:16px;text-align:center}.nav-left,.nav-right{justify-self:center}.logo{order:-1}.page-title{font-size:34px;margin:90px 0 90px}.work-grid{grid-template-columns:1fr;padding:0 18px}.tile,.tile.wide{grid-column:1;min-height:360px}.portfolio-title{margin:70px 0 70px;font-size:26px}.video-wrap{padding:0 18px}.about-main,.contact-main{max-width:92%}}
