.tr-hero-tariff {
  --tr-hero-tariff-bg: #383e42;
  --tr-hero-tariff-check: var(--tr-color-brand-kwmk-green, #84bd00);
  --tr-hero-tariff-text: #fff;
  position: relative;
  width: 100vw;
  max-width: 100vw;
  min-height: clamp(36rem, 44vw, 52.5rem);
  margin: 0 calc(50% - 50vw) var(--tr-hero-tariff-margin-bottom, 0);
  background: var(--tr-hero-tariff-bg);
  color: var(--tr-hero-tariff-text);
  overflow: hidden;
}

.tr-hero-tariff--text-black {
  --tr-hero-tariff-text: #000;
}

.tr-hero-tariff--text-white {
  --tr-hero-tariff-text: #fff;
}

.tr-hero-tariff,
.tr-hero-tariff * {
  box-sizing: border-box;
}

.tr-hero-tariff__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #f2f2f2;
}

.tr-hero-tariff__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0.52) 62%, rgba(0, 0, 0, 0.74) 100%);
  opacity: 0;
  pointer-events: none;
}

.tr-hero-tariff--image-gradient .tr-hero-tariff__media::after {
  opacity: 1;
}

.tr-hero-tariff__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tr-hero-tariff__body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-height: inherit;
  padding: clamp(10rem, 16vw, 18rem) max(2rem, calc((100vw - 90rem) / 2)) 3rem;
  background: transparent;
}

.tr-hero-tariff--epilot-disabled .tr-hero-tariff__body {
  padding-bottom: 4.5rem;
}

.tr-hero-tariff__content {
  width: 100%;
  max-width: 86rem;
  color: var(--tr-hero-tariff-text);
  text-align: center;
}

.tr-hero-tariff--align-left .tr-hero-tariff__body {
  align-items: flex-start;
}

.tr-hero-tariff--align-left .tr-hero-tariff__content {
  text-align: left;
}

.tr-hero-tariff--align-left .tr-hero-tariff__benefits {
  justify-content: flex-start;
}

.tr-hero-tariff__topline {
  margin: 0 0 var(--tr-space-m, 1.5rem);
  color: var(--tr-hero-tariff-text);
  font-size: var(--tr-font-overline-size, 1.125rem);
  font-weight: 500;
  line-height: var(--tr-font-overline-line-height, 1.53225rem);
  letter-spacing: 0;
  text-transform: uppercase;
}

.tr-hero-tariff__headline {
  margin: 0 0 var(--tr-space-l, 2rem);
  color: var(--tr-hero-tariff-text);
  font-size: 3.75rem;
  font-weight: 700;
  line-height: 4.5rem;
  letter-spacing: 0;
}

.tr-hero-tariff__benefits {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem 3.75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.tr-hero-tariff__benefit {
  display: flex;
  align-items: flex-start;
  gap: var(--tr-space-xs, 0.5rem);
  max-width: 23rem;
  margin-top: 0;
  color: var(--tr-hero-tariff-text);
  font-size: var(--tr-font-body-large-size, 1.375rem);
  font-weight: 400;
  text-align: left;
  line-height: var(--tr-font-body-large-line-height, 2.0625rem);
}

.nv-content-wrap .tr-hero-tariff__benefits > .tr-hero-tariff__benefit,
.excerpt-wrap .tr-hero-tariff__benefits > .tr-hero-tariff__benefit {
  margin-top: 0;
}

.tr-hero-tariff__benefit strong,
.tr-hero-tariff__benefit b {
  font-weight: 700;
}

.tr-hero-tariff__benefit-text {
  min-width: 0;
  overflow-wrap: break-word;
}

.tr-hero-tariff__check {
  display: inline-flex;
  flex: 0 0 auto;
  padding-top: 0.22em;
  color: var(--tr-hero-tariff-check);
}

.tr-hero-tariff__check-svg {
  display: block;
  width: 1.5rem;
  height: 1.5rem;
}

.tr-hero-tariff__calculator {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 75rem;
  margin-top: var(--tr-space-xl, 2.5rem);
  margin-bottom: 0;
}

.tr-hero-tariff__calculator .tr-price-calculator {
  width: 100%;
  margin: 0;
}

.tr-hero-tariff__calculator .tr-epilot-journey {
  width: 100%;
  margin: 0;
  background: #fff;
}

.tr-hero-tariff__calculator .tr-epilot-journey,
.tr-hero-tariff__calculator .tr-epilot-journey * {
  box-sizing: border-box;
}

.tr-hero-tariff__calculator .tr-epilot-journey__mount {
  width: 100%;
  min-height: var(--tr-epilot-journey-min-height, 45rem);
}

.tr-hero-tariff__calculator .tr-epilot-journey iframe {
  display: block;
  width: 100%;
  min-height: var(--tr-epilot-journey-min-height, 45rem);
  min-height: var(--tr-epilot-journey-min-height, 45rem) !important;
  border: 0;
}

@media (max-width: 47.9375rem) {
  .tr-hero-tariff {
    min-height: 0;
    margin-bottom: var(--tr-hero-tariff-mobile-margin-bottom, 5rem);
    overflow: visible;
  }

  .tr-hero-tariff__media {
    position: relative;
    inset: auto;
    height: 10.5rem;
  }

  .tr-hero-tariff__media::after {
    display: none;
  }

  .tr-hero-tariff__body {
    display: block;
    min-height: 0;
    padding: 2rem var(--tr-space-m, 1.5rem) 0;
    background: var(--tr-hero-tariff-bg);
  }

  .tr-hero-tariff--epilot-disabled .tr-hero-tariff__body {
    padding-bottom: 2.5rem;
  }

  .tr-hero-tariff__content {
    max-width: none;
    text-align: left;
  }

  .tr-hero-tariff__topline {
    margin-bottom: var(--tr-space-s, 1rem);
    font-size: var(--tr-font-label-size, 0.875rem);
    line-height: var(--tr-font-label-line-height, 1.19175rem);
  }

  .tr-hero-tariff__headline {
    max-width: 22rem;
    margin-bottom: var(--tr-space-s, 1rem);
    font-size: 2.25rem;
    line-height: var(--tr-font-headline-mobile-line-height, 2.25rem);
    letter-spacing: 0;
    hyphens: none;
    overflow-wrap: normal;
    word-break: normal;
  }

  .tr-hero-tariff__benefits {
    display: grid;
    justify-content: stretch;
    gap: 0.25rem;
  }

  .tr-hero-tariff__benefit {
    gap: var(--tr-space-xs, 0.5rem);
    max-width: none;
    margin-top: 0;
    font-size: var(--tr-font-body-size, 1.125rem);
    line-height: var(--tr-font-body-line-height, 1.8rem);
  }

  .tr-hero-tariff__check-svg {
    width: 1.75rem;
    height: 1.75rem;
  }

  .tr-hero-tariff__calculator {
    margin-top: -2rem;
    margin-bottom: -5rem;
  }

  .tr-hero-tariff__calculator--epilot {
    margin-top: 2rem;
    margin-bottom: 0;
  }

  .tr-hero-tariff__calculator .tr-price-calculator {
    transform: translateY(3.125rem);
  }

  .tr-hero-tariff__calculator .tr-epilot-journey__mount,
  .tr-hero-tariff__calculator .tr-epilot-journey iframe {
    min-height: max(36rem, var(--tr-epilot-journey-min-height, 45rem));
  }
}