:root{--visual-step-list__flex-direction:column;--visual-step-list__label-flex-direction:row;--visual-step-list__top-margin:12px;--visual-step-list__image-top-margin:0;--visual-step-list__image-width:min(540px,100%)}@media (min-width:1080px){:root{--visual-step-list__flex-direction:row;--visual-step-list__label-flex-direction:column;--visual-step-list__top-margin:-80px;--visual-step-list__image-top-margin:80px;--visual-step-list__image-width:400px}}.visual-step-list{align-items:center;display:flex;flex-direction:var(--visual-step-list__flex-direction);gap:16px;justify-content:center;margin:var(--visual-step-list__top-margin) auto 0}.visual-step-list__step{align-items:center;display:flex;flex-direction:var(--visual-step-list__label-flex-direction);gap:8px;height:16px;width:16px}.visual-step-list__step--with-image{flex-direction:column;height:auto;width:auto}.visual-step-list__separator{display:flex;flex-direction:var(--visual-step-list__flex-direction);gap:16px}.visual-step-list__bigdot{background:var(--blue-500);border-radius:50%;height:16px;min-height:16px;min-width:16px;width:16px}.visual-step-list__smalldot{background:var(--gray-200);border-radius:50%;display:none;height:8px;width:8px}.visual-step-list__smalldot:nth-child(-n+4){display:block}@media (min-width:1080px){.visual-step-list__smalldot:nth-child(-n+6){display:block}}@media (min-width:1200px){.visual-step-list__smalldot{display:block}}.visual-step-list__image{aspect-ratio:400/340;margin-top:var(--visual-step-list__image-top-margin);width:var(--visual-step-list__image-width)}.visual-step-list__label{background:var(--blue-500);color:#fff;font-size:var(--sm-font-size);font-weight:700;margin-left:16px;padding:8px 12px;position:relative;white-space:nowrap}.visual-step-list__label:before{border-bottom:10px solid transparent;border-right:10px solid var(--blue-500);border-top:10px solid transparent;content:"";left:-9px;margin-top:-10px;position:absolute;top:50%}.visual-step-list__step--with-image .visual-step-list__label:before{border-bottom:10px solid var(--blue-500);border-left:10px solid transparent;border-right:10px solid transparent;left:50%;margin-left:-10px;top:-9px}@media (min-width:1080px){.visual-step-list__label{margin-left:0;margin-top:16px}.visual-step-list__label:before{border-bottom:10px solid var(--blue-500);border-left:10px solid transparent;border-right:10px solid transparent;left:50%;margin-left:-10px;top:-9px}}.visual-step-list__bigdot{margin-left:-76px}.visual-step-list__smalldot{margin-left:-80px}@media (min-width:600px){.visual-step-list__bigdot,.visual-step-list__smalldot{margin-left:0}}