/* Catalogue cards: keep the existing expanding cart action and add the
 * restrained outline, lift and image zoom used by the site's newer tiles. */
@media screen and (min-width: 768px) and (hover: hover) {
    .card-catalog {
        isolation: isolate;
        padding: 0;
        transition: transform .25s ease;
    }

    .card-catalog::before {
        content: "";
        position: absolute;
        z-index: -1;
        inset: 0 0 -40px;
        border: 1px solid transparent;
        border-radius: 18px;
        background: #fff;
        opacity: 0;
        pointer-events: none;
        transition: opacity .25s ease, border-color .25s ease, box-shadow .25s ease;
    }

    .card-catalog__body > a {
        display: block;
        overflow: hidden;
        border-radius: 17px 17px 0 0;
    }

    .card-catalog__image {
        display: block;
        width: 100%;
        max-height: none;
        aspect-ratio: 1 / 1;
        object-fit: contain;
        transition: transform .55s ease;
    }

    .card-catalog__btn {
        z-index: 2;
        top: 12px;
        right: 12px;
    }

    .card-catalog:hover,
    .card-catalog:focus-within {
        transform: translateY(-5px);
    }

    .card-catalog:hover::before,
    .card-catalog:focus-within::before {
        border-color: #ded6ce;
        opacity: 1;
        box-shadow: 0 18px 55px rgba(36, 27, 19, .12);
    }

    .card-catalog:hover .card-catalog__image,
    .card-catalog:focus-within .card-catalog__image {
        transform: scale(1.025);
    }
}

@media (prefers-reduced-motion: reduce) {
    .card-catalog,
    .card-catalog::before,
    .card-catalog__image {
        transition: none;
    }
}
