/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: Jul 16 2026 | 15:44:15 */
/* TABLET E MOBILE */

@media (max-width: 1024px){

  .lettura{
    display:block !important;
  }

  .specimen{
    position:sticky !important;
    top:0 !important;
    width:100% !important;
    height:48vh !important;
    min-height:280px !important;
    border-right:none !important;
    border-bottom:1px solid rgba(255,255,255,.15) !important;
    z-index:2 !important;
  }

  .steps{
    width:100% !important;
  }

  .steps .step{
    min-height:72vh !important;
    padding:60px 28px !important;
  }

  .specimen .ov{
    left:24px !important;
    bottom:24px !important;
  }

  .specimen .ov #snum{
    font-size:58px !important;
  }

  .specimen .ov #sname{
    font-size:22px !important;
  }
}

/* TELEFONI PICCOLI */
@media (max-width: 480px){

  .specimen{
    height:42vh !important;
    min-height:240px !important;
  }

  .steps .step{
    min-height:68vh !important;
    padding:46px 22px !important;
  }

  .specimen .ov{
    left:20px !important;
    bottom:20px !important;
  }

  .specimen .ov #snum{
    font-size:48px !important;
  }

  .specimen .ov #sname{
    font-size:19px !important;
  }
}

/*----------------*/


.lettura{
  display:grid;
  grid-template-columns:1fr 1fr;
  position:relative;
}

.specimen{
  position:sticky;
  top:0;
  height:100vh;
  overflow:hidden;
  border-right:1px solid rgba(255,255,255,.15);
}

.specimen .frag{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .25s ease;
}

.specimen .frag.active{
  opacity:1;
}

.specimen .frag,
.specimen .frag .elementor-widget-container,
.specimen .frag img{
  width:100%;
  height:100%;
}

.specimen .frag img{
  object-fit:cover;
}

.steps{
  display:flex;
  flex-direction:column;
}

.step{
  min-height:96vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:80px clamp(40px,6vw,90px);
  border-bottom:1px solid rgba(255,255,255,.15);
  /*-----------*/
  height:40vh !important;
}

@media(max-width:880px){
  .lettura{
    grid-template-columns:1fr;
  }

  .specimen{
    top:60px;
    height:50vh;
    border-right:none;
    border-bottom:1px solid rgba(255,255,255,.15);
  }

  .step{
    min-height:auto;
    padding:54px 30px;
  /*-----------*/
  height:40vh !important;
  }
}






.specimen{
  background:#000;
}

.specimen .frag{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition:opacity .65s ease, visibility 0s linear .65s;
}

.specimen .frag.active{
  opacity:1;
  visibility:visible;
  transition:opacity .65s ease;
}





.specimen .ov{
  position:absolute;
  left:40px;
  bottom:40px;
  z-index:10;
  color:#fff;
  pointer-events:none;
}

.specimen .ov #snum{
  font-size:clamp(56px,8vw,110px);
  line-height:1;
  font-weight:300;
}

.specimen .ov #sname{
  margin-top:8px;
  font-size:clamp(20px,2.4vw,30px);
  line-height:1.15;
}