.all-news:hover {
    background-color: var(--hover-background, var(--button-outlined-primary-hover));
}

.news-grid {
    width: 100%;
}

.news-card {
    height: 100%;
}

.news-card gov-card,
.news-card .gov-card {
    height: 100%;
    position: relative;
}

.news-card picture[slot="img"] img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.read-more {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    opacity: 0;
    transform: translateY(calc(1rem + 100%));
    transition: transform 0.3s ease, opacity 0.3s ease;
    transition-delay: 0.3s;
    padding: var(--spacing-s) var(--spacing-s) var(--spacing-xs);
    border-radius: var(--border-radius, var(--corner-radius-s));
    color: var(--color, var(--text-white-fixed));
    background-color: var(--background, var(--button-solid-primary));
}

gov-card:hover .read-more,
gov-card:focus-within .read-more {
    opacity: 1;
    transform: translateY(0);
}

gov-card:focus-within {
    border-radius: var(--outline-border-radius, var(--corner-radius-xs-nudge));
    outline: var(--outline-width, 0.125rem) solid var(--status-focus);
    outline-offset: var(--outline-offset, 0.125rem);
}

picture[slot="img"] {
    overflow: hidden;
    display: grid;
    align-content: center;
}