/* ── Scroll Reveal Animations (replaces Framer Motion) ── */

[data-reveal] {
  opacity: 0;
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

[data-reveal][data-reveal-y] {
  transform: translateY(30px);
}

[data-reveal][data-reveal-x="-30"],
[data-reveal][data-reveal-x="-40"],
[data-reveal][data-reveal-x="-20"] {
  transform: translateX(-40px);
}

[data-reveal][data-reveal-x="30"],
[data-reveal][data-reveal-x="40"] {
  transform: translateX(40px);
}

[data-reveal].revealed {
  opacity: 1;
  transform: translate(0, 0);
}

/* Hero-specific reveals: start hidden, animate in after page load */
.hero-reveal {
  opacity: 0;
  transition: opacity 0.8s ease-out, transform 1s ease-out;
}

.hero-reveal[data-reveal-x="-20"] {
  transform: translateX(-20px);
}

.hero-reveal[data-reveal-y="40"] {
  transform: translateY(40px);
}

.hero-reveal[data-reveal-y="20"] {
  transform: translateY(20px);
}

.hero-reveal.revealed {
  opacity: 1;
  transform: translate(0, 0);
}

/* Hero background zoom-in + blur animation */
.hero-bg-animate {
  animation: heroZoom 2s cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
}

@keyframes heroZoom {
  0% {
    transform: scale(1.2);
    opacity: 0;
    filter: blur(20px);
  }
  100% {
    transform: scale(1.05);
    opacity: 1;
    filter: blur(0px);
  }
}

/* Skip Link */
.skip-link {
  position: absolute;
  top: -100%;
  left: 16px;
  z-index: 10000;
  padding: 8px 16px;
  background: #1e293b;
  color: #f5c518;
  border-radius: 0 0 4px 4px;
  font-size: 0.875rem;
  text-decoration: none;
  transition: top 0.2s;
}
.skip-link:focus {
  top: 0;
}

/* ── Mobile Optimizations ── */
@media (max-width: 767px) {
  /* Reduce reveal animation distances on mobile for smoother feel */
  [data-reveal][data-reveal-y] {
    transform: translateY(15px);
  }
  [data-reveal][data-reveal-x="-30"],
  [data-reveal][data-reveal-x="-40"],
  [data-reveal][data-reveal-x="-20"] {
    transform: translateY(15px);
  }
  [data-reveal][data-reveal-x="30"],
  [data-reveal][data-reveal-x="40"] {
    transform: translateY(15px);
  }
  .hero-reveal[data-reveal-y="40"] {
    transform: translateY(20px);
  }

  /* Larger touch targets for footer links */
  footer a {
    display: inline-block;
    padding-top: 4px;
    padding-bottom: 4px;
    min-height: 44px;
    line-height: 36px;
  }

  /* Form inputs: taller touch targets and prevent iOS zoom */
  .input-group input,
  .input-group textarea {
    font-size: 16px;
    min-height: 48px;
  }
}
