/* MYKObyPRZ – strona How To (port npz-howto.css v3 na bloki, D-074). Hotspoty: blok nprz/hotspots. */
.nprz-body .nprz-iconstrip.nprz-iconstrip--3.wp-block-group { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nprz-body .nprz-howimg { display: block; width: 100%; height: auto; border-radius: 0; }
.nprz-body .nprz-howimg--crop img { aspect-ratio: 4 / 5; object-fit: cover; }
.nprz-body .nprz-sec { counter-reset: nprz-sn; scroll-margin-top: 110px; }
.nprz-body #hero.nprz-b2bhero { min-height: 74vh; }
.nprz-body .nprz-hwrow.nprz-row { align-items: flex-start; }
.nprz-body .nprz-colmid, .nprz-body .nprz-hotcol { align-self: flex-start; }
.nprz-body .nprz-sticky { position: sticky; top: 150px; }
.nprz-body .nprz-row.nprz-hwrow > .nprz-col.nprz-hotcol { padding: 0; }

/* pasek rozdziałów */
.nprz-body .nprz-chapbar { position: sticky; top: 85px; z-index: 30; background: var(--nprz-white); border-top: 1px solid var(--nprz-grey); border-bottom: 1px solid var(--nprz-grey); }
.nprz-body .nprz-chapbar .nprz-sec__inner { padding-top: 0; padding-bottom: 0; }
.nprz-body .nprz-chapnav { counter-reset: nprz-chap; margin: 0; padding: 0; list-style: none; display: flex; gap: 0; }
.nprz-body .nprz-chapnav li { counter-increment: nprz-chap; margin: 0; padding: 0; }
.nprz-body .nprz-chapnav li a { display: flex; gap: 10px; align-items: baseline; padding: 18px 28px 16px 0; margin-right: 12px; border-bottom: 2px solid transparent; font-family: var(--nprz-font-cap); font-size: 14px; font-weight: 500; letter-spacing: var(--nprz-track); text-transform: uppercase; text-decoration: none; color: var(--nprz-dark); transition: color .3s var(--nprz-ease), border-color .3s var(--nprz-ease); }
.nprz-body .nprz-chapnav li a::before { content: counter(nprz-chap, decimal-leading-zero); color: var(--nprz-amber); }
.nprz-body .nprz-chapnav li a:hover, .nprz-body .nprz-chapnav li.is-on a { color: var(--nprz-teal); border-bottom-color: var(--nprz-teal); }

/* kroki */
.nprz-body .nprz-stepitem { margin: 0 !important; }
.nprz-body .nprz-stepitem--h, .nprz-body .nprz-stepitem--solo { position: relative; counter-increment: nprz-sn; border-top: 1px solid rgba(20,41,39,.18); padding: 24px 0 0 64px; }
.nprz-body .nprz-sec--dark .nprz-stepitem--h { border-top-color: rgba(207,204,195,.32); }
.nprz-body .nprz-stepitem--h::before, .nprz-body .nprz-stepitem--solo::before { content: counter(nprz-sn); position: absolute; left: 0; top: 24px; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--nprz-amber); color: #fff; font-family: var(--nprz-font-cap); font-size: 17px; font-weight: 500; transition: box-shadow .3s var(--nprz-ease); }
.nprz-body .nprz-stepitem--solo::before { background: var(--nprz-teal); }
.nprz-body h3.nprz-stepitem--h { font-family: var(--nprz-font-head); font-weight: 600; font-size: clamp(22px, 1.9vw, 28px); line-height: 1.05; text-transform: uppercase; color: var(--nprz-dark); }
.nprz-body .nprz-sec--dark h3.nprz-stepitem--h { color: var(--nprz-white); }
.nprz-body .nprz-stepitem--t { padding: 8px 0 24px 64px; font-size: 17px; line-height: 1.55; max-width: calc(56ch + 64px); color: var(--nprz-dark); }
.nprz-body .nprz-stepitem--solo { padding-bottom: 24px; min-height: 40px; font-size: 17px; line-height: 1.55; max-width: calc(56ch + 64px); color: var(--nprz-dark); }
.nprz-body .nprz-sec--dark .nprz-stepitem--t, .nprz-body .nprz-sec--dark .nprz-stepitem--solo { color: var(--nprz-white); opacity: .9; }
.nprz-body .nprz-stepitem.is-on::before { box-shadow: 0 0 0 7px rgba(210,105,24,.28); }
.nprz-body h3.nprz-stepitem--h.is-on { color: var(--nprz-amber); }
.nprz-body .nprz-hint { margin-top: 12px; font-family: var(--nprz-font-cap); font-size: 13px; font-weight: 500; letter-spacing: var(--nprz-track); text-transform: uppercase; color: var(--nprz-amber); }
.nprz-body .nprz-hint::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--nprz-amber); margin-right: 10px; }
.nprz-body .nprz-harvest .nprz-lead strong { font-family: inherit; font-weight: 500; letter-spacing: 0; text-transform: none; }
.nprz-body .nprz-harvest-end { margin-top: 72px; border-top: 1px solid rgba(20,41,39,.18); padding-top: 56px; }
.nprz-body .nprz-harvest-end .nprz-h3 { font-size: clamp(30px, 3vw, 48px); line-height: 1.02; }
.nprz-body .nprz-harvest-end p { margin-bottom: 28px; }
.nprz-body .nprz-quote-text { font-family: var(--nprz-font-body); font-weight: 500; font-size: 18px; line-height: 1.5; text-transform: none; padding-left: 22px; border-left: 2px solid var(--nprz-amber); }
.nprz-body .nprz-howlegal .nprz-text--onDark, .nprz-body .nprz-howlegal .nprz-text--onDark p { color: var(--nprz-white); opacity: .86; max-width: 56ch; }
.nprz-body .nprz-howlegal a { color: var(--nprz-teal); text-decoration: underline; }

/* zdjęcie z punktami (blok nprz/hotspots) */
.nprz-body .nprz-hotwrap { position: relative; }
.nprz-body .nprz-hotwrap > img { display: block; width: 100%; height: auto; }
.nprz-body .nprz-hot { position: absolute; z-index: 3; width: 34px; }
.nprz-body .nprz-hot__btn { all: unset; box-sizing: border-box; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--nprz-amber); color: #fff; font-family: var(--nprz-font-cap); font-weight: 500; font-size: 15px; line-height: 1; cursor: pointer; animation: nprz-hotpulse-a 2.4s infinite; transition: background-color .3s var(--nprz-ease), transform .3s var(--nprz-ease), box-shadow .3s; }
.nprz-body .nprz-hot__btn:focus-visible { outline: 2px solid var(--nprz-white); outline-offset: 2px; }
.nprz-body .nprz-hot--good .nprz-hot__btn { background: var(--nprz-teal); animation-name: nprz-hotpulse-t; }
.nprz-body .nprz-hot:hover .nprz-hot__btn, .nprz-body .nprz-hot.is-hint .nprz-hot__btn, .nprz-body .nprz-hot.is-open .nprz-hot__btn { transform: scale(1.18); animation: none; box-shadow: 0 0 0 8px rgba(210,105,24,.32); }
.nprz-body .nprz-hot--good:hover .nprz-hot__btn, .nprz-body .nprz-hot--good.is-open .nprz-hot__btn { box-shadow: 0 0 0 8px rgba(53,156,149,.32); }
.nprz-body .nprz-hot__tip { position: absolute; z-index: 5; width: 260px; padding: 14px 16px; background: var(--nprz-white); color: var(--nprz-dark); border-left: 3px solid var(--nprz-amber); box-shadow: 0 8px 28px rgba(20,41,39,.28); font-size: 15px; line-height: 1.45; text-align: left; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .25s var(--nprz-ease), visibility .25s; top: 50%; transform: translateY(-50%); }
.nprz-body .nprz-hot--good .nprz-hot__tip { border-left-color: var(--nprz-teal); }
.nprz-body .nprz-hot--right .nprz-hot__tip { left: 46px; }
.nprz-body .nprz-hot--left .nprz-hot__tip { right: 46px; }
.nprz-body .nprz-hot--top .nprz-hot__tip { left: 50%; top: auto; bottom: 46px; transform: translateX(-50%); }
.nprz-body .nprz-hot:hover, .nprz-body .nprz-hot:focus-within, .nprz-body .nprz-hot.is-open { z-index: 9; }
.nprz-body .nprz-hot:hover .nprz-hot__tip, .nprz-body .nprz-hot:focus-within .nprz-hot__tip, .nprz-body .nprz-hot.is-open .nprz-hot__tip { opacity: 1; visibility: visible; }
@keyframes nprz-hotpulse-a { 0% { box-shadow: 0 0 0 0 rgba(210,105,24,.55); } 70% { box-shadow: 0 0 0 14px rgba(210,105,24,0); } 100% { box-shadow: 0 0 0 0 rgba(210,105,24,0); } }
@keyframes nprz-hotpulse-t { 0% { box-shadow: 0 0 0 0 rgba(53,156,149,.55); } 70% { box-shadow: 0 0 0 14px rgba(53,156,149,0); } 100% { box-shadow: 0 0 0 0 rgba(53,156,149,0); } }
@media (prefers-reduced-motion: reduce) { .nprz-body .nprz-hot__btn { animation: none; } }

@media (max-width: 1024px) {
	.nprz-body .nprz-sticky { position: static; }
	.nprz-body .nprz-colmid, .nprz-body .nprz-hotcol { align-self: stretch; }
	.nprz-body .nprz-chapnav { overflow-x: auto; }
	.nprz-body .nprz-harvest-end { margin-top: 48px; padding-top: 36px; }
}
@media (max-width: 640px) {
	.nprz-body .nprz-iconstrip.nprz-iconstrip--3.wp-block-group { grid-template-columns: 1fr; }
	.nprz-body .nprz-iconstrip--3 .nprz-iconstrip__item.wp-block-group { border-left: 0; border-top: 1px solid rgba(207,204,195,.18); padding: 18px 12px 20px; }
	.nprz-body .nprz-chapnav li a { padding: 14px 14px 12px 0; font-size: 12px; white-space: nowrap; }
	.nprz-body #hero.nprz-b2bhero { min-height: 0; }
	.nprz-body .nprz-stepitem--h, .nprz-body .nprz-stepitem--solo, .nprz-body .nprz-stepitem--t { padding-left: 52px; }
	.nprz-body .nprz-stepitem--h::before, .nprz-body .nprz-stepitem--solo::before { width: 34px; height: 34px; font-size: 15px; }
	.nprz-body .nprz-hot { width: 28px; }
	.nprz-body .nprz-hot__btn { width: 28px; height: 28px; font-size: 13px; }
	.nprz-body .nprz-hot__tip { width: 200px; font-size: 14px; padding: 10px 12px; }
	.nprz-body .nprz-harvest-end { margin-top: 56px; }
}

/* D-182: dymek schowany, gdy jego punkt jest poza widokiem (też „przyklejony” :hover po dotyku na telefonie) */
.nprz-body .nprz-hot.is-away .nprz-hot__tip { opacity: 0 !important; visibility: hidden !important; }
