.block__entries h2 {
    margin-bottom: 5rem;
}

.entries {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: calc(var(--padding-grid) / 2);
}

.entry {
    background-color: var(--beige);
    aspect-ratio: 1/1;
    position: relative;
    overflow: hidden;
}

    .entry:after {
        content: "";
        width: 200%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background-color: var(--black);
        opacity: .05;
        transform-origin: 50% 50%;
        transform: rotate(-45deg) translate(-15%, 15%);
    }

    .entry a {
        display: flex;
        flex-flow: column;
        justify-content: flex-end;
        width: 100%;
        height: 100%;
        padding: calc(var(--padding-grid) / 2);
    }

        .entry a:after {
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
        }

    .entry img {
        position: absolute;
        top: var(--padding-grid);
        left: 0;
        width: 100%;
        height: 70%;
        object-fit: contain;
    }

    .entry h3 {
        display: inline-flex;
        align-items: center;
        gap: 1rem;
        position: relative;
    }

        .entry h3:after {
            content: "";
            display: inline-block;
            width: 2.2rem;
            height: 2.2rem;
            background-image: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.93947 11.2492V13.6875C8.93947 13.9965 9.19072 14.25 9.50347 14.25C9.64447 14.25 9.78472 14.1968 9.89197 14.0955C11.2232 12.8318 13.6007 10.5765 14.689 9.54375C14.839 9.402 14.923 9.20475 14.923 9C14.923 8.7945 14.839 8.598 14.689 8.45625C13.6007 7.4235 11.2232 5.1675 9.89197 3.90525C9.78472 3.80325 9.64447 3.75 9.50347 3.75C9.19072 3.75 8.93947 4.00275 8.93947 4.3125V6.75075H2.17447C1.77622 6.75075 1.42297 7.10325 1.42297 7.50075V10.4992C1.42297 10.8967 1.77622 11.2492 2.17447 11.2492H8.93947Z' fill='%233F4443'/%3E%3C/svg%3E%0A");
            margin-top: .5rem;
        }

.entry--empty {
    background: var(--gradient-orange);
    color: var(--white);
}

    .entry--empty a {
        color: var(--white);
    }

    .entry--empty h3:after {
        background-image: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.93947 11.2492V13.6875C8.93947 13.9965 9.19072 14.25 9.50347 14.25C9.64447 14.25 9.78472 14.1968 9.89197 14.0955C11.2232 12.8318 13.6007 10.5765 14.689 9.54375C14.839 9.402 14.923 9.20475 14.923 9C14.923 8.7945 14.839 8.598 14.689 8.45625C13.6007 7.4235 11.2232 5.1675 9.89197 3.90525C9.78472 3.80325 9.64447 3.75 9.50347 3.75C9.19072 3.75 8.93947 4.00275 8.93947 4.3125V6.75075H2.17447C1.77622 6.75075 1.42297 7.10325 1.42297 7.50075V10.4992C1.42297 10.8967 1.77622 11.2492 2.17447 11.2492H8.93947Z' fill='%23fff'/%3E%3C/svg%3E%0A");
    }

    .entry--empty svg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }


@media(pointer: fine) {
    .entry:after, .entry a h3:after {
        transition: var(--transition-default);
    }

    .entry a:hover h3:after {
        transform: translateX(.3rem);
    }

    .entry:has(a:hover):after {
        opacity: .1;
        transform: rotate(-45deg) translate(-15%, 0%);
    }
}