/* GOODWOOD 360 — xp core features (js/xp-core.js). Same type as the landing
   header: Manrope 16px, regular, title case, grey that turns ink on hover.
   Square photo tiles, hairlines, no pills. */
:root{--gx-ink:#1a1a18;--gx-mute:#9a9a95;--gx-line:#ecebe8;--gx-tile:#f6f5f3;--gx-bg:#ffffff;}
.gx-ov{position:fixed;inset:0;z-index:400;font-family:var(--sans);color:var(--gx-ink);}
.gx-ov[hidden]{display:none !important;}
.gx-ib{display:block;background:var(--gx-tile);overflow:hidden;}
.gx-ib img{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;}
.gx-x,.gx-back{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:0;border-radius:7px;background:none;color:var(--gx-mute);cursor:pointer;padding:0;flex:none;}
.gx-x:hover,.gx-back:hover{color:var(--gx-ink);background:rgba(0,0,0,.05);}

/* ---- search ---- */
.gx-ov.is-top{background:rgba(26,26,24,.22);display:flex;justify-content:center;align-items:flex-start;padding:12vh 16px 16px;}
.gx-pal{width:min(640px,100%);background:#fff;box-shadow:0 30px 80px rgba(0,0,0,.18);animation:gx-in .16s ease;}
.gx-pal-in{display:flex;align-items:center;gap:8px;padding:0 14px 0 24px;border-bottom:1px solid var(--gx-line);}
.gx-pal input{flex:1;min-width:0;height:64px;border:0;padding:0;font-family:var(--sans);font-size:17px;color:var(--gx-ink);outline:none;background:none;}
.gx-pal input::-webkit-search-cancel-button{display:none;}
#gxSearchList{max-height:min(460px,58vh);overflow:auto;padding:6px 0 8px;}
.gx-pal-h{padding:12px 24px 6px;font-size:14px;color:var(--gx-mute);}
.gx-pal ul{list-style:none;margin:0;padding:0;}
.gx-pal li{display:flex;align-items:center;gap:16px;padding:8px 24px;cursor:pointer;}
.gx-pal li.on,.gx-pal li:hover{background:var(--gx-tile);}
.gx-pal li .gx-ib{width:64px;aspect-ratio:4/3;flex:none;}
.gx-pal li span{display:flex;flex-direction:column;min-width:0;gap:2px;}
.gx-pal li b{font-size:15px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gx-pal li small{font-size:13px;color:var(--gx-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gx-empty{margin:0;padding:28px 24px;color:var(--gx-mute);font-size:14px;}
.gx-pal-foot{display:flex;gap:24px;padding:12px 24px;border-top:1px solid var(--gx-line);font-size:12px;color:var(--gx-mute);}

/* ---- share drawer ---- */
.gx-ov.is-drawer{background:rgba(26,26,24,.18);}
.gx-drawer{position:absolute;top:0;right:0;bottom:0;width:min(440px,100vw);background:#fff;display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(0,0,0,.08);animation:gx-slide .28s cubic-bezier(.2,.7,.2,1);}
.gx-drawer header,.gx-full header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 28px;border-bottom:1px solid var(--gx-line);}
.gx-drawer h3,.gx-full h3{margin:0;display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:16px;font-weight:400;letter-spacing:-.01em;color:var(--gx-ink);}
.gx-full h3 em{font-style:normal;color:var(--gx-mute);margin-left:4px;}
.gx-drawer-b{flex:1;overflow-y:auto;padding:24px 28px 40px;display:flex;flex-direction:column;gap:24px;}
.gx-prev{display:flex;gap:16px;align-items:center;}
.gx-prev .gx-ib{width:132px;aspect-ratio:4/3;flex:none;}
.gx-prev div{display:flex;flex-direction:column;gap:3px;min-width:0;}
.gx-prev small{font-size:13px;color:var(--gx-mute);}
.gx-prev b{font-size:18px;font-weight:400;}
.gx-prev span{font-size:14px;color:var(--gx-mute);}
.gx-stack{display:flex;flex-direction:column;gap:10px;}
.gx-btn{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:46px;padding:0 18px;border:1px solid var(--gx-ink);background:#fff;color:var(--gx-ink);font-family:var(--sans);font-size:15px;font-weight:400;letter-spacing:-.005em;text-decoration:none;cursor:pointer;}
.gx-btn:hover{background:var(--gx-tile);}
.gx-btn.is-primary{background:var(--gx-ink);color:#fff;}
.gx-btn.is-primary:hover{background:#3a3935;}
/* feedback: the label slides up and away, a tick and "Link Copied" slide in, then back */
.gx-btn{position:relative;overflow:hidden;transition:background .25s ease,border-color .25s ease,transform .1s ease;}
.gx-btn:active{transform:scale(.985);}
.gx-btn-t,.gx-btn-d{display:inline-flex;align-items:center;gap:8px;transition:transform .34s cubic-bezier(.2,.7,.2,1),opacity .22s ease;}
.gx-btn-d{position:absolute;inset:0;justify-content:center;opacity:0;transform:translateY(100%);}
.gx-btn.is-done .gx-btn-t{opacity:0;transform:translateY(-100%);}
.gx-btn.is-done .gx-btn-d{opacity:1;transform:none;}
.gx-btn.is-done,.gx-btn.is-done:hover{background:var(--gx-tile);}
.gx-btn.is-primary.is-done,.gx-btn.is-primary.is-done:hover{background:var(--gx-tile);border-color:var(--gx-ink);color:var(--gx-ink);}   /* neutral, like the others */
.gx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
@media (prefers-reduced-motion:reduce){.gx-btn-t,.gx-btn-d{transition:none;}}
.gx-note{margin:0;font-size:14px;line-height:1.5;color:var(--gx-mute);}
.gx-info{margin:0;padding:14px 16px;background:var(--gx-tile);font-family:var(--sans);font-size:13.5px;line-height:1.55;color:#4a4843;white-space:pre-wrap;word-break:break-word;}

/* ---- A to Z: the line-up's sheet ---- */
.gx-ov.is-full{background:#fff;overflow-y:auto;animation:gx-in .2s ease;}
.gx-full{min-height:100%;display:flex;flex-direction:column;}
.gx-full header{position:sticky;top:0;background:#fff;z-index:2;padding-left:40px;padding-right:40px;}
.gx-full .gx-back{margin-left:-6px;}
.gx-az-jump{display:flex;flex-wrap:wrap;gap:2px 14px;padding:16px 40px 0;}
.gx-az-jump a{font-size:15px;color:var(--gx-mute);text-decoration:none;}
.gx-az-jump a:hover{color:var(--gx-ink);}
.gx-az{columns:4 220px;column-gap:40px;padding:24px 40px 64px;}
.gx-az section{break-inside:avoid;margin-bottom:28px;}
.gx-az h4{margin:0 0 8px;font-size:22px;font-weight:400;color:var(--gx-ink);}
.gx-az button{display:flex;align-items:baseline;gap:8px;width:100%;border:0;background:none;padding:4px 0;text-align:left;font-family:var(--sans);cursor:pointer;}
.gx-az button span{font-size:15px;color:#6f6d66;}
.gx-az button small{font-size:12.5px;color:#b7b5af;}
.gx-az button:hover span{color:var(--gx-ink);}

/* ---- A to Z button in the Products search bar ---- */
.lib-search-wrap--filter.has-az .lib-search{padding-right:76px;}
.lib-filter-btn.gx-az-btn{right:36px;}

@keyframes gx-in{from{opacity:0;}to{opacity:1;}}
@keyframes gx-slide{from{transform:translateX(24px);opacity:0;}to{transform:none;opacity:1;}}
@media (prefers-reduced-motion:reduce){.gx-pal,.gx-drawer,.gx-ov.is-full{animation:none;transition:none;}}
@media (max-width:640px){
  .gx-full header,.gx-az-jump,.gx-az{padding-left:16px;padding-right:16px;}
  .gx-drawer-b,.gx-drawer header{padding-left:20px;padding-right:20px;}
  .gx-pal-foot{display:none;}
  .gx-ov.is-top{padding-top:8vh;}
}

/* ---- footer and drag hint: the header's type, one size down ---- */
/* one step below the header links: the menu is 16px, these are only notes */
footer.bottom .label,footer.bottom .version{font-family:var(--sans);font-weight:400;letter-spacing:-.005em;text-transform:none;line-height:22px;}
footer.bottom .label{font-size:14px;}
footer.bottom .label.num{color:var(--gx-mute);}
footer.bottom .version{font-size:13px;color:#cfcfca;margin-left:20px;}
@media (max-width:720px){footer.bottom .label{font-size:13px;}footer.bottom .version{font-size:12px;}}

/* the drag hint, in the same type (it was small spaced capitals) */
.drag-hint{font-size:14px;letter-spacing:-.005em;text-transform:none;color:var(--gx-mute);gap:10px;}
.drag-hint svg{stroke:var(--gx-mute);}

/* crumb icons (Share, Download): the breadcrumb's own grey, clearly visible */
#crumb .crumb-share{color:#9a9a95;border-color:#d9d7d2;}
#crumb .crumb-share:hover{color:var(--gx-ink);border-color:var(--gx-ink);}

/* fullscreen product name: the breadcrumb grey, not near-black */
.fs-crumb{color:#9a9a95;}
