/* Site chrome for the companion pages (About, Compare): the landing's nav and
   buttons, copied from broadcast-landing.css and scoped under .hn so the
   companion's own .nav/.button rules can't collide. One look across the site. */
.hn{ --hn-bg:#0a0b0e; --hn-line:#23262f; --hn-line2:#30343f; --hn-ink:#f4f5f7;
  --hn-body:#c4c8d0; --hn-dim:#7f848f; --hn-id:#2348d9; }
.hn{ position:sticky; top:0; z-index:50; }
.hn-nav{ display:flex; align-items:center; justify-content:space-between;
  padding:18px 32px; background:color-mix(in srgb,var(--hn-bg) 80%,transparent);
  -webkit-backdrop-filter:blur(14px) saturate(140%); backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--hn-line); font-family:"Libre Franklin",sans-serif; }
.hn-lockup{ display:flex; align-items:center; gap:11px; text-decoration:none; }
.hn-lockup img{ display:block; width:112px; height:auto; }
.hn-pipe{ color:var(--hn-line2); font-weight:300; }
.hn-ed{ font-size:12px; color:var(--hn-dim); font-weight:600; letter-spacing:.04em; }
.hn-links{ display:flex; align-items:center; gap:22px; }
.hn-links a{ font-size:13px; font-weight:600; color:var(--hn-dim); text-decoration:none; white-space:nowrap;
  border-bottom:1px solid transparent; padding-bottom:2px; line-height:normal; min-height:0; transition:color .18s ease, border-color .18s ease; }
.hn-links a:hover{ color:var(--hn-body); }
.hn-links a[aria-current="page"]{ color:var(--hn-ink); border-bottom-color:color-mix(in srgb,var(--hn-id) 55%,var(--hn-line)); }
@media(max-width:760px){ .hn-pipe,.hn-ed{ display:none; } .hn-links{ gap:16px; } }
@media(max-width:640px){ .hn-nav{ flex-wrap:wrap; row-gap:13px; } .hn-links{ order:3; width:100%; gap:20px; } }

/* Buttons: same shape, weight and blue as the landing's .btn. */
.button{ font-family:"Libre Franklin",sans-serif; font-weight:800; font-size:14px; letter-spacing:.02em;
  padding:14px 26px; border-radius:11px; line-height:1; min-height:0; gap:9px; }
.button.primary{ background:#2348d9; border-color:transparent; color:#fff; }
.button.primary:hover{ background:#2348d9; filter:brightness(1.08); }
.button.outline{ background:transparent; color:#c4c8d0; border:1px solid #30343f; }
.button.outline:hover{ border-color:#7f848f; color:#f4f5f7; }
.hn-nav .button{ padding:10px 18px; font-size:13px; }
.hn-h3-pipe{ color:#30343f; font-weight:300; margin:0 .15em; }
