/* Actual product combinations for the package and all-products category tiles. */
#urun-evreni [data-gp-universe] > a[data-gp-universe-composition] {
    background: #f1f3f7;
}
#urun-evreni [data-gp-universe] > a[data-gp-universe-composition]::after { display: none; }
#urun-evreni [data-gp-universe] > a[data-gp-universe-composition] > .universe-card__media {
    position: absolute; z-index: 1; top: 0; right: -2%; width: 61%; height: 100%;
    pointer-events: none; user-select: none; mix-blend-mode: multiply;
}
#urun-evreni .universe-card__media .universe-card__media-image {
    position: absolute; bottom: 3%; width: 64%; height: 91%; object-fit: contain;
    object-position: center bottom; mix-blend-mode: multiply;
}
#urun-evreni .universe-card__media--package .universe-card__media-image:first-child {
    left: 0; z-index: 2;
}
#urun-evreni .universe-card__media--package .universe-card__media-image:last-child {
    right: 0; z-index: 3; width: 58%; height: 72%;
}
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(1) {
    left: 0; z-index: 3; width: 56%; height: 83%;
}
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(2) {
    left: 26%; z-index: 1; width: 58%; height: 98%;
}
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(3) {
    left: 22%; z-index: 4; width: 39%; height: 58%;
}
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(4) {
    right: 0; z-index: 5; width: 39%; height: 58%;
}
/* The studio photo pixels stay intact. Vector display masks remove only the
   surrounding canvas; normal compositing keeps overlapping jars opaque. */
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(n) {
    mix-blend-mode: normal; object-position: center bottom;
    -webkit-mask-size: contain; mask-size: contain;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-position: center bottom; mask-position: center bottom;
}
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(1) { -webkit-mask-image: url('/assets/products/catalog/masks/whey-462.svg'); mask-image: url('/assets/products/catalog/masks/whey-462.svg'); }
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(2) { -webkit-mask-image: url('/assets/products/catalog/masks/mass-peak.svg'); mask-image: url('/assets/products/catalog/masks/mass-peak.svg'); }
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(3) { -webkit-mask-image: url('/assets/products/catalog/masks/bcaa.svg'); mask-image: url('/assets/products/catalog/masks/bcaa.svg'); }
#urun-evreni .universe-card__media--all .universe-card__media-image:nth-child(4) { -webkit-mask-image: url('/assets/products/catalog/masks/creatine.svg'); mask-image: url('/assets/products/catalog/masks/creatine.svg'); }
#urun-evreni [data-gp-universe-composition] [data-gp-universe-label] { color: #171717; }
@media (min-width: 1024px) {
    #urun-evreni [data-gp-universe-composition] > .universe-card__copy,
    #urun-evreni [data-gp-universe-composition] > .universe-protein-copy { max-width: 47%; }
    #urun-evreni [data-gp-universe-composition] .cb-link { color: #0047ab; }
}
@media (max-width: 1023px) {
    #urun-evreni [data-gp-universe] > a[data-gp-universe-composition] > .universe-card__media {
        top: 7%; right: auto; left: -3%; width: 52%; height: 86%;
    }
    #urun-evreni .universe-card__media .universe-card__media-image { bottom: 0; object-position: center; }
    #urun-evreni .universe-card__media--package .universe-card__media-image:first-child { width: 76%; }
    #urun-evreni .universe-card__media--package .universe-card__media-image:last-child { width: 68%; }
}
