/*
 * IPEK OTO STOREFRONT HEADER — CANONICAL BUNDLE V1
 * Generated by tools/storefront/build_storefront_header_canonical_v1.py
 * Source order is part of the visual contract. Do not edit this file by hand.
 */

/* === HEADER SOURCE 01: storefront_approved_header_4_0_v1.css === */
/* IPEKERP_STOREFRONT_APPROVED_HEADER_4_0_V1
   Approved desktop reference target: 1741x383 crop.
   Section 1/3 — structural rebuild + first-pixel desktop geometry.
   No backend, catalog, pricing, stock, cart or provider behavior mutation.
*/

:root {
  --sf4-blue-900: #00306a;
  --sf4-blue-800: #003f88;
  --sf4-blue-700: #075cb9;
  --sf4-blue-600: #0a67d1;
  --sf4-ink: #081a35;
  --sf4-muted: #5d697a;
  --sf4-line: #e4e8ed;
  --sf4-soft: #f8fafc;
  --sf4-shell: 1540px;
}

body > .sf3-utility-bar,
body.sf3-home-shell-v1 > .sf3-utility-bar {
  display: none !important;
}

header.sf-site-header.sf4-approved-header {
  position: relative !important;
  z-index: 120 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
  color: var(--sf4-ink) !important;
}

.sf4-approved-header *,
.sf4-brand-rail * {
  box-sizing: border-box;
}

.sf4-approved-header svg,
.sf4-brand-rail svg {
  display: block;
}

.sf4-approved-header__benefit-bar {
  height: 44px !important;
  min-height: 44px !important;
  background: linear-gradient(90deg, #012f69 0%, #06447f 48%, #02356f 100%) !important;
  color: #fff !important;
  border: 0 !important;
}

.sf4-approved-header__benefit-inner {
  width: min(calc(100% - 96px), var(--sf4-shell)) !important;
  max-width: var(--sf4-shell) !important;
  height: 44px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: center !important;
  gap: 40px !important;
}

.sf4-approved-header__benefit {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  white-space: nowrap !important;
  font-size: 14px !important;
  line-height: 1 !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
}

.sf4-approved-header__benefit:nth-child(2) { justify-content: center !important; }
.sf4-approved-header__benefit:nth-child(3) { justify-content: flex-end !important; }

.sf4-approved-header__benefit svg {
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-approved-header__main {
  height: 124px !important;
  min-height: 124px !important;
  background: #fff !important;
  border-bottom: 1px solid var(--sf4-line) !important;
}

.sf4-approved-header__main-inner {
  width: min(calc(100% - 96px), var(--sf4-shell)) !important;
  max-width: var(--sf4-shell) !important;
  height: 124px !important;
  min-height: 124px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 310px minmax(0, 1fr) 330px !important;
  align-items: center !important;
  gap: 32px !important;
}

.sf4-approved-header .sf4-approved-brand {
  min-width: 0 !important;
  width: max-content !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 13px !important;
  color: var(--sf4-ink) !important;
  text-decoration: none !important;
}

.sf4-approved-brand__mark {
  width: 72px !important;
  height: 72px !important;
  flex: 0 0 72px !important;
  display: grid !important;
  place-items: center !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

.sf4-approved-brand__mark img {
  display: block !important;
  width: 72px !important;
  height: 72px !important;
  object-fit: contain !important;
  object-position: center !important;
}

.sf4-approved-brand__copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 5px !important;
  align-content: center !important;
}

.sf4-approved-brand__copy strong {
  display: block !important;
  margin: 0 !important;
  color: #07162d !important;
  font-size: 31px !important;
  line-height: .94 !important;
  font-weight: 800 !important;
  letter-spacing: -.045em !important;
  white-space: nowrap !important;
}

.sf4-approved-brand__copy small {
  display: block !important;
  margin: 0 !important;
  color: #10213e !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 750 !important;
  letter-spacing: .34em !important;
  white-space: nowrap !important;
}

.sf4-approved-header form.sf4-approved-search {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-self: stretch !important;
  align-self: center !important;
  display: grid !important;
  grid-template-columns: 172px minmax(0, 1fr) 58px !important;
  align-items: stretch !important;
  overflow: hidden !important;
  border: 1px solid #d4dae2 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.sf4-approved-search__category {
  height: 50px !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 0 19px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  border: 0 !important;
  border-right: 1px solid #e2e6eb !important;
  border-radius: 0 !important;
  background: #fafbfd !important;
  color: #172942 !important;
  font: inherit !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

.sf4-approved-search__category svg {
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-approved-header form.sf4-approved-search input[type="search"] {
  width: 100% !important;
  height: 50px !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: none !important;
  background: #fff !important;
  color: var(--sf4-ink) !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 14px !important;
  line-height: 50px !important;
  font-weight: 450 !important;
}

.sf4-approved-header form.sf4-approved-search input[type="search"]::placeholder {
  color: #9da8b7 !important;
  opacity: 1 !important;
}

.sf4-approved-search__submit {
  position: static !important;
  inset: auto !important;
  width: 58px !important;
  height: 50px !important;
  min-height: 50px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #0767cd 0%, #055ab8 100%) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.sf4-approved-search__submit svg {
  width: 23px !important;
  height: 23px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-approved-header .sf4-approved-actions {
  min-width: 0 !important;
  height: 70px !important;
  display: grid !important;
  grid-template-columns: 102px 102px 112px !important;
  align-items: center !important;
  justify-content: end !important;
  gap: 4px !important;
}

.sf4-approved-header .sf4-approved-action {
  position: relative !important;
  min-width: 0 !important;
  height: 64px !important;
  margin: 0 !important;
  padding: 0 5px !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 7px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--sf4-ink) !important;
  text-decoration: none !important;
  box-shadow: none !important;
  font: inherit !important;
  text-align: left !important;
}

.sf4-approved-header .sf4-approved-action:not(:first-child)::before {
  content: "" !important;
  position: absolute !important;
  left: -3px !important;
  top: 12px !important;
  bottom: 12px !important;
  width: 1px !important;
  background: #eef0f3 !important;
}

.sf4-approved-action__icon {
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  color: #071a37 !important;
}

.sf4-approved-action__icon svg {
  width: 27px !important;
  height: 27px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.45 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-approved-action__copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 4px !important;
  align-content: center !important;
}

.sf4-approved-action__copy strong {
  display: block !important;
  margin: 0 !important;
  color: #091a33 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 720 !important;
  white-space: nowrap !important;
}

.sf4-approved-action__copy small {
  display: block !important;
  margin: 0 !important;
  color: #606b79 !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 450 !important;
  white-space: nowrap !important;
}

.sf4-approved-cart-badge {
  position: absolute !important;
  top: 1px !important;
  right: 5px !important;
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 5px !important;
  display: grid !important;
  place-items: center !important;
  border: 2px solid #fff !important;
  border-radius: 999px !important;
  background: #086bd5 !important;
  color: #fff !important;
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
}

.sf4-approved-header .sf-site-menu-button {
  display: none !important;
}

nav.sf-site-nav.sf4-approved-nav {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  height: 60px !important;
  min-height: 60px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--sf4-line) !important;
  background: #fff !important;
  box-shadow: none !important;
}

.sf4-approved-header .sf4-approved-nav__inner {
  width: min(calc(100% - 96px), var(--sf4-shell)) !important;
  max-width: var(--sf4-shell) !important;
  height: 60px !important;
  min-height: 60px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 22px !important;
  overflow: visible !important;
}

.sf4-approved-header .sf4-approved-nav__inner > a {
  position: relative !important;
  min-height: 60px !important;
  height: 60px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #10213c !important;
  text-decoration: none !important;
  box-shadow: none !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 650 !important;
  white-space: nowrap !important;
}

.sf4-approved-header .sf4-approved-nav__inner > a::after {
  display: none !important;
}

.sf4-approved-header .sf4-approved-nav__inner > a > svg {
  width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.45 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-approved-header .sf4-approved-nav__all {
  width: 222px !important;
  min-width: 222px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin-right: 22px !important;
  padding: 0 18px !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  border-radius: 7px !important;
  background: linear-gradient(180deg, #0868cf 0%, #0759b5 100%) !important;
  color: #fff !important;
  font-weight: 750 !important;
}

.sf4-approved-header .sf4-approved-nav__all > svg {
  width: 22px !important;
  height: 22px !important;
}

.sf4-approved-header .sf4-approved-nav__blog {
  width: 108px !important;
  min-width: 108px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin-left: auto !important;
  padding: 0 16px !important;
  border-radius: 6px !important;
  background: #06214a !important;
  color: #fff !important;
  font-weight: 750 !important;
}

.sf4-brand-rail {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 147px !important;
  min-height: 147px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-bottom: 1px solid #edf0f3 !important;
  background: linear-gradient(180deg, #fbfcfd 0%, #fff 62%, #fafbfd 100%) !important;
  box-shadow: 0 10px 28px rgba(22, 45, 76, .035) !important;
}

.sf4-brand-rail__inner {
  width: min(calc(100% - 96px), var(--sf4-shell)) !important;
  max-width: var(--sf4-shell) !important;
  height: 147px !important;
  margin: 0 auto !important;
  padding: 18px 0 11px !important;
  display: grid !important;
  grid-template-columns: 46px repeat(10, minmax(0, 1fr)) 46px !important;
  align-items: start !important;
  gap: 7px !important;
}

.sf4-brand-rail__arrow {
  width: 38px !important;
  height: 54px !important;
  align-self: center !important;
  justify-self: center !important;
  margin-top: -10px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid #e1e6ec !important;
  border-radius: 20px !important;
  background: #fff !important;
  color: #0a2343 !important;
  box-shadow: 0 4px 12px rgba(15, 37, 68, .045) !important;
}

.sf4-brand-rail__arrow svg {
  width: 18px !important;
  height: 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-brand {
  min-width: 0 !important;
  height: 116px !important;
  display: grid !important;
  grid-template-rows: 88px 22px !important;
  justify-items: center !important;
  align-items: start !important;
  gap: 4px !important;
  color: #344255 !important;
  text-decoration: none !important;
}

.sf4-brand__logo {
  width: 86px !important;
  height: 86px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border: 1px solid #e1e6ec !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 5px 16px rgba(20, 46, 77, .05) !important;
}

.sf4-brand__logo svg {
  width: 68px !important;
  height: 68px !important;
  overflow: visible !important;
  fill: none !important;
  stroke: #0b1320 !important;
  stroke-width: 2.5 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-brand__name {
  max-width: 110px !important;
  overflow: hidden !important;
  color: #425064 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 12px !important;
  line-height: 18px !important;
  font-weight: 520 !important;
  letter-spacing: .01em !important;
}

.sf4-brand__logo--audi svg { width: 72px !important; stroke-width: 2.8 !important; }

.sf4-brand__logo--bmw svg {
  width: 74px !important;
  height: 74px !important;
  stroke-width: 2.5 !important;
}
.sf4-brand__logo--bmw text {
  fill: #111 !important;
  stroke: none !important;
  font-size: 8px !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
}
.sf4-brand__logo--bmw .sf4-bmw-blue {
  fill: #1b78cf !important;
  stroke: none !important;
}

.sf4-brand__logo--fiat svg {
  width: 67px !important;
  height: 67px !important;
  stroke: none !important;
}
.sf4-brand__logo--fiat text {
  fill: #050505 !important;
  stroke: none !important;
  font-family: Arial Narrow, Arial, sans-serif !important;
  font-size: 31px !important;
  font-weight: 900 !important;
  letter-spacing: -3px !important;
}

.sf4-brand__logo--ford svg {
  width: 78px !important;
  height: 58px !important;
  stroke: none !important;
}
.sf4-brand__logo--ford ellipse {
  fill: #0c4f98 !important;
  stroke: #092f5f !important;
  stroke-width: 1.2 !important;
}
.sf4-brand__logo--ford text {
  fill: #fff !important;
  stroke: none !important;
  font-family: Georgia, serif !important;
  font-size: 18px !important;
  font-style: italic !important;
  font-weight: 700 !important;
}

.sf4-brand__logo--hyundai svg {
  width: 75px !important;
  height: 65px !important;
  stroke: #0a4e91 !important;
  stroke-width: 2.7 !important;
}
.sf4-brand__logo--hyundai text {
  fill: #0a4e91 !important;
  stroke: none !important;
  font-family: Arial, sans-serif !important;
  font-size: 8px !important;
  font-weight: 800 !important;
}

.sf4-brand__logo--mercedes svg {
  width: 72px !important;
  height: 72px !important;
  stroke: #606970 !important;
  stroke-width: 2.2 !important;
}

.sf4-brand__logo--opel svg {
  width: 72px !important;
  height: 72px !important;
  stroke: #080b0f !important;
  stroke-width: 2.6 !important;
}

.sf4-brand__logo--peugeot svg {
  width: 68px !important;
  height: 68px !important;
  stroke: #070b10 !important;
  stroke-width: 2.2 !important;
}
.sf4-brand__logo--peugeot text {
  fill: #070b10 !important;
  stroke: none !important;
  font-family: Arial, sans-serif !important;
  font-size: 30px !important;
  font-weight: 900 !important;
}

.sf4-brand__logo--renault svg {
  width: 70px !important;
  height: 70px !important;
  stroke: #090d12 !important;
  stroke-width: 3 !important;
}

.sf4-brand__logo--vw svg {
  width: 72px !important;
  height: 72px !important;
  stroke: #073c7d !important;
  stroke-width: 2.8 !important;
}

body.sf3-home-shell-v1 main,
body.sf-full-reference-catalog-v2 main {
  position: relative !important;
}

.sf4-approved-header a,
.sf4-approved-header button,
.sf4-brand-rail a,
.sf4-brand-rail button {
  transition: opacity .14s ease, transform .14s ease, border-color .14s ease !important;
}

.sf4-approved-header a:hover,
.sf4-approved-header button:hover,
.sf4-brand-rail a:hover,
.sf4-brand-rail button:hover {
  opacity: .92 !important;
}

.sf4-brand:hover .sf4-brand__logo {
  border-color: #b8c6d7 !important;
  transform: translateY(-1px) !important;
}

.sf4-approved-header a:focus-visible,
.sf4-approved-header button:focus-visible,
.sf4-approved-header input:focus-visible,
.sf4-brand-rail a:focus-visible,
.sf4-brand-rail button:focus-visible {
  outline: 2px solid #0b68cc !important;
  outline-offset: 2px !important;
}

@media (max-width: 1320px) {
  .sf4-approved-header__main-inner {
    grid-template-columns: 250px minmax(0, 1fr) 250px !important;
    gap: 20px !important;
  }

  .sf4-approved-header .sf4-approved-actions {
    grid-template-columns: 92px 92px !important;
  }

  .sf4-approved-action--favorite {
    display: none !important;
  }

  .sf4-approved-header .sf4-approved-nav__inner {
    gap: 16px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }

  .sf4-approved-header .sf4-approved-nav__inner::-webkit-scrollbar {
    display: none !important;
  }

  .sf4-approved-header .sf4-approved-nav__blog {
    margin-left: 10px !important;
  }

  .sf4-brand-rail__inner {
    overflow-x: auto !important;
    grid-template-columns: 42px repeat(10, 120px) 42px !important;
    scrollbar-width: none !important;
  }

  .sf4-brand-rail__inner::-webkit-scrollbar {
    display: none !important;
  }
}

@media (max-width: 980px) {
  .sf4-approved-header__benefit-inner,
  .sf4-approved-header__main-inner,
  .sf4-approved-header .sf4-approved-nav__inner,
  .sf4-brand-rail__inner {
    width: min(calc(100% - 32px), var(--sf4-shell)) !important;
  }

  .sf4-approved-header__benefit:nth-child(2) {
    display: none !important;
  }

  .sf4-approved-header__benefit-inner {
    grid-template-columns: 1fr 1fr !important;
  }

  .sf4-approved-header__main {
    height: auto !important;
    min-height: 142px !important;
  }

  .sf4-approved-header__main-inner {
    height: auto !important;
    min-height: 142px !important;
    padding: 14px 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "brand actions"
      "search search" !important;
    row-gap: 12px !important;
  }

  .sf4-approved-brand { grid-area: brand !important; }
  .sf4-approved-search { grid-area: search !important; }
  .sf4-approved-actions { grid-area: actions !important; }

  .sf4-approved-header .sf4-approved-nav__all {
    width: auto !important;
    min-width: 190px !important;
  }
}

@media (max-width: 620px) {
  .sf4-approved-header__benefit-bar {
    height: 36px !important;
    min-height: 36px !important;
  }

  .sf4-approved-header__benefit-inner {
    height: 36px !important;
    display: flex !important;
    justify-content: center !important;
  }

  .sf4-approved-header__benefit {
    display: none !important;
    font-size: 11px !important;
  }

  .sf4-approved-header__benefit:first-child {
    display: flex !important;
  }

  .sf4-approved-header__main-inner {
    grid-template-columns: minmax(0, 1fr) 50px !important;
  }

  .sf4-approved-brand__mark {
    width: 52px !important;
    height: 52px !important;
    flex-basis: 52px !important;
  }

  .sf4-approved-brand__mark img {
    width: 52px !important;
    height: 52px !important;
  }

  .sf4-approved-brand__copy strong {
    font-size: 23px !important;
  }

  .sf4-approved-brand__copy small {
    font-size: 8px !important;
  }

  .sf4-approved-header .sf4-approved-actions {
    width: 50px !important;
    height: 50px !important;
    display: block !important;
  }

  .sf4-approved-header .sf4-approved-action {
    display: none !important;
  }

  .sf4-approved-header .sf-site-menu-button {
    width: 46px !important;
    height: 46px !important;
    display: grid !important;
    place-content: center !important;
    gap: 4px !important;
    border: 1px solid #dce2e9 !important;
    border-radius: 7px !important;
    background: #fff !important;
  }

  .sf4-approved-header .sf-site-menu-button > span {
    width: 20px !important;
    height: 2px !important;
    display: block !important;
    background: #0b1d38 !important;
  }

  .sf4-approved-header form.sf4-approved-search {
    grid-template-columns: minmax(0, 1fr) 52px !important;
  }

  .sf4-approved-search__category {
    display: none !important;
  }

  nav.sf4-approved-nav {
    display: none !important;
  }

  .sf4-brand-rail {
    height: 126px !important;
    min-height: 126px !important;
  }

  .sf4-brand-rail__inner {
    height: 126px !important;
    padding-top: 14px !important;
    grid-template-columns: repeat(10, 104px) !important;
  }

  .sf4-brand-rail__arrow {
    display: none !important;
  }

  .sf4-brand__logo {
    width: 76px !important;
    height: 76px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sf4-approved-header *,
  .sf4-brand-rail * {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
}

/* === HEADER SOURCE 02: storefront_approved_header_4_0_calibration_v1.css === */
/* IPEKERP_STOREFRONT_APPROVED_HEADER_4_0_CALIBRATION_V1
   Section 2/3 — desktop pixel calibration layer over section 1.
   Additive CSS only. No backend or JS behavior mutation.
*/

:root {
  --sf4c-shell: 1560px;
}

@media (min-width: 1180px) {
  .sf4-approved-header__benefit-inner,
  .sf4-approved-header__main-inner,
  .sf4-approved-header .sf4-approved-nav__inner,
  .sf4-brand-rail__inner {
    width: min(calc(100% - 92px), var(--sf4c-shell)) !important;
    max-width: var(--sf4c-shell) !important;
  }

  .sf4-approved-header__benefit-inner {
    gap: 34px !important;
  }

  .sf4-approved-header__benefit {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    letter-spacing: -.006em !important;
  }

  .sf4-approved-header__benefit svg {
    width: 16px !important;
    height: 16px !important;
    flex-basis: 16px !important;
    stroke-width: 1.8 !important;
  }

  .sf4-approved-header__main {
    height: 126px !important;
    min-height: 126px !important;
  }

  .sf4-approved-header__main-inner {
    height: 126px !important;
    min-height: 126px !important;
    grid-template-columns: 320px minmax(0, 1fr) 338px !important;
    gap: 28px !important;
  }

  .sf4-approved-brand__mark {
    width: 76px !important;
    height: 76px !important;
    flex-basis: 76px !important;
  }

  .sf4-approved-brand__mark img {
    width: 76px !important;
    height: 76px !important;
  }

  .sf4-approved-brand__copy {
    gap: 6px !important;
  }

  .sf4-approved-brand__copy strong {
    font-size: 32px !important;
    letter-spacing: -.05em !important;
  }

  .sf4-approved-brand__copy small {
    font-size: 10.5px !important;
    letter-spacing: .36em !important;
  }

  .sf4-approved-header form.sf4-approved-search {
    height: 54px !important;
    grid-template-columns: 176px minmax(0, 1fr) 60px !important;
    border-color: #d2d8e0 !important;
    border-radius: 9px !important;
    box-shadow: 0 1px 0 rgba(255,255,255,.9), 0 1px 6px rgba(15, 33, 58, .03) !important;
  }

  .sf4-approved-search__category,
  .sf4-approved-header form.sf4-approved-search input[type="search"],
  .sf4-approved-search__submit {
    height: 52px !important;
    min-height: 52px !important;
  }

  .sf4-approved-search__category {
    padding-inline: 20px !important;
    font-size: 13.5px !important;
    color: #11233f !important;
    background: #fbfcfd !important;
  }

  .sf4-approved-header form.sf4-approved-search input[type="search"] {
    padding-inline: 19px !important;
    font-size: 14.5px !important;
  }

  .sf4-approved-header form.sf4-approved-search input[type="search"]::placeholder {
    color: #a1acba !important;
  }

  .sf4-approved-search__submit {
    width: 60px !important;
    background: linear-gradient(180deg, #0869d0 0%, #0559b7 100%) !important;
  }

  .sf4-approved-search__submit svg {
    width: 22px !important;
    height: 22px !important;
  }

  .sf4-approved-header .sf4-approved-actions {
    height: 72px !important;
    grid-template-columns: 104px 102px 116px !important;
    gap: 2px !important;
  }

  .sf4-approved-header .sf4-approved-action {
    height: 66px !important;
    grid-template-columns: 35px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding-inline: 6px !important;
  }

  .sf4-approved-action__icon {
    width: 35px !important;
    height: 35px !important;
  }

  .sf4-approved-action__icon svg {
    width: 27px !important;
    height: 27px !important;
    stroke-width: 1.5 !important;
  }

  .sf4-approved-action__copy {
    gap: 5px !important;
  }

  .sf4-approved-action__copy strong {
    font-size: 13.5px !important;
  }

  .sf4-approved-action__copy small {
    font-size: 11px !important;
  }

  .sf4-approved-cart-badge {
    top: 0 !important;
    right: 6px !important;
    min-width: 19px !important;
    height: 19px !important;
    font-size: 10px !important;
  }

  nav.sf-site-nav.sf4-approved-nav {
    height: 58px !important;
    min-height: 58px !important;
  }

  .sf4-approved-header .sf4-approved-nav__inner {
    height: 58px !important;
    min-height: 58px !important;
    gap: 24px !important;
  }

  .sf4-approved-header .sf4-approved-nav__inner > a {
    height: 58px !important;
    min-height: 58px !important;
    gap: 7px !important;
    font-size: 13.5px !important;
    font-weight: 670 !important;
    color: #12233f !important;
  }

  .sf4-approved-header .sf4-approved-nav__inner > a > svg {
    width: 19px !important;
    height: 19px !important;
  }

  .sf4-approved-header .sf4-approved-nav__all {
    width: 222px !important;
    min-width: 222px !important;
    height: 43px !important;
    min-height: 43px !important;
    margin-right: 18px !important;
    padding-inline: 17px !important;
    gap: 11px !important;
    border-radius: 7px !important;
    box-shadow: 0 4px 12px rgba(5, 84, 171, .16) !important;
  }

  .sf4-approved-header .sf4-approved-nav__blog {
    width: 108px !important;
    min-width: 108px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding-inline: 15px !important;
    border-radius: 6px !important;
    box-shadow: 0 5px 16px rgba(7, 22, 45, .10) !important;
  }

  .sf4-brand-rail {
    height: 149px !important;
    min-height: 149px !important;
    box-shadow: 0 10px 24px rgba(19, 40, 69, .03) !important;
  }

  .sf4-brand-rail__inner {
    height: 149px !important;
    padding-top: 18px !important;
    padding-bottom: 11px !important;
    grid-template-columns: 44px repeat(10, minmax(0, 1fr)) 44px !important;
    gap: 8px !important;
  }

  .sf4-brand-rail__arrow {
    width: 38px !important;
    height: 52px !important;
    margin-top: -8px !important;
    border-color: #e4e8ee !important;
    box-shadow: 0 4px 10px rgba(17, 39, 67, .04) !important;
  }

  .sf4-brand {
    height: 118px !important;
    grid-template-rows: 90px 20px !important;
    gap: 6px !important;
  }

  .sf4-brand__logo {
    width: 88px !important;
    height: 88px !important;
    border-color: #e4e8ee !important;
    box-shadow: 0 6px 16px rgba(18, 42, 70, .045) !important;
  }

  .sf4-brand__logo svg {
    width: 70px !important;
    height: 70px !important;
  }

  .sf4-brand__name {
    color: #465366 !important;
    font-size: 11.8px !important;
    line-height: 18px !important;
    font-weight: 500 !important;
    letter-spacing: .008em !important;
  }

  .sf4-brand__logo--ford svg {
    width: 80px !important;
    height: 59px !important;
  }

  .sf4-brand__logo--ford text {
    font-size: 18px !important;
  }

  .sf4-brand__logo--hyundai svg {
    width: 76px !important;
    height: 66px !important;
  }

  .sf4-brand__logo--hyundai text {
    font-size: 8.2px !important;
  }

  .sf4-brand__logo--mercedes svg,
  .sf4-brand__logo--opel svg,
  .sf4-brand__logo--vw svg {
    width: 74px !important;
    height: 74px !important;
  }
}

@media (min-width: 1180px) {
  .sf4-approved-header a:hover,
  .sf4-approved-header button:hover,
  .sf4-brand-rail a:hover,
  .sf4-brand-rail button:hover {
    opacity: .96 !important;
  }
}

/* === HEADER SOURCE 03: storefront_approved_header_4_0_final_v1.css === */
/* IPEKERP_STOREFRONT_APPROVED_HEADER_4_0_FINAL_V1
   Section 3/3 - final visual lock, responsive tightening and acceptance layer.
   Approved desktop target remains the user-approved 1741px reference.
   No backend, catalog, pricing, stock, cart or provider behavior mutation.
*/

@media (min-width: 1180px) {
  .sf4-approved-header__benefit-bar {
    height: 44px !important;
    min-height: 44px !important;
  }

  .sf4-approved-header__benefit-inner {
    height: 44px !important;
  }

  .sf4-approved-header__main {
    height: 126px !important;
    min-height: 126px !important;
  }

  .sf4-approved-header__main-inner {
    height: 126px !important;
    min-height: 126px !important;
    grid-template-columns: 320px minmax(0, 1fr) 338px !important;
    gap: 28px !important;
  }

  .sf4-approved-header form.sf4-approved-search {
    height: 54px !important;
    grid-template-columns: 176px minmax(0, 1fr) 60px !important;
  }

  .sf4-approved-search__category,
  .sf4-approved-header form.sf4-approved-search input[type="search"],
  .sf4-approved-search__submit {
    height: 52px !important;
    min-height: 52px !important;
  }

  nav.sf-site-nav.sf4-approved-nav,
  .sf4-approved-header .sf4-approved-nav__inner {
    height: 58px !important;
    min-height: 58px !important;
  }

  .sf4-brand-rail,
  .sf4-brand-rail__inner {
    height: 149px !important;
    min-height: 149px !important;
  }

  .sf4-approved-header__benefit-inner,
  .sf4-approved-header__main-inner,
  .sf4-approved-header .sf4-approved-nav__inner,
  .sf4-brand-rail__inner {
    width: min(calc(100% - 92px), 1560px) !important;
    max-width: 1560px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .sf4-approved-header,
  .sf4-approved-header__main,
  .sf4-approved-nav,
  .sf4-brand-rail {
    transform: none !important;
    zoom: 1 !important;
  }

  .sf4-approved-header .sf4-approved-brand {
    flex-shrink: 0 !important;
  }

  .sf4-approved-header form.sf4-approved-search {
    min-width: 0 !important;
  }

  .sf4-approved-header .sf4-approved-actions {
    min-width: 322px !important;
  }

  .sf4-approved-header .sf4-approved-nav__blog {
    margin-left: auto !important;
  }

  .sf4-brand {
    min-width: 0 !important;
  }
}

@media (min-width: 621px) and (max-width: 1179px) {
  .sf4-approved-header__benefit-inner,
  .sf4-approved-header__main-inner,
  .sf4-approved-header .sf4-approved-nav__inner,
  .sf4-brand-rail__inner {
    width: min(calc(100% - 32px), 1120px) !important;
    margin-inline: auto !important;
  }

  .sf4-approved-header__benefit-bar,
  .sf4-approved-header__benefit-inner {
    height: 40px !important;
    min-height: 40px !important;
  }

  .sf4-approved-header__benefit {
    font-size: 11.5px !important;
  }

  .sf4-approved-header__benefit:nth-child(2) {
    display: none !important;
  }

  .sf4-approved-header__benefit-inner {
    grid-template-columns: 1fr 1fr !important;
    gap: 18px !important;
  }

  .sf4-approved-header__main {
    height: auto !important;
    min-height: 144px !important;
  }

  .sf4-approved-header__main-inner {
    height: auto !important;
    min-height: 144px !important;
    padding: 13px 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "brand actions"
      "search search" !important;
    row-gap: 12px !important;
    column-gap: 18px !important;
  }

  .sf4-approved-brand { grid-area: brand !important; }
  .sf4-approved-search { grid-area: search !important; }
  .sf4-approved-actions { grid-area: actions !important; }

  .sf4-approved-brand__mark {
    width: 58px !important;
    height: 58px !important;
    flex-basis: 58px !important;
  }

  .sf4-approved-brand__mark img {
    width: 58px !important;
    height: 58px !important;
  }

  .sf4-approved-brand__copy strong {
    font-size: 25px !important;
  }

  .sf4-approved-brand__copy small {
    font-size: 8.5px !important;
  }

  .sf4-approved-header .sf4-approved-actions {
    min-width: 210px !important;
    height: 56px !important;
    grid-template-columns: 100px 106px !important;
  }

  .sf4-approved-header .sf4-approved-action {
    height: 54px !important;
  }

  .sf4-approved-action--favorite {
    display: none !important;
  }

  .sf4-approved-header form.sf4-approved-search {
    height: 50px !important;
    grid-template-columns: 154px minmax(0, 1fr) 54px !important;
  }

  .sf4-approved-search__category,
  .sf4-approved-header form.sf4-approved-search input[type="search"],
  .sf4-approved-search__submit {
    height: 48px !important;
    min-height: 48px !important;
  }

  nav.sf-site-nav.sf4-approved-nav {
    height: 54px !important;
    min-height: 54px !important;
  }

  .sf4-approved-header .sf4-approved-nav__inner {
    height: 54px !important;
    min-height: 54px !important;
    gap: 16px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
  }

  .sf4-approved-header .sf4-approved-nav__inner::-webkit-scrollbar {
    display: none !important;
  }

  .sf4-approved-header .sf4-approved-nav__inner > a {
    height: 54px !important;
    min-height: 54px !important;
    font-size: 12px !important;
  }

  .sf4-approved-header .sf4-approved-nav__all {
    width: 196px !important;
    min-width: 196px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin-right: 4px !important;
  }

  .sf4-approved-header .sf4-approved-nav__blog {
    height: 38px !important;
    min-height: 38px !important;
    margin-left: 0 !important;
  }

  .sf4-brand-rail {
    height: 132px !important;
    min-height: 132px !important;
  }

  .sf4-brand-rail__inner {
    height: 132px !important;
    min-height: 132px !important;
    padding-top: 14px !important;
    grid-template-columns: 38px repeat(10, 106px) 38px !important;
    gap: 7px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
  }

  .sf4-brand-rail__inner::-webkit-scrollbar {
    display: none !important;
  }

  .sf4-brand {
    height: 106px !important;
    grid-template-rows: 80px 20px !important;
  }

  .sf4-brand__logo {
    width: 78px !important;
    height: 78px !important;
  }

  .sf4-brand__logo svg {
    max-width: 64px !important;
    max-height: 64px !important;
  }

  .sf4-brand__name {
    font-size: 10.5px !important;
  }

  .sf4-brand-rail__arrow {
    width: 34px !important;
    height: 48px !important;
  }
}

@media (max-width: 620px) {
  .sf4-approved-header__benefit-bar,
  .sf4-approved-header__benefit-inner {
    height: 34px !important;
    min-height: 34px !important;
  }

  .sf4-approved-header__benefit-inner,
  .sf4-approved-header__main-inner,
  .sf4-brand-rail__inner {
    width: calc(100% - 24px) !important;
    margin-inline: auto !important;
  }

  .sf4-approved-header__benefit-inner {
    display: flex !important;
    justify-content: center !important;
  }

  .sf4-approved-header__benefit {
    display: none !important;
  }

  .sf4-approved-header__benefit:first-child {
    display: flex !important;
    justify-content: center !important;
    font-size: 10.5px !important;
    gap: 6px !important;
  }

  .sf4-approved-header__main {
    height: auto !important;
    min-height: 126px !important;
  }

  .sf4-approved-header__main-inner {
    height: auto !important;
    min-height: 126px !important;
    padding: 10px 0 12px !important;
    grid-template-columns: minmax(0, 1fr) 46px !important;
    grid-template-areas:
      "brand actions"
      "search search" !important;
    row-gap: 10px !important;
    column-gap: 10px !important;
  }

  .sf4-approved-brand {
    grid-area: brand !important;
    gap: 9px !important;
  }

  .sf4-approved-brand__mark {
    width: 46px !important;
    height: 46px !important;
    flex-basis: 46px !important;
  }

  .sf4-approved-brand__mark img {
    width: 46px !important;
    height: 46px !important;
  }

  .sf4-approved-brand__copy {
    gap: 3px !important;
  }

  .sf4-approved-brand__copy strong {
    font-size: 21px !important;
  }

  .sf4-approved-brand__copy small {
    font-size: 7px !important;
    letter-spacing: .28em !important;
  }

  .sf4-approved-actions {
    grid-area: actions !important;
  }

  .sf4-approved-header .sf4-approved-actions {
    min-width: 46px !important;
    width: 46px !important;
    height: 46px !important;
    display: block !important;
  }

  .sf4-approved-header .sf4-approved-action {
    display: none !important;
  }

  .sf4-approved-header .sf-site-menu-button {
    width: 46px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    place-content: center !important;
    gap: 4px !important;
    border: 1px solid #dce2e9 !important;
    border-radius: 7px !important;
    background: #fff !important;
  }

  .sf4-approved-header .sf-site-menu-button > span {
    width: 20px !important;
    height: 2px !important;
    display: block !important;
    background: #0b1d38 !important;
  }

  .sf4-approved-search {
    grid-area: search !important;
  }

  .sf4-approved-header form.sf4-approved-search {
    height: 46px !important;
    grid-template-columns: minmax(0, 1fr) 50px !important;
    border-radius: 7px !important;
  }

  .sf4-approved-search__category {
    display: none !important;
  }

  .sf4-approved-header form.sf4-approved-search input[type="search"],
  .sf4-approved-search__submit {
    height: 44px !important;
    min-height: 44px !important;
  }

  .sf4-approved-header form.sf4-approved-search input[type="search"] {
    padding-inline: 13px !important;
    font-size: 12px !important;
  }

  .sf4-approved-search__submit {
    width: 50px !important;
  }

  nav.sf-site-nav.sf4-approved-nav {
    display: none !important;
  }

  .sf4-brand-rail {
    height: 118px !important;
    min-height: 118px !important;
  }

  .sf4-brand-rail__inner {
    height: 118px !important;
    min-height: 118px !important;
    padding: 12px 0 8px !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
    scroll-snap-type: x proximity !important;
  }

  .sf4-brand-rail__inner::-webkit-scrollbar {
    display: none !important;
  }

  .sf4-brand-rail__arrow {
    display: none !important;
  }

  .sf4-brand {
    flex: 0 0 82px !important;
    height: 96px !important;
    grid-template-rows: 70px 18px !important;
    gap: 4px !important;
    scroll-snap-align: start !important;
  }

  .sf4-brand__logo {
    width: 68px !important;
    height: 68px !important;
  }

  .sf4-brand__logo svg {
    max-width: 56px !important;
    max-height: 56px !important;
  }

  .sf4-brand__name {
    max-width: 80px !important;
    font-size: 9.5px !important;
    line-height: 16px !important;
  }

  .sf-site-mobile-menu:not([hidden]) {
    display: block !important;
    border-top: 1px solid #e5e9ef !important;
    border-bottom: 1px solid #e5e9ef !important;
    background: #fff !important;
  }

  .sf4-approved-mobile-menu__inner {
    width: calc(100% - 24px) !important;
    margin: 0 auto !important;
    padding: 12px 0 16px !important;
    display: grid !important;
    gap: 5px !important;
  }

  .sf4-approved-mobile-menu__inner > a {
    min-height: 40px !important;
    padding: 0 10px !important;
    display: flex !important;
    align-items: center !important;
    border-radius: 6px !important;
    color: #10213c !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 650 !important;
  }

  .sf-site-mobile-search {
    height: 44px !important;
    margin-bottom: 8px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 58px !important;
    overflow: hidden !important;
    border: 1px solid #d6dce4 !important;
    border-radius: 7px !important;
  }

  .sf-site-mobile-search input {
    min-width: 0 !important;
    border: 0 !important;
    padding: 0 12px !important;
    outline: 0 !important;
  }

  .sf-site-mobile-search button {
    border: 0 !important;
    background: #075fc0 !important;
    color: #fff !important;
    font-weight: 700 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sf4-approved-header *,
  .sf4-brand-rail * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* === HEADER SOURCE 04: storefront_approved_header_4_0_reference_alignment_v1.css === */
/* IPEKERP_STOREFRONT_APPROVED_HEADER_4_0_REFERENCE_ALIGNMENT_V1
   Post-acceptance visual correction based on the actual browser screenshot.
   Goal: restore the approved reference composition at 1741px and scale
   proportionally on a 1918/1920 desktop without the excessive side margins.
   This stylesheet MUST remain the last stylesheet in <head>.
*/

@media (min-width: 1180px) {

  /* ----------------------------------------------------------
     REFERENCE SHELL
     Approved reference has ~94px side margins at 1741px.
     Keep that optical margin fluid up to a 1920-class viewport.
     ---------------------------------------------------------- */
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__benefit-inner,

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__main-inner,

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner,

  body .sf4-brand-rail
  .sf4-brand-rail__inner {
    width: min(calc(100% - 188px), 1730px) !important;
    max-width: 1730px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* ----------------------------------------------------------
     TOP BLUE BAR
     ---------------------------------------------------------- */
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__benefit-bar {
    height: 44px !important;
    min-height: 44px !important;
    background: linear-gradient(
      90deg,
      #04366f 0%,
      #064681 50%,
      #04366f 100%
    ) !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__benefit-inner {
    height: 44px !important;
    min-height: 44px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__benefit {
    color: #fff !important;
    font-size: 13.5px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
  }

  /* ----------------------------------------------------------
     MAIN HEADER
     ---------------------------------------------------------- */
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__main {
    height: 126px !important;
    min-height: 126px !important;
    background: #fff !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__main-inner {
    height: 126px !important;
    min-height: 126px !important;
    grid-template-columns: 320px minmax(0, 1fr) 338px !important;
    gap: 28px !important;
  }

  body header.sf-site-header.sf4-approved-header
  a.sf4-approved-brand {
    width: max-content !important;
    min-width: 0 !important;
    gap: 13px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-brand__mark {
    width: 76px !important;
    height: 76px !important;
    flex: 0 0 76px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-brand__mark img {
    width: 76px !important;
    height: 76px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-brand__copy strong {
    color: #07162d !important;
    font-size: 32px !important;
    line-height: .94 !important;
    font-weight: 800 !important;
    letter-spacing: -.05em !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-brand__copy small {
    color: #10213e !important;
    font-size: 10.5px !important;
    font-weight: 750 !important;
    letter-spacing: .36em !important;
  }

  /* ----------------------------------------------------------
     SEARCH — prevent older header CSS from resizing tracks
     ---------------------------------------------------------- */
  body header.sf-site-header.sf4-approved-header
  form.sf-site-search.sf4-approved-search {
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 54px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 176px minmax(0, 1fr) 60px !important;
    align-items: stretch !important;
    overflow: hidden !important;
    border: 1px solid #d2d8e0 !important;
    border-radius: 9px !important;
    background: #fff !important;
    box-shadow: none !important;
  }

  body header.sf-site-header.sf4-approved-header
  form.sf-site-search.sf4-approved-search
  > button.sf4-approved-search__category {
    position: static !important;
    width: auto !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border: 0 !important;
    border-right: 1px solid #e2e6eb !important;
    border-radius: 0 !important;
    background: #fbfcfd !important;
    color: #11233f !important;
    box-shadow: none !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
  }

  body header.sf-site-header.sf4-approved-header
  form.sf-site-search.sf4-approved-search
  > input[type="search"] {
    position: static !important;
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 19px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    font-size: 14.5px !important;
  }

  body header.sf-site-header.sf4-approved-header
  form.sf-site-search.sf4-approved-search
  > button.sf4-approved-search__submit {
    position: static !important;
    inset: auto !important;
    width: 60px !important;
    height: 52px !important;
    min-height: 52px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(
      180deg,
      #0869d0 0%,
      #0559b7 100%
    ) !important;
    color: #fff !important;
    box-shadow: none !important;
  }

  /* ----------------------------------------------------------
     ACTIONS
     ---------------------------------------------------------- */
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions {
    min-width: 322px !important;
    height: 72px !important;
    display: grid !important;
    grid-template-columns: 104px 102px 116px !important;
    gap: 2px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action {
    height: 66px !important;
  }

  /* ----------------------------------------------------------
     NAV
     Restore the two blocks that the actual screenshot shows
     were overridden by older storefront CSS.
     ---------------------------------------------------------- */
  body header.sf-site-header.sf4-approved-header
  nav.sf-site-nav.sf4-approved-nav {
    height: 58px !important;
    min-height: 58px !important;
    border-top: 0 !important;
    border-bottom: 1px solid #e4e8ed !important;
    background: #fff !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner {
    height: 58px !important;
    min-height: 58px !important;
    display: flex !important;
    align-items: center !important;
    gap: 24px !important;
    overflow: visible !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner
  > a {
    height: 58px !important;
    min-height: 58px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #12233f !important;
    box-shadow: none !important;
    font-size: 13.5px !important;
    line-height: 1 !important;
    font-weight: 670 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner
  > a.sf4-approved-nav__all {
    width: 222px !important;
    min-width: 222px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 18px 0 0 !important;
    padding: 0 18px !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    border-radius: 7px !important;
    background: linear-gradient(
      180deg,
      #0868cf 0%,
      #0759b5 100%
    ) !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(5, 84, 171, .16) !important;
    font-weight: 750 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner
  > a.sf4-approved-nav__all
  > svg {
    color: #fff !important;
    stroke: #fff !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner
  > a.sf4-approved-nav__blog {
    width: 108px !important;
    min-width: 108px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin-left: auto !important;
    padding: 0 16px !important;
    border-radius: 6px !important;
    background: #06214a !important;
    color: #fff !important;
    box-shadow: 0 5px 16px rgba(7, 22, 45, .10) !important;
    font-weight: 750 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner
  > a.sf4-approved-nav__blog
  > svg {
    color: #fff !important;
    stroke: #fff !important;
  }

  /* ----------------------------------------------------------
     BRAND RAIL
     ---------------------------------------------------------- */
  body .sf4-brand-rail {
    height: 149px !important;
    min-height: 149px !important;
    background: linear-gradient(
      180deg,
      #fbfcfd 0%,
      #fff 62%,
      #fafbfd 100%
    ) !important;
  }

  body .sf4-brand-rail
  .sf4-brand-rail__inner {
    height: 149px !important;
    min-height: 149px !important;
    padding: 18px 0 11px !important;
    display: grid !important;
    grid-template-columns:
      44px
      repeat(10, minmax(0, 1fr))
      44px !important;
    gap: 8px !important;
  }

  body .sf4-brand-rail .sf4-brand {
    height: 118px !important;
    grid-template-rows: 90px 20px !important;
    gap: 6px !important;
  }

  body .sf4-brand-rail .sf4-brand__logo {
    width: 88px !important;
    height: 88px !important;
    border: 1px solid #e4e8ee !important;
    border-radius: 50% !important;
    background: #fff !important;
    box-shadow: 0 6px 16px rgba(18, 42, 70, .045) !important;
  }

  body .sf4-brand-rail .sf4-brand__name {
    font-size: 11.8px !important;
    font-weight: 500 !important;
    color: #465366 !important;
  }
}

/* 1741px reference crop: keep the original approved shell almost exact. */
@media (min-width: 1680px) and (max-width: 1799px) {
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__benefit-inner,

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__main-inner,

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner,

  body .sf4-brand-rail
  .sf4-brand-rail__inner {
    width: calc(100% - 188px) !important;
    max-width: none !important;
  }
}

/* 1918/1920 desktop shown in the user's real browser screenshot. */
@media (min-width: 1800px) {
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__benefit-inner,

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__main-inner,

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner,

  body .sf4-brand-rail
  .sf4-brand-rail__inner {
    width: calc(100% - 188px) !important;
    max-width: 1730px !important;
  }
}

/* === HEADER SOURCE 05: storefront_approved_header_4_0_brand_asset_finish_v1.css === */
/* IPEKERP_STOREFRONT_APPROVED_HEADER_4_0_BRAND_ASSET_FINISH_V1
   Final brand-rail asset correction after the approved alignment layer.
   Geometry is intentionally untouched.
*/

@media (min-width: 1180px) {
  body .sf4-brand-rail
  .sf4-brand__logo.sf4-brand__logo--peugeot
  > img.sf4-brand__asset {
    display: block !important;
    width: 58px !important;
    height: 58px !important;
    max-width: 58px !important;
    max-height: 58px !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body .sf4-brand-rail
  .sf4-brand__logo.sf4-brand__logo--peugeot {
    display: grid !important;
    place-items: center !important;
  }
}

@media (min-width: 621px) and (max-width: 1179px) {
  body .sf4-brand-rail
  .sf4-brand__logo.sf4-brand__logo--peugeot
  > img.sf4-brand__asset {
    display: block !important;
    width: 52px !important;
    height: 52px !important;
    object-fit: contain !important;
  }
}

@media (max-width: 620px) {
  body .sf4-brand-rail
  .sf4-brand__logo.sf4-brand__logo--peugeot
  > img.sf4-brand__asset {
    display: block !important;
    width: 46px !important;
    height: 46px !important;
    object-fit: contain !important;
  }
}

/* === HEADER SOURCE 06: storefront_approved_header_4_0_local_brand_logos_v1.css === */
/* IPEKERP_STOREFRONT_LOCAL_BRAND_LOGOS_V1
   Uses user-provided local PNG/JPG/JPEG brand logos.
   Header/rail geometry is intentionally unchanged.
*/

.sf4-brand__logo > img.sf4-brand__asset.sf4-brand__asset--local {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 64px !important;
  max-height: 62px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.sf4-brand__logo--audi > img.sf4-brand__asset--local,
.sf4-brand__logo--ford > img.sf4-brand__asset--local,
.sf4-brand__logo--hyundai > img.sf4-brand__asset--local {
  max-width: 68px !important;
  max-height: 52px !important;
}

.sf4-brand__logo--peugeot > img.sf4-brand__asset--local,
.sf4-brand__logo--renault > img.sf4-brand__asset--local {
  max-width: 58px !important;
  max-height: 62px !important;
}

@media (min-width: 621px) and (max-width: 1179px) {
  .sf4-brand__logo > img.sf4-brand__asset.sf4-brand__asset--local {
    max-width: 58px !important;
    max-height: 56px !important;
  }

  .sf4-brand__logo--audi > img.sf4-brand__asset--local,
  .sf4-brand__logo--ford > img.sf4-brand__asset--local,
  .sf4-brand__logo--hyundai > img.sf4-brand__asset--local {
    max-width: 62px !important;
    max-height: 48px !important;
  }
}

@media (max-width: 620px) {
  .sf4-brand__logo > img.sf4-brand__asset.sf4-brand__asset--local {
    max-width: 50px !important;
    max-height: 48px !important;
  }

  .sf4-brand__logo--audi > img.sf4-brand__asset--local,
  .sf4-brand__logo--ford > img.sf4-brand__asset--local,
  .sf4-brand__logo--hyundai > img.sf4-brand__asset--local {
    max-width: 54px !important;
    max-height: 42px !important;
  }
}

/* === HEADER SOURCE 07: storefront_header_ux_brand_rail_final_v2.css === */
/* IPEKERP_STOREFRONT_HEADER_UX_BRAND_RAIL_FINAL_V2
   Final cleanup:
   - removes inherited search/category magnifier pseudo elements
   - precision-centers search icon
   - upgrades automotive category SVG styling
   - prevents partial brand cards
   - supports all user-provided local brand logos
*/

/* SEARCH: remove every legacy decorative search icon */
body header.sf-site-header.sf4-approved-header form.sf-site-search.sf4-approved-search::before,
body header.sf-site-header.sf4-approved-header form.sf-site-search.sf4-approved-search::after,
body header.sf-site-header.sf4-approved-header form.sf-site-search.sf4-approved-search > button.sf4-approved-search__category::before,
body header.sf-site-header.sf4-approved-header form.sf-site-search.sf4-approved-search > button.sf4-approved-search__category::after,
body header.sf-site-header.sf4-approved-header .sf4-approved-search__category-label::before,
body header.sf-site-header.sf4-approved-header .sf4-approved-search__category-label::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
  background-image: none !important;
  -webkit-mask: none !important;
  mask: none !important;
}

body header.sf-site-header.sf4-approved-header form.sf-site-search.sf4-approved-search > button.sf4-approved-search__category {
  position: static !important;
  padding-left: 20px !important;
  background-image: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

body header.sf-site-header.sf4-approved-header .sf4-approved-search__category-caret {
  width: 15px !important;
  height: 15px !important;
  display: grid !important;
  place-items: center !important;
  margin-left: auto !important;
}

body header.sf-site-header.sf4-approved-header .sf4-approved-search__category-caret svg {
  width: 15px !important;
  height: 15px !important;
  margin: 0 !important;
  position: static !important;
  transform: none !important;
}

body header.sf-site-header.sf4-approved-header form.sf-site-search.sf4-approved-search > button.sf4-approved-search__submit {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  line-height: 1 !important;
}

body header.sf-site-header.sf4-approved-header form.sf-site-search.sf4-approved-search > button.sf4-approved-search__submit > svg {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: 23px !important;
  height: 23px !important;
  margin: 0 !important;
  overflow: visible !important;
}

/* NAVIGATION ICONS */
body header.sf-site-header.sf4-approved-header .sf4-approved-nav__inner > a {
  gap: 8px !important;
}

body header.sf-site-header.sf4-approved-header .sf4-approved-nav__inner > a > svg {
  width: 20px !important;
  height: 20px !important;
  flex: 0 0 20px !important;
  color: currentColor !important;
  stroke: currentColor !important;
  stroke-width: 1.75 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  fill: none !important;
  shape-rendering: geometricPrecision !important;
}

body header.sf-site-header.sf4-approved-header .sf4-approved-nav__all > svg,
body header.sf-site-header.sf4-approved-header .sf4-approved-nav__blog > svg {
  width: 19px !important;
  height: 19px !important;
}

/* BRAND RAIL: exact-fit card viewport */
body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__inner {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__viewport {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__viewport::-webkit-scrollbar {
  display: none !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__track {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  width: max-content !important;
  min-width: max-content !important;
  padding: 0 !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand {
  flex: 0 0 var(--sf4-brand-card-width, 100px) !important;
  width: var(--sf4-brand-card-width, 100px) !important;
  min-width: var(--sf4-brand-card-width, 100px) !important;
  scroll-snap-align: start !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo {
  overflow: hidden !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo > img.sf4-brand__asset.sf4-brand__asset--local {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 64px !important;
  max-height: 60px !important;
  object-fit: contain !important;
  object-position: center !important;
  margin: 0 auto !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo--audi > img.sf4-brand__asset--local,
body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo--ford > img.sf4-brand__asset--local,
body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo--hyundai > img.sf4-brand__asset--local,
body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo--citroen > img.sf4-brand__asset--local {
  max-width: 68px !important;
  max-height: 52px !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo--peugeot > img.sf4-brand__asset--local,
body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo--renault > img.sf4-brand__asset--local,
body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand__logo--cupra > img.sf4-brand__asset--local {
  max-width: 58px !important;
  max-height: 60px !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__arrow {
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 52px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 1px solid #dfe6ee !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #17304d !important;
  box-shadow: 0 6px 16px rgba(10, 28, 54, .07) !important;
  transition: opacity .16s ease, transform .16s ease, box-shadow .16s ease !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__arrow:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 9px 20px rgba(10, 28, 54, .11) !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__arrow[data-disabled="true"] {
  opacity: .38 !important;
  pointer-events: none !important;
  box-shadow: none !important;
}

body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__arrow svg {
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  fill: none !important;
}

@media (min-width: 1180px) {
  body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__inner {
    height: 149px !important;
    min-height: 149px !important;
    padding-top: 18px !important;
    padding-bottom: 10px !important;
  }
}

@media (min-width: 621px) and (max-width: 1179px) {
  body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__inner {
    height: 132px !important;
    min-height: 132px !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__arrow {
    flex-basis: 38px !important;
    width: 38px !important;
    height: 48px !important;
  }
}

@media (max-width: 620px) {
  body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__inner {
    height: 118px !important;
    min-height: 118px !important;
    gap: 0 !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__arrow {
    display: none !important;
  }

  body .sf4-brand-rail[data-brand-rail="v2"] .sf4-brand-rail__viewport {
    overflow-x: auto !important;
    scroll-snap-type: x proximity !important;
  }
}

/* === HEADER SOURCE 08: storefront_header_micro_fix_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_MICRO_FIX_V1
   - Fix search submit icon optical centering
   - Give account/favorites/cart actions more breathing room
*/

.sf4-approved-header form.sf-site-search.sf4-approved-search > button.sf4-approved-search__submit {
  width: 62px !important;
  min-width: 62px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

.sf4-approved-header form.sf-site-search.sf4-approved-search > button.sf4-approved-search__submit > svg {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  display: block !important;
  margin: 0 !important;
  transform: translateX(-1.5px) !important;
  stroke-width: 1.95 !important;
}

@media (min-width: 1180px) {
  .sf4-approved-header .sf4-approved-actions {
    min-width: 360px !important;
    grid-template-columns: 116px 116px 122px !important;
    gap: 6px !important;
  }

  .sf4-approved-header .sf4-approved-action {
    padding: 0 10px !important;
    gap: 10px !important;
  }

  .sf4-approved-header .sf4-approved-action:not(:first-child)::before {
    left: -4px !important;
    top: 10px !important;
    bottom: 10px !important;
  }

  .sf4-approved-header .sf4-approved-action__copy {
    gap: 3px !important;
  }

  .sf4-approved-header .sf4-approved-action__copy strong,
  .sf4-approved-header .sf4-approved-action__copy small {
    white-space: nowrap !important;
  }

  .sf4-approved-header .sf4-approved-action--favorite {
    min-width: 116px !important;
  }
}

/* === HEADER SOURCE 09: storefront_header_actions_spacing_fix_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_ACTIONS_SPACING_FIX_V1
   Corrects the real root cause of the crowded Account / Favorites / Cart block:
   the inner action grid was widened previously, but the parent header column was not.
*/

@media (min-width: 1180px) {
  /* Give the right action region real physical space in the parent grid. */
  .sf4-approved-header .sf4-approved-header__main-inner {
    grid-template-columns: 320px minmax(0, 1fr) 392px !important;
    gap: 28px !important;
  }

  /* Fill the 392px region with three independent action cells. */
  .sf4-approved-header .sf4-approved-actions {
    width: 392px !important;
    min-width: 392px !important;
    max-width: 392px !important;
    height: 72px !important;
    grid-template-columns: 124px 124px 132px !important;
    gap: 6px !important;
    align-items: center !important;
  }

  .sf4-approved-header .sf4-approved-action {
    min-width: 0 !important;
    width: 100% !important;
    height: 66px !important;
    padding: 0 10px !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 9px !important;
    align-items: center !important;
    overflow: visible !important;
  }

  .sf4-approved-header .sf4-approved-action__icon {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
  }

  .sf4-approved-header .sf4-approved-action__copy {
    min-width: 0 !important;
    width: auto !important;
    gap: 3px !important;
    overflow: visible !important;
  }

  .sf4-approved-header .sf4-approved-action__copy strong {
    font-size: 13px !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
    letter-spacing: -0.01em !important;
  }

  .sf4-approved-header .sf4-approved-action__copy small {
    font-size: 10.5px !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
  }

  /* Separators sit in the gap, not on top of the text. */
  .sf4-approved-header .sf4-approved-action:not(:first-child)::before {
    left: -4px !important;
    top: 10px !important;
    bottom: 10px !important;
    opacity: .78 !important;
  }

  .sf4-approved-header .sf4-approved-action--favorite,
  .sf4-approved-header .sf4-approved-action--cart {
    margin-left: 0 !important;
  }

  .sf4-approved-header .sf4-approved-cart-badge {
    right: 4px !important;
    top: -1px !important;
  }
}

/* 1741-class desktops still get enough room without breaking the search. */
@media (min-width: 1180px) and (max-width: 1799px) {
  .sf4-approved-header .sf4-approved-header__main-inner {
    grid-template-columns: 300px minmax(0, 1fr) 382px !important;
    gap: 24px !important;
  }

  .sf4-approved-header .sf4-approved-actions {
    width: 382px !important;
    min-width: 382px !important;
    max-width: 382px !important;
    grid-template-columns: 121px 121px 128px !important;
    gap: 6px !important;
  }

  .sf4-approved-header .sf4-approved-action {
    padding-left: 8px !important;
    padding-right: 8px !important;
    gap: 8px !important;
  }
}

/* === HEADER SOURCE 10: storefront_header_actions_equal_grid_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_ACTIONS_EQUAL_GRID_V1
   Finalizes Account / Favorites / Cart as three equal visual cells.
   Removes all separators and normalizes spacing.
*/

@media (min-width: 1180px) {

  /* Parent right-side room */
  .sf4-approved-header .sf4-approved-header__main-inner {
    grid-template-columns: 300px minmax(0, 1fr) 396px !important;
    gap: 24px !important;
  }

  /* Equal 3-column system */
  .sf4-approved-header .sf4-approved-actions {
    width: 396px !important;
    min-width: 396px !important;
    max-width: 396px !important;

    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    column-gap: 12px !important;

    align-items: center !important;

    border: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;

    padding: 0 !important;
    margin: 0 !important;
  }

  /* Remove every legacy divider */
  .sf4-approved-header .sf4-approved-actions::before,
  .sf4-approved-header .sf4-approved-actions::after,
  .sf4-approved-header .sf4-approved-action::before,
  .sf4-approved-header .sf4-approved-action::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    width: 0 !important;
    height: 0 !important;
  }

  .sf4-approved-header .sf4-approved-action {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    height: 66px !important;

    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    column-gap: 10px !important;

    align-items: center !important;

    padding: 0 8px !important;
    margin: 0 !important;

    border: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;

    overflow: visible !important;
  }

  .sf4-approved-header .sf4-approved-action__icon {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;

    display: grid !important;
    place-items: center !important;

    margin: 0 !important;
  }

  .sf4-approved-header .sf4-approved-action__icon svg {
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
  }

  .sf4-approved-header .sf4-approved-action__copy {
    min-width: 0 !important;
    width: auto !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;

    gap: 3px !important;

    margin: 0 !important;
    padding: 0 !important;
  }

  .sf4-approved-header .sf4-approved-action__copy strong {
    margin: 0 !important;
    padding: 0 !important;

    font-size: 13px !important;
    line-height: 1.05 !important;
    letter-spacing: -0.01em !important;

    white-space: nowrap !important;
  }

  .sf4-approved-header .sf4-approved-action__copy small {
    margin: 0 !important;
    padding: 0 !important;

    font-size: 10.5px !important;
    line-height: 1.05 !important;

    white-space: nowrap !important;
  }

  .sf4-approved-header .sf4-approved-action--account,
  .sf4-approved-header .sf4-approved-action--favorite,
  .sf4-approved-header .sf4-approved-action--cart {
    margin: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .sf4-approved-header .sf4-approved-cart-badge {
    top: 0 !important;
    right: 2px !important;
  }
}

/* Keep the same equal-grid logic on medium desktop widths. */
@media (min-width: 1180px) and (max-width: 1799px) {
  .sf4-approved-header .sf4-approved-header__main-inner {
    grid-template-columns: 290px minmax(0, 1fr) 390px !important;
    gap: 22px !important;
  }

  .sf4-approved-header .sf4-approved-actions {
    width: 390px !important;
    min-width: 390px !important;
    max-width: 390px !important;
    column-gap: 10px !important;
  }

  .sf4-approved-header .sf4-approved-action {
    grid-template-columns: 31px minmax(0, 1fr) !important;
    column-gap: 9px !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
  }
}

/* === HEADER SOURCE 11: storefront_header_actions_optical_equalize_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_ACTIONS_OPTICAL_EQUALIZE_V1
   Removes every remaining visual separator and gives Account/Favorites/Cart
   equal optical spacing by centering an equal-width icon+copy cluster in
   three equal parent cells.
*/

@media (min-width: 1180px) {

  /* Keep adequate parent space, but shift the action cluster a few px right. */
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__main-inner {
    grid-template-columns: 300px minmax(0, 1fr) 396px !important;
    gap: 24px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions {
    width: 390px !important;
    min-width: 390px !important;
    max-width: 390px !important;

    justify-self: end !important;

    display: grid !important;
    grid-template-columns: repeat(3, 130px) !important;
    column-gap: 0 !important;
    row-gap: 0 !important;

    align-items: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* Nuke every known / inherited separator source. */
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions::before,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions::after,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions > .sf4-approved-action::before,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions > .sf4-approved-action::after,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action + .sf4-approved-action::before,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action + .sf4-approved-action::after {
    content: none !important;
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;

    width: 0 !important;
    height: 0 !important;

    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions > .sf4-approved-action,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action + .sf4-approved-action,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action--account,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action--favorite,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action--cart {
    width: 130px !important;
    min-width: 130px !important;
    max-width: 130px !important;

    height: 66px !important;

    display: grid !important;
    grid-template-columns: 32px 72px !important;
    column-gap: 10px !important;
    justify-content: center !important;
    align-items: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;

    overflow: visible !important;
  }

  /* Hide any explicit divider/separator nodes if older markup contains one. */
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions [class*="divider"],
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions [class*="separator"] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    border: 0 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action__icon {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;

    display: grid !important;
    place-items: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    background: transparent !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action__icon svg {
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action__copy {
    width: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;

    gap: 3px !important;

    padding: 0 !important;
    margin: 0 !important;

    overflow: visible !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action__copy strong {
    width: 72px !important;
    margin: 0 !important;
    padding: 0 !important;

    font-size: 13px !important;
    line-height: 1.05 !important;
    letter-spacing: -0.01em !important;

    white-space: nowrap !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action__copy small {
    width: 72px !important;
    margin: 0 !important;
    padding: 0 !important;

    font-size: 10.5px !important;
    line-height: 1.05 !important;

    white-space: nowrap !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-cart-badge {
    top: -1px !important;
    right: 7px !important;
  }
}

/* 1741-class desktops: same optical system with 128px cells. */
@media (min-width: 1180px) and (max-width: 1799px) {

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-header__main-inner {
    grid-template-columns: 290px minmax(0, 1fr) 390px !important;
    gap: 22px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions {
    width: 384px !important;
    min-width: 384px !important;
    max-width: 384px !important;
    grid-template-columns: repeat(3, 128px) !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-actions > .sf4-approved-action,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action + .sf4-approved-action,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action--account,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action--favorite,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action--cart {
    width: 128px !important;
    min-width: 128px !important;
    max-width: 128px !important;
  }
}

/* === HEADER SOURCE 12: storefront_header_nav_full_width_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_NAV_FULL_WIDTH_V1
   Removes Blog from the primary navigation, adds four useful catalog topics,
   and distributes the full nav across the approved shell.
*/

@media (min-width: 1180px) {
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner {
    display: grid !important;
    grid-template-columns: 222px repeat(12, max-content) !important;
    align-items: center !important;
    justify-content: space-between !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
    overflow: visible !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    white-space: nowrap !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a.sf4-approved-nav__all {
    width: 222px !important;
    min-width: 222px !important;
    margin: 0 !important;
    padding: 0 18px !important;
    justify-content: flex-start !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a:not(.sf4-approved-nav__all) {
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 680 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a:not(.sf4-approved-nav__all) > svg {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
  }
}

@media (min-width: 1180px) and (max-width: 1799px) {
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner {
    grid-template-columns: 218px repeat(12, max-content) !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a.sf4-approved-nav__all {
    width: 218px !important;
    min-width: 218px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a:not(.sf4-approved-nav__all) {
    font-size: 12.2px !important;
    gap: 5px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a:not(.sf4-approved-nav__all) > svg {
    width: 17px !important;
    height: 17px !important;
    flex-basis: 17px !important;
  }
}

@media (min-width: 621px) and (max-width: 1179px) {
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner::-webkit-scrollbar {
    display: none !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }
}

/* IPEKERP_STOREFRONT_HEADER_NAV_1280_OVERFLOW_FIX_V1:START */
@media (min-width: 1024px) and (max-width: 1399px) {
  .sf4-approved-nav__inner {
    grid-template-columns: repeat(13, minmax(0, 1fr)) !important;
    grid-auto-columns: minmax(0, 1fr) !important;
    column-gap: 0 !important;
  }

  .sf4-approved-nav__inner > a {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
    gap: 2px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    overflow: hidden !important;
  }

  .sf4-approved-nav__inner > a > svg {
    flex: 0 0 auto !important;
    width: 14px !important;
    height: 14px !important;
  }

  .sf4-approved-nav__inner > a > span {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-align: center !important;
    font-size: 9px !important;
    line-height: 1.05 !important;
    letter-spacing: -0.08px !important;
  }
}
/* IPEKERP_STOREFRONT_HEADER_NAV_1280_OVERFLOW_FIX_V1:END */

/* === HEADER SOURCE 13: storefront_header_typeahead_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_TYPEAHEAD_V1 */
.sf4-approved-header .sf4-approved-search {
  position: relative !important;
  overflow: visible !important;
  z-index: 40 !important;
}

.sf4-approved-header .sf4-typeahead {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: calc(100% + 9px) !important;
  display: none;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #dfe7ef !important;
  border-radius: 15px !important;
  box-shadow: 0 24px 60px rgba(13,35,66,.16), 0 4px 12px rgba(13,35,66,.07) !important;
  z-index: 900 !important;
}

.sf4-approved-header .sf4-typeahead[data-open="true"] {
  display: block !important;
}

.sf4-approved-header .sf4-typeahead__head {
  min-height: 42px !important;
  padding: 10px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  background: #f8fafc !important;
  border-bottom: 1px solid #edf1f5 !important;
}

.sf4-approved-header .sf4-typeahead__eyebrow {
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
  color: #6b7d90 !important;
}

.sf4-approved-header .sf4-typeahead__count {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #8a99a9 !important;
}

.sf4-approved-header .sf4-typeahead__body {
  max-height: 480px !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

.sf4-approved-header .sf4-typeahead__loading,
.sf4-approved-header .sf4-typeahead__empty,
.sf4-approved-header .sf4-typeahead__error {
  min-height: 88px !important;
  padding: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  color: #66788b !important;
}

.sf4-approved-header .sf4-typeahead__loading {
  gap: 10px !important;
}

.sf4-approved-header .sf4-typeahead__spinner {
  width: 18px !important;
  height: 18px !important;
  border: 2px solid #d8e1eb !important;
  border-top-color: #0a6ed1 !important;
  border-radius: 50% !important;
  animation: sf4TypeaheadSpin .7s linear infinite !important;
}

@keyframes sf4TypeaheadSpin {
  to { transform: rotate(360deg); }
}

.sf4-approved-header .sf4-typeahead__item {
  min-height: 76px !important;
  padding: 10px 14px !important;
  display: grid !important;
  grid-template-columns: 54px minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  cursor: pointer !important;
  border-bottom: 1px solid #eef2f6 !important;
  background: #fff !important;
  transition: background-color .14s ease, box-shadow .14s ease !important;
}

.sf4-approved-header .sf4-typeahead__item:last-child {
  border-bottom: 0 !important;
}

.sf4-approved-header .sf4-typeahead__item:hover,
.sf4-approved-header .sf4-typeahead__item[data-active="true"] {
  background: #f3f8fd !important;
  box-shadow: inset 3px 0 0 #0875d1 !important;
}

.sf4-approved-header .sf4-typeahead__image {
  width: 54px !important;
  height: 54px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border: 1px solid #e4ebf2 !important;
  border-radius: 11px !important;
  background: #fff !important;
}

.sf4-approved-header .sf4-typeahead__image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.sf4-approved-header .sf4-typeahead__image-placeholder {
  width: 24px !important;
  height: 24px !important;
  color: #a5b2bf !important;
}

.sf4-approved-header .sf4-typeahead__copy {
  min-width: 0 !important;
}

.sf4-approved-header .sf4-typeahead__title {
  margin: 0 0 4px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  color: #142d49 !important;
}

.sf4-approved-header .sf4-typeahead__meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px 8px !important;
  font-size: 10.5px !important;
  line-height: 1.2 !important;
  color: #738397 !important;
}

.sf4-approved-header .sf4-typeahead__meta span:not(:last-child)::after {
  content: "•";
  margin-left: 8px;
  color: #c0c9d2;
}

.sf4-approved-header .sf4-typeahead__side {
  min-width: 92px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: center !important;
  gap: 5px !important;
  text-align: right !important;
}

.sf4-approved-header .sf4-typeahead__price {
  font-size: 13px !important;
  font-weight: 850 !important;
  color: #142d49 !important;
  white-space: nowrap !important;
}

.sf4-approved-header .sf4-typeahead__stock {
  padding: 3px 7px !important;
  border-radius: 999px !important;
  font-size: 9.5px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

.sf4-approved-header .sf4-typeahead__stock[data-in-stock="true"] {
  color: #0b7a45 !important;
  background: #e8f7ef !important;
}

.sf4-approved-header .sf4-typeahead__stock[data-in-stock="false"] {
  color: #9a5b00 !important;
  background: #fff4dd !important;
}

.sf4-approved-header .sf4-typeahead__footer {
  min-height: 48px !important;
  padding: 8px 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  background: #fbfcfd !important;
  border-top: 1px solid #e9eef3 !important;
}

.sf4-approved-header .sf4-typeahead__all {
  min-height: 34px !important;
  padding: 0 11px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  border-radius: 9px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  color: #0a67bd !important;
  text-decoration: none !important;
}

.sf4-approved-header .sf4-typeahead__all:hover {
  background: #eaf4fd !important;
}

.sf4-approved-header .sf4-typeahead__hint {
  font-size: 10px !important;
  color: #9aa7b4 !important;
  white-space: nowrap !important;
}

@media (max-width: 1179px) {
  .sf4-approved-header .sf4-typeahead {
    top: calc(100% + 7px) !important;
    border-radius: 13px !important;
  }

  .sf4-approved-header .sf4-typeahead__item {
    grid-template-columns: 48px minmax(0,1fr) !important;
  }

  .sf4-approved-header .sf4-typeahead__image {
    width: 48px !important;
    height: 48px !important;
  }

  .sf4-approved-header .sf4-typeahead__side {
    grid-column: 2 !important;
    min-width: 0 !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }

  .sf4-approved-header .sf4-typeahead__hint {
    display: none !important;
  }
}

@media (max-width: 620px) {
  .sf4-approved-header .sf4-typeahead {
    left: -4px !important;
    right: -4px !important;
  }

  .sf4-approved-header .sf4-typeahead__body {
    max-height: 410px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sf4-approved-header .sf4-typeahead__spinner {
    animation: none !important;
  }

  .sf4-approved-header .sf4-typeahead__item {
    transition: none !important;
  }
}

/* === HEADER SOURCE 14: storefront_header_mega_menu_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_MEGA_MENU_V1
   Hybrid mega menu:
   - primary topics come from the approved header navigation
   - live published catalog product types come from Catalog V2 filters
*/

.sf4-approved-header .sf4-approved-nav {
  position: relative !important;
  z-index: 120 !important;
  overflow: visible !important;
}

.sf4-approved-header .sf4-approved-nav__inner {
  position: relative !important;
  z-index: 2 !important;
}

.sf4-approved-header .sf4-approved-nav__all {
  cursor: pointer !important;
}

.sf4-approved-header .sf4-approved-nav__all[data-mega-open="true"] {
  box-shadow: inset 0 -3px 0 rgba(255,255,255,.92) !important;
}

.sf4-approved-header .sf4-mega-menu {
  position: absolute !important;
  top: calc(100% + 1px) !important;
  left: 50% !important;
  transform: translateX(-50%) translateY(-5px) !important;

  width: min(1730px, calc(100vw - 188px)) !important;
  max-width: calc(100vw - 24px) !important;

  display: block !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;

  overflow: hidden !important;

  background: #fff !important;
  border: 1px solid #dfe7ef !important;
  border-top: 0 !important;
  border-radius: 0 0 18px 18px !important;

  box-shadow:
    0 26px 65px rgba(14, 35, 62, .17),
    0 7px 18px rgba(14, 35, 62, .08) !important;

  transition:
    opacity .16s ease,
    transform .16s ease,
    visibility .16s ease !important;

  z-index: 1000 !important;
}

.sf4-approved-header .sf4-mega-menu[data-open="true"] {
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateX(-50%) translateY(0) !important;
}

.sf4-approved-header .sf4-mega-menu__layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 330px !important;
  align-items: stretch !important;
  min-height: 300px !important;
}

.sf4-approved-header .sf4-mega-menu__main {
  padding: 24px 26px 22px !important;
}

.sf4-approved-header .sf4-mega-menu__section-head {
  margin-bottom: 17px !important;

  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 20px !important;
}

.sf4-approved-header .sf4-mega-menu__title {
  margin: 0 !important;

  font-size: 17px !important;
  line-height: 1.1 !important;
  font-weight: 850 !important;
  letter-spacing: -.02em !important;
  color: #102a46 !important;
}

.sf4-approved-header .sf4-mega-menu__subtitle {
  margin-top: 5px !important;

  font-size: 11px !important;
  line-height: 1.35 !important;
  color: #7c8b9b !important;
}

.sf4-approved-header .sf4-mega-menu__all-categories {
  flex: 0 0 auto !important;

  min-height: 34px !important;
  padding: 0 10px !important;

  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;

  border-radius: 9px !important;

  font-size: 11px !important;
  font-weight: 800 !important;
  color: #0b6bbf !important;
  text-decoration: none !important;
}

.sf4-approved-header .sf4-mega-menu__all-categories:hover {
  background: #edf6fe !important;
}

.sf4-approved-header .sf4-mega-menu__topics {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px 12px !important;
}

.sf4-approved-header .sf4-mega-menu__topic {
  min-width: 0 !important;
  min-height: 62px !important;
  padding: 9px 11px !important;

  display: grid !important;
  grid-template-columns: 35px minmax(0, 1fr) 18px !important;
  align-items: center !important;
  gap: 10px !important;

  border: 1px solid transparent !important;
  border-radius: 12px !important;
  background: #fff !important;

  color: #18334f !important;
  text-decoration: none !important;

  transition:
    background-color .14s ease,
    border-color .14s ease,
    transform .14s ease !important;
}

.sf4-approved-header .sf4-mega-menu__topic:hover,
.sf4-approved-header .sf4-mega-menu__topic:focus-visible {
  background: #f3f8fd !important;
  border-color: #dceaf7 !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}

.sf4-approved-header .sf4-mega-menu__topic-icon {
  width: 35px !important;
  height: 35px !important;

  display: grid !important;
  place-items: center !important;

  border-radius: 10px !important;
  background: #edf5fc !important;

  color: #0a6cc6 !important;
}

.sf4-approved-header .sf4-mega-menu__topic-icon svg {
  width: 20px !important;
  height: 20px !important;

  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-approved-header .sf4-mega-menu__topic-copy {
  min-width: 0 !important;
}

.sf4-approved-header .sf4-mega-menu__topic-name {
  display: block !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;

  font-size: 12.5px !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
  color: #17324e !important;
}

.sf4-approved-header .sf4-mega-menu__topic-hint {
  display: block !important;
  margin-top: 4px !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;

  font-size: 9.8px !important;
  line-height: 1.1 !important;
  color: #8b99a7 !important;
}

.sf4-approved-header .sf4-mega-menu__topic-arrow {
  display: grid !important;
  place-items: center !important;

  font-size: 15px !important;
  color: #a4b2c0 !important;
}

.sf4-approved-header .sf4-mega-menu__topic:hover .sf4-mega-menu__topic-arrow {
  color: #0a6cc6 !important;
}

.sf4-approved-header .sf4-mega-menu__side {
  padding: 23px 21px !important;

  background:
    linear-gradient(180deg, #f7fbff 0%, #f2f7fb 100%) !important;

  border-left: 1px solid #e4ecf3 !important;
}

.sf4-approved-header .sf4-mega-menu__side-title {
  margin: 0 0 4px !important;

  font-size: 13px !important;
  font-weight: 850 !important;
  color: #17324e !important;
}

.sf4-approved-header .sf4-mega-menu__side-copy {
  margin: 0 0 15px !important;

  font-size: 10px !important;
  line-height: 1.35 !important;
  color: #7b8b9b !important;
}

.sf4-approved-header .sf4-mega-menu__live {
  display: grid !important;
  gap: 7px !important;
}

.sf4-approved-header .sf4-mega-menu__live-status {
  min-height: 42px !important;
  padding: 10px !important;

  display: flex !important;
  align-items: center !important;

  border-radius: 10px !important;
  background: rgba(255,255,255,.72) !important;

  font-size: 10.5px !important;
  line-height: 1.3 !important;
  color: #778797 !important;
}

.sf4-approved-header .sf4-mega-menu__live-link {
  min-height: 42px !important;
  padding: 8px 10px !important;

  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;

  border: 1px solid #e1eaf2 !important;
  border-radius: 10px !important;
  background: #fff !important;

  text-decoration: none !important;
}

.sf4-approved-header .sf4-mega-menu__live-link:hover,
.sf4-approved-header .sf4-mega-menu__live-link:focus-visible {
  border-color: #c8dced !important;
  background: #fbfdff !important;
  outline: none !important;
}

.sf4-approved-header .sf4-mega-menu__live-name {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;

  font-size: 11px !important;
  font-weight: 800 !important;
  color: #24405d !important;
}

.sf4-approved-header .sf4-mega-menu__live-count {
  min-width: 25px !important;
  height: 22px !important;
  padding: 0 7px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;
  background: #e8f3fd !important;

  font-size: 9.5px !important;
  font-weight: 850 !important;
  color: #0b6bbf !important;
}

.sf4-approved-header .sf4-mega-menu__side-actions {
  margin-top: 16px !important;
  padding-top: 14px !important;

  display: grid !important;
  gap: 7px !important;

  border-top: 1px solid #dce7ef !important;
}

.sf4-approved-header .sf4-mega-menu__side-action {
  min-height: 38px !important;
  padding: 0 10px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;

  border-radius: 9px !important;

  font-size: 10.5px !important;
  font-weight: 800 !important;
  color: #17324e !important;
  text-decoration: none !important;
}

.sf4-approved-header .sf4-mega-menu__side-action:hover {
  background: rgba(255,255,255,.85) !important;
}

@media (min-width: 1180px) and (max-width: 1799px) {
  .sf4-approved-header .sf4-mega-menu {
    width: calc(100vw - 188px) !important;
  }

  .sf4-approved-header .sf4-mega-menu__layout {
    grid-template-columns: minmax(0,1fr) 300px !important;
  }

  .sf4-approved-header .sf4-mega-menu__main {
    padding: 21px 22px 20px !important;
  }

  .sf4-approved-header .sf4-mega-menu__topics {
    gap: 7px 9px !important;
  }

  .sf4-approved-header .sf4-mega-menu__topic {
    min-height: 58px !important;
    padding: 8px 9px !important;
    grid-template-columns: 32px minmax(0,1fr) 15px !important;
    gap: 8px !important;
  }

  .sf4-approved-header .sf4-mega-menu__topic-icon {
    width: 32px !important;
    height: 32px !important;
  }

  .sf4-approved-header .sf4-mega-menu__topic-name {
    font-size: 11.8px !important;
  }
}

@media (max-width: 1179px) {
  .sf4-approved-header .sf4-mega-menu {
    position: fixed !important;
    top: 12px !important;
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;

    width: auto !important;
    max-width: none !important;

    transform: translateY(10px) !important;

    border: 1px solid #dfe7ef !important;
    border-radius: 17px !important;

    overflow-y: auto !important;
  }

  .sf4-approved-header .sf4-mega-menu[data-open="true"] {
    transform: translateY(0) !important;
  }

  .sf4-approved-header .sf4-mega-menu__layout {
    grid-template-columns: 1fr !important;
  }

  .sf4-approved-header .sf4-mega-menu__main {
    padding: 20px 17px !important;
  }

  .sf4-approved-header .sf4-mega-menu__topics {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }

  .sf4-approved-header .sf4-mega-menu__side {
    border-left: 0 !important;
    border-top: 1px solid #e4ecf3 !important;
  }
}

@media (max-width: 620px) {
  .sf4-approved-header .sf4-mega-menu__section-head {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  .sf4-approved-header .sf4-mega-menu__topics {
    grid-template-columns: 1fr !important;
  }

  .sf4-approved-header .sf4-mega-menu__topic {
    min-height: 54px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sf4-approved-header .sf4-mega-menu,
  .sf4-approved-header .sf4-mega-menu__topic {
    transition: none !important;
  }
}

/* === HEADER SOURCE 15: storefront_header_action_panels_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_ACTION_PANELS_V1 */

.sf4-approved-header .sf4-approved-actions {
  position: relative !important;
  z-index: 130 !important;
}

.sf4-action-popover {
  --sf4-action-left: 12px;
  --sf4-action-top: 100px;

  position: fixed !important;
  left: var(--sf4-action-left) !important;
  top: var(--sf4-action-top) !important;

  width: 354px !important;
  max-width: calc(100vw - 24px) !important;

  display: none !important;
  overflow: hidden !important;

  background: #fff !important;
  border: 1px solid #dfe7ef !important;
  border-radius: 15px !important;

  box-shadow:
    0 24px 60px rgba(13,35,66,.16),
    0 5px 14px rgba(13,35,66,.08) !important;

  z-index: 1600 !important;
}

.sf4-action-popover[data-open="true"] {
  display: block !important;
}

.sf4-action-popover__head {
  min-height: 67px !important;
  padding: 14px 15px !important;

  display: grid !important;
  grid-template-columns: 38px minmax(0,1fr) 28px !important;
  align-items: center !important;
  gap: 11px !important;

  background:
    linear-gradient(180deg, #f8fbfe 0%, #f5f9fc 100%) !important;

  border-bottom: 1px solid #e8eef4 !important;
}

.sf4-action-popover__icon {
  width: 38px !important;
  height: 38px !important;

  display: grid !important;
  place-items: center !important;

  border-radius: 11px !important;
  background: #e9f4fd !important;
  color: #0a6cc6 !important;
}

.sf4-action-popover__icon svg {
  width: 21px !important;
  height: 21px !important;

  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.sf4-action-popover__title {
  margin: 0 !important;

  font-size: 13px !important;
  line-height: 1.15 !important;
  font-weight: 850 !important;
  color: #15304c !important;
}

.sf4-action-popover__subtitle {
  margin-top: 4px !important;

  font-size: 10px !important;
  line-height: 1.25 !important;
  color: #7d8c9b !important;
}

.sf4-action-popover__close {
  width: 28px !important;
  height: 28px !important;
  padding: 0 !important;

  display: grid !important;
  place-items: center !important;

  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;

  cursor: pointer !important;

  font-size: 18px !important;
  line-height: 1 !important;
  color: #8796a5 !important;
}

.sf4-action-popover__close:hover,
.sf4-action-popover__close:focus-visible {
  background: #eaf2f8 !important;
  color: #23415f !important;
  outline: none !important;
}

.sf4-action-popover__body {
  padding: 14px !important;
}

.sf4-action-popover__status {
  min-height: 62px !important;
  padding: 12px !important;

  display: flex !important;
  align-items: center !important;
  gap: 11px !important;

  border: 1px solid #e8eef4 !important;
  border-radius: 11px !important;
  background: #fbfcfd !important;
}

.sf4-action-popover__status-badge {
  flex: 0 0 auto !important;

  min-width: 38px !important;
  height: 38px !important;
  padding: 0 8px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 10px !important;
  background: #edf6fd !important;

  font-size: 13px !important;
  font-weight: 850 !important;
  color: #0b6bbf !important;
}

.sf4-action-popover__status-copy {
  min-width: 0 !important;

  font-size: 11px !important;
  line-height: 1.35 !important;
  color: #607386 !important;
}

.sf4-action-popover__status-copy strong {
  display: block !important;
  margin-bottom: 2px !important;

  font-size: 11.5px !important;
  color: #213c58 !important;
}

.sf4-action-popover__links {
  margin-top: 11px !important;

  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  gap: 8px !important;
}

.sf4-action-popover__link {
  min-height: 44px !important;
  padding: 8px 10px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;

  border: 1px solid #e4ebf2 !important;
  border-radius: 10px !important;
  background: #fff !important;

  font-size: 10.5px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  color: #213d59 !important;
  text-decoration: none !important;

  transition:
    border-color .14s ease,
    background-color .14s ease,
    transform .14s ease !important;
}

.sf4-action-popover__link:hover,
.sf4-action-popover__link:focus-visible {
  border-color: #c8dced !important;
  background: #f7fbff !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}

.sf4-action-popover__link-arrow {
  color: #9caab8 !important;
  font-size: 14px !important;
}

.sf4-action-popover__primary {
  margin-top: 11px !important;

  min-height: 43px !important;
  padding: 0 13px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;

  border-radius: 10px !important;
  background: #0875d1 !important;

  font-size: 11px !important;
  font-weight: 850 !important;
  color: #fff !important;
  text-decoration: none !important;
}

.sf4-action-popover__primary:hover,
.sf4-action-popover__primary:focus-visible {
  background: #0768ba !important;
  outline: none !important;
}

.sf4-action-popover__footnote {
  margin-top: 9px !important;

  font-size: 9.5px !important;
  line-height: 1.35 !important;
  text-align: center !important;
  color: #98a5b2 !important;
}

.sf4-action-popover[data-kind="favorites"] .sf4-action-popover__status-badge {
  background: #fff0f4 !important;
  color: #d6496b !important;
}

.sf4-action-popover[data-kind="cart"] .sf4-action-popover__status-badge {
  background: #eef7ee !important;
  color: #277447 !important;
}

.sf4-approved-header [data-sf-action-panel-trigger="true"][aria-expanded="true"] {
  border-radius: 11px !important;
  background: #f5f9fc !important;
}

@media (max-width: 1179px) {
  .sf4-action-popover {
    width: min(390px, calc(100vw - 24px)) !important;
  }
}

@media (max-width: 620px) {
  .sf4-action-popover {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
  }

  .sf4-action-popover__links {
    grid-template-columns: 1fr !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sf4-action-popover__link {
    transition: none !important;
  }
}

/* === HEADER SOURCE 16: storefront_header_final_polish_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_FINAL_POLISH_V1
   Header-only final interaction/responsive layer.
   Preserve approved desktop proportions and 180 optical action alignment.
*/

@media (min-width: 1180px) {
  body header.sf-site-header.sf4-approved-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1450 !important;
    isolation: isolate !important;
    transition: box-shadow .18s ease, transform .18s ease !important;
  }

  body header.sf-site-header.sf4-approved-header.sf4-header--compact {
    box-shadow:
      0 10px 30px rgba(16, 42, 70, .11),
      0 2px 7px rgba(16, 42, 70, .05) !important;
  }

  body header.sf-site-header.sf4-approved-header.sf4-header--compact
  .sf4-approved-header__main-inner {
    min-height: 70px !important;
  }

  body header.sf-site-header.sf4-approved-header.sf4-header--compact
  .sf4-approved-header__logo img,
  body header.sf-site-header.sf4-approved-header.sf4-header--compact
  .sf-site-logo img {
    max-height: 48px !important;
    transition: max-height .18s ease !important;
  }

  body header.sf-site-header.sf4-approved-header.sf4-header--compact
  .sf4-approved-nav__inner {
    min-height: 47px !important;
  }
}

body header.sf-site-header.sf4-approved-header
form.sf4-approved-search:focus-within {
  box-shadow:
    0 0 0 3px rgba(8, 117, 209, .10),
    0 5px 16px rgba(18, 57, 93, .07) !important;
}

body header.sf-site-header.sf4-approved-header
form.sf4-approved-search input[type="search"]:focus {
  outline: none !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-action {
  transition:
    background-color .14s ease,
    transform .14s ease,
    box-shadow .14s ease !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-action:hover,
body header.sf-site-header.sf4-approved-header
.sf4-approved-action:focus-visible {
  background: #f5f9fc !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 11px rgba(17, 53, 86, .05) !important;
  outline: none !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-action:active {
  transform: translateY(0) !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-nav__inner > a:not(.sf4-approved-nav__all) {
  position: relative !important;
  transition:
    color .14s ease,
    background-color .14s ease,
    transform .14s ease !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-nav__inner > a:not(.sf4-approved-nav__all):hover,
body header.sf-site-header.sf4-approved-header
.sf4-approved-nav__inner > a:not(.sf4-approved-nav__all):focus-visible {
  color: #0875d1 !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-nav__inner > a[data-sf-nav-active="true"]:not(.sf4-approved-nav__all) {
  color: #0875d1 !important;
  font-weight: 850 !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-nav__inner > a[data-sf-nav-active="true"]:not(.sf4-approved-nav__all)::after {
  content: "" !important;
  position: absolute !important;
  left: 8px !important;
  right: 8px !important;
  bottom: -1px !important;
  height: 3px !important;
  border-radius: 3px 3px 0 0 !important;
  background: #0875d1 !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-nav__all {
  transition: filter .14s ease, box-shadow .14s ease !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-approved-nav__all:hover,
body header.sf-site-header.sf4-approved-header
.sf4-approved-nav__all:focus-visible {
  filter: brightness(.96) !important;
  box-shadow:
    inset 0 -3px 0 rgba(255,255,255,.86),
    0 4px 10px rgba(4, 78, 145, .12) !important;
  outline: none !important;
}

body header.sf-site-header.sf4-approved-header
[data-sf-brand-rail] a,
body header.sf-site-header.sf4-approved-header
.sf-brand-rail a,
body header.sf-site-header.sf4-approved-header
[class*="brand-rail"] a {
  transition:
    transform .15s ease,
    border-color .15s ease,
    box-shadow .15s ease !important;
}

body header.sf-site-header.sf4-approved-header
[data-sf-brand-rail] a:hover,
body header.sf-site-header.sf4-approved-header
[data-sf-brand-rail] a:focus-visible,
body header.sf-site-header.sf4-approved-header
.sf-brand-rail a:hover,
body header.sf-site-header.sf4-approved-header
.sf-brand-rail a:focus-visible,
body header.sf-site-header.sf4-approved-header
[class*="brand-rail"] a:hover,
body header.sf-site-header.sf4-approved-header
[class*="brand-rail"] a:focus-visible {
  transform: translateY(-2px) !important;
  border-color: #cbdced !important;
  box-shadow: 0 8px 18px rgba(18, 54, 87, .08) !important;
  outline: none !important;
}

body header.sf-site-header.sf4-approved-header
[data-sf-brand-active="true"] {
  border-color: #93bfe5 !important;
  box-shadow:
    0 0 0 3px rgba(8,117,209,.08),
    0 7px 16px rgba(18,54,87,.07) !important;
}

body header.sf-site-header.sf4-approved-header
a:focus-visible,
body header.sf-site-header.sf4-approved-header
button:focus-visible {
  outline: 2px solid rgba(8,117,209,.55) !important;
  outline-offset: 2px !important;
}

@media (min-width: 621px) and (max-width: 1179px) {
  body header.sf-site-header.sf4-approved-header {
    position: relative !important;
    z-index: 120 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a[data-sf-nav-active="true"] {
    background: #eef6fd !important;
    border-radius: 9px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a[data-sf-nav-active="true"]::after {
    display: none !important;
  }
}

@media (max-width: 620px) {
  body header.sf-site-header.sf4-approved-header {
    position: relative !important;
    z-index: 120 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action:hover,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-action:focus-visible,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a:hover,
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a:focus-visible {
    transform: none !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a[data-sf-nav-active="true"] {
    background: #eef6fd !important;
    border-radius: 8px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a[data-sf-nav-active="true"]::after {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body header.sf-site-header.sf4-approved-header,
  body header.sf-site-header.sf4-approved-header *,
  body header.sf-site-header.sf4-approved-header *::before,
  body header.sf-site-header.sf4-approved-header *::after {
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* === HEADER SOURCE 17: storefront_header_visual_acceptance_fix_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_VISUAL_ACCEPTANCE_FIX_V1
   Screenshot-driven fixes only.
   - neutralize accidental red mega-menu link styling
   - remove stray pseudo artifacts
   - improve mega-menu density
   - guarantee typeahead overlay stacking without changing its behavior
*/

/* =======================================================================
   TYPEAHEAD OVERLAY SAFETY
   ======================================================================= */

body header.sf-site-header.sf4-approved-header,
body header.sf-site-header.sf4-approved-header .sf4-approved-header__main,
body header.sf-site-header.sf4-approved-header .sf4-approved-header__main-inner {
  overflow: visible !important;
}

body header.sf-site-header.sf4-approved-header .sf4-approved-header__main {
  position: relative !important;
  z-index: 430 !important;
}

body header.sf-site-header.sf4-approved-header
form.sf-site-search.sf4-approved-search {
  position: relative !important;
  overflow: visible !important;
  z-index: 520 !important;
}

body header.sf-site-header.sf4-approved-header
form.sf-site-search.sf4-approved-search .sf4-typeahead {
  z-index: 2200 !important;
}

body header.sf-site-header.sf4-approved-header .sf4-approved-nav {
  z-index: 320 !important;
}

/* =======================================================================
   MEGA MENU — REMOVE ACCIDENTAL RED / LEGACY LINK DECORATION
   ======================================================================= */

body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__all-categories {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #0b6bbf !important;
  text-shadow: none !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__all-categories:hover,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__all-categories:focus-visible {
  border: 0 !important;
  background: #edf6fe !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #075da8 !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__side-action {
  border: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #17324e !important;
  text-shadow: none !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__side-action:hover,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__side-action:focus-visible {
  border: 0 !important;
  background: rgba(255,255,255,.9) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #0b6bbf !important;
}

/* Kill legacy/global pseudo decorations that showed as short red lines. */
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__topic::before,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__topic::after,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__all-categories::before,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__all-categories::after,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__side-action::before,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__side-action::after,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu a::before,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu a::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: none !important;
}

/* =======================================================================
   MEGA MENU — BETTER DESKTOP DENSITY
   ======================================================================= */

@media (min-width: 1500px) {
  body header.sf-site-header.sf4-approved-header .sf4-mega-menu__layout {
    grid-template-columns: minmax(0, 1fr) 310px !important;
    min-height: 0 !important;
  }

  body header.sf-site-header.sf4-approved-header .sf4-mega-menu__main {
    padding: 22px 25px 21px !important;
  }

  body header.sf-site-header.sf4-approved-header .sf4-mega-menu__topics {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px 10px !important;
  }

  body header.sf-site-header.sf4-approved-header .sf4-mega-menu__topic {
    min-height: 58px !important;
    padding: 8px 10px !important;
  }

  body header.sf-site-header.sf4-approved-header .sf4-mega-menu__side {
    padding: 22px 20px !important;
  }
}

@media (min-width: 1180px) and (max-width: 1499px) {
  body header.sf-site-header.sf4-approved-header .sf4-mega-menu__topics {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* Right-side live category cards stay neutral regardless of global anchors. */
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__live-link {
  background: #fff !important;
  background-image: none !important;
  color: #24405d !important;
}

body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__live-link:hover,
body header.sf-site-header.sf4-approved-header
.sf4-mega-menu__live-link:focus-visible {
  background: #fbfdff !important;
  background-image: none !important;
}

/* Keep panel visually clean above page content. */
body header.sf-site-header.sf4-approved-header .sf4-mega-menu {
  background: #fff !important;
  background-image: none !important;
}

/* No layout changes to approved account/favorite/cart action grid. */

/* === HEADER SOURCE 18: storefront_header_category_flyouts_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_CATEGORY_FLYOUTS_V1 */

@media (min-width: 1180px) {
  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner {
    position: relative !important;
    overflow: visible !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout {
    position: fixed !important;
    left: var(--sf4-flyout-left, 12px) !important;
    top: var(--sf4-flyout-top, 180px) !important;
    width: 290px !important;
    max-width: calc(100vw - 24px) !important;
    display: none !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid #dfe7ef !important;
    border-radius: 13px !important;
    box-shadow:
      0 20px 50px rgba(16,42,70,.15),
      0 4px 12px rgba(16,42,70,.07) !important;
    z-index: 2100 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout[data-open="true"] {
    display: block !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout__head {
    padding: 12px 13px 10px !important;
    border-bottom: 1px solid #edf1f5 !important;
    background: #f8fbfd !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout__title {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
    color: #17324e !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout__subtitle {
    margin-top: 3px !important;
    font-size: 9.5px !important;
    line-height: 1.25 !important;
    color: #8493a2 !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout__list {
    padding: 7px !important;
    display: grid !important;
    gap: 2px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout__link {
    min-height: 39px !important;
    padding: 7px 9px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: transparent !important;
    font-size: 10.7px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    color: #213d59 !important;
    text-decoration: none !important;
    transition:
      background-color .12s ease,
      color .12s ease,
      transform .12s ease !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout__link:hover,
  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout__link:focus-visible {
    background: #eef6fd !important;
    color: #0875d1 !important;
    transform: translateX(2px) !important;
    outline: none !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout__arrow {
    color: #9babb9 !important;
    font-size: 13px !important;
  }

  body header.sf-site-header.sf4-approved-header
  .sf4-approved-nav__inner > a[data-sf-category-flyout-trigger="true"][aria-expanded="true"] {
    color: #0875d1 !important;
  }
}

@media (max-width: 1179px) {
  body header.sf-site-header.sf4-approved-header
  .sf4-category-flyout {
    display: none !important;
  }
}

/* === HEADER SOURCE 19: storefront_header_category_flyout_portal_fix_v1.css === */
/* IPEKERP_STOREFRONT_HEADER_CATEGORY_FLYOUT_PORTAL_FIX_V1
   JS appends flyout panels directly under document.body.
   The original CSS was scoped under header, so it never matched.
*/

@media (min-width: 1180px) {
  body > .sf4-category-flyout {
    position: fixed !important;
    left: var(--sf4-flyout-left, 12px) !important;
    top: var(--sf4-flyout-top, 180px) !important;
    width: 290px !important;
    max-width: calc(100vw - 24px) !important;
    display: none !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid #dfe7ef !important;
    border-radius: 13px !important;
    box-shadow:
      0 20px 50px rgba(16,42,70,.15),
      0 4px 12px rgba(16,42,70,.07) !important;
    z-index: 5000 !important;
    pointer-events: auto !important;
  }

  body > .sf4-category-flyout[data-open="true"] {
    display: block !important;
  }

  body > .sf4-category-flyout .sf4-category-flyout__head {
    padding: 12px 13px 10px !important;
    border-bottom: 1px solid #edf1f5 !important;
    background: #f8fbfd !important;
  }

  body > .sf4-category-flyout .sf4-category-flyout__title {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
    color: #17324e !important;
  }

  body > .sf4-category-flyout .sf4-category-flyout__subtitle {
    margin-top: 3px !important;
    font-size: 9.5px !important;
    line-height: 1.25 !important;
    color: #8493a2 !important;
  }

  body > .sf4-category-flyout .sf4-category-flyout__list {
    padding: 7px !important;
    display: grid !important;
    gap: 2px !important;
  }

  body > .sf4-category-flyout .sf4-category-flyout__link {
    min-height: 39px !important;
    padding: 7px 9px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    font-size: 10.7px !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    color: #213d59 !important;
    text-decoration: none !important;
    transition:
      background-color .12s ease,
      color .12s ease,
      transform .12s ease !important;
  }

  body > .sf4-category-flyout .sf4-category-flyout__link:hover,
  body > .sf4-category-flyout .sf4-category-flyout__link:focus-visible {
    background: #eef6fd !important;
    color: #0875d1 !important;
    transform: translateX(2px) !important;
    outline: none !important;
  }

  body > .sf4-category-flyout .sf4-category-flyout__link::before,
  body > .sf4-category-flyout .sf4-category-flyout__link::after {
    content: none !important;
    display: none !important;
  }

  body > .sf4-category-flyout .sf4-category-flyout__arrow {
    color: #9babb9 !important;
    font-size: 13px !important;
  }
}

@media (max-width: 1179px) {
  body > .sf4-category-flyout {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body > .sf4-category-flyout .sf4-category-flyout__link {
    transition: none !important;
  }
}

/* === HEADER SOURCE 20: storefront_header_brand_drag_zero_latency_v3.css === */
/* IPEKERP_STOREFRONT_HEADER_BRAND_DRAG_ZERO_LATENCY_V3 */
@media (min-width:1180px){
  [data-sf-brand-drag-zero-latency="ready"]{
    cursor:grab!important;
    user-select:none!important;
    -webkit-user-select:none!important;
    scroll-behavior:auto!important;
    scroll-snap-type:none!important;
    overscroll-behavior-x:contain!important;
    touch-action:pan-y!important;
  }
  [data-sf-brand-drag-zero-latency="ready"].sf-brand-dragging{cursor:grabbing!important}
  [data-sf-brand-drag-zero-latency="ready"] img{
    -webkit-user-drag:none!important;
    user-select:none!important;
    -webkit-user-select:none!important;
  }
  [data-sf-brand-drag-zero-latency="ready"] a,
  [data-sf-brand-drag-zero-latency="ready"] img{cursor:inherit!important}
}
