/* Custom CSS Styles */
body { 
    background-color: #F5EFE6; 
    scroll-behavior: smooth; 
    -webkit-tap-highlight-color: transparent;
    overflow-x: hidden;
}

input, select, textarea { font-size: 16px !important; text-align: right; }

.hero-gradient {
    background: linear-gradient(to bottom, rgba(245, 239, 230, 0.4) 0%, rgba(245, 239, 230, 1) 90%);
}

.fade-in-up { animation: fadeInUp 0.8s ease-out forwards; }
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.sticky-cta { transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.hidden-popup { display: none !important; }

.timer-unit {
    background: #ffffff;
    border: 1px solid rgba(198, 167, 94, 0.1);
}

@keyframes auto-vibrate {
    0%, 70%, 100% { transform: scale(1) rotate(0); }
    75% { transform: scale(1.05) rotate(-1deg); }
    80% { transform: scale(1.05) rotate(1deg); }
    85% { transform: scale(1.05) rotate(-1deg); }
    90% { transform: scale(1.05) rotate(1deg); }
    95% { transform: scale(1.05) rotate(0); }
}
.vibrate-periodic {
    animation: auto-vibrate 3s infinite cubic-bezier(.36,.07,.19,.97);
}

.marquee-wrapper {
    display: flex;
    width: fit-content;
}

/* Shine effect */
.btn-shine {
  position: relative;
  overflow: hidden;
}

.btn-shine::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    to bottom right,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0) 40%,
    rgba(255, 255, 255, 0.4) 50%,
    rgba(255, 255, 255, 0) 60%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: rotate(45deg);
  animation: shine 5s infinite linear;
}

@keyframes shine {
  0% { transform: translateX(-100%) rotate(45deg); }
  20%, 100% { transform: translateX(100%) rotate(45deg); }
}

.spinner {
  width: 20px;
  height: 20px;
  border: 3px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}