/* dolacz.polskaspoldzielniaenergetyczna.pl - page styles.
   Tokens: paper, white cards with a thin border, navy text, brand greens. */

@font-face{font-family:"Plus Jakarta Sans";src:url(/assets/fonty/PlusJakartaSans-Medium.woff2) format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Plus Jakarta Sans";src:url(/assets/fonty/PlusJakartaSans-SemiBold.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Plus Jakarta Sans";src:url(/assets/fonty/PlusJakartaSans-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Plus Jakarta Sans";src:url(/assets/fonty/PlusJakartaSans-ExtraBold.woff2) format("woff2");font-weight:800;font-style:normal;font-display:swap}
/* Metric-matched fallback, so the swap to the web font does not reflow the text. */
@font-face{font-family:"PJS zapas";src:local("Arial"),local("Helvetica"),local("Roboto");size-adjust:104%;ascent-override:100%;descent-override:26%;line-gap-override:0%}

:root{
  color-scheme:light;
  --papier:#F7F5EF;
  --karta:#FFFFFF;
  --linia:#E6E1D6;
  --linia-mocna:#8E8676;
  --tekst:#0F263D;
  --tekst-2:#4A5866;
  --granat:#003366;
  --zielen:#056B49;
  --przycisk:#07885D;
  --przycisk-h:#056B49;
  --mieta:#E2F3ED;
  --mieta-jasna:#F2F8F4;
  --blad:#B42318;
  --szer:37.5rem;
  --sans:"Plus Jakarta Sans","PJS zapas",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --serif:"Iowan Old Style","Charter","Georgia","Cambria","Noto Serif",serif;
  --naglowki:var(--serif);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:1rem}
body{margin:0;background:var(--papier);color:var(--tekst);font-family:var(--sans);font-weight:500;font-size:1.0625rem;line-height:1.62;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
img,svg{display:block;max-width:100%}
p,ul,ol,dl,figure,h1,h2,h3{margin:0}
a{color:var(--zielen);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
strong{font-weight:700}
:focus-visible{outline:3px solid var(--granat);outline-offset:2px;border-radius:4px}
[hidden]{display:none!important}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.kolumna{max-width:calc(var(--szer) + 32px);margin:0 auto;padding:0 16px}

/* Skip link */
.pomin{position:absolute;left:16px;top:-100px;background:var(--karta);color:var(--tekst);padding:.6rem 1rem;border:1px solid var(--linia);border-radius:8px;z-index:20}
.pomin:focus{top:12px}

/* Masthead */
.naglowek{border-bottom:1px solid var(--granat)}
.naglowek-w{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px}
.logo{width:150px;height:auto;aspect-ratio:401/100}
.naglowek-tel{font-size:.9375rem;font-weight:600;color:var(--tekst);text-decoration:none;white-space:nowrap;padding:.7rem 0;min-height:44px;display:inline-flex;align-items:center;gap:.3em}
.naglowek-tel:hover{color:var(--zielen);text-decoration:underline}
.naglowek-tel-et{color:var(--tekst-2);font-weight:500}
@media (max-width:359px){.naglowek-tel-et{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}

/* Hero */
.hero{padding:2rem 0 2.25rem}
.rodzaj{font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--zielen)}
.miejsce{margin-top:.35rem;font-size:.9375rem;color:var(--tekst-2);line-height:1.45}
.h1{margin-top:1rem;font-family:var(--naglowki);font-weight:700;font-size:2.0625rem;line-height:1.14;letter-spacing:-.01em;color:var(--tekst);text-wrap:balance}
.podtytul{margin-top:.75rem;font-size:1.1875rem;font-weight:600;line-height:1.45;color:var(--tekst)}
.podtytul-info{font-size:1.0625rem;font-weight:500;color:var(--tekst)}
.dookreslenie{margin-top:.9rem;padding:.6rem .85rem;background:var(--karta);border:1px solid var(--linia);border-left:3px solid var(--granat);border-radius:6px;font-size:.9375rem;line-height:1.5}
.lead{margin-top:1rem;font-size:1.0625rem;color:var(--tekst-2);line-height:1.62}
.hero .kwalifikator{margin-top:.6rem}
.status{margin-top:1.1rem;display:flex;align-items:center;gap:.55rem;font-size:.9375rem;font-weight:700;color:var(--tekst)}
.kropka{width:.625rem;height:.625rem;border-radius:50%;background:var(--przycisk);box-shadow:0 0 0 4px var(--mieta);flex:none}
.akcje{margin-top:1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem}

/* Buttons and links */
.przycisk{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:.7rem 1.4rem;border:0;border-radius:10px;background:var(--przycisk);color:#fff;font:700 1.1875rem/1.2 var(--sans);text-decoration:none;cursor:pointer;text-align:center}
.przycisk:hover{background:var(--przycisk-h);text-decoration:none}
.przycisk:active{transform:translateY(1px)}
.przycisk[disabled]{opacity:.7;cursor:progress}
.przycisk-pelny{width:100%}
.link-cichy{font-weight:600;padding:.6rem 0;min-height:44px;display:inline-flex;align-items:center}
.link-przycisk{background:none;border:0;padding:.5rem .25rem;min-height:44px;font:inherit;font-weight:600;color:var(--zielen);text-decoration:underline;text-underline-offset:.18em;cursor:pointer}

/* Cards */
.karta{background:var(--karta);border:1px solid var(--linia);border-radius:12px}

/* Local block: a small map beside the localities list (desktop), above it and centred (phones). */
.lokalne{padding-bottom:1rem;display:grid;gap:1.5rem}
.mapa{margin:0;padding:10px 10px 0;overflow:hidden;width:min(60vw,320px);justify-self:center}
.mapa-rysunek{position:relative}
.mapa-svg svg{width:100%;height:auto;max-height:24rem;margin:0 auto}
/* The map drawing is made for this small size: large dots, one seat label. */
.mapa-podpis{margin:0 -10px;padding:.6rem 12px;border-top:1px solid var(--linia);font-size:.8125rem;line-height:1.45;color:var(--tekst-2)}
.h3{font-family:var(--naglowki);font-weight:700;font-size:1.3125rem;line-height:1.25;color:var(--tekst)}
.miejscowosci-lista{margin-top:.6rem;line-height:1.75}
@media (min-width:600px){
  .mapa{width:40%}
  .lokalne:has(> .mapa):has(> .miejscowosci){grid-template-columns:minmax(0,2fr) minmax(0,3fr);column-gap:1.75rem;align-items:start}
  .lokalne:has(> .mapa):has(> .miejscowosci) .mapa{width:100%;justify-self:stretch}
}
.przypis{margin-top:.6rem;font-size:.875rem;line-height:1.55;color:var(--tekst-2)}

/* Numbered sections, like a leaflet */
article{counter-reset:sekcja}
.sekcja{counter-increment:sekcja;margin-top:2.25rem;padding-top:2rem;border-top:1px solid var(--linia);position:relative}
.sekcja>p+p,.sekcja>p+ul,.sekcja>ul+p,.sekcja>ol+p,.sekcja>p+ol{margin-top:.9rem}
.h2{display:flex;align-items:flex-start;gap:.8rem;margin-bottom:1rem;font-family:var(--naglowki);font-weight:700;font-size:1.5rem;line-height:1.22;color:var(--tekst);text-wrap:balance}
.h2:focus{outline:none}
.h2:focus-visible{outline:3px solid var(--granat)}
.nr{flex:none;display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin-top:-.05rem;border:1.5px solid var(--granat);border-radius:50%;font:700 .9375rem/1 var(--sans);color:var(--granat)}
.nr::before{content:counter(sekcja)}
@media (min-width:1000px){
  .sekcja .h2{position:relative}
  .sekcja .h2 .nr{position:absolute;left:-3.5rem;top:.05rem}
}
.uwaga{margin-top:.9rem;padding:.75rem .9rem;background:var(--karta);border:1px solid var(--linia);border-radius:8px;font-size:.9375rem;line-height:1.55;color:var(--tekst)}

.sasiedzi{margin-top:1.75rem;padding:1rem 1.1rem;background:var(--mieta-jasna);border:1px solid var(--linia);border-radius:12px}
.sasiedzi p{margin-top:.5rem}

.wartosci{list-style:none;padding:0;display:grid;gap:.95rem}
.wartosci li{display:grid;grid-template-columns:2.25rem 1fr;gap:.85rem;align-items:start}
.ikona{width:2.25rem;height:2.25rem;fill:none;stroke:var(--granat);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.kwalifikator{margin-top:1rem;font-size:.8125rem;line-height:1.55;color:var(--tekst-2)}

.kroki{padding-left:1.4rem;display:grid;gap:.55rem}
.kroki li::marker{font-weight:700;color:var(--granat)}

.faq{border-top:1px solid var(--linia)}
.faq details{border-bottom:1px solid var(--linia)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:52px;padding:.8rem 0;font-weight:700;line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:.7rem;height:.7rem;border-right:2px solid var(--granat);border-bottom:2px solid var(--granat);transform:rotate(45deg) translate(-2px,-2px)}
.faq details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.faq details p{padding:0 0 1rem;color:var(--tekst)}
.wiecej{margin-top:1.1rem}
.wiecej a{display:inline-flex;align-items:center;min-height:44px;font-weight:600}

/* Sign-up */
.zapis{padding-bottom:1rem}
.karta-zapis{padding:1.4rem 1.1rem 1.25rem}
.karta-zapis .h2{margin-bottom:.6rem}
.zapis .nr{position:static!important}
.zapis-wstep{color:var(--tekst)}
.nojs{margin-top:1rem;padding:.8rem;background:var(--mieta-jasna);border-radius:8px}
.formularz{margin-top:1.25rem;display:grid;gap:1.25rem}
fieldset{border:0;padding:0;margin:0;min-width:0}
.pytanie-tekst{padding:0;font-weight:700;line-height:1.45;margin-bottom:.75rem}
.odpowiedzi{display:grid;gap:.6rem}
.odp{position:relative;display:flex;align-items:center;gap:.8rem;min-height:56px;padding:.75rem 1rem;border:1.5px solid var(--linia-mocna);border-radius:10px;background:var(--karta);cursor:pointer;font-weight:600;line-height:1.35}
.odp input{flex:none;appearance:none;-webkit-appearance:none;margin:0;width:1.25rem;height:1.25rem;border:1.5px solid var(--linia-mocna);border-radius:50%;background:#fff;display:grid;place-content:center}
.odp input::before{content:"";width:.625rem;height:.625rem;border-radius:50%;transform:scale(0);background:var(--zielen)}
.odp input:checked{border-color:var(--zielen)}
.odp input:checked::before{transform:scale(1)}
.odp:has(input:checked){border-color:var(--zielen);background:var(--mieta-jasna)}
.odp:has(input:focus-visible){outline:3px solid var(--granat);outline-offset:2px}
.odp input:focus-visible{outline:none}
.odp-maly{min-height:48px;padding:.55rem .9rem;font-weight:500}
.wybor-rzad{display:grid;grid-template-columns:repeat(auto-fit,minmax(11.5rem,1fr));gap:.6rem}
.etykieta{display:block;font-weight:700;line-height:1.4;padding:0;margin-bottom:.35rem}
.pomoc{font-size:.875rem;line-height:1.5;color:var(--tekst-2);margin-bottom:.45rem}
.pole-we{display:block;width:100%;min-height:48px;padding:.6rem .8rem;border:1.5px solid var(--linia-mocna);border-radius:8px;background:#fff;color:var(--tekst);font:500 1.0625rem/1.3 var(--sans)}
select.pole-we{appearance:none;-webkit-appearance:none;padding-right:2.5rem;background-image:linear-gradient(45deg,transparent 50%,var(--granat) 50%),linear-gradient(135deg,var(--granat) 50%,transparent 50%);background-position:calc(100% - 1.15rem) 55%,calc(100% - .8rem) 55%;background-size:.36rem .36rem;background-repeat:no-repeat}
.pole-we::placeholder{color:#6B7580}
.pole-we:focus-visible{outline:3px solid var(--granat);outline-offset:1px;border-color:var(--granat)}
.pole-we[aria-invalid=true]{border-color:var(--blad)}
.blad{margin-top:.4rem;font-size:.9375rem;font-weight:600;color:var(--blad);line-height:1.45}
.baner-blad{padding:.8rem .9rem;border:1.5px solid var(--blad);border-radius:8px;background:#FDF3F2;color:var(--tekst);font-weight:600}
.combo{position:relative}
.lista{position:absolute;z-index:5;left:0;right:0;top:calc(100% + 4px);margin:0;padding:.25rem 0;list-style:none;background:#fff;border:1.5px solid var(--linia-mocna);border-radius:8px;max-height:22rem;overflow:auto;box-shadow:0 8px 24px rgba(15,38,61,.12)}
.lista li{padding:.6rem .8rem;min-height:44px;cursor:pointer;line-height:1.35}
.lista li .opcja-nazwa{display:block;font-weight:700}
.lista li .opcja-reszta{display:block;font-size:.875rem;color:var(--tekst-2)}
.lista li[aria-selected=true],.lista li:hover{background:var(--mieta)}
.wybrana{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;padding:.35rem .35rem .35rem .8rem;border:1.5px solid var(--zielen);border-radius:8px;background:var(--mieta-jasna)}
.pole-kod{max-width:9.5rem;letter-spacing:.06em;font-variant-numeric:tabular-nums}
#kod-wybrana,.kod-gminy,.kod-brak{margin-top:.6rem}
/* Text flow, so a wrapped chip breaks before "powiat ..." and "· zmień" never starts a line. */
.wybrana-kod{display:block;line-height:1.5;padding:.3rem .4rem .3rem .8rem}
.wybrana-kod .razem{white-space:nowrap}
.wybrana-kod .link-przycisk{min-height:44px;vertical-align:middle}
.kod-gminy-tekst{padding:0;font-weight:700;line-height:1.45;margin-bottom:.6rem}
.kod-brak{margin-bottom:0;font-weight:600;color:var(--tekst)}
.zgody{display:grid;gap:.8rem}
.zgoda{min-height:44px;display:grid;grid-template-columns:1.5rem 1fr;gap:.7rem;align-items:start;font-size:.9375rem;line-height:1.5;cursor:pointer}
.zgoda input{width:1.375rem;height:1.375rem;margin:.1rem 0 0;accent-color:var(--zielen)}
.wyslij-w{margin-top:.25rem}
.formularz>.przypis{margin-top:-.5rem}
/* Bot trap field: moved off screen, not display:none, so simple bots still fill it; the template keeps it
   out of the Tab order (tabindex="-1") and away from screen readers (aria-hidden on the wrapper). */
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.dzieki-h{margin-bottom:.8rem}
.dzieki-kontakt{margin-top:.8rem;color:var(--tekst-2)}

/* Footer */
.stopka{margin-top:3rem;padding:2rem 0 6rem;border-top:1px solid var(--granat);font-size:.875rem;line-height:1.6;color:var(--tekst-2)}
.stopka-linki{list-style:none;padding:0;margin:.9rem 0;display:flex;flex-wrap:wrap;gap:.1rem 1.5rem}
.stopka-linki li{min-height:44px;display:flex;flex-wrap:wrap;align-items:center;column-gap:.3em}
.stopka-linki a{font-weight:600;display:inline-flex;align-items:center;min-height:44px}
.stopka-dane{font-size:.8125rem}
@media (min-width:768px){.stopka{padding-bottom:2.5rem}}

/* Mobile sticky bar */
.pasek{position:fixed;left:0;right:0;bottom:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.6rem 16px calc(.6rem + env(safe-area-inset-bottom));background:var(--karta);border-top:1px solid var(--linia);visibility:hidden;transform:translateY(110%)}
.pasek.widoczny{visibility:visible;transform:none}
.pasek-tekst{font-size:.875rem;font-weight:600;line-height:1.3;color:var(--tekst)}
.przycisk-pasek{background:var(--przycisk-h);font-size:1rem;min-height:48px;padding:.6rem 1rem;margin-left:auto;white-space:nowrap}
.przycisk-pasek:hover{background:#04573B}
@media (prefers-reduced-motion:no-preference){.pasek{transition:transform .2s ease,visibility 0s linear .2s}.pasek.widoczny{transition:transform .2s ease,visibility 0s}}
@media (max-width:359px){.pasek-tekst{display:none}}
@media (min-width:768px){.pasek{display:none}}

/* Larger screens */
@media (min-width:768px){
  body{font-size:1.125rem}
  .hero{padding:3rem 0 2.75rem}
  .h1{font-size:2.75rem}
  .h2{font-size:1.75rem}
  .podtytul{font-size:1.3125rem}
  .lead{font-size:1.1875rem}
  .karta-zapis{padding:2rem 2rem 1.75rem}
  .sekcja{margin-top:2.75rem;padding-top:2.5rem}
}

/* Policy page */
.dokument{padding-top:2rem;padding-bottom:1rem}
.dokument h1{font-family:var(--naglowki);font-size:1.75rem;line-height:1.2;margin:.9rem 0 .5rem}
.dokument h2{font-family:var(--naglowki);font-size:1.3125rem;line-height:1.3;margin:2rem 0 .6rem}
.dokument p,.dokument ul{margin:.7rem 0}
.dokument ul{padding-left:1.25rem}
.dokument li+li{margin-top:.4rem}
.projekt{display:inline-block;padding:.35rem .7rem;border:1.5px solid var(--blad);border-radius:6px;color:var(--blad);font-weight:700;font-size:.875rem;letter-spacing:.02em}
@media (min-width:768px){.dokument h1{font-size:2.5rem}}
.dokument{overflow-wrap:break-word}
.dokument a{overflow-wrap:anywhere}