/* Shared testimonial and story components for Proximity Coaching. */

.prox-testimonials {
  background: var(--linen-white, #faf6ef);
  color: var(--deep-slate, #2e2c34);
  padding: 88px 24px;
}

.prox-testimonials--aqua { background: var(--pale-mist, #bfdcdc); }
.prox-testimonials--cream { background: var(--warm-cream, #f0ebe2); }

.prox-testimonials__inner {
  max-width: 1040px;
  margin: 0 auto;
}

.prox-testimonials__eyebrow {
  margin: 0 0 14px;
  color: var(--deep-tide, #6a8d94);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  text-align: center;
  text-transform: uppercase;
}

.prox-testimonials__title {
  margin: 0 auto 18px;
  max-width: 760px;
  color: var(--deep-slate, #2e2c34);
  font-family: var(--font-sans, 'Manrope', sans-serif);
  font-size: clamp(30px, 5vw, 48px);
  font-weight: 400;
  line-height: 1.12;
  text-align: center;
}

.prox-testimonials__intro,
.prox-testimonials__disclosure {
  max-width: 760px;
  margin: 0 auto 38px;
  color: var(--smoke-plum, #6e6873);
  font-size: 16px;
  line-height: 1.7;
  text-align: center;
}

.prox-testimonials__disclosure {
  padding: 16px 20px;
  border: 1px solid rgba(78, 74, 85, .18);
  border-radius: 12px;
  background: rgba(255, 255, 255, .45);
}

.prox-testimonials__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.prox-testimonials__grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* Full-length stories read better at their natural heights. */
.prox-testimonials__grid--natural { align-items: start; }

/* Center the final row when a featured grid contains five cards. */
.prox-testimonials__grid--five { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.prox-testimonials__grid--five > .prox-testimonial { grid-column: span 2; }
.prox-testimonials__grid--five > .prox-testimonial:nth-child(4) { grid-column: 2 / span 2; }

.prox-testimonial {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  padding: 30px;
  border: 1px solid rgba(78, 74, 85, .16);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(46, 44, 52, .07);
}

.prox-testimonial__quote {
  margin: 0;
  color: var(--deep-slate, #2e2c34);
  font-size: 17px;
  line-height: 1.72;
}

.prox-testimonial__quote p { margin: 0 0 14px; }
.prox-testimonial__quote p:last-child { margin-bottom: 0; }

.prox-testimonial__cite {
  display: block;
  margin-top: auto;
  padding-top: 24px;
  color: var(--slate-plum, #4e4a55);
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
}

.prox-testimonial__context {
  display: block;
  margin-top: 3px;
  color: var(--smoke-plum, #6e6873);
  font-size: 14px;
  font-weight: 500;
}

.prox-testimonials__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 36px;
}

.prox-testimonials__button {
  display: inline-block;
  padding: 14px 24px;
  border: 2px solid var(--slate-plum, #4e4a55);
  border-radius: 9px;
  background: var(--slate-plum, #4e4a55);
  color: var(--linen-white, #faf6ef);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
}

.prox-testimonials__button:hover,
.prox-testimonials__button:focus-visible { background: var(--deep-slate, #2e2c34); }

.prox-testimonials__button--secondary {
  background: transparent;
  color: var(--slate-plum, #4e4a55);
}

.prox-testimonials__button--secondary:hover,
.prox-testimonials__button--secondary:focus-visible {
  background: rgba(78, 74, 85, .09);
  color: var(--deep-slate, #2e2c34);
}

.prox-stories-hero {
  padding: 92px 24px;
  background: var(--slate-plum, #4e4a55);
  color: var(--linen-white, #faf6ef);
  text-align: center;
}

.prox-stories-hero__inner { max-width: 800px; margin: 0 auto; }
.prox-stories-hero h1 { margin: 0 0 20px; color: inherit; font-size: clamp(38px, 7vw, 64px); font-weight: 300; line-height: 1.08; }
.prox-stories-hero p { margin: 0 auto; max-width: 700px; color: rgba(250, 246, 239, .82); font-size: 18px; line-height: 1.7; }

@media (max-width: 840px) {
  .prox-testimonials__grid,
  .prox-testimonials__grid--two { grid-template-columns: 1fr; }
  .prox-testimonials__grid--five > .prox-testimonial,
  .prox-testimonials__grid--five > .prox-testimonial:nth-child(4) { grid-column: auto; }
  .prox-testimonial { padding: 26px; }
}

@media (max-width: 520px) {
  .prox-testimonials { padding: 68px 18px; }
  .prox-testimonials__actions { flex-direction: column; }
  .prox-testimonials__button { width: 100%; }
}
