/* =========================================================
   EXISTING WORDPRESS HERO IMAGE
   ========================================================= */

.et_post_meta_wrapper {
  position: relative !important;
  overflow: visible !important;
}


/* Existing featured image from the post */

.et_post_meta_wrapper > img {
  display: block !important;

  width: 100% !important;
  height: auto !important;

  margin: 0 !important;

  border: 0 !important;

  /* No SVG mask */
  clip-path: none !important;
  -webkit-clip-path: none !important;

  /* only soft corners */
  border-radius: 44px !important;
}


/* =========================================================
   HERO VISUAL OVERLAY
   ========================================================= */

.bh-hero-visuals {
  position: absolute;

  inset: 0;

  z-index: 5;

  pointer-events: none;
}


/* =========================================================
   WHITE WAVE AT BOTTOM
   ========================================================= */

.bh-hero-bottom-wave {
  position: absolute;

  left: -2px;
  bottom: -1px;

  width: calc(100% + 4px);
  height: 120px;

  z-index: 4;
}


.bh-hero-bottom-wave path {
  fill: #ffffff;
}


/* =========================================================
   PURPLE BADGE
   ========================================================= */

.bh-hero-badge {
  position: absolute;

  right: 7%;
  bottom: 7%;

  z-index: 6;

  display: flex;

  align-items: center;
  justify-content: center;

  width: 170px;
  height: 170px;

  background:
    linear-gradient(
      145deg,
      #f5efff 0%,
      #e9ddff 100%
    );

  border-radius:
    51% 49% 47% 53% /
    46% 52% 48% 54%;

  box-shadow:
    0 18px 40px
    rgba(84, 38, 183, 0.10);

  transform: rotate(3deg);
}


.bh-hero-badge-plane {
  width: 74px;
  height: 74px;

  transform: rotate(-7deg);
}


.bh-hero-badge-plane path {
  fill: #ffffff;

  stroke: #5426b7;
  stroke-width: 4;

  stroke-linejoin: round;
  stroke-linecap: round;
}


/* =========================================================
   TOP RIGHT ARROW
   ========================================================= */

.bh-hero-sketch-arrow {
  position: absolute;

  top: 7%;
  right: 10%;

  width: 125px;
  height: 100px;

  z-index: 6;

  overflow: visible;

  transform: rotate(7deg);
}


.bh-hero-sketch-arrow path {
  fill: none;

  stroke: #5426b7;
  stroke-width: 4;

  stroke-linecap: round;
  stroke-linejoin: round;
}


/* =========================================================
   FLIGHT ROUTE
   ========================================================= */

.bh-hero-flight-route {
  position: absolute;

  left: 3%;
  bottom: -4px;

  width: 230px;
  height: 130px;

  z-index: 7;

  overflow: visible;
}


.bh-hero-route-line {
  fill: none;

  stroke: #7851d6;
  stroke-width: 3;

  stroke-linecap: round;

  stroke-dasharray: 7 9;
}


.bh-hero-route-plane path {
  fill: #ffffff;

  stroke: #5426b7;
  stroke-width: 3.5;

  stroke-linejoin: round;
  stroke-linecap: round;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 980px) {

  .et_post_meta_wrapper > img {
    border-radius: 34px !important;
  }


  .bh-hero-badge {
    width: 145px;
    height: 145px;

    right: 5%;
    bottom: 8%;
  }


  .bh-hero-badge-plane {
    width: 62px;
    height: 62px;
  }


  .bh-hero-sketch-arrow {
    width: 105px;

    right: 8%;
  }


  .bh-hero-flight-route {
    width: 190px;
  }


  .bh-hero-bottom-wave {
    height: 100px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

  .et_post_meta_wrapper > img {
    border-radius: 26px !important;
  }


  .bh-hero-bottom-wave {
    height: 72px;
  }


  .bh-hero-badge {
    width: 112px;
    height: 112px;

    right: 14px;
    bottom: 38px;
  }


  .bh-hero-badge-plane {
    width: 50px;
    height: 50px;
  }


  .bh-hero-sketch-arrow {
    width: 84px;

    top: 18px;
    right: 16px;
  }


  .bh-hero-flight-route {
    left: -4px;
    bottom: -12px;

    width: 145px;
    height: 96px;
  }

}