:root{
  --bg:#0b0c10;
  --fg:#e9eef3;
  --muted:#b7c0ca;
  --accent:#6ee7ff;
  --brand: #7c8cff;     
  --brand-2: #a970ff;
  --card:#111319;
  --alt:#0f1117;
  --border:rgba(255,255,255,.08);
  --border-soft:rgba(255,255,255,.06);
  --shadow-1: 0 10px 30px rgba(0,0,0,.35);
  --radius-lg: 16px;
  --radius-md: 12px;
  --radius-sm: 8px;
}


*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Arial,sans-serif;
  font-family: 'Inter', system-ui, sans-serif;
  color:var(--fg);
  background:linear-gradient(180deg,var(--bg),#07080d 60%);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
h1, h2, h3, h4, .logo {
  font-family: 'Montserrat', sans-serif;
  letter-spacing: 0.2px;
}
img{display:block;max-width:100%}
a{color:var(--accent);text-decoration:none}
a:hover{opacity:.9}
.container{width:min(1120px,92%);margin-inline:auto}


.btn{
  display:inline-block;
  background: linear-gradient(90deg, var(--brand), var(--brand-2));
  color:#0b0e14;
  font-weight:700;
  padding:12px 18px;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: transform .12s ease, box-shadow .2s ease, opacity .2s ease;
  box-shadow: 0 6px 18px rgba(124,140,255,.35);
}
.btn:hover{ transform: translateY(-1px); box-shadow: 0 10px 24px rgba(124,140,255,.45); }
.btn:active{ transform: translateY(0); }
.btn--ghost{
  background: transparent;
  color: var(--fg);
  border:1px solid var(--border);
  box-shadow:none;
}
.btn--ghost:hover{ background: rgba(255,255,255,.06); }
.btn--sm{ padding:8px 14px; font-size: 14px; }

.site-header{
  position:sticky;top:0;z-index:10;
  backdrop-filter:saturate(1.2) blur(10px);
  background:rgba(10,12,18,.6);
  border-bottom:1px solid var(--border-soft);
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 0;
}
.logo{font-weight:800;letter-spacing:.2px;color:#fff}
.logo span{color:var(--brand)}

.header-actions{
  display:flex; align-items:center; gap:10px;
}


.burger{
  display:none; 
  position:relative; width:40px; height:40px;
  border:1px solid var(--border); border-radius:10px;
  background:transparent; color:var(--fg); cursor:pointer;
}
.burger .line{
  position:absolute; left:9px; right:9px; height:2px;
  background: currentColor; border-radius:2px; transition: transform .2s ease, opacity .2s ease;
}
.burger .line:nth-child(1){ top:12px; }
.burger .line:nth-child(2){ top:19px; }
.burger .line:nth-child(3){ top:26px; }

.nav{ display:flex; align-items:center; gap:20px; overflow: visible; }

.lang-dropdown{ position:relative; margin-left:16px; }
.lang-current{
  display:inline-flex; align-items:center; gap:8px;
  background:transparent; color:#fff; border:1px solid rgba(255,255,255,.2);
  padding:6px 10px; border-radius:10px; cursor:pointer;
}
.lang-current .flag{ font-size:16px; line-height:1; }
.lang-current .code{ font-weight:600; letter-spacing:.3px; }
.lang-current .chev{ opacity:.8; }

.lang-menu{
  position:absolute; right:0; top:calc(100% + 8px);
  background:var(--card); border:1px solid var(--border);
  border-radius:12px; padding:6px; list-style:none; margin:0;
  display:none; min-width:180px; z-index:30;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.lang-dropdown[aria-expanded="true"] .lang-menu{ display:block; }
.lang-menu li{ margin:0; }
.lang-menu button{
  width:100%; text-align:left; display:flex; align-items:center; gap:10px;
  background:transparent; color:var(--fg); border:0; padding:10px 12px; border-radius:8px; cursor:pointer;
}
.lang-menu button:hover{ background:rgba(255,255,255,.06); }
.lang-menu .flag{ font-size:18px; line-height:1; }

.lang-menu a{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  background:transparent;
  color:var(--fg);
  text-decoration:none;
  padding:10px 12px;
  border-radius:8px;
}
.lang-menu a:hover{ background:rgba(255,255,255,.06); }


.hero{
  padding:72px 0 48px;
  background:
    radial-gradient(80% 60% at 80% -10%, rgba(107,127,255,.25), transparent 60%),
    radial-gradient(60% 40% at -10% 10%, rgba(110,231,255,.18), transparent 50%);
}
.hero-inner{
  display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;
}
.hero h1{font-size:44px;line-height:1.15;margin:0 0 12px}
.hero p{color:var(--muted);margin:0 0 20px}


.hero-media{
  width:100%;
  max-width: 720px;    
}


.hero-media .mockup{
  position: relative;
  aspect-ratio: 16/10;   
  overflow: hidden;     
  border-radius: 16px;
  border: 1px solid var(--border-soft);
  background: linear-gradient(180deg,#141826,#0c0f15);
}


.hero-media video{
  width:100%;
  height:100%;
  object-fit: cover;    
  display:block;        
  border-radius: inherit;
}

.lead-form{display:flex;gap:10px;flex-wrap:wrap}
.lead-form input{
  flex:1 1 240px;padding:12px 14px;border-radius:10px;
  border:1px solid var(--border-soft);background:#0c0f15;color:var(--fg);
}
.lead-form--inline{justify-content:center}

.trust{
  display:flex;flex-wrap:wrap;gap:14px;margin:16px 0 0;padding:0;
  list-style:none;color:var(--muted);
}

.section{padding:64px 0}
.section--alt{background:var(--alt)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid-3--tight{gap:16px}

.card{
  background:var(--card);
  border:1px solid var(--border-soft);
  padding:22px;border-radius:14px;
  display:flex;flex-direction:column;gap:12px;
}
.card-img{
  width:100%;aspect-ratio:4/3;object-fit:cover;
  border-radius:10px;border:1px solid var(--border-soft);background:#0e1118;
}
.card h3{margin:4px 0 0}

.steps h2{margin-top:0}
.step-list{
  counter-reset:step;display:grid;gap:14px;padding-left:0;margin:0;
}
.step-list li{
  list-style:none;background:var(--card);
  border:1px solid var(--border-soft);
  border-radius:12px;padding:16px 16px 16px 50px;position:relative;
}
.step-list li::before{
  counter-increment:step;content:counter(step);
  position:absolute;left:14px;top:14px;width:26px;height:26px;border-radius:8px;
  background:var(--brand);display:grid;place-items:center;color:#fff;font-weight:700;
}

.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.price-card{
  background:var(--card);border:1px solid var(--border);
  border-radius:16px;padding:22px;
}
.price-card--focus{outline:2px solid var(--brand)}
.price{font-size:32px;font-weight:800;margin:.2em 0 .6em}

/* --- FAQ --- */
details{
  background:var(--card);border:1px solid var(--border);
  border-radius:12px;padding:14px;margin:10px 0;
}
details > summary{cursor:pointer}


.cta{
  padding:56px 0;
  background:linear-gradient(180deg,#0f1117,#101225 70%);
}
.cta-inner{text-align:center}


.pain-offer{
  background:
    radial-gradient(60% 40% at 10% 10%, rgba(110,231,255,.12), transparent 60%),
    linear-gradient(180deg, #0f1117, #0c0f15 70%);
  border-block:1px solid var(--border-soft);
}
.pain-offer-inner{
  display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:start;
}
.pain-copy h2{margin-top:0;font-size:36px;line-height:1.15}
.pain-bullets{margin:14px 0 20px;padding-left:18px;color:var(--muted)}
.pain-bullets li{margin:6px 0}
.pain-aside{display:grid;gap:12px}
.kpi{
  background:var(--card);border:1px solid var(--border);
  border-radius:14px;padding:16px;
}
.kpi strong{display:block;font-size:28px;line-height:1;margin-bottom:6px}
.kpi span{color:var(--muted)}

.feature-card{
  background:var(--card);border:1px solid var(--border);
  border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px;
  transition:transform .15s ease,border-color .15s ease;
}
.feature-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.16)}
.feature-card img{
  width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;
  border:1px solid var(--border-soft);background:#0e1118;
}
.feature-card h3{margin:2px 0 0}

.countdown {
  display: flex;
  justify-content: center;
  gap: 24px;
  margin: 24px 0;
  font-weight: 700;
}
.countdown div {
  text-align: center;
  background: var(--card);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  padding: 14px 18px;
  min-width: 80px;
}
.countdown span {
  display: block;
  font-size: 28px;
  color: var(--brand);
}
.countdown small {
  display: block;
  font-size: 13px;
  color: var(--muted);
}

.site-footer{
  border-top:1px solid var(--border-soft);
  padding:26px 0;background:#0b0c10;
}
.footer-inner{
  display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;
}
.footer-nav{display:flex;gap:16px}


@media (max-width:1080px){
  .hero h1{font-size:40px}
}
@media (max-width:960px){
  .hero-inner{grid-template-columns:1fr}
  .hero-media{ max-width: 100%; }
  .grid-3,.pricing{grid-template-columns:1fr}

  .burger{ display:inline-flex; align-items:center; justify-content:center; }

  .nav{
    position: fixed; inset: 64px 16px auto 16px;
    display:none; flex-direction: column; gap:12px;
    background: var(--bg-soft,#101523);
    border:1px solid var(--border,rgba(255,255,255,.12));
    border-radius:14px; padding:12px; z-index: 2000;
  }
  .nav.nav--open{ display:flex; }
  .btn--sm{ display: none;}
  
  .lang-dropdown{ margin-left: 0; }

.site-header, .header-inner { overflow: visible; }
.lang-menu{ z-index: 5000; }

  .pain-offer-inner{grid-template-columns:1fr}

  .lang-dropdown{ margin-left:0; }

}
@media (max-width:600px){
  .hero{padding:56px 0 40px}
  .hero h1{font-size:34px}
  .price{font-size:28px}
  .kpi strong{font-size:24px}
}