/* Vertical (9:16) video cards. Self-contained dark band so it drops into any page. */
.video-band {
    background: linear-gradient(180deg, #0B1628 0%, #1E3A5F 100%);
    padding: 88px 24px;
    color: #E5ECF4;
}
.video-band-inner { max-width: 1080px; margin: 0 auto; }
.video-band-label {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #60A5FA;
    margin: 0 0 12px;
    text-align: center;
}
.video-band h2 {
    font-family: 'Alata', sans-serif;
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    letter-spacing: -0.02em;
    color: #FFFFFF;
    text-align: center;
    margin: 0 0 12px;
}
.video-band-sub {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    line-height: 1.7;
    color: #B8C4D3;
    text-align: center;
    max-width: 560px;
    margin: 0 auto 48px;
}
.video-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 300px));
    justify-content: center;
    gap: 28px;
}
.video-card { margin: 0; }
.video-card video {
    display: block;
    width: 100%;
    aspect-ratio: 9 / 16;
    object-fit: cover;
    background: #0B1628;
    border-radius: 14px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}
.video-card figcaption {
    font-family: 'Inter', sans-serif;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #FFFFFF;
    margin-top: 14px;
    text-align: center;
}
.video-card figcaption span {
    display: block;
    font-weight: 400;
    font-size: 0.8125rem;
    color: #8FA1B6;
    margin-top: 4px;
}
@media (max-width: 600px) {
    .video-band { padding: 64px 16px; }
    .video-grid { grid-template-columns: minmax(0, 320px); }
}
