/* elementor elements reset */
.elementor.elementor .e-div-block-base {
    padding-inline: 0;
}




:root {
    --grid-gap: calc(var(--block-lg) / 2);
    --grid-min: 80px;
    --grid-padding: var(--block-lg) var(--inline-lg); /* 100 60 */
}

@media (max-width: 1024px) {
    :root {
        --grid-padding: var(--block-md) var(--inline-md); /* 60 40 */
        --grid-gap: calc(var(--block-md) / 2);
    }
}

@media (max-width: 480px) {
    :root {
        --grid-padding: var(--block-sm) var(--inline-sm); /* 40 20 */
        --grid-gap: calc(var(--block-sm) / 2);
    }
}




/* GRIDS */
:where(
    .grid-2,
    .grid-3,
    .grid-4,
    .grid-5,
    .grid-6,
    .grid-1-2,
    .grid-1-3,
    .grid-2-1,
    .grid-3-1,
    .grid-2x3,
    .grid-3x2) {
    display: grid;
    align-items: stretch;
    gap: var(--grid-gap);
    grid-template-columns: repeat(var(--cols, 1), minmax(var(--grid-min), 1fr));
}

.grid-2,
.grid-3,
.grid-4,
.grid-5,
.grid-6,
.grid-1-2,
.grid-1-3,
.grid-2-1,
.grid-3-1,
.grid-2x3,
.grid-3x2 {
    display: grid;
    align-items: stretch;
    gap: var(--grid-gap);
    grid-template-rows: auto;

    & > * {
        min-width: 0;
        min-height: 0;
    }

    & > :has(.oxy-image) {
        contain: size;

        & .oxy-image {
            width: 100%;
            height: 100%;
            max-width: 100%;
            max-height: none;
            display: block;
            object-fit: cover;
            contain-intrinsic-size: revert-rule;
        }
    }
}




/* GRID COLUMNS */

.grid-2 { --cols: 2; }
.grid-3 { --cols: 3; }
.grid-4 { --cols: 4; }
.grid-5 { --cols: 5; }
.grid-6 { --cols: 6; }

:where(.grid-1-2, .grid-2-1) { --cols: 3; }
:where(.grid-1-3, .grid-3-1) { --cols: 4; }

.grid-1-2 > :nth-child(2),  .grid-2-1 > :first-child { grid-column: span 2; }
.grid-1-3 > :nth-child(2),  .grid-3-1 > :first-child { grid-column: span 3; }




/* MOSAIC GRIDS */
:where(.grid-2x3, .grid-3x2) {
    --cols: 6;
    column-gap: calc( var(--grid-gap) / 2);
}

.grid-2x3 {
    & > :nth-child(-n + 2)                  { grid-column: span 3; }
    & > :nth-child(n + 3):nth-child(-n + 5) { grid-column: span 2; }
}

.grid-3x2 {
    & > :nth-child(-n + 3)                  { grid-column: span 2; }
    & > :nth-child(n + 4):nth-child(-n + 5) { grid-column: span 3; }
}




/* COLLAPSES */
@media (max-width: 1120px) {

    :is(.grid-1-2, .grid-2-1, .grid-1-3, .grid-3-1) {
        --cols: 2;

        & > * {
            grid-column: auto !important;
        }
    }
}

@media (max-width: 1024px) {
    :is(.grid-3, .grid-4, .grid-5, .grid-2x3, .grid-3x2) {--cols: 2; }
    :is(.grid-3, .grid-5, .grid-2x3, .grid-3x2)          { grid-auto-rows: 1fr; grid-template-rows: none; }
    :is(.grid-2x3, .grid-3x2)                            {
        & > * { grid-column: auto !important; }
    }
}

@media (max-width: 768px) {

    :is(.grid-1-2, .grid-2-1, .grid-1-3, .grid-3-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6) {
        --cols: 1;

        & > * {
            grid-column: 1 / -1 !important;
        }

        & > :has(.oxy-image) {
            contain: none !important;

            & .oxy-image {
                height: auto !important;
                max-height: none !important;
            }
        }
    }

    :is(.grid-3, .grid-5, .grid-2x3, .grid-3x2) {
        --cols: 1;
        grid-auto-rows: auto;

        & > * {
            grid-column: 1 / -1 !important;
        }

        & > :has(.oxy-image) {
            contain: none !important;

            & .oxy-image {
                width: 100% !important;
                height: auto !important;
                object-fit: cover;
            }
        }
    }
}




/* SECTIONS */
section {
    /* max-width: var(--page-width); */
    margin: 0 auto;

    &.full-width {
        max-width: 100%;
    }
}
/* section, div.elementor-element.e-con {
    padding: var(--grid-padding);
} */
 section {
    padding: var(--grid-padding) !important;
 }

section, .section, xdiv.elementor-element.e-con {
    &.section--spaced {
        padding-bottom: var(--block-lg);

        @media (max-width: 1120px) {
            padding-bottom: var(--block-md);
        }

        @media (max-width: 1024px) {
            padding-bottom: var(--block-sm);
        }
    }

    @media (max-width: 1024px) {
        padding-bottom: var(--block-sm);
    }

    &:not(.hero):not(:last-of-type):not(.last) {
        padding-bottom: 0;
    }
}





/* FOOTER */
footer {
    min-height: 1px;
    /* padding: var(--grid-padding); */
    flex-shrink: 0;
}




/* HERO */
.hero {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    max-width: 100%;

    & .centered {
        margin-left: unset;
        margin-right: unset;
        justify-content: center !important;
    }
}