/*
 * Kalkulačky STAVPORTAL (OWNER: integrácia 10 kalkulačiek, 30. 10. 2026) – vizuál z balíka kalkulačiek zosúladený s webom
 * (tokeny R4.3, Poppins / Bebas Neue, tlačidlá V4, svetlý aj tmavý režim). Všetko izolované v .spk – hlavička, pätička
 * a ostatné stránky sa nemenia. Hlavička a pätička sú webové (téma), dialóg dopytu je dialóg webu.
 */
/* ---------- kalkulačky (izolované v .spk) ---------- */
.spk{--field:#8a8782;--graphite:#252528;--r:12px;--rl:16px;--cu-btn:var(--v4-cu,#B87333);--cu-btn-h:var(--v4-cu-hover,#C98546);--btn-ink:var(--v4-ink,#0D0D0E);
  --err-wash:color-mix(in srgb,var(--err) 9%,var(--surface));color:var(--ink);font-family:"Poppins",system-ui,sans-serif;overflow-x:clip}
:root[data-theme="dark"] .spk{--field:#6f6f76}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .spk{--field:#6f6f76}}
.spk *,.spk *::before,.spk *::after{box-sizing:border-box}
.spk :where(h1,h2,p,ul,fieldset,legend){margin:0}
.spk :where(button,input,select,textarea){font:inherit;color:inherit}
.spk [hidden]{display:none!important}
.spk .num{font-variant-numeric:tabular-nums}
.spk :focus-visible{outline:2.5px solid var(--v4-focus,var(--ink));outline-offset:3px}
.spk svg.i,.spk .btn svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.spk .wrap{max-width:1280px;margin:0 auto;padding:0 max(28px,env(safe-area-inset-right,0px)) 0 max(28px,env(safe-area-inset-left,0px))}
@media(max-width:720px){.spk .wrap{padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}}
.spk .hero{padding-block:28px 4px}
.spk .crumbs{display:flex;gap:8px;font-size:13px;color:var(--muted);list-style:none;padding:0}
.spk .crumbs li+li::before{content:"/";margin-right:8px;color:var(--line-2)}
.spk .kicker{font-family:"Poppins",system-ui,sans-serif;display:inline-flex;align-items:center;gap:12px;margin-top:24px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--cu-ink)}
.spk .kicker::before{content:"";width:28px;height:1.5px;background:var(--cu)}
.spk h1{margin-top:12px;font-family:"Bebas Neue",Impact,sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(2.7rem,6vw,5rem);line-height:.92;letter-spacing:.01em;text-wrap:balance}
.spk h1 em{font-style:normal;color:var(--cu)}
.spk .lead{margin-top:16px;max-width:64ch;color:var(--ink-2);font-size:clamp(16px,1.25vw,18px)}
.spk .badges{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px;padding:0;list-style:none;font-size:14px;color:var(--muted)}
.spk .badges li{display:inline-flex;align-items:center;gap:7px}
.spk .badges svg{width:16px;height:16px;fill:none;stroke:var(--ok);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.spk .body{padding-block:24px 72px}
.spk .grid{display:grid;gap:16px 24px;align-items:start;grid-template-areas:"main" "side" "extra"}
.spk .main{grid-area:main;min-width:0;display:grid;gap:16px}.spk .side{grid-area:side;min-width:0}.spk .extra{grid-area:extra;min-width:0;display:grid;gap:16px}
@media(min-width:800px){.spk .grid{grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"main side" "extra side"}.spk .side{grid-row:1/span 2;position:sticky;top:96px}}
@media(min-width:1100px){.spk .grid{grid-template-columns:minmax(0,1fr) 390px;gap:32px}}
.spk .pset{min-inline-size:0;margin:0;padding:22px;border:1px solid var(--line);border-radius:var(--rl);background:var(--surface);display:grid;gap:18px;min-width:0}
.spk .pset>legend{float:left;width:100%;padding:22px 22px 0;box-sizing:border-box;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px}
.spk .pset>legend+*{clear:both}
.spk .pset>legend .n{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid var(--line-2);font-size:12px;letter-spacing:0;color:var(--ink)}
.spk .pset>legend b{color:var(--ink);letter-spacing:.06em;font-weight:600}
.spk .pset h2{font-size:20px;font-weight:600;letter-spacing:-.015em}
.spk .pset .sub{font-size:14px;color:var(--muted)}
@media(max-width:480px){.spk .pset{padding:18px 16px}}
.spk .profs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.spk .prof{position:relative;display:grid;gap:8px;align-content:start;justify-items:start;text-align:left;padding:14px;min-height:92px;border:1px solid var(--field);border-radius:var(--r);background:var(--surface);cursor:pointer}
.spk .prof .pi{width:30px;height:30px;fill:none;stroke:var(--muted);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.spk .prof b{font-weight:600;font-size:15px;line-height:1.25;overflow-wrap:normal;word-break:normal;hyphens:none}
.spk .prof small{font-size:12.5px;color:var(--muted)}
.spk .prof:hover{border-color:var(--ink)}
.spk .prof[aria-pressed="true"]{border-color:var(--ink);background:var(--cu-wash);box-shadow:inset 0 0 0 1px var(--ink)}
.spk .prof[aria-pressed="true"] .pi{stroke:var(--cu-ink)}
.spk .prof .cnt{position:absolute;top:8px;right:8px;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--ink);color:var(--on-ink);font-size:12px;font-weight:600;display:grid;place-items:center}
@media(max-width:480px){.spk .profs{grid-template-columns:repeat(2,minmax(0,1fr))}.spk .prof{padding:12px;min-height:84px}}
.spk .work{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.spk .work:first-child{border-top:0;padding-top:0}
.spk .work .n{font-weight:600;font-size:15.5px;line-height:1.3}.spk .work .d{font-size:13.5px;color:var(--muted)}.spk .work .p{font-size:13.5px;color:var(--ink-2);margin-top:2px}
@media(max-width:520px){.spk .work{grid-template-columns:minmax(0,1fr)}.spk .work .btn{justify-self:start}}
.spk .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;border:1.5px solid var(--v4-sec-bd,#58585C);background:transparent;color:var(--v4-sec-fg,var(--ink));font-size:15px;font-weight:600;line-height:1;cursor:pointer;white-space:nowrap}
.spk .btn:hover{background:var(--v4-sec-hover,rgb(13 13 14 / .06));border-color:var(--v4-sec-fg,var(--ink))}
.spk .btn.sm{min-height:40px;padding:0 16px;font-size:14px}.spk .btn.lg{min-height:56px;padding:0 28px;font-size:16px}.spk .btn.block{width:100%}
.spk .btn.primary{background:var(--cu-btn);color:var(--btn-ink);border-color:transparent}.spk .btn.primary:hover{background:var(--cu-btn-h)}
.spk .btn.added{border-color:var(--ok);color:var(--ok)}
.spk .work .wa{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px 12px}.spk .work .st-added{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--ok)}.spk .work .st-added svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:520px){.spk .work .wa{justify-content:flex-start}}
.spk .res.ex .sum{color:var(--muted);font-weight:600}
.spk .rozv{padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--sunk,var(--surface));display:grid;gap:10px}
.spk .btn:disabled,.spk .btn:disabled:hover{background:var(--v4-dis-bg,#E7E5E1);color:var(--v4-dis-fg,#6B6B70);border-color:transparent;cursor:not-allowed}
.spk .lnk{background:none;border:0;padding:4px 0;min-height:36px;color:var(--muted);text-decoration:underline;text-underline-offset:5px;text-decoration-color:color-mix(in srgb,currentColor 45%,transparent);font-size:14px;font-weight:500;cursor:pointer}
.spk .lnk:hover{color:var(--ink)}.spk .lnk:disabled{opacity:.5;cursor:not-allowed}
.spk .lines{display:grid;gap:12px}
.spk .empty{padding:18px;border:1px dashed var(--line-2);border-radius:var(--r);color:var(--muted);font-size:14.5px}
.spk .line{padding:16px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);display:grid;gap:12px}
.spk .line .hd{display:flex;align-items:flex-start;gap:12px}
.spk .line .pf{font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.spk .line .t{font-weight:600;font-size:16px;line-height:1.3}
.spk .line .x{margin-left:auto;flex:none}
.spk .ctrls{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:flex-end}
.spk .qty label,.spk .mode .lbl{display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
.spk .qty .in{display:flex;align-items:stretch;height:48px;border:1px solid var(--field);border-radius:var(--r);background:var(--surface);overflow:hidden}
.spk .qty input{width:9ch;min-width:0;border:0;background:transparent;padding:0 6px 0 14px;font-size:17px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums;outline:none;color:var(--ink)}
.spk .qty .u{display:grid;place-items:center;padding:0 14px 0 6px;color:var(--muted);font-size:15px}
.spk .qty .in:focus-within{border-color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 35%,transparent)}
.spk .qty.bad .in{border-color:var(--err);box-shadow:0 0 0 1px var(--err)}
.spk .seg{display:inline-flex;gap:2px;padding:3px;border-radius:999px;border:1.5px solid var(--line-2)}
.spk .seg button{min-height:40px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:var(--ink-2);font-size:14.5px;font-weight:600;cursor:pointer}
.spk .seg button:hover{background:var(--sunk);color:var(--ink)}
.spk .seg button[aria-pressed="true"]{background:var(--v4-seg-on-bg,var(--ink));color:var(--v4-seg-on-fg,var(--on-ink))}
.spk .seg button:disabled{cursor:not-allowed}.spk .seg button:disabled:not([aria-pressed="true"]){color:var(--muted);background:transparent}
.spk .seg .na{font-weight:500;font-size:12px;opacity:.85}
@media(max-width:420px){.spk .ctrls{display:grid;grid-template-columns:minmax(0,1fr)}.spk .seg{display:grid;grid-template-columns:1fr 1fr}.spk .seg button{padding:0 8px}.spk .qty input{width:100%}}
.spk .out{display:grid;gap:8px}
.spk .res{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.spk .res .unit{font-size:14px;color:var(--ink-2)}
.spk .res .sum{margin-left:auto;font-size:18px;font-weight:600;white-space:nowrap}
.spk .tag{display:inline-flex;align-items:center;gap:6px;margin-left:6px;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;vertical-align:1px}
.spk .tag::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.spk .tag.bez{background:var(--ok-wash);color:var(--ok)}.spk .tag.neu{background:var(--err-wash);color:var(--err)}
.spk .msg{padding:10px 12px;border-radius:var(--r);font-size:14px}
.spk .msg.warn{background:var(--err-wash);color:var(--ink-2);border-left:2px solid var(--err)}
.spk .msg.info{background:var(--sunk);color:var(--ink-2);border-left:2px solid var(--line-2)}
.spk .msg.note{background:var(--sunk);color:var(--ink-2);border-left:2px solid var(--cu)}
/* panel s cenou – grafit vo svetlom aj tmavom režime */
.spk .sum-p{border-radius:var(--rl);background:var(--graphite);color:#fafaf9;padding:24px;display:grid;gap:16px;--md:#b4b4b8}
:root[data-theme="dark"] .spk .sum-p{background:#1f1f22;box-shadow:inset 0 0 0 1px #2e2e33}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .spk .sum-p{background:#1f1f22;box-shadow:inset 0 0 0 1px #2e2e33}}
.spk .sum-p :focus-visible{outline-color:#fafaf9}
.spk .res-h{display:flex;justify-content:space-between;align-items:center;gap:12px}
.spk .res-l{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--md)}
.spk .chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600}
.spk .chip::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.spk .chip.ok{background:#16301f;color:#86d3a4}
.spk .price-empty{font-size:18px;font-weight:500;line-height:1.35}
.spk .total{display:grid;gap:4px}
.spk .total .k{font-size:12.5px;font-weight:600;color:var(--md);letter-spacing:.04em}
.spk .total .v{font-size:clamp(1.5rem,2.6vw,1.9rem);font-weight:600;letter-spacing:-.02em;line-height:1.15}
.spk .total .v .dash{color:#e3a46a;font-weight:400}
.spk .total .s{font-size:14px;color:var(--md)}.spk .total .s span{font-size:12.5px}
.spk .total.neu{padding:12px 14px;border-radius:12px;background:#34302b;color:#e6dccf}
.spk .total.neu .k,.spk .total.neu .s{color:#e6dccf}.spk .total.neu .v{font-size:1.3rem}
.spk .miss ul{margin:8px 0 0;padding:0;list-style:none;display:grid;gap:6px;font-size:14px;color:var(--md)}
.spk .miss li{display:flex;gap:8px}.spk .miss li::before{content:"";width:14px;height:14px;margin-top:4px;border-radius:50%;border:1.5px dashed #6a6a70;flex:none}
.spk .note-d{font-size:13.5px;color:var(--md)}
.spk .lnk.on-dark{color:#fafaf9;justify-self:center}
.spk table.br{width:100%;border-collapse:collapse;font-size:14px}
.spk .br th,.spk .br td{padding:10px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.spk .br th{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.spk .br .r{text-align:right;white-space:nowrap}.spk .br td small{display:block;color:var(--muted);font-size:12.5px}
.spk .br tfoot td{font-weight:600;border-bottom:0}
.spk .tablewrap{overflow-x:auto}
@media(max-width:560px){.spk .br .uc{display:none}.spk .br{font-size:13px}.spk .br th,.spk .br td{padding:8px 4px}}
.spk .help{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));border-top:1px solid var(--ink)}
.spk .help div{padding:14px 16px 14px 0;font-size:14px;color:var(--muted);border-bottom:1px solid var(--line);display:grid;gap:3px;align-content:start}
.spk .help b{color:var(--ink);font-weight:600}
.spk .mbar{display:none}
@media(max-width:799px){
  .spk .mbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;align-items:center;gap:12px;background:var(--graphite);color:#fafaf9;padding:10px max(16px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));box-shadow:0 -8px 24px rgb(0 0 0 / .18)}
  .spk .mbar .v{min-width:0;display:grid;line-height:1.25}.spk .mbar small{font-size:11.5px;color:#b4b4b8;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
  .spk .mbar b{font-size:15px;font-weight:600;overflow-wrap:anywhere}.spk .mbar .btn{margin-left:auto;flex:none;--v4-focus:#fafaf9}
  .spk{padding-bottom:84px}}

/* integrácia do webu: spodná lišta kalkulačky na mobile nahrádza rýchle akcie webu (rovnaké miesto, rovnaké CTA „Zadať dopyt“) */
@media(max-width:799px){ body:has([data-spk]) .mdock{display:none} }
.spk .hero .crumbs a{color:inherit;text-underline-offset:4px}

@media(max-width:480px){.spk .pset>legend{padding:18px 16px 0}}


/* Nadpisy krokov kompletne vo vnútri kariet */
.spk .pset > legend.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.spk .pset > .step-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .1em;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--muted);
}

.spk .pset > .step-heading .n {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 24px;
  height: 24px;
  border: 1px solid var(--line-2);
  border-radius: 50%;
  font-size: 12px;
  letter-spacing: 0;
  color: var(--ink);
}

.spk .pset > .step-heading b {
  color: var(--ink);
  letter-spacing: .06em;
  font-weight: 600;
}
