/* Electromancha Banners — grid de banners cuadrados (self-contained). */
.emb-banners{ width:100%; padding:26px 0 34px; }
.emb-wrap{ max-width:1200px; margin:0 auto; padding-inline:24px; }
.emb-banners .emb-title{
  text-align:center !important; font-size:clamp(24px,3vw,34px); font-weight:800; letter-spacing:-.02em;
  color:#171717; margin:0 auto 24px; line-height:1.15; width:100%;
}
.emb-banners .emb-title::after{
  content:""; display:block; width:56px; height:4px; border-radius:4px; margin:12px auto 0;
  background:linear-gradient(120deg,#f97316,#ea580c 60%,#c2410c);
}
.emb-grid{ display:grid; gap:20px; }
.emb-cols-2{ grid-template-columns:repeat(2,1fr); }
.emb-cols-3{ grid-template-columns:repeat(3,1fr); }
.emb-cols-4{ grid-template-columns:repeat(4,1fr); }

.emb-item{
  position:relative; display:block; aspect-ratio:1/1; overflow:hidden;
  border-radius:16px; background:#fff; text-decoration:none;
  box-shadow:0 6px 18px rgba(17,17,17,.08);
  transition:transform .25s ease, box-shadow .25s ease;
}
.emb-item img{
  width:100%; height:100%; object-fit:contain; display:block;   /* banner completo, sin recortar */
  transition:transform .5s ease;
}
a.emb-item:hover{ transform:translateY(-5px); box-shadow:0 18px 40px rgba(17,17,17,.16); }
a.emb-item:hover img{ transform:scale(1.05); }
a.emb-item::after{
  content:""; position:absolute; inset:0; border:2px solid transparent; border-radius:16px;
  transition:border-color .25s ease; pointer-events:none;
}
a.emb-item:hover::after{ border-color:#ea580c; }

@media (max-width:900px){
  .emb-cols-3,.emb-cols-4{ grid-template-columns:repeat(2,1fr); }
  .emb-grid{ gap:14px; }
}
@media (max-width:520px){
  .emb-cols-2,.emb-cols-3,.emb-cols-4{ grid-template-columns:1fr; }
  .emb-banners{ padding:18px 0 24px; }
}