/* A single 139 KiB smoke texture, animated with compositor-friendly properties only. */
.elementor-element.ua-atmosphere {
  position: relative;
  isolation: isolate;
  --ua-smoke-strength: .17;
  --ua-motion-accent: #cdb5e4;
}

/* Empty generated content is decorative. Clip its own plane, not the hero's links/content. */
.ua-atmosphere::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0 auto 0 0;
  width: min(58vw, 700px);
  pointer-events: none;
  background: url("smoke-wisp.webp") left bottom / 100% auto no-repeat;
  -webkit-mask-image: linear-gradient(180deg, transparent 8%, #000 32%, #000 75%, transparent 98%);
  mask-image: linear-gradient(180deg, transparent 8%, #000 32%, #000 75%, transparent 98%);
  clip-path: inset(0);
  opacity: var(--ua-smoke-strength);
  transform-origin: 18% 80%;
  animation: ua-smoke-drift 18s ease-in-out infinite;
  animation-delay: -5s;
  animation-play-state: paused;
}

.ua-atmosphere[data-motion="running"]::after { animation-play-state: running; }
.ua-atmosphere--home > .e-con-inner > .e-con,
.ua-atmosphere--bubba > .bb-shell { position: relative; z-index: 2; }

.elementor .elementor-element.ua-atmosphere--home {
  border: 0;
  --border-width: 0px;
  --border-top-width: 0px;
  --border-right-width: 0px;
  --border-bottom-width: 0px;
  --border-left-width: 0px;
  --padding-bottom: 76px;
}
.ua-atmosphere--home > .e-con-inner > .elementor-background-video-container { border: 0; }

.elementor-element.ua-atmosphere--bubba {
  --ua-smoke-strength: .14;
  --ua-motion-accent: #e9b343;
  padding-bottom: 96px;
}
.ua-atmosphere--bubba::after {
  width: min(49vw, 590px);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 28%, #000 72%, transparent);
  mask-image: linear-gradient(180deg, transparent, #000 28%, #000 72%, transparent);
}
.ua-atmosphere--bubba .bb-logo img {
  aspect-ratio: 1;
  mix-blend-mode: lighten;
  -webkit-mask-image: radial-gradient(circle at center, #000 62%, transparent 72%);
  mask-image: radial-gradient(circle at center, #000 62%, transparent 72%);
}

.ua-atmosphere .ua-motion-control {
  position: absolute;
  z-index: 3;
  right: clamp(20px, 4vw, 64px);
  bottom: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 134px;
  min-height: 44px;
  margin: 0;
  padding: 10px 15px;
  border: 1px solid #746976;
  border-radius: 999px;
  background: #211c24;
  color: #f8f2ec;
  font: 500 12px/1.2 Arial, sans-serif;
  letter-spacing: .02em;
  cursor: pointer;
  box-shadow: none;
  transition: border-color .2s ease, background-color .2s ease;
}
.ua-atmosphere--bubba .ua-motion-control { background: #201b14; border-color: #75644b; }
.ua-atmosphere .ua-motion-control:hover { background: #322b35; border-color: var(--ua-motion-accent); }
.ua-atmosphere .ua-motion-control:focus-visible { outline: 2px solid var(--ua-motion-accent); outline-offset: 4px; }
.ua-atmosphere .ua-motion-control:disabled { cursor: default; opacity: 1; }
.ua-atmosphere .ua-motion-control svg { display: block; flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ua-motion-control .ua-motion-play, .ua-motion-control[data-paused="true"] .ua-motion-pause { display: none; }
.ua-motion-control[data-paused="true"] .ua-motion-play { display: block; }

@keyframes ua-smoke-drift {
  0%, 100% { transform: translate3d(-8px, 24px, 0) scale(1); opacity: calc(var(--ua-smoke-strength) * .6); }
  45% { transform: translate3d(8px, -20px, 0) scale(1.04); opacity: var(--ua-smoke-strength); }
  72% { transform: translate3d(14px, -40px, 0) scale(1.065); opacity: calc(var(--ua-smoke-strength) * .8); }
}

@media (max-width: 767px) {
  .elementor-element.ua-atmosphere { --ua-smoke-strength: .12; }
  .ua-atmosphere::after { width: min(105vw, 440px); left: -80px; background-position: left bottom; }
  .ua-atmosphere--bubba::after { background-position: left 85%; }
  .ua-atmosphere .ua-motion-control { bottom: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .ua-atmosphere::after { animation: none; transform: none; opacity: .08; }
  .ua-atmosphere .ua-motion-control { transition: none; }
  .ua-atmosphere .elementor-background-video-container { visibility: hidden; }
}
@media (forced-colors: active) {
  .ua-atmosphere::after { display: none; }
  .ua-atmosphere .ua-motion-control { border: 1px solid ButtonText; color: ButtonText; background: Canvas; }
}
