/* Logo Inversion Styles */

/* Normal logo for light backgrounds (header) */
.logo-normal {
    filter: none;
    transition: all 0.3s ease;
    max-height: 70px;
    width: auto;
    padding: 0;
    margin: 0;
}

/* Inverted logo for dark backgrounds (footer) */
.logo-inverted {
    filter: brightness(0) invert(1);
    transition: all 0.3s ease;
    max-height: 80px;
    width: auto;
    padding: 0;
    margin: 0;
}

/* Logo container styling */
.logo {
    padding: 0 !important;
    margin: 0 !important;
}

.logo a {
    padding: 0 !important;
    margin: 0 !important;
    display: inline-block;
}

/* Responsive logo sizing */
@media (max-width: 767px) {
    .logo-normal,
    .logo-inverted {
        max-height: 50px;
    }
}

/* Logo over banner - make white for transparent header */
.header--transparent .logo-normal {
    filter: brightness(0) invert(1);
    transition: all 0.3s ease;
}

/* Logo when header becomes solid (on scroll) */
.header--transparent.header--sticky.sticky .logo-normal {
    filter: none;
    transition: all 0.3s ease;
}

/* Logo for light mode header */
.header-light-mode .logo-normal {
    filter: brightness(0) invert(1);
}

/* Logo hover effects */
.logo-normal:hover,
.logo-inverted:hover {
    transform: scale(1.05);
    transition: transform 0.3s ease;
}