:root {
    --lacos-white-real: #FFFFFF;
    --lacos-black-real: #000000;
    --lacos-bright-gray: #F0F0F0;
    --lacos-dark-gray: #47484A;
    --lacos-gray: #9D9FA2;
    --lacos-orange: #FF7F45;
    --lacos-blue: #15034F;
    --lacos-orange-dark: rgba(246,77,0,1);
    --lacos-light-gray: #D4D4D4;
    --lacos-btn-border-radius: 90px;
    --index: calc(1vw + 1vh);
    --transition: all ease 0.3s;
    --brightness: 1.0;
    --brightness-default: 0.8;
}

html, body {
    font-family: 'Montserrat' !important;
    letter-spacing: 0.1rem;
}

.orangefill {
    fill: var(--lacos-orange);
}
.blackfill {
    fill: var(--lacos-black-real);
}
.navbar {
    background-color: var(--lacos-bright-gray);
}


a:link, a:visited {
    filter: brightness(var(--brightness-default));
    transition: var(--transition);
}

a:hover {
    filter: brightness(var(--brightness));
    text-decoration: none;
}

.navbar-toggler {
    border: none !important;
}

.btn-lacos-orange {
    border-radius: var(--lacos-btn-border-radius);
    border: 1px solid var(--lacos-orange) !important;
    color: var(--lacos-orange) !important;
    font-size: calc(0.525rem + 0.4vw);
    text-transform: uppercase;
    padding: 0.4rem 1.4rem !important;
    transition: var(--transition);
    filter: brightness(var(--brightness-default));
}

.btn-lacos-orange:hover {
    filter: brightness(var(--brightness));
}

#cooperation .btn-lacos-orange {
    text-transform: none;
}

.nav-phone {
    font-style: normal;
    font-weight: 600;
    font-size: calc(0.725rem + 0.6vw);
    color: var(--lacos-dark-gray);
    text-transform: uppercase;
    margin-left: calc(0.825rem + 1.2vw);
    transition: var(--transition);
    filter: brightness(var(--brightness-default));
}
.nav-phone:hover {
    filter: brightness(var(--brightness));
}

#section_01 {
    padding-top: clamp(20px, 2.0vw, 40px);
    background-color: var(--lacos-blue);
    background-image: url(../i/section_01_back.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
}


#section_01 .nav a:link, #section_01 .nav a:visited {
    font-weight: 600;
    font-size: clamp(14px, 1.0vw, 20px);
    text-transform: uppercase;
    color: var(--lacos-white-real);
    transition: var(--transition);
    filter: brightness(var(--brightness-default));
}

#section_01 .nav a:hover {
    filter: brightness(var(--brightness));
}

#section_01 h1 {
    font-size: clamp(36px, 4vw, 100px);
    font-weight: 700;
    text-transform: uppercase;
    color: var(--lacos-white-real);
    letter-spacing: normal;
    line-height: 1.2em;
    margin-top: clamp(30px, 3vw, 50px);
    margin-bottom: clamp(30px, 3vw, 50px);
}

#section_01 h1 b {
    font-weight: 700;
    color: var(--lacos-orange);
    text-shadow:
    -1px -1px 0 var(--lacos-bright-gray),  
     1px -1px 0 var(--lacos-bright-gray),
     -1px 1px 0 var(--lacos-bright-gray),
      1px 1px 0 var(--lacos-bright-gray);
}


#section_01 h2 {
    font-size: clamp(20px, 2.0vw, 40px);
    color: var(--lacos-orange);
    text-transform: uppercase;
    font-weight: 700;
    line-height: 1.6em;
    margin-bottom: clamp(20px, 2.0vw, 40px);
}


#section_01 h3 {
    font-size: clamp(14px, 0.8vw, 18px);
    color: var(--lacos-white-real);
    text-transform: uppercase;
    font-weight: 600;
    line-height: 2em;
    margin-bottom: clamp(20px, 2.0vw, 40px);
}

.section-head {
    text-transform: uppercase; 
    font-size: clamp(14px, 1.0vw, 20px);
    font-weight: 600;
}

#section_02 {
    padding-top: clamp(20px, 2.0vw, 40px);
    padding-bottom: clamp(20px, 2.0vw, 40px);
}

.carousel-text-head {
    line-height: 2.0;
}
.carousel-text {
    line-height: 2.0;
}


#carouselHistory {
    padding-top: clamp(20px, 2.0vw, 40px);

}

#carouselHistory .carousel-item {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 858px; 
}

#carouselHistory .carousel-item {
    background-color: #fff9f9ed;
}

#carouselHistory .carousel-item h3 {
    font-size: clamp(20px, 2.0vw, 40px);
    color: var(--lacos-dark-gray);
    text-transform: uppercase;
    font-weight: 700;   
}

#carouselHistory .carousel-text-head {
    font-size: clamp(16px, 1.0vw, 20px);
    color: var(--lacos-dark-gray);
    font-weight: 600;   
}

#carouselHistory .carousel-text {
    font-size: clamp(16px, 1.0vw, 20px);
    color: var(--lacos-dark-gray);
    font-weight: 400;   
}

#carouselHistory .carousel-text-2 {
    font-size: clamp(16px, 1.0vw, 20px);
    font-weight: 600;
}

#carouselHistory .carousel-indicators {
    margin-bottom: -3rem;
}
#carouselHistory  .carousel-indicators [data-bs-target] {
    background-color: var(--lacos-light-gray);
    width: 20px;
    height: 20px;
    border-radius: 50%;
}
#carouselHistory .carousel-indicators .active {
    background-color: var(--lacos-orange);
}



#carouselHistory .carousel-item:nth-child(1) {
    background-image: url(../i/car_01/m/01.jpg);
}
#carouselHistory .carousel-item:nth-child(2) {
    background-image: url(../i/car_01/m/02.jpg);
}
#carouselHistory .carousel-item:nth-child(3) {
    background-image: url(../i/car_01/m/03.jpg);
}
#carouselHistory .carousel-item:nth-child(4) {
    background-image: url(../i/car_01/m/04.jpg);
}
#carouselHistory .carousel-item:nth-child(5) {
    background-image: url(../i/car_01/m/05.jpg);
}
#carouselHistory .carousel-item:nth-child(6) {
    background-image: url(../i/car_01/m/06.jpg);
}
#carouselHistory .carousel-item:nth-child(7) {
    background-image: url(../i/car_01/m/07.jpg);
}


.section-title {
    font-size: clamp(20px, 2.0vw, 40px);
    text-transform: uppercase;
    font-weight: 700;   
}

.section-text {
    font-size: clamp(16px, 1.0vw, 20px);
    font-weight: 400;   
}

#section_03 {
    padding-top: clamp(20px, 2.0vw, 40px);
    margin-top: 3rem;
    padding-bottom: clamp(20px, 2.0vw, 40px);
    background-color: var(--lacos-orange);
    background: linear-gradient(0deg, var(--lacos-orange-dark) 30%, var(--lacos-orange) 100%);
}

#section_03 .card-1 {
    background-image: url(../i/sec_03_card_01.png);   
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
}

#section_03 .card-1 .section-title {
    color: var(--lacos-white-real);
}

#section_03 .card-1 .section-text {
    color: var(--lacos-orange);
}

#section_03 .card-2 {
    background-image: url(../i/sec_03_card_02.png);   
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
}

#section_03 .card-2 .section-text {
    color: var(--lacos-orange);
    text-transform: uppercase;
}


#section_04 {
    padding-top: calc(1.425rem + 1.6vw);
    padding-bottom: calc(1.425rem + 1.6vw);
    background-color: var(--lacos-dark-gray);
}

#section_04 .section-head {
    color: var(--lacos-gray);
}

#section_04 .section-title {
    color: var(--lacos-white-real);
}

#section_04 .section-text {
    color: var(--lacos-white-real);
    text-transform: uppercase;
}

#section_04 .section-head {
    color: var(--lacos-gray);
}


#section_05 {
    padding-top: clamp(20px, 2.0vw, 40px);
    padding-bottom: calc(clamp(20px, 2.0vw, 40px) + 50px);
    background-color: var(--lacos-black-real);
}

#section_05 .section-head {
    color: var(--lacos-light-gray);
}

#carouselProduction {
    padding-top: clamp(20px, 2.0vw, 40px);

}


#carouselProduction .carousel-item {
    background-repeat: no-repeat;
    background-size: cover;
    height: auto;
    min-height: 330px; 
}

#carouselProduction .carousel-item {
    background-color: transparent;
}

#carouselProduction .carousel-item h3 {
    font-size: clamp(20px, 2.0vw, 40px);
    color: var(--lacos-bright-gray);
    text-transform: uppercase;
    font-weight: 700;   
}

#carouselProduction .carousel-text-head {
    font-size: clamp(16px, 1.0vw, 20px);
    color: var(--lacos-bright-gray);
    font-weight: 600;   
}

#carouselProduction .carousel-text {
    font-size: clamp(16px, 1.0vw, 20px);
    color: var(--lacos-bright-gray);
    font-weight: 400;   
}

#carouselProduction .carousel-text-2 {
    font-size: clamp(16px, 1.0vw, 20px);
    font-weight: 600;
}

#carouselProduction .carousel-indicators {
    margin-bottom: -3rem;
}
#carouselProduction  .carousel-indicators [data-bs-target] {
    background-color: var(--lacos-light-gray);
    width: 20px;
    height: 20px;
    border-radius: 50%;
}
#carouselProduction .carousel-indicators .active {
    background-color: var(--lacos-orange);
}

#carouselProduction .carousel-item .icon-link {
    padding-bottom: clamp(20px, 2.0vw, 40px);
    color: var(--lacos-bright-gray);
    display: flex;
}



#section_06 {
    padding-top: clamp(20px, 2.0vw, 40px);
    margin-top: 3rem;
    padding-bottom: clamp(20px, 2.0vw, 40px);
    background-color: var(--lacos-white-real);
}


#section_06 .section-brands {
    font-size: clamp(40px, 4.0vw, 100px);
    color: var(--lacos-black-real);
    font-weight: 700;
    text-transform: uppercase;
}

#section_06 h2 {
    font-size: clamp(20px, 2.0vw, 40px);
    color: var(--lacos-dark-gray);
    font-weight:600;
    text-transform: uppercase;
    line-height: 1.5em;
}


.brands .brands-row {
    background-repeat: no-repeat;
    background-size: cover;
    height: 660px;
    background-color: var(--lacos-light-gray);
}

.brand-text-col {
    padding-top: clamp(40px, 2.6vw, 60px);
}

.brands .brands-row div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
}

.brands .brands-row .section-text a:link, .brands .brands-row .section-text a:visited {
    color: var(--lacos-dark-gray);
}
.brands-row {
    margin-bottom: clamp(20px, 2.0vw, 40px);
}

.brand-logo {
    height:auto;
    width: clamp(100px, 10.0vw, 200px);
    transition: var(--transition);
}

.brands-row.active .brand-logo {
    width: clamp(120px, 11.0vw, 220px);
}



.brands .brands-row:nth-child(1) {
    background-image: url(../i/brands/m/soframap.jpg);
}
.brands .brands-row:nth-child(2) {
    background-image: url(../i/brands/m/vincent.jpg);
}
.brands .brands-row:nth-child(3) {
    background-image: url(../i/brands/m/vd.jpg);
}
.brands .brands-row:nth-child(4) {
    background-image: url(../i/brands/m/majestic_paints.jpg);
}
.brands .brands-row:nth-child(5) {
    background-image: url(../i/brands/m/cb4u.jpg);
}
.brands .brands-row:nth-child(6) {
    background-image: url(../i/brands/m/pragmatic.jpg);
}
.brands .brands-row:nth-child(7) {
    background-image: url(../i/brands/m/lipression.jpg);
}
.brands .brands-row:nth-child(8) {
    background-image: url(../i/brands/m/simple.jpg);
}
.brands .brands-row:nth-child(9) {
    background-image: url(../i/brands/m/neo3000.jpg);
}



#section_07 {
    padding-top: clamp(20px, 2.0vw, 40px);
    padding-bottom: calc(clamp(20px, 2.0vw, 40px) + 50px);
    background-color: var(--lacos-dark-gray);
}

#section_07 .section-head, #section_07 a:link, #section_07 a:visited {
    color: var(--lacos-white-real);
}

#carouselWall {
    padding-top: clamp(20px, 2.0vw, 40px);

}


#carouselWall .carousel-item {
    background-repeat: no-repeat;
    background-size: cover;
    height: auto;
    min-height: 330px; 
}

#carouselWall .carousel-item {
    background-color: transparent;
}

#carouselWall .carousel-item h3 {
    font-size: clamp(20px, 2.0vw, 40px);
    color: var(--lacos-bright-gray);
    text-transform: uppercase;
    font-weight: 700;   
}

#carouselWall .carousel-text-head {
    font-size: clamp(16px, 1.0vw, 20px);
    color: var(--lacos-white-real);
    font-weight: 600;   
}

#carouselWall .carousel-text {
    font-size: clamp(16px, 1.0vw, 20px);
    color: var(--lacos-white-real);
    font-weight: 400;   
}


#carouselWall .carousel-indicators {
    margin-bottom: -3rem;
}
#carouselWall  .carousel-indicators [data-bs-target] {
    background-color: var(--lacos-light-gray);
    width: 20px;
    height: 20px;
    border-radius: 50%;
}
#carouselWall .carousel-indicators .active {
    background-color: var(--lacos-orange);
}
#carouselWall .section-text a:link, #carouselWall .section-text a:visited {
    color: var(--lacos-white-real);
}



#section_08 {
    padding-top: calc(1.425rem + 1.6vw);
    padding-bottom: calc(1.425rem + 1.6vw);
    background-color: var(--lacos-black-real);
}

#section_08 .section-title {
    color: var(--lacos-orange);
}

#section_08 .section-text {
    color: var(--lacos-white-real);
    line-height: 1.8;
    text-transform: uppercase;
}


#section_09 {
    padding-top: clamp(20px, 2.0vw, 40px);
    padding-bottom: calc(clamp(20px, 2.0vw, 40px) + 50px);
    background-color: var(--lacos-white-real);
}

#section_09 .section-head {
    color: var(--lacos-dark-gray);
}

#carouselTinting {
    padding-top: clamp(20px, 2.0vw, 40px);

}


#carouselTinting .carousel-item {
    background-repeat: no-repeat;
    background-size: cover;
    height: 720px;
}

#carouselTinting .carousel-item {
    background-color: transparent;
}

#carouselTinting .carousel-item h3 {
    font-size: clamp(20px, 2.0vw, 40px);
    color: var(--lacos-dark-gray);
    text-transform: uppercase;
    font-weight: 700;   
}

#carouselTinting .carousel-text-head {
    font-size: clamp(16px, 1.0vw, 20px);
    color: var(--lacos-dark-gray);
    font-weight: 600;   
}

#carouselTinting .carousel-text {
    font-size: clamp(16px, 1.0vw, 20px);
    color: var(--lacos-dark-gray);
    font-weight: 400;   
}


#carouselTinting .carousel-indicators {
    margin-bottom: -3rem;
}
#carouselTinting  .carousel-indicators [data-bs-target] {
    background-color: var(--lacos-dark-gray);
    width: 20px;
    height: 20px;
    border-radius: 50%;
}
#carouselTinting .carousel-indicators .active {
    background-color: var(--lacos-orange);
}
#carouselTinting .section-text a:link, #carouselTinting .section-text a:visited {
    color: var(--lacos-dark-gray);
}




#section_10 {
    padding-top: calc(1.425rem + 1.6vw);
    padding-bottom: calc(1.425rem + 1.6vw);
    background-color: var(--lacos-orange);
    background: linear-gradient(0deg, var(--lacos-orange-dark) 30%, var(--lacos-orange) 100%);
}

#section_10 .section-title {
    color: var(--lacos-white-real);
}

#section_10 .section-text {
    color: var(--lacos-white-real);
    line-height: 1.8;
    text-transform: uppercase;
}
#section_10 .section-text a:link, #section_10 .section-text a:visited {
    color: var(--lacos-white-real);
}



#section_11 {
    padding-top: calc(1.425rem + 1.6vw);
    padding-bottom: calc(1.425rem + 1.6vw);
    background-color: var(--lacos-bright-gray);
}

#section_11 .section-title {
    color: var(--lacos-dark-gray);
}

#section_11 .section-text {
    color: var(--lacos-dark-gray);
    line-height: 1.8;
    text-transform: uppercase;
}
#section_11 .section-text a:link, #section_11 .section-text a:visited {
    color: var(--lacos-dark-gray);
}
#section_11 h3 {
    font-size: clamp(20px, 2.0vw, 40px);
    text-transform: uppercase;
    font-weight: 700;
}


footer {
    background-color: var(--lacos-light-gray);
}

.footer-bottom {
    background-color: var(--lacos-gray);
    color: var(--lacos-dark-gray)
}

footer a:link, footer a:visited {
    color: var(--lacos-dark-gray);
}
footer a:hover, footer a:active {
    color: var(--lacos-orange) !important;
}
.footer-brand svg {
    width: clamp(54px, 10vw, 120px);
    height: auto;
}


#gotoTop {
    display: none;
    z-index: 599;
    position: fixed;
    width: 40px;
    height: 40px;
    background-color: #333;
    background-color: rgba(0, 0, 0, 0.3);
    font-size: 1.25rem;
    line-height: 36px;
    text-align: center;
    color: #FFF;
    top: auto;
    left: auto;
    right: 30px;
    bottom: 50px;
    cursor: pointer;
    border-radius: 2px;
}

.files-card {
    padding-left: clamp(50px, 16vw, 100px) !important;
}

#carouselWall .carousel-item:nth-child(1) {
    background-image: url(../i/car_03/01.jpeg);
}
#carouselWall .carousel-item:nth-child(2) {
    background-image: url(../i/car_03/02.jpeg);
}
#carouselWall .carousel-item:nth-child(3) {
    background-image: url(../i/car_03/04.jpeg);
}
#carouselWall .carousel-item:nth-child(4) {
    background-image: url(../i/car_03/05.jpeg);
}
#carouselWall .carousel-item:nth-child(5) {
    background-image: url(../i/car_03/06.jpeg);
}
#carouselWall .carousel-item:nth-child(6) {
    background-image: url(../i/car_03/07.jpeg);
}
#carouselWall .carousel-item:nth-child(7) {
    background-image: url(../i/car_03/08.jpeg);
}
#carouselWall .carousel-item:nth-child(8) {
    background-image: url(../i/car_03/09.jpeg);
}
#carouselWall .carousel-item:nth-child(9) {
    background-image: url(../i/car_03/10.jpeg);
}
#carouselWall .carousel-item:nth-child(10) {
    background-image: url(../i/car_03/11.jpeg);
}



#carouselProduction .carousel-item:nth-child(1) {
    background-image: url(../i/car_02/01.png);
}
#carouselProduction .carousel-item:nth-child(2) {
    background-image: url(../i/car_02/01.png);
}
#carouselProduction .carousel-item:nth-child(3) {
    background-image: url(../i/car_02/01.png);
}
#carouselProduction .carousel-item:nth-child(4) {
    background-image: url(../i/car_02/01.png);
}
#carouselProduction .carousel-item:nth-child(5) {
    background-image: url(../i/car_02/01.png);
}
#carouselProduction .carousel-item:nth-child(6) {
    background-image: url(../i/car_02/01.png);
}


#carouselProduction .carousel-item {
    height: 720px;
}

#carouselTinting .carousel-item:nth-child(1) {
    background-image: url(../i/car_04/m/01.jpg);
}
#carouselTinting .carousel-item:nth-child(2) {
    background-image: url(../i/car_04/m/02.jpg);
}
#carouselTinting .carousel-item:nth-child(3) {
    background-image: url(../i/car_04/m/03.jpg);
}
#carouselTinting .carousel-item:nth-child(4) {
    background-image: url(../i/car_04/m/04.jpg);
}
#carouselTinting .carousel-item:nth-child(5) {
    background-image: url(../i/car_04/m/05.jpg);
}
#carouselTinting .carousel-item:nth-child(6) {
    background-image: url(../i/car_04/m/06.jpg);
}




canvas {
    width: 100px;
    height: 100px;
    /* z-index: 2;
    pointer-events: all; */
}
.zindex-1 {
    z-index: 1;
    pointer-events: all;
}


@media (min-width: 768px)
{

    .zindex-1 {
        z-index: 1;
        pointer-events: none;
    }

    /* #carouselHistory .carousel-item {
        min-height: 600px;
    }
    #carouselProduction .carousel-item {
        min-height: 600px;
    } */

    #carouselHistory .carousel-item:nth-child(1) {
        background-image: url(../i/car_01/01.jpeg);
    }
    #carouselHistory .carousel-item:nth-child(2) {
        background-image: url(../i/car_01/02.jpeg);
    }
    #carouselHistory .carousel-item:nth-child(3) {
        background-image: url(../i/car_01/03.jpeg);
    }
    #carouselHistory .carousel-item:nth-child(4) {
        background-image: url(../i/car_01/04.jpeg);
    }
    #carouselHistory .carousel-item:nth-child(5) {
        background-image: url(../i/car_01/05.jpeg);
    }
    #carouselHistory .carousel-item:nth-child(6) {
        background-image: url(../i/car_01/06.jpeg);
    }
    #carouselHistory .carousel-item:nth-child(7) {
        background-image: url(../i/car_01/07.jpeg);
    }


    .brands .brands-row:nth-child(1) {
        background-image: url(../i/brands/soframap.png);
    }
    .brands .brands-row:nth-child(2) {
        background-image: url(../i/brands/vincent.png);
    }
    .brands .brands-row:nth-child(3) {
        background-image: url(../i/brands/vd.png);
    }
    .brands .brands-row:nth-child(4) {
        background-image: url(../i/brands/majestic_paint.png);
    }
    .brands .brands-row:nth-child(5) {
        background-image: url(../i/brands/cb4u.png);
    }
    .brands .brands-row:nth-child(6) {
        background-image: url(../i/brands/pragmatic.png);
    }
    .brands .brands-row:nth-child(7) {
        background-image: url(../i/brands/limpression.png);
    }
    .brands .brands-row:nth-child(8) {
        background-image: url(../i/brands/simple.png);
    }
    .brands .brands-row:nth-child(9) {
        background-image: url(../i/brands/neo3000.png);
    }




    #carouselTinting .carousel-item:nth-child(1) {
        background-image: url(../i/car_04/01.jpeg);
    }
    #carouselTinting .carousel-item:nth-child(2) {
        background-image: url(../i/car_04/01.jpeg);
    }
    #carouselTinting .carousel-item:nth-child(3) {
        background-image: url(../i/car_04/04.jpeg);
    }
    #carouselTinting .carousel-item:nth-child(4) {
        background-image: url(../i/car_04/04.jpeg);
    }
    #carouselTinting .carousel-item:nth-child(5) {
        background-image: url(../i/car_04/05.jpeg);
    }
    #carouselTinting .carousel-item:nth-child(6) {
        background-image: url(../i/car_04/06.jpeg);
    }



    .brands .brands-row {
        height: clamp(330px, 70vh, 600px);  
    }

    .brands .brands-row div {
        justify-content: center;
    }


    #carouselHistory .carousel-item {
        height: clamp(330px, 70vh, 600px);
    }
    
    #carouselProduction .carousel-item {
        height: clamp(330px, 70vh, 600px);
    }
    
    #carouselWall .carousel-item {
        height: clamp(330px, 70vh, 600px);
    }
    #carouselTinting .carousel-item {
        height: clamp(330px, 70vh, 600px);
    }

}