body {
    display: flex;
    flex-direction: column; 
    justify-content: center;
    align-items: center;
    margin: 0;
    height: 100vh;
    width: 100vw;
    font-family: "Poppins", sans-serif;
    overflow: hidden;
      background-color: black;  
}

/*
#astrogradient {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
  z-index: -1;         
  object-fit: cover;   
}

*/


.slider-box {
    width: 80%;            
    max-width: 1500px;
    padding: 20px;
    background-color: rgba(39, 16, 13, 0); 
    border-radius: 10px;
    margin: 0 auto;       
}


.slider-container {
    width: 70%;           
    overflow-x: auto;
    margin: 0 auto;       

}


.slider-container::-webkit-scrollbar {
    height: 7px;
}
.slider-container::-webkit-scrollbar-track {
    background: none;
    border-radius: 10px;
}
.slider-container::-webkit-scrollbar-thumb {
    background: #c845c100;
    border-radius: 10px;
}
.slider-container::-webkit-scrollbar-thumb:hover {
    background: #241d5900;
}


.slider {
    display: flex;
    gap: 40px;
    align-items: center;
    justify-content: flex-start; 
    width: fit-content;
    padding: 10px 0;
}

.slide {
    width: 300px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: transform 0.3s ease;
    text-decoration: none; 
}

.slide img {
    width: 250px;
    height: 250px;
    object-fit: contain;

}

.slide p {
    font-family: "Special Gothic Expanded One", sans-serif;
    font-size: 30px;
    color: #96daa7;
    text-align: center;
    margin-top: 10px;
     filter: drop-shadow(0 0 60px rgba(0,0,0,0.7));
     -webkit-text-stroke: 2px black;
}
.slide:hover {
  filter: drop-shadow(0 0 5px rgba(154, 37, 152, 0.97));
  transform: scale(1.05); 
}

.back-button {
    padding: 12px 25px;
    background-color: #d640b300;
    color: rgb(62, 126, 124);
    text-decoration: none;
    border-radius: 8px;
    font-size: 18px;
    font-family: 'Mea Culpa', sans-serif;
    transition: all 0.3s ease;
}

.back-button:hover {
    
    transform: scale(1.05);
}
