/* COURSES: vertical auto-sliding card viewport */
.courses { background: #fff; }
.vslider { position: relative; width: min(1040px, 100%); margin-inline: auto; aspect-ratio: 16 / 9; min-height: 420px; overflow: hidden; border-radius: 16px; box-shadow: 0 18px 44px rgba(24,27,92,.25); border-bottom: 6px solid var(--yellow); }
.vslider__track { transition: transform .9s cubic-bezier(.65, 0, .25, 1); }
.vcard { position: relative; display: flex; align-items: flex-end; color: #fff; background-size: cover; background-position: center top; }
.vcard__shade { position: absolute; inset: 0; background: linear-gradient(to top, rgba(10,12,50,.88) 0%, rgba(10,12,50,.35) 55%, rgba(10,12,50,.1) 100%); }
.vcard__body { position: relative; padding: 2.4rem clamp(1.2rem, 4vw, 3.5rem); max-width: 720px; }
.vcard h3 { font-size: clamp(1.5rem, 3vw, 2.3rem); font-weight: 800; }
.vcard p { font-size: 1rem; color: #e8eaff; }
.vslider__dots { position: absolute; right: 1.2rem; top: 50%; transform: translateY(-50%); display: grid; gap: .8rem; z-index: 2; }
.vslider__dots button { width: 14px; height: 14px; border-radius: 50%; border: 2px solid #fff; background: transparent; padding: 0; cursor: pointer; }
.vslider__dots button.is-active { background: var(--yellow); border-color: var(--yellow); transform: scale(1.3); }

.vcard__actions { display: flex; gap: .8rem; flex-wrap: wrap; align-items: center; }
.btn--glass { background: rgba(255,255,255,.16); color: #fff; border-color: rgba(255,255,255,.85); backdrop-filter: blur(4px); }
.btn--glass:hover { background: #fff; color: var(--navy); }
