* {
   padding: 0;
   margin: 0;
   font-family: "Jersey 25", sans-serif;
   box-sizing: border-box;
}

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

body {

   height: 100vh;
   background: radial-gradient(
      ellipse 80% 50% at center,
      #292727,
      #111111
    ); 

    background-color: #111;
   
}

ul {
   list-style: none;
}

header {
   padding: 15px 15px;
}

.headerSection {
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 1200px;
   margin: 0 auto;
}

.headerTitle {
   font-size: 14px;
   color: #4BFF3C;
}

.headerMenu {
   font-size: 14px;
   color: #565656;
   text-decoration: underline;
}

.headerPart {
   flex: 1;
}
.headerRight {
   display: flex;
   align-items: flex-end;
   justify-content: flex-end;
}

/* hero */

.heroSection {
   background-image: url(../imgs/placeholder3.png);
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   padding: 100px 0 150px 0;
   margin-top: 20px;
}

.heroHead {
   font-size: 50px;
   color: white;
   text-align: center;
   line-height: 42px;
   margin-bottom: 40px;
   text-shadow: 0 0 50px #4BFF3C,
               0 0px #4BFF3C,
               0 0 0px #4BFF3C;
}

.heroBtn {
   all: unset;
   background-color: #4BFF3C;
   color: #565656;
   padding: 5px 15px 2px 15px;
   border-radius: 5px;
   font-size: 14px;
   margin: 0 auto;
   display: flex;
   align-items: center;
}
.heroBtn img {
   width: 25px;
}
.heroBtn span {
   margin-right: 10px;
}

.heroBtnIconContainer {
   display: flex;
   justify-content: end;
}

/* intro */ 

.introSection {
   padding: 15px 15px;
}

.introTitle {
   color: white;
   font-size: 35px;
   margin-bottom: 25px;
   margin-top: 25px;
}


.introP {
   color: white;
   margin-bottom: 50px;
   text-align: justify;
   font-size: 12px;
}

.viewMore {
   color: #4BFF3C;
   text-decoration: underline;
}

/* Slider */

.slider {
   width: min(800px, 90%);
   position: relative;
   margin: 0 auto;
   opacity: .5;
   }

   /* Image window */
   .slider-window {
   overflow: hidden;
   border-radius: 12px;
   }

   /* Container holding all images */
   .slider-track {
   display: flex;
   transition: transform 0.4s ease;
   }

   .slide {
   min-width: 100%;
   height: 450px;
   }

   .slide img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
   }

   /* Arrow buttons */
   .arrow {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);

   width: 45px;
   height: 45px;

   border: none;
   border-radius: 50%;

   background: rgba(0, 0, 0, 0.7);
   color: white;

   font-size: 24px;
   cursor: pointer;

   z-index: 2;
   }

   .arrow:hover:not(:disabled) {
   background: rgba(0, 0, 0, 0.9);
   }

   .arrow:disabled {
   opacity: 0.3;
   cursor: not-allowed;
   }

   .prev {
   left: -22px;
   }

   .next {
   right: -22px;
   }

   /* Dots */
   .dots {
   display: flex;
   justify-content: center;
   gap: 10px;
   margin-top: 18px;
   }

   .dot {
   width: 11px;
   height: 11px;

   border: none;
   border-radius: 50%;

   background: #ccc;
   cursor: pointer;

   padding: 0;
   }

   .dot.active {
   background: #333;
   transform: scale(1.2);
   }

   .dot:hover {
   background: #777;
   }

   /* Mobile */
   @media (max-width: 600px) {
   .slide {
      height: 300px;
   }

   .arrow {
      width: 38px;
      height: 38px;
      font-size: 20px;
   }

   .prev {
      left: 10px;
   }

   .next {
      right: 10px;
   }
   }


   .footerContainer {
   display: flex;
   padding: 20px;
   }

.footerTag {
   color: #4BFF3C;
   margin: 0 auto;
}