/* 12-column fluid grid — Velocity Enterprise */

.grid-12 {
    display: grid;
    grid-template-columns: repeat(var(--grid-columns), 1fr);
    gap: var(--grid-gutter);
    width: 100%;
}

.col-span-1 { grid-column: span 1; }
.col-span-2 { grid-column: span 2; }
.col-span-3 { grid-column: span 3; }
.col-span-4 { grid-column: span 4; }
.col-span-5 { grid-column: span 5; }
.col-span-6 { grid-column: span 6; }
.col-span-7 { grid-column: span 7; }
.col-span-8 { grid-column: span 8; }
.col-span-9 { grid-column: span 9; }
.col-span-10 { grid-column: span 10; }
.col-span-11 { grid-column: span 11; }
.col-span-12 { grid-column: span 12; }

@media (max-width: 1024px) {
    .grid-12 {
        gap: var(--space-2);
    }
    .col-span-tablet-6 { grid-column: span 6; }
    .col-span-tablet-12 { grid-column: span 12; }
}

@media (max-width: 768px) {
    .grid-12 {
        grid-template-columns: 1fr;
        gap: var(--space-2);
    }
    .grid-12 > [class*="col-span"] {
        grid-column: span 1;
    }
}