@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400&family=Audiowide&display=swap');

/* Base Styles */
html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Montserrat', sans-serif;
  color: #1F2937;
  background-color: #FFFFFF;
  overflow-x: hidden;
}

::selection {
  background-color: #FFCC22;
  color: #0A79B0;
}

/* Animations for clean entrance */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(15px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInLateralLeft {
  from { opacity: 0; transform: translateX(-20px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInLateralRight {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: translateX(0); }
}

.animate-fade-in {
  animation: fadeIn 0.7s cubic-bezier(0.21, 0.47, 0.32, 0.98) forwards;
}

.animate-fade-in-left {
  animation: fadeInLateralLeft 0.7s cubic-bezier(0.21, 0.47, 0.32, 0.98) forwards;
}

.animate-fade-in-right {
  animation: fadeInLateralRight 0.7s cubic-bezier(0.21, 0.47, 0.32, 0.98) forwards;
}

/* Scroll reveal helper class */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.6s cubic-bezier(0.21, 0.47, 0.32, 0.98);
}

.reveal.active {
  opacity: 1;
  transform: translateY(0);
}

/* Scroll reveal lateral helper classes */
.reveal-left {
  opacity: 0;
  transform: translateX(-25px);
  transition: all 0.6s cubic-bezier(0.21, 0.47, 0.32, 0.98);
}

.reveal-left.active {
  opacity: 1;
  transform: translateX(0);
}

.reveal-right {
  opacity: 0;
  transform: translateX(25px);
  transition: all 0.6s cubic-bezier(0.21, 0.47, 0.32, 0.98);
}

.reveal-right.active {
  opacity: 1;
  transform: translateX(0);
}