.ap-video-hero-cta {
  --ap-button-bg: #c0f4d7;
  --ap-button-text: #103628;
  --ap-text-color: #fff;
  --ap-overlay: rgba(15, 45, 37, 0.42);
  --ap-content-width: 720px;
  --ap-min-height: 620px;
  --ap-h1-x: 0px;
  --ap-h1-y: 0px;
  --ap-h2-x: 0px;
  --ap-h2-y: 0px;
  --ap-h3-x: 0px;
  --ap-h3-y: 0px;
  --ap-button-x: 0px;
  --ap-button-y: 0px;
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  max-width: none;
  min-height: var(--ap-min-height);
  border-radius: 32px;
  isolation: isolate;
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.08), transparent 24%),
    linear-gradient(135deg, #0f2d25 0%, #11372c 48%, #184b3c 100%);
  color: #fff;
}

.elementor-widget-ap-video-hero-cta,
.elementor-widget-ap-video-hero-cta .elementor-widget-container,
.wp-block-ap-video-hero-cta {
  width: 100%;
  max-width: none;
}

.elementor-widget-ap-video-hero-cta {
  flex-basis: 100%;
}

.ap-video-hero-cta.elementor-invisible,
.elementor-widget-ap-video-hero-cta.elementor-invisible .ap-video-hero-cta {
  opacity: 1;
  visibility: visible;
}

.ap-video-hero-cta__media,
.ap-video-hero-cta__overlay {
  position: absolute;
  inset: 0;
}

.ap-video-hero-cta__video,
.ap-video-hero-cta__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ap-video-hero-cta__overlay {
  background: var(--ap-overlay);
}

.ap-video-hero-cta__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  min-height: var(--ap-min-height);
  padding: clamp(28px, 4vw, 56px);
}

.ap-video-hero-cta__content {
  max-width: var(--ap-content-width);
}

.ap-video-hero-cta__h1,
.ap-video-hero-cta__h2,
.ap-video-hero-cta__h3,
.ap-video-hero-cta__actions {
  transition: transform 260ms ease;
}

.ap-video-hero-cta__h2 {
  margin: 0 0 14px;
  font-size: clamp(1rem, 1.4vw, 1.25rem);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ap-text-color) !important;
  transform: translate(var(--ap-h2-x), var(--ap-h2-y));
}

.ap-video-hero-cta__h1 {
  margin: 0;
  font-size: clamp(2.4rem, 6vw, 5.6rem);
  line-height: 0.96;
  font-weight: 800;
  color: var(--ap-text-color) !important;
  transform: translate(var(--ap-h1-x), var(--ap-h1-y));
}

.ap-video-hero-cta__h3 {
  margin: 18px 0 0;
  max-width: 52ch;
  font-size: clamp(1rem, 1.6vw, 1.35rem);
  line-height: 1.6;
  font-weight: 500;
  color: var(--ap-text-color) !important;
  transform: translate(var(--ap-h3-x), var(--ap-h3-y));
}

.ap-video-hero-cta__actions {
  margin-top: 28px;
  transform: translate(var(--ap-button-x), var(--ap-button-y));
}

.ap-video-hero-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 54px;
  padding: 16px 28px;
  border-radius: 999px;
  background: var(--ap-button-bg);
  color: var(--ap-button-text);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 18px 32px rgba(0, 0, 0, 0.18);
}

.ap-video-hero-cta__button:hover,
.ap-video-hero-cta__button:focus-visible {
  color: var(--ap-button-text);
  filter: brightness(1.03);
}

.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__h1,
.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__h2,
.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__h3,
.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__actions,
.ap-video-hero-cta.is-anim-fade-in .ap-video-hero-cta__h1,
.ap-video-hero-cta.is-anim-fade-in .ap-video-hero-cta__h2,
.ap-video-hero-cta.is-anim-fade-in .ap-video-hero-cta__h3,
.ap-video-hero-cta.is-anim-fade-in .ap-video-hero-cta__actions,
.ap-video-hero-cta.is-anim-zoom-in .ap-video-hero-cta__h1,
.ap-video-hero-cta.is-anim-zoom-in .ap-video-hero-cta__h2,
.ap-video-hero-cta.is-anim-zoom-in .ap-video-hero-cta__h3,
.ap-video-hero-cta.is-anim-zoom-in .ap-video-hero-cta__actions {
  opacity: 0;
}

.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__h1,
.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__h2,
.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__h3,
.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__actions {
  transform:
    translate(var(--ap-h1-x), calc(var(--ap-h1-y) + 28px));
}

.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__h2 {
  transform:
    translate(var(--ap-h2-x), calc(var(--ap-h2-y) + 28px));
}

.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__h3 {
  transform:
    translate(var(--ap-h3-x), calc(var(--ap-h3-y) + 28px));
}

.ap-video-hero-cta.is-anim-fade-up .ap-video-hero-cta__actions {
  transform:
    translate(var(--ap-button-x), calc(var(--ap-button-y) + 28px));
}

.ap-video-hero-cta.is-anim-fade-in .ap-video-hero-cta__h1,
.ap-video-hero-cta.is-anim-fade-in .ap-video-hero-cta__h2,
.ap-video-hero-cta.is-anim-fade-in .ap-video-hero-cta__h3,
.ap-video-hero-cta.is-anim-fade-in .ap-video-hero-cta__actions {
  transform: translate(0, 0);
}

.ap-video-hero-cta.is-anim-zoom-in .ap-video-hero-cta__h1,
.ap-video-hero-cta.is-anim-zoom-in .ap-video-hero-cta__h2,
.ap-video-hero-cta.is-anim-zoom-in .ap-video-hero-cta__h3,
.ap-video-hero-cta.is-anim-zoom-in .ap-video-hero-cta__actions {
  transform: scale(0.94);
}

.ap-video-hero-cta.is-ready .ap-video-hero-cta__h1,
.ap-video-hero-cta.is-ready .ap-video-hero-cta__h2,
.ap-video-hero-cta.is-ready .ap-video-hero-cta__h3,
.ap-video-hero-cta.is-ready .ap-video-hero-cta__actions {
  opacity: 1;
}

.ap-video-hero-cta.is-ready .ap-video-hero-cta__h1 {
  transform: translate(var(--ap-h1-x), var(--ap-h1-y));
}

.ap-video-hero-cta.is-ready .ap-video-hero-cta__h2 {
  transform: translate(var(--ap-h2-x), var(--ap-h2-y));
}

.ap-video-hero-cta.is-ready .ap-video-hero-cta__h3 {
  transform: translate(var(--ap-h3-x), var(--ap-h3-y));
}

.ap-video-hero-cta.is-ready .ap-video-hero-cta__actions {
  transform: translate(var(--ap-button-x), var(--ap-button-y));
}

.editor-styles-wrapper .ap-video-hero-cta {
  min-height: 480px;
}

@media (max-width: 767px) {
  .ap-video-hero-cta {
    border-radius: 24px;
  }

  .ap-video-hero-cta__inner {
    padding: 24px;
  }

  .ap-video-hero-cta__h1 {
    font-size: clamp(2rem, 11vw, 3.4rem);
  }

  .ap-video-hero-cta__button {
    width: 100%;
  }
}
