/* ═══════════════════════════════════════════════════════════════════════
   poradnik.css — jeden układ dla wszystkich poradników (v9, 5.10.2026)

   Strony generuje `narzedzia/poradniki.py` ze źródeł w `poradniki/*.txt`.
   Rozmiary pisma TYLKO ze skali w paleta.css (test-skala.mjs), kolory
   TYLKO z tokenów. Kolumna tekstu ~68 znaków — długość wiersza, przy
   której długi tekst czyta się bez gubienia początku linii.
   ═══════════════════════════════════════════════════════════════════════ */
/* podstawa strony: poradniki nie wczytują kalkulator.css ani arkusza
   strony głównej, więc krój i tło muszą być ustawione tutaj */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--t1);font-family:var(--f);font-size:var(--fs-3);
  line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img,svg{max-width:100%}
:focus-visible{outline:2px solid var(--gold-d);outline-offset:3px}

.pr-glowa{background:var(--paper);border-bottom:1px solid var(--line);padding:clamp(32px,5vw,64px) 0 clamp(28px,4vw,48px)}
.pr-w{max-width:1200px;margin:0 auto;padding-inline:clamp(20px,5vw,48px)}
.pr-okruchy{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:-12px 0 6px;padding:0;list-style:none;font-size:var(--fs-1);color:var(--t3)}
.pr-okruchy li+li::before{content:"/";margin-right:6px;color:var(--line2)}
.pr-okruchy a{display:inline-flex;align-items:center;min-height:44px;color:var(--t2);text-decoration:none}
.pr-okruchy a:hover{color:var(--gold-d)}
.pr-et{display:inline-flex;align-items:center;gap:.6rem;font-size:var(--fs-1);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-d)}
.pr-et::before{content:"";width:18px;height:1px;background:currentColor;opacity:.6}
.pr-glowa h1{margin:14px 0 0;max-width:22ch;font-family:var(--fd);font-weight:600;font-size:clamp(2.1rem,4.6vw,3.3rem);
  line-height:1.05;letter-spacing:-.04em;text-wrap:balance;color:var(--t1)}
.pr-glowa h1 em{font-style:normal;font-weight:500;color:var(--gold-m)}
.pr-lead{margin:18px 0 0;max-width:60ch;font-size:var(--fs-4);line-height:1.55;color:var(--t2);text-wrap:pretty}
.pr-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin:22px 0 0;font-size:var(--fs-1);color:var(--t3)}
.pr-meta b{color:var(--t1);font-weight:600}
.pr-meta a{color:var(--gold-d)}

.pr-uklad{display:grid;grid-template-columns:minmax(0,1fr) 16rem;gap:clamp(32px,5vw,72px);align-items:start;
  padding-block:clamp(32px,5vw,56px) clamp(56px,8vw,96px)}
@media(max-width:1000px){.pr-uklad{grid-template-columns:minmax(0,1fr)}.pr-bok{display:none}}

/* treść */
.pr-tresc{max-width:42rem;font-size:var(--fs-3);line-height:1.72;color:var(--t1)}
.pr-tresc>*:first-child{margin-top:0}
.pr-tresc h2{margin:2.6em 0 .7em;font-family:var(--fd);font-weight:600;font-size:clamp(1.55rem,2.6vw,2rem);
  line-height:1.15;letter-spacing:-.028em;text-wrap:balance;scroll-margin-top:96px}
.pr-tresc h3{margin:1.9em 0 .5em;font-family:var(--fd);font-weight:600;font-size:var(--fs-5);line-height:1.25;letter-spacing:-.02em;scroll-margin-top:96px}
.pr-tresc p{margin:0 0 1.05em;text-wrap:pretty}
.pr-tresc ul,.pr-tresc ol{margin:0 0 1.2em;padding-left:1.25em}
.pr-tresc li{margin-bottom:.5em;padding-left:.2em}
.pr-tresc li::marker{color:var(--gold-d)}
.pr-tresc strong,.pr-tresc b{font-weight:600}
.pr-tresc a{color:var(--gold-d);text-decoration:underline;text-decoration-color:rgba(127,97,48,.35);text-underline-offset:3px}
.pr-tresc a:hover{text-decoration-color:var(--gold-d)}
.pr-tresc .num,.pr-tresc td{font-variant-numeric:tabular-nums}

/* „W skrócie" — odpowiedź z liczbą na samym początku (format cytowany
   przez wyniki AI w Google) */
.pr-skrot{margin:0 0 2.2em;padding:22px 24px;border-radius:16px;background:var(--white);border:1px solid var(--line);
  box-shadow:0 1px 2px rgba(35,32,27,.05),0 14px 32px -24px rgba(35,32,27,.3)}
.pr-skrot>b:first-child{display:block;margin-bottom:8px;font-size:var(--fs-1);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-d)}
.pr-skrot p:last-child,.pr-skrot ul:last-child{margin-bottom:0}

.pr-uwaga{margin:1.6em 0;padding:16px 20px;border-left:3px solid var(--gold);background:rgba(201,162,78,.08);border-radius:0 12px 12px 0;font-size:var(--fs-2)}
.pr-uwaga p:last-child{margin-bottom:0}
.pr-wzor{margin:1.4em 0;padding:16px 20px;border-radius:12px;background:var(--ink);color:var(--paper);font-size:var(--fs-2);line-height:1.6}
.pr-wzor b{color:var(--gold-l);font-weight:600}

/* tabele: przewijane w bok tylko wewnątrz własnej ramki */
.pr-tab{margin:1.4em 0 1.8em;overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--white)}
.pr-tab table{width:100%;border-collapse:collapse;font-size:var(--fs-2)}
.pr-tab caption{caption-side:bottom;padding:10px 14px;text-align:left;font-size:var(--fs-1);color:var(--t3)}
.pr-tab th,.pr-tab td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.pr-tab th{font-weight:600;color:var(--t2);background:var(--paper)}
.pr-tab tr:last-child td{border-bottom:0}
.pr-tab td.pr-l,.pr-tab th.pr-l{text-align:right}
.pr-tab td.pr-l{white-space:nowrap}
.pr-tab th{line-height:1.3}

/* narzędzie w treści */
.pr-narz{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;align-items:center;margin:1.8em 0;padding:20px 22px;
  border-radius:16px;background:var(--ink);color:var(--paper);text-decoration:none}
.pr-narz .ik{grid-row:1 / span 2;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(201,162,78,.18);color:var(--gold-l)}
.pr-narz b{font-family:var(--fd);font-weight:600;font-size:var(--fs-4);letter-spacing:-.015em}
.pr-narz span{font-size:var(--fs-2);color:rgba(246,242,233,.75)}
.pr-tresc a.pr-narz{text-decoration:none;color:var(--paper)}
.pr-narz:hover b{color:var(--gold-l)}

/* pytania */
.pr-faq{margin:1em 0 0;border-top:1px solid var(--line2)}
.pr-faq details{border-bottom:1px solid var(--line2)}
.pr-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;
  min-height:44px;padding:16px 0;font-family:var(--fd);font-weight:600;font-size:var(--fs-4);letter-spacing:-.015em}
.pr-faq summary::-webkit-details-marker{display:none}
.pr-faq summary::after{content:"+";flex:0 0 auto;width:26px;height:26px;border-radius:50%;border:1px solid var(--line2);
  display:grid;place-items:center;font-weight:500;transition:transform .25s}
.pr-faq details[open] summary::after{transform:rotate(45deg)}
.pr-faq details>div{padding:0 0 16px;color:var(--t2)}

/* autor pod tekstem */
.pr-autor{display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:start;margin:3em 0 0;padding:22px;
  border-radius:16px;background:var(--white);border:1px solid var(--line)}
.pr-autor .zn{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--gold-l);
  font-family:var(--fd);font-weight:600;font-size:var(--fs-4)}
.pr-autor b{display:block;font-weight:600}
.pr-autor p{margin:4px 0 0;font-size:var(--fs-2);color:var(--t2);line-height:1.6}

/* boczny spis treści */
.pr-bok{position:sticky;top:96px;font-size:var(--fs-1)}
.pr-bok b{display:block;margin-bottom:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--t3)}
.pr-bok ol{margin:0;padding:0;list-style:none;border-left:1px solid var(--line2)}
.pr-bok a{display:block;padding:7px 0 7px 14px;margin-left:-1px;border-left:2px solid transparent;color:var(--t2);text-decoration:none;line-height:1.4}
.pr-bok a:hover{color:var(--t1)}
.pr-bok a[aria-current=true]{color:var(--t1);border-left-color:var(--gold);font-weight:500}
.pr-bok .pr-cta{display:flex;justify-content:center;align-items:center;min-height:44px;margin-top:22px;padding:0 16px;border-radius:999px;
  background:var(--gold);color:var(--t1);font-weight:600;text-decoration:none;border:0}

/* spis na telefonie (nad treścią) */
.pr-spis{display:none;margin:0 0 2em;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--white)}
.pr-spis summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600}
.pr-spis ol{margin:6px 0 0;padding-left:1.2em}
.pr-spis a{display:flex;align-items:center;min-height:44px;padding:4px 0;color:var(--t2);text-decoration:none}
@media(max-width:1000px){.pr-spis{display:block}}

/* powiązane */
.pr-pow{margin:3em 0 0}
.pr-pow h2{margin-top:0}
.pr-pow ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.pr-pow a{display:block;height:100%;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--white);
  color:var(--t1);text-decoration:none;font-weight:600}
.pr-pow a span{display:block;margin-top:4px;font-size:var(--fs-1);font-weight:400;color:var(--t2)}
.pr-pow a:hover{border-color:var(--gold)}
@media(max-width:600px){.pr-pow ul{grid-template-columns:1fr}}
.pr-tresc .pr-pow a{text-decoration:none}

@media print{.pr-bok,.pr-spis{display:none}.pr-uklad{display:block}}

.pomin-pr{position:absolute;left:-9999px;top:8px;z-index:99;padding:10px 16px;border-radius:10px;background:var(--ink);color:var(--paper)}
.pomin-pr:focus{left:8px}

/* lista poradników */
.pr-lista{padding-block:clamp(32px,5vw,56px) clamp(56px,8vw,96px)}
.pr-lista ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.pr-lista a{display:grid;gap:8px;height:100%;padding:24px;border:1px solid var(--line);border-radius:16px;background:var(--white);
  color:var(--t1);text-decoration:none;transition:border-color .2s,transform .32s cubic-bezier(.16,1,.3,1)}
.pr-lista a:hover{border-color:var(--gold);transform:translateY(-2px)}
.pr-lista b{font-family:var(--fd);font-weight:600;font-size:var(--fs-5);line-height:1.2;letter-spacing:-.02em}
.pr-lista span:not(.pr-et){font-size:var(--fs-2);color:var(--t2);line-height:1.55}
.pr-lista i{font-style:normal;font-size:var(--fs-1);color:var(--t3)}
@media(max-width:760px){.pr-lista ul{grid-template-columns:1fr}}
