.hero:only-child:has(.hero__date-picker) .hero__date-picker {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}

.hero__wrapper {
  height: 100%;
  position: relative;
}

.hero__container {
  position: relative;
  z-index: 1;
}

.hero__date-picker--padding-top,
.hero__container--padding-top {
  padding-top: var(--padding-top-mobile, 60px);
}

.hero__date-picker--padding-bottom,
.hero__container--padding-bottom {
  padding-bottom: var(--padding-bottom-mobile, 60px);
}

.hero__title {
  font-size: var(--font-size-h3, 40px);
}

.hero__title:only-child {
  margin: 0;
}

.hero__button {
  margin: 20px 0 0;
}

.hero__vision {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
}

.hero__vision--indent {
  bottom: calc(var(--date-picker-height, 71px) / 2);
}

.hero__vision-wrapper {
  height: 100%;
}

.hero__vision-wrapper-overlay {
  position: absolute;
  height: 100%;
  width: 100%;
  left: 50%;
  top: 0;
  transform: translate(-50%, 0);
  opacity: var(--opacity-overlay, 0.7);
}

.hero__vision-wrapper-overlay::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 5000px;
  right: 50%;
}

.hero__vision-wrapper-overlay::before {
  content: "";
  position: absolute;
  inset: 0;
}

.hero__vision-wrapper svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 100%;
  min-width: 100%;
  opacity: calc(1 - var(--opacity-overlay, 0.3));
}

.hero__vision-floral-wrapper {
  height: 100%;
}

.hero__vision-floral-wrapper svg {
  position: absolute;
  right: 40px;
  bottom: 0;
  opacity: 0.2;
  max-height: 100%;
}

.hero__image-wrapper {
  display: initial;
}

.hero__image {
  opacity: calc(1 - var(--opacity-overlay, 0.3));
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.hero .hero__wrapper .date-picker__instance {
  position: relative;
  z-index: 1;
  padding-top: 16px;
}

.palette-one.hero__wrapper {
  color: var(--color-secondary, #4E5D78);
  background: var(--background-primary, #FFF);
}

.palette-one .hero__title {
  color: var(--color-primary, #0B1A26);
}

.palette-one .hero__vision {
  background: var(--background-primary, #FFF);
}

.palette-one .hero__vision-wrapper-overlay::after {
  background: linear-gradient(to right, var(--background-primary, #FFF) 0%, var(--background-primary, #FFF) 90%, var(--background-primary-00, #FFF0) 100%);
}

.palette-one .hero__vision-wrapper-overlay::before {
  background: radial-gradient(43.14% 157.06% at 17.22% 51.25%, var(--background-primary, #FFF) 0%, var(--background-primary-00, #FFF0) 100%);
}

.palette-one .hero__vision-floral-wrapper g,
.palette-one .hero__vision-floral-wrapper path,
.palette-one .hero__vision-wrapper path {
  fill: var(--color-primary, #0B1A26);
}

.palette-two.hero__wrapper {
  color: var(--color-secondary-2, #E1E4E8);
  background: var(--background-primary-2, #0B1A26);
}

.palette-two .hero__title {
  color: var(--color-primary-2, #FFF);
}

.palette-two .hero__vision {
  background: var(--background-primary-2, #0B1A26);
}

.palette-two .hero__vision-wrapper-overlay::after {
  background: linear-gradient(to right, var(--background-primary-2, #0B1A26) 0%, var(--background-primary-2, #0B1A26) 90%, var(--background-primary-2-00, #0B1A2600) 100%);
}

.palette-two .hero__vision-wrapper-overlay::before {
  background: radial-gradient(43.14% 157.06% at 17.22% 51.25%, var(--background-primary-2, #0B1A26) 0%, var(--background-primary-2-00, #0B1A2600) 100%);
}

.palette-two .hero__vision-floral-wrapper g,
.palette-two .hero__vision-floral-wrapper path,
.palette-two .hero__vision-wrapper path {
  fill: var(--color-primary-2, #FFF);
}

.palette-three.hero__wrapper {
  color: var(--color-secondary-3, #FFF);
  background: var(--background-primary-3, #F4B841);
}

.palette-three .hero__title {
  color: var(--color-primary-3, #0B1A26);
}

.palette-three .hero__vision {
  background: var(--background-primary-3, #F4B841);
}

.palette-three .hero__vision-wrapper-overlay::after {
  background: linear-gradient(to right, var(--background-primary-3, #F4B841) 0%, var(--background-primary-3, #F4B841) 90%, var(--background-primary-3-00, #F4B84100) 100%);
}

.palette-three .hero__vision-wrapper-overlay::before {
  background: radial-gradient(43.14% 157.06% at 17.22% 51.25%, var(--background-primary-3, #F4B841) 0%, var(--background-primary-3-00, #F4B84100) 100%);
}

.palette-three .hero__vision-floral-wrapper g,
.palette-three .hero__vision-floral-wrapper path,
.palette-three .hero__vision-wrapper path {
  fill: var(--color-primary-3, #0B1A26);
}

@media (width >= 810px) {
  .hero__vision-wrapper svg {
    min-height: 100%;
    height: auto;
  }
}

@media (width >= 992px) {
  .hero__date-picker--padding-top,
  .hero__container--padding-top {
    padding-top: var(--padding-top, 60px);
  }

  .hero__date-picker--padding-bottom,
  .hero__container--padding-bottom {
    padding-bottom: var(--padding-bottom, 60px);
  }
}