:root{
  --bg:#0b1020; --panel:#0f172a; --muted:#64748b; --text:#e5e7eb; --accent:#60a5fa; --accent2:#34d399; --ring:#22d3ee;
  --card:#111827; --btn:#1f2937; --shadow:0 10px 30px rgba(0,0,0,.25);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
  background: radial-gradient(1200px 800px at 10% -10%, rgba(96,165,250,.15), transparent 60%), linear-gradient(180deg, var(--bg), #05060a);
  color:var(--text); line-height:1.6;
}
.container{width:min(1100px, 92%); margin:auto}
.skip-link{position:absolute;left:-999px;top:auto}
.skip-link:focus{left:8px;top:8px;background:#fff;color:#000;padding:8px;border-radius:6px}
.site-header{position:sticky; top:0; backdrop-filter:saturate(140%) blur(8px); background:rgba(5,6,10,.6); border-bottom:1px solid rgba(255,255,255,.06); z-index:50}
.header-inner{display:flex;align-items:center;gap:16px; padding:14px 0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
.brand-text{font-weight:800; font-size:1.25rem; letter-spacing:.2px}
.brand-text .accent{color:var(--accent)}
.logo{width:36px;height:36px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.35))}
.logo-bg{fill:url(#g)}
.logo-line{stroke:#fff; stroke-width:6; fill:none; stroke-linecap:round; stroke-linejoin:round}
.logo-post{fill:#fff}
.nav-toggle{display:none}
.nav-list{display:flex; gap:18px; list-style:none; margin:0; padding:0}
.nav-list a{color:var(--text); text-decoration:none; opacity:.9}
.nav-list a:hover{opacity:1; text-shadow:0 0 20px rgba(96,165,250,.4)}
.header-cta .btn{margin-left:8px}

.hero{padding:56px 0}
.hero-inner{display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:center}
.hero-text h1{font-size:2.2rem; line-height:1.2; margin:0 0 10px}
.hero-cta{display:flex; gap:10px; margin:14px 0 10px}
.pill-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:16px 0 0}
.pill-list li{background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); padding:6px 10px; border-radius:999px}

.hero-svg{width:100%;height:auto}
.svg-house-base{fill:#101828}
.svg-roof{fill:#3b82f6}
.svg-door{fill:#334155}
.svg-window{fill:#1f2937}

.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:36px auto}
.card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:20px; box-shadow:var(--shadow)}
.fade-up{animation:fadeup .7s ease both}
@keyframes fadeup{from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none}}

.checklist{padding-left:0; list-style:none}
.checklist li{position:relative; padding-left:28px; margin:10px 0}
.checklist li:before{content:""; position:absolute; left:0; top:.4em; width:18px; height:18px; border-radius:50%; background:conic-gradient(var(--accent), var(--accent2)); box-shadow:0 0 0 2px #0b1020}

.cta-banner{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(90deg, rgba(96,165,250,.18), rgba(52,211,153,.18)); padding:20px;border-radius:16px;border:1px solid rgba(255,255,255,.12)}

.site-footer{border-top:1px solid rgba(255,255,255,.08); margin-top:40px}
.footer-grid{display:grid; grid-template-columns:2fr 1fr 1fr; gap:20px; padding:24px 0}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px dashed rgba(255,255,255,.1)}

.service-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px}
.service-card{background:var(--panel); border:1px solid rgba(255,255,255,.08); padding:20px; border-radius:14px; transition:transform .25s ease, box-shadow .25s ease}
.service-card:hover{transform:translateY(-3px); box-shadow:0 8px 24px rgba(0,0,0,.35)}

.steps{counter-reset:s; padding-left:0; list-style:none}
.steps li{counter-increment:s; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); padding:12px 12px 12px 44px; margin:10px 0; border-radius:12px; position:relative}
.steps li:before{content:counter(s); position:absolute; left:10px; top:50%; transform:translateY(-50%); width:24px;height:24px; border-radius:8px; background:linear-gradient(135deg, var(--accent), var(--ring)); display:grid;place-items:center; font-weight:800}

.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px}
.address-block{background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); padding:14px; border-radius:12px}

.contact-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:20px}
.form-field{display:grid; gap:6px; margin:10px 0}
input,textarea{width:100%; padding:12px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.15); background:#0b1020; color:var(--text); outline:none}
input:focus,textarea:focus{border-color:var(--ring); box-shadow:0 0 0 3px rgba(34,211,238,.25)}
.form-actions{display:flex; gap:10px; align-items:center}
.form-note{opacity:.85; font-size:.925rem}

.btn{display:inline-block; padding:10px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.15); text-decoration:none; color:var(--text); transition:transform .2s ease, background .2s ease, border-color .2s ease}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg, var(--accent), var(--ring)); border-color:transparent; color:#0b1020; font-weight:700}
.btn-secondary{background:linear-gradient(135deg, rgba(96,165,250,.2), rgba(52,211,153,.2));}
.btn-ghost{background:transparent}
.link{color:var(--accent); text-decoration:none; border-bottom:1px dashed rgba(96,165,250,.5)}
.link:hover{border-bottom-style:solid}

.list-plain{list-style:none; padding:0; margin:0}
.address{white-space:pre-line}

.cookie-banner{position:fixed; left:0; right:0; bottom:-200px; opacity:0; transition:all .4s ease; background:rgba(5,6,10,.85); border-top:1px solid rgba(255,255,255,.12); backdrop-filter:blur(6px);}
.cookie-banner.active{bottom:0; opacity:1}
.cookie-inner{display:flex; gap:16px; align-items:center; justify-content:space-between; padding:14px 0}
.cookie-actions{display:flex; gap:10px}

.nav{margin-left:auto}
.header-cta{display:none}
@media (max-width:980px){
  .hero-inner{grid-template-columns:1fr}
  .grid3{grid-template-columns:1fr}
  .service-grid{grid-template-columns:1fr}
  .about-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .nav-toggle{display:inline-block}
  .nav-list{position:absolute; right:4%; top:64px; flex-direction:column; background:rgba(5,6,10,.96); padding:12px; border-radius:12px; border:1px solid rgba(255,255,255,.08); display:none}
  .nav-list.open{display:flex}
  .header-cta{display:none}
}
@media (min-width:981px){
  .header-cta{display:block}
}