.usecase-section { padding: 60px 0 50px; background: var(--th-color-surface-soft); }
.usecase-section .heading { text-align: center; margin-bottom: 50px; }
.usecase-section .heading h2 { font-size: 32px; font-weight: 700; color: var(--th-color-text); margin-bottom: 14px; }
.usecase-section .heading p { font-size: 16px; color: var(--th-color-text-muted); max-width: 720px; margin: 0 auto; line-height: 1.7; }
.usecase-card { background: var(--th-color-surface); border-radius: 12px; padding: 32px 26px; height: 100%; box-shadow: 0 4px 20px rgba(20, 60, 100, 0.06); border: 1px solid var(--th-color-border); transition: 0.25s; position: relative; overflow: hidden; }
.usecase-card:hover { transform: translateY(-4px); box-shadow: 0 8px 28px rgba(20, 60, 100, 0.10); border-color: var(--th-color-primary); }
.usecase-card .num { position: absolute; top: -10px; right: 16px; font-size: 64px; font-weight: 800; color: #f0f5ff; line-height: 1; pointer-events: none; }
.usecase-card .ic { width: 52px; height: 52px; border-radius: 12px; background: linear-gradient(135deg, var(--th-color-primary), var(--th-color-secondary)); display: flex; align-items: center; justify-content: center; margin-bottom: 18px; color: var(--th-color-surface); font-size: 22px; }
.usecase-card h3 { font-size: 19px; font-weight: 700; color: var(--th-color-text); margin-bottom: 12px; line-height: 1.35; }
.usecase-card p { font-size: 14.5px; color: var(--th-color-text-muted); line-height: 1.65; margin-bottom: 16px; }
.usecase-card .uc-link { font-size: 14px; font-weight: 600; color: var(--th-color-primary); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.usecase-card .uc-link:hover { color: var(--th-color-primary-strong); gap: 10px; transition: 0.2s; }
@media (max-width:991px){ .usecase-card { margin-bottom:20px; } }