.home-container {
    width: 100%;
    max-width: 1000px;
    min-height: 100vh;
    padding: 48px 24px;
    margin: 0 auto;
}

.steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

@media (max-width: 1000px) {
    .steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .steps {
        grid-template-columns: 1fr;
    }
}

.step-card {
    display: flex;
    gap: 12px;
    border: 1px solid hsl(var(--border));
    border-radius: var(--radius);
    background: hsl(var(--card));
    padding: 20px;
    color: hsl(var(--foreground));
    text-decoration: none;
    transition: border-color 0.15s;
}

a.step-card:hover {
    border-color: hsl(var(--primary));
}

.step-no {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
}

.step-body h2 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 6px;
}

.step-body p {
    font-size: 14px;
    margin-bottom: 4px;
    overflow-wrap: anywhere;
}

.step-body .muted {
    color: hsl(var(--muted-foreground));
}

.step-body .ok {
    color: hsl(142 76% 28%);
    font-weight: 600;
}

.step-body .warn {
    color: hsl(0 84% 40%);
    font-weight: 600;
}

/* ③ 정산 계산 — 원장이 정산 가능하지 않으면 흐리게 막는다 */
.step-disabled {
    opacity: 0.45;
    cursor: not-allowed;
    background: hsl(var(--muted));
}