/* ============================================================
   WMS Endpoint - shared menu and footer (all public pages)
   Server path: /opt/wms-dms/website/assets/site-nav.css
   Self contained: works with or without assets/site.css.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap');

.wn-redbar{height:6px;background:#CC2200}
.wn-hdr{position:sticky;top:0;z-index:80;background:#fff;border-bottom:1px solid #D6DFEC;font-family:Inter,system-ui,sans-serif;box-shadow:0 6px 24px -18px rgba(27,36,56,.45)}
.wn-hdr *{box-sizing:border-box}
.wn-hdr,.wn-foot{text-align:left;margin:0;border-radius:0;max-width:none;width:auto;float:none}
.wn-in{max-width:1180px;margin:0 auto;padding:0 22px;height:70px;display:flex;align-items:center;gap:14px}
.wn-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.wn-brand img{height:40px;width:auto;display:block}
.wn-brand b{display:block;font-family:'Barlow Condensed',Inter,sans-serif;font-weight:700;font-size:21px;letter-spacing:.03em;color:#1B2438;line-height:1}
.wn-brand small{display:block;font-size:8.5px;letter-spacing:.2em;color:#7C8AA0;font-weight:600;margin-top:3px}
.wn-menu{display:flex;align-items:center;gap:2px;margin:0 0 0 auto;padding:0;list-style:none}
.wn-item{position:relative}
.wn-top{display:flex;align-items:center;gap:5px;font:600 14px/1 Inter,system-ui,sans-serif;color:#1B2438;background:none;border:0;padding:12px 11px;border-radius:9px;cursor:pointer;text-decoration:none;white-space:nowrap}
.wn-top:hover,.wn-item.open>.wn-top,.wn-item:focus-within>.wn-top{background:#F2F6FB;color:#CC2200}
.wn-top.cur{color:#CC2200}
.wn-top svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .2s}
.wn-item.open>.wn-top svg{transform:rotate(180deg)}
.wn-drop{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(6px);min-width:340px;background:#fff;border:1px solid #D6DFEC;border-radius:14px;box-shadow:0 30px 60px -24px rgba(27,36,56,.45);padding:10px;opacity:0;visibility:hidden;transition:opacity .16s,transform .16s,visibility .16s}
.wn-drop:before{content:"";position:absolute;top:-10px;left:0;right:0;height:10px}
.wn-item.open>.wn-drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
@media (hover:hover) and (min-width:1081px){.wn-item:hover>.wn-drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}.wn-item:hover>.wn-top svg{transform:rotate(180deg)}}
.wn-drop.wide{min-width:560px;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.wn-link{display:flex;gap:12px;align-items:flex-start;padding:11px 12px;border-radius:10px;text-decoration:none;color:#1B2438}
.wn-link:hover{background:#F2F6FB}
.wn-ic{flex:none;width:36px;height:36px;border-radius:9px;background:#EAF4FB;display:flex;align-items:center;justify-content:center}
.wn-ic svg{width:19px;height:19px;stroke:#236B9C;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wn-ic.r{background:#FDECEA}.wn-ic.r svg{stroke:#CC2200}
.wn-ic.g{background:#E8F5E8}.wn-ic.g svg{stroke:#2F7A2F}
.wn-ic.n{background:#E7EDF5}.wn-ic.n svg{stroke:#1B2438}
.wn-link b{display:block;font-size:14px;font-weight:700;line-height:1.25}
.wn-tx{display:block;color:#1B2438}
.wn-link small{display:block;font-size:12.5px;color:#5f6b7d;line-height:1.35;margin-top:2px;letter-spacing:0;font-weight:500}
.wn-soon{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:#FEF3C7;color:#92400E;border-radius:5px;padding:1px 6px;margin-left:6px;vertical-align:1px}
.wn-drop-foot{grid-column:1/-1;border-top:1px solid #EEF2F7;margin-top:6px;padding:10px 12px 4px;font-size:12.5px;color:#5f6b7d;display:flex;justify-content:space-between;gap:10px;align-items:center}
.wn-drop-foot a{color:#CC2200;font-weight:700;text-decoration:none}
.wn-cta{flex:none;margin-left:8px;display:inline-flex;align-items:center;font:700 16px/1 'Barlow Condensed',Inter,sans-serif;letter-spacing:.02em;background:#CC2200;color:#fff;text-decoration:none;padding:12px 18px;border-radius:10px;white-space:nowrap}
.wn-cta:hover{background:#E8431F}
.wn-burger{display:none;margin-left:auto;background:none;border:0;padding:10px;cursor:pointer}
.wn-burger span{display:block;width:24px;height:2.5px;background:#1B2438;border-radius:2px;margin:5px 0;transition:.25s}
.wn-open .wn-burger span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.wn-open .wn-burger span:nth-child(2){opacity:0}
.wn-open .wn-burger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

/* phones and tablets: one button, folding sections */
@media (max-width:1080px){
  .wn-burger{display:block}
  .wn-cta{display:none}
  .wn-menu{position:fixed;top:var(--wn-top,76px);left:0;right:0;bottom:0;margin:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:8px 16px 40px;overflow-y:auto;display:none;border-top:1px solid #D6DFEC}
  .wn-open .wn-menu{display:flex}
  .wn-item{border-bottom:1px solid #EEF2F7}
  .wn-top{width:100%;justify-content:space-between;font-size:16px;padding:16px 6px;border-radius:0}
  .wn-top:hover,.wn-item.open>.wn-top{background:none}
  .wn-drop,.wn-drop.wide{position:static;transform:none!important;min-width:0;box-shadow:none;border:0;padding:0 0 10px;display:none;opacity:1;visibility:visible;grid-template-columns:1fr}
  .wn-item.open>.wn-drop{display:block}
  .wn-drop:before{display:none}
  .wn-mcta{display:block!important;margin:18px 0 0;text-align:center;background:#CC2200;color:#fff;text-decoration:none;font:700 18px/1 'Barlow Condensed',Inter,sans-serif;padding:15px;border-radius:10px}
  body.wn-lock{overflow:hidden}
}
.wn-mcta{display:none}

/* footer */
.wn-foot{background:#1B2438;color:#fff;font-family:Inter,system-ui,sans-serif;padding:54px 0 24px}
.wn-foot *{box-sizing:border-box}
.wn-foot-in{max-width:1180px;margin:0 auto;padding:0 22px}
.wn-foot-grid{display:grid;grid-template-columns:1.5fr repeat(5,1fr);gap:26px}
.wn-foot .wn-brand b{color:#fff;white-space:nowrap}
.wn-foot .wn-brand img{background:#fff;border-radius:7px;padding:3px 6px;height:42px}
.wn-foot-desc{color:#9aa7bb;font-size:13.5px;line-height:1.6;margin:14px 0 0;max-width:290px}
.wn-foot-contact{margin-top:12px;font-size:13.5px;line-height:1.8}
.wn-foot-contact a{color:#fff;text-decoration:none}
.wn-foot h4{font-family:'Barlow Condensed',Inter,sans-serif;font-weight:700;font-size:15px;letter-spacing:.07em;text-transform:uppercase;margin:0 0 12px;color:#fff}
.wn-foot-col a{display:block;color:#9aa7bb;font-size:13.5px;padding:4px 0;text-decoration:none}
.wn-foot-col a:hover{color:#fff}
.wn-foot-bot{border-top:1px solid rgba(255,255,255,.1);margin-top:34px;padding-top:18px;color:#7C8AA0;font-size:12.5px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
.wn-foot-bot a{color:#9aa7bb;text-decoration:none}
@media (max-width:1080px){.wn-foot-grid{grid-template-columns:1fr 1fr 1fr}.wn-foot-grid>div:first-child{grid-column:1/-1}}
@media (max-width:560px){.wn-foot-grid{grid-template-columns:1fr 1fr}.wn-in{padding:0 14px}.wn-brand small{display:none}}
/* M1 (9 Oct 2026): Hardware & Labels menu with two headed columns */
.wn-drop.wn-cols{min-width:580px;display:grid;grid-template-columns:1fr 1fr;gap:2px 8px}
.wn-col{display:flex;flex-direction:column;min-width:0}
.wn-drop-h{font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#CC2200;padding:10px 12px 6px}
.wn-shop{grid-column:1/-1;border-top:1px solid #EEF2F7;margin-top:6px;padding-top:6px}
@media (min-width:1081px){
  .wn-item.wn-right>.wn-drop{left:auto;right:-8px;transform:translateY(6px)}
  .wn-item.wn-right.open>.wn-drop{transform:translateY(0)}
}
@media (hover:hover) and (min-width:1081px){.wn-item.wn-right:hover>.wn-drop{transform:translateY(0)}}
@media (max-width:1080px){
  .wn-drop.wn-cols{display:none;min-width:0}
  .wn-item.open>.wn-drop.wn-cols{display:block}
  .wn-drop-h{padding:12px 6px 4px}
  .wn-shop{border-top:0;margin-top:0;padding-top:0}
}