/* Hub „Drony” — makieta. Tokeny 1:1 z wyglad.json Podniebnika. */
.pnd {
  --tlo-j: #F7F6F3; --pow-j: #FFFFFF; --tekst-j: #14181F; --obw-j: #C4BDB0; --akcent-j: #12508C;
  --tlo-c: #0E141B; --pow-c: #172230; --tekst-c: #E8EDF2; --obw-c: #33445A; --akcent-c: #7CB8F2;
  --cicho-j: #5A6270; --cicho-c: #9AA8B8;
  --zielony: #1E7A4C; --bursztyn: #A8650B; --czerwony: #B23A2E;
  --font-h: 'IBM Plex Sans', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-t: 'IBM Plex Serif', Charter, Cambria, Georgia, serif;
  --font-m: 'IBM Plex Mono', Consolas, monospace;
  --siatka: 1240px; --tekst: 680px; --margines: 24px;
  --r: 10px;
}
.pnd *, .pnd *::before, .pnd *::after { box-sizing: border-box; }
.pnd {
  margin: 0; background: var(--tlo-j); color: var(--tekst-j);
  font: 400 18px/1.65 var(--font-t); -webkit-font-smoothing: antialiased;
}
.pnd h1, .pnd h2, .pnd h3, .pnd h4, .pnd .h { font-family: var(--font-h); line-height: 1.15; letter-spacing: -0.015em; margin: 0; }
.pnd h1 { font-size: clamp(34px, 5.2vw, 60px); font-weight: 600; }
.pnd h2 { font-size: clamp(26px, 3.4vw, 40px); font-weight: 600; }
.pnd h3 { font-size: 20px; font-weight: 600; }
.pnd p { margin: 0 0 1em; }
.pnd a { color: var(--akcent-j); text-underline-offset: 3px; }
.pnd .kontener { max-width: var(--siatka); margin: 0 auto; padding: 0 var(--margines); }
.pnd .waski { max-width: var(--tekst); }
.pnd .etykieta {
  font: 600 12px/1 var(--font-h); letter-spacing: .14em; text-transform: uppercase;
  color: var(--akcent-j); display: inline-block; margin-bottom: 14px;
}
.pnd .lead { font-size: 21px; line-height: 1.55; color: #2A3140; }
.pnd .sekcja { padding: 96px 0; }
.pnd .sekcja + .sekcja { border-top: 1px solid #E4DFD5; }
.pnd .sekcja-glowa { display: flex; justify-content: space-between; align-items: end; gap: 32px; margin-bottom: 40px; flex-wrap: wrap; }
.pnd .sekcja-glowa p { max-width: 520px; margin: 0; color: var(--cicho-j); }
@media (max-width: 860px) { }
/* Przyciski — własny kontrast, nie dziedziczony */
.pnd .btn {
  display: inline-flex; align-items: center; gap: 10px; padding: 14px 22px; border-radius: 8px;
  font: 600 16px var(--font-h); text-decoration: none; border: 2px solid transparent; cursor: pointer;
  transition: transform .2s, background .2s;
}
.pnd .btn-glowny { background: var(--akcent-j); color: #fff; }
.pnd .btn-glowny:hover { background: #0D3E6E; transform: translateY(-2px); }
.pnd .btn-obrys { border-color: var(--tekst-j); color: var(--tekst-j); background: transparent; }
.pnd .btn-obrys:hover { background: var(--tekst-j); color: #fff; }
.pnd .ciemne .btn-obrys { border-color: var(--tekst-c); color: var(--tekst-c); }
.pnd .ciemne .btn-obrys:hover { background: var(--tekst-c); color: var(--tlo-c); }
/* Okruszki */
.pnd .okruszki { font: 400 14px var(--font-h); color: var(--cicho-j); padding: 22px 0 0; }
.pnd .okruszki a { color: var(--cicho-j); }
.pnd .okruszki span { margin: 0 8px; opacity: .6; }
/* HERO huba */
.pnd .hero { padding: 56px 0 72px; overflow: hidden; }
.pnd .hero .kontener { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center; }
.pnd .hero h1 { margin-bottom: 22px; }
.pnd .hero .akcje { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 30px; }
.pnd .hero-liczby { display: flex; gap: 36px; margin-top: 40px; font-family: var(--font-h); }
.pnd .hero-liczby b { display: block; font-size: 34px; font-weight: 600; color: var(--akcent-j); }
.pnd .hero-liczby small { font-size: 14px; color: var(--cicho-j); }
.pnd .hero-dron { position: relative; aspect-ratio: 1; }
.pnd .hero-dron svg { width: 100%; height: 100%; overflow: visible; }
@media (max-width: 900px) {.pnd .hero .kontener { grid-template-columns: 1fr; }
.pnd .hero-dron { max-width: 420px; margin: 0 auto; }
 }
/* Dron — animacje wspólne */
.pnd .wirnik { transform-box: fill-box; transform-origin: center; animation: obrot .32s linear infinite; }
.pnd .wirnik.ccw { animation-direction: reverse; }
@keyframes obrot { to { transform: rotate(360deg); } }
.pnd .unos { animation: unos 6s ease-in-out infinite; }
@keyframes unos { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-14px) rotate(.6deg); } }
.pnd .cien { animation: cien 6s ease-in-out infinite; transform-origin: center; transform-box: fill-box; }
@keyframes cien { 0%,100% { transform: scaleX(1); opacity: .22; } 50% { transform: scaleX(.86); opacity: .14; } }
.pnd .trasa { stroke-dasharray: 4 8; animation: trasa 1.6s linear infinite; }
@keyframes trasa { to { stroke-dashoffset: -24; } }
/* JAK DZIAŁA — sekcja ciemna, przewijana z przyklejonym dronem */
.pnd .ciemne { background: var(--tlo-c); color: var(--tekst-c); }
.pnd .ciemne .etykieta, .pnd .ciemne a { color: var(--akcent-c); }
.pnd .ciemne .sekcja-glowa p, .pnd .ciemne .cicho { color: var(--cicho-c); }
.pnd .budowa { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
.pnd .budowa-scena { position: sticky; top: 100px; height: min(560px, 70vh); }
.pnd .budowa-scena svg { width: 100%; height: 100%; overflow: visible; }
.pnd .czesc { transition: transform .8s cubic-bezier(.2,.8,.2,1), opacity .5s; opacity: .45; }
.pnd .czesc .obrys { stroke: var(--obw-c); transition: stroke .4s; }
.pnd .czesc.aktywna { opacity: 1; }
.pnd .czesc.aktywna .obrys { stroke: var(--akcent-c); }
.pnd .rozlozony .cz-smigla { transform: translateY(-46px); }
.pnd .rozlozony .cz-gps { transform: translateY(-86px); }
.pnd .rozlozony .cz-fc { transform: translateY(-30px); }
.pnd .rozlozony .cz-bateria { transform: translateY(54px); }
.pnd .rozlozony .cz-gimbal { transform: translateY(96px); }
.pnd .rozlozony .cz-esc { transform: translateY(18px); }
.pnd .etykieta-czesci { font: 600 13px var(--font-h); fill: var(--akcent-c); opacity: 0; transition: opacity .4s; }
.pnd .czesc.aktywna .etykieta-czesci { opacity: 1; }
.pnd .kroki { padding: 10vh 0 20vh; }
.pnd .krok { min-height: 62vh; display: flex; flex-direction: column; justify-content: center; opacity: .35; transition: opacity .4s; }
.pnd .krok.aktywny { opacity: 1; }
.pnd .krok .nr { font: 500 14px var(--font-m); color: var(--akcent-c); margin-bottom: 10px; }
.pnd .krok h3 { font-size: 28px; margin-bottom: 14px; }
.pnd .krok p { color: #C9D3DE; }
.pnd .krok .fakt { border-left: 3px solid var(--akcent-c); padding: 6px 0 6px 16px; font: 400 15px/1.5 var(--font-h); color: var(--cicho-c); margin-top: 6px; }
@media (max-width: 900px) {.pnd .budowa { grid-template-columns: 1fr; gap: 0; }
.pnd .budowa-scena { top: 68px; height: 300px; background: var(--tlo-c); z-index: 2; }
.pnd .krok { min-height: 0; padding: 48px 0; opacity: 1; }

}
/* Ruch: cztery manewry */
.pnd .manewry { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.pnd .manewr { background: var(--pow-j); border: 1px solid #E4DFD5; border-radius: var(--r); padding: 24px; }
.pnd .manewr svg { width: 100%; height: 170px; display: block; margin-bottom: 16px; }
.pnd .manewr h3 { margin-bottom: 8px; }
.pnd .manewr p { font: 400 15px/1.55 var(--font-h); color: var(--cicho-j); margin: 0; }
.pnd .silnik { transition: fill .3s; }
.pnd .szybko { fill: var(--akcent-j); }
.pnd .wolno { fill: #D9E3EE; }
.pnd .m-wznoszenie .cialo { animation: wznos 3s ease-in-out infinite; }
@keyframes wznos { 0%,100% { transform: translateY(18px); } 50% { transform: translateY(-18px); } }
.pnd .m-przod .cialo { animation: przod 3.4s ease-in-out infinite; transform-origin: 100px 85px; }
@keyframes przod { 0%,100% { transform: translateX(-26px) rotate(0); } 40%,60% { transform: translateX(26px) rotate(-12deg); } }
.pnd .m-obrot .cialo { animation: yaw 4s ease-in-out infinite; transform-origin: 100px 85px; }
@keyframes yaw { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); } }
.pnd .m-zawis .cialo { animation: zawis 2.4s ease-in-out infinite; }
@keyframes zawis { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@media (max-width: 980px) {.pnd .manewry { grid-template-columns: repeat(2, 1fr); }
 }
@media (max-width: 540px) {.pnd .manewry { grid-template-columns: 1fr; }
 }
/* Rodzaje */
.pnd .rodzaje { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #E4DFD5; border: 1px solid #E4DFD5; border-radius: var(--r); overflow: hidden; }
.pnd .rodzaj { background: var(--pow-j); padding: 28px; transition: background .25s; text-decoration: none; color: var(--tekst-j); }
.pnd .rodzaj:hover { background: #F1F5FA; }
.pnd .rodzaj .ikona { width: 46px; height: 46px; color: var(--akcent-j); margin-bottom: 16px; }
.pnd .rodzaj h3 { margin-bottom: 8px; }
.pnd .rodzaj p { font: 400 15px/1.55 var(--font-h); color: var(--cicho-j); margin-bottom: 12px; }
.pnd .rodzaj .waga { font: 500 13px var(--font-m); color: var(--tekst-j); }
@media (max-width: 860px) {.pnd .rodzaje { grid-template-columns: 1fr 1fr; }
 }
@media (max-width: 540px) {.pnd .rodzaje { grid-template-columns: 1fr; }
 }
/* Suwak wagi */
.pnd .suwak-box { background: var(--pow-j); border: 1px solid #E4DFD5; border-radius: var(--r); padding: 36px; display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: center; }
.pnd .suwak-waga { font: 600 64px/1 var(--font-h); letter-spacing: -0.03em; }
.pnd .suwak-waga small { font-size: 22px; color: var(--cicho-j); font-weight: 500; }
.pnd input[type=range] { width: 100%; accent-color: var(--akcent-j); margin: 24px 0 8px; height: 28px; }
.pnd .skala { display: flex; justify-content: space-between; font: 500 12px var(--font-m); color: var(--cicho-j); }
.pnd .wybor-klasy { display: flex; gap: 8px; margin-top: 18px; flex-wrap: wrap; }
.pnd .wynik { border-left: 4px solid var(--zielony); padding-left: 24px; transition: border-color .3s; }
.pnd .wynik[data-ton=bursztyn] { border-color: var(--bursztyn); }
.pnd .wynik[data-ton=czerwony] { border-color: var(--czerwony); }
.pnd .wynik .kat { font: 600 44px/1 var(--font-h); margin-bottom: 8px; }
.pnd .wynik dl { margin: 18px 0 0; font: 400 15px/1.5 var(--font-h); }
.pnd .wynik dt { color: var(--cicho-j); font-size: 13px; text-transform: uppercase; letter-spacing: .08em; margin-top: 12px; }
.pnd .wynik dd { margin: 2px 0 0; }
@media (max-width: 860px) {.pnd .suwak-box { grid-template-columns: 1fr; padding: 24px; }
 }
/* Katalog */
.pnd .filtry { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.pnd .chip {
  font: 500 14px var(--font-h); padding: 9px 16px; border-radius: 999px; border: 1px solid var(--obw-j);
  background: var(--pow-j); color: var(--tekst-j); cursor: pointer; transition: all .2s;
}
.pnd .chip:hover { border-color: var(--akcent-j); }
.pnd .chip[aria-pressed=true] { background: var(--tekst-j); border-color: var(--tekst-j); color: #fff; }
.pnd .sortuj { margin-left: auto; font: 500 14px var(--font-h); display: flex; align-items: center; gap: 8px; color: var(--cicho-j); }
.pnd .sortuj select { font: inherit; color: var(--tekst-j); padding: 8px 10px; border: 1px solid var(--obw-j); border-radius: 8px; background: var(--pow-j); }
.pnd .siatka-modeli { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 20px; }
.pnd .karta {
  background: var(--pow-j); border: 1px solid #E4DFD5; border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column;
  text-decoration: none; color: inherit; transition: transform .3s, box-shadow .3s, opacity .3s;
  animation: wejscie .5s both;
}
.pnd .karta:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -22px rgba(20,24,31,.35); }
@keyframes wejscie { from { opacity: 0; transform: translateY(14px); } }
.pnd .karta-foto { background: linear-gradient(160deg, #EEF3F8, #DCE6F0); aspect-ratio: 16/10; display: grid; place-items: center; position: relative; }
.pnd .karta-foto svg { width: 46%; color: #8FA6BF; }
.pnd .karta:hover .karta-foto .wirnik { animation-duration: .18s; }
.pnd .plakietka { position: absolute; top: 12px; left: 12px; font: 600 12px var(--font-h); padding: 5px 10px; border-radius: 6px; color: #fff; background: var(--zielony); }
.pnd .plakietka[data-ton=bursztyn] { background: var(--bursztyn); }
.pnd .plakietka[data-ton=czerwony] { background: var(--czerwony); }
.pnd .karta-tresc { padding: 20px 22px 22px; display: flex; flex-direction: column; flex: 1; }
.pnd .karta-producent { font: 500 13px var(--font-h); color: var(--cicho-j); }
.pnd .karta h3 { font-size: 22px; margin: 2px 0 14px; }
.pnd .parametry { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; font-family: var(--font-h); margin: 0 0 16px; }
.pnd .parametry dt { font-size: 12px; color: var(--cicho-j); text-transform: uppercase; letter-spacing: .06em; }
.pnd .parametry dd { margin: 0; font-size: 16px; font-weight: 600; }
.pnd .karta-stopka { margin-top: auto; padding-top: 14px; border-top: 1px solid #EEE9E0; font: 500 14px var(--font-h); color: var(--akcent-j); display: flex; justify-content: space-between; }
/* Porównywarka */
.pnd .porownaj-wybor { display: grid; grid-template-columns: 1fr auto 1fr; gap: 16px; align-items: center; margin-bottom: 24px; }
.pnd .porownaj-wybor select { font: 600 17px var(--font-h); padding: 14px 16px; border: 1px solid var(--obw-c); background: var(--pow-c); color: var(--tekst-c); border-radius: 8px; width: 100%; }
.pnd .vs { font: 600 15px var(--font-m); color: var(--akcent-c); }
.pnd table.tabela { width: 100%; border-collapse: collapse; font-family: var(--font-h); font-size: 16px; }
.pnd .tabela th, .pnd .tabela td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--obw-c); vertical-align: top; }
.pnd .tabela th { font-weight: 500; color: var(--cicho-c); width: 28%; font-size: 14px; }
.pnd .tabela td.lepszy { color: var(--akcent-c); font-weight: 600; }
.pnd .tabela td.lepszy::after { content: ' ▲'; font-size: 11px; }
.pnd .tabela-jasna th, .pnd .tabela-jasna td { border-color: #E4DFD5; }
.pnd .tabela-jasna th { color: var(--cicho-j); }
@media (max-width: 640px) {.pnd .porownaj-wybor { grid-template-columns: 1fr; }
.pnd .vs { text-align: center; }
.pnd .tabela th, .pnd .tabela td { padding: 12px 8px; font-size: 14px; }
 }
/* FAQ */
.pnd .faq details { border-bottom: 1px solid #E4DFD5; padding: 20px 0; }
.pnd .faq summary { font: 600 19px var(--font-h); cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 20px; }
.pnd .faq summary::after { content: '+'; color: var(--akcent-j); font-size: 26px; line-height: 1; transition: transform .3s; }
.pnd .faq details[open] summary::after { transform: rotate(45deg); }
.pnd .faq details p { margin: 14px 0 0; }
/* Linki do działów przepisowych */
.pnd .pomost { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.pnd .pomost a { display: block; padding: 24px; border: 1px solid #E4DFD5; border-radius: var(--r); background: var(--pow-j); text-decoration: none; color: var(--tekst-j); font-family: var(--font-h); transition: border-color .2s; }
.pnd .pomost a:hover { border-color: var(--akcent-j); }
.pnd .pomost b { display: block; font-size: 18px; margin-bottom: 6px; }
.pnd .pomost span { color: var(--cicho-j); font-size: 15px; }
@media (max-width: 760px) {.pnd .pomost { grid-template-columns: 1fr; }
 }
/* Wejścia przy przewijaniu */
.pnd .odslon { opacity: 0; transform: translateY(24px); transition: opacity .7s, transform .7s cubic-bezier(.2,.8,.2,1); }
.pnd .odslon.widac { opacity: 1; transform: none; }
/* PODSTRONA MODELU */
.pnd .model-hero { padding: 36px 0 64px; }
.pnd .model-hero .kontener { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.pnd .model-hero h1 { font-size: clamp(30px, 4.2vw, 48px); margin: 12px 0 18px; }
.pnd .model-foto { background: linear-gradient(160deg, #EEF3F8, #D5E0EC); border-radius: 14px; aspect-ratio: 4/3; display: grid; place-items: center; position: relative; overflow: hidden; }
.pnd .model-foto svg { width: 62%; color: #6F89A6; }
.pnd .model-foto .podpis { position: absolute; bottom: 14px; left: 16px; font: 400 13px var(--font-h); color: var(--cicho-j); }
.pnd .kafle { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: #E4DFD5; border: 1px solid #E4DFD5; border-radius: var(--r); overflow: hidden; margin-top: 28px; }
.pnd .kafel { background: var(--pow-j); padding: 18px 16px; font-family: var(--font-h); }
.pnd .kafel small { display: block; font-size: 12px; color: var(--cicho-j); text-transform: uppercase; letter-spacing: .07em; }
.pnd .kafel b { font-size: 28px; font-weight: 600; }
.pnd .kafel b i { font-style: normal; font-size: 15px; color: var(--cicho-j); font-weight: 500; }
@media (max-width: 900px) {.pnd .model-hero .kontener { grid-template-columns: 1fr; }
.pnd .kafle { grid-template-columns: 1fr 1fr; }
 }
.pnd .werdykt { background: var(--pow-j); border: 1px solid #E4DFD5; border-left: 5px solid var(--zielony); border-radius: var(--r); padding: 32px 36px; display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; }
.pnd .werdykt .kat { font: 600 68px/1 var(--font-h); color: var(--zielony); }
.pnd .lista-wymogow { list-style: none; padding: 0; margin: 0; font-family: var(--font-h); }
.pnd .lista-wymogow li { display: grid; grid-template-columns: 30px 1fr; gap: 10px; padding: 12px 0; border-bottom: 1px solid #EEE9E0; }
.pnd .lista-wymogow li:last-child { border: 0; }
.pnd .lista-wymogow .z { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 14px; font-weight: 700; }
.pnd .z.tak { background: var(--akcent-j); }
.pnd .z.nie { background: #9AA3AF; }
.pnd .z.uwaga { background: var(--bursztyn); }
.pnd .lista-wymogow b { display: block; font-size: 16px; }
.pnd .lista-wymogow span { font-size: 15px; color: var(--cicho-j); }
@media (max-width: 860px) {.pnd .werdykt { grid-template-columns: 1fr; padding: 24px; }
 }
.pnd .po-ludzku { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.pnd .ludzko { background: var(--pow-j); border: 1px solid #E4DFD5; border-radius: var(--r); padding: 26px; }
.pnd .ludzko .liczba { font: 600 30px var(--font-h); color: var(--akcent-j); }
.pnd .ludzko h3 { font-size: 17px; margin: 4px 0 10px; }
.pnd .ludzko p { font-size: 16px; margin: 0; }
@media (max-width: 760px) {.pnd .po-ludzku { grid-template-columns: 1fr; }
 }
.pnd .uwaga-box { background: #FBF3E6; border: 1px solid #EBD3A8; border-radius: var(--r); padding: 22px 26px; font: 400 16px/1.6 var(--font-h); margin-top: 28px; }
.pnd .uwaga-box b { color: var(--bursztyn); }
.pnd .spec-grupy { columns: 2; column-gap: 40px; }
.pnd .spec-grupa { break-inside: avoid; margin-bottom: 32px; }
.pnd .spec-grupa h3 { font-size: 15px; text-transform: uppercase; letter-spacing: .1em; color: var(--akcent-j); padding-bottom: 10px; border-bottom: 2px solid var(--tekst-j); }
.pnd .spec-grupa table { width: 100%; border-collapse: collapse; font: 400 15px/1.45 var(--font-h); }
.pnd .spec-grupa th, .pnd .spec-grupa td { padding: 10px 0; border-bottom: 1px solid #E4DFD5; text-align: left; vertical-align: top; }
.pnd .spec-grupa th { font-weight: 400; color: var(--cicho-j); width: 46%; padding-right: 12px; }
@media (max-width: 760px) {.pnd .spec-grupy { columns: 1; }
 }
.pnd .metryczka { font: 400 14px/1.6 var(--font-h); color: var(--cicho-j); border-top: 1px solid #E4DFD5; padding-top: 18px; margin-top: 8px; }
/* Strefa A1 — animowany schemat odległości */
.pnd .strefa { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.pnd .strefa svg { width: 100%; max-width: 460px; }
.pnd .puls { animation: puls 2.6s ease-out infinite; transform-origin: 230px 200px; }
@keyframes puls { from { transform: scale(.5); opacity: .5; } to { transform: scale(1.4); opacity: 0; } }
@media (max-width: 860px) {.pnd .strefa { grid-template-columns: 1fr; }
 }
@media (prefers-reduced-motion: reduce) {.pnd *, .pnd *::before, .pnd *::after { animation: none !important; transition: none !important; }
.pnd .odslon { opacity: 1; transform: none; }

}
/* Warstwa życia: ruch, światło, reakcja na kursor. Wszystko gaśnie przy prefers-reduced-motion. */
/* Pasek lotu — postęp czytania z dronem na czubku */
.lot { position: fixed; top: 68px; left: 0; right: 0; height: 3px; z-index: 19; pointer-events: none; }
.lot-pasek { height: 100%; width: 0; background: linear-gradient(90deg, rgba(18,80,140,0), var(--akcent-j) 40%, #3E8FD9); }
.lot-dron { position: absolute; top: -9px; width: 20px; height: 20px; margin-left: -10px; color: var(--akcent-j); left: 0; transition: transform .2s; }
.lot-dron svg { width: 100%; height: 100%; display: block; }
.lot.ciemno .lot-dron { color: var(--akcent-c); }
/* HERO — niebo z radarem */
.pnd .hero { position: relative; isolation: isolate; }
.pnd .hero::before {
  content: ''; position: absolute; inset: 0; z-index: -2;
  background:
    radial-gradient(900px 520px at 78% 40%, rgba(124,184,242,.28), transparent 70%),
    radial-gradient(600px 400px at 10% 100%, rgba(18,80,140,.08), transparent 70%);
}
.pnd .hero::after {
  content: ''; position: absolute; inset: 0; z-index: -1; opacity: .5;
  background-image: radial-gradient(rgba(18,80,140,.22) 1px, transparent 1.4px);
  background-size: 26px 26px;
  -webkit-mask-image: radial-gradient(700px 500px at 75% 45%, #000, transparent 75%);
          mask-image: radial-gradient(700px 500px at 75% 45%, #000, transparent 75%);
  animation: dryf 40s linear infinite;
}
@keyframes dryf { to { background-position: 260px 130px; } }
.pnd .chmura { position: absolute; z-index: -1; border-radius: 50%; background: #fff; filter: blur(30px); opacity: .7; animation: chmura 38s linear infinite; pointer-events: none; }
@keyframes chmura { from { transform: translateX(-30vw); } to { transform: translateX(110vw); } }
.pnd .hero-dron { perspective: 900px; }
.pnd .hero-dron > svg { transition: transform .5s cubic-bezier(.2,.8,.2,1); transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transform-style: preserve-3d; }
.pnd .radar { transform-box: view-box; transform-origin: 200px 200px; animation: obrot 7s linear infinite; }
.pnd .strefa-ctr { fill: none; stroke: #12508C; stroke-opacity: .16; stroke-dasharray: 2 6; }
.pnd .fala-wirnika { transform-box: fill-box; transform-origin: center; animation: falaW 1.8s ease-out infinite; fill: none; stroke: #12508C; stroke-width: 2; }
@keyframes falaW { from { transform: scale(.9); opacity: .55; } to { transform: scale(1.7); opacity: 0; } }
.pnd .plakietka-hero { cursor: default; }
.pnd .lacznik { stroke: #12508C; stroke-width: 1; stroke-dasharray: 3 4; opacity: .5; animation: trasa 1.4s linear infinite; }
/* H1 — słowa wjeżdżają spod maski */
.pnd .slowo { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .08em; margin-bottom: -.08em; }
.pnd .slowo > span { display: inline-block; transform: translateY(105%); animation: slowo .9s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes slowo { to { transform: none; } }
.pnd .hero .lead, .pnd .hero .akcje, .pnd .hero-liczby, .pnd .hero .etykieta { animation: wjazd .9s cubic-bezier(.2,.8,.2,1) both; }
.pnd .hero .lead { animation-delay: .45s; }
.pnd .hero .akcje { animation-delay: .6s; }
.pnd .hero-liczby { animation-delay: .75s; }
@keyframes wjazd { from { opacity: 0; transform: translateY(18px); } }
.pnd .btn-glowny { position: relative; overflow: hidden; }
.pnd .btn-glowny::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%); transform: translateX(-120%); animation: blysk 4.5s 2s infinite; }
@keyframes blysk { 0%, 70% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }
/* ROZBIÓRKA — światło, postęp, animacje części */
.pnd .budowa-scena::before {
  content: ''; position: absolute; inset: 10% 5%; z-index: -1; border-radius: 50%;
  background: radial-gradient(closest-side, rgba(124,184,242,.16), transparent); animation: oddech 5s ease-in-out infinite;
}
.pnd .budowa-scena { isolation: isolate; }
@keyframes oddech { 50% { transform: scale(1.08); opacity: .7; } }
.pnd .czesc.aktywna { filter: drop-shadow(0 0 6px rgba(124,184,242,.75)); }
.pnd .mig { transform-box: fill-box; transform-origin: center; animation: mig .09s linear infinite alternate; }
@keyframes mig { from { transform: scaleX(1); } to { transform: scaleX(.15); } }
.pnd .cz-smigla.aktywna .mig, .pnd .cz-silniki.aktywna ~ .cz-smigla .mig { animation-duration: .05s; }
.pnd .orbita { transform-box: view-box; transform-origin: 250px 184px; animation: obrot 5s linear infinite; opacity: 0; transition: opacity .4s; }
.pnd .cz-gps.aktywna .orbita { opacity: 1; }
.pnd .cz-fc .led { animation: none; }
.pnd .cz-fc.aktywna .led { animation: led .6s steps(2) infinite; }
.pnd .cz-fc.aktywna .led:nth-child(2n) { animation-delay: .2s; }
@keyframes led { 50% { opacity: .2; } }
.pnd .cz-bateria.aktywna .ogniwo { animation: ogniwo 1.8s infinite; }
.pnd .cz-bateria.aktywna .ogniwo:nth-of-type(2) { animation-delay: .3s; }
.pnd .cz-bateria.aktywna .ogniwo:nth-of-type(3) { animation-delay: .6s; }
@keyframes ogniwo { 0% { opacity: .15; } 30%, 100% { opacity: 1; } }
.pnd .fale-radio { opacity: 0; transition: opacity .4s; }
.pnd .cz-lacznosc.aktywna .fale-radio { opacity: 1; }
.pnd .fale-radio path { transform-box: fill-box; transform-origin: left center; animation: radio 1.6s ease-out infinite; }
.pnd .fale-radio path:nth-child(2) { animation-delay: .4s; }
.pnd .fale-radio path:nth-child(3) { animation-delay: .8s; }
@keyframes radio { from { opacity: 1; transform: scale(.6); } to { opacity: 0; transform: scale(1.6); } }
.pnd .skan { opacity: 0; transform-box: view-box; transform-origin: 196px 254px; }
.pnd .cz-czujniki.aktywna .skan { opacity: .5; animation: skan 2.2s ease-in-out infinite alternate; }
@keyframes skan { from { transform: rotate(-14deg); } to { transform: rotate(14deg); } }
.pnd .cz-gimbal.aktywna .obiektyw { transform-box: fill-box; transform-origin: center; animation: gimbal 3s ease-in-out infinite; }
@keyframes gimbal { 25% { transform: translateX(-3px); } 75% { transform: translateX(3px); } }
.pnd .cz-rama.aktywna .obrys { stroke-dasharray: 600; animation: rysuj 1.6s ease-out; }
@keyframes rysuj { from { stroke-dashoffset: 600; } to { stroke-dashoffset: 0; } }
.pnd .postep { position: absolute; left: -8px; top: 50%; transform: translateY(-50%); list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.pnd .postep button { width: 10px; height: 10px; border-radius: 50%; border: 1px solid var(--obw-c); background: transparent; padding: 0; cursor: pointer; transition: all .3s; }
.pnd .postep button.tak { background: var(--akcent-c); border-color: var(--akcent-c); transform: scale(1.3); box-shadow: 0 0 10px var(--akcent-c); }
.pnd .postep button.bylo { background: var(--obw-c); }
.pnd .krok h3 { transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.pnd .krok.aktywny h3 { transform: translateX(8px); }
.pnd .krok .nr { position: relative; }
.pnd .krok.aktywny .nr::before { content: ''; position: absolute; left: -24px; top: 50%; width: 14px; height: 2px; background: var(--akcent-c); }
/* MANEWRY — strugi powietrza */
.pnd .struga { stroke: var(--akcent-j); stroke-width: 2; stroke-dasharray: 4 6; animation: struga .5s linear infinite; opacity: .55; }
.pnd .struga.slaba { stroke: #9FB6CC; animation-duration: 1.2s; opacity: .45; }
@keyframes struga { to { stroke-dashoffset: -20; } }
.pnd .manewr { transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s, border-color .4s; }
.pnd .manewr:hover { transform: translateY(-6px); box-shadow: 0 22px 40px -26px rgba(18,80,140,.5); border-color: #A9C3DD; }
.pnd .manewr svg { background: radial-gradient(closest-side, #EEF3F8, transparent); border-radius: 8px; }
/* Ikony i karty — wirniki ruszają po najechaniu */
.pnd .rodzaj .wirnik, .pnd .karta .wirnik { animation-play-state: paused; }
.pnd .rodzaj:hover .wirnik, .pnd .karta:hover .wirnik { animation-play-state: running; }
.pnd .rodzaj .ikona svg { transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.pnd .rodzaj:hover .ikona svg { transform: translateY(-6px) rotate(-8deg); }
.pnd .przechyl { transform-style: preserve-3d; will-change: transform; position: relative; }
.pnd .przechyl::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .3s;
  background: radial-gradient(400px circle at var(--mx, 50%) var(--my, 50%), rgba(255,255,255,.55), transparent 45%);
  mix-blend-mode: soft-light;
}
.pnd .przechyl:hover::after { opacity: 1; }
.pnd .karta-foto::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(circle at 50% 120%, rgba(18,80,140,.18), transparent 60%);
  transition: opacity .4s; opacity: 0;
}
.pnd .karta:hover .karta-foto::before { opacity: 1; }
.pnd .karta-foto svg { transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.pnd .karta:hover .karta-foto svg { transform: translateY(-10px) scale(1.06); }
.pnd .plakietka { overflow: hidden; }
.pnd .plakietka::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.45) 50%, transparent 65%); transform: translateX(-120%); }
.pnd .karta:hover .plakietka::after { transition: transform .7s; transform: translateX(120%); }
.pnd .karta-stopka span:last-child { transition: transform .3s; }
.pnd .karta:hover .karta-stopka span:last-child { transform: translateX(6px); }
/* SUWAK — scena z ludźmi, którzy się odsuwają */
.pnd .suwak-box { grid-template-columns: 1.1fr 1fr 1fr; }
.pnd .suwak-scena { width: 100%; max-width: 280px; justify-self: center; overflow: visible; }
.pnd .suwak-scena .osoba { transition: transform .7s cubic-bezier(.2,.8,.2,1); }
.pnd .suwak-scena .osoba path, .pnd .suwak-scena .osoba circle { fill: #8C96A4; }
.pnd .suwak-scena .dystans { fill: rgba(30,122,76,.08); stroke: var(--zielony); stroke-dasharray: 4 5; transition: r .7s cubic-bezier(.2,.8,.2,1), stroke .4s, fill .4s; animation: trasa 1.6s linear infinite; }
.pnd .suwak-scena[data-ton=bursztyn] .dystans { stroke: var(--bursztyn); fill: rgba(168,101,11,.08); }
.pnd .suwak-scena[data-ton=czerwony] .dystans { stroke: var(--czerwony); fill: rgba(178,58,46,.07); }
.pnd .suwak-scena .dron-skala { transition: transform .5s cubic-bezier(.2,.8,.2,1); transform-box: view-box; transform-origin: 140px 140px; }
.pnd .wynik .kat { transition: color .4s; }
.pnd .wynik[data-ton=zielony] .kat { color: var(--zielony); }
.pnd .wynik[data-ton=bursztyn] .kat { color: var(--bursztyn); }
.pnd .wynik[data-ton=czerwony] .kat { color: var(--czerwony); }
.pnd .tyk { animation: tyk .35s cubic-bezier(.2,.8,.2,1); }
@keyframes tyk { from { transform: translateY(8px); opacity: .3; } }
.pnd input[type=range] { cursor: grab; }
@media (max-width: 1080px) {.pnd .suwak-box { grid-template-columns: 1fr 1fr; }
.pnd .suwak-scena { grid-column: 1 / -1; grid-row: 1; max-width: 220px; }
 }
@media (max-width: 860px) {.pnd .suwak-box { grid-template-columns: 1fr; }
 }
/* PORÓWNYWARKA — belki */
.pnd .tabela td.lepszy::after { content: none; }
.pnd .suwak-waga small { letter-spacing: 0; }
.pnd .belka { display: block; height: 4px; margin-top: 8px; border-radius: 2px; background: var(--obw-c); overflow: hidden; }
.pnd .belka i { display: block; height: 100%; width: 0; background: var(--cicho-c); border-radius: 2px; transition: width .9s cubic-bezier(.2,.8,.2,1); }
.pnd td.lepszy .belka i { background: var(--akcent-c); box-shadow: 0 0 8px var(--akcent-c); }
.pnd .tabela tbody tr { transition: background .25s; }
.pnd .tabela tbody tr:hover { background: rgba(124,184,242,.06); }
.pnd .porownaj-wybor select { transition: border-color .3s, box-shadow .3s; }
.pnd .porownaj-wybor select:focus { outline: none; border-color: var(--akcent-c); box-shadow: 0 0 0 3px rgba(124,184,242,.25); }
.pnd .vs { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--obw-c); animation: vs 3s ease-in-out infinite; }
@keyframes vs { 50% { box-shadow: 0 0 0 8px rgba(124,184,242,.08); } }
/* Wejścia z opóźnieniem dla grup */
.pnd .ozyw { opacity: 0; transform: translateY(26px); transition: opacity .8s, transform .8s cubic-bezier(.2,.8,.2,1); }
.pnd .ozyw.widac { opacity: 1; transform: none; }
.pnd .sekcja-glowa .etykieta { position: relative; padding-left: 0; transition: padding .6s .3s; }
.pnd .sekcja-glowa.widac .etykieta { padding-left: 22px; }
.pnd .sekcja-glowa .etykieta::before { content: ''; position: absolute; left: 0; top: 5px; height: 2px; width: 0; background: currentColor; transition: width .6s .3s; }
.pnd .sekcja-glowa.widac .etykieta::before { width: 14px; }
.pnd .pomost a { transition: border-color .2s, transform .3s, box-shadow .3s; }
.pnd .pomost a:hover { transform: translateY(-4px); box-shadow: 0 16px 30px -22px rgba(18,80,140,.5); }
.pnd .pomost b::after { content: ' →'; color: var(--akcent-j); opacity: 0; transition: opacity .3s, margin .3s; }
.pnd .pomost a:hover b::after { opacity: 1; margin-left: 4px; }
.pnd .faq details[open] p { animation: wjazd .45s cubic-bezier(.2,.8,.2,1); }
/* PODSTRONA MODELU */
.pnd .model-foto { perspective: 900px; isolation: isolate; }
.pnd .model-foto::before { content: ''; position: absolute; inset: 0; z-index: -1; background-image: radial-gradient(rgba(18,80,140,.18) 1px, transparent 1.4px); background-size: 22px 22px; animation: dryf 40s linear infinite; }
.pnd .model-foto #m-foto { transition: transform .5s cubic-bezier(.2,.8,.2,1); transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); }
.pnd .kafel { transition: background .3s; }
.pnd .kafel:hover { background: #F1F5FA; }
.pnd .werdykt { overflow: hidden; position: relative; }
.pnd .werdykt .kat { animation: kat 1s cubic-bezier(.2,.8,.2,1) both .3s; }
@keyframes kat { from { opacity: 0; transform: scale(.7); letter-spacing: .2em; } }
.pnd .lista-wymogow li { animation: wjazd .6s cubic-bezier(.2,.8,.2,1) both; }
.pnd .lista-wymogow li:nth-child(2) { animation-delay: .1s; }
.pnd .lista-wymogow li:nth-child(3) { animation-delay: .2s; }
.pnd .lista-wymogow li:nth-child(4) { animation-delay: .3s; }
.pnd .lista-wymogow li:nth-child(5) { animation-delay: .4s; }
.pnd .ludzko { transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s, opacity .7s; }
.pnd .ludzko:hover { box-shadow: 0 18px 36px -24px rgba(18,80,140,.45); }
.pnd .spec-grupa tr { transition: background .2s; }
.pnd .spec-grupa tr:hover { background: #EFF3F8; }
.pnd #m-ludzie > g { transition: transform 1.2s cubic-bezier(.2,.8,.2,1); }
/* Powrót do katalogu — na górze karty i pływający */
.pnd .powrot { display: inline-flex; align-items: center; gap: 10px; margin-top: 18px; padding: 10px 16px 10px 12px; border: 1.5px solid var(--tekst-j); border-radius: 999px;
  font: 600 14px var(--font-h); color: var(--tekst-j); text-decoration: none; background: var(--pow-j); transition: background .25s, color .25s; }
.pnd .powrot:hover { background: var(--tekst-j); color: #fff; }
.pnd .powrot-strzalka { display: inline-block; transition: transform .3s cubic-bezier(.2,.8,.2,1); }
.pnd .powrot:hover .powrot-strzalka, .pnd .powrot-plywajacy:hover .powrot-strzalka { transform: translateX(-5px); }
.pnd .powrot-plywajacy { position: fixed; left: 24px; bottom: 24px; z-index: 30; display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px 12px 14px;
  border-radius: 999px; background: var(--akcent-j); color: #fff; border: 1px solid rgba(255,255,255,.22); text-decoration: none; font: 600 15px var(--font-h);
  box-shadow: 0 14px 34px -12px rgba(14,20,27,.55); opacity: 0; transform: translateY(20px); pointer-events: none; transition: opacity .35s, transform .35s cubic-bezier(.2,.8,.2,1), background .25s; }
.pnd .powrot-plywajacy.widac { opacity: 1; transform: none; pointer-events: auto; }
.pnd .powrot-plywajacy:hover { background: #0D3E6E; }
.pnd .powrot-plywajacy b { font: 500 12px var(--font-m); color: #CFE3F7; padding-left: 10px; border-left: 1px solid rgba(255,255,255,.3); }
.pnd .powrot-plywajacy:hover b { color: #fff; }
@media (max-width: 600px) {.pnd .powrot-plywajacy { left: 16px; bottom: 16px; }
.pnd .powrot-plywajacy b { display: none; }
 }
@media (hover: none) {.pnd .przechyl::after { display: none; }
 }
@media (prefers-reduced-motion: reduce) {.pnd .slowo > span { transform: none; }
.pnd .ozyw { opacity: 1; transform: none; }
.lot-dron { display: none; }

}
/* ===== HERO FOTO — kadr z kamery drona ===== */
.pnd .hero-foto { position: relative; min-height: min(92vh, 860px); display: flex; flex-direction: column; justify-content: flex-end; color: #fff; overflow: hidden; background: var(--tlo-c); isolation: isolate; }
.pnd .hf-tlo { position: absolute; inset: -3%; z-index: -3; }
.pnd .hf-tlo img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; display: block; filter: saturate(.82) contrast(1.04);
  animation: kenburns 26s ease-in-out infinite alternate; transform-origin: 67% 24%; transition: translate .8s cubic-bezier(.2,.8,.2,1); translate: var(--px, 0) var(--py, 0); }
@keyframes kenburns { from { transform: scale(1.02); } to { transform: scale(1.1); } }
.pnd .hf-cien { position: absolute; inset: 0; z-index: -2;
  background:
    linear-gradient(90deg, rgba(14,20,27,.92) 0%, rgba(14,20,27,.72) 34%, rgba(14,20,27,.18) 62%, rgba(14,20,27,0) 80%),
    linear-gradient(0deg, rgba(14,20,27,.85) 0%, rgba(14,20,27,0) 34%),
    linear-gradient(180deg, rgba(14,20,27,.55) 0%, rgba(14,20,27,0) 22%); }
.pnd .hf-tresc { position: relative; padding-top: 120px; padding-bottom: 40px; width: 100%; }
.pnd .hf-tresc h1 { color: #fff; max-width: 640px; font-size: clamp(38px, 5.6vw, 72px); margin-bottom: 22px; text-shadow: 0 2px 30px rgba(0,0,0,.35); }
.pnd .hf-tresc .lead { color: #D5DEE8; max-width: 540px; }
.pnd .hf-tresc .etykieta { color: var(--akcent-c); }
.pnd .hf-tresc .akcje { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 30px; }
.pnd .okruszki-jasne, .pnd .okruszki-jasne a { color: rgba(232,237,242,.7); }
.pnd .okruszki-jasne { padding: 0 0 26px; }
.pnd .btn-jasny { background: #fff; color: var(--tekst-j); }
.pnd .btn-jasny:hover { background: var(--akcent-c); color: var(--tlo-c); }
.pnd .btn-szklo { color: #fff; border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.08); backdrop-filter: blur(8px); }
.pnd .btn-szklo:hover { background: rgba(255,255,255,.18); border-color: #fff; }
.pnd .hf-tresc .etykieta, .pnd .hf-tresc .lead, .pnd .hf-tresc .akcje, .pnd .okruszki-jasne { animation: wjazd .9s cubic-bezier(.2,.8,.2,1) both; }
.pnd .hf-tresc .lead { animation-delay: .5s; }
.pnd .hf-tresc .akcje { animation-delay: .65s; }
.pnd .hf-pasek { position: relative; border-top: 1px solid rgba(255,255,255,.14); background: rgba(14,20,27,.45); backdrop-filter: blur(10px); animation: wjazd 1s .8s cubic-bezier(.2,.8,.2,1) both; }
.pnd .hf-pasek .kontener { display: flex; gap: 48px; align-items: center; padding-top: 20px; padding-bottom: 20px; font-family: var(--font-h); }
.pnd .hf-pasek b { font-size: 30px; font-weight: 600; color: var(--akcent-c); margin-right: 10px; }
.pnd .hf-pasek span { font-size: 14px; color: #B9C5D2; }
.pnd .hf-dalej { margin-left: auto; color: #fff; text-decoration: none; font: 500 13px var(--font-m); letter-spacing: .12em; text-transform: uppercase; display: flex; align-items: center; gap: 12px; }
.pnd .hf-dalej i { width: 22px; height: 34px; border: 1.5px solid rgba(255,255,255,.6); border-radius: 12px; position: relative; }
.pnd .hf-dalej i::after { content: ''; position: absolute; left: 50%; top: 7px; width: 3px; height: 7px; margin-left: -1.5px; border-radius: 2px; background: #fff; animation: kolko 1.8s infinite; }
@keyframes kolko { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(12px); } }
/* OSD */
.pnd .hf-osd { position: absolute; inset: 88px 28px 104px; z-index: -1; pointer-events: none; font: 500 12px/1 var(--font-m); color: rgba(232,237,242,.85); letter-spacing: .08em; }
.pnd .rog { position: absolute; width: 26px; height: 26px; border: 0 solid rgba(255,255,255,.55); }
.pnd .r1 { top: 0; left: 0; border-top-width: 2px; border-left-width: 2px; }
.pnd .r2 { top: 0; right: 0; border-top-width: 2px; border-right-width: 2px; }
.pnd .r3 { bottom: 0; left: 0; border-bottom-width: 2px; border-left-width: 2px; }
.pnd .r4 { bottom: 0; right: 0; border-bottom-width: 2px; border-right-width: 2px; }
.pnd .osd-gora { position: absolute; top: 6px; right: 50px; display: flex; gap: 22px; }
.pnd .rec i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #E5484D; margin-right: 7px; animation: led 1.2s steps(2) infinite; }
.pnd .osd-lewo { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); display: grid; gap: 14px; text-align: right; }
.pnd .osd-lewo small { display: block; font-size: 10px; color: rgba(232,237,242,.55); margin-bottom: 4px; }
.pnd .osd-lewo b { font-size: 20px; font-weight: 500; color: #fff; }
.pnd .osd-lewo em { font-style: normal; font-size: 11px; margin-left: 4px; color: rgba(232,237,242,.6); }
.pnd .osd-prawo { position: absolute; top: 6px; left: 50%; transform: translateX(-50%); display: flex; gap: 12px; align-items: center; }
.pnd .bateria { width: 30px; height: 13px; border: 1.5px solid rgba(255,255,255,.7); border-radius: 3px; padding: 1.5px; position: relative; }
.pnd .bateria::after { content: ''; position: absolute; right: -4px; top: 3px; width: 2px; height: 5px; background: rgba(255,255,255,.7); }
.pnd .bateria i { display: block; height: 100%; background: #6FD39A; border-radius: 1px; }
.pnd .horyzont { position: absolute; left: 72%; top: 62%; width: 120px; margin-left: -60px; height: 0; border-top: 1.5px solid rgba(255,255,255,.35); transform: rotate(var(--roll, 0deg)); transition: transform .8s; }
.pnd .horyzont span { position: absolute; left: 50%; top: -6px; width: 12px; height: 12px; margin-left: -6px; border: 1.5px solid rgba(255,255,255,.5); border-radius: 50%; }
.pnd .namiar { position: absolute; width: 74px; height: 56px; margin: -28px 0 0 -37px; left: 0; top: 0; transition: left .6s cubic-bezier(.2,.8,.2,1), top .6s cubic-bezier(.2,.8,.2,1); }
.pnd .namiar > span { position: absolute; width: 14px; height: 14px; border: 0 solid var(--akcent-c); animation: namiar 2.4s ease-in-out infinite; }
@keyframes namiar { 50% { opacity: .45; } }
.pnd .nr1 { top: 0; left: 0; border-top-width: 2px !important; border-left-width: 2px !important; }
.pnd .nr2 { top: 0; right: 0; border-top-width: 2px !important; border-right-width: 2px !important; }
.pnd .nr3 { bottom: 0; left: 0; border-bottom-width: 2px !important; border-left-width: 2px !important; }
.pnd .nr4 { bottom: 0; right: 0; border-bottom-width: 2px !important; border-right-width: 2px !important; }
.pnd .namiar-opis { position: absolute; left: calc(100% + 12px); top: -2px; white-space: nowrap; background: rgba(14,20,27,.55); backdrop-filter: blur(6px); border-left: 2px solid var(--akcent-c); padding: 7px 10px; display: grid; gap: 5px; animation: wjazd .6s 1.2s both; }
.pnd .namiar-opis b { color: #fff; font-weight: 600; }
.pnd .namiar-opis span { color: var(--akcent-c); }
@media (max-width: 860px) {.pnd .hf-osd { inset: 80px 14px 150px; }
.pnd .osd-lewo, .pnd .osd-gora span:not(.rec), .pnd .horyzont { display: none; }
.pnd .namiar-opis { left: auto; right: calc(100% + 10px); border-left: 0; border-right: 2px solid var(--akcent-c); text-align: right; }
.pnd .hf-cien { background: linear-gradient(0deg, rgba(14,20,27,.95) 0%, rgba(14,20,27,.7) 50%, rgba(14,20,27,.2) 100%); }
.pnd .hf-pasek .kontener { gap: 20px; flex-wrap: wrap; }
.pnd .hf-pasek b { font-size: 24px; }
.pnd .hf-dalej { display: none; }
.pnd .hero-foto { min-height: 0; }
.pnd .hf-tresc { padding-top: 240px; }

}
/* Źródła pod suwakiem — metryczka redakcyjna */
.pnd .sw-zrodla { margin-top: 18px; padding: 18px 22px; border-left: 3px solid var(--obw-j); font: 400 13.5px/1.6 var(--font-h); color: var(--cicho-j); }
.pnd .sw-zrodla-tytul { font: 600 11px var(--font-h); letter-spacing: .14em; text-transform: uppercase; color: var(--tekst-j); }
.pnd .sw-zrodla ol { margin: 8px 0 10px; padding-left: 20px; }
.pnd .sw-zrodla li { margin-bottom: 4px; }
.pnd .sw-zrodla li::marker { font-family: var(--font-m); color: var(--akcent-j); }
.pnd .sw-zrodla p { margin: 0; }
.pnd .sw-zrodla a { color: var(--akcent-j); }
/* ===== SUWAK 2,5D ===== */
.pnd .sw { display: grid; grid-template-columns: 1.35fr 1fr; grid-template-rows: auto auto; background: var(--pow-j); border: 1px solid #E4DFD5; border-radius: 16px; overflow: hidden; box-shadow: 0 30px 60px -40px rgba(14,20,27,.35); }
.pnd .sw-scena { position: relative; grid-row: 1; grid-column: 1; background: linear-gradient(180deg, #F3F6F9 0%, #FFFFFF 70%); padding: 26px 26px 0; }
.pnd .sw-scena svg { width: 100%; display: block; overflow: visible; }
.pnd .sw-waga { position: absolute; top: 26px; left: 32px; font-family: var(--font-h); display: flex; align-items: baseline; gap: 10px; }
.pnd .sw-waga b { font-size: 64px; font-weight: 600; letter-spacing: -0.04em; line-height: 1; font-variant-numeric: tabular-nums; }
.pnd .sw-waga span { color: var(--cicho-j); font-size: 16px; }
.pnd .sw-strefa { fill: rgba(30,122,76,.10); stroke: var(--zielony); stroke-width: 2; stroke-dasharray: 6 6; transition: rx .8s cubic-bezier(.2,.8,.2,1), ry .8s cubic-bezier(.2,.8,.2,1), fill .4s, stroke .4s; animation: trasa 1.8s linear infinite; }
.pnd #s-scena { color: var(--zielony); transition: color .4s; }
.pnd #s-scena[data-ton=bursztyn] { color: var(--bursztyn); }
.pnd #s-scena[data-ton=czerwony] { color: var(--czerwony); }
.pnd #s-scena[data-ton=bursztyn] .sw-strefa { fill: rgba(168,101,11,.10); stroke: var(--bursztyn); }
.pnd #s-scena[data-ton=czerwony] .sw-strefa { fill: rgba(178,58,46,.08); stroke: var(--czerwony); }
.pnd .sw-dron { transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.pnd .sw-unos { animation: unos 4s ease-in-out infinite; }
.pnd .sw-cien { animation: cien 4s ease-in-out infinite; }
.pnd .sw-led { animation: led 1s steps(2) infinite; }
.pnd .osoba { transition: transform .9s cubic-bezier(.2,.8,.2,1); }
.pnd .osoba-cialo { fill: #5E6B7B; }
.pnd .osoba-cien { fill: #14181F; opacity: .12; }
.pnd #s-osoby-tyl .osoba-cialo { fill: #8D99A8; }
.pnd .sw-miara line { stroke: currentColor; stroke-width: 1.5; stroke-dasharray: 2 4; }
.pnd #sw-miara-pill { transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.pnd #sw-miara-pill rect { fill: #fff; stroke: currentColor; stroke-width: 1.5; }
.pnd #sw-miara-pill text { font: 600 12px var(--font-h); fill: currentColor; }
.pnd .sw-sterowanie { grid-row: 2; grid-column: 1; padding: 14px 32px 30px; background: #fff; }
.pnd .sw-tor { position: relative; padding-bottom: 26px; }
.pnd #s-suwak { -webkit-appearance: none; appearance: none; width: 100%; height: 10px; margin: 14px 0 0; border-radius: 6px; cursor: grab;
  background:
    linear-gradient(90deg, var(--akcent-j) 0 var(--p, 26%), transparent var(--p, 26%)),
    linear-gradient(90deg, #CFE6D9 0 25.9%, #DCEBDF 25.9% 46.5%, #F1E1C4 46.5% 70.5%, #F0D2CD 70.5% 100%); }
.pnd #s-suwak::-webkit-slider-thumb { -webkit-appearance: none; width: 30px; height: 30px; border-radius: 50%; background: #fff; border: 3px solid var(--akcent-j); box-shadow: 0 4px 14px rgba(18,80,140,.35); transition: transform .2s; }
.pnd #s-suwak:active::-webkit-slider-thumb { transform: scale(1.15); cursor: grabbing; }
.pnd #s-suwak::-moz-range-thumb { width: 26px; height: 26px; border-radius: 50%; background: #fff; border: 3px solid var(--akcent-j); }
.pnd .sw-progi { position: absolute; left: 15px; right: 15px; bottom: 0; height: 20px; font: 500 12px var(--font-m); color: var(--cicho-j); }
.pnd .sw-progi span { position: absolute; transform: translateX(-50%); white-space: nowrap; }
.pnd .sw-progi span::before { content: ''; position: absolute; left: 50%; top: -9px; width: 1px; height: 6px; background: var(--obw-j); }
.pnd .sw-klasy { display: flex; align-items: center; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.pnd .sw-klasy-podpis { font: 500 13px var(--font-h); color: var(--cicho-j); margin-right: 6px; }
.pnd .ce { display: grid; place-items: center; width: 58px; height: 52px; border: 2px solid var(--tekst-j); border-radius: 8px; background: #fff; color: var(--tekst-j); font: 700 18px/1 var(--font-h); cursor: pointer; transition: all .25s; padding: 0; }
.pnd .ce small { font: 500 9px var(--font-m); letter-spacing: .1em; text-transform: uppercase; opacity: .6; }
.pnd .ce:hover:not(:disabled) { transform: translateY(-3px); box-shadow: 0 8px 18px -10px rgba(14,20,27,.5); }
.pnd .ce[aria-pressed=true] { background: var(--tekst-j); color: #fff; }
.pnd .ce:disabled { opacity: .25; cursor: not-allowed; border-style: dashed; }
.pnd .sw-przyklad { font: 400 14px var(--font-h); color: var(--cicho-j); margin: 16px 0 0; min-height: 20px; }
.pnd .sw-wynik { grid-row: 1 / 3; grid-column: 2; background: var(--tlo-c); color: var(--tekst-c); padding: 40px 38px; border-left: 0 !important; display: flex; flex-direction: column; position: relative; overflow: hidden; }
.pnd .sw-wynik::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--zielony); transition: background .4s; }
.pnd .sw-wynik[data-ton=bursztyn]::before { background: var(--bursztyn); }
.pnd .sw-wynik[data-ton=czerwony]::before { background: var(--czerwony); }
.pnd .sw-wynik::after { content: ''; position: absolute; right: -90px; top: -90px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(closest-side, rgba(124,184,242,.16), transparent); }
.pnd .sw-wynik-etykieta { font: 600 12px var(--font-h); letter-spacing: .14em; text-transform: uppercase; color: var(--cicho-c); }
.pnd .sw-wynik .kat { font: 600 110px/1 var(--font-h); letter-spacing: -0.05em; margin: 8px 0 6px; }
.pnd .sw-wynik[data-ton=zielony] .kat { color: #5CC18E; }
.pnd .sw-wynik[data-ton=bursztyn] .kat { color: #E3A44A; }
.pnd .sw-wynik[data-ton=czerwony] .kat { color: #EF7F72; }
.pnd .sw-skrot { font: 600 19px/1.35 var(--font-h); color: #fff; margin-bottom: 18px; }
.pnd .sw-wynik dl { margin: auto 0 0; display: grid; font-family: var(--font-h); }
.pnd .sw-wynik dl > div { padding: 14px 0; border-top: 1px solid var(--obw-c); }
.pnd .sw-wynik dt { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--cicho-c); margin: 0 0 4px; }
.pnd .sw-wynik dd { margin: 0; font-size: 16px; color: var(--tekst-c); }
@media (max-width: 960px) {.pnd .sw { grid-template-columns: 1fr; }
.pnd .sw-wynik { grid-row: auto; grid-column: auto; }
.pnd .sw-scena, .pnd .sw-sterowanie { grid-column: auto; grid-row: auto; }
.pnd .sw-waga b { font-size: 46px; }
.pnd .sw-wynik .kat { font-size: 80px; }
.pnd .sw-sterowanie { padding: 14px 20px 26px; }
.pnd .sw-scena { padding: 70px 10px 0; }
.pnd .sw-waga { left: 20px; top: 20px; }

}


/* --- poprawki pod Blocksy --- */
.pnd { background: var(--tlo-j); color: var(--tekst-j); font: 400 18px/1.65 var(--font-t); overflow-x: clip; }
.pnd .hf-osd { inset: 24px 28px 104px; }
.pnd .hf-tresc { padding-top: 64px; }
.pnd .karta[hidden] { display: none; }
.pnd table, .pnd th, .pnd td { border: 0; background: none; }
.pnd .spec-grupa th, .pnd .spec-grupa td { border-bottom: 1px solid #E4DFD5; }
.pnd .tabela th, .pnd .tabela td { border-bottom: 1px solid var(--obw-c); }
.pnd .pnd-quad { display: block; }
.pnd .karta-foto .pnd-quad { width: 46%; color: #8FA6BF; }
.pnd .karta-foto .pnd-quad svg { width: 100%; }
/* przycisk powrotu na karcie modelu: widoczny od wejścia, większy, pełny napis także na telefonie */
.pnd .powrot-plywajacy { padding: 14px 22px 14px 18px; font-size: 16px; gap: 12px; box-shadow: 0 16px 36px -12px rgba(14,20,27,.6); }
.pnd .powrot-plywajacy .powrot-strzalka { font-size: 18px; }
.pnd .powrot-plywajacy.pulsuj { animation: pnd-pulsuj 1.6s cubic-bezier(.2,.8,.2,1) .8s 2; }
@keyframes pnd-pulsuj { 0% { box-shadow: 0 0 0 0 rgba(124,184,242,.7), 0 16px 36px -12px rgba(14,20,27,.6); } 100% { box-shadow: 0 0 0 18px rgba(124,184,242,0), 0 16px 36px -12px rgba(14,20,27,.6); } }
@media (max-width: 600px) { .pnd .powrot-plywajacy { padding: 12px 18px 12px 14px; font-size: 15px; } }
.pnd .katalog-licznik { font: 500 13px var(--font-m); color: var(--cicho-j); margin-left: 8px; align-self: center; }
.pnd .pnd-zrodla { margin: 6px 0 8px; padding-left: 20px; }
.pnd .pnd-znaki { margin: 0; padding: 28px 0; border-top: 1px solid #E4DFD5; font: 400 13px/1.6 var(--font-h); color: var(--cicho-j); }
.pnd .pnd-znaki .kontener { display: block; }
.pnd .wp-block-group.pnd-sekcja { max-width: var(--siatka); margin: 0 auto; padding: 96px var(--margines); }
.pnd .pnd-sekcja + .pnd-sekcja { border-top: 1px solid #E4DFD5; }
.pnd .faq h3 { font: 600 19px var(--font-h); margin: 26px 0 8px; }
.pnd .faq h3 + p { margin: 0 0 14px; }
@media (max-width: 860px) { .pnd .hf-tresc { padding-top: 160px; } .pnd .hf-osd { inset: 16px 14px 150px; } }

/* --- rozbiórka na telefonie: nagłówek serwisu nie jest przyklejony, więc scena od samej góry,
       niższa, z przejściem w tekst; kropki postępu poziomo pod dronem --- */
@media (max-width: 900px) {
  .pnd .budowa-scena { top: 0; height: 250px; margin: 0 calc(-1 * var(--margines)); padding: 8px var(--margines) 22px;
    background: linear-gradient(180deg, var(--tlo-c) 82%, rgba(14,20,27,0)); }
  .pnd .budowa-scena::before { inset: 4% 12% 10%; }
  .pnd .postep { left: 50%; top: auto; bottom: 6px; transform: translateX(-50%); flex-direction: row; gap: 9px; }
  .pnd .postep button { width: 8px; height: 8px; }
  .pnd .krok { padding: 36px 0; }
  .pnd .krok.aktywny .nr::before { display: none; }
}

/* --- HUB w barwach hero i rozbiórki (28.10, właściciel: „reszta sekcji w kolorystyce pierwszych 2”) ---
       Karta modelu zostaje jasna; tu nadpisujemy wyłącznie stronę /drony/ (body.pnd-hub). */
.pnd-hub .pnd { background: var(--tlo-c); color: var(--tekst-c); --cicho-j: #9AA8B8; }
.pnd-hub .pnd .sekcja, .pnd-hub .pnd .pnd-sekcja { background: var(--tlo-c); color: var(--tekst-c); }
/* rytm: co druga sekcja o ton jaśniejsza (rozbiórka zostaje w czerni hero — przejście scenie na telefonie) */
.pnd-hub .pnd #jak-dziala + .sekcja, .pnd-hub .pnd #waga, .pnd-hub .pnd #porownaj, .pnd-hub .pnd .wp-block-group.pnd-sekcja.faq { background: #111B26; }
.pnd-hub .pnd .sekcja + .sekcja, .pnd-hub .pnd .pnd-sekcja + .pnd-sekcja { border-top: 1px solid #1C2836; }
.pnd-hub .pnd h2, .pnd-hub .pnd h3 { color: #fff; }
.pnd-hub .pnd .etykieta { color: var(--akcent-c); }
.pnd-hub .pnd .sekcja-glowa p, .pnd-hub .pnd .lead { color: var(--cicho-c); }
.pnd-hub .pnd a { color: var(--akcent-c); }
.pnd-hub .pnd .wp-block-group.pnd-sekcja { max-width: none; padding-left: max(var(--margines), calc((100% - var(--siatka)) / 2 + var(--margines))); padding-right: max(var(--margines), calc((100% - var(--siatka)) / 2 + var(--margines))); }
.pnd-hub .pnd .wp-block-group.pnd-sekcja.faq > * { max-width: var(--tekst); margin-left: auto; margin-right: auto; }

/* ruch: karty manewrów */
.pnd-hub .pnd .manewr { background: var(--pow-c); border-color: var(--obw-c); }
.pnd-hub .pnd .manewr:hover { border-color: #4C6A8A; box-shadow: 0 22px 40px -26px rgba(0,0,0,.8); }
.pnd-hub .pnd .manewr svg { background: radial-gradient(closest-side, #1E2E40, transparent); }
.pnd-hub .pnd .manewr p { color: var(--cicho-c); }
.pnd-hub .pnd .manewr [fill="#14181F"] { fill: #DCE6F0; }
.pnd-hub .pnd .manewr [stroke="#14181F"] { stroke: #DCE6F0; }
.pnd-hub .pnd .manewr [stroke="#12508C"] { stroke: var(--akcent-c); }
.pnd-hub .pnd .manewr [stroke="#C4BDB0"] { stroke: #4C5E72; }
.pnd-hub .pnd .szybko { fill: var(--akcent-c); }
.pnd-hub .pnd .wolno, .pnd-hub .pnd .silnik.wolno[style] { fill: #3A4B60 !important; }
.pnd-hub .pnd .struga { stroke: var(--akcent-c); }
.pnd-hub .pnd .struga.slaba { stroke: #4C6178; }

/* rodzaje */
.pnd-hub .pnd .rodzaje { background: var(--obw-c); border-color: var(--obw-c); }
.pnd-hub .pnd .rodzaj { background: var(--pow-c); color: var(--tekst-c); }
.pnd-hub .pnd .rodzaj:hover { background: #1D2B3B; }
.pnd-hub .pnd .rodzaj .ikona { color: var(--akcent-c); }
.pnd-hub .pnd .rodzaj p { color: var(--cicho-c); }
.pnd-hub .pnd .rodzaj .waga { color: #C9D3DE; }

/* suwak */
.pnd-hub .pnd .sw { background: var(--pow-c); border-color: var(--obw-c); box-shadow: 0 30px 60px -40px rgba(0,0,0,.9); }
.pnd-hub .pnd .sw-scena { background: linear-gradient(180deg, #14202D 0%, var(--pow-c) 75%); }
.pnd-hub .pnd .sw-sterowanie { background: var(--pow-c); }
.pnd-hub .pnd .sw-waga b { color: #fff; }
.pnd-hub .pnd .sw-waga span, .pnd-hub .pnd .sw-klasy-podpis, .pnd-hub .pnd .sw-przyklad, .pnd-hub .pnd .sw-progi { color: var(--cicho-c); }
.pnd-hub .pnd .sw-progi span::before { background: var(--obw-c); }
.pnd-hub .pnd #sw-ziemia stop { stop-color: #23364B; }
.pnd-hub .pnd #sw-siatka { stroke: #2C3E52; opacity: 1; }
.pnd-hub .pnd .osoba-cialo { fill: #A9B8C9; }
.pnd-hub .pnd #s-osoby-tyl .osoba-cialo { fill: #6B7F95; }
.pnd-hub .pnd .osoba-cien { fill: #000; opacity: .35; }
.pnd-hub .pnd .sw-korpus [fill="#14181F"] { fill: #DCE6F0; }
.pnd-hub .pnd .sw-korpus [stroke="#14181F"] { stroke: #DCE6F0; }
.pnd-hub .pnd .sw-korpus [fill="#33445A"] { fill: #8EA3BA; }
.pnd-hub .pnd .sw-korpus [fill="#12508C"] { fill: var(--akcent-c); }
.pnd-hub .pnd .sw-cien { fill: #000; }
.pnd-hub .pnd #sw-miara-pill rect { fill: var(--pow-c); }
.pnd-hub .pnd #s-scena { color: #5CC18E; }
.pnd-hub .pnd #s-scena[data-ton=bursztyn] { color: #E3A44A; }
.pnd-hub .pnd #s-scena[data-ton=czerwony] { color: #EF7F72; }
.pnd-hub .pnd .sw-strefa { fill: rgba(92,193,142,.12); stroke: #5CC18E; }
.pnd-hub .pnd #s-scena[data-ton=bursztyn] .sw-strefa { fill: rgba(227,164,74,.12); stroke: #E3A44A; }
.pnd-hub .pnd #s-scena[data-ton=czerwony] .sw-strefa { fill: rgba(239,127,114,.10); stroke: #EF7F72; }
.pnd-hub .pnd #s-suwak { background:
    linear-gradient(90deg, var(--akcent-c) 0 var(--p, 26%), transparent var(--p, 26%)),
    linear-gradient(90deg, #1F4733 0 25.9%, #2A4436 25.9% 46.5%, #4E3C1E 46.5% 70.5%, #4E2723 70.5% 100%); }
.pnd-hub .pnd #s-suwak::-webkit-slider-thumb { background: var(--tlo-c); border-color: var(--akcent-c); box-shadow: 0 0 0 6px rgba(124,184,242,.15); }
.pnd-hub .pnd #s-suwak::-moz-range-thumb { background: var(--tlo-c); border-color: var(--akcent-c); }
.pnd-hub .pnd .ce { background: transparent; border-color: #C9D3DE; color: #E8EDF2; }
.pnd-hub .pnd .ce[aria-pressed=true] { background: #E8EDF2; color: var(--tlo-c); border-color: #E8EDF2; }
.pnd-hub .pnd .ce:hover:not(:disabled) { box-shadow: 0 8px 18px -10px rgba(0,0,0,.9); }
.pnd-hub .pnd .sw-wynik { background: #0A1016; }
.pnd-hub .pnd .sw-zrodla { border-left-color: var(--obw-c); color: var(--cicho-c); }
.pnd-hub .pnd .sw-zrodla-tytul { color: #E8EDF2; }
.pnd-hub .pnd .sw-zrodla li::marker { color: var(--akcent-c); }

/* katalog */
.pnd-hub .pnd .chip { background: transparent; border-color: var(--obw-c); color: var(--tekst-c); }
.pnd-hub .pnd .chip:hover { border-color: var(--akcent-c); }
.pnd-hub .pnd .chip[aria-pressed=true] { background: #E8EDF2; border-color: #E8EDF2; color: var(--tlo-c); }
.pnd-hub .pnd .sortuj select { background: var(--pow-c); border-color: var(--obw-c); color: var(--tekst-c); }
.pnd-hub .pnd .karta { background: var(--pow-c); border-color: var(--obw-c); color: var(--tekst-c); }
.pnd-hub .pnd .karta:hover { box-shadow: 0 18px 40px -20px rgba(0,0,0,.9); border-color: #4C6A8A; }
.pnd-hub .pnd .karta-foto { background: linear-gradient(160deg, #1B2A3B, #22354A); }
.pnd-hub .pnd .karta-foto .pnd-quad { color: #7F98B4; }
.pnd-hub .pnd .karta-foto::before { background: radial-gradient(circle at 50% 120%, rgba(124,184,242,.22), transparent 60%); }
.pnd-hub .pnd .karta h3 { color: #fff; }
.pnd-hub .pnd .karta-producent, .pnd-hub .pnd .parametry dt { color: var(--cicho-c); }
.pnd-hub .pnd .parametry dd { color: var(--tekst-c); }
.pnd-hub .pnd .karta-stopka { border-top-color: var(--obw-c); color: var(--akcent-c); }
.pnd-hub .pnd .katalog-licznik { color: var(--cicho-c); }

/* pomost, FAQ, znaki towarowe */
.pnd-hub .pnd .pomost a { background: var(--pow-c); border-color: var(--obw-c); color: var(--tekst-c); }
.pnd-hub .pnd .pomost a:hover { border-color: var(--akcent-c); box-shadow: 0 16px 30px -22px rgba(0,0,0,.9); }
.pnd-hub .pnd .pomost b { color: #fff; }
.pnd-hub .pnd .pomost b::after { color: var(--akcent-c); }
.pnd-hub .pnd .pomost span { color: var(--cicho-c); }
.pnd-hub .pnd .faq details { border-bottom-color: var(--obw-c); }
.pnd-hub .pnd .faq summary, .pnd-hub .pnd .faq h3 { color: #fff; }
.pnd-hub .pnd .faq summary::after { color: var(--akcent-c); }
.pnd-hub .pnd .faq p { color: #C9D3DE; }
/* akordeon FAQ z szlif.js (motyw stylizuje go tylko w .entry-content, której szablon działu nie ma) — ten sam kontrakt klas */
.pnd .faq h2 { margin-bottom: 28px; }
.pnd .pn-akordeon { border-top: 1px solid var(--obw-c); }
.pnd .pn-akordeon:last-of-type { border-bottom: 1px solid var(--obw-c); }
.pnd .pn-akordeon h3 { margin: 0; font-size: inherit; line-height: inherit; }
.pnd .pn-akordeon-pytanie { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; padding: 18px 2px; margin: 0;
  background: none; border: none; border-radius: 0; box-shadow: none; text-align: left; cursor: pointer;
  font-family: var(--font-h); font-size: 19px; font-weight: 600; line-height: 1.35; letter-spacing: -0.01em; color: #fff; transition: color .2s ease; }
.pnd .pn-akordeon-pytanie:hover, .pnd .pn-akordeon-pytanie:focus-visible { color: var(--akcent-c); background: none; }
.pnd .pn-akordeon-pytanie:focus-visible { outline: 2px solid var(--akcent-c); outline-offset: 2px; }
.pnd .pn-akordeon-pytanie::after { content: ""; flex: none; width: 9px; height: 9px; margin-right: 6px;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .3s ease; }
.pnd .pn-otwarte .pn-akordeon-pytanie::after { transform: rotate(-135deg) translateY(-2px); }
.pnd .pn-akordeon-tresc { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows .35s ease, opacity .3s ease; }
.pnd .pn-otwarte .pn-akordeon-tresc { grid-template-rows: 1fr; opacity: 1; }
.pnd .pn-akordeon-wnetrze { overflow: hidden; min-height: 0; }
.pnd .pn-akordeon-wnetrze > :first-child { margin-top: 0; }
.pnd .pn-akordeon-wnetrze > :last-child { margin-bottom: 18px; }
.pnd .pn-akordeon-wnetrze p { font-size: 17px; color: #C9D3DE; }
.pnd-hub .pnd .wp-block-group.pnd-sekcja.faq > .etykieta { display: block; }
.pnd-hub .pnd .btn-jasny { color: var(--tekst-j); }
.pnd-hub .pnd .btn-jasny:hover { color: var(--tlo-c); }
.pnd-hub .pnd .btn-szklo { color: #fff; }
.pnd-hub .pnd .pnd-znaki { background: var(--tlo-c); border-top-color: #1C2836; color: #7D8B9B; }
