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

body {
  font-family: "Inter", sans-serif;
  overflow: hidden;
}
html,body {
  margin:0;
  padding:0;
}

.bd-snap {
  scroll-snap-type: y mandatory;
  overflow-y: scroll;
  height: 100vh;

}



.bd-snap::-webkit-scrollbar-corner {
  background: #0a1219 !important;
  width: 0px !important;
}

.bd-snap .ss {
  scroll-snap-align: start;
  scroll-snap-stop: always;
  width: 100%;
}
*{
  
  padding: 0px;
  margin: 0px;
  }

::-webkit-scrollbar {
  width: 4px;
}

.linear-text {
  background: linear-gradient(to right, #ff3030, #0aa6fe);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.linear-red {
  background: linear-gradient(to right, #de3333, #de33332e);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.blue-bg {
  background: rgb(0, 181, 218);
  background: radial-gradient(circle, #1670ca2b, rgba(238, 238, 249, 0) 63%);
  width: 700px;
  height: 700px;
  bottom: -270px !important;
  left: -420px;
}

.blue-bg2 {
  background: rgb(0, 181, 218);
  background: radial-gradient(circle, #1670ca28, rgba(238, 238, 249, 0) 63%);
  width: 700px;
  height: 700px;
  top: 80% !important;
  right: 0px;
  z-index: -12;
}

.blue-star {
  position: absolute !important;
  bottom: 0px !important;
  left: 0 !important;
}

.green-star {
  position: absolute !important;
  bottom: 140px !important;
  right: 32px !important;
}

.red-star {
  position: absolute !important;
  top: 140px !important;
  right: 0px !important;
}

.yellow-star {
  position: absolute !important;
  top: 200px !important;
  animation: linear infinite;
  animation-name: run;
  animation-duration: 7s;
}






.sub-title {
  color: rgba(176, 176, 176, 0.582) !important;
  font-weight: 200;
  font-size: 14px;
}

.star {
  position: absolute;
  width: 20px;
  height: 2px;
  animation: moveStar linear infinite;
  border-radius: 10px;
}

.star::before {
  content: "";
  display: inline-block;
  width: 23px;
  height: 2px;
  border-radius: 10px;

  margin-left: 0px;
  margin-bottom: 16px;
  background: rgb(129, 119, 119);
  background: linear-gradient(141deg, rgb(15, 137, 237) 0%, rgb(0, 0, 0) 100%);
}

.star::after {
  content: "";
  display: inline-block;
  width: 2px;
  height: 2px;
  border-radius: 10px;
  background-color: rgb(0, 166, 255);
  position: absolute;
  top: 0;
  margin-left: -0.5px;
  margin-top: -0.1px;
}
@keyframes moveStar {
  0% {
    transform: translateY(0) translateX(0);
  }
  100% {
    transform: translateY(-100vh) translateX(-100vw);
  }
}

@media screen and (max-width: 600px) {
  header ul li {
    display: none !important;
  }

  .contact-title {
    max-width: 100% !important;
    font-size: 24px;
  }

  .contact-form {
    min-width: 300px !important;
    width: 100%;
  }
  footer {
    flex-direction: column;
  }

  footer .logo {
    margin-bottom: 16px;
  }
}

@media screen and (min-width: 600px) {
  .menu-tel {
    display: none !important;
  }
}

@media screen and (max-width: 900px) {
  .desk-bg {
    display: none !important;
  }

 
  .main-text  {
    font-size: 40px;
    height: 100% !important;
    margin-top: 100px;
  }
}


@media screen and (min-width: 2000px) {

  .main-text  {
    font-size: 82px;
   
  }
}


@media screen and (min-width: 900px) {
  .phone-bg {
    display: none !important;
  }
}
.menu-svg {
  width: 36px !important;
}

.dropdown-menu a {
  padding: 10px;
}

.dropdown-menu {
  border: 1px solid rgb(50, 50, 50);
  border-radius: 24px;
}