:root{
--bg:#0f0f10;
--surface:#171717;
--text:#f5f5f3;
--muted:#b0b0b0;
--accent:#c46a3c;
}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
background:var(--bg);
color:var(--text);
font-family:Arial, sans-serif;
line-height:1.5;
overflow-x:hidden;
}

.site-header{
position:fixed;
top:0;
left:0;
width:100%;
padding:28px 56px;
display:flex;
justify-content:space-between;
align-items:center;
background:rgba(0,0,0,.2);
backdrop-filter:blur(12px);
z-index:100;
}

.logo{
font-size:2rem;
letter-spacing:.35rem;
font-weight:300;
}

.logo span{
color:var(--accent);
}

nav{
display:flex;
gap:40px;
}

nav a{
color:white;
text-decoration:none;
font-size:.85rem;
text-transform:uppercase;
letter-spacing:.12rem;
opacity:.8;
}

.hero{
min-height:100vh;
display:flex;
align-items:center;
padding:0 7vw;
background:
linear-gradient(to right, rgba(0,0,0,.82), rgba(0,0,0,.3)),
url('https://images.unsplash.com/photo-1521590832167-7bcbfaa6381f?q=80&w=1600&auto=format&fit=crop');
background-size:cover;
background-position:center;
}

.hero-content{
max-width:760px;
}

.eyebrow{
color:var(--accent);
text-transform:uppercase;
letter-spacing:.16rem;
font-size:.8rem;
margin-bottom:30px;
}

h1{
font-size:clamp(4rem,7vw,7rem);
line-height:.95;
font-weight:300;
margin-bottom:40px;
}

.intro{
font-size:1.2rem;
max-width:620px;
color:var(--muted);
margin-bottom:50px;
}

.buttons{
display:flex;
gap:24px;
flex-wrap:wrap;
}

.btn{
padding:18px 34px;
text-decoration:none;
text-transform:uppercase;
font-size:.8rem;
letter-spacing:.12rem;
transition:.3s ease;
}

.primary{
background:var(--accent);
color:white;
}

.secondary{
border:1px solid rgba(255,255,255,.25);
color:white;
}

.statement{
padding:180px 7vw;
border-top:1px solid rgba(255,255,255,.08);
}

.statement-inner{
display:grid;
grid-template-columns:1fr 1fr;
gap:80px;
}

.statement h2{
font-size:clamp(2.8rem,5vw,5rem);
line-height:1.05;
font-weight:300;
}

.statement p{
color:var(--muted);
font-size:1.1rem;
}

.project{
display:grid;
grid-template-columns:1.2fr .8fr;
min-height:100vh;
}

.project-image{
background:
linear-gradient(rgba(0,0,0,.25), rgba(0,0,0,.5)),
url('https://images.unsplash.com/photo-1560066984-138dadb4c035?q=80&w=1600&auto=format&fit=crop');
background-size:cover;
background-position:center;
}

.project-text{
background:var(--surface);
padding:12vh 6vw;
display:flex;
flex-direction:column;
justify-content:center;
}

.project-text h2{
font-size:clamp(3rem,5vw,5rem);
font-weight:300;
margin-bottom:20px;
}

.project-text p{
font-size:1.1rem;
color:var(--muted);
max-width:420px;
margin-bottom:30px;
}

.project-text a{
color:var(--accent);
text-decoration:none;
}

footer{
padding:50px 7vw;
border-top:1px solid rgba(255,255,255,.08);
color:var(--muted);
}

@media(max-width:900px){

nav{
display:none;
}

.site-header{
padding:24px;
}

.hero{
padding:0 24px;
}

h1{
font-size:3.8rem;
}

.statement{
padding:100px 24px;
}

.statement-inner,
.project{
grid-template-columns:1fr;
}

.project-text{
padding:80px 24px;
}

.project-image{
min-height:50vh;
}
}