/* tablet (iPad mini e simili in verticale) e sotto: menu a tendina e layout a colonne ridotte */
@media(max-width:1023px){
  .burger{display:block}
  .menu{position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;flex-direction:column;align-items:stretch;padding:20px;background:var(--menu-bg);overflow-y:auto;gap:2px;transform:translateX(100%);transition:.3s}
  .menu.open{transform:none}
  .menu>li>a{padding:14px;font-size:14px}
  .sub{position:static;opacity:1;visibility:visible;transform:none;background:none;border:0;box-shadow:none;padding:0 0 6px 14px;margin:0}
  .menu .has>a::after{display:none}
  .hero .wrap{grid-template-columns:1fr}
  .seal{order:-1;width:min(240px,60vw);justify-self:start;margin-bottom:10px}
  .tiles,.posts{grid-template-columns:1fr 1fr}
  .masonry{columns:2}
  .strip{grid-template-columns:repeat(3,1fr)}
  .split,.contact,.cols2,.subcards{grid-template-columns:1fr}
  .press{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .tiles,.posts{grid-template-columns:1fr}
  .masonry{columns:1}
  .stats,.spec{grid-template-columns:1fr}
  .cl a,.cl div{grid-template-columns:1fr;gap:4px}
  .fgrid{grid-template-columns:1fr}
  .brand span{display:none}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}.js .rv{opacity:1;transform:none}}

/* schermi molto grandi e ad alta risoluzione (2K, 4K, 5K): tutto il sito si ingrandisce in proporzione,
   così il contenuto occupa una buona parte dello schermo, con margini laterali contenuti ma non eccessivi */
@media(min-width:2000px){html{zoom:1.1;--z:1.1}}
@media(min-width:2500px){html{zoom:1.35;--z:1.35}}
@media(min-width:3200px){html{zoom:1.7;--z:1.7}}
@media(min-width:4400px){html{zoom:2.1;--z:2.1}}
