.atm-slide {
    @apply bg-white border border-gray-100 p-2 rounded-xl h-full;

    * {
        @apply transition duration-500;
    }

    .atm-link {
        @apply hidden;
    }

    .atm-image {
        @apply relative pt-[100%] w-full mb-4 overflow-hidden rounded-lg;

        img {
            @apply absolute top-0 left-0 object-cover w-full h-full;
        }
    }

    &__content {
        @apply flex justify-between gap-x-2 px-2;
    }

    .atm-icon {
        @apply flex-shrink-0 focus:ring-2 cursor-pointer text-white bg-accent-1 h-11 w-11 rounded-full inline-flex justify-center items-center;
    }

    .subtitle {
        @apply text-gray;
    }

    .title {
        @apply mt-1 text-black;
    }
}

a > .atm-slide:hover {
    .atm-image {
        img {
            transform: scale(1.05);
        }
    }
    .title {
        .atm-heading {
            @apply text-secondary-col-1;
        }
    }
}