/* ============================= */
/* HERO CONTENT + STYLING */
/* ============================= */

.hero-testimonial-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  max-width: 1400px;
  gap: 2%;
  color: #fff;
}

.hero-left {
  width: 48%;
}

.hero-right {
  width: 50%;
}

/* MOBILE CONTENT */
@media (max-width: 767px) {

  .hero-testimonial-wrapper {
    flex-direction: column;
    text-align: center;
  }

  .hero-left,
  .hero-right {
    width: 100%;
  }

}

/* ===== LEFT SIDE ===== */

.hero-left{
  padding:2vh 0;
  color:white;
}

.hero-left h1{
  color:white;
  font-weight: 700;
  letter-spacing: 1px;
}

.hero-left button, 
.hero-left button:hover{
  min-width:50%;
  color: white;
  margin:2vh 0;
  padding:.1em 1em!important;
  background:#F57F04;
  border:none;
  cursor:pointer;
}

.hero-left button.secondary{
  background:transparent;
  border:1px solid #fff;
}

.hero-left button a{
  color:white;
  font-size:1.3rem;
  line-height:2em!important;
  font-weight:400;
  text-decoration:none;
  display:block;
}

/* ===== TESTIMONIAL ===== */

.testimonial-card {
  background: rgba(0,0,0,.7);
  border-radius: 10px;
  padding: 2vw;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  color: #fff;
}

.testimonial-quote {
  width: 100%;
  font-style: italic;
  font-size: 1.2rem;
  line-height: 1.2;
  margin-bottom:1rem;
}

.testimonial-name-stars-pic{
  width: 100%;    
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items:center;
}

.testimonial-name-stars{
  width:70%;
}

.testimonial-name {
  font-weight: 900;
  font-size: 1.2rem;
}

.testimonial-title {
  font-size: 1rem;
  line-height: 1.2em;
  margin-bottom: 15px;
}

.testimonial-stars {
  display: flex;
  gap: 6px;
}

.testimonial-stars svg {
  width: 22px;
  height: 22px;
  fill: #FFD700;
}

.testimonial-image {
  width: 28%;
}

.testimonial-image img {
  max-width: 70%;
  margin: 0 auto;
  border-radius: 8px;
}

/* MOBILE */
@media (max-width: 767px) {

  .testimonial-card, 
  .testimonial-name-stars-pic {
    flex-direction: column;
    text-align: center;
  }

  .testimonial-stars {
    justify-content: center;
  }

}