.nvc-header {
  display: flex;
  align-items: center;
  gap: 16px;
  inline-size: 100%;
  max-inline-size: var(--nvc-frame);
  min-block-size: 96px;
  margin-inline: auto;
  padding: 24px 48px;
  background: var(--nvc-paper);
}

.nvc-header-brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.nvc-header-brand img { inline-size: 290px; block-size: auto; }
.nvc-header-actions { display: flex; align-items: center; gap: 10px; margin-inline-start: auto; }
.nvc-header-actions .nvc-button { font-size: 13px; white-space: nowrap; }
.nvc-header-question,
.nvc-header-faq { --button-border: var(--nvc-line); gap: 9px; min-block-size: 44px; padding: 11px 15px; font-weight: 400; }
.nvc-header-actions .nvc-header-diagnostic { gap: 24px; padding: 14px 20px; font-size: 14px; }
.nvc-header-menu { --button-border: var(--nvc-line); flex: 0 0 auto; gap: 16px; min-block-size: 48px; padding: 0 18px; font-size: 13px; }
.nvc-header-menu i { position: relative; inline-size: 20px; block-size: 14px; flex: 0 0 auto; }
.nvc-header-menu i::before,
.nvc-header-menu i::after { content: ''; position: absolute; inset-inline-start: 0; inline-size: 100%; block-size: 2px; border-radius: 2px; background: currentColor; }
.nvc-header-menu i::before { inset-block-start: 2px; box-shadow: 0 4px 0 currentColor; }
.nvc-header-menu i::after { inset-block-start: 10px; }

@media (max-width: 1100px) {
  .nvc-header-question span { display: none; }
}

@media (max-width: 1000px) {
  .nvc-header-brand img { inline-size: 220px; }
}

@media (max-width: 900px) {
  .nvc-header { padding: 20px 24px; }
}

@media (max-width: 700px) {
  .nvc-header { flex-wrap: wrap; gap: 7px; min-block-size: 74px; padding: 14px; }
  .nvc-header-brand img { inline-size: 165px; }
  .nvc-header-actions { gap: 5px; }
  .nvc-header-question { display: none; }
  .nvc-header-faq { padding: 8px; min-block-size: 36px; }
  .nvc-header-faq span { display: none; }
  .nvc-header-actions .nvc-header-diagnostic { gap: 0; min-block-size: 36px; padding: 10px; font-size: 11px; }
  .nvc-header-diagnostic svg { display: none; }
  .nvc-header-menu { gap: 8px; min-block-size: 36px; padding: 0 10px; font-size: 11px; }
  .nvc-header-menu i { inline-size: 18px; }
}

@media (max-width: 420px) {
  .nvc-header { gap: 5px; padding-inline: 10px; }
  .nvc-header-brand img { inline-size: 165px; }
  .nvc-header-actions .nvc-header-diagnostic { padding-inline: 8px; font-size: 10px; }
  .nvc-header-menu { gap: 0; padding-inline: 9px; font-size: 0; }
  .nvc-header-faq { display: none; }
}

@media (max-width: 359px) {
  .nvc-header-faq { display: none; }
}