.social-link {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: var(--text-color);
    margin-right: var(--spacing-md);
    transition: color 0.3s ease;
}

.social-link:hover {
    color: var(--accent-color);
}

.social-icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: var(--spacing-sm);
}

.social-icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.social-link-text {
    font-weight: bold;
}