:root{
--primary:#1f2937;
--brandcolor:#edb739;
--accent:#d97706;
--light:#f8fafc;
--text:#334155;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Arial,sans-serif;color:var(--text);line-height:1.6}
header{background:var(--brandcolor);position:sticky;top:0}
.nav{max-width:1200px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:1rem}
.nav a{color:white;text-decoration:none;margin-left:1rem}
.hero{min-height:70vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:2rem;background:linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,.45)),url('./images/main.jpg?auto=format&fit=crop&w=1600&q=80');background-size:cover;color:white}
.hero h1{font-size:3rem}
.btn{display:inline-block;background:var(--brandcolor);color:white;padding:.9rem 1.3rem;border-radius:8px;text-decoration:none;margin-top:1rem}
.container{max-width:1200px;margin:auto;padding:4rem 1.2rem}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}
.card{background:white;border-radius:12px;padding:1.5rem;box-shadow:0 4px 16px rgba(0,0,0,.08)}
.project img{width:100%;height:300px;object-fit:cover;border-radius:12px}
footer{background:var(--brandcolor);color:white;text-align:center;padding:1.5rem;margin-top:3rem}
.contact-box{background:var(--light);padding:2rem;border-radius:12px}
@media(max-width:768px){.hero h1{font-size:2rem}.nav{flex-direction:column;gap:.8rem}}