/* 
 * ---------------------------------------------
 * Variables > Breakpoints
 * ---------------------------------------------
*/
:root {
  --wa-transition-default: 300ms;
  --wa-transition-medium: 500ms;
  --wa-transition-long: 1000ms;
  --wa-box-shadow-primary: 0px 20px 30px;
  --wa-number-grow-color: rgb(73, 217, 122);
}

.wa-hero--service {
  flex-direction: row;
  align-items: center;
}
@media (max-width: 767px) {
  .wa-hero--service {
    flex-direction: column;
    align-items: flex-start;
  }
}
.wa-hero--service .wa-hero-content {
  gap: var(--space-s);
  align-items: center;
}
.wa-hero--service .wa-mockup-video {
  display: flex;
  align-items: center;
  min-height: 55rem;
}
@media (max-width: 1629px) {
  .wa-hero--service .wa-mockup-video {
    min-height: 45rem;
  }
}
.wa-hero__name {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: calc(var(--text-xxl) * 2);
  pointer-events: none;
  user-select: none;
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--primary);
  text-shadow: -1px -1px 0 var(--secondary-trans-20), 1px -1px 0 var(--secondary-trans-20), -1px 1px 0 var(--secondary-trans-20), 1px 1px 0 var(--secondary-trans-20);
  padding-left: var(--space-l);
}
@media (max-width: 767px) {
  .wa-hero__name {
    padding-left: 0 !important;
    writing-mode: horizontal-tb !important;
    transform: none !important;
    text-shadow: none;
    color: var(--white);
    margin-bottom: var(--space-s);
    font-size: calc(var(--text-xxl) * 1.6);
  }
}
.wa-hero-content__row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--space-xs);
  margin-top: var(--space-s);
}

body .wa-service-usp {
  flex-direction: row !important;
  justify-content: space-between;
}
body .wa-service-usp-content {
  column-gap: var(--space-l);
  row-gap: var(--space-l);
}
body .wa-service-usp-content .wa-infobox__heading {
  text-transform: none;
  font-size: var(--text-l);
}
body .wa-service-usp-content .wa-infobox__heading:after {
  display: none !important;
}
body .wa-service-usp-content .wa-infobox:hover {
  border: 1px solid var(--secondary-dark);
}
body .wa-service-usp-content .wa-infobox:hover::before, body .wa-service-usp-content .wa-infobox:hover::after {
  opacity: 0 !important;
}

body .wa-workflow-tab {
  flex-direction: row;
  gap: var(--space-l);
  margin-top: var(--space-s);
}
body .wa-workflow-tab .x-tabs_content {
  overflow: visible !important;
}
body .wa-workflow-tab .wa-tabs .x-tabs_list {
  margin-bottom: -0.4rem;
}
body .wa-workflow-tab .wa-tabs .x-tabs_list .x-tabs_tab {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-weight: 700;
  color: var(--white);
  padding: var(--space-s) var(--space-m);
}
body .wa-workflow-tab .wa-tabs .x-tabs_list .x-tabs_tab svg {
  margin-right: 1rem;
}
body .wa-workflow-tab .wa-tabs .x-tabs_tab-selected {
  background-color: var(--secondary-ultra-dark) !important;
  border-radius: var(--radius-s) var(--radius-s) 0px 0px;
}
body .wa-workflow-tab .wa-tabs .x-tabs_panel-current {
  background-color: var(--secondary-ultra-dark);
  padding: var(--space-m);
  border-radius: var(--radius-s);
}
body .wa-workflow-tab .wa-primary-tabs-list {
  flex-direction: column !important;
  gap: var(--space-xs) !important;
  width: 100% !important;
}
body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_slider {
  border-radius: var(--radius-xs);
}
body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_tab {
  border-radius: var(--radius-xs);
  border: 1px solid var(--secondary-dark);
  font-weight: 400;
  color: var(--white);
  position: relative;
}
body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_tab.x-tabs_tab-selected {
  background-color: var(--secondary-dark) !important;
  font-weight: 700 !important;
}
body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_tab:before, body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_tab::after {
  content: "";
  position: absolute;
  opacity: 0;
  width: 0rem;
  height: 0rem;
  background-color: transparent;
  transition: var(--wa-transition-default) all ease-in-out;
  z-index: 2;
}
body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_tab:before {
  top: -2px;
  left: -2px;
  clip-path: polygon(0 0, 100% 0, 0% 100%);
  border-top: 5px solid var(--action);
  border-left: 5px solid var(--action);
  border-top-left-radius: var(--radius-s);
}
body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_tab:after {
  bottom: -2px;
  right: -2px;
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
  border-bottom: 5px solid var(--action);
  border-right: 5px solid var(--action);
  border-bottom-right-radius: var(--radius-s);
}
body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_tab:hover::before, body .wa-workflow-tab .wa-primary-tabs-list .x-tabs_tab:hover::after {
  opacity: 1;
  width: 3rem;
  height: 5rem;
}
body .wa-workflow-tab .x-tabs_content-accordion {
  gap: var(--space-xs);
}
body .wa-workflow-tab .x-tabs_content-accordion .x-tabs_content-item .x-tabs_toggle {
  border-radius: var(--radius-xs);
  background-color: var(--primary);
  border: 1px solid var(--secondary-dark);
  color: var(--white);
  font-weight: 400;
  padding-block: var(--space-xs);
}
body .wa-workflow-tab .x-tabs_content-accordion .x-tabs_content-item .x-tabs_toggle[aria-expanded=true] {
  background-color: var(--secondary-dark) !important;
  font-weight: 700;
  color: var(--white);
  border-radius: var(--radius-xs) var(--radius-xs) 0px 0px;
}
body .wa-workflow-tab .wa-accordion-heading {
  display: flex;
  flex-direction: row;
  align-items: center;
}
body .wa-workflow-tab .wa-accordion-heading svg {
  height: 1.8rem;
  width: auto;
  margin-right: 1rem;
}
body .wa-workflow-tab .x-tabs_toggle[aria-expanded=true] {
  z-index: 2;
}
body .wa-workflow .wa-steps-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1rem;
}
body .wa-workflow .wa-step {
  width: 30%;
  display: flex;
  flex-direction: row;
  background: var(--secondary-ultra-dark);
  border-radius: var(--radius-s);
  padding: var(--space-s) var(--space-xs);
  color: var(--white);
  font-weight: 700;
  font-size: calc(var(--text-m) * 0.9);
}
body .wa-workflow .wa-step__heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
body .wa-workflow .wa-step__heading svg {
  margin-bottom: 1rem;
}
body .wa-workflow .wa-step-arrow {
  width: 5%;
}
body .wa-workflow .wa-notice-box {
  padding: var(--space-m);
  border: 1px solid var(--secondary-dark);
  border-radius: var(--radius-s);
  position: relative;
}
body .wa-workflow .wa-notice-box .brxe-xlottie {
  width: 6rem !important;
  position: absolute;
  top: -3rem;
  left: var(--space-s);
  background: var(--primary);
  padding: 1rem;
}
body .wa-workflow .wa-tabs-infobox {
  display: flex;
  flex-direction: row;
  align-items: center;
  background: var(--secondary-ultra-dark);
  border-radius: var(--radius-s);
  padding: var(--space-s);
  color: var(--white);
  font-weight: 700;
}
body .wa-workflow .wa-tabs-infobox svg {
  margin-right: 1rem;
  height: 2.6rem;
  width: auto;
}
body .wa-workflow .wa-lottie {
  width: 9rem;
  min-height: 7rem;
}
body .wa-workflow .wa-before-after {
  border-radius: var(--radius-s);
  overflow: hidden;
}
body .wa-workflow__icon {
  width: 7rem;
  height: 7rem;
}
body .wa-workflow__desc strong {
  color: var(--white);
}

.wa-form-bottom {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.wa-form-bottom-heading {
  display: flex;
  flex-direction: column;
  gap: var(--space-s);
  justify-content: center;
  align-items: center;
  text-align: center;
}
.wa-form-bottom-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-l);
  width: 75%;
  justify-content: center;
  align-items: center;
}
@media (min-width: 992px) {
  .wa-form-bottom-content .wa-contact-person {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--space-s);
    margin-top: -2rem;
  }
  .wa-form-bottom-content .wa-contact-person__photo {
    max-width: 22rem;
  }
  .wa-form-bottom-content .wa-contact-person__photo:after {
    width: 100%;
    height: 22rem;
  }
  .wa-form-bottom-content .wa-contact-person-content-area {
    align-items: center;
    justify-content: center;
  }
}
.wa-form-bottom .wa-contact-person__position {
  text-align: center;
}

.page-id-182 .wa-mockup-video {
  width: 112%;
  max-width: 112%;
  margin-top: -6%;
  margin-bottom: -6%;
}
@media (max-width: 1629px) {
  .page-id-182 .wa-mockup-video {
    width: 138%;
    max-width: 140%;
    margin-left: -16%;
    margin-bottom: -9%;
  }
}

.page-id-184 .wa-mockup-video {
  width: 70%;
  max-width: 70%;
  margin-left: 30%;
  margin-top: -25%;
  margin-bottom: -20%;
}
@media (max-width: 1629px) {
  .page-id-184 .wa-mockup-video {
    width: 80%;
    max-width: 80%;
    margin-left: 20%;
    margin-top: -20%;
    margin-bottom: -15%;
  }
}

.page-id-186 .wa-mockup-video {
  width: 100%;
  max-width: 100%;
  margin-right: -22%;
  margin-top: -10%;
  margin-bottom: -10%;
}
@media (max-width: 1629px) {
  .page-id-186 .wa-mockup-video {
    width: 155%;
    max-width: 155%;
    margin-right: 0%;
    margin-top: -15%;
    margin-left: -27%;
    margin-bottom: -15%;
  }
}

@media (max-width: 479px) {
  .wa-workflow .wa-lottie {
    min-height: 6rem !important;
    width: 6rem !important;
  }
}
@media (max-width: 767px) {
  .wa-hero--service .wa-hero-content__right {
    display: none;
  }
  .wa-form-bottom-content {
    width: 100%;
  }
  .wa-workflow .wa-steps-wrapper {
    flex-direction: column !important;
  }
  .wa-workflow .wa-step {
    width: 100% !important;
  }
  .wa-workflow .brxe-xproslider .wa-step {
    width: 70% !important;
  }
  .wa-workflow .wa-step-arrow {
    width: 10% !important;
    transform: rotate(90deg);
    min-height: 5rem;
    justify-content: center;
    justify-items: center;
    display: flex;
  }
  .wa-workflow .brxe-xproslider .wa-step-arrow {
    transform: rotate(0deg);
    min-height: 9.8rem;
  }
}
@media (min-width: 992px) {
  .wa-workflow-tab .x-tabs_panel-content {
    padding: 0px !important;
  }
  .wa-tabs-infobox {
    flex-direction: column !important;
    text-align: center;
  }
  .wa-tabs-infobox svg {
    margin-right: 0px !important;
    margin-bottom: 1rem;
  }
}
@media (max-width: 991px) {
  .x-tabs_panel-content {
    border: 1px solid var(--secondary-dark);
    border-radius: var(--radius-s);
    margin-top: -5px;
  }
  .wa-form-bottom .wa-contact-person__position {
    text-align: left;
  }
}
@media (max-width: 1629px) {
  .wa-workflow .wa-lottie {
    width: 7rem !important;
  }
}
