/* === Entrance Animation === */
@keyframes slide-in {
  from { transform: translateY(-20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.offer-banner {
  animation: slide-in 0.8s ease-out;
}

/* === Text shimmer / glow animation === */
@keyframes text-shimmer {
  0% {
    opacity: 1;
    transform: translateY(0);
    filter: brightness(1);
    text-shadow: 0 0 6px rgba(235, 160, 48, 0.3);
  }
  50% {
    opacity: 0.85;
    transform: translateY(-1px);
    filter: brightness(1.5);
    text-shadow: 0 0 16px rgba(235, 160, 48, 0.8);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    filter: brightness(1);
    text-shadow: 0 0 6px rgba(235, 160, 48, 0.3);
  }
}

/* === Arrow movement animation === */
@keyframes move-forward-back {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(8px); }
}

.animate-offer-text {
  animation: text-shimmer 2s ease-in-out infinite;
}

.animate-arrow {
  animation: move-forward-back 1.2s ease-in-out infinite;
  display: inline-flex;
}

/* === Responsive improvements === */
@media (max-width: 1024px) {
  .offer-banner-content {
    flex-direction: column;
    text-align: center;
    gap: 0.75rem;
  }

  .offer-banner-text {
    font-size: 1rem;
    flex-wrap: wrap;
    justify-content: center;
  }

  .offer-banner-btn {
    padding: 0.5rem 1.25rem;
    font-size: 0.95rem;
  }
}

@media (max-width: 640px) {
  .offer-banner {
    padding: 0.6rem 1rem;
    border-radius: 0;
  }

  .offer-banner-text {
    font-size: 0.9rem;
    gap: 0.4rem;
  }

  .offer-banner-btn {
    font-size: 0.85rem;
    padding: 0.4rem 1rem;
  }

  /* Rotate arrow ↓ only on mobile and adjust animation vertically */
  .arrow-icon svg {
    transform: rotate(360deg);
  }

  @keyframes move-forward-back {
    0%, 100% { transform: translateY(0) rotate(90deg); }
    50% { transform: translateY(6px) rotate(90deg); }
  }
}
