/* ═══════════════════════════════════════════
   ANIMATIONS — Eje Cafetero Investment Consulting
   Solo animaciones esenciales y premium
═══════════════════════════════════════════ */

/* ── INTRO DE MARCA — "The Curtain" ── */
#brand-intro {
  position: fixed;
  inset: 0;
  z-index: var(--z-intro);
  background: #0e2519;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 18px;
  pointer-events: none;
}
#brand-intro.exiting {
  animation: introExit .55s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes introExit {
  from { opacity: 1; transform: none; }
  to   { opacity: 0; transform: translateY(-16px); }
}
#brand-intro.hidden { display: none; }

.intro-mark {
  opacity: 0;
  transform: translateY(18px);
  animation: introMark .55s .1s cubic-bezier(.2,.8,.3,1) forwards;
}
@keyframes introMark {
  to { opacity: 1; transform: translateY(0); }
}
.intro-bar {
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--oro), transparent);
  animation: introBar .5s .35s ease forwards;
}
@keyframes introBar {
  to { width: 100px; }
}
.intro-text {
  opacity: 0;
  transform: translateY(8px);
  animation: introText .45s .52s ease forwards;
  text-align: center;
}
@keyframes introText {
  to { opacity: 1; transform: translateY(0); }
}
.intro-name {
  display: block;
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--crema);
  letter-spacing: 4px;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.intro-sub {
  display: block;
  font-family: var(--font-body);
  font-size: 10px;
  color: var(--oro-claro);
  letter-spacing: 6px;
  text-transform: uppercase;
}

/* ── HERO animations ── */
.hero-animate {
  opacity: 0;
  transform: translateY(22px);
  animation: heroIn .7s ease forwards;
}
.hero-animate.d1 { animation-delay: .15s; }
.hero-animate.d2 { animation-delay: .3s; }
.hero-animate.d3 { animation-delay: .45s; }
.hero-animate.d4 { animation-delay: .6s; }
.hero-animate.d5 { animation-delay: .75s; }
@keyframes heroIn {
  to { opacity: 1; transform: translateY(0); }
}

/* ── STAT counters ── */
.stat-block strong {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(30px, 3vw, 40px);
  font-weight: 700;
  line-height: 1;
}

/* ── NAV link underline (refuerzo) ── */
@keyframes navLine {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

/* ── Scroll-triggered bar expand ── */
.gold-bar {
  animation: barExpand .8s cubic-bezier(.4,0,.2,1) both;
}
@keyframes barExpand {
  from { width: 0; opacity: 0; }
  to   { opacity: 1; }
}

/* ── Card hover micro-lift (reinforcement) ── */
.svc-card,
.trust-card,
.zone-card {
  will-change: transform;
}

/* ── Blink dot (live indicator) ── */
@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: .25; }
}
.dot-live {
  display: inline-block;
  width: 7px; height: 7px;
  background: #52b788;
  border-radius: 50%;
  animation: blink 2s infinite;
}