/* Rešitve in primer v stalnem zaporedju (predogled 13. 10. 2026). Gradi na žetonih iz stran.css. */
.kl main{padding-top:72px}
.kl .nav{color:var(--ink)}
.kl .nav::before{transform:none}
.kl .burger{background:var(--tint)}
.kl-sec{padding:clamp(64px,8vw,112px) 0}
.kl-sec + .kl-sec{border-top:1px solid var(--line)}
.kl-lab{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--grey);margin-bottom:14px}
.kl-lab i{width:7px;height:7px;border-radius:999px;background:var(--lime-deep)}
.kl h1{font-family:var(--serif);font-size:clamp(44px,6vw,80px);line-height:1;letter-spacing:-.02em;text-wrap:balance;max-width:16ch}
.kl h2{font-family:var(--serif);font-size:clamp(34px,4vw,52px);line-height:1.04;letter-spacing:-.015em;text-wrap:balance;max-width:20ch}
.kl h3{font-size:17px;font-weight:600;letter-spacing:-.01em}
.kl-lead{margin-top:20px;max-width:58ch;font-size:clamp(17px,1.4vw,19px);color:var(--ink-2)}
.kl-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px 64px;align-items:start}
.kl-head p{color:var(--ink-2);max-width:60ch}
.kl-head p + p{margin-top:12px}

/* številke na vrhu */
.kl-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:48px}
.kl-tile{display:flex;flex-direction:column;gap:6px;padding:22px 22px 20px;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--lift)}
.kl-tile b{font-family:var(--serif);font-weight:400;font-size:clamp(40px,4vw,56px);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kl-tile span{font-size:14px;color:var(--ink-2)}
.kl-tile small{margin-top:auto;padding-top:10px;font-family:var(--mono);font-size:11px;color:var(--grey-2)}
.kl-tile small.est{color:#9A4B10}

/* izziv */
.kl-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.kl-list li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;padding:14px 0;border-top:1px solid var(--line)}
.kl-list li:last-child{border-bottom:1px solid var(--line)}
.kl-list li::before{content:"";width:8px;height:8px;margin-top:8px;border-radius:2px;background:var(--ink)}
.kl-list.ok li::before{border-radius:999px;background:var(--lime-deep)}

/* rešitev: šest delov nad in pod produktom, en diagram */
.kl-map{margin-top:44px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.kl-node{display:flex;flex-direction:column;gap:8px;padding:22px;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--ring)}
.kl-node .kl-n{font-family:var(--mono);font-size:11px;color:var(--grey-2)}
.kl-node p{font-size:15px;color:var(--ink-2)}
.kl-node .kl-m{margin-top:auto;padding-top:8px;font-family:var(--mono);font-size:11.5px;color:var(--green)}
.kl-core{grid-column:1/-1;display:flex;align-items:center;gap:18px;padding:20px 26px;border-radius:var(--r-md);background:var(--ink);color:#fff;box-shadow:0 0 0 6px rgba(190,242,100,.32)}
.kl-core b{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.6vw,34px);line-height:1;white-space:nowrap}
.kl-core .kl-m{font-family:var(--mono);font-size:12px;color:rgba(255,255,255,.66);white-space:nowrap}
.kl-core .kl-ln{flex:1;height:0;border-top:1.5px dashed rgba(255,255,255,.28)}

/* pristop */
.kl-steps{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:s}
.kl-steps li{counter-increment:s;display:flex;flex-direction:column;gap:10px;padding:22px;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--ring)}
.kl-steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--mono);font-size:12px;color:var(--grey-2)}
.kl-steps p{font-size:15px;color:var(--ink-2)}
.kl-steps em{font-style:normal;margin-top:auto;padding-top:6px;font-size:13px;font-weight:500;color:var(--green)}

/* rezultati */
.kl-res{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:40px}
.kl-res > div{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:var(--r-md);background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--lime-deep),var(--lift)}
.kl-res b{font-family:var(--serif);font-weight:400;font-size:34px;line-height:1.05}
.kl-res p{font-size:15px;color:var(--ink-2)}

/* konec */
.kl-cta{display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px}
.kl-cta h2{max-width:22ch}
.kl-cta p{max-width:52ch;color:var(--ink-2)}
.kl-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:6px}

/* rešitve: en stalen blok na rešitev */
.kl-sol{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:32px 64px;align-items:start;padding:clamp(56px,7vw,96px) 0;border-top:1px solid var(--line)}
.kl-sol:first-of-type{border-top:0}
.kl-no{font-family:var(--mono);font-size:13px;color:var(--grey-2)}
.kl-sol h2{margin-top:8px}
.kl-prom{margin-top:12px;font-size:19px;font-weight:500;letter-spacing:-.01em;max-width:44ch}
.kl-par{margin-top:12px;color:var(--ink-2);max-width:60ch}
.kl-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 32px;margin-top:28px}
.kl-two h3{font-family:var(--mono);font-size:11.5px;font-weight:400;letter-spacing:.04em;color:var(--grey-2);margin-bottom:8px}
.kl-two ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;font-size:15px}
.kl-two li{display:grid;grid-template-columns:16px minmax(0,1fr);gap:8px}
.kl-two li::before{content:"";width:10px;height:10px;margin-top:6px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--lime-deep)}
.kl-two .use li::before{border-radius:2px;box-shadow:inset 0 0 0 1.5px var(--line-2)}
.kl-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:28px;padding-top:18px;border-top:1px solid var(--line);font-size:14px}
.kl-price{display:inline-flex;align-items:baseline;gap:6px}
.kl-price b{font-family:var(--serif);font-weight:400;font-size:26px}
.kl-slot{display:inline-block;padding:2px 10px;border-radius:6px;border:1.5px dashed #C9821F;background:#FFF6E8;color:#7A4A0B;font-family:var(--mono);font-size:12px}
.kl-src{font-size:13px;color:var(--grey)}
.kl-src a{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:3px}
.kl-src a:hover{text-decoration-color:var(--ink)}
.kl-shot{position:sticky;top:96px;border-radius:var(--r-lg);background:var(--tint);padding:24px;display:flex;flex-direction:column;gap:14px}
.kl-shot .pv{position:static;inset:auto;padding:0;opacity:1;transform:none}
.kl-shot .pv-k{display:none}
.kl-idx{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.kl-idx a{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border-radius:999px;background:var(--surface);box-shadow:var(--ring);font-size:14px}
.kl-idx a span{font-family:var(--mono);font-size:11px;color:var(--grey-2)}
.kl-idx a:hover{box-shadow:inset 0 0 0 1px var(--ink)}

.kl .foot{margin-top:0}

@media (max-width:1060px){
  .kl-head,.kl-sol{grid-template-columns:minmax(0,1fr)}
  .kl-shot{position:static}
  .kl-tiles,.kl-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kl-res{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kl-map{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kl-core{order:-1}
}
@media (max-width:720px){
  .wrap{padding:0 16px}
  .kl-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .kl-tile{padding:16px}
  .kl-res,.kl-steps,.kl-two{grid-template-columns:minmax(0,1fr)}
  .kl-map{grid-template-columns:minmax(0,1fr)}
  .kl-core{order:-1;flex-wrap:wrap;gap:4px 12px;padding:18px 20px}
  .kl-core .kl-ln{display:none}
  .kl-shot{padding:16px}
  .doc-sum{min-width:0;align-self:stretch}
}

/* kje v postopku: koraki vsakega sistema, AI ali človek */
.kl-flows{display:flex;flex-direction:column;gap:12px;margin-top:40px}
.kl-flow{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:16px 32px;align-items:start;padding:22px 24px;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--ring)}
.kl-fh{display:flex;flex-direction:column;gap:6px}
.kl-fh .kl-n{font-family:var(--mono);font-size:11px;color:var(--grey-2)}
.kl-fh p{font-size:14px;color:var(--grey)}
.kl-fs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.kl-fs li{display:flex;flex-direction:column;gap:3px;padding:9px 12px;border-radius:var(--r-sm);font-size:13.5px;line-height:1.35;background:var(--tint)}
.kl-who{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:var(--grey-2)}
.kl-fs li.ai{background:#F1F7E8;box-shadow:inset 0 0 0 1px rgba(159,212,63,.55)}
.kl-fs li.ai .kl-who{color:var(--green)}
.kl-fs li.clovek{background:var(--ink);color:#fff}
.kl-fs li.clovek .kl-who{color:var(--lime)}
.kl-fs li.izhod{background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--ink)}
@media (max-width:1060px){.kl-flow{grid-template-columns:minmax(0,1fr)}}
@media (max-width:720px){
  .kl-flow{padding:18px 16px}
  .kl-fs{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  }

/* sistemi kot spustni deli, v vsakem izvirni vizualni potek */
.kl-accs{display:flex;flex-direction:column;gap:10px;margin-top:40px}
.kl-acc{border-radius:var(--r-md);background:var(--surface);box-shadow:var(--ring)}
.kl-acc > summary{list-style:none;display:grid;grid-template-columns:36px minmax(0,1fr) auto 28px;align-items:center;gap:16px;padding:20px 24px;cursor:pointer;border-radius:var(--r-md)}
.kl-acc > summary::-webkit-details-marker{display:none}
.kl-acc > summary:hover{background:var(--tint)}
.kl-acc[open] > summary:hover{background:none}
.kl-acc > summary:focus-visible{outline:2px solid var(--lime-deep);outline-offset:2px}
.kl-acc .kl-n{font-family:var(--mono);font-size:12px;color:var(--grey-2)}
.kl-at{display:flex;flex-direction:column;gap:2px}
.kl-at b{font-size:18px;font-weight:600;letter-spacing:-.01em}
.kl-at span{font-size:14px;color:var(--grey)}
.kl-am{font-family:var(--mono);font-size:12px;color:var(--green);white-space:nowrap}
.kl-chev{width:28px;height:28px;border-radius:999px;background:var(--tint);position:relative;transition:transform .3s var(--ease)}
.kl-chev::before{content:"";position:absolute;left:10px;top:9px;width:7px;height:7px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:rotate(45deg)}
.kl-acc[open] .kl-chev{transform:rotate(180deg)}
.kl-ab{padding:8px 24px 28px;border-top:1px solid var(--line);background:transparent}
.kl-ab.o-scope{background:transparent}

/* rezultati kot slike, ne ploščice */
.kl-viz{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:48px}
.kl-viz.two{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:40px}
.kl-v{display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:var(--r-md);background:var(--surface);box-shadow:var(--ring)}
.kl-v b{margin-top:10px;font-family:var(--serif);font-weight:400;font-size:clamp(34px,3vw,44px);line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.kl-v p{font-size:14px;color:var(--ink-2)}
.kl-vg{min-height:96px;display:grid;align-content:end}
.kl-dots{grid-template-columns:repeat(20,1fr);gap:3px}
.kl-dots i{aspect-ratio:1;border-radius:999px;background:var(--tint-2)}
.kl-dots i.on{background:var(--lime-deep)}
.kl-tests{grid-template-columns:repeat(12,1fr);gap:4px}
.kl-tests i{aspect-ratio:1;border-radius:3px;background:var(--lime-deep)}
.kl-news{grid-template-columns:repeat(12,1fr);gap:4px}
.kl-news i{height:28px;border-radius:4px;background:var(--tint-2)}
.kl-news i.on{background:var(--ink)}
.kl-camp{grid-template-columns:repeat(15,1fr);gap:3px}
.kl-camp i{height:16px;border-radius:3px;background:var(--lime-deep)}
.kl-link{grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:10px}
.kl-link .u{font-family:var(--mono);font-size:12px;padding:6px 10px;border-radius:999px;background:var(--tint)}
.kl-link .ar{color:var(--grey-2)}
.kl-link .app{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:8px;border-radius:12px;background:var(--ink)}
.kl-link .app i{font-style:normal;font-size:11.5px;padding:6px 8px;border-radius:7px;background:rgba(255,255,255,.1);color:#fff}
.kl-apps{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.kl-ui{display:flex;flex-direction:column;gap:5px;padding:10px;border-radius:12px;background:var(--tint);font-size:11.5px;min-width:0}
.kl-ui p{margin:0}
.kl-ui-h{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600}
.kl-ui-h i{width:8px;height:8px;border-radius:3px;background:var(--lime-deep)}
.kl-ui-t{display:flex;gap:4px;flex-wrap:wrap}
.kl-ui-t span{padding:2px 7px;border-radius:999px;color:var(--grey);background:var(--surface)}
.kl-ui-t span.on{background:var(--ink);color:#fff}
.kl-ui-r{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:6px 8px;border-radius:7px;background:var(--surface);box-shadow:var(--ring)}
.kl-ui-r span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.kl-ui-r em{font-style:normal;font-family:var(--mono);font-size:10px;color:#9A4B10;flex:none}
.kl-ui-r em.ok{color:var(--green)}
@media (max-width:1060px){.kl-viz{grid-template-columns:repeat(2,minmax(0,1fr))}.kl-am{display:none}.kl-acc > summary{grid-template-columns:30px minmax(0,1fr) 28px}}
@media (max-width:720px){
  .kl-viz,.kl-viz.two{grid-template-columns:minmax(0,1fr)}
  .kl-acc > summary{padding:16px;gap:12px}
  .kl-ab{padding:4px 12px 20px}
  .kl-link{grid-template-columns:minmax(0,1fr);justify-items:start}
  .kl-link .ar{transform:rotate(90deg)}
}
.kl-vc{margin-top:8px;font-family:var(--mono);font-size:11px;color:var(--grey-2)}
.kl-vc + b{margin-top:2px}
.kl-v .kl-ui p{font-size:11.5px;color:var(--ink)}
.kl-v .kl-ui p.kl-ui-h{font-size:12.5px}
.kl-viz:not(.two) .kl-v b{font-size:clamp(26px,2.2vw,32px);line-height:1.08}
@media (max-width:720px){.kl-apps{grid-template-columns:minmax(0,1fr)}}

/* rezultati: skupne vrstice čez vse kartice (slika, oznaka, naslov, besedilo) */
.kl-viz{grid-auto-rows:auto;row-gap:12px}
.kl-viz .kl-v{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0}
.kl-viz .kl-vg{height:96px;min-height:0;align-content:end;margin-bottom:14px}
.kl-viz .kl-vc{margin:0 0 6px;align-self:end}
.kl-viz .kl-v b{margin:0;align-self:start;padding-bottom:10px}
.kl-viz .kl-v p{align-self:start}
.kl-viz .kl-dots{grid-template-columns:repeat(34,1fr);gap:2px}
.kl-viz .kl-tests{grid-template-columns:repeat(16,1fr)}
.kl-viz .kl-camp{grid-template-columns:repeat(20,1fr)}
.kl-viz .kl-camp i{height:14px}
.kl-viz.two .kl-vg{height:auto}
.kl-viz.two .kl-v{grid-row:span 3}
@media (max-width:720px){.kl-viz .kl-v{grid-row:auto;grid-template-rows:none;display:flex}.kl-viz .kl-vg{height:auto}.kl-viz .kl-vc,.kl-viz .kl-v b,.kl-viz .kl-v p{align-self:flex-start}}

/* sistemi kot zavihki: seznam levo, potek desno */
.kl-tabs{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;margin-top:40px;align-items:start}
.kl-tl{position:sticky;top:96px;display:flex;flex-direction:column;gap:4px}
.kl-tb{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;width:100%;padding:12px 14px;border:0;border-radius:var(--r-sm);background:transparent;text-align:left;cursor:pointer;transition:background .2s var(--ease)}
.kl-tb:hover{background:var(--tint)}
.kl-tb[aria-selected="true"]{background:var(--ink);color:#fff}
.kl-tb:focus-visible{outline:2px solid var(--lime-deep);outline-offset:2px}
.kl-tb .kl-n{font-family:var(--mono);font-size:11px;color:var(--grey-2);padding-top:3px}
.kl-tb[aria-selected="true"] .kl-n{color:var(--lime)}
.kl-tt{display:flex;flex-direction:column;gap:2px;min-width:0}
.kl-tt b{font-size:15px;font-weight:600}
.kl-tt span{font-family:var(--mono);font-size:11px;color:var(--grey);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kl-tb[aria-selected="true"] .kl-tt span{color:rgba(255,255,255,.66)}
.kl-tp{min-width:0;border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--ring);padding:8px 24px 24px}
.kl-tpn.o-scope{background:transparent}
.kl-tpn:focus-visible{outline:2px solid var(--lime-deep);outline-offset:4px;border-radius:var(--r-md)}
.kl-tsub{margin:16px 0 0;font-size:15px;color:var(--ink-2)}
@media (max-width:1060px){
  .kl-tabs{grid-template-columns:minmax(0,1fr);gap:12px}
  .kl-tl{position:sticky;top:72px;z-index:2;flex-direction:row;overflow-x:auto;gap:6px;padding:8px 0;background:var(--bg);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .kl-tl::-webkit-scrollbar{display:none}
  .kl-tb{width:auto;flex:none;grid-template-columns:auto auto;align-items:center;padding:8px 14px;border-radius:999px;background:var(--surface);box-shadow:var(--ring)}
  .kl-tt span{display:none}
  .kl-tb .kl-n{padding:0}
}
@media (max-width:720px){.kl-tp{padding:4px 12px 16px}}
.kl-tpn > :nth-child(2){margin-top:20px !important}

/* V ozkem desnem polju zavihkov poteki vedno tečejo navpično (kot na ožjem zaslonu). */
.kl-tpn .o-trg{grid-template-columns:minmax(0,1fr) !important;row-gap:0 !important}
.kl-tpn .o-conv{display:none !important}
.kl-tpn .o-vseg{display:flex !important}
.kl-tpn .o-flow7,.kl-tpn .o-flow5{grid-template-columns:minmax(0,1fr) !important}
.kl-tpn .o-hline{display:none !important}
.kl-tpn .o-vline{display:block !important}
.kl-tpn .o-step{padding:0 0 26px 0 !important}
.kl-tpn .o-ind{padding-left:30px !important}
.kl-tpn .o-pb{min-height:0 !important}
.kl h1.kl-h1w{max-width:none}
@media (max-width:720px){.kl-br{display:none}}
.kl-viz.res{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:40px}
.kl-viz.res .kl-vg{height:auto;align-content:end}
.kl-viz.res .kl-ui p{align-self:stretch}
.kl-viz.res .kl-v b{font-size:clamp(22px,1.9vw,28px)}
.kl-viz.res .kl-ui{width:100%}
@media (max-width:1060px){.kl-viz.res{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.kl-viz.res{grid-template-columns:minmax(0,1fr)}.kl-viz.res .kl-vg{height:auto}}
.kl-tpn .o-trg-l{position:static !important}