.M02 .header {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background-size: cover;
    background-position: center;
    padding: 32px 48px;
    position: relative;
    z-index: 2;
    background-size: cover;
    /*max-height: 408px;*/
    min-height: 408px;
    height: 100%;
    background-position-x: right;
}

.M02.oscuro .header{ background-position-y: bottom; }
.M02.claro .header{ background-position-y: center; }

.M02 .header .contItems{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    position: relative;
    z-index: 2;
}

.M02.claro .header::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: linear-gradient(
            93deg,
            #fff 3.45%,
            rgba(255, 255, 255, 0.99) 9.25%,
            rgba(255, 255, 255, 0.98) 14.61%,
            rgba(255, 255, 255, 0.95) 19.61%,
            rgba(255, 255, 255, 0.92) 24.31%,
            rgba(255, 255, 255, 0.87) 28.78%,
            rgba(255, 255, 255, 0.82) 33.09%,
            rgba(255, 255, 255, 0.75) 37.29%,
            rgba(255, 255, 255, 0.68) 41.46%,
            rgba(255, 255, 255, 0.6) 45.67%,
            rgba(255, 255, 255, 0.52) 49.97%,
            rgba(255, 255, 255, 0.42) 54.44%,
            rgba(255, 255, 255, 0.33) 59.14%,
            rgba(255, 255, 255, 0.22) 64.14%,
            rgba(255, 255, 255, 0.11) 69.51%,
            rgba(255, 255, 255, 0) 75.31%
    );
}

.M02.oscuro .contOp{
    background: linear-gradient(
    96deg,
    #212529 0.22%,
    rgba(33, 37, 41, 0.99) 5.84%,
    rgba(33, 37, 41, 0.97) 10.42%,
    rgba(33, 37, 41, 0.93) 14.1%,
    rgba(33, 37, 41, 0.88) 17.07%,
    rgba(33, 37, 41, 0.82) 19.47%,
    rgba(33, 37, 41, 0.75) 21.47%,
    rgba(33, 37, 41, 0.67) 23.22%,
    rgba(33, 37, 41, 0.59) 24.9%,
    rgba(33, 37, 41, 0.50) 26.65%,
    rgba(33, 37, 41, 0.41) 28.65%,
    rgba(33, 37, 41, 0.33) 31.05%,
    rgba(33, 37, 41, 0.24) 34.02%,
    rgba(33, 37, 41, 0.15) 37.7%,
    rgba(33, 37, 41, 0.07) 42.28%,
    rgba(33, 37, 41, 0.00) 47.9%
    );
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.M02.oscuro .header::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: rgba(33, 37, 41, 0.04);
    /*backdrop-filter: blur(40px);*/
}

.M02 .header .items{
    position: relative;
    z-index: 2;
}

.M02 .header .goBack {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #212529;
    font-family: "FS Emeric";
    font-size: 14px;
    font-weight: 400;
    line-height: 120%;
    text-decoration: none;
    cursor: pointer;
    margin-bottom: 16px;
    width: fit-content;
}
.M02 .header--breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
    margin-bottom: 16px;
}

.M02 .header--breadcrumbs .breadcrumb{
    position: relative;
    cursor: pointer;
}

.M02 .header--breadcrumbs .breadcrumb *{
    color: #666;
    font-family: "FS Emeric";
    font-size: 12px;
    font-style: normal;
    font-weight: 350;
    line-height: 120%;
    letter-spacing: 0.25px;
}

.M02.claro .header--breadcrumbs .breadcrumb:not(:last-child) a{ color: #666; }
.M02 .header--breadcrumbs .breadcrumb:last-child a{
    font-family: "FS Emeric";
    font-size: 12px;
    font-style: normal;
    font-weight: 450;
    line-height: 120%;
    letter-spacing: 0.05px;
}

.M02.claro .header--breadcrumbs .breadcrumb:last-child a{ color: #03F; }
.M02.oscuro .header--breadcrumbs .breadcrumb:not(:last-child) a{ color: #ECECEC; }
.M02.oscuro .header--breadcrumbs .breadcrumb:last-child a{ color: #FFF; }

.M02 .header--breadcrumbs .breadcrumb a{ text-decoration: unset; }

.M02.oscuro .header .header--breadcrumbs .breadcrumb { color: #ECECEC }
.M02.oscuro .header--breadcrumbs .breadcrumb:not(:first-child)::before { color: #ECECEC; }
.M02.claro .header--breadcrumbs .breadcrumb:not(:first-child)::before { color: #666;}
.M02 .header--breadcrumbs .breadcrumb:not(:first-child)::before {
    content: "·";
    position: absolute;
    top: 50%;
    left: -12px;
    transform: translateY(-50%);

}
.M02 .header--breadcrumbs .breadcrumb:last-child { 
    font-family: "FS Emeric";
    font-size: 12px;
    font-style: normal;
    font-weight: 450;
    line-height: 120%; /* 14.4px */
    letter-spacing: 0.05px;
    color: #03F;
}
.M02 .header.black .header--breadcrumbs .breadcrumb:last-child { color: #fff; }
.M02 .header--tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
    margin-bottom: 16px;
}
.M02 .header--tags .tag {
    color: #FFF;
    font-family: "FS Emeric";
    font-size: 12px;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: 0.05px;
    border-radius: 4px;
    background: #3869FF;
    padding: 3px 6px 1px 6px;
}
.M02 .header--title > * {
    color: #212529;
    font-family: "FS Emeric";
    font-size: 48px;
    font-style: normal;
    font-weight: 350;
    line-height: 100%; /* 48px */
    letter-spacing: -0.65px;
    margin-top: 16px;
    max-width: 500px;
    /*display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;*/
    margin-bottom: 0;
    padding-bottom: 5px;
}
.M02.oscuro .header .header--title > *, .M02.oscuro .header .header--description > *, .M02.oscuro .header .goBack { color: #fff; }

.M02 .header--description{
    max-width: 496px;
    width: 100%;
    /*display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;*/
    margin-bottom: 16px;
}
.M02 .header--description > * {
    color: #4B4F54;
    font-family: "FS Emeric";
    font-size: 20px;
    font-style: normal;
    font-weight: 350;
    line-height: 120%;
    margin-bottom: 0;
}
.M02 .header--email{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.M02 .header--email > * {
    color: #03F;
    color: var(--Neutros-Gris-Claro, #ECECEC);
    font-family: "FS Emeric";
    font-size: 12px;
    font-style: normal;
    font-weight: 350;
    line-height: 120%;
    letter-spacing: 0.25px;
}

.M02.black .header--email > * { color: #ECECEC; }
.M02.claro .header--email > * { color: #03F; }

.M02 .imgMobile{
    display: none;
}

.M02.claro .contOp{ 
    display: none; 
}

@media screen and (max-width: 991px) {
    .M02 .header { gap: 52px; }

    .M02 .header--description{
        max-width: 100%;
        /*display: -webkit-box;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
        overflow: hidden;*/
    }

    .M02 .header{
        padding: 24px 16px;
    }

    .M02 .header .contItems{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 52px;
        position: relative;
        z-index: 2;
    }
}

@media screen and (max-width: 767px) {
    /*Img feedbacks*/
    .M02 .header--tags { margin-top: 0; margin-bottom: 16px; }
    .M02 .header .contItems.hasContent{ gap: 32px; }

    
    /*.M02 .header--title{
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }*/

    .M02 .header--title.no-texts{ margin-bottom: 20px; }

    .M02 .header--title > *{
        font-size: 32px;
        font-style: normal;
        font-weight: 350;
        line-height: 100%;
        letter-spacing: -0.65px;
        margin-top: 0;
        margin-bottom: 0;
    
    }

    .M02 .header .header--description > *{
        font-family: "FS Emeric";
        font-size: 20px;
        font-style: normal;
        font-weight: 350;
        line-height: 120%;
    }

    .M02 .header{ background: unset; }

    .M02 .imgMobile{  
        display: block;
        width: 100%;
        min-height: 166px;
        background-size: 130%;
        background-repeat: no-repeat;
        background-position: bottom right;
        position: relative;
        height: 100%;
    }

    .M02.oscuro .header .imgMobile::after{ 
            background: linear-gradient(
        180deg,
        #212529 0%,
        rgba(33, 37, 41, 0.99) 4.18%,
        rgba(33, 37, 41, 0.98) 8.05%,
        rgba(33, 37, 41, 0.95) 11.65%,
        rgba(33, 37, 41, 0.92) 15.05%,
        rgba(33, 37, 41, 0.87) 18.27%,
        rgba(33, 37, 41, 0.82) 21.37%,
        rgba(33, 37, 41, 0.75) 24.4%,
        rgba(33, 37, 41, 0.68) 27.41%,
        rgba(33, 37, 41, 0.60) 30.44%,
        rgba(33, 37, 41, 0.52) 33.54%,
        rgba(33, 37, 41, 0.42) 36.76%,
        rgba(33, 37, 41, 0.33) 40.15%,
        rgba(33, 37, 41, 0.22) 43.76%,
        rgba(33, 37, 41, 0.11) 47.63%,
        rgba(33, 37, 41, 0.00) 51.81%
        );
    }

    .M02.claro .header .imgMobile::after{ 
            background: linear-gradient(
            180deg,
            #FFF 0%,
            rgba(255, 255, 255, 0.99) 4.18%,
            rgba(255, 255, 255, 0.98) 8.05%,
            rgba(255, 255, 255, 0.95) 11.65%,
            rgba(255, 255, 255, 0.92) 15.05%,
            rgba(255, 255, 255, 0.87) 18.27%,
            rgba(255, 255, 255, 0.82) 21.37%,
            rgba(255, 255, 255, 0.75) 24.4%,
            rgba(255, 255, 255, 0.68) 27.41%,
            rgba(255, 255, 255, 0.60) 30.44%,
            rgba(255, 255, 255, 0.52) 33.54%,
            rgba(255, 255, 255, 0.42) 36.76%,
            rgba(255, 255, 255, 0.33) 40.15%,
            rgba(255, 255, 255, 0.22) 43.76%,
            rgba(255, 255, 255, 0.11) 47.63%,
            rgba(255, 255, 255, 0.00) 51.81%
            );
    }

    .M02.oscuro .header{ background-color: #212529;}
    .M02.oscuro .header{ background-color: #212529;}

    .M02 .header{ background-image: unset!important;}

    .M02.oscuro .header::after,
    .M02.claro .header::after{ content: unset; }



    .M02 .header .imgMobile::after{ 
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 2;
    }

    .M02.oscuro .contOp{ 
        display: none; 
    }

    .M02 .header {
        gap: 0;
    }

    .M02 .header--description {
        max-width: 100%;
    }

    .M02 .header {
        min-height: unset;
        height: 100%;
        padding: 24px 0 0 0;
    }

    .m02 .header .items{
        padding: 0 20px;
    }

    .M02.claro .header::after{
        left: 0;
        bottom: -0.309px;
        background: #FFFFFF;
        background: linear-gradient(180deg,rgba(255, 255, 255, 1) 70%, rgba(0, 0, 0, 0) 120%)
    }

    .M02.oscuro .header::after{
        display: none;
    }
}