/* CX24 R84: one readable type system for all public shutter panels. */
.site-header .mega-menu,
.site-header .mobile-nav {
  --menu-link-size: 16px;
  --menu-copy-size: 14px;
  --menu-meta-size: 11px;
  font-family: 'Inter', Arial, sans-serif;
}
.site-header .mega-menu {
  max-height: calc(100vh - 84px);
  max-height: calc(100dvh - 84px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.site-header .mega-panel {
  min-height: 0;
  padding: 30px clamp(24px,2.25vw,36px);
  grid-template-columns: minmax(210px,.55fr) minmax(0,2.45fr);
  gap: clamp(24px,2.5vw,40px);
  align-items: start;
}
.site-header .mega-panel-lead { min-width: 0; align-self: stretch; }
.site-header .mega-panel-lead > span {
  font: 600 var(--menu-meta-size)/1.5 'Inter', Arial, sans-serif;
  letter-spacing: .1em;
}
.site-header .mega-panel-lead h2 {
  font: 500 30px/1.16 'Inter', Arial, sans-serif;
  letter-spacing: -.04em;
  margin: 16px 0;
  overflow-wrap: break-word;
}
.site-header .mega-panel-lead > p {
  font: 400 var(--menu-copy-size)/1.6 'Inter', Arial, sans-serif;
  color: #a3b7c4;
}
.site-header .mega-panel-lead > div { margin-block: 22px; gap: 8px; }
.site-header .mega-panel-lead > div small {
  font: 500 var(--menu-meta-size)/1.5 'Inter', Arial, sans-serif;
  color: #a3b7c4;
}
.site-header .mega-panel-lead > a {
  min-height: 44px;
  margin-top: auto;
  padding-block: 10px;
  font: 500 var(--menu-link-size)/1.45 'Inter', Arial, sans-serif;
}
.site-header .mega-capability-group { padding: 16px; min-width: 0; }
.site-header .mega-capability-group > a {
  min-height: 104px;
  padding-bottom: 18px;
  grid-template-columns: 18px minmax(0,1fr) 14px;
  gap: 10px;
}
.site-header .mega-capability-group > a span { min-width: 0; gap: 7px; }
.site-header .mega-capability-group nav a {
  min-height: 48px;
  padding: 11px 0;
  grid-template-columns: 18px minmax(0,1fr) 14px;
  gap: 10px;
  font: 500 var(--menu-link-size)/1.45 'Inter', Arial, sans-serif;
  color: #d9e7ef;
}
.site-header .mega-capability-group nav a > span { min-width: 0; overflow-wrap: break-word; }
.site-header .mega-panel-links > a {
  min-height: 124px;
  padding: 20px;
  grid-template-columns: 18px minmax(0,1fr) 14px;
  gap: 12px;
}
.site-header .mega-capability-group > a b,
.site-header .mega-panel-links > a b {
  font: 500 var(--menu-link-size)/1.45 'Inter', Arial, sans-serif;
  color: #e8f2f7;
  overflow-wrap: break-word;
}
.site-header .mega-capability-group > a small,
.site-header .mega-panel-links > a small {
  font: 400 var(--menu-copy-size)/1.5 'Inter', Arial, sans-serif;
  max-width: none;
  color: #a3b7c4;
  overflow-wrap: break-word;
}
.site-header .mega-capability-group > a em,
.site-header .mega-capability-group nav a em,
.site-header .mega-panel-links > a em {
  font: 500 var(--menu-meta-size)/1.5 'Inter', Arial, sans-serif;
  color: #8fa8b8;
  padding-top: 3px;
}
.site-header .mega-capability-group > a i,
.site-header .mega-capability-group nav a i,
.site-header .mega-panel-links > a i {
  font: 400 var(--menu-link-size)/1.45 'Inter', Arial, sans-serif;
}
.site-header .mega-panel-links > a > span { gap: 7px; }
.site-header .mobile-nav a,
.site-header .mobile-nav a b,
.site-header .mobile-nav .mobile-title {
  font: 500 var(--menu-link-size)/1.45 'Inter', Arial, sans-serif;
}
.site-header .mobile-nav a { min-height: 44px; padding: 12px 10px; gap: 4px; }
.site-header .mobile-nav a b { color: #e8f2f7; }
.site-header .mobile-nav a small {
  margin-top: 0;
  font: 400 var(--menu-copy-size)/1.5 'Inter', Arial, sans-serif;
  color: #a3b7c4;
}
.site-header .mobile-nav .mobile-title { gap: 12px; flex-wrap: wrap; }
.site-header .mobile-nav .mobile-title span {
  font: 500 var(--menu-meta-size)/1.5 'Inter', Arial, sans-serif;
  letter-spacing: .04em;
}
.site-header .mobile-nav .pbm-mobile-feature { padding: 16px 12px; }
/* Preserve readable text on small desktops by using the full panel width. */
@media (min-width: 901px) and (max-width: 1280px) {
  .site-header .mega-panel { grid-template-columns: minmax(0,1fr); padding: 24px; }
  .site-header .mega-panel-lead { display: none; }
  .site-header .mega-capability-group { padding: 14px; }
}
@media (max-width: 900px) {
  .site-header .mobile-nav { padding: 16px; }
  .site-header .mobile-nav > div { padding-block: 8px 16px; }
}
@media (min-width: 1521px) {
  .site-header .mega-menu { padding-inline: max(0px,calc((100% - 1520px)/2)); }
}