/** * Nav-over-hero layout — shared by homepage and About pages * * Apply with after loading navigation-isaca-style.css. * Homepage only: add nav-over-hero-home to hide nav after scroll past hero. * * ISACA pattern: transparent outer band; centered white header card; full-width hero below. * Tokens: --nav-header-height, --nav-card-max-width (navigation-isaca-style.css) */ body.nav-over-hero header[role="banner"] { position: relative; z-index: 1031; background: transparent; } body.nav-over-hero .site-header-nav { position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; z-index: 1031 !important; margin: 0 !important; padding: 0 var(--nav-card-outer-gap) !important; background: transparent !important; } body.nav-over-hero .site-header-nav .header-inner { background-color: #ffffff !important; background-image: none !important; box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08) !important; border-radius: 0 0 12px 12px; } body.nav-over-hero main#main-content { margin-top: 0; } /* Homepage hero content clearance — hero stays full-width; only text clears the floating card */ body.nav-over-hero .hero .container { padding-top: calc(var(--nav-header-height) + 20px); } @media (max-width: 991.98px) { body.nav-over-hero .site-header-nav { padding: 0 !important; } body.nav-over-hero .hero .container { padding-top: calc(var(--nav-mobile-header-height) + 16px); } body.nav-over-hero .site-header-nav .header-inner { border-radius: 0; } } /* Mega menu flush with header card — top set by navigation-enhanced.js on desktop */ body.nav-over-hero .navbar-primary .mega-menu.isaca-style { margin-top: 0 !important; padding-top: 0 !important; border-top: none !important; } body.nav-over-hero .navbar-primary .dropdown-menu.mega-menu { margin-top: 0 !important; padding-top: 0 !important; border-top: 1px solid rgba(226, 232, 240, 0.8) !important; } @media (max-width: 991.98px) { body.nav-over-hero .navbar-primary .mega-menu.isaca-style, body.nav-over-hero .navbar-primary .dropdown-menu.mega-menu { top: 100% !important; } body.nav-over-hero .navbar-primary .dropdown-toggle[aria-expanded="true"] + .dropdown-menu, body.nav-over-hero .navbar-primary .dropdown:hover .dropdown-menu { margin-top: 0 !important; top: 100% !important; } } body.nav-over-hero.nav-over-hero-home.scrolled .site-header-nav { opacity: 0; visibility: hidden; pointer-events: none; }