/* sprawdziany-z-geografii.pl — motyw „mapa”: papier, ocean, warstwice */
:root{--papier:#f6f1e6;--karta:#fffdf8;--ink:#1d2a33;--ink2:#4a5a66;--ocean:#0f3b57;--ocean2:#1d5c82;--las:#2f6b45;--las-j:#e3efe1;
--piasek:#e9dfc9;--rdza:#c25a2a;--rdza-c:#a5481d;--linia:#d8ccb2;--r:14px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--ink);font:17px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
a{color:var(--ocean2)}
a:hover{color:var(--rdza)}
h1,h2,h3{font-family:Georgia,"Iowan Old Style","Palatino Linotype",serif;line-height:1.2;color:var(--ocean)}
h1{font-size:clamp(1.8rem,4.6vw,2.7rem);margin:.2em 0 .4em}
h2{font-size:clamp(1.3rem,3vw,1.7rem);margin:0 0 .6em}
h3{font-size:1.1rem}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px;z-index:9}
/* nagłówek z warstwicami */
.top{background:var(--ocean);color:#fff;
background-image:repeating-radial-gradient(circle at 85% -40%,transparent 0 22px,rgba(255,255,255,.07) 22px 23px);}
.top__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;padding-top:12px;padding-bottom:12px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.logo:hover{color:#fff}
.logo__znak{color:#f2c38b;display:flex}
.logo__txt{display:flex;flex-direction:column;line-height:1.15}
.logo__txt b{font-family:Georgia,serif;font-size:1.2rem}
.logo__txt small{opacity:.8;font-size:.8rem}
.nav{display:flex;flex-wrap:wrap;gap:6px}
.nav a{color:#fff;text-decoration:none;padding:6px 12px;border:1px solid rgba(255,255,255,.35);border-radius:999px;font-weight:600;font-size:.93rem}
.nav a:hover,.nav a[aria-current]{background:#f2c38b;color:var(--ocean);border-color:#f2c38b}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px;padding:12px 16px 0;margin:0;font-size:.88rem;color:var(--ink2)}
.crumbs li+li:before{content:"›";margin-right:4px;color:var(--linia)}
/* hero */
.hero{padding-top:22px;padding-bottom:10px}
.hero__kl{margin:0;text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:700;color:var(--las)}
.lead{font-size:1.1rem;max-width:62ch;color:var(--ink2)}
.hero__info{display:flex;flex-wrap:wrap;gap:8px}
.tag{display:inline-block;padding:4px 10px;border-radius:999px;background:var(--piasek);color:var(--ink);font-size:.82rem;font-weight:600;white-space:nowrap}
.tag--ok{background:var(--las-j);color:var(--las)}
.blok{padding-top:26px;padding-bottom:6px}
.maly{font-size:.92rem;color:var(--ink2)}
/* zakres i pojęcia */
.zakres{columns:2 320px;column-gap:28px;padding-left:0;list-style:none;margin:0}
.zakres li{break-inside:avoid;padding:6px 0 6px 26px;position:relative;border-bottom:1px dashed var(--linia)}
.zakres li:before{content:"";position:absolute;left:4px;top:.9em;width:10px;height:10px;border-radius:50%;border:2px solid var(--las)}
.pojecia{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin:0}
.pojecia div{background:var(--karta);border:1px solid var(--linia);border-left:5px solid var(--ocean2);border-radius:10px;padding:12px 14px}
.pojecia dt{font-weight:700;color:var(--ocean)}
.pojecia dd{margin:4px 0 0;color:var(--ink2);font-size:.96rem}
/* quiz */
.quiz details{background:var(--karta);border:1px solid var(--linia);border-radius:10px;margin-bottom:8px}
.quiz summary{cursor:pointer;padding:12px 14px;font-weight:600;list-style:none;display:flex;gap:10px;align-items:flex-start}
.quiz summary::-webkit-details-marker{display:none}
.quiz__nr{flex:none;width:26px;height:26px;border-radius:50%;background:var(--ocean);color:#fff;font-size:.85rem;display:grid;place-items:center}
.quiz details[open] summary{color:var(--ocean)}
.quiz details[open] .quiz__nr{background:var(--las)}
.quiz details p{margin:0;padding:0 14px 14px 50px;color:var(--ink)}
/* produkty */
.prods{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.prods--duze{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.prod{background:var(--karta);border:1px solid var(--linia);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.prod--duza{flex-direction:row}
.prod__img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;background:#fff;border-bottom:1px solid var(--linia)}
.prod--duza .prod__img{width:42%;max-width:190px;border-bottom:0;border-right:1px solid var(--linia);align-self:flex-start}
.prod__body{padding:12px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.prod__typ{margin:0;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:var(--rdza)}
.prod__typ--k{color:var(--las)}
.prod__nazwa{margin:0;font-size:1.02rem}
.prod__opis{margin:0;font-size:.9rem;color:var(--ink2)}
.prod__btn{margin-top:auto;display:flex;flex-direction:column;gap:6px;padding-top:6px}
.btn{display:block;text-align:center;text-decoration:none;font-weight:700;font-size:.9rem;padding:9px 12px;border-radius:10px}
.btn--free{background:var(--las);color:#fff}
.btn--free:hover{background:#245638;color:#fff}
.btn--shop{border:2px solid var(--rdza);color:var(--rdza-c)}
.btn--shop:hover{background:var(--rdza);color:#fff}
.btn s{opacity:.7;font-weight:400}
@media (max-width:520px){.prod--duza{flex-direction:column}.prod--duza .prod__img{width:100%;max-width:none;border-right:0;border-bottom:1px solid var(--linia)}}
/* ramka, faq, kafle */
.ramka{background:var(--piasek);border-radius:var(--r);padding:16px 18px}
.ramka h2{font-size:1.25rem}
.ramka p{margin:0}
.faq h3{margin:16px 0 4px}
.faq p{margin:0;color:var(--ink2)}
.kafle{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.kafle a{display:block;height:100%;background:var(--karta);border:1px solid var(--linia);border-radius:12px;padding:12px 14px;text-decoration:none;color:var(--ocean);font-weight:700}
.kafle a:hover{border-color:var(--ocean2);box-shadow:0 3px 0 var(--ocean2)}
.kafle span{display:block;font-size:.78rem;font-weight:600;color:var(--las);text-transform:uppercase;letter-spacing:.05em}
.lista-dz{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.lista-dz a{display:flex;align-items:center;gap:14px;background:var(--karta);border:1px solid var(--linia);border-radius:12px;padding:12px 14px;text-decoration:none;color:var(--ink)}
.lista-dz a:hover{border-color:var(--ocean2)}
.lista-dz__nr{flex:none;width:40px;height:40px;border-radius:50%;background:var(--ocean);color:#fff;font:700 1.1rem Georgia,serif;display:grid;place-items:center}
.lista-dz__txt{flex:1;display:flex;flex-direction:column}
.lista-dz__txt b{color:var(--ocean);font-size:1.05rem}
.lista-dz__txt small{color:var(--ink2)}
@media (max-width:560px){.lista-dz a{flex-wrap:wrap}.lista-dz .tag{margin-left:54px}}
.kroki{padding-left:22px}.kroki li{margin-bottom:6px}
.tekst{max-width:760px}
/* stopka */
.foot{margin-top:46px;background:#14303f;color:#d9e3e8;padding:26px 0 16px;font-size:.93rem}
.foot a{color:#f2c38b}
.foot__in{display:grid;grid-template-columns:2fr 1fr;gap:24px}
.foot__marka{font:700 1.1rem Georgia,serif;color:#fff;margin:0 0 6px}
.foot__tyt{font-weight:700;color:#fff;margin:0 0 6px}
.foot ul{list-style:none;padding:0;margin:0}
.foot__mini{opacity:.7;font-size:.82rem;margin-top:18px}
@media (max-width:700px){.foot__in{grid-template-columns:1fr}}
/* 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__btn{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(--ocean);color:#fff;border-color:var(--ocean)}
@media print{.top,.foot,.zgoda,.prods,.nav{display:none}.quiz details p{display:block}}