/* Acro Paints custom styles */
.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

html { scroll-behavior: smooth; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #c7c7c7; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #a0a0a0; }

@keyframes bounce-in {
  0% { transform: translateY(20px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}
.animate-bounce-in { animation: bounce-in 0.3s ease-out; }

input:focus, textarea:focus, select:focus { outline: none; }

/* ===== Running headlines marquee ===== */
.marquee-viewport { position: relative; }
.marquee-track {
  display: inline-block;
  will-change: transform;
  animation: marquee-scroll 30s linear infinite;
}
.marquee-track:hover { animation-play-state: paused; }
.marquee-track .headline-item { display: inline-block; padding: 0 2.5rem; position: relative; }
.marquee-track .headline-item::after {
  content: "\2022";
  position: absolute; right: 0; top: 50%; transform: translateY(-50%);
  color: rgba(255,255,255,0.35);
}
@keyframes marquee-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ===== Auto hero slider ===== */
.hero-slider { position: relative; }
.hero-slide {
  position: absolute; inset: 0;
  opacity: 0;
  transition: opacity 1s ease-in-out;
  background-size: cover;
  background-position: center;
}
.hero-slide.active { opacity: 1; }
.hero-slide::after {
  content: ""; position: absolute; inset: 0;
  /* Blue (Weather Shield) -> Purple (Silk Emulsion) brand gradient overlay */
  background: linear-gradient(120deg, rgba(12,42,99,0.92) 0%, rgba(16,63,145,0.80) 40%, rgba(108,35,124,0.62) 78%, rgba(63,20,81,0.55) 100%);
}

/* ===== Floating WhatsApp button ===== */
@keyframes wa-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(37,211,102,0.55); }
  70%  { box-shadow: 0 0 0 16px rgba(37,211,102,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}
.animate-wa-pulse { animation: wa-pulse 2.2s infinite; }
@media (prefers-reduced-motion: reduce) {
  .animate-wa-pulse { animation: none; }
}

@media (prefers-reduced-motion: reduce) {
  .marquee-track { animation: none; }
}
