/* TOP only: keep other pages and desktop article cards unchanged. */
.home #countries .country-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 20px 16px;
    min-width: 0;
}
.home #countries .country-card > img {
    width: 34px;
    height: 23px;
    margin: 0;
}
.home #countries .country-card > h3 {
    font-size: 17px;
    line-height: 1.5;
    letter-spacing: 0;
    white-space: nowrap;
    margin: 0;
}
.home #countries .country-card > p {
    grid-column: 1 / -1;
    margin: 0;
}
@media (max-width: 760px) {
    .home #countries .country-grid { gap: 10px; }
    .home #countries .country-card { gap: 7px; padding: 16px 10px; }
    .home #countries .country-card > img { width: 24px; height: 16px; }
    .home #countries .country-card > h3 { font-size: 14px; }

    .home .column-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .home .column-card > a {
        display: grid;
        grid-template-columns: clamp(92px, 27vw, 144px) minmax(0, 1fr);
        align-items: start;
        gap: 12px;
        padding: 12px;
    }
    .home .column-card > a > img {
        display: block;
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
        object-fit: cover;
        border-radius: 6px;
    }
    .home .column-card-body { min-width: 0; padding: 0; }
    .home .column-card-body > small {
        display: block;
        color: var(--muted, #625c55);
        font-size: 11px;
        line-height: 1.5;
    }
    .home .column-card-body > h3 {
        margin: 4px 0 6px;
        font-size: 14px;
        line-height: 1.65;
        overflow-wrap: anywhere;
    }
    .home .column-card-body > p {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        margin: 0;
        color: var(--muted, #625c55);
        font-size: 12px;
        line-height: 1.7;
        max-height: 3.4em;
    }
}
/* Keep long country names readable on narrow phones by using one column. */
@media (max-width: 389px) {
    .home #countries .country-grid { grid-template-columns: minmax(0, 1fr); }
    .home #countries .country-card { padding: 14px 16px; gap: 10px; }
    .home #countries .country-card > h3 { font-size: 15px; }
    .home .column-card > a { gap: 10px; padding: 10px; }
}