/* 3D2REAL — structural grid only */ :root {
    --container: 1680px;
    --gutter: clamp(20px,0vw,72px);
    --grid-gap-x: clamp(20px,2.5vw,40px);
    --grid-gap-y: clamp(24px,3vw,48px);
}

.container {
    width: min(100%,var(--container));
    margin-inline: auto;
    padding-inline: var(--gutter);
}

.container-fluid {
    width: 100%;
    padding-inline: var(--gutter);
}

.container-full {
    width: 100%;
}

.row {
    display: grid;
    grid-template-columns: repeat(12,minmax(0,1fr));
    column-gap: var(--grid-gap-x);
    row-gap: var(--grid-gap-y);
}


.no-padding-bottom {
    padding-bottom: 0 !important;
}

.padding-bottom-20 {
    padding-bottom: 20px !important;
}




.cols-1,
.cols-2,
.cols-3,
.cols-4,
.cols-5 {
    display: grid;
    column-gap: var(--grid-gap-x);
    row-gap: var(--grid-gap-y);
}

.cols-1 {
    grid-template-columns: minmax(0,1fr);
}

.cols-2 {
    grid-template-columns: repeat(2,minmax(0,1fr));
}

.cols-3 {
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.cols-4 {
    grid-template-columns: repeat(4,minmax(0,1fr));
}

.cols-5 {
    grid-template-columns: repeat(5,minmax(0,1fr));
}

.gap-0 {
    gap: 0;
}

.gap-small {
    gap: 12px;
}

.gap-large {
    column-gap: clamp(30px,5vw,90px);
    row-gap: clamp(40px,6vw,100px);
}

.col-1 {
    grid-column-end: span 1;
}

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

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

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

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

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

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

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

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

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

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

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

.start-1 {
    grid-column-start: 1;
}

.start-2 {
    grid-column-start: 2;
}

.start-3 {
    grid-column-start: 3;
}

.start-4 {
    grid-column-start: 4;
}

.start-5 {
    grid-column-start: 5;
}

.start-6 {
    grid-column-start: 6;
}

.start-7 {
    grid-column-start: 7;
}

.start-8 {
    grid-column-start: 8;
}

.start-9 {
    grid-column-start: 9;
}

.start-10 {
    grid-column-start: 10;
}

.start-11 {
    grid-column-start: 11;
}

.start-12 {
    grid-column-start: 12;
}

.align-start {
    align-items: start;
}

.align-center {
    align-items: center;
}

.align-end {
    align-items: end;
}

.justify-start {
    justify-items: start;
}

.justify-center {
    justify-items: center;
}

.justify-end {
    justify-items: end;
}

.self-start {
    align-self: start;
}

.self-center {
    align-self: center;
}

.self-end {
    align-self: end;
}

@media(min-width:768px) {
    .col-md-1 {
        grid-column-end: span 1;
    }

    .col-md-2 {
        grid-column-end: span 2;
    }

    .col-md-3 {
        grid-column-end: span 3;
    }

    .col-md-4 {
        grid-column-end: span 4;
    }

    .col-md-5 {
        grid-column-end: span 5;
    }

    .col-md-6 {
        grid-column-end: span 6;
    }

    .col-md-7 {
        grid-column-end: span 7;
    }

    .col-md-8 {
        grid-column-end: span 8;
    }

    .col-md-9 {
        grid-column-end: span 9;
    }

    .col-md-10 {
        grid-column-end: span 10;
    }

    .col-md-11 {
        grid-column-end: span 11;
    }

    .col-md-12 {
        grid-column-end: span 12;
    }

    .start-md-1 {
        grid-column-start: 1;
    }

    .start-md-2 {
        grid-column-start: 2;
    }

    .start-md-3 {
        grid-column-start: 3;
    }

    .start-md-4 {
        grid-column-start: 4;
    }

    .start-md-5 {
        grid-column-start: 5;
    }

    .start-md-6 {
        grid-column-start: 6;
    }

    .start-md-7 {
        grid-column-start: 7;
    }

    .start-md-8 {
        grid-column-start: 8;
    }

    .start-md-9 {
        grid-column-start: 9;
    }

    .start-md-10 {
        grid-column-start: 10;
    }

    .start-md-11 {
        grid-column-start: 11;
    }

    .start-md-12 {
        grid-column-start: 12;
    }

}

@media(min-width:1200px) {
    .col-lg-1 {
        grid-column-end: span 1;
    }

    .col-lg-2 {
        grid-column-end: span 2;
    }

    .col-lg-3 {
        grid-column-end: span 3;
    }

    .col-lg-4 {
        grid-column-end: span 4;
    }

    .col-lg-5 {
        grid-column-end: span 5;
    }

    .col-lg-6 {
        grid-column-end: span 6;
    }

    .col-lg-7 {
        grid-column-end: span 7;
    }

    .col-lg-8 {
        grid-column-end: span 8;
    }

    .col-lg-9 {
        grid-column-end: span 9;
    }

    .col-lg-10 {
        grid-column-end: span 10;
    }

    .col-lg-11 {
        grid-column-end: span 11;
    }

    .col-lg-12 {
        grid-column-end: span 12;
    }

    .start-lg-1 {
        grid-column-start: 1;
    }

    .start-lg-2 {
        grid-column-start: 2;
    }

    .start-lg-3 {
        grid-column-start: 3;
    }

    .start-lg-4 {
        grid-column-start: 4;
    }

    .start-lg-5 {
        grid-column-start: 5;
    }

    .start-lg-6 {
        grid-column-start: 6;
    }

    .start-lg-7 {
        grid-column-start: 7;
    }

    .start-lg-8 {
        grid-column-start: 8;
    }

    .start-lg-9 {
        grid-column-start: 9;
    }

    .start-lg-10 {
        grid-column-start: 10;
    }

    .start-lg-11 {
        grid-column-start: 11;
    }

    .start-lg-12 {
        grid-column-start: 12;
    }

}

@media(max-width:767px) {
    .row {
        grid-template-columns: repeat(4,minmax(0,1fr));
    }

    [class*="col-"] {
        grid-column-start: auto;
        grid-column-end: span 4;
    }

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

    .col-sm-1 {
        grid-column-end: span 1;
    }

    .col-sm-2 {
        grid-column-end: span 2;
    }

    .col-sm-3 {
        grid-column-end: span 3;
    }

    .col-sm-4 {
        grid-column-end: span 4;
    }

}
