/* Animaciones CEGAHO — activadas con html.has-animations */

@keyframes cegaho-fade-up {
  from {
    opacity: 0;
    transform: translateY(32px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes cegaho-hero-title {
  from {
    opacity: 0;
    transform: translateY(42px);
    filter: blur(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

@keyframes cegaho-hero-image-in {
  from {
    opacity: 0;
    transform: translateX(48px) scale(1.07);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

@keyframes cegaho-hero-card-in {
  from {
    opacity: 0;
    transform: translateY(36px) translateX(24px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) translateX(0) scale(1);
  }
}

@keyframes cegaho-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@keyframes cegaho-orb-drift {
  0%, 100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.55;
  }
  50% {
    transform: translate(2.5%, -2%) scale(1.08);
    opacity: 0.85;
  }
}

@keyframes cegaho-shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

@keyframes cegaho-bounce-in {
  0% {
    opacity: 0;
    transform: translateY(48px) scale(0.94);
  }
  65% {
    transform: translateY(-8px) scale(1.02);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes cegaho-scale-in {
  from {
    opacity: 0;
    transform: scale(1.06);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes cegaho-hero-glow {
  0%, 100% { opacity: 0.82; }
  50% { opacity: 0.96; }
}

@keyframes cegaho-page-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes cegaho-pulse-ring {
  0%, 100% { box-shadow: 0 0 0 0 rgba(111, 163, 240, 0); }
  50% { box-shadow: 0 0 0 6px rgba(111, 163, 240, 0.12); }
}

/* Entrada de página */
html.has-animations body {
  animation: cegaho-page-in 0.5s ease;
}

/* Hero — ambiente */
html.has-animations .hero {
  position: relative;
}

html.has-animations .hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(circle at 18% 28%, rgba(111, 163, 240, 0.28), transparent 42%),
    radial-gradient(circle at 82% 72%, rgba(27, 79, 168, 0.22), transparent 38%),
    radial-gradient(circle at 55% 15%, rgba(255, 255, 255, 0.06), transparent 30%);
  animation: cegaho-orb-drift 10s ease-in-out infinite;
}

html.has-animations .hero::before {
  animation: cegaho-hero-glow 6s ease-in-out infinite;
}

/* Hero — textos */
html.has-animations .hero .eyebrow,
html.has-animations .hero .hero-lead,
html.has-animations .hero h1,
html.has-animations .hero > .container > p,
html.has-animations .hero-grid > div > p,
html.has-animations .hero-copy,
html.has-animations .hero-card,
html.has-animations .hero-portrait,
html.has-animations .hero-actions .btn,
html.has-animations .image-mosaic {
  opacity: 0;
}

html.has-animations .hero .eyebrow,
html.has-animations .hero .hero-lead,
html.has-animations .hero > .container > p,
html.has-animations .hero-grid > div > p,
html.has-animations .hero-copy,
html.has-animations .hero-actions .btn {
  transform: translateY(28px);
}

html.has-animations .hero h1 {
  transform: translateY(42px);
  filter: blur(10px);
}

html.has-animations .hero .hero-card {
  opacity: 0;
  transform: translateY(36px) scale(0.96);
}

html.has-animations .hero.is-hero-ready .eyebrow {
  animation:
    cegaho-fade-up 0.75s cubic-bezier(0.34, 1.35, 0.64, 1) 0.05s forwards,
    cegaho-pulse-ring 3s ease-in-out 1.2s infinite;
}

html.has-animations .hero.is-hero-ready .hero-lead {
  animation: cegaho-fade-up 0.75s cubic-bezier(0.34, 1.35, 0.64, 1) 0.1s forwards;
}

html.has-animations .hero.is-hero-ready h1 {
  animation: cegaho-hero-title 1s cubic-bezier(0.22, 1, 0.36, 1) 0.14s forwards;
}

html.has-animations .hero.is-hero-ready > .container > p,
html.has-animations .hero.is-hero-ready .hero-grid > div > p,
html.has-animations .hero.is-hero-ready .hero-copy {
  animation: cegaho-fade-up 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.26s forwards;
}

html.has-animations .hero.is-hero-ready .hero-actions .btn:nth-child(1) {
  animation: cegaho-fade-up 0.7s cubic-bezier(0.34, 1.45, 0.64, 1) 0.36s forwards;
}

html.has-animations .hero.is-hero-ready .hero-actions .btn:nth-child(2) {
  animation: cegaho-fade-up 0.7s cubic-bezier(0.34, 1.45, 0.64, 1) 0.44s forwards;
}

html.has-animations .hero.is-hero-ready .hero-actions .btn:nth-child(3) {
  animation: cegaho-fade-up 0.7s cubic-bezier(0.34, 1.45, 0.64, 1) 0.52s forwards;
}

html.has-animations .hero.is-hero-ready .hero-actions .btn:nth-child(4) {
  animation: cegaho-fade-up 0.7s cubic-bezier(0.34, 1.45, 0.64, 1) 0.6s forwards;
}

html.has-animations .hero.is-hero-ready .hero-actions .btn:nth-child(5) {
  animation: cegaho-fade-up 0.7s cubic-bezier(0.34, 1.45, 0.64, 1) 0.68s forwards;
}

/* Hero — no mezclar reveal-scale con animación de entrada */
html.has-animations .hero .hero-image-card.reveal-scale,
html.has-animations .hero .hero-floating-card.reveal-scale {
  opacity: 1;
  transform: none;
  transition: none;
}

/* Hero — imagen principal */
html.has-animations .hero .hero-image-card,
html.has-animations .hero .hero-portrait {
  opacity: 0;
  transform: translateX(48px) scale(1.07);
}

html.has-animations .hero.is-hero-ready .hero-image-card,
html.has-animations .hero.is-hero-ready .hero-portrait {
  animation:
    cegaho-hero-image-in 1.05s cubic-bezier(0.22, 1, 0.36, 1) 0.22s forwards,
    cegaho-float 7s ease-in-out 1.5s infinite;
}

html.has-animations .hero .hero-floating-card {
  opacity: 0;
  transform: translateY(36px) translateX(24px) scale(0.96);
}

html.has-animations .hero.is-hero-ready .hero-floating-card {
  animation: cegaho-hero-card-in 0.9s cubic-bezier(0.34, 1.4, 0.64, 1) 0.58s forwards;
}

html.has-animations .hero.is-hero-ready .hero-card {
  animation: cegaho-hero-card-in 0.9s cubic-bezier(0.34, 1.4, 0.64, 1) 0.4s forwards;
}

html.has-animations .hero .image-mosaic {
  opacity: 0;
  transform: scale(1.06);
}

html.has-animations .hero.is-hero-ready .image-mosaic {
  animation: cegaho-scale-in 1s cubic-bezier(0.22, 1, 0.36, 1) 0.3s forwards;
}

/* Scroll reveal — más presencia */
html.has-animations .reveal {
  opacity: 0;
  transform: translateY(44px);
  transition:
    opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.8s cubic-bezier(0.34, 1.2, 0.64, 1);
  transition-delay: var(--reveal-delay, 0s);
}

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

html.has-animations .section-header.reveal.is-visible .section-title {
  animation: cegaho-fade-up 0.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

html.has-animations .reveal-scale {
  opacity: 0;
  transform: scale(1.08) translateY(20px);
  transition:
    opacity 0.9s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.9s cubic-bezier(0.34, 1.15, 0.64, 1);
  transition-delay: var(--reveal-delay, 0s);
}

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

/* Nav */
html.has-animations .site-nav {
  transition:
    box-shadow 0.35s ease,
    background-color 0.35s ease,
    transform 0.35s ease;
}

html.has-animations .site-nav.is-scrolled {
  box-shadow: 0 14px 40px rgba(10, 15, 30, 0.1);
}

/* Tarjetas */
html.has-animations .card,
html.has-animations .mini-card,
html.has-animations .service-card,
html.has-animations .conference-card,
html.has-animations .format-card,
html.has-animations .audience-card,
html.has-animations .experience-card,
html.has-animations .workline {
  transition:
    transform 0.4s cubic-bezier(0.34, 1.2, 0.64, 1),
    box-shadow 0.4s ease,
    border-color 0.4s ease;
}

html.has-animations .card:hover,
html.has-animations .mini-card:hover,
html.has-animations .service-card:hover,
html.has-animations .conference-card:hover,
html.has-animations .format-card:hover,
html.has-animations .experience-card:hover,
html.has-animations .workline:hover {
  transform: translateY(-10px) scale(1.01);
  box-shadow: 0 28px 70px rgba(10, 15, 30, 0.16);
}

html.has-animations .service-card:hover {
  transform: translateY(-10px) scale(1.02);
}

/* Botones */
html.has-animations .btn {
  position: relative;
  overflow: hidden;
  transition:
    transform 0.32s cubic-bezier(0.34, 1.3, 0.64, 1),
    box-shadow 0.32s ease,
    background-color 0.32s ease,
    color 0.32s ease;
}

html.has-animations .btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    transparent 40%,
    rgba(255, 255, 255, 0.35) 50%,
    transparent 60%
  );
  background-size: 220% 100%;
  opacity: 0;
  transition: opacity 0.3s ease;
}

html.has-animations .btn:hover {
  transform: translateY(-4px) scale(1.04);
  box-shadow: 0 18px 40px rgba(27, 79, 168, 0.28);
}

html.has-animations .btn:hover::after {
  opacity: 1;
  animation: cegaho-shimmer 0.75s ease;
}

html.has-animations .btn-primary:hover {
  box-shadow: 0 18px 40px rgba(10, 15, 30, 0.22);
}

/* Contact box */
html.has-animations .contact-box.is-visible {
  animation: cegaho-bounce-in 0.9s cubic-bezier(0.34, 1.2, 0.64, 1) both;
}

html.has-animations .contact-box {
  transition: box-shadow 0.4s ease, transform 0.4s ease;
}

html.has-animations .contact-box:hover {
  transform: translateY(-4px);
  box-shadow: 0 32px 80px rgba(10, 15, 30, 0.2);
}

html.has-animations .contact-item {
  transition:
    transform 0.35s cubic-bezier(0.34, 1.2, 0.64, 1),
    background-color 0.35s ease;
}

html.has-animations .contact-item:hover {
  transform: translateY(-5px) scale(1.02);
  background: rgba(255, 255, 255, 0.14);
}

/* Stats */
html.has-animations .stats-panel {
  animation: cegaho-bounce-in 1s cubic-bezier(0.34, 1.25, 0.64, 1) 0.5s both;
}

html.has-animations .stat-item.is-visible {
  animation: cegaho-fade-up 0.65s cubic-bezier(0.34, 1.3, 0.64, 1) both;
  animation-delay: var(--reveal-delay, 0s);
}

html.has-animations .stat-item strong {
  display: inline-block;
}

/* Footer */
html.has-animations .footer-brand,
html.has-animations .footer-column {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.65s cubic-bezier(0.34, 1.15, 0.64, 1);
  transition-delay: var(--reveal-delay, 0s);
}

html.has-animations .footer-brand.is-visible,
html.has-animations .footer-column.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  html.has-animations body,
  html.has-animations .hero::before,
  html.has-animations .hero::after,
  html.has-animations .hero.is-hero-ready *,
  html.has-animations .stats-panel,
  html.has-animations .contact-box.is-visible,
  html.has-animations .stat-item.is-visible {
    animation: none !important;
    transition: none !important;
    filter: none !important;
  }

  html.has-animations .reveal,
  html.has-animations .reveal-scale,
  html.has-animations .footer-brand,
  html.has-animations .footer-column {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  html.has-animations .btn::after {
    display: none;
  }
}