/**
 * File: header-logo.css
 * Purpose: Styles for the logo container section in the site header.
 * Usage: Applies to the `.logo-container` div typically located at the top of the page header.
 * Dependencies: Assumes a logo image inside `.logo-container img`. Works within the structure of a Divi-based header.
 *
 * Notes:
 * - Sets height and centering for the logo area across desktop, tablet, and mobile
 * - Responsive behavior ensures consistent spacing and image scaling
 * - Uses CSS variables for full theming control
 */


 /* Scoped Variables */
 .logo-container {
    --logo-container-bg-color: var(--white);
 }


.logo-container {
    background-color: var(--logo-container-bg-color);
    text-align: center;
    height: 190px;
    padding: 0;
}

.logo-container img {
    height: 100%;
    width: auto;
}


/* Mobile Styles */
@media all and (max-width: 768px) {
    .logo-container {
        height: 190px;
    }
}

/* Tablet Styles */
@media all and (max-width: 820px) and (min-width: 769px) {
    .logo-container {
        height: 190px;
    }
}