:root{--navy:#071247;--blue:#2434e8;--violet:#5a35ff;--green:#0ca35b;--text:#10183f;--muted:#667092;--line:#dfe4f2;--bg:#f7f9ff;--white:#fff;--shadow:0 20px 60px rgba(7,18,71,.12)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--text);background:linear-gradient(180deg,#fff 0%,var(--bg) 100%)}
a{text-decoration:none;color:inherit}

.topbar{
  position:sticky;
  top:0;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:8px 6%;
  min-height:140px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line)
}

.brand{display:flex;gap:14px;align-items:center}
.logo-icon{width:48px;height:48px;border:3px solid var(--blue);border-radius:14px;display:grid;place-items:center;color:var(--blue);font-size:28px;font-weight:900}
.brand strong{display:block;font-size:34px;letter-spacing:.04em;color:var(--navy)}
.brand span{font-size:12px;text-transform:uppercase;color:var(--navy)}

.brand-logo{
  height:180px;
  width:auto;
  display:block;
  object-fit:contain;
}

nav{display:flex;gap:28px;color:var(--muted);font-weight:700;font-size:18px;align-items:center}
nav a{transition:.2s ease}
nav a:hover{color:var(--blue)}

.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;padding:15px 22px;font-weight:800;transition:.2s}
.btn.primary{background:linear-gradient(135deg,var(--navy),var(--blue),var(--violet));color:#fff;box-shadow:0 12px 30px rgba(36,52,232,.25)}
.btn.primary:hover{transform:translateY(-2px)}
.btn.secondary{background:#fff;color:var(--blue);border:1px solid var(--line)}
.btn.small{padding:12px 18px;font-size:15px}

.icon-btn{gap:10px}
.icon-btn svg{width:22px;height:22px;fill:currentColor;flex:0 0 22px}

.section{padding:78px 6%}
.hero{min-height:620px;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:50px}
.tag{margin:0 0 14px;color:var(--blue);font-weight:900;text-transform:uppercase;letter-spacing:.12em}
.tag.light{color:#8ea0ff}
h1{font-size:clamp(42px,6vw,76px);line-height:.96;margin:0 0 24px;color:var(--navy);letter-spacing:-.05em}
h2{font-size:clamp(30px,4vw,48px);line-height:1.05;margin:0 0 18px;color:var(--navy);letter-spacing:-.035em}
p{font-size:18px;line-height:1.6;color:var(--muted)}
.lead{font-size:22px;max-width:850px}
.actions{display:flex;gap:16px;flex-wrap:wrap;margin:32px 0}
.hero-badges{display:flex;gap:12px;flex-wrap:wrap}
.hero-badges span{background:#fff;border:1px solid var(--line);padding:10px 14px;border-radius:999px;font-weight:800;color:var(--navy)}
.hero-card{background:#fff;border:1px solid var(--line);border-radius:34px;padding:34px;box-shadow:var(--shadow)}
.card-header{font-weight:900;color:var(--blue);font-size:22px;margin-bottom:20px}
.metric{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding:22px 0}
.metric strong{font-size:20px}
.metric span{color:var(--green);font-weight:800}
.split{display:grid;grid-template-columns:.9fr 1.1fr;gap:46px;align-items:center}
.grid.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.cards article,.price-card{background:#fff;border:1px solid var(--line);border-radius:26px;padding:26px;box-shadow:0 10px 30px rgba(7,18,71,.06)}
h3{margin:0 0 10px;color:var(--navy);font-size:22px}
.image-section{padding-top:36px}
.section-title{text-align:center;max-width:900px;margin:0 auto 28px}
.image-section img{width:100%;border-radius:26px;border:1px solid var(--line);box-shadow:var(--shadow);display:block}
.plans-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding-top:20px}
.price-card span{font-weight:900;color:var(--blue);text-transform:uppercase}
.price-card strong{display:block;font-size:36px;margin:12px 0;color:var(--navy)}
.price-card.featured{border:2px solid var(--blue)}
.price-card.premium{background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff}
.price-card.premium strong,.price-card.premium p,.price-card.premium span{color:#fff}
.dark{background:linear-gradient(135deg,var(--navy),#101c7a,var(--blue));color:#fff;margin:40px 6%;border-radius:36px;padding:56px}
.dark h2,.dark p{color:#fff}
.checklist{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.checklist li{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:18px;font-size:18px;font-weight:800}
.checklist li:before{content:'✓';color:#7dffb3;margin-right:10px}
.contact{text-align:center}
.contact p{max-width:700px;margin-left:auto;margin-right:auto}
.contact-number{font-weight:900;color:var(--navy);margin-top:8px}
.contact-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:24px}
footer{display:flex;justify-content:space-between;gap:20px;padding:30px 6%;background:var(--navy);color:#fff}
footer span{color:#cbd3ff}

@media(max-width:980px){
  .topbar{position:relative;align-items:flex-start;flex-direction:column;padding:18px 5%;min-height:auto}
  .brand-logo{height:82px}
  nav{flex-wrap:wrap;gap:18px;font-size:16px}
  .hero,.split,.plans-mini{grid-template-columns:1fr}
  .section{padding:56px 5%}
  .dark{margin:20px 5%;padding:36px}
  .grid.cards{grid-template-columns:1fr}
  footer{flex-direction:column}
  h1{font-size:42px}
  .lead{font-size:18px}
  .contact-actions{align-items:center}
}