.rootHeader {
    position: relative;
    width: 100%;
}

.rootHeader .heroInfo {
    /* CENTRAR */
    position: relative;
    width: 100%;
    box-sizing: border-box;
    max-width: var(--web_maxWidth);
    margin: 0 auto;

    display: grid;
    align-items: center;
}

.rootHeader .heroInfo:nth-of-type(1) {
    position: relative;
}

.rootHeader .heroInfo:nth-of-type(1)>div:nth-of-type(2) {
    position: relative;
}

.rootHeader .heroInfo:nth-of-type(2) {
    /* Centrar */
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    /*
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    */
    /* Centrar */
    height: 100%;
}

.rootHeader .heroInfo:nth-of-type(2)>div:nth-of-type(1) {}

.rootHeader .heroInfo:nth-of-type(2)>div:nth-of-type(1)>div {
    text-align: center;
    padding: 1rem;
    /* Centrar */
    width: 100%;
    box-sizing: border-box;
    max-width: 35rem;
    margin: 0 auto;
    /* Centrar */
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.rootHeader .heroInfo:nth-of-type(2)>div:nth-of-type(1)>div h1 {
    font-family: 'GothamCond';
    font-size: 2.60rem;
    color: var(--secondColor);
    font-weight: 600;
}

.rootHeader .heroInfo:nth-of-type(2)>div:nth-of-type(1)>div h2 {
    font-family: 'Gotham';
    font-size: 1.20rem;
    color: var(--firstColor);
    font-weight: 600;
}

@media (min-width: 1551px) {
    .rootHeader .heroInfo {
        grid-template-columns: auto 20rem;
    }
}

@media (min-width: 1415px) and (max-width: 1550px) {
    .rootHeader .heroInfo {
        grid-template-columns: auto 20rem;
        padding: 0 1rem;
    }
}

@media (min-width: 1276px) and (max-width: 1414px) {
    .rootHeader .heroInfo {
        grid-template-columns: auto 20rem;
        padding: 0 1rem;
    }
}

@media (min-width: 668px) and (max-width: 1275px) {
    .rootHeader .heroInfo {
        padding: 0 1rem;
        grid-template-columns: auto 20rem;
    }
}

@media (max-width: 667px) {
    .rootHeader .heroInfo {
        grid-template-rows: 1fr 0;
    }
}










.c2c_hero_desktop {
    display: block;
}

.c2c_hero_mobile {
    display: none;
}

@media (max-width: 667px) {
    .c2c_hero_desktop {
        display: none;
    }

    .c2c_hero_mobile {
        display: block;
        padding: 1rem;
    }
}










.c2c_stickyContainer {
    height: 34.0rem;
    width: 100%;
    position: absolute;
    right: 0;
    top: 6.5rem;
}

.c2c_stickyContainer .c2c_stickyELement {
    position: sticky;
    top: 6.5rem;
}

body#index .c2c_stickyContainer {
    height: 65.0rem;
}

body#contact .c2c_stickyContainer {
    height: 75.0rem;
}










.heroBanner {
    /* Centrar */
    width: 100%;
    max-width: 2550px;
    margin: 0 auto;
    /* Centrar */
    display: flex;
    justify-content: center;
    position: relative;
    margin-bottom: -0.2rem;
}

.heroBanner picture img {
    opacity: 0.60;
    width: 100%;
}










@media (min-width: 1551px) {
    .heroBanner picture img {
        object-fit: cover;
        object-position: 50% 50%;
        height: 35rem;
        margin-top: 0;
    }
}

@media (min-width: 1415px) and (max-width: 1550px) {
    .heroBanner picture img {
        object-fit: cover;
        object-position: 50% 50%;
        height: 35rem;
        margin-top: 0;
    }
}

@media (min-width: 1276px) and (max-width: 1414px) {
    .heroBanner picture img {
        object-fit: cover;
        object-position: 50% 50%;
        height: 35rem;
        margin-top: 0;
    }
}

@media (min-width: 668px) and (max-width: 1275px) {
    .heroBanner picture img {
        object-fit: cover;
        object-position: 50% 50%;
        height: 35rem;
        margin-top: 0;
    }
}

@media (max-width: 667px) {
    .heroBanner picture img {
        object-fit: cover;
        object-position: 45% 50%;
        /*height: 50vw;*/
        height: 30rem;
    }
}

body#index .heroBanner {
    /* Centrar */
    width: 100%;
    max-width: var(--web_maxWidth);
    margin: 0 auto;
    /* Centrar */
    display: flex;
    justify-content: center;
}

body#index .heroBanner picture img {
    opacity: 1.00;
    width: 100%;

    /*
    width: inherit;
    height: inherit;
    margin-left: -5rem;
    */

    /*
    height: 44rem;
    object-fit: cover;
    object-position: 50% 50%;
    */

    position: relative;
}

@media (min-width: 1551px) {
    body#index .heroBanner picture img {
        object-fit: inherit;
        object-position: inherit;
        height: inherit;

        margin-left: -2rem;
    }
}

@media (min-width: 1151px) and (max-width: 1550px) {
    body#index .heroBanner picture img {
        object-fit: cover;
        object-position: 75% 50%;
        height: 33.75rem;
    }
}


@media (min-width: 851px) and (max-width: 1150px) {
    body#index .heroBanner picture img {
        object-fit: cover;
        object-position: -10vw 50%;
        height: 48vw;
    }
}

@media (min-width: 668px) and (max-width: 850px) {
    body#index .heroBanner picture img {
        object-fit: cover;
        object-position: -20vw 50%;
        height: 48vw;
    }
}


@media (max-width: 667px) {
    body#index .heroBanner picture img {
        object-fit: cover;
        object-position: -26vw 0;
        height: 65vw;
    }
}










header .shape01 img {
    z-index: 5;
}

nav {
    z-index: 6;
}

.c2c_stickyContainer {
    z-index: 2;
}

.heroBanner picture:nth-of-type(1) img {
    z-index: 1;
}

.rootHeader .heroInfo:nth-of-type(1) {
    z-index: 3;
}

.rootHeader .heroInfo:nth-of-type(2) {
    z-index: 1;
}










.customers {
    margin-top: 2rem;
    position: relative;
}

.customers h3 {
    font-family: 'GothamCond';
    font-weight: 500;
    color: white;
    text-align: center;
    font-size: 2.30rem;
}

.customers .swiper {
    padding-top: 1rem;
    /*
    padding-bottom: 4rem;
    */
}

.customers .swiper .swiper-wrapper {}

.customers .swiper .swiper-button-prev {}

.customers .swiper .swiper-button-next {}

/* .customers .swiper .swiper-wrapper ... */
.swiper-slide {
    border-radius: 1rem;
    background: #fff;
}

.swiper-slide img {
    padding: 0.5rem 1rem 0.5rem 1rem;
    width: calc(100% - 2rem);
}

.swiper-slide:nth-of-type(1) {}

.customers .swiper .swiper-pagination {}

.customers .swiper .swiper-pagination .swiper-pagination-bullet {
    padding: 0.5rem;
    margin: 0.5rem;
}

.customers .swiper .swiper-pagination .swiper-pagination-bullet-active {
    background: var(--secondColor);
}

.customers .swiper .swiper-notification {}

.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}










header .shape01 img {
    /* CENTRAR */
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);

    position: fixed;

    width: 90rem;
    margin-left: 5rem;

    /* offset-x | offset-y | blur-radius | spread-radius | color */
    /*
    box-shadow: 0 0 0.5rem 0 rgba(0, 0, 0, 0.25);
    */
    /* drop-shadow(offset-x offset-y blur-radius color) */
    filter: drop-shadow(-1rem 2rem 2rem rgba(0, 0, 0, 0.5))
}

header .shape02 img {
    /* centrar */
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    /* centrar */

    width: 100%;
    /*max-width: 2500px;*/
    height: 38rem;
    object-fit: cover;
    object-position: 50% 100%;
}

@media (min-width: 1551px) {}

@media (min-width: 1151px) and (max-width: 1550px) {}

@media (min-width: 668px) and (max-width: 1150px) {}

@media (max-width: 667px) {
    header .shape01 img {
        margin-left: -1rem;
    }

    header .shape02 img {
        bottom: -1.5rem;
        height: 10rem;
    }
}