.bds-mega-header {
  --mega-rule: var(--bds-color-charcoal);
  container-type: inline-size;
  color: var(--bds-color-charcoal-950);
  background: var(--bds-color-paper);
  position: relative;
  z-index: 100;
  padding-inline: 24px;
  margin-bottom: var(--bds-space-5);
}
.bds-mega-header :is(a, button, h2, p, span, strong) { letter-spacing: 0; }
.bds-mega-header [hidden] { display: none !important; }
.bds-mega-header :is(a, button) {
  color: inherit;
  box-shadow: none;
  text-decoration: none;
  border-radius: 0;
}
.bds-mega-header button { cursor: pointer; }
.bds-mega-header :is(a, button):focus-visible {
  outline: 3px solid var(--bds-color-flame);
  outline-offset: 3px;
}
.bds-mega-header .bi { display: inline-flex; flex: none; align-items: center; justify-content: center; }
.bds-mega-header .bi::before { line-height: 1; }
.bds-mega-header__bar {
  position: relative;
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr) minmax(0, auto);
  align-items: center;
  gap: var(--bds-space-4);
  min-height: 116px;
  padding: 14px 32px;
  max-width: calc(var(--layout-content-max) - 48px);
  margin-inline: auto;
  border-bottom: 1px solid var(--bds-color-border);
}
.bds-mega-header__bar::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: -1px;
  height: 1px;
  background: var(--bds-color-border);
  box-shadow: 0 0 0 100vmax var(--bds-color-border);
  clip-path: inset(0 -100vmax);
  pointer-events: none;
}
.bds-mega-header__logo { display: inline-flex; align-items: center; width: 86px; height: 88px; border: 0; }
.bds-mega-header__logo img { display: block; object-fit: contain; width: 78px; height: 84px; }
.bds-mega-header__desktop-nav { display: flex; align-items: center; justify-content: center; gap: 28px; min-width: 0; }
.bds-mega-header__desktop-nav > :is(a, button) {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 48px;
  padding: 0;
  border: 0;
  background: none;
  font: 500 1rem / 1.2 var(--bds-font-ui, "Roboto Condensed", Arial, sans-serif);
  text-transform: uppercase;
  white-space: nowrap;
  position: relative;
}
.bds-mega-header__desktop-nav > :is(a, button)::after {
  content: "";
  position: absolute;
  inset: auto 0 3px;
  height: 3px;
  background: var(--bds-color-flame);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 160ms ease;
}
.bds-mega-header__desktop-nav > :is(:hover, :focus-visible, [aria-expanded="true"])::after { transform: scaleX(1); }
.bds-mega-header .bi-chevron-down { font-size: 0.875rem; transition: transform 180ms ease; }
.bds-mega-header [aria-expanded="true"] > .bi-chevron-down { transform: rotate(180deg); }
.bds-mega-header .bds-mega-header__account {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  max-width: 220px;
  min-height: 48px;
  padding: 0;
  border: 0;
  background: none;
  font: 500 0.875rem / 1.3 var(--font-body);
  text-transform: none;
  overflow-wrap: anywhere;
}
.bds-mega-header__account:hover { color: var(--bds-color-flame-700); }
.bds-mega-header__account:is(:hover, :focus-visible) > span:last-child { text-decoration: underline; text-underline-offset: 0.2em; }
.bds-mega-header__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--bds-color-paper-deeper);
  font-family: var(--bds-font-ui);
}
.bds-mega-header__avatar img { width: 100%; height: 100%; object-fit: cover; object-position: var(--mega-avatar-position, 50% 50%); transform: scale(var(--mega-avatar-scale, 1)); }
.bds-mega-header__anonymous { width: 40px; height: 40px; font-size: 40px; }
.bds-mega-header__panel, .bds-mega-header__mobile-nav {
  position: relative;
  background: var(--bds-color-charcoal-950);
  color: var(--bds-color-white);
}
.bds-mega-header__desktop-panels,
.bds-mega-header .bds-mega-header__mobile-nav {
  position: absolute;
  inset-inline: 0;
  top: 100%;
  max-height: var(--mega-available-height, calc(100dvh - 116px));
  overflow-y: auto;
  overscroll-behavior: contain;
  box-shadow: 0 10px 16px rgb(0 0 0 / 12%);
}
.bds-mega-header__panel { padding-block-start: var(--bds-space-6); }
.bds-mega-header__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
  gap: var(--bds-space-7);
  max-width: 1120px;
  margin-inline: auto;
  padding: 0 var(--bds-space-6) 58px;
}
.bds-mega-header__intro { min-width: 0; border-right: 1px solid var(--mega-rule); padding-right: var(--bds-space-6); }
.bds-mega-header__number { color: var(--bds-color-sun); font: 400 0.75rem / 1.4 var(--bds-font-mono); text-transform: uppercase; }
.bds-mega-header__intro h2 {
  margin: 18px 0 0;
  color: inherit;
  font: 300 3.25rem / 1 var(--font-body);
  text-transform: none;
  overflow-wrap: anywhere;
}
.bds-mega-header__intro p { margin: 25px 0 0; max-width: 22ch; color: var(--bds-color-charcoal-100); font: 300 1.25rem / 1.3 var(--font-body); }
.bds-mega-header__intro-link { display: inline-flex; align-items: center; gap: 0.5rem; border: 0; }
.bds-mega-header__intro-link > .bi { color: var(--bds-color-sun); }
.bds-mega-header__intro-link:is(:hover, :focus-visible) { color: var(--bds-color-sun); }
.bds-mega-header__links { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; border-top: 1px solid var(--mega-rule); min-width: 0; }
.bds-mega-header__link { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 14px; align-items: center; min-height: 76px; padding: 13px 0; border: 0; border-bottom: 1px solid var(--mega-rule); }
.bds-mega-header__copy { display: grid; gap: 5px; min-width: 0; }
.bds-mega-header__copy strong { color: var(--bds-color-white); font: 400 1.75rem / 1.15 var(--font-body); }
.bds-mega-header__copy > span { color: var(--bds-color-charcoal-100); font: 300 1rem / 1.3 var(--font-body); }
.bds-mega-header__link > .bi, .bds-mega-header__mobile-links .bi { color: var(--bds-color-sun); transition: transform 150ms ease; }
.bds-mega-header a > .bi-arrow-right-short { width: 1.75rem; height: 1.75rem; font-size: 1.75rem; }
.bds-mega-header__link:is(:hover, :focus-visible) strong { color: var(--bds-color-sun); }
.bds-mega-header__link:is(:hover, :focus-visible) > .bi { transform: translateX(3px); }
.bds-mega-header__close { display: flex; gap: 7px; align-items: center; min-height: 44px; position: absolute; bottom: 7px; right: 18px; padding: 0 10px; background: none; border: 0; font: 500 0.75rem / 1.2 var(--bds-font-ui); text-transform: uppercase; }
.bds-mega-header__close:hover { color: var(--bds-color-sun); }
.bds-mega-header__mobile-toggle, .bds-mega-header__mobile-nav { display: none; }
.bds-mega-header [data-mega-panel] {
  transition: max-height .3s ease, padding-block-start .3s ease, padding-block-end .3s ease;
}
.bds-mega-header [data-mega-panel]:is(.is-opening, .is-closing, .is-measuring) { overflow: hidden; }
.bds-mega-header [data-mega-panel].is-measuring { transition: none; }
.bds-mega-header [data-mega-panel].is-closing { pointer-events: none; }
@container (max-width: 1100px) {
  .bds-mega-header__desktop-nav { gap: 18px; }
  .bds-mega-header__bar { padding-inline: 24px; gap: 18px; }
}
@container (max-width: 920px) {
  .bds-mega-header__desktop-nav, .bds-mega-header__desktop-panels { display: none; }
  .bds-mega-header__bar { grid-template-columns: minmax(52px, 1fr) minmax(0, auto) 76px; gap: 8px; padding: 8px; min-height: 84px; }
  .bds-mega-header__logo { width: 54px; height: 66px; }
  .bds-mega-header__logo img { width: 52px; height: 56px; }
  .bds-mega-header .bds-mega-header__account { font-size: 0.75rem; gap: 6px; min-height: 44px; }
  .bds-mega-header__avatar { flex-basis: 34px; width: 34px; height: 34px; }
  .bds-mega-header__anonymous { width: 34px; height: 34px; font-size: 34px; }
  .bds-mega-header__mobile-toggle { display: inline-flex; align-items: center; justify-content: center; width: 76px; min-width: 76px; min-height: 44px; padding: 0 7px; border: 2px solid var(--bds-color-charcoal-950); border-radius: 6px; gap: 5px; background: none; font: 500 0.75rem / 1.2 var(--bds-font-ui); text-transform: uppercase; }
  .bds-mega-header__mobile-toggle > .bi { width: 18px; font-size: 18px; }
  .bds-mega-header__mobile-toggle > span { width: 34px; text-align: left; }
  .bds-mega-header__mobile-nav { display: block; }
  .bds-mega-header__mobile-direct, .bds-mega-header__mobile-section > button { width: 100%; min-height: 66px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; border: 0; border-bottom: 1px solid var(--mega-rule); padding: 0 20px; background: none; font: 500 1rem / 1.3 var(--bds-font-ui); text-transform: uppercase; text-align: left; }
  .bds-mega-header__mobile-section > button { grid-template-columns: 20px minmax(0, 1fr) auto; }
  .bds-mega-header .bds-mega-header__donate { color: var(--bds-color-sun); }
  .bds-mega-header__mobile-content { background: var(--bds-color-charcoal-900); border-bottom: 1px solid var(--mega-rule); padding: 20px; }
  .bds-mega-header__mobile-content > p { color: var(--bds-color-charcoal-100); max-width: 28ch; margin: 0 0 17px; font: 300 1.125rem / 1.3 var(--font-body); }
  .bds-mega-header__mobile-links { border-top: 1px solid var(--mega-rule); }
  .bds-mega-header__mobile-links a { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 51px; padding: 7px 0; border: 0; border-bottom: 1px solid var(--mega-rule); font: 400 1.125rem / 1.3 var(--font-body); }
  .bds-mega-header__mobile-links a:is(:hover, :focus-visible) { color: var(--bds-color-sun); }
}
@media (prefers-reduced-motion: reduce) {
  .bds-mega-header *, .bds-mega-header *::after { animation: none !important; transition: none !important; }
}
@media (max-width: 600px) {
  .bds-mega-header { padding-inline: 16px; }
}
