/* Use Cases: four white cards on the tint band, one per business area, each with a circled line icon,
   the area name over a hairline, and its six numbered items (number in a hanging column, item name set
   slightly heavier than its description). Two across (a 2 x 2 grid, so each item reads in one or two
   comfortable lines instead of four cramped ones), one on phones. */
.uc-page .uc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.uc-page .uc-card { gap: 0; padding: 40px 44px 42px; }
.uc-page .uc-card__icon {
  width: 56px; height: 56px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  color: var(--orange); background: rgba(241, 96, 38, .08); border: 1px solid rgba(241, 96, 38, .28);
}
.uc-page .uc-card__icon svg { display: block; }
.uc-page .uc-card__title { margin: 22px 0 0; padding-bottom: 18px; border-bottom: 1px solid rgba(0, 0, 0, .1); color: var(--black); }

.uc-page .uc-list { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 16px; }
.uc-page .uc-list li { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: baseline; font-size: 16px; line-height: 1.6; color: #4a4a4a; text-wrap: pretty; }
.uc-page .uc-list__num { font-family: var(--font-display); font-weight: 700; font-size: 13px; color: var(--orange); }
.uc-page .uc-list__name { font-weight: 600; color: #141414; }

@media (max-width: 1100px) {
  .uc-page .uc-card { padding: 34px 34px 36px; }
  .uc-page .uc-list li { font-size: 15px; grid-template-columns: 26px minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .uc-page .uc-grid { grid-template-columns: 1fr; gap: 16px; }
  .uc-page .uc-card { padding: 26px 22px 28px; }
  .uc-page .uc-card__icon { width: 50px; height: 50px; }
  .uc-page .uc-card__title { margin-top: 18px; padding-bottom: 14px; font-size: 19px; }
  .uc-page .uc-list { margin-top: 18px; gap: 14px; }
  .uc-page .uc-list li { grid-template-columns: 24px minmax(0, 1fr); }
}
