/* ===== Header Entrance ===== */
@keyframes headerSlideIn {
  from { transform: translateY(-60px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.header-entrance {
  animation: headerSlideIn 0.4s ease-out forwards;
}

/* ===== Marquee (Logo Wall) ===== */
@keyframes marqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.marquee-anim {
  animation: marqueeScroll 30s linear infinite;
}
.marquee-wrapper:hover .marquee-anim {
  animation-play-state: paused;
}

/* ===== News Ticker Marquee ===== */
@keyframes tickerScroll {
  from { transform: translateX(100%); }
  to { transform: translateX(-100%); }
}
.ticker-anim {
  animation: tickerScroll 20s linear infinite;
}

/* ===== Banner Text Entry ===== */
@keyframes bannerTextUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.banner-text-title {
  animation: bannerTextUp 500ms 100ms both;
}
.banner-text-sub {
  animation: bannerTextUp 500ms 250ms both;
}
.banner-text-btn {
  animation: bannerTextUp 500ms 400ms both;
}

/* ===== Quick Actions Entrance ===== */
@keyframes quickActionsUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.quick-actions-entrance {
  animation: quickActionsUp 0.5s 0.3s both;
}

/* ===== Skeleton shimmer for placeholders ===== */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.img-placeholder {
  background-size: 200% 100%;
  animation: shimmer 2s infinite;
}

/* ===== Pulse (for loading states) ===== */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}