/* Karta produktu: dodatki z podgladu Tomka 03.11 (Pra-Ser). Kawalki wstawia zewsi-karta-grupy-dodatki-1.js. */

/* skala intensywnosci nad krotkim opisem */
.zw-intens { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #6b5e4f; }
.zw-intens__paski { display: flex; gap: 4px; }
.zw-intens__paski i { width: 30px; height: 8px; border-radius: 4px; background: #eadfd3; }
.zw-intens__paski i.on { background: #610700; }

/* znak certyfikatu na zdjeciu: link do ramki, zamiast etykiety tekstowej */
.zw-cert-znak-on.zw-ma-certyfikat .zw-galeria::before { content: none !important; }
.zw-cert-znak { position: absolute; top: 14px; left: 14px; z-index: 6; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 12px 8px; border-radius: 14px; background: rgba(255, 255, 255, .9); backdrop-filter: blur(4px); box-shadow: 0 4px 14px rgba(40, 20, 10, .12); text-decoration: none !important; transition: transform .15s; }
.zw-cert-znak:hover { transform: scale(1.04); }
.zw-cert-znak img { width: 58px; height: 58px; object-fit: contain; }
.zw-cert-znak span { font-size: 11px; font-weight: 600; color: #610700; white-space: nowrap; }

/* ramka certyfikatu przeniesiona pod kroki "Jak powstaje" + opis */
#jak-powstaje .jdev-cert { margin-top: 40px; }
.jdev-cert { scroll-margin-top: 120px; }
.jdev-cert__opis { margin: 8px 0 0; font-size: 14px; color: #4a423b; }

/* "Ile wziac? Podpowiadamy" pod wagami */
.zw-ile-wziac { display: inline-block; margin: 4px 0 16px; font-size: 13px; color: #610700; }
#wybor { scroll-margin-top: 120px; }


@media (max-width: 640px) {
	.zw-cert-znak { top: 10px; left: 10px; padding: 7px 9px 6px; }
	.zw-cert-znak img { width: 44px; height: 44px; }
	.zw-cert-znak span { font-size: 10px; }
	.zw-intens__paski i { width: 22px; }
}