/* Serwis BM54 — arkusz stylów. Ciemny motyw, układ zbliżony do poprzedniej strony. */
:root{
  --pomaranczowy:#ff6600;
  --pomaranczowy-ciemny:#e05500;
  --tlo-strony:#111315;
  --tlo-panel:#1c1f22;
  --tlo-panel2:#24282c;
  --tekst:#d7dadd;
  --tekst-jasny:#f2f3f4;
  --tekst-szary:#9aa0a6;
  --linia:#33383d;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  color:var(--tekst);
  background:var(--tlo-strony);
  line-height:1.6;
  font-size:16px;
}
a{color:var(--pomaranczowy);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

/* Kontener */
.owijka{max-width:1160px;margin:0 auto;background:var(--tlo-panel);box-shadow:0 0 40px rgba(0,0,0,.6)}

/* Nagłówek */
header{padding:18px 24px 0;background:var(--tlo-panel)}
.gora{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px}
.logo img{display:block;max-height:70px;width:auto}
.kontakt-gora{text-align:right;font-size:15px;line-height:1.35;color:var(--tekst-szary)}
.kontakt-gora .tel{font-size:24px;font-weight:700;color:var(--tekst-jasny);white-space:nowrap}
.kontakt-gora .tel a{color:var(--tekst-jasny)}

/* Menu */
nav.menu{margin-top:16px;background:#0c0e10;border-radius:4px 4px 0 0}
nav.menu ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}
nav.menu li{position:relative}
nav.menu a{
  display:block;color:#e6e8ea;padding:14px 16px;font-size:15px;font-weight:500;
  text-transform:uppercase;letter-spacing:.3px;border-bottom:3px solid transparent;
}
nav.menu a:hover{background:#000;text-decoration:none}
nav.menu li.aktywna a{background:var(--pomaranczowy);color:#fff;border-bottom-color:var(--pomaranczowy-ciemny)}

/* Przycisk menu mobilnego */
.menu-toggle{display:none;background:#0c0e10;color:#fff;border:0;width:100%;
  padding:14px;font-size:16px;cursor:pointer}

/* Slider — węższe okienko jak na starej stronie, zdjęcia w proporcjach */
.slider{position:relative;overflow:hidden;background:#000;max-width:680px;margin:26px auto 0}
.slider .slajd{display:none}
.slider .slajd.akt{display:block}
.slider img{width:100%;height:360px;display:block;object-fit:fill}
.slider .kropki{position:absolute;bottom:12px;left:0;right:0;text-align:center}
.slider .kropki span{display:inline-block;width:11px;height:11px;border-radius:50%;
  background:rgba(255,255,255,.55);margin:0 4px;cursor:pointer}
.slider .kropki span.akt{background:var(--pomaranczowy)}

/* Treść */
.tresc{color:var(--tekst);padding:34px 44px 44px;background:var(--tlo-panel)}
/* Strona "Co warto wiedzieć" — treść i zdjęcia wyśrodkowane */
body.wysrodkowana .tresc,
body.wysrodkowana .tresc *{text-align:center !important}
body.wysrodkowana .tresc img{display:block;margin:10px auto}
h1{font-size:26px;color:var(--pomaranczowy);margin:.2em 0 .6em;line-height:1.25}
h2{font-size:21px;color:var(--tekst-jasny)}
h3{font-size:18px;color:var(--tekst-jasny)}
.tresc img{border-radius:3px;margin:6px 0;cursor:zoom-in}
.tresc p{margin:.7em 0}
/* Nadpisanie starych, wpisanych na sztywno kolorów tekstu z CMS (były pod ciemne tło) */
.tresc [style*="color: #000"], .tresc [style*="color:#000"],
.tresc [style*="color: black"]{color:var(--tekst) !important}
/* Zmniejszenie zbyt dużych rozmiarów tekstu wpisanych na sztywno w CMS */
.tresc [style*="font-size: 36px"],.tresc [style*="font-size:36px"]{font-size:26px !important;line-height:1.2 !important}
.tresc [style*="font-size: 28px"],.tresc [style*="font-size:28px"]{font-size:21px !important;line-height:1.3 !important}
.tresc [style*="font-size: 24px"],.tresc [style*="font-size:24px"]{font-size:19px !important}
.tresc [style*="font-size: 20px"],.tresc [style*="font-size:20px"]{font-size:17px !important}
.tresc [style*="font-size: 18px"],.tresc [style*="font-size:18px"]{font-size:16px !important}
.tresc [style*="font-size: 17px"],.tresc [style*="font-size:17px"]{font-size:16px !important}
hr{border:0;border-top:1px solid var(--linia);margin:22px 0}
/* Mniejsze zdjęcia (Sklep) */
body.male-zdjecia .tresc img{max-width:360px;height:auto;display:block;margin:10px 0}
/* Średnie zdjęcia (Phaeton — podłużne kadry) */
body.srednie-zdjecia .tresc img{max-width:560px;height:auto;display:block;margin:10px 0}
/* Logic 7 — mniejsze zdjęcia kilka obok siebie */
body.zdjecia-obok .tresc{text-align:center}
body.zdjecia-obok .tresc img{display:inline-block;max-width:300px;height:auto;margin:8px;vertical-align:top}

/* Karta kontaktowa */
.dane-firmy{background:var(--tlo-panel2);border-left:4px solid var(--pomaranczowy);
  padding:16px 20px;margin:14px 0;border-radius:0 4px 4px 0;color:var(--tekst-jasny)}
.dane-firmy strong{font-size:18px;color:#fff}

.przyciski{margin:18px 0}
.btn{display:inline-block;background:var(--pomaranczowy);color:#fff;padding:12px 22px;
  border-radius:4px;font-weight:600;margin:4px 6px 4px 0}
.btn:hover{background:var(--pomaranczowy-ciemny);text-decoration:none}

/* Stopka */
footer{background:#0c0e10;color:var(--tekst-szary);font-size:14px}
footer .stopka-in{max-width:1000px;margin:0 auto;padding:26px 30px;display:flex;
  flex-wrap:wrap;gap:24px;justify-content:space-between}
footer h4{color:#fff;margin:0 0 10px;font-size:16px}
footer a{color:#fff}
footer ul{list-style:none;padding:0;margin:0}
footer li{margin:4px 0}
footer .menu-stopka{display:flex;justify-content:flex-end;gap:40px;text-align:left}
footer .stopka-kol h4{margin-top:0}
/* Druga kolumna zaczyna się o jedną pozycję niżej (na wysokości 1. linku) */
footer .stopka-kol:nth-child(2){padding-top:30px}
.stopka-dol{background:#000;color:#777;text-align:center;padding:12px;font-size:13px}

/* Lightbox */
#lb{position:fixed;inset:0;background:rgba(0,0,0,.92);display:none;
  align-items:center;justify-content:center;z-index:999;cursor:zoom-out}
#lb.on{display:flex}
#lb img{max-width:94%;max-height:94%;border-radius:4px}
#lb .zamknij{position:absolute;top:14px;right:22px;color:#fff;font-size:40px;cursor:pointer;line-height:1}

@media(max-width:760px){
  .tresc{padding:20px 16px 26px}
  header{padding:14px 16px 0}
  .kontakt-gora{text-align:left}
  nav.menu ul{display:none;flex-direction:column}
  nav.menu ul.open{display:flex}
  nav.menu a{border-bottom:1px solid #2a2e32}
  .menu-toggle{display:block}
  h1{font-size:22px}
  footer .stopka-in{padding:20px 16px;gap:16px}
}