/* Reference header styling, scoped to the public header. */
.site-header {
    background: #9b1c53 url('../img/lotis-header-bg.png') center / cover;
    border-bottom-color: #861747;
}
.site-header .brand-bar { padding-top: 5px; padding-bottom: 5px; }
.site-header .lotis-brand { min-width: 0; gap: 9px; flex-shrink: 0; }
.site-header .lotis-emblem { width: 48px; height: 44px; object-fit: contain; flex: 0 0 auto; }
.site-header .lotis-brand-copy { display: block; min-width: 0; }
.site-header .lotis-title-row { display: flex; align-items: baseline; gap: 12px; }
.site-header .lotis-wordmark {
    color: #fff; font-family: Arial, Helvetica, sans-serif; font-size: 25px;
    font-weight: 900; font-style: italic; letter-spacing: 4px; line-height: 1;
    text-shadow: 1px 2px 2px rgba(255,255,255,.4);
}
.site-header .lotis-subtitle {
    color: #fff; font-family: Arial, Helvetica, sans-serif; font-size: 10px;
    font-style: italic; font-weight: 700; margin: 0; line-height: 1.1;
}
.site-header .lotis-department {
    display: block; color: #fff; font-size: 10px; font-weight: 700;
    line-height: 1.15; margin-top: 2px;
}
.site-header .main-nav a { color: #fff; }
.site-header .main-nav a:hover, .site-header .main-nav a.active { color: #fff; background: rgba(255,255,255,.14); }
.site-header .menu-button span { background: #fff; }
@media (max-width: 900px) {
    .site-header .brand-bar { padding-top: 6px; padding-bottom: 6px; }
    .site-header .main-nav { background: #861747; }
    .site-header .lotis-brand { flex-shrink: 1; }
}
@media (max-width: 560px) {
    .site-header .lotis-brand { gap: 8px; }
    .site-header .lotis-emblem { width: 38px; height: 38px; }
    .site-header .lotis-title-row { flex-wrap: wrap; gap: 0 8px; }
    .site-header .lotis-wordmark { font-size: 21px; letter-spacing: 3px; }
    .site-header .lotis-subtitle { font-size: 8px; }
    .site-header .lotis-department { font-size: 9px; }
}
