body {
    background-color: #d3d9ff;
  }
  
  body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background-color: #d3d9ff;
    box-shadow: 20px 20px 40px #c9dcff, -20px -20px 40px #ffffff;
    animation: float 10s ease-in-out infinite alternate;
  }

  
  
  @keyframes float {
    from {
      transform: translate(0, 0);
    }
    to {
      transform: translate(5px, 5px);
    }
  }
  
  .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100vh;
  }
  
  h1 {
    font-family: 'Poppins', sans-serif;
    font-size: 5rem;
    margin: 0;
    text-align: center;
    color: #4A4E69;
    animation-name: fade-in;
    animation-duration: 2s;
  }

  
  @keyframes fade-in {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  
  .search-form {
    margin-top: 2rem;
  }
  
  .neomorphic-input {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35rem;
    height: 5.5rem;
    border-radius: 50px;
    background-color: #FFFFFF;
    box-shadow: 12px 12px 24px #B7C4DD, -12px -12px 24px #FFFFFF;
    transition: all 0.3s ease-in-out;
  }
  
  .neomorphic-input:hover {
    transform: translateY(-5px);
    box-shadow: 8px 8px 16px #8db5ff, -8px -8px 16px #FFFFFF;
  }
  
  .neomorphic-input label {
    font-family: 'Poppins', sans-serif;
    font-size: 1.5rem;
    margin-left: 1rem;
    color: #4A4E69;
  }
  
  .neomorphic-input input {
    flex: 1;
    font-family: 'Poppins', sans-serif;
    font-size: 1.5rem;
    margin-left: 1rem;
    border: none;
    outline: none;
  }
  
  .neomorphic-input button {
    font-family: 'Poppins', sans-serif;
    font-size: 1.5rem;
    color: #FFFFFF;
    background-color: #4A4E69;
    border: none;
    outline: none;
    border-radius: 50px;
    width: 8rem;
    height: 3.5rem;
    margin-left: 1rem;
    cursor: pointer;
    box-shadow: 8px 8px 16px #B7C4DD, -8px -8px 16px #FFFFFF;
    transition: all 0.3s ease-in-out;
  }
  
  .neomorphic-input button:hover {
    transform: translateY(-3px);
    box-shadow: 6px 6px 12px #ff9c9c, -6px -6px 12px #FFFFFF;
  }
  
  footer {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 5rem;
    width: 100%;
    background-color: #d3d9ff;
    box-shadow: 12px 12px 24px #B7C4DD, -12px -12px 24px #95fff3;
    position: fixed;
    bottom: 0;
    left: 0;
  }
  
  footer p {
    font-family: 'Poppins', sans-serif;
    font-size: 1.5rem;
    color: #4A4E69;
  }

  footer a,
footer i {
  color: #4A4E69;
  font-size: 1.5rem;
  margin-right: 1rem;
  transition: color 0.3s ease-in-out;
}

footer a:hover,
footer i:hover {
  color: #ffffff;
}

footer p,
footer .copyright {
  font-size: 1rem;
  color: #4A4E69;
  margin: 0;
}

footer .social-media {
  display: flex;
  justify-content: center;
  align-items: center;
}

footer .social-media i {
  font-size: 1.5rem;
  margin-right: 1.5rem;
}

@media (max-width: 768px) {
  footer {
    flex-direction: column;
    align-items: center;
  }
  
  footer .social-media {
    margin-top: 1rem;
  }
  
  footer .social-media i {
    margin-right: 1rem;
  }
  
  /* Responsive styles */
  @media screen and (max-width: 768px) {
    .search-box {
      width: 80%;
    }
  }
}