/* GRID DE TARJETAS */
.mg-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:20px; }
.mg-card { border:1px solid #eee; padding:10px; text-align:center; border-radius:8px; overflow:hidden; background:#fff; transition:box-shadow .2s; }
.mg-card:hover { box-shadow:0 4px 15px rgba(0,0,0,.15); }
.mg-card img { width:100%; height:auto; object-fit:cover; border-radius:6px; }

/* MODAL */
.mg-modal { position:fixed; inset:0; background:rgba(0,0,0,.7); display:none; z-index:9999; overflow-y:auto; padding:20px; }
.mg-modal-box { background:#fff; max-width:900px; width:100%; margin:60px auto; border-radius:12px; padding:20px; position:relative; display:flex; flex-direction:column; align-items:center; animation:fadeIn .3s ease; }
.mg-close { position:absolute; top:12px; right:15px; font-size:28px; cursor:pointer; line-height:1; }

/* CONTENIDO DEL MODAL */
.mg-modal-ecom { display:flex; gap:30px; width:100%; }
.mg-ecom-image { flex:0 0 400px; height:400px; display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:12px; background:#f9f9f9; }
.mg-ecom-image img { width:100%; height:100%; object-fit:cover; max-width:400px; max-height:400px; }
.mg-ecom-info { flex:1; display:flex; flex-direction:column; justify-content:flex-start; }
.mg-ecom-info h2 { margin-top:0; margin-bottom:12px; font-size:24px; }
.mg-ecom-info #mg-content { font-size:16px; line-height:1.5; }

/* BOTÓN COPIAR LINK */
.mg-copy { margin-top:10px; padding:8px 16px; cursor:pointer; background:#0073aa; color:#fff; border:none; border-radius:6px; transition:background .2s; }
.mg-copy:hover { background:#005177; }

/* RESPONSIVE */
@media(max-width:1024px){.mg-modal-ecom{flex-direction:column;align-items:center;}.mg-ecom-image{width:80%;height:auto;}.mg-ecom-image img{width:100%;height:auto;}.mg-ecom-info{width:100%;margin-top:20px;}}
@media(max-width:480px){.mg-modal-box{padding:15px;}.mg-ecom-info h2{font-size:20px;}.mg-ecom-info #mg-content{font-size:14px;}}

/* ANIMACIÓN */
@keyframes fadeIn { from{opacity:0; transform:scale(0.95);} to{opacity:1; transform:scale(1);} }