/* The fifth project uses the existing slot, card, caption and hover geometry. */
.case-card.case-4{z-index:4}
.case-art-indepthfitness{background:#151918}
.case-art-indepthfitness .art-backdrop{opacity:.34;filter:grayscale(.15);object-position:52% 45%}
.case-art-indepthfitness .art-logo-fitness{top:10%;left:19%;right:19%}
.case-art-indepthfitness .art-logo-fitness img{width:72%;height:auto;max-width:230px;max-height:60px;object-fit:contain;filter:grayscale(1) invert(1)}
.case-art-indepthfitness .art-browser{top:28%;left:10%;width:66%;transform:rotate(-5deg);border-color:#202422}
.case-art-indepthfitness .art-browser>img{aspect-ratio:auto;height:auto;object-fit:contain}
.case-art-indepthfitness .art-phone{top:25%;left:71%;width:21%;aspect-ratio:auto;height:auto;transform:rotate(6deg);border-color:#202422}
.case-art-indepthfitness .art-phone>img{height:auto;object-fit:contain}
.case-art-indepthfitness.fitness-no-phone .art-browser{left:14%;width:72%;top:28%}
@media(max-width:760px){
  .case-art-indepthfitness .art-logo-fitness{top:10%;left:20%;right:20%}
  .case-art-indepthfitness .art-logo-fitness img{width:76%;max-height:44px}
  .case-art-indepthfitness .art-browser{top:28%;left:9%;width:68%}
  .case-art-indepthfitness .art-phone{top:24%;left:72%;width:20%}
}
@media(prefers-reduced-motion:reduce){
  .case-art-indepthfitness .art-stage{transition:none}
}