/* Patrick/Laurence feedback: a more emotional, accessible landing hero. */
#hero {
  background-image: linear-gradient(90deg, rgba(7, 9, 10, .24) 0%, rgba(7, 9, 10, .10) 44%, rgba(7, 9, 10, .02) 72%, rgba(7, 9, 10, .12) 100%), url("/assets/behva-classic-car-sunset.png");
  background-position: center;
  background-size: cover;
}

#hero [data-framer-name="heading"] {
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
}

#hero [data-framer-name="heading"] .framer-text,
#hero [data-framer-name="heading"] .framer-text span {
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .72);
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
  visibility: visible !important;
}

#hero form {
  box-shadow: 0 18px 42px rgba(24, 20, 13, .24);
}

@media (min-width: 810px) {
  #hero {
    background-position: right bottom;
    background-size: calc(100% + 260px) auto;
  }

  #hero [data-framer-name="wrapper"] {
    grid-template-columns: minmax(0, 1fr) minmax(460px, 560px) !important;
    align-items: center !important;
    gap: clamp(40px, 6vw, 112px) !important;
    min-height: 700px;
    transform: translateY(-130px);
  }

  #hero [data-framer-name="top"],
  #hero [data-framer-name="bottom"] {
    align-self: center !important;
  }

  #hero [data-framer-name="bottom"],
  #hero .framer-1kdsz2k-container {
    justify-self: end !important;
    width: 560px !important;
    max-width: 100% !important;
  }

  #hero [data-framer-name="bottom"] {
    transform: translateY(96px) !important;
  }

  #hero form {
    transform: scale(.86);
    transform-origin: right center;
  }
}

/* The original dotted texture washed out the hero photography. */
[data-framer-name="pattern_wrapper"] {
  display: none !important;
}

/* Preserve the calculator when Framer's entrance animation has not hydrated yet. */
#hero [data-framer-name="bottom"] {
  opacity: 1 !important;
  transform: none !important;
}

/* Do not leave the mobile navigation invisible when its Framer entrance misses hydration. */
#main [data-framer-appear-id="1u8baes"] {
  opacity: 1 !important;
  transform: translateX(-50%) translateY(0) !important;
}

/* Remove the bottom-right Framer appointment launcher and any Framer badge. */
.framer-15tkm4h-container,
#__framer-badge-container {
  display: none !important;
}

@media (max-width: 809px) {
  #hero {
    background-position: 64% center;
  }

  #hero [data-framer-name="heading"] {
    padding: 0;
  }
}
