/* Base Colors */
body {
  background-color: #1A1A1D;
  color: #ECECEC;
  font-family: Arial, sans-serif;
}

/* Header & Footer */
.bg-dark {
  background-color: #1A1A1D !important;
}

.bg-secondary-dark {
  background-color: #2D2D34 !important;
}

/* Text Colors */
.text-neutral {
  color: #ECECEC;
}
.text-supportive {
  color: #A0A0A0;
}

/* Links */
a {
  color: #C3073F;
  transition: all 0.3s ease;
}
a:hover {
  color: #6F2232;
  text-decoration: none;
}

/* Game Card Styles */
.game-link {
  display: block;
  margin: 10px;
  text-align: center;
  border: 2px solid transparent;
  border-radius: 8px;
  overflow: hidden;
  transition: border-color 0.3s ease, transform 0.3s ease;
}
.game-link:hover {
  border-color: #C3073F;
  transform: translateY(-5px);
}
.game-thumb {
  width: 100%;
  height: auto;
}

/* Card styling with gradient animation */
@keyframes gradientAnimation {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.card {
  background: linear-gradient(135deg, #2D2D34, #1A1A1D);
  background-size: 200% 200%;
  animation: gradientAnimation 5s ease infinite;
  border: none;
  transition: transform 0.3s ease;
}
.card:hover {
  transform: scale(1.05);
}

/* Custom Buttons */
.btn-custom {
  background-color: #C3073F;
  border: none;
  color: #ECECEC;
  transition: background-color 0.3s ease;
}
.btn-custom:hover {
  background-color: #6F2232;
}

/* Article/Content Area */
.article-content {
  background: linear-gradient(135deg, #2D2D34, #1A1A1D);
  padding: 20px;
  border-radius: 8px;
  margin-bottom: 20px;
}

/* Form Validation */
input:invalid, textarea:invalid {
  border-color: #C3073F;
}

/* Custom Card Styling for Featured Games */
.custom-card {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.custom-card:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.7);
}

/* Optional: Enhance the hero section if needed */
.hero-section {
  position: relative;
}

/* Custom Card Styling for Featured Games */
.custom-card {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.custom-card:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.7);
}