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

.nv-container.desktop-version{ 
  display:flex; 
  align-items:flex-start; 
  min-height: 1000px; 
  position:relative;
  flex-wrap: wrap;              
}

.nv-header{
  width:100%;                 
  padding: 40px 40px 0 45px;                
  margin:0;                    
}


.nv-heading{ margin:0 0 30px 0; text-transform:uppercase; }


.nv-container.desktop-version{
  display:flex;
  align-items:flex-start;
  min-height: 1000px;
  position:relative;
}

.nv-left{
  flex: 1.4;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding-top: 0;
  margin-bottom: 200px;
}


.nv-heading{
  margin:0 0 30px 0;
  font-family: Inconsolata;
  font-weight: 400;
  font-size: clamp(18px, calc(18px + (30 - 18) * ((100vw - 480px) / (1400 - 480))), 30px);
  text-transform: uppercase;
  line-height: 1.1;
}

.nv-subtitle{font-size: clamp(18px, calc(18px + (30 - 18) * ((100vw - 480px) / (1400 - 480))), 30px);line-height: 40px;letter-spacing: 4.61px;text-transform: uppercase;color: black;}


.nv-circles{
  position:relative;
  width:520px;   
  height:520px;
  margin-top: 120px;
}

.nv-circle{
  position:absolute;
  width:320px;
  height:320px;
  border-radius:50%;
  background: transparent;
  border:2px solid #fff;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  text-transform:uppercase;
  padding:20px;
  cursor:pointer;
  transition:background-color .3s ease, color .3s ease;
}
.nv-circle .nv-circle-deco{ position:absolute; inset:0; border-radius:50%; }
.nv-circle .nv-circle-text{position:relative;z-index:2;line-height: 1.3;font-size: 20.32px;letter-spacing: 0px;text-transform: uppercase;}

.nv-circle:hover,
.nv-circle.active{background: black;color: white;}


.nv-circle-1{top: -60px;left: 60px;}
.nv-circle-2{top: -60px;right: -160px;}
.nv-circle-3{bottom: -60px;left: 60px;}
.nv-circle-4{bottom: -60px;right: -160px;}
.nv-circle-5{
  top:50%;
  left: 70%;
  transform:translate(-50%,-50%);
  z-index:3;
  background-color: #D9D9D9;
}

/* Divisore e colonna destra 
.nv-divider{ width:2px; height:950px; background:#fff; margin:0 20px; }
*/
.nv-right{
  flex:1;
  padding: 0;
  min-height:610px;
  display:flex;
  align-items:center;
}


.nv-content{ display:none; opacity:0; }
.nv-content.show{ display:block; animation:nv-fade-in .2s ease forwards; }

@keyframes nv-fade-in { from{opacity:0;} to{opacity:1;} }

.nv-mini{
  display:flex;
  align-items:baseline;
  gap:8px;
  color:#000;
}

.nv-prefix{font-size: clamp(23px, calc(23px + (30 - 23) * ((100vw - 480px) / (1400 - 480))), 30px);line-height: 1.1;letter-spacing: 0px;text-transform: uppercase;}
.nv-title{font-size: clamp(23px, calc(23px + (30 - 23) * ((100vw - 480px) / (1400 - 480))), 30px);line-height: 35px;letter-spacing: 0px;text-transform: uppercase;}

.nv-text{font-size: clamp(23px, calc(23px + (30 - 23) * ((100vw - 480px) / (1400 - 480))), 30px);line-height: 35px;letter-spacing: 0px;text-transform: uppercase;margin-left: 23px;color: black;}

/* ============ MOBILE ============ */
.nv-container.mobile-version{ display:none; }

.nv-card{
  background:#EDEDED;
  padding: 25px 30px 25px;
  border-top: 1px solid black;
}

.nv-mini--mobile{ margin-bottom:6px; }
.nv-text--mobile{
  margin-left:24px;
  color:#B6B6B6;
}

@media (max-width:1024px){
  .nv-container.desktop-version{ display:none; }
  .nv-container.mobile-version{ display:block; }

  .nv-heading{
    margin:0;
    padding:80px 30px 20px;
    background:#EDEDED;
    text-transform:uppercase;
    /* font-size: 24px; */
  }

  .nv-subtitle{
    padding: 0 30px 50px;
    margin:0;
    background:#EDEDED;
    /* font-size: 24px; */
    line-height: 1.4;
  }
  .nv-title, .nv-text--mobile {
    /* font-size:28px; */
    line-height: 1.1;
  }
}
