@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes scrollHintPulse {
  0%, 100% { opacity: 0.4; transform: scaleY(1); }
  50%       { opacity: 1;   transform: scaleY(1.15); }
}

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

@keyframes tabFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes toastIn {
  from { transform: translateX(-50%) translateY(calc(100% + 2rem)); opacity: 0; }
  to   { transform: translateX(-50%) translateY(0); opacity: 1; }
}

@keyframes counterPop {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.04); }
  100% { transform: scale(1); }
}

.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.65s ease, transform 0.65s cubic-bezier(0.2, 0.9, 0.3, 1);
  transition-delay: var(--delay, 0ms);
  will-change: opacity, transform;
}

.reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

.hero-title.reveal {
  transition-delay: 100ms;
}

.hero-subtitle.reveal {
  transition-delay: 200ms;
}

.hero-stats.reveal {
  transition-delay: 320ms;
}

.hero-ctas.reveal {
  transition-delay: 440ms;
}

.scroll-hint.reveal {
  transition-delay: 560ms;
}

.space-card,
.service-card,
.value-card,
.testimonial-card,
.pricing-card {
  transition:
    transform var(--transition-card),
    box-shadow var(--transition-card),
    border-color var(--transition-card),
    background var(--transition-card),
    opacity 0.65s ease;
}

.space-card.reveal,
.service-card.reveal,
.value-card.reveal,
.testimonial-card.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition:
    opacity 0.65s ease,
    transform 0.65s cubic-bezier(0.2, 0.9, 0.3, 1),
    box-shadow var(--transition-card),
    border-color var(--transition-card),
    background var(--transition-card);
  transition-delay: var(--delay, 0ms);
}

.space-card.reveal.revealed,
.service-card.reveal.revealed,
.value-card.reveal.revealed,
.testimonial-card.reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

.space-card.reveal.revealed:hover {
  transform: translateY(-6px);
}

.service-card.reveal.revealed:hover {
  transform: translateY(-6px);
}

.value-card.reveal.revealed:hover {
  transform: translateY(-4px);
}

.testimonial-card.reveal.revealed:hover {
  transform: translateY(-4px);
}

.pricing-card.reveal.revealed:hover {
  transform: translateY(-4px);
}

#main-nav {
  transition: background 0.4s ease, backdrop-filter 0.4s ease, border-color 0.4s ease;
}

.nav-links a {
  position: relative;
}

.nav-links a::after {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--gradient);
  transform: scaleX(0);
  transition: transform var(--transition-base);
  transform-origin: left;
}

.nav-links a:hover::after {
  transform: scaleX(1);
}

.faq-question {
  transition: color var(--transition-base);
}

.faq-question:hover span:first-child {
  color: var(--text-primary);
}

.faq-question span:first-child {
  transition: color var(--transition-base);
  color: var(--text-secondary);
}

.faq-item.open .faq-question span:first-child {
  color: var(--text-primary);
}

.gallery-item {
  overflow: hidden;
}

.gallery-placeholder {
  transition: transform 0.5s cubic-bezier(0.2, 0.9, 0.3, 1);
}

.gallery-item:hover .gallery-placeholder {
  transform: scale(1.04);
}

.stat-number.animating {
  animation: counterPop 0.15s ease-out;
}

.tab-btn {
  position: relative;
}

.btn-submit:active {
  transform: scale(0.98);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}
