/* * header-theme.css * * Applied when a page renders , * which sets data-header-light on . * * IMPORTANT: .header-1 is a class ON #header-sticky (same element), * not a descendant — so the compound selector is #header-sticky.header-1 * * Values are mapped to site brand variables: * --header * --border * --theme */ /* ── Logo swap ─────────────────────────────────────────────────── */ body[data-header-light] #header-sticky.header-1:not(.sticky) .header-logo { display: none; } body[data-header-light] #header-sticky.header-1:not(.sticky) .header-logo-2 { display: block; } /* ── Nav link text ──────────────────────────────────────────────── */ body[data-header-light] #header-sticky.header-1:not(.sticky) .main-menu ul li > a { color: var(--header); } body[data-header-light] #header-sticky.header-1:not(.sticky) .main-menu ul li > a:hover { color: var(--theme) !important; } /* ── Hamburger / sidebar toggle ─────────────────────────────────── */ body[data-header-light] #header-sticky.header-1:not(.sticky) .sidebar__toggle { color: var(--header); } /* ── Search icon ─────────────────────────────────────────────────── */ body[data-header-light] #header-sticky.header-1:not(.sticky) .search-icon { color: var(--header); border-right-color: rgba(31, 23, 38, 0.3); } /* ── CTA button ──────────────────────────────────────────────────── */ body[data-header-light] #header-sticky.header-1:not(.sticky) .header-button .theme-btn { background-color: transparent; border: 1px solid var(--border); color: var(--header); } body[data-header-light] #header-sticky.header-1:not(.sticky) .header-button .theme-btn::before { background-color: var(--theme); } body[data-header-light] #header-sticky.header-1:not(.sticky) .header-button .theme-btn:hover { color: #fff; } /* ── Click-to-open desktop dropdowns ────────────────────────────── */ @media (min-width: 1200px) { .header-main .main-menu nav[data-menu-mode="click"] ul li:hover > .submenu { visibility: hidden; opacity: 0; transform: translateY(10px); } .header-main .main-menu nav[data-menu-mode="click"] ul li.menu-open > .submenu { visibility: visible; opacity: 1; transform: translateY(0px); } }