a{color:inherit; text-decoration:none}

  .btn{
    display:inline-flex; align-items:center; justify-content:center;
    height:50px; padding:0 18px; border-radius:14px; border:1px solid transparent;
    font-weight:700; cursor:pointer; transition:.15s transform,.15s opacity,.15s box-shadow;
    user-select:none; white-space:nowrap;
  }
  .btn:active{transform:translateY(1px)}
  .btn-primary{background:var(--orange); color:#fff; box-shadow:0 10px 22px rgba(249,115,22,.28)}
  .btn-primary:hover{opacity:.96}
  .btn-ghost{background:transparent; border-color:var(--line); color:var(--blue)}
  .pill{display:inline-flex; gap:8px; align-items:center; padding:8px 12px; border-radius:999px; background:rgba(59,130,246,.10); color:var(--blue); font-weight:700}
  .grid{display:grid; gap:16px}



  /* Hero */
  .hero{padding:34px 0 14px}
  .hero-wrap{
    border-radius:var(--radius2);
    background:
      radial-gradient(1200px 420px at 20% 10%, rgba(59,130,246,.18), transparent 60%),
      radial-gradient(900px 380px at 90% 40%, rgba(249,115,22,.18), transparent 55%),
      #fff;
    border:1px solid var(--line);
    box-shadow:var(--shadow);
    overflow:hidden;
  }
  .hero-inner{display:grid; grid-template-columns:1.2fr .8fr; gap:22px; padding:26px}
  h1{margin:8px 0 10px; font-size:40px; line-height:1.08; letter-spacing:-.02em; color:var(--blue)}
  .lead{color:var(--text); font-size:16px; margin:0 0 16px}
  .hero-badges{display:flex; gap:10px; flex-wrap:wrap; margin:14px 0 18px}
  .checks{display:grid; gap:10px; margin:16px 0 18px}
  .check{display:flex; gap:10px; align-items:flex-start; color:var(--text); font-weight:700}
  .check svg{flex:0 0 auto; margin-top:2px}
  .hero-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:8px}
  .note{color:var(--muted); font-weight:700; margin-top:10px}

  /* Form card */
  .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:var(--radius2);
    box-shadow:0 14px 28px rgba(2,6,23,.07);
    overflow:hidden;
  }
  .card-head{padding:18px 18px 0}
  .card-head b{font-size:18px}
  .card-head p{margin:6px 0 0; color:var(--muted); font-weight:700}
  .form{padding:14px 18px 18px; display:grid; gap:12px}
  .field{display:grid; gap:6px}
  .field label{color:var(--muted); font-weight:800; font-size:13px}
  .field input, .field textarea{
    width:100%;
    border:1px solid rgba(15,23,42,.14);
    border-radius:14px;
    padding:12px 12px;
    font:inherit;
    outline:none;
    background:#fff;
  }
  .field textarea{min-height:86px; resize:vertical}
  .form .btn{width:100%}
  .form small{color:var(--muted); font-weight:700}

  /* Sections */
  section{padding:28px 0}
  .section-title{display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:14px}
  .section-title h2{margin:0; font-size:26px; color:var(--blue)}
  .section-title p{margin:0; color:var(--muted);}
  .kpis{grid-template-columns:repeat(4,1fr)}
  .kpi{
    padding:16px; border-radius:var(--radius);
    background:#fff; border:1px solid var(--line);
  }
  .kpi b{display:block; font-size:20px; color:var(--blue)}
  .kpi span{color:var(--muted); font-weight:700}

  .cards-4{grid-template-columns:repeat(4,1fr)}
  .svc{
    padding:16px; border-radius:var(--radius);
    background:#fff; border:1px solid var(--line);
    display:flex; gap:12px; align-items:flex-start;
    transition:.15s transform,.15s box-shadow;
  }
  .svc:hover{transform:translateY(-2px); box-shadow:0 14px 26px rgba(2,6,23,.08)}
  .icon{
    width:44px; height:44px; border-radius:16px;
    background:rgba(59,130,246,.12);
    display:flex; align-items:center; justify-content:center;
    color:var(--blue);
  }
  .icon svg{width:22px; height:22px; display:block}
  .svc b{display:block}
  .svc small{display:block; color:var(--muted); font-weight:700; margin-top:4px}

  .benefits{grid-template-columns:repeat(3,1fr)}
  .benefit{
    padding:16px; border-radius:var(--radius);
    background:#fff; border:1px solid var(--line);
  }
  .benefit b{display:block; margin-top:8px}
  .benefit p{margin:6px 0 0; color:var(--muted);}

  .steps{grid-template-columns:repeat(4,1fr)}
  .step{
    padding:16px; border-radius:var(--radius);
    background:linear-gradient(180deg, rgba(59,130,246,.10), transparent 56%), #fff;
    border:1px solid var(--line);
  }
  .step .n{
    width:36px; height:36px; border-radius:14px;
    background:rgba(249,115,22,.14);
    display:flex; align-items:center; justify-content:center;
    font-weight:900; color:var(--orange);
    margin-bottom:10px;
  }
  .step b{display:block}
  .step p{margin:6px 0 0; color:var(--muted)}

  .prices{grid-template-columns:repeat(4,1fr)}
  .price{
    padding:16px; border-radius:var(--radius);
    background:#fff; border:1px solid var(--line);
  }
  .price b{display:block; font-size:18px; color:var(--blue)}
  .price span{display:block; margin-top:6px; color:var(--muted)}

  .cta{
    border-radius:var(--radius2);
    background:linear-gradient(135deg, rgba(30,58,138,.96), rgba(59,130,246,.92));
    color:#fff;
    padding:20px;
    display:flex; align-items:center; justify-content:space-between; gap:14px;
    box-shadow:0 18px 34px rgba(30,58,138,.18);
  }
  .cta h3{margin:0; font-size:22px}
  .cta p{margin:6px 0 0; color:rgba(255,255,255,.86); font-weight:700}
  .cta .btn{box-shadow:none}

  /* FAQ */
  .faq{display:grid; gap:10px}
  details{
    background:#fff; border:1px solid var(--line); border-radius:var(--radius);
    padding:14px 16px;
  }
  summary{cursor:pointer; font-weight:900; color:var(--blue)}
  details p{margin:10px 0 0; color:var(--muted); font-weight:700}

  /* Contacts */
  .contacts{grid-template-columns:1fr 1fr}
  .contact-card{padding:16px; border-radius:var(--radius); background:#fff; border:1px solid var(--line)}
  .contact-card b{color:var(--blue)}
  .contact-row{display:flex; gap:10px; align-items:flex-start; margin-top:10px; color:var(--text); font-weight:800}
  .contact-row small{display:block; color:var(--muted); font-weight:700}
  .map{
    height:260px; border-radius:var(--radius); border:1px solid var(--line);
    background:
      radial-gradient(700px 260px at 40% 20%, rgba(59,130,246,.18), transparent 60%),
      #fff;
    display:flex; align-items:center; justify-content:center;
    color:var(--muted); font-weight:900;
  }

  /* Footer */
  footer{padding:26px 0 36px; color:var(--muted)}
  footer .foot{
    display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
    border-top:1px solid var(--line); padding-top:16px;
  }
  footer a{color:var(--muted); font-weight:800}
  footer a:hover{color:var(--blue)}

  /* Responsive */
  @media (max-width: 980px){
    .hero-inner{grid-template-columns:1fr}
    h1{font-size:34px}
    .kpis{grid-template-columns:repeat(2,1fr)}
    .cards-4, .prices{grid-template-columns:repeat(2,1fr)}
    .benefits{grid-template-columns:1fr}
    .steps{grid-template-columns:repeat(2,1fr)}
    .contacts{grid-template-columns:1fr}
    .nav{display:none}
    .burger{display:inline-flex; height:42px; padding:0 12px}
  }
  @media (max-width: 450px){
    .cards-4, .prices {
        grid-template-columns: repeat(1, 1fr);
    }
    .steps {
        grid-template-columns: repeat(1, 1fr);
    }
    
}

  .hero-wrap{
    position:relative;
    background:
      radial-gradient(900px 400px at 10% 10%, rgba(59,130,246,.25), transparent 60%),
      radial-gradient(700px 300px at 90% 40%, rgba(249,115,22,.25), transparent 60%),
      linear-gradient(180deg, #ffffff, #f8fbff);
    border:1px solid rgba(255,255,255,.60);
    backdrop-filter: blur(8px);
    box-shadow:0 30px 80px rgba(2,6,23,.12);
  }

  .btn-primary{
    background:linear-gradient(135deg,#f97316,#fb923c);
    color:#fff;
    box-shadow:0 12px 30px rgba(249,115,22,.35);
    transition:.2s transform,.2s box-shadow,.15s opacity;
  }
  .btn-primary:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 40px rgba(249,115,22,.45);
    opacity:1;
  }

  .svc, .benefit, .price, .kpi, .contact-card, details, .card{
    background:linear-gradient(180deg,#ffffff,#fbfdff);
    border:1px solid rgba(255,255,255,.70);
    box-shadow:
      0 10px 30px rgba(2,6,23,.08),
      inset 0 1px 0 rgba(255,255,255,.80);
  }

  .svc:hover, .benefit:hover, .price:hover, .kpi:hover{
    transform:translateY(-4px);
    box-shadow:0 20px 40px rgba(2,6,23,.12);
  }

  .kpi b{
    font-size:32px;
    font-weight:900;
    letter-spacing:-.02em;
  }

  .section-title h2{
    text-shadow:0 1px 0 #fff, 0 2px 12px rgba(59,130,246,.12);
  }

  .cta{
    background:
      radial-gradient(600px 200px at 20% 20%, rgba(255,255,255,.20), transparent),
      linear-gradient(135deg, rgba(30,58,138,.96), rgba(59,130,246,.92));
    box-shadow:0 30px 60px rgba(30,58,138,.25);
  }

  /* slightly smoother feel */
  .svc, .benefit, .price, .kpi { transition:.18s transform,.18s box-shadow; }