/* Reveal-on-scroll — pairs with js/main.js */
.reveal {
  opacity: 0;
  transform: translateY(1rem);
  transition:
    opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Subtle hero grid */
.hero-grid-bg {
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
  background-size: 52px 52px;
  -webkit-mask-image: radial-gradient(ellipse 85% 65% at 50% 0%, #000 20%, transparent 75%);
  mask-image: radial-gradient(ellipse 85% 65% at 50% 0%, #000 20%, transparent 75%);
}

/* Brand headline gradient — sky/cyan family only */
.text-gradient-hero {
  background: linear-gradient(115deg, #7dd3fc 0%, #00a0e3 45%, #38bdf8 85%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Form / accent frame gradient */
.gradient-frame {
  background: linear-gradient(135deg, #00a0e3 0%, #0ea5e9 50%, #0284c7 100%);
}

/* Soft pulse for primary CTAs */
@keyframes soft-pulse-glow {
  0%,
  100% {
    box-shadow:
      0 0 0 0 rgba(0, 160, 227, 0.35),
      0 10px 40px -10px rgba(0, 160, 227, 0.35);
  }
  50% {
    box-shadow:
      0 0 0 8px rgba(0, 160, 227, 0),
      0 16px 48px -12px rgba(0, 160, 227, 0.45);
  }
}

.btn-glow {
  animation: soft-pulse-glow 3.5s ease-in-out infinite;
}

/* Enterprise footer — cool grey gradient */
.footer-enterprise {
  background: linear-gradient(
    180deg,
    #f8fafc 0%,
    #f1f5f9 38%,
    #e8eef3 72%,
    #e2e8f0 100%
  );
}

/* Legal modals (Terms, Privacy) */
.legal-modal.is-open {
  display: flex;
}

.legal-modal-body h3 {
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
  font-family: Outfit, system-ui, sans-serif;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #0f172a;
}

.legal-modal-body h3:first-child {
  margin-top: 0;
}

.legal-modal-body p,
.legal-modal-body li {
  font-size: 0.875rem;
  line-height: 1.65;
  color: #475569;
}

.legal-modal-body ul {
  margin: 0.5rem 0 0.75rem 1.125rem;
  list-style: disc;
}

.legal-modal-body a {
  color: #00a0e3;
  font-weight: 500;
}

.legal-modal-body a:hover {
  color: #0088c4;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .btn-glow {
    animation: none;
  }
}