.mol-compliments-card {
    @apply bg-[#4a2a7c] text-white flex flex-col p-6 gap-8 md:min-h-[25rem];

    h4 {
        @apply text-white text-[0.9rem] leading-normal bg-[rgba(0,0,0,0.2)] max-w-[14rem] mt-0 px-6 p-2 rounded-[2rem] self-start;
        
        strong
        {
            @apply font-semibold text-[1rem];
            word-break: break-word;
        }
    }

    .compliment-content {
        @apply flex flex-col flex-1 gap-4;

        p {
            @apply text-[1.2rem];
            line-height: 1.4;
        }

        .author {
            @apply flex flex-1 text-[0.9rem] mt-4 self-start;
            align-items: end;
            word-break: break-word;
        }
    }

    &.wide {
        @apply col-span-full flex flex-col gap-4 md:flex-row md:gap-20 md:min-h-[15rem];

        h4 {
            @apply flex-[2];
            strong {
                word-break: break-word;
            }
        }
        .compliment-content {
            @apply flex;
        }
        .author {
            @apply flex self-start align-bottom;
            align-items: flex-end;
        }
    }

    &.image {
        @apply p-0;

        h4 {
            @apply hidden;
        }
        .atm-image {
            @apply w-full h-full object-cover;       
            img
            {
               @apply w-full h-full object-cover; 
            }
        }

        .compliment-content {
            @apply gap-0;
            p,
            .author {
                @apply hidden;
            }
        }
    }
}