/* POS System page. Builds on the shared .we2 and .ec components. */
.pos .pos-demo{max-width:560px;justify-self:end;width:100%}
.pos-demo__body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);background:#070b12;color:#e7edf5;min-height:300px}
.pos-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:12px;align-content:start}
.pos-tile{all:unset;box-sizing:border-box;cursor:pointer;display:grid;gap:2px;padding:12px;background:#101826;border:1px solid rgba(219,229,242,.16);color:#e7edf5;transition:border-color .2s}.pos-tile:hover{border-color:#52a8ff}.pos-tile:focus-visible{outline:2px solid #52a8ff}
.pos-tile b{font-size:14px;color:#fff}.pos-tile span{font-size:12.5px;color:#9aa6b4}.pos-tile.is-out{opacity:.45;pointer-events:none}
.pos-rec{padding:12px 14px;border-left:1px solid rgba(219,229,242,.16);background:#0c121c;color:#e7edf5;display:grid;gap:8px;align-content:start}.pos-rec__h{font:600 11px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:#9aa6b4}
.pos-rec ul{list-style:none;margin:0;padding:0;display:grid;gap:4px;max-height:130px;overflow:auto}.pos-rec li{display:flex;justify-content:space-between;font-size:13.5px;border-bottom:1px dashed rgba(219,229,242,.16);padding-bottom:3px}.pos-rec li.is-empty{color:#9aa6b4;border:0}
.pos-rec__t{display:flex;justify-content:space-between;font-size:16px;border-top:2px solid #e7edf5;padding-top:6px}.pos-rec__b{display:flex;gap:8px}.pos-rec__b .we2-btn{min-height:40px;padding:0 14px;font-size:14px}
.pos-rec__m{font-size:12.5px;color:#62c073;min-height:1.2em}
.pos-sync{display:grid;grid-template-columns:auto 1fr 1fr;gap:10px 14px;align-items:center;padding:10px 14px;border-top:1px solid rgba(219,229,242,.16);background:#0c121c;color:#e7edf5;font-size:13px}.pos-sync__d{width:10px;height:10px;border-radius:50%;background:#3a4a62}.pos-sync__d.pulse{background:#52a8ff;animation:pos-p .9s}
@keyframes pos-p{0%{box-shadow:0 0 0 0 rgba(82,168,255,.6)}100%{box-shadow:0 0 0 14px rgba(82,168,255,0)}}
.pos-feat{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pos-feat li{background:#fff;border:1px solid var(--line);padding:0 0 18px;display:grid;align-content:start;transition:border-color .25s,transform .25s,box-shadow .25s}.pos-feat li:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:0 18px 36px -26px rgba(82,168,255,.55)}
.pos-feat svg{display:block;width:100%;height:auto;aspect-ratio:12/7;background:#f3f6fa linear-gradient(#e3e9f3 1px,transparent 1px) 0 0/20px 20px;border-bottom:1px solid var(--line);margin-bottom:14px}.pos-feat h3{font-size:18px;padding-inline:18px}.pos-feat p{padding:6px 18px 0;color:var(--ink2);font-size:15px}
.pos-feat .a1{transition:transform .5s;transform-box:fill-box}.pos-feat li:hover .a1{transform:translateX(6px)}
.pos-roll{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,2vw,24px)}.pos-roll li{border-top:2px solid #2a3340;padding-top:12px;display:grid;gap:4px}.pos-roll span{font:500 12px var(--font-mono);color:#a3a3a3}.pos-roll b{font-size:20px;color:#fff}.pos-roll p{color:#aab6c8;font-size:14.5px}
.pos-links{list-style:none;margin:20px 0 0;padding:16px 0 0;border-top:1px solid #232a36;display:flex;flex-wrap:wrap;gap:8px 24px}.pos-links a{color:#9bbcff;text-decoration:none;font-size:14.5px}.pos-links a:hover{text-decoration:underline}
@media (max-width:1100px){.pos-feat{grid-template-columns:repeat(2,1fr)}}
@media (max-width:1000px){.pos .pos-demo{justify-self:stretch;max-width:none}}
@media (max-width:760px){.pos-demo__body{grid-template-columns:minmax(0,1fr)}.pos-rec{border-left:0;border-top:1px solid rgba(219,229,242,.16)}.pos-feat,.pos-roll{grid-template-columns:minmax(0,1fr)}.pos-sync{grid-template-columns:auto 1fr}.pos-sync__o{grid-column:1/-1}}
.pos{color-scheme:dark;background:#000;color:#e7edf5;--ink:#e7edf5;--ink2:#c5d0de;--mute:#9aa6b4;--line:rgba(219,229,242,.16);--paper:#000;--mist:#070b12;--blue:#52a8ff;--blue-d:#0a49c4}
.pos .ec-hero,.pos .we2-sec,.pos .pos-sec,.pos .we2-start,.pos .pos-mid{min-height:0;display:block;align-content:start;background:#000}
.pos .ec-sz__tabs{border-color:rgba(219,229,242,.16)}
.pos .ec-sz__tabs button{background:#05080d;color:#e7edf5;border-color:rgba(219,229,242,.16)}
.pos .ec-sz__tabs em,.pos .ec-sz__tabs span{color:#9aa6b4}
.pos .ec-sz__panel{background:#05080d;border-color:rgba(219,229,242,.16);color:#e7edf5}
.pos .ec-sz__viz{background:#070b12;border-color:rgba(219,229,242,.16)}
.pos .ec-sz__txt>p,.pos .ec-sz__ul li{color:#c3c9d1}
.pos .ec-dark__row>p{color:#c3c9d1}
.pos-sec,.pos .we2-sec,.pos .we2-start{background:#000;border-top:1px solid rgba(219,229,242,.16);padding:clamp(28px,4vh,48px) 0}
.pos h1{font-size:clamp(32px,3.6vw,48px);line-height:1.12;letter-spacing:-.03em;text-wrap:balance}
.pos h2{text-wrap:balance}
.pos .we2-lead,.pos-head p,.pos-cover p,.pos .we2-sub,.pos .we2-reasons{color:#c3c9d1;font-size:16px;line-height:1.5}
.pos-head{display:grid;gap:8px;margin-bottom:16px;max-width:46rem}
.pos-head p{margin:0}
.pos .we2-btn{min-height:44px}
.pos .we2-btn--primary{background:#fff;border-color:#fff;color:#121212}
.pos .we2-btn--primary:hover{background:#ededed;border-color:#ededed;color:#121212}
.pos .we2-btn--primary:active{transform:none}
.pos .we2-btn--ghost{border-color:rgba(219,229,242,.16);color:#ededed;background:transparent}
.pos :focus-visible{outline:2px solid #52a8ff;outline-offset:2px}
.pos-jump{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
.pos-jump a{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-height:44px;padding:16px;background:#05080d;border:1px solid rgba(219,229,242,.16);color:#ededed;text-decoration:none}
.pos-jump a span{color:#52a8ff;font:500 13px/1 var(--font-mono)}
.pos-jump a b{font:600 16px/1.3 var(--font-sans);color:#fff}
.pos-jump a small{color:#c3c9d1;font:400 16px/1.5 var(--font-sans)}
.pos-jump a:hover{border-color:#fff}
.pos-cover,.pos-roll{display:grid;grid-template-columns:1fr;gap:clamp(12px,2.2vw,16px)}
.pos-cover article{display:flex;flex-direction:column;gap:0;padding:0 0 clamp(20px,2.4vw,24px);background:#05080d;border:1px solid rgba(219,229,242,.16);min-width:0;overflow:hidden}
.pos-cover img,.pos-iso{display:block;width:100%;height:auto;aspect-ratio:3/1.3;object-fit:cover;background:#070b12;border-bottom:1px solid rgba(219,229,242,.16)}
.pos-cover h3,.pos-cover p{margin:10px clamp(16px,2vw,22px) 0}
.pos-cover h3{font:400 clamp(1.0625rem,1.2vw,1.125rem)/1.32 var(--font-sans)}
.pos-roll{list-style:none;margin:0;padding:0}
.pos-roll li{background:#05080d;border:1px solid rgba(219,229,242,.16);padding:16px}
.pos-roll b{color:#fff}
.pos-roll p{color:#c3c9d1;font-size:16px;line-height:1.5}
.pos-links a{color:#ededed;min-height:44px;display:inline-flex;align-items:center}
.pos-tile{min-height:44px;transform:none}
.pos-tile b{font-size:16px}
.pos-tile:hover{transform:none}
.pos-rec__b .we2-btn{min-height:44px}
.pos .ec-sz__tabs button{min-height:44px}
.pos .ec-sz__tabs button[aria-selected=true]{background:#fff;color:#121212}
.pos .ec-sz__tabs button[aria-selected=true] em,.pos .ec-sz__tabs button[aria-selected=true] span{color:#3a4352}
.pos-faq,.pos .we2-faq__l details{border-color:rgba(219,229,242,.16)}
.pos .we2-faq__l summary{display:flex;align-items:center;min-height:44px}
.pos-mid{padding:clamp(18px,3vh,28px) 0;border-top:1px solid rgba(219,229,242,.16);background:#070b12}
.pos-mid__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px}
.pos-mid p{margin:0;max-width:48ch;color:#c3c9d1;font-size:16px;line-height:1.5}
.pos .we2-form,.pos .we2-done{background:#0c121c;border-color:rgba(219,229,242,.16);color:#e7edf5}
.pos .we2-form input,.pos .we2-form textarea,.pos .we2-form select{background:#070b12;color:#e7edf5;border-color:#3a4a62}
@media (prefers-reduced-motion:no-preference){
  .pos-cover img,.pos-iso{animation:pos-rise .45s ease both}
  @keyframes pos-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}
.pos-fit{display:grid;grid-template-columns:1fr;gap:clamp(12px,2.2vw,16px)}
.pos-fit article{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0;padding:16px 16px 20px;background:#05080d;border:1px solid rgba(219,229,242,.16)}
.pos-fit span{color:#52a8ff;font:500 13px/1 var(--font-mono)}
.pos-fit h3{margin:0;font:400 clamp(1.0625rem,1.2vw,1.125rem)/1.32 var(--font-sans);color:#fff}
.pos-fit p{margin:0;color:#c3c9d1;font-size:16px;line-height:1.5}
@media (min-width:720px){
  .pos-jump,.pos-cover,.pos-fit{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pos-roll{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1100px){
  .pos-jump,.pos-fit,.pos-cover{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pos-roll{grid-template-columns:repeat(4,minmax(0,1fr))}
}
