.aw-action-card {
    @apply bg-mono-800;

    display: grid;
    gap: 0.5rem;

    padding: 1.5rem 0.5rem 0.5rem;
    border-radius: 1rem;

    position: relative;

    &__header {
        display: flex;
        align-items: center;
        gap: 1rem;
        padding: 0 1rem 1rem 1rem;
        min-width: 0;
        overflow: hidden;
    }

    &__wrapper {
        margin-top: 0;
        margin-bottom: 0;
        margin-inline-end: auto;
        min-width: 0;
    }

    &__title {
        font-size: 1rem;
        line-height: 1.5;
        font-weight: bold;
    }

    &__link {
        display: block;
        width: 100%;
        height: 100%;

        position: absolute;
        left: 0;
        top: 0;
    }

    :where(.container, .container-small, .container-full) & {
        margin-left: calc(-1 * var(--container-padding));
        margin-right: calc(-1 * var(--container-padding));
        width: calc(100% + 2 * var(--container-padding));

        @screen lg {
            margin-left: initial;
            margin-right: initial;
            width: 100%;
        }
    }
}