/* ADZ Portfolio Screens v1.2 - responsive auto-fit grid, mobile-friendly hover scroll */
.adz-portfolio-grid {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(var(--adz-cols), minmax(0, 1fr));
  gap: var(--adz-gap, 16px);
}
.adz-portfolio-grid[style*="--adz-cols: 0"] {
  grid-template-columns: repeat(auto-fit, minmax(var(--adz-min, 260px), 1fr));
}

.adz-portfolio-card {
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
  background: #0b0b0b;
  box-shadow: 0 8px 18px rgba(0,0,0,0.18);
  transition: transform .2s ease, box-shadow .2s ease;
  width: 100%;
}
.adz-portfolio-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(0,0,0,0.22);
}

.adz-portfolio-link { color: inherit; text-decoration: none; display: block; }

.adz-shot-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: var(--adz-ratio, 16/10);
  overflow: hidden;
  background: #111;
}

.adz-shot {
  display: block;
  width: 100%;
  height: auto;
  transform: translateY(0);
  will-change: transform;
  transition: transform var(--adz-speed, 6000ms) linear;
}

.adz-caption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 14px 12px;
  color: #f4f4f4;
  background: linear-gradient(180deg, rgba(0,0,0,0.5), rgba(0,0,0,0.6));
  font-size: 14px;
}
.adz-title { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adz-url { opacity: 0.8; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.adz-portfolio-empty { padding: 1rem; background:#fafafa; border:1px solid #eee; }

@media (max-width: 640px) {
  .adz-caption { font-size: 13px; }
}