
:root{--navy:#07111f;--ink:#102033;--muted:#64748b;--blue:#1663ff;--cyan:#67e8f9;--aqua:#e9fbff;--yellow:#facc15;--orange:#fb923c;--green:#22c55e;--line:#dbe7f3;--soft:#f6fbff;--shadow:0 24px 70px rgba(7,17,31,.13);--radius:28px}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Arial,Helvetica,sans-serif;background:linear-gradient(180deg,#f8fcff,#eef7ff);color:var(--ink);line-height:1.7}a{color:inherit}img{max-width:100%;height:auto;display:block}
.container{max-width:1180px;margin:0 auto;padding:0 22px}.topbar{background:#06111f;color:#dbeafe;font-size:14px;padding:8px 0}.topbar .container{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(219,231,243,.9)}.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 0}.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:900;color:var(--navy)}.logo-mark{width:44px;height:44px;border-radius:16px;background:linear-gradient(135deg,var(--blue),var(--cyan));display:grid;place-items:center;color:white;box-shadow:0 12px 30px rgba(22,99,255,.28);animation:badgeFloat 5s ease-in-out infinite}.menu{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.menu a{text-decoration:none;font-weight:850;color:#172033;position:relative;transition:.25s}.menu a:after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:2px;background:linear-gradient(90deg,var(--blue),var(--cyan));transition:.25s}.menu a:hover{color:var(--blue);transform:translateY(-1px)}.menu a:hover:after{width:100%}.nav-cta:after{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:13px 21px;text-decoration:none;font-weight:900;position:relative;overflow:hidden;border:2px solid transparent;transition:transform .25s,box-shadow .25s,filter .25s}.btn:before{content:"";position:absolute;top:0;left:-120%;width:70%;height:100%;background:linear-gradient(110deg,transparent,rgba(255,255,255,.46),transparent);transform:skewX(-18deg);transition:left .6s}.btn:hover:before{left:140%}.btn:hover{transform:translateY(-4px) scale(1.015)}.btn-primary{background:linear-gradient(135deg,var(--yellow),var(--orange));color:#111827;box-shadow:0 16px 38px rgba(251,146,60,.28)}.btn-secondary{background:#fff;color:var(--blue);border-color:#cfe1ff}.btn-dark{background:var(--navy);color:white}.btn-light{background:#fff;color:#08243d}
.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 16% 15%,rgba(103,232,249,.35),transparent 24%),linear-gradient(135deg,#06111f 0%,#0c2d4c 50%,#174dba 100%);color:white;padding:78px 0 60px}.hero-orb{position:absolute;border-radius:50%;filter:blur(8px);opacity:.35}.orb-one{width:260px;height:260px;background:#67e8f9;right:12%;top:12%;animation:orbMove 9s infinite ease-in-out}.orb-two{width:180px;height:180px;background:#facc15;left:-50px;bottom:10%;animation:orbMove 7s infinite ease-in-out reverse}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;position:relative;z-index:2}.eyebrow,.kicker{display:inline-block;font-weight:900;text-transform:uppercase;letter-spacing:.12em;font-size:13px;color:var(--blue);margin-bottom:10px}.eyebrow{color:#e0f2fe;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:8px 13px}.hero h1{font-size:clamp(36px,5vw,64px);line-height:1.04;letter-spacing:-1.5px;margin-bottom:20px}.hero p{font-size:20px;color:#dbeafe;max-width:720px;margin-bottom:26px}.hero-actions,.hero-badges{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px}.hero-badges span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:8px 12px;font-size:14px;font-weight:800;color:#e0f2fe;animation:softFloat 6s ease-in-out infinite}.hero-visual{border-radius:34px;padding:12px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);box-shadow:0 28px 80px rgba(0,0,0,.25)}.hero-visual img,.fancy-img{border-radius:26px;box-shadow:var(--shadow)}
section{padding:76px 0}.section-head{max-width:800px;margin-bottom:34px}.section-head.center{text-align:center;margin:0 auto 42px}.section-head h2,.page-hero h1,.split h2{font-size:clamp(30px,4vw,48px);line-height:1.12;color:var(--navy);letter-spacing:-1px;margin-bottom:14px}.section-head p,.page-hero p,.split p{font-size:18px;color:var(--muted)}.feature-grid,.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.glass-card,.price-card,.content-card{background:rgba(255,255,255,.86);border:1px solid rgba(219,231,243,.9);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px;backdrop-filter:blur(10px);transition:.28s}.glass-card:hover,.price-card:hover,.content-card:hover{transform:translateY(-8px);box-shadow:0 30px 74px rgba(7,17,31,.17)}.icon{width:56px;height:56px;border-radius:19px;display:grid;place-items:center;background:linear-gradient(135deg,#dbeafe,#ecfeff);font-size:26px;margin-bottom:16px}.glass-card h3,.price-card h3,.content-card h2{font-size:23px;color:var(--navy);margin-bottom:10px}.glass-card p,.content-card p{color:#475569}.soft-gradient{background:linear-gradient(180deg,#fff,#eaf6ff)}.split{display:grid;grid-template-columns:.95fr 1.05fr;gap:44px;align-items:center}.keyword-cloud{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.keyword-cloud span{background:#fff;border:1px solid #cfe1ff;color:#1d4ed8;padding:8px 12px;border-radius:999px;font-weight:850;box-shadow:0 8px 22px rgba(22,99,255,.08)}.pricing-section{background:linear-gradient(180deg,#eef6ff,#fff)}.price-card{position:relative}.price-card.featured{border:2px solid var(--blue);transform:translateY(-10px)}.tag{display:inline-block;background:#dbeafe;color:#1d4ed8;border-radius:999px;padding:6px 11px;font-weight:900;font-size:13px;margin-bottom:12px}.price{font-size:44px;font-weight:900;color:var(--navy);margin:8px 0}.price-card ul,.check-list{list-style:none;margin:16px 0}.price-card li,.check-list li{padding:9px 0;border-bottom:1px solid #edf3f8;color:#334155}.price-card li:before,.check-list li:before{content:"✓";color:var(--green);font-weight:900;margin-right:9px}.dark-proof{background:linear-gradient(135deg,#06111f,#082f63);color:white}.proof-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.proof-grid h2{font-size:clamp(30px,4vw,48px);line-height:1.12;margin-bottom:14px}.proof-grid p{color:#dbeafe;margin-bottom:14px}.proof-grid a{color:#facc15;font-weight:900}.kicker.light{color:#bfdbfe}.faq details{background:white;border:1px solid var(--line);border-radius:20px;padding:18px 22px;margin-bottom:13px;box-shadow:0 12px 34px rgba(7,17,31,.06)}.faq summary{font-weight:900;color:var(--navy);cursor:pointer}.faq p{margin-top:10px;color:#475569}.cta-section{padding-top:40px}.cta{background:linear-gradient(135deg,var(--blue),#082f63);color:white;border-radius:34px;padding:48px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;box-shadow:0 28px 80px rgba(22,99,255,.22)}.cta h2{font-size:clamp(28px,4vw,42px);line-height:1.12;margin-bottom:10px}.cta p{color:#dbeafe}.page-hero{background:linear-gradient(180deg,#eaf6ff,#fff);padding:64px 0;border-bottom:1px solid var(--line)}.breadcrumbs{font-weight:900;color:var(--blue);font-size:14px;margin-bottom:14px}.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px}.fake-form label{display:block;font-weight:900;margin:10px 0 6px}.fake-form input,.fake-form textarea{width:100%;border:1px solid #cbd5e1;border-radius:15px;padding:14px;background:#f8fafc}.fake-form textarea{min-height:150px}
footer{background:#06111f;color:#cbd5e1;padding:44px 0 22px}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:28px;margin-bottom:24px}footer a{display:block;color:#dbeafe;text-decoration:none;margin:8px 0}.small{font-size:14px;color:#94a3b8}.mobile-cta{display:none}
.fancy-img,.hero-visual img{transition:transform .3s,filter .3s}.fancy-img:hover,.hero-visual img:hover{transform:scale(1.025);filter:saturate(1.07)}@keyframes badgeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px) scale(1.03)}}@keyframes softFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes orbMove{0%,100%{transform:translate(0,0)}50%{transform:translate(-20px,-14px)}}
@media(max-width:980px){.hero-grid,.split,.proof-grid,.contact-grid,.cta{grid-template-columns:1fr}.feature-grid,.pricing-grid,.footer-grid{grid-template-columns:1fr}.menu{display:none}.price-card.featured{transform:none}.hero{padding:54px 0}.mobile-cta{display:flex;position:fixed;bottom:14px;left:14px;right:14px;z-index:90;box-shadow:0 16px 34px rgba(0,0,0,.22)}section{padding:56px 0}}


/* Web NS polished logo */
.logo{
  gap:12px;
  font-size:18px;
  letter-spacing:-.35px;
}
.logo-webns{
  width:58px;
  height:58px;
  border-radius:20px;
  position:relative;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 18%, rgba(255,255,255,.48), transparent 26%),
    linear-gradient(135deg,#1663ff 0%,#0ea5e9 48%,#67e8f9 100%);
  box-shadow:0 16px 36px rgba(22,99,255,.30);
  color:#fff;
  isolation:isolate;
}
.logo-webns::before{
  content:"";
  position:absolute;
  inset:7px;
  border-radius:16px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.28);
  z-index:-1;
}
.logo-webns::after{
  content:"";
  position:absolute;
  right:-18px;
  bottom:-18px;
  width:54px;
  height:54px;
  border-radius:50%;
  background:rgba(250,204,21,.95);
  box-shadow:0 0 22px rgba(250,204,21,.42);
}
.logo-code{
  position:absolute;
  top:6px;
  left:8px;
  font-size:12px;
  line-height:1;
  font-weight:900;
  opacity:.95;
  letter-spacing:-1px;
}
.logo-web-text{
  font-size:17px;
  line-height:1;
  font-weight:900;
  transform:translateY(1px);
}
.logo-ns-text{
  position:absolute;
  right:8px;
  bottom:8px;
  z-index:2;
  font-size:13px;
  line-height:1;
  font-weight:950;
  color:#07111f;
}
.footer-logo .logo-webns{
  width:54px;
  height:54px;
}
.site-header .logo span:last-child,
footer .logo span:last-child{
  font-weight:950;
  color:#07111f;
}
footer .logo span:last-child{
  color:#e0f2fe;
}
@media(max-width:980px){
  .logo-webns{width:52px;height:52px;border-radius:18px}
  .logo span:last-child{font-size:17px}
}


/* stronger hero life animation */
.hero-orb{
  pointer-events:none;
  z-index:1;
}
.orb-one{
  width:360px;
  height:360px;
  right:4%;
  top:5%;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.92) 0%, rgba(250,204,21,.82) 20%, rgba(103,232,249,.45) 46%, rgba(22,99,255,.14) 72%, transparent 78%);
  opacity:.48;
  filter:blur(10px);
  animation:heroSunMove 12s ease-in-out infinite;
}
.orb-two{
  width:150px;
  height:150px;
  left:4%;
  bottom:12%;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.86) 0%, rgba(250,204,21,.92) 28%, rgba(251,146,60,.48) 58%, transparent 78%);
  opacity:.55;
  filter:blur(7px);
  animation:yellowOrbDance 7.5s ease-in-out infinite;
}
.hero-visual{
  position:relative;
  z-index:2;
}
.hero-copy{
  position:relative;
  z-index:2;
}
@keyframes heroSunMove{
  0%{transform:translate(0,0) scale(1); opacity:.42;}
  18%{transform:translate(-42px,28px) scale(1.08); opacity:.55;}
  38%{transform:translate(-86px,78px) scale(.96); opacity:.48;}
  58%{transform:translate(-34px,118px) scale(1.12); opacity:.60;}
  78%{transform:translate(28px,52px) scale(1.03); opacity:.52;}
  100%{transform:translate(0,0) scale(1); opacity:.42;}
}
@keyframes yellowOrbDance{
  0%{transform:translate(0,0) scale(1) rotate(0deg); opacity:.45;}
  20%{transform:translate(36px,-24px) scale(1.12) rotate(18deg); opacity:.62;}
  42%{transform:translate(92px,-8px) scale(.92) rotate(38deg); opacity:.50;}
  62%{transform:translate(64px,34px) scale(1.16) rotate(12deg); opacity:.66;}
  82%{transform:translate(18px,20px) scale(1.03) rotate(-10deg); opacity:.52;}
  100%{transform:translate(0,0) scale(1) rotate(0deg); opacity:.45;}
}
