@charset "UTF-8";
:root {
  --heading-font-family: neue-haas-grotesk-display, sans-serif;
  --body-font-family: neue-haas-grotesk-display, sans-serif;
}

.quote {
  max-width: 100%;
  width: 1250px;
  margin-right: auto;
  margin-left: auto;
}
@media (max-width: 1439.98px) {
  .quote {
    padding-right: 20px;
    padding-left: 20px;
  }
}
.quote {
  position: relative;
  width: 1036px;
  margin-left: 10px;
}
@media (min-width: 992px) {
  .quote {
    margin-left: auto;
  }
}
.quote p {
  color: #221B74;
  letter-spacing: 0.8px;
  font-family: neue-haas-grotesk-display, sans-serif;
  font-weight: 500 !important;
  font-style: normal;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.quote p {
  font-size: 24px;
}
@media (min-width: 390px) and (max-width: 1440px) {
  .quote p {
    font-size: calc(24px + (14 * (100vw - 390px) / (1050)));
  }
}
@media (min-width: 1440px) and (max-width: 1440px) {
  .quote p {
    font-size: calc(38px + ((100vw - 1440px) * (38 / 1440)));
  }
}
@media (min-width: 1440px) {
  .quote p {
    font-size: calc(38px + ((1440px - 1440px) * (38 / 1440)));
  }
}
.quote p {
  line-height: 32px;
}
@media (min-width: 390px) and (max-width: 1440px) {
  .quote p {
    line-height: calc(32px + (20 * (100vw - 390px) / (1050)));
  }
}
@media (min-width: 1440px) and (max-width: 1440px) {
  .quote p {
    line-height: calc(52px + ((100vw - 1440px) * (52 / 1440)));
  }
}
@media (min-width: 1440px) {
  .quote p {
    line-height: calc(52px + ((1440px - 1440px) * (52 / 1440)));
  }
}
.quote:before {
  content: "“";
  position: absolute;
  top: -3px;
  left: 10px;
  font-family: neue-haas-grotesk-display, sans-serif;
  font-weight: 500 !important;
  font-style: normal;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.quote:before {
  font-size: 24px;
}
@media (min-width: 390px) and (max-width: 1440px) {
  .quote:before {
    font-size: calc(24px + (14 * (100vw - 390px) / (1050)));
  }
}
@media (min-width: 1440px) and (max-width: 1440px) {
  .quote:before {
    font-size: calc(38px + ((100vw - 1440px) * (38 / 1440)));
  }
}
@media (min-width: 1440px) {
  .quote:before {
    font-size: calc(38px + ((1440px - 1440px) * (38 / 1440)));
  }
}
.quote:before {
  line-height: 32px;
}
@media (min-width: 390px) and (max-width: 1440px) {
  .quote:before {
    line-height: calc(32px + (20 * (100vw - 390px) / (1050)));
  }
}
@media (min-width: 1440px) and (max-width: 1440px) {
  .quote:before {
    line-height: calc(52px + ((100vw - 1440px) * (52 / 1440)));
  }
}
@media (min-width: 1440px) {
  .quote:before {
    line-height: calc(52px + ((1440px - 1440px) * (52 / 1440)));
  }
}
@media (min-width: 1440px) {
  .quote:before {
    left: -20px;
  }
}
@media (min-width: 1200px) and (max-width: 1439.98px) {
  .quote:before {
    left: 0;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .quote:before {
    left: 5px;
  }
}
.quote__attribution:before {
  content: "";
  position: relative;
  top: 0;
  left: 0;
  background-color: #DC199B;
  height: 3px;
  width: 60px;
  display: block;
  margin-top: 25px;
  margin-bottom: 25px;
}
.quote__by-line {
  color: #221B74;
  line-height: 28px;
  font-family: neue-haas-grotesk-display, sans-serif;
  font-weight: 700 !important;
  font-style: normal;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.quote__by-line {
  font-size: 20px;
}
@media (min-width: 390px) and (max-width: 1440px) {
  .quote__by-line {
    font-size: calc(20px + (4 * (100vw - 390px) / (1050)));
  }
}
@media (min-width: 1440px) and (max-width: 1440px) {
  .quote__by-line {
    font-size: calc(24px + ((100vw - 1440px) * (24 / 1440)));
  }
}
@media (min-width: 1440px) {
  .quote__by-line {
    font-size: calc(24px + ((1440px - 1440px) * (24 / 1440)));
  }
}
.quote__by-title {
  display: block;
  color: #181818;
  font-size: 18.66px;
  margin-top: 5px;
  font-family: neue-haas-grotesk-display, sans-serif;
  font-weight: 500 !important;
  font-style: normal;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}