/* ==========================================================================
   Griglia loghi (Marketplace collegati, Partner integrati e collaborazioni)
   I loghi compaiono uno dopo l'altro quando la griglia entra nello schermo
   (js/logo-grid.js). Ogni <li> porta style="--i:N" per il ritardo.
   Varianti:
     .mk-grid           5 per riga
     .mk-grid--4        4 per riga (griglie da 8 loghi)
   Titolo e descrizione della sezione: css/section-head.css (.mk-head)
   ========================================================================== */

.mk-section{position:relative;overflow:hidden;padding:80px 0 70px;background:#faa752;background:linear-gradient(45deg,#dbcec2 0%,#faa752 100%);}

.mk-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:20px;}
.mk-grid li{position:relative;aspect-ratio:4/3;border-radius:18px;background:#fff;overflow:hidden;border:1px solid rgba(239,127,54,.12);box-shadow:0 12px 28px -18px rgba(60,40,20,.35);opacity:0;transform:translateY(24px) scale(.94);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;transition-delay:calc(var(--i) * 110ms);}
.mk-grid.is-in li{opacity:1;transform:none;}
.mk-grid.is-settled li{transition-delay:0s;}
.mk-grid.is-in li:hover{transform:translateY(-6px);box-shadow:0 22px 40px -20px rgba(239,127,54,.45);transition-delay:0s;}
.mk-grid li img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s cubic-bezier(.2,.8,.2,1);}
.mk-grid li:hover img{transform:scale(1.06);}
.mk-more{text-align:center;margin:30px 0 0;font-size:15px;color:#212529ba;}

/* Logo dentro un link o uno span: riempie la scheda */
.mk-grid .mk-logo{display:block;width:100%;height:100%;}

/* 4 per riga, per griglie da 8 loghi */
.mk-grid--4{grid-template-columns:repeat(4,1fr);}

@media (max-width:991.98px){
    .mk-grid{grid-template-columns:repeat(3,1fr);gap:16px;}
    .mk-grid--4{grid-template-columns:repeat(4,1fr);}
}
@media (max-width:575.98px){
    .mk-section{padding:56px 0 48px;}
    .mk-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
    .mk-grid li{border-radius:14px;}
}
@media (prefers-reduced-motion:reduce){
    .mk-grid li{opacity:1;transform:none;transition:none;}
}
