/* ============================================================
   BYINSURED — SCROLL ANIMATIONS & TRANSITIONS
   Powered by IntersectionObserver in animations.js
   ============================================================ */

/* ===== Reveal base state (hidden) ===== */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .55s cubic-bezier(.22,.61,.36,1),
              transform .55s cubic-bezier(.22,.61,.36,1);
}

.reveal.reveal--left {
  transform: translateX(-32px);
}

.reveal.reveal--right {
  transform: translateX(32px);
}

.reveal.reveal--scale {
  transform: scale(.96);
}

/* ===== Revealed state ===== */
.reveal.is-visible {
  opacity: 1;
  transform: translate(0) scale(1);
}

/* ===== Staggered children ===== */
.stagger-children > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .45s cubic-bezier(.22,.61,.36,1),
              transform .45s cubic-bezier(.22,.61,.36,1);
}

.stagger-children.is-visible > *:nth-child(1) { transition-delay: .05s; opacity: 1; transform: none; }
.stagger-children.is-visible > *:nth-child(2) { transition-delay: .12s; opacity: 1; transform: none; }
.stagger-children.is-visible > *:nth-child(3) { transition-delay: .19s; opacity: 1; transform: none; }
.stagger-children.is-visible > *:nth-child(4) { transition-delay: .26s; opacity: 1; transform: none; }
.stagger-children.is-visible > *:nth-child(5) { transition-delay: .33s; opacity: 1; transform: none; }
.stagger-children.is-visible > *:nth-child(6) { transition-delay: .40s; opacity: 1; transform: none; }

/* ===== Navbar scroll behaviour ===== */
.bi-header { transition: box-shadow .2s ease; }
.bi-header.scrolled { box-shadow: var(--sh-2); }

/* ===== Card hover lift ===== */
.bi-card {
  transition: box-shadow .2s ease, transform .2s ease;
}
.bi-card:hover {
  box-shadow: var(--sh-3);
  transform: translateY(-2px);
}

/* ===== Pillar card icon bounce ===== */
.pillar-card:hover .pillar-icon {
  transform: scale(1.1) rotate(-4deg);
  transition: transform .25s ease;
}
.pillar-icon {
  transition: transform .25s ease;
}

/* ===== Button press ===== */
.bi-btn:active { transform: scale(.97); }

/* ===== Newsletter input focus glow ===== */
.newsletter-input:focus {
  outline: none;
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}

/* ===== Pulse badge (hero card) ===== */
@keyframes pulse-dot {
  0%, 100% { opacity: 1; }
  50%       { opacity: .4; }
}
.pulse-dot { animation: pulse-dot 2s ease-in-out infinite; }

/* ===== Fade in page ===== */
@keyframes page-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.page-wrapper { animation: page-in .3s ease forwards; }

/* ===== Skeleton loading shimmer (future use) ===== */
@keyframes shimmer {
  from { background-position: -400px 0; }
  to   { background-position: 400px 0; }
}
.skeleton {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 400px 100%;
  animation: shimmer 1.4s infinite linear;
  border-radius: var(--r-sm);
}