* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Helvetica Neue', Arial, sans-serif;
  /*background-color: #121212; /* Dark background */
  background: url("home-wallpaper-2.jpeg") no-repeat center;
  background-size: cover;
  color: #f5f5f5; /* Light text color */
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.container {
  text-align: center;
  width: 35%;
  min-width: 320px;
  padding: 20px;
  background-color: rgba(30,30,30,0.9); /* Dark container background */
  border-radius: 10px;
  /*box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);  Soft light shadow */
}

.title {
  font-size: 3rem;
  margin-bottom: 20px;
  color: #ffffff; /* White text for title */
  animation: fadeInUp 1s ease-in-out;
}

.subtitle {
  font-size: 1.2rem;
  margin-bottom: 40px;
  color: #cccccc; /* Slightly lighter gray for subtitle */
  animation: fadeInUp 1.5s ease-in-out;
}

.footer-text {
  margin-bottom: 15px;
  color: #aaaaaa; /* Slightly darker gray for footer text */
  animation: fadeInUp 2.5s ease-in-out;
}

.social-icons {
  display: flex;
  justify-content: center;
  gap: 15px;
  animation: fadeInUp 3s ease-in-out;
}

.social-icon {
  text-decoration: none;
  color: #f5f5f5; /* Light text for social icons */
  font-size: 0.9rem;
  padding: 10px 20px;
  border-radius: 5px;
  background-color: #333333; /* Dark background for icons */
  transition: background-color 0.3s;
}

.social-icon:hover {
  background-color: #444444; /* Slightly lighter background on hover */
}

/* Keyframe Animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
