/* Animated floor scenes copied from the website (categories-jewel.ejs). Keyframes and class names unchanged; chips and layer labels removed. */
.vfo-jc-stage{position:relative;aspect-ratio:4/3;border-radius:20px;overflow:hidden;container-type:inline-size;box-shadow:inset 0 0 0 1px rgb(var(--t)/.16)}
.vfo-jc-stage :is(i,b,div,span){position:absolute;display:block}
.vfo-jc-stage svg{display:block;overflow:visible}
/* SPC: exploded layers + water beading */
.vfo-jc-spc{inset:0;background:radial-gradient(70% 60% at 28% 30%,rgb(5 148 199/.2),transparent 70%),linear-gradient(165deg,#f3fbff,#d6ebf5)}
.vfo-jc-spc .vfo-jc-shadow{left:2cqw;top:52cqw;width:56cqw;height:16cqw;border-radius:50%;background:radial-gradient(closest-side,rgb(3 70 100/.28),transparent)}
.vfo-jc-stack{left:3cqw;top:25cqw;width:53cqw;aspect-ratio:176/128}
.vfo-jc-l{inset:0}.vfo-jc-l>svg{width:100%;height:100%}
.vfo-jc-l1{transform:translateY(-48%)}.vfo-jc-l2{transform:translateY(-32%)}.vfo-jc-l3{transform:translateY(-16%)}
.vfo-jc-face{inset:0;clip-path:polygon(33% 3%,97% 54%,66.5% 78%,2.3% 27%)}
.vfo-jc-sheen{top:-20%;left:0;width:26%;height:140%;background:linear-gradient(90deg,transparent,rgb(255 255 255/.85),transparent);transform:translateX(-160%) rotate(28deg)}
.vfo-jc-bead,.vfo-jc-ring{left:var(--x);top:var(--y)}
.vfo-jc-bead{width:6.2cqw;height:4.2cqw;margin:-3cqw 0 0 -3.1cqw;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff 0 16%,rgb(190 235 252/.95) 34%,rgb(5 148 199/.8) 100%);box-shadow:0 .7cqw 1cqw rgb(3 70 100/.35),inset 0 -.4cqw .6cqw rgb(3 80 120/.35)}
.vfo-jc-ring{width:12cqw;height:6.4cqw;margin:-3.2cqw 0 0 -6cqw;border-radius:50%;border:.45cqw solid rgb(255 255 255/.95);box-shadow:0 0 0 .3cqw rgb(5 148 199/.35);opacity:0}
/* Laminate: paws and keys, no marks */
.vfo-jc-lam{inset:0;background:#e8cfa9}
.vfo-jc-floor{inset:-78% -34% -4%;transform:perspective(110cqw) rotateX(42deg);transform-origin:50% 100%}
.vfo-jc-floor>svg{inset:0;width:100%;height:100%}
.vfo-jc-haze{inset:0 0 auto;height:24%;background:linear-gradient(180deg,rgb(255 246 232/.95),rgb(255 246 232/0))}
.vfo-jc-paw{left:var(--x);top:var(--y);width:12%;aspect-ratio:1;color:rgb(70 40 16/.42);transform:rotate(var(--r));opacity:0}
.vfo-jc-paw svg{width:100%;height:100%}
.vfo-jc-keys{left:50cqw;top:44cqw;width:27cqw;aspect-ratio:64/40;filter:drop-shadow(0 1.2cqw 1cqw rgb(60 30 5/.35))}
.vfo-jc-keys svg{width:100%;height:100%}
.vfo-jc-glint{top:-30%;left:0;width:30%;height:160%;background:linear-gradient(90deg,transparent,rgb(255 250 235/.75),transparent);transform:translateX(-140%) rotate(22deg)}
/* Tile: set, wipe, stay cool */
.vfo-jc-tile{inset:0;background:linear-gradient(180deg,#f7f1ff,#e7ddfb)}
.vfo-jc-tfloor{inset:-62% -38% -4%;transform:perspective(110cqw) rotateX(44deg);transform-origin:50% 100%;display:grid!important;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:.8cqw;padding:.8cqw;background:repeating-linear-gradient(90deg,rgb(255 255 255/.28) 0 .5cqw,transparent .5cqw 1.6cqw),#c9c2d6}
.vfo-jc-tfloor>i:not([class]){position:relative;border-radius:.5cqw;background:linear-gradient(118deg,transparent 40%,rgb(120 108 150/.22) 43%,rgb(110 98 135/.4) 43.6%,rgb(120 108 150/.18) 44.4%,transparent 48%),linear-gradient(32deg,transparent 60%,rgb(125 112 150/.16) 63.5%,rgb(125 112 150/.3) 64%,transparent 68%),linear-gradient(160deg,transparent 16%,rgb(140 128 165/.2) 21%,transparent 26%),radial-gradient(60% 50% at 30% 30%,rgb(255 255 255/.9),transparent),linear-gradient(145deg,#fdfcff,#e6e1ef);box-shadow:inset 0 0 0 1px rgb(255 255 255/.8)}
.vfo-jc-tfloor>i:not([class]):nth-child(2n){background-position:40% 0,0 0,30% 0,0 0,0 0;background-size:180% 100%,100% 100%,140% 100%,100% 100%,100% 100%}
.vfo-jc-tfloor>i:not([class]):nth-child(3n){background-size:100% 140%,160% 100%,100% 100%,100% 100%,100% 100%}
.vfo-jc-cool{inset:0;background:radial-gradient(60% 55% at 50% 72%,rgb(120 170 255/.4),transparent 70%);opacity:.55}
.vfo-jc-spill{left:var(--x);top:var(--y);width:var(--w);aspect-ratio:1.4;border-radius:48% 52% 45% 55%/55% 45% 55% 45%;background:radial-gradient(circle at 35% 30%,rgb(255 230 200/.7) 0 8%,transparent 20%),radial-gradient(circle at 50% 50%,#8a4d22,#5e3113);opacity:0}
.vfo-jc-cloth{left:0;top:40%;width:22%;height:24%;border-radius:1.6cqw;background:repeating-linear-gradient(45deg,rgb(255 255 255/.2) 0 .6cqw,transparent .6cqw 1.2cqw),linear-gradient(150deg,#b69cff,#7d4df5);box-shadow:0 2cqw 2.4cqw -1cqw rgb(60 30 120/.45);opacity:0;transform:translateX(-120%)}
.vfo-jc-sun{right:-8cqw;top:-9cqw;width:30cqw;height:30cqw;border-radius:50%;background:radial-gradient(circle,#ffd37a 0 34%,rgb(255 180 80/.55) 36%,rgb(255 170 60/0) 70%)}
.vfo-jc-heat{left:var(--x);top:9cqw;width:9cqw;height:14cqw;color:rgb(232 120 40/.75);opacity:.45}
.vfo-jc-heat svg{width:100%;height:100%}
.vfo-jc-spark{left:var(--x);top:var(--y);width:6cqw;height:6cqw;color:#fff;opacity:0;filter:drop-shadow(0 0 1cqw rgb(128 77 245/.9))}
.vfo-jc-spark svg{width:100%;height:100%}
/* Carpet: plush, springs back, quiet */
.vfo-jc-rug{inset:0;background:radial-gradient(80% 60% at 50% 100%,rgb(255 176 120/.35),transparent 70%),linear-gradient(175deg,#fff5f8,#fad7e4)}
.vfo-jc-warm{left:-10%;right:-10%;bottom:0;height:50%;background:radial-gradient(60% 70% at 50% 100%,rgb(255 150 90/.45),transparent 72%);opacity:.6}
.vfo-jc-back{left:0;right:0;bottom:7cqw;height:18cqw;background:linear-gradient(180deg,rgb(214 80 135/0),#b8336c 40%,#8c1f4c)}
.vfo-jc-base{left:0;right:0;bottom:0;height:8cqw;background:repeating-linear-gradient(90deg,rgb(255 255 255/.14) 0 .6cqw,transparent .6cqw 1.6cqw),linear-gradient(180deg,#8c1f4c,#6b1639)}
.vfo-jc-f{left:calc(-1cqw + var(--i) * 2.55cqw);bottom:7.5cqw;width:3.3cqw;height:var(--h,26cqw);transform-origin:50% 100%}
.vfo-jc-f b{inset:0;border-radius:1.7cqw 1.7cqw .4cqw .4cqw;background:linear-gradient(180deg,#ffd0e1,#f07fad 30%,#dc4f8b 70%,#a82a60);box-shadow:inset .4cqw 0 .5cqw rgb(255 255 255/.3),-.3cqw 0 .6cqw rgb(120 20 60/.25);transform:rotate(var(--r,0deg));transform-origin:50% 100%}
.vfo-jc-foot2{left:34cqw;top:25cqw;width:30cqw;aspect-ratio:1;opacity:0;transform:translateY(-60cqw);filter:drop-shadow(0 1.4cqw 1.4cqw rgb(120 20 60/.3))}
.vfo-jc-foot2 svg{width:100%;height:100%}
.vfo-jc-wave{left:var(--x);top:27cqw;width:10cqw;height:15cqw;border-radius:50%;border:.7cqw solid transparent;opacity:0}
.vfo-jc-wave--l{border-left-color:rgb(173 33 89/.6)}.vfo-jc-wave--r{border-right-color:rgb(173 33 89/.6)}
@media (prefers-reduced-motion:no-preference){
.is-on .vfo-jc-stage *{animation:var(--a) var(--dur) cubic-bezier(.45,0,.2,1) var(--d,0s) infinite}
.is-off .vfo-jc-stage *{animation-play-state:paused!important}
.is-on .vfo-jc-l1{--a:vjc-s-l1}.is-on .vfo-jc-l2{--a:vjc-s-l2}.is-on .vfo-jc-l3{--a:vjc-s-l3}
.is-on .vfo-jc-bead{--a:vjc-s-bead}.is-on .vfo-jc-ring{--a:vjc-s-ring}.is-on .vfo-jc-sheen{--a:vjc-s-sheen}
.is-on .vfo-jc-paw{--a:vjc-s-paw}.is-on .vfo-jc-keys{--a:vjc-s-keys}.is-on .vfo-jc-glint{--a:vjc-s-glint}
.is-on .vfo-jc-tfloor>i:not([class]){--a:vjc-s-set}.is-on .vfo-jc-spill{--a:vjc-s-spill}.is-on .vfo-jc-cloth{--a:vjc-s-cloth}.is-on .vfo-jc-spark{--a:vjc-s-spark}.is-on .vfo-jc-heat{--a:vjc-s-heat}.is-on .vfo-jc-cool{--a:vjc-s-cool}
.is-on .vfo-jc-f{--a:vjc-s-press}.is-on .vfo-jc-f b{--a:vjc-sway;animation-duration:3.4s;animation-delay:calc(var(--i) * -.13s);animation-timing-function:ease-in-out}.is-on .vfo-jc-foot2{--a:vjc-s-step}.is-on .vfo-jc-wave{--a:vjc-s-wave}.is-on .vfo-jc-warm{--a:vjc-s-warm}
.vfo-jc-shadow,.vfo-jc-face,.vfo-jc-l4,.vfo-jc-l>svg,.vfo-jc-l>svg *,.vfo-jc-floor,.vfo-jc-floor>svg,.vfo-jc-floor>svg *,.vfo-jc-haze,.vfo-jc-stage svg,.vfo-jc-stage svg *,.vfo-jc-tfloor,.vfo-jc-sun,.vfo-jc-back,.vfo-jc-base{--a:none!important}
}
@keyframes vjc-s-l1{0%,18%{transform:translateY(-48%)}30%{transform:translateY(1.2%)}34%,78%{transform:translateY(0)}90%,100%{transform:translateY(-48%)}}
@keyframes vjc-s-l2{0%,19%{transform:translateY(-32%)}30%{transform:translateY(.8%)}33%,79%{transform:translateY(0)}90%,100%{transform:translateY(-32%)}}
@keyframes vjc-s-l3{0%,20%{transform:translateY(-16%)}29%{transform:translateY(.5%)}32%,80%{transform:translateY(0)}90%,100%{transform:translateY(-16%)}}
@keyframes vjc-s-bead{0%,9%{transform:none;opacity:1}17%{transform:translate(8cqw,5cqw) scale(.6);opacity:0}18%,37%{transform:translateY(-38cqw) scale(.7,1.4);opacity:0}39%{opacity:1}45%{transform:translateY(0) scale(.7,1.4)}49%{transform:scale(1.35,.66)}54%{transform:scale(.92,1.1)}59%,100%{transform:none;opacity:1}}
@keyframes vjc-s-ring{0%,44.5%{transform:scale(.2);opacity:0}45.5%{transform:scale(.3);opacity:1}58%,100%{transform:scale(1.6);opacity:0}}
@keyframes vjc-s-sheen{0%,62%{transform:translateX(-160%) rotate(28deg)}76%,100%{transform:translateX(460%) rotate(28deg)}}
@keyframes vjc-s-paw{0%,14%{transform:rotate(var(--r)) scale(.5);opacity:0}17%{transform:rotate(var(--r)) scale(1.08);opacity:1}20%{transform:rotate(var(--r)) scale(1)}30%{opacity:.9}40%,100%{transform:rotate(var(--r)) scale(1);opacity:0}}
@keyframes vjc-s-keys{0%,8%{transform:none;opacity:1}15%{transform:translate(5cqw,-16cqw) rotate(-25deg);opacity:0}16%,44%{transform:translateY(-46cqw) rotate(-40deg);opacity:0}46%{opacity:1}52%{transform:translateY(0) rotate(7deg)}56%{transform:translateY(-4cqw) rotate(-5deg)}60%{transform:translate(-1cqw,0) rotate(3deg)}65%,100%{transform:none;opacity:1}}
@keyframes vjc-s-glint{0%,64%{transform:translateX(-140%) rotate(22deg)}80%,100%{transform:translateX(420%) rotate(22deg)}}
@keyframes vjc-s-set{0%,7%{transform:none;opacity:1}12%{transform:scale(1.08);opacity:0}12.5%,18%{transform:translateY(-5%) scale(1.14);opacity:0}26%{transform:scale(.985);opacity:1}29%,100%{transform:none;opacity:1}}
@keyframes vjc-s-spill{0%,34%{transform:scale(.3);opacity:0}40%{transform:scale(1.06);opacity:.95}43%{transform:scale(1)}53%{opacity:.95}56%,100%{transform:scale(1);opacity:0}}
@keyframes vjc-s-cloth{0%,47%{transform:translateX(-130%);opacity:0}49%{opacity:1}62%{transform:translateX(520%);opacity:1}64%,100%{transform:translateX(560%);opacity:0}}
@keyframes vjc-s-spark{0%,60%{transform:scale(0) rotate(0);opacity:0}65%{transform:scale(1) rotate(45deg);opacity:1}72%,100%{transform:scale(0) rotate(90deg);opacity:0}}
@keyframes vjc-s-heat{0%{transform:none;opacity:.45}8%,68%{transform:translateY(4cqw);opacity:0}78%{transform:translateY(0);opacity:.85}92%{transform:translateY(-3cqw);opacity:.3}100%{transform:none;opacity:.45}}
@keyframes vjc-s-cool{0%{opacity:.55}10%,70%{opacity:0}84%{opacity:1}100%{opacity:.55}}
@keyframes vjc-s-press{0%,20%{transform:none}28%,44%{transform:scaleY(var(--c,1))}50%{transform:scaleY(calc(1 + (1 - var(--c,1)) * .14))}56%{transform:scaleY(.97)}62%,100%{transform:none}}
@keyframes vjc-sway{0%,100%{transform:rotate(calc(var(--r,0deg) - 3deg))}50%{transform:rotate(calc(var(--r,0deg) + 3deg))}}
@keyframes vjc-s-step{0%,6%{transform:translateY(-60cqw);opacity:0}9%{opacity:1}22%{transform:translateY(-8cqw)}28%,44%{transform:translateY(0);opacity:1}57%{transform:translateY(-60cqw);opacity:1}58%,100%{transform:translateY(-60cqw);opacity:0}}
@keyframes vjc-s-wave{0%,27%{transform:translateX(0) scale(.5);opacity:0}30%{opacity:.8}42%,100%{transform:translateX(var(--dx)) scale(1.1);opacity:0}}
@keyframes vjc-s-warm{0%{opacity:.6}50%{opacity:.4}72%{opacity:1}100%{opacity:.6}}

/* Tile card: the real Arezzo Bianco marble with a moving shine */
.vfo-jc-tile{background:#d8d4cc}
.vfo-jc-tfloor{inset:-125% -70% -6%;transform:perspective(120cqw) rotateX(40deg);gap:.5cqw;padding:.5cqw;background:#a9a59c}
.vfo-jc-tfloor>i:not([class]),.vfo-jc-tfloor>i:not([class]):nth-child(2n),.vfo-jc-tfloor>i:not([class]):nth-child(3n){border-radius:0;box-shadow:none;background-image:url(../assets/icons/tile-marble.webp);background-size:220% 220%;--a:none!important;opacity:1;transform:none}
.vfo-jc-cloth{background:repeating-linear-gradient(45deg,rgb(255 255 255/.25) 0 .6cqw,transparent .6cqw 1.2cqw),linear-gradient(150deg,#ff8db2,#e0186f);box-shadow:0 2cqw 2.4cqw -1cqw rgb(120 20 70/.45)}
.vfo-jc-spark{filter:drop-shadow(0 0 1cqw rgb(255 255 255/.95))}
.vfo-jc-tshine{inset:-30% auto -30% 0;width:34%;background:linear-gradient(90deg,transparent,rgb(255 255 255/.55),transparent);transform:translateX(-160%) rotate(20deg)}
.is-on .vfo-jc-tshine{--a:vjc-s-sheen}