/* Ostoia — szablon wpisu „z agendą” (9.10.2026). Wspólny dla wszystkich klientów; barwy i czcionki klienta
   w templates/<klient>/kit/tokeny.css (doklejane NA KOŃCU, więc wygrywają z wartościami domyślnymi poniżej).
   HTML przerabia ~/ostoja/lib/wpis_kit.py, wysyła narzedzia/uklad-wpisow.py. Wszystko pod .wk-* — reszty strony nie dotyka.
   Wzór: ostoja-raporty/makieta-blog-2026-10-08. Struktura = rules/ZASADY-PISANIA.md §1 (lead, H2, FAQ jako H3, CTA). */
/* domyślne (neutralne) — klient nadpisuje w tokeny.css */
:root{--wk-akcent:#2F6F5E;--wk-akcent-j:#7FB8A4;--wk-akcent-c:#1F4F42;--wk-ciemny:#1B1F24;--wk-tlo2:#FAFAF7;--wk-tlo3:#F1F1EC;
  --wk-linia:#E1E1D8;--wk-tekst:#3C4148;--wk-naglowek:#15181C;--wk-przyg:#6A7078;--wk-fn:Georgia,serif;
  --wk-ft:system-ui,-apple-system,"Segoe UI",sans-serif;--wk-r:16px;--wk-karta:#FFFFFF;--wk-karta-linia:rgba(0,0,0,.12);--wk-gora:110px}
.wk-postep{position:fixed;left:0;top:0;height:3px;width:0;background:var(--wk-akcent-j);z-index:100000;pointer-events:none;transition:width .1s linear}
.wk-czas{white-space:nowrap}

/* ── układ: spis z boku + kolumna treści ── */
.wk-uklad{display:grid;grid-template-columns:230px minmax(0,720px);gap:56px;justify-content:center;align-items:start;
  max-width:1120px;margin:0 auto;padding:0 clamp(1.2rem,4vw,3rem)}
.wk-uklad>article{max-width:none;margin:0;padding:0;min-width:0}
/* podstawa kolumny — każdy kształt wpisu: article.art (VIAM) i article.viam-wpis-kolumna (szkielet automatu) */
.wk-uklad>article{font:400 17px/1.75 var(--wk-ft);color:var(--wk-tekst);counter-reset:wk-sekcja}
.wk-uklad>article p{color:var(--wk-tekst);margin:0 0 1.2rem}
.wk-uklad>article b,.wk-uklad>article strong{color:var(--wk-naglowek)}
.wk-uklad>article h2{font-family:var(--wk-fn);font-weight:500;color:var(--wk-naglowek);font-size:clamp(1.5rem,2.6vw,1.9rem);line-height:1.22;
  letter-spacing:-.01em;margin:3rem 0 1rem;counter-increment:wk-sekcja;scroll-margin-top:var(--wk-gora);position:relative;padding-top:30px}
.wk-uklad>article h2::before{content:counter(wk-sekcja,decimal-leading-zero);position:absolute;top:0;left:0;font:700 12.5px/1 var(--wk-ft);
  letter-spacing:.14em;color:var(--wk-akcent)}
.wk-uklad>article h2::after{content:"";position:absolute;top:6px;left:34px;width:48px;height:1px;background:var(--wk-akcent-j)}
.wk-uklad>article h3{font-family:var(--wk-fn);font-weight:500;color:var(--wk-naglowek);font-size:1.3rem;line-height:1.3;margin:2rem 0 .6rem}
.wk-uklad>article ul,.wk-uklad>article ol{margin:0 0 1.4rem;padding:0;list-style:none;color:var(--wk-tekst)}
.wk-uklad>article li{position:relative;padding-left:28px;margin-bottom:.6rem}
.wk-uklad>article ul li::before{content:"";position:absolute;left:4px;top:.72em;width:8px;height:8px;border-radius:50%;background:var(--wk-akcent)}
.wk-uklad>article ol{counter-reset:wk-li}.wk-uklad>article ol li{counter-increment:wk-li}
.wk-uklad>article ol li::before{content:counter(wk-li);position:absolute;left:0;top:.25em;width:22px;height:22px;border-radius:50%;
  background:var(--wk-ciemny);color:var(--wk-akcent-j);font:700 12px/22px var(--wk-ft);text-align:center}
.wk-uklad>article a{color:var(--wk-akcent-c);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--wk-akcent) 45%,transparent);
  text-decoration-thickness:1px;text-underline-offset:3px;transition:color .2s,text-decoration-color .2s}
.wk-uklad>article a:hover{color:var(--wk-akcent);text-decoration-color:currentColor}
.wk-uklad>article figure{margin:2.2rem 0}
.wk-uklad>article figure img{width:100%;height:auto;border-radius:var(--wk-r);display:block}
.wk-uklad>article figcaption{font-size:.86rem;color:var(--wk-przyg);margin-top:.7rem;font-style:italic}
.wk-uklad>article blockquote{margin:2rem 0;padding:4px 0 4px 26px;border-left:3px solid var(--wk-akcent);font:500 1.3rem/1.45 var(--wk-fn);color:var(--wk-naglowek)}
.wk-uklad>article table{width:100%;border-collapse:collapse;margin:1.8rem 0;font-size:.95rem;display:block;overflow-x:auto}
.wk-uklad>article th{text-align:left;background:var(--wk-ciemny);color:var(--wk-akcent-j);padding:11px 13px;font-weight:600}
.wk-uklad>article td{padding:11px 13px;border-bottom:1px solid var(--wk-linia)}

/* ── spis treści ── */
.wk-spis{position:sticky;top:var(--wk-gora);font:14.5px/1.35 var(--wk-ft);max-height:calc(100vh - 140px);overflow:auto}
.wk-spis>summary{list-style:none;margin:0 0 12px;font:700 12px/1 var(--wk-ft);letter-spacing:.12em;text-transform:uppercase;color:var(--wk-przyg);cursor:default}
.wk-spis>summary::-webkit-details-marker{display:none}
.wk-spis ol{list-style:none;margin:0;padding:0;border-left:2px solid var(--wk-linia)}
.wk-spis li{margin:0;padding:0}
.wk-spis li::before{display:none}
.wk-spis a{display:block;padding:7px 0 7px 16px;margin-left:-2px;border-left:2px solid transparent;text-decoration:none;color:var(--wk-przyg);
  transition:color .2s,border-color .2s}
.wk-spis a:hover{color:var(--wk-naglowek)}
.wk-spis a.akt{color:var(--wk-naglowek);border-left-color:var(--wk-akcent);font-weight:600}

/* ── w skrócie ── */
.wk-skrot{background:linear-gradient(180deg,var(--wk-tlo2),var(--wk-tlo3));border:1px solid var(--wk-linia);border-left:4px solid var(--wk-akcent);
  border-radius:14px;padding:18px 22px;margin:0 0 2.2rem}
.wk-skrot b{display:block;font:700 12px/1 var(--wk-ft);letter-spacing:.12em;text-transform:uppercase;color:var(--wk-akcent-c);margin-bottom:10px}
.wk-uklad>article .wk-skrot p{margin:0;font-size:1.08rem;line-height:1.6;color:var(--wk-naglowek)}

/* ── FAQ ── */
details.wk-faq{border:1px solid var(--wk-linia);border-radius:14px;background:var(--wk-tlo2);margin:0 0 12px;overflow:hidden}
details.wk-faq>summary{cursor:pointer;list-style:none;padding:17px 56px 17px 20px;font:500 1.12rem/1.35 var(--wk-fn);color:var(--wk-naglowek);position:relative}
details.wk-faq>summary::-webkit-details-marker{display:none}
details.wk-faq>summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;
  background:var(--wk-tlo3);display:grid;place-items:center;font:600 19px/1 var(--wk-ft);color:var(--wk-akcent-c);transition:.25s}
details.wk-faq[open]>summary::after{content:"–";background:var(--wk-akcent);color:#fff}
details.wk-faq[open]{border-color:var(--wk-akcent-j)}
details.wk-faq .wk-odp{padding:0 20px 4px}

/* ── autor i „Zobacz też” na końcu ── */
.wk-autor{margin-top:3rem}
.wk-autor .autor-wpisu{margin:0!important;background:var(--wk-tlo2);border-color:var(--wk-linia)!important}
.wk-uklad .viam-dolink{margin:1.6rem 0 0;padding:1.1rem 1.3rem;border:1px solid var(--wk-linia);border-radius:14px;background:#fff;
  font-size:.95rem;line-height:1.7;color:var(--wk-przyg)}
.wk-uklad .viam-dolink strong{display:block;font:700 12px/1 var(--wk-ft);letter-spacing:.12em;text-transform:uppercase;color:var(--wk-akcent-c);margin-bottom:.6rem}

/* ── czytaj dalej ── */
.wk-podobne{background:var(--wk-tlo3);padding:64px 0}
.wk-podobne-in{max-width:1180px;margin:0 auto;padding:0 clamp(1.2rem,4vw,3rem)}
.wk-podobne h2{font:500 clamp(1.7rem,3vw,2.2rem)/1.2 var(--wk-fn);color:var(--wk-naglowek);margin:0 0 28px}
.wk-siatka{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}
.wk-siatka .bcard{display:flex;flex-direction:column;border:1px solid var(--wk-karta-linia);border-radius:calc(var(--wk-r) + 10px);overflow:hidden;background:var(--wk-karta);
  color:inherit;text-decoration:none;transition:transform .4s cubic-bezier(.16,1,.3,1),border-color .4s,box-shadow .4s}
.wk-siatka .bcard:hover{transform:translateY(-6px);border-color:var(--wk-akcent-c);box-shadow:0 34px 68px -40px rgba(0,0,0,.5)}
.wk-siatka .bcard .ph{position:relative;aspect-ratio:16/10;overflow:hidden}
.wk-siatka .bcard .ph img{width:100%;height:100%;object-fit:cover;display:block}
.wk-siatka .bcard .pb{position:absolute;top:.9rem;left:.9rem;background:color-mix(in srgb,var(--wk-ciemny) 78%,transparent);color:#fff;
  border:1px solid color-mix(in srgb,var(--wk-akcent-j) 40%,transparent);border-radius:99px;padding:.28rem .8rem;font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.wk-siatka .bcard .bd{display:flex;flex-direction:column;gap:.6rem;padding:1.5rem 1.5rem 1.7rem;flex:1}
.wk-siatka .bcard .date{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--wk-akcent-c)}
.wk-siatka .bcard h3{font:500 1.25rem/1.25 var(--wk-fn);color:var(--wk-naglowek);margin:0}
.wk-siatka .bcard p{font-size:.94rem;line-height:1.6;color:var(--wk-przyg);flex:1;margin:0}
.wk-siatka .bcard .go{font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--wk-akcent-c)}

/* ── węższe ekrany: spis nad tekstem, zwijany ── */
@media(max-width:1100px){
  .wk-uklad{grid-template-columns:minmax(0,720px);gap:0}
  .wk-spis{position:static;max-height:none;margin:0 0 2rem;border:1px solid var(--wk-linia);border-radius:14px;background:var(--wk-tlo2);padding:14px 18px}
  .wk-spis>summary{margin:0;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
  .wk-spis>summary::after{content:"+";font:600 18px/1 var(--wk-ft);color:var(--wk-akcent-c)}
  .wk-spis[open]>summary::after{content:"–"}
  .wk-spis[open]>summary{margin-bottom:12px}
  .wk-siatka{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .wk-uklad>article{font-size:16.5px}
  .wk-siatka{grid-template-columns:1fr}
  .wk-podobne{padding:48px 0}
}

/* VIAM — barwy i czcionki dla szablonu wpisu (templates/_wspolny/kit/wpis-kit.css). 9.10.2026 */
:root{--wk-akcent:#A8803F;--wk-akcent-j:#C9A86E;--wk-akcent-c:#7E5A22;--wk-ciemny:#1A1714;--wk-tlo2:#FBF8F1;--wk-tlo3:#F0EBE0;
  --wk-linia:#E2D8C2;--wk-tekst:#5E5347;--wk-naglowek:#1A1714;--wk-przyg:#6B6055;--wk-fn:Fraunces,Georgia,serif;
  --wk-ft:"Hanken Grotesk",system-ui,sans-serif;--wk-r:18px;--wk-karta:#FFFDF8;--wk-karta-linia:rgba(168,128,63,.34);--wk-gora:110px}