/* the switch. — animations.css v3.1 */

/* ── Hero entrance ───────────────────────────────────── */
.hero-content {
  animation: heroIn .6s cubic-bezier(.25,.46,.45,.94) .1s both;
}
@keyframes heroIn {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Reveal system ───────────────────────────────────── */
.anim {
  opacity: 0; transform: translateY(20px);
  transition: opacity .5s cubic-bezier(.25,.46,.45,.94),
              transform .5s cubic-bezier(.25,.46,.45,.94);
}
.anim-fade {
  opacity: 0;
  transition: opacity .5s cubic-bezier(.25,.46,.45,.94);
}
.anim-scale {
  opacity: 0; transform: scale(.97);
  transition: opacity .5s cubic-bezier(.25,.46,.45,.94),
              transform .5s cubic-bezier(.25,.46,.45,.94);
}
.anim-left {
  opacity: 0; transform: translateX(-24px);
  transition: opacity .5s cubic-bezier(.25,.46,.45,.94),
              transform .5s cubic-bezier(.25,.46,.45,.94);
}
.anim.visible, .anim-fade.visible,
.anim-scale.visible, .anim-left.visible {
  opacity: 1; transform: none;
}

/* ── Nav transitions ─────────────────────────────────── */
.nav {
  transition: transform .3s cubic-bezier(.4,0,.2,1),
              background .25s, box-shadow .25s;
}
.nav.nav-scrolled {
  background: rgba(247,244,239,.98);
  box-shadow: 0 1px 0 var(--rule);
}
.nav.nav-tucked { transform: translateY(-100%); }

/* Nav link underline sweep */
.nav-links a { position: relative; }
.nav-links a::after {
  content: ''; position: absolute;
  bottom: -3px; left: 0;
  height: 1px; width: 0;
  background: var(--orange);
  transition: width .2s cubic-bezier(.25,.46,.45,.94);
}
.nav-links a:hover::after { width: 100%; }

/* ── Button shimmer ──────────────────────────────────── */
.btn-primary { position: relative; overflow: hidden; }
.btn-primary::after {
  content: ''; position: absolute; inset: 0;
  background: rgba(255,255,255,.08);
  transform: translateX(-105%);
  transition: transform .3s cubic-bezier(.25,.46,.45,.94);
}
.btn-primary:hover::after { transform: translateX(0); }

/* Magnetic */
.btn-mag { transition: transform .3s cubic-bezier(.25,.46,.45,.94); }

/* ── Ticker ──────────────────────────────────────────── */
.ticker-inner { animation: ticker 30s linear infinite; }
.ticker-inner:hover { animation-play-state: paused; }
@keyframes ticker { to { transform: translateX(-50%); } }

/* ── Image reveals ───────────────────────────────────── */
img.img-fade { opacity: 0; transition: opacity .5s ease; }
img.img-fade.visible { opacity: 1; }

/* ── Persona orange bar ──────────────────────────────── */
.persona::after {
  content: ''; position: absolute;
  bottom: 0; left: 0; right: 0; height: 2px;
  background: var(--orange);
  transform: scaleX(0); transform-origin: left;
  transition: transform .3s cubic-bezier(.25,.46,.45,.94);
}
.persona:hover::after { transform: scaleX(1); }

/* ── Reduced motion ──────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  #sw-loader, .hero-content,
  .anim, .anim-fade, .anim-scale, .anim-left {
    animation: none !important; transition: none !important;
    opacity: 1 !important; transform: none !important;
  }
}
