/* ==========================================================================
   How It Works page (Batch UI.2)
   ========================================================================== */
.hiw-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25rem; max-width: 62rem; margin-inline: auto; }
.hiw-step {
    display: grid;
    grid-template-columns: auto auto 1fr;
    gap: 1.25rem;
    align-items: center;
    background: var(--surface-card);
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    box-shadow: var(--shadow-soft);
}
.hiw-step__badge {
    width: 46px; height: 46px; border-radius: 50%;
    display: grid; place-items: center;
    background: linear-gradient(135deg, var(--brand-yellow), var(--brand-primary));
    color: #fff; font-weight: 800; font-size: 1.2rem;
    box-shadow: 0 8px 16px rgba(244, 168, 0, 0.32);
    flex: none;
}
.hiw-step__art { width: 56px; height: 56px; display: grid; place-items: center; border-radius: var(--radius-md); background: var(--brand-blue-soft); color: var(--brand-blue); }
.hiw-step__art .ic { width: 1.9rem; height: 1.9rem; }
.hiw-step__body h2 { font-size: 1.35rem; margin: 0 0 0.3rem; }
.hiw-step__body p { margin: 0; color: var(--text-secondary); }

.hiw-faq { max-width: 48rem; margin-inline: auto; display: grid; gap: 0.75rem; }
.hiw-faq__item {
    background: var(--surface-card);
    border: 1px solid var(--border-soft);
    border-radius: var(--radius-md);
    padding: 1rem 1.25rem;
    box-shadow: var(--shadow-soft);
}
.hiw-faq__item summary { font-weight: 700; cursor: pointer; list-style: none; }
.hiw-faq__item summary::-webkit-details-marker { display: none; }
.hiw-faq__item summary::after { content: '+'; float: right; color: var(--brand-primary); font-weight: 800; }
.hiw-faq__item[open] summary::after { content: '–'; }
.hiw-faq__item p { margin: 0.75rem 0 0; color: var(--text-secondary); }

@media (max-width: 640px) {
    .hiw-step { grid-template-columns: auto 1fr; }
    .hiw-step__art { display: none; }
}
