.site-header { position: sticky; top: 0; z-index: 20; min-height: var(--header-height); background: var(--surface); border-bottom: 1px solid var(--line); }
.header-inner { min-height: var(--header-height); display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.brand { display: flex; align-items: center; text-decoration: none; min-width: 0; }
.brand-logo { width: 200px; height: auto; }
.header-actions { display: flex; align-items: center; gap: var(--space-4); }
.language-switch { display: flex; align-items: center; gap: 2px; padding: 4px; border: 1px solid #60778a; border-radius: 999px; background: var(--navy-dark); }
.language-option { width: 36px; height: 36px; padding: 0; border: 0; border-radius: 999px; background: transparent; color: #c7d2db; font-size: var(--text-xs); font-weight: 800; }
.language-option[aria-pressed='true'] { background: var(--accent); color: white; box-shadow: 0 2px 8px #b92c1840; }
.language-option:hover:not([aria-pressed='true']) { color: white; background: #173b58; }
.header-contact-sales { min-height: 44px; padding: 0 18px; border: 1px solid #7890a3; border-radius: 9px; background: var(--navy-dark); color: white; font-size: var(--text-xs); font-weight: 800; letter-spacing: .02em; white-space: nowrap; }
.header-contact-sales:hover { border-color: var(--accent); background: #12334f; }
.header-contact-sales--menu { display: none; width: 100%; }
.header-nav-links { display: flex; align-items: center; gap: var(--space-4); }
.header-section-link { display: flex; align-items: center; min-height: 44px; font-size: var(--text-sm); font-weight: 700; letter-spacing: .01em; text-decoration: none; white-space: nowrap; }
.header-section-link:hover { color: var(--accent-dark); }
.header-menu { min-width: 44px; min-height: 44px; padding: 6px; font-size: 11px; border: 1px solid var(--line); background: var(--surface); color: var(--navy); }
@media (max-width: 1200px) { .brand-logo { width: 164px; } }
@media (max-width: 999px) {
  .header-nav-links { position: absolute; top: 100%; left: var(--page-gutter); right: var(--page-gutter); padding: var(--space-4); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); display: grid; }
  .header-contact-sales--desktop { display: none; }
  .header-contact-sales--menu { display: inline-flex; align-items: center; justify-content: center; }
}
@media (max-width: 760px) {
  :root { --header-height: 72px; }
  .brand-logo { width: 132px; }
  .header-actions { gap: 8px; }
  .language-switch { padding: 3px; }
  .language-option { width: 33px; height: 33px; }
}
@media (max-width: 480px) {
  .brand-logo { width: 96px; }
  .header-inner, .header-actions { gap: 6px; }
  .language-option { width: 31px; height: 31px; }
  .header-menu { width: 42px; min-width: 42px; }
}
@media (max-width: 360px) {
  .brand-logo { width: 80px; }
  .language-option { width: 29px; height: 29px; font-size: 10px; }
  .language-switch { gap: 0; }
  .header-menu { max-width: 40px; min-width: 40px; overflow-wrap: anywhere; }
}
#find-your-sign, #product-lookup, #contact { scroll-margin-top: calc(var(--header-height) + 20px); }

/* CONTACT SALES → direct channels (call, WhatsApp, Zalo). */
.header-contact { position: relative; }
.header-contact-panel {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 30; width: 280px; padding: 8px;
  border: 1px solid var(--hyperion-border, #cbd9e3); border-top: 3px solid var(--hyperion-red, #e63720);
  border-radius: 8px; background: #fff; box-shadow: 0 16px 36px rgb(8 34 56 / 18%);
}
.contact-options { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.contact-option {
  display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 12px;
  border-radius: 6px; color: var(--hyperion-navy-950, #06263d); text-decoration: none;
  transition: background .15s ease;
}
.contact-option:hover { background: var(--hyperion-red-soft, #fff2ee); }
.contact-option-icon { width: 40px; height: 40px; flex: 0 0 40px; object-fit: contain; }
.contact-option-copy { display: grid; min-width: 0; }
.contact-option-title { font-size: var(--text-base); font-weight: 700; line-height: 1.3; }
.contact-option-detail { color: var(--muted); font-size: var(--text-sm); white-space: nowrap; font-variant-numeric: tabular-nums; }
.header-contact-menu { display: none; }
@media (max-width: 999px) {
  .header-contact-menu { display: block; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--hyperion-border-soft, #dce6ed); }
  .header-contact-menu-title { margin-bottom: 4px; padding-inline: 12px; color: var(--muted); font-size: var(--text-sm); font-weight: 700; letter-spacing: .08em; }
}