/* PROD-V17: layout for the official vertical DIRS21 QuickBook configuration. */

body[data-page="home"] .hero {
  overflow: visible;
  z-index: 2;
}

body[data-page="home"] .trust-strip {
  z-index: 1;
}

.hero-quickbook__panel.is-ready {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.hero-quickbook__panel.is-ready .d21-widget-container {
  box-shadow: 0 20px 60px rgba(35, 32, 27, 0.24);
}

@media (min-width: 901px) {
  body[data-page="home"] .hero__content {
    justify-content: flex-start;
    padding-top: clamp(2rem, 3.25vw, 3rem);
    padding-bottom: 0;
  }

  .hero-quickbook {
    right: auto;
    bottom: clamp(5rem, 6vw, 6rem);
    left: max(1rem, calc((100vw - 1180px) / 2));
    width: min(43%, 32rem);
  }

  .hero-quickbook .container {
    width: 100%;
    margin: 0;
    padding: 0;
  }

  .hero-quickbook__panel {
    width: 100%;
    min-height: 0;
    padding: 0.5rem;
  }

  .hero-quickbook .d21-quickbook {
    min-height: 0;
  }
}

@media (max-width: 900px) {
  .hero-quickbook__panel {
    width: min(100%, 34rem);
    min-height: 0;
  }

  .hero-quickbook .d21-quickbook {
    min-height: 0;
  }
}

@media (min-width: 901px) and (max-height: 820px) {
  body[data-page="home"] .hero__content {
    padding-top: 1rem;
  }

  body[data-page="home"] .hero__content .display {
    font-size: clamp(3rem, 4.6vw, 4rem);
  }

  body[data-page="home"] .hero__content .eyebrow {
    margin-bottom: 0.5rem;
  }

  body[data-page="home"] .hero__content .lead {
    margin-top: 1rem;
    font-size: 1.125rem;
    line-height: 1.65;
  }

  body[data-page="home"] .hero__content > .button-row {
    margin-top: 1.125rem;
  }
}

@media (max-width: 420px) {
  body[data-page="home"] .hero__content {
    padding-top: 1.5rem;
    padding-bottom: 1rem;
  }
}