@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@keyframes marqueeRev {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}

.marquee__track {
  animation: marquee 28s linear infinite;
}
.marquee-bar:hover .marquee__track {
  animation-play-state: paused;
}

@keyframes heroReveal {
  from { opacity: 0; transform: translateY(40px); }
  to   { opacity: 1; transform: none; }
}

.hero__heading {
  animation: heroReveal 1.1s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
}

.hero__eyebrow {
  animation: heroReveal 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.05s both;
}

.hero__reel-btn {
  animation: heroReveal 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both;
}

.hero__scroll-hint {
  animation: heroReveal 0.6s cubic-bezier(0.16, 1, 0.3, 1) 0.6s both;
}

@keyframes navIn {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: none; }
}

.nav {
  animation: navIn 0.5s var(--ease) 0.1s both;
}

.work__card {
  transition:
    opacity   0.6s var(--ease),
    transform 0.6s var(--ease);
}
.work__card.reveal {
  opacity: 0;
  transform: translateY(20px);
}
.work__card.reveal.in {
  opacity: 1;
  transform: none;
}
.work__card:nth-child(1) { transition-delay: 0s; }
.work__card:nth-child(2) { transition-delay: 0.1s; }
.work__card:nth-child(3) { transition-delay: 0.2s; }
.work__card:nth-child(4) { transition-delay: 0.3s; }

.services__item::after {
  content: '↗';
  font-size: 1.1rem;
  color: var(--accent);
  opacity: 0;
  transition: opacity var(--t2), transform var(--t2) var(--ease);
  transform: translateX(-4px);
  grid-column: 3;
  align-self: center;
}

@media (max-width: 600px) {
  .services__item::after { display: none; }
}

.services__item:hover::after {
  opacity: 1;
  transform: none;
}

@keyframes pillPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0.4); }
  50%       { box-shadow: 0 0 0 8px rgba(255,255,255,0); }
}
.btn--pill:focus-visible {
  animation: pillPulse 1.5s ease infinite;
  outline: none;
}

.tag { transition: opacity 0.9s var(--ease); }

@keyframes countUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}
.stats-strip__num {
  animation: countUp 0.6s var(--ease) both;
}
.stats-strip__item:nth-child(1) .stats-strip__num { animation-delay: 0s; }
.stats-strip__item:nth-child(2) .stats-strip__num { animation-delay: 0.08s; }
.stats-strip__item:nth-child(3) .stats-strip__num { animation-delay: 0.16s; }
.stats-strip__item:nth-child(4) .stats-strip__num { animation-delay: 0.24s; }

@keyframes scrollLine {
  0%   { transform: translateY(0) scaleY(1); opacity: 1; }
  100% { transform: translateY(24px) scaleY(0.4); opacity: 0; }
}

.clients__item {
  animation: none;
  transition: background var(--t1), color var(--t1);
}

.team-card {
  transition:
    background   var(--t2) var(--ease),
    transform    var(--t2) var(--ease),
    border-color var(--t2);
}
.team-card:hover { transform: translateY(-3px); }

@keyframes iconReveal {
  from {
    opacity: 0;
    transform: scale(0.65) rotate(-10deg);
  }
  to {
    opacity: 0.055;
    transform: scale(1) rotate(0deg);
  }
}
.values__icon-bg {
  transform-origin: bottom right;
}
.values__item.in .values__icon-bg {
  animation: iconReveal 1s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both;
}

@keyframes raysOn {
  0%, 30%   { fill: rgba(240, 242, 244, 0.18); }
  50%, 72%  { fill: #ffe566; }
  88%, 100% { fill: rgba(240, 242, 244, 0.18); }
}
@keyframes bulbGlow {
  0%, 30%   { filter: none; }
  50%, 72%  {
    filter:
      drop-shadow(0 0 8px  rgba(255, 220, 0, 0.9))
      drop-shadow(0 0 24px rgba(255, 185, 0, 0.75))
      drop-shadow(0 0 55px rgba(255, 150, 0, 0.45));
  }
  88%, 100% { filter: none; }
}
.footer__bulb            { animation: bulbGlow 4s ease-in-out infinite; }
.footer__bulb .logo-rays { animation: raysOn  4s ease-in-out infinite; }

@keyframes workDotFill {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

@keyframes logoPendulum {
  0%   { transform: rotate(-24deg); }
  15%  { transform: rotate( 14deg); }
  27%  { transform: rotate( -8deg); }
  37%  { transform: rotate(  4.5deg);}
  46%  { transform: rotate( -2.2deg);}
  54%  { transform: rotate(  1.1deg);}
  62%  { transform: rotate( -0.5deg);}
  70%  { transform: rotate(  0.2deg);}
  80%  { transform: rotate(  0deg);  }
  100% { transform: rotate(  0deg);  }
}

@keyframes logoBreath {
  0%, 100% { filter:
    drop-shadow(0 0 6px rgba(255,220,0,1))
    drop-shadow(0 0 18px rgba(255,185,0,.85))
    drop-shadow(0 0 40px rgba(255,150,0,.55))
    drop-shadow(0 0 70px rgba(255,120,0,.25)); }
  50%      { filter:
    drop-shadow(0 0 3px rgba(255,210,0,.5))
    drop-shadow(0 0 10px rgba(255,185,0,.35)); }
}

.nav__logo--swing {
  animation: logoPendulum 2s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}
.nav__logo--lit .logo-rays {
  animation: logoBreath 2.8s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  .hero__heading,
  .hero__eyebrow,
  .hero__reel-btn,
  .hero__scroll-hint,
  .nav,
  .reveal,
  .work__card,
  .stats-strip__num {
    animation: none !important;
    transition-duration: 0.01s !important;
  }
  .marquee__track { animation-duration: 0.01s !important; }
  .values__icon-bg { animation: none !important; opacity: 0.055 !important; }
  .footer__bulb { animation: none !important; }
  .footer__bulb .logo-rays { animation: none !important; fill: rgba(240,242,244,0.5) !important; }
  .work__dot-fill { animation: none !important; transform: scaleX(1) !important; }
  .nav__logo .logo-svg--swing   { animation: none !important; transform: none !important; }
  .nav__logo--lit .logo-rays    { animation: none !important; }
  .nav__logo--lit .logo-bulb    { animation: none !important; }
}