/* ── COOL SCROLL EFFECTS ─────────────────────────────────────── */

/* 1. Section reveals */
.reveal-left {
  opacity: 0;
  transform: translate3d(-40px, 0, 0);
  transition: opacity .7s ease-out, transform .7s ease-out;
}
.reveal-left.visible { opacity: 1; transform: translate3d(0,0,0); }

.reveal-right {
  opacity: 0;
  transform: translate3d(40px, 0, 0);
  transition: opacity .7s ease-out, transform .7s ease-out;
}
.reveal-right.visible { opacity: 1; transform: translate3d(0,0,0); }

.reveal-scale {
  opacity: 0;
  transform: scale(0.92);
  transition: opacity .7s ease-out, transform .7s ease-out;
}
.reveal-scale.visible { opacity: 1; transform: scale(1); }

/* 2. Section title reveal — use opacity+translate instead of clip-path */
.title-reveal {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition: opacity .7s ease-out, transform .7s ease-out;
}
.title-reveal.visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* 3. Decorative underline */
.line-draw { position: relative; }
.line-draw::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 80px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  transition: transform .8s ease-out .2s;
  transform-origin: center;
}
.line-draw.visible::after {
  transform: translateX(-50%) scaleX(1);
}

/* 4. Trust strip counter glow */
.trust-num {
  transition: transform .5s ease-out;
}
.trust-num.counted {
  text-shadow: 0 0 20px rgba(196,162,101,.25);
}

/* 5. Photo strip hover */
.photo-strip-item {
  transition: transform .4s ease-out;
  will-change: transform;
}
.photo-strip-item:hover {
  transform: translateY(-6px);
}
.photo-strip-item img {
  transition: transform .6s ease-out, filter .6s ease-out !important;
}

/* 6. Hero content entrance */
@keyframes heroFadeUp {
  from { opacity: 0; transform: translate3d(0, 30px, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}
.hero-content > * {
  opacity: 0;
  animation: heroFadeUp .7s ease-out forwards;
}
.hero-content > *:nth-child(1) { animation-delay: .15s; }
.hero-content > *:nth-child(2) { animation-delay: .35s; }
.hero-content > *:nth-child(3) { animation-delay: .55s; }
.hero-content > *:nth-child(4) { animation-delay: .75s; }
.hero-content > *:nth-child(5) { animation-delay: .95s; }

/* 7. GPU layers for parallax elements */
.hero-video, .hero-bg {
  will-change: transform;
  backface-visibility: hidden;
}
.hero-content {
  will-change: opacity, transform;
  backface-visibility: hidden;
}
.section-bg-img {
  will-change: transform;
  backface-visibility: hidden;
}

/* 8. Card hover — no !important to avoid fighting JS */
.card, .staff-card, .news-item, .emergency-card {
  transition: transform .35s ease-out, box-shadow .35s ease-out;
}
.card:hover, .news-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0,0,0,.07);
}

/* 9. CTA shine */
.hero-cta {
  position: relative;
  overflow: hidden;
}
.hero-cta::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.2), transparent);
  animation: btnShine 5s ease-in-out infinite;
}
@keyframes btnShine {
  0%, 100% { left: -100%; }
  50% { left: 150%; }
}

/* 10. Scroll progress bar */
.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 0%;
  height: 3px;
  background: linear-gradient(90deg, var(--gold), var(--accent));
  z-index: 9999;
  pointer-events: none;
  will-change: transform;
  transform-origin: left;
}

/* 11. Photo strip */
.photo-strip { overflow: hidden; }

/* 12. Section label entrance */
.section-label {
  opacity: 0;
  transform: translate3d(0, 12px, 0);
  transition: opacity .5s ease-out .1s, transform .5s ease-out .1s;
}
.reveal.visible .section-label,
.section-label.visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* 13. Trust number pop */
@keyframes numberPop {
  0%   { transform: scale(0.6); opacity: 0; }
  70%  { transform: scale(1.05); }
  100% { transform: scale(1); opacity: 1; }
}
.trust-num.pop {
  animation: numberPop .5s ease-out forwards;
}

/* Staff card tilt — GPU optimized */
.staff-card {
  will-change: transform;
  backface-visibility: hidden;
  transition: transform .3s ease-out;
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  .scroll-progress { display: none; }
}