.skeleton__line {
  height: 12px;
  margin: 6px 0;
  color: transparent;
  overflow: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  /* supported by Chrome and Opera */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  background-image: linear-gradient(270deg, transparent, #d8d8d8 40px, transparent 80px), linear-gradient(#ececec 100%, transparent 0);
  background-size: 700px 100%;
  background-repeat: repeat-y;
  background-position: -700px 0 /* highlight */, 0 0;
  -webkit-animation: shine 2s infinite;
          animation: shine 2s infinite;
  border-radius: 2px;
}
.skeleton__line.thick {
  height: 19px;
  margin: 10px 0;
}
.skeleton__dial-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.skeleton__dial-wrapper .skeleton__dial {
  margin: 10px;
  width: 150px;
  height: 150px;
  border: 10px solid #ececec;
  background: transparent;
  border-radius: 150px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-preferred-size: auto;
      flex-basis: auto;
}
.skeleton__dial-wrapper .skeleton__dial--info {
  margin: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
}
.skeleton__layout-wrapper .skeleton__header,
.skeleton__layout-wrapper .skeleton__globalnav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.skeleton__layout-wrapper .skeleton__globalnav {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin-bottom: 30px;
}
.skeleton__layout-wrapper .skeleton__header {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 0 30px;
}
.skeleton__layout-wrapper .skeleton__user {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
}
.skeleton__layout-wrapper .skeleton__avatar {
  width: 35px;
  height: 35px;
  background: #ececec;
  color: transparent;
  overflow: hidden;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  /* supported by Chrome and Opera */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  background-image: linear-gradient(270deg, transparent, #d8d8d8 40px, transparent 80px), linear-gradient(#ececec 100%, transparent 0);
  background-size: 700px 100%;
  background-repeat: repeat-y;
  background-position: -700px 0 /* highlight */, 0 0;
  -webkit-animation: shine 2s infinite;
          animation: shine 2s infinite;
  border-radius: 2px;
  border-radius: 50px;
}
@-webkit-keyframes shine {
  to {
    background-position: 80px 0 /* move highlight to right */, 0 0;
  }
}
@keyframes shine {
  to {
    background-position: 80px 0 /* move highlight to right */, 0 0;
  }
}

.kal-spinner {
  position: relative;
  display: block;
  margin: auto;
  height: 28px;
  width: 28px;
  z-index: 10;
  -webkit-animation: spin 2.3s linear;
          animation: spin 2.3s linear;
  -webkit-animation-iteration-count: 10;
          animation-iteration-count: 10;
}
.kal-spinner--large {
  height: 56px;
  width: 56px;
}
.kal-spinner > .path {
  stroke: var(--spinner_spinner-geometry-color);
  stroke-linecap: round;
  -webkit-animation: dash 1.4s ease-in-out;
          animation: dash 1.4s ease-in-out;
  -webkit-animation-iteration-count: 16.5;
          animation-iteration-count: 16.5;
}
@media (prefers-reduced-motion) {
  .kal-spinner > .path {
    -webkit-animation: none;
            animation: none;
    stroke-dasharray: 90, 180;
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    border-width: 10px;
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
    border-width: 10px;
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
    border-width: 10px;
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
    border-width: 10px;
  }
}
@-webkit-keyframes dash {
  0% {
    stroke-dasharray: 1, 180;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 180;
    stroke-dashoffset: -34;
  }
  100% {
    stroke-dasharray: 90, 180;
    stroke-dashoffset: -124;
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 180;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 180;
    stroke-dashoffset: -34;
  }
  100% {
    stroke-dasharray: 90, 180;
    stroke-dashoffset: -124;
  }
}

/* lato-latin-ext-400-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/home/361f3dbb9db6a59803265646720a9ae7.woff2) format('woff2'), url(/home/3dc1eff492ab1f5985600a50d88bd933.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* lato-latin-400-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/home/be36596da218e1eec01c5c600b1c13ef.woff2) format('woff2'), url(/home/3dc1eff492ab1f5985600a50d88bd933.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/**
* This mixin creates two alternate styles that we switch between with the CSS var --kdsComponentsVersion. 
* The "correct way" to do this is with Container Queries
* (see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_size_and_style_queries#style_queries_for_custom_properties)
* but as this is not yet widely supported in browsers, we use a temporary approach based on selecting animation frames
* as suggested here: https://css-tricks.com/css-switch-case-conditions/
*
* Example usage:
*   .kal-some-component {
*     .kal-component-versions(
*        @v1rules: { border-radius: 8px; },
*        @v2rules: { border-radius: 32px; }
*      );
*   }
*/
/* applies standard rounded edge */
/* applies tinted drop shadow */
/**
* The following mixins are not part of the common design language and
* are only meant for applications and components with non-standard
* designs
*/
.kal-btn {
  position: relative;
  font-family: var(--font-family);
  font-weight: 700;
  --button-background-color: transparent;
  background-color: var(--button-background-color);
  --kal-current-bg-color: var(--button-background-color);
  border: none;
  outline: none;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 16px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  line-height: 30px;
  min-height: 48px;
  min-width: 48px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-column-gap: 12px;
     -moz-column-gap: 12px;
          column-gap: 12px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: var(--br-button);
}
.kal-btn:active {
  background-color: color(from var(--button-background-color) srgb r g b / calc(alpha * 0.6));
  --kal-current-bg-color: color(from var(--button-background-color) srgb r g b / calc(alpha * 0.6));
}
@media only screen and (min-width: 680px) {
  .kal-btn {
    padding: 8px 44px;
  }
}
@media only screen and (max-width: 679px) {
  .kal-btn {
    padding: 8px 36px;
  }
}
.kal-btn:focus {
  outline: 2px solid transparent;
}
.kal-btn:disabled:not(.kal-loading),
.kal-btn--disabled:not(.kal-loading),
.kal-btn[aria-disabled=true]:not(.kal-loading),
.kal-btn:disabled:hover:not(.kal-loading),
.kal-btn--disabled:hover:not(.kal-loading),
.kal-btn[aria-disabled=true]:hover:not(.kal-loading) {
  opacity: 0.2;
  cursor: not-allowed;
}
@media (prefers-reduced-motion: no-preference) {
  .kal-btn {
    -webkit-transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out, visibility 0.5s step-end;
    transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out, visibility 0.5s step-end;
  }
}
.kal-btn > .kal-loading-btn {
  visibility: visible;
  position: absolute;
  pointer-events: none;
  opacity: 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  -webkit-transition: width 0.5s ease-in-out, opacity 0.5s step-end;
  transition: width 0.5s ease-in-out, opacity 0.5s step-end;
}
.kal-btn > .kal-loading-btn.primary > svg > .path {
  stroke: var(--cta_cta-text-color-primary);
}
.kal-btn > .kal-loading-btn.secondary {
  width: calc(100% + 2px);
  margin: -1px;
}
.kal-btn > .kal-loading-btn.secondary > svg > .path {
  stroke: var(--cta_cta-text-color-secondary);
}
.kal-btn > .kal-loading-btn.negative > svg > .path {
  stroke: var(--cta_cta-text-color-destructive);
}
.kal-btn > .kal-loading-btn > svg,
.kal-btn > .kal-loading-btn > svg > .path {
  -webkit-animation-play-state: paused;
          animation-play-state: paused;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
@media (prefers-reduced-motion: no-preference) {
  .kal-btn {
    -webkit-transition: background-color 0.2s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: background-color 0.2s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: background-color 0.2s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: background-color 0.2s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  }
}
.kal-btn.kal-loading {
  visibility: hidden;
}
@media (prefers-reduced-motion: no-preference) {
  .kal-btn.kal-loading {
    -webkit-transition: background-color 0.2s ease-in-out, color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: background-color 0.2s ease-in-out, color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: background-color 0.2s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: background-color 0.2s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  }
}
.kal-btn.kal-loading > .kal-loading-btn {
  opacity: 1;
  width: 48px;
  margin: 0 auto;
}
@media (prefers-reduced-motion: no-preference) {
  .kal-btn.kal-loading > .kal-loading-btn {
    -webkit-transition: width 0.5s ease-in-out;
    transition: width 0.5s ease-in-out;
  }
}
.kal-btn.kal-loading > .kal-loading-btn > svg,
.kal-btn.kal-loading > .kal-loading-btn > svg > .path {
  -webkit-animation-play-state: running;
          animation-play-state: running;
}
.kal-btn.primary {
  --button-background-color: var(--cta_cta-bg-color-primary);
  color: var(--cta_cta-text-color-primary);
}
.kal-btn.primary:hover:not(:disabled):not(:focus) {
  -webkit-box-shadow: 0 0 0 5px var(--states_hover-color);
          box-shadow: 0 0 0 5px var(--states_hover-color);
}
.kal-btn.primary:focus {
  -webkit-box-shadow: 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(--cta_cta-focus-border-color-tertiary);
          box-shadow: 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(--cta_cta-focus-border-color-tertiary);
}
.kal-btn.primary:focus:hover {
  -webkit-box-shadow: 0 0 0 3px var(--states_hover-color), 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(var(--cta_cta-focus-border-color-tertiary));
          box-shadow: 0 0 0 3px var(--states_hover-color), 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(var(--cta_cta-focus-border-color-tertiary));
}
.kal-btn.secondary {
  --button-background-color: var(--cta_cta-bg-color-secondary);
  --kal-current-bg-color: var(--cta_cta-bg-color-secondary);
  color: var(--cta_cta-text-color-secondary);
  border: 1px solid var(--cta_cta-border-color-secondary);
}
.kal-btn.secondary:hover:not(:disabled):not(:focus) {
  -webkit-box-shadow: 0 0 0 5px var(--states_hover-color);
          box-shadow: 0 0 0 5px var(--states_hover-color);
}
.kal-btn.secondary:focus {
  -webkit-box-shadow: 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(--states_focus-border-color);
          box-shadow: 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(--states_focus-border-color);
}
.kal-btn.secondary:focus:hover {
  -webkit-box-shadow: 0 0 0 3px var(--states_hover-color), 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(var(--states_focus-border-color));
          box-shadow: 0 0 0 3px var(--states_hover-color), 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(var(--states_focus-border-color));
}
.kal-btn.secondary:focus {
  border-color: var(--states_focus-border-color);
}
.kal-btn.tertiary {
  color: var(--text_text-color-on-page-bg);
  font-weight: 400;
  border-radius: 4px;
  padding: 8px;
  padding: 0 8px 0 8px;
  min-height: 28px;
  -webkit-column-gap: 8px;
     -moz-column-gap: 8px;
          column-gap: 8px;
  text-decoration: underline;
}
.kal-btn.tertiary:hover:not(:disabled, [aria-disabled=true]) {
  --button-background-color: var(--states_hover-color);
}
.kal-btn.tertiary:disabled,
.kal-btn.tertiary:hover:disabled,
.kal-btn.tertiary[aria-disabled=true],
.kal-btn.tertiary:hover[aria-disabled=true] {
  cursor: default;
}
.kal-btn.tertiary:disabled,
.kal-btn.tertiary[aria-disabled=true] {
  color: var(--cta_cta-disabled-text-color);
}
.kal-btn.tertiary:focus-visible {
  -webkit-box-shadow: 0 0 0 2px var(--states_focus-border-color);
          box-shadow: 0 0 0 2px var(--states_focus-border-color);
}
.kal-btn.tertiary.has-icon-start {
  padding-left: 2px;
}
.kal-btn.tertiary.has-icon-end {
  padding-right: 2px;
}
.kal-btn.tertiary.low-profile {
  padding: 0 4px 3px;
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost) {
  --button-background-color: var(--cta_cta-bg-color-tertiary-roundel);
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):before,
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  -webkit-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):before {
  -webkit-box-shadow: 0px 1px 1px rgba(255, 255, 255, 0.35) inset, 0px -1px 1px rgba(0, 0, 0, 0.35) inset;
          box-shadow: 0px 1px 1px rgba(255, 255, 255, 0.35) inset, 0px -1px 1px rgba(0, 0, 0, 0.35) inset;
  mix-blend-mode: overlay;
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):after {
  inset: 16px;
  background: var(--cta_cta-bg-color-tertiary-roundel-hover);
  overflow: hidden;
  -webkit-filter: blur(10px);
          filter: blur(10px);
  opacity: 0;
  pointer-events: none;
  clip-path: inset(-16px round 24px);
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):not(:disabled, [aria-disabled=true]):focus,
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):not(:disabled, [aria-disabled=true]):hover {
  --button-background-color: var(--cta_cta-bg-color-tertiary-roundel);
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):not(:disabled, [aria-disabled=true]):focus-visible {
  border: 2px solid var(--cta_cta-border-color-tertiary-roundel-focus);
  -webkit-box-shadow: none;
          box-shadow: none;
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):focus:before,
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):hover:before,
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):active:before,
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):disabled:before {
  opacity: 0;
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):hover:after {
  opacity: 0.5;
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):hover > svg {
  scale: 1.12;
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost):disabled {
  border: 1px solid var(--cta_cta-border-color-tertiary-roundel-disabled);
}
.kal-btn.kal-roundel-btn.tertiary:not(.ghost) > svg {
  -webkit-transition: scale 0.2s ease-in-out;
  transition: scale 0.2s ease-in-out;
}
.kal-btn.negative {
  --button-background-color: var(--cta_cta-bg-color-destructive);
  color: var(--cta_cta-text-color-destructive);
}
.kal-btn.negative:hover:not(:disabled, [aria-disabled=true]):not(:focus) {
  -webkit-box-shadow: 0 0 0 5px var(--states_hover-color-destructive);
          box-shadow: 0 0 0 5px var(--states_hover-color-destructive);
}
.kal-btn.negative:focus {
  -webkit-box-shadow: 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(--cta_cta-bg-color-destructive);
          box-shadow: 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(--cta_cta-bg-color-destructive);
}
.kal-btn.negative:focus:hover {
  -webkit-box-shadow: 0 0 0 3px var(--states_hover-color-destructive), 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(--cta_cta-bg-color-destructive);
          box-shadow: 0 0 0 3px var(--states_hover-color-destructive), 0 0 0 3px var(--page-bg-color), 0 0 0 5px var(--cta_cta-bg-color-destructive);
}
.kal-btn-grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto auto auto auto;
  grid-template-columns: auto auto auto auto;
}
@media only screen and (max-width: 1023px) {
  .kal-btn-grid {
    -webkit-column-gap: 16px;
       -moz-column-gap: 16px;
            column-gap: 16px;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1279px) {
  .kal-btn-grid {
    -webkit-column-gap: 24px;
       -moz-column-gap: 24px;
            column-gap: 24px;
  }
}
@media only screen and (max-width: 1439px) and (min-width: 1280px) {
  .kal-btn-grid {
    -webkit-column-gap: 28px;
       -moz-column-gap: 28px;
            column-gap: 28px;
  }
}
@media only screen and (min-width: 1440px) {
  .kal-btn-grid {
    -webkit-column-gap: 32px;
       -moz-column-gap: 32px;
            column-gap: 32px;
  }
}
@media only screen and (max-width: 1023px) {
  .kal-btn-grid {
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

/**
* This mixin creates two alternate styles that we switch between with the CSS var --kdsComponentsVersion. 
* The "correct way" to do this is with Container Queries
* (see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_size_and_style_queries#style_queries_for_custom_properties)
* but as this is not yet widely supported in browsers, we use a temporary approach based on selecting animation frames
* as suggested here: https://css-tricks.com/css-switch-case-conditions/
*
* Example usage:
*   .kal-some-component {
*     .kal-component-versions(
*        @v1rules: { border-radius: 8px; },
*        @v2rules: { border-radius: 32px; }
*      );
*   }
*/
/* applies standard rounded edge */
/* applies tinted drop shadow */
/**
* The following mixins are not part of the common design language and
* are only meant for applications and components with non-standard
* designs
*/
:root {
  /* gradient sizes */
  --shimmer-highlight-size: 128px;
  --shimmer-highlight-leading-edge-blur: 10px;
  /* gradient angle */
  --shimmer-angle: 105deg;
  --shimmer-ease: cubic-bezier(0.45, 0.3, 0.7, 0.55);
  /* the value we will animate to make the gradient move */
  --shimmer-horizontal-progress: 0;
}
@media only screen and (min-width: 1440px) {
  :root {
    --shimmer-sweep-duration: 2.4s;
  }
}
@media only screen and (max-width: 1439px) and (min-width: 1024px) {
  :root {
    --shimmer-sweep-duration: 2s;
  }
}
@media only screen and (max-width: 1023px) and (min-width: 680px) {
  :root {
    --shimmer-sweep-duration: 1.6s;
  }
}
@media only screen and (max-width: 679px) and (min-width: 375px) {
  :root {
    --shimmer-sweep-duration: 1.2s;
  }
}
@media only screen and (max-width: 374px) {
  :root {
    --shimmer-sweep-duration: 1s;
  }
}
.kal-shimmer-box {
  --shimmer-line-start: calc(var(--shimmer-horizontal-progress) * (100vw + var(--shimmer-highlight-size) * 2) - var(--shimmer-highlight-size));
  --shimmer-line-peak: calc(var(--shimmer-line-start) + (var(--shimmer-highlight-size) * 100 / 100));
  --shimmer-line-end: calc(var(--shimmer-line-start) + var(--shimmer-highlight-size) + var(--shimmer-highlight-leading-edge-blur));
}
@media (prefers-reduced-motion: no-preference) {
  .kal-shimmer-box {
    -webkit-animation-name: kal-shimmer-sweep;
            animation-name: kal-shimmer-sweep;
    -webkit-animation-duration: var(--shimmer-sweep-duration);
            animation-duration: var(--shimmer-sweep-duration);
    -webkit-animation-timing-function: var(--shimmer-ease);
            animation-timing-function: var(--shimmer-ease);
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    background: -webkit-gradient(linear, left top, left bottom, from(var(--shimmer-angle)), color-stop(transparent), color-stop(var(--effects_shimmer-color)), to(transparent)), -webkit-gradient(linear, left top, left bottom, from(var(--shimmer-bg-color, transparent)));
    background: linear-gradient(var(--shimmer-angle), transparent var(--shimmer-line-start), var(--effects_shimmer-color) var(--shimmer-line-peak), transparent var(--shimmer-line-end)), linear-gradient(var(--shimmer-bg-color, transparent));
    background-attachment: fixed;
  }
}
@-webkit-keyframes kal-shimmer-sweep {
  0% {
    --shimmer-horizontal-progress: 0;
  }
  50%,
  100% {
    --shimmer-horizontal-progress: 1;
  }
  /* 50% allows for a short pause at the end of animation */
}
@keyframes kal-shimmer-sweep {
  0% {
    --shimmer-horizontal-progress: 0;
  }
  50%,
  100% {
    --shimmer-horizontal-progress: 1;
  }
  /* 50% allows for a short pause at the end of animation */
}
@property --shimmer-horizontal-progress {
  syntax: '<number>';
  inherits: true;
  initial-value: 0;
}

.kal-skeleton-heading-1 {
  --shimmer-bg-color: color(from var(--icon_icon-color-disabled) srgb r g b / 0.1);
  height: 32px;
  width: 320px;
  border-radius: 24px;
}

/* lato-latin-ext-400-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/home/361f3dbb9db6a59803265646720a9ae7.woff2) format('woff2'), url(/home/3dc1eff492ab1f5985600a50d88bd933.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* lato-latin-400-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/home/be36596da218e1eec01c5c600b1c13ef.woff2) format('woff2'), url(/home/3dc1eff492ab1f5985600a50d88bd933.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* lato-latin-ext-700-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/home/9c8812eaec45956201e177b39d27a808.woff2) format('woff2'), url(/home/1e7707c9ec98d9b97e7f3e5ce2f7770f.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* lato-latin-700-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/home/8f28e0e1fdb195149f1c30f84d951b61.woff2) format('woff2'), url(/home/1e7707c9ec98d9b97e7f3e5ce2f7770f.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.kal-body-text {
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  font-family: var(--font-family);
  margin-top: 12px;
}
.kal-body-text.kal-type-bold {
  font-weight: 700;
}
.kal-body-text.kal-type-fade {
  -webkit-filter: contrast(0.25);
          filter: contrast(0.25);
}
.kal-body-text.kal-limited-lines {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.kal-body-text.kal-no-top-spacer {
  margin-top: 0;
}
.kal-body-text-small {
  font-weight: 400;
  font-size: 14px;
  line-height: 24px;
  font-family: var(--font-family);
  margin-top: 12px;
}
.kal-body-text-small.kal-type-bold {
  font-weight: 700;
}
.kal-body-text-small.kal-type-fade {
  -webkit-filter: contrast(0.25);
          filter: contrast(0.25);
}
.kal-body-text-small.kal-limited-lines {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.kal-body-text-small.kal-no-top-spacer {
  margin-top: 0;
}
.kal-label {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  font-family: var(--font-family);
}
.kal-label.kal-type-fade {
  -webkit-filter: contrast(0.25);
          filter: contrast(0.25);
}
.kal-label.kal-limited-lines {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.kal-label.kal-no-top-spacer {
  margin-top: 0;
}
.kal-heading-1 {
  all: unset;
  display: block;
  font-weight: 700;
  font-family: var(--font-family);
}
.kal-heading-1.kal-type-fade {
  -webkit-filter: contrast(0.25);
          filter: contrast(0.25);
}
.kal-heading-1.kal-limited-lines {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
@media only screen and (max-width: 679px) {
  .kal-heading-1 {
    font-size: 32px;
    line-height: 40px;
  }
}
@media only screen and (min-width: 680px) {
  .kal-heading-1 {
    font-size: 40px;
    line-height: 56px;
  }
}
@media only screen and (max-width: 679px) {
  .kal-heading-1 {
    margin-top: 32px;
  }
}
@media only screen and (min-width: 680px) {
  .kal-heading-1 {
    margin-top: 48px;
  }
}
.kal-heading-1.kal-no-top-spacer {
  margin-top: 0;
}
.kal-heading-2 {
  all: unset;
  display: block;
  font-weight: 700;
  font-family: var(--font-family);
}
.kal-heading-2.kal-type-fade {
  -webkit-filter: contrast(0.25);
          filter: contrast(0.25);
}
.kal-heading-2.kal-limited-lines {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
@media only screen and (max-width: 679px) {
  .kal-heading-2 {
    font-size: 24px;
    line-height: 32px;
  }
}
@media only screen and (min-width: 680px) {
  .kal-heading-2 {
    font-size: 32px;
    line-height: 40px;
  }
}
@media only screen and (max-width: 679px) {
  .kal-heading-2 {
    margin-top: 28px;
  }
}
@media only screen and (min-width: 680px) {
  .kal-heading-2 {
    margin-top: 40px;
  }
}
.kal-heading-2.kal-no-top-spacer {
  margin-top: 0;
}
.kal-heading-3 {
  all: unset;
  display: block;
  font-weight: 700;
  font-family: var(--font-family);
}
.kal-heading-3.kal-type-fade {
  -webkit-filter: contrast(0.25);
          filter: contrast(0.25);
}
.kal-heading-3.kal-limited-lines {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
@media only screen and (max-width: 679px) {
  .kal-heading-3 {
    font-size: 20px;
    line-height: 24px;
  }
}
@media only screen and (min-width: 680px) {
  .kal-heading-3 {
    font-size: 24px;
    line-height: 32px;
  }
}
@media only screen and (max-width: 679px) {
  .kal-heading-3 {
    margin-top: 24px;
  }
}
@media only screen and (min-width: 680px) {
  .kal-heading-3 {
    margin-top: 32px;
  }
}
.kal-heading-3.kal-no-top-spacer {
  margin-top: 0;
}
.kal-heading-4 {
  all: unset;
  display: block;
  font-weight: 700;
  font-family: var(--font-family);
  font-size: 16px;
  line-height: 24px;
}
.kal-heading-4.kal-type-fade {
  -webkit-filter: contrast(0.25);
          filter: contrast(0.25);
}
.kal-heading-4.kal-limited-lines {
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
@media only screen and (max-width: 679px) {
  .kal-heading-4 {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 680px) {
  .kal-heading-4 {
    margin-top: 24px;
  }
}
.kal-heading-4.kal-no-top-spacer {
  margin-top: 0;
}

/* lato-latin-ext-400-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/home/361f3dbb9db6a59803265646720a9ae7.woff2) format('woff2'), url(/home/3dc1eff492ab1f5985600a50d88bd933.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* lato-latin-400-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/home/be36596da218e1eec01c5c600b1c13ef.woff2) format('woff2'), url(/home/3dc1eff492ab1f5985600a50d88bd933.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/**
* This mixin creates two alternate styles that we switch between with the CSS var --kdsComponentsVersion. 
* The "correct way" to do this is with Container Queries
* (see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_size_and_style_queries#style_queries_for_custom_properties)
* but as this is not yet widely supported in browsers, we use a temporary approach based on selecting animation frames
* as suggested here: https://css-tricks.com/css-switch-case-conditions/
*
* Example usage:
*   .kal-some-component {
*     .kal-component-versions(
*        @v1rules: { border-radius: 8px; },
*        @v2rules: { border-radius: 32px; }
*      );
*   }
*/
/* applies standard rounded edge */
/* applies tinted drop shadow */
/**
* The following mixins are not part of the common design language and
* are only meant for applications and components with non-standard
* designs
*/
.kal-btn.inline {
  color: var(--text_text-color-on-page-bg);
  font-weight: 400;
  padding: 8px;
  min-height: 28px;
  -webkit-column-gap: 8px;
     -moz-column-gap: 8px;
          column-gap: 8px;
  border-radius: 4px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  padding: 0;
  text-decoration: underline;
  -webkit-column-gap: 4px;
     -moz-column-gap: 4px;
          column-gap: 4px;
}
.kal-btn.inline:hover:not(:disabled, [aria-disabled=true]) {
  --button-background-color: var(--states_hover-color);
}
.kal-btn.inline:disabled,
.kal-btn.inline:hover:disabled,
.kal-btn.inline[aria-disabled=true],
.kal-btn.inline:hover[aria-disabled=true] {
  cursor: default;
}
.kal-btn.inline:disabled,
.kal-btn.inline[aria-disabled=true] {
  color: var(--cta_cta-disabled-text-color);
}
.kal-btn.inline:focus-visible {
  -webkit-box-shadow: 0 0 0 2px var(--states_focus-border-color);
          box-shadow: 0 0 0 2px var(--states_focus-border-color);
}

/* lato-latin-ext-400-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/home/361f3dbb9db6a59803265646720a9ae7.woff2) format('woff2'), url(/home/3dc1eff492ab1f5985600a50d88bd933.woff) format('woff');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* lato-latin-400-normal*/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/home/be36596da218e1eec01c5c600b1c13ef.woff2) format('woff2'), url(/home/3dc1eff492ab1f5985600a50d88bd933.woff) format('woff');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.error-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: #f5f5ed;
  font-family: var(--font-family);
  font-weight: 400;
  color: var(--text_text-color-on-page-bg);
  padding: 60px 30px;
  text-align: center;
}
.error-section .error-section__main {
  font-size: 17px;
  margin: 24px 0;
}
.error-section .error-section__secondary {
  font-size: 13px;
}

body:has(dialog.kal-modal-dialog[open]) {
  overflow: hidden;
}
dialog.kal-modal-dialog {
  background-color: var(--card_card-bg-color);
  --kal-current-bg-color: var(--card_card-bg-color);
  color: var(--text_text-color-on-page-bg);
  overflow: visible;
  max-width: 500px;
  -webkit-box-shadow: 0 0 0 100vw rgba(0, 0, 0, 0);
          box-shadow: 0 0 0 100vw rgba(0, 0, 0, 0);
  border-radius: 8px;
  border: none;
  padding: 0;
}
@media only screen and (max-width: 679px) {
  dialog.kal-modal-dialog {
    max-width: calc(100vw - (2 * 16px));
    width: 100%;
  }
}
dialog.kal-modal-dialog[open] {
  -webkit-box-shadow: 0 0 0 100vw rgba(0, 0, 0, 0.7);
          box-shadow: 0 0 0 100vw rgba(0, 0, 0, 0.7);
}
@media (prefers-reduced-motion: no-preference) {
  dialog.kal-modal-dialog {
    -webkit-animation: modal-fade-out 0.2s ease-out;
            animation: modal-fade-out 0.2s ease-out;
    -webkit-transition: -webkit-box-shadow 0.2s ease-out;
    transition: -webkit-box-shadow 0.2s ease-out;
    transition: box-shadow 0.2s ease-out;
    transition: box-shadow 0.2s ease-out, -webkit-box-shadow 0.2s ease-out;
  }
  dialog.kal-modal-dialog[open] {
    -webkit-animation: modal-fade-in 0.2s ease-out;
            animation: modal-fade-in 0.2s ease-out;
  }
}
dialog.kal-modal-dialog:not(.position-centered) {
  margin-top: 152px;
  min-height: 200px;
}
dialog.kal-modal-dialog:not(.position-centered) > .kal-modal-dialog-content {
  max-height: calc(100vh - 152px - 24px);
}
@media only screen and (max-width: 679px), screen and (max-height: 1000px) {
  dialog.kal-modal-dialog:not(.position-centered) {
    margin-top: 16px;
  }
  dialog.kal-modal-dialog:not(.position-centered) > .kal-modal-dialog-content {
    max-height: calc(100vh - 16px - 16px);
  }
}
dialog.kal-modal-dialog .kal-modal-dialog-close-btn {
  position: absolute;
  top: 24px;
  right: 24px;
}
dialog.kal-modal-dialog.with-close-button .kal-modal-dialog-title {
  margin-right: 48px;
}
dialog.kal-modal-dialog.with-header-icon.with-close-button .kal-modal-dialog-title {
  margin-left: 48px;
}
dialog.kal-modal-dialog > .kal-modal-dialog-content {
  max-height: calc(100vh - 48px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
dialog.kal-modal-dialog > .kal-modal-dialog-content > .kal-modal-dialog-header {
  padding: 24px 24px 0 24px;
}
dialog.kal-modal-dialog > .kal-modal-dialog-content > .kal-modal-dialog-body {
  -webkit-box-flex: 0;
      -ms-flex: 0 1 auto;
          flex: 0 1 auto;
  overflow-y: auto;
  padding: 24px;
  padding-bottom: 0;
}
dialog.kal-modal-dialog > .kal-modal-dialog-content > .kal-modal-dialog-footer {
  margin-top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 12px;
     -moz-column-gap: 12px;
          column-gap: 12px;
}
@media only screen and (max-width: 679px) {
  dialog.kal-modal-dialog > .kal-modal-dialog-content > .kal-modal-dialog-footer {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    row-gap: 12px;
    padding: 24px 20px 20px 20px;
  }
}
@media only screen and (min-width: 680px) {
  dialog.kal-modal-dialog > .kal-modal-dialog-content > .kal-modal-dialog-footer {
    padding: 32px 24px 24px 24px;
  }
}
dialog.kal-modal-dialog > .kal-modal-dialog-content > .kal-modal-dialog-footer > * {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 12px;
     -moz-column-gap: 12px;
          column-gap: 12px;
}
dialog.kal-modal-dialog.variant-success .kal-modal-dialog-header {
  border-top: 8px solid var(--text_text-color-success);
  border-top-right-radius: 2px;
  border-top-left-radius: 2px;
}
dialog.kal-modal-dialog.variant-success .kal-modal-dialog-close-btn {
  top: 32px;
}
dialog.kal-modal-dialog.variant-success.with-header-icon .kal-modal-dialog-header {
  border-top: 0;
}
dialog.kal-modal-dialog.variant-success.with-header-icon .kal-modal-dialog-content {
  border-top: 8px solid var(--text_text-color-success);
}
dialog.kal-modal-dialog.variant-complex {
  background-color: var(--page-bg-color);
}
dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-content {
  padding: 24px;
}
@media only screen and (max-width: 679px) {
  dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-content {
    padding: 20px;
  }
}
dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-header {
  padding: 56px 0 0;
}
@media only screen and (max-width: 679px) {
  dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-header {
    padding: 40px 0 0;
  }
}
dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-header .kal-icon-states {
  padding-bottom: 4px;
}
@media only screen and (max-width: 679px) {
  dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-header .kal-icon-states {
    padding-bottom: 4px;
  }
}
dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-body {
  padding: 32px 0 0;
}
@media only screen and (max-width: 679px) {
  dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-body {
    padding: 24px 0 0;
  }
}
dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-body .kal-body-text {
  margin-top: 0;
}
dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-header,
dialog.kal-modal-dialog.with-header-icon .kal-modal-dialog-body {
  text-align: center;
}
/* Animation keyframes */
@-webkit-keyframes modal-fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes modal-fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes modal-fade-out {
  0% {
    opacity: 1;
    display: block;
  }
  100% {
    opacity: 0;
    display: none;
  }
}
@keyframes modal-fade-out {
  0% {
    opacity: 1;
    display: block;
  }
  100% {
    opacity: 0;
    display: none;
  }
}