/* Frontend fallback styles. The Elementor template already includes the main matching portfolio styles. */
.skpm-shortcode-wrap { width:100%; }
.skpm-shortcode-grid.skp-project-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
}
.skp-project {
  display:block;
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 4px 24px -4px rgba(17,24,39,.06);
  transition:transform .35s ease,box-shadow .35s ease;
  text-decoration:none;
}
.skp-project:hover { transform:translateY(-6px); box-shadow:0 12px 40px -8px rgba(17,24,39,.14); }
.skp-project-media { aspect-ratio:4/3; position:relative; overflow:hidden; background:#eef2f7; }
.skp-project-media img { width:100%; height:100%; object-fit:cover; object-position:top center; transition:transform .5s ease; }
.skp-project:hover img { transform:scale(1.055); }
.skp-project-overlay { position:absolute; inset:0; background:rgba(16,24,39,.78); opacity:0; display:flex; align-items:center; justify-content:center; color:white; transition:opacity .35s ease; font-size:18px; font-weight:800; }
.skp-project:hover .skp-project-overlay { opacity:1; }
.skp-project-overlay span { display:flex; align-items:center; gap:10px; }
.skp-project-overlay svg { width:20px; height:20px; }
.skp-project-body { padding:24px 24px 26px; }
.skp-project-body span { display:block; color:#f59e0b; font-weight:800; font-size:14px; letter-spacing:.06em; margin-bottom:11px; text-transform:uppercase; }
.skp-project-body h3 { margin:0; font-family:'Outfit',Arial,sans-serif; font-size:20px; line-height:1.3; font-weight:800; color:#111827; }
@media (max-width:1024px){ .skpm-shortcode-grid.skp-project-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:640px){ .skpm-shortcode-grid.skp-project-grid{ grid-template-columns:1fr; } }
.skp-project-media img {
  display:block;
  content-visibility:auto;
}
.skpm-dynamic-card img[loading="lazy"] {
  background:#eef2f7;
}
