*{box-sizing:border-box}
:root{
  --bg:#0b1420; --fg:#eaf1fb; --muted:#a7b3c6;
  --brand1:#2a6cf0; --brand2:#39a0ff;
  --panel:#101a29; --panel-alt:#0e1726;
}
html,body{margin:0;padding:0;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--fg)}
a{color:var(--fg);text-decoration:none}
/* Header */
.site-header{position:sticky;top:0;background:rgba(11,20,32,0.9);backdrop-filter:saturate(120%) blur(10px);z-index:10;border-bottom:1px solid rgba(255,255,255,0.06)}
.nav{display:flex;justify-content:center;align-items:center;padding:12px 18px}
.nav-links{display:flex;gap:18px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.nav-links a{opacity:.9;padding:6px 10px;border-radius:8px}
.nav-links a:hover{opacity:1;background:rgba(255,255,255,0.06)}
.nav-links .pill{background:linear-gradient(90deg,var(--brand1),var(--brand2));font-weight:700}

/* Section logo banner (bigger, full width) */
.section{padding:40px 20px}
.section-logo-banner{display:block;width:100%;padding:0 10px;margin:0 auto 10px auto}
.section-logo-banner img{display:block;width:100%;max-height:220px;object-fit:contain;margin:0 auto}

/* Hero */
.hero{display:block;background:linear-gradient(135deg,var(--panel),var(--panel-alt));text-align:center}
.hero-inner{max-width:900px;margin:18px auto 0 auto}
.hero h1{font-size:clamp(36px,6vw,60px);margin:0 0 12px 0}
.hero p{color:var(--muted);font-size:18px;margin:0 0 24px 0}
.btn{display:inline-block;padding:12px 18px;background:linear-gradient(90deg,var(--brand1),var(--brand2));border-radius:10px;font-weight:700}

/* Sections */
.section h2{font-size:clamp(28px,4vw,40px);margin:18px 0}
.section.alt{background:#0d192b}
.lead{font-size:18px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.06);padding:18px;border-radius:12px}

/* Gallery grid */
.project-title{margin-top:8px}
.project-sub{color:var(--muted);margin-top:-6px}
.gallery.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:16px}
.gallery.grid img{width:100%;height:220px;object-fit:cover;border-radius:10px;border:1px solid rgba(255,255,255,0.08)}

/* Review form */
.review-actions{display:flex;gap:12px;margin:8px 0 16px 0;flex-wrap:wrap}
.btn.ghost{background:transparent;border:1px solid rgba(255,255,255,0.25)}
.review-form{max-width:640px;margin:0 auto;display:grid;gap:12px}
.review-form input,.review-form textarea,.review-form select{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.02);color:var(--fg);padding:12px;border-radius:10px}

/* Instant quote */
.quote-form{max-width:740px;margin:0 auto;display:grid;gap:12px}
.quote-form input,.quote-form textarea,.quote-form select{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.02);color:var(--fg);padding:12px;border-radius:10px}
.estimate{display:flex;justify-content:space-between;align-items:center;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);padding:12px;border-radius:10px;font-weight:700}

/* Contact */
.contact-form{max-width:680px;margin:0 auto;display:grid;gap:12px}
.contact-form label{display:grid;gap:6px;font-weight:500;color:var(--fg)}
.contact-form input,.contact-form textarea{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.02);color:var(--fg);padding:12px;border-radius:10px}
.contact-form button{justify-self:start}

/* Footer */
.site-footer{padding:28px 24px;border-top:1px solid rgba(255,255,255,0.06);color:var(--muted);text-align:center}

/* Responsive tweaks */
@media (max-width: 768px){
  .section-logo-banner img{max-height:180px}
}
@media (max-width: 480px){
  .section-logo-banner img{max-height:150px}
}
