/* ==========================================================================
   Header – CSS custom properties
   ========================================================================== */

:root {
  --header-primary:        #a3293e;
  --header-primary-light:  rgba(163, 41, 62, 0.08);
  --header-primary-hover:  rgba(163, 41, 62, 0.14);
  --header-text:           #1a1a1a;
  --header-text-muted:     #717182;
  --header-bg:             #ffffff;
  --header-topbar-bg:      #fdf2f4;
  --header-nav-bg:         #fafafa;
  --header-border:         #ebebf0;
  --header-shadow:         0 2px 8px rgba(0, 0, 0, 0.06);
  --header-badge-size:     18px;
  --header-radius:         8px;
  --header-transition:     140ms ease;
  --header-z:              1000;
  --header-height:         72px;
  --header-dropdown-z:     1001;
}

/* ==========================================================================
   Header wrapper
   ========================================================================== */

.Header-main {
  position: relative;
  width: 100%;
  z-index: var(--header-z);
  background: var(--header-bg);
  box-shadow: var(--header-shadow);
}

/* ==========================================================================
   Main header row
   ========================================================================== */

.Header-bg {
  background: var(--header-bg);
  position: relative;
  z-index: 10;
}

.Header-inner {
  display: flex;
  align-items: center;
  gap: 12px;
  height: var(--header-height);
}

/* Logo */
.Header-logo {
  flex-shrink: 0;
}

.Header-logo .site-logo img,
.Header-logo img {
  height: 40px;
  width: auto;
  display: block;
}

/* Search */
.Header-search {
  flex: 1;
  min-width: 0;
  max-width: 640px;
}

/* Desktop search is always visible inline */
.Header-search--desktop {
  display: block;
}

/* Meta icons */
.Header-meta {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  margin-inline-start: auto;
}

/* Mobile search toggle */
.Header-searchToggle {
  display: none;
  align-items: center;
  justify-content: center;
  padding: 8px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--header-text);
  border-radius: var(--header-radius);
  transition: background var(--header-transition);
  flex-shrink: 0;
}

.Header-searchToggle:hover {
  background: var(--header-primary-light);
}

.Header-metaItem {
  display: flex;
}

/* Mobile toggle */
.Header-mobileToggle {
  display: none;
  position: relative;
  z-index: 1000; /* above the overlay (999) so it remains clickable */
  align-items: center;
  justify-content: center;
  padding: 8px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--header-text);
  border-radius: var(--header-radius);
  transition: background var(--header-transition);
  flex-shrink: 0;
}

.Header-mobileToggle:hover {
  background: var(--header-primary-light);
}

.Header-mobileToggle .Header-closeIcon {
  display: none;
}

.Header-mobileToggle.is-open .Header-burgerIcon {
  display: none;
}

.Header-mobileToggle.is-open .Header-closeIcon {
  display: flex;
}

/* ==========================================================================
   Desktop navigation bar
   ========================================================================== */

.Header-navBar {
  /*background: var(--header-nav-bg);*/
  border-top: 1px solid var(--header-border);
}

/* ==========================================================================
   Mobile menu drawer
   ========================================================================== */

.Header-mobileMenu {
  display: none;
  position: absolute;
  inset-inline: 0;
  top: 100%;
  background: var(--header-bg);
  border-top: 1px solid var(--header-border);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  z-index: 1001;
  max-height: calc(100dvh - 120px);
  overflow-y: auto;
}

.Header-mobileMenu.is-open {
  display: block;
}

.Header-mobileMenuInner {
  display: flex;
  flex-direction: column;
  padding: 8px 16px 16px;
}

.Header-mobileMenuHeader {
  display: none;
}

.Header-mobileMenuTitle {
  font-size: 16px;
  font-weight: 600;
  color: var(--header-text);
}

.Header-mobileMenuClose {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--header-text);
  border-radius: var(--header-radius);
}

.Header-mobileSearch {
  display: none;
}

.Header-mobileAccount {
  order: -1;
  padding-block: 4px 8px;
  border-bottom: 1px solid var(--header-border);
  margin-block-end: 4px;
}

/* Mobile drawer — user info shown inline, dropdown always expanded */
.Header-mobileAccount .HeaderUserMenu-trigger {
  width: 100%;
  padding: 10px 0;
  cursor: default;
}

.Header-mobileAccount .HeaderUserMenu-trigger:hover {
  background: none;
}

.Header-mobileAccount .HeaderUserMenu-info {
  display: flex;
  flex: 1;
}

.Header-mobileAccount .HeaderUserMenu-chevron {
  display: none;
}

.Header-mobileAccount .HeaderUserMenu-dropdown {
  position: static;
  box-shadow: none;
  border: none;
  border-radius: 0;
  padding: 0;
  min-width: auto;
  display: block !important;
  margin-top: 2px;
}

.Header-mobileAccount .HeaderUserMenu-item {
  padding: 10px 4px;
  border-radius: 6px;
}

.Header-mobileAccount .HeaderUserMenu-divider {
  margin: 4px 0;
}

/* Guest links in mobile drawer */
.Header-mobileAccount .HeaderUserMenu-guest {
  padding: 10px 0;
  flex-wrap: wrap;
  gap: 8px;
}

/* ==========================================================================
   Overlay
   ========================================================================== */

.Header-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.2);
  z-index: calc(var(--header-z) - 1);
}

.Header-overlay.is-visible {
  display: block;
}

/* ==========================================================================
   HeaderSearch
   ========================================================================== */

.HeaderSearch {
  position: relative;
  width: 100%;
}

.HeaderSearch-form {
  width: 100%;
}

.HeaderSearch-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  background: #f5f5f8;
  border: 1.5px solid transparent;
  border-radius: 32px;
  transition:
    border-color var(--header-transition),
    background var(--header-transition),
    box-shadow var(--header-transition);
}

.HeaderSearch-wrapper:focus-within {
  background: #fff;
  border-color: #b0b0be;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.06);
}

.HeaderSearch-icon {
  display: none;
}

.HeaderSearch-input {
  flex: 1;
  padding: 10px 48px 10px 20px;
  background: transparent;
  border: none;
  outline: none;
  font-size: 14px;
  color: var(--header-text);
  width: 100%;
  /* Remove browser default search input styles */
  -webkit-appearance: none;
  appearance: none;
}

.HeaderSearch-input::placeholder {
  color: var(--header-text-muted);
}

.HeaderSearch-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  inset-inline-end: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  background: transparent;
  border: none;
  border-radius: 50%;
  color: var(--header-text-muted);
  cursor: pointer;
  flex-shrink: 0;
  transition: color var(--header-transition), background var(--header-transition);
}

.HeaderSearch-submit:hover {
  color: var(--header-primary);
  background: var(--header-primary-light);
}

/* Search dropdown */

.HeaderSearch-dropdown {
  position: absolute;
  inset-inline: 0;
  top: calc(100% + 8px);
  background: #fff;
  border-radius: 16px;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.12),
    0 2px 8px rgba(0, 0, 0, 0.06);
  border: 1px solid var(--header-border);
  z-index: var(--header-dropdown-z);
  max-height: 500px;
  overflow-y: auto;
}

.HeaderSearch-dropdownInner {
  padding: 4px 0;
}

.HeaderSearch-section {
  padding: 12px 16px;
  border-bottom: 1px solid var(--header-border);
}

.HeaderSearch-section:last-child {
  border-bottom: none;
}

.HeaderSearch-sectionHeader {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-block-end: 10px;
}

.HeaderSearch-sectionTitle {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--header-text-muted);
}

.HeaderSearch-viewAll {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--header-primary);
  text-decoration: none;
}

.HeaderSearch-viewAll:hover {
  text-decoration: underline;
}

.HeaderSearch-productItem {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  border-radius: var(--header-radius);
  text-decoration: none;
  color: inherit;
  transition: background var(--header-transition);
}

.HeaderSearch-productItem:hover {
  background: var(--header-primary-light);
}

.HeaderSearch-productThumb {
  width: 48px;
  height: 48px;
  border-radius: var(--header-radius);
  background: #f5f5f8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  color: var(--header-text-muted);
}

.HeaderSearch-productThumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.HeaderSearch-productInfo {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.HeaderSearch-productBrand {
  font-size: 11px;
  color: var(--header-text-muted);
  line-height: 1.4;
}

.HeaderSearch-productTitle {
  font-size: 13px;
  color: var(--header-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.HeaderSearch-sectionItems--brands {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
}

.HeaderSearch-brandItem {
  display: block;
  padding: 7px 8px;
  border-radius: 6px;
  font-size: 13px;
  color: var(--header-text);
  text-decoration: none;
  transition: background var(--header-transition);
}

.HeaderSearch-brandItem:hover {
  background: var(--header-primary-light);
  color: var(--header-text);
}

/* Articles & Promotions sections */

.HeaderSearch-sectionItems--articles,
.HeaderSearch-sectionItems--promotions {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.HeaderSearch-articleItem,
.HeaderSearch-promotionItem {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  border-radius: var(--header-radius);
  text-decoration: none;
  color: inherit;
  transition: background var(--header-transition);
}

.HeaderSearch-articleItem:hover,
.HeaderSearch-promotionItem:hover {
  background: var(--header-primary-light);
}

.HeaderSearch-articleThumb,
.HeaderSearch-promotionThumb {
  width: 64px;
  height: 48px;
  border-radius: var(--header-radius);
  background: #f5f5f8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  color: var(--header-text-muted);
}

.HeaderSearch-articleThumb img,
.HeaderSearch-promotionThumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.HeaderSearch-articleInfo,
.HeaderSearch-promotionInfo {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 2px;
}

.HeaderSearch-articleCategory,
.HeaderSearch-promotionType {
  font-size: 11px;
  padding: 1px 6px;
  border-radius: 10px;
  background: var(--header-primary-light);
  color: var(--header-primary);
  display: inline-block;
  width: fit-content;
  line-height: 1.4;
}

.HeaderSearch-articleTitle,
.HeaderSearch-promotionTitle {
  font-size: 13px;
  color: var(--header-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ==========================================================================
   HeaderSearch – InstantSearch widget overrides
   ========================================================================== */

/* Make the <li> wrapper transparent to the existing flex/grid layout */
.HeaderSearch-hitsItem {
  display: contents;
  list-style: none;
}

/* Root div generated by the hits widget */
.HeaderSearch-hitsRoot {
  width: 100%;
}

/* Remove the empty-state root so it takes no space */
.HeaderSearch-hitsRoot--empty {
  display: none;
}

/* In live mode (JS adds is-live-search): hide all sections by default */
.HeaderSearch.is-live-search [data-search-section] {
  display: none;
}

/* Show only sections that returned hits */
.HeaderSearch.is-live-search [data-search-section].has-results {
  display: block;
}

/* Default (fallback) panel – shown when input is empty */
.HeaderSearch-defaultPanel {
  display: block;
}

.HeaderSearch-defaultSection {
  padding-block-end: 16px;
  border-bottom: 1px solid var(--header-border, #e8e8e8);
  margin-block-end: 16px;
}

.HeaderSearch-defaultSection:last-child {
  padding-block-end: 0;
  border-bottom: none;
  margin-block-end: 0;
}

/* Hide default panel when there is an active query AND results found */
.HeaderSearch.is-live-search.has-query:not(.no-results) .HeaderSearch-defaultPanel {
  display: none;
}

/* When a query has no results, keep default panel visible as fallback */
.HeaderSearch.is-live-search.has-query.no-results [data-search-section] {
  display: none;
}

/* ==========================================================================
   HeaderCart
   ========================================================================== */

.HeaderCart-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: var(--header-radius);
  text-decoration: none;
  color: var(--header-text);
  transition: color var(--header-transition);
}

.HeaderCart-link:hover {
  color: var(--header-primary);
}

.HeaderCart-icon {
  position: relative;
  display: flex;
  flex-shrink: 0;
}

.HeaderCart-badge {
  position: absolute;
  top: -6px;
  inset-inline-end: -6px;
  background: var(--header-primary);
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  padding: 2px 5px;
  border-radius: 10px;
  min-width: var(--header-badge-size);
  text-align: center;
  white-space: nowrap;
}

.HeaderCart-label {
  display: none;
  flex-direction: column;
  line-height: 1;
}

.HeaderCart-labelText {
  font-size: 11px;
  color: var(--header-text-muted);
  line-height: 1.3;
}

.HeaderCart-count {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
}

/* ==========================================================================
   HeaderWishlist
   ========================================================================== */

.HeaderWishlist-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: var(--header-radius);
  text-decoration: none;
  color: var(--header-text);
  transition: color var(--header-transition);
}

.HeaderWishlist-link:hover {
  color: var(--header-primary);
}

.HeaderWishlist-icon {
  position: relative;
  display: flex;
  flex-shrink: 0;
}

.HeaderWishlist-badge {
  position: absolute;
  top: -6px;
  inset-inline-end: -6px;
  background: var(--header-primary);
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  padding: 2px 5px;
  border-radius: 10px;
  min-width: var(--header-badge-size);
  text-align: center;
  white-space: nowrap;
}

.HeaderWishlist-label {
  display: none;
  flex-direction: column;
}

.HeaderWishlist-labelText {
  font-size: 11px;
  color: var(--header-text-muted);
  line-height: 1.3;
}

.HeaderWishlist-count {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
}

/* ==========================================================================
   HeaderUserMenu
   ========================================================================== */

.HeaderUserMenu {
  position: relative;
}

.HeaderUserMenu-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: none;
  border: none;
  border-radius: var(--header-radius);
  cursor: pointer;
  color: var(--header-text);
  transition: color var(--header-transition);
}

.HeaderUserMenu-trigger:hover {
  color: var(--header-primary);
}

.HeaderUserMenu-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--header-primary) 0%, #d4456c 100%);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  flex-shrink: 0;
  text-transform: uppercase;
}

.HeaderUserMenu-info {
  display: none;
  flex-direction: column;
  text-align: start;
}

.HeaderUserMenu-greeting {
  font-size: 11px;
  color: var(--header-text-muted);
  line-height: 1.3;
}

.HeaderUserMenu-name {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
}

.HeaderUserMenu-chevron {
  display: none;
  color: var(--header-text-muted);
  transition: transform var(--header-transition);
}

.HeaderUserMenu-trigger[aria-expanded="true"] .HeaderUserMenu-chevron {
  transform: rotate(180deg);
}

/* Dropdown */

.HeaderUserMenu-dropdown {
  position: absolute;
  inset-inline-end: 0;
  top: calc(100% + 8px);
  min-width: 220px;
  background: #fff;
  border-radius: 12px;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.12),
    0 2px 8px rgba(0, 0, 0, 0.06);
  border: 1px solid var(--header-border);
  z-index: var(--header-dropdown-z);
  padding: 6px 0;
}

.HeaderUserMenu-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.HeaderUserMenu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  font-size: 14px;
  color: var(--header-text);
  text-decoration: none;
  transition: color var(--header-transition);
}

.HeaderUserMenu-item:hover {
  color: var(--header-primary);
}

.HeaderUserMenu-item--danger {
  color: var(--header-primary);
}

.HeaderUserMenu-itemIcon {
  flex-shrink: 0;
  color: var(--header-text-muted);
}

.HeaderUserMenu-item--danger .HeaderUserMenu-itemIcon {
  color: var(--header-primary);
}

.HeaderUserMenu-divider {
  height: 1px;
  background: var(--header-border);
  margin: 6px 0;
}

/* Guest */

.HeaderUserMenu-guest {
  display: flex;
  align-items: center;
  gap: 8px;
}

.HeaderUserMenu-loginLink {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: var(--header-radius);
  text-decoration: none;
  color: var(--header-text);
  transition: color var(--header-transition);
}

.HeaderUserMenu-loginLink:hover {
  color: var(--header-primary);
}

.HeaderUserMenu-loginText {
  font-size: 13px;
  font-weight: 500;
}

.HeaderUserMenu-registerLink {
  font-size: 13px;
  font-weight: 600;
  color: var(--header-primary);
  text-decoration: none;
  padding: 6px 12px;
  border-radius: var(--header-radius);
  border: 1.5px solid var(--header-primary);
  transition: background var(--header-transition), color var(--header-transition);
}

.HeaderUserMenu-registerLink:hover {
  background: var(--header-primary);
  color: #fff;
}

/* ==========================================================================
   HeaderMainMenu
   ========================================================================== */

.HeaderMainMenu {
  display: flex;
  justify-content: center;
  width: 100%;
}

.HeaderMainMenu-list {
  display: flex;
  align-items: stretch;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 2px;
}

.HeaderMainMenu-item {
  position: relative;
}

.HeaderMainMenu-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 12px 18px;
  font-size: 14px;
  color: var(--header-text);
  text-decoration: none;
  border-radius: 6px;
  white-space: nowrap;
  transition: color var(--header-transition);
}

.HeaderMainMenu-link:hover,
.HeaderMainMenu-item.is-active > .HeaderMainMenu-link {
  color: var(--header-primary);
}

.HeaderMainMenu-item.is-active > .HeaderMainMenu-link {
  font-weight: 600;
}

.HeaderMainMenu-chevron {
  display: flex;
  align-items: center;
  transition: transform var(--header-transition);
}

.HeaderMainMenu-link[aria-expanded="true"] .HeaderMainMenu-chevron {
  transform: rotate(180deg);
}

/* Dropdown */

.HeaderMainMenu-dropdown {
  position: absolute;
  top: 100%;
  inset-inline-start: 0;
  min-width: 220px;
  background: #fff;
  border-radius: 12px;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.12),
    0 2px 8px rgba(0, 0, 0, 0.06);
  border: 1px solid var(--header-border);
  z-index: var(--header-dropdown-z);
  padding: 6px 0;
}

.HeaderMainMenu-subList {
  list-style: none;
  margin: 0;
  padding: 0;
}

.HeaderMainMenu-subLink {
  display: block;
  padding: 10px 16px;
  font-size: 14px;
  color: var(--header-text);
  text-decoration: none;
  transition: color var(--header-transition);
}

.HeaderMainMenu-subLink:hover {
  color: var(--header-primary);
}

.HeaderMainMenu-subItem.is-active .HeaderMainMenu-subLink {
  color: var(--header-primary);
  font-weight: 500;
}

.HeaderMainMenu-subItem--viewAll {
  border-top: 1px solid var(--header-border);
  margin-top: 4px;
}

.HeaderMainMenu-subLink--viewAll {
  color: var(--header-primary);
  font-weight: 500;
}

/* Mobile menu — HeaderMainMenu in mobile drawer */

.Header-mobileNav .HeaderMainMenu {
  display: block;
}

.Header-mobileNav .HeaderMainMenu-list {
  flex-direction: column;
  gap: 0;
}

.Header-mobileNav .HeaderMainMenu-link {
  display: flex;
  justify-content: space-between;
  border-radius: 6px;
  padding: 12px 16px;
}

.Header-mobileNav .HeaderMainMenu-dropdown {
  position: static;
  box-shadow: none;
  border: none;
  border-radius: 0;
  padding: 0 0 0 16px;
  display: none;
}

.Header-mobileNav .HeaderMainMenu-dropdown.is-open {
  display: block;
}

.Header-mobileNav .HeaderMainMenu-subLink {
  padding: 9px 12px;
}

/* ==========================================================================
   Responsive breakpoints
   ========================================================================== */

/* Desktop (≥ 1024px) – show labels + full menu */
@media (min-width: 1024px) {
  .Header-mobileToggle {
    display: none;
  }

  .HeaderCart-label,
  .HeaderWishlist-label {
    display: flex;
  }

  .HeaderUserMenu-info,
  .HeaderUserMenu-chevron {
    display: flex;
  }

  /* Account menu dropdown gets full-page overlay on desktop */
  .HeaderUserMenu-dropdown.is-open ~ .Header-overlay,
  .HeaderUserMenu.is-open > .HeaderUserMenu-dropdown + .Header-overlay {
    display: block;
  }
}

/* Tablet (768px – 1023px): search inline between logo and meta */
@media (min-width: 768px) and (max-width: 1023px) {
  .Header-mobileToggle {
    display: flex;
    order: 1;
    flex-shrink: 0;
  }

  .Header-inner {
    flex-wrap: nowrap;
    height: 60px;
    gap: 8px;
    align-items: center;
  }

  .Header-logo {
    order: 2;
    flex-shrink: 0;
  }

  /* Search fills space between logo and meta */
  .Header-search--desktop {
    display: block;
    order: 3;
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
  }

  .Header-meta {
    order: 4;
    margin-inline-start: 0;
    flex-shrink: 0;
  }

  .Header-searchToggle {
    display: none;
  }

  .Header-metaItem--account {
    display: none;
  }

  .Header-navBar {
    display: none;
  }
}

/* Mobile (< 768px): search wraps to full-width second row */
@media (max-width: 767px) {
  .Header-mobileToggle {
    display: flex;
    order: 1;
    flex-shrink: 0;
  }

  .Header-inner {
    flex-wrap: wrap;
    height: auto;
    min-height: 60px;
    padding-block: 10px;
    gap: 8px;
    align-items: center;
    align-content: flex-start;
  }

  /* Logo centered between hamburger and meta */
  .Header-logo {
    order: 2;
    flex: 1;
    display: flex;
    justify-content: center;
  }

  .Header-meta {
    order: 3;
    margin-inline-start: 0;
    flex-shrink: 0;
  }

  /* Search as full-width second row — visually centered below logo */
  .Header-search--desktop {
    display: block;
    order: 10;
    flex: 0 0 100%;
    max-width: none;
    padding-block-end: 2px;
  }

  .Header-searchToggle {
    display: none;
  }

  .Header-metaItem--account {
    display: none;
  }

  .Header-navBar {
    display: none;
  }
}

/* Mobile only (< 640px) */
@media (max-width: 639px) {
  .Header-inner {
    gap: 4px;
    min-height: 56px;
    padding-block: 8px;
  }

  .Header-logo img,
  .Header-logo .site-logo img {
    height: 32px;
  }

  .Header-meta {
    gap: 0;
  }

  .Header-metaItem {
    min-width: unset;
  }
}