/* Realistic catalogue atlas, scoped to the automobile landing only. */

.pl-auto-realistic .pl-auto-type{--size:150px;display:block;flex:none;width:var(--size);height:calc(var(--size)*.72);background-image:url('/images/leasing/auto-types-realistic-v5.webp');background-repeat:no-repeat;background-size:calc(var(--size)*3) calc(var(--size)*2);background-position:calc(var(--col)*var(--size)*-1) calc(var(--row)*var(--size)*-1 - var(--size)*.117 + var(--row)*var(--size)*.07);mix-blend-mode:multiply}

.pl-auto-realistic [data-g22-new-cards] .g22-card-media{aspect-ratio:1.4;--col:0;--row:0;background:#fff}

.pl-auto-realistic [data-g22-new-cards] .g22-card-media img{opacity:0}

.pl-auto-realistic [data-g22-new-cards] .g22-card-media:before{content:'';position:absolute;left:5%;top:50%;transform:translateY(-50%);width:90%;aspect-ratio:1;background:url('/images/leasing/auto-types-realistic-v1.webp') no-repeat;background-size:300% 200%;background-position:calc(var(--col)*50%) calc(var(--row)*100%)}

.pl-auto-realistic [data-g22-new-cards] .g22-card:nth-child(3n+2) .g22-card-media{--col:1}

.pl-auto-realistic [data-g22-new-cards] .g22-card:nth-child(3n) .g22-card-media{--col:2}

.pl-auto-realistic [data-g22-new-cards] .g22-card:nth-child(n+4) .g22-card-media{--row:1}

@media(max-width:760px){.pl-auto-realistic .pl-auto-type{--size:136px}}

@media(max-width:360px){.pl-auto-realistic .pl-auto-type{--size:120px}}



/* Keep a neighbouring sprite's bumper outside the cell. */

.pl-auto-realistic .pl-auto-type,.pl-auto-realistic [data-g22-new-cards] .g22-card-media:before{clip-path:inset(0 3px 0 0)}



/* Give the heavy truck a little more visual weight without clipping the atlas cell. */

.pl-auto-realistic .g23-body-choice:nth-child(6) .pl-auto-type{transform:scale(1.12);transform-origin:center bottom}


/* Match the taxi illustration to the electric car in the neighbouring row. */
.pl-auto-realistic .g23-body-choice:nth-child(5) .pl-auto-type{transform:scale(1.12);transform-origin:center bottom}

/* Keep the wide two-vehicle cutout inside the mobile canvas. */
@media(max-width:760px){.pl-hero-shared .g22-visual img{max-width:100%}}