@charset "UTF-8";
/* ==========================================================================
   PS Transport i Przeprowadzki TORUŃ - style.css
   Ultra-lekki arkusz (ok. 9 KB), mobile-first, systemowe fonty (zero żądań
   zewnętrznych = szybkie LCP/CLS). Kolory można zmienić w :root.
   ========================================================================== */

:root{
  /* --kolor-glowny i --kolor-akcent ustawia panel CMS (Ustawienia -> Wygląd) */
  --granat:var(--kolor-glowny,#10375c);
  --granat-ciemny:#0a2440;
  --pomarancz:var(--kolor-akcent,#c44f00);
  --pomarancz-ciemny:#9f3d00;
  --ciemny:#12212e;
  --szary:#f4f6f8;
  --szary-ciemny:#dfe5ea;
  --tekst:#23303c;
  --bialy:#fff;
  --cien:0 2px 10px rgba(10,36,64,.08);
  --promien:12px;
  --maxw:1180px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{
  margin:0;
  font:400 17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--tekst);background:var(--bialy);
  padding-bottom:76px; /* miejsce na sticky CTA (mobile) */
}
img{max-width:100%;height:auto;display:block}
a{color:var(--granat);text-decoration:none}
a:hover{color:var(--pomarancz-ciemny)}
h1,h2,h3,h4{line-height:1.2;margin:0 0 .5em;color:var(--granat-ciemny);font-weight:800;letter-spacing:-.01em}
h1{font-size:clamp(1.8rem,5.2vw,3.1rem)}
h2{font-size:clamp(1.45rem,3.4vw,2.2rem)}
h3{font-size:clamp(1.1rem,2.2vw,1.3rem)}
p{margin:0 0 1em}
ul{margin:0 0 1em;padding-left:1.1em}
.kontener{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 20px}
.srodek{text-align:center}

/* ---------- Nagłówek / menu ---------- */
.naglowek{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.97);box-shadow:0 1px 0 var(--szary-ciemny)}
.naglowek-wewn{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 20px}
.logo img{width:auto;height:56px;object-fit:contain}
.menu{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.menu a{font-weight:600;font-size:.95rem;color:var(--granat)}
.menu-profil{font-size:.85rem!important;color:#5b6b7a!important;font-weight:500!important}
.menu-przelacznik{display:none}
.menu-hamburger{display:none;width:44px;height:44px;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.menu-hamburger span{display:block;width:26px;height:3px;background:var(--granat);border-radius:2px}

/* ---------- Przyciski ---------- */
.przycisk{
  display:inline-block;padding:14px 22px;border-radius:var(--promien);
  background:var(--pomarancz);color:#fff!important;font-weight:800;font-size:1rem;
  text-align:center;border:2px solid var(--pomarancz);transition:transform .12s ease,background .2s ease;
}
.przycisk:hover{background:var(--pomarancz-ciemny);border-color:var(--pomarancz-ciemny);transform:translateY(-1px)}
.przycisk-maly{padding:9px 14px;font-size:.9rem;border-radius:8px}
.przycisk-duzych{padding:16px 28px;font-size:1.05rem}
.przycisk-obramowany{background:transparent;color:var(--granat)!important;border-color:var(--granat)}
.przycisk-obramowany:hover{background:var(--granat);color:#fff!important}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:10px;top:10px;z-index:200;background:#fff;padding:10px;border-radius:8px}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:min(78vh,660px);background:var(--granat-ciemny);overflow:hidden}
.hero-tlo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.55}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(10,36,64,.95) 20%,rgba(10,36,64,.72) 60%,rgba(10,36,64,.45) 100%)}
.hero-wewn{padding:56px 20px}
.hero-tresc{max-width:780px;color:#fff}
.hero-tresc h1{color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.hero-sub{font-size:clamp(1.02rem,2.2vw,1.25rem);color:#eaf1f8;margin-bottom:18px}
.hero-etykiety{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-wrap:wrap;gap:10px}
.hero-etykiety li{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);color:#fff;padding:7px 13px;border-radius:999px;font-size:.9rem;font-weight:600}
.hero-przyciski{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.hero-miasto{min-height:min(62vh,520px)}
.okruszki{font-size:.9rem;margin-bottom:14px;color:#c8d8e6}
.okruszki a{color:#fff;text-decoration:underline}

/* ---------- Sekcje ---------- */
.sekcja{padding:clamp(46px,7vw,84px) 0}
.sekcja-jasna{background:var(--szary)}
.nadtytul{text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:800;color:var(--pomarancz-ciemny);margin-bottom:6px}
.lead{font-size:1.08rem;max-width:70ch;color:#40525f}
.seo-tekst{max-width:78ch}
.karta{background:#fff;border:1px solid var(--szary-ciemny);border-radius:var(--promien);padding:22px;box-shadow:var(--cien)}
.siatka{display:grid;gap:20px}
.siatka-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.siatka-4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.karta h3{margin-top:0}
.uslugi-siatka .karta-usluga{padding:0;overflow:hidden;display:flex;flex-direction:column}
.karta-usluga img{width:100%;height:190px;object-fit:cover}
.karta-tresc{padding:20px}
.dzielnice,.fakty{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.dzielnice li,.fakty li{background:#fff;border:1px solid var(--szary-ciemny);border-radius:999px;padding:8px 16px;font-size:.93rem}
.sekcja-jasna .dzielnice li,.sekcja-jasna .fakty li{background:#fff}

/* ---------- Formularz ---------- */
.formularz-sekcja{background:var(--granat);color:#fff}
.formularz-sekcja h2,.formularz-sekcja .nadtytul{color:#fff}
.formularz-sekcja .nadtytul{color:#ffc182}
.formularz-siatka{display:grid;gap:32px;grid-template-columns:1fr}
.formularz-tekst .lead{color:#d8e6f2}
.formularz-telefon{font-size:1.15rem;font-weight:700}
.formularz-telefon a{color:#ffc182}
.formularz{background:#fff;border-radius:var(--promien);padding:22px;box-shadow:0 10px 30px rgba(0,0,0,.18);color:var(--tekst)}
.formularz .pole{margin-bottom:14px;display:flex;flex-direction:column}
.formularz label{font-weight:700;font-size:.9rem;margin-bottom:6px}
.formularz input[type=text],.formularz input[type=tel],.formularz select,.formularz textarea{
  font:inherit;padding:12px 14px;border:1px solid var(--szary-ciemny);border-radius:8px;background:#fbfcfd;width:100%
}
.formularz input:focus,.formularz select:focus,.formularz textarea:focus{outline:2px solid var(--pomarancz);border-color:var(--pomarancz)}
.formularz .zgoda label{font-weight:400;font-size:.88rem}
.formularz button[type=submit]{width:100%;margin-top:6px}
.pole-ukryte{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.komunikat{border-radius:var(--promien);padding:20px;font-weight:600}
.komunikat-ok{background:#e8f7ee;border:1px solid #b6e3c6;color:#14663a}
.komunikat-blad{background:#fdeceb;border:1px solid #f5c2bd;color:#8c1c14}
.dziekujemy .formularz-tekst{display:none}

/* ---------- Galeria ---------- */
.galeria-siatka{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.galeria-kafelek{margin:0;border-radius:10px;overflow:hidden;background:var(--szary-ciemny)}
.galeria-kafelek img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4;transition:transform .25s ease}
.galeria-kafelek img:hover{transform:scale(1.03)}

/* ---------- Opinie ---------- */
.gwiazdki{color:#f5a623;font-size:1.15rem;margin:0 0 6px;letter-spacing:2px}
.opinia blockquote{margin:0 0 12px;font-style:italic}
.opinia-autor{display:flex;flex-direction:column;font-size:.9rem;margin:0}
.opinia-autor span{color:#6b7b8a;font-size:.82rem}

/* ---------- Kafelki miast - linkowanie wewnętrzne (SEO) ---------- */
.linki-miast-tytul{margin-top:1.6em}
.linki-miast{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin:0}
.kafelek-miasta{
  display:flex;flex-direction:column;gap:3px;padding:12px 15px;background:#fff;
  border:1px solid var(--szary-ciemny);border-left:3px solid var(--pomarancz);border-radius:10px;
  font-weight:700;font-size:.95rem;line-height:1.3;color:var(--granat-ciemny);
  transition:background .18s ease,color .18s ease,border-color .18s ease;
}
.kafelek-miasta small{font-weight:500;font-size:.78rem;color:#6b7b8a}
.kafelek-miasta:hover{background:var(--granat);border-color:var(--granat);color:#fff}
.kafelek-miasta:hover small{color:#c8d8e6}
.kafelek-baza{border-left-color:var(--granat)}
.stopka-col-miasta{grid-column:1/-1}
.stopka .kafelek-miasta{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2);border-left-color:var(--pomarancz);color:#eaf1f8}
.stopka .kafelek-miasta small{color:#9fb3c6}
.stopka .kafelek-miasta:hover{background:var(--pomarancz);border-color:var(--pomarancz);color:#fff}
.stopka .kafelek-miasta:hover small{color:#fff}
.cena-od{font-size:1.05rem}

/* ---------- FAQ ---------- */
.faq{border-left:4px solid var(--pomarancz);padding:4px 0 4px 18px;margin-bottom:22px}
.faq h3{margin-bottom:.25em}
.faq p{margin:0;color:#40525f}

/* ---------- CTA ---------- */
.sekcija-cta{padding:0}
.cta-box{background:var(--granat);color:#fff;border-radius:var(--promien);padding:32px;display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:space-between;box-shadow:0 12px 30px rgba(10,36,64,.18)}
.cta-box h2{color:#fff;margin-bottom:.3em}
.cta-box p{margin:0;color:#d8e6f2}

/* ---------- Stopka ---------- */
.stopka{background:var(--granat-ciemny);color:#c9d8e6;padding:56px 0 0;font-size:.95rem}
.stopka h2,.stopka h3{color:#fff}
.stopka a{color:#c9d8e6}
.stopka a:hover{color:var(--pomarancz)}
.stopka-siatka{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));padding-bottom:32px}
.stopka-logo img{height:52px;width:auto;background:#fff;border-radius:8px;padding:6px;margin-bottom:14px}
.stopka address{font-style:normal;margin-bottom:14px;line-height:1.8}
.stopka .tel{color:#fff;font-weight:800}
.stopka-mapa{padding-bottom:28px}
.mapa-link{display:block;position:relative;border-radius:var(--promien);overflow:hidden;max-width:520px}
.mapa-link img{width:100%;height:200px;object-fit:cover}
.mapa-link span{position:absolute;left:0;right:0;bottom:0;background:rgba(10,36,64,.88);color:#fff;padding:10px 14px;font-weight:700;text-align:center}
.stopka-dol{border-top:1px solid rgba(255,255,255,.14);padding:18px 20px;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;font-size:.85rem}

/* ---------- Sticky CTA (mobile) ---------- */
.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:80;display:flex;gap:8px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.97);box-shadow:0 -2px 14px rgba(10,36,64,.18);
}
.sticky-cta a{flex:1 1 0;text-align:center;padding:16px 10px;border-radius:10px;font-weight:900;font-size:1.02rem;letter-spacing:.02em}
.sticky-zadzwon{background:var(--pomarancz);color:#fff;box-shadow:0 4px 12px rgba(255,122,0,.35);animation:puls 2.6s ease-in-out infinite}
.sticky-wycena{background:var(--granat);color:#fff}
@keyframes puls{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}

/* ---------- Karta logowania (ekran /admin i okno CMS) ---------- */
.logowanie-ekran{
  background:#eef2f6;display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;
  background-image:radial-gradient(circle at 15% 15%,rgba(255,122,0,.10),transparent 45%),
                   radial-gradient(circle at 85% 85%,rgba(16,55,92,.12),transparent 45%);
}
.logowanie{
  position:relative;background:#fff;border-radius:16px;overflow:hidden;width:100%;max-width:400px;
  box-shadow:0 22px 60px rgba(10,36,64,.28);border:1px solid rgba(10,36,64,.07);
}
.logowanie-glowa{
  background:linear-gradient(135deg,#0a2440 0%,#10375c 60%,#17497a 100%);
  padding:20px 28px 18px;text-align:center;border-bottom:3px solid var(--pomarancz);
}
.logowanie-glowa img{
  height:46px;width:auto;margin:0 auto 10px;background:#fff;border-radius:8px;padding:6px 10px;display:block;
}
.logowanie-glowa span{
  display:block;color:#c8d8e6;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
}
.logowanie-tresc{padding:24px 28px 28px}
.logowanie h1{font-size:1.3rem;margin:0 0 3px}
.logowanie .logowanie-firma{margin:0 0 18px;color:#5b6b7a;font-size:.92rem}
.logowanie label{display:block;font-weight:700;font-size:.82rem;margin-bottom:6px;color:#40525f}
.logowanie input[type=password]{
  width:100%;padding:14px;border:1px solid var(--szary-ciemny);border-radius:10px;font:inherit;margin-bottom:16px;
  background:#fbfcfd;transition:border-color .15s ease,box-shadow .15s ease;
}
.logowanie input[type=password]:focus{
  outline:none;border-color:var(--pomarancz);box-shadow:0 0 0 3px rgba(255,122,0,.18);background:#fff;
}
.logowanie button[type=submit]{width:100%;border-radius:10px;letter-spacing:.01em}
.logowanie .pomoc{font-size:.78rem;color:#6b7b8a;margin:16px 0 0;line-height:1.55}
.logowanie code{background:#eef2f6;padding:2px 6px;border-radius:4px;font-size:.95em}
.cms-modal-status{font-size:.85rem;min-height:1.2em;margin:0 0 12px;color:#8c1c14}
.cms-modal-status.ok{color:#14663a;font-weight:700}
.logowanie-link-pomoc{display:block;margin-top:14px;text-align:center}

/* ---------- Ukryte okno logowania do CMS ---------- */
.cms-modal{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:20px}
.cms-modal[hidden]{display:none}
.cms-modal-tlo{position:absolute;inset:0;background:rgba(8,22,38,.74)}
.cms-modal > .logowanie{box-shadow:0 26px 60px rgba(0,0,0,.45);animation:modalWejscie .18s ease-out}
@keyframes modalWejscie{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.cms-modal-zamknij{
  position:absolute;top:8px;right:12px;background:none;border:0;font-size:1.7rem;line-height:1;
  cursor:pointer;color:#6b7b8a;padding:4px 8px
}
.cms-modal-zamknij:hover{color:var(--pomarancz-ciemny)}

/* ---------- RWD ---------- */
@media (max-width:900px){
  .menu-hamburger{display:flex}
  .menu{
    position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;
    gap:0;padding:10px 20px 20px;box-shadow:0 10px 20px rgba(10,36,64,.12);display:none
  }
  .menu a{padding:12px 0;border-bottom:1px solid var(--szary)}
  .menu .przycisk{margin-top:12px;border-bottom:0;text-align:center}
  .menu-przelacznik:checked ~ .menu{display:flex}
  .hero{min-height:auto}
  .hero-wewn{padding:40px 20px}
}
@media (min-width:901px){
  body{padding-bottom:0}
  .sticky-cta{display:none}
  .formularz-siatka{grid-template-columns:1fr 1fr;align-items:start}
}
@media (min-width:1200px){
  .galeria-siatka{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
}
@media print{
  .sticky-cta,.hero::after{display:none}
  body{padding-bottom:0}
}

/* ==========================================================================
   PANEL CMS v2 - układ z menu bocznym, KPI, wykresy (zero bibliotek)
   ========================================================================== */
.panel-body{background:#eef2f6;font-size:16px;padding-bottom:0}
.panel-body .sticky-cta{display:none}
.panel-top{background:var(--granat-ciemny);color:#fff}
.panel-top-wewn{max-width:1400px;margin:0 auto;padding:10px 18px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.panel-marka{display:flex;align-items:center;gap:12px;color:#fff}
.panel-marka img{width:42px;height:42px;object-fit:contain;background:#fff;border-radius:10px;padding:3px}
.panel-marka span{display:flex;flex-direction:column;line-height:1.15}
.panel-marka small{color:#9fb3c6;font-size:.75rem}
.panel-top-akcje{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

.panel-grid{max-width:1400px;margin:0 auto;padding:18px;display:grid;grid-template-columns:230px 1fr;gap:18px;align-items:start}
.panel-menu{position:sticky;top:12px;background:#fff;border-radius:14px;padding:12px;box-shadow:0 2px 10px rgba(10,36,64,.08)}
.panel-menu a{display:block;padding:11px 14px;border-radius:9px;color:#2b3a49;font-weight:600;font-size:.95rem}
.panel-menu a:hover{background:#eef2f6;color:var(--granat)}
.panel-menu a.aktywna{background:var(--granat);color:#fff}
.panel-menu-info{margin-top:14px;padding-top:12px;border-top:1px solid var(--szary-ciemny);display:grid;grid-template-columns:1fr 1fr;gap:8px}
.panel-menu-info p{margin:0}
.panel-menu-info strong{display:block;font-size:1.15rem;color:var(--granat)}
.panel-menu-info span{font-size:.7rem;color:#6b7b8a;line-height:1.2;display:block}

.panel-tresc{min-width:0}
.panel-tresc h1{font-size:1.6rem;margin:0 0 6px}
.panel-lead{color:#5b6b7a;margin:0 0 18px;max-width:80ch}
.panel-pomoc{font-size:.82rem;color:#6b7b8a}
.panel-pomoc code,.panel-tresc code{background:#e7ecf1;padding:2px 6px;border-radius:4px;font-size:.9em}
.panel-karta{background:#fff;border-radius:14px;padding:20px 22px;margin-bottom:18px;box-shadow:0 2px 10px rgba(10,36,64,.07)}
.panel-karta h2{font-size:1.12rem;margin:0 0 14px;padding-bottom:10px;border-bottom:2px solid var(--szary)}
.panel-karta h3{font-size:1rem;margin:18px 0 8px}
.panel-pozycja{border:1px solid var(--szary-ciemny);border-radius:10px;padding:14px;margin-bottom:12px;background:#fcfdfe}
.panel-dwie-kolumny{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.panel-akcje{display:flex;flex-wrap:wrap;gap:8px}
.panel-komunikat{border-radius:12px;padding:14px 18px;margin-bottom:16px;font-weight:600}
.panel-komunikat.ok{background:#e8f7ee;border:1px solid #b6e3c6;color:#14663a}
.panel-komunikat.blad{background:#fdeceb;border:1px solid #f5c2bd;color:#8c1c14}

.panel-tresc .pole{margin-bottom:14px}
.panel-tresc .pole label{display:block;font-weight:700;font-size:.82rem;margin-bottom:5px;color:#40525f}
.panel-tresc .pole input[type=text],.panel-tresc .pole input[type=password],.panel-tresc .pole input[type=email],
.panel-tresc .pole input[type=file],.panel-tresc .pole textarea,.panel-tresc .pole select{
  width:100%;padding:10px 12px;border:1px solid var(--szary-ciemny);border-radius:8px;font:inherit;background:#fbfcfd}
.panel-tresc .pole textarea{min-height:80px;resize:vertical}
.panel-tresc .pole input:focus,.panel-tresc .pole textarea:focus,.panel-tresc .pole select:focus{
  outline:none;border-color:var(--pomarancz);box-shadow:0 0 0 3px rgba(255,122,0,.16);background:#fff}
.panel-tresc .pole small{display:block;font-size:.75rem;color:#6b7b8a;margin-top:4px}
.panel-tresc .dwa{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pole-kolor input[type=color]{width:64px;height:42px;padding:2px;border:1px solid var(--szary-ciemny);border-radius:8px;background:#fff}
.pole-kolor code{margin-left:10px;font-size:.85rem}
.przelacznik{display:inline-flex;align-items:center;gap:7px;margin:0 14px 10px 0;font-size:.9rem;font-weight:600;color:#40525f}
.panel-przelaczniki{display:flex;flex-wrap:wrap;margin-top:6px}

/* KPI + wykres */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:18px}
.kpi{background:#fff;border-radius:14px;padding:16px 18px;box-shadow:0 2px 10px rgba(10,36,64,.07);border-left:4px solid var(--pomarancz)}
.kpi span{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;color:#6b7b8a;font-weight:700}
.kpi strong{display:block;font-size:2rem;line-height:1.1;color:var(--granat)}
.kpi small{color:#6b7b8a;font-size:.8rem}
.wykres{display:flex;align-items:flex-end;gap:3px;height:150px;padding:10px;background:#fbfcfd;border:1px solid var(--szary-ciemny);border-radius:10px}
.wykres-kolumna{flex:1 1 0;height:100%;display:flex;align-items:flex-end;cursor:default}
.wykres-slupek{width:100%;background:linear-gradient(180deg,var(--pomarancz),#e56a00);border-radius:3px 3px 0 0;min-height:2px;transition:opacity .15s ease}
.wykres-kolumna:hover .wykres-slupek{opacity:.75}
.pasek{display:block;width:100%;max-width:180px;height:8px;background:#eef2f6;border-radius:6px;overflow:hidden}
.pasek i{display:block;height:100%;background:var(--granat)}
.panel-lista{list-style:none;padding:0;margin:0}
.panel-lista li{padding:9px 0;border-bottom:1px solid var(--szary-ciemny)}
.panel-lista li:last-child{border-bottom:0}
.panel-lista small{color:#6b7b8a}

/* Tabele i galeria w panelu */
.panel-tresc .tabela{width:100%;border-collapse:collapse;font-size:.88rem}
.panel-tresc .tabela th,.panel-tresc .tabela td{border-bottom:1px solid var(--szary-ciemny);padding:8px 8px;text-align:left;vertical-align:top}
.panel-tresc .tabela th{font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:#6b7b8a}
.panel-tresc .tabela input,.panel-tresc .tabela textarea{width:100%;padding:6px 8px;border:1px solid var(--szary-ciemny);border-radius:6px;font:inherit;font-size:.85rem;background:#fbfcfd}
.panel-tresc .tabela textarea{min-height:52px;resize:vertical}
.tabela-miast td{min-width:130px}
.usun{background:none;border:0;color:#8c1c14;font-weight:700;font-size:.82rem;cursor:pointer;padding:4px 0;text-decoration:underline}
.galeria-admin{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.galeria-admin figure{margin:0;background:#f7f9fb;border:1px solid var(--szary-ciemny);border-radius:10px;padding:10px}
.galeria-admin img{width:100%;height:130px;object-fit:cover;border-radius:6px;margin-bottom:8px;background:#fff}
.galeria-admin input[type=text]{width:100%;font-size:.8rem;padding:6px;border:1px solid var(--szary-ciemny);border-radius:6px}
.galeria-admin .mini{display:flex;align-items:center;gap:6px;font-size:.76rem;margin-top:7px;color:#40525f}
.galeria-admin .mini.usun{color:#8c1c14;font-weight:700}
.galeria-admin small{display:block;font-size:.7rem;color:#8a99a8;margin-top:6px;word-break:break-all}
.galeria-logo img{height:110px;object-fit:contain}
.galeria-logo input[type=file]{margin-top:8px;font-size:.75rem}

@media (max-width:900px){
  .panel-grid{grid-template-columns:1fr;padding:12px}
  .panel-menu{position:static;display:flex;flex-wrap:wrap;gap:6px}
  .panel-menu a{padding:9px 12px;font-size:.88rem}
  .panel-menu-info{grid-template-columns:repeat(4,1fr);width:100%}
  .panel-dwie-kolumny,.panel-tresc .dwa{grid-template-columns:1fr}
  .panel-tresc .tabela{display:block;overflow-x:auto;white-space:nowrap}
}

/* ==========================================================================
   MINIMALISTYCZNE ANIMACJE (szanujemy prefers-reduced-motion)
   ========================================================================== */
@keyframes psWejscieGora{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes psPrzyblizenie{from{transform:scale(1.07)}to{transform:scale(1)}}

@media (prefers-reduced-motion: no-preference){
  .animacja{
    opacity:0;transform:translateY(18px);
    transition:opacity .6s cubic-bezier(.22,.61,.36,1),transform .6s cubic-bezier(.22,.61,.36,1);
  }
  .animacja.pokaz{opacity:1;transform:none}
  .hero-tresc{animation:psWejscieGora .8s ease-out both}
  .hero-tlo{animation:psPrzyblizenie 1.8s ease-out both}
  .karta,.kafelek-miasta,.galeria-kafelek,.cta-box{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
  .karta:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(10,36,64,.12)}
  .galeria-kafelek:hover{transform:translateY(-2px)}
  .naglowek{transition:box-shadow .25s ease}
  .przycisk{transition:transform .12s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease}
  .dzielnice li,.fakty li,.hero-etykiety li{transition:transform .15s ease,border-color .15s ease}
  .dzielnice li:hover,.fakty li:hover{transform:translateY(-2px)}
}

/* ---------- Dwa numery telefonu obok siebie ---------- */
.cta-przyciski{display:flex;flex-wrap:wrap;gap:12px}
.hero-przyciski,.hero-przyciski .przycisk{margin:0}
.stopka .tel{white-space:nowrap}
.menu .przycisk-maly{white-space:nowrap}
.sticky-cta a{
  flex:1 1 0;display:flex;flex-direction:column;justify-content:center;gap:1px;
  text-align:center;padding:11px 6px;border-radius:10px;font-weight:900;font-size:.92rem;letter-spacing:.01em
}
.sticky-cta small{font-size:.72rem;font-weight:700;opacity:.93}
@media (max-width:380px){
  .sticky-cta a{font-size:.82rem}
  .sticky-cta small{font-size:.66rem}
}

/* ---------- Dwa numery w nagłówku: równy rząd, identyczna wysokość ---------- */
.menu-telefony{display:flex;gap:8px;align-items:stretch}
.menu-telefony .przycisk{
  flex:1 1 0;display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:44px;padding:10px 14px;line-height:1.15;border-radius:8px
}
.tel-krotki{display:none}
@media (max-width:900px){
  .menu-telefony{gap:8px;margin-top:12px}
  .menu-telefony .przycisk{margin-top:0}
  .tel-dlugi{display:none}
  .tel-krotki{display:inline}
  .menu-przelacznik:not(:checked) ~ .menu .menu-telefony{display:flex}
}

/* ---------- Telefon: dopracowany widok mobilny ---------- */
@media (prefers-reduced-motion: no-preference){ html{scroll-behavior:smooth} }
@media (max-width:900px){
  html{-webkit-text-size-adjust:100%}
  body{overflow-x:hidden}
  .kontener{padding:0 18px}
  .formularz input[type=text],.formularz input[type=tel],.formularz select,.formularz textarea{
    font-size:16px;min-height:48px
  }
  .przycisk{font-size:.95rem;padding:13px 18px}
  .sticky-cta{gap:6px;padding:8px}
  .galeria-siatka{grid-template-columns:repeat(2,1fr);gap:8px}
  .sekcja{padding:46px 0}
  .stopka-col{margin-bottom:20px}
  .menu a{padding:13px 0}
  .tabela-wrap,.tabela-scroll{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media (max-width:420px){
  .hero-tytul{font-size:1.7rem}
  .hero-przyciski{flex-direction:column;gap:10px}
  .hero-przyciski .przycisk,.cta-przyciski .przycisk{width:100%;justify-content:center}
  .cta-przyciski{flex-direction:column;gap:10px}
  .opinia{padding:16px}
}

/* ---------- Mapa dojazdu w stopce: zaraz pod opisem firmy, bez szpary ---------- */
.stopka-mapa{margin:14px 0 0;padding:0}
.stopka-mapa h3{font-size:1rem;margin:0 0 9px}
.mapa-link{max-width:360px}
.mapa-link img{width:100%;height:210px;object-fit:cover;display:block}
@media (max-width:900px){
  .stopka-mapa{margin-top:16px}
  .mapa-link{max-width:100%}
  .mapa-link img{height:190px}
}

/* ---------- Opinie: podsumowanie i rozwijanie (działa bez JavaScriptu) ---------- */
.opinia-podsumowanie{margin:6px 0 22px;font-size:1rem;color:var(--niebieski)}
.opinia-podsumowanie strong{color:var(--pomarancz-ciemny)}
.opinia-autor span{display:block;font-size:.82rem;color:#6b7b8a;font-weight:400;margin-top:2px}
.opinie-wiecej-przelacznik{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.opinie-wiecej-etykieta{cursor:pointer;user-select:none}
.etyk-mniej{display:none}
.opinie-wiecej-przelacznik:checked ~ .siatka .opinia-ukryta{display:block}
.opinie-wiecej-przelacznik:checked ~ .srodek .etyk-wiecej{display:none}
.opinie-wiecej-przelacznik:checked ~ .srodek .etyk-mniej{display:inline}
.opinie-wiecej-przelacznik:focus-visible ~ .srodek .opinie-wiecej-etykieta{outline:2px solid var(--pomarancz);outline-offset:3px}
.opinia-ukryta{display:none}
@media (max-width:900px){
  .opinia-podsumowanie{margin-bottom:16px}
}

/* ==========================================================================
   KOMPAKTOWY WIDOK TELEFONU
   Dotyczy wyłącznie ekranów do 600 px. Wersja komputerowa pozostaje bez zmian.
   ========================================================================== */
@media (max-width:600px){
  html{scroll-padding-top:66px}
  body{
    font-size:15px;
    line-height:1.55;
    padding-bottom:62px;
  }

  /* Nagłówek i menu */
  .kontener{padding-left:14px;padding-right:14px}
  .naglowek-wewn{padding:5px 14px;gap:8px}
  .logo img{height:43px}
  .menu-hamburger{width:40px;height:40px;gap:4px}
  .menu-hamburger span{width:23px;height:2px}
  .menu{padding:5px 16px 14px}
  .menu a{padding:9px 0;font-size:.86rem}
  .menu-profil{font-size:.78rem!important}
  .menu-telefony{gap:6px;margin-top:8px}
  .menu-telefony .przycisk{min-height:42px;padding:8px 7px;font-size:.8rem}

  /* Nagłówki i tekst */
  h1{font-size:1.65rem;line-height:1.16}
  h2{font-size:1.3rem;line-height:1.2}
  h3{font-size:1.02rem;line-height:1.25}
  p{margin-bottom:.8em}
  .lead{font-size:.96rem;line-height:1.5}
  .seo-tekst{font-size:.93rem;line-height:1.55}
  .nadtytul{font-size:.68rem;letter-spacing:.11em;margin-bottom:4px}

  /* Pierwszy ekran */
  .hero,.hero-miasto{min-height:0}
  .hero-wewn{padding:27px 14px 30px}
  .hero-tresc{max-width:100%}
  .hero-tresc h1{font-size:1.65rem;margin-bottom:9px}
  .hero-sub{font-size:.94rem;line-height:1.48;margin-bottom:13px}
  .hero-etykiety{gap:6px;margin-bottom:15px}
  .hero-etykiety li{padding:5px 9px;font-size:.75rem;line-height:1.25}
  .hero-przyciski{gap:8px}
  .hero-przyciski .przycisk{width:100%;padding:11px 14px;font-size:.87rem}
  .okruszki{font-size:.76rem;line-height:1.35;margin-bottom:9px}

  /* Sekcje, siatki i karty */
  .sekcja{padding:33px 0}
  .siatka{gap:12px}
  .siatka-3,.siatka-4{grid-template-columns:1fr}
  .karta{padding:15px;border-radius:10px}
  .karta p{font-size:.9rem;line-height:1.5}
  .karta-usluga img{height:145px}
  .karta-tresc{padding:15px}
  .karta-tresc h3{margin-bottom:6px}

  /* Formularz – pola pozostają 16 px, aby iPhone ich nie powiększał */
  .formularz-siatka{gap:18px}
  .formularz-tekst .lead{font-size:.93rem}
  .formularz-telefon{font-size:.96rem}
  .formularz{padding:15px;border-radius:10px}
  .formularz .pole{margin-bottom:10px}
  .formularz label{font-size:.8rem;margin-bottom:4px}
  .formularz input[type=text],
  .formularz input[type=tel],
  .formularz select,
  .formularz textarea{
    min-height:44px;
    padding:9px 11px;
    font-size:16px;
    line-height:1.35;
  }
  .formularz textarea{min-height:84px}
  .formularz .zgoda label{font-size:.78rem;line-height:1.4}
  .formularz button[type=submit]{min-height:44px;padding:10px 13px;font-size:.86rem}
  .komunikat{padding:14px;font-size:.88rem}

  /* Przyciski */
  .przycisk{padding:10px 14px;font-size:.86rem;border-radius:9px}
  .przycisk-maly{padding:8px 10px;font-size:.78rem}
  .przycisk-duzych{padding:11px 15px;font-size:.88rem}

  /* Fakty, dzielnice i miasta */
  .dzielnice,.fakty{gap:6px}
  .dzielnice li,.fakty li{padding:6px 10px;font-size:.78rem;line-height:1.3}
  .linki-miast-tytul{margin-top:1.25em}
  .linki-miast{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .kafelek-miasta{padding:9px 10px;font-size:.78rem;border-radius:8px}
  .kafelek-miasta small{font-size:.67rem}
  .cena-od{font-size:.93rem}

  /* Galeria */
  .galeria-siatka{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .galeria-kafelek{border-radius:8px}

  /* Opinie */
  .opinia{padding:14px}
  .gwiazdki{font-size:.96rem;letter-spacing:1px;margin-bottom:4px}
  .opinia blockquote{font-size:.87rem;line-height:1.48;margin-bottom:9px}
  .opinia-autor{font-size:.8rem}
  .opinia-autor span{font-size:.7rem}
  .opinia-podsumowanie{font-size:.85rem;margin-bottom:12px}
  .opinie-wiecej-etykieta{font-size:.8rem}

  /* FAQ i wezwanie do kontaktu */
  .faq{padding:2px 0 2px 12px;margin-bottom:16px}
  .faq h3{font-size:.98rem}
  .faq p{font-size:.88rem;line-height:1.5}
  .cta-box{padding:19px;gap:13px;border-radius:10px}
  .cta-box h2{font-size:1.25rem}
  .cta-box p{font-size:.88rem}
  .cta-przyciski{width:100%;flex-direction:column;gap:7px}
  .cta-przyciski .przycisk{width:100%;padding:10px 12px;font-size:.84rem}

  /* Stopka i mapa */
  .stopka{padding-top:35px;font-size:.84rem}
  .stopka-siatka{gap:16px;padding-bottom:20px}
  .stopka-col{margin-bottom:8px}
  .stopka-logo img{height:43px;margin-bottom:9px}
  .stopka address{line-height:1.6;margin-bottom:10px}
  .stopka-mapa{margin-top:12px}
  .stopka-mapa h3{font-size:.92rem;margin-bottom:7px}
  .mapa-link img{height:150px}
  .mapa-link span{padding:8px 10px;font-size:.76rem}
  .stopka-dol{padding:13px 14px;font-size:.72rem;line-height:1.4}

  /* Dolny pasek telefonu – mniejszy, ale nadal wygodny do dotknięcia */
  .sticky-cta{gap:5px;padding:5px 6px calc(5px + env(safe-area-inset-bottom))}
  .sticky-cta a{
    min-height:46px;
    padding:6px 3px;
    border-radius:8px;
    font-size:.72rem;
    line-height:1.15;
  }
  .sticky-cta small{font-size:.62rem}

  /* Okno logowania */
  .cms-modal{padding:12px}
  .logowanie-glowa{padding:15px 20px 13px}
  .logowanie-glowa img{height:40px;margin-bottom:7px}
  .logowanie-tresc{padding:18px 20px 20px}
  .logowanie h1,.logowanie h2{font-size:1.15rem}

  /* Panel CMS na telefonie */
  .panel-top-wewn{padding:8px 10px;gap:8px}
  .panel-grid{padding:8px;gap:10px}
  .panel-menu{padding:8px;gap:4px;border-radius:10px}
  .panel-menu a{padding:7px 9px;font-size:.76rem}
  .panel-menu-info{grid-template-columns:repeat(2,1fr)}
  .panel-tresc h1{font-size:1.3rem}
  .panel-karta{padding:14px;margin-bottom:12px;border-radius:10px}
  .panel-pozycja{padding:10px}
  .kpi-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .kpi{padding:11px 12px}
  .kpi strong{font-size:1.5rem}
}

/* Najmniejsze telefony */
@media (max-width:360px){
  body{font-size:14.5px}
  .kontener{padding-left:11px;padding-right:11px}
  .naglowek-wewn{padding-left:11px;padding-right:11px}
  .logo img{height:39px}
  .hero-wewn{padding:23px 11px 26px}
  .hero-tresc h1,h1{font-size:1.48rem}
  h2{font-size:1.2rem}
  .hero-etykiety li{font-size:.7rem}
  .linki-miast{grid-template-columns:1fr}
  .sticky-cta a{font-size:.67rem}
  .sticky-cta small{font-size:.58rem}
}

/* ==========================================================================
   FORMULARZ W POZIOMIE POD OPISEM + JAŚNIEJSZE PRZYCISKI HERO
   ========================================================================== */

/* Opis wyceny na górze, formularz zawsze bezpośrednio pod nim. */
.formularz-siatka{
  grid-template-columns:1fr;
  align-items:start;
}
.formularz-tekst{
  width:100%;
  max-width:none;
}

/* Kompaktowy formularz poziomy na dużym ekranie. */
.formularz{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:13px;
  align-items:start;
}
.formularz > .pole{
  min-width:0;
  margin-bottom:0;
}
.formularz > .pole:nth-of-type(7){grid-column:span 2} /* wiadomość */
.formularz > .zgoda{
  grid-column:span 3;
  align-self:center;
  margin:0;
}
.formularz > button[type=submit]{
  grid-column:span 1;
  align-self:center;
  width:100%;
  min-height:46px;
  margin:0;
}

/* Jaśniejsze, czytelne kafelki z numerami na pierwszym ekranie. */
.hero-przyciski .przycisk{
  background:#f6a04d;
  border-color:#f6a04d;
  color:#0a2440!important;
  box-shadow:0 5px 16px rgba(0,0,0,.16);
}
.hero-przyciski .przycisk-obramowany{
  background:rgba(255,255,255,.94);
  border-color:#fff;
  color:#0a2440!important;
}
.hero-przyciski .przycisk:hover{
  background:#ffc47d;
  border-color:#ffc47d;
  color:#0a2440!important;
}
.hero-przyciski .przycisk-obramowany:hover{
  background:#fff;
  border-color:#fff;
  color:#0a2440!important;
}

/* Tablet i telefon: po dwa pola w jednym rzędzie. */
@media (max-width:900px){
  .formularz{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .formularz > .pole:nth-of-type(7),
  .formularz > .zgoda,
  .formularz > button[type=submit]{
    grid-column:1 / -1;
  }
}

@media (max-width:600px){
  .formularz-siatka{gap:14px}
  .formularz-tekst{margin:0}
  .formularz-tekst .lead{margin-bottom:7px}
  .formularz-telefon{margin-bottom:0}
  .formularz{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px 8px;
    margin-top:0;
  }
  .formularz > .pole{margin-bottom:0}
  .formularz label{line-height:1.25;min-height:2.05em}
  .formularz > .zgoda label{min-height:0}
  .formularz textarea{min-height:72px}

  /* Dwa numery poziomo, przycisk wyceny idealnie pod nimi. */
  .hero-przyciski{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    width:100%;
  }
  .hero-przyciski .przycisk{
    width:auto;
    min-width:0;
    min-height:45px;
    padding:8px 6px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:.76rem;
    line-height:1.25;
  }
  .hero-przyciski .przycisk:last-child{
    grid-column:1 / -1;
    width:100%;
  }
}

@media (max-width:360px){
  .formularz{gap:8px 6px}
  .formularz label{font-size:.74rem}
  .formularz input[type=text],
  .formularz input[type=tel],
  .formularz select,
  .formularz textarea{
    padding-left:8px;
    padding-right:8px;
  }
  .hero-przyciski .przycisk{font-size:.7rem;padding:7px 4px}
}
