@tailwind base;
@tailwind components;
@tailwind utilities;

* {
  font-family: "Fivo Sans Modern", sans-serif;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-size: 10px;
  -webkit-font-smoothing: antialiased;
}
body.scroll-disabled {
  overflow-y: hidden;
}
.head-text {
  clip-path: polygon(0 1%, 100% 0, 100% 100%, 0% 100%);
}
.char {
  opacity: 0;
  transform: translateY(20rem);
  transition: transform(0.5s);
  font-size: 16.4rem;
}
.scroll-container,
.last-scroll-container {
  scrollbar-width: none;
}
.scroll-container::-webkit-scrollbar,
.last-scroll-container::-webkit-scrollbar {
  width: 0px;
}
.cursor-active {
  opacity: 1;
}
.text-box {
  -webkit-text-stroke: 3px #666666;
}
.text-box-2 {
  -webkit-text-stroke: 3px #282828;
}
/* nav,
.pre-loader, */
/* .loader {
  position: fixed !important;
} */
.nav-menu {
  -webkit-text-stroke: 3px #282828;
}
.credits {
  -webkit-text-stroke: 1px black;
}

.is-active {
  width: 100vw;
}

.testing {
  scroll-snap-align: start;
  animation: slide 10s linear infinite;
}
@keyframes slide {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100vw);
  }
}

@media screen and (max-width: 1024px) {
  .char {
    transform: translateY(10rem);
    font-size: 8rem;
  }
}

@media screen and (max-width: 640px) {
  .char {
    transform: translateY(5rem);
    font-size: 3.6rem;
  }
  .nav-menu {
    -webkit-text-stroke: 2px #282828;
  }
  .shop-item-4 {
    min-width: 100%;
  }
}

@media screen and (max-width: 360px) {
  .char {
    transform: translateY(5rem);
    font-size: 2.8rem;
  }
}