@import url("https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&display=swap");
/* ============================================================
   picasso.css v30 — spojny motyw "Picasso" dla calego trip
   - wspolne hero (mur + odlamki + portret + menu) na podstronach
   - jednolite kafle we wszystkich dzialach
   - mapy Leaflet i AdSense: NIE ruszamy ich stylow (fix v2)
   Rollback calosci = usuniecie tego pliku.
   ============================================================ */
:root{ --p-ink:#1e3550; --p-paper:#f6f1e6; --p-paper2:#fffdf6;
  --gp:#ff2f7e; --gc:#19c8ff; --gy:#ffe94a; --gg:#3dfa7e; --go:#ff8c2e; --acc:#19c8ff; }
/* v23: MOBILE nie moze sie rozjezdzac — zaden element (tabela, reklama,
   obrazek) nie moze rozpychac ukladu ponad szerokosc ekranu */
html,body{max-width:100%;overflow-x:hidden}
img{max-width:100%}
ins.adsbygoogle{max-width:100%!important;overflow:hidden} iframe{max-width:100%}
body{background:radial-gradient(rgba(30,53,80,.05) 1.3px, transparent 1.3px) 0 0/26px 26px, var(--p-paper)!important}
/* ---------- WSPÓLNE HERO ---------- */
#phero{position:relative;overflow:hidden;color:#f2eee4;border-bottom:0!important;padding:36px 22px 30px;background:
  radial-gradient(560px 380px at 90% -12%, color-mix(in srgb, var(--acc) 42%, transparent), transparent 62%),
  repeating-linear-gradient(0deg, rgba(255,255,255,.03) 0 2px, transparent 2px 88px),
  repeating-linear-gradient(90deg, rgba(0,0,0,.06) 0 1px, transparent 1px 132px),
  linear-gradient(160deg,#4a5058 0%,#33383f 48%,#22262c 100%)!important}
#phero::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:14px;z-index:6;
  background:radial-gradient(circle at 12px -6px, transparent 14px, var(--p-paper) 15px) 0 0/24px 20px}
.ph-sh{position:absolute;z-index:0;opacity:.55;animation:phbr 10s ease-in-out infinite}
@keyframes phbr{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-8px) rotate(var(--r,0deg))}}
.ph-sh.a{left:-9%;top:-26%;width:30%;height:62%;background:linear-gradient(135deg,var(--gp),#c81d5f);
  clip-path:polygon(0 14%,62% 0,88% 58%,34% 100%,0 78%);--r:-2deg}
.ph-sh.b{right:-10%;top:-20%;width:32%;height:58%;background:linear-gradient(215deg,var(--acc),color-mix(in srgb,var(--acc) 55%,#000));
  clip-path:polygon(18% 8%,100% 0,100% 74%,42% 100%,6% 52%);--r:2deg;animation-delay:.8s}
.ph-sh.c{right:16%;bottom:-34%;width:22%;height:52%;background:linear-gradient(45deg,var(--gy),#d9b41f);
  clip-path:polygon(0 40%,52% 0,100% 34%,74% 100%,10% 92%);--r:-3deg;animation-delay:1.5s;opacity:.4}
#phero{--face-pad:250px}
.ph-in{position:relative;z-index:3;max-width:1080px;margin:0 auto;padding-right:var(--face-pad)}
.ph-kick{display:inline-block;font-family:'Caveat','Segoe Script',cursive;font-weight:700;font-size:1.25rem;color:#111;
  background:var(--gy);padding:1px 14px;border-radius:4px;transform:rotate(-1.5deg);box-shadow:3px 4px 0 rgba(0,0,0,.5);
  letter-spacing:.02em;text-transform:none}
.ph-h1{margin:10px 0 0;font-family:'Hanken Grotesk',sans-serif;font-weight:800;
  font-size:clamp(2rem,5.4vw,3.9rem);line-height:1.02;letter-spacing:.005em;color:var(--gy);
  transform:rotate(-1deg);transform-origin:left bottom;
  text-shadow:3px 3px 0 #111, 6px 6px 0 var(--gp), 9px 9px 0 color-mix(in srgb, var(--acc) 85%, transparent)}
.ph-h1 span{color:#fffdf6;font-style:normal;font-family:inherit;font-weight:800}
.ph-sub{max-width:640px;margin:16px 0 0;background:rgba(255,253,246,.96);color:var(--p-ink);font-size:.93rem;line-height:1.5;
  padding:11px 15px;border:2.5px solid #0f1216;box-shadow:5px 6px 0 rgba(0,0,0,.4);
  clip-path:polygon(0 8%,2% 0,100% 2%,99% 92%,97% 100%,1% 97%)}
.ph-sub b, .ph-sub a{color:var(--p-ink)}
.ph-menu{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin-top:18px;
  position:relative;left:calc(50% + var(--face-pad,0px)/2);transform:translateX(-50%);
  width:100vw;max-width:100vw;padding:0 18px;box-sizing:border-box}
@media (min-width:900px){
  .ph-menu{flex-wrap:wrap;gap:8px 10px;row-gap:9px}
  .ph-menu a{font-size:clamp(.66rem,.85vw,.82rem);padding:6px clamp(8px,.8vw,14px);gap:5px}
  /* v28: wstazka w DWOCH rownych rzedach jak hero w trip — niewidzialny lamacz
     wiersza (order:9) rozdziela rzad 1 (order 1-8) od rzedu 2 (order 10-15) */
  .ph-menu::after{content:"";flex-basis:100%;order:10;height:0}
}
.ph-menu a:nth-child(odd){transform:rotate(-1.2deg)}
.ph-menu a:nth-child(even){transform:rotate(1deg)}
/* v28: kolejnosc wstazki = uklad hero z trip.html; rzad 1: 1-8, lamacz: 9, rzad 2: 10-15 */
.ph-menu a[href="trip.html"]{order:1}
.ph-menu a[href*="gancarczyk"]{order:2}
.ph-menu a[href="rower.html"]{order:3}
.ph-menu a[href="szlaki.html"]{order:4} .ph-menu a[href^="szlaki-"]{order:4}
.ph-menu a[href="pociag.html"]{order:5}
.ph-menu a[href="kulinarne.html"]{order:6}.ph-menu a[href="sport.html"]{order:13}
.ph-menu a[href="hotele.html"]{order:7}
.ph-menu a[href="parkingi.html"]{order:8}
.ph-menu a[href="loty.html"]{order:9}
.ph-menu a[href="lowiska.html"]{order:11}
.ph-menu a[href="campery.html"]{order:12}
.ph-menu a[href="imprezy.html"]{order:14}
.ph-menu a[href="drony.html"]{order:16}
.ph-menu a[href="wydarzenia.html"]{order:15}
.ph-menu a[href="promocjebankowe.html"]{order:17}
.ph-menu a[href="kamery.html"]{order:18}
/* v19: wstazka zywsza kolorystycznie — obwodki vlepek w kolorach motywu,
   hover wypelnia pigulke jej kolorem. .on (aktywna) bez zmian. */
.ph-menu a:not(.on):nth-child(5n+1){border-color:var(--gy)}
.ph-menu a:not(.on):nth-child(5n+2){border-color:var(--gc)}
.ph-menu a:not(.on):nth-child(5n+3){border-color:var(--gp)}
.ph-menu a:not(.on):nth-child(5n+4){border-color:var(--gg)}
.ph-menu a:not(.on):nth-child(5n){border-color:var(--go)}
.ph-menu a:not(.on):nth-child(5n+1):hover{background:var(--gy);color:#0f1216;border-color:#0f1216}
.ph-menu a:not(.on):nth-child(5n+2):hover{background:var(--gc);color:#0f1216;border-color:#0f1216}
.ph-menu a:not(.on):nth-child(5n+3):hover{background:var(--gp);color:#0f1216;border-color:#0f1216}
.ph-menu a:not(.on):nth-child(5n+4):hover{background:var(--gg);color:#0f1216;border-color:#0f1216}
.ph-menu a:not(.on):nth-child(5n):hover{background:var(--go);color:#0f1216;border-color:#0f1216}
.ph-menu a{display:inline-flex;align-items:center;gap:6px;background:rgba(15,18,22,.88);border:2.5px solid #fff;
  color:#fff;border-radius:30px;font-weight:800;font-size:.78rem;padding:7px 13px;text-decoration:none;
  box-shadow:3px 4px 0 rgba(0,0,0,.55);transition:.15s;white-space:nowrap}
.ph-menu a:hover{transform:translateY(-3px);border-color:var(--acc);color:var(--gy)}
.ph-menu a.on{background:var(--acc);color:#101418;border-color:#0f1216}
.ph-menu a b{color:inherit;font-weight:800}
/* mini-portret (desktop, po prawej) */
/* v15: na szerokich monitorach twarz trzyma sie PRAWEJ KRAWEDZI
   kontenera 1080px (jak ph-in), a nie krawedzi ekranu — koniec z
   rozstrzelona kompozycja (tekst na srodku, twarz na koncu monitora).
   right:34px zostaje pierwszy jako fallback dla starych przegladarek. */
.pf-face{position:absolute;z-index:2;right:34px;right:max(34px, calc(50% - 506px));top:50%;transform:translateY(-52%);width:210px;height:250px;
  filter:drop-shadow(7px 9px 0 rgba(0,0,0,.35));pointer-events:none}
.pf-hl{position:absolute;left:0;top:12%;width:58%;height:78%;background:linear-gradient(160deg,#ffd9a8,#f3a95f);
  border:3px solid #0f1216;clip-path:polygon(6% 18%,74% 0,100% 100%,18% 92%,0 58%)}
.pf-hr{position:absolute;left:50%;top:8%;width:44%;height:84%;background:linear-gradient(200deg,var(--acc),color-mix(in srgb,var(--acc) 55%,#000));
  border:3px solid #0f1216;clip-path:polygon(0 6%,86% 0,100% 82%,34% 100%,4% 96%)}
.pf-cap{position:absolute;left:6%;top:-2%;width:80%;height:22%;background:var(--gy);border:3px solid #0f1216;
  clip-path:polygon(0 60%,16% 0,96% 12%,100% 78%,52% 100%);transform:rotate(-5deg)}
.pf-e1{position:absolute;left:12%;top:34%;width:54px;height:54px;border-radius:50%;background:#fffdf6;
  border:3px solid #0f1216;display:flex;align-items:center;justify-content:center}
.pf-e1::before{content:"";position:absolute;inset:9px;border-radius:50%;border:2px dashed #0f1216;opacity:.6}
.pf-n{width:5px;height:38px;background:linear-gradient(var(--gp) 0 50%, #0f1216 50% 100%);border-radius:4px;animation:pfsp 14s linear infinite}
@keyframes pfsp{to{transform:rotate(360deg)}}
.pf-e2{position:absolute;left:63%;top:36%;width:40px;height:22px;background:#fffdf6;border:3px solid #0f1216;
  border-radius:50%/70% 70% 30% 30%;transform:rotate(-14deg);animation:pfbl 5.5s infinite}
.pf-e2::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;background:#0f1216;border-radius:50%;transform:translate(-50%,-50%)}
@keyframes pfbl{0%,90%,100%{transform:rotate(-14deg) scaleY(1)}94%{transform:rotate(-14deg) scaleY(.08)}}
.pf-no{position:absolute;left:44%;top:48%;width:0;height:0;border-left:12px solid transparent;
  border-right:22px solid var(--go);border-bottom:32px solid transparent;transform:rotate(8deg);
  filter:drop-shadow(-2px 0 0 #0f1216) drop-shadow(2px 2px 0 #0f1216)}
.pf-m{position:absolute;left:16%;top:74%;width:110px;height:38px}
.pf-m path{stroke:#0f1216;stroke-width:5;fill:none;stroke-linecap:round;stroke-dasharray:3 12;animation:pfda 8s linear infinite}
@keyframes pfda{to{stroke-dashoffset:-150}}
.pf-d{position:absolute;left:-3%;top:58%;width:13px;height:13px;border-radius:50%;background:var(--gg);border:3px solid #0f1216}
/* chipy wlasne podstrony — POD hero */
.pagechips{background:var(--p-paper);padding:16px 22px 16px;position:relative;z-index:5}
.pc-in{max-width:1080px;margin:0 auto;display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.pc-in a, .pc-in .fact, .pc-in span{display:inline-flex;align-items:center;gap:6px;
  background:rgba(15,18,22,.92);border:2.5px solid #fff;color:#fff!important;border-radius:30px;
  font-weight:800;font-size:.78rem;padding:7px 13px;text-decoration:none;
  box-shadow:3px 4px 0 rgba(0,0,0,.45);transition:.15s;white-space:nowrap}
.pc-in .fact a{border:0!important;box-shadow:none!important;padding:0!important;background:none!important;color:inherit!important}
.pc-in a:hover, .pc-in .fact:hover{transform:translateY(-3px);border-color:var(--acc);color:var(--gy)!important}
.pc-in .backhome{border-color:var(--gy)}
@media (max-width:900px){ .pf-face{display:none} #phero{--face-pad:0px} .ph-in{padding-right:0} }
/* ---------- KAFLE: identyczne w każdym dziale ---------- */
.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p{border:2.5px solid var(--p-ink)!important;border-radius:20px!important;
  background:var(--p-paper2);box-shadow:5px 6px 0 rgba(30,53,80,.16)!important;transition:.16s}
.card:hover,.rcard:hover,.hcard:hover,.trasa-card:hover,.xtile:hover,.kol-p:hover{transform:translateY(-5px);
  box-shadow:7px 10px 0 color-mix(in srgb, var(--acc) 55%, transparent)!important;border-color:var(--acc)!important}
.hcard{overflow:hidden}
.day,.okbox,.warnbox,.coffee,.devil{border:2.5px solid var(--p-ink)!important;border-radius:18px!important;
  box-shadow:5px 6px 0 rgba(30,53,80,.14)!important}
.okbox,.warnbox,.devil{border-left-width:8px!important}
.cta,.bk,.go,.planlink a{border-radius:30px!important;font-weight:800!important;box-shadow:2px 3px 0 rgba(30,53,80,.3);
  border:2px solid rgba(0,0,0,.15)}
.cta:hover,.bk:hover,.go:hover,.planlink a:hover{box-shadow:3px 5px 0 color-mix(in srgb, var(--acc) 60%, transparent)}
.legchip{border:2px solid var(--p-ink)!important;border-radius:20px!important;font-weight:700;box-shadow:2px 2px 0 rgba(30,53,80,.2)}
.section h2{position:relative;padding-bottom:12px;font-family:'Caveat',cursive;font-weight:700;
  font-size:clamp(1.9rem,3vw,2.5rem);letter-spacing:.01em}
.section h2 span{font-family:'Caveat',cursive}
.section h3{font-family:'Caveat',cursive;font-weight:700;font-size:1.55rem;color:var(--p-ink)}
.section h2 span{color:color-mix(in srgb, var(--acc) 70%, #1e3550)!important}
.section h2::after{content:"✈ · · · · · · · · · · · · · · · · · · · · 📍";position:absolute;left:0;bottom:-2px;
  font-size:.72rem;color:var(--p-ink);opacity:.45;letter-spacing:2px;white-space:nowrap;overflow:hidden;max-width:100%}
.badge,.rbadges .badge{border-radius:20px!important;font-weight:800}
footer{border-top:3px dashed #d9c4a4!important}
/* ---------- KAFLE PODSTRON = wzorzec z trip: wstążka + pinezka + CTA caps ---------- */
:is(.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p,.pk-card,.tk-card){position:relative;overflow:hidden}
:is(.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p,.pk-card,.tk-card)::before{content:"";position:absolute;
  left:14px;top:-10px;width:8px;height:78px;background:var(--acc,#19c8ff);transform:rotate(9deg);
  border-radius:5px;opacity:.95;z-index:2;pointer-events:none}
:is(.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p,.pk-card,.tk-card):nth-child(5n+1)::before{background:#ff2f7e}
:is(.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p,.pk-card,.tk-card):nth-child(5n+2)::before{background:#19c8ff}
:is(.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p,.pk-card,.tk-card):nth-child(5n+3)::before{background:#ffb020}
:is(.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p,.pk-card,.tk-card):nth-child(5n+4)::before{background:#2fbf71}
:is(.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p,.pk-card,.tk-card):nth-child(5n)::before{background:#ff8c2e}
:is(.card,.rcard,.hcard,.rule,.dest,.trasa-card,.xtile,.kol-p,.pk-card,.tk-card)::after{content:"📍";position:absolute;
  left:7px;top:4px;font-size:1.15rem;z-index:3;pointer-events:none;
  filter:drop-shadow(1px 2px 0 rgba(30,53,80,.3))}
.day{position:relative;overflow:hidden}
.day::before{content:"";position:absolute;right:16px;top:-8px;width:8px;height:64px;
  transform:rotate(9deg);border-radius:5px;opacity:.9;z-index:2;pointer-events:none;background:var(--gc)}
.day:nth-of-type(5n+1)::before{background:#ff2f7e}
.day:nth-of-type(5n+2)::before{background:#19c8ff}
.day:nth-of-type(5n+3)::before{background:#2fbf71}
.day:nth-of-type(5n+4)::before{background:#ff8c2e}
.day:nth-of-type(5n)::before{background:#8a63ff}
.cta,.bk,.go{text-transform:uppercase!important;font-size:.72rem!important;letter-spacing:.05em!important}
/* ---------- PASKI KOTWIC (kontynenty, dni, sekcje) = vlepki jak w hero ---------- */
a[href^="#kont-"], a[href*="/#kont-"], .daynav a, .daynav-in a, a[href^="#dzien"]{
  display:inline-flex!important;align-items:center;gap:6px;
  background:rgba(15,18,22,.9)!important;border:2.5px solid #fff!important;
  color:#fff!important;border-radius:30px!important;font-weight:800!important;
  font-size:.78rem!important;padding:7px 13px!important;text-decoration:none!important;
  box-shadow:3px 4px 0 rgba(0,0,0,.45)!important;transition:.15s!important;white-space:nowrap}
a[href^="#kont-"]:hover, a[href*="/#kont-"]:hover, .daynav a:hover, a[href^="#dzien"]:hover{
  transform:translateY(-3px);border-color:var(--acc, #19c8ff)!important;color:#ffe94a!important}
.daynav{background:rgba(34,38,44,.94)!important;border-bottom:2.5px solid #0f1216!important;
  /* v16: staly odstep miedzy czarna belka a pierwszym blokiem pod nia —
     karty maja lekkie obroty i naroznik potrafil dotykac/nachodzic belke
     (zgloszone na planie Bari; regula globalna, web + mobile) */
  margin-bottom:22px!important}
/* ---------- TABELE = plansze Picasso ---------- */
.section table, table.timetbl{width:100%;border-collapse:separate;border-spacing:0;
  border:2.5px solid var(--p-ink);border-radius:18px;overflow:hidden;background:var(--p-paper2);
  box-shadow:6px 7px 0 rgba(30,53,80,.16)}
.section table thead th, table.timetbl thead th{background:#0f1216;color:var(--gy);font-weight:800;
  letter-spacing:.07em;text-transform:uppercase;font-size:.7rem;padding:11px 12px;text-align:left}
.section table thead th+th, table.timetbl thead th+th{border-left:1px dashed rgba(255,233,74,.35)}
.section table tbody td, table.timetbl tbody td{padding:10px 12px;border-top:1px dashed var(--line2)}
.section table tbody tr:nth-child(even), table.timetbl tbody tr:nth-child(even){
  background:color-mix(in srgb, var(--acc) 7%, var(--p-paper2))}
.section table tbody tr:hover, table.timetbl tbody tr:hover{
  background:color-mix(in srgb, var(--acc) 14%, var(--p-paper2))}
table.timetbl thead th{color:#fff}
table.timetbl thead th:nth-child(1){box-shadow:inset 0 -4px 0 #ff2f7e}
table.timetbl thead th:nth-child(2){box-shadow:inset 0 -4px 0 #19c8ff}
table.timetbl thead th:nth-child(3){box-shadow:inset 0 -4px 0 #ffd23f}
table.timetbl thead th:nth-child(4){box-shadow:inset 0 -4px 0 #2fbf71}
table.timetbl thead th:nth-child(5){box-shadow:inset 0 -4px 0 #ff8c2e}
table.timetbl tbody td:first-child{font-family:'Hanken Grotesk',sans-serif;font-weight:800;
  font-size:1.05rem;line-height:1;color:#101418;text-align:center;min-width:46px;
  border-right:2px dashed var(--line2)}
table.timetbl tbody tr:nth-child(5n+1) td:first-child{background:#ff9dbd}
table.timetbl tbody tr:nth-child(5n+2) td:first-child{background:#8fd8ff}
table.timetbl tbody tr:nth-child(5n+3) td:first-child{background:#93e9b8}
table.timetbl tbody tr:nth-child(5n+4) td:first-child{background:#ffc08a}
table.timetbl tbody tr:nth-child(5n) td:first-child{background:#c9b6ff}
/* ---------- POCIAG: numery dni + pigułki planów ---------- */
.day .day-num{font-family:'Hanken Grotesk',sans-serif!important;font-weight:800!important;
  font-size:1.7rem!important;line-height:1!important;color:#101418!important;
  display:inline-flex;align-items:center;justify-content:center;min-width:52px;min-height:48px;
  padding:6px 10px;transform:rotate(-6deg);
  clip-path:polygon(10% 12%,94% 0,100% 86%,4% 100%);
  box-shadow:none;text-shadow:none;background:#ffd23f}
.day:nth-of-type(5n+1) .day-num{background:#ff9dbd}
.day:nth-of-type(5n+2) .day-num{background:#8fd8ff}
.day:nth-of-type(5n+3) .day-num{background:#93e9b8}
.day:nth-of-type(5n+4) .day-num{background:#ffc08a}
.day:nth-of-type(5n) .day-num{background:#c9b6ff}
.day-head{border-bottom:2px dashed var(--line2)!important;padding-bottom:8px}
.planlink a{border:2px solid var(--p-ink)!important}
/* ---------- ROWER jak kulinarne: statystyki i profil ---------- */
.stat{border:2px solid var(--p-ink)!important;border-radius:14px!important;background:var(--p-paper2);
  box-shadow:3px 4px 0 rgba(30,53,80,.14)!important}
.elevbox,.statgrid{border-radius:18px}
.elevbox{border:2.5px solid var(--p-ink)!important;background:var(--p-paper2);
  box-shadow:5px 6px 0 rgba(30,53,80,.14)!important;overflow:hidden}
/* ---------- KAMERY: lista lokalizacji + chipy ---------- */
#tiles>*{background:var(--p-paper2)!important;border:2.5px solid var(--p-ink)!important;
  border-radius:16px!important;box-shadow:4px 5px 0 rgba(30,53,80,.16)!important;
  transition:.15s;position:relative;text-align:left}
#tiles>*:hover{transform:translateY(-4px);border-color:var(--acc)!important;
  box-shadow:6px 8px 0 color-mix(in srgb, var(--acc) 55%, transparent)!important}
#tiles>* small{opacity:.75}
#tiles>*{overflow:hidden}
#tiles>*::before{content:"";position:absolute;left:10px;top:-6px;width:6px;height:46px;
  background:var(--acc);transform:rotate(9deg);border-radius:4px;opacity:.95;pointer-events:none}
#tiles>*:nth-child(5n+1)::before{background:#ff2f7e}
#tiles>*:nth-child(5n+2)::before{background:#19c8ff}
#tiles>*:nth-child(5n+3)::before{background:#ffb020}
#tiles>*:nth-child(5n+4)::before{background:#2fbf71}
#tiles>*:nth-child(5n)::before{background:#ff8c2e}
#tiles>*:nth-child(odd){transform:rotate(-.35deg)}
#tiles>*:nth-child(even){transform:rotate(.3deg)}
.camchips>*{background:#fff!important;border:2px solid var(--p-ink)!important;color:var(--p-ink)!important;
  border-radius:30px!important;font-weight:700!important;box-shadow:2px 3px 0 rgba(30,53,80,.2)!important}
.camchips>*.on, .camchips>*:hover{border-color:var(--acc)!important}
/* ---------- BANERY WŁASNE: ramka jak kafle na trip ---------- */
img[src$="fazafm-banner.webp"], img[src$="hrubek.jpeg"], img[src$="trip-promo.jpg"]{
  border:2.5px solid var(--p-ink)!important;border-radius:20px!important;
  box-shadow:5px 6px 0 rgba(30,53,80,.16)!important}
img[src$="blog.jpeg"]{border:2.5px solid var(--p-ink)!important;border-radius:50%!important;
  box-shadow:5px 6px 0 rgba(30,53,80,.16)!important}
/* ---------- REKLAMY: tylko wyśrodkowanie, zero ingerencji w style Google ---------- */
.ad-guide{text-align:center}
.ad-guide ins.adsbygoogle{margin-left:auto!important;margin-right:auto!important}

/* koliber: przyciski w koncepcji (stare kolory won) */
.kol-cta{background:#0f1216!important;border:2.5px solid #fff!important;color:#fff!important;
  border-radius:30px!important;box-shadow:3px 4px 0 rgba(0,0,0,.45)!important;
  text-transform:uppercase;font-size:.72rem!important;letter-spacing:.05em}
.kol:hover .kol-cta, .kol-cta:hover{background:#0f1216!important;border-color:var(--acc)!important;color:var(--gy)!important}
.kol-chips>*{background:#fff!important;border:2px solid var(--p-ink)!important;color:var(--p-ink)!important;
  border-radius:30px!important;font-weight:700!important;box-shadow:2px 3px 0 rgba(30,53,80,.2)!important}
/* koliber: wstazka+pinezka po PRAWEJ, zadnego ucinania liter */
.kol-p{overflow:visible!important;border-radius:14px!important}
.kol-p::before{left:auto!important;right:18px!important;top:8px!important;height:44px!important}
.kol-p::after{left:auto!important;right:8px!important;top:2px!important}
.kol-n,.kol-cta{position:relative;z-index:3}
/* v21: wstazki+pinezki takze na kartach Parkingi/Lowiska/Campingi/Imprezy.
   Po PRAWEJ stronie karty — z lewej siedzi numerek i badge, lewa wstazka
   by je zaslaniala (ten sam problem co kiedys w kolibrze). */
:is(.pk-card,.tk-card)::before{left:auto;right:16px}
:is(.pk-card,.tk-card)::after{left:auto;right:7px}
/* ---------- POCIAG mobile + daynav bez przyklejania ---------- */
.daynav{position:static!important;top:auto!important}
.daynav-in{justify-content:center}
@media (max-width:760px){
  .section table, table.timetbl{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;
    white-space:nowrap;max-width:100%;box-shadow:4px 5px 0 rgba(30,53,80,.14)}
  .section table thead th, table.timetbl thead th{font-size:.62rem;padding:9px 10px}
  .section table tbody td, table.timetbl tbody td{font-size:.82rem;padding:8px 10px}
  .day{margin-left:0;margin-right:0}
  .day .day-num{min-width:44px;min-height:40px;font-size:1.4rem!important}
  .pagechips .pc-in, .ph-menu, .daynav-in{justify-content:center}
}

/* ---------- MENU mobile: male pigulki, zawijanie, oddech na dole hero ---------- */
@media (max-width:600px){
  .ph-menu{flex-wrap:wrap!important;gap:7px;row-gap:8px}
  .ph-menu a{font-size:.68rem;padding:6px 10px;gap:4px}
  #phero{padding-bottom:52px}
  .pc-in a, .pc-in .fact, .pc-in span{font-size:.7rem;padding:6px 10px}
}

/* ---------- v27: CYFRA KATALOGU vs WSTĄŻKA NAROŻNA ----------
   W przewodnikach miejskich (Majorka/Teneryfa itd.) kolorowa wstążka
   narożna karty zasłaniała numer .card-no (screen Kamila 22.07 01:03).
   Wstążka ZOSTAJE na miejscu — odsuwamy sam numer w prawo.
   Reguła globalna: jeden CSS naprawia wszystkie pliki miast. */
.card-top .card-no{margin-left:18px}

/* ---------- v29: PASTELE — kolorowe bloki per strona (wzor: promocje bankowe) ----------
   Scope przez klasy na <body> dokladane patchem v29:
   .pstl (kamery/drony/campery/lowiska/imprezy/kulinarne/szlaki-hub/rower-hub)
   .pstl-kam (kamery kafelki), .pstl-k (kulinarne), .pstl-p (pociag: motyw biletu).
   Parkingi, hotele, plany, trip — BEZ zmian (brak klas). */
.pstl .tk-card:nth-of-type(6n+1),.pstl .card:nth-of-type(6n+1),.pstl .rcard:not(.adcard):not(.imgcard):nth-of-type(6n+1){background:#ffe3ee}
.pstl .tk-card:nth-of-type(6n+2),.pstl .card:nth-of-type(6n+2),.pstl .rcard:not(.adcard):not(.imgcard):nth-of-type(6n+2){background:#ffe9db}
.pstl .tk-card:nth-of-type(6n+3),.pstl .card:nth-of-type(6n+3),.pstl .rcard:not(.adcard):not(.imgcard):nth-of-type(6n+3){background:#e1f3ff}
.pstl .tk-card:nth-of-type(6n+4),.pstl .card:nth-of-type(6n+4),.pstl .rcard:not(.adcard):not(.imgcard):nth-of-type(6n+4){background:#e3fbe9}
.pstl .tk-card:nth-of-type(6n+5),.pstl .card:nth-of-type(6n+5),.pstl .rcard:not(.adcard):not(.imgcard):nth-of-type(6n+5){background:#fff6d5}
.pstl .tk-card:nth-of-type(6n+6),.pstl .card:nth-of-type(6n+6),.pstl .rcard:not(.adcard):not(.imgcard):nth-of-type(6n+6){background:#efe7ff}
/* kamery: mozaika kafelkow "Wszystkie lokalizacje" — bazowy styl kafelka
   to #tiles>* z !important, wiec pastele musza go przebic ta sama bronia */
.pstl-kam #tiles>*:nth-child(6n+1){background:#ffe3ee!important}
.pstl-kam #tiles>*:nth-child(6n+2){background:#ffe9db!important}
.pstl-kam #tiles>*:nth-child(6n+3){background:#e1f3ff!important}
.pstl-kam #tiles>*:nth-child(6n+4){background:#e3fbe9!important}
.pstl-kam #tiles>*:nth-child(6n+5){background:#fff6d5!important}
.pstl-kam #tiles>*:nth-child(6n+6){background:#efe7ff!important}
/* kamery: mini-wstazka kafelka (#tiles>*::before, left:10px) nachodzila na ikonki
   ▶/↗ — tekst kafelka w prawo, wstazka dostaje swoj pas (globalnie, nie tylko pstl) */
#tiles>*{padding-left:27px}
/* kulinarne: napis odsuniety od wstazki naroznej (analogia v27) */
.pstl-k .rcard > :first-child{margin-left:20px}
.pstl-k .rcard.adcard > :first-child,.pstl-k .rcard.imgcard > :first-child{margin-left:0}
/* kulinarne: karty-reguly (.rule — "Co zjesc na trasie", "Zasady gry") tez maja
   lewa wstazke+pinezke z rodziny v21 nachodzaca na ikonki — caly tekst w prawo */
.pstl-k .rule{padding-left:46px}
/* pociag: BILET KOLEJOWY — pastelowe dni + perforacja + kasownik */
.pstl-p .day{position:relative;overflow:hidden}
.pstl-p .day:nth-of-type(6n+1){background:#ffe3ee}
.pstl-p .day:nth-of-type(6n+2){background:#e1f3ff}
.pstl-p .day:nth-of-type(6n+3){background:#fff6d5}
.pstl-p .day:nth-of-type(6n+4){background:#e3fbe9}
.pstl-p .day:nth-of-type(6n+5){background:#ffe9db}
.pstl-p .day:nth-of-type(6n+6){background:#efe7ff}
.pstl-p .day::before{content:"";position:absolute;left:13px;top:6px;bottom:6px;border-left:3px dashed rgba(21,36,31,.33);pointer-events:none}
.pstl-p .day::after{content:"🎫";position:absolute;top:10px;right:14px;font-size:21px;opacity:.5;transform:rotate(9deg);pointer-events:none}

/* ---------- ROTATOR na podstronach ---------- */
#trip-rotator a{border:2.5px solid var(--p-ink)!important;border-radius:18px!important;
  box-shadow:6px 7px 0 rgba(30,53,80,.2)!important;transition:.15s}
#trip-rotator a:hover{transform:translateY(-3px)}
#rot-dots button{border:2px solid var(--p-ink)!important;border-radius:0!important;transform:rotate(45deg);
  box-shadow:1px 2px 0 rgba(30,53,80,.3)}

/* ---------- v25: ROZNORODNOSC NA MOBILE ----------
   Na webie kazda podstrona rozni sie akcentem (--acc) i buzka Picassa;
   ponizej 900px buzka byla chowana i strony wygladaly identycznie.
   Teraz mobile dostaje: MINI-portret w prawym gornym rogu hero (wlosy
   pf-hr sa w kolorze strony), kicker w akcencie, podkreslenie w tytule,
   wiekszy odlamek akcentu i ramke backhome. Desktop >=900px NIETKNIETY.
   UWAGA: blok musi zostac na KONCU pliku (kolejnosc kaskady). */
@media (max-width:900px){
  .pf-face{display:block;left:auto;right:6px;top:8px;
    transform:scale(.38);transform-origin:top right;opacity:.95;z-index:2;pointer-events:none}
  .ph-kick,.ph-h1{position:relative;z-index:3}
  /* v26: dlugi kicker lamal sie az do prawej krawedzi i ZASLANIAL mini-buzke
     (screeny Kamila 21.07: parkingi/campingi/imprezy/lowiska/pociag).
     margin-right rezerwuje strefe buzki — tekst zawija sie wczesniej,
     krotkie kickery (kamery/hotele/kulinarne) wygladaja jak dotad. */
  .ph-kick{background:var(--acc);margin-right:94px}
  .ph-h1{padding-right:84px}
  .ph-h1 span{box-shadow:inset 0 -12px 0 color-mix(in srgb, var(--acc) 45%, transparent)}
  .ph-sh.b{right:-14%;top:-8%;width:56%;height:46%;opacity:.7}
  .backhome{border-color:var(--acc)}
}

/* v35: buźka u góry hero + REZERWA WYSOKOŚCI — twarz kończy się 276px od góry
   (top 26 + wys. 250), hero ma padding-top 36, więc min-height treści 268px
   z wstążką dopchniętą na dół (margin-top:auto) daje start wstążki >=304px:
   kolizja geometrycznie niemożliwa przy dowolnej długości opisu i liczbie rzędów.
   Scope desktop; mobile ma własną miniaturę twarzy. */
@media (min-width:901px){
  #phero .pf-face{top:26px;transform:translateY(0)}
  #phero .ph-in{min-height:268px;display:flex;flex-direction:column;align-items:stretch}
  #phero .ph-menu{margin-top:auto;padding-top:18px}
}

/* v37: auto-reklamy AdSense wstrzykiwane w siatki kart lamaly uklad (zgnieciona sasiednia karta) — kazda auto-wstawka na pelna szerokosc w flex/grid/kolumnach */
.google-auto-placed{display:block!important;width:100%!important;max-width:100%!important;flex-basis:100%!important;grid-column:1/-1!important;column-span:all!important;float:none!important;margin:14px 0!important}
.google-auto-placed iframe{max-width:100%!important}

/* v38: rozszerzenie v37 — KAZDA jednostka reklamowa (nie tylko auto-placed) na pelna szerokosc;
   reklamy osadzane w kontenerach kolumnowych/siatkach gniotly sasiednie karty (screen mobile Bory) */
ins.adsbygoogle{display:block!important;width:100%!important;max-width:100%!important;flex-basis:100%!important;grid-column:1/-1!important;column-span:all!important;float:none!important;break-inside:avoid-column}
ins.adsbygoogle iframe{max-width:100%!important}

/* NKM-ORDER-KUCHNIA */
.ph-menu a[href*="kuchnia.html"]{order:17}
.ph-menu a[href*="promocjebankowe.html"]{order:18}
.ph-menu a[href*="kamery.html"]{order:19}

/* WYC-MENU18 start --- wstazka 18 pozycji, dopisane przez patch_menu_18.php.
   Cofniecie = skasowanie wszystkiego od tej linii do znacznika WYC-MENU18 end.
   Nie ruszam starszych regul order - te ponizej sa dalej w pliku, wiec wygrywaja. */
.ph-menu a[href*="trip.html"]{order:1}
.ph-menu a[href*="rower.html"]{order:2}
.ph-menu a[href*="szlaki.html"]{order:3}
.ph-menu a[href^="szlaki-"]{order:3}
.ph-menu a[href*="pociag.html"]{order:4}
.ph-menu a[href*="kulinarne.html"]{order:5}
.ph-menu a[href*="kuchnia.html"]{order:6}
.ph-menu a[href*="hotele.html"]{order:7}
.ph-menu a[href*="parkingi.html"]{order:8}
.ph-menu a[href*="loty.html"]{order:9}
.ph-menu::after{order:10}
.ph-menu a[href*="lowiska.html"]{order:11}
.ph-menu a[href*="campery.html"]{order:12}
.ph-menu a[href*="sport.html"]{order:13}
.ph-menu a[href*="imprezy.html"]{order:14}
.ph-menu a[href*="wydarzenia.html"]{order:15}
.ph-menu a[href*="drony.html"]{order:16}
.ph-menu a[href*="wycieczkowce.html"]{order:17}
.ph-menu a[href*="promocjebankowe.html"]{order:18}
.ph-menu a[href*="kamery.html"]{order:19}
/* WYC-MENU18 end */


/* ==== v42: WARSTWA SERWISOWA WSPOLNA (motyw_serwis.php) ==== */
*{box-sizing:border-box;margin:0;padding:0}
:root{--paper:#eef2f5;--paper2:#fbfcfe;--ink:#14212e;--ink2:#3c4c5c;--muted:#7d8b98;--line:#dbe3ea;--line2:#c8d4de;--navy:#1b3a5c;--navy-d:#122942;--gold:#c08a2e;--bkblue:#0071c2}
body{font-family:'Hanken Grotesk',sans-serif;background:var(--paper);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased}
body{top:0!important}
.section{max-width:1080px;margin:0 auto;padding:0 22px}
.section h2{font-family:'Fraunces',serif;font-size:clamp(1.35rem,3.4vw,2rem);font-weight:900;margin:44px 0 6px}
.section h2 span{font-style:italic;font-weight:500;color:var(--navy)}
.coffee{margin-top:44px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:linear-gradient(120deg,#fff6df 0%,#fdeecb 100%);border:1px solid #ecd9a6;border-left:6px solid #c69a3e;border-radius:18px;padding:20px 22px}
.coffee-ico{font-size:2.5rem;line-height:1}
.coffee-txt{flex:1;min-width:210px}
.coffee-h{font-family:'Fraunces',serif;font-size:1.3rem;font-weight:600;color:#2a2118}
.coffee-s{font-size:.92rem;color:#6a5f50;margin-top:4px}
.coffee-btn{display:inline-block;line-height:0;border-radius:12px}
.coffee-img{display:block;width:230px;max-width:100%;height:auto;border-radius:12px}
.ad-guide{display:none}
body.ads-on .ad-guide{display:block}
.ad-label{display:block;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:#93a2b0;margin-bottom:4px}
.cc-banner{position:fixed;left:0;right:0;bottom:0;z-index:1300;background:#0e1c2b;color:#e9eff5;padding:13px 18px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center;box-shadow:0 -10px 30px -16px rgba(0,0,0,.55);font-size:.85rem;line-height:1.45}
.cc-banner a{color:#e8c377;text-decoration:underline}
.cc-txt{max-width:740px}
.cc-btns{display:flex;gap:10px;flex-wrap:wrap}
.cc-banner button{font-family:inherit;font-weight:700;font-size:.84rem;padding:9px 16px;border-radius:10px;cursor:pointer;border:0}
.cc-no{background:transparent;color:#e9eff5;border:1px solid rgba(255,255,255,.4)}
.cc-yes{background:#c08a2e;color:#fff}
/* jednostki widoczne od startu (AdSense nie wypelnia display:none); chowamy dopiero po odpowiedzi unfilled — gotowiec z hrubek.pl */
.ad-guide:has(ins[data-ad-status="unfilled"]){display:none}
.gridfill:has(ins[data-ad-status="unfilled"]){display:none}
.trip-banner{display:block;max-width:1040px;margin:48px auto 0;padding:0 22px;line-height:0;box-sizing:border-box}
.trip-banner img{display:block;width:100%;height:auto;border-radius:18px;box-shadow:0 18px 40px -28px rgba(0,0,0,.45)}
.trip-banner:hover img{filter:brightness(1.03)}