/* Aanvullingen op het Grayscale-thema voor snel.me */
.masthead h1 { color: #fff; }

.tegel {
    padding: 1.6rem 1rem;
    border-radius: .5rem;
    color: #fff;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .15);
    transition: background .2s, transform .2s;
}

.tegel:hover { color: #fff; text-decoration: none; background: rgba(100, 161, 157, .35); transform: translateY(-2px); }
.tegel .link-text { margin-top: .6rem; font-family: "Varela Round", sans-serif; letter-spacing: .1rem; text-transform: uppercase; font-size: .85rem; }

.wijzigingen li { margin-bottom: .2rem; }

.vrienden-page { min-height: 100vh; padding-top: 8rem; padding-bottom: 4rem; }

.dienst {
    display: flex;
    gap: 1rem;
    height: 100%;
    padding: 1.5rem;
    border-radius: .5rem;
    color: #fff;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .15);
    transition: background .2s, transform .2s;
}

.dienst:hover { color: #fff; text-decoration: none; background: rgba(100, 161, 157, .3); transform: translateY(-2px); }
.dienst img { flex: none; }
.dienst h3 { font-size: 1.2rem; margin-bottom: .1rem; }
.dienst .naam { font-size: .8rem; text-transform: uppercase; letter-spacing: .1rem; color: rgba(255, 255, 255, .5); }
.dienst p { color: rgba(255, 255, 255, .7); margin: .5rem 0 0; font-size: .95rem; }

.login-kaart { max-width: 26rem; margin: 0 auto; padding: 2rem; border-radius: .5rem; background: rgba(0, 0, 0, .55); }
.login-kaart label { color: rgba(255, 255, 255, .7); font-size: .9rem; }