/* CPPM/SCMP hero clarity overrides. Keep this file loaded after the main CSS. */
:root {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}

.main-nav > a,
.tool-nav > button {
  font-weight: 500;
}

.cppm-hero-copy[data-v-9fabebd8],
.scmp-hero-copy[data-v-564ede04] {
  -webkit-font-smoothing: auto;
  text-rendering: optimizeLegibility;
}

.cppm-hero-copy > p[data-v-9fabebd8] {
  color: #182431 !important;
  font-weight: 400 !important;
}

.scmp-hero-v2 .scmp-hero-copy > p[data-v-564ede04] {
  color: #35475c !important;
  font-weight: 400 !important;
}

.cppm-hero-copy ul[data-v-9fabebd8],
.scmp-hero-copy ul[data-v-564ede04] {
  color: #202c38;
}

.cppm-hero-art[data-v-9fabebd8],
.scmp-hero-art[data-v-564ede04] {
  opacity: .76;
  filter: saturate(.9) brightness(1.02);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .9) 16%, #000 42%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .9) 16%, #000 42%, #000 100%);
}

@media (min-width: 761px) {
  .cppm-hero-copy[data-v-9fabebd8],
  .scmp-hero-copy[data-v-564ede04] {
    font-kerning: normal;
  }
}