:root{--bg:#0e0e0f;--bg2:#17171a;--fg:#e8e4dc;--mut:#9a958c;--acc:#c9a96e}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:300 17px/1.75 Inter,system-ui,sans-serif}
.grain{position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
h1,h2,.brand{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;letter-spacing:.02em;line-height:1.15}
h1{font-size:clamp(2.6rem,6vw,4.5rem);margin:.2em 0 .4em}h2{font-size:2rem;margin:0 0 .3em}
a{color:var(--acc)}
header{position:sticky;top:0;z-index:40;display:flex;justify-content:space-between;align-items:center;padding:1.2rem 5vw;background:rgba(14,14,15,.92);backdrop-filter:blur(6px);border-bottom:1px solid #222}
.brand{font-size:1.6rem;color:var(--fg);text-decoration:none}
nav a{margin-left:2rem;color:var(--mut);text-decoration:none;text-transform:uppercase;font-size:.8rem;letter-spacing:.18em}
nav a:hover,nav a.active{color:var(--fg)}
.menu{display:none;background:none;border:0;color:var(--fg);font-size:1.6rem;cursor:pointer}
main{min-height:70vh}.wrap{max-width:1100px;margin:0 auto;padding:5rem 5vw}
.eyebrow{color:var(--acc);text-transform:uppercase;letter-spacing:.3em;font-size:.75rem;margin:0}
.lead{font-size:1.25rem;color:var(--mut)}
.btn{display:inline-block;padding:.8rem 2rem;border:1px solid var(--acc);background:var(--acc);color:#111;text-decoration:none;text-transform:uppercase;letter-spacing:.15em;font-size:.8rem;margin:.4rem .6rem .4rem 0;transition:.2s}
.btn.ghost{background:none;color:var(--acc)}.btn:hover{background:var(--fg);border-color:var(--fg);color:#111}
.hero{display:grid;grid-template-columns:minmax(0,420px) 1fr;gap:5vw;align-items:center;max-width:1200px;margin:0 auto;padding:8vh 5vw 12vh;min-height:85vh}
.hero img{width:100%;filter:grayscale(.3) contrast(1.05);box-shadow:0 30px 80px #000}
.hero h1{font-size:clamp(3rem,8vw,6rem)}
.work{display:grid;grid-template-columns:260px 1fr;gap:3rem;padding:3.5rem 0;border-top:1px solid #26262a}
.work img{width:100%;box-shadow:0 20px 50px #000}
.meta{color:var(--acc);font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}
.credits{list-style:none;padding:0;color:var(--mut);font-size:.95rem}.credits b{color:var(--fg);font-weight:500}
.about-grid{display:grid;grid-template-columns:320px 1fr;gap:4rem;align-items:start}.about-grid img{width:100%}
.contact .mail{font-family:'Cormorant Garamond',serif;font-size:clamp(1.6rem,4vw,2.8rem);text-decoration:none}
footer{text-align:center;padding:3rem 5vw;color:var(--mut);font-size:.85rem;border-top:1px solid #222}footer a{color:var(--mut)}
@media(max-width:800px){.menu{display:block}nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg2);flex-direction:column;padding:1rem 5vw}
.open nav{display:flex}nav a{margin:.7rem 0}.hero,.work,.about-grid{grid-template-columns:1fr}.hero{min-height:0}.work img,.about-grid img{max-width:320px}}
