/* === css/intel-building/layout/header/header-responsive.css === v1.0.0 ===
   Intel Building (new theme) — header responsive rules.
   Mobile-first: header.css holds the small-screen base, this file scales it
   up. Breakpoints match CSS-STANDARDS.md (sm 576 / md 768 / lg 992).
   The lg step below reproduces Frame 2.png's desktop spec exactly:
   82px-tall pill, 32px horizontal padding, 155x50 logo, full nav row. */

/* sm — large phones */
@media (min-width: 576px) {
  .plx-header-bar {
    padding: var(--space-3) var(--space-5);
  }
}

/* md — tablets */
@media (min-width: 768px) {
  .plx-logo-svg {
    width: 140px;
    height: 45px;
  }
}

/* lg — nav breakpoint, full Frame 2.png spec */
@media (min-width: 992px) {
  .plx-header-bar {
    height: var(--header-height);
    min-height: 0;
    padding: 0 var(--space-8);
  }

  .plx-logo-svg {
    width: 155px;
    height: 40px;
  }

  .plx-nav {
    display: flex;
  }

  .plx-nav-toggle {
    display: none;
  }

  /* Sticky-scrolled state (see header.css) — height is fixed at this
     breakpoint rather than content-driven, so it needs its own override. */
  .plx-site-header--overlay[data-plx-scrolled="true"] .plx-header-bar {
    height: 64px;
  }
}
