/* GrahamSG G / Category Navigator - additive, header-only overrides.
   Original logo artwork untouched. Brand-red samples from supplied logo:
   #FE1711 (primary bright pixel), #E2150F (darkened source pixel).
   Use #E2150F behind small white text for WCAG AA contrast (~4.83:1).
*/
:root { --g-header-black:#1B1B1B; --g-header-ink:#191919; --g-header-red:#FE1711;
        --g-header-red-accessible:#E2150F; --g-header-red-deep:#C51A12;
        --g-header-line:#E0E5EA; --g-header-soft:#F4F6F8; }
/* Announcement bar is the first item in the real page-header container. */
.page-header .g-header-promo { background:var(--g-header-red-accessible); color:#fff; width:100%; }
.page-header .g-header-promo__link { display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
    min-height:40px; padding:8px 18px; gap:8px 16px; color:#fff; text-decoration:none; line-height:1.22; }
.page-header .g-header-promo__link:hover, .page-header .g-header-promo__link:focus { color:#fff; background:#B9140E; text-decoration:none; }
.page-header .g-header-promo__brand { font-weight:800; font-size:12px; letter-spacing:.07em; }
.page-header .g-header-promo__action { font-size:14px; font-weight:700; }
.page-header .g-header-promo__action strong { font-size:15px; margin-left:6px; }
.page-header .g-header-promo__detail { font-size:12px; font-weight:600; }
.page-header .g-header-promo__arrow { font-size:18px; line-height:1; }
.page-header .g-header-promo__link:focus-visible { outline:3px solid #1B1B1B; outline-offset:-3px; }
/* Preserve native Magento account / sign-in links, but de-emphasize the utility row. */
.page-header .panel.wrapper { background:#F5F6F8 !important; border:0 !important;
    border-bottom:1px solid var(--g-header-line) !important; color:#39424B; }
.page-header .panel.header { box-sizing:border-box; max-width:1280px; padding:5px 20px; min-height:29px; }
.page-header .header.panel > .header.links > li > a { color:#363C44 !important; font-size:12px; }
.page-header .header.panel > .header.links > li > a:hover { color:var(--g-header-red-deep) !important; }
/* Existing store logo comes from configured Magento logo src, never a recreation. */
.page-header .header.content { display:flex; flex-wrap:nowrap; align-items:center; gap:18px;
    box-sizing:border-box; padding:10px 20px !important; max-width:1280px;
    min-height:105px; margin:0 auto; position:relative; }
.page-header .header.content::before, .page-header .header.content::after { content:none !important; }
.page-header .header.content > .logo { float:none !important; order:0; flex:0 0 154px;
    width:154px !important; margin:0 !important; position:static !important; display:block; }
.page-header .header.content > .logo img { display:block; width:100% !important; height:auto !important;
    max-width:100%; max-height:91px; object-fit:contain; }
/* Native Magento quickSearch/minicart stay mounted; only their appearance changes. */
.page-header .header.content > .block-search { position:static !important; float:none !important;
    order:1; flex:1 1 580px; max-width:690px; min-width:175px; width:auto !important;
    margin:0 !important; padding:0 !important; }
.page-header .block-search .block-content { margin:0; }
.page-header .block-search form.minisearch { display:flex; align-items:stretch; width:100%;
    position:relative; margin:0; height:47px; }
.page-header .block-search .field.search { flex:1; min-width:0; margin:0; padding:0; }
.page-header .block-search .control { margin:0 !important; padding:0 !important;
    border:1px solid #BCC5D0 !important; border-right:0 !important; border-radius:7px 0 0 7px;
    height:47px; background:#fff; box-sizing:border-box; }
.page-header .block-search input#search { box-sizing:border-box; width:100% !important; height:45px;
    border:0 !important; border-radius:7px 0 0 7px; box-shadow:none !important;
    font-size:15px; color:var(--g-header-ink); background:#fff; padding:0 15px; }
.page-header .block-search input#search:focus { outline:2px solid var(--g-header-red-deep) !important; outline-offset:-2px; }
.page-header .block-search input#search::placeholder { color:#68717A; }
.page-header .block-search .actions { position:static; width:auto; margin:0; padding:0; }
.page-header .block-search .action.search { display:flex !important; align-items:center; justify-content:center;
    border:0 !important; border-radius:0 7px 7px 0 !important; background:var(--g-header-black) !important;
    height:47px; min-width:94px; margin:0 !important; padding:0 18px !important;
    opacity:1 !important; position:static !important; box-shadow:none !important; color:#fff !important; }
.page-header .block-search .action.search::before { color:#fff !important; font-size:19px; }
.page-header .block-search .action.search span { display:block; clip:auto; height:auto; width:auto;
    overflow:visible; position:static; margin-left:7px; color:#fff; font-size:13px; font-weight:700; }
.page-header .block-search .action.search:hover { background:#363636 !important; }
.page-header .block-search .search-autocomplete { z-index:150; }
.page-header .g-header-account { order:2; flex:0 0 auto; display:flex; flex-direction:column;
    gap:4px; align-items:center; justify-content:center; min-width:62px; color:var(--g-header-ink);
    font-size:12px; font-weight:700; text-decoration:none; }
.page-header .g-header-account svg { width:23px; height:23px; fill:none; stroke:currentColor;
    stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.page-header .g-header-account:hover { color:var(--g-header-red-deep); text-decoration:none; }
.page-header .header.content > .minicart-wrapper { order:3; position:relative !important;
    float:none !important; margin:0 !important; flex:0 0 auto; }
.page-header .minicart-wrapper .action.showcart { color:var(--g-header-ink); }
.page-header .minicart-wrapper .action.showcart::before { color:var(--g-header-ink) !important; }
.page-header .g-header-mobile-choices { display:none; }
/* Keep the entire existing Magento dynamic navigation tree and its submenu events. */
.nav-sections { background:var(--g-header-black) !important; margin:0 !important; }
.nav-sections .navigation { background:var(--g-header-black) !important; max-width:1280px !important;
    margin:0 auto; padding:0 12px; text-align:left !important; }
.nav-sections .navigation > ul { display:flex; flex-wrap:wrap; gap:0;
    margin:0; padding:0; align-items:stretch; }
.nav-sections .navigation > ul > li.level0 { float:none; margin:0; }
.nav-sections .navigation > ul > li.level0 > a.level-top { color:#fff !important; background:transparent;
    font-size:12px; font-weight:750; line-height:22px; text-transform:none; border:0 !important;
    margin:0; padding:13px 13px; min-height:48px; box-sizing:border-box; }
.nav-sections .navigation > ul > li.level0:hover > a.level-top,
.nav-sections .navigation > ul > li.level0 > a.level-top:focus { color:#fff !important; background:#3D3D3D !important; }
.nav-sections .navigation > ul > li.g-header-priority--pacific { margin-left:auto; }
.nav-sections .navigation > ul > li.g-header-priority--pacific > a.level-top { background:#fff !important;
    color:var(--g-header-red-deep) !important; padding:13px 15px; }
.nav-sections .navigation > ul > li.g-header-priority--pacific:hover > a.level-top { background:#FFECEB !important;
    color:#A5140E !important; }
.nav-sections .navigation .submenu { background:#fff; border:1px solid #DEE3E8; box-shadow:0 8px 22px #0002; }
.nav-sections .navigation .submenu a { color:var(--g-header-ink) !important; background:#fff; }
.nav-sections .navigation .submenu a:hover { color:var(--g-header-red-deep) !important; background:#FAF2F1; }
/* Shop shortcuts below nav are the lightweight bottom strip from approved G. */
.nav-sections .g-header-quicklinks { display:flex; max-width:1280px; margin:auto;
    min-height:33px; background:#F4F6F8; align-items:center; justify-content:space-between;
    box-sizing:border-box; padding:5px 20px; gap:16px; border-bottom:1px solid #DDE3E8; }
.nav-sections .g-header-quicklinks__main, .nav-sections .g-header-quicklinks__secondary { display:flex;
    align-items:center; flex-wrap:wrap; gap:12px; font-size:11px; line-height:18px; }
.nav-sections .g-header-quicklinks__label { font-size:10px; font-weight:800; letter-spacing:.06em; color:#515D6A; }
.nav-sections .g-header-quicklinks a { font-weight:600; color:#39444E !important; text-decoration:underline; }
.nav-sections .g-header-quicklinks a:hover { color:var(--g-header-red-deep) !important; }
.nav-sections .g-header-quicklinks__secondary span { color:#65717D; white-space:nowrap; }
.nav-sections .g-header-quicklinks__secondary a { text-decoration:none; }
/* Progressively condense, without hiding any category links. */
@media (max-width:1200px) and (min-width:768px) {
 .nav-sections .navigation > ul > li.level0 > a.level-top { padding:12px 9px; font-size:11px; }
 .page-header .header.content { gap:12px; }
 .page-header .header.content > .logo { flex-basis:140px; width:140px !important; }
 .nav-sections .g-header-quicklinks__secondary span { display:none; }
}
/* Magento Luma switches its native menu behavior at 768px. Do not fake a new breakpoint. */
@media (max-width:767px) {
 .page-header .g-header-promo__link { padding:7px 10px; gap:2px 8px;
     flex-wrap:wrap; min-height:52px; }
 .page-header .g-header-promo__brand { display:block; width:100%; font-size:10px; text-align:center; }
 .page-header .g-header-promo__action, .page-header .g-header-promo__action strong { font-size:12px; }
 .page-header .g-header-promo__detail { width:100%; text-align:center; font-size:10px; }
 .page-header .g-header-promo__arrow { display:none; }
 .page-header .panel.wrapper { display:none !important; }
 .page-header .header.content { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px;
     padding:7px 12px 10px !important; min-height:0 !important; }
 /* Reserve a logo-height first row. Center the logo against the entire viewport,
    independent of asymmetric menu, account and cart widths. */
 .page-header .header.content > .nav-toggle { position:static !important; float:none !important;
     order:0; margin:0 !important; flex:0 0 42px; width:42px; height:66px;
     display:flex; align-items:center; justify-content:center; }
 .page-header .header.content > .nav-toggle::before { color:#151515 !important; }
 .page-header .header.content > .logo { order:1; flex:none;
     width:110px !important; margin:0 !important;
     position:absolute !important; left:50%; top:7px; transform:translateX(-50%); z-index:1; }
 .page-header .header.content > .logo img { width:100% !important; height:auto !important; max-height:66px; }
 /* Put Account and the real Magento minicart on their own compact row below
    the search field. They no longer visually pull attention off the centered logo. */
 .page-header .header.content > .block-search { order:2; flex:1 1 100%; width:100% !important;
     max-width:none; min-width:0; margin:4px 0 0 !important; display:block !important; }
 .page-header .g-header-account { display:flex !important; order:3; flex:0 0 auto;
     min-width:76px; min-height:36px; margin-left:auto !important; font-size:11px;
     flex-direction:row; align-items:center; gap:5px; position:relative; z-index:2;
     padding:6px 4px; }
 .page-header .g-header-account svg { width:18px; height:18px; flex:none; }
 .page-header .header.content > .minicart-wrapper { order:4; flex:0 0 auto;
     min-width:67px; min-height:36px; margin:0 !important; }
 .page-header .header.content > .minicart-wrapper > .action.showcart { flex-direction:row;
     min-height:36px; gap:4px; font-size:11px; padding:6px 3px; }
 .page-header .header.content > .minicart-wrapper .action.showcart svg { width:20px; height:20px; flex:none; }
 .page-header .block-search .label { position:absolute !important; width:1px !important;
     height:1px !important; padding:0 !important; margin:0 !important;
     clip:rect(0 0 0 0) !important; clip-path:inset(50%); overflow:hidden !important;
     white-space:nowrap !important; }
 .page-header .block-search .block-content, .page-header .block-search .control { display:block !important; }
 .page-header .block-search form.minisearch { height:44px; }
 .page-header .block-search .control { height:44px; }
 .page-header .block-search input#search { height:42px; min-width:0; font-size:14px; }
 .page-header .block-search .action.search { min-width:54px; padding:0 9px !important; height:44px; }
 .page-header .block-search .action.search span { display:none !important; }
 .page-header .block-search .action.search::before { font-size:20px; }
 .page-header .g-header-mobile-choices { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
     order:5; flex:1 1 100%; gap:8px; margin:0; width:100%; }
 .page-header .g-header-choice { display:flex; flex-direction:column; min-height:68px; min-width:0;
     border:1px solid #D9E1E8; padding:11px 26px 10px 12px; border-radius:6px; position:relative;
     text-decoration:none !important; gap:4px; }
 .page-header .g-header-choice--richardson { background:#EDF3F6; color:#20262B; }
 .page-header .g-header-choice--pacific { background:#FFF0EE; color:#A4150E; border-color:#F9C2BD; }
 .page-header .g-header-choice__eyebrow { font-size:9px; letter-spacing:.045em; font-weight:800; }
 .page-header .g-header-choice strong { font-size:12px; line-height:1.2; font-weight:800; }
 .page-header .g-header-choice__arrow { position:absolute; right:10px; top:50%;
     transform:translateY(-50%); font-size:18px; }
 .page-header .g-header-choice:hover { border-color:var(--g-header-red-deep); }
 /* The native Magento drawer remains operational, including deep category submenus. */
 .nav-sections, .nav-sections .navigation { background:#fff !important; }
 .nav-sections .navigation { padding:0 !important; }
 .nav-sections .navigation > ul { display:block; padding:0; }
 .nav-sections .navigation > ul > li.level0 > a.level-top { color:#171717 !important;
     background:#fff !important; padding:13px 14px; font-size:14px; min-height:46px; }
 .nav-sections .navigation > ul > li.g-header-priority--pacific { margin-left:0; }
 .nav-sections .navigation > ul > li.g-header-priority--pacific > a.level-top { color:#B0140E !important; background:#FFF0EE !important; }
 .nav-sections .g-header-quicklinks { display:block; background:#fff; margin:0; padding:10px 14px; }
 .nav-sections .g-header-quicklinks__main, .nav-sections .g-header-quicklinks__secondary { display:flex;
     gap:12px; margin:8px 0; }
 .nav-sections .g-header-quicklinks__secondary span { display:none; }
}
@media (max-width:350px) {
 .page-header .header.content > .logo { width:96px !important; flex-basis:96px; }
 .page-header .g-header-choice strong { font-size:11px; }
 .page-header .g-header-choice { padding-left:9px; padding-right:20px; }
}


/* Group G approved motion and Pacific CTA, verified in standalone fixture. */
/* Logo red is #FE1711; logo red #E2150F meets WCAG AA for small white text. */
.page-header .g-header-promo {
  background:#E2150F;
  animation:g-promo-slide-down 620ms cubic-bezier(.16, .72, .28, 1) both;
}
@keyframes g-promo-slide-down {
  from { opacity:0; transform:translateY(-100%); }
  to { opacity:1; transform:translateY(0); }
}
/* Formerly white Pacific link on right of desktop category bar. */
.nav-sections .navigation > ul > li.g-header-priority--pacific > a.level-top {
  background:#E2150F !important;
  color:#fff !important;
  animation:g-pacific-one-glow 1400ms ease-in-out 760ms 1 both;
}
.nav-sections .navigation > ul > li.g-header-priority--pacific:hover > a.level-top,
.nav-sections .navigation > ul > li.g-header-priority--pacific > a.level-top:focus-visible {
  background:#BB140E !important;
  color:#fff !important;
}
@keyframes g-pacific-one-glow {
  0%, 100% { box-shadow:0 0 0 0 rgba(254,23,17,0), 0 0 0 rgba(254,23,17,0); }
  48% { box-shadow:0 0 0 4px rgba(254,23,17,.22), 0 0 15px rgba(254,23,17,.5); }
}
@media (max-width:767px) {
  /* On phones the visible Pacific buying tile also receives the red treatment. */
  .page-header .g-header-choice--pacific {
    background:#E2150F !important;
    border-color:#E2150F !important;
    color:#fff !important;
    animation:g-pacific-one-glow 1400ms ease-in-out 760ms 1 both;
  }
  .page-header .g-header-choice--pacific:hover,
  .page-header .g-header-choice--pacific:focus-visible {
    background:#BB140E !important;
    border-color:#BB140E !important;
    color:#fff !important;
  }
  /* Existing native mobile drawer had a pale Pacific link: carry the same color through. */
  .nav-sections .navigation > ul > li.g-header-priority--pacific > a.level-top {
    background:#E2150F !important;
    color:#fff !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .page-header .g-header-promo,
  .page-header .g-header-choice--pacific,
  .nav-sections .navigation > ul > li.g-header-priority--pacific > a.level-top {
    animation:none !important;
    transition:none !important;
  }
}
