/* ============================================================
   SL STUDIO — TRAINING PAGE
   ============================================================ */

.course-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}
@media (max-width: 860px) { .course-grid { grid-template-columns: 1fr; } }

/* min-width:0 overrides the grid item default of min-width:auto, which
   otherwise refuses to shrink the card below its content's intrinsic
   width — without it, this card overflows its column on narrow
   screens instead of wrapping content to fit. */
.course-card { padding: var(--space-4); min-width: 0; }
.course-card .frame {
    border-radius: var(--radius-image);
    overflow: hidden;
    aspect-ratio: 16/10;
    margin-bottom: var(--space-3);
}
.course-card h3 { margin-bottom: var(--space-2); }
.course-for { font-size: var(--fs-small); color: var(--color-text); margin-bottom: var(--space-2); }
.course-learn-label {
    font-family: var(--font-button);
    font-size: var(--fs-xs);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-gold-text);
    margin-bottom: var(--space-2);
}
.course-card .panel-benefits { margin-bottom: var(--space-4); }