/* ==================================================

   AETOS INGEGNERIA

   STYLE GENERALE RESPONSIVE

   Desktop + Notebook + Tablet + Smartphone

================================================== */



:root{

  --navy:#061831;

  --blue:#075f8f;

  --blue-hover:#0b78b2;

  --light-blue:#8fd3ff;



  --text:#1f2937;

  --text-soft:#5b667a;



  --light:#f4f7fb;

  --white:#ffffff;



  --header-height:104px;



  --page-padding:8%;

}





/* ==================================================

   RESET

================================================== */



*{

  margin:0;

  padding:0;

  box-sizing:border-box;

}





html{

  scroll-behavior:smooth;

  -webkit-text-size-adjust:100%;

}





body{

  width:100%;

  min-width:0;



  font-family:Arial, Helvetica, sans-serif;



  color:var(--text);



  line-height:1.7;



  background:#ffffff;



  overflow-x:hidden;

}





img{

  display:block;



  max-width:100%;

}





a{

  -webkit-tap-highlight-color:transparent;

}





/* ==================================================

   ANCORE CON HEADER FISSO

================================================== */



#home,

#profilo,

#servizi,

#progetti,

#contatti,

#progetto,

#galleria{

  scroll-margin-top:125px;

}





/* ==================================================

   HEADER GENERALE

================================================== */



.header{

  position:fixed;



  top:0;

  left:0;

  right:0;



  z-index:5000;



  width:100%;

  min-height:var(--header-height);



  display:flex;



  align-items:center;

  justify-content:space-between;



  gap:25px;



  padding:12px 4% 12px 2%;



  background:rgba(6,24,49,.95);



  backdrop-filter:blur(10px);

  -webkit-backdrop-filter:blur(10px);



  box-shadow:0 5px 24px rgba(0,0,0,.22);

}





/* ==================================================

   LOGO

================================================== */



.logo{

  display:flex;



  align-items:center;



  gap:14px;



  min-width:0;



  flex-shrink:0;



  color:#ffffff;



  text-decoration:none;

}





.logo-image-box{

  display:flex;



  align-items:center;

  justify-content:center;



  flex-shrink:0;



  padding:5px 9px;



  background:rgba(225,241,251,.90);



  border:1px solid rgba(255,255,255,.42);

  border-radius:9px;



  box-shadow:0 4px 16px rgba(0,0,0,.16);

}





.logo-symbol{

  display:block;



  width:120px;

  height:auto;



  object-fit:contain;

}





.logo-text{

  display:flex;



  align-items:baseline;



  gap:9px;



  min-width:0;



  line-height:1;



  white-space:nowrap;

}





.logo-name{

  color:#ffffff;



  font-size:27px;

  font-weight:900;



  letter-spacing:1.4px;



  text-shadow:0 2px 8px rgba(0,0,0,.42);

}





.logo-sector{

  color:var(--light-blue);



  font-size:21px;

  font-weight:800;



  letter-spacing:1.8px;



  text-shadow:0 2px 8px rgba(0,0,0,.40);

}





/* ==================================================

   MENU

================================================== */



.main-nav{

  display:flex;



  align-items:center;

  justify-content:flex-end;



  gap:27px;



  min-width:0;

}





.main-nav a{

  position:relative;



  color:#ffffff;



  text-decoration:none;



  font-size:16px;

  font-weight:700;



  white-space:nowrap;



  transition:color .25s ease;

}





.main-nav a::after{

  content:"";



  position:absolute;



  left:0;

  bottom:-7px;



  width:0;

  height:2px;



  background:var(--light-blue);



  transition:width .25s ease;

}





.main-nav a:hover{

  color:var(--light-blue);

}





.main-nav a:hover::after{

  width:100%;

}





/* Eventuale pulsante menu delle pagine che lo usano */



.menu-button{

  display:none;



  flex-shrink:0;



  border:0;



  background:transparent;



  color:#ffffff;



  font-size:30px;



  cursor:pointer;

}





/* ==================================================

   HOME HERO

================================================== */



.hero{

  position:relative;



  width:100%;



  min-height:100vh;

  min-height:100svh;



  display:flex;



  align-items:center;

  justify-content:center;



  padding:

    calc(var(--header-height) + 40px)

    var(--page-padding)

    60px;



  text-align:center;



  color:#ffffff;

}





.hero-slideshow{

  position:relative;



  overflow:hidden;



  background:var(--navy);

}





.hero-slide{

  position:absolute;



  inset:0;



  z-index:0;



  background-size:cover;

  background-position:center;

  background-repeat:no-repeat;



  opacity:0;



  transform:scale(1.08);



  transition:

    opacity 1.8s ease,

    transform 8s ease;

}





.hero-slide.active{

  opacity:1;



  transform:scale(1);

}





.hero-overlay{

  position:absolute;



  inset:0;



  z-index:1;



  background:linear-gradient(

    rgba(6,24,49,.30),

    rgba(6,24,49,.76)

  );

}





.hero-content{

  position:relative;



  z-index:2;



  width:100%;

  max-width:1050px;



  margin:0 auto;

}





.label{

  margin-bottom:18px !important;



  color:var(--light-blue) !important;



  text-transform:uppercase;



  letter-spacing:4px;



  font-size:13px !important;

  font-weight:900;

}





.hero h1{

  margin-bottom:28px;



  font-size:clamp(46px,5.2vw,70px);



  line-height:1.05;

}





.hero p{

  max-width:900px;



  margin:0 auto 35px;



  font-size:clamp(18px,1.6vw,22px);

}





/* ==================================================

   PULSANTI

================================================== */



.hero-buttons,

.project-hero-buttons{

  display:flex;



  align-items:center;

  justify-content:center;



  flex-wrap:wrap;



  gap:18px;



  margin-top:35px;

}





.project-hero-buttons{

  justify-content:flex-start;

}





.btn{

  display:inline-block;



  min-width:190px;



  padding:16px 34px;



  background:var(--blue);

  color:#ffffff;



  border:2px solid var(--blue);

  border-radius:8px;



  text-align:center;

  text-decoration:none;



  font-weight:800;



  box-shadow:0 8px 24px rgba(7,95,143,.35);



  transition:

    background .35s ease,

    border-color .35s ease,

    color .35s ease,

    transform .35s ease,

    box-shadow .35s ease;

}





.btn:hover{

  background:var(--blue-hover);



  border-color:var(--blue-hover);



  transform:translateY(-3px);



  box-shadow:0 12px 30px rgba(7,95,143,.45);

}





.secondary-btn{

  background:transparent;



  border-color:var(--light-blue);



  color:#ffffff;



  box-shadow:none;

}





.secondary-btn:hover{

  background:var(--light-blue);



  border-color:var(--light-blue);



  color:var(--navy);



  box-shadow:0 10px 28px rgba(143,211,255,.30);

}





/* ==================================================

   NUMERI HOME

================================================== */



.numbers{

  display:grid;



  grid-template-columns:repeat(4,minmax(0,1fr));



  gap:20px;



  padding:40px var(--page-padding);



  background:var(--light);

}





.numbers div,

.numbers article{

  min-width:0;



  padding:35px;



  background:#ffffff;



  border-radius:14px;



  text-align:center;



  box-shadow:0 12px 35px rgba(0,0,0,.08);



  transition:

    transform .35s ease,

    box-shadow .35s ease;

}





.numbers div:hover,

.numbers article:hover{

  transform:translateY(-7px);



  box-shadow:0 18px 40px rgba(0,0,0,.14);

}





.numbers strong{

  display:block;



  color:var(--blue);



  font-size:clamp(30px,3vw,42px);

}





.numbers span{

  color:var(--text-soft);

}





/* ==================================================

   SEZIONI HOME

================================================== */



.section{

  padding:95px var(--page-padding);

}





.section h2{

  margin-bottom:25px;



  color:var(--navy);



  font-size:clamp(36px,3.4vw,44px);



  line-height:1.15;

}





.section p{

  max-width:1000px;



  margin-bottom:15px;



  color:var(--text-soft);



  font-size:18px;

}





.dark{

  background:var(--navy);



  color:#ffffff;

}





.dark h2{

  color:#ffffff;

}





.dark p{

  color:#d8e3ef;

}





/* ==================================================

   SERVIZI

================================================== */



.grid{

  display:grid;



  grid-template-columns:repeat(3,minmax(0,1fr));



  gap:28px;



  margin-top:35px;

}





.card{

  min-width:0;



  padding:32px;



  background:rgba(255,255,255,.08);



  border:1px solid rgba(255,255,255,.15);

  border-radius:14px;



  transition:

    transform .35s ease,

    background .35s ease,

    box-shadow .35s ease;

}





.card:hover{

  transform:translateY(-10px);



  background:rgba(255,255,255,.12);



  box-shadow:0 18px 35px rgba(0,0,0,.30);

}





.card h3{

  margin-bottom:12px;



  color:var(--light-blue);



  font-size:24px;

}





.card:hover h3{

  color:#ffffff;

}





/* ==================================================

   PORTFOLIO HOME

================================================== */



.projects{

  display:grid;



  grid-template-columns:repeat(3,minmax(0,1fr));



  gap:20px;



  margin-top:35px;

}





.project{

  min-width:0;



  padding:25px;



  background:var(--light);



  border-left:5px solid var(--blue);

  border-radius:8px;



  font-weight:800;



  transition:

    transform .35s ease,

    background .35s ease,

    box-shadow .35s ease;

}





.project:hover{

  transform:translateY(-8px);



  background:#ffffff;



  box-shadow:0 15px 35px rgba(0,0,0,.15);

}





.project a,

.project a:visited{

  display:block;



  color:var(--blue);



  text-decoration:none;



  font-weight:800;



  overflow-wrap:anywhere;

}





.project a:hover{

  color:var(--blue-hover);

}





/* ==================================================

   CONTATTI

================================================== */



#contatti{

  background:#ffffff;

}





.contact-layout{

  display:grid;



  grid-template-columns:.9fr 1.25fr;



  gap:45px;



  align-items:start;



  margin-top:35px;

}





.contact-info{

  min-width:0;

}





.contact-info p{

  margin-bottom:20px;



  color:var(--text-soft);



  font-size:18px;



  overflow-wrap:anywhere;

}





.contact-info strong{

  color:#364156;



  font-size:20px;

}





.contact-info a,

.contact-info a:visited{

  color:var(--blue);



  text-decoration:none;



  font-weight:700;



  overflow-wrap:anywhere;

}





.contact-info iframe{

  display:block;



  width:100%;

  height:290px;



  margin-top:30px;



  border:0;

  border-radius:14px;



  box-shadow:0 8px 24px rgba(0,0,0,.10);

}





.contact-photo{

  min-width:0;

}





.contact-photo img{

  display:block;



  width:100%;

  height:510px;



  object-fit:cover;

  object-position:center;



  border-radius:16px;



  box-shadow:0 10px 30px rgba(0,0,0,.13);

}





/* ==================================================

   FOOTER

================================================== */



footer{

  padding:40px var(--page-padding);



  background:#111111;



  color:#ffffff;



  text-align:center;

}





/* ==================================================

   PAGINE PROGETTO

================================================== */



.project-detail{

  background:#ffffff;



  padding-top:var(--header-height);

}





.project-hero{

  position:relative;



  min-height:78vh;



  display:flex;



  align-items:flex-end;



  overflow:hidden;



  padding:150px var(--page-padding) 80px;



  color:#ffffff;



  background-position:center;

  background-size:cover;

  background-repeat:no-repeat;

}





.project-hero::after{

  content:"";



  position:absolute;



  inset:0;



  z-index:1;



  background:linear-gradient(

    rgba(6,24,49,.25),

    rgba(6,24,49,.90)

  );

}





.project-hero-content{

  position:relative;



  z-index:2;



  width:100%;



  max-width:1050px;

}





.project-hero h1{

  margin-bottom:24px;



  font-size:clamp(46px,5vw,64px);



  line-height:1.05;

}





.project-hero p:last-of-type{

  max-width:850px;



  color:#e1eaf4;



  font-size:clamp(18px,1.6vw,21px);

}





/* ==================================================

   DATI PROGETTO

================================================== */



.project-info{

  display:grid;



  grid-template-columns:repeat(4,minmax(0,1fr));



  gap:1px;



  background:#dce3eb;

}





.project-info div{

  min-width:0;



  padding:30px var(--page-padding);



  background:var(--light);

}





.project-info span{

  display:block;



  margin-bottom:8px;



  color:#68758a;



  font-size:13px;



  text-transform:uppercase;



  letter-spacing:2px;

}





.project-info strong{

  display:block;



  color:var(--navy);



  font-size:18px;



  overflow-wrap:anywhere;

}





/* ==================================================

   SEZIONI PROGETTO

================================================== */



.project-section{

  padding:90px var(--page-padding);

}





.project-section h2{

  margin-bottom:28px;



  color:var(--navy);



  font-size:clamp(35px,3.5vw,44px);



  line-height:1.15;

}





.project-section > p{

  max-width:1050px;



  margin-bottom:18px;



  color:var(--text-soft);



  font-size:18px;

}





.project-dark{

  background:var(--navy);



  color:#ffffff;

}





.project-dark h2{

  color:#ffffff;

}





.project-dark p{

  color:#d8e3ef;

}





/* ==================================================

   COLONNE TECNICHE

================================================== */



.project-columns{

  display:grid;



  grid-template-columns:repeat(2,minmax(0,1fr));



  gap:25px;



  margin-top:40px;

}





.project-columns div,

.project-columns article{

  min-width:0;



  padding:28px;



  background:rgba(255,255,255,.07);



  border:1px solid rgba(255,255,255,.16);

  border-radius:12px;

}





.project-columns h3{

  margin-bottom:12px;



  color:var(--light-blue);



  font-size:23px;

}





/* ==================================================

   ALTRE GRIGLIE UTILIZZATE NEI PROGETTI

================================================== */



.technical-grid,

.system-grid,

.analysis,

.activities,

.structure-diagram,

.isolation-grid,

.materials-grid,

.totem-types{

  min-width:0;

}





.technical-grid,

.system-grid,

.isolation-grid,

.materials-grid,

.totem-types{

  display:grid;



  grid-template-columns:repeat(2,minmax(0,1fr));



  gap:24px;



  margin-top:38px;

}





/* ==================================================

   GALLERIE

================================================== */



.project-gallery,

.gallery,

.model-grid{

  display:grid;



  grid-template-columns:repeat(2,minmax(0,1fr));



  gap:25px;



  margin-top:35px;

}





.project-gallery figure,

.gallery figure,

.model-grid figure{

  min-width:0;



  margin:0;



  overflow:hidden;



  background:var(--light);



  border-radius:14px;



  box-shadow:0 12px 35px rgba(0,0,0,.09);

}





.project-gallery img,

.gallery img,

.model-grid img{

  display:block;



  width:100%;

  height:390px;



  object-fit:contain;

  object-position:center;



  background:#ffffff;



  cursor:zoom-in;



  transition:transform .35s ease;

}





.project-gallery img:hover,

.gallery img:hover,

.model-grid img:hover{

  transform:scale(1.018);

}





.project-gallery figcaption,

.gallery figcaption,

.model-grid figcaption{

  padding:18px;



  color:#364156;



  font-weight:700;

}





.project-gallery .large,

.gallery .large{

  grid-column:1 / -1;

}





.project-gallery .large img,

.gallery .large img{

  height:520px;

}





/* ==================================================

   IMMAGINI TECNICHE

   FEM, TAVOLE, DISEGNI

================================================== */



.project-gallery figure.technical-image img,

.gallery figure.technical-image img,

.model-grid figure.technical-image img{

  width:100%;



  height:auto !important;



  max-height:none !important;



  object-fit:contain !important;

  object-position:center;



  padding:12px;



  background:#ffffff;

}





/* ==================================================

   FEATURED IMAGE

================================================== */



.featured-image{

  width:100%;



  margin-top:40px;

}





.featured-image img{

  width:100%;

  height:auto;



  object-fit:contain;



  border-radius:14px;

}





/* ==================================================

   VIDEO

================================================== */



.project-video{

  display:block;



  width:100%;

  max-width:1100px;



  margin-top:30px;



  background:#000000;



  border-radius:14px;

}





/* ==================================================

   COPERTINE

================================================== */



.project-cover{

  margin-bottom:40px;

}





.project-cover img{

  display:block;



  width:100%;

  height:550px;



  object-fit:cover;



  border-radius:20px;



  box-shadow:0 15px 40px rgba(0,0,0,.25);

}





/* ==================================================

   TORNA AI LAVORI

================================================== */



.project-back,

.back{

  padding:45px var(--page-padding);



  border-top:1px solid #dce3eb;

}





.project-back a,

.project-back a:visited,

.back a,

.back a:visited{

  color:var(--blue);



  text-decoration:none;



  font-weight:900;

}





/* ==================================================

   PAGINA PROGETTO SEMPLICE

================================================== */



.project-page{

  width:100%;

  max-width:1200px;



  margin:0 auto;



  padding:

    calc(var(--header-height) + 50px)

    var(--page-padding)

    90px;

}





.project-page h1{

  margin-bottom:28px;



  color:var(--navy);



  font-size:clamp(40px,4.5vw,58px);



  line-height:1.1;

}





.project-page h2{

  margin-top:45px;

  margin-bottom:15px;



  color:var(--navy);



  font-size:clamp(30px,3vw,34px);

}





.project-page p{

  margin-bottom:18px;



  color:var(--text-soft);



  font-size:19px;



  line-height:1.8;

}





.project-page ul{

  display:grid;



  grid-template-columns:repeat(2,minmax(0,1fr));



  gap:12px;



  margin:25px 0 40px;



  padding:0;



  list-style:none;

}





.project-page li{

  min-width:0;



  padding:17px 20px;



  background:var(--light);



  border-left:5px solid var(--blue);

  border-radius:6px;



  color:#263044;

}





/* ==================================================

   LIGHTBOX

================================================== */



.lightbox{

  position:fixed;



  inset:0;



  z-index:9000;



  display:none;



  align-items:center;

  justify-content:center;



  padding:35px;



  background:rgba(0,0,0,.94);

}





.lightbox.open{

  display:flex;

}





.lightbox img{

  display:block;



  max-width:95vw;

  max-height:90vh;



  object-fit:contain;

}





.lightbox-close{

  position:absolute;



  top:16px;

  right:28px;



  border:0;



  background:transparent;



  color:#ffffff;



  font-size:46px;



  line-height:1;



  cursor:pointer;

}





/* ==================================================

   ANIMAZIONI

================================================== */



.reveal{

  opacity:0;



  transform:translateY(35px);



  transition:

    opacity .8s ease,

    transform .8s ease;

}





.reveal.visible{

  opacity:1;



  transform:none;

}





/* ==================================================

   NOTEBOOK / TABLET ORIZZONTALE

================================================== */



@media(max-width:1200px){



  :root{

    --page-padding:6%;

  }





  .header{

    padding-left:3%;

    padding-right:3%;



    gap:18px;

  }





  .logo-symbol{

    width:100px;

  }





  .logo-name{

    font-size:22px;

  }





  .logo-sector{

    font-size:17px;

  }





  .main-nav{

    gap:17px;

  }





  .main-nav a{

    font-size:14px;

  }



}





/* ==================================================

   TABLET

================================================== */



@media(max-width:900px){



  :root{

    --page-padding:6%;

    --header-height:148px;

  }





  #home,

  #profilo,

  #servizi,

  #progetti,

  #contatti,

  #progetto,

  #galleria{

    scroll-margin-top:165px;

  }





  .header{

    min-height:var(--header-height);



    flex-direction:column;



    align-items:flex-start;

    justify-content:center;



    gap:9px;



    padding:9px 5% 11px;



    background:rgba(6,24,49,.98);

  }





  .logo{

    gap:10px;

  }





  .logo-image-box{

    padding:4px 7px;

  }





  .logo-symbol{

    width:90px;

  }





  .logo-name{

    font-size:21px;

  }





  .logo-sector{

    font-size:16px;

  }





  .main-nav{

    width:100%;



    justify-content:flex-start;



    flex-wrap:wrap;



    gap:8px 18px;

  }





  .main-nav a{

    font-size:14px;

  }





  .hero{

    padding:

      calc(var(--header-height) + 30px)

      var(--page-padding)

      55px;

  }





  .numbers{

    grid-template-columns:repeat(2,minmax(0,1fr));

  }





  .grid,

  .projects{

    grid-template-columns:repeat(2,minmax(0,1fr));

  }





  .contact-layout{

    grid-template-columns:1fr;

  }





  .contact-info iframe{

    height:320px;

  }





  .contact-photo img{

    height:auto;



    max-height:520px;

  }





  .project-detail{

    padding-top:var(--header-height);

  }





  .project-hero{

    min-height:70vh;



    padding:

      100px

      var(--page-padding)

      60px;

  }





  .project-info{

    grid-template-columns:repeat(2,minmax(0,1fr));

  }





  .project-columns,

  .technical-grid,

  .system-grid,

  .isolation-grid,

  .materials-grid,

  .totem-types{

    grid-template-columns:1fr;

  }





  .project-gallery img,

  .gallery img,

  .model-grid img{

    height:340px;

  }





  .project-gallery .large img,

  .gallery .large img{

    height:460px;

  }



}





/* ==================================================

   SMARTPHONE

================================================== */



@media(max-width:600px){



  :root{

    --page-padding:5%;

    --header-height:155px;

  }





  #home,

  #profilo,

  #servizi,

  #progetti,

  #contatti,

  #progetto,

  #galleria{

    scroll-margin-top:175px;

  }





  .header{

    min-height:var(--header-height);



    padding:8px 4% 10px;



    gap:8px;

  }





  .logo{

    gap:7px;

  }





  .logo-image-box{

    padding:3px 5px;



    border-radius:7px;

  }





  .logo-symbol{

    width:72px;

  }





  .logo-text{

    gap:5px;

  }





  .logo-name{

    font-size:17px;

  }





  .logo-sector{

    font-size:12px;



    letter-spacing:1px;

  }





  .main-nav{

    width:100%;



    justify-content:flex-start;



    gap:6px 13px;

  }





  .main-nav a{

    font-size:12px;

  }





  .hero{

    min-height:100svh;



    padding:

      calc(var(--header-height) + 20px)

      var(--page-padding)

      50px;

  }





  .hero h1{

    font-size:clamp(38px,11vw,44px);

  }





  .hero p{

    font-size:18px;

  }





  .hero-buttons,

  .project-hero-buttons{

    flex-direction:column;



    align-items:stretch;



    width:100%;

  }





  .btn{

    width:100%;



    min-width:0;



    text-align:center;

  }





  .numbers{

    grid-template-columns:1fr;



    padding:35px var(--page-padding);

  }





  .numbers div,

  .numbers article{

    padding:28px 22px;

  }





  .section{

    padding:70px var(--page-padding);

  }





  .section h2{

    font-size:35px;

  }





  .grid,

  .projects,

  .project-info,

  .project-gallery,

  .gallery,

  .model-grid{

    grid-template-columns:1fr;

  }





  .project-gallery .large,

  .gallery .large{

    grid-column:auto;

  }





  .project-detail{

    padding-top:var(--header-height);

  }





  .project-hero{

    min-height:68vh;



    padding:

      85px

      var(--page-padding)

      55px;

  }





  .project-hero h1{

    font-size:40px;

  }





  .project-section{

    padding:70px var(--page-padding);

  }





  .project-section h2{

    font-size:35px;

  }





  .project-gallery img,

  .gallery img,

  .model-grid img,

  .project-gallery .large img,

  .gallery .large img{

    width:100%;



    height:auto;



    max-height:none;



    object-fit:contain;

  }





  .project-page{

    padding:

      calc(var(--header-height) + 40px)

      var(--page-padding)

      70px;

  }





  .project-page h1{

    font-size:38px;

  }





  .project-page ul{

    grid-template-columns:1fr;

  }





  .project-cover img{

    height:auto;



    max-height:none;

  }





  .contact-info iframe{

    height:280px;

  }





  .contact-photo img{

    width:100%;



    height:auto;

  }





  .lightbox{

    padding:15px;

  }





  .lightbox-close{

    top:10px;

    right:15px;



    font-size:42px;

  }



}





/* ==================================================

   SMARTPHONE MOLTO PICCOLI

================================================== */



@media(max-width:390px){



  :root{

    --header-height:165px;

  }





  .logo-symbol{

    width:62px;

  }





  .logo-name{

    font-size:15px;

  }





  .logo-sector{

    font-size:10px;

  }





  .main-nav{

    gap:5px 10px;

  }





  .main-nav a{

    font-size:11px;

  }





  .hero h1{

    font-size:36px;

  }





  .section h2,

  .project-section h2{

    font-size:31px;

  }



}





/* ==================================================

   TELEFONO ORIZZONTALE

================================================== */



@media(

  max-width:900px

)

and

  (orientation:landscape){



  .hero{

    min-height:700px;

  }





  .project-hero{

    min-height:650px;

  }



}





/* ==================================================

   ACCESSIBILITÀ

   RIDUZIONE ANIMAZIONI

================================================== */



@media(prefers-reduced-motion:reduce){



  html{

    scroll-behavior:auto;

  }





  *,

  *::before,

  *::after{

    scroll-behavior:auto !important;



    animation-duration:.01ms !important;

    animation-iteration-count:1 !important;



    transition-duration:.01ms !important;

  }





  .hero-slide{

    transform:none;

  }





  .reveal{

    opacity:1;



    transform:none;

  }



}