/* Lokamo :: integracje z kasa (indeks + GoPOS, Dotykacka, Fodimi, Syrve).
   Buduje na home.css i szablon.css (.sub-hero, .tp-phone, .tp-card).
   Scena: karta z kasy trafia do telefonu gościa, gość zamawia, bon jedzie
   do kasy. Wymiary w em, skala z cqw kontenera jak w reszcie serwisu. */

/* ---------- scena ---------- */
.ps-path{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:3}
.ps-path path{fill:none;stroke:#C4C4CB;stroke-width:.14;stroke-dasharray:.34 .4;stroke-linecap:round;transition:stroke .3s}
.ps-path circle{fill:var(--cobalt);opacity:0;transition:opacity .2s}
.ps-fly path{stroke:#9AA7FF}
.ps-fly circle{opacity:1}
.ps-list li{transition:opacity .45s var(--ease),transform .55s var(--ease-out)}
.js .ps-list li:not(.is-in){opacity:0;transform:translateX(-.8em)}
.ps-src{display:inline-flex;align-items:center;gap:.4em}
.ps-src img{height:1.05em;width:auto;max-width:4.6em}
.ps-sync{left:22.4em;top:4em;width:16.2em}
.ps-sync__h{display:flex;align-items:center;gap:.6em;margin-top:.7em;font-size:1em;font-weight:620}
.ps-sync__h img{max-height:1.3em;max-width:5.6em;width:auto;height:auto}
.ps-sync__h svg{width:1.1em;height:1.1em;color:var(--steel)}
.ps-bar{display:block;height:.4em;margin-top:.8em;border-radius:99px;background:#EDEDF1;overflow:hidden}
.ps-bar i{display:block;height:100%;width:calc(var(--p,1) * 100%);border-radius:inherit;background:var(--cobalt)}
.ps-sync small{display:block;margin-top:.6em;font-size:.82em;color:var(--steel)}
.ps-chk{left:22.4em;top:4em;width:16.2em;border-left:.3em solid var(--ok)}
.ps-chk p:not(.tp-card__k){margin-top:.5em;font-size:.95em;font-weight:600}
.ps-chk small{display:block;margin-top:.3em;font-size:.82em;color:var(--steel)}
.ps-dev{position:absolute;left:22.4em;top:13.4em;width:16.2em;z-index:2}
.ps-dev__s{padding:.55em;border-radius:1.15em;background:#111114;box-shadow:0 0 0 .1em #3A3A40,0 1.8em 3.2em -1.5em rgba(13,13,15,.55)}
.ps-dev__in{position:relative;height:20.4em;border-radius:.7em;background:#fff;overflow:hidden}
.ps-dev__h{display:flex;align-items:center;justify-content:space-between;height:2.9em;padding:0 .9em;border-bottom:1px solid #EFEFF2}
.ps-dev__h img{max-height:1.35em;max-width:6em;width:auto;height:auto}
.ps-dev__h span{font-size:.8em;color:var(--steel)}
.ps-empty{position:absolute;left:0;right:0;top:8.4em;text-align:center;font-size:.86em;color:var(--mute);transition:opacity .3s}
.ps-bon{padding:.7em .9em 0;opacity:0;transform:translateY(.6em);transition:opacity .35s,transform .5s var(--ease-out)}
.ps-dev.is-bon .ps-bon{opacity:1;transform:none}
.ps-dev.is-bon .ps-empty{opacity:0}
.ps-type{display:flex;justify-content:space-between;align-items:center;font-size:.78em;color:var(--steel)}
.ps-type b{padding:.25em .5em;border-radius:.35em;background:#EEF1FF;color:var(--cobalt-deep);font-weight:500}
.ps-bon ul{margin-top:.45em}
.ps-bon li{display:flex;justify-content:space-between;gap:.6em;padding:.45em 0;border-bottom:1px solid #F2F2F5;font-size:.9em;opacity:0;transform:translateX(-.5em);transition:opacity .3s,transform .45s var(--ease-out)}
.ps-bon li small{display:block;font-size:.85em;color:var(--steel)}
.ps-bon li em{font-style:normal}
.ps-dev.is-bon .ps-bon li{opacity:1;transform:none}
.ps-dev.is-bon .ps-bon li:nth-child(2){transition-delay:.18s}
.ps-note{margin-top:.6em;padding:.5em .6em;border-radius:.45em;background:#F5F5F8;font-size:.74em;line-height:1.4;color:var(--text2)}
.ps-sum{display:flex;justify-content:space-between;margin-top:.6em;font-size:.92em;font-weight:640}
.ps-ok{display:flex;align-items:center;gap:.45em;margin-top:.6em;font-size:.78em;font-weight:620;color:var(--ok);opacity:0;transition:opacity .3s .5s}
.ps-dev.is-bon .ps-ok{opacity:1}
.ps-ck{display:grid;place-items:center;flex:none;width:1.3em;height:1.3em;border-radius:50%;background:var(--ok)}
.ps-ck::before{content:"";width:58%;height:58%;background:#fff;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.6 4.6L19 7.6' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.6 4.6L19 7.6' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.ps-dev__st{display:block;width:1.9em;height:2.6em;margin:0 auto;background:linear-gradient(90deg,#1A1A1E,#3A3A40 50%,#1A1A1E)}
.ps-dev::after{content:"";display:block;width:7.4em;height:.9em;margin:-.2em auto 0;border-radius:50%;background:radial-gradient(#3A3A40,#1A1A1E 70%)}
.ps-dev.is-bon .ps-dev__s{box-shadow:0 0 0 .14em var(--cobalt),0 1.8em 3.2em -1.5em rgba(46,75,255,.45);transition:box-shadow .4s}

/* ---------- hero: karta polaczenia (panel Lokamo, sekcja POS) ---------- */
.ps-hero .sub-hero__vis{display:grid;place-items:center}
.ps-link{width:min(100%,460px);padding:26px;border-radius:20px;background:#fff;color:var(--ink);box-shadow:0 0 0 1px rgba(255,255,255,.06),0 2em 3.4em -1.6em rgba(0,0,0,.8)}
.ps-link__top{display:flex;align-items:center;gap:14px}
.ps-tile{display:grid;place-items:center;width:112px;height:64px;flex:none;border-radius:14px;background:var(--paper)}
.ps-tile img{max-width:84px;max-height:26px;width:auto;height:auto}
.ps-tile svg{width:30px;height:30px}
.ps-link__line{position:relative;flex:1;height:2px;background:repeating-linear-gradient(90deg,#C4C4CB 0 5px,transparent 5px 10px)}
.ps-link__line .ps-ck{position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;box-shadow:0 0 0 5px #fff}
.ps-link__k{margin-top:22px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--steel)}
.ps-fields{margin-top:10px;border-top:1px solid var(--line)}
.ps-fields div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:11px 0;border-bottom:1px solid var(--line)}
.ps-fields dt{font-size:14.5px;font-weight:560}
.ps-fields dt small{display:block;margin-top:2px;font-weight:400;font-size:12.5px;color:var(--steel)}
.ps-fields dd{font:500 13.5px/1.3 var(--mono);color:var(--text2);text-align:right}
.ps-link__ok{display:flex;align-items:center;gap:9px;margin-top:16px;font-size:14px;font-weight:560;color:#14784A}
.ps-link__ok .ps-ck{width:18px;height:18px}
.ps-link__btn{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding:12px 14px;border-radius:10px;background:var(--ink);color:#fff;font-size:14.5px;font-weight:560}
.ps-link__btn span{font:500 12.5px/1 var(--mono);color:#9AA7FF}
.ps-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:min(100%,480px)}
.ps-grid a{display:grid;place-items:center;gap:10px;height:128px;border-radius:16px;background:#fff;text-decoration:none;color:var(--steel);font:500 12px/1 var(--mono);letter-spacing:.04em;transition:transform .3s var(--ease),box-shadow .3s}
.ps-grid a:hover{transform:translateY(-2px);box-shadow:0 0 0 2px #9AA7FF}
.ps-grid a:focus-visible{outline:2px solid #9AA7FF;outline-offset:3px}
.ps-grid img{max-width:120px;max-height:32px;width:auto;height:auto}
.ps-grid p{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin-top:6px;font-size:14px;line-height:1.45;color:var(--d-text)}
.ps-grid p svg{width:16px;height:16px;flex:none;color:#9AA7FF}

/* ---------- tresc ---------- */
.ps-sec{padding:112px 0}
.ps-sec--w{background:#fff}
.ps-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;margin-top:56px}
.ps-box{padding:32px 32px 34px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.ps-sec--w .ps-box{background:var(--paper);border-color:transparent}
.ps-box__k{font:500 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--steel)}
.ps-box h3{margin-top:14px;font-size:24px;font-weight:600;letter-spacing:-.026em;line-height:1.15}
.ps-box>p{margin-top:12px;font-size:16px;line-height:1.6;color:var(--text2)}
.ps-box>p+p{margin-top:10px}
.ps-ul{display:grid;gap:10px;margin-top:18px}
.ps-ul li{position:relative;padding-left:26px;font-size:15.5px;line-height:1.55;color:var(--text2)}
.ps-ul li::before{content:"";position:absolute;left:0;top:.42em;width:14px;height:14px;border-radius:50%;background:var(--ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4L18.5 8' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/10px no-repeat}
.ps-ul--no li::before{background:#B5B5BC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7.5 12h9' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round'/%3E%3C/svg%3E") center/10px no-repeat}
.ps-dl{margin-top:18px;border-top:1px solid var(--line)}
.ps-sec--w .ps-dl{border-color:#E1E1E6}
.ps-dl div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}
.ps-dl dt{font-size:15px;font-weight:600}
.ps-dl dt span{display:inline-block;margin-left:6px;padding:3px 7px;border-radius:5px;background:#EEF1FF;color:var(--cobalt-deep);font:500 11px/1 var(--mono);vertical-align:2px}
.ps-dl dt span.o{background:#EFEFF2;color:var(--steel)}
.ps-dl dd{font-size:15px;line-height:1.5;color:var(--text2)}
.ps-flag{display:flex;gap:14px;margin-top:40px;padding:20px 22px;border-radius:14px;background:#FFF8EC;border:1px solid #F3DDB3;font-size:15.5px;line-height:1.55;color:#5E4210}
.ps-flag svg{width:20px;height:20px;flex:none;margin-top:1px;color:#B06F00}
.ps-flag b{color:#3E2B07}
.ps-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:48px;counter-reset:k}
.ps-steps--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ps-steps li{padding:26px 24px 28px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.ps-steps li::before{counter-increment:k;content:"0" counter(k);display:block;margin-bottom:30px;font:500 13px/1 var(--mono);color:var(--cobalt-deep)}
.ps-steps h3{font-size:18.5px;font-weight:600;letter-spacing:-.02em;line-height:1.25}
.ps-steps p{margin-top:8px;font-size:15px;line-height:1.55;color:var(--text2)}
.ps-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:56px}
.ps-card{display:flex;flex-direction:column;padding:24px 24px 26px;border-radius:18px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink);transition:border-color .25s,box-shadow .35s var(--ease),transform .35s var(--ease)}
.ps-card:hover{border-color:#CFCFD6;box-shadow:var(--float);transform:translateY(-2px)}
.ps-card:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px}
.ps-card__l{display:flex;align-items:center;height:64px;padding:0 16px;border-radius:12px;background:var(--paper)}
.ps-card__l img{max-width:110px;max-height:28px;width:auto;height:auto}
.ps-card h3{margin-top:20px;font-size:20px;font-weight:600;letter-spacing:-.022em}
.ps-card p{margin-top:8px;font-size:15px;line-height:1.55;color:var(--text2)}
.ps-card dl{display:grid;gap:6px;margin:16px 0 18px;padding-top:14px;border-top:1px solid var(--line)}
.ps-card dl div{display:flex;justify-content:space-between;gap:10px;font-size:13.5px}
.ps-card dt{color:var(--steel)}
.ps-card dd{font-weight:560;text-align:right}
.ps-card__go{display:inline-flex;align-items:center;gap:8px;margin-top:auto;font-weight:560;font-size:15px}
.ps-card__go svg{transition:transform .25s var(--ease)}
.ps-card:hover .ps-card__go svg{transform:translateX(3px)}
.ps-rel{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.ps-rel a{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 16px;border-radius:10px;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink);font-size:15px;font-weight:540;transition:border-color .2s}
.ps-rel a:hover{border-color:#A6A6AB}
.ps-rel a:focus-visible{outline:2px solid var(--cobalt);outline-offset:2px}
.ps-rel img{max-height:18px;max-width:70px;width:auto;height:auto}
.ps-sec a:not([class]){color:var(--ink);text-decoration:underline;text-decoration-color:rgba(13,13,15,.3);text-underline-offset:3px}

@media (max-width:1100px){
  .ps-cards{grid-template-columns:1fr 1fr}
  .ps-steps{grid-template-columns:1fr 1fr}
}
@media (max-width:999px){
  .ps-two{grid-template-columns:1fr}
  .ps-hero .sub-hero__vis{max-width:none}
  .ps-steps--3{grid-template-columns:1fr}
}
@media (max-width:640px){
  .ps-sec{padding:80px 0}
  .ps-box{padding:24px 20px 26px}
  .ps-box h3{font-size:21px}
  .ps-dl div{grid-template-columns:1fr;gap:4px}
  .ps-steps,.ps-cards{grid-template-columns:1fr}
  .ps-link{padding:20px}
  .ps-tile{width:92px;height:56px}
  .ps-grid a{height:104px}
  .ps-fields div{flex-direction:column;align-items:flex-start;gap:4px}
  .ps-fields dd{text-align:left}
}
@media (prefers-reduced-motion:reduce){
  .ps-list li,.ps-bon,.ps-bon li,.ps-ok,.ps-card,.ps-grid a{transition:none}
}

/* POSbistro ma kwadratowy znak: obok napis, zeby kafelek wygladal jak logotypy pozostalych kas. */
.ig-pb{gap:.45em}
.ig-pb img{width:30px;height:30px;border-radius:7px}
.ig-pb span{font:700 21px/1 var(--font);letter-spacing:-.03em;color:#1B2A4A}
.ps-grid .ig-pb{display:flex;align-items:center;justify-content:center;gap:10px}
.ps-grid .ig-pb img{width:40px;height:40px}
.ps-grid .ig-pb span{display:inline;font:700 26px/1 var(--font);letter-spacing:-.03em;color:#1B2A4A}