/* Figma 774:2728: only the five homepage category image layers and labels. */
body.at-home #app .product-world .category-tile{background:#e3e5ea;border-radius:var(--yc-radius-panel,12px)}
body.at-home #app .product-world .category-tile-image{overflow:hidden}
body.at-home #app .product-world .category-tile-image img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;filter:none;transform:none}
body.at-home #app .product-world .category-tile:first-child .category-tile-image img{inset:auto;left:-71.31%;top:46%;width:193.84%;height:auto;object-fit:cover;transform:translateY(-50%)}
body.at-home #app .product-world .category-tile[data-category="5"] .category-tile-image img{inset:auto;left:-.08%;top:50%;width:100%;height:auto;object-fit:cover;transform:translateY(-50%)}
body.at-home #app .product-world .category-tile-image::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.2) 100%)}
body.at-home #app .product-world .category-tile:first-child .category-tile-image::after{background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.2)),linear-gradient(180deg,rgba(0,0,0,0),rgba(20,27,33,0) 77.666%,rgba(23,32,39,.5))}
body.at-home #app .product-world .category-tile-label{inset:auto 0 0;padding:0 20px 18px;min-height:45px;background:none;color:#fff;gap:0}
body.at-home #app .product-world .category-tile-label h3{margin:0;font-size:18px;font-weight:700;line-height:27px;color:#fff;letter-spacing:0}
@media(max-width:767px){body.at-home #app .product-world .category-tile-label{padding:0 14px 14px}body.at-home #app .product-world .category-tile-label h3{font-size:16px;line-height:24px}}
/* Hover animates only the inner image; scrolling continues to own card transforms. */
body.at-home #app .product-world .category-tile-image img{transition:transform 450ms cubic-bezier(.2,.65,.3,1)}
body.at-home #app .product-world .category-tile-image::before{content:'';position:absolute;inset:0;z-index:1;background:rgba(0,0,0,.06);opacity:0;pointer-events:none;transition:opacity 450ms ease}
@media(hover:hover) and (pointer:fine){
 body.at-home #app .product-world .category-tile:hover .category-tile-image img{transform:scale(1.035)}
 body.at-home #app .product-world .category-tile:first-child:hover .category-tile-image img,
 body.at-home #app .product-world .category-tile[data-category="5"]:hover .category-tile-image img{transform:translateY(-50%) scale(1.035)}
 body.at-home #app .product-world .category-tile:hover .category-tile-image::before{opacity:1}
}
body.at-home #app .product-world .category-tile:focus-visible .category-tile-image::before{opacity:1}
@media(prefers-reduced-motion:reduce){
 body.at-home #app .product-world .category-tile-image img,body.at-home #app .product-world .category-tile-image::before{transition:none}
 body.at-home #app .product-world .category-tile:hover .category-tile-image img{transform:none}
 body.at-home #app .product-world .category-tile:first-child:hover .category-tile-image img,body.at-home #app .product-world .category-tile[data-category="5"]:hover .category-tile-image img{transform:translateY(-50%)}
}

/* More breathing room above the category title, less below the mosaic. */
body.at-home .product-exchange[data-mode=desktop] .product-world{padding-top:96px;padding-bottom:16px}
body.at-home .product-exchange:not([data-mode=desktop]) .product-world{padding-top:96px;padding-bottom:24px}
@media(max-width:767px){body.at-home .product-exchange:not([data-mode=desktop]) .product-world{padding-top:72px;padding-bottom:20px}}