/* ob-ai-cards — три карточки ИИ-сотрудников (01-SPEC.md §7.4). Дорожка В.
   Формат карточки сотрудника платформы: полоса, имя с пометкой «ИИ», список полей. */
ob-ai-cards {
  --ob-ai-cards-dot: 8px;        /* точка в полосе карточки */
  --ob-ai-cards-label: 112px;    /* ширина колонки подписей */
  --ob-ai-cards-lift: -5px;      /* п.41: подъём при наведении — те же параметры, что у карточек главной */
  --ob-ai-cards-lift-shadow: var(--shadow);
  --ob-ai-cards-lift-dur: .25s;
  display: block;
  width: 100%;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) ob-ai-cards { --ob-ai-cards-lift-shadow: 0 18px 40px rgba(0, 0, 0, .28); }
}
:root[data-theme="dark"] ob-ai-cards { --ob-ai-cards-lift-shadow: 0 18px 40px rgba(0, 0, 0, .28); }

.ob-ai-cards__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--sp-4);
}
@media (min-width: 900px) {
  .ob-ai-cards__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.ob-ai-cards__card {
  display: flex;
  flex-direction: column;
  margin: 0;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform var(--ob-ai-cards-lift-dur) var(--ease), box-shadow var(--ob-ai-cards-lift-dur) var(--ease),
              border-color var(--ob-ai-cards-lift-dur) var(--ease);
}
/* п.41: наведение — подъём, тень, рамка акцентом; только у мыши (на сенсоре не залипает) */
@media (hover: hover) {
  .ob-ai-cards__card:hover { border-color: var(--accent); box-shadow: var(--ob-ai-cards-lift-shadow); }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .ob-ai-cards__card:hover { transform: translateY(var(--ob-ai-cards-lift)); }
}
@media (prefers-reduced-motion: reduce) {
  .ob-ai-cards__card { transition: none; }
}

.ob-ai-cards__bar {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin: 0;
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--line);
  font-size: var(--fs-kick);
  color: var(--muted);
}
.ob-ai-cards__dot {
  flex: none;
  width: var(--ob-ai-cards-dot);
  height: var(--ob-ai-cards-dot);
  border-radius: 50%;
  background: var(--ok);
}

.ob-ai-cards__body { padding: var(--sp-4) var(--sp-4) var(--sp-5); }

.ob-ai-cards__name {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2);
  margin: 0 0 var(--sp-4);
  font-size: var(--fs-h3);
  font-weight: 600;
  line-height: 1.25;
  color: var(--ink);
}
.ob-ai-cards__pill {
  display: inline-block;
  padding: calc(var(--sp-1) / 2) var(--sp-2);
  border-radius: var(--radius-pill);
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-size: var(--fs-kick);
  font-weight: 700;
  line-height: 1.4;
}

.ob-ai-cards__fields {
  display: grid;
  grid-template-columns: var(--ob-ai-cards-label) minmax(0, 1fr);
  gap: var(--sp-2) var(--sp-3);
  margin: 0;
  font-size: var(--fs-small);
  line-height: 1.45;
}
.ob-ai-cards__fields dt { margin: 0; color: var(--muted); }
.ob-ai-cards__fields dd { margin: 0; color: var(--ink); }
.ob-ai-cards__fields dd.ob-ai-cards__ok { color: var(--ok); font-weight: 700; }

@media (min-width: 900px) and (max-width: 1099px) {
  /* три узкие колонки: подписи над значениями */
  .ob-ai-cards__fields { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .ob-ai-cards__fields dt { margin-top: var(--sp-3); }
  .ob-ai-cards__fields dt:first-child { margin-top: 0; }
}