body { font-family: 'Poppins', sans-serif;
scroll-behavior: smooth; }
h1,h2,h3 { font-family: 'Playfair Display', serif; }

/* FADE */
.fade {
  opacity: 0;
  transform: translateY(40px);
  transition: 1s;
}
.fade.show {
  opacity: 1;
  transform: translateY(0);
}

/* HIDE SCROLLBAR */
#expScroll::-webkit-scrollbar { display: none; }
#expScroll {
  -ms-overflow-style: none;
  scrollbar-width: none;
  cursor: grab;
}
#expScroll:active { cursor: grabbing; }

/* SNAP */
.snap-x { scroll-snap-type: x mandatory; }
.snap-start { scroll-snap-align: start; }

.dot {
  width: 8px;
  height: 8px;
  background: #ccc;
  border-radius: 999px;
  transition: 0.3s;
}

.dot.active {
  width: 20px;
  background: black;
}



/* SCROLL ANIMATION BASE */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.8s ease;
  will-change: transform, opacity;
}

/* ACTIVE STATE */
.reveal.active {
  opacity: 1;
  transform: translateY(0);
}