.gr-widget {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 16px;
    max-width: 760px;
    min-height: 178px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    background: linear-gradient(135deg, #030712 0%, #111827 48%, #020617 100%);
    color: #fff;
    padding: 14px;
    margin: 22px 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
    overflow: hidden;
}

.gr-widget-image {
    width: 100%;
    height: 150px;
    background: #0b1220;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 7px;
    display: grid;
    place-items: center;
    overflow: hidden;
}

.gr-widget-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gr-widget-content {
    min-width: 0;
    position: relative;
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    padding: 4px 4px 0 0;
}

.gr-widget-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    width: fit-content;
    padding: 0 9px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

.gr-widget-title {
    margin: 8px 0 10px;
    color: #fff;
    font-size: 21px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.gr-widget-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.gr-widget-meta dt {
    margin: 0 0 2px;
    color: rgba(255, 255, 255, 0.64);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.gr-widget-meta dd {
    margin: 0;
    color: #fff;
    overflow-wrap: anywhere;
}

.gr-widget-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
    align-self: end;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    background: #fff;
    color: #030712 !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.24);
    text-decoration: none !important;
    font-size: 14px;
    line-height: 1;
    font-weight: 800;
}

.gr-widget-button:hover,
.gr-widget-button:focus {
    background: #dbeafe;
    color: #030712 !important;
}

.gr-widget-button:before {
    content: "";
    width: 16px;
    height: 16px;
    margin-right: 7px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 98 96'%3E%3Cpath d='M48.9 0C21.9 0 0 22 0 49.1c0 21.7 14 40.1 33.4 46.6 2.4.5 3.3-1.1 3.3-2.4 0-1.2 0-4.2-.1-8.3-13.6 3-16.5-6.6-16.5-6.6-2.2-5.7-5.4-7.2-5.4-7.2-4.4-3 .3-3 .3-3 4.9.3 7.5 5 7.5 5 4.3 7.5 11.4 5.3 14.2 4.1.4-3.1 1.7-5.3 3.1-6.5-10.9-1.2-22.3-5.5-22.3-24.4 0-5.4 1.9-9.8 5-13.3-.5-1.2-2.2-6.3.5-13.1 0 0 4.1-1.3 13.5 5.1 3.9-1.1 8.1-1.6 12.3-1.6s8.4.5 12.3 1.6c9.4-6.4 13.5-5.1 13.5-5.1 2.7 6.8 1 11.9.5 13.1 3.1 3.5 5 7.9 5 13.3 0 19-11.4 23.1-22.3 24.4 1.8 1.5 3.3 4.5 3.3 9.1 0 6.6-.1 11.9-.1 13.5 0 1.3.9 2.9 3.4 2.4C83.9 89.2 98 70.8 98 49.1 97.8 22 75.9 0 48.9 0z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 98 96'%3E%3Cpath d='M48.9 0C21.9 0 0 22 0 49.1c0 21.7 14 40.1 33.4 46.6 2.4.5 3.3-1.1 3.3-2.4 0-1.2 0-4.2-.1-8.3-13.6 3-16.5-6.6-16.5-6.6-2.2-5.7-5.4-7.2-5.4-7.2-4.4-3 .3-3 .3-3 4.9.3 7.5 5 7.5 5 4.3 7.5 11.4 5.3 14.2 4.1.4-3.1 1.7-5.3 3.1-6.5-10.9-1.2-22.3-5.5-22.3-24.4 0-5.4 1.9-9.8 5-13.3-.5-1.2-2.2-6.3.5-13.1 0 0 4.1-1.3 13.5 5.1 3.9-1.1 8.1-1.6 12.3-1.6s8.4.5 12.3 1.6c9.4-6.4 13.5-5.1 13.5-5.1 2.7 6.8 1 11.9.5 13.1 3.1 3.5 5 7.9 5 13.3 0 19-11.4 23.1-22.3 24.4 1.8 1.5 3.3 4.5 3.3 9.1 0 6.6-.1 11.9-.1 13.5 0 1.3.9 2.9 3.4 2.4C83.9 89.2 98 70.8 98 49.1 97.8 22 75.9 0 48.9 0z'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (max-width: 640px) {
    .gr-widget {
        grid-template-columns: 1fr;
        max-width: 100%;
    }

    .gr-widget-image {
        height: 190px;
    }

    .gr-widget-content {
        min-height: 150px;
        padding: 0;
    }

    .gr-widget-meta {
        grid-template-columns: 1fr;
    }

    .gr-widget-button {
        justify-self: stretch;
    }
}
