:root{--bg:#e8e8e8;--ink:#342e2e;--soft:#5a5252;--panel:#fafafa;--line:#342e2e}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.55 'Epilogue',system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit}
img{max-width:100%;display:block}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 14px;border-radius:999px;z-index:10}
.skip:focus{left:16px}
.top{display:flex;justify-content:space-between;align-items:center;padding:34px clamp(16px,4vw,64px);gap:16px}
.brand{font:400 20px/1 'Anton',Impact,sans-serif;text-transform:uppercase;text-decoration:none;letter-spacing:.01em}
.nav{display:flex;gap:clamp(14px,2.2vw,32px);font-size:14px}
.nav a{text-decoration:none;padding:4px 0;border-bottom:1px solid transparent}
.nav a:hover,.nav a[aria-current=page]{border-bottom-color:var(--ink)}
main{flex:1}
.display{font:400 clamp(30px,4.1vw,58px)/1.06 'Anton',Impact,sans-serif;text-transform:uppercase;margin:0;letter-spacing:.005em}
.h1{font:400 clamp(44px,6vw,85px)/1.04 'Anton',Impact,sans-serif;text-transform:uppercase;margin:0 0 20px}
.h2{font:400 clamp(30px,3.4vw,50px)/1.06 'Anton',Impact,sans-serif;text-transform:uppercase;margin:0 0 22px}
.hero{min-height:calc(100vh - 110px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:clamp(48px,9vh,120px);padding:40px clamp(16px,4vw,64px) 80px}
.hero .display{max-width:940px}
.btn{display:inline-block;background:var(--ink);color:#fff;text-decoration:none;text-transform:uppercase;font:500 14px/1 'Epilogue',sans-serif;padding:26px 66px;border-radius:999px;border:0;cursor:pointer;transition:opacity .2s}
.btn:hover{opacity:.86}
.intro{min-height:70vh;display:flex;align-items:center;justify-content:center;padding:40px clamp(16px,4vw,64px) 80px}
.intro .display{max-width:1210px}
.work{background:var(--panel);padding:clamp(60px,10vw,140px) clamp(16px,6vw,120px)}
.proj{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,4.5vw,68px);align-items:center;max-width:1200px;margin:0 auto}
.proj+.proj{margin-top:clamp(80px,12vw,180px)}
.proj p{margin:0 0 16px;font-size:15px;line-height:1.55;color:var(--ink)}
.proj .shot{display:block;overflow:hidden}
.proj .shot img{width:100%;height:auto;transition:transform .5s ease}
.proj .shot:hover img{transform:scale(1.02)}
.proj .open{display:inline-block;margin-top:8px;font-size:14px;text-decoration:underline;text-underline-offset:4px}
.page{padding:20px clamp(16px,4vw,64px) 80px}
.page .copy{max-width:600px}
.page .copy p{font-size:15px;margin:0 0 16px}
.page .copy h2{font:400 26px/1.1 'Anton',Impact,sans-serif;text-transform:uppercase;margin:32px 0 10px}
.page .copy ul{font-size:15px;padding-left:20px;margin:0 0 16px}
.form{max-width:600px;margin-top:clamp(40px,12vh,120px);display:grid;grid-template-columns:1fr 1fr;gap:18px 14px}
.form .full{grid-column:1/-1}
.form legend,.form label{font-size:14px;display:block;margin-bottom:6px}
.form fieldset{border:0;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.form legend{grid-column:1/-1;padding:0}
.form small{font-size:11px;color:var(--soft);margin-left:4px}
.form input,.form textarea{width:100%;font:inherit;font-size:15px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:14px;padding:10px 14px}
.form textarea{min-height:130px;resize:vertical;border-radius:14px}
.form input:focus,.form textarea:focus{outline:2px solid var(--ink);outline-offset:1px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.status{margin:0;font-size:15px;min-height:1.5em}
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:28px clamp(16px,4vw,64px);font-size:13px;color:var(--soft)}
.foot a{text-decoration:none}.foot a:hover{text-decoration:underline}
@media (max-width:760px){
 .proj{grid-template-columns:1fr}
 .proj .txt{order:2}.proj .shot{order:1}
 .form,.form fieldset{grid-template-columns:1fr}
 .form fieldset>div+div{margin-top:12px}
 .hero{min-height:auto;padding-top:60px}
 .intro{min-height:auto;padding-top:60px}
 .btn{padding:22px 52px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}