/* دور ۲۲ — بازطراحی بالای صفحه‌ی خدمات هوش مصنوعی: قاب، پس‌زمینه‌ی شبکه‌ی عصبی، تایپوگرافی و دکمه‌ی مشاوره‌ی پررنگ */
.ai22-hero{display:grid;grid-template-columns:1.3fr .7fr;gap:24px;align-items:center;text-align:start;padding:clamp(28px,5vw,64px) clamp(20px,4vw,56px);border-radius:32px;position:relative;isolation:isolate;
  background:radial-gradient(90% 120% at 100% 0,rgba(34,211,238,.18),transparent 55%),radial-gradient(80% 100% at 0 100%,rgba(139,92,246,.28),transparent 60%),linear-gradient(160deg,#071327,#0b1030 55%,#120a2e);
  border:1px solid rgba(125,211,252,.22);box-shadow:0 30px 80px -40px rgba(34,211,238,.55),inset 0 1px 0 rgba(255,255,255,.08)}
.ai22-hero::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:.5;background-image:linear-gradient(rgba(125,211,252,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(125,211,252,.08) 1px,transparent 1px);background-size:38px 38px;mask-image:radial-gradient(70% 90% at 50% 40%,#000,transparent)}
.ai22-scan{position:absolute;inset-inline:0;top:0;height:120px;z-index:-1;background:linear-gradient(180deg,transparent,rgba(34,211,238,.12),transparent);animation:ai22s 7s linear infinite;pointer-events:none}
@keyframes ai22s{from{transform:translateY(-120px)}to{transform:translateY(520px)}}
.ai22-txt{display:grid;gap:14px;justify-items:start}
.ai22-hero .kick{background:rgba(34,211,238,.12);border:1px solid rgba(34,211,238,.4);color:#67e8f9;font-weight:700}
.ai22-en{font-family:Inter,"Vazirmatn",sans-serif;letter-spacing:.22em;font-size:.72rem;color:#8b9bd6;font-weight:700}
.ai22-hero h1{font-size:clamp(1.7rem,3.5vw,2.7rem);line-height:1.5;font-weight:900;letter-spacing:-.01em;margin:0;background:linear-gradient(95deg,#fff 10%,#67e8f9 55%,#c4b5fd);-webkit-background-clip:text;background-clip:text;color:transparent;text-align:start}
.ai22-hero p{margin:0;max-width:56ch;font-size:clamp(.98rem,1.9vw,1.16rem);line-height:2.05;color:#cdd6f6;text-align:start}
.ai22-hero .cta{justify-content:flex-start;margin-top:6px}
.ai22-hero .ai22-main{position:relative;overflow:hidden;background:linear-gradient(100deg,#06b6d4,#6366f1 55%,#a855f7)!important;color:#fff!important;border:0!important;font-weight:900;font-size:1.06rem;padding:15px 28px;border-radius:16px;box-shadow:0 14px 34px -10px rgba(99,102,241,.9),0 0 0 1px rgba(255,255,255,.25) inset;text-shadow:0 1px 2px rgba(0,0,0,.35);display:inline-flex;gap:10px;align-items:center}
.ai22-hero .ai22-main::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(120%);animation:ai22sh 3.6s ease-in-out infinite}
@keyframes ai22sh{60%,100%{transform:translateX(-120%)}}
.ai22-hero .ai22-main:hover{transform:translateY(-2px);filter:brightness(1.1)}
.ai22-hero .ai22-chat{background:rgba(255,255,255,.06)!important;border:1.5px solid rgba(125,211,252,.55)!important;color:#e0f2fe!important;font-weight:800;padding:14px 22px;border-radius:16px}
.ai22-hero .ai22-chat:hover{background:rgba(125,211,252,.14)!important}
.ai22-hero .stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}.ai22-hero .stats span{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:8px 14px;font-size:.82rem;color:#aab6e6}.ai22-hero .stats b{font-size:1.15rem;color:#fff;margin-inline-end:4px}
.ai22-vis{position:relative;aspect-ratio:7/6;min-height:240px}
.ai22-net{width:100%;height:100%}.ai22-net .n circle{fill:#e0f2fe;filter:drop-shadow(0 0 6px #22d3ee);animation:ai22b 3.2s ease-in-out infinite}.ai22-net .n circle:nth-child(2n){animation-delay:-1.1s}.ai22-net .n circle:nth-child(3n){animation-delay:-2s}
@keyframes ai22b{50%{opacity:.45}}
.ai22-net .pulse{transform-box:fill-box;transform-origin:center;animation:ai22p 2.8s ease-out infinite}.ai22-net .p2{animation-delay:-1.4s}@keyframes ai22p{from{transform:scale(.4);opacity:1}to{transform:scale(2);opacity:0}}
.ai22-vis .fc{position:absolute;display:inline-flex;gap:8px;align-items:center;padding:9px 14px;border-radius:14px;background:rgba(15,23,60,.72);backdrop-filter:blur(8px);border:1px solid rgba(125,211,252,.35);color:#e0f2fe;font-size:.82rem;font-weight:700;box-shadow:0 12px 28px -14px rgba(0,0,0,.7);animation:ai22f 5s ease-in-out infinite}
.ai22-vis .fc i{color:#67e8f9}.ai22-vis .f1{top:6%;inset-inline-start:2%}.ai22-vis .f2{top:44%;inset-inline-end:0;animation-delay:-1.7s}.ai22-vis .f3{bottom:6%;inset-inline-start:12%;animation-delay:-3.2s}
@keyframes ai22f{50%{transform:translateY(-8px)}}
.ai22 .ai18-tools input{background:rgba(255,255,255,.05);border:1px solid rgba(125,211,252,.28);color:#fff}
.ai22 .ai18-card{backdrop-filter:blur(6px)}
@media (max-width:860px){.ai22-hero{grid-template-columns:1fr;padding:26px 18px}.ai22-vis{order:-1;min-height:0;aspect-ratio:7/4;max-height:200px}.ai22-vis .f2{display:none}.ai22-hero .cta{width:100%}.ai22-hero .ai22-main,.ai22-hero .ai22-chat{flex:1 1 100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.ai22-scan,.ai22-net *,.ai22-vis .fc,.ai22-hero .ai22-main::after{animation:none!important}}
