src/app/(marketing)/globals.scss
* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html,
body {
  max-width: 100vw;
  overflow-x: hidden;
  scroll-behavior: smooth;
  scroll-padding-top: 90px;
}

body {
  color: black;
  background: #d9d9d9;
}

a {
  color: inherit;
  text-decoration: none;
}

.text-light-shadow {
  text-shadow: 0px 0px 25px rgba(255, 255, 255, 0.75),
    0px 0px 50px rgba(255, 255, 255, 0.75);
}

.text-dark-shadow {
  text-shadow: 0px 0px 25px rgba(0, 0, 0, 0.75),
    0px 0px 50px rgba(0, 0, 0, 0.75);
}

.hide-scrollbar {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.transparent-gradient-x {
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent,
    transparent 5%,
    #000 25%,
    #000 75%,
    transparent 95%,
    transparent
  );
  mask-image: linear-gradient(
    90deg,
    transparent,
    transparent 5%,
    #000 25%,
    #000 75%,
    transparent 95%,
    transparent
  );

  @media (max-width: 768px) {
    -webkit-mask-image: linear-gradient(
      90deg,
      transparent,
      transparent 2.5%,
      #000 12.5%,
      #000 62.5%,
      transparent 87.5%,
      transparent
    );
    mask-image: linear-gradient(
      90deg,
      transparent,
      transparent 2.5%,
      #000 12.5%,
      #000 62.5%,
      transparent 87.5%,
      transparent
    );
  }
}

/* Firefox */
* {
  scrollbar-width: auto;
  scrollbar-color: #ff28e2 #ffffff;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 8px;
}

*::-webkit-scrollbar-track {
  background: #ffffff;
}

*::-webkit-scrollbar-thumb {
  background-color: #ff28e2;
}