/* padelowy.pl - katalog kortów do padla. Wzorce: Playtomic (strona klubu), Hipcamp (lista + mapa), Booksy (cennik w karcie). */
@font-face{font-family:Inter;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/inter-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Inter;font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/inter-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --noc:#0e2433;--noc2:#163447;--tusz:#0e2433;--tusz2:#3d5262;--szary:#5b6d7a;
  --linia:#dfe4e8;--pole:#f3f5f7;--tlo:#fff;
  --kort:#1f56d6;--kort-j:#e8eefc;--pilka:#d6f53b;--trawa:#1d7a4c;--trawa-j:#e6f3ec;--cegla:#c2410c;
  --w:1320px;--m:clamp(18px,3.4vw,48px);--r:4px;
  --f:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--tlo);color:var(--tusz);font:400 16px/1.55 var(--f);font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;height:auto}
a{color:var(--kort);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
h1,h2,h3{margin:0;letter-spacing:-.022em;line-height:1.12;font-weight:800}
h1{font-size:clamp(30px,3.6vw,46px)}
h2{font-size:clamp(23px,2.2vw,30px)}
h3{font-size:18px;letter-spacing:-.01em;line-height:1.3;font-weight:700}
p{margin:0 0 1em}
.num{font-variant-numeric:tabular-nums}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--m)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* nagłówek */
.top{background:var(--noc);color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
.top .wrap{display:flex;align-items:center;gap:36px;height:64px}
.logo{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:800;font-size:21px;letter-spacing:-.03em}
.logo svg{width:30px;height:20px;flex:none}
.menu{display:flex;gap:26px;margin-left:auto}
.menu a{color:#fff;text-decoration:none;font-weight:600;font-size:15px;opacity:.86;padding:21px 0;border-bottom:2px solid transparent}
.menu a:hover,.menu a[aria-current=page]{opacity:1;border-bottom-color:var(--pilka)}
.burger{display:none;margin-left:auto;background:none;border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:var(--r);height:38px;padding:0 12px;font:600 14px var(--f)}

/* przyciski i pola */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;border-radius:var(--r);border:0;font:700 15px/1 var(--f);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn-p{background:var(--pilka);color:var(--noc)}
.btn-p:hover{background:#e3fb6c}
.btn-k{background:var(--kort);color:#fff}
.btn-k:hover{background:#1747b8}
.btn-o{background:#fff;color:var(--tusz);border:1px solid var(--linia)}
.btn-o:hover{border-color:var(--tusz)}
.btn-s{height:38px;padding:0 14px;font-size:14px}

/* hero głównej: wyszukiwarka + mapa wszystkich klubów */
.hero{background:var(--noc);color:#fff}
.hero .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);padding-top:clamp(36px,5vw,72px);padding-bottom:clamp(36px,5vw,72px);align-items:center}
.hero h1{font-size:clamp(34px,4.4vw,58px);letter-spacing:-.03em;line-height:1.04}
.hero .lead{font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:#dce6ee;margin:18px 0 28px;max-width:30em}
.hero .lead b{color:#fff;font-weight:700}
.szukaj{display:flex;background:#fff;border-radius:var(--r);padding:5px;max-width:560px}
.szukaj input{flex:1;min-width:0;border:0;outline:0;font:500 17px var(--f);color:var(--tusz);padding:0 14px;background:transparent}
.szukaj input::placeholder{color:#7b8b97}
.skroty{margin:18px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:15px}
.skroty a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35)}
.skroty a:hover{border-bottom-color:var(--pilka)}
.skroty span{color:#9fb2c1;font-variant-numeric:tabular-nums}
.mapa{position:relative;background:#e9edf0;border-radius:var(--r);overflow:hidden}
.hero .mapa{height:clamp(340px,40vw,520px)}
.mapa-podpis i{}
.pl-ramka{background:#11304a;border-radius:var(--r);padding:clamp(10px,2vw,24px)}
.pl{width:100%;height:auto;display:block}
.pl circle{transition:r .15s}
.pl a:hover circle{r:7;fill:#fff}
.pl-m text{fill:#fff;font:700 15px var(--f);paint-order:stroke;stroke:#11304a;stroke-width:4px}
.pl-m:hover text{fill:var(--pilka)}
.mapa-podpis a{margin-left:auto}
.mapa-podpis{font-size:13px;color:#9fb2c1;margin-top:10px;display:flex;gap:18px;flex-wrap:wrap}
.mapa-podpis i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px}

/* pinezki z ceną (jak Airbnb / Hipcamp) */
.pin{background:#fff;color:var(--tusz);border:1px solid rgba(14,36,51,.35);border-radius:3px;font:700 12px/1 var(--f);padding:5px 6px;white-space:nowrap;transform:translate(-50%,-50%);display:inline-block;font-variant-numeric:tabular-nums}
.pin.bez{width:11px;height:11px;padding:0;border-radius:50%;background:var(--kort);border:2px solid #fff;box-shadow:0 0 0 1px rgba(14,36,51,.3)}
.pin.akt,.pin:hover{background:var(--noc);color:var(--pilka);border-color:var(--noc);z-index:1000}
.leaflet-div-icon{background:none;border:0}
.mapa .leaflet-tile-pane{filter:grayscale(1) contrast(.92) brightness(1.06)}
.mapa.daleko .pin{width:10px;height:10px;padding:0;border-radius:50%;font-size:0;background:var(--kort);border:2px solid #fff;box-shadow:0 0 0 1px rgba(14,36,51,.35)}
.mapa.daleko .pin.bez{background:#8796a1}
.mapa.daleko .pin.akt{width:16px;height:16px;background:var(--pilka);border-color:var(--noc)}
.leaflet-container{font-family:var(--f)}
.leaflet-popup-content-wrapper{border-radius:var(--r)}
.leaflet-popup-content{margin:12px 14px;font-size:14px;line-height:1.4}
.leaflet-popup-content b{display:block;font-size:15px}
.leaflet-popup-content a{font-weight:700}

/* sekcje */
.sek{padding:clamp(44px,5.5vw,80px) 0}
.sek-g{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:24px;flex-wrap:wrap}
.sek-g p{margin:6px 0 0;color:var(--szary);max-width:46em}
.sek-g a{font-weight:600;white-space:nowrap}
.szare{background:var(--pole)}

/* karty miast */
.miasta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 20px}
.miasto{text-decoration:none;color:var(--tusz)}
.miasto img{aspect-ratio:16/10;object-fit:cover;width:100%;border-radius:var(--r);background:var(--pole)}
.miasto h3{margin:12px 0 3px;font-size:19px}
.miasto p{margin:0;color:var(--szary);font-size:15px}
.miasto p b{color:var(--tusz);font-weight:700}
.miasto:hover h3{color:var(--kort);text-decoration:underline;text-underline-offset:3px}
.reszta{margin:32px 0 0;padding:20px 0 0;border-top:1px solid var(--linia);columns:5 180px;column-gap:24px;list-style:none;font-size:15px}
.reszta li{padding:3px 0;break-inside:avoid}
.reszta a{color:var(--tusz);text-decoration:none}
.reszta a:hover{color:var(--kort);text-decoration:underline}
.reszta span{color:var(--szary);font-variant-numeric:tabular-nums}

/* tabela cen -> karty na telefonie */
.tab{width:100%;border-collapse:collapse;font-size:15px}
.tab th{text-align:left;font-size:13px;font-weight:600;color:var(--szary);padding:10px 12px;border-bottom:1px solid var(--tusz)}
.tab td{padding:13px 12px;border-bottom:1px solid var(--linia);vertical-align:top}
.tab tr:hover td{background:#fafbfc}
.tab .r{text-align:right}
.tab td a.n{color:var(--tusz);font-weight:700;text-decoration:none;display:inline-block;padding:3px 0;min-height:24px}
.tab td a.n:hover{color:var(--kort);text-decoration:underline}
.tab .cena{font-weight:800;font-size:17px;white-space:nowrap;font-variant-numeric:tabular-nums}
.tab .mal{color:var(--szary);font-size:13px;display:block}
.tab tr.top1 td{background:var(--trawa-j)}
.tab tr.top1 .cena{color:var(--trawa)}
.zr{font-size:13px;color:var(--szary)}
.zr a{color:var(--szary)}

/* poradniki */
.porady{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.porada{text-decoration:none;color:var(--tusz);display:block}
.porada img{aspect-ratio:16/10;object-fit:cover;width:100%;border-radius:var(--r)}
.porada h3{margin:14px 0 6px;font-size:20px}
.porada p{color:var(--szary);margin:0;font-size:15px}
.porada:hover h3{color:var(--kort);text-decoration:underline;text-underline-offset:3px}

/* stopka */
.stopka{background:var(--noc);color:#c9d6e0;font-size:14px;padding:44px 0 36px;margin-top:0}
.stopka .wrap{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}
.stopka a{color:#fff}
.stopka h3{color:#fff;font-size:15px;margin-bottom:10px}
.stopka ul{list-style:none;margin:0;padding:0}
.stopka li{padding:3px 0}
.stopka .mini{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:18px;color:#8ea3b3;font-size:13px}

/* okruszki */
.okr{font-size:14px;color:var(--szary);margin:0;padding:18px 0 0;list-style:none;display:flex;flex-wrap:wrap;gap:6px}
.okr li+li::before{content:"/";margin-right:6px;color:#aab6bf}
.okr a{color:var(--szary)}
.ciemne .okr,.ciemne .okr a{color:#9fb2c1}

/* strona miasta: lista + mapa */
.miasto-g{padding:6px 0 22px}
.miasto-g h1{margin:14px 0 8px}
.miasto-g .lead{color:var(--tusz2);font-size:17px;max-width:52em;margin:0}
.filtry{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;padding:14px 0;border-top:1px solid var(--linia);border-bottom:1px solid var(--linia);position:sticky;top:0;background:#fff;z-index:600;font-size:15px}
.filtry label{display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-weight:500}
.filtry input[type=checkbox]{width:17px;height:17px;accent-color:var(--kort)}
.filtry select{font:500 15px var(--f);height:38px;border:1px solid var(--linia);border-radius:var(--r);padding:0 10px;color:var(--tusz);background:#fff}
.filtry .ile{margin-left:auto;color:var(--szary)}
.uklad{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:start}
.uklad .mapa{position:sticky;top:76px;height:calc(100vh - 96px);min-height:420px;margin-top:18px}
.lista{list-style:none;margin:0;padding:0}
.k{display:grid;grid-template-columns:132px minmax(0,1fr) auto;gap:18px;padding:20px 0;border-bottom:1px solid var(--linia);align-items:start}
.k:hover .k-n a{color:var(--kort);text-decoration:underline}
.k-plan{width:132px;height:92px;background:var(--pole);border-radius:var(--r);display:grid;place-items:center}
.k-n{font-size:19px;font-weight:700;letter-spacing:-.015em;line-height:1.25;margin:0 0 4px}
.k-n a{color:var(--tusz);text-decoration:none}
.k-a{color:var(--szary);font-size:14px;margin:0 0 10px}
.k-f{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px;color:var(--tusz2);margin:0;padding:0;list-style:none}
.k-f li{display:inline-flex;align-items:center;gap:6px}
.k-f i{width:8px;height:8px;border-radius:2px;display:inline-block}
.k-c{text-align:right;min-width:128px}
.k-c .od{font-size:13px;color:var(--szary)}
.k-c b{white-space:nowrap;display:block;font-size:24px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.k-c .j{font-size:13px;color:var(--szary);display:block;margin-bottom:10px}
.k-c .brak{font-size:14px;color:var(--szary);display:block;margin:6px 0 10px}
.okolica{margin-top:34px}
.okolica h2{font-size:22px;margin-bottom:4px}

/* FAQ */
.faq{max-width:860px}
.faq details{border-bottom:1px solid var(--linia);padding:16px 0}
.faq summary{font-weight:700;font-size:17px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::after{content:"+";font-weight:400;font-size:22px;line-height:1;color:var(--szary)}
.faq details[open] summary::after{content:"−"}
.faq details p{margin:10px 0 0;color:var(--tusz2)}

/* strona klubu */
.ciemne{background:var(--noc);color:#fff}
.klub-g .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);padding-bottom:36px}
.klub-g h1{margin:16px 0 8px}
.klub-g .adr{color:#c9d6e0;font-size:17px;margin:0 0 22px}
.fakty{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.18);margin:0 0 26px;padding:0;list-style:none}
.fakty li{padding:14px 14px 0 0}
.fakty b{display:block;font-size:22px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.fakty span{font-size:13px;color:#9fb2c1}
.akcje{display:flex;gap:10px;flex-wrap:wrap}
.akcje .btn-o{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.akcje .btn-o:hover{border-color:#fff}
.klub-g .mapa{height:100%;min-height:300px;margin-top:20px}
.klub-t .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(24px,4vw,64px);padding-top:40px;padding-bottom:64px}
.blok{margin-bottom:44px}
.blok h2{font-size:24px;margin-bottom:14px}
.cennik td:first-child{width:46%}
.plan-duzy{display:flex;flex-wrap:wrap;gap:14px;margin:0;padding:0;list-style:none}
.plan-duzy li{width:124px;font-size:13px;line-height:1.35;color:var(--tusz2)}
.plan-duzy svg{display:block;margin-bottom:6px}
.godz{width:100%;max-width:440px;border-collapse:collapse;font-size:15px}
.godz td{padding:7px 0;border-bottom:1px solid var(--linia)}
.godz td+td{text-align:right;font-variant-numeric:tabular-nums}
.udog{columns:2 200px;list-style:none;padding:0;margin:0;font-size:15px}
.udog li{padding:4px 0}
.udog li::before{content:"";display:inline-block;width:6px;height:6px;background:var(--trawa);margin-right:10px;vertical-align:2px}
.boczna h2{font-size:19px;margin-bottom:6px}
.blisko{list-style:none;margin:0 0 36px;padding:0}
.blisko li{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--linia);font-size:15px}
.blisko a{color:var(--tusz);font-weight:600;text-decoration:none}
.blisko a:hover{color:var(--kort);text-decoration:underline}
.blisko small{display:block;color:var(--szary);font-size:13px;font-weight:400}
.blisko b{white-space:nowrap;font-variant-numeric:tabular-nums}
.kontakt{font-size:15px;list-style:none;padding:0;margin:0 0 36px}
.kontakt li{padding:8px 0;border-bottom:1px solid var(--linia);display:flex;justify-content:space-between;gap:12px}
.kontakt span{color:var(--szary)}
.kontakt a{overflow-wrap:anywhere;text-align:right}
.zrodla{font-size:13px;color:var(--szary);padding:0 0 0 18px;margin:0}
.zrodla li{padding:2px 0;overflow-wrap:anywhere}
.zrodla a{color:var(--szary)}
.uwaga{background:var(--pole);border-left:3px solid var(--kort);padding:14px 16px;font-size:15px;margin:0 0 20px}

/* artykuły i poradniki */
.art{padding-bottom:70px}
.art-g{max-width:820px;padding:8px 0 26px}
.art-g h1{margin:12px 0 10px;font-size:clamp(30px,3.4vw,44px)}
.kat{margin:18px 0 0;font-size:13px;font-weight:700;color:var(--kort);letter-spacing:.06em;text-transform:uppercase}
.art-m{color:var(--szary);font-size:14px;margin:0}
.lead-art{font-size:19px;color:var(--tusz2);margin:6px 0 0;max-width:46em}
.art-f{margin:0 0 34px;max-width:960px}
.art-f img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r)}
.art-f figcaption{font-size:13px;color:var(--szary);margin-top:8px}
.art-f figcaption a{color:var(--szary)}
.tekst{max-width:760px;font-size:18px;line-height:1.65}
.tekst h2{font-size:clamp(23px,2vw,27px);margin:42px 0 12px}
.tekst h3{margin:28px 0 8px}
.tekst p{margin:0 0 16px}
.tekst ul,.tekst ol{padding-left:22px;margin:0 0 18px}
.tekst li{margin:0 0 8px}
.tekst li::marker{color:var(--kort);font-weight:700}
.tekst table{margin:8px 0 22px}
.tab-tekst{font-size:16px}
.tab-tekst th{white-space:normal}
.tab-tekst td,.tab-tekst th{overflow-wrap:anywhere}
.tab-waska{max-width:460px}
.blokkod{margin:6px 0 24px}
.wykres{margin:10px 0 26px}
.wykres svg{width:100%;height:auto;display:block;font-family:var(--f)}
.wykres figcaption{font-size:13px;color:var(--szary);margin-top:8px}
.art-inne{max-width:760px;border-top:1px solid var(--linia);margin-top:44px;padding-top:20px}
.art-inne h2{font-size:20px;margin-bottom:8px}
.art-inne ul{list-style:none;padding:0;margin:0}
.art-inne li{padding:6px 0}
.zasady-uk{display:grid;grid-template-columns:240px minmax(0,1fr);gap:48px;align-items:start}
.spis{position:sticky;top:20px;font-size:14px}
.spis h2{font-size:15px;margin-bottom:8px}
.spis ol{margin:0;padding-left:18px}
.spis li{padding:4px 0}
.spis a{color:var(--tusz2);text-decoration:none}
.spis a:hover{color:var(--kort);text-decoration:underline}
.zasada{padding:4px 0 10px;border-bottom:1px solid var(--linia)}
.zasada h2{margin-top:30px}
.zasada .tab{font-size:15px}

/* responsywność */
@media (max-width:1080px){
  .miasta{grid-template-columns:repeat(3,minmax(0,1fr))}
  .uklad{grid-template-columns:minmax(0,1fr)}
  .uklad .mapa{position:relative;top:0;height:380px;min-height:0;margin-top:26px}
}
@media (max-width:860px){
  .menu{display:none}
  .burger{display:inline-flex;align-items:center}
  .menu.otw{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;gap:0;background:var(--noc);padding:6px var(--m) 14px;z-index:900}
  .menu.otw a{padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
  .top{position:relative}
  .hero .wrap,.klub-g .wrap,.klub-t .wrap{grid-template-columns:minmax(0,1fr)}
  .hero .mapa{height:320px}
  .miasta{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 14px}
  .miasto h3{font-size:17px}
  .porady{grid-template-columns:1fr}
  .stopka .wrap{grid-template-columns:1fr 1fr}
  .stopka .wrap>div:first-child{grid-column:1/-1}
  .fakty{grid-template-columns:repeat(2,minmax(0,1fr))}
  .klub-g .mapa{min-height:240px;height:240px}
  /* tabela -> karty */
  .tab thead{display:none}
  .tab,.tab tbody,.tab tr,.tab td{display:block;width:100%}
  .tab tr{border-bottom:1px solid var(--linia);padding:12px 0;display:grid;grid-template-columns:1fr auto;gap:2px 12px}
  .tab td{border:0;padding:0}
  .tab td.r{text-align:right}
  .tab td[data-l]::before{content:attr(data-l) ": ";color:var(--szary);font-size:13px}
  .tab td.pelny{grid-column:1/-1}
  .tab tr:hover td{background:none}
  .tab tr.top1{background:var(--trawa-j);padding:12px 10px}
  .tab tr.top1 td{background:none}
  .tab-tekst thead{display:table-header-group}
  .tab-tekst,.tab-tekst tbody{display:table;width:100%}
  .tab-tekst tr{display:table-row;padding:0}
  .tab-tekst td,.tab-tekst th{display:table-cell;padding:9px 6px;border-bottom:1px solid var(--linia);width:auto;font-size:14px}
  .tab-tekst td[data-l]::before{content:none}
  .zasady-uk{grid-template-columns:minmax(0,1fr);gap:10px}
  .spis{position:static}
  .tekst{font-size:17px}
  .cennik td:first-child{width:auto}
}
@media (max-width:560px){
  .k{grid-template-columns:84px minmax(0,1fr);gap:12px}
  .k-plan{width:84px;height:64px}
  .k-plan svg{width:72px;height:auto}
  .k-c{grid-column:1/-1;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
  .k-c b{font-size:21px;display:inline}
  .k-c .j{margin:0;flex:1}
  .k-c .od{display:none}
  .filtry{position:static}
  .filtry .ile{margin-left:0;width:100%}
  .szukaj .btn{padding:0 14px}
  .reszta{columns:2}
}
