.how-it-works-container{text-align:center;max-width:1100px;width:100%;margin:0 auto 4rem;position:relative;z-index:10}.section-title{font-size:2rem;font-weight:700;margin-bottom:3rem;color:#fff}@media(max-width:640px){.section-title{font-size:1.5rem;margin-bottom:2rem}}.steps-grid{display:grid;grid-template-columns:repeat(1,1fr);gap:2rem}@media(min-width:768px){.steps-grid{grid-template-columns:repeat(3,1fr)}}.step-item{display:flex;flex-direction:column;align-items:center;gap:1rem;position:relative;z-index:2}.step-icon-wrapper{width:64px;height:64px;background:#6366f11a;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:.5rem;transition:all .3s ease;position:relative;z-index:1}.step-icon{width:32px;height:32px;color:#818cf8;position:relative;z-index:5}.icon-wave{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;border:1px solid rgba(99,102,241,.5);box-shadow:0 0 10px #6366f133;opacity:0;z-index:0}.wave-1{width:100%;height:100%;animation:ripple-wave 7s infinite linear;animation-delay:0s}.wave-2{width:100%;height:100%;animation:ripple-wave 7s infinite linear;animation-delay:2.3s}.wave-3{width:100%;height:100%;animation:ripple-wave 7s infinite linear;animation-delay:4.6s}@keyframes ripple-wave{0%{width:100%;height:100%;opacity:0;border-width:1px}15%{opacity:.2}to{width:160%;height:160%;opacity:0;border-width:0px}}.step-item h4{font-size:1.1rem;font-weight:600;color:#f1f5f9;margin:0}.step-item p{font-size:.95rem;color:#94a3b8;line-height:1.5;margin:0;max-width:280px}.glow-card{position:relative;background:#0f172a99;border:1px solid rgba(255,255,255,.08);border-radius:1.5rem;padding:3rem;overflow:hidden;transition:border-color .3s ease;background-image:radial-gradient(circle at 50% 0%,rgba(99,102,241,.15),transparent 70%)}@media(max-width:640px){.glow-card{padding:1.5rem;border-radius:1rem}}.glow-card:hover{border-color:#6366f14d}.glow-spotlight{pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(400px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.15),rgba(99,102,241,.3) 30%,transparent 65%);opacity:0;transition:opacity .3s ease;z-index:20;will-change:background;mix-blend-mode:overlay}.glow-card:hover .glow-spotlight{opacity:1}.glow-card>*{position:relative;z-index:2}