
/* Urban Renew — styles.css */
/* Brand colors */
:root{
  --charcoal: #2B2B2B;
  --concrete: #C9C9C9;
  --emerald: #3BA27A;
  --offwhite: #F5F5F5;
  --max-w: 1100px;
}

*{box-sizing:border-box}
body{font-family:'Source Sans 3', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; color:var(--charcoal); background:var(--offwhite); margin:0; -webkit-font-smoothing:antialiased;}

.container{max-width:var(--max-w); margin:0 auto; padding:2rem;}
.header-inner{display:flex; align-items:center; justify-content:space-between;}
.brand{display:flex; align-items:center; gap:1rem;}
.logo{height:80px; width:auto;}

.nav a{margin-left:1rem; text-decoration:none; color:var(--charcoal); font-weight:600;}
.nav .cta{padding:.5rem 1rem; border-radius:6px; border:1px solid transparent; background:transparent;}

.hero{padding:4rem 0;}
.hero-inner{display:grid; grid-template-columns:1fr 440px; gap:2rem; align-items:center;}
.hero h2{font-family:'Montserrat', sans-serif; font-size:2.2rem; margin:0 0 .5rem; color:var(--charcoal);}
.lead{margin:0 0 1.25rem; color:#4b4b4b;}

.btn{display:inline-block; padding:.65rem 1rem; border-radius:8px; text-decoration:none; font-weight:600;}
.btn-primary{background:var(--emerald); color:#fff;}
.btn-ghost{background:transparent; border:1px solid rgba(0,0,0,0.08); color:var(--charcoal);}

.card{background:#fff; border:1px solid rgba(0,0,0,0.04); padding:1.25rem; border-radius:8px;}

.section{padding:3rem 0;}
.section.alt{background:#fff;}

.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:1rem;}
.service h4{margin:0 0 .5rem; font-family:'Montserrat', sans-serif;}

.process{margin-top:1rem; padding-left:1.25rem;}
.process li{margin-bottom:.75rem;}

.contact-grid{display:grid; grid-template-columns:1fr 320px; gap:1rem; margin-top:1rem;}
.contact-form label{display:block; font-size:.9rem; margin-top:.75rem;}
.contact-form input, .contact-form textarea, .contact-form select{width:100%; padding:.6rem; margin-top:.35rem; border:1px solid rgba(0,0,0,0.08); border-radius:6px;}

.site-header{background:transparent; padding:.75rem 0; position:sticky; top:0; backdrop-filter: blur(4px);}
.site-footer{padding:2rem 0; text-align:center; color:#6b6b6b;}

/* responsive */
@media (max-width:900px){
  .hero-inner{grid-template-columns:1fr; text-align:left;}
  .grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .logo{height:48px;}
  .container{padding:1rem;}
}
/* accessibility helpers */
.sr-only{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;}
