/* Video collection cards. Deliberately plain — this is a signpost, not a destination:
   its whole job is to get someone one click closer to the video they came for. */
.sts-vidlib{margin:44px 0 0;padding-top:34px;border-top:2px solid var(--line)}
.sts-vidlib-head{margin:0 0 20px}
.sts-vidlib-title{margin:0;font-size:24px;font-weight:800;letter-spacing:-.018em;color:var(--ink)}
.sts-vidlib-lede{margin:6px 0 0;font-size:15px;color:var(--ink-soft)}
.sts-vidlib-grid{display:grid;gap:16px;grid-template-columns:1fr}
@media (min-width:700px){.sts-vidlib-grid{grid-template-columns:1fr 1fr}}
.sts-vidlib-card,.sts-vidlib-card *{text-decoration:none}
.sts-vidlib-card{display:flex;align-items:flex-start;gap:14px;
  background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;
  transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease}
.sts-vidlib-card:hover{transform:translateY(-1px);border-color:var(--accent);
  box-shadow:0 14px 30px -22px rgba(27,82,51,.45)}
.sts-vidlib-ic{flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:11px;background:var(--surface-2);color:var(--accent)}
.sts-vidlib-ic svg{width:22px;height:22px}
.sts-vidlib-tx{display:flex;flex-direction:column;gap:4px}
.sts-vidlib-name{font-size:16px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.sts-vidlib-card:hover .sts-vidlib-name{color:var(--accent-deep)}
.sts-vidlib-blurb{font-size:13.5px;line-height:1.55;color:var(--ink-soft)}
.sts-vidlib-card:focus-visible{outline:2.5px solid var(--accent);outline-offset:3px}