/* ==========================================
                HERO
========================================== */

.pm-projects-hero{

    position:relative;

    display:flex;

    align-items:stretch;

    width:100%;
    min-height:900px;

    overflow:hidden;

    background:#000;
margin-bottom: 96px;
}
.pm-br-desktop{

    display:block;
}

.pm-br-mobile{

    display:none;
}
/* ==========================================
                MEDIA
========================================== */

.pm-projects-hero__media{

    position:absolute;

    inset:0;

    z-index:1;
}

.pm-projects-hero__poster,
.pm-projects-hero__video{

    position:absolute;

    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;

    object-position:center;
}

.pm-projects-hero__poster{

    z-index:1;
}

.pm-projects-hero__video{

    z-index:2;
}

.pm-projects-hero__overlay{

    position:absolute;

    inset:0;

    z-index:3;

    background:rgba(0,0,0,.69);
}

/* ==========================================
                CONTAINER
========================================== */

.pm-projects-hero .pm-container{

    position:relative;

    z-index:10;

    display:flex;
    flex-direction:column;
    justify-content:flex-end;

    width:100%;

    min-height:900px;

    padding-top:140px;
    padding-bottom:72px;
}


/* ==========================================
                TYPOGRAPHY
========================================== */

.pm-projects-hero__title{


    max-width:1002px;

    color:#FFF;

    font-family:Gilroy,sans-serif;

    font-size:64px;

    font-weight:600;

    line-height:72px;

    letter-spacing:-0.02em;
}
.pm-projects-hero__title span{

    display:block;
}

.pm-projects-hero__subtitle{

    max-width:560px;

margin:0;

    color:#FFF;

    font-family:Gilroy,sans-serif;

    font-size:20px;

    font-weight:500;

    line-height:24px;
}

/* ==========================================
                BUTTON
========================================== */

.pm-projects-hero__button{

    display:flex;

    align-items:center;

    justify-content:center;

    width:252px;
    height:56px;

    margin-top:0;

    padding:0 24px;

    border:none;

    border-radius:12px;

    background:#7086FC;

    color:#FFF;

    font-family:Gilroy,sans-serif;

    font-size:18px;

    font-weight:600;

    line-height:22px;

    cursor:pointer;

    transition:.25s;
}

.pm-projects-hero__button:hover{

    background:#5F74F7;
}
/* ==========================================
                HERO TEXT
========================================== */

.pm-projects-hero__content{

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    gap:48px;

    width:100%;

    max-width:1002px;
}

.pm-projects-hero__text{

    display:flex;

    flex-direction:column;

    gap:16px;

    width:100%;
}

.pm-projects-hero__title{

    margin:0;
}

.pm-projects-hero__subtitle{

    margin:0;
}
/* ==========================================
                PROJECTS MAP
========================================== */

.pm-projects-map{
    padding:120px 0;
}

.pm-projects-map__container{
    margin-top:64px;
}

.pm-projects-map__image{
    display:block;
    width:100%;
    height:auto;
}
.pm-projects-map .pm-section-title{

    margin:0;

    max-width:1680px;

    font-family:Gilroy,sans-serif;

    font-size:48px;

    font-weight:600;

    line-height:56px;
}

.pm-projects-map .pm-section-subtitle{

    margin-top:24px;

    max-width:560px;

    font-family:Gilroy,sans-serif;

    font-size:20px;

    font-weight:400;

    line-height:150%;
}
/* ==========================================
            HERO 1280
========================================== */

@media (max-width:1599px){

    .pm-projects-hero{

        min-height:700px;
    }

    .pm-projects-hero .pm-container{

        min-height:700px;

        padding-top:120px;
        padding-bottom:60px;
    }

    .pm-projects-hero__content{

        max-width:100%;
    }

    .pm-projects-hero__title{

        max-width:100%;

        font-size:48px;

        line-height:56px;
    }

    .pm-projects-hero__subtitle{

        max-width:100%;

margin:0;
    }

    .pm-projects-hero__button{

        margin-top:0;
    }
.pm-br-desktop,
.pm-br-mobile{

    display:none;
}
    .pm-projects-map{
        padding:60px 0;
    }

    .pm-projects-map__container{
        margin-top:48px;
    }
.pm-projects-map .pm-section-title{

    font-size:32px;
    line-height:38px;
    font-weight:600;
}
.pm-projects-map .pm-section-subtitle{

    margin-top:20px;

    font-size:18px;
}
}

/* ==========================================
            HERO 768
========================================== */

@media (max-width:991px){

    .pm-projects-hero{

        min-height:700px;
    }

    .pm-projects-hero .pm-container{

        min-height:700px;

        padding-top:104px;
        padding-bottom:24px;
    }

    .pm-projects-hero__content{

        max-width:100%;
    }

    .pm-projects-hero__title{

        max-width:100%;

        font-size:32px;

        line-height:38px;
    }

    .pm-projects-hero__subtitle{

        max-width:100%;

        margin:0;

        font-size:16px;

        line-height:20px;
    }

    .pm-projects-hero__button{

        width:100%;

        margin-top:0;

        font-size:18px;

        line-height:22px;
    }
.pm-br-desktop,
.pm-br-mobile{

    display:none;
}
.pm-projects-map{
    padding:56px 16px 32px;
}

.pm-projects-map__container{
    margin-top:32px;
}
.pm-projects-map .pm-section-title{
    font-size:24px;
    line-height:30px;
    font-weight:600;
}
.pm-projects-map .pm-section-subtitle{

    margin-top:16px;

    font-size:16px;
}
.pm-projects-hero__title{
    font-size:32px !important;
    line-height:38px !important;
}
.pm-projects-map__container{
    overflow:hidden;
}

.pm-projects-map__image{
    position: relative;
    left: -60px;

    display: block;
    width: 1200px;
    max-width: none;
    height: auto;
}
.pm-projects-map__container{
    overflow-x:auto;
    overflow-y:hidden;

    -webkit-overflow-scrolling:touch;

    scrollbar-width:none;
    -ms-overflow-style:none;
}

.pm-projects-map__container::-webkit-scrollbar{
    display:none;
}

.pm-projects-map__image{
    display:block;
    width:1200px;
    max-width:none;
    height:auto;
}
}

/* ==========================================
            HERO 375
========================================== */

@media (max-width:767px){
    .pm-br-desktop{
        display:none;
    }

    .pm-br-mobile{
        display:block;
    }
    .pm-projects-hero{

        min-height:700px;
    }
    .pm-projects-hero__title span{

        white-space:nowrap;
    }
    .pm-projects-hero .pm-container{

        min-height:700px;

        padding-top:104px;
        padding-bottom:24px;
    }

    .pm-projects-hero__content{

        max-width:100%;
    }

    .pm-projects-hero__title{

        max-width:343px;

        font-size:32px;

        line-height:38px;

        letter-spacing:-0.02em;
margin:0;
    }

    .pm-projects-hero__subtitle{

        max-width:343px;
margin:0;
        font-size:14px;

        line-height:18px;
    }

    .pm-projects-hero__button{

        width:100%;

        height:56px;

        margin-top:0;

        font-size:16px;

        line-height:20px;
    }
    .pm-projects-hero__content{

        gap:32px;
    }

    .pm-projects-hero__text{

        gap:12px;
    }
.pm-projects-map{
    padding:32px 0px 28px;
}

.pm-projects-map__container{
    margin-top:32px;
}
.pm-projects-map__container{
    margin-top:32px;
    overflow:hidden;
}

.pm-projects-map__image{
    display:block;

    width:900px;      /* потом можно подобрать 850–1000 */
    max-width:none;
    height:auto;

    position:relative;
    left:-60px;      /* подобрать по макету */
}

.pm-projects-map .pm-section-title{
    font-size:24px;
    line-height:30px;
    font-weight:600;
}
.pm-projects-map .pm-section-subtitle{

    margin-top:16px;

    font-size:16px;

    line-height:150%;
}
.pm-projects-map__container{
    overflow-x:auto;
    overflow-y:hidden;

    -webkit-overflow-scrolling:touch;

    scrollbar-width:none;
    -ms-overflow-style:none;
}

.pm-projects-map__container::-webkit-scrollbar{
    display:none;
}

.pm-projects-map__image{
    display:block;
    width:900px; /* подбери под макет */
    max-width:none;
    height:auto;
}
.pm-breadcrumbs{
    display:flex;
    align-items:center;
    flex-wrap:nowrap;
    overflow:hidden;
}

.pm-breadcrumbs svg{
    flex-shrink:0;
}

.pm-breadcrumbs__link{
    flex-shrink:0;
    white-space:nowrap;
}

.pm-breadcrumbs__current{
    min-width:0;

    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}
}
/* ==========================================
                HERO FINISH
========================================== */

.pm-projects-hero__title,
.pm-projects-hero__subtitle{

    position:relative;

    z-index:5;

    text-wrap:balance;
}

.pm-projects-hero__button{

    position:relative;

    z-index:5;

    flex-shrink:0;

    white-space:nowrap;

    -webkit-tap-highlight-color:transparent;
}

.pm-projects-hero__button:focus{

    outline:none;
}

.pm-projects-hero__button:active{

    transform:translateY(1px);
}

/* ==========================================
                VIDEO
========================================== */

.pm-projects-hero__poster,
.pm-projects-hero__video{

    transform:translateZ(0);

    backface-visibility:hidden;

    -webkit-backface-visibility:hidden;

    will-change:transform;
}

/* ==========================================
                IMAGE
========================================== */

.pm-projects-hero__poster{

    transition:opacity .35s ease;
}

.pm-projects-hero__video{

    transition:opacity .35s ease;
}

/* ==========================================
                OVERLAY
========================================== */

.pm-projects-hero__overlay{

    pointer-events:none;
}

/* ==========================================
                MOBILE VIDEO
========================================== */

@media (max-width:767px){

    .pm-projects-hero__video{

        display:none;
    }

    .pm-projects-hero__poster{

        display:block;
    }

}

/* ==========================================
                LARGE DESKTOP
========================================== */

@media (min-width:1921px){

    .pm-projects-hero__content{

        max-width:1100px;
    }

}

/* ==========================================
                ULTRAWIDE
========================================== */

@media (min-width:2200px){

    .pm-projects-hero{

        min-height:980px;
    }

    .pm-projects-hero .pm-container{

        min-height:980px;
    }

}
/* ==========================================
                BREADCRUMBS
========================================== */

.pm-breadcrumbs-section{
    position:relative;
    z-index:20;

    margin-top:0px;
    margin-bottom:350px; 
}

.pm-breadcrumbs{
    display:flex;
    align-items:center;
    gap:8px;
}

.pm-breadcrumbs svg{
    flex-shrink:0;
}

.pm-breadcrumbs__link{
    color:rgba(255,255,255,.72);
    font-family:Gilroy,sans-serif;
    font-size:16px;
    font-weight:500;
    line-height:24px;
    text-decoration:none;
    transition:.3s;
}

.pm-breadcrumbs__link:hover{
    color:#fff;
}

.pm-breadcrumbs__current{
    color:#fff;
    font-family:Gilroy,sans-serif;
    font-size:16px;
    font-weight:500;
    line-height:24px;
}

@media (max-width:1599px){
    .pm-breadcrumbs-section{
    margin-bottom:350px; 
    }
}

@media (max-width:991px){
    .pm-breadcrumbs-section{
        margin-bottom:350px;
    }
}

@media (max-width:767px){

    .pm-breadcrumbs-section{
        margin-bottom:350px;
    }

    .pm-breadcrumbs__link,
    .pm-breadcrumbs__current{
        font-size:14px;
        line-height:20px;
    }
}