/* Only SEO money-page and pricing-page surfaces use these tokens. */
.money-page,
.money-pricing {
  --money-ink: #142d4e;
  --money-muted: #526174;
  --money-blue: #073b8c;
  --money-hover: #062e6e;
  --money-wash: #f5f6f8;
  --money-line: #dde3ea;
  color: var(--money-ink);
}
.money-page .money-search-area,
.money-pricing .page-intro.money-pricing-intro {
  background: var(--money-wash);
  padding: 32px;
  text-align: left;
  border: 0;
  border-radius: 6px;
  margin: 24px 0 40px;
  max-width: none;
}
/* Feather the pricing intro into the page on every edge. */
.money-pricing .page-intro.money-pricing-intro {
  background: radial-gradient(
    ellipse closest-side,
    var(--money-wash) 15%,
    #fafbfc 65%,
    #fff 100%
  );
  border-radius: 0;
}
.money-search-content {
  max-width: 680px;
}
.money-page h1,
.money-pricing .page-intro.money-pricing-intro h1 {
  font:
    600 32px/1.25 Manrope,
    Arial,
    sans-serif;
  letter-spacing: -0.7px;
  color: var(--money-ink);
  overflow-wrap: anywhere;
  margin: 0 0 16px;
}
.money-page .money-description,
.money-pricing .money-pricing-intro > .money-search-content > p:not(.eyebrow) {
  font:
    400 16px/1.65 Inter,
    Arial,
    sans-serif;
  color: var(--money-muted);
  margin: 0 0 24px;
}
.money-search .design-search {
  max-width: 680px;
  margin: 24px 0 0;
}
.money-search .design-search label {
  font-size: 14px;
  color: var(--money-ink);
}
.money-search .plate-row {
  flex-direction: column;
  gap: 12px;
}
.money-search .plate-field {
  flex: auto;
  height: 56px;
}
.money-search .design-search input {
  font-size: 20px;
}
.money-search .design-search button {
  width: 100%;
  min-height: 48px;
  padding: 12px 20px;
  font-size: 16px;
  background: var(--money-blue);
  border-color: var(--money-blue);
}
.money-search .design-search button:hover {
  background: var(--money-hover);
  border-color: var(--money-hover);
}
.money-page .money-support {
  font-size: 13px;
  color: var(--money-muted);
  margin: 14px 0 0;
}
.money-page .money-article {
  background: #fff;
  padding: 0 32px;
}
.money-page .money-article img {
  max-width: 160px;
  height: auto;
}
.money-page .money-related {
  padding: 24px 32px;
}
.money-page .money-related a {
  color: var(--money-blue);
}
.money-pricing .pricing-number {
  color: var(--money-blue);
}
.money-pricing .wash,
.money-pricing .design-cta {
  background: linear-gradient(
    to bottom,
    #fff 0%,
    var(--money-wash) 30%,
    var(--money-wash) 60%,
    #fff 100%
  );
}
.money-pricing .design-cta h2,
.money-pricing .design-cta label {
  color: var(--money-ink);
}
.money-pricing .design-cta p {
  color: var(--money-muted);
}
.money-pricing .design-button,
.money-pricing .design-cta button {
  background: var(--money-blue);
  border-color: var(--money-blue);
}
.money-pricing .design-button:hover,
.money-pricing .design-cta button:hover {
  background: var(--money-hover);
  border-color: var(--money-hover);
}
.money-pricing .text-link {
  color: var(--money-blue);
}
@media (max-width: 720px) {
  main.money-root {
    padding-left: 20px;
    padding-right: 20px;
  }
  .money-page .money-search-area {
    margin-top: 0;
    padding: 24px 0;
  }
  .money-page .money-article,
  .money-page .money-related {
    padding-left: 0;
    padding-right: 0;
  }
  .money-pricing .page-intro.money-pricing-intro {
    padding: 24px 0;
  }
  .money-page h1,
  .money-pricing .page-intro.money-pricing-intro h1 {
    font-size: 28px;
  }
}

.money-pricing .page-intro.money-pricing-intro {
  background: #fff;
  margin: 0;
  padding: 0;
}
.money-pricing .money-search .design-search {
  margin-top: 0;
}
.money-pricing .pricing-section {
  padding-top: 24px;
}
.money-pricing .pricing-grid {
  border-top: 1px solid var(--money-line);
}
.money-pricing .pricing-details {
  background: #fff;
  padding-block: 24px;
}
.money-pricing .design-section {
  padding-block: 32px;
}
.money-pricing .money-pricing-intro > p {
  max-width: 680px;
  line-height: 1.7;
  color: var(--money-muted);
}
