footer {
    padding: 28px 0;
    text-align: center;
    color: white;
    font-size: 14px;
    font-weight: 500;
    background-color: gray;
}

.social-icons {
    margin-top: 10px;
}

.social-link {
    margin: 0 10px;
    display: inline-block;
    transition: transform 0.2s, fill 0.2s;
}

.social-link svg {
    vertical-align: middle;
    fill: white;
    /* default fill */
    transition: fill 0.2s;
}


/* Brand colors */

.social-link[href*="x.com"] svg {
    fill: #1DA1F2;
    /* X (Twitter) blue */
}

.social-link[href*="instagram.com"] svg {
    fill: #E4405F;
    /* Instagram pink/red */
}

.social-link[href*="tiktok.com"] svg {
    fill: #000000;
    /* TikTok black */
}

.social-link[href*="linkedin.com"] svg {
    fill: #0A66C2;
    /* LinkedIn blue */
}


/* Hover effects to brighten colors */

.social-link:hover svg {
    filter: brightness(1.2);
    transform: scale(1.2);
}