
:root{
  --bg:#090611;
  --bg-2:#120a25;
  --panel:#120b22;
  --panel-2:#1a1230;
  --line:rgba(200,166,255,.18);
  --line-strong:rgba(200,166,255,.28);
  --text:#f7f4ff;
  --muted:#bba9de;
  --muted-2:#8f7cae;
  --accent:#b694ff;
  --accent-2:#7b3cff;
  --success:#46d6a8;
  --warning:#ffc86a;
  --shadow:0 24px 80px rgba(40,0,90,.35);
  --radius:28px;
  --radius-sm:18px;
  --container:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(182,148,255,.30), transparent 30%),
    radial-gradient(circle at top right, rgba(123,60,255,.25), transparent 25%),
    linear-gradient(180deg,#2e0f63 0%, #140922 18%, #090611 70%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(var(--container), calc(100% - 32px)); margin:0 auto}
.topbar{
  position:sticky; top:0; z-index:100;
  backdrop-filter: blur(18px);
  background:rgba(10,6,20,.72);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.nav{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:14px 0;
}
.brand{display:flex; align-items:center; gap:14px; font-weight:800; letter-spacing:.02em}
.brand img{width:42px; height:42px; border-radius:14px; box-shadow:var(--shadow)}
.brand span small{display:block; color:var(--muted); font-weight:600; font-size:12px; margin-top:2px}
.navlinks{display:flex; gap:18px; flex-wrap:wrap; align-items:center}
.navlinks a{color:var(--muted); font-weight:600; font-size:14px}
.navlinks a:hover{color:var(--text)}
.navcta{display:flex; gap:10px; align-items:center}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:48px; padding:0 22px; border-radius:999px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.04);
  color:var(--text); font-weight:700; transition:.2s ease;
}
.btn:hover{transform:translateY(-1px); border-color:rgba(255,255,255,.16)}
.btn-primary{
  background:linear-gradient(135deg,#d6c6ff 0%, #b694ff 40%, #9b6dff 100%);
  color:#160b27; border:none; box-shadow:0 18px 40px rgba(165,122,255,.35);
}
.btn-dark{background:rgba(255,255,255,.03)}
.hero{
  padding:64px 0 28px;
}
.hero-grid{
  display:grid; grid-template-columns:1.08fr .92fr; gap:30px; align-items:center;
}
.panel{
  background:linear-gradient(180deg, rgba(21,11,40,.82), rgba(10,8,20,.86));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.hero-copy{padding:36px}
.kicker{
  display:inline-flex; align-items:center; gap:10px; padding:8px 14px; border-radius:999px;
  background:rgba(182,148,255,.10); border:1px solid rgba(182,148,255,.20); color:#d8c8ff;
  font-size:13px; font-weight:800; letter-spacing:.02em; text-transform:uppercase;
}
.hero h1{
  font-size:clamp(2rem, 4vw, 4.6rem); line-height:1.02; margin:18px 0 18px;
  letter-spacing:-.045em;
}
.hero p.lead{
  font-size:1.1rem; color:#ddd2f6; max-width:760px; margin:0 0 24px;
}
.hero-actions{display:flex; gap:12px; flex-wrap:wrap; margin:24px 0 18px}
.metric-row{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:22px}
.metric{padding:16px 18px; border-radius:20px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07)}
.metric strong{display:block; font-size:1.2rem; color:#fff}
.metric span{color:var(--muted); font-size:14px}
.hero-media{padding:18px}
.hero-media img{border-radius:22px; border:1px solid rgba(255,255,255,.08)}
.section{padding:28px 0}
.section-header{display:flex; justify-content:space-between; align-items:end; gap:18px; margin-bottom:18px}
.section-header h2{font-size:clamp(1.6rem, 2.4vw, 2.8rem); margin:0; letter-spacing:-.04em}
.section-header p{margin:0; color:var(--muted); max-width:780px}
.grid{display:grid; gap:18px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{
  padding:24px; border-radius:26px;
  background:linear-gradient(180deg, rgba(31,19,53,.84), rgba(10,8,18,.88));
  border:1px solid var(--line); box-shadow:var(--shadow);
}
.card h3{margin:8px 0 10px; font-size:1.18rem}
.card p{margin:0; color:#cabce6}
.card-link:hover{border-color:var(--line-strong); transform:translateY(-1px)}
.eyebrow{
  color:#d9cbff; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
}
.split{
  display:grid; grid-template-columns:1fr 1fr; gap:22px;
}
.feature-list{display:grid; gap:12px}
.feature-item{
  display:flex; gap:14px; align-items:flex-start;
  padding:16px; border-radius:20px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06);
}
.feature-item i{
  width:30px; height:30px; border-radius:10px;
  background:linear-gradient(135deg,#ccb8ff,#8d5aff); flex:none;
}
.steps{counter-reset:step; display:grid; gap:16px}
.step{
  position:relative; padding:18px 20px 18px 70px; border-radius:24px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06)
}
.step:before{
  counter-increment:step; content:counter(step); position:absolute; left:18px; top:18px; width:36px; height:36px;
  border-radius:999px; display:grid; place-items:center; font-weight:800; color:#180d2d;
  background:linear-gradient(135deg,#decfff,#9f73ff);
}
.gallery{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px;
}
.gallery img{height:240px; width:100%; object-fit:cover; border-radius:24px; border:1px solid rgba(255,255,255,.06); box-shadow:var(--shadow)}
.cta{
  padding:30px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap
}
.bullets{display:grid; gap:10px; margin:0; padding:0; list-style:none}
.bullets li{padding-left:28px; position:relative; color:#ddd2f6}
.bullets li:before{
  content:""; position:absolute; left:0; top:.55em; width:14px; height:14px; border-radius:999px;
  background:linear-gradient(135deg,#d6c6ff,#8d5aff);
}
.faq-wrap{display:grid; gap:12px}
.faq-item{padding:18px 22px; border-radius:22px; border:1px solid rgba(255,255,255,.07); background:rgba(255,255,255,.03)}
.faq-item summary{cursor:pointer; font-weight:700}
.faq-item div{padding-top:12px; color:#d2c6e8}
.article{padding:26px}
.article h1{font-size:clamp(2rem, 4vw, 4rem); line-height:1.05; letter-spacing:-.04em; margin:10px 0 18px}
.article h2{font-size:clamp(1.4rem, 2.4vw, 2.2rem); margin:30px 0 12px}
.article p{color:#d9cdea}
.article ul{color:#d9cdea}
.callout{
  padding:18px 20px; border-left:3px solid var(--accent); border-radius:18px;
  background:rgba(182,148,255,.08); color:#eee6ff
}
.breadcrumbs{display:flex; gap:8px; flex-wrap:wrap; color:var(--muted); font-size:14px; margin-bottom:18px}
.breadcrumbs a{color:var(--muted)}
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
.stat{
  padding:18px; border-radius:22px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06)
}
.stat b{display:block; font-size:1.4rem}
footer{
  margin-top:30px; padding:40px 0 60px; border-top:1px solid rgba(255,255,255,.06)
}
.footer-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:18px}
.footer-grid p, .footer-grid a{color:var(--muted)}
.code{
  display:block; padding:14px 16px; border-radius:18px; background:#08050f; border:1px solid rgba(255,255,255,.08); overflow:auto;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; color:#d8cbff; font-size:14px
}
@media (max-width:1100px){
  .hero-grid,.split,.grid-4,.footer-grid,.stats{grid-template-columns:1fr 1fr}
  .grid-3,.gallery{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .nav{align-items:flex-start; flex-direction:column}
  .navlinks,.navcta{width:100%}
  .hero-grid,.split,.grid-2,.grid-3,.grid-4,.gallery,.footer-grid,.metric-row,.stats{grid-template-columns:1fr}
  .hero{padding-top:36px}
  .hero-copy{padding:24px}
  .card,.article,.cta{padding:20px}
}


.lead-form-wrap{display:grid;grid-template-columns:1fr 1.3fr;gap:22px;margin-top:24px;padding:24px;border-radius:28px;background:linear-gradient(180deg,rgba(17,12,40,.88),rgba(9,7,27,.92));border:1px solid rgba(172,124,255,.28);box-shadow:0 24px 80px rgba(0,0,0,.28)}
.lead-form-intro h3{margin:8px 0 10px;font-size:clamp(1.55rem,2vw,2rem)}
.lead-form-intro p{margin:0;color:var(--muted);max-width:520px}
.lead-points{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.lead-points span{padding:10px 14px;border-radius:999px;background:rgba(141,90,255,.12);border:1px solid rgba(188,154,255,.22);color:#efe8ff;font-size:.92rem}
.lead-form{display:block}
.lead-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.lead-grid label{display:flex;flex-direction:column;gap:8px}
.lead-grid label span{font-size:.92rem;color:#efe8ff}
.lead-grid input,.lead-grid select,.lead-grid textarea{width:100%;border:1px solid rgba(181,154,255,.2);background:rgba(255,255,255,.05);color:#fff;border-radius:16px;padding:14px 16px;outline:none;transition:border-color .2s ease, box-shadow .2s ease, background .2s ease}
.lead-grid input::placeholder,.lead-grid textarea::placeholder{color:#9e95bc}
.lead-grid input:focus,.lead-grid select:focus,.lead-grid textarea:focus{border-color:rgba(180,141,255,.6);box-shadow:0 0 0 3px rgba(141,90,255,.16);background:rgba(255,255,255,.07)}
.lead-grid select{appearance:none}
.lead-wide{grid-column:1 / -1}
.lead-consent{flex-direction:row!important;align-items:flex-start;gap:12px;padding:8px 4px 0}
.lead-consent input{width:18px;height:18px;min-width:18px;margin-top:2px}
.lead-consent span{color:var(--muted)!important;line-height:1.5}
.lead-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:18px}
.lead-status{margin-top:14px;min-height:24px;font-size:.95rem;color:#d6ceef}
.lead-status.is-success{color:#92ffcf}
.lead-status.is-error{color:#ff9da7}
.hp-field{position:absolute!important;left:-9999px!important;opacity:0!important;pointer-events:none!important;height:0!important;width:0!important}
@media (max-width: 980px){.lead-form-wrap{grid-template-columns:1fr}.lead-grid{grid-template-columns:1fr}}
