/* First tile */
.tiles article:nth-child(1):before {
    background-color: #000000 !important;
}

/* Second tile */
.tiles article:nth-child(2):before {
    background-color: #000000 !important;
}

/* Third tile */
.tiles article:nth-child(3):before {
    background-color: #000000 !important;
}

/* Fourth tile */
.tiles article:nth-child(4):before {
    background-color: #000000 !important;
}

.tiles article:nth-child(5):before {
    background-color: #000000 !important;
}

/* Second tile */
.tiles article:nth-child(6):before {
    background-color: #000000 !important;
}

/* Third tile */
.tiles article:nth-child(7):before {
    background-color: #000000 !important;
}

/* Fourth tile */
.tiles article:nth-child(8):before {
    background-color: #000000 !important;
}
#gallery {
    background: #000000 !important;
}

#banner:before,
#banner:after {
    background: #000000 !important;
}

#contact,
#footer,
#two {
    background-color: #8A6508 !important;
}

#header:not(.alt) {
    background-color: #8A6508 !important;
}

/* Hide images completely */
.tiles article .image img {
    opacity: 0 !important;
}

/* Gold tile color */
.tiles article:before {
    background-color: #DAA428 !important;
    opacity: 1 !important;
}

#banner h1 {
    font-family: 'Playfair Display', serif !important;
    font-weight: 400 !important;
}

.screenshot-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}

.screenshot-grid img {
    width: 100%;
    border-radius: 8px;
    display: block;
    box-shadow: 0 10px 30px rgba(0,0,0,.3);
    transition: transform .2s ease;
}

.screenshot-grid img:hover {
    transform: scale(1.02);
}

@media screen and (max-width: 736px) {
    .screenshot-grid {
        grid-template-columns: 1fr;
    }
}