/* Intro */
.promotional-video__title { margin-bottom: var(--space-24); color: var(--color-text-default); font-size: var(--font-size-h1); font-weight: 700; line-height: var(--line-height-h1); text-align: center; }
.promotional-video__desc { display: flex; justify-content: center; flex-wrap: wrap; color: var(--color-text-default); font-size: var(--font-size-h3); font-weight: 400; line-height: var(--line-height-h3); }
.promotional-video__desc span { text-align: center; }

/* Video */
.promotional-video__bg { position: relative; display: flex; align-items: center; justify-content: center; margin-top: var(--space-80); background-color: #000; background-image: url("/images/05_reservation/promotional-video-bg.webp"); background-position: center; background-size: cover; background-repeat: no-repeat; }
.promotional-video__bg::before { position: absolute; inset: 0; z-index: 0; background-color: rgba(0, 0, 0, 0.4); pointer-events: none; content: ""; }
.promotional-video__bg .container { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; padding-block: 160px; }
.promotional-video__frame { width: 90%; max-width: 1208px; aspect-ratio: 16 / 9; overflow: hidden; }
.promotional-video__embed { display: block; width: 100%; height: 100%; border: 0; }

@media (max-width: 768px) {
    /* Intro */
    .promotional-video__title { margin-bottom: var(--space-20); }

    /* Video */
    .promotional-video__bg { margin-top: 0; background-image: none; }
    .promotional-video__bg::before { background-color: #fff; }
    .promotional-video__bg .container { padding-block: var(--space-30) 0; }
    .promotional-video__frame { width: 100%; }
}