/* Scoped to managed groups so other theme grids retain their design. */
.site-highlights .alastic-card-grid,
.site-feature-grid.alastic-card-grid {
    display: grid;
    grid-template-columns: repeat(var(--card-columns, 3), minmax(0, 1fr));
    align-items: stretch;
}
.alastic-card-columns-2 { --card-columns: 2; }
.alastic-card-columns-3 { --card-columns: 3; }
.alastic-card-columns-4 { --card-columns: 4; }
.alastic-card-grid > article { min-width: 0; overflow-wrap: anywhere; }
.alastic-card-grid .icn .alastic-card-icon { display: block; width: 30px; height: 30px; flex-shrink: 0; }
.alastic-card-grid .site-feature { display: flex; flex-direction: column; }
.alastic-card-grid .site-feature p { flex: 1; }
.alastic-card-grid .site-feature .icn {
    align-self: flex-start;
    min-width: 46px;
    min-height: 46px;
    padding: 6px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: var(--accent-light);
    color: var(--accent-dark);
    margin-bottom: 16px;
    font-size: 20px;
}
.alastic-card-grid .alastic-card-image { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-sm); margin-bottom: 16px; }
.alastic-card-grid .site-feature .link { font-family: var(--font-display); font-weight: 600; font-size: 14px; color: var(--accent-dark); margin-top: 18px; }
.alastic-card-grid .link { align-self: flex-start; max-width: 100%; }
.alastic-card-grid .link:focus-visible { outline: 3px solid var(--ink); outline-offset: 5px; border-radius: 2px; }
.alastic-card-grid .link:hover { text-decoration: underline; text-underline-offset: 3px; }
.alastic-card-grid .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 1024px) {
    .site-highlights .alastic-card-grid,
    .site-feature-grid.alastic-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .site-highlights .alastic-card-grid,
    .site-feature-grid.alastic-card-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .alastic-card-grid .site-card { transition: none; }
    .alastic-card-grid .site-card:hover { transform: none; }
}