/* ==========================================================================
   Gas Works — shared site header, matched to gasworks.net.au
   White top bar (logo, tagline, showroom numbers) over the orange nav bar.
   Self-contained: only depends on a .container class from the page stylesheet.
   ========================================================================== */

:root {
  --gw-orange: #F59331;
  --gw-red: #E75130;
  --gw-blue: #52C7DC;
  --gw-dark: #323A45;
  --gw-grey: #333333;
  --gw-nav-font: "Poppins", "Helvetica Neue", Arial, sans-serif;
}

.gw-header { font-family: var(--gw-nav-font); }

.gw-header__top { background: #fff; width: 100%; }
.gw-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding-block: .9rem; }
.gw-header .container { max-width: 1440px; }
.gw-header__logo img { height: 3.1rem; width: auto; }
.gw-header__right { display: none; align-items: flex-end; flex-direction: column; gap: .6rem; }
.gw-header__tagline { height: 1.8rem; width: auto; }
.gw-header__stores { display: flex; align-items: center; }
.gw-header__store { display: grid; text-align: right; text-decoration: none; padding-inline: .9rem; line-height: 1.25; }
.gw-header__store + .gw-header__store { border-left: 1px solid #D8D8D8; }
.gw-header__store:last-child { padding-right: 0; }
.gw-header__store span { color: var(--gw-orange); font-size: .78rem; font-weight: 500; letter-spacing: .02em; text-transform: uppercase; }
.gw-header__store strong { color: var(--gw-grey); font-weight: 400; font-size: .95rem; }

.gw-nav { position: sticky; top: 0; z-index: 50; background: var(--gw-orange); color: #fff; }
.gw-nav__row { display: flex; align-items: stretch; justify-content: space-between; min-height: 3.6rem; }
.gw-nav__links { display: none; }
.gw-nav__actions { display: none; }
.gw-nav__mobile { display: flex; align-items: center; margin-left: auto; }
.gw-nav__mobile a { display: grid; place-items: center; width: 3.25rem; height: 3.6rem; color: #fff; border-left: 1px solid rgba(255,255,255,.35); }
.gw-nav__mobile svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.nav-toggle { display: inline-grid; place-items: center; width: 3.25rem; height: 3.6rem; margin-left: -.75rem; border: 0; background: transparent; cursor: pointer; color: #fff; }
.nav-toggle span { display: block; width: 22px; height: 2px; background: currentColor; position: relative; border-radius: 2px; }
.nav-toggle span::before, .nav-toggle span::after { content: ""; position: absolute; left: 0; width: 22px; height: 2px; background: currentColor; border-radius: 2px; }
.nav-toggle span::before { top: -7px; } .nav-toggle span::after { top: 7px; }

.mobile-nav { display: none; background: #fff; border-bottom: 1px solid #E5E5E5; font-family: var(--gw-nav-font); color: var(--gw-grey); }
.mobile-nav[data-open="true"] { display: block; }
.mobile-nav ul { padding-block: .25rem .75rem; margin: 0; list-style: none; }
.mobile-nav a { display: block; padding: .85rem 0; text-decoration: none; font-size: .95rem; font-weight: 500; text-transform: uppercase; letter-spacing: .03em; border-bottom: 1px solid #EEE; color: var(--gw-grey); }
.mobile-nav li:last-child a { border-bottom: 0; }
.mobile-nav a.is-emergency { color: var(--gw-red); }

@media (min-width: 1100px) {
  .gw-header__right { display: flex; }
  .gw-nav__mobile, .nav-toggle, .mobile-nav { display: none !important; }
  .gw-nav__links { display: flex; align-items: stretch; margin: 0; padding: 0; list-style: none; }
  .gw-nav__links li { display: flex; align-items: stretch; }
  .gw-nav__links a { display: flex; align-items: center; gap: .35rem; padding: 0 .65rem; color: #fff; text-decoration: none; font-size: .8rem; font-weight: 500; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; }
  .gw-nav__links li:first-child a { padding-left: 0; }
  .gw-nav__links a:hover { background: rgba(255,255,255,.12); }
  .gw-nav__links svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; opacity: .9; }
  .gw-nav__actions { display: flex; align-items: stretch; margin-right: calc(-1 * var(--gutter, 1.5rem)); }
  .gw-nav__actions a { display: flex; align-items: center; gap: .6rem; padding: 0 1rem; color: #fff; text-decoration: none; font-size: .875rem; font-weight: 500; white-space: nowrap; }
  .gw-nav__search span { display: none; }
  .gw-nav__actions svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
  .gw-nav__search { background: var(--gw-blue); }
  .gw-nav__search:hover { background: #3FB8CF; }
  .gw-nav__emergency { background: var(--gw-red); }
  .gw-nav__emergency:hover { background: #D2452A; }
}
@media (min-width: 1280px) {
  .gw-nav__links a { padding: 0 1.1rem; font-size: .95rem; gap: .4rem; }
  .gw-nav__actions a { padding: 0 1.4rem; font-size: .95rem; }
  .gw-nav__search span { display: inline; }
}
