/* Transparent wall branding is the only scroll-animated hero layer. */
.xfg-home .xfg-hero-scroll {position:relative;padding-bottom:0}
.xfg-home .xfg-hero-scroll.is-ready {min-height:calc(var(--hero-art-height,0px) + clamp(220px,36svh,420px))}
.xfg-home .xfg-hero-scroll.is-ready .xfg-campaign--creators {position:sticky;top:0}
@media(max-width:760px){.xfg-home .xfg-hero-scroll.is-ready{min-height:calc(var(--hero-art-height,0px) + clamp(180px,30svh,300px))}}
@media(prefers-reduced-motion:reduce){
    .xfg-home .xfg-hero-scroll.is-ready{min-height:0}
    .xfg-home .xfg-hero-scroll.is-ready .xfg-campaign--creators{position:relative}
}
.xfg-home .xfg-campaign--creators {
    position:relative;
    --hero-brand-left:50%;
    overflow:clip;
    --hero-brand-top:20.8%;
    --hero-brand-width:27%;
}
.xfg-home .xfg-campaign--creators .xfg-hero-brand {
    position:absolute;
    left:var(--hero-brand-left);
    top:var(--hero-brand-top);
    width:var(--hero-brand-width);
    height:auto;
    z-index:2;
    pointer-events:none;
    transform:translate3d(-50%,0,0) scale(var(--hero-brand-scale,1));
    transform-origin:50% 50%;
    will-change:transform;
    backface-visibility:hidden;
}
.xfg-home .xfg-campaign--creators .xfg-hero-brand img {
    display:block;
    width:100%;
    height:auto;
    max-width:none;
    aspect-ratio:auto;
    object-fit:contain;
}
@media(max-width:760px) {
    .xfg-home .xfg-campaign--creators {
        --hero-brand-top:13.8%;
        --hero-brand-width:48%;
    }
}
/* A static, feathered wall patch preserves every original person and room detail. */
.xfg-home .xfg-campaign--creators .xfg-hero-wall {
    position:absolute;inset:0;display:block;z-index:1;pointer-events:none;
    mask-image:linear-gradient(to right,transparent 35.7%,#000 36.8%,#000 62.0%,transparent 62.6%),linear-gradient(transparent 21.6%,#000 23.0%,#000 36.0%,transparent 37.8%);
    mask-composite:intersect;
}
.xfg-home .xfg-campaign--creators .xfg-hero-wall img {display:block;width:100%;height:100%;object-fit:fill}
@media(max-width:760px){
    .xfg-home .xfg-campaign--creators .xfg-hero-wall {
        mask-image:linear-gradient(to right,transparent 26.6%,#000 28%,#000 72.5%,transparent 73.8%),linear-gradient(transparent 14.5%,#000 16%,#000 25.5%,transparent 27%);
    }
}
@media(prefers-reduced-motion:reduce) {
    .xfg-home .xfg-campaign--creators .xfg-hero-brand {
        transform:translateX(-50%);
        will-change:auto;
    }
}