/* Darmowe poradniki v32 — three guides as bands with interactive checklists (knowledge-v21.js: data-k-guide,
   data-k-checklist, first <output> in each guide). The 5-part bar follows the ticks with :has(), no extra JS. */

/* Opening visual: three guide covers and a progress strip. */
.kg-visual{display:grid;gap:clamp(22px,2.4vw,30px);padding-bottom:clamp(52px,5vw,72px)}
.kg-covers{position:relative;aspect-ratio:1.55;min-height:220px}
.kg-cover{position:absolute;top:8%;width:40%;height:84%;display:flex;flex-direction:column;padding:clamp(16px,1.8vw,24px);border:1px solid #15191c33;box-shadow:0 18px 40px #0000004d}
.kg-cover svg{width:clamp(48px,4.6vw,64px);height:auto;overflow:visible;margin-bottom:auto}
.kg-cover b{max-width:5.4em;font:700 clamp(18px,1.6vw,24px)/1.05 Sora,sans-serif;letter-spacing:-.05em;margin-bottom:6px}
.kg-cover span{font:600 13px/1.3 Figtree,sans-serif}
.kg-cover--paper{left:0;background:var(--paper);color:var(--ink);transform:rotate(-5deg)}
.kg-cover--amber{left:30%;top:2%;z-index:1;background:var(--amber);color:var(--ink);transform:rotate(-1deg)}
.kg-cover--dark{left:60%;top:10%;z-index:2;background:#2a3035;color:var(--paper);border-color:#ffffff2e;transform:rotate(4deg)}
.ds .kg-cover--paper svg .o,.ds .kg-cover--amber svg .o{stroke:#1e2921}
.ds .kg-cover--amber svg .f{fill:var(--paper)}
.kg-cover--paper span,.kg-cover--amber span{color:#4f564f}
.kg-cover--dark span{color:var(--muted-dark)}
.kg-v-check{display:flex;align-items:center;gap:6px;padding-top:18px;border-top:1px solid #ffffff24}
.kg-v-check i{width:clamp(28px,3vw,40px);height:8px;background:#ffffff26}
.kg-v-check i.is-on{background:var(--amber)}
.kg-v-check span{margin-left:12px;font:600 14px/1.2 Figtree,sans-serif;color:#d3d5cf}

/* Guide picker */
.kg-index .kg-pick{background:var(--paper);transition:border-color .2s,transform .2s}
.kg-index .kg-pick:hover{border-color:var(--ink);transform:translateY(-3px)}
.kg-pick>svg{display:block;width:72px;height:52px;overflow:visible;margin-bottom:22px}
.kg-pick .ds-tag{margin-bottom:6px}
.kg-pick>.ds-link{margin-top:auto;align-self:flex-start}
.kg-pick:hover .ds-link span{transform:translateY(3px)}

/* Guide: progress and tip on the left (sticky), checklist on the right. */
.kg-print-head{display:none}
.kg-body{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(40px,6vw,112px);align-items:start}
.kg-side{position:sticky;top:112px;display:grid;gap:20px}
.kg-progress{display:grid;gap:12px;padding:clamp(22px,2.4vw,30px);background:#171a21;color:var(--paper)}
.ds-dark .kg-progress{background:#1f2428;border:1px solid #ffffff1f}
.kg-progress>span:first-child{font:600 15px/1.3 Figtree,sans-serif;color:#c9cbc6}
.kg-progress output{font:700 clamp(30px,2.6vw,40px)/1 Sora,sans-serif;letter-spacing:-.05em;color:var(--amber)}
.kg-bar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-top:4px}
.kg-bar i{height:8px;background:#ffffff26;transition:background .25s}
.kg-guide:has(.kg-checklist li:nth-child(1) input:checked) .kg-bar i:nth-child(1),
.kg-guide:has(.kg-checklist li:nth-child(2) input:checked) .kg-bar i:nth-child(2),
.kg-guide:has(.kg-checklist li:nth-child(3) input:checked) .kg-bar i:nth-child(3),
.kg-guide:has(.kg-checklist li:nth-child(4) input:checked) .kg-bar i:nth-child(4),
.kg-guide:has(.kg-checklist li:nth-child(5) input:checked) .kg-bar i:nth-child(5){background:var(--amber)}
.kg-progress small{font-size:13.5px;line-height:1.45;color:#9da19b}
.kg-tip{padding:clamp(20px,2.2vw,28px);border-left:5px solid var(--amber);background:var(--white)}
.ds-white .kg-tip{background:var(--paper)}
.ds-dark .kg-tip{background:#1f2428}
.kg-tip b{display:block;font:600 clamp(18px,1.4vw,21px)/1.3 Figtree,sans-serif;letter-spacing:-.02em;margin-bottom:8px}
.kg-tip p{margin:0;font-size:16px;line-height:1.55;color:#4f564f}
.ds-dark .kg-tip p{color:var(--muted-dark)}

.kg-checklist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.ds-dark .kg-checklist{border-color:var(--line-dark)}
.kg-checklist li{border-bottom:1px solid var(--line)}
.ds-dark .kg-checklist li{border-color:var(--line-dark)}
.kg-checklist label{display:grid;grid-template-columns:32px minmax(0,1fr);column-gap:clamp(16px,1.8vw,24px);padding:clamp(20px,2vw,26px) 0;cursor:pointer}
.ds .kg-checklist input{-webkit-appearance:none;appearance:none;display:block;width:32px;height:32px;margin:0;border:2px solid var(--ink);border-radius:0;background:var(--white) center/20px no-repeat;cursor:pointer;transition:background-color .2s,border-color .2s}
.ds .ds-dark .kg-checklist input{border-color:var(--paper);background-color:transparent}
.ds .kg-checklist input:checked{border-color:var(--amber);background-color:var(--amber);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10.5 4 4 8-9' fill='none' stroke='%2315191c' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.ds .kg-checklist input:focus-visible{outline:3px solid #bf8600;outline-offset:4px}
.kg-checklist label:hover input:not(:checked){border-color:var(--gold)}
.ds-dark .kg-checklist label:hover input:not(:checked){border-color:var(--amber)}
.kg-checklist strong{display:block;font:600 clamp(19px,1.5vw,23px)/1.25 Figtree,sans-serif;letter-spacing:-.025em;margin:3px 0 7px;transition:color .2s}
.kg-checklist small{display:block;font-size:clamp(15.5px,1.15vw,17px);line-height:1.55;color:#5d645b}
.ds-dark .kg-checklist small{color:var(--muted-dark)}
.kg-checklist li:has(input:checked) strong{color:#6b706a}
.ds-dark .kg-checklist li:has(input:checked) strong{color:#9da19b}
.kg-main>.ds-button{margin-top:28px}
.v32-pdf[hidden]{display:none!important}

/* E-book (not available yet) */
.kg-ebook{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:24px;align-items:stretch}
.kg-book{position:relative;display:grid;place-items:center;margin:0;min-height:340px;padding:40px;background:#171a21;overflow:hidden;isolation:isolate}
.kg-book:after{content:"";position:absolute;z-index:-1;right:-60px;bottom:-40px;width:220px;height:220px;border:1px solid #ffffff22;border-radius:50%}
.kg-book-cover{position:relative;display:flex;flex-direction:column;width:min(210px,62%);aspect-ratio:.74;padding:22px 22px 18px 34px;background:#2a3035;color:var(--paper);box-shadow:0 22px 44px #00000066;transform:rotate(-4deg)}
.kg-book-cover:before{content:"";position:absolute;left:0;top:0;bottom:0;width:12px;background:var(--amber)}
.kg-book-cover span{font:600 13px/1.2 Figtree,sans-serif;color:var(--muted-dark)}
.kg-book-cover b{margin-top:auto;font:800 clamp(56px,5vw,76px)/.9 Sora,sans-serif;letter-spacing:-.05em;color:var(--amber)}
.kg-book-cover i{display:block;width:60%;height:3px;margin:14px 0 12px;background:#ffffff40}
.kg-book-cover small{font:800 12px/1 Sora,sans-serif;letter-spacing:-.02em;color:var(--paper)}
.kg-book-badge{position:absolute;top:28px;left:28px;padding:8px 12px;background:var(--amber);color:var(--ink);font:600 13px/1.2 Figtree,sans-serif}
.kg-ebook-box h3{margin-bottom:18px}
.kg-ebook-box .ds-ticks{grid-template-columns:1fr;margin-bottom:24px}
.kg-ebook-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:auto}
.kg-ebook-foot small{font-size:13.5px;color:#626960}

@media(max-width:1100px){
  .kg-cover b{font-size:clamp(18px,2.4vw,24px)}
}
@media(min-width:861px) and (max-width:1100px){
  .kg-index.ds-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:860px){
  .kg-body{grid-template-columns:1fr;gap:24px}
  .kg-side{display:contents}
  .kg-progress{order:1}
  .kg-main{order:2}
  .kg-tip{order:3}
  .kg-ebook{grid-template-columns:1fr}
  .kg-book{min-height:280px}
}
@media(max-width:600px){
  .kg-covers{min-height:0;aspect-ratio:1.3}
  .kg-cover{width:42%;padding:12px}
  .kg-cover--amber{left:29%}
  .kg-cover--dark{left:58%}
  .kg-cover b{font-size:16px}
  .kg-cover svg{width:40px}
  .kg-cover span{font-size:12px}
  .kg-v-check i{width:24px}
  .kg-checklist label{grid-template-columns:28px minmax(0,1fr)}
  .ds .kg-checklist input{width:28px;height:28px;background-size:18px}
}
@media(max-width:420px){
  .ds-open h1{font-size:min(52px,13.2vw)}
  .kg-cover{width:36%;padding:10px}
  .kg-cover--amber{left:32%}
  .kg-cover--dark{left:64%}
  .kg-cover b{font-size:13.5px;letter-spacing:-.04em}
  .kg-cover span{font-size:11px}
  .kg-cover svg{width:32px}
  .kg-v-check{gap:5px}
  .kg-v-check i{width:16px}
  .kg-v-check span{margin-left:8px;white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){.kg-index .kg-pick,.kg-bar i,.ds .kg-checklist input,.kg-checklist strong{transition:none}.kg-index .kg-pick:hover{transform:none}}

/* Print: only the guides, black on white, each guide on its own sheet. */
@media print{
  @page{margin:16mm 15mm}
  html,body.ds{background:#fff!important;color:#000!important}
  .ds main{padding-top:0!important}
  .site-header,.site-footer,.shell-map,.skip-link,.ds-open,#poradniki,#e-book,.ds-close,.kg-progress,.v32-pdf{display:none!important}
  .kg-guide{padding:0!important;background:#fff!important;color:#000!important}
  .kg-guide+.kg-guide{break-before:page;page-break-before:always}
  .kg-guide *{color:#000!important;background-color:transparent!important;box-shadow:none!important;text-shadow:none!important}
  .ds-wrap{width:auto!important}
  .kg-print-head{display:block!important;margin:0 0 10mm;padding-bottom:3mm;border-bottom:1px solid #000;font:600 9pt/1.3 Figtree,sans-serif}
  .kg-guide .ds-head{display:block;margin:0 0 6mm}
  .kg-guide .ds-head h2{font-size:24pt;line-height:1.08;letter-spacing:-.04em;margin:0 0 4mm}
  .kg-guide .ds-head h2 em{color:#000!important}
  .kg-guide .ds-head>div{max-width:none}
  .kg-guide .ds-head p{font-size:11pt;line-height:1.5}
  .kg-body{display:flex;flex-direction:column}
  .kg-side{display:contents}
  .kg-main{order:1}
  .kg-tip{order:2}
  .kg-checklist{border-top:1px solid #000!important}
  .kg-checklist li{border-bottom:1px solid #999!important;break-inside:avoid;page-break-inside:avoid}
  .kg-checklist label{grid-template-columns:7mm minmax(0,1fr);column-gap:5mm;padding:4mm 0}
  .ds .kg-guide .kg-checklist input{width:6mm;height:6mm;border:1.5px solid #000!important;background-color:#fff!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .ds .kg-guide .kg-checklist input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10.5 4 4 8-9' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important}
  .kg-checklist strong{font-size:12.5pt;margin:0 0 1.5mm}
  .kg-checklist small{font-size:10.5pt;line-height:1.45}
  .kg-tip{margin-top:6mm;padding:3mm 0 3mm 5mm;border-left:3px solid #000!important;break-inside:avoid;page-break-inside:avoid}
  .kg-tip b{font-size:11.5pt}
  .kg-tip p{font-size:10.5pt}
  .kg-guide a{text-decoration:none}
  .ds .kg-guide .kg-checklist input{outline:none!important}
}
/* V34 — page headings: same line count after the looser letter spacing (generated). */
@media(max-width:420px){html body.ds .ds-open h1{font-size:calc(min(52px,13.2vw) * .93)!important}}
