/* Cinematic safari backgrounds — inside CTA/contact cards only */

.cta-cinematic {
  position: relative;
  overflow: hidden;
  border-radius: inherit;
  min-height: clamp(12rem, 28vh, 18rem);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow:
    0 8px 40px rgba(0, 0, 0, 0.45),
    0 0 48px rgba(217, 139, 43, 0.12);
  isolation: isolate;
}

.cta-cinematic--contact {
  min-height: auto;
}

.dest-cta-cinematic {
  min-height: auto;
}

.cta-cinematic--float {
  animation: ctaFloat 6s ease-in-out infinite;
}

.cta-cinematic--float:hover {
  animation-play-state: paused;
}

@keyframes ctaFloat {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}

.cta-cinematic__bg {
  position: absolute;
  inset: -8px;
  z-index: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transform: scale(1.04);
  transition: transform 8s ease;
  will-change: transform;
}

.cta-cinematic:hover .cta-cinematic__bg {
  transform: scale(1.08);
}

.cta-cinematic__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    145deg,
    rgba(0, 0, 0, 0.68) 0%,
    rgba(139, 90, 43, 0.32) 45%,
    rgba(0, 0, 0, 0.62) 100%
  );
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.cta-cinematic__vignette {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.55);
  background: radial-gradient(ellipse at center, transparent 35%, rgba(0, 0, 0, 0.35) 100%);
}

.cta-cinematic__glow {
  position: absolute;
  inset: -1px;
  z-index: 3;
  pointer-events: none;
  border-radius: inherit;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.15),
    0 0 30px rgba(217, 139, 43, 0.15);
}

.cta-cinematic__content {
  position: relative;
  z-index: 4;
}

/* CTA backgrounds — solid only until admin uploads a Cloudinary image via CMS */
.cta-cinematic__bg {
  background-image: none !important;
  background-color: #111111;
}

/* Contact info cards */
.cta-cinematic.contact-card {
  transition: transform 0.45s ease, box-shadow 0.45s ease;
}

.cta-cinematic.contact-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 16px 48px rgba(0, 0, 0, 0.5),
    0 0 56px rgba(217, 139, 43, 0.22);
}

.cta-cinematic.contact-card .contact-icon {
  position: relative;
  z-index: 1;
}

.cta-cinematic.package-card {
  transition: transform 0.45s ease, box-shadow 0.45s ease;
  min-height: clamp(22rem, 52vh, 28rem);
}

@media (max-width: 1024px) {
  .cta-cinematic.package-card {
    min-height: 0;
  }
}

.cta-cinematic.package-card .cta-cinematic__content {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

.cta-cinematic.package-card:hover {
  transform: translateY(-6px);
  box-shadow:
    0 16px 48px rgba(0, 0, 0, 0.5),
    0 0 56px rgba(217, 139, 43, 0.22);
}

.cta-cinematic.package-card.popular {
  border-color: rgba(217, 139, 43, 0.55);
}

/* Newsletter compact bar */
.cta-cinematic--compact {
  min-height: auto;
}

.cta-cinematic--compact .cta-cinematic__overlay {
  backdrop-filter: blur(10px);
}

.cta-cinematic--compact .cta-cinematic__content {
  display: flex;
  width: 100%;
  align-items: stretch;
}

/* Form inputs on cinematic cards */
.cta-cinematic select {
  background: rgba(0, 0, 0, 0.35) !important;
}
