/* FABBRICA — comportamento di base, uguale per tutti i siti: panino, overlay, animazioni, hover.
   NON e' il design: sono i meccanismi. I colori vengono dai token del sito quando ci sono. */
.panino{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;background:none;border:0;cursor:pointer;z-index:60}
.panino span{display:block;height:2px;background:currentColor;transition:transform .25s ease,opacity .2s ease}
@media (max-width:900px){
  .panino{display:flex}
  .header nav{position:fixed;inset:0;background:var(--c-overlay,var(--c-chiaro,#f4f1ea));display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:50}
  .header .menu{flex-direction:column;text-align:center;gap:1.4rem;font-size:1.4rem}
  body.menu-aperto .header nav{opacity:1;pointer-events:auto}
  body.menu-aperto{overflow:hidden}
  body.menu-aperto .panino span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  body.menu-aperto .panino span:nth-child(2){opacity:0}
  body.menu-aperto .panino span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}
.anima{opacity:1}
.anima-parte{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease}
.in-vista .anima-parte{opacity:1;transform:none}
a.btn,button.btn{transition:transform .2s ease,filter .2s ease,background .2s ease,color .2s ease}
a.btn:hover,button.btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
a{transition:color .2s ease,opacity .2s ease}
img,picture{transition:opacity .4s ease}
@media (prefers-reduced-motion:reduce){.anima-parte{opacity:1;transform:none;transition:none}}
