:root{
  --bg:#070a14;
  --panel:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.12);
  --txt:rgba(238,243,255,.92);
  --muted:rgba(238,243,255,.72);
  --muted2:rgba(238,243,255,.55);
  --a1:#22a7ff;
  --a2:#9b5cff;
  --shadow: 0 26px 90px rgba(0,0,0,.55);
}

*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--txt);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial}
a{color:inherit;text-decoration:none}
.wrap{width:min(1120px,92vw);margin:0 auto}

.topbar{position:sticky;top:0;z-index:50;background:rgba(7,10,20,.72);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.topbarInner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0}
.brandLogo{height:42px;width:auto;display:block}
.nav{display:flex;align-items:center;gap:16px}
.nav a{font-weight:700;color:var(--muted);font-size:14px}
.nav a:hover{color:var(--txt)}
.menuBtn{display:none;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--txt);border-radius:12px;padding:8px 10px;font-weight:900}
.mobileNav{display:none;padding:10px 0;border-top:1px solid var(--line)}
.mobileNav a{display:block;padding:10px 0;color:var(--muted);font-weight:800}
.mobileNav a:hover{color:var(--txt)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;border:1px solid var(--line);padding:12px 14px;font-weight:900}
.btn.small{padding:9px 12px;font-size:13px}
.btn.primary{background:linear-gradient(135deg,var(--a1),var(--a2));border-color:transparent;color:#0b1022}
.btn.ghost{background:rgba(255,255,255,.04)}
.btn.full{width:100%}

.hero{position:relative;padding:54px 0 28px;overflow:hidden}
.heroBg{
  position:absolute;inset:-120px;
  background:
    radial-gradient(900px 500px at 15% 15%, rgba(34,167,255,.22), transparent 55%),
    radial-gradient(900px 500px at 80% 25%, rgba(155,92,255,.20), transparent 55%),
    radial-gradient(900px 520px at 50% 95%, rgba(34,167,255,.14), transparent 55%);
  filter: blur(0px);
}
.heroInner{position:relative;display:grid;grid-template-columns: 1.15fr .85fr;gap:22px;align-items:start}
.pill{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--muted);padding:8px 12px;border-radius:999px;font-weight:900;font-size:12px}
h1{font-size:46px;line-height:1.05;margin:14px 0 10px}
.accent{background:linear-gradient(135deg,var(--a1),var(--a2));-webkit-background-clip:text;background-clip:text;color:transparent}
.heroCopy p{color:var(--muted);font-size:15.5px;line-height:1.55;max-width:56ch}
.heroCtas{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0 14px}

.trustRow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}
.trustCard{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:18px;padding:12px}
.trustCard b{display:block}
.trustCard span{display:block;color:var(--muted2);font-size:13px;margin-top:6px;line-height:1.35}

.heroPanel{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:24px;box-shadow:var(--shadow);padding:14px}
.panelTop{display:flex;gap:12px;align-items:center}
.panelLogo{height:46px;width:auto}
.panelMeta b{display:block}
.panelMeta span{display:block;color:var(--muted2);font-size:13px;margin-top:4px}
.panelGrid{display:grid;grid-template-columns:1fr;gap:10px;margin:14px 0}
.mini{display:flex;gap:12px;align-items:flex-start;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);border-radius:18px;padding:10px}
.miniIcon{width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center}
.mini b{display:block}
.mini span{display:block;color:var(--muted2);font-size:13px;margin-top:4px;line-height:1.35}
.panelCtas{display:grid;grid-template-columns:1fr;gap:10px}
.smallNote{color:var(--muted2);font-size:12.5px;line-height:1.4;margin-top:10px}

.section{padding:42px 0}
.section.alt{background:rgba(255,255,255,.02);border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.sectionHead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px}
.sectionHead h2{margin:0;font-size:28px}
.sectionHead p{margin:0;color:var(--muted);max-width:62ch;line-height:1.5}

.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.card{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:22px;padding:14px}
.cardIcon{width:42px;height:42px;border-radius:14px;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;font-size:18px}
.card h3{margin:10px 0 6px;font-size:18px}
.card p{margin:0 0 10px;color:var(--muted);font-size:14px;line-height:1.5}
.card ul{margin:0;padding-left:18px;color:var(--muted2);font-size:13.5px;line-height:1.5}
.card li{margin:6px 0}

.ctaBar{margin-top:16px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(135deg,rgba(34,167,255,.14),rgba(155,92,255,.12));border-radius:24px;padding:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ctaBar b{display:block}
.ctaBar span{display:block;color:var(--muted2);font-size:13px;margin-top:4px}

.split{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:start}
.split h2{margin-top:0}
.split p{color:var(--muted);line-height:1.6}
.bullets{display:grid;gap:10px;margin-top:14px}
.bullet{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);border-radius:18px;padding:12px}
.bullet b{display:block}
.bullet span{display:block;color:var(--muted2);font-size:13px;margin-top:6px;line-height:1.35}

.statCard{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:24px;padding:14px}
.statCard h3{margin:0 0 10px}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.stat{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03);border-radius:18px;padding:12px}
.stat .k{display:block;color:var(--muted2);font-size:12.5px}
.stat b{display:block;margin-top:6px}
.statFoot{margin-top:10px}

.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.stepCard{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:22px;padding:14px}
.stepCard b{display:block}
.stepCard span{display:block;color:var(--muted2);font-size:13px;margin-top:6px;line-height:1.35}

.notice{margin-top:14px;border:1px dashed rgba(255,255,255,.18);background:rgba(255,255,255,.03);border-radius:18px;padding:12px;color:var(--muted2);font-size:13px;line-height:1.45}

.faq{display:grid;gap:10px}
details{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:18px;padding:12px}
summary{cursor:pointer;font-weight:900}
details p{margin:10px 0 0;color:var(--muted);line-height:1.55}

.contact{display:grid;grid-template-columns:1.05fr .95fr;gap:16px;align-items:start}
.contact p{color:var(--muted);line-height:1.6}
.contactChips{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.chipInfo{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);border-radius:16px;padding:10px 12px}
.chipInfo b{display:block;font-size:12px;color:var(--muted2)}
.chipInfo span{display:block;margin-top:4px;font-weight:900}

.form{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:24px;padding:14px}
label{display:block;font-weight:900;font-size:12.5px;color:var(--muted2);margin-bottom:10px}
input,select,textarea{
  width:100%;margin-top:6px;border-radius:14px;border:1px solid rgba(255,255,255,.12);
  background:rgba(10,14,28,.65);color:var(--txt);padding:12px 12px;font:inherit
}
textarea{min-height:120px;resize:vertical}

.footer{padding:22px 0;border-top:1px solid rgba(255,255,255,.08)}
.footerInner{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.footerLogo{height:34px;width:auto}
.footerLinks{display:flex;gap:14px;color:var(--muted);font-weight:800;font-size:13px}
.footerLinks a:hover{color:var(--txt)}
.small{color:var(--muted2);font-size:12.5px}

.toast{
  position:fixed;left:50%;bottom:18px;transform:translateX(-50%);
  background:rgba(8,12,24,.92);border:1px solid rgba(255,255,255,.12);
  padding:10px 12px;border-radius:14px;box-shadow:var(--shadow);
  color:var(--txt);font-weight:900;font-size:13px;opacity:0;pointer-events:none;transition:opacity .18s ease
}
.toast.on{opacity:1}

@media(max-width:980px){
  .heroInner{grid-template-columns:1fr}
  .trustRow{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .contact{grid-template-columns:1fr}
  .nav{display:none}
  .menuBtn{display:inline-flex}
}


/* brand text next to logo */
.brand{display:flex;align-items:center;gap:10px}
.brandText{
  font-weight:900;
  letter-spacing:.3px;
  font-size:18px;
}

/* reviews */
.reviews{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.review{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  border-radius:20px;
  padding:14px;
}
.review p{
  margin:8px 0;
  color:rgba(238,243,255,.78);
  line-height:1.5;
}
.review b{font-size:14px}
.stars{letter-spacing:2px}

@media(max-width:980px){
  .reviews{grid-template-columns:1fr}
}

/* v3 trust bar */
.trustBar{border-bottom:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02)}
.trustBarInner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0;flex-wrap:wrap}
.trustLeft{display:flex;align-items:center;gap:10px}
.starsInline{letter-spacing:2px}
.mutedMini{color:var(--muted2);font-weight:700;font-size:13px}
.trustRight{display:flex;align-items:center;gap:10px;color:var(--muted);font-weight:800;font-size:13px;flex-wrap:wrap}
.trustRight .dot{opacity:.55}

/* v3 google-style reviews */
.gReviews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.gCard{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);border-radius:22px;padding:14px}
.gTop{display:flex;align-items:center;gap:10px}
.avatar{width:42px;height:42px;border-radius:999px;display:flex;align-items:center;justify-content:center;font-weight:900}
.avatar.a1{background:rgba(34,167,255,.22);border:1px solid rgba(34,167,255,.35)}
.avatar.a2{background:rgba(155,92,255,.22);border:1px solid rgba(155,92,255,.35)}
.avatar.a3{background:rgba(255,210,70,.22);border:1px solid rgba(255,210,70,.35)}
.avatar.a4{background:rgba(80,220,140,.18);border:1px solid rgba(80,220,140,.32)}
.gMeta b{display:block}
.gMeta span{display:block;color:var(--muted2);font-size:12.5px;margin-top:2px}
.gBadge{margin-left:auto;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.03);padding:6px 10px;border-radius:999px;font-weight:900;font-size:12px;color:var(--muted)}
.gStars{letter-spacing:2px;margin-top:10px}
.gCard p{margin:8px 0 0;color:rgba(238,243,255,.78);line-height:1.55}
.reviewFooter{margin-top:12px}
.reviewHint{border:1px dashed rgba(255,255,255,.18);background:rgba(255,255,255,.03);border-radius:18px;padding:12px;color:var(--muted2);font-size:13px;line-height:1.45}
.reviewHint b{display:block;color:var(--txt);margin-bottom:6px}

@media(max-width:980px){.gReviews{grid-template-columns:1fr}}

/* v3 sticky CTA */
.stickyCta{position:fixed;right:18px;bottom:18px;z-index:80}
.stickyMain{
  position:relative;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(135deg,var(--a1),var(--a2));
  color:#0b1022;
  padding:12px 14px;
  font-weight:950;
  box-shadow:var(--shadow);
  cursor:pointer;
}
.ping{
  position:absolute;left:10px;top:50%;transform:translateY(-50%);
  width:10px;height:10px;border-radius:999px;background:rgba(11,16,34,.85);
  box-shadow:0 0 0 0 rgba(34,167,255,.65);
  animation:ping 1.8s infinite;
}
@keyframes ping{
  0%{box-shadow:0 0 0 0 rgba(34,167,255,.65)}
  70%{box-shadow:0 0 0 14px rgba(34,167,255,0)}
  100%{box-shadow:0 0 0 0 rgba(34,167,255,0)}
}
.stickyPanel{
  margin-top:10px;
  width:min(320px, calc(100vw - 36px));
  border:1px solid rgba(255,255,255,.14);
  background:rgba(8,12,24,.92);
  backdrop-filter:blur(14px);
  border-radius:22px;
  padding:10px;
  box-shadow:var(--shadow);
  display:none;
}
.stickyPanel.on{display:block}
.stickyAction{
  display:flex;gap:12px;align-items:flex-start;
  padding:10px;border-radius:16px;border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
}
.stickyAction + .stickyAction{margin-top:10px}
.stickyAction:hover{background:rgba(255,255,255,.05)}
.stickyAction .ico{width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center}
.stickyAction b{display:block}
.stickyAction span{display:block;color:var(--muted2);font-size:12.5px;margin-top:4px;line-height:1.35}

/* v5 WhatsApp */
.btn.wa{
  background:rgba(37, 211, 102, .14);
  border-color:rgba(37, 211, 102, .28);
  color:var(--txt);
}
.btn.wa:hover{background:rgba(37, 211, 102, .18)}
.waBig{
  border-color:rgba(37, 211, 102, .35) !important;
  background:rgba(37, 211, 102, .14) !important;
}
.waBig .ico{background:rgba(37, 211, 102, .18) !important}
.waFloat{
  position:fixed;
  right:18px;
  bottom:86px;
  z-index:90;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 16px;
  border-radius:999px;
  background:rgba(37, 211, 102, .92);
  color:#06110b;
  font-weight:950;
  border:1px solid rgba(0,0,0,.18);
  box-shadow:0 26px 90px rgba(0,0,0,.45);
}
.waFloat:hover{filter:brightness(0.98)}
.waDot{
  width:10px;height:10px;border-radius:999px;background:#0b2a18;
  box-shadow:0 0 0 0 rgba(37, 211, 102, .55);
  animation:waPing 1.7s infinite;
}
@keyframes waPing{
  0%{box-shadow:0 0 0 0 rgba(37, 211, 102, .55)}
  70%{box-shadow:0 0 0 14px rgba(37, 211, 102, 0)}
  100%{box-shadow:0 0 0 0 rgba(37, 211, 102, 0)}
}
.hidden{display:none}

.shopMegaWrap{margin-top:28px;text-align:center}
.shopMegaBtn{display:inline-block;font-size:22px;font-weight:900;padding:22px 38px;border-radius:18px;background:linear-gradient(135deg,#22a7ff,#9b5cff);color:white;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.shopInline{text-align:center;margin:18px 0 10px}
.shopInlineBtn{display:inline-block;padding:14px 26px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);font-weight:800}
.shopFloat{position:fixed;left:18px;bottom:20px;z-index:95;padding:16px 20px;border-radius:999px;background:#ffd246;color:#111;font-weight:900;box-shadow:0 25px 70px rgba(0,0,0,.45)}