.ts-benefits { background: var(--surface-card); }
.ts-benefits__title { font-family: var(--font-brand); font-size: var(--fs-h1); text-align: center; color: var(--text-primary); margin: var(--space-2) 0 var(--space-4); }
.ts-benefits__subtitle { text-align: center; color: var(--text-secondary); font-family: var(--font-support); font-size: var(--fs-body-lg); margin-bottom: var(--space-6); }
.ts-benefits__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-6); margin-top: var(--space-10); }
.ts-benefits__card { padding: var(--space-6); border-radius: var(--radius-card); background: var(--bg-base); opacity: 0; transform: translateY(10px); transition: opacity var(--duration-slow) var(--ease-standard), transform var(--duration-slow) var(--ease-standard); }
.ts-benefits__card.is-revealed { opacity: 1; transform: none; }
.ts-benefits__icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: var(--radius-full); background: var(--action-primary-bg); color: var(--text-on-brand); margin-bottom: var(--space-4); }
.ts-benefits__card h3 { font-family: var(--font-brand); font-size: var(--fs-h5); margin-bottom: var(--space-2); color: var(--text-primary); }
.ts-benefits__card p { font-family: var(--font-support); color: var(--text-secondary); line-height: var(--lh-body); }