/* SECTION */

.cards-section {
  padding: 30px 20px;
  background-image: url("images/starscape.png");
  background-size: cover;
}

/* CARD ROW - THIS IS WHAT ALLOWS HORIZ TO VERT WRAPPING*/

.cards-container {
  max-width: 1100px;
  margin: auto;

  display: flex;
  flex-wrap: wrap;
  /* allows wrapping */
  gap: 30px;
  justify-content: center;
}

/* CARD */

.card {
  background: #09160e;
  border-radius: 14px;
  overflow: hidden;
  width: 300px;




  transition: 0.25s;
}

/* Hover glow */

.card:hover {
  transform: translateY(-6px);

  box-shadow:
    0 0 12px rgba(0, 255, 85, 0.2),
    0 0 25px rgba(0, 255, 85, 0.08);
}

/* IMAGE */

.card-image {
  width: 100%;
  height: 170px;
  object-fit: cover;
}

/* CONTENT */

.card-content {
  padding: 18px;
}

/* TEXT */

.card-title {
  font-size: 1.2rem;
  margin-bottom: 6px;
  color: #00ff55;
  text-align: left;
  justify-content: left;
}


/* BUTTON */

.read-button {
  background: transparent;
  color: #00ff55;
  border: 1px solid #00ff55;

  padding: 8px 14px;
  border-radius: 8px;
  cursor: pointer;

  transition: 0.2s;
}

.read-button:hover {
  background: #009f38;
  color: #020409;

  box-shadow: 0 0 10px rgba(0, 255, 85, 0.5);
}




.badge-container {
  width: 300px;
  height: 200px;
}

.badge-container img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}




blockquote {
  padding: 15px;
  padding-left: 30px;
  padding-right: 30px;
  background-color: rgba(4, 30, 10, 0.475);
  border-left: #00FF55;
  border-left-color: #00FF55;
  border-left-width: 3px;

}

.quoteName {
  text-align: right;
  font-weight: bold;
  color: #00FF55;
  margin-top: 8px;
}