/* One OFFREA header across the marketing site, articles and working tools. */
.nav { background:var(--navy); border-bottom:1px solid #ffffff26; color:#fff; }
.nav .brand,.nav nav a { color:#fff; }
.nav .button.compact { color:#fff; background:var(--accent); border-color:var(--accent); box-shadow:none; }
.nav .button.compact:hover { background:#153769; border-color:#153769; transform:none; }
.nav .nav-inner { min-height:80px; gap:1.5rem; }
.nav .desktop-nav { display:flex; gap:1.4rem; flex-wrap:nowrap; margin-left:auto; }
.nav nav a { font-size:.85rem; white-space:nowrap; }
.nav nav a[aria-current] { color:#fff; text-decoration-color:var(--accent); }
.mobile-menu { display:none; }
.page-heading,.tool-heading { background:var(--navy); color:#fff; box-shadow:0 0 0 100vmax var(--navy); clip-path:inset(0 -100vmax); border-color:#ffffff26; }
.page-heading h1,.page-heading a,.tool-heading h1,.tool-heading a { color:#fff; }
.page-heading .lead,.page-heading .eyebrow,.page-heading .article-meta,.tool-heading .lead,.tool-heading .tool-meta,.tool-heading .breadcrumbs { color:#d1d9e6; }
@media(max-width:1050px) {
  .nav .desktop-nav { display:none; }
  .nav .nav-inner { display:flex; flex-wrap:nowrap; gap:1rem; min-height:72px; padding-block:.6rem; }
  .nav .brand { margin-right:auto; font-size:1.35rem; }
  .mobile-menu { display:block; order:3; }
  .mobile-menu summary { min-height:44px; display:flex; align-items:center; cursor:pointer; padding:.5rem .65rem; font-size:.875rem; border:1px solid #ffffff50; list-style:none; }
  .mobile-menu summary::-webkit-details-marker { display:none; }
  .mobile-menu summary::after { content:'+'; font-size:1.25rem; margin-left:.7rem; line-height:1; }
  .mobile-menu[open] summary::after { content:'−'; }
  .nav .mobile-menu nav { position:absolute; inset:100% 0 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:0; padding:1rem max(1.25rem,calc((100% - 1180px)/2)); background:var(--navy); border-bottom:1px solid #ffffff40; gap:.25rem 2rem; box-shadow:0 16px 24px #0003; }
  .nav .mobile-menu nav a { padding:.5rem; min-height:48px; font-size:1rem; }
  .nav .button.compact { margin:0; font-size:.75rem; padding:.65rem .75rem; min-height:44px; gap:.5rem; }
}
@media(max-width:400px) {
  .nav .nav-inner { gap:.5rem; }
  .nav .brand { font-size:1.12rem; }
  .nav .button.compact { font-size:.68rem; padding:.55rem .6rem; }
  .nav .button.compact span { display:none; }
  .mobile-menu summary { font-size:.75rem; padding:.4rem .5rem; }
  .mobile-menu summary::after { margin-left:.4rem; }
}
