:root{
      --bg:#0b1020;
      --panel:#101a33;
      --panel2:#0f1730;
      --text:#e9ecf6;
      --muted:#b7c0dd;
      --muted:#b7c0dd;
	  --accent2:#23d5ff;
      --accent:#7c5cff;
      --line:rgba(255,255,255,.10);
      --ok:#3ddc97;
      --warn:#ffcc66;
      --danger:#ff5c7a;
      --shadow: 0 20px 60px rgba(0,0,0,.35);
      --radius: 18px;
      --radius2: 26px;
      --max: 1120px;
      --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
    }
    *{box-sizing:border-box}
    html,body{
  margin:0;
  padding:0;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(124,92,255,.22), transparent 55%),
    radial-gradient(1000px 700px at 90% 10%, rgba(35,213,255,.20), transparent 55%),
    linear-gradient(180deg, #0b1020 0%, #0f1730 60%, #101a33 100%);
  color:var(--text);
  font-family:var(--font);
  line-height:1.5;
}

              color:var(--text); font-family:var(--font); line-height:1.5}
    a{color:inherit; text-decoration:none}
    .wrap{max-width:var(--max); margin:0 auto; padding:0 20px}
    .nav{
      position:sticky; top:0; z-index:50;
      backdrop-filter: blur(14px);
      background: rgba(11,16,32,.65);
      border-bottom:1px solid var(--line);
    }
    .nav-inner{display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:14px}
    .brand{display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.5px}
    .logo{
      width:34px;height:34px;border-radius:12px;
      background: radial-gradient(circle at 30% 30%, rgba(35,213,255,.9), rgba(124,92,255,.9));
      box-shadow: 0 10px 30px rgba(124,92,255,.25);
    }
    .nav-links{display:flex; gap:16px; align-items:center}
    .nav-links a{color:var(--muted); font-weight:600; font-size:14px; padding:8px 10px; border-radius:12px}
    .nav-links a:hover{background:rgba(255,255,255,.06); color:var(--text)}
    .btn{
      display:inline-flex; align-items:center; justify-content:center;
      gap:10px; padding:12px 14px; border-radius:14px; border:1px solid var(--line);
      background:rgba(255,255,255,.06); color:var(--text); font-weight:800; cursor:pointer;
      transition: transform .15s ease, background .15s ease, border-color .15s ease;
      white-space:nowrap;
    }
    .btn:hover{transform: translateY(-1px); background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.18)}
    .btn.primary{
      border-color: rgba(124,92,255,.65);
      background: linear-gradient(135deg, rgba(124,92,255,.95), rgba(35,213,255,.55));
      box-shadow: 0 18px 50px rgba(124,92,255,.25);
    }
    .btn.primary:hover{border-color: rgba(255,255,255,.28)}
    .btn.ghost{background:transparent}
    .burger{display:none}
    .hero{padding:52px 0 26px}
    .hero-grid{display:grid; grid-template-columns: 1.3fr .7fr; gap:20px; align-items:stretch}
	.hero::before{
  content:"";
  position:absolute;
  inset:-200px -100px auto -100px;
  height:600px;
  background:
    radial-gradient(circle at 40% 30%, rgba(124,92,255,.25), transparent 60%),
    radial-gradient(circle at 70% 40%, rgba(35,213,255,.20), transparent 60%);
  z-index:-1;
  filter: blur(40px);
}
.hero{
  position:relative;
}

    .card{
  border:1px solid rgba(255,255,255,.14);
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.02));
  border-radius: var(--radius2);
  box-shadow:
    0 30px 80px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.08);
}

    .hero-card{padding:28px}
    .kicker{display:inline-flex; gap:10px; align-items:center; color:var(--muted); font-weight:700; font-size:13px; letter-spacing:.3px}
    .dot{width:10px;height:10px;border-radius:99px;background:radial-gradient(circle, var(--accent2), var(--accent))}
    h1{margin:12px 0 10px; font-size:42px; line-height:1.1}
    .lead{margin:0 0 18px; color:var(--muted); font-size:16.5px}
    .hero-actions{display:flex; gap:12px; flex-wrap:wrap; margin:18px 0 12px}
    .bullets{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; margin-top:14px}
    .pill{
      border:1px solid var(--line);
      background:rgba(0,0,0,.18);
      border-radius: 999px;
      padding:10px 12px;
      color:var(--muted);
      font-weight:700;
      font-size:13px;
      display:flex; gap:10px; align-items:center; justify-content:center;
    }
    .pill b{color:var(--text)}
    .side-card{padding:22px; display:flex; flex-direction:column; gap:10px}
    .mini-title{font-weight:900; font-size:16px}
    .mini-list{margin:0; padding:0 0 0 16px; color:var(--muted)}
    .mini-list li{margin:6px 0}
    section{padding:26px 0}
    .section-title{font-size:26px; margin:0 0 10px}
    .section-sub{margin:0 0 18px; color:var(--muted)}
    .grid-2{display:grid; grid-template-columns: 1fr 1fr; gap:16px}
    .grid-3{display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:16px}
    .grid-4{display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px}
    .panel{padding:18px; border-radius: var(--radius); border:1px solid var(--line); background:rgba(0,0,0,.14)}
    .panel h3{margin:0 0 6px}
    .panel p{margin:0; color:var(--muted)}
    .chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px}
    .chip{font-size:12px; padding:7px 10px; border-radius:999px; border:1px solid var(--line); color:var(--muted); background:rgba(255,255,255,.05); font-weight:700}
    .pricing .plan{padding:18px; border-radius:var(--radius); border:1px solid var(--line); background:linear-gradient(180deg, rgba(16,26,51,.75), rgba(0,0,0,.12))}
    .plan .tag{display:inline-flex; align-items:center; gap:8px; font-weight:900; font-size:12px; color:var(--muted)}
    .badge{width:10px;height:10px;border-radius:99px}
    .badge.small{background:var(--ok)}
    .badge.medium{background:var(--warn)}
    .badge.large{background:var(--accent2)}
    .badge.custom{background:var(--accent)}
    .plan h3{margin:10px 0 8px; font-size:18px}
    .plan ul{margin:0; padding:0 0 0 18px; color:var(--muted)}
    .plan li{margin:7px 0}
    .plan .actions{margin-top:12px; display:flex; gap:10px; flex-wrap:wrap}
    .how{counter-reset:step}
    .step{position:relative; padding:16px 16px 16px 54px}
    .step::before{
      counter-increment:step;
      content: counter(step);
      position:absolute; left:16px; top:16px;
      width:28px;height:28px;border-radius:999px;
      background: rgba(124,92,255,.25);
      border:1px solid rgba(124,92,255,.55);
      display:grid; place-items:center;
      font-weight:900;
    }

    /* Wizard */
    .wizard{padding:18px}
    .wizard-top{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap}
    .progress{height:10px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid var(--line); overflow:hidden; flex:1; min-width:220px}
    .bar{height:100%; width:0%; background: linear-gradient(90deg, rgba(124,92,255,.9), rgba(35,213,255,.8)); transition:width .2s ease}
    .wizard-body{margin-top:14px}
    .q{display:none}
    .q.active{display:block}
    label{display:block; font-weight:800; margin-bottom:8px}
    .hint{color:var(--muted); font-size:13px; margin-top:-2px; margin-bottom:10px}
    .row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
    input, select, textarea{
      width:100%; padding:12px 12px; border-radius:14px;
      border:1px solid var(--line); background:rgba(0,0,0,.18);
      color:var(--text); outline:none;
    }
    textarea{min-height:110px; resize:vertical}
    .options{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px}
    .opt{
      border:1px solid var(--line); border-radius:14px; padding:12px;
      background:rgba(255,255,255,.04);
      display:flex; gap:10px; align-items:flex-start;
      cursor:pointer; user-select:none;
    }
    .opt input{width:auto; margin-top:2px}
    .wizard-actions{display:flex; justify-content:space-between; gap:10px; margin-top:14px; flex-wrap:wrap}
    .toast{
      position:fixed; right:16px; bottom:16px; z-index:100;
      border:1px solid var(--line); background:rgba(16,26,51,.92); backdrop-filter: blur(12px);
      border-radius:16px; padding:12px 12px; box-shadow: var(--shadow);
      min-width:260px; display:none;
    }
    .toast.show{display:block}
    .toast b{display:block; margin-bottom:2px}
    .toast p{margin:0; color:var(--muted); font-size:13px}

    footer{padding:24px 0 40px; border-top:1px solid var(--line); margin-top:20px}
    .foot{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; color:var(--muted); font-weight:700; font-size:13px}
    .foot a{color:var(--text)}
    .muted{color:var(--muted)}
    .sep{height:1px; background:var(--line); margin:14px 0}

    /* Mobile */
    @media (max-width: 920px){
      .hero-grid{grid-template-columns:1fr}
      .bullets{grid-template-columns:1fr; align-items:stretch}
      .grid-4{grid-template-columns:1fr 1fr}
      .grid-3{grid-template-columns:1fr}
      .grid-2{grid-template-columns:1fr}
      h1{font-size:34px}
      .row{grid-template-columns:1fr}
    }
    @media (max-width: 680px){
      .nav-links{display:none}
      .burger{display:inline-flex}
      .grid-4{grid-template-columns:1fr}
    }
    .mobile-menu{
      display:none;
      border-top:1px solid var(--line);
      padding:10px 0 16px;
    }
    .mobile-menu a{display:block; padding:10px 10px; border-radius:12px; color:var(--muted); font-weight:700}
    .mobile-menu a:hover{background:rgba(255,255,255,.06); color:var(--text)}
    .mobile-menu.show{display:block}
	.logo-img{
  width:34px;
  height:34px;
  border-radius:12px;
  object-fit:contain;
}
.ai-signature{
  margin-top:6px;
  font-size:12px;
  color: rgba(233,236,246,.75);
  display:flex;
  align-items:center;
  gap:8px;
  letter-spacing:.2px;
}

.ai-icon{
  color: #23d5ff;
  font-size:14px;
  text-shadow: 0 0 10px rgba(35,213,255,.65);
  animation: aiGlow 3s ease-in-out infinite;
}

.ai-name{
  color:#23d5ff;
  font-weight:800;
  text-shadow:
    0 0 10px rgba(35,213,255,.45),
    0 0 20px rgba(124,92,255,.35);
}

@keyframes aiGlow{
  0%{transform:scale(1); opacity:.75}
  50%{transform:scale(1.15); opacity:1}
  100%{transform:scale(1); opacity:.75}
}
.ai-badge{
  border:1px solid rgba(35,213,255,.35);
  background: linear-gradient(135deg, rgba(35,213,255,.12), rgba(124,92,255,.10));
  color: rgba(233,236,246,.85);
  padding:7px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.2px;
  box-shadow:
    0 0 0 1px rgba(35,213,255,.08),
    0 10px 30px rgba(35,213,255,.08);
}