/* Shared customer header geometry. HOME and ABOUT keep their approved artwork and colors. */
.top{z-index:40;background:#284b35;border-bottom:1px solid #4c654e;color:#f8f4ec;backdrop-filter:none}
.top .shell{max-width:1120px}
.top .nav{height:86px;min-height:86px;gap:24px}
.top .brand{display:flex;align-items:center;gap:17px;min-width:300px;margin:0;color:#f8f4ec;text-decoration:none}
.top .brand img{width:86px;height:70px;flex:0 0 86px;object-fit:contain;transform:scale(1.35)}
.top .brand>div{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px}
.top .brand strong{font:500 24px/1.05 Georgia,'Times New Roman',serif;letter-spacing:.06em;color:inherit}
.top .brand small{display:block;margin:0;font:9px/1.2 Arial,sans-serif;letter-spacing:.27em;color:inherit}
.top .links{align-items:center;gap:clamp(12px,1.4vw,21px)}
.top .links a{color:#f8f4ec}
.top .links .active{color:#f2d79d;border-color:#f2d79d}
.top .bagIcon{background:transparent;border-color:#c5d0c5;color:#f8f4ec}
.top .bagCount{color:#fff}
.top .menuBtn,.top .backBtn,.top .menubtn,.top .homebtn{color:#f8f4ec}
.top .menuBtn:before,.top .menubtn:before{background:#f8f4ec;box-shadow:0 -7px 0 #f8f4ec,0 7px 0 #f8f4ec}
.top .mobilelogo,.top .mobilebrand{display:none}
.siteHeader{position:sticky;top:0;z-index:40;min-height:86px;padding:10px max(24px,calc((100% - 1120px)/2 + 24px));gap:24px}
.checkoutBrand{gap:17px;min-width:300px;margin:0}
.checkoutBrand img{width:86px;height:70px;object-fit:contain;transform:scale(1.35)}
.checkoutBrandText{align-items:center;text-align:center;gap:4px}
.checkoutBrandText strong{font:500 24px/1.05 Georgia,'Times New Roman',serif;letter-spacing:.06em}
.checkoutBrandText small{font:9px/1.2 Arial,sans-serif;letter-spacing:.27em}
.cardThumb>svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
/* The approved HOME and ABOUT black artwork stays as supplied. */
body[data-preserve-header-art="true"] .top{background:rgba(250,247,240,.96);border-bottom:1px solid #e6ddcf;color:#20231e}
body[data-preserve-header-art="true"] .top .brand{color:#20231e}
body[data-preserve-header-art="true"] .top .brand img{width:86px;height:70px;flex:0 0 86px;object-fit:contain;transform:scale(1.35)}
body[data-preserve-header-art="true"] .top .brand>div{display:block;text-align:center}
body[data-preserve-header-art="true"] .top .brand small{margin-top:4px}
body[data-preserve-header-art="true"] .top .links a{color:#20231e}
body[data-preserve-header-art="true"] .top .links .active{color:#8b642d;border-color:#8b642d}
body[data-preserve-header-art="true"] .top .bagIcon{background:#fff;border-color:#b8c6bc;color:#284b35}
body[data-preserve-header-art="true"] .top .menuBtn:before,body[data-preserve-header-art="true"] .top .menubtn:before{background:#20231e;box-shadow:0 -7px 0 #20231e,0 7px 0 #20231e}
@media(max-width:900px){
  .top .shell{padding:0 14px}
  .top .nav{height:86px;min-height:86px}
  .top .brand,.top .links,.top .nav>.bagIcon{display:none}
  .top .mobilebar{display:flex;position:absolute;inset:0;align-items:center}
  .top .mobilelogo,.top .mobilebrand{display:flex;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:auto;height:auto;align-items:center;justify-content:center;color:#f8f4ec;text-decoration:none;z-index:1}
  .top .mobilelogo,.top .mobilebrand{flex-direction:column;gap:0}
  .top .mobilelogo img,.top .mobilebrand img{display:block;width:86px;height:70px;object-fit:contain;transform:scale(1.2)}
  .top .mobilelogo:before,.top .mobilebrand:before{content:none}
  .top .mobilelogo:after,.top .mobilebrand:after{content:'A BRIGHTER YOU AWAITS';display:block;text-align:center;font:7px/1.2 Arial,sans-serif;letter-spacing:.2em}
  .top .mobilebar>.bagIcon{display:grid;position:absolute;right:14px;top:50%;transform:translateY(-50%);width:40px;height:40px}
  .siteHeader{min-height:76px;padding:9px 16px}
  .siteHeader{height:86px;justify-content:center}
  .checkoutBrand{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);min-width:0;gap:0;flex-direction:column}
  .checkoutBrand img{width:86px;height:70px;transform:scale(1.2)}
  .checkoutBrandText strong{display:none}
  .checkoutBrandText small{font-size:7px;letter-spacing:.19em}
  .headerActions{position:absolute;right:16px;top:50%;transform:translateY(-50%);gap:13px;font-size:12px}
}
@media(max-width:520px){
  .top .nav{height:76px;min-height:76px}
  .top .mobilelogo img,.top .mobilebrand img{width:86px;height:70px}
  .top .mobilelogo:after,.top .mobilebrand:after{font-size:6px;letter-spacing:.17em}
  .top .mobilebar>.bagIcon{right:8px;width:36px;height:36px}
  .siteHeader{gap:8px;padding:8px 12px}
  .checkoutBrand img{width:86px;height:70px}
  .checkoutBrandText small{font-size:5px;letter-spacing:.15em}
  .headerActions{right:9px;gap:8px;font-size:10px}
  .headerActions a:nth-child(2){display:none}
}
/* Home/About retain their existing black wordmark and ivory background on phones. */
@media(max-width:900px){
  body[data-preserve-header-art="true"] .top{background:rgba(250,247,240,.96)}
  body[data-preserve-header-art="true"] .top .mobilelogo{display:flex}
  body[data-preserve-header-art="true"] .top .mobilelogo img{display:block;width:86px;height:70px;object-fit:contain;transform:scale(1.2)}
  body[data-preserve-header-art="true"] .top .mobilelogo:before{content:none}
  body[data-preserve-header-art="true"] .top .mobilebar>.bagIcon{background:#fff;color:#284b35;border-color:#b8c6bc}
  body[data-preserve-header-art="true"] .top .menuBtn:before,body[data-preserve-header-art="true"] .top .menubtn:before{background:#20231e;box-shadow:0 -7px 0 #20231e,0 7px 0 #20231e}
}
