/* =========================================================
   HGC Testimonials Slider (Section + Slider)
   Matches design: big center card + big side peeks + dots
   All cards same height
   ========================================================= */

/* ===== Section ===== */
.hgc-ts-section{
  background:#26331f;
  padding: 72px 0 58px;
}

.hgc-ts-section__inner{
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 24px;
}


.hgc-ts hgc-ts--section {
  margin-top: 1rem;
}

.hgc-ts-section__title{
  color:#fff !important;
  text-align:center;
  font-weight:800;
  font-size:28px;
  margin:0 0 52px !important; /* ✅ more space between title and cards */
}


/* ===== Slider ===== */
.hgc-ts{ width:100%; margin-top: 1rem !important;}

.hgc-ts__viewport{
  overflow:hidden;      /* hide overflow so we get the “peek” */
  outline:none;
}

/* Track (scroll container) */
.hgc-ts--section .hgc-ts__track{
  display:flex;
  align-items:center;
  gap: 64px;                 /* ✅ more separation like design */

  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  -ms-overflow-style:none;

  padding: 0 40px;           /* ✅ small padding => big side cards visible */
  cursor: grab;

  user-select: none;
  -webkit-user-select: none;
  -webkit-overflow-scrolling: touch;
}
.hgc-ts--section .hgc-ts__track::-webkit-scrollbar{ display:none; }
.hgc-ts--section .hgc-ts__track:active{ cursor: grabbing; }
.hgc-ts--section .hgc-ts__track.is-dragging{ scroll-snap-type:none; }

/* Slides */
.hgc-ts--section .hgc-ts__slide{
  flex: 0 0 1200px;           /* ✅ keeps center strong while allowing big peeks */
  scroll-snap-align:center;
  display:flex;
  justify-content:center;
}

/* Card */
.hgc-ts--section .hgc-ts__card{
  width:100%;
  background:#fff;
  border-radius: 0;          /* design is square */
  padding: 44px 86px 36px;
  text-align:center;
  border:0;
  box-shadow:none;

  /* ✅ make ALL cards same height */
  height: 400px;             /* adjust: 280–320 depending on design */
  display:flex;
  flex-direction: column;
  justify-content: center;
}

/* Quote mark */
.hgc-ts--section .hgc-ts__quote{
  display:block;
  color:#95c120;
  font-size:58px;
  line-height:1;
  margin:0 0 12px;
  font-weight:900;
}

/* Text */
.hgc-ts--section .hgc-ts__text{
  margin: 0 auto 18px;
  max-width: 660px;
  font-size: 16.5px;
  line-height: 1.75;
  color:#2b2b2b;
  font-style: Montserrat;

  /* ✅ clamp so long text doesn’t break height */
  display: -webkit-box;
  -webkit-line-clamp: 4;      /* number of lines visible */
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Name + subtitle */
.hgc-ts--section .hgc-ts__name{
  display:block;
  font-size:15px;
  font-weight:800;
  color:#111;
}

.hgc-ts--section .hgc-ts__subtitle{
  display:block;
  font-size:12px;
  color:#666;
  margin-top:3px;
}

/* Keep author block positioned consistently inside fixed-height card */
.hgc-ts--section footer{
  margin-top: auto;           /* pushes author to bottom of card */
}

/* Dots (design: inactive outlined, active filled) */
.hgc-ts--section .hgc-ts__dots{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top: 18px;
}

.hgc-ts--section .hgc-ts__dot{
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: transparent;
  border: 1px solid rgba(255,255,255,.7);
  padding: 0;
  cursor: pointer;
}

.hgc-ts--section .hgc-ts__dot[aria-selected="true"]{
  background:#fff;
  border-color:#fff;
}


/* ===== Responsive ===== */
@media (max-width: 1200px){
  .hgc-ts--section .hgc-ts__track{
    padding: 0 22px;
    gap: 22px;
  }

  .hgc-ts--section .hgc-ts__slide{
    flex: 0 0 78vw; /* responsive slide width */
  }

  .hgc-ts--section .hgc-ts__card{
    padding: 34px 28px 28px;
    height: 280px; /* keep same height on tablet */
  }
}

@media (max-width: 640px){
  .hgc-ts-section{
    padding: 46px 0 40px;
  }

  .hgc-ts-section__title{
    font-size:20px;
    margin-bottom: 22px;
  }

  .hgc-ts--section .hgc-ts__track{
    padding: 0 18px;
    gap: 14px;
  }

  .hgc-ts--section .hgc-ts__slide{
    flex-basis: 88vw;
  }

  .hgc-ts--section .hgc-ts__card{
    padding: 26px 18px 22px;
    height: 320px;         /* ✅ fixed height on mobile */
  }

  .hgc-ts--section .hgc-ts__text{
    -webkit-line-clamp: 6; /* ✅ allow more lines on mobile */
  }
}

/* Critical flexbox shrink fixes */
.hgc-ts,
.hgc-ts__viewport,
.hgc-ts--section{
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Make VIEWPORT the scroller (not the track) */
.hgc-ts__viewport{
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;

  /* prevents layout leakage */
  contain: layout paint;
}
.hgc-ts__viewport::-webkit-scrollbar{ display:none; }

/* Track becomes pure flex row and can be as wide as it wants,
   WITHOUT affecting page width, because viewport clips it */
.hgc-ts--section .hgc-ts__track{
  display: flex;
  align-items: center;
  gap: 64px;

  width: max-content;        /* important */
  max-width: none !important;
  min-width: 0 !important;

  padding: 0 40px;           /* your “wild” peeks */
  box-sizing: border-box;
}

/* Safety: allow content to shrink in flex contexts */
.hgc-ts--section .hgc-ts__slide,
.hgc-ts--section .hgc-ts__card{
  min-width: 0;
  box-sizing: border-box;
}