:root {
  --card-shadow-secondary: 0px 40px 48px -20px rgba(0, 0, 0, 0.02), 0px 32px 32px -20px rgba(0, 0, 0, 0.03), 0px 16px 24px -12px rgba(0, 0, 0, 0.03), 0px 0px 0px 1px rgba(0, 0, 0, 0.03);

}

.ask_input-card {
  transition: background var(--animation-default-half);

}

.ask_input-card .ask_input-text-wrap {
  opacity: 0;

}

.wf-design-mode .ask_input-text-wrap {
  opacity: 1;

}

.ask_input-card.is-active .ask_input-text-wrap {
  opacity: 1;

}

.wf-design-mode .ask_answer {
  grid-template-rows: 1fr;

}

.ask_answer {
  grid-template-rows: 0fr;
  transition: all 0.25s ease-out;
}

.ask_answer.is-active {
  grid-template-rows: 1fr;
  transition: all 0.7 ease-out;
}

.ask-answer.is-active {
  grid-template-rows: 1fr !important;
}

.ask_input-card .text-input_text {
  opacity: 0;

}

.ask_input-card.is-active .text-input_text {
  opacity: 1;

}

.glider {
  transition: all var(--animation-default-half);

}

input[type="radio"] {
  display: none;
}

input[type="radio"]:checked+label {
  color: var(--primary-color);
}

input[id="question-1"]:checked~.glider {
  transform: translateX(0);
}

input[id="question-2"]:checked~.glider {
  transform: translateX(100%);
}

input[id="quesiton-3"]:checked~.glider {
  transform: translateX(200%);
}

input[type="radio"]:checked+.question-select {
  color: var(--swatch--light);
}

.ask_answer_wrap {
  box-shadow: 0px 0px 44px 0px rgba(0, 0, 0, 0.02), 0px 88px 56px -20px rgba(0, 0, 0, 0.03), 0px 56px 56px -20px rgba(0, 0, 0, 0.02), 0px 32px 32px -20px rgba(0, 0, 0, 0.03), 0px 16px 24px -12px rgba(0, 0, 0, 0.03), 0px 0px 0px 1px rgba(0, 0, 0, 0.05), 0px 0px 0px 10px #F9F9F9;

}

[data-pill='yellow'] {
  background-color: #eab308;
  color: white;

}

[data-pill='yellow'] {
  background-color: #eab308;
  color: white;

}

[data-pill='green'] {
  background-color: #16a34a;
  color: white;

}

[data-pill='neutral'] {
  background-color: #e5e5e5;
  color: white;

}

:not(.wf-design-mode) .is-deactivated {
  --swatch--brand: var(--swatch--deactivated);
  --_theme---text: var(--swatch--deactivated) !important;
  --_theme---button-primary--background: var(--swatch--deactivated);
  --swatch--brand-text: var(--swatch--deactivated);
  color: var(--swatch--deactivated);
  --_pills---color: var(--swatch--deactivated) !important;

  transition: color var(--animation-default), background-color var(--animation-default);
}

.is-deactivated .pill {
  --_pills---color: var(--swatch--deactivated) !important;
  color: white !important;
  transition: color var(--animation-default), background-color var(--animation-default), border-color;
}

.is-deactivated [data-wf--pill--variant="neutral"] .pill-text {

  color: white !important;
  transition: color var(--animation-default), background-color var(--animation-default);

}

.anim_layout .anim-panel * {

  transition: color var(--animation-default), background-color var(--animation-default);

}

.gradient-border {
  --borderWidth: 3px;
  background: #1D1F20;

}

.gradient-border:after {
  content: '';
  position: absolute;
  top: calc(-1 * var(--borderWidth));
  left: calc(-1 * var(--borderWidth));
  height: calc(100% + var(--borderWidth) * 2);
  width: calc(100% + var(--borderWidth) * 2);
  background: linear-gradient(60deg, #005cff, #d5d5d5);

  z-index: -1;
  animation: animatedgradient 3s ease alternate infinite;
  background-size: 300% 300%;
}

@keyframes animatedgradient {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

.g_button_wrap:hover .g_button_icon-wrap,
.g_button_wrap:hover .g_button_c-wrap {
  background-color: var(--_theme---button-primary--background-hover) !important;
  border-color: var(--_theme---button-primary--background-hover) !important;
}

.g_button_icon {
  transition: transform var(--duration-default-half);

}

.g_button_icon.is-left {
  transform: translateX(-2rem);
  transition: transform var(--duration-default-half);
}

.g_button_wrap:hover .g_button_icon {
  transform: translateX(2rem);
}

.g_button_wrap:hover .g_button_icon.is-left {
  transform: translateX(0rem);
}

.btn-text:hover .g_button_icon {
  transform: translateX(2rem);
}

.btn-text:hover .g_button_icon.is-left {
  transform: translateX(0rem);
}

.search-tag:hover .g_button_icon {
  transform: translateX(2rem);
}

.search-tag:hover .g_button_icon.is-left {
  transform: translateX(0rem);
}

@media only screen and (max-width: 479px) {
  .pill {
    transform: scale(0.75);
  }

}

.resources-card:hover .g_button_icon {
  transform: translateX(2rem);
}

.resources-card:hover .g_button_icon.is-left {
  transform: translateX(0rem);
}

.card-value,
.resources-card,
.contact_form {
  transition: box-shadow var(--animation-default-half);

}

.card-value:hover,
.resources-card:hover,
.contact_form:has(:focus) {
  box-shadow: var(--card-shadow-secondary);
}

.shadow-secondary {
  box-shadow: var(--card-shadow-secondary);

}

.shadow-blue {
  box-shadow: 0 1px 2px 0 rgba(255, 255, 255, 0.25) inset, 0 1.5px 3px 0 rgba(19, 95, 255, 0.25), 0 4px 4px 0 rgba(19, 95, 255, 0.12), 0 12px 6px 0 rgba(19, 95, 255, 0.08), 0 16px 8px 0 rgba(19, 95, 255, 0.02);

}

.value_tags_contain::before {
  content: '';
  position: absolute;
  width: 1px;
  height: 2rem;
  left: 50%;
  top: -2rem;
  background: var(--_theme---border);
}

.value_tags_contain::after {
  content: '';
  position: absolute;
  width: 6px;
  height: 6px;
  left: calc(50% - 3px);
  top: -2rem;
  background: var(--_theme---border);
}

.mask-horizontal-narrow {
  -webkit-mask: linear-gradient(to right, var(--_theme---background) 0%, transparent 20%, transparent 80%, var(--_theme---background) 100%);
  mask: linear-gradient(to right, var(--_theme---background) 0%, transparent 20%, transparent 80%, var(--_theme---background) 100%);
}

.nav_links_icon,
.nav_links_link {
  transition: background-color 0.2 ease, color 0.2 ease
}

.nav_links_link.w--current .nav_links_icon,
.nav_links_link.w--current .nav_links_text-wrap {
  background-color: var(--swatch--brand);
  color: var(--swatch--light);

}

.nav_links_link:hover .nav_links_icon,
.nav_links_link:hover .nav_links_text-wrap {
  background-color: var(--swatch--brand);
  color: var(--swatch--light);

}

.icon-wrap {
  box-shadow: 0 1px 2px 0 rgba(255, 255, 255, 0.25) inset, 0 1.5px 3px 0 rgba(19, 95, 255, 0.25), 0 4px 4px 0 rgba(19, 95, 255, 0.12), 0 12px 6px 0 rgba(19, 95, 255, 0.08), 0 16px 8px 0 rgba(19, 95, 255, 0.02);

}

.mask-vertical-reversed {
  -webkit-mask: linear-gradient(to bottom, transparent 0%, var(--_theme---background) 45%, var(--_theme---background) 55%, transparent 100%);
  mask: linear-gradient(to bottom, transparent 0%, var(--_theme---background) 45%, var(--_theme---background) 55%, transparent 100%);
}

.card-shadow {
  box-shadow: rgba(0, 0, 0, 0.03) 0px 24px 32px -12px, rgba(0, 0, 0, 0.03) 0px 16px 24px -8px, rgba(0, 0, 0, 0.03) 0px 8px 16px -4px, rgba(0, 0, 0, 0.03) 0px 0px 0px 1px;
}

.values-card {
  transition: all 0.3 ease;

}

.swiper-slide .values-card {
  opacity: 0.5;
  transform: scale(0.8);
}

.swiper-slide.is-active .values-card {
  background: var(--swatch--light);
  opacity: 1;
  transform: scale(1.2);
  box-shadow: var(--card-shadow-secondary);

}

#navQuery:focus {
  outline: none;
  border-color: var(--swatch--dark-2);

}