:root {
    --pitch:    #0b090d;  /* void black, faintly violet */
    --bone:     #d9d3c7;  /* aged ivory — body text */
    --ash:      #8b8293;  /* muted mauve grey — secondary text */
    --amethyst: #8a5faf;  /* mourning-jewellery violet — accent */
    --oxblood:  #6d2231;  /* dried blood — hairlines only */
}
.gallery-container{
    display: grid;
    padding-top: 3px;
    grid-template-columns: repeat(3, 1fr);
    row-gap: 5px;
    column-gap: 5px;


}
.gallery-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 1px solid var(--oxblood);
}

/* tiles on photo.html, one per gallery, each with a caption */
.gallery-tile {
    position: relative;
    display: block;
    text-decoration: none;
    aspect-ratio: 1 / 1;
}
.gallery-tile-title {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.5rem 0.6rem;
    font-size: 0.7rem;
    font-variant: small-caps;
    letter-spacing: 0.15em;
    color: var(--bone);
    background: linear-gradient(to top, rgba(11, 9, 13, 0.9), rgba(11, 9, 13, 0));
}
.gallery-tile:hover .gallery-tile-title,
.gallery-tile:focus-visible .gallery-tile-title {
    color: var(--amethyst);
}