/* Clients page specific styles */
.section { padding-block: var(--space-16); }
.section-muted { background: var(--color-gray-50); padding-block: var(--space-16); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }

/* Hero */
.section-hero { padding-block: clamp(56px, 6vw, 96px); }
.hero-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: var(--space-10); align-items: center; }
.hero-copy p { color: var(--color-muted); }
.hero-cta { display: flex; gap: var(--space-3); margin-top: var(--space-4); }
.hero-media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
@media (max-width: 920px) { .hero-grid { grid-template-columns: 1fr; } .hero-media { order: -1; } }

/* Testimonials */
.testimonials-grid .testimonial { display: grid; gap: var(--space-3); }
.testimonial-meta { color: var(--color-muted); font-size: var(--font-size-sm); }
.testimonial-quote { font-size: var(--font-size-lg); font-family: var(--font-serif); }
.stars { letter-spacing: 2px; color: var(--color-primary-600); }

/* Cases */
.cases-grid .case { overflow: hidden; padding: 0; }
.case-media img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.case-body { padding: var(--space-6); }
.case-title { margin-top: 0; }
.case-points { margin-top: var(--space-3); }

/* Logo cloud */
.logo-cloud { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--space-3); list-style: none; padding: 0; margin-top: var(--space-5); }
.client-badge { display: inline-flex; align-items: center; justify-content: center; padding: var(--space-2) var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-full); background: var(--color-surface); color: var(--color-text); box-shadow: var(--shadow-sm); white-space: nowrap; }

/* Success Stories */
.success-grid .success-item { display: grid; grid-template-columns: 1fr; gap: var(--space-6); align-items: center; }
.success-media img { border-radius: var(--radius-lg); }
.success-metrics { margin-top: var(--space-3); color: var(--color-muted); }
@media (max-width: 880px) { .success-grid .success-item { grid-template-columns: 1fr; } }

/* Onboarding steps */
.steps { list-style: none; padding: 0; margin: var(--space-6) 0 0; display: grid; grid-template-columns: 1fr; gap: var(--space-6); }
.step { display: grid; grid-template-columns: auto 1fr; gap: var(--space-4); align-items: start; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-5); box-shadow: var(--shadow-sm); }
.step-index { width: 36px; height: 36px; display: inline-grid; place-items: center; border-radius: var(--radius-full); background: var(--color-primary-600); color: var(--color-on-primary); font-weight: 600; }
.step-title { margin: 0 0 var(--space-1) 0; }
.onboarding-cta { margin-top: var(--space-6); display: flex; gap: var(--space-3); flex-wrap: wrap; }

/* FAQ */
.faq-list { display: grid; gap: var(--space-3); }
.faq { border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.faq > summary { cursor: pointer; list-style: none; padding: var(--space-4) var(--space-5); position: relative; }
.faq > summary::-webkit-details-marker { display: none; }
.faq > summary h3 { font-size: var(--font-size-lg); margin: 0; }
.faq[open] > summary { border-bottom: 1px solid var(--color-border); }
.faq-body { padding: var(--space-4) var(--space-5); color: var(--color-muted); }

/* Resources */
.resources-grid .resource-card { display: grid; gap: var(--space-3); }

/* Benefits */
.benefits-list { display: grid; gap: var(--space-2); margin-top: var(--space-4); list-style: none; }
.benefits-list li { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-sm); padding: var(--space-3) var(--space-4); }

/* CTA */
.cta-wrap { padding-block: var(--space-16); }
.cta-card { text-align: center; background: linear-gradient(180deg, var(--color-surface), var(--color-gray-100)); }
.cta-actions { display: flex; gap: var(--space-3); justify-content: center; margin-top: var(--space-4); flex-wrap: wrap; }

/* Subtle reveal animation (prefers-reduced-motion safe) */
@media (prefers-reduced-motion: no-preference) {
  [data-reveal] { opacity: 0; transform: translateY(8px); transition: opacity var(--duration-slow) var(--easing-standard), transform var(--duration-slow) var(--easing-standard); }
  [data-reveal].revealed { opacity: 1; transform: translateY(0); }
}
