@charset "utf-8";

.reg-v4 { --reg-v4-avatar-box-size: calc(
                    var(--reg-v4-avatar-size)
                    + var(--reg-v4-avatar-gap) * 2
                    + var(--reg-v4-avatar-border-width) * 2
                  ); --reg-v4-line-width: 1px; --reg-v4-dot-center-left: calc(
                    var(--reg-v4-line-left)
                    - var(--reg-v4-content-padding-left)
                    + var(--reg-v4-line-width) / 2
                  ); }

.reg-v4, .reg-v4 * { box-sizing: border-box !important; font-family: var(--reg-v4-font-family); }

.reg-v4 b { font-weight: var(--reg-v4-step-bold) !important; }

.reg-v4 .reg-v4__content { padding-top: var(--reg-v4-content-padding-top); padding-bottom: var(--reg-v4-content-padding-bottom); padding-left: var(--reg-v4-content-padding-left); color: var(--reg-v4-text-color); position: relative !important; max-width: 645px !important; margin: 0px auto !important; }

.reg-v4 .reg-v4__content::before { top: var(--reg-v4-line-top); left: var(--reg-v4-line-left); width: var(--reg-v4-line-width); height: var(--reg-v4-line-height); background-color: var(--reg-v4-accent); content: "" !important; position: absolute !important; }

.reg-v4 .reg-v4__user { position: static !important; display: block !important; z-index: 2 !important; margin: 0px !important; }

.reg-v4 .reg-v4__avatar { width: var(--reg-v4-avatar-box-size); height: var(--reg-v4-avatar-box-size); border: var(--reg-v4-avatar-border); border-radius: var(--reg-v4-avatar-radius); position: absolute !important; top: 0px !important; left: 0px !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; z-index: 2 !important; }

.reg-v4 .reg-v4__avatar > img { width: var(--reg-v4-avatar-size); height: var(--reg-v4-avatar-size); display: block !important; border-radius: inherit !important; object-fit: cover !important; }

.reg-v4 .reg-v4__name { font-size: var(--reg-v4-name-font-size); font-weight: var(--reg-v4-name-font-weight); line-height: var(--reg-v4-name-line-height); color: var(--reg-v4-name-color); display: inline-block !important; margin: 0px !important; text-decoration: none !important; }

.reg-v4 .reg-v4__title { margin: var(--reg-v4-title-margin); padding: var(--reg-v4-title-padding); background-color: var(--reg-v4-title-bg); color: var(--reg-v4-title-color); font-size: var(--reg-v4-title-font-size); font-weight: var(--reg-v4-title-font-weight); line-height: var(--reg-v4-title-line-height); letter-spacing: var(--reg-v4-title-letter-spacing); text-transform: var(--reg-v4-title-text-transform); border-radius: var(--reg-v4-title-radius); width: fit-content !important; hyphens: auto !important; }

.reg-v4 .reg-v4__content > ul, .reg-v4 .reg-v4__content > ol { margin: 0px auto 25px !important; padding: 0px !important; font: inherit !important; text-align: left !important; list-style: none !important; }

.reg-v4 .reg-v4__content > ul li, .reg-v4 .reg-v4__content > ol li { margin: var(--reg-v4-step-margin); font-size: var(--reg-v4-step-font-size); line-height: var(--reg-v4-step-line-height); position: relative !important; padding: 0px !important; }

.reg-v4 .reg-v4__content > ul li:last-child, .reg-v4 .reg-v4__content > ol li:last-child { margin-top: var(--reg-v4-last-step-margin-top); }

.reg-v4 .reg-v4__content > ul li::before, .reg-v4 .reg-v4__content > ol li::before { top: var(--reg-v4-dot-top); left: var(--reg-v4-dot-center-left); width: var(--reg-v4-dot-size); height: var(--reg-v4-dot-size); background-color: var(--reg-v4-accent); border-radius: var(--reg-v4-dot-radius); content: "" !important; position: absolute !important; transform: translate(-50%, -50%) !important; }

.reg-v4 .reg-v4__link, .reg-v4 .reg-v4__list a { color: var(--reg-v4-link); text-decoration: underline !important; }

.reg-v4 .reg-v4__link:hover, .reg-v4 .reg-v4__list a:hover { color: var(--reg-v4-link-hover); }

.reg-v4 .reg-v4__list a { font-weight: var(--reg-v4-link-bold) !important; }

.reg-v4 .reg-v4__text { margin: var(--reg-v4-note-margin); font-size: var(--reg-v4-note-font-size); color: var(--reg-v4-note-color); }

.reg-v4 .button-link { width: var(--reg-v4-button-width); margin: var(--reg-v4-button-margin); padding: var(--reg-v4-button-padding); font-weight: var(--reg-v4-button-font-weight); font-size: var(--reg-v4-button-font-size); text-transform: var(--reg-v4-button-text-transform); color: var(--reg-v4-button-text-color); background-color: var(--reg-v4-button-bg); border-radius: var(--reg-v4-button-radius); box-shadow: var(--reg-v4-button-shadow); display: inline-block !important; max-width: none !important; line-height: 100% !important; text-align: center !important; text-decoration: none !important; }

.reg-v4 .button-link:hover { color: var(--reg-v4-button-text-color); background-color: var(--reg-v4-button-hover-bg); text-decoration: none !important; }

@media (max-width: 767px) {
  .reg-v4 { --reg-v4-content-padding-left: var(--reg-v4-content-mobile-padding-left); --reg-v4-line-left: var(--reg-v4-line-mobile-left); --reg-v4-avatar-size: var(--reg-v4-avatar-mobile-size); --reg-v4-avatar-margin-bottom: var(--reg-v4-avatar-mobile-margin-bottom); }
  .reg-v4 .reg-v4__content { padding-bottom: var(--reg-v4-content-mobile-padding-bottom); }
  .reg-v4 .reg-v4__content::before { height: var(--reg-v4-line-mobile-height); }
}

@media (max-width: 575px) {
  .reg-v4 .button-link { width: var(--reg-v4-button-mobile-width); margin-left: var(--reg-v4-button-mobile-margin-left); }
}

html[dir="rtl"] .reg-v4 .reg-v4__content { padding-left: 0px; padding-right: var(--reg-v4-content-padding-left); }

html[dir="rtl"] .reg-v4 .reg-v4__content::before { left: auto !important; right: var(--reg-v4-line-left) !important; }

html[dir="rtl"] .reg-v4 .reg-v4__avatar { left: auto !important; right: 0px !important; }

html[dir="rtl"] .reg-v4 .reg-v4__content > ul, html[dir="rtl"] .reg-v4 .reg-v4__content > ol { text-align: right !important; }

html[dir="rtl"] .reg-v4 .reg-v4__content > ul li::before, html[dir="rtl"] .reg-v4 .reg-v4__content > ol li::before { left: auto !important; right: calc(
                    var(--reg-v4-line-left)
                    - var(--reg-v4-content-padding-left)
                    + var(--reg-v4-line-width) / 2
                  ) !important; transform: translate(50%, -50%) !important; }

@media (max-width: 575px) {
  html[dir="rtl"] .reg-v4 .button-link { margin-left: auto; margin-right: var(--reg-v4-button-mobile-margin-left); }
}