@keyframes scroll-pulse {
  0%,
  100% {
    opacity: 0.3;
    transform: scaleY(1);
  }
  50% {
    opacity: 1;
    transform: scaleY(1.15);
  }
}

@keyframes pattern-drift {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(calc(var(--size) * -1), calc(var(--size) * -1), 0);
  }
}

@keyframes float-soft {
  0%,
  100% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-8px);
  }
}

main > section:first-of-type {
  padding-block: calc(1.5 * var(--section-space-l));

  @media (min-width: 1024px) {
    padding-block: calc(1.25 * var(--section-space-l));
  }
}

main > section:not(:first-of-type) {
  position: relative;
  z-index: 9;
}

.svg-inline--fa {
  width: auto;
}

/* Medium Zoom overlay — lift above sticky nav & WhatsApp button */
.medium-zoom-overlay {
  z-index: 9998 !important;
  background: color-mix(
    in oklch,
    var(--base-ultra-light) 80%,
    transparent
  ) !important;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.medium-zoom-image--opened {
  z-index: 9999 !important;
  cursor: zoom-out;
  border-radius: var(--radius, 0.5rem);
}

.medium-zoom-image,
.medium-zoom-overlay {
  transition: all 0.35s cubic-bezier(0.2, 0, 0.2, 1) !important;
}

@media (hover: none) {
  .zoomable-image:hover {
    transform: none;
    box-shadow: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .zoomable-image,
  .medium-zoom-image,
  .medium-zoom-overlay {
    transition: none !important;
  }
}

/* ─── Zoom Caption Overlay ────────────────────────────── */
.nayfla-zoom-caption {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 9999;
  padding: 1.25rem 2rem calc(0.5rem + env(safe-area-inset-bottom));
  background: linear-gradient(
    to top,
    rgba(10, 10, 10, 0.85) 0%,
    rgba(10, 10, 10, 0) 100%
  );
  color: #fff;
  font-size: 0.9375rem;
  line-height: 1.5;
  text-align: center;
  pointer-events: none;
  opacity: 0;
  transform: translateY(1rem);
  transition:
    opacity 0.35s cubic-bezier(0.2, 0, 0.2, 1),
    transform 0.35s cubic-bezier(0.2, 0, 0.2, 1);
}

@media (max-width: 480px) {
  .nayfla-zoom-caption {
    padding: 1rem 1.25rem calc(0.25rem + env(safe-area-inset-bottom));
    font-size: 0.875rem;
  }
}

.nayfla-zoom-caption.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .nayfla-zoom-caption {
    transition: opacity 0.15s linear;
    transform: none;
  }
}