/* Transload options diagram. Uses the shared two-column .sv-row panel. */
.tl-opt { width: 100%; max-width: 560px; margin: 0 auto; }
.tl-title { margin: 0 0 10px; font-family: 'IBM Plex Sans', Arial, sans-serif; font-size: 18px; font-weight: 600; line-height: 1.2; color: #003DA5; }
.tl-icons, .tl-caps { display: grid; grid-template-columns: 150fr 28px 150fr 28px 190fr; column-gap: 8px; min-width: 0; }
.tl-icons { align-items: center; }
.tl-caps { align-items: start; margin-top: 8px; }
.tl-caps span { min-width: 0; font-family: 'IBM Plex Sans', Arial, sans-serif; font-size: 15px; font-weight: 600; line-height: 1.25; color: #003DA5; text-align: center; overflow-wrap: break-word; }
.tl-caps span:nth-child(1) { grid-column: 1; }
.tl-caps span:nth-child(2) { grid-column: 3; }
.tl-caps span:nth-child(3) { grid-column: 5; }
.tl-ico { display: block; width: 100%; height: auto; }
.tl-arr { display: block; width: 28px; height: 10px; justify-self: center; }
.tl-rule { height: 1px; background: #C9D6E7; margin: 16px 0 14px; }
@media (max-width: 640px) {
  .tl-title { font-size: 17px; margin-bottom: 10px; }
  .tl-icons, .tl-caps { grid-template-columns: 150fr 22px 150fr 22px 190fr; column-gap: 4px; }
  .tl-caps span { font-size: 13px; }
  .tl-arr { width: 22px; height: 10px; }
  .tl-rule { margin: 14px 0 12px; }
}