/* ==========================================================================
   Grid
   ========================================================================== */

.g {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 2rem;
}

.g-gap-1 {
    gap: 1rem;
}

.g-gap-0 {
    gap: 0;
}

.g-gap-h {
    gap: 0 1.5rem !important;
}

.g-h2 {
    grid-column: span 2;
}

.g-h3 {
    grid-column: span 3;
}

.g-h4 {
    grid-column: span 4;
}

.g-h5 {
    grid-column: span 5;
}

.g-h6 {
    grid-column: span 6;
}

.g-h7 {
    grid-column: span 7;
}

.g-h8 {
    grid-column: span 8;
}

.g-h9 {
    grid-column: span 9;
}

.g-h10 {
    grid-column: span 10;
}

.g-h11 {
    grid-column: span 11;
}

.g-h12 {
    grid-column: span 12;
}

.g-v2 {
    grid-row: span 2;
}

.g-v3 {
    grid-row: span 3;
}

.g-v4 {
    grid-row: span 4;
}

.g-v5 {
    grid-row: span 5;
}

.g-v6 {
    grid-row: span 6;
}

.g-v7 {
    grid-row: span 7;
}

.g-v8 {
    grid-row: span 8;
}

.g-v9 {
    grid-row: span 9;
}

.g-v10 {
    grid-row: span 10;
}

.g-v11 {
    grid-row: span 11;
}

.g-v12 {
    grid-row: span 12;
}

.g-ha1 {
    justify-content: center;
}

.g-ha2 {
    justify-content: flex-end;
}

.g-va-c {
    align-items: center;
}

@media (min-width: 993px) {
    .g-hide:not(.g-show) {
        display: none !important;
    }
}

@media (max-width: 992px) {
    .g-h2, .g-h3 {
        grid-column: span 6;
    }

    .g-h4, .g-h5, .g-h6, .g-h7, .g-h8, .g-h9, .g-h10, .g-h11 {
        grid-column: span 12;
    }

    .gm-h2 {
        grid-column: span 2;
    }

    .gm-h3 {
        grid-column: span 3;
    }

    .gm-h4 {
        grid-column: span 4;
    }

    .gm-h5 {
        grid-column: span 5;
    }

    .gm-h6 {
        grid-column: span 6;
    }

    .gm-h7 {
        grid-column: span 7;
    }

    .gm-h8 {
        grid-column: span 8;
    }

    .gm-h9 {
        grid-column: span 9;
    }

    .gm-h10 {
        grid-column: span 10;
    }

    .gm-h11 {
        grid-column: span 11;
    }

    .gm-h12 {
        grid-column: span 12;
    }

    .gm-v1 {
        grid-row: span 1;
    }

    .gm-hide {
        display: none !important;
    }
}

@media (max-width: 539px) {
    .g {
        gap: 1rem;
    }

    .g-gap-1 {
        gap: .5rem;
    }

    .g-h2, .g-h3, .g-h4, .g-h5, .g-h6, .g-h7, .g-h8, .g-h9, .g-h10, .g-h11 {
        grid-column: span 12;
    }

    .gs-h2 {
        grid-column: span 2;
    }

    .gs-h3 {
        grid-column: span 3;
    }

    .gs-h4 {
        grid-column: span 4;
    }

    .gs-h5 {
        grid-column: span 5;
    }

    .gs-h6 {
        grid-column: span 6;
    }

    .gs-h7 {
        grid-column: span 7;
    }

    .gs-h8 {
        grid-column: span 8;
    }

    .gs-h9 {
        grid-column: span 9;
    }

    .gs-h10 {
        grid-column: span 10;
    }

    .gs-h11 {
        grid-column: span 11;
    }

    .gs-h12 {
        grid-column: span 12;
    }

    .gs-v1 {
        grid-row: span 1;
    }

    .gs-hide {
        display: none !important;
    }
}