.bunny-bg {
  pointer-events: none;
  color: #fff;
  isolation: isolate;
  border-radius: 1em;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  transform: translateX(0);
}

.bunny-bg__video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  padding-bottom: 0;
  padding-right: 0;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

/* Animation */
[data-bunny-background-init] :is(.bunny-bg__placeholder, .bunny-bg__loading) {
  transition: opacity 0.3s linear, visibility 0.3s linear;
}

/* Placeholder */
.bunny-bg__placeholder {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
}

[data-bunny-background-init][data-player-status=playing] .bunny-bg__placeholder,
[data-bunny-background-init][data-player-status=paused] .bunny-bg__placeholder,
[data-bunny-background-init][data-player-activated=true][data-player-status=ready] .bunny-bg__placeholder {
  opacity: 0;
  visibility: hidden;
}

/* Loading */
.bunny-bg__loading {
  opacity: 0;
  visibility: hidden;
  background-color: rgba(0, 0, 0, 0.3294117647);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
}

.bunny-bg__loading-svg {
  width: 6em;
}

[data-bunny-background-init][data-player-status=loading] .bunny-bg__loading {
  opacity: 1;
  visibility: visible;
}

/* Play/Pause */
.bunny-bg__playpause {
  pointer-events: auto;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  bottom: 4vw;
  right: 4vw;
}

.bunny-bg__btn {
  -webkit-backdrop-filter: blur(1em);
  backdrop-filter: blur(1em);
  cursor: pointer;
  background-color: rgba(100, 100, 100, 0.3019607843);
  border: 1px solid rgba(255, 255, 255, 0.1019607843);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 3em;
  height: 3em;
  padding: 0.8125em;
  display: flex;
  position: relative;
}

.bunny-bg__pause-svg {
  display: none;
}

[data-bunny-background-init][data-player-status=playing] .bunny-bg__play-svg,
[data-bunny-background-init][data-player-status=loading] .bunny-bg__play-svg {
  display: none;
}

[data-bunny-background-init][data-player-status=playing] .bunny-bg__pause-svg,
[data-bunny-background-init][data-player-status=loading] .bunny-bg__pause-svg {
  display: block;
}

@media screen and (max-width: 991px) {
  .bunny-bg__playpause {
    bottom: 1em;
    right: 1em;
  }
}
/* Agilitus: full-bleed hero, so no rounded corners */
.hero.video .video-wrapper .bunny-bg {
  border-radius: 0;
}

/* Agilitus: the hero content layer sits over the video, so Osmo's pause control can never
   be reached there. Hidden to match the previous hero video, which had no control either. */
.hero .video-wrapper .bunny-bg__playpause {
  display: none;
}

/* Trigger: the hero "Watch the Video" pill is a <button>, so drop UA button styling */
button.dc-vide-button {
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
}

/* Lightbox */
.bunny-lightbox {
  z-index: 300;
  pointer-events: none;
  justify-content: center;
  align-items: center;
  padding: 5vw;
  display: flex;
  position: fixed;
  inset: 0;
  overflow: hidden;
}

.bunny-lightbox__calc {
  transition: transform 0.3s cubic-bezier(0.625, 0.05, 0, 1), opacity 0.3s linear, visibility 0.3s linear;
  width: 100%;
  height: 100%;
  position: relative;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.9) rotate(0.001deg);
}

[data-bunny-lightbox-status=active] .bunny-lightbox__calc {
  opacity: 1;
  visibility: visible;
  transform: scale(1) rotate(0.001deg);
}

.bunny-lightbox__dark {
  opacity: 0.95;
  pointer-events: auto;
  background-color: #191512;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
}

.bunny-lightbox__close {
  z-index: 600;
  pointer-events: auto;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 3em;
  height: 3em;
  display: flex;
  position: absolute;
  top: 2.5vw;
  right: 2.5vw;
  padding: 0;
  border: none;
  font: inherit;
  cursor: pointer;
}

.bunny-lightbox__close-bar {
  background-color: currentColor;
  width: 1em;
  height: 0.125em;
  position: absolute;
  transform: rotate(-45deg);
}

.bunny-lightbox__close-bar.is--duplicate {
  transform: rotate(45deg);
}

[data-bunny-lightbox-status] .bunny-lightbox__dark,
[data-bunny-lightbox-status] .bunny-lightbox__close {
  transition: opacity 0.3s linear, visibility 0.3s linear;
  opacity: 0;
  visibility: hidden;
}

[data-bunny-lightbox-status=active] .bunny-lightbox__dark,
[data-bunny-lightbox-status=active] .bunny-lightbox__close {
  opacity: 1;
  visibility: visible;
}

/* Player */
.bunny-lightbox-player {
  pointer-events: none;
  color: #fff;
  isolation: isolate;
  border-radius: 1em;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
  -webkit-mask-image: radial-gradient(#fff, #000);
  mask-image: radial-gradient(#fff, #000);
}

.bunny-lightbox-player__before {
  padding-top: 62.5%;
}

/* Animation */
[data-bunny-lightbox-init] :is(.bunny-lightbox-player__placeholder, .bunny-lightbox-player__dark, .bunny-lightbox-player__playpause, .bunny-lightbox-player__loading) {
  transition: opacity 0.3s linear, visibility 0.3s linear;
}

/* Placeholder */
.bunny-lightbox-player__placeholder {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
}

[data-bunny-lightbox-init][data-player-status=playing] .bunny-lightbox-player__placeholder,
[data-bunny-lightbox-init][data-player-status=paused] .bunny-lightbox-player__placeholder,
[data-bunny-lightbox-init][data-player-activated=true][data-player-status=ready] .bunny-lightbox-player__placeholder {
  opacity: 0;
  visibility: hidden;
}

/* Dark Overlay */
.bunny-lightbox-player__dark {
  opacity: 0.1;
  background-color: #000;
  width: 100%;
  height: 100%;
  position: absolute;
}

[data-bunny-lightbox-init][data-player-status=paused] .bunny-lightbox-player__dark,
[data-bunny-lightbox-init][data-player-status=playing][data-player-hover=active] .bunny-lightbox-player__dark {
  opacity: 0.3;
}

[data-bunny-lightbox-init][data-player-status=playing] .bunny-lightbox-player__dark {
  opacity: 0;
}

.bunny-lightbox-player__video {
  width: 100%;
  height: 100%;
  padding-bottom: 0;
  padding-right: 0;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

/* Play/Pause */
.bunny-lightbox-player__playpause {
  pointer-events: auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
}

[data-bunny-lightbox-init][data-player-status=playing] .bunny-lightbox-player__playpause,
[data-bunny-lightbox-init][data-player-status=loading] .bunny-lightbox-player__playpause {
  opacity: 0;
}

[data-bunny-lightbox-init][data-player-status=playing][data-player-hover=active] .bunny-lightbox-player__playpause {
  opacity: 1;
}

[data-bunny-lightbox-init][data-player-status=playing] .bunny-lightbox-player__play-svg,
[data-bunny-lightbox-init][data-player-status=loading] .bunny-lightbox-player__play-svg {
  display: none;
}

[data-bunny-lightbox-init][data-player-status=playing] .bunny-lightbox-player__pause-svg,
[data-bunny-lightbox-init][data-player-status=loading] .bunny-lightbox-player__pause-svg {
  display: block;
}

/* Loading */
.bunny-lightbox-player__loading {
  opacity: 0;
  visibility: hidden;
  background-color: rgba(0, 0, 0, 0.3294117647);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
}

[data-bunny-lightbox-init][data-player-status=loading] .bunny-lightbox-player__loading {
  opacity: 1;
  visibility: visible;
}

/* Interface */
.bunny-lightbox-player__interface {
  flex-flow: column;
  justify-content: flex-end;
  align-items: baseline;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  transition: all 0.6s cubic-bezier(0.625, 0.05, 0, 1);
}

[data-bunny-lightbox-init][data-player-status=playing] .bunny-lightbox-player__interface,
[data-bunny-lightbox-init][data-player-status=loading] .bunny-lightbox-player__interface {
  opacity: 0;
  transform: translateY(1em) rotate(0.001deg);
}

[data-bunny-lightbox-init][data-player-status=playing][data-player-hover=active] .bunny-lightbox-player__interface,
[data-bunny-lightbox-init][data-player-status=loading][data-player-hover=active] .bunny-lightbox-player__interface {
  opacity: 1;
  transform: translateY(0em) rotate(0.001deg);
}

.bunny-lightbox-player__interface-bottom {
  grid-column-gap: 1em;
  grid-row-gap: 1em;
  pointer-events: auto;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: min(2em, 4vw);
  display: flex;
  position: relative;
}

.bunny-lightbox-player__toggle-mute,
.bunny-lightbox-player__toggle-fullscreen {
  cursor: pointer;
  width: 1.5em;
  height: 1.5em;
}

.bunny-lightbox-player__timeline {
  cursor: pointer;
  flex: 1;
  align-items: center;
  height: 1em;
  margin-left: 0.5em;
  margin-right: 0.5em;
  display: flex;
  position: relative;
}

[data-bunny-lightbox-init][data-player-status=idle][data-player-activated=false] .bunny-lightbox-player__timeline,
[data-bunny-lightbox-init][data-player-status=ready][data-player-activated=false] .bunny-lightbox-player__timeline {
  pointer-events: none;
}

.bunny-lightbox-player__timeline-progress {
  pointer-events: none;
  background-color: var(--theme-color);
  border-radius: 1em;
  width: 100%;
  height: 100%;
  position: absolute;
  transform: translateX(-100%);
}

.bunny-lightbox-player__timeline-buffered {
  opacity: 0.2;
  pointer-events: none;
  background-color: #fff;
  border-radius: 1em;
  width: 100%;
  height: 100%;
  position: absolute;
  transform: translateX(-100%);
}

.bunny-lightbox-player__timeline-handle {
  transition: transform 0.15s ease-in-out;
  pointer-events: none;
  background-color: var(--theme-color);
  border-radius: 1em;
  width: 1em;
  height: 1em;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) scale(0);
}

[data-bunny-lightbox-init][data-timeline-drag=true] .bunny-lightbox-player__timeline-handle {
  transform: translate(-50%, -50%) scale(1);
}

.bunny-lightbox-player__timeline-bar {
  border-radius: 1em;
  width: 100%;
  height: 30%;
  position: absolute;
  overflow: hidden;
}

.bunny-lightbox-player__time {
  grid-column-gap: 0.125em;
  grid-row-gap: 0.125em;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 5.75em;
  display: flex;
}

.bunny-lightbox-player__timeline-bg {
  background-color: rgba(255, 255, 255, 0.1490196078);
  border-radius: 1em;
  width: 100%;
  height: 100%;
  position: absolute;
}

.bunny-lightbox-player__toggle-playpause {
  cursor: pointer;
  width: 1.5em;
  height: 1.5em;
}

.bunny-lightbox-player__text {
  white-space: nowrap;
  margin-bottom: 0;
  font-size: 0.9375em;
  line-height: 1;
}

.bunny-lightbox-player__big-btn {
  -webkit-backdrop-filter: blur(1em);
  backdrop-filter: blur(1em);
  cursor: pointer;
  background-color: rgba(100, 100, 100, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.1019607843);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 6em;
  height: 6em;
  padding: 2em;
  display: flex;
  position: relative;
}

.bunny-lightbox-player__loading-svg {
  width: 6em;
}

.bunny-lightbox-player__pause-svg {
  display: none;
}

.bunny-lightbox-player__interface-fade {
  opacity: 0.5;
  background-image: linear-gradient(rgba(0, 0, 0, 0), #000);
  width: 100%;
  height: 25%;
  position: absolute;
  bottom: 0;
}

.bunny-lightbox-player__interface-btns {
  grid-column-gap: 0.5em;
  grid-row-gap: 0.5em;
  align-items: center;
  display: flex;
}

[data-bunny-lightbox-init][data-player-muted=true] .bunny-lightbox-player__volume-mute-svg {
  display: block;
}

[data-bunny-lightbox-init][data-player-muted=true] .bunny-lightbox-player__volume-up-svg {
  display: none;
}

.bunny-lightbox-player__volume-mute-svg {
  display: none;
}

.bunny-lightbox-player__volume-up-svg {
  display: block;
}

.bunny-lightbox-player__fullscreen-shrink-svg {
  display: none;
}

.bunny-lightbox-player__fullscreen-scale-svg {
  display: block;
}

[data-bunny-lightbox-init][data-player-fullscreen=true] .bunny-lightbox-player__fullscreen-shrink-svg {
  display: block;
}

[data-bunny-lightbox-init][data-player-fullscreen=true] .bunny-lightbox-player__fullscreen-scale-svg {
  display: none;
}

/* Cover Mode */
[data-bunny-lightbox-init][data-player-update-size=cover] {
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
}

[data-bunny-lightbox-init][data-player-update-size=cover] [data-player-before] {
  display: none;
}

[data-bunny-lightbox-init][data-player-update-size=cover][data-player-fullscreen=false] .bunny-lightbox-player__video {
  object-fit: cover;
}

/* Agilitus: sit above the fixed site header (z-index 100000) */
.bunny-lightbox {
  z-index: 100010;
}