@include namespace('project-grid') {
    @include store((
        --dims: (
            --col-width: 20em
        )
    ));

    @include layout(namespace()) {
        display:               grid;
        grid-template-columns: repeat(auto-fill, minmax(#{prop(--dims --col-width)}, 1fr));
        gap:                   2rem;
        filter:                drop-shadow(#{prop(--dims --obj-shadow, $global: true)} #{prop(--colors --obj-shadow, $global: true)});

        @include element('project') {
            box-shadow: none;
        }

        @include media('<=sm') {
            grid-template-columns: 1fr;
        }
    }
}