/* Shared navigation: desktop mega panels and mobile disclosure navigation. */
.site-header.site-header-modern { position: sticky; top: 0; z-index: 100; min-height: 4.75rem; border-bottom: 1px solid var(--color-dark-border); background: var(--color-navy-900); backdrop-filter: none; }
.site-header-modern .nav-shell { position: relative; display: flex; align-items: center; justify-content: space-between; min-height: 4.75rem; gap: 2rem; }
.site-header-modern .brand { flex-shrink: 0; font-size: 1rem; letter-spacing: -.025em; }
.site-header-modern .brand img { width: 2.25rem; height: 2.25rem; }
.primary-nav { display: flex; align-items: center; gap: 0.25rem; }
.nav-link, .nav-disclosure { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 2.75rem; padding: 0.5rem 1rem; border: 0; border-radius: .45rem; background: transparent; color: var(--color-on-dark); font-size: var(--type-small); font-weight: var(--font-weight-medium); line-height: 1.4; text-decoration: none; cursor: pointer; transition: color 160ms, background 160ms; }
.nav-link:hover, .nav-disclosure:hover, .nav-disclosure[aria-expanded="true"], .nav-link[aria-current="page"] { color: var(--color-white); background: var(--color-glass); }
.nav-disclosure svg { width: .85rem; height: .85rem; fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform 180ms; }
.nav-disclosure[aria-expanded="true"] svg { transform: rotate(180deg); }
.nav-contact { display: inline-flex; align-items: center; justify-content: center; gap: 0.75rem; min-height: 2.75rem; margin-left: 0.75rem; padding: 0.75rem 1rem; border: 1px solid var(--color-green-500); border-radius: 999rem; background: var(--color-green-700); color: var(--color-white); font-size: var(--type-small); font-weight: var(--font-weight-semibold); }
.nav-contact:hover { background: var(--color-green-800); }
.nav-mobile-toggle { display: none; }
.mega-panel { position: absolute; top: calc(100% + 1px); right: 0; left: 0; overflow: hidden; border: 1px solid var(--color-border); border-top: 0; border-radius: 0 0 1rem 1rem; background: var(--color-white); color: var(--color-navy-900); box-shadow: 0 .75rem 2rem var(--color-shadow); }
.mega-panel[hidden] { display: none; }
.mega-topline { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.5rem 1.75rem 1rem; }
.mega-label { margin: 0; color: var(--color-muted); font-size: .75rem; font-weight: var(--font-weight-semibold); letter-spacing: .12em; text-transform: uppercase; }
.mega-solutions { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 0.5rem; padding: 0 1rem 1.25rem; }
.mega-solution { --solution-surface: var(--color-white); --solution-ink: var(--color-navy-800); display: flex; align-items: flex-start; gap: 1rem; min-width: 0; padding: 1.25rem 1rem; border: 1px solid transparent; border-radius: .7rem; background: var(--solution-surface); transition: border-color 160ms; }
.mega-solution-payments { --solution-surface: var(--color-blue-100); --solution-ink: var(--color-navy-800); }
.mega-solution-care { --solution-surface: var(--color-green-100); --solution-ink: var(--color-green-700); }
.mega-solution-monitoring { --solution-surface: var(--color-orange-100); --solution-ink: var(--color-orange-800); }
.mega-solution:hover, .mega-solution:focus-visible, .mega-solution[aria-current="page"] { border-color: var(--solution-ink); }
.mega-icon { display: grid; flex: 0 0 2.8rem; width: 2.8rem; height: 2.8rem; place-items: center; border: 0; border-radius: .7rem; background: var(--color-white); color: var(--solution-ink); }
.mega-icon svg { width: 1.35rem; height: 1.35rem; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.mega-solution strong { display: block; margin: 0 0 0.5rem; color: var(--color-navy-900); font-size: var(--type-small); line-height: 1.4; letter-spacing: -.02em; }
.mega-solution p { margin: 0; color: var(--color-navy-800); font-size: var(--type-small); line-height: 1.6; }
.nav-link:focus-visible, .nav-disclosure:focus-visible, .nav-mobile-toggle:focus-visible, .nav-contact:focus-visible, .mega-panel a:focus-visible { outline: 2px solid var(--color-gold-500); outline-offset: 3px; }
@media (max-width: 64rem) {
  .site-header-modern .nav-shell { gap: 1rem; }
  .nav-link, .nav-disclosure { padding-inline: 0.75rem; }
  .nav-contact { margin-left: 0.5rem; }
  .mega-solution { gap: 0.75rem; padding-inline: 0.5rem; }
}
@media (max-width: 54rem) {
  .site-header.site-header-modern { min-height: 4.25rem; }
  .site-header-modern .nav-shell { min-height: 4.25rem; flex-wrap: wrap; row-gap: .5rem; }
  .site-header-modern .brand { font-size: 1rem; }
  .nav-mobile-toggle { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0.25rem; width: 2.75rem; height: 2.75rem; border: 1px solid var(--color-dark-border); border-radius: .5rem; background: transparent; color: var(--color-white); }
  .nav-mobile-toggle span { display: block; width: 1.1rem; height: 1.5px; background: currentColor; transition: transform 160ms; }
  .nav-mobile-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.2px) rotate(45deg); }
  .nav-mobile-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.2px) rotate(-45deg); }
  .primary-nav { position: absolute; top: calc(100% + 1px); left: calc(var(--space-gutter) * -1); right: calc(var(--space-gutter) * -1); display: none; align-items: stretch; flex-direction: column; gap: 0.25rem; max-height: 70dvh; overflow-y: auto; overscroll-behavior: contain; padding: 0.75rem var(--space-gutter) calc(1.25rem + env(safe-area-inset-bottom, 0px)); border-bottom: 1px solid var(--color-border); background: var(--color-navy-900); box-shadow: 0 .5rem 1.5rem var(--color-shadow); }
  .primary-nav.is-open { display: flex; }
  .nav-link, .nav-disclosure { justify-content: space-between; width: 100%; min-height: 2.8rem; padding-inline: 0.75rem; font-size: var(--type-small); text-align: left; }
  .nav-contact { align-self: stretch; margin: 0.75rem 0 0; }
  .mega-panel { position: static; width: 100%; flex-shrink: 0; margin: 0.25rem 0 0.5rem; border: 1px solid var(--color-border); border-radius: .7rem; box-shadow: none; }
  .mega-topline { padding: 1.25rem 1rem 0.5rem; }
  .mega-solutions { grid-template-columns: 1fr; gap: .5rem; padding: 0 0.5rem 0.5rem; }
  .mega-solution { gap: 0.75rem; padding: 1rem 0.75rem; }
  .mega-solution strong { font-size: var(--type-small); }
  .mega-solution p { margin-bottom: 0; }
  .mega-icon { flex-basis: 2.4rem; width: 2.4rem; height: 2.4rem; }
}
