.about-container { text-align: center; padding: 40px 20px 30px 20px; position: relative; }

.heading-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  gap: 20px;
}

.heading-wrapper h1 { font-size: 2.2rem; color: #b39d5d; margin: 0; position: relative; z-index: 2; }

.rotate-loop {
  width: 110px;
  height: 110px;
  opacity: 0.8;
  flex-shrink: 0;
  z-index: 1;
  animation: rotateLeftRight 6s linear infinite alternate;
}

.left-decor { margin-left: -55px; }
.right-decor { margin-right: -55px; animation-direction: alternate-reverse; }

@keyframes rotateLeftRight {
  0% { transform: rotate(-15deg); }
  50% { transform: rotate(15deg); }
  100% { transform: rotate(-15deg); }
}

/* Jewel slider */
.slider-wrapper {
  overflow: hidden;
  position: relative;
  margin-top: 30px;
}

.jewel-slider {
  display: flex;
  gap: 20px;
  animation: scrollSlider 25s linear infinite;
}

@keyframes scrollSlider {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); } /* Move half length for looping */
}

/* Jewel items */
.jewel-item {
  flex: 0 0 auto;
  width: 180px;
  text-align: center;
  cursor: pointer;
  transition: transform 0.3s ease;
}
.jewel-item:hover { transform: translateY(-5px); }
.jewel-item img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 15px;
  transition: transform 0.5s ease, filter 0.5s ease;
}
.jewel-item img:hover {
  transform: scale(1.05);
  filter: brightness(1.2) drop-shadow(0 0 15px gold);
}
.jewel-item h2 { margin-top: 8px; font-size: 1rem; color: #b39d5d; }

/* Lightbox */
.lightbox { display: none; position: fixed; top:0; left:0; width:100%; height:100%; background: rgba(0,0,0,0.8); justify-content: center; align-items: center; flex-direction: column; z-index: 1000; }
.lightbox-img { max-width: 70%; max-height: 70%; border-radius: 15px; margin-bottom: 15px; }
.lightbox-title { color: #fff; font-size: 2rem; }
#close-lightbox { position: absolute; top: 20px; right: 30px; font-size: 3rem; color: #fff; cursor: pointer; user-select: none; }

/* Responsive */
@media(max-width: 768px){
  .rotate-loop { width: 80px; height: 80px; }
  .left-decor { margin-left: -40px; }
  .right-decor { margin-right: -40px; }
  .jewel-item { width: 140px; }
  .jewel-item img { height: 140px; }
  .jewel-item h2 { font-size: 0.9rem; }
  .lightbox-img { max-width: 90%; max-height: 60%; }
  .lightbox-title { font-size: 1.5rem; }
  #close-lightbox { font-size: 2.5rem; }
}