/* ================================
   TESTIMONIALS
================================ */

.testimonials-section {
  background: #fff;
  padding: 80px 4%;
}

.testimonials-wrap {
  max-width: 1500px;
  margin: 0 auto;
}

.testimonials-title {
  font-size: 64px;
  font-weight: 700;
  margin-bottom: 50px;
  color: #111;
}

/* List */
.testimonials-list {
  display: flex;
  flex-direction: column;
  gap: 36px;
}

/* Card */
.testimonial-card {
  position: relative;
  border: 3px solid #416A10;
  border-radius: 110px;
  padding: 48px 80px;
  min-height: 280px;
}

/* Quotes */
.quote {
  position: absolute;
  font-size: 190px;
  font-weight: 700;
  color: #416A10;
  line-height: 1;
  pointer-events: none;
}

.quote-left {
  top: 30px;
  left: 40px;
}

.quote-right {
  bottom: 40px;
  right: 60px;
}

/* Text */
.testimonial-text {
  font-size: 26px;
  line-height: 1.7;
  color: #416A10;
  max-width: 900px;
}

/* Footer */
.testimonial-footer {
  margin-top: 36px;
}

.stars {
  color: #FFCB2B;
  font-size: 22px;
  margin-bottom: 8px;
}

.author {
  font-size: 22px;
  color: #416A10;
}

/* ================================
   TABLET
================================ */
@media (max-width: 1024px) {
  .testimonials-title {
    font-size: 48px;
  }

  .testimonial-card {
    padding: 40px 56px;
    border-radius: 80px;
  }

  .testimonial-text {
    font-size: 20px;
  }

  .quote {
    font-size: 140px;
  }
}

/* ================================
   MOBILE
================================ */
@media (max-width: 768px) {
  .testimonials-section {
    padding: 60px 5%;
  }

  .testimonials-title {
    font-size: 36px;
    margin-bottom: 32px;
  }

  .testimonial-card {
    padding: 32px 28px;
    border-radius: 48px;
  }

  .testimonial-text {
    font-size: 16px;
    line-height: 1.6;
  }

  .quote {
    font-size: 72px;
  }

  .quote-left {
    top: 16px;
    left: 16px;
  }

  .quote-right {
    bottom: 16px;
    right: 20px;
  }

  .stars {
    font-size: 18px;
  }

  .author {
    font-size: 16px;
  }
}
/* ================================
   TESTIMONIALS (Figma style)
   Card size: 1478 x 531 (desktop)
================================ */

.tst-section{
  background:#fff;
  padding: 70px 3%;              /* "almost full width with little padding" */
}

.tst-wrap{
  width: 100%;
  margin: 0 auto;
}

.tst-title{
  font-size: 64px;
  font-weight: 800;
  color:#111;
  margin: 0 0 36px;
}

/* vertical stack */
.tst-list{
  display:flex;
  flex-direction: column;
  gap: 38px;
}

/* Card base */
.tst-card{
  position: relative;
  width: min(1478px, 100%);      /* max 1478, shrink on smaller screens */
  max-height: 531px;             /* keeps Figma height feel on desktop */
  border: 3px solid #416A10;
  border-radius: 110px;
  padding: 64px 110px;           /* inner spacing like screenshot */
  background:#fff;
  overflow: hidden;
}

/* left/right placement like your design */
.tst-card.is-left{ margin-right: auto; }
.tst-card.is-right{ margin-left: auto; }

/* Quote marks */
.tst-quote{
  position:absolute;
  color:#416A10;
  font-weight: 800;
  line-height: 1;
  pointer-events:none;
  user-select:none;
}

.tst-quote-left{
  top: 60px;
  left: 55px;
  font-size: 190px;              /* matches 45x190 visual */
}

.tst-quote-right{
  top: 50%;
  right: 90px;
  transform: translateY(-20%);
  font-size: 190px;
}

/* Main text */
.tst-text{
  max-width: 880px;
  color:#416A10;
  font-size: 26px;
  line-height: 1.65;
  letter-spacing: 0.2px;
  margin: 0;
}

/* Footer */
.tst-footer{
  margin-top: 44px;
  display:flex;
  flex-direction: column;
  gap: 10px;
}

.tst-stars{
  color:#FFCB2B;
  font-size: 24px;
  letter-spacing: 3px;
}

.tst-author{
  color:#416A10;
  font-size: 24px;
}

/* Right cards: footer aligns right like screenshot */
.tst-card.is-right .tst-footer{
  align-items: flex-end;
  text-align: right;
}

/* ================================
   RESPONSIVE
================================ */

/* large tablets */
@media (max-width: 1024px){
  .tst-title{ font-size: 48px; }

  .tst-card{
    min-height: 420px;
    border-radius: 80px;
    padding: 52px 72px;
  }

  .tst-text{ font-size: 20px; }

  .tst-quote-left,
  .tst-quote-right{
    font-size: 140px;
  }

  .tst-quote-left{ top: 40px; left: 34px; }
  .tst-quote-right{ right: 46px; }
}

/* phones */
@media (max-width: 768px){
  .tst-section{ padding: 55px 5%; }
  .tst-title{ font-size: 36px; }

  /* on mobile: both left/right become full width */
  .tst-card.is-right,
  .tst-card.is-left{
    margin-left: 0;
    margin-right: 0;
  }

  .tst-card{
    min-height: unset;
    border-radius: 44px;
    padding: 28px 24px 26px;
  }

  .tst-text{
    font-size: 15px;
    line-height: 1.6;
    max-width: 100%;
  }

  .tst-footer{
    margin-top: 22px;
  }

  .tst-stars{ font-size: 18px; }
  .tst-author{ font-size: 16px; }

  .tst-quote-left,
  .tst-quote-right{
    font-size: 72px;
  }

  .tst-quote-left{
    top: 16px;
    left: 18px;
  }

  .tst-quote-right{
    top: 52%;
    right: 16px;
    transform: translateY(-50%);
  }
}
.testimonials-section {
  padding: 80px 0;
}

.container {
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 30px; /* same as previous section */
}

.section-title {
  font-size: 72px;
  font-weight: 700;
  margin: 0 auto;
  margin-bottom: 60px;
  max-width: 1200px !important;
}

/* Card base */
.testimonial-card {
  position: relative;
  width: 92%;
  max-width: 1478px;
  max-height: 531px;
  border: 3px solid #416A10;
  border-radius: 108px;
  padding: 70px 90px;
  margin-bottom: 40px;
  background: #fff;
}

/* Left / Right alignment */
.testimonial-card.left {
  margin-right: auto;
}

.testimonial-card.right {
  margin-left: auto;
}

/* Text */
.testimonial-text {
  font-size: 20px;
  line-height: 1.7;
  color: #416A10;
  max-width: 75%;
}

/* Quotes */
.quote {
  position: absolute;
  font-size: 60px;
  font-weight: bold;
  color: #416A10;
}

.left-quote {
  top: 40px;
  left: 60px;
}

.right-quote {
  bottom: 60px;
  right: 80px;
}

/* Footer */
.testimonial-footer {
  margin-top: 50px;
}

.testimonial-footer.align-right {
 
}

.stars {
  color: #FFCB2B;
  font-size: 24px;
  margin-bottom: 10px;
}

.author {
  font-size: 22px;
  font-weight: 600;
  color: #416A10;
}

/* Responsive */
@media (max-width: 1024px) {
  .testimonial-card {
    width: 100%;
    padding: 50px 40px;
    min-height: auto;
  }

  .testimonial-text {
    max-width: 100%;
  }

  .right-quote {
    right: 40px;
  }
}

@media (max-width: 600px) {
  .section-title {
    font-size: 36px;
  }

  .testimonial-card {
    border-radius: 50px;
    padding: 40px 25px;
  }

  .quote {
    font-size: 40px;
  }
}
.right-quote {
  position: absolute;
  top: 50%;
  right: 80px;
  transform: translateY(-50%);
  font-size: 60px;
  font-weight: bold;
  color: #416A10;
  pointer-events: none;
}
:root{
  --green:#416A10;
  --text-green:#3f6f12;
  --star:#FFB800;
}

/* section */
.testimonials{
  padding: 40px 2.5vw 70px;
}
.t-title{
  font-size: 64px;
  font-weight: 800;
  margin: 0 0 26px;
  color:#111;
}

/* card shell */
.t-card{
  position: relative;
  border: 3px solid var(--green);
  border-radius: 110px;
  background:#fff;
  width: min(1478px, 100%);
  min-height: 531px;
  margin-bottom: 36px;

  /* IMPORTANT: card padding is on shell, but text alignment is controlled by inner */
  padding: 70px 90px;
}

/* alternating layout (left & right) */
.t-left{ margin-left: 0; margin-right: auto; }
.t-right{ margin-left: auto; margin-right: 0; }

/* inner content column */
.t-inner{
  /* this creates the SAME left start for paragraph + footer */
  width: min(860px, 100%);
  margin-left: 150px; /* pushes text away from left quote like figma */
}

/* main paragraph */
.t-text{
  margin: 0;
  font-size: 26px;
  line-height: 1.7;
  color: var(--text-green);
  letter-spacing: 0.2px;
}

/* footer always aligned with paragraph start */
.t-footer{
  margin-top: 90px;
}
.t-stars{
  color: var(--star);
  font-size: 26px;
  letter-spacing: 6px;
  line-height: 1;
  margin-bottom: 14px;
}
.t-name{
  font-size: 30px;
  font-weight: 800;
  color: var(--text-green);
}

/* quotes */
.t-quote{
  position:absolute;
  font-size: 70px;
  font-weight: 900;
  color: var(--green);
  line-height: 1;
  pointer-events:none;
}

/* left quote */
.t-quote-left{
  top: 70px;
  left: 70px;
}

/* right quote should be centered relative to TEXT area (not card) */
.t-quote-right{
  top: 50%;
  right: 120px;
  transform: translateY(-50%);
}

/* responsive */
@media (max-width: 1100px){
  .t-title{ font-size: 44px; }
  .t-card{
    border-radius: 70px;
    padding: 50px 40px;
    min-height: 420px;
  }
  .t-inner{
    margin-left: 90px;
    width: min(720px, 100%);
  }
  .t-text{ font-size: 20px; }
  .t-name{ font-size: 24px; }
  .t-footer{ margin-top: 60px; }
  .t-quote-left{ left: 35px; top: 45px; }
  .t-quote-right{ right: 55px; }
}

@media (max-width: 600px){
  .t-card{
    border-radius: 45px;
    padding: 36px 22px;
    min-height: auto;
  }
  .t-inner{
    margin-left: 55px;
    width: 100%;
  }
  .t-text{ font-size: 16px; }
  .t-footer{ margin-top: 40px; }
  .t-stars{ font-size: 18px; letter-spacing: 4px; }
  .t-name{ font-size: 18px; }
  .t-quote{ font-size: 46px; }
  .t-quote-right{ right: 22px; }
}
/* left / right alignment */
.testimonial-card.left{
  margin-right: auto;
  margin-left: 0;
}

.testimonial-card.right{
  margin-left: auto;
  margin-right: 0;
}

/* main text */
.testimonial-text{
  max-width: 860px;
  margin-left: 140px;

  font-size: 26px;
  line-height: 1.7;
  color: var(--text-green);
}

/* footer */
.testimonial-footer{
  margin-top: 90px;
  margin-left: 140px;
}

.testimonial-footer.align-right{
  
  margin-left: auto;
  margin-right: 140px;
}

.stars{
  color: var(--star);
  font-size: 26px;
  letter-spacing: 6px;
  margin-bottom: 14px;
}

.author{
  font-size: 30px;
  font-weight: 800;
  color: var(--text-green);
}

/* quotes */
.quote{
  position: absolute;
  font-size: 70px;
  font-weight: 900;
  color: var(--green);
  line-height: 1;
  pointer-events: none;
}

/* left quote */
.left-quote{
  top: 70px;
  left: 170px;
}

/* right quote – CENTERED vertically */
.right-quote{
  top: 50%;
  right: 220px;
  transform: translateY(0%);
}

/* =====================
   RESPONSIVE
   ===================== */

@media (max-width: 1100px){
  .section-title{ font-size: 44px; }

  .testimonial-card{
    border-radius: 70px;
    padding: 50px 40px;
    max-height: 531px;
  }

  .testimonial-text{
    margin-left: 90px;
    font-size: 20px;
  }

  .testimonial-footer{
    margin-left: 90px;
    margin-top: 60px;
  }

  .testimonial-footer.align-right{
    margin-right: 90px;
  }

  .author{ font-size: 24px; }
  .left-quote{ left: 35px; top: 45px; }
  .right-quote{ right: 55px; }
}

@media (max-width: 600px){
  .testimonial-card{
    border-radius: 45px;
    padding: 36px 22px;
    min-height: auto;
  }

  .testimonial-text,
  .testimonial-footer{
    margin-left: 55px;
    max-width: 100%;
  }

  .testimonial-footer.align-right{
    margin-right: 55px;
  }

  .testimonial-text{ font-size: 16px; }
  .stars{ font-size: 18px; letter-spacing: 4px; }
  .author{ font-size: 18px; }

  .quote{ font-size: 46px; }
  .right-quote{ right: 22px; }
}


@media (max-width: 600px){
  .right-quote{
    position: static;        /* stays after content */
    display: block;          /* new line */
    text-align: right;       /* push to right side */
    margin-top: 6px;
    margin-right: 6px;
    transform: none;
    font-size: 46px;
  }
}

@media (max-width: 600px) {
    .testimonial-footer {
        
        margin-top: 0px;
    }
}