/* Grid layout */
.pgp-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:20px; margin:20px 0; }
.pgp-card { position:relative; background:#fff; border:1px solid #e9e9e9; border-radius:6px; overflow:hidden; min-height:320px; display:flex; align-items:center; justify-content:center; }
.pgp-thumb img { width:100%; height:260px; object-fit:contain; background:#fafafa; padding:10px; }

/* overlay shown on hover */
.pgp-overlay { position:absolute; inset:0; background:rgba(0,0,0,0.7); color:#fff; display:flex; flex-direction:column; justify-content:center; align-items:center; opacity:0; transition:0.2s; text-align:center; padding:10px; }
.pgp-card:hover .pgp-overlay { opacity:1; }
.pgp-title { font-size:20px; margin-bottom:12px; }

/* round icons */
.pgp-icons { display:flex; gap:12px; }
.pgp-ico { width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:20px; text-decoration:none; }
.pgp-wa { background:#25D366; }
.pgp-pdf { background:#E73B3B; }

/* modal wrapper */
.pgp-modal-wrap { position:fixed; inset:0; background:rgba(0,0,0,0.6); display:flex; align-items:center; justify-content:center; z-index:99999; padding:30px; }
.pgp-modal-box { background:#fff; width:95%; max-width:1000px; border-radius:8px; padding:18px; position:relative; display:flex; gap:20px; max-height:90vh; overflow:auto; }
#pgp-close { position:absolute; right:14px; top:12px; background:#eee; border:0; padding:6px 10px; border-radius:6px; cursor:pointer; }

/* ---- NEW: two-column modal layout (image left small, text right) ---- */
.product-modal-content { display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap; }
.product-modal-img { flex: 0 0 280px; max-width:280px; }
.product-modal-img img { width:100%; height:auto; object-fit:contain; border-radius:8px; }
.product-modal-text { flex:1; min-width:280px; }

/* modal internal */
.pgp-modal-right h2, .product-modal-text h2 { margin-top:0; }
.pgp-modal-desc { margin-top:10px; color:#333; line-height:1.6; }

/* specs table */
.pgp-specs { width:100%; border-collapse:collapse; margin-top:12px; }
.pgp-specs th { text-align:left; padding:8px 10px; background:#fafafa; width:35%; border-bottom:1px solid #eee; }
.pgp-specs td { padding:8px 10px; border-bottom:1px solid #eee; }

/* modal buttons */
.pgp-btn { display:inline-block; padding:8px 12px; border-radius:6px; text-decoration:none; color:#fff; margin-right:8px; font-weight:600; }
.pgp-btn.pgp-pdf { background:#E73B3B; }
.pgp-btn.pgp-wa { background:#25D366; }

/* responsive */
@media (max-width:900px){
  .pgp-grid { grid-template-columns: repeat(2,1fr); }
  .pgp-modal-box { flex-direction:column; }
  .product-modal-img { width:100%; flex-basis:auto; }
  .product-modal-img img { max-height:360px; }
}
@media (max-width:600px){
  .pgp-grid { grid-template-columns: 1fr; }
}