/* Volleyball-only direction: official Molten NCAA FLISTATEC V5M5000-3N product imagery. */
.ball.basket,.ball.soccer,.ball.base,.ball.tennis,.ball.foot { display:none; }
.ball.volley {
  content:url('molten-v5m5000-3n.png');
  width:54%; max-width:700px; right:auto; left:50%; top:50%;
  translate:-50% -50%; object-fit:contain; object-position:center;
  filter:drop-shadow(0 32px 26px #112a2335);
}
.ball-system .ball-mark { right:8%; bottom:18%; color:#312951; }
.menu-orbit { display:none; }
.menu-ball { background-image:url('molten-v5m5000-3n.png'); width:72%; left:14%; top:7%; }
.menu-cards { background:radial-gradient(circle at 18% 18%,#fff 0 1px,transparent 1.5px) 0 0/22px 22px,linear-gradient(138deg,#eef0ea 0%,#d7d8d2 50%,#b9d1cf 120%); }
.final-orbit img { content:url('molten-v5m5000-3n.png'); }
@media(max-width:700px){
  .ball.volley { width:88%; top:48%; }
  .ball-system .ball-mark { right:7%; bottom:21%; }
}
/* Scroll-driven court blueprint and action-photo paint reveals. */
.ball.volley { z-index:5; }
.court-skeleton {
  position:absolute; z-index:3; width:min(47vw,610px); height:min(74vh,760px);
  left:50%; top:50%; translate:-50% calc(-50% + var(--court-y,-90px));
  opacity:calc(.12 + var(--reveal,0) * .56); pointer-events:none;
  color:#e11937; mix-blend-mode:multiply; transition:opacity .1s linear;
}
.court-skeleton svg { width:100%; height:100%; overflow:visible; filter:drop-shadow(0 1px 0 #ffffffa6); }
.court-skeleton path,.court-skeleton ellipse { fill:none; stroke:currentColor; stroke-width:2.15; vector-effect:non-scaling-stroke; }
.paint-reveal {
  position:absolute; z-index:7; width:min(43vw,550px); aspect-ratio:1; left:50%; top:50%;
  translate:-50% -50%; overflow:hidden; pointer-events:none;
  clip-path:circle(47% at 50% 50%); opacity:var(--reveal,0);
}
.paint-reveal .stroke { position:absolute; left:-12%; width:124%; height:11%; background-image:url('nebraska-volleyball-action.jpg'); background-size:cover; background-position:center; mix-blend-mode:normal; box-shadow:0 1px 0 #ffffff62; }
.stroke-a { top:25%; clip-path:polygon(0 15%,100% 0,97% 75%,2% 100%); transform:translateX(calc((1 - var(--reveal,0)) * -115%)); }
.stroke-b { top:40%; height:13% !important; background-position:center 42% !important; clip-path:polygon(0 20%,100% 0,94% 92%,3% 75%); transform:translateX(calc((1 - var(--reveal,0)) * 115%)); }
.stroke-c { top:56%; background-position:center 72% !important; clip-path:polygon(0 0,98% 24%,100% 88%,4% 100%); transform:translateX(calc((1 - var(--reveal,0)) * -130%)); }
.stroke-d { top:70%; height:8% !important; background-position:center bottom !important; clip-path:polygon(2% 0,100% 34%,96% 100%,0 72%); transform:translateX(calc((1 - var(--reveal,0)) * 115%)); }
@media(max-width:700px){.court-skeleton{width:85vw;height:74vh}.paint-reveal{width:78vw}.paint-reveal .stroke{height:10%}}
@media(prefers-reduced-motion:reduce){.court-skeleton{translate:-50% -50%}.paint-reveal{opacity:.7}.paint-reveal .stroke{transform:none}}
/* Match the sliced image mask to the scroll-compressed ball position. */
.paint-reveal { width:min(32vw,410px); left:58.2%; top:64.2%; clip-path:circle(50% at 50% 50%); }
@media(max-width:700px){.paint-reveal{width:58vw;left:56%;top:60%}}
.paint-reveal { left:70%; top:67.3%; }
@media(max-width:700px){.paint-reveal{left:66%;top:63%}}
/* Use the product silhouette itself as the photo mask; no image can escape the ball. */
.paint-reveal {
  left:calc(70% + 55px); top:calc(67.3% - 35px); clip-path:none;
  -webkit-mask-image:url('molten-v5m5000-3n.png'); mask-image:url('molten-v5m5000-3n.png');
  -webkit-mask-size:contain; mask-size:contain;
  -webkit-mask-position:center; mask-position:center;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
}
@media(max-width:700px){.paint-reveal{left:66%;top:63%;-webkit-mask-image:url('molten-v5m5000-3n.png');mask-image:url('molten-v5m5000-3n.png')}}
/* Deliberate partial bands: contained well inside the product face. */
.paint-reveal {
  width:min(24vw,310px); left:calc(70% + 75px); top:calc(67.3% - 78px);
  clip-path:circle(49% at 50% 50%);
  -webkit-mask-image:none; mask-image:none;
}
@media(max-width:700px){.paint-reveal{width:46vw;left:66%;top:58%;clip-path:circle(49% at 50% 50%)}}
.paint-reveal { clip-path:ellipse(40% 32% at 50% 50%); }
@media(max-width:700px){.paint-reveal{clip-path:ellipse(40% 32% at 50% 50%)}}