/* ============================================================
   ANIMATIONS — Casa Lobo Cigars
   ============================================================ */

/* ── Reveal Base States ── */
.reveal-up {
  opacity: 0;
  transform: translateY(40px);
}

.reveal-up.is-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s var(--ease-out-expo), transform 0.8s var(--ease-out-expo);
}

.reveal-grid {
  opacity: 0;
  transform: translateY(30px);
}

.reveal-grid.is-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.6s var(--ease-out-expo), transform 0.6s var(--ease-out-expo);
}

/* ── Nav scrolled ── */
#nav {
  transition: background 200ms ease, box-shadow 200ms ease;
}

/* ── Section entry clip ── */
.section-outreach {
  clip-path: inset(0);
}

/* ── Stats counter ── */
.stat-number {
  transition: none;
}

/* ── Grid stagger delays ── */
.outreach-card:nth-child(1) { transition-delay: 0.00s; }
.outreach-card:nth-child(2) { transition-delay: 0.08s; }
.outreach-card:nth-child(3) { transition-delay: 0.16s; }
.outreach-card:nth-child(4) { transition-delay: 0.24s; }
.outreach-card:nth-child(5) { transition-delay: 0.32s; }
.outreach-card:nth-child(6) { transition-delay: 0.40s; }

/* ── Pairing item stagger ── */
.sustain-item:nth-child(1) { transition-delay: 0.00s; }
.sustain-item:nth-child(2) { transition-delay: 0.07s; }
.sustain-item:nth-child(3) { transition-delay: 0.14s; }
.sustain-item:nth-child(4) { transition-delay: 0.21s; }
.sustain-item:nth-child(5) { transition-delay: 0.28s; }
.sustain-item:nth-child(6) { transition-delay: 0.35s; }

/* ── Craft section reveal stagger ── */
.services-right .reveal-up:nth-child(1) { transition-delay: 0.0s; }
.services-right .reveal-up:nth-child(2) { transition-delay: 0.1s; }
.services-right .reveal-up:nth-child(3) { transition-delay: 0.2s; }

/* ── Mobile nav link stagger ── */
.nav-mobile-link.is-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

/* ── Focus visible ── */
:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
}

/* ── Hero mini-carousel smooth fade ── */
.hero-card {
  transition: opacity 0.4s ease, border-color 0.4s ease, transform 0.4s ease;
}

/* ── Gate logo breathe (subtle) ── */
@keyframes wolfBreath {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.022); }
}

.gate-mark img {
  animation: wolfBreath 5s ease-in-out infinite;
}
