.home-page-v404 .xf-panorama-panel{
  image-rendering:auto;
}

.home-page-v404 .xf-sector-life-layer{
  position:absolute;
  inset:0;
  z-index:7;
  overflow:hidden;
  pointer-events:none;
  perspective:1000px;
}

.home-page-v404 .xf-sector-life{
  --life-from:-9px;
  --life-to:11px;
  position:absolute;
  left:var(--life-x);
  top:var(--life-y);
  width:clamp(86px,9vw,142px);
  height:clamp(92px,14vh,168px);
  opacity:0;
  filter:blur(1px);
  transform:translate(-50%,-50%) translateZ(-18px) scale(.94);
  transition:opacity 1.8s ease,filter 1.8s ease,transform 2.2s ease;
  will-change:opacity,transform;
}

.home-page-v404 .xf-sector-life.is-visible{
  opacity:.72;
  filter:none;
  transform:translate(-50%,-50%) translateZ(0) scale(1);
}

.home-page-v404 .xf-sector-life[data-distance="1"]{opacity:.34;filter:blur(.35px)}
.home-page-v404 .xf-sector-life[data-variant="1"]{--life-from:9px;--life-to:-11px}
.home-page-v404 .xf-sector-life[data-variant="2"]{transform:translate(-48%,-50%) translateZ(0) scale(.96)}
.home-page-v404 .xf-sector-life[data-variant="3"]{transform:translate(-52%,-49%) translateZ(0) scale(1.03)}

.home-page-v404 .xf-life-prism{
  position:absolute;
  inset:12% 4% 7%;
  border:1px solid rgba(255,199,139,.12);
  background:
    linear-gradient(125deg,rgba(255,211,160,.08),transparent 32%,rgba(68,186,201,.05) 60%,transparent),
    linear-gradient(35deg,rgba(255,255,255,.035),transparent 44%);
  clip-path:polygon(10% 18%,74% 0,100% 46%,84% 100%,18% 86%,0 42%);
  mix-blend-mode:screen;
  opacity:.58;
  backdrop-filter:blur(1px) saturate(1.1);
  animation:xf404-prism var(--life-duration) ease-in-out var(--life-delay) infinite alternate;
}

.home-page-v404 .xf-life-person{
  position:absolute;
  bottom:5%;
  width:24%;
  height:70%;
  border-radius:44% 44% 22% 22%;
  background:
    radial-gradient(circle at 50% 12%,rgba(22,16,13,.82) 0 11%,transparent 12%),
    linear-gradient(90deg,transparent 28%,rgba(20,15,13,.78) 29% 71%,transparent 72%) 50% 34%/100% 46% no-repeat,
    linear-gradient(82deg,transparent 28%,rgba(18,14,12,.72) 29% 47%,transparent 48%) 48% 91%/100% 42% no-repeat,
    linear-gradient(98deg,transparent 52%,rgba(18,14,12,.72) 53% 71%,transparent 72%) 52% 91%/100% 42% no-repeat;
  filter:blur(.45px) drop-shadow(0 10px 8px rgba(0,0,0,.32));
  opacity:.52;
  transform-origin:50% 100%;
  mix-blend-mode:multiply;
}

.home-page-v404 .xf-life-person-a{
  left:24%;
  animation:xf404-person-a var(--life-duration) ease-in-out var(--life-delay) infinite;
}

.home-page-v404 .xf-life-person-b{
  right:21%;
  height:62%;
  opacity:.38;
  animation:xf404-person-b calc(var(--life-duration) * 1.37) ease-in-out var(--life-delay) infinite;
}

.home-page-v404 .xf-life-camera .xf-life-person-a,
.home-page-v404 .xf-life-producer .xf-life-person-b{transform:skewX(-4deg)}
.home-page-v404 .xf-life-musician .xf-life-person-a{height:76%;transform:rotate(-3deg)}
.home-page-v404 .xf-life-serve .xf-life-person-a,
.home-page-v404 .xf-life-waiter .xf-life-person-a{width:21%;height:78%}
.home-page-v404 .xf-life-chef .xf-life-person-a,
.home-page-v404 .xf-life-plate .xf-life-person-b{filter:brightness(1.22) blur(.35px) drop-shadow(0 9px 7px rgba(0,0,0,.3))}
.home-page-v404 .xf-life-audience .xf-life-person{height:50%;width:30%;bottom:1%}

.home-page-v404 .xf-sector-live-card{
  position:absolute;
  left:46%;
  bottom:6%;
  z-index:3;
  display:grid;
  gap:2px;
  width:clamp(150px,17vw,230px);
  min-height:78px;
  padding:12px 12px 11px 72px;
  border:1px solid rgba(255,164,99,.58);
  border-radius:8px;
  color:#fff;
  background:
    linear-gradient(90deg,rgba(10,14,18,.12) 0 64px,rgba(10,14,18,.88) 65px),
    var(--live-image,linear-gradient(145deg,#ff6a22,#21a8ae)) left center/64px 100% no-repeat;
  box-shadow:0 15px 34px rgba(0,0,0,.26),0 0 22px rgba(255,111,35,.1);
  backdrop-filter:blur(12px) saturate(1.12);
  text-decoration:none;
  pointer-events:auto;
  opacity:0;
  transform:translateY(8px) scale(.97);
  animation:xf404-live-entrance var(--life-duration) ease-in-out var(--life-delay) infinite;
}

.home-page-v404 .xf-sector-live-card span{font-size:10px;font-weight:900;text-transform:uppercase;color:#ff9f65}
.home-page-v404 .xf-sector-live-card strong{overflow:hidden;font-size:13px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
.home-page-v404 .xf-sector-live-card small{overflow:hidden;color:#d7e5ea;font-size:10px;text-overflow:ellipsis;white-space:nowrap}

@keyframes xf404-person-a{
  0%,12%{transform:translate3d(var(--life-from),1px,0) rotate(-1deg);opacity:.18}
  30%,68%{opacity:.58}
  88%,100%{transform:translate3d(var(--life-to),-1px,0) rotate(1.5deg);opacity:.12}
}

@keyframes xf404-person-b{
  0%,18%{transform:translate3d(6px,0,0) scale(.96);opacity:.12}
  40%,76%{opacity:.43}
  100%{transform:translate3d(-8px,1px,0) scale(1.02);opacity:.1}
}

@keyframes xf404-prism{
  0%{opacity:.2;filter:hue-rotate(-4deg);transform:translate3d(-4px,0,0) rotate(-.4deg)}
  45%{opacity:.62}
  100%{opacity:.3;filter:hue-rotate(6deg);transform:translate3d(6px,-2px,0) rotate(.5deg)}
}

@keyframes xf404-live-entrance{
  0%,20%,88%,100%{opacity:0;transform:translateY(9px) scale(.97)}
  31%,76%{opacity:.96;transform:translateY(0) scale(1)}
}

@media (max-width:720px){
  .home-page-v404 .xf-sector-life[data-distance="1"]{opacity:0;visibility:hidden}
  .home-page-v404 .xf-sector-life{width:112px;height:132px}
  .home-page-v404 .xf-sector-live-card{left:12%;bottom:0;width:min(220px,65vw)}
}

@media (prefers-reduced-motion:reduce){
  .home-page-v404 .xf-life-prism,
  .home-page-v404 .xf-life-person,
  .home-page-v404 .xf-sector-live-card{animation:none!important}
  .home-page-v404 .xf-sector-life.is-visible{opacity:.38}
  .home-page-v404 .xf-sector-live-card{opacity:.92;transform:none}
}
