.how-it-works{background-color:var(--color-white)}.how-head{text-align:center;margin-bottom:var(--space-10)}.how-head h2{margin-bottom:var(--space-3)}.how-sub{color:var(--color-text-muted);font-size:var(--text-lg)}.how-steps{display:grid;grid-template-columns:1fr;gap:var(--space-6);margin-bottom:var(--space-12);list-style:none;padding:0}@media(min-width:768px){.how-steps{grid-template-columns:repeat(3,1fr);gap:var(--space-8)}}.how-step{position:relative;display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-6);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:border-color var(--transition-fast),transform var(--transition-fast)}.how-step:hover{border-color:var(--color-highlight-green);transform:translateY(-2px)}.how-step-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;background:var(--gradient-primary);color:var(--color-white);border-radius:var(--radius-md);box-shadow:var(--shadow-glow-blue)}.how-step-num{position:absolute;top:var(--space-4);right:var(--space-5);font-size:var(--text-3xl);font-weight:700;color:var(--color-border-strong);line-height:1}.how-step-title{font-size:var(--text-xl);font-weight:600;color:var(--color-text-main);margin-top:var(--space-2)}.how-step-body{font-size:var(--text-base);color:var(--color-text-muted);line-height:1.5}@media(prefers-reduced-motion:reduce){.how-step:hover{transform:none}}