.video-welcome { --video-note-height: 0px; --welcome-height: calc(var(--welcome-viewport) - var(--video-note-height)); }
body:has(.preview-note) .video-welcome { --video-note-height: 32px; }
.preview-note { height: 32px; padding: 4px 16px; display: flex; align-items: center; justify-content: center; }
.video-welcome ~ .site-header { z-index: 8; }
.video-welcome ~ .site-header:has(nav.is-open) { z-index: 10; }
.video-welcome ~ .site-header .brand { opacity: var(--video-brand-opacity, 1); transition: none; }
.video-welcome ~ .site-header.video-mark-visible .brand { visibility: hidden; pointer-events: none; }
.video-composition {
  position: relative;
  width: 100%; height: 100%; overflow: hidden; background: #000;
}
.video-still, .video-background { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.video-still { opacity: 1; }
.video-background { opacity: 0; pointer-events: none; }
.has-video .video-still { opacity: 0; }
.has-video .video-background { opacity: 1; }
.video-shade { position: absolute; inset: 0; background-color: rgba(0,0,0,.16); background-image: linear-gradient(180deg, rgba(0,0,0,.12), transparent 45%, rgba(0,0,0,.62)), linear-gradient(90deg, transparent 35%, rgba(0,0,0,.4)); }
.video-unity-logo { position: absolute; width: min(22.8%, 336px); aspect-ratio: 660 / 380; height: auto; right: 6%; bottom: 8%; overflow: hidden; opacity: .92; }
.video-toggle { position: absolute; left: 28px; bottom: 28px; padding: 11px 18px; min-height: 44px; background: rgba(0,0,0,.72); color: #fff; border: 1px solid rgba(255,255,255,.45); border-radius: 30px; font: 600 14px/1.3 Barlow, sans-serif; cursor: pointer; }
.video-toggle[hidden] { display: none; }
.video-toggle:hover { background: #000; border-color: #d6ab64; }
.video-toggle:focus-visible { outline: 3px solid #d6ab64; outline-offset: 4px; }
@media (max-width: 900px) and (orientation: portrait) {
  .video-welcome { --welcome-height: calc(var(--welcome-viewport) - var(--video-note-height) - var(--action-clearance, 81px)); }
  .video-unity-logo { width: 44.4%; left: 27.8%; right: auto; top: auto; bottom: 14%; }
  .video-shade { background-image: linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.05) 35%, rgba(0,0,0,.72)); }
  .video-toggle { left: 18px; bottom: 18px; }
}