/* Salary calculator and amount pages (/kalkulator-wynagrodzen/*) */
.pay{padding:28px 0 56px;background:linear-gradient(180deg,var(--tint),#fff 420px)}
.pay-crumbs{font-size:13px;color:var(--muted);margin-bottom:14px}
.pay-crumbs a{color:var(--ink-2)}
.pay-head{max-width:820px;margin:0 0 22px}
.pay-head h1{font-size:clamp(26px,4.6vw,40px);line-height:1.1;letter-spacing:-.03em;margin:0 0 12px}
.pay-head p{margin:0;color:var(--ink-2);font-size:17px;line-height:1.6}
.pay-lead strong{color:var(--ink)}
.pay-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.pay-tabs a{padding:9px 14px;border:1px solid var(--line);border-radius:999px;background:#fff;font-weight:700;font-size:14px;color:var(--ink-2)}
.pay-tabs a.on{background:var(--ink);border-color:var(--ink);color:#fff}
.pay-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:22px;align-items:start}
.pay .pay-form,.pay .pay-result,.pay .pay-block,.pay .pay-popular,.pay .pay-explain{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px}
.pay-form label{display:block;font-size:13px;font-weight:700;color:var(--ink-2);margin-bottom:14px}
.pay-form select,.pay-amount input{display:block;width:100%;margin-top:6px;border:1px solid var(--line);border-radius:10px;padding:11px 12px;background:#fff;color:var(--ink);font:inherit;font-size:15px}
.pay-amount span{position:relative;display:block}
.pay-amount input{font-size:24px;font-weight:800;padding-right:44px}
.pay-amount b{position:absolute;right:14px;top:50%;transform:translateY(-35%);color:var(--muted)}
.pay-direction{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:16px;padding:4px;background:var(--tint);border-radius:12px}
.pay-direction label{margin:0;cursor:pointer}
.pay-direction input{position:absolute;opacity:0;pointer-events:none}
.pay-direction span{display:block;text-align:center;padding:9px 6px;border-radius:9px;font-size:13.5px}
.pay-direction input:checked+span{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(18,47,77,.15)}
.pay-direction input:focus-visible+span{outline:2px solid var(--brand)}
.pay-opts{border:0;border-top:1px solid var(--line);margin:6px 0 16px;padding:14px 0 0}
.pay-opts legend{font-weight:800;font-size:14px;padding-right:8px}
.pay-opts label:has(input[type=checkbox]){display:flex;gap:9px;align-items:flex-start;font-weight:600;line-height:1.35}
.pay-opts input[type=checkbox]{width:17px;height:17px;margin:1px 0 0;flex:0 0 auto;accent-color:var(--brand-600)}
.pay-form>.btn{width:100%;justify-content:center;min-height:46px}
.pay-note{color:var(--muted);font-size:13px;line-height:1.5;margin:10px 0 0}
.pay-answer{background:var(--ink);color:#fff;border-radius:14px;padding:18px 20px;margin-bottom:6px}
.pay-answer span{display:block;font-size:14px;opacity:.85}
.pay-answer strong{display:block;font-size:clamp(24px,4vw,32px);letter-spacing:-.02em;margin-top:4px}
.pay-answer em{display:block;font-style:normal;font-size:13px;opacity:.85;margin-top:6px}
.pay-result h2,.pay-block h2,.pay-popular h2,.pay-explain h2{font-size:18px;margin:20px 0 10px}
.pay-block h2:first-child,.pay-popular h2:first-child,.pay-explain h2:first-child{margin-top:0}
.pay-table{width:100%;border-collapse:collapse;font-size:14px}
.pay-table th,.pay-table td{padding:9px 6px;border-bottom:1px solid var(--line);text-align:left;font-weight:400}
.pay-table td{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.pay-table thead th{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.pay-table thead th:not(:first-child){text-align:right}
.pay-table tr.sum th,.pay-table tr.sum td{font-weight:800;border-bottom:0;color:var(--ink)}
.pay-table th small{display:block;color:var(--muted);font-size:12px}
.pay-compare tbody th{font-weight:700}
.pay-scroll{overflow-x:auto}
.pay-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:18px}
.pay-stats>div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px}
.pay-stats span{display:block;color:var(--muted);font-size:12px;margin-bottom:4px}
.pay-stats strong{font-size:19px;font-variant-numeric:tabular-nums}
.pay-block{margin-top:18px}
.pay-block p{line-height:1.65;color:var(--ink-2)}
.pay-two{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.pay-two h2{margin-top:0}
.pay-faq h3{font-size:16px;margin:16px 0 4px}
.pay-faq p{margin:0}
.pay-links ul,.pay-popular ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.pay-links li a,.pay-popular li a{display:inline-block;padding:7px 11px;border:1px solid var(--line);border-radius:9px;font-size:14px;color:var(--ink-2);background:#fff}
.pay-links li a:hover,.pay-popular li a:hover{border-color:var(--brand);color:var(--brand-600)}
.pay-links h2{font-size:16px;margin:18px 0 10px}
.pay-popular,.pay-explain{margin-top:22px}
.pay-popular details{border-top:1px solid var(--line);padding:12px 0}
.pay-popular summary{cursor:pointer;font-weight:700;margin-bottom:8px}
.pay-explain p{line-height:1.65;color:var(--ink-2)}
@media(max-width:860px){
  .pay-grid,.pay-two{grid-template-columns:1fr}
  .pay-stats{grid-template-columns:1fr 1fr}
}
@media(max-width:420px){
  .pay .pay-form,.pay .pay-result,.pay .pay-block,.pay .pay-popular,.pay .pay-explain{padding:16px}
  .pay-stats strong{font-size:16px}
}
