*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;
 font-family:Inter,Arial,sans-serif;
 background:#070812;
 color:#fff;
}
a{color:inherit}
.wrap{width:min(1180px,calc(100% - 36px));margin:auto}

header{
 position:sticky;top:0;z-index:20;
 background:rgba(7,8,18,.84);
 backdrop-filter:blur(18px);
 border-bottom:1px solid rgba(255,255,255,.08);
}
.nav{height:76px;display:flex;align-items:center;gap:32px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{width:40px;height:40px;object-fit:contain}
.brand b{font-size:19px}
.nav nav{margin-left:auto;display:flex;gap:26px}
.nav nav a{text-decoration:none;color:#bbb;font-size:14px}
.nav nav a:hover{color:#fff}

.button{
 display:inline-flex;align-items:center;justify-content:center;
 padding:15px 23px;border-radius:13px;
 text-decoration:none;font-weight:800;
 background:linear-gradient(135deg,#ff338e,#7b3cff);
 box-shadow:0 10px 35px rgba(255,40,145,.22);
}
.button.small{padding:10px 18px}
.button.ghost{background:transparent;border:1px solid rgba(255,255,255,.2)}
.button.huge{padding:18px 28px;font-size:18px}

.hero{
 position:relative;overflow:hidden;
 padding:100px 0 90px;
 background:
 radial-gradient(circle at 70% 10%,rgba(93,55,255,.19),transparent 34%),
 radial-gradient(circle at 15% 70%,rgba(255,40,135,.14),transparent 28%),
 #070812;
}
.glow{position:absolute;border-radius:50%;filter:blur(100px)}
.glow1{width:300px;height:300px;background:#ff258f;left:-150px;top:300px;opacity:.15}
.glow2{width:400px;height:400px;background:#493cff;right:-180px;top:40px;opacity:.16}

.heroGrid{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}
.eyebrow{color:#ff54aa;font-weight:800;font-size:12px;letter-spacing:.17em}
.hero h1{
 font-size:clamp(76px,10vw,145px);
 line-height:.82;margin:18px 0 30px;
 letter-spacing:-.07em;
}
.hero h1 span{
 background:linear-gradient(90deg,#ff49ae,#7e65ff,#55c8ff);
 -webkit-background-clip:text;color:transparent;
}
.hero h2{font-size:clamp(30px,4vw,52px);line-height:1.03;margin:0 0 22px}
.lead{font-size:18px;line-height:1.7;color:#c0c1ce}
.heroButtons{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0}
.quick{display:flex;gap:32px;margin-top:35px}
.quick div{display:flex;flex-direction:column}
.quick strong{font-size:25px}
.quick span{font-size:12px;color:#8f91a2;margin-top:5px}

.visual{
 position:relative;border-radius:28px;overflow:hidden;
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 30px 100px rgba(0,0,0,.5);
}
.visual img{width:100%;display:block}
.visual:after{
 content:"";position:absolute;inset:0;
 box-shadow:inset 0 0 80px rgba(10,5,30,.25);
 pointer-events:none;
}
.visualLabel{
 position:absolute;left:18px;bottom:18px;
 padding:10px 14px;border-radius:12px;
 background:rgba(5,6,15,.76);backdrop-filter:blur(10px);
 font-size:12px;font-weight:800;
}
.pulse{
 display:inline-block;width:8px;height:8px;border-radius:50%;
 background:#45ff9c;margin-right:7px;
 box-shadow:0 0 14px #45ff9c;
}

section{padding:90px 0}
.sectionHead{max-width:700px;margin-bottom:45px}
.sectionHead h2,.split h2,.priceCard h2,.final h2{
 font-size:clamp(38px,5vw,65px);
 letter-spacing:-.045em;line-height:1;
 margin:13px 0 18px;
}
.sectionHead p{color:#9fa1b1;line-height:1.6}

.features{
 display:grid;grid-template-columns:repeat(4,1fr);gap:16px
}
.features article,.docGrid article{
 border:1px solid rgba(255,255,255,.09);
 background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
 border-radius:22px;padding:27px;
}
.number{color:#ff50aa;font-size:13px;font-weight:900}
.features h3{font-size:20px;margin:25px 0 10px}
.features p,.docGrid p{color:#9698aa;line-height:1.6;font-size:14px}

.dark{background:#05060c}
.timeline{max-width:850px}
.step{display:grid;grid-template-columns:55px 1fr;gap:24px;padding:22px 0}
.stepN{
 width:50px;height:50px;border-radius:50%;
 display:flex;align-items:center;justify-content:center;
 background:linear-gradient(135deg,#ff348f,#7047ff);font-weight:900
}
.step h3{margin:2px 0 7px}
.step p{margin:0;color:#999bab;line-height:1.6}

.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.split>div>p{color:#a5a7b7;line-height:1.7}
.note{
 margin-top:25px;padding:20px;border-left:3px solid #ff46a0;
 background:rgba(255,255,255,.035);line-height:1.6
}
.folders{
 padding:30px;border:1px solid rgba(255,255,255,.1);
 border-radius:24px;background:#0c0d18
}
.folders div{
 margin:10px 0;padding:17px;border-radius:13px;
 background:#141625
}
.folders span{float:right;color:#7e8194;font-size:12px}
.folders .machine{
 margin-top:25px;background:linear-gradient(135deg,#431344,#17265d);
 font-weight:800
}

.priceSection{
 background:
 radial-gradient(circle at 50% 50%,rgba(121,54,255,.18),transparent 40%),
 #05060c;
}
.priceCard{
 max-width:720px;margin:auto;text-align:center;padding:55px;
 border-radius:30px;border:1px solid rgba(255,255,255,.13);
 background:rgba(13,14,28,.9);
 box-shadow:0 30px 100px rgba(0,0,0,.4)
}
.priceCard>div>p{color:#a2a4b4}
.price{margin:35px 0 28px}
.price strong{display:block;font-size:70px;letter-spacing:-.06em}
.price span{color:#9799a9}
.included{text-align:left;display:grid;gap:12px;margin:30px auto;max-width:430px}
.included div{color:#c9cad4}
.micro{font-size:12px;color:#77798a;line-height:1.5;margin-top:20px}

.security{
 max-width:850px;border:1px solid rgba(255,255,255,.09);
 border-radius:22px;padding:30px;background:rgba(255,255,255,.025)
}
.security p{color:#a3a5b5;line-height:1.7}

.docs{background:#05060c}
.docGrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.docGrid h3{margin-top:0}
.legalWarning{
 margin-top:22px;padding:18px;border-radius:12px;
 background:rgba(255,188,70,.08);color:#c6ad81;font-size:13px;line-height:1.5
}

.final{text-align:center;padding:110px 0}
.final h2 span{
 background:linear-gradient(90deg,#ff49a5,#7d5cff,#52c5ff);
 -webkit-background-clip:text;color:transparent
}
.final p{color:#9698aa;margin-bottom:30px}

footer{border-top:1px solid rgba(255,255,255,.08);padding:35px 0}
.footer{display:flex;align-items:center;gap:30px}
.footer>div:nth-child(2){display:flex;gap:18px;margin-left:auto}
.footer>div a{font-size:12px;color:#8d8f9f;text-decoration:none}
.copy{font-size:11px;color:#666879}

@media(max-width:900px){
 .nav nav{display:none}
 .nav .button{margin-left:auto}
 .hero{padding:65px 0}
 .heroGrid,.split{grid-template-columns:1fr;gap:45px}
 .visual{order:-1}
 .features{grid-template-columns:1fr 1fr}
}

@media(max-width:560px){
 .wrap{width:min(100% - 28px,1180px)}
 .nav{height:68px}
 .hero h1{font-size:76px}
 .hero h2{font-size:34px}
 .hero .lead{font-size:16px}
 .quick{gap:20px}
 .features,.docGrid{grid-template-columns:1fr}
 section{padding:65px 0}
 .priceCard{padding:35px 20px}
 .price strong{font-size:58px}
 .footer{align-items:flex-start;flex-direction:column}
 .footer>div:nth-child(2){margin-left:0;flex-wrap:wrap}
}


/* WB KIZ web activation */
.activationCard{
  max-width:760px;
  margin:0 auto;
  padding:28px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:22px;
  background:rgba(255,255,255,.055);
  backdrop-filter:blur(12px);
}

.activationCard label{
  display:block;
  margin-bottom:10px;
  font-weight:700;
}

.activationRow{
  display:flex;
  gap:12px;
  align-items:stretch;
}

.activationRow input{
  flex:1;
  min-width:0;
  padding:16px 18px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.24);
  background:rgba(0,0,0,.30);
  color:#fff;
  font:inherit;
  font-size:18px;
  letter-spacing:.12em;
  text-transform:uppercase;
  outline:none;
}

.activationRow input::placeholder{
  color:rgba(255,255,255,.42);
}

.activationRow input:focus{
  border-color:rgba(255,255,255,.60);
}

.activationResult{
  min-height:26px;
  margin-top:16px;
  line-height:1.5;
}

.activationResult.success{
  color:#b7ffc6;
}

.activationResult.error{
  color:#ffb5b5;
}

#trialButton:disabled{
  opacity:.65;
  cursor:wait;
}

@media(max-width:700px){
  .activationCard{
    padding:20px;
  }

  .activationRow{
    flex-direction:column;
  }

  .activationRow .button{
    width:100%;
  }
}


/* WB KIZ download instruction */
.downloadGuideSection {
  padding: 70px 0;
}

.downloadGuide {
  display: grid;
  gap: 12px;
  max-width: 900px;
}

.downloadGuide details {
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 16px;
  background: rgba(255,255,255,.045);
  overflow: hidden;
}

.downloadGuide summary {
  cursor: pointer;
  padding: 18px 22px;
  font-weight: 700;
  font-size: 18px;
  list-style: none;
}

.downloadGuide summary::-webkit-details-marker {
  display: none;
}

.downloadGuide summary::after {
  content: "＋";
  float: right;
  opacity: .7;
}

.downloadGuide details[open] summary::after {
  content: "−";
}

.guideBody {
  padding: 0 22px 20px;
  line-height: 1.65;
}

.guideBody p {
  margin: 10px 0;
}

.guideBody ul {
  margin: 12px 0 12px 22px;
}

.guideBody li {
  margin: 7px 0;
}