.market-lab{
  --case-one-in:0;
  --case-one-out:0;
  --case-one-opacity:0;
  --case-two-in:0;
  --case-two-out:0;
  --case-two-opacity:0;
  --case-three-in:0;
  --case-three-opacity:0;
  --wipe:0;
  --wipe-alpha:0;
  position:relative;
  height:470vh;
  min-height:3000px;
  overflow:visible;
  background:#090909;
  color:var(--paper);
}
.market-sticky{
  position:sticky;
  top:0;
  height:100svh;
  min-height:620px;
  overflow:hidden;
  padding:8vh var(--pad) 4vh;
  isolation:isolate;
}
.market-sticky:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-3;
  opacity:.23;
  background:
    linear-gradient(#ffffff0d 1px,transparent 1px),
    linear-gradient(90deg,#ffffff0d 1px,transparent 1px);
  background-size:5vw 5vw;
  mask-image:linear-gradient(90deg,transparent,#000 12% 88%,transparent);
}
.market-sticky:after{
  content:"";
  position:absolute;
  z-index:-2;
  right:-5vw;
  top:17vh;
  width:38vw;
  height:66vh;
  opacity:.2;
  background:radial-gradient(circle,var(--acid) 0 1px,transparent 1.5px);
  background-size:10px 10px;
  transform:rotate(-7deg);
  mask-image:linear-gradient(135deg,transparent 5%,#000 45%,transparent 90%);
}
.market-head{
  position:relative;
  z-index:40;
  display:grid;
  grid-template-columns:1fr 1.45fr .8fr;
  gap:4vw;
  align-items:start;
  pointer-events:none;
}
.market-head .section-no{margin:0;color:#a8a8a2}
.market-kicker{display:block;color:var(--acid);font:700 10px/1.2 monospace;letter-spacing:.16em;margin-bottom:12px}
.market-head h2{font:700 clamp(54px,7.7vw,120px)/.76 Oswald;margin:0;text-transform:uppercase;letter-spacing:-.065em}
.market-head h2 i{font-style:normal;color:transparent;-webkit-text-stroke:1px var(--acid)}
.market-copy{margin:2px 0 0;font-size:10px;line-height:1.55;text-transform:uppercase;letter-spacing:.08em;color:#b4b4ae}
.market-stage{position:absolute;z-index:2;inset:26vh var(--pad) 3.5vh}
.market-case{position:absolute;inset:0;pointer-events:none;will-change:opacity}
.market-case-stand{z-index:2;opacity:var(--case-one-opacity)}
.market-case-clip{z-index:3;opacity:var(--case-two-opacity)}
.market-case-organizer{z-index:4;opacity:var(--case-three-opacity)}
.case-collage{position:absolute;inset:0}
.case-shot{
  position:absolute;
  margin:0;
  padding:6px 6px 28px;
  overflow:hidden;
  background:#dedbd0;
  border:1px solid #ffffff45;
  box-shadow:18px 25px 55px #000b;
  transform-origin:center;
  will-change:transform;
}
.case-shot img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;filter:saturate(.7) contrast(1.06) brightness(.82);transition:filter .45s ease}
.case-shot:hover img{filter:saturate(.94) contrast(1.03) brightness(.94)}
.case-shot:after{content:"";position:absolute;inset:6px 6px 28px;pointer-events:none;background:linear-gradient(145deg,#b7ff190b,transparent 45%,#0005);mix-blend-mode:multiply}
.case-shot figcaption{position:absolute;left:8px;right:8px;bottom:7px;display:flex;justify-content:space-between;color:#161616;font:700 8px/1 monospace;letter-spacing:.12em}
.case-shot figcaption span{color:#506f0d}
.case-shot.shot-main{z-index:6;width:min(27vw,410px);left:36.5%;top:0}
.case-shot.shot-one{z-index:4;width:min(21vw,320px);left:2%;top:8%}
.case-shot.shot-two{z-index:3;width:min(19vw,290px);right:2%;top:4%}
.case-shot.shot-three{z-index:7;width:min(17vw,260px);left:15%;bottom:-8%}
.case-shot.shot-four{z-index:5;width:min(17vw,260px);right:14%;bottom:-10%}
.market-case-stand .shot-main{transform:translate3d(0,calc((1 - var(--case-one-in))*28vh - var(--case-one-out)*58vh),0) rotate(calc(6deg - var(--case-one-in)*8deg - var(--case-one-out)*4deg))}
.market-case-stand .shot-one{transform:translate3d(calc((1 - var(--case-one-in))*31vw),calc((1 - var(--case-one-in))*9vh - var(--case-one-out)*48vh),0) rotate(calc(-15deg + var(--case-one-in)*7deg - var(--case-one-out)*8deg))}
.market-case-stand .shot-two{transform:translate3d(calc((1 - var(--case-one-in))*-29vw),calc((1 - var(--case-one-in))*12vh - var(--case-one-out)*65vh),0) rotate(calc(15deg - var(--case-one-in)*9deg + var(--case-one-out)*6deg))}
.market-case-stand .shot-three{transform:translate3d(calc((1 - var(--case-one-in))*22vw),calc((1 - var(--case-one-in))*-19vh - var(--case-one-out)*42vh),0) rotate(calc(-17deg + var(--case-one-in)*7deg - var(--case-one-out)*10deg))}
.market-case-stand .shot-four{transform:translate3d(calc((1 - var(--case-one-in))*-20vw),calc((1 - var(--case-one-in))*-18vh - var(--case-one-out)*53vh),0) rotate(calc(16deg - var(--case-one-in)*7deg + var(--case-one-out)*8deg))}
.market-case-clip .shot-main{transform:translate3d(0,calc((1 - var(--case-two-in))*58vh - var(--case-two-out)*52vh),0) rotate(calc(-10deg + var(--case-two-in)*13deg + var(--case-two-out)*5deg))}
.market-case-clip .shot-one{transform:translate3d(calc((1 - var(--case-two-in))*35vw),calc((1 - var(--case-two-in))*38vh - var(--case-two-out)*45vh),0) rotate(calc(-18deg + var(--case-two-in)*10deg - var(--case-two-out)*6deg))}
.market-case-clip .shot-two{transform:translate3d(calc((1 - var(--case-two-in))*-34vw),calc((1 - var(--case-two-in))*43vh - var(--case-two-out)*58vh),0) rotate(calc(17deg - var(--case-two-in)*9deg + var(--case-two-out)*7deg))}
.market-case-clip .shot-three{transform:translate3d(calc((1 - var(--case-two-in))*28vw),calc((1 - var(--case-two-in))*55vh - var(--case-two-out)*48vh),0) rotate(calc(-20deg + var(--case-two-in)*10deg - var(--case-two-out)*8deg))}
.market-case-clip .shot-four{transform:translate3d(calc((1 - var(--case-two-in))*-27vw),calc((1 - var(--case-two-in))*52vh - var(--case-two-out)*55vh),0) rotate(calc(18deg - var(--case-two-in)*9deg + var(--case-two-out)*6deg))}
.market-case-clip .case-shot{background:#e6e2d7}
.market-case-clip .case-shot img{filter:saturate(.68) contrast(1.08) brightness(.8)}
.market-case-clip .case-shot:hover img{filter:saturate(.92) contrast(1.03) brightness(.94)}
.market-case-organizer .case-shot{background:#d9ddc9}
.market-case-organizer .case-shot img{filter:saturate(.72) contrast(1.07) brightness(.82)}
.market-case-organizer .shot-main{transform:translate3d(0,calc((1 - var(--case-three-in))*-62vh),0) rotate(calc(8deg - var(--case-three-in)*10deg))}
.market-case-organizer .shot-one{transform:translate3d(calc((1 - var(--case-three-in))*-52vw),calc((1 - var(--case-three-in))*-12vh),0) rotate(calc(-24deg + var(--case-three-in)*16deg))}
.market-case-organizer .shot-two{transform:translate3d(calc((1 - var(--case-three-in))*52vw),calc((1 - var(--case-three-in))*-9vh),0) rotate(calc(24deg - var(--case-three-in)*15deg))}
.market-case-organizer .shot-three{transform:translate3d(calc((1 - var(--case-three-in))*-46vw),calc((1 - var(--case-three-in))*46vh),0) rotate(calc(-26deg + var(--case-three-in)*17deg))}
.market-case-organizer .shot-four{transform:translate3d(calc((1 - var(--case-three-in))*46vw),calc((1 - var(--case-three-in))*48vh),0) rotate(calc(25deg - var(--case-three-in)*16deg))}
.case-label{
  position:absolute;
  z-index:20;
  left:0;
  bottom:1vh;
  width:min(54vw,650px);
  min-height:68px;
  display:grid;
  grid-template-columns:42px 1fr auto;
  gap:14px;
  align-items:center;
  padding:11px 14px;
  border:1px solid #ffffff42;
  border-top:3px solid var(--acid);
  background:#080808e8;
  box-shadow:0 16px 40px #0009;
  backdrop-filter:blur(10px);
}
.case-label>span{color:var(--acid);font:700 12px monospace}
.case-label p{margin:0 0 3px;color:#aaa;font:700 8px/1.2 monospace;letter-spacing:.1em;text-transform:uppercase}
.case-label h3{margin:0;color:var(--paper);font:700 clamp(24px,2.6vw,42px)/.95 Oswald;text-transform:uppercase;letter-spacing:-.035em}
.case-label b{color:var(--acid);font:700 9px monospace;text-transform:uppercase;letter-spacing:.1em}
.market-case-stand .case-label{transform:translate3d(0,calc((1 - var(--case-one-in))*22vh - var(--case-one-out)*32vh),0)}
.market-case-clip .case-label{transform:translate3d(0,calc((1 - var(--case-two-in))*24vh),0)}
.market-case-organizer .case-label{transform:translate3d(0,calc((1 - var(--case-three-in))*24vh),0)}
.market-wipe{
  position:absolute;
  z-index:30;
  top:-30%;
  bottom:-30%;
  left:-30vw;
  width:18vw;
  min-width:150px;
  opacity:var(--wipe-alpha);
  background:var(--acid);
  box-shadow:-28px 0 0 #080808,28px 0 0 #080808;
  transform:translate3d(calc(var(--wipe)*150vw),0,0) rotate(7deg);
  will-change:transform,opacity;
}
.market-wipe:before,.market-wipe:after{content:"";position:absolute;top:0;bottom:0;width:10px;background:repeating-linear-gradient(0deg,#080808 0 5px,transparent 5px 11px)}
.market-wipe:before{left:8px}.market-wipe:after{right:8px}
.market-wipe span{position:absolute;left:50%;top:50%;white-space:nowrap;color:#080808;font:900 clamp(18px,2.6vw,42px)/1 Oswald;letter-spacing:.08em;transform:translate(-50%,-50%) rotate(90deg)}
.market-scroll{position:absolute;z-index:42;right:var(--pad);bottom:3.5vh;margin:0;display:flex;align-items:center;gap:14px;color:#a7a7a1;font:700 9px monospace;letter-spacing:.14em}
.market-scroll i{font-style:normal;color:var(--acid);font-size:22px}
.market-counter{position:absolute;z-index:42;right:var(--pad);top:11vh;display:flex;align-items:center;gap:7px;color:#6f6f6a;font:700 12px monospace;letter-spacing:.12em}
.market-counter i{font-style:normal;color:#4d4d49}
.market-counter span{transition:color .25s ease,transform .25s ease}
.market-lab[data-active="1"] .market-counter span:nth-of-type(1),.market-lab[data-active="2"] .market-counter span:nth-of-type(2),.market-lab[data-active="3"] .market-counter span:nth-of-type(3){color:var(--acid);transform:translateY(-2px)}

@media(max-width:760px){
  .market-lab{height:430svh;min-height:2600px}
  .market-sticky{min-height:560px;padding:7vh 18px 3vh}
  .market-head{grid-template-columns:1fr auto;gap:12px}
  .market-head>.section-no{grid-column:1/3;margin-bottom:1vh}
  .market-head h2{font-size:13.5vw;line-height:.8}
  .market-kicker{font-size:8px}
  .market-copy{display:none}
  .market-stage{inset:24vh 10px 3.5vh}
  .case-shot{padding:4px 4px 20px;box-shadow:12px 18px 38px #000b}
  .case-shot:after{inset:4px 4px 20px}
  .case-shot figcaption{left:6px;right:6px;bottom:5px;font-size:6px}
  .case-shot.shot-main{width:56vw;left:22%;top:6%;z-index:6}
  .case-shot.shot-one{width:35vw;left:0;top:1%;z-index:4}
  .case-shot.shot-two{width:33vw;right:0;top:14%;z-index:3}
  .case-shot.shot-three{width:31vw;left:3%;bottom:9%;z-index:7}
  .case-shot.shot-four{width:31vw;right:2%;bottom:6%;z-index:5}
  .market-case-stand .shot-one{transform:translate3d(calc((1 - var(--case-one-in))*45vw),calc((1 - var(--case-one-in))*11vh - var(--case-one-out)*52vh),0) rotate(calc(-15deg + var(--case-one-in)*7deg - var(--case-one-out)*8deg))}
  .market-case-stand .shot-two{transform:translate3d(calc((1 - var(--case-one-in))*-43vw),calc((1 - var(--case-one-in))*12vh - var(--case-one-out)*60vh),0) rotate(calc(15deg - var(--case-one-in)*9deg + var(--case-one-out)*6deg))}
  .market-case-stand .shot-three{transform:translate3d(calc((1 - var(--case-one-in))*37vw),calc((1 - var(--case-one-in))*-18vh - var(--case-one-out)*45vh),0) rotate(calc(-17deg + var(--case-one-in)*7deg - var(--case-one-out)*10deg))}
  .market-case-stand .shot-four{transform:translate3d(calc((1 - var(--case-one-in))*-34vw),calc((1 - var(--case-one-in))*-17vh - var(--case-one-out)*56vh),0) rotate(calc(16deg - var(--case-one-in)*7deg + var(--case-one-out)*8deg))}
  .market-case-clip .shot-one{transform:translate3d(calc((1 - var(--case-two-in))*54vw),calc((1 - var(--case-two-in))*40vh),0) rotate(calc(-18deg + var(--case-two-in)*10deg))}
  .market-case-clip .shot-two{transform:translate3d(calc((1 - var(--case-two-in))*-52vw),calc((1 - var(--case-two-in))*44vh),0) rotate(calc(17deg - var(--case-two-in)*9deg))}
  .market-case-clip .shot-three{transform:translate3d(calc((1 - var(--case-two-in))*47vw),calc((1 - var(--case-two-in))*55vh),0) rotate(calc(-20deg + var(--case-two-in)*10deg))}
  .market-case-clip .shot-four{transform:translate3d(calc((1 - var(--case-two-in))*-45vw),calc((1 - var(--case-two-in))*53vh),0) rotate(calc(18deg - var(--case-two-in)*9deg))}
  .case-label{bottom:.5vh;width:94%;min-height:58px;grid-template-columns:28px 1fr;padding:9px;gap:8px}
  .case-label p{font-size:6px}
  .case-label h3{font-size:7vw}
  .case-label b{display:none}
  .market-wipe{width:27vw;min-width:105px;box-shadow:-18px 0 0 #080808,18px 0 0 #080808}
  .market-scroll{left:18px;right:auto;bottom:calc(1vh + 66px)}
  .market-counter{right:18px;top:14vh;font-size:10px}
}

@media(prefers-reduced-motion:reduce){
  .market-lab{height:auto;min-height:0}
  .market-sticky{position:relative;height:auto;min-height:0;overflow:hidden;padding-bottom:12vh}
  .market-stage{position:relative;inset:auto;margin-top:8vh;display:grid;gap:14vh}
  .market-case{position:relative;min-height:78vh;opacity:1}
  .case-shot,.case-label{transform:none!important}
  .market-wipe,.market-scroll,.market-counter{display:none}
}
