/* Retail POS multi-till comparison ladder — fully scoped to .n3l-retail-pos-multi-till */
.n3l-retail-pos-multi-till {
  --ink:#101426;
  --ink-2:#1C2340;
  --paper:#FFF;
  --paper-2:#F6F7FB;
  --paper-3:#FCFCFE;
  --rule:#E3E6EE;
  --muted:#5D6580;
  --muted-dark:#AEB6CE;
  --accent:#C2410C;
  --accent-hi:#FB8B3C;
  --stock:#0F7A8C;
  --people:#7A4FB6;
  --close:#1B7F57;
  --returns:#B03A52;
  --shadow-lg:0 4px 10px rgba(16,20,38,.09),0 22px 48px -14px rgba(16,20,38,.32);
  color:var(--ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  margin:32px 0;
  -webkit-font-smoothing:antialiased;
}
.n3l-retail-pos-multi-till,.n3l-retail-pos-multi-till *,.n3l-retail-pos-multi-till *::before,.n3l-retail-pos-multi-till *::after{box-sizing:border-box}
.n3l-retail-pos-multi-till .fig{max-width:720px;margin:0 auto;background:var(--paper);border:1px solid var(--rule);border-radius:8px;box-shadow:var(--shadow-lg);overflow:hidden;container-type:inline-size}
.n3l-retail-pos-multi-till .eyebrow{font-size:10px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}

/* masthead */
.n3l-retail-pos-multi-till .mast{background:var(--ink);color:var(--paper);padding:32px 34px 28px;position:relative;overflow:hidden}
.n3l-retail-pos-multi-till .mast::after{content:"";position:absolute;top:0;bottom:0;right:-40px;width:180px;background:linear-gradient(180deg,rgba(251,139,60,.20),rgba(251,139,60,0));transform:skewX(-16deg);pointer-events:none}
.n3l-retail-pos-multi-till .mast>*{position:relative;z-index:1}
.n3l-retail-pos-multi-till .brand-eyebrow{display:block;color:var(--muted-dark);margin-bottom:22px}
.n3l-retail-pos-multi-till .display-title{font-family:Archivo,Inter,sans-serif;font-size:clamp(26px,5.1cqi,38px);font-weight:600;letter-spacing:-.038em;line-height:1.07;margin:0 0 11px;max-width:20ch;text-wrap:balance}
.n3l-retail-pos-multi-till .hi{color:var(--accent-hi)}
.n3l-retail-pos-multi-till .sub{color:var(--muted-dark);font-size:14px;line-height:1.5;margin:0;max-width:52ch}

/* column header strip */
.n3l-retail-pos-multi-till .ladder{padding:0 0 4px}
.n3l-retail-pos-multi-till .ladder-head{display:grid;grid-template-columns:132px 1fr 1.45fr;align-items:center;background:var(--paper-2);border-bottom:1px solid var(--rule);padding:9px 34px}
.n3l-retail-pos-multi-till .col-label{font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.n3l-retail-pos-multi-till .col-label--a{grid-column:2;color:var(--muted)}
.n3l-retail-pos-multi-till .col-label--b{grid-column:3;color:var(--accent);padding-left:18px}

/* ladder rows */
.n3l-retail-pos-multi-till .row{display:grid;grid-template-columns:132px 1fr 1.45fr;align-items:stretch;border-bottom:1px solid var(--rule);padding:0 34px}
.n3l-retail-pos-multi-till .row:last-child{border-bottom:0}
.n3l-retail-pos-multi-till .row--stock{--tone:var(--stock)}
.n3l-retail-pos-multi-till .row--people{--tone:var(--people)}
.n3l-retail-pos-multi-till .row--close{--tone:var(--close)}
.n3l-retail-pos-multi-till .row--returns{--tone:var(--returns)}

.n3l-retail-pos-multi-till .row-key{display:flex;align-items:baseline;gap:9px;padding:19px 14px 19px 0;position:relative}
.n3l-retail-pos-multi-till .row-key::before{content:"";position:absolute;left:-34px;top:0;bottom:0;width:3px;background:var(--tone)}
.n3l-retail-pos-multi-till .row-no{color:var(--tone);font-family:Archivo,Inter,sans-serif;font-size:13px;font-weight:600;letter-spacing:-.03em;line-height:1}
.n3l-retail-pos-multi-till .row-key h2{font-family:Archivo,Inter,sans-serif;font-size:16px;font-weight:600;letter-spacing:-.02em;line-height:1.15;margin:0}

.n3l-retail-pos-multi-till .cell{padding:19px 0;display:flex;flex-direction:column;justify-content:center}
.n3l-retail-pos-multi-till .cell p{margin:0;line-height:1.45}
.n3l-retail-pos-multi-till .cell--a{padding-right:18px}
.n3l-retail-pos-multi-till .cell--a p{color:var(--muted);font-size:11.5px}
.n3l-retail-pos-multi-till .cell--b{background:var(--paper-3);border-left:1px solid var(--rule);padding-left:18px;padding-right:2px;position:relative}
.n3l-retail-pos-multi-till .cell--b::before{content:"";position:absolute;left:-4px;top:50%;width:7px;height:7px;margin-top:-3.5px;background:var(--tone);border-radius:50%}
.n3l-retail-pos-multi-till .cell--b p{color:var(--ink-2);font-size:12.5px;font-weight:500}
.n3l-retail-pos-multi-till .cell--b em{color:var(--tone);font-style:normal;font-weight:600}
.n3l-retail-pos-multi-till .ask{color:var(--tone);font-size:10px;font-weight:600;letter-spacing:.08em;margin-top:8px;text-transform:uppercase}

/* footer */
.n3l-retail-pos-multi-till .foot{background:var(--ink-2);color:var(--paper);padding:17px 34px;display:flex;flex-direction:column;gap:6px;border-top:3px solid var(--accent)}
.n3l-retail-pos-multi-till .foot .eyebrow{color:var(--accent-hi)}
.n3l-retail-pos-multi-till .foot strong{font-family:Archivo,Inter,sans-serif;font-size:13.5px;font-weight:600;letter-spacing:-.01em;line-height:1.45}

@container (max-width:719px){
  .n3l-retail-pos-multi-till .mast{padding:26px 22px 24px}
  .n3l-retail-pos-multi-till .ladder-head{display:none}
  .n3l-retail-pos-multi-till .row{grid-template-columns:1fr;padding:0 22px}
  .n3l-retail-pos-multi-till .row-key{padding:16px 0 0}
  .n3l-retail-pos-multi-till .row-key::before{left:-22px;width:3px}
  .n3l-retail-pos-multi-till .cell{padding:8px 0 0}
  .n3l-retail-pos-multi-till .cell--a,.n3l-retail-pos-multi-till .cell--b{padding-left:0;padding-right:0;border-left:0;background:none}
  .n3l-retail-pos-multi-till .cell--b::before{display:none}
  .n3l-retail-pos-multi-till .cell--a p::before{content:"One till: ";color:var(--muted);font-weight:600}
  .n3l-retail-pos-multi-till .cell--b p::before{content:"Several: ";color:var(--tone);font-weight:600}
  .n3l-retail-pos-multi-till .row:last-child .cell--b{padding-bottom:16px}
  .n3l-retail-pos-multi-till .foot{padding:16px 22px}
}
