/* Homepage opening composition.
   The custom query string in the homepage build refreshes this cached asset. */
.mp-home .hero--canvas {
  align-items: flex-start;
  padding: clamp(108px, 10vw, 132px) 0 clamp(68px, 7vw, 92px);
}

.mp-home .hero--canvas .hero__row {
  grid-template-columns: minmax(0, 1.28fr) minmax(370px, .72fr);
  gap: clamp(42px, 6vw, 74px);
  align-items: start;
}

.mp-home .hero__primary {
  max-width: 650px;
}

.mp-home .hero--canvas h1 {
  margin-top: 25px;
  font-size: clamp(2.9rem, 4.8vw, 4.35rem);
  line-height: 1;
  letter-spacing: -.035em;
}

.mp-home .hero__positioning h2 {
  margin: 0;
  font-size: clamp(1.05rem, 1.55vw, 1.25rem);
  line-height: 1.25;
  white-space: nowrap;
}

.mp-home .hero__positioning h2 .ac {
  display: block;
  margin-top: 4px;
  white-space: nowrap;
}

.mp-home .hero__primary .hero__positioning {
  margin-top: 31px;
}

.mp-home .hero--canvas .hero__sub {
  max-width: 595px;
  margin: 27px 0 0;
  padding: 0;
  background: transparent;
  color: #d7deed;
  font-size: 1rem;
  line-height: 1.48;
}

.mp-home .hero__transactions {
  display: inline-flex;
  margin-top: 31px;
}

.mp-home .hero__proof {
  width: 100%;
  padding-top: 30px;
}

.mp-home .hero__proof-cta {
  margin-top: 40px;
}

.mp-home .hero__proof-cta .btn {
  min-width: 200px;
  justify-content: center;
}

@media (max-width: 1024px) {
  .mp-home .hero--canvas .hero__row {
    grid-template-columns: 1fr;
    gap: 44px;
  }

  .mp-home .hero__proof {
    max-width: 650px;
    padding-top: 0;
  }
}

@media (max-width: 640px) {
  .mp-home .hero--canvas {
    padding: 104px 0 62px;
  }

  .mp-home .hero--canvas h1 {
    margin-top: 20px;
    font-size: clamp(2.65rem, 13vw, 3.5rem);
  }

  .mp-home .hero__primary .hero__positioning {
    margin-top: 25px;
  }

  .mp-home .hero__positioning h2 {
    font-size: clamp(.95rem, 4.7vw, 1.35rem);
    white-space: normal;
  }

  .mp-home .hero__positioning h2 .ac {
    white-space: normal;
  }

  .mp-home .hero__transactions {
    margin-top: 25px;
  }
}
