/* prizes.css */

/* General Prizes Section Styles */
.prizes-section {
  padding: 30px 15px; /* Reduced padding for less empty space */
  background-color: #121212; /* Slightly darker grey-black */
  color: var(
    --color-light-grey
  ); /* Ensure text remains light grey for readability */
}

/* Section Title */
.section-title {
  font-size: 2rem;
  margin-bottom: 20px; /* Reduced margin for tighter spacing */
  text-align: center; /* Centered */
  color: var(--color-light-grey);
}

/* Introduction Text */
.intro-text {
  max-width: 800px;
  margin: 0 auto 30px auto; /* Reduced bottom margin */
  text-align: justify; /* Justified text alignment */
  font-size: 1.1rem;
  line-height: 1.6;
  color: var(--color-light-grey);
}

/* Prizes Grid */
.prizes-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 15px; /* Reduced gap between prize cards */
  justify-content: center;
}

/* Prize Card Styles */
.prize-card {
  background-color: #000000; /* Black background */
  border: none;
  border-radius: 10px;
  transition: transform 0.3s, box-shadow 0.3s;
  color: var(--color-light-grey);
  width: calc(30% - 10px); /* Slightly narrower */
  min-width: 200px; /* Reduced min-width */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.prize-card:hover {
  transform: scale(1.02);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5); /* Darker shadow */
}

.prize-card .card-body {
  color: var(--color-light-grey);
  padding: 10px; /* Further reduced padding for less empty space */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Card Titles */
.card-title {
  font-size: 1.4rem; /* Slightly reduced font size */
  margin-bottom: 10px; /* Reduced margin for tighter spacing */
  text-align: center; /* Centered */
  color: var(--color-light-grey);
}

/* Card Text */
.card-text {
  font-size: 0.95rem; /* Slightly reduced font size */
  line-height: 1.5;
  color: var(--color-light-grey);
  text-align: justify; /* Justified text alignment */
}

/* List Styling within Cards */
.prize-card ul {
  list-style: none;
  padding-left: 0;
  margin: 10px 0; /* Added margin for better spacing */
}

.prize-card ul li {
  margin-bottom: 8px; /* Reduced margin between list items */
  text-align: center; /* Centered text alignment for list items */
}

/* Video Submissions Container */
.video-submissions-container {
  display: flex;
  justify-content: center;
  margin-top: 30px; /* Reduced top margin */
}

.video-submissions-container .prize-card {
  width: calc(30% - 10px); /* Same width as other prize cards */
  min-width: 200px; /* Reduced min-width */
}

/* Responsive Adjustments */
@media (max-width: 1024px) {
  .prize-card {
    width: calc(45% - 10px); /* Adjusted width for two cards per row */
  }

  .video-submissions-container .prize-card {
    width: calc(45% - 10px); /* Adjusted width for two cards per row */
  }
}

@media (max-width: 768px) {
  .section-title {
    font-size: 1.8rem;
  }

  .card-title {
    font-size: 1.2rem;
  }

  .intro-text {
    font-size: 1rem;
  }

  .prizes-grid {
    flex-direction: column;
    align-items: center;
    gap: 10px; /* Further reduced gap on smaller screens */
  }

  .prize-card {
    width: 100%;
  }

  .video-submissions-container .prize-card {
    width: 100%;
  }
}

/* Ensure Images are Responsive */
.diagram-image {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}

/* Additional Styling for Enhanced Readability */

/* Links within Cards */
.prize-card a {
  color: var(--color-cta-bg);
  text-decoration: underline;
}

.prize-card a:hover {
  color: var(--color-cta-hover-bg);
}