/* grid */
.\@container {
    container: container / inline-size;
}
.ac-grid-gap {
    gap: var(--ac-grid-gap, 1rem);
}
.ac-grid-gap-2 {
    gap: var(--ac-grid-gap-2, 2rem);
}
.ac-grid-gap-3 {
    gap: var(--ac-grid-gap-3, 3rem);
}
.ac-grid-gap-4 {
    gap: var(--ac-grid-gap-4, 3.5rem);
}

.ac-grid-n\:\:cols-1,
.ac-grid-n\:\:cols-2,
.ac-grid-n\:\:cols-3,
.ac-grid-n\:\:cols-4,
.ac-grid-n\:\:cols-5,
.ac-grid-n\:\:cols-6 {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}

@container (min-width: 481px) {
    .ac-grid-n\:\:cols-2,
    .ac-grid-n,
    .ac-grid-n\:\:cols-3,
    .ac-grid-n\:\:cols-4,
    .ac-grid-n\:\:cols-5,
    .ac-grid-n\:\:cols-6 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@container (min-width: 768px) {
    .ac-grid-n\:\:cols-3,
    .ac-grid-n\:\:cols-4,
    .ac-grid-n\:\:cols-5,
    .ac-grid-n\:\:cols-6 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@container (min-width: 992px) {
    .ac-grid-n\:\:cols-4,
    .ac-grid-n\:\:cols-5,
    .ac-grid-n\:\:cols-6 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@container (min-width: 1200px) {
    .ac-grid-n\:\:cols-5,
    .ac-grid-n\:\:cols-6 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}
@container (min-width: 1400px) {
    .ac-grid-n\:\:cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

@container (min-width: 0) {
    .xxxs\(ac-grid-n\:\:cols-1\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col1-xxxs, minmax(0, 1fr));
    }
    .xxxs\(ac-grid-n\:\:cols-2\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col2-xxxs, repeat(2, minmax(0, 1fr)));
    }
    .xxxs\(ac-grid-n\),
    .xxxs\(ac-grid-n\:\:cols-3\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col3-xxxs, repeat(3, minmax(0, 1fr)));
    }
    .xxxs\(ac-grid-n\:\:cols-4\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col4-xxxs, repeat(4, minmax(0, 1fr)));
    }
}

@container (min-width: 400px) {
    .xxs\(ac-grid-n\:\:cols-1\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col1-xxs, minmax(0, 1fr));
    }
    .xxs\(ac-grid-n\:\:cols-2\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col2-xxs, repeat(2, minmax(0, 1fr)));
    }
    .xxs\(ac-grid-n\),
    .xxs\(ac-grid-n\:\:cols-3\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col3-xxs, repeat(3, minmax(0, 1fr)));
    }
    .xxs\(ac-grid-n\:\:cols-4\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col4-xxs, repeat(4, minmax(0, 1fr)));
    }
}

@container (min-width: 481px) {
    .xs\(ac-grid-n\:\:cols-1\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col1-xs, minmax(0, 1fr));
    }
    .xs\(ac-grid-n\:\:cols-2\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col2-xs, repeat(2, minmax(0, 1fr)));
    }
    .xs\(ac-grid-n\),
    .xs\(ac-grid-n\:\:cols-3\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col3-xs, repeat(3, minmax(0, 1fr)));
    }
    .xs\(ac-grid-n\:\:cols-4\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col4-xs, repeat(4, minmax(0, 1fr)));
    }
}

@container (min-width: 577px) {
    .sm\(ac-grid-n\:\:cols-1\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col1-sm, minmax(0, 1fr));
    }
    .sm\(ac-grid-n\:\:cols-2\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col2-sm, repeat(2, minmax(0, 1fr)));
    }
    .sm\(ac-grid-n\),
    .sm\(ac-grid-n\:\:cols-3\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col3-sm, repeat(3, minmax(0, 1fr)));
    }
    .sm\(ac-grid-n\:\:cols-4\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col4-sm, repeat(4, minmax(0, 1fr)));
    }
}

@container (min-width: 768px) {
    .md\(ac-grid-n\:\:cols-1\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col1-md, minmax(0, 1fr));
    }
    .md\(ac-grid-n\:\:cols-2\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col2-md, repeat(2, minmax(0, 1fr)));
    }
    .md\(ac-grid-n\),
    .md\(ac-grid-n\:\:cols-3\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col3-md, repeat(3, minmax(0, 1fr)));
    }
    .md\(ac-grid-n\:\:cols-4\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col4-md, repeat(4, minmax(0, 1fr)));
    }
    .md\(ac-grid-n\:\:cols-5\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col5-md, repeat(5, minmax(0, 1fr)));
    }
    .md\(ac-grid-n\:\:cols-6\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col6-md, repeat(6, minmax(0, 1fr)));
    }
}

@container (min-width: 992px) {
    .lg\(ac-grid-n\:\:cols-1\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col1-lg, minmax(0, 1fr));
    }
    .lg\(ac-grid-n\:\:cols-2\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col2-lg, repeat(2, minmax(0, 1fr)));
    }
    .lg\(ac-grid-n\),
    .lg\(ac-grid-n\:\:cols-3\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col3-lg, repeat(3, minmax(0, 1fr)));
    }
    .lg\(ac-grid-n\:\:cols-4\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col4-lg, repeat(4, minmax(0, 1fr)));
    }
    .lg\(ac-grid-n\:\:cols-5\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col5-lg, repeat(5, minmax(0, 1fr)));
    }
    .lg\(ac-grid-n\:\:cols-6\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col6-lg, repeat(6, minmax(0, 1fr)));
    }
}

@container (min-width: 1200px) {
    .xl\(ac-grid-n\:\:cols-1\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col1-xl, minmax(0, 1fr));
    }
    .xl\(ac-grid-n\:\:cols-2\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col2-xl, repeat(2, minmax(0, 1fr)));
    }
    .xl\(ac-grid-n\),
    .xl\(ac-grid-n\:\:cols-3\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col3-xl, repeat(3, minmax(0, 1fr)));
    }
    .xl\(ac-grid-n\:\:cols-4\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col4-xl, repeat(4, minmax(0, 1fr)));
    }
    .xl\(ac-grid-n\:\:cols-5\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col5-xl, repeat(5, minmax(0, 1fr)));
    }
    .xl\(ac-grid-n\:\:cols-6\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col6-xl, repeat(6, minmax(0, 1fr)));
    }
}

@container (min-width: 1400px) {
    .xxl\(ac-grid-n\:\:cols-1\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col1-xxl, minmax(0, 1fr));
    }
    .xxl\(ac-grid-n\:\:cols-2\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col2-xxl, repeat(2, minmax(0, 1fr)));
    }
    .xxl\(ac-grid-n\),
    .xxl\(ac-grid-n\:\:cols-3\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col3-xxl, repeat(3, minmax(0, 1fr)));
    }
    .xxl\(ac-grid-n\:\:cols-4\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col4-xxl, repeat(4, minmax(0, 1fr)));
    }
    .xxl\(ac-grid-n\:\:cols-5\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col5-xxl, repeat(5, minmax(0, 1fr)));
    }
    .xxl\(ac-grid-n\:\:cols-6\) {
        display: grid;
        grid-template-columns: var(--ac-grid-n-col6-xxl, repeat(6, minmax(0, 1fr)));
    }
}