/* ==========================
   REVIEW BANNER (Mad Sundar)
   ========================== */

.review-banner {
  display: block;
  width: 100%;
  background: 
    linear-gradient(90deg,
      rgba(0, 229, 255, 0.12) 0%,
      rgba(255, 75, 209, 0.12) 100%
    ),
    rgba(8, 10, 16, 0.75);
  /* border-top: 1px solid rgba(0, 229, 255, 0.12);  REMOVE this */
  border-bottom: 1px solid rgba(255, 75, 209, 0.12);
  text-decoration: none;
  padding: 0.45rem 0 0.55rem; /* was 0.75rem 0; a bit shorter so it feels like a header strip */
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  position: relative;
  z-index: 10;
}


.review-banner:hover {
  background:
    linear-gradient(90deg,
      rgba(0, 229, 255, 0.18) 0%,
      rgba(255, 75, 209, 0.18) 100%
    ),
    rgba(8, 10, 16, 0.8);
}

/* Wrap container matches your layout width */
.review-banner .wrap {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  text-align: center;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* Quote line */
.review-quote {
  font-size: 0.98rem;
  font-weight: 600;
  color: var(--text);
  opacity: 0.9;
  display: block;
}

/* Meta line (author / source) */
.review-meta {
  font-size: 0.8rem;
  color: var(--muted);
  opacity: 0.75;
  display: block;
  margin-top: -2px;
}

/* Optional small glow line under banner */
.review-banner::after {
  content: "";
  position: absolute;
  left: 10%;
  right: 10%;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity: 0.45;
}