.how-it-works{background:linear-gradient(#0000,#3b82f605);padding:3rem 1rem;position:relative}@media (min-width:640px){.how-it-works{padding:4rem 1.5rem}}@media (min-width:768px){.how-it-works{padding:6rem 2rem}}.how-it-works .how-it-works-container{max-width:1400px;margin:0 auto}.how-it-works .how-it-works-header{text-align:center;margin-bottom:3.5rem;animation:.8s ease-out slide-up}@media (min-width:768px){.how-it-works .how-it-works-header{margin-bottom:4rem}}.how-it-works .how-it-works-header .label{letter-spacing:.2em;color:var(--primary-glow);text-transform:uppercase;background:#3b82f61a;border:1px solid #3b82f633;border-radius:50px;margin-bottom:1rem;padding:.5rem 1rem;font-size:.75rem;font-weight:700;display:inline-block}@media (min-width:640px){.how-it-works .how-it-works-header .label{font-size:.8rem}}.how-it-works .how-it-works-header .title{letter-spacing:-.03em;color:var(--foreground);margin-top:1.5rem;font-family:Sohne,sans-serif;font-size:1.75rem;font-weight:900;line-height:1.15}@media (min-width:640px){.how-it-works .how-it-works-header .title{font-size:2rem}}@media (min-width:768px){.how-it-works .how-it-works-header .title{font-size:2.5rem}}@media (min-width:1024px){.how-it-works .how-it-works-header .title{font-size:3rem}}.how-it-works .how-it-works-header .title .text-gradient{background:linear-gradient(135deg,#f6f9fc,#add1ff 50%,#88bcff,#60a7ff);-webkit-text-fill-color:#0000;-webkit-background-clip:text;background-clip:text;display:inline-block}.how-it-works .steps-grid{grid-template-columns:1fr;gap:1.5rem;display:grid;position:relative}@media (min-width:640px){.how-it-works .steps-grid{grid-template-columns:repeat(2,1fr);gap:1.75rem}}@media (min-width:1024px){.how-it-works .steps-grid{grid-template-columns:repeat(4,1fr);gap:2rem}}.how-it-works .steps-grid .step-card{text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff05;border:1px solid #3b82f61a;border-radius:1rem;flex-direction:column;justify-content:center;align-items:center;padding:2.5rem 1.5rem 1.5rem;transition:all .5s cubic-bezier(.16,1,.3,1);animation:.8s ease-out both slide-up;display:flex;position:relative;overflow:visible}@media (min-width:640px){.how-it-works .steps-grid .step-card{border-radius:1.125rem;padding:3rem 2rem 2rem}}@media (min-width:768px){.how-it-works .steps-grid .step-card{border-radius:1.25rem;padding:3.5rem 2.5rem 2.5rem}}@media (min-width:1024px){.how-it-works .steps-grid .step-card{min-height:300px}}.how-it-works .steps-grid .step-card:first-child{animation-delay:.1s}.how-it-works .steps-grid .step-card:nth-child(2){animation-delay:.2s}.how-it-works .steps-grid .step-card:nth-child(3){animation-delay:.3s}.how-it-works .steps-grid .step-card:nth-child(4){animation-delay:.4s}.how-it-works .steps-grid .step-card:hover{background:#3b82f614;border-color:#3b82f64d;transform:translateY(-8px);box-shadow:0 20px 40px #3b82f626}.how-it-works .steps-grid .step-card:hover .step-icon{transform:scale(1.1)rotate(-5deg);box-shadow:0 8px 20px #3b82f64d}.how-it-works .steps-grid .step-card:hover .step-number{animation:1.5s infinite number-pulse}.how-it-works .steps-grid .step-card .step-number{background:linear-gradient(135deg, var(--primary), #06b6d4);border:3px solid var(--background);color:#fff;z-index:10;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.1rem;font-weight:700;transition:all .3s;display:flex;position:absolute;top:-20px;left:50%;transform:translate(-50%)}@media (min-width:640px){.how-it-works .steps-grid .step-card .step-number{width:52px;height:52px;font-size:1.25rem;top:-26px}}@media (min-width:768px){.how-it-works .steps-grid .step-card .step-number{width:56px;height:56px;font-size:1.35rem;top:-28px}}.how-it-works .steps-grid .step-card .step-icon{width:68px;height:68px;color:var(--primary-glow);background:linear-gradient(135deg,#3b82f633,#06b6d41a);border:1px solid #3b82f633;border-radius:.85rem;justify-content:center;align-items:center;margin-top:1rem;margin-bottom:1.5rem;transition:all .5s cubic-bezier(.16,1,.3,1);display:flex}@media (min-width:640px){.how-it-works .steps-grid .step-card .step-icon{border-radius:.95rem;width:76px;height:76px;margin-bottom:1.75rem}}@media (min-width:768px){.how-it-works .steps-grid .step-card .step-icon{border-radius:1.1rem;width:84px;height:84px;margin-bottom:2rem}}.how-it-works .steps-grid .step-card .step-icon svg{width:32px;height:32px}@media (min-width:640px){.how-it-works .steps-grid .step-card .step-icon svg{width:36px;height:36px}}@media (min-width:768px){.how-it-works .steps-grid .step-card .step-icon svg{width:40px;height:40px}}.how-it-works .steps-grid .step-card .step-title{color:var(--foreground);margin-bottom:.75rem;font-family:Sohne,sans-serif;font-size:1rem;font-weight:700}@media (min-width:640px){.how-it-works .steps-grid .step-card .step-title{font-size:1.1rem}}@media (min-width:768px){.how-it-works .steps-grid .step-card .step-title{font-size:1.2rem}}.how-it-works .steps-grid .step-card .step-description{color:var(--muted-foreground);font-size:.8rem;font-weight:500;line-height:1.6}@media (min-width:640px){.how-it-works .steps-grid .step-card .step-description{font-size:.85rem;line-height:1.7}}@media (min-width:768px){.how-it-works .steps-grid .step-card .step-description{font-size:.9rem;line-height:1.75}}.how-it-works .steps-grid .connector-lines{pointer-events:none;width:100%;height:4px;display:none;position:absolute;top:48px;left:0;right:0}@media (min-width:1024px){.how-it-works .steps-grid .connector-lines{display:block}}@keyframes number-pulse{0%,to{box-shadow:0 0 #3b82f6b3}50%{box-shadow:0 0 0 12px #3b82f600}}
