#how-it-works{background:linear-gradient(180deg,#fff,#f0f8fc);padding:65px 0}
#how-it-works>.wrap>.eyebrow{justify-content:center;font-size:12px;line-height:1.7;letter-spacing:1.6px}
#how-it-works>.wrap>h2{text-align:center}
#how-it-works .steps{gap:25px;margin-top:38px;align-items:stretch}
#how-it-works .steps article{--step-color:#087bc0;--step-tint:#e5f4fc;position:relative;display:flex;flex-direction:column;padding:28px;border:1px solid #d6e7ef;border-top:4px solid var(--step-color);border-radius:24px;background:#fff;box-shadow:0 9px 28px #124c6b0a;transition:transform .2s,box-shadow .2s}
#how-it-works .steps article:nth-child(2){--step-color:#0097ad;--step-tint:#e3f8fa}
#how-it-works .steps article:nth-child(3){--step-color:#428f2e;--step-tint:#eff8e9}
.step-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.step-icon{display:grid;place-items:center;width:62px;height:62px;background:var(--step-tint);color:var(--step-color);border-radius:19px}
.step-icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.step-number{color:var(--step-color);background:var(--step-tint);font-family:Manrope,Arial,sans-serif;font-size:12px;letter-spacing:.6px;font-weight:800;border-radius:30px;padding:7px 12px;line-height:1.5}
#how-it-works .steps h3{font-family:Manrope,Arial,sans-serif;font-size:22px;line-height:1.35;font-weight:700;letter-spacing:-.5px;color:#173e5a}
#how-it-works .steps p{font-size:16px;line-height:1.8;color:#536f80;margin:14px 0 22px}
.step-link{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:17px;border-top:1px solid #e2edf2;color:var(--step-color);font-size:14px;font-weight:700;min-height:45px;gap:12px}
.step-link:hover{text-decoration:underline;text-underline-offset:4px}
#how-it-works .steps article:hover{transform:translateY(-4px);box-shadow:0 14px 32px #124c6b15}
@media(max-width:800px){#how-it-works .steps{gap:16px}#how-it-works .steps article{padding:22px}#how-it-works .steps h3{font-size:20px}}
@media(max-width:580px){#how-it-works{padding:45px 0}#how-it-works .steps{grid-template-columns:1fr;gap:18px;margin-top:28px}#how-it-works .steps article{padding:25px}#how-it-works .steps h3{font-size:23px}.step-top{margin-bottom:20px}#how-it-works .steps p{font-size:16px}.step-link{font-size:15px;min-height:48px}}
@media(prefers-reduced-motion:reduce){#how-it-works .steps article:hover{transform:none}}