/* =========================================================
   CONATROL — Animaciones (sutil, premium, sin exageraciones)
   ========================================================= */

/* Reveal */
[data-reveal] {
  opacity: 1;
  transform: none;
  transition: opacity 0.75s var(--ease), transform 0.75s var(--ease);
  will-change: opacity, transform;
}
[data-reveal="left"]  { transform: none; }
[data-reveal="right"] { transform: none; }
[data-reveal="fade"]  { transform: none; }
[data-reveal].is-visible { opacity: 1; transform: none; }

/* Stagger natural en grids */
.services-grid [data-reveal]:nth-child(1) { transition-delay: 0.05s; }
.services-grid [data-reveal]:nth-child(2) { transition-delay: 0.10s; }
.services-grid [data-reveal]:nth-child(3) { transition-delay: 0.15s; }
.services-grid [data-reveal]:nth-child(4) { transition-delay: 0.20s; }
.services-grid [data-reveal]:nth-child(5) { transition-delay: 0.25s; }
.services-grid [data-reveal]:nth-child(6) { transition-delay: 0.30s; }
.projects-grid [data-reveal]:nth-child(2),
.values-grid   [data-reveal]:nth-child(2),
.gallery       [data-reveal]:nth-child(2) { transition-delay: 0.08s; }
.projects-grid [data-reveal]:nth-child(3),
.values-grid   [data-reveal]:nth-child(3),
.gallery       [data-reveal]:nth-child(3) { transition-delay: 0.16s; }
.projects-grid [data-reveal]:nth-child(4),
.values-grid   [data-reveal]:nth-child(4),
.gallery       [data-reveal]:nth-child(4) { transition-delay: 0.24s; }

/* Hero entry — sin filter blur exagerado */
.hero__tag, .hero__title, .hero__subtitle, .hero__cta, .hero__media {
  opacity: 1;
  transform: none;
}
.hero.is-loaded .hero__tag      { animation: heroIn 0.7s var(--ease) 0.10s forwards; }
.hero.is-loaded .hero__title    { animation: heroIn 0.7s var(--ease) 0.20s forwards; }
.hero.is-loaded .hero__subtitle { animation: heroIn 0.7s var(--ease) 0.32s forwards; }
.hero.is-loaded .hero__cta      { animation: heroIn 0.7s var(--ease) 0.42s forwards; }
.hero.is-loaded .hero__media    { animation: heroInRight 0.9s var(--ease) 0.30s forwards; }
@keyframes heroIn      { to { opacity: 1; transform: translateY(0); } }
@keyframes heroInRight {
  from { opacity: 0; transform: translateX(30px) scale(0.98); }
  to   { opacity: 1; transform: none; }
}

/* Page hero */
.page-hero h1, .page-hero p, .page-hero .breadcrumbs {
  opacity: 0;
  transform: translateY(16px);
  animation: heroIn 0.7s var(--ease) forwards;
}
.page-hero .breadcrumbs { animation-delay: 0.05s; }
.page-hero h1           { animation-delay: 0.20s; }
.page-hero p            { animation-delay: 0.35s; }

/* Mobile nav */
.mobile-nav {
  position: fixed;
  inset: 0;
  background: rgba(255,255,255,0.98);
  backdrop-filter: blur(16px);
  z-index: 990;
  display: flex;
  flex-direction: column;
  padding: 100px 28px 40px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity 0.3s var(--ease), transform 0.3s var(--ease), visibility 0.3s;
}
.mobile-nav.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.mobile-nav a {
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 600;
  padding: 14px 0;
  color: var(--ink);
  border-bottom: 1px solid var(--line);
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity 0.35s var(--ease), transform 0.35s var(--ease), color 0.2s;
}
.mobile-nav.is-open a { opacity: 1; transform: translateX(0); }
.mobile-nav.is-open a:nth-child(1){transition-delay:.05s}.mobile-nav.is-open a:nth-child(2){transition-delay:.10s}
.mobile-nav.is-open a:nth-child(3){transition-delay:.15s}.mobile-nav.is-open a:nth-child(4){transition-delay:.20s}
.mobile-nav.is-open a:nth-child(5){transition-delay:.25s}.mobile-nav.is-open a:nth-child(6){transition-delay:.30s}
.mobile-nav a:hover { color: var(--teal-dark); }
.mobile-nav__cta {
  margin-top: 24px;
  opacity: 0;
  transition: opacity 0.4s var(--ease) 0.35s;
}
.mobile-nav.is-open .mobile-nav__cta { opacity: 1; }

/* Counter visual subtle */
.counter { display: inline-block; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
  [data-reveal] { opacity: 1; transform: none; }
  .hero__tag, .hero__title, .hero__subtitle, .hero__cta, .hero__media { opacity: 1; transform: none; }
}
