.logo-invert { transition: filter 0.4s ease-in-out; filter: invert(0) brightness(1);  will-change: filter; }  #site-header.frontpage.transparent .logo-invert { filter: invert(1) brightness(1); } #site-header.frontpage.transparent .logo-invert:hover { filter: invert(1) brightness(1); }  #site-header.frontpage:not(.transparent) .logo-invert:hover, #site-header:not(.frontpage) .logo-invert:hover { filter: invert(0.5) brightness(1.3); }  #site-header { position: fixed; top: 0; width: 100%; z-index: 999; background-color: #ede7de; transition: background-color 0.3s ease; }  #site-header.frontpage.transparent { background-color: rgba(237, 231, 222, 0); }  #mobile-menu-toggle.light { color: white; fill: white; stroke: white; } #mobile-menu-toggle.dark { color: #212121; fill: #212121; stroke: #212121; } #mobile-menu-toggle { transition: all 0.4s ease-in-out; } .nav-item, .submenu-trigger, .mega-menu a { transition: color 0.4s ease-in-out, font-weight 0.4s ease-in-out; font-weight: 400; color: #616161; } .nav-item:hover, .nav-item.nav-active, .submenu-trigger:hover, .submenu-trigger.nav-active, .mega-menu a:hover, .mega-menu a.nav-active { font-weight: 500; color: #111111; }  #site-header.frontpage.transparent .nav-item, #site-header.frontpage.transparent .submenu-trigger, #site-header.frontpage.transparent .mega-menu a { color: #ffffff !important; }  #site-header .mega-menu { background-color: #ede7de; transition: background-color 0.3s ease; } #site-header.frontpage.transparent .mega-menu { background-color: rgba(237, 231, 222, 0); }  .submenu-face, .submenu-breast, .submenu-body, .submenu-reconstructive, .submenu-nonsurgical { display: none; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; } .submenu-face[data-state="open"], .submenu-breast[data-state="open"], .submenu-body[data-state="open"], .submenu-reconstructive[data-state="open"], .submenu-nonsurgical[data-state="open"] { display: flex; opacity: 1; pointer-events: auto; }  .fade-in-stagger { opacity: 0; transform: translateY(10px); animation: fadeStagger 0.4s forwards; } @keyframes fadeStagger { to { opacity: 1; transform: translateY(0); } } .image-wrapper { position: relative; display: inline-block; } .hover-text { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.6); color: #fff; opacity: 0; transition: opacity 0.3s ease; text-align: center; padding: 10px; box-sizing: border-box; } .image-wrapper:hover .hover-text { opacity: 1; } .hover-border { display: block;  border: 5px solid transparent;  transition: border-color 0.3s ease;  } .hover-border:hover { border-color: #212121;  }