/* =========================================================================
   Component: fm-video-modal
   Full-viewport overlay for playing YouTube videos.
   Injected lazily by video-modal.js when a [data-video] trigger is clicked.
   ========================================================================= */

.fm-video-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(0, 0, 0, 0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--fm-sp-6);
  animation: fm-modal-in 180ms var(--fm-ease);
}

.fm-video-modal[hidden] { display: none; }

@keyframes fm-modal-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.fm-video-modal__close {
  position: absolute;
  top: var(--fm-sp-5);
  right: var(--fm-sp-5);
  width: 44px;
  height: 44px;
  color: var(--fm-white);
  background: transparent;
  border: 0;
  padding: 0;
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
  z-index: 1;
  transition: color var(--fm-dur-fast) var(--fm-ease);
}
.fm-video-modal__close:hover { color: var(--fm-accent); }

.fm-video-modal__frame {
  position: relative;
  width: 100%;
  max-width: 1200px;
  aspect-ratio: 16 / 9;
  background: #000;
  border-radius: var(--fm-radius);
  overflow: hidden;
}

.fm-video-modal__frame iframe,
.fm-video-modal__frame video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: #000;
}