/* #tools-courses (owner P4). CALL-E P04 layout: statement left, one sand paper list card hung from two pegs right
   (like the to-do card, static). Kit classes + semantic variables only (dark = automatic). */

#tools-courses .tc-text { display: grid; gap: 22px; justify-items: start; padding-top: 64px; }
#tools-courses .tc-text .t-h2 { line-height: 1.08; letter-spacing: -0.015em; }
#tools-courses .tc-nb { white-space: nowrap; }
#tools-courses .tc-text .lead { max-width: 46ch; }
#tools-courses .tc-text .row-btns { margin-top: 6px; }

#tools-courses .tc-row { justify-content: center; }
#tools-courses .tc-hang { width: min(100%, 580px); }
#tools-courses .tc-card { padding: 18px clamp(24px, 3vw, 38px) 12px; }
#tools-courses .tc-list { margin: 0; padding: 0; list-style: none; }
#tools-courses .tc-list li { display: flex; align-items: center; gap: 18px; padding: 18px 0; }
#tools-courses .tc-list li + li { border-top: 1px solid var(--hair); }
#tools-courses .tc-ico { background: var(--paper); }
#tools-courses .tc-ico img { object-fit: contain; filter: brightness(0); opacity: 0.88; }
html.dark #tools-courses .tc-ico img { filter: brightness(0) invert(1); opacity: 0.9; }
#tools-courses .tc-txt { flex: 1; min-width: 0; }
#tools-courses .tc-name { display: block; font-size: 20px; line-height: 1.25; }
#tools-courses .tc-top { display: block; margin-top: 4px; font: 400 12px/1.45 var(--mono); text-transform: uppercase; color: var(--fg3); }

@media (width <= 767px) {
  #tools-courses .tc-text { padding-top: 0; }
  #tools-courses .tc-list li { gap: 14px; padding: 16px 0; }
  #tools-courses .tc-name { font-size: 19px; }
}