/* Trang chủ — phần <style> riêng của index.html (slider hero, thanh cuộn, no-scrollbar). */
/* Hero Banner Slide transitions */
.hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transform: scale(1.04);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), 
              transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), 
              visibility 0.9s;
  pointer-events: none;
}
.hero-slide.active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  pointer-events: auto;
  z-index: 10;
}

/* Custom Scrollbar in Brand Red */
html::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 8px;
}
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
  background: #fef2f2;
}
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
  background: #dc2626;
  border-radius: 9999px;
}
*::-webkit-scrollbar:horizontal,
::-webkit-scrollbar:horizontal,
*::-webkit-scrollbar-thumb:horizontal,
::-webkit-scrollbar-thumb:horizontal,
*::-webkit-scrollbar-track:horizontal,
::-webkit-scrollbar-track:horizontal {
  display: none !important;
  height: 0px !important;
  width: 0px !important;
  background: transparent !important;
  opacity: 0 !important;
}
.no-scrollbar::-webkit-scrollbar,
.no-scrollbar *::-webkit-scrollbar {
  display: none !important;
  height: 0px !important;
  width: 0px !important;
  background: transparent !important;
  opacity: 0 !important;
}
.no-scrollbar {
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}