:root{
  --bg:#0e0f12;
  --panel:#14161a;
  --panel-2:#191c22;
  --text:#e7eaf0;
  --muted:#aab2c0;
  --primary:#2ea6ff;
  --primary-600:#1f7ccd;
  --accent:#ffd166;
  --success:#22c55e;
  --danger:#ef4444;
  --border: #2a2f38;
  --shadow: rgba(0,0,0,.35);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:radial-gradient(1200px 800px at 10% -10%, #0f2538 0%, #0e0f12 45%),
             radial-gradient(800px 600px at 100% 0%, #241b36 0%, rgba(14,15,18,0) 30%) , var(--bg);
}

/* Layout */
.container{width:min(1100px, 92%); margin-inline:auto}
.section{padding:64px 0}
.section.alt{background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.0))}
.page-hero.small{padding:48px 0 16px}

/* Header */
.site-header{position:sticky; top:0; z-index:40; background:rgba(14,15,18,.6); backdrop-filter: blur(8px); border-bottom:1px solid var(--border)}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:14px 0}
.brand{color:#fff; text-decoration:none; font-weight:700; letter-spacing:.3px; font-size:20px}
.main-nav ul{display:flex; gap:18px; list-style:none; margin:0; padding:0}
.main-nav a{color:var(--muted); text-decoration:none; padding:8px 10px; border-radius:8px}
.main-nav a:hover,.main-nav a.active{color:#fff; background:var(--panel)}
.nav-toggle{display:none; background:transparent; color:#fff; border:1px solid var(--border); border-radius:8px; padding:6px 10px}

/* Hero */
.hero{padding:72px 0 32px; border-bottom:1px solid var(--border)}
.hero-inner{display:grid; grid-template-columns:1.1fr .9fr; gap:24px; align-items:center}
.hero-copy h1{margin:0 0 10px; font-size:40px; line-height:1.15}
.hero-copy p{margin:0 0 24px; color:var(--muted); font-size:18px}
.hero-actions{display:flex; gap:12px}
.hero-aside{display:flex; justify-content:center}
.hero-art{width:100%; max-width:460px; aspect-ratio:1.1/1; border-radius:16px; background:
  radial-gradient(350px 220px at 30% 20%, rgba(46,166,255,.28), rgba(46,166,255,0) 60%),
  radial-gradient(260px 200px at 70% 70%, rgba(255,209,102,.2), rgba(255,209,102,0) 60%),
  linear-gradient(135deg, #0f1726, #12192a);
  border:1px solid var(--border);
  box-shadow: 0 10px 30px var(--shadow) inset, 0 10px 30px -10px rgba(46,166,255,.25);
}

/* Cards */
.cards-grid{display:grid; grid-template-columns: repeat( auto-fit, minmax(230px, 1fr) ); gap:16px}
.card{background:linear-gradient(180deg, var(--panel), var(--panel-2)); border:1px solid var(--border); border-radius:14px; padding:18px; box-shadow: 0 6px 14px var(--shadow)}
.card h3{margin:0 0 6px}
.card p, .card li{color:var(--muted)}

/* CTA strip */
.cta-strip{border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:linear-gradient(90deg, rgba(46,166,255,.1), rgba(46,166,255,0));}
.cta-strip-inner{display:flex; gap:16px; align-items:center; justify-content:space-between; padding:16px 0}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 14px; border-radius:10px; text-decoration:none; font-weight:600; letter-spacing:.2px; border:1px solid transparent}
.btn-primary{background:linear-gradient(180deg, var(--primary), var(--primary-600)); color:#08121a}
.btn-primary:hover{filter:brightness(1.05)}
.btn-secondary{background:transparent; color:#fff; border-color:var(--border)}
.btn-secondary:hover{background:var(--panel)}
.btn-light{background:#fff; color:#0e0f12}
.btn-light:hover{filter:brightness(0.95)}

/* Forms */
.form{margin-top:16px}
.form-row{display:block; margin:12px 0}
.form-row.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
label{display:block; margin:0 0 6px; font-weight:600}
input, select, textarea{
  width:100%;
  padding:10px 12px;
  background:var(--panel);
  color:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  outline:none;
}
input:focus, select:focus, textarea:focus{border-color: var(--primary)}
.form-actions{display:flex; gap:12px; align-items:center; margin-top:8px}
#estimateStatus, #contactStatus{font-size:14px; color:var(--muted)}

/* Content */
.content-grid{display:grid; grid-template-columns: 1.2fr .8fr; gap:24px}
.checklist{list-style:none; padding:0; margin:0}
.checklist li{position:relative; padding-left:26px; margin:8px 0}
.checklist li::before{content:"✔"; position:absolute; left:0; color:var(--success)}

/* Footer */
.site-footer{border-top:1px solid var(--border); margin-top:40px; padding:18px 0; color:var(--muted)}
.footer-inner{display:flex; align-items:center; justify-content:space-between}

/* Responsive */
@media (max-width: 860px){
  .hero-inner{grid-template-columns:1fr}
  .content-grid{grid-template-columns:1fr}
  .form-row.grid-2{grid-template-columns:1fr}
  .nav-toggle{display:inline-flex}
  .main-nav ul{display:none}
  .main-nav[aria-expanded="true"] ul{display:flex; flex-direction:column; background:var(--panel); position:absolute; right:4%; top:62px; padding:10px; border:1px solid var(--border); border-radius:12px}
}

/* Utilities */
.section-title{margin:0 0 18px}