/* ============================================= WP Smart Nav — Front-end CSS v1.1 All colour/size values come from :root vars injected by PHP (wsn_build_css_vars) ============================================= */ /* ── Token defaults (PHP overrides these) ── */ :root { --wsn-header-h: 72px; --wsn-header-h-mob: 60px; --wsn-maxw: 1280px; --wsn-announce-h: 0px; --wsn-ab: 0px; /* set by JS after DOM ready */ --wsn-top-bg-rgba: rgba(123,28,42,1); --wsn-scroll-bg-rgba: rgba(123,28,42,1); --wsn-blur-top: 0px; --wsn-blur-scroll: 0px; --wsn-border: rgba(0,0,0,0.12); --wsn-top-text: #ffffff; --wsn-top-link: #ffffff; --wsn-scroll-text: #ffffff; --wsn-scroll-link: #ffffff; --wsn-link-size: 14px; --wsn-link-weight: 600; --wsn-link-radius: 6px; --wsn-link-px: 12px; --wsn-link-py: 8px; --wsn-link-hover-bg: transparent; --wsn-link-underline: #E8D5B7; --wsn-link-underline-h: 2px; --wsn-dd-bg: rgba(255,255,255,0.97); --wsn-dd-link: #111111; --wsn-dd-blur: 14px; --wsn-dd-radius: 12px; --wsn-dd-shadow: 0 8px 32px rgba(0,0,0,0.14); --wsn-dd-hover-bg: rgba(123,28,42,0.07); --wsn-dd-hover-color: #7B1C2A; --wsn-drawer-w: 300px; --wsn-drawer-bg: #F5ECD7; --wsn-drawer-blur: 0px; --wsn-drawer-link: #7B1C2A; --wsn-drawer-size: 17px; --wsn-drawer-weight: 700; --wsn-drawer-divider: rgba(123,28,42,0.10); --wsn-overlay-bg: rgba(0,0,0,0.55); --wsn-overlay-blur: 3px; --wsn-acc-indicator: #7B1C2A; --wsn-acc-sub-link: #A83040; --wsn-acc-sub-size: 15px; --wsn-acc-indent: rgba(123,28,42,0.20); --wsn-burger-color: #ffffff; --wsn-burger-bg: transparent; --wsn-burger-border: transparent; --wsn-burger-radius: 6px; --wsn-burger-size: 22px; --wsn-burger-gap: 5px; --wsn-ann-bg: rgba(0,0,0,0.75); --wsn-ann-text: #ffffff; --wsn-ann-blur: 0px; --wsn-ann-border: transparent; --wsn-foot-bg: #F5ECD7; --wsn-foot-text: #7B1C2A; --wsn-foot-link: #7B1C2A; --wsn-foot-hover: #A83040; --wsn-foot-border: rgba(123,28,42,0.15); --wsn-foot-blur: 0px; --wsn-foot-pad-y: 40px; --wsn-foot-pad-x: 20px; --wsn-foot-maxw: 1280px; /* Runtime values set by JS scroll handler */ --wsn-bg-rgba: var(--wsn-top-bg-rgba); --wsn-blur-cur: var(--wsn-blur-top); --wsn-text-cur: var(--wsn-top-text); --wsn-link-cur: var(--wsn-top-link); --wsn-border-cur: transparent; } /* ── Box sizing ── */ .wsn-header *, .wsn-drawer *, .wsn-overlay, .wsn-footer *, .wsn-announce * { box-sizing: border-box; } /* ============================================= ANNOUNCEMENT BAR ============================================= */ .wsn-announce { position: fixed; top: var(--wsn-ab); left: 0; right: 0; height: var(--wsn-announce-h); z-index: 10001; display: flex; align-items: center; justify-content: center; background: var(--wsn-ann-bg); color: var(--wsn-ann-text); border-bottom: 1px solid var(--wsn-ann-border); backdrop-filter: blur(var(--wsn-ann-blur)); -webkit-backdrop-filter: blur(var(--wsn-ann-blur)); font-size: 13px; font-weight: 600; letter-spacing: .2px; overflow: hidden; } .wsn-ann__text { padding: 0 16px; } .wsn-ann__link { color: inherit; text-decoration: none; display: block; width: 100%; text-align: center; padding: 0 16px; } .wsn-ann__link:hover { text-decoration: underline; } /* ============================================= HEADER — fixed, always on screen from load ============================================= */ .wsn-header { position: fixed; /* * KEY FIX: top is calculated from: * admin bar height (--wsn-ab, set by JS) * + announcement bar height (--wsn-announce-h) * JS sets --wsn-ab immediately on DOMContentLoaded * AND in a