.wp-block-melinka-cta-melinka,
.melinka-cta-melinka {
  --melinka-cta-bg-image: none;
  --melinka-cta-height-desktop: 430px;
  --melinka-cta-height-mobile: 360px;
  position: relative;
  width: 100%;
  height: min(calc(100dvh - (var(--melinka-frame-size-desktop, 0px) * 2)), var(--melinka-cta-height-desktop));
  min-height: 320px;
  border-radius: 18px;
  overflow: hidden;
  padding: clamp(22px, 2.5vw, 36px);
  color: #f3f4f1;
  background-color: #d2d1cb;
  background-image: var(--melinka-cta-bg-image);
  background-size: cover;
  background-position: center;
  isolation: isolate;
}

.wp-block-melinka-cta-melinka {
  max-width: 100% !important;
  width: 100% !important;
}

/* Full-bleed like Hero Melinka in page/post content */
.entry-content > .wp-block-melinka-cta-melinka,
.entry-content > .melinka-cta-melinka,
.wp-block-post-content > .wp-block-melinka-cta-melinka,
.wp-block-post-content > .melinka-cta-melinka {
  width: calc(100vw - (var(--melinka-frame-size-desktop, 0px) * 2));
  max-width: calc(100vw - (var(--melinka-frame-size-desktop, 0px) * 2)) !important;
  margin-left: calc(50% - 50vw + var(--melinka-frame-size-desktop, 0px));
  margin-right: calc(50% - 50vw + var(--melinka-frame-size-desktop, 0px));
}

.melinka-cta-melinka__media {
  position: absolute;
  inset: 0;
  z-index: -3;
  pointer-events: none;
}

.melinka-cta-melinka__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.melinka-cta-melinka__embed {
  width: 100%;
  height: 100%;
}

.melinka-cta-melinka__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.22) 0%, rgba(0, 0, 0, 0.18) 50%, rgba(0, 0, 0, 0.2) 100%);
  z-index: -1;
}

.melinka-cta-melinka__title-wrap {
  position: absolute;
  left: clamp(22px, 5vw, 84px);
  top: clamp(130px, 20vw, 230px);
  max-width: min(56%, 740px);
}

.melinka-cta-melinka__title-main {
  margin: 0;
  font-family: "Manrope", "Inter", sans-serif;
  font-size: clamp(3.2rem, 11vw, 10.8rem);
  line-height: 0.9;
  font-weight: 500;
  letter-spacing: -0.03em;
  color: #f2f2ef;
}

.melinka-cta-melinka__title-accent {
  margin: clamp(8px, 1.2vw, 14px) 0 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-style: italic;
  font-size: clamp(3rem, 8.2vw, 8.8rem);
  line-height: 0.88;
  font-weight: 500;
  color: #f2f2ef;
}

.melinka-cta-melinka__info {
  position: absolute;
  right: clamp(18px, 5vw, 86px);
  top: clamp(142px, 20vw, 250px);
  width: min(460px, 38%);
  display: grid;
  gap: 18px;
}

.melinka-cta-melinka__description {
  margin: 0;
  font-family: "Manrope", "Inter", sans-serif;
  font-size: clamp(1.28rem, 2vw, 2.2rem);
  line-height: 1.24;
  font-weight: 380;
  color: rgba(247, 247, 244, 0.97);
}

.melinka-cta-melinka__button {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: #ededed;
  color: #252b33;
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-color: transparent !important;
  text-decoration-thickness: 0 !important;
  text-underline-offset: 0 !important;
  padding: 0.42rem 0.45rem 0.42rem 1rem;
  font-family: "Manrope", "Inter", sans-serif;
  font-size: clamp(1.02rem, 1.08vw, 1.28rem);
  line-height: 1;
  font-weight: 510;
  transition: color 620ms cubic-bezier(0.22, 1, 0.36, 1);
}

.melinka-cta-melinka .melinka-cta-melinka__button,
.melinka-cta-melinka .melinka-cta-melinka__button:link,
.melinka-cta-melinka .melinka-cta-melinka__button:visited,
.melinka-cta-melinka .melinka-cta-melinka__button:hover,
.melinka-cta-melinka .melinka-cta-melinka__button:focus,
.melinka-cta-melinka .melinka-cta-melinka__button:focus-visible,
.melinka-cta-melinka .melinka-cta-melinka__button:active {
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-color: transparent !important;
  text-decoration-thickness: 0 !important;
  text-underline-offset: 0 !important;
  border-bottom: 0 !important;
  background-image: none !important;
  box-shadow: none !important;
}

.melinka-cta-melinka__button::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0.38rem;
  width: 240%;
  height: 300%;
  border-radius: 50%;
  background: #1d232a;
  opacity: 0;
  transform: translate(50%, -50%) scale(0);
  transform-origin: center;
  transition:
    opacity 180ms ease,
    transform 820ms cubic-bezier(0.22, 1, 0.36, 1);
  z-index: -1;
  will-change: transform;
}

.melinka-cta-melinka__button-icon {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: #1f252d;
  color: #f3f4f5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transition:
    background-color 520ms cubic-bezier(0.22, 1, 0.36, 1),
    color 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

@media (hover: hover) {
  .melinka-cta-melinka__button:hover,
  .melinka-cta-melinka__button:focus-visible {
    color: #f2f3f5;
  }

  .melinka-cta-melinka__button:hover::before,
  .melinka-cta-melinka__button:focus-visible::before {
    opacity: 1;
    transform: translate(50%, -50%) scale(1);
  }

  .melinka-cta-melinka__button:hover .melinka-cta-melinka__button-icon,
  .melinka-cta-melinka__button:focus-visible .melinka-cta-melinka__button-icon {
    background: transparent;
    color: #f2f3f5;
  }
}

.melinka-cta-melinka__title-wrap,
.melinka-cta-melinka__info {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transition: opacity 700ms ease, transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
}

.melinka-cta-melinka__info {
  transition-delay: 120ms;
}

.melinka-cta-melinka.is-visible .melinka-cta-melinka__title-wrap,
.melinka-cta-melinka.is-visible .melinka-cta-melinka__info {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (max-width: 1024px) {
  .wp-block-melinka-cta-melinka,
  .melinka-cta-melinka {
    height: min(calc(100dvh - (var(--melinka-frame-size-mobile, 0px) * 2)), var(--melinka-cta-height-desktop));
    min-height: 320px;
  }

  .melinka-cta-melinka__title-wrap {
    max-width: 64%;
  }

  .melinka-cta-melinka__info {
    width: min(420px, 44%);
  }
}

@media (max-width: 767px) {
  .wp-block-melinka-cta-melinka,
  .melinka-cta-melinka {
    height: min(calc(100dvh - (var(--melinka-frame-size-mobile, 0px) * 2)), var(--melinka-cta-height-mobile));
    min-height: 300px;
    border-radius: 14px;
    padding: 16px;
  }

  .melinka-cta-melinka__title-wrap {
    left: 16px;
    top: 10px;
    max-width: 74%;
  }

  .melinka-cta-melinka__title-main {
    font-size: clamp(2.35rem, 14vw, 4.8rem);
    line-height: 0.92;
  }

  .melinka-cta-melinka__title-accent {
    margin-top: 2px;
    font-size: clamp(2.1rem, 12vw, 4.2rem);
    line-height: 0.9;
  }

  .melinka-cta-melinka__info {
    left: 16px;
    right: auto;
    bottom: 18px;
    top: auto;
    width: min(92%, 420px);
    gap: 10px;
  }

  .melinka-cta-melinka__description {
    font-size: clamp(1.05rem, 5.4vw, 1.48rem);
    line-height: 1.32;
  }

  .melinka-cta-melinka__button {
    min-height: 42px;
    font-size: 0.95rem;
    padding: 0.3rem 0.36rem 0.3rem 0.82rem;
  }

  .melinka-cta-melinka__button-icon {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }

  .entry-content > .wp-block-melinka-cta-melinka,
  .entry-content > .melinka-cta-melinka,
  .wp-block-post-content > .wp-block-melinka-cta-melinka,
  .wp-block-post-content > .melinka-cta-melinka {
    width: calc(100vw - (var(--melinka-frame-size-mobile, 0px) * 2));
    max-width: calc(100vw - (var(--melinka-frame-size-mobile, 0px) * 2)) !important;
    margin-left: calc(50% - 50vw + var(--melinka-frame-size-mobile, 0px));
    margin-right: calc(50% - 50vw + var(--melinka-frame-size-mobile, 0px));
  }
}

@media (prefers-reduced-motion: reduce) {
  .melinka-cta-melinka__title-wrap,
  .melinka-cta-melinka__info {
    opacity: 1;
    transform: none;
    transition: none;
  }
}