/* Pricing page – only overrides and extras */

/* Slightly tighter sections on pricing page */
.section.pricing-section {
  margin-top: var(--space-lg);
}

/* adding tweaks for the image on hero page */
.hero-visual {
  flex: 0 0 420px;
  max-width: 460px;
  position: relative;
}

.hero-image {
  width: 100%;
  height: auto;
  max-height: 260px;

  display: block;
  border-radius: 12px;

  -webkit-mask-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.25) 20%,
    rgba(0, 0, 0, 0.6) 40%,
    rgba(0, 0, 0, 1) 75%
  );
  mask-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.25) 20%,
    rgba(0, 0, 0, 0.6) 40%,
    rgba(0, 0, 0, 1) 75%
  );

  opacity: 0.85;
}