/* bg-vimeo.css */

.vimeo-bg-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  z-index: 1; /* adjust if needed so page content is above */
  background: #000;
}

.vimeo-bg-container > iframe {
    display: none;
}

/* player wrapper fills container and preserves cover behaviour */
.vimeo-bg-player {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none; /* avoid clicks on desktop */
}

.vimeo-bg-player iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* Ensure it always covers the container like object-fit: cover */
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  display: block;
  pointer-events: none;
}
.awards_holder {
    z-index: 5;
}

/* overlay play button for mobile */
.vimeo-bg-play-overlay {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    border: none;
    background: transparent;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    display: none; */
    padding: 0;
}

/* play icon (CSS triangle) */
.vimeo-bg-play-icon {
    width: 0;
    height: 0;
    border-left: 26px solid #fff;
    border-top: 16px solid transparent;
    border-bottom: 16px solid transparent;
    margin-left: 6px;
}

/* make sure content sits above the background */
.site, .site-content, #primary, .content {
  position: relative;
  z-index: 1;
}

/* Optional: if you want the video not fixed on mobile (to avoid performance issues), you can add rules */
@media (max-width: 768px) {
    .vimeo-bg-play-overlay {
        display: block;
    }
    .page_logo {
        overflow: hidden;
    }
}