/* =====================================
   DWTHEME GRID SYSTEM (CSS GRID)
===================================== */

.dw-container-box {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 16px;
    padding-right: 16px;
}

.dw-container-full {
    width: 100%;
    margin: 0 auto;
    padding-left: 16px;
    padding-right: 16px;
}

/* Grid */
.dw-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 30px;
}

/* Desktop Column Span */
.dw-col-1 {
    grid-column: span 1;
}

.dw-col-2 {
    grid-column: span 2;
}

.dw-col-3 {
    grid-column: span 3;
}

.dw-col-4 {
    grid-column: span 4;
}

.dw-col-5 {
    grid-column: span 5;
}

.dw-col-6 {
    grid-column: span 6;
}

.dw-col-7 {
    grid-column: span 7;
}

.dw-col-8 {
    grid-column: span 8;
}

.dw-col-9 {
    grid-column: span 9;
}

.dw-col-10 {
    grid-column: span 10;
}

.dw-col-11 {
    grid-column: span 11;
}

.dw-col-12 {
    grid-column: span 12;
}

.dw-offset-1 {
    grid-column-start: 2;
}

.dw-offset-2 {
    grid-column-start: 3;
}

.dw-offset-3 {
    grid-column-start: 4;
}

.dw-offset-4 {
    grid-column-start: 5;
}

.dw-offset-5 {
    grid-column-start: 6;
}

.dw-offset-6 {
    grid-column-start: 7;
}

.dw-offset-7 {
    grid-column-start: 8;
}

.dw-offset-8 {
    grid-column-start: 9;
}

.dw-offset-9 {
    grid-column-start: 10;
}

.dw-offset-10 {
    grid-column-start: 11;
}

.dw-offset-11 {
    grid-column-start: 12;
}

/* Tablet (min 992px) */
@media (max-width: 992px) {
    .dw-grid {
        gap: 16px;
    }

    .dw-t-col-1 {
        grid-column: span 1;
    }

    .dw-t-col-2 {
        grid-column: span 2;
    }

    .dw-t-col-3 {
        grid-column: span 3;
    }

    .dw-t-col-4 {
        grid-column: span 4;
    }

    .dw-t-col-5 {
        grid-column: span 5;
    }

    .dw-t-col-6 {
        grid-column: span 6;
    }

    .dw-t-col-7 {
        grid-column: span 7;
    }

    .dw-t-col-8 {
        grid-column: span 8;
    }

    .dw-t-col-9 {
        grid-column: span 9;
    }

    .dw-t-col-10 {
        grid-column: span 10;
    }

    .dw-t-col-11 {
        grid-column: span 11;
    }

    .dw-t-col-12 {
        grid-column: span 12;
    }

    .dw-t-offset-1 {
        grid-column-start: 2;
    }

    .dw-t-offset-2 {
        grid-column-start: 3;
    }

    .dw-t-offset-3 {
        grid-column-start: 4;
    }

    .dw-t-offset-4 {
        grid-column-start: 5;
    }

    .dw-t-offset-5 {
        grid-column-start: 6;
    }

    .dw-t-offset-6 {
        grid-column-start: 7;
    }

    .dw-t-offset-7 {
        grid-column-start: 8;
    }

    .dw-t-offset-8 {
        grid-column-start: 9;
    }

    .dw-t-offset-9 {
        grid-column-start: 10;
    }

    .dw-t-offset-10 {
        grid-column-start: 11;
    }

    .dw-t-offset-11 {
        grid-column-start: 12;
    }
}

/* Mobile (max 768px) */
@media (max-width: 768px) {
    .dw-grid {
        gap: 10px;
    }

    .dw-m-col-1 {
        grid-column: span 1;
    }

    .dw-m-col-2 {
        grid-column: span 2;
    }

    .dw-m-col-3 {
        grid-column: span 3;
    }

    .dw-m-col-4 {
        grid-column: span 4;
    }

    .dw-m-col-5 {
        grid-column: span 5;
    }

    .dw-m-col-6 {
        grid-column: span 6;
    }

    .dw-m-col-7 {
        grid-column: span 7;
    }

    .dw-m-col-8 {
        grid-column: span 8;
    }

    .dw-m-col-9 {
        grid-column: span 9;
    }

    .dw-m-col-10 {
        grid-column: span 10;
    }

    .dw-m-col-11 {
        grid-column: span 11;
    }

    .dw-m-col-12 {
        grid-column: span 12;
    }

    .dw-m-offset-1 {
        grid-column-start: 2;
    }

    .dw-m-offset-2 {
        grid-column-start: 3;
    }

    .dw-m-offset-3 {
        grid-column-start: 4;
    }

    .dw-m-offset-4 {
        grid-column-start: 5;
    }

    .dw-m-offset-5 {
        grid-column-start: 6;
    }

    .dw-m-offset-6 {
        grid-column-start: 7;
    }

    .dw-m-offset-7 {
        grid-column-start: 8;
    }

    .dw-m-offset-8 {
        grid-column-start: 9;
    }

    .dw-m-offset-9 {
        grid-column-start: 10;
    }

    .dw-m-offset-10 {
        grid-column-start: 11;
    }

    .dw-m-offset-11 {
        grid-column-start: 12;
    }
}