/* sufitypodwieszaneczestochowa.pl — style strony.
   Barwy: grafit + ciepła biel (jak gładki sufit) + mosiężny akcent. Paski w barwach flagi Niemiec
   („jakość z Niemiec” ze starej strony) tylko jako akcent. Bez zewnętrznych czcionek i bibliotek. */

:root {
  --grafit: #1f252d;
  --grafit-2: #343d49;
  --tekst: #2a3038;
  --szary: #69707b;
  --cieple-tlo: #f5f3ef;
  --biel: #fff;
  --ramka: #e4e0d9;
  --mosiadz: #a9844c;
  --mosiadz-jasny: #dcc7a1;
  --link: #27496f;
  --flaga-czarny: #1a1a1a;
  --flaga-czerwony: #c8102e;
  --flaga-zloty: #e8b500;
  --promien: 10px;
  --cien: 0 10px 30px rgba(31, 37, 45, .09);
  --szer: 1180px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; background: var(--biel); color: var(--tekst);
  font: 17px/1.65 "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--link); text-underline-offset: .15em; }
a:hover { color: var(--grafit); }
h1, h2, h3 { line-height: 1.2; color: var(--grafit); margin: 0 0 .6em; font-weight: 700; }
h1 { font-size: clamp(2rem, 4.2vw, 3.1rem); letter-spacing: -.015em; }
h2 { font-size: clamp(1.45rem, 2.6vw, 2rem); letter-spacing: -.01em; }
h3 { font-size: 1.2rem; }
p { margin: 0 0 1em; }
:focus-visible { outline: 3px solid var(--mosiadz); outline-offset: 2px; }

.wrap { max-width: var(--szer); margin: 0 auto; padding: 0 20px; }
.waska { max-width: 820px; }
.pomin { position: absolute; left: -9999px; top: 0; background: #fff; padding: 8px 14px; z-index: 100; }
.pomin:focus { left: 8px; top: 8px; }

/* pasek w barwach flagi */
.flaga { height: 3px; background: linear-gradient(90deg, var(--flaga-czarny) 0 33.34%, var(--flaga-czerwony) 33.34% 66.67%, var(--flaga-zloty) 66.67%); }

/* --- przyciski --- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  padding: .75em 1.25em; border-radius: 6px; border: 1.5px solid transparent;
  font-weight: 600; font-size: 1rem; line-height: 1.2; letter-spacing: .01em; text-decoration: none; cursor: pointer;
  transition: background-color .15s, border-color .15s, color .15s;
}
.btn--tel { background: var(--grafit); color: #fff; border-color: var(--grafit); }
.btn--tel:hover { background: var(--grafit-2); border-color: var(--grafit-2); color: #fff; }
.btn--tel .ikona-tel { color: var(--mosiadz-jasny); }
.btn--drugi { background: transparent; color: var(--grafit); border-color: var(--grafit); }
.btn--drugi:hover { background: var(--grafit); color: #fff; }
.btn--jasny { background: #fff; color: var(--grafit); border-color: #fff; }
.btn--jasny:hover { background: var(--mosiadz-jasny); border-color: var(--mosiadz-jasny); color: var(--grafit); }
.btn--jasny .ikona-tel { color: var(--mosiadz); }
.btn--duzy { padding: .9em 1.45em; font-size: 1.05rem; }
.btn--pelny { width: 100%; }
.przyciski { display: flex; flex-wrap: wrap; gap: 12px; margin: 1.5em 0; }
.ikona-tel {
  width: 1.05em; height: 1.05em; flex: none; background: currentColor;
  -webkit-mask: url("../img/tel.svg") center / contain no-repeat; mask: url("../img/tel.svg") center / contain no-repeat;
}

/* --- nagłówek --- */
.gora { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .97); box-shadow: 0 1px 0 var(--ramka); backdrop-filter: blur(6px); }
.gora__in { display: flex; align-items: center; gap: 24px; min-height: 76px; }
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--grafit); margin-right: auto; }
.logo img { width: 48px; height: 48px; }
.logo__tekst { display: flex; flex-direction: column; line-height: 1.15; }
.logo__tekst strong { font-size: 1.2rem; letter-spacing: .02em; font-weight: 700; }
.logo__tekst span { font-size: .78rem; color: var(--szary); letter-spacing: .02em; }
.menu ul { list-style: none; margin: 0; padding: 0; }
.menu > ul { display: flex; align-items: center; gap: 2px; }
.menu a, .menu__rozwin {
  display: block; padding: .5em .8em; border-radius: 6px; font: inherit; font-size: .97rem; font-weight: 500;
  color: var(--tekst); text-decoration: none; background: none; border: 0; cursor: pointer;
}
.menu a:hover, .menu__rozwin:hover { background: var(--cieple-tlo); color: var(--grafit); }
.menu a[aria-current="page"], .menu__grupa--aktywna > .menu__rozwin { color: var(--grafit); font-weight: 600; box-shadow: inset 0 -2px 0 var(--mosiadz); border-radius: 6px 6px 0 0; }
.menu__rozwin::after { content: ""; display: inline-block; margin-left: .45em; border: 4.5px solid transparent; border-top-color: currentColor; transform: translateY(2px); }
.menu__grupa { position: relative; }
.podmenu {
  position: absolute; top: 100%; left: 0; min-width: 280px; padding: 8px !important; background: #fff;
  border: 1px solid var(--ramka); border-radius: var(--promien); box-shadow: var(--cien); display: none;
}
.podmenu a { display: flex; align-items: center; gap: 10px; }
.podmenu img { width: 26px; height: 26px; flex: none; }
.menu__grupa:hover .podmenu, .menu__grupa:focus-within .podmenu, .menu__rozwin[aria-expanded="true"] + .podmenu { display: block; }
.menu-przycisk { display: none; }

/* --- okruszki --- */
.okruszki ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 14px 0 0; font-size: .87rem; color: var(--szary); }
.okruszki li + li::before { content: "›"; margin-right: 6px; color: #a4a9b0; }
.okruszki a { color: var(--szary); }

/* --- hero --- */
.hero {
  background-color: var(--cieple-tlo);
  /* delikatna siatka jak w suficie kasetonowym */
  background-image: linear-gradient(rgba(31, 37, 45, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(31, 37, 45, .045) 1px, transparent 1px);
  background-size: 56px 56px; border-bottom: 1px solid var(--ramka);
}
.hero__in { display: grid; grid-template-columns: 1fr 1.05fr; gap: 52px; align-items: center; padding-top: 60px; padding-bottom: 60px; }
.nadtytul { display: inline-flex; align-items: center; gap: .6em; margin-bottom: 1.1em; font-size: .82rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--mosiadz); }
.nadtytul::before { content: ""; width: 34px; height: 3px; background: linear-gradient(90deg, var(--flaga-czarny) 0 33%, var(--flaga-czerwony) 33% 66%, var(--flaga-zloty) 66%); }
.hero__wstep { font-size: 1.14rem; color: #48505b; max-width: 36em; }
.hero__obszar { font-size: .94rem; color: var(--szary); margin: 0; }
.hero__zdjecia { display: grid; grid-template-columns: 1.35fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; aspect-ratio: 6 / 5; }
.hero__zdjecia--1 { grid-template-rows: 1fr; }
.hero__z { margin: 0; overflow: hidden; border-radius: var(--promien); box-shadow: var(--cien); background: #e7e3dc; }
.hero__z:first-child { grid-row: span 2; }
.hero__zdjecia--1 .hero__z:first-child, .hero__zdjecia--2 .hero__z:first-child { grid-column: span 2; grid-row: auto; }
.hero__z picture, .hero__z img { width: 100%; height: 100%; object-fit: cover; }

/* Szkic architektoniczny wnętrza w tle (assets/img/szkic-pokoj*.svg) — tylko dekoracja. */
.hero, .strona__naglowek, .cta { position: relative; overflow: hidden; }
.hero > .wrap, .strona__naglowek > .wrap, .cta > .wrap { position: relative; z-index: 1; }
.hero::after, .strona__naglowek::after, .cta::after {
  content: ""; position: absolute; pointer-events: none; background: url("../img/szkic-pokoj.svg") no-repeat center / contain;
}
.hero::after { left: -40px; bottom: -28px; width: min(980px, 82%); aspect-ratio: 1000 / 420; opacity: .09; }
.strona__naglowek::after { right: -30px; top: 50%; transform: translateY(-50%); width: 560px; aspect-ratio: 1000 / 420; opacity: .13; }
.cta::after { right: -20px; top: 50%; transform: translateY(-50%); width: 620px; aspect-ratio: 1000 / 420; opacity: .09; background-image: url("../img/szkic-pokoj-jasny.svg"); }
@media (max-width: 960px) {
  .strona__naglowek::after { width: 420px; opacity: .08; right: -120px; }
  .hero::after { width: 140%; left: -20%; bottom: auto; top: 10px; opacity: .06; }
}

/* Zdjęcia realizacji mają mocne, dawne kolory — lekko je wyciszamy w siatkach (w powiększeniu są oryginalne). */
.hero__z img, .karta__zdj img, .galeria__el img, .przed-po img { filter: saturate(.82) contrast(1.02); }

/* --- sekcje --- */
.sekcja { padding: 68px 0; }
.sekcja--jasna { background: var(--cieple-tlo); }
.sekcja__tytul { position: relative; padding-bottom: .5em; margin-bottom: .85em; }
.sekcja__tytul::after { content: ""; position: absolute; left: 0; bottom: 0; width: 60px; height: 3px; background: linear-gradient(90deg, var(--flaga-czarny) 0 33%, var(--flaga-czerwony) 33% 66%, var(--flaga-zloty) 66%); }
.sekcja__wstep { color: var(--szary); max-width: 46em; }
.sekcja__dalej { margin: 30px 0 0; }
.uklad-2 { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 52px; align-items: start; }

/* ikonki usług */
.ikona-uslugi { width: 52px; height: 52px; padding: 10px; border-radius: 50%; background: #fff; box-shadow: 0 4px 14px rgba(31, 37, 45, .16); }

/* karty usług */
.karty { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 22px; }
.karta {
  display: flex; flex-direction: column; background: #fff; border: 1px solid var(--ramka); border-radius: var(--promien);
  overflow: hidden; text-decoration: none; color: var(--tekst); transition: box-shadow .2s, transform .2s;
}
.karta:hover { box-shadow: var(--cien); transform: translateY(-3px); color: var(--tekst); }
.karta__zdj { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #e7e3dc; position: relative; }
.karta__zdj img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.karta:hover .karta__zdj img { transform: scale(1.04); }
.karta__tekst { display: flex; flex-direction: column; gap: .4em; padding: 34px 22px 22px; flex: 1; position: relative; }
.karta__tekst .ikona-uslugi { position: absolute; top: -26px; left: 18px; }
.karta__tytul { font-weight: 700; font-size: 1.14rem; color: var(--grafit); }
.karta__opis { color: var(--szary); font-size: .96rem; flex: 1; }
.karta__wiecej { font-weight: 600; color: var(--grafit); font-size: .95rem; }
.karta:hover .karta__wiecej { color: var(--mosiadz); }

/* treść z panelu */
.tresc h2 { margin-top: 1.4em; }
.tresc h2:first-child { margin-top: 0; }
.tresc ul { padding-left: 1.2em; }
.tresc li { margin: .35em 0; }
.tresc li::marker { color: var(--mosiadz); }

/* dlaczego my */
.atuty { background: #fff; border: 1px solid var(--ramka); border-top: 3px solid var(--grafit); border-radius: var(--promien); padding: 24px 26px; box-shadow: var(--cien); }
.atuty__tytul { font-weight: 700; font-size: 1.15rem; color: var(--grafit); }
.atuty ul { list-style: none; margin: 0; padding: 0; }
.atuty li { display: flex; flex-direction: column; padding: 12px 0 12px 34px; border-top: 1px solid var(--ramka); position: relative; }
.atuty li:first-child { border-top: 0; }
.atuty li::before {
  content: ""; position: absolute; left: 0; top: 15px; width: 22px; height: 22px; border-radius: 50%;
  background: var(--cieple-tlo) url("../img/ok.svg") center / 13px no-repeat; border: 1px solid var(--mosiadz-jasny);
}
.atuty li span { color: var(--szary); font-size: .95rem; }
.atuty__rekomendacja { margin: 12px 0 0; padding-top: 12px; border-top: 1px dashed var(--ramka); font-size: .9rem; color: var(--szary); }

/* galeria */
.galeria { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; }
.galeria__el a { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--promien); background: #e7e3dc; position: relative; }
.galeria__el img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s, filter .35s; }
.galeria__el a:hover img { transform: scale(1.05); filter: none; }
.galeria__el a::after {
  content: ""; position: absolute; right: 10px; bottom: 10px; width: 34px; height: 34px; border-radius: 50%;
  background: rgba(31, 37, 45, .7) url("../img/lupa.svg") center / 16px no-repeat; opacity: 0; transition: opacity .2s;
}
.galeria__el a:hover::after, .galeria__el a:focus-visible::after { opacity: 1; }
.galeria__opis { margin: 9px 2px 0; font-size: .87rem; line-height: 1.4; color: var(--szary); }

/* przed i po */
.przed-po { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.przed-po figure { margin: 0; }
.przed-po a { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--promien); }
.przed-po img { width: 100%; height: 100%; object-fit: cover; }
.przed-po figcaption { margin-top: 10px; color: var(--szary); font-size: .95rem; }
.etykieta { display: inline-block; padding: .12em .65em; border-radius: 4px; background: #8a9099; color: #fff; font-weight: 600; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; margin-right: .35em; }
.etykieta--po { background: var(--grafit); }

/* pytania */
.faq details { border: 1px solid var(--ramka); border-radius: var(--promien); margin-bottom: 10px; background: #fff; }
.faq summary { cursor: pointer; padding: 17px 52px 17px 22px; font-weight: 600; color: var(--grafit); list-style: none; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 22px; top: 12px; font-size: 1.5rem; font-weight: 300; color: var(--mosiadz); }
.faq details[open] summary::after { content: "−"; }
.faq details p { padding: 0 22px 18px; margin: 0; color: #48505b; }

/* pas z telefonem */
.cta {
  background-color: var(--grafit); color: #fff;
  background-image: linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
  background-size: 56px 56px;
}
.cta__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding-top: 50px; padding-bottom: 50px; }
.cta__tytul { font-size: clamp(1.3rem, 2.4vw, 1.7rem); font-weight: 700; margin-bottom: .3em; color: #fff; }
.cta p { margin-bottom: 0; color: #c4c9d0; }

/* podstrony */
.strona__naglowek { background: var(--cieple-tlo); border-bottom: 1px solid var(--ramka); padding: 42px 0 38px; margin-top: 14px; }
.strona__naglowek .ikona-uslugi { margin-bottom: 16px; }
/* grafika poglądowa podstrony (AI) — zawsze z podpisem, żeby nie udawała realizacji */
.grafika-strony { position: relative; margin-top: 36px; margin-bottom: 0; }
.grafika-strony img { width: 100%; aspect-ratio: 16 / 9; max-height: 520px; object-fit: cover; border-radius: var(--promien); box-shadow: var(--cien); }
.grafika-strony figcaption { position: absolute; right: 32px; bottom: 12px; padding: .15em .6em; border-radius: 4px; background: rgba(31, 37, 45, .55); color: #f1f2f4; font-size: .75rem; letter-spacing: .02em; }
.wstep { font-size: 1.14rem; color: #48505b; max-width: 44em; margin-bottom: 0; }
.strona__uklad { padding-top: 50px; padding-bottom: 24px; }
.boczna { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 100px; }
.boczna__karta { border: 1px solid var(--ramka); border-radius: var(--promien); padding: 22px; background: #fff; }
.boczna__karta--tel { border-top: 3px solid var(--mosiadz); box-shadow: var(--cien); }
.boczna__tytul { font-weight: 700; color: var(--grafit); }
.boczna__maly { font-size: .9rem; color: var(--szary); margin: 12px 0 0; }
.boczna__lista { list-style: none; margin: 0; padding: 0; }
.boczna__lista li { border-top: 1px solid var(--ramka); }
.boczna__lista li:first-child { border-top: 0; }
.boczna__lista a { display: flex; align-items: center; gap: 10px; padding: 9px 0; text-decoration: none; font-weight: 500; color: var(--tekst); }
.boczna__lista a:hover { color: var(--mosiadz); }
.boczna__lista img { width: 24px; height: 24px; flex: none; }
.filtry { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; }
.filtry a { display: inline-flex; align-items: center; gap: .5em; padding: .45em .95em; border-radius: 99px; background: #fff; border: 1px solid var(--ramka); text-decoration: none; font-weight: 500; font-size: .94rem; color: var(--tekst); }
.filtry a:hover { border-color: var(--mosiadz); }
.filtry img { width: 20px; height: 20px; }
.filtry span { background: var(--cieple-tlo); color: var(--grafit); border-radius: 99px; padding: 0 .55em; font-size: .8rem; }
.sekcja--galeria { padding: 46px 0 20px; scroll-margin-top: 90px; }
.sekcja--galeria:last-of-type { padding-bottom: 68px; }

.kontakt-karta { border: 1px solid var(--ramka); border-top: 3px solid var(--mosiadz); border-radius: var(--promien); padding: 26px 28px; margin-bottom: 32px; box-shadow: var(--cien); }
.kontakt-karta__etykieta { margin: 0; color: var(--szary); font-weight: 500; }
.kontakt-karta__tel { display: inline-block; font-size: clamp(2rem, 5vw, 2.7rem); font-weight: 700; color: var(--grafit); text-decoration: none; letter-spacing: .02em; }
.kontakt-karta__firma { color: var(--szary); margin: 0; }

/* stopka */
.stopka { background: #171b21; color: #b3b9c1; font-size: .95rem; }
.stopka a { color: #e6e8eb; }
.stopka a:hover { color: var(--mosiadz-jasny); }
.stopka__kolumny { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 32px; padding-top: 50px; padding-bottom: 32px; }
.stopka ul { list-style: none; margin: 0; padding: 0; }
.stopka li { margin: .35em 0; }
.stopka__nazwa { color: #fff; font-weight: 700; font-size: 1.1rem; margin-bottom: .5em; }
.stopka__tytul { color: #fff; font-weight: 600; margin-bottom: .6em; }
.stopka__tel { font-weight: 600; font-size: 1.1rem; text-decoration: none; }
/* pasek wykonawcy strony — mały i dyskretny, ale czytelny (kontrast ok. 5 : 1, nie mniej niż 4,5 : 1) */
.stopka__reklama { border-top: 1px solid #262c35; padding-top: 14px; padding-bottom: 14px; font-size: .78rem; line-height: 1.55; color: #868d97; }
.stopka__reklama p { margin: 0 0 .3em; }
.stopka__reklama p:last-child { margin-bottom: 0; }
.stopka__reklama a { color: #9aa1ab; }
.stopka__reklama a:hover { color: var(--mosiadz-jasny); }
.stopka__dol { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; border-top: 1px solid #262c35; padding-top: 16px; padding-bottom: 20px; font-size: .85rem; color: #868d97; }
.stopka__dol p { margin: 0; }

/* pasek „zadzwoń” na telefonach */
.dzwon-pasek { display: none; }

/* powiększenie zdjęć */
.lightbox { position: fixed; inset: 0; z-index: 200; background: rgba(15, 18, 23, .95); display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 56px 16px 24px; }
.lightbox[hidden] { display: none; }
.lightbox img { max-width: min(1200px, 100%); max-height: calc(100vh - 140px); width: auto; height: auto; border-radius: 6px; }
.lightbox__opis { color: #e3e6ea; margin: 14px 0 0; text-align: center; max-width: 60em; }
.lightbox__licznik { color: #868d97; font-size: .85rem; margin: 4px 0 0; }
.lightbox button { position: absolute; background: rgba(255, 255, 255, .1); color: #fff; border: 0; width: 48px; height: 48px; border-radius: 50%; font-size: 1.6rem; cursor: pointer; line-height: 1; }
.lightbox button:hover { background: rgba(255, 255, 255, .22); }
.lightbox__zamknij { top: 12px; right: 12px; }
.lightbox__wstecz { left: 12px; top: 50%; transform: translateY(-50%); }
.lightbox__dalej { right: 12px; top: 50%; transform: translateY(-50%); }

/* --- telefony i tablety --- */
@media (max-width: 1060px) {
  .gora__tel { display: none; }
}
@media (max-width: 960px) {
  .hero__in { grid-template-columns: 1fr; gap: 32px; padding-top: 38px; padding-bottom: 42px; }
  .uklad-2 { grid-template-columns: 1fr; gap: 32px; }
  .boczna { position: static; }
  .stopka__kolumny { grid-template-columns: 1fr 1fr; }
  .menu-przycisk {
    display: inline-flex; align-items: center; gap: 8px; padding: .55em .9em; border: 1px solid var(--ramka);
    border-radius: 6px; background: #fff; font: inherit; font-weight: 600; color: var(--grafit); cursor: pointer;
  }
  .menu-przycisk__ikona, .menu-przycisk__ikona::before, .menu-przycisk__ikona::after { display: block; width: 18px; height: 2px; background: currentColor; position: relative; }
  .menu-przycisk__ikona::before, .menu-przycisk__ikona::after { content: ""; position: absolute; left: 0; }
  .menu-przycisk__ikona::before { top: -6px; }
  .menu-przycisk__ikona::after { top: 6px; }
  .menu { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid var(--ramka); box-shadow: var(--cien); max-height: calc(100vh - 80px); overflow: auto; }
  .menu--otwarte { display: block; }
  .menu > ul { flex-direction: column; align-items: stretch; padding: 10px 16px 16px; gap: 0; }
  .menu a, .menu__rozwin { padding: .8em .6em; border-bottom: 1px solid var(--ramka); border-radius: 0; width: 100%; text-align: left; }
  .menu__rozwin { display: none; }
  .podmenu { display: block; position: static; box-shadow: none; border: 0; padding: 0 !important; min-width: 0; }
  .podmenu a { padding-left: 1.2em; }
  .menu a[aria-current="page"] { box-shadow: inset 3px 0 0 var(--mosiadz); }
}
@media (max-width: 640px) {
  body { font-size: 16px; padding-bottom: 60px; }
  .gora__in { min-height: 64px; gap: 12px; }
  .logo img { width: 40px; height: 40px; }
  .logo__tekst strong { font-size: 1.04rem; }
  .logo__tekst span { font-size: .7rem; }
  .logo__firma { display: none; }   /* na telefonie podpis w jednej linii: „Częstochowa” */
  .sekcja { padding: 46px 0; }
  .przed-po { grid-template-columns: 1fr; }
  .galeria { grid-template-columns: 1fr 1fr; gap: 12px; }
  .galeria__opis { font-size: .8rem; }
  .stopka__kolumny { grid-template-columns: 1fr; gap: 20px; }
  .przyciski .btn { flex: 1 1 100%; }
  .dzwon-pasek {
    display: flex; align-items: center; justify-content: center; gap: .55em; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    min-height: 56px; background: var(--grafit); color: #fff; font-weight: 600; font-size: 1.05rem; text-decoration: none;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, .18); border-top: 3px solid transparent;
    border-image: linear-gradient(90deg, var(--flaga-czarny) 0 33%, var(--flaga-czerwony) 33% 66%, var(--flaga-zloty) 66%) 1;
  }
  .dzwon-pasek .ikona-tel { color: var(--mosiadz-jasny); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}