/* sprawdziany-z-historii.pl — 29.10.2026. Pergamin, atrament, bordo i złoto. */
:root{--papier:#f6f0e4;--karta:#fffcf6;--atrament:#1e2433;--tekst:#2a2f3a;--szary:#5f6573;--wino:#8c2f39;--wino-c:#6e2029;--zloto:#b7832f;--zloto-j:#f3e4c4;--linia:#e3d7c1;--teal:#2f6f6a;--r:14px;--serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--tekst);font:17px/1.6 var(--sans)}
a{color:var(--wino)}a:hover{color:var(--wino-c)}
img{max-width:100%;height:auto}
h1,h2,h3{font-family:var(--serif);color:var(--atrament);line-height:1.2;font-weight:700}
h1{font-size:clamp(1.75rem,4.6vw,2.6rem);margin:.15em 0 .35em}
h2{font-size:clamp(1.3rem,3vw,1.65rem);margin:0 0 .6em}
.pomin{position:absolute;left:-9999px}.pomin:focus{left:12px;top:12px;z-index:9;background:#fff;padding:8px 12px}
/* nagłówek */
.naglowek{background:var(--atrament);color:#fff;border-bottom:4px solid var(--zloto)}
.naglowek__w{max-width:1120px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.logo:hover{color:#fff}
.logo__znak{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--wino);border:2px solid var(--zloto);font:700 1.25rem/1 var(--serif);color:#fff}
.logo__tekst{font:600 .95rem/1.1 var(--sans);letter-spacing:.02em;display:flex;flex-direction:column}
.logo__tekst b{font:700 1.2rem/1.1 var(--serif);color:var(--zloto-j)}
.menu{display:flex;gap:4px;flex-wrap:wrap}
.menu a{color:#fff;text-decoration:none;font-weight:600;font-size:.92rem;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.25)}
.menu a:hover,.menu a[aria-current]{background:var(--zloto);border-color:var(--zloto);color:var(--atrament)}
/* okruszki */
.okruszki{max-width:1120px;margin:0 auto;padding:10px 16px 0;font-size:.85rem;color:var(--szary)}
.okruszki ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px}
.okruszki li+li:before{content:"›";margin:0 6px 0 2px;color:var(--zloto)}
.okruszki a{color:var(--szary)}
main{max-width:1120px;margin:0 auto;padding:8px 16px 40px}
/* tytuł strony */
.tyt{padding:18px 0 6px;max-width:860px}
.tyt__nad{margin:0;font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--wino)}
.tyt__lead{font-size:1.06rem;color:var(--tekst);margin:0 0 12px}
.znaczki{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.znaczki li{background:var(--zloto-j);color:#5b3d0c;border-radius:999px;padding:4px 12px;font-size:.85rem;font-weight:600}
/* sekcje */
.sek{background:var(--karta);border:1px solid var(--linia);border-radius:var(--r);padding:22px clamp(16px,3vw,28px);margin:18px 0}
.sek__opis{color:var(--szary);margin-top:-.3em}
.przyp{font-size:.88rem;color:var(--szary);border-left:3px solid var(--zloto);padding-left:10px;margin-top:14px}
.zakres{padding-left:1.2em;margin:0}.zakres li{margin:.25em 0}
.zakres li::marker{color:var(--wino)}
/* karty produktów */
.siatka{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.prod{display:flex;gap:12px;background:#fff;border:1px solid var(--linia);border-radius:12px;padding:12px;border-top:4px solid var(--teal)}
.prod--sprawdzian{border-top-color:var(--wino)}.prod--kartkowka{border-top-color:var(--zloto)}.prod--zestaw{border-top-color:var(--atrament)}
.prod__okl{flex:0 0 96px}
.prod__okl img{display:block;width:96px;height:120px;object-fit:cover;border-radius:6px;border:1px solid var(--linia);background:var(--papier)}
.prod__t{display:flex;flex-direction:column;min-width:0;flex:1}
.prod__typ{margin:0;font-size:.72rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--szary)}
.prod--sprawdzian .prod__typ{color:var(--wino)}.prod--kartkowka .prod__typ{color:#8a5d14}.prod--karty .prod__typ{color:var(--teal)}
.prod__h{font:700 1.02rem/1.25 var(--serif);margin:.15em 0 .2em}
.prod__zak{font-size:.82rem;color:var(--szary);margin:0 0 8px;line-height:1.35}
.prod__akcje{margin-top:auto;display:flex;flex-direction:column;gap:6px}
.btn{display:block;text-align:center;text-decoration:none;font-weight:700;font-size:.86rem;padding:8px 10px;border-radius:9px;line-height:1.25}
.btn--free{background:var(--wino);color:#fff}.btn--free:hover{background:var(--wino-c);color:#fff}
.btn--free small{font-weight:600;opacity:.8}
.btn--kup{border:1.5px solid var(--atrament);color:var(--atrament);background:#fff}.btn--kup:hover{background:var(--atrament);color:#fff}
/* oś czasu */
.os{list-style:none;margin:0;padding:0 0 0 4px;border-left:3px solid var(--zloto)}
.os li{position:relative;display:grid;grid-template-columns:minmax(118px,auto) 1fr;gap:4px 14px;padding:7px 0 7px 18px}
.os li:before{content:"";position:absolute;left:-8.5px;top:15px;width:14px;height:14px;border-radius:50%;background:var(--wino);border:3px solid var(--karta)}
.os__rok{font:700 1rem/1.4 var(--serif);color:var(--wino);white-space:nowrap}
@media (max-width:520px){.os li{grid-template-columns:1fr}.os__rok{white-space:normal}}
/* pojęcia */
.pojecia{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;margin:0}
.pojecia div{background:var(--papier);border-radius:10px;padding:10px 12px}
.pojecia dt{font:700 1rem/1.3 var(--serif);color:var(--atrament)}
.pojecia dd{margin:2px 0 0;font-size:.93rem}
/* quiz i FAQ */
.quiz{padding-left:1.3em;margin:0}.quiz li{margin:.45em 0}.quiz li::marker{font-weight:700;color:var(--wino)}
.quiz summary,.faq summary{cursor:pointer;font-weight:600}
.quiz details p{margin:.3em 0 .2em;background:var(--zloto-j);border-radius:8px;padding:8px 12px}
.sek--quiz{border-color:var(--zloto);background:linear-gradient(180deg,#fffaf0,var(--karta))}
.faq{border-top:1px solid var(--linia);padding:10px 0}.faq:first-of-type{border-top:0}
.faq p{margin:.4em 0 0}
/* nawigacja między działami */
.sasiedzi{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:stretch;margin:22px 0}
.sasiedzi__a{display:flex;flex-direction:column;background:var(--karta);border:1px solid var(--linia);border-radius:12px;padding:10px 14px;text-decoration:none;font-weight:700;font-family:var(--serif)}
.sasiedzi__a small{font:600 .75rem var(--sans);color:var(--szary)}
.sasiedzi__a--n{text-align:right}
.sasiedzi__hub{align-self:center;font-weight:700;font-size:.9rem}
@media (max-width:640px){.sasiedzi{grid-template-columns:1fr}.sasiedzi__a--n{text-align:left}.sasiedzi__hub{order:3}}
/* hub klasy */
.dzialy{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.dzialy a{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;background:#fff;border:1px solid var(--linia);border-radius:12px;padding:10px 14px;text-decoration:none;color:var(--tekst)}
.dzialy a:hover{border-color:var(--wino);box-shadow:0 6px 18px rgba(30,36,51,.08)}
.dzialy__nr{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--atrament);color:var(--zloto-j);font:700 1.1rem var(--serif)}
.dzialy__t b{display:block;font:700 1.08rem/1.25 var(--serif);color:var(--atrament)}
.dzialy__t small{color:var(--szary);font-size:.86rem}
.dzialy__ile{font-size:.8rem;font-weight:700;color:var(--wino);white-space:nowrap}
@media (max-width:520px){.dzialy a{grid-template-columns:40px 1fr}.dzialy__ile{grid-column:2}}
.tematy{columns:2 240px;padding-left:1.2em}.tematy li{margin:.2em 0}
/* strona główna */
.hero{background:var(--atrament);color:#fff;margin:0 -16px;padding:26px 16px 30px;border-radius:0 0 22px 22px;background-image:radial-gradient(circle at 85% 10%,rgba(183,131,47,.35),transparent 45%)}
.hero__w{max-width:1088px;margin:0 auto}
.hero h1{color:#fff}.hero .tyt__nad{color:var(--zloto-j)}.hero .tyt__lead{color:#e9e4da;max-width:760px}
.klasy{list-style:none;padding:0;margin:18px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.klasy a{display:flex;flex-direction:column;height:100%;background:var(--karta);color:var(--tekst);text-decoration:none;border-radius:12px;padding:12px 14px;border-bottom:4px solid var(--zloto)}
.klasy a:hover{border-bottom-color:var(--wino);transform:translateY(-2px)}
.klasy b{font:700 1.3rem var(--serif);color:var(--atrament)}
.klasy small{color:var(--szary);font-size:.83rem;line-height:1.3;margin:2px 0 6px}
.klasy span{margin-top:auto;font-size:.8rem;font-weight:700;color:var(--wino)}
.popularne{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.popularne a{display:block;background:#fff;border:1px solid var(--linia);border-left:4px solid var(--wino);border-radius:10px;padding:9px 12px;text-decoration:none;font:700 1rem/1.3 var(--serif);color:var(--atrament)}
.popularne small{display:block;font:600 .75rem var(--sans);color:var(--szary);text-transform:uppercase;letter-spacing:.05em}
.kroki ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;counter-reset:k}
.kroki li{counter-increment:k;background:var(--papier);border-radius:12px;padding:12px 14px 12px 52px;position:relative}
.kroki li:before{content:counter(k);position:absolute;left:12px;top:12px;width:30px;height:30px;border-radius:50%;background:var(--wino);color:#fff;font:700 1rem/30px var(--serif);text-align:center}
.kroki b{display:block;font-family:var(--serif);color:var(--atrament)}
/* stopka */
.stopka{background:var(--atrament);color:#d9d4c8;font-size:.9rem;margin-top:30px}
.stopka__w{max-width:1120px;margin:0 auto;padding:20px 16px}
.stopka a{color:var(--zloto-j)}
.stopka__male{font-size:.8rem;opacity:.85}
/* zgoda */
.zgoda{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;max-width:560px;margin:0 auto;padding:14px 16px;border-radius:14px;background:#fff;color:#1d2530;box-shadow:0 8px 30px rgba(0,0,0,.18);font-size:14px;line-height:1.45}
.zgoda p{margin:0 0 10px}.zgoda__przyciski{display:flex;gap:8px;flex-wrap:wrap}
.zgoda button{font:inherit;font-weight:700;padding:9px 14px;border-radius:10px;border:2px solid currentColor;background:transparent;color:inherit;cursor:pointer}
.zgoda button[data-zgoda=tak]{background:var(--atrament);color:#fff;border-color:var(--atrament)}
@media print{.naglowek,.stopka,.zgoda,.sasiedzi,.prod__akcje{display:none}body{background:#fff}.sek{border:0}}
