/* studio-profile-v2/albums.css — public studio interior/exterior photo gallery
 * INK-PROD-ACCT-ROLES W2b. Studio SPACE photos (inkppl_studio_album_images), distinct
 * from the tattoo portfolio (modextra_items). Sits in the #spAlbums section. */

.sp-albums__group { margin-top: var(--space-lg, 24px); }
.sp-albums__group:first-child { margin-top: var(--space-md, 16px); }

.sp-albums__group-title {
    margin: 0 0 var(--space-sm, 10px);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    opacity: 0.82;
}

.sp-albums__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 10px;
}

.sp-albums__tile {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 12px;
    background: rgba(127, 127, 127, 0.08);
}

.sp-albums__tile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.35s ease;
}

.sp-albums__tile:hover img,
.sp-albums__tile:focus-visible img { transform: scale(1.045); }

@media (max-width: 600px) {
    .sp-albums__grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; }
}