:root{--bg:#0d0d20;--panel:#17172e;--text:#f7f7ff;--muted:#b8b8d1;--purple:#8b7cff;--cyan:#62e4e7;--line:rgba(255,255,255,.11)}
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:radial-gradient(ellipse at 80% 0%,rgba(104,83,255,.18),transparent 38%),radial-gradient(ellipse at 5% 40%,rgba(65,220,220,.08),transparent 30%),var(--bg);color:var(--text);font-family:"Vazirmatn",Tahoma,Arial,sans-serif;line-height:1.8}
    a{color:inherit;text-decoration:none}
    .wrap{width:min(1140px,calc(100% - 40px));margin:auto}
    header{padding:22px 0;border-bottom:1px solid var(--line)}
    .nav{display:flex;align-items:center;justify-content:space-between;gap:20px}
    .brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:1.15rem}
    .logo{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,var(--purple),#5a50c9);box-shadow:0 8px 30px #7165ff45;font-size:1.3rem}
    .navlinks{display:flex;align-items:center;gap:26px;color:var(--muted);font-size:.92rem}
    .navlinks a:hover{color:white}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:14px;padding:12px 20px;font-weight:700;transition:.2s;cursor:pointer;font-family:inherit}
    .btn-primary{color:#101022;background:linear-gradient(135deg,var(--cyan),#a0fff0);box-shadow:0 8px 25px #62e4e728}
    .btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px #62e4e740}
    .btn-ghost{border-color:var(--line);background:#ffffff08}
    .hero{padding:88px 0 74px;display:grid;grid-template-columns:1.12fr .88fr;gap:54px;align-items:center}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid #8b7cff55;background:#8b7cff14;color:#c9c2ff;padding:7px 13px;border-radius:99px;font-size:.84rem}
    .dot{width:7px;height:7px;background:var(--cyan);border-radius:50%;box-shadow:0 0 12px var(--cyan)}
    h1{font-size:clamp(2.2rem,5vw,4rem);line-height:1.35;letter-spacing:-1.5px;margin:20px 0}
    h1 span{background:linear-gradient(90deg,var(--cyan),#aaa0ff);background-clip:text;-webkit-background-clip:text;color:transparent}
    .lead{font-size:1.08rem;color:var(--muted);max-width:640px;margin:0 0 28px}
    .actions{display:flex;flex-wrap:wrap;gap:12px}
    .micro{display:flex;gap:20px;flex-wrap:wrap;margin-top:28px;color:var(--muted);font-size:.88rem}
    .micro span{display:flex;align-items:center;gap:7px}
    .check{color:var(--cyan);font-weight:800}
    .visual{position:relative;min-height:390px;display:grid;place-items:center}
    .orb{position:absolute;width:300px;height:300px;border-radius:50%;background:linear-gradient(135deg,#8b7cff40,#62e4e718);filter:blur(1px);border:1px solid #ffffff18}
    .dashboard{position:relative;width:min(100%,390px);padding:24px;border:1px solid #ffffff20;background:linear-gradient(145deg,#242442eF,#15152beF);border-radius:26px;box-shadow:0 30px 90px #0007;transform:rotate(-2deg)}
    .dash-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
    .dash-title{font-weight:700}.status{font-size:.75rem;color:var(--cyan);background:#62e4e714;padding:4px 10px;border-radius:20px}
    .metric{padding:18px;border-radius:18px;background:#ffffff07;border:1px solid var(--line);margin:12px 0}
    .metric-top{display:flex;justify-content:space-between;color:var(--muted);font-size:.85rem}
    .metric strong{display:block;font-size:1.7rem;margin-top:5px}
    .bars{height:55px;display:flex;align-items:end;gap:7px;margin-top:12px}
    .bars i{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(0deg,#7165ff,var(--cyan));opacity:.9}
    .float-card{position:absolute;bottom:22px;left:-4px;padding:14px 18px;background:#20203b;border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 35px #0005;font-size:.88rem}
    .float-card b{display:block;color:var(--cyan);font-size:1rem}
    section{padding:65px 0}
    .section-head{text-align:center;max-width:700px;margin:0 auto 36px}
    .section-head h2{font-size:clamp(1.6rem,3vw,2.35rem);margin:0 0 12px}
    .section-head p{color:var(--muted);margin:0}
    .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
    .card{padding:26px;border:1px solid var(--line);background:linear-gradient(145deg,#ffffff08,#ffffff03);border-radius:22px;transition:.2s}
    .card:hover{transform:translateY(-5px);border-color:#8b7cff77}
    .icon{width:50px;height:50px;display:grid;place-items:center;border-radius:16px;background:#8b7cff1c;color:#c9c2ff;font-size:1.4rem;margin-bottom:16px}
    .card h3{margin:0 0 8px;font-size:1.12rem}
    .card p{margin:0;color:var(--muted);font-size:.94rem}
    .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:step}
    .step{padding:22px;border-top:1px solid var(--line)}
    .step-no{color:var(--cyan);font-size:.85rem;font-weight:800}
    .step h3{margin:8px 0}.step p{color:var(--muted);margin:0;font-size:.93rem}
    .cta{padding:38px;border:1px solid #8b7cff55;border-radius:28px;background:linear-gradient(115deg,#8b7cff1b,#62e4e70a);display:flex;align-items:center;justify-content:space-between;gap:24px}
    .cta h2{margin:0 0 8px;font-size:1.7rem}.cta p{margin:0;color:var(--muted)}
    footer{margin-top:55px;padding:28px 0;border-top:1px solid var(--line);color:var(--muted);font-size:.86rem}
    .foot{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
    @media(max-width:850px){.hero{grid-template-columns:1fr;gap:25px;padding-top:60px}.visual{min-height:360px}.grid{grid-template-columns:repeat(2,1fr)}.navlinks{gap:14px}.cta{align-items:flex-start;flex-direction:column}}
    @media(max-width:560px){.wrap{width:min(100% - 28px,1140px)}header{padding:15px 0}.navlinks{display:none}.nav .btn{padding:9px 12px;font-size:.85rem}.hero{padding:48px 0 35px}h1{letter-spacing:-.7px}.lead{font-size:1rem}.visual{min-height:330px}.dashboard{padding:18px}.orb{width:250px;height:250px}.float-card{left:0;bottom:5px}.grid,.steps{grid-template-columns:1fr}section{padding:45px 0}.cta{padding:25px}.cta h2{font-size:1.4rem}.micro{gap:10px}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
  
    .navlinks a[aria-current="page"]{color:#fff}
    .page-hero{padding:58px 0 28px}
    .page-hero .eyebrow{margin-bottom:14px}
    .page-hero h1{font-size:clamp(2rem,4vw,3.1rem);margin:12px 0}
    .page-hero p{color:var(--muted);max-width:800px;margin:0}
    .page-body{padding:20px 0 70px}
    .content-panel{background:linear-gradient(145deg,#ffffff08,#ffffff03);border:1px solid var(--line);border-radius:22px;padding:clamp(20px,4vw,38px);margin-bottom:18px}
    .content-panel h2{font-size:1.2rem;margin:0 0 10px}
    .content-panel h3{font-size:1.02rem;margin:20px 0 8px}
    .content-panel p,.content-panel li{color:var(--muted)}
    .content-panel p:last-child{margin-bottom:0}
    .content-panel ul{padding-right:22px}
    .note{border-right:3px solid var(--cyan);padding:12px 16px;background:#62e4e70c;border-radius:10px;color:#d6fffb;margin-top:20px}
    .contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
    .contact-item{padding:22px;border:1px solid var(--line);border-radius:18px;background:#ffffff06}
    .contact-item .icon{margin-bottom:12px}
    .contact-item h2{margin:0 0 8px;font-size:1.05rem}
    .contact-item p{color:var(--muted);margin:0}
    .page-footer-links{display:flex;gap:16px;flex-wrap:wrap}
    .page-footer-links a:hover{color:#fff}
    @media(max-width:560px){.page-hero{padding:40px 0 20px}.contact-grid{grid-template-columns:1fr}.content-panel{padding:20px}}