@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Outfit:wght@100..900&display=swap');


:root {
    --inter:"Inter", serif;
    --outfit:"Outfit", serif;
    --primary:#0F1A1E;
    --secondary:#1F363C;
    --light:#878F57;
    --textwhite:#F6F8EB;
    --landing-width:70vw;
    --landing-width-mobile:86vw;
    --d16:0.89vw;
    --d18:0.94vw;
    --d20:1.04vw;
    --d24:1.25vw;
    --d25:1.3vw;
    --d48:2.5vw;
    --d64:3.33vw;
    --d80:4.17vw;
    --d120:6.25vw;


    --m10:2.78vw;
    --m11:3.06vw;
    --m12:3.33vw;
    --m13:3.61vw;
    --m14:3.89vw;
    --m15:4.17vw;
    --m16:4.44vw;
    --m18:5vw;
    --m20:5.56vw;
    --m24:6.67vw;
    --m25:6.94vw;
    --m32:8.89vw;
    --m36:10vw;
    --m40:11.11vw;
    --m48:13.33vw;
    --m64:17.78vw;

    
 





   

}


body{
    background-color: var(--primary);
}

.kontakt-home{
    margin-bottom: 6.25vw;
}

.stanovi-main{
    width: 100vw;
    background-color:#F6F8EB ;
    padding-bottom: 5.68vw;
}

.stan-picker{
    width: var(--landing-width);
    display: flex;
    justify-content: space-between;
    margin: auto;
   padding-top: var(--d120);
   padding-bottom: var(--d64);
}
.stan-picker a{
    text-decoration: none;
    font-family: var(--outfit);
font-weight: 400;
font-size: var(--d24);
line-height: 110%;
width:17.45vw ;
color: #1F363C;
text-align: center;


}

.stan-picker a.active{

    padding-bottom: var(--d18);

}
.stan-picker a {
    position: relative;
    text-decoration: none; /* ukloni default underline */
}

.stan-picker a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%) scaleX(0);
    transform-origin: center;
    width: 100%;
    height: 3px;
    background-color: #878F57;
    transition: transform 0.4s ease;
}

.stan-picker a.active::after {
    transform: translateX(-50%) scaleX(1);
}


.stan-galerija{
    width: var(--landing-width);
    margin: auto;
}

.stan-galerija .slider-for img,.stan-galerija .slider-for3 img,.stan-galerija .slider-for2 img{
    width: var(--landing-width)!important;
    height:34.53vw ;
      object-fit: cover;       /* ispunjava okvir bez deformacije */
  object-position: center; /* centrira sliku u okviru */

}
.stan-galerija .slider-nav img,.stan-galerija .slider-nav2 img,.stan-galerija .slider-nav3 img{
    width: 16.67vw!important;
    height:9.17vw;
      object-fit: cover;       /* ispunjava okvir bez deformacije */
  object-position: center; /* centrira sliku u okviru */
   

}
.slider-for,.slider-for2,.slider-for3{
    margin-bottom: var(--d20);
}

.slider-nav,.slider-nav2, .slider-nav3{
    height:9.17vw;
}
.slider-nav .slick-slide,.slider-nav2 .slick-slide,.slider-nav3 .slick-slide {
  margin-right: 1vw; /* ili koliko želiš razmaka */
}

.slider-nav .slick-list .slick-track,.slider-nav2 .slick-list .slick-track,.slider-nav3 .slick-list .slick-track{
    min-width: 180vw;
}







.stan-tekst{
    display: flex;
    width: var(--landing-width);
    margin: auto;
    margin-top: 5.68vw;
    justify-content: space-between;
}
.st-left h1{
    font-family: var(--outfit);
font-weight: 700;
font-size: var(--d48);
line-height: 110%;
letter-spacing: 0%;
color:#1F363C;
margin-top:0;

}

.st-left p{
    font-family: var(--inter);
font-weight: 400;
font-size: var(--d18);
line-height: 140%;
letter-spacing: 0%;
color: #4f4f4f;
width: 28.39vw;


}

.st-right img{
    width: 34.43vw;
    margin-top:4.5vw;
}




  @media screen and (max-width:900px){
    .stanovi-main{
        
        
        padding-bottom: var(--m64);
    }
    .stan-galerija{
        width: var(--landing-width-mobile);
    }
    .stan-picker{
        width: var(--landing-width-mobile);
        flex-wrap: wrap;
        
        
    }
    .stan-picker a{
        width: 40.56vw;
        font-size:var(--m16) ;
        font-weight: 300;
        margin-bottom: var(--m25);
         
     
    }
    .stan-picker a.active{
        font-weight: 400;
        
         padding-bottom:1.67vw ;
    }

    .stan-galerija .slider-for img, .stan-galerija .slider-for3 img, .stan-galerija .slider-for2 img {
    width: var(--landing-width-mobile) !important;
    height: 61.11vw;
    object-fit: cover;
    object-position: center;
    border-radius: var(--m12);
}

.slider-for .slick-list .slick-track,.slider-for2 .slick-list .slick-track,.slider-for3 .slick-list .slick-track{
    min-width: 5000px;
}


.stan-galerija .slider-nav img,.stan-galerija .slider-nav2 img,.stan-galerija .slider-nav3 img{
    width: 41.94vw!important;
    height:23.33vw;
      object-fit: cover;       /* ispunjava okvir bez deformacije */
  object-position: center; /* centrira sliku u okviru */
  border-radius: var(--m12);
   

}
.slider-for,.slider-for2,.slider-for3{
    margin-bottom: var(--d20);
}

.slider-nav,.slider-nav2, .slider-nav3{
    height:23.33vw;
    margin-top: var(--m10);
}
.slider-nav .slick-slide,.slider-nav2 .slick-slide,.slider-nav3 .slick-slide {
  margin-right: 1vw; /* ili koliko želiš razmaka */
}

.slider-nav .slick-list .slick-track,.slider-nav2 .slick-list .slick-track,.slider-nav3 .slick-list .slick-track{
    min-width: 5000px;
}



.stan-tekst{
    display: block;
    width: var(--landing-width-mobile);

}
.st-left h1{
    width: var(--landing-width-mobile);
    text-align: left;
    font-size: var(--m32);
    margin-top: var(--m20);
}
.st-left p{
    font-size:var(--m15) ;
    width: var(--landing-width-mobile);
}
.st-right img{
    width: var(--landing-width-mobile);
    margin-top: var(--m48);
}





   








    

    
  }

 @media (orientation: landscape) and (max-width:1104px) {
    
        .stanovi-main{
            
            padding-bottom:8.00vw!important;
        
            
        
    }
    .hamburger-mob {
        width:3.25vw!important;
    }
    .stan-picker{
        padding-top:5.50vw!important;
             padding-bottom:4.250vw!important;
        
    
    }
 }