/* Shared by all case-study pages (case001–case005): white theme for header/footer
   and the scaled header/footer for phones & tablets. */

body, html, main, #content-block {
    background-color: #fff !important;
    background: #fff !important;
}
body {
    opacity: 1 !important;
}
#root { padding-top: 140px; }
@media (max-width: 767px) { #root { padding-top: 90px; } }
.back-to-top::after { display: none !important; }

#header, .header-main { background-color: #fff !important; }
header, header.scrolled.open, header.scrolled.scrolled-up { background: #fff !important; border-bottom: none !important; box-shadow: none !important; }
header .header-main.header-mobile { background: #d9d0bc !important; }
nav .menu a { color: #222 !important; text-shadow: none !important; font-weight: 400; letter-spacing: 0.5px; }
header .header-logo img, header .header-logo svg image { filter: brightness(0) saturate(100%) invert(78%) sepia(9%) saturate(210%) hue-rotate(353deg) brightness(95%) contrast(86%) !important; }
.burger-button div span { background-color: #222 !important; }
#footer, #footer p, #footer a, #footer i { color: #c0b7b0 !important; }
#footer { border-top: 1px solid #c0b7b0 !important; background: #fff !important; }
#footer img { filter: brightness(0) saturate(100%) invert(78%) sepia(9%) saturate(210%) hue-rotate(353deg) brightness(95%) contrast(86%); }
#footer .social a, #footer .social-icon a { border-color: #c0b7b0 !important; }
#footer .fa-brands { font-family: "Font Awesome 6 Brands" !important; font-weight: 400 !important; }

/* Mobile header/footer overrides for viewport=1400 case pages */
html.is-mobile #header { width: var(--mobile-sw) !important; transform: scale(var(--mobile-ratio)) !important; transform-origin: top left !important; z-index: 9999 !important; padding: 20px 0 !important; }
html.is-mobile #root { padding-top: calc(80px * var(--mobile-ratio)) !important; }
html.is-mobile header .burger { display: block !important; }
html.is-mobile header .header-main:not(.header-mobile) div.menu nav { display: none !important; }
html.is-mobile header .header-main.header-mobile { height: calc(100vh / var(--mobile-ratio)) !important; }
html.is-mobile header .header-main.header-mobile div.menu nav { display: block !important; }
html.is-mobile header .header-main.header-mobile .menu { flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; width: 100% !important; }
html.is-mobile header .header-main.header-mobile .menu li { margin-bottom: 10px !important; margin-right: 0 !important; }
html.is-mobile header .header-main.header-mobile .menu li a { font-size: 25px !important; }
html.is-mobile #header .header-logo { margin: 0 auto !important; width: 45px !important; height: 70px !important; }
html.is-mobile #header .row > div:first-child { flex: 0 0 66.667% !important; max-width: 66.667% !important; margin-left: 16.667% !important; }
html.is-mobile #header .row > div:last-child { flex: 0 0 16.667% !important; max-width: 16.667% !important; }
html.is-mobile #footer { width: var(--mobile-sw) !important; transform: scale(var(--mobile-ratio)) !important; transform-origin: top left !important; text-align: center !important; }
html.is-mobile #footer .row { flex-direction: column !important; align-items: stretch !important; }
html.is-mobile #footer .row > div { flex: none !important; max-width: 100% !important; width: 100% !important; text-align: center !important; }
html.is-mobile #footer .footer-content-outer { justify-content: center !important; }
html.is-mobile #footer .social { justify-content: center !important; margin-top: 15px !important; }
html.is-mobile #footer .footer-content-outer .content p { white-space: nowrap !important; font-size: 12px !important; }
html.is-mobile #footer .footer-icon img { width: 90% !important; max-width: none !important; max-height: none !important; height: auto !important; }
/* Tablet: zoom boost for header/footer + nav font size */
html.is-tablet #header { zoom: var(--tablet-ratio) !important; }
html.is-tablet #header .header-main .menu li a { font-size: calc(14px * var(--tablet-ratio)) !important; }
html.is-tablet #header .header-logo { width: 48px !important; height: 66px !important; }
html.is-tablet #root { padding-top: calc(140px * var(--tablet-ratio)) !important; }
html.is-tablet #footer { zoom: var(--tablet-ratio) !important; }
/* Footer layout for all views */
#footer .social { justify-content: flex-end !important; }
#footer .footer-icon { display: flex; justify-content: center; }
#footer .footer-content-outer { justify-content: center !important; }
