/* ===== Navbar Social Icons Styling ===== */
.navbar-social-icons {
    margin: 0;
    padding: 0;
    list-style: none;
}

.navbar-social-icons li {
    display: inline-block;
    margin-left: 1.2em; /* increased spacing for hover scaling */
}

.navbar-social-icons li:first-child {
    margin-left: 0;
}

.navbar-social-icons li a {
    display: inline-block;
    font-size: 1.5rem; /* default icon size */
    color: #000;        /* default color for visibility on white background */
    transition: all 0.3s ease;
}

/* Hover animation: smooth color change + slight scale-up */
.navbar-social-icons li a:hover {
    transform: scale(1.2) translateY(-2px);
}

/* Individual hover colors per Thermwood branding */
.navbar-social-icons li a .fa-facebook-f:hover {
    color: #d62828; /* Thermwood red */
}

.navbar-social-icons li a .fa-youtube:hover {
    color: #d62828; /* Thermwood red */
}

.navbar-social-icons li a .fa-linkedin-in:hover {
    color: #0077b6; /* Thermwood blue */
}

.navbar-social-icons li a .fa-instagram:hover {
    color: #0096c7; /* Thermwood light blue */
}

.navbar-social-icons li a .fa-tiktok:hover {
    color: #3cbfb1; /* Thermwood teal */
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .navbar-social-icons li a {
        font-size: 1.2rem;
    }
    .navbar-social-icons li {
        margin-left: 0.9em; /* slightly smaller spacing on small screens */
    }
}