body {
  background-color: var(--color-bg);
}

.testimonials-hero {
  background: radial-gradient(circle at top left, var(--color-primary-soft), transparent 55%),
              radial-gradient(circle at bottom right, var(--color-accent-soft), transparent 55%);
}

.testimonials-hero-grid {
  align-items: center;
  gap: var(--space-16);
}

.testimonials-hero-cta {
  margin-top: var(--space-8);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.testimonials-hero-media {
  display: flex;
  justify-content: flex-end;
}

.testimonials-hero-card {
  max-width: 480px;
}

.testimonials-section-header {
  max-width: 720px;
  margin-bottom: var(--space-16);
}

.testimonials-grid {
  gap: var(--space-8);
}

.testimonial-card .testimonial-meta {
  margin-top: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.testimonials-figure {
  margin-top: var(--space-16);
}

.testimonials-figure figcaption {
  margin-top: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.featured-stories-grid {
  gap: var(--space-16);
  align-items: center;
}

.featured-story-list {
  margin-left: var(--space-6);
}

.featured-story-outcome {
  margin-top: var(--space-4);
}

.featured-story-cta {
  margin-top: var(--space-8);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.featured-stories-media figure {
  margin: 0;
}

.featured-stories-media figcaption {
  margin-top: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.video-testimonial-wrapper {
  max-width: 900px;
}

.video-testimonial-card {
  margin-top: var(--space-8);
}

.video-testimonial-placeholder {
  position: relative;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, var(--gray-800), var(--gray-700));
  color: #ffffff;
  padding: var(--space-24) var(--space-16);
  text-align: center;
  cursor: pointer;
  box-shadow: var(--shadow-md);
}

.video-testimonial-placeholder:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 4px;
}

.video-play-button {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.7);
  margin: 0 auto var(--space-6);
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-play-button::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 16px solid #ffffff;
  margin-left: 4px;
}

.video-placeholder-text {
  max-width: 40ch;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.9);
}

.video-testimonial-note {
  margin-top: var(--space-6);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.client-profiles-grid {
  gap: var(--space-8);
}

.client-profile-meta {
  margin-top: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.ratings-references-grid {
  gap: var(--space-16);
  align-items: flex-start;
}

.ratings-list {
  margin-left: var(--space-6);
}

.ratings-summary {
  margin-top: var(--space-8);
}

.ratings-score {
  font-size: var(--font-size-lg);
}

.ratings-note {
  margin-top: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.references-card .quote + .quote {
  margin-top: var(--space-6);
}

.references-cta {
  margin-top: var(--space-8);
  margin-bottom: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.case-study-grid {
  gap: var(--space-8);
}

.case-study-outcome {
  margin-top: var(--space-4);
}

.case-study-figure {
  margin-top: var(--space-16);
}

.case-study-figure figcaption {
  margin-top: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.quotes-week-grid {
  gap: var(--space-8);
}

.awards-wrapper {
  gap: var(--space-16);
}

.awards-list {
  margin-left: var(--space-6);
}

.awards-note {
  margin-top: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.awards-standards-list {
  margin-left: var(--space-6);
  margin-bottom: var(--space-8);
}

.testimonial-form-grid {
  gap: var(--space-16);
  align-items: flex-start;
}

.testimonial-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.form-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-6);
}

.form-field {
  flex: 1 1 0;
}

.form-consent-label {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  font-size: var(--font-size-sm);
}

.form-consent-label input[type="checkbox"] {
  margin-top: 2px;
}

.form-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.form-row-bottom {
  align-items: flex-start;
}

.form-status {
  min-height: 1.2em;
  font-size: var(--font-size-sm);
}

.testimonial-form-aside {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.testimonial-form-benefits {
  margin-left: var(--space-6);
}

@media (max-width: 900px) {
  .testimonials-hero-media {
    justify-content: flex-start;
    margin-top: var(--space-8);
  }

  .form-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 600px) {
  .video-testimonial-placeholder {
    padding: var(--space-16) var(--space-12);
  }

  .form-row {
    flex-direction: column;
  }
}
