
.top-usecases {
  padding: 110px 0 80px;
  background: linear-gradient(180deg, #f6f9fc 0%, #eef4f8 100%);
}
.top-usecases__container {
  width: min(1200px, calc(100% - 48px));
  margin: 0 auto;
}
.top-usecases__lead {
  max-width: 960px;
  margin: 0 auto 34px;
  color: #365063;
  font-size: 16px;
  line-height: 2;
}
.usecase-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px;
}
.usecase-card {
  background: rgba(255,255,255,0.94);
  border: 1px solid rgba(22,66,92,0.12);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 14px 32px rgba(22,66,92,0.10);
  display:flex;
  flex-direction:column;
}
.usecase-card__media { aspect-ratio: 16/9; background:#dfe8ef; overflow:hidden; }
.usecase-card__media img { width:100%; height:100%; object-fit:cover; display:block; }
.usecase-card__body { padding: 24px; display:flex; flex-direction:column; gap:14px; height:100%; }
.usecase-card__eyebrow { color:#0a5f87; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.usecase-card__title { color:#16364d; font-size:30px; line-height:1.4; font-weight:700; }
.usecase-card__text { color:#30495b; font-size:15px; line-height:1.9; min-height: 8em; }
.usecase-card__flow { display:grid; gap:8px; margin:0; padding:0; list-style:none; counter-reset:step; }
.usecase-card__flow li { position:relative; padding:10px 12px 10px 44px; background:#f3f7fa; border-radius:12px; color:#284457; line-height:1.6; }
.usecase-card__flow li::before { counter-increment:step; content:counter(step); position:absolute; left:12px; top:50%; transform:translateY(-50%); width:22px; height:22px; border-radius:999px; background:#0e6b95; color:#fff; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.usecase-card__btn { margin-top:auto; display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 18px; border-radius:999px; background:#0e6b95; color:#fff; text-decoration:none; font-weight:700; transition:.2s ease; }
.usecase-card__btn:hover { background:#0b597a; }
.ai-detail-hero { padding:100px 0 48px; background: linear-gradient(180deg, #f5f9fc 0%, #ffffff 100%); }
.ai-detail__inner { width:min(1120px, calc(100% - 48px)); margin:0 auto; }
.ai-detail__lead { color:#30495b; line-height:2; font-size:16px; margin-top:18px; }
.ai-detail__heroimg { margin-top:30px; border-radius:20px; overflow:hidden; box-shadow:0 18px 42px rgba(22,66,92,.15); }
.ai-detail__heroimg img { display:block; width:100%; height:auto; }
.ai-detail-gallery { padding: 0 0 90px; background:#fff; }
.ai-detail-gallery__grid { width:min(1120px, calc(100% - 48px)); margin:0 auto; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:22px; }
.ai-detail-gallery__item { background:#fff; border:1px solid rgba(22,66,92,.12); border-radius:18px; overflow:hidden; box-shadow:0 12px 28px rgba(22,66,92,.08); }
.ai-detail-gallery__item img { width:100%; height:230px; object-fit:cover; display:block; }
.ai-detail-gallery__item p { padding:16px 18px 22px; color:#30495b; line-height:1.8; }
@media (max-width: 960px) {
  .usecase-grid, .ai-detail-gallery__grid { grid-template-columns:1fr; }
  .usecase-card__text { min-height:0; }
  .top-usecases { padding: 86px 0 64px; }
}
