/* Sekcija s pozadinskim videom s koncerta na naslovnici.
   Poster stoji ispod, a home-video.js iznad njega ubaci prigušeni YouTube okvir
   tek kad posjet to podnosi (pristanak, širi ekran, bez reduced motion). */
.home-video-media {
    container-type: size;
}

/* Prava slika, a ne CSS pozadina, da preglednik može otkriti i prioritizirati
   resurs; object-fit daje isti "cover" učinak. */
.home-video-poster {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    background-color: #1E1B2E;
}

/* 16:9 embed koji prekriva okvir bilo kojeg omjera. Container query jedinice
   daju pravo "cover" ponašanje; 100% prije njih je zamjena za preglednike bez
   container queryja. */
.home-video-frame {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    border: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity 900ms ease;
}

@supports (width: 100cqw) {
    .home-video-frame {
        width: max(100cqw, 100cqh * 16 / 9);
        height: max(100cqh, 100cqw * 9 / 16);
    }
}

.home-video-frame.is-visible {
    opacity: 1;
}