/* Hogyan dolgozunk oldal (page-hogyan.php) — 2026-10-15, W06 */
.hogyan-section { padding-top: 2.5rem; }
.hogyan { max-width: 920px; margin: 0 auto; }
.hogyan-lead { font-family: var(--font-display); font-size: 1.6rem; line-height: 1.35; color: var(--text-primary); text-align: center; max-width: 760px; margin: 0 auto 1rem; }
.hogyan-intro { font-size: 1.08rem; line-height: 1.75; color: var(--text-secondary); text-align: center; max-width: 760px; margin: 0 auto 3rem; }
.hogyan-steps { list-style: none; margin: 0; padding: 0; position: relative; }
.hogyan-steps::before { content: ""; position: absolute; left: 27px; top: 28px; bottom: 28px; width: 2px; background: linear-gradient(var(--primary), var(--secondary)); opacity: .35; }
.hogyan-step { display: grid; grid-template-columns: 56px 1fr; gap: 1.6rem; margin: 0 0 2.6rem; position: relative; }
.hogyan-num { width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 1.6rem; font-weight: 600; color: #fff; background: var(--gradient); box-shadow: var(--shadow-sm); position: relative; z-index: 1; }
.hogyan-body { padding-top: .4rem; }
.hogyan-body h2 { font-family: var(--font-display); font-size: 1.9rem; font-weight: 600; margin: 0 0 .7rem; color: var(--text-primary); }
.hogyan-body p, .hogyan-body li { line-height: 1.75; color: var(--text-secondary); }
.hogyan-body p { margin: 0 0 .8rem; }
.hogyan-body ul { margin: 0 0 .9rem 1.2rem; padding: 0; }
.hogyan-body li { margin: 0 0 .35rem; }
.hogyan-more a { color: var(--primary); font-weight: 600; text-decoration: none; }
.hogyan-more a:hover { text-decoration: underline; text-underline-offset: 2px; }
.hogyan-fig { margin: 1.2rem 0 .4rem; }
.hogyan-fig img { width: 100%; height: auto; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); display: block; }
.hogyan-fig figcaption { font-size: .88rem; color: var(--text-muted); margin-top: .55rem; }
.hogyan-cta { max-width: 820px; margin: 1rem auto 2.5rem; text-align: center; padding: 2.2rem 1.5rem; border-radius: var(--radius-xl); background: var(--bg-light); }
.hogyan-cta p { font-size: 1.1rem; margin: 0 0 1.2rem; color: var(--text-primary); }
.hogyan-cta-btns { display: flex; gap: .8rem; justify-content: center; flex-wrap: wrap; }
@media (max-width: 680px) {
    .hogyan-lead { font-size: 1.3rem; }
    .hogyan-intro { text-align: left; }
    .hogyan-steps::before { left: 19px; }
    .hogyan-step { grid-template-columns: 40px 1fr; gap: 1rem; }
    .hogyan-num { width: 40px; height: 40px; font-size: 1.2rem; }
    .hogyan-body { padding-top: .15rem; }
    .hogyan-body h2 { font-size: 1.5rem; }
}