.animated-underline {
  text-decoration: none !important;
  display: inline-block;
  position: relative;
  overflow: hidden;
}

.animated-underline:after {
  content: '';
  position: absolute;
  bottom: 8px;
  left: 0;
  width: 100%;
  height: 0.05em;
  background-color: currentColor;
  transition: opacity 300ms, transform 300ms;
  opacity: 0;
  transform: translate3d(-100%, 0, 0);
}

.animated-underline:hover::after,
.animated-underline:focus::after {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.menu-button.active>.menu-button-hamburger>span:first-child {
  transform: rotate(-45deg) translateX(-1.5px) translateY(2.5px);
}

.menu-button.active>.menu-button-hamburger>span:last-child {
  transform: rotate(45deg) translateX(-1px) translateY(-2px)
}

.splide__pagination__page {
  background: none !important;
  border: 1px solid #fff !important;
  border-radius: 50% !important;
  transform: scale(1.4) !important;
  opacity: 1 !important;
}

.splide__pagination__page.is-active {
  border-color: rgb(var(--xelon-amber-color)) !important;
  background: rgb(var(--xelon-amber-color)) !important;
}

.font-clother {
  letter-spacing: -0.03em;
}

p {
  line-height: 1.1;
}

.splide__pagination li {
  padding-left: 1px !important;
  padding-right: 1px !important;
}

.mobile-quote-slider .splide__pagination {
  bottom: 1.5em !important;
}

.mobile-quote-slider .splide__pagination__page.is-active {
  border-color: var(--tertiary-color, #fff) !important;
  background: var(--tertiary-color, #fff) !important;
}

.accordion-icon {
  position: relative;
  display: block;
  width: 30px;
  height: 30px;
  cursor: pointer;
}

@media (max-width: 767px) {
  .accordion-icon {
    width: 17px;
    height: 17px;
  }
}

.accordion-icon:before,
.accordion-icon:after {
  content: "";
  position: absolute;
  background-color: currentColor;
  transition: all 0.5s ease-out;
}

.accordion-icon:before {
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  margin-left: -1px;
}

.accordion-icon:after {
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;
  margin-top: -1px;
}

.accordion-icon.active:before,
.accordion-icon.active:after {
  background-color: var(--primary-color, currentColor);
}

.accordion-icon.active:before {
  transform: rotate(90deg);
}

.accordion-icon.active:after {
  transform: rotate(180deg);
}

.hero-particle-grid {
  pointer-events: none;
  position: absolute;
  width: 110%;
  height: 110%;
  top: -5%;
  left: -5%;
  display: grid;
  grid-template-columns: repeat(50, 2%);
  grid-template-rows: repeat(50, 2%);
}

.hero-particle-grid .hero-particle {
  will-change: transform;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.hero-particle-grid .hero-particle img {
  /*
  width: 300px;
  height: 300px;
  object-fit: contain;
  */
  max-height: 300px !important;
}

.hero-particle.position-1 {
  grid-area: 16 / 1 / 31 / 8;
}

.hero-particle.position-2 {
  grid-area: 1 / 30 / 13 / 35;
}

.hero-particle.position-3 {
  grid-area: 10 / 45 / 22 / 50;
}

.hero-particle.position-4 {
  grid-area: 4 / 12 / 13 / 16;
}

.hero-particle.position-5 {
  grid-area: 20 / 40 / 25 / 42;
}

.hero-particle.position-6 {
  grid-area: 23 / 14 / 32 / 17;
}

.hero-particle.position-7 {
  grid-area: 40 / 1 / 52 / 6;
}

.hero-particle.position-8 {
  grid-area: 38 / 12 / 50 / 17;
}

.hero-particle.position-9 {
  grid-area: 40 / 33 / 52 / 38;
}

.hero-particle.position-10 {
  grid-area: 32 / 45 / 44 / 50;
}

@media (max-width: 600px) {

  .hero-particle.position-7,
  .hero-particle.position-8,
  .hero-particle.position-9,
  .hero-particle.position-10 {
    display: none !important;
  }

  .hero-particle-grid .hero-particle {
    width: 150px;
    height: 150px;
  }

  .hero-particle.position-1 {
    grid-area: 16 / 1 / 31 / 12;
  }

  .hero-particle.position-2 {
    grid-area: 11 / 30 / 24 / 42;
  }

  .hero-particle.position-3 {
    grid-area: 23 / 38 / 22 / 50;
  }

  .hero-particle.position-4 {
    grid-area: 3 / 17 / 12 / 27;
  }

  .hero-particle.position-5 {
    grid-area: 36 / 6 / 50 / 17;
  }

  .hero-particle.position-6 {
    grid-area: 40 / 32 / 52 / 42;
  }
}

@media (min-width: 1024px) {
  .step-slide {
    width: 30%;
  }

  .step-slide.active {
    width: 40%;
  }
}

.newsletter-modal,
.signup-modal {
  transform: scale(0.8) translateX(-20px) translateY(10px);
  transform-origin: top right;
}

@media (max-width: 767px) {

  .newsletter-modal,
  .signup-modal {
    transform: scale(0.8) translateX(20px) translateY(-10px);
    transform-origin: top left;
  }
}

.newsletter-modal.active,
.signup-modal.active {
  transform: scale(1) translateX(0px) translateY(0px);
}

@media (max-width: 500px) {

  .newsletter-modal.active,
  .signup-modal.active {
    pointer-events: auto !important;
  }
}

.label-left .field-wrap {
  flex-wrap: nowrap !important;
}

.nf-before-form-content,
.submit-wrap .nf-field-label,
.ninja-forms-req-symbol,
.nf-after-field,
.nf-error.field-wrap .nf-field-element:after,
.nf-pass.field-wrap .nf-field-element:after {
  display: none !important;
}

.nf-field-container {
  margin-bottom: 20px !important;
}

@media (max-width: 767px) {
  .nf-field-container {
    margin-bottom: 10px !important;
  }
}

.nf-form-content {
  padding: 0 !important;
  margin: 0 !important;
}

@media only screen and (max-width: 800px) {
  body .nf-field-container .nf-field-label {
    margin-bottom: 0 !important;
  }
}

.label-left .nf-field-label {
  text-align: left !important;
  align-items: end !important;
  width: 130px !important;
  padding-bottom: 8px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

@media (max-width: 767px) {
  .label-left .nf-field-label {
    width: 85px !important;
    padding-bottom: 3px !important;
  }
}

.label-left .nf-field-element {
  width: 100% !important;
}

.label-left .nf-field-label label {
  font-family: var(--secondary-font) !important;
  color: var(--body-light-color, #000) !important;
  text-transform: uppercase !important;
  font-size: 18px !important;
  letter-spacing: 2px !important;
  font-weight: normal !important;
}

@media (max-width: 767px) {
  .label-left .nf-field-label label {
    font-size: 10px !important;
  }
}

@media (max-width: 767px) {
  .nf-error-msg {
    font-size: 10px !important;
  }
}

.nf-field {
  border-bottom: 1px solid var(--body-light-color, #000) !important;
}

.ninja-forms-field {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  font-family: var(--secondary-font) !important;
  color: var(--body-light-color, #000) !important;
  text-transform: uppercase !important;
  font-size: 30px !important;
  font-weight: 600 !important;
  height: auto !important;
  line-height: 0 !important;
}

@media (max-width: 767px) {
  .ninja-forms-field {
    font-size: 22px !important;
  }
}

.submit-container .nf-field,
.html-container .nf-field {
  border: 0 !important;
  margin-top: 30px !important;
}

@media (max-width: 767px) {

  .submit-container .nf-field,
  .html-container .nf-field {
    margin-top: 20px !important;
  }
}

.submit-container .nf-field-element {
  width: 100% !important;
}

.nf-response-msg {
  color: var(--body-light-color, #000) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  margin-top: 10px;
}

@media (max-width: 767px) {
  .nf-response-msg {
    font-size: 14px !important;
  }
}

.nf-response-msg>p {
  margin-bottom: 15px !important;
}

.ninja-forms-field[type="submit"],
.form-button-alt a {
  display: block !important;
  text-align: center !important;
  font-size: 14px !important;
  font-weight: normal !important;
  letter-spacing: 1.5px !important;
  color: var(--secondary-color, #fff) !important;
  background: var(--tertiary-color, #000) !important;
  line-height: 1 !important;
  width: 100% !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  border-radius: 500px !important;
  cursor: pointer !important;
  text-transform: uppercase !important;
  transition: all 0.3s ease-in-out !important;
  font-family: var(--secondary-font) !important;
}

.form-button-alt a {
  background: transparent !important;
  color: var(--tertiary-color, #000) !important;
  border: 1px solid var(--tertiary-color, #000) !important;
}

@media (max-width: 767px) {

  .ninja-forms-field[type="submit"],
  .form-button-alt a {
    font-size: 10px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}

.ninja-forms-field[type="submit"]:hover,
.form-button-alt a:hover {
  background: var(--body-light-color, #000) !important;
}

body.theme-xelon .ninja-forms-field[type="submit"]:hover,
body.theme-xelon .form-button-alt a:hover {
  background: #000000 !important;
}

.form-button-alt a:hover {
  color: var(--secondary-color, #fff) !important;
}

nf-fields-wrap {
  display: flex !important;
  flex-wrap: wrap !important;
}

nf-field {
  display: block !important;
  width: 100% !important;
}

nf-field:has(> .html-container) {
  padding-right: 13px;
}

nf-field:has(> .submit-container) {
  padding-left: 13px;
}

@media (max-width: 767px) {
  nf-field:has(> .html-container) {
    padding-right: 7px;
  }

  nf-field:has(> .submit-container) {
    padding-left: 7px;
  }
}

nf-field:has(> .html-container),
nf-field:has(> .submit-container) {
  width: 50% !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  transition: all 0s 50000s;
}

body .top-0\.5 {
  top: 0!important;
}
