/* jaksiezylo.pl: wygląd strony w stylu PDF-u „Wielki Quiz PRL”.
   PT: papel creme, tinta escura, vermelho só como fundo. Corpo 19 a 20 px. */
@font-face{font-family:Anton;src:url('../fonts/Anton-Regular.woff2') format('woff2');font-display:swap}
@font-face{font-family:Oswald;src:url('../fonts/Oswald-wght.woff2') format('woff2');font-weight:200 700;font-display:swap}
@font-face{font-family:Poltawski;src:url('../fonts/PoltawskiNowy-wght.woff2') format('woff2');font-weight:400 700;font-display:swap}
@font-face{font-family:Poltawski;src:url('../fonts/PoltawskiNowy-Italic-wght.woff2') format('woff2');font-weight:400 700;font-style:italic;font-display:swap}
@font-face{font-family:'Courier Prime';src:url('../fonts/CourierPrime-Regular.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Courier Prime';src:url('../fonts/CourierPrime-Bold.woff2') format('woff2');font-weight:700;font-display:swap}

:root{--papier:#F3EAD6;--papier2:#E9DDC3;--tusz:#1B1712;--czerwien:#A61E22;--szary:#4F483D}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--papier);color:var(--tusz);font-family:Poltawski,Georgia,'Times New Roman',serif;font-size:20px;line-height:1.5}
img{max-width:100%;height:auto;display:block}
a{color:var(--tusz);text-decoration-thickness:2px;text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:4px solid var(--tusz);outline-offset:3px}
h1,h2,h3,p,ul,ol,figure{margin:0;padding:0}
.huelle{max-width:1080px;margin:0 auto;padding:0 20px}
.waska{max-width:760px}
.kicker{font-family:Oswald,sans-serif;font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:17px}

/* pasek u góry */
.pasek{border-bottom:2px solid var(--tusz);background:var(--papier)}
.pasek .huelle{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:14px;padding-bottom:12px}
.pasek .nazwa{font-family:Anton,sans-serif;font-size:24px;letter-spacing:.03em;text-transform:uppercase;text-decoration:none;line-height:1}
.pasek .kontakt{font-family:'Courier Prime',monospace;font-size:18px}

/* okładka */
.okladka{background:var(--czerwien);color:var(--papier);padding:18px}
.okladka a{color:var(--papier)}
.okladka .rama{border:5px solid var(--papier);padding:5px}
.okladka .rama2{border:1.5px solid var(--papier);padding:44px 28px 40px}
.okladka .siatka{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1.25fr .75fr;gap:44px;align-items:center}
.okladka h1{font-family:Anton,sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(76px,12.5vw,168px);line-height:.92;margin-top:22px}
.okladka .pod{font-family:Oswald,sans-serif;font-weight:500;text-transform:uppercase;letter-spacing:.04em;font-size:clamp(24px,3.2vw,34px);line-height:1.15;margin-top:22px}
.okladka .lead{font-size:22px;line-height:1.45;margin-top:22px;max-width:30em}
.okladka .tabl{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid var(--papier);margin-top:30px;max-width:560px}
.okladka .tabl div{padding:14px 8px 12px;text-align:center;border-right:2px solid var(--papier)}
.okladka .tabl div:last-child{border-right:0}
.okladka .tabl b{display:block;font-family:Anton,sans-serif;font-weight:400;font-size:46px;line-height:1}
.okladka .tabl span{font-family:Oswald,sans-serif;font-weight:500;text-transform:uppercase;letter-spacing:.08em;font-size:17px}
.okladka figure img{border:1.5px solid var(--papier);box-shadow:14px 14px 0 rgba(27,23,18,.35);transform:rotate(2deg)}

/* kasa */
.kasa{margin-top:30px}
.cena{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.cena b{font-family:Anton,sans-serif;font-weight:400;font-size:64px;line-height:1}
.cena span{font-family:Oswald,sans-serif;font-weight:500;font-size:19px;letter-spacing:.04em;text-transform:uppercase}
.knopf{display:inline-block;margin-top:16px;font-family:Oswald,sans-serif;font-weight:700;font-size:26px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;text-align:center;padding:18px 34px;min-height:64px;border:3px solid var(--tusz);background:var(--tusz);color:var(--papier);cursor:pointer}
.knopf:hover{background:#000}
.okladka .knopf{background:var(--papier);color:var(--tusz);border-color:var(--papier)}
.okladka .knopf:hover{background:#fff}
.okladka a.knopf{color:var(--tusz)}
.pod-knopf{font-size:18px;line-height:1.45;margin-top:14px;max-width:34em}
.komunikat{margin-top:16px;border:3px solid var(--tusz);background:var(--papier2);color:var(--tusz);padding:14px 18px;font-size:19px;max-width:34em}
.komunikat[hidden]{display:none}

/* sekcje */
section{padding:64px 0}
section.ciemniejsza{background:var(--papier2);border-top:2px solid var(--tusz);border-bottom:2px solid var(--tusz)}
.naglowek{border-top:7px solid var(--tusz);border-bottom:1.5px solid var(--tusz);padding:14px 0 10px;margin-bottom:30px;display:flex;align-items:baseline;gap:18px;flex-wrap:wrap}
.naglowek .nr{font-family:Anton,sans-serif;font-size:38px;line-height:1;color:var(--papier);background:var(--czerwien);padding:5px 13px 2px;min-width:52px;text-align:center}
.naglowek h2{font-family:Anton,sans-serif;font-weight:400;font-size:clamp(34px,5vw,46px);line-height:1.05;text-transform:uppercase;letter-spacing:.01em}
.naglowek .kicker{margin-left:auto;color:var(--szary)}
.lead{font-style:italic;font-size:23px;margin-bottom:26px;max-width:36em}

.lista{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 44px}
.lista li{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:18px 0;border-bottom:1.5px solid rgba(27,23,18,.5)}
.lista b.n{font-family:Anton,sans-serif;font-weight:400;font-size:40px;line-height:1;text-align:right}
.lista strong{display:block;font-weight:700}

.rundy{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:34px}
.runda{border:2px solid var(--tusz);background:var(--papier);padding:20px 22px 22px}
.runda .kicker{color:var(--szary)}
.runda h3{font-family:Anton,sans-serif;font-weight:400;text-transform:uppercase;font-size:32px;line-height:1.05;margin:6px 0 8px}
.runda p{font-size:19px}

.strony{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.strony figure a{display:block;border:2px solid var(--tusz);box-shadow:8px 8px 0 rgba(27,23,18,.18)}
.strony figcaption{font-family:'Courier Prime',monospace;font-size:18px;margin-top:14px;line-height:1.35}

.kroki{list-style:none;counter-reset:k;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.kroki li{counter-increment:k;border-top:7px solid var(--tusz);padding-top:14px}
.kroki li::before{content:counter(k);font-family:Anton,sans-serif;font-size:60px;line-height:1;display:block;margin-bottom:8px}
.kroki strong{display:block;font-family:Oswald,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:22px;margin-bottom:6px}

.kup{border:5px solid var(--tusz);padding:5px;background:var(--papier)}
.kup .w{border:1.5px solid var(--tusz);padding:34px 30px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.kup h3{font-family:Anton,sans-serif;font-weight:400;text-transform:uppercase;font-size:44px;line-height:1}
.kup ul{list-style:none;margin-top:16px}
.kup ul li{padding:7px 0 7px 30px;position:relative;border-bottom:1px solid rgba(27,23,18,.4)}
.kup ul li::before{content:'';position:absolute;left:2px;top:17px;width:14px;height:14px;background:var(--tusz)}
.kup .kasa{margin-top:0}

details{border-bottom:1.5px solid var(--tusz)}
details:first-of-type{border-top:1.5px solid var(--tusz)}
summary{cursor:pointer;font-weight:700;font-size:22px;padding:18px 44px 18px 0;list-style:none;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:'+';position:absolute;right:6px;top:8px;font-family:Anton,sans-serif;font-size:36px;transition:transform .15s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 0 20px;max-width:38em}
details p+p{margin-top:-6px}

/* stopka */
.stopka{background:var(--tusz);color:var(--papier);padding:40px 0 34px;font-size:18px}
.stopka a{color:var(--papier)}
.stopka ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px 30px;margin:16px 0}
.stopka .maly{font-family:'Courier Prime',monospace;font-size:18px;opacity:.9;margin-top:10px}

/* strony prawne */
.tekst{padding:48px 0 72px}
.tekst h1{font-family:Anton,sans-serif;font-weight:400;text-transform:uppercase;font-size:clamp(40px,7vw,60px);line-height:1.02;border-top:7px solid var(--tusz);border-bottom:1.5px solid var(--tusz);padding:16px 0 12px;margin-bottom:28px}
.tekst h2{font-family:Oswald,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:24px;margin:34px 0 10px}
.tekst p,.tekst ul,.tekst ol{margin-bottom:14px}
.tekst ul,.tekst ol{padding-left:28px}
.tekst li{margin-bottom:8px}
.tekst .stan{font-family:'Courier Prime',monospace;font-size:18px;color:var(--szary);margin-top:34px}
.ramka{border:2px solid var(--tusz);background:var(--papier2);padding:20px 24px;margin:20px 0}

@media (max-width:860px){
  body{font-size:19px}
  .okladka{padding:10px}
  .okladka .rama2{padding:28px 18px 30px}
  .okladka .siatka,.kup .w{grid-template-columns:1fr;gap:30px}
  .okladka figure{max-width:300px}
  .lista,.rundy,.kroki{grid-template-columns:1fr}
  .strony{grid-template-columns:1fr 1fr;gap:18px}
  .knopf{display:block;width:100%;padding:18px 14px;font-size:23px}
  .pasek .kontakt{display:none}
  section{padding:44px 0}
  .naglowek .kicker{margin-left:0;width:100%}
}
@media print{.knopf,.pasek nav{display:none}}