.agp-grid { display: grid; grid-template-columns: repeat(var(--desk), minmax(0, 1fr)); gap: 15px; width: 100%; }
@media(max-width: 1024px) { .agp-grid { grid-template-columns: repeat(var(--tab), minmax(0, 1fr)); } }
@media(max-width: 767px) { .agp-grid { grid-template-columns: repeat(var(--mob), minmax(0, 1fr)); } }
.agp-item { position: relative; height: var(--height); overflow: hidden; display: block; background: #000; text-decoration: none; }
.agp-slideshow { position: absolute; inset: 0; width: 100%; height: 100%; transition: filter 0.5s ease, transform 0.5s ease; }
.agp-slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.2s ease; }
.agp-slide.active { opacity: 1; z-index: 2; }
.agp-slide img { width: 100%; height: 100% !important; object-fit: var(--fit); object-position: center center; display: block; }
.agp-item:hover .agp-slideshow { filter: blur(6px) brightness(0.4); transform: scale(1.05); }
.agp-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.5s ease; z-index: 10; }
.agp-item:hover .agp-overlay { opacity: 1; }
.agp-title { color: #fff; font-size: 15px; letter-spacing: 4px; text-transform: uppercase; font-weight: 300; padding: 16px 32px; border: 1px solid rgba(255, 255, 255, 0.4); background: transparent; transition: border-color 0.3s ease; }
.agp-item:hover .agp-title { border-color: rgba(255, 255, 255, 0.8); }