:root{
    --bg:#0f1320;
    --card:#12172a;
    --text:#e8ecf1;
    --muted:#a8b3c7;
    --brand:#56c1ff;
    --brand-strong:#2aa6ea;
    --line:#1e2746;
  }
  
  *{box-sizing:border-box}
  html,body{margin:0;padding:0}
  body{
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial;
    background:var(--bg);
    color:var(--text);
    line-height:1.6;
  }
  
  .container{width:min(1120px, 92%); margin-inline:auto}
  
  .header{
    position:sticky; top:0; z-index:10;
    background:rgba(15,19,32,.9); backdrop-filter:saturate(140%) blur(6px);
    border-bottom:1px solid var(--line);
  }
  .header__inner{display:flex;align-items:center;justify-content:space-between; padding:14px 0}
  .brand{display:flex;gap:10px; align-items:center; text-decoration:none; color:var(--text)}
  .brand__logo{width:28px;height:28px}
  .brand__name{font-weight:700}
  
  .nav{display:flex;gap:18px}
  .nav__link{color:var(--muted); text-decoration:none; padding:8px 10px; border-radius:10px}
  .nav__link:hover{color:var(--text); background:#171e33}
  .nav__link--active{color:var(--text); background:#1a2341}
  .nav__toggle{display:none; background:transparent; border:0; color:var(--text); font-size:22px}
  
  @media (max-width: 860px){
    .nav__toggle{display:block}
    .nav{display:none; position:absolute; right:4%; top:60px; flex-direction:column; background:#0f152a; padding:12px; border:1px solid var(--line); border-radius:12px}
    .nav.show{display:flex}
  }
  
  .hero{padding:60px 0; border-bottom:1px solid var(--line)}
  .hero__grid{display:grid; grid-template-columns:1.1fr .9fr; gap:26px; align-items:center}
  .hero__text h1{font-size:clamp(26px, 4vw, 44px); line-height:1.2; margin:0 0 10px}
  .hero__text p{color:var(--muted)}
  .hero__cta{margin-top:18px; display:flex; gap:12px; flex-wrap:wrap}
  .hero__img{width:100%; border-radius:16px; box-shadow:0 10px 40px rgba(0,0,0,.35); object-fit:cover}
  
  @media (max-width: 900px){ .hero__grid{grid-template-columns:1fr} }
  
  .btn{display:inline-flex; align-items:center; gap:8px; padding:12px 16px; border-radius:12px; text-decoration:none; border:1px solid transparent; cursor:pointer}
  .btn--primary{background:linear-gradient(120deg,var(--brand),var(--brand-strong)); color:#052033; font-weight:700}
  .btn--primary:hover{filter:brightness(1.05)}
  .btn--ghost{background:transparent; color:var(--text); border-color:#2d3a62}
  .btn--ghost:hover{background:#12204a}
  
  .section{padding:56px 0}
  .section--alt{background:#0b1021; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
  .section__header{margin-bottom:22px}
  .section__header h2{margin:0 0 6px}
  .section__header p{color:var(--muted); margin:0}
  
  .grid-2{display:grid; grid-template-columns:1fr 1fr; gap:26px}
  @media (max-width: 900px){ .grid-2{grid-template-columns:1fr} }
  
  .list{padding-left:18px; margin:0}
  .list li{margin:6px 0}
  .list--checks{list-style: "✔  "}
  
  .cards{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
  .cards--grid-3{grid-template-columns:repeat(3,1fr)}
  @media (max-width: 1100px){ .cards{grid-template-columns:repeat(2,1fr)} }
  @media (max-width: 640px){ .cards, .cards--grid-3{grid-template-columns:1fr} }
  
  .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:14px;
    padding:18px;
    box-shadow:0 10px 30px rgba(0,0,0,.25);
  }
  .card h3{margin-top:0}
  
  .form{display:grid; gap:12px}
  .form__row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
  @media (max-width: 780px){ .form__row{grid-template-columns:1fr} }
  .form__field label{display:block; font-size:14px; color:var(--muted); margin-bottom:6px}
  .form__field input, .form__field textarea{
    width:100%; padding:12px 14px; border-radius:12px; border:1px solid #243055; background:#0b1227; color:var(--text)
  }
  .form__field input:focus, .form__field textarea:focus{outline:2px solid #2a5bd9}
  .form__status{color:var(--muted); min-height:20px}
  
  .map{width:100%; height:360px; border-radius:12px; border:1px solid var(--line)}
  
  .footer{
    border-top:1px solid var(--line);
    background:#0a0f1d;
    padding:22px 0; margin-top:30px
  }
  .footer__inner{display:flex; align-items:center; justify-content:space-between; gap:12px}
  .footer__nav a{color:var(--muted); margin-left:14px; text-decoration:none}
  .footer__nav a:hover{color:var(--text)}