/* =========================
   PAGE WRAPPER
========================= */
.testimonials-page {
  background: #ececec;
}

/* =========================
   HEADER
========================= */
.testimonials-header {
  background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.6));
  color: #ffffff;
  padding: 100px 20px;
}

.testimonials-header h1 {
  font-size: 2.8rem;
  margin-bottom: 10px;
}

.testimonials-header p {
  max-width: 700px;
  margin: 0 auto;
  opacity: 0.9;
}

/* =========================
   CONTAINER
========================= */
.testimonials-container {
  padding: 80px 20px;
}

/* =========================
   CARD
========================= */
.testimonial-card {
  background: #ffffff;
  border-radius: 18px;
  padding: 30px;
  height: 100%;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  position: relative;
  transition: 0.3s ease;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.testimonial-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 25px 60px rgba(0,0,0,0.2);
}

/* =========================
   QUOTE
========================= */
.testimonial-quote {
  font-size: 1rem;
  color: #555555;
  line-height: 1.7;
  font-style: italic;
  margin-bottom: 25px;
  position: relative;
}

/* Decorative quote mark */
.testimonial-quote::before {
  content: "“";
  font-size: 3rem;
  color: #570000;
  position: absolute;
  top: -15px;
  left: -10px;
  opacity: 0.2;
}

/* =========================
   FOOTER (NAME)
========================= */
.testimonial-footer h3 {
  margin-bottom: 5px;
  color: #222222;
  font-size: 1.1rem;
}

.testimonial-footer span {
  color: #570000;
  font-size: 0.9rem;
  font-weight: 500;
}

/* =========================
   GRID BALANCE
========================= */
.testimonial-card {
  min-height: 250px;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 1400px) {
  .page-header {
  margin-top: 12rem;
}
  .page-header h1 {
    font-size: 2.2rem;
  }

  .testimonials-container .row > div {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 30px;
  }

}