/* ============================================
   PROFINSTAL – Design v3 + Paski boczne
   ============================================ */
/* ── PASKI BOCZNE (≥1200px) ─────────────────── */
@media (min-width: 1200px) {
	/* Treść odsunięta od krawędzi */
	.wp-site-blocks {
		padding-left: 48px !important;
		padding-right: 48px !important;
		box-sizing: border-box;
	}
	
	/* LEWY PASEK – logo marki */
	.wp-site-blocks::before {
		content: "PROFINSTAL";
		position: fixed;
		left: 0;
		top: 0;
		width: 48px;
		height: 100vh;
		background: linear-gradient(180deg, #110e05 0%, #0a0a0a 50%, #110e05 100%);
		border-right: 1px solid rgba(201,162,39,0.5);
		color: #c9a227;
		font-size: 9.5px;
		font-weight: 900;
		letter-spacing: 5px;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9998;
		box-shadow: 4px 0 40px rgba(201,162,39,0.08);
		text-transform: uppercase;
	}
	
	/* PRAWY PASEK – CTA */
	.wp-site-blocks::after {
		content: "☎  ZAMÓW ANALIZĘ";
		position: fixed;
		right: 0;
		top: 0;
		width: 48px;
		height: 100vh;
		background: linear-gradient(180deg, #110e05 0%, #0a0a0a 50%, #110e05 100%);
		border-left: 1px solid rgba(201,162,39,0.5);
		color: #c9a227;
		font-size: 9.5px;
		font-weight: 700;
		letter-spacing: 4px;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9998;
		box-shadow: -4px 0 40px rgba(201,162,39,0.08);
		cursor: pointer;
		text-transform: uppercase;
	}
}

/* ── HEADER ─────────────────────────────────── */
header.wp-block-template-part {
	background: #0c0c0c !important;
	border-bottom: 1px solid rgba(201,162,39,0.3) !important;
	box-shadow: 0 1px 30px rgba(0,0,0,0.8) !important;
	position: sticky;
	top: 0;
	z-index: 1000;
}

/* Logo */
.wp-block-site-title a {
	color: #c9a227 !important;
	font-weight: 900 !important;
	letter-spacing: 1.5px !important;
	text-decoration: none !important;
	text-transform: uppercase;
	font-size: 1.1rem !important;
	text-shadow: 0 0 25px rgba(201,162,39,0.25);
	transition: text-shadow .3s !important;
}

.wp-block-site-title a:hover {
	text-shadow: 0 0 40px rgba(201,162,39,0.55) !important;
}

/* Menu linki */
.wp-block-navigation a,
.wp-block-navigation-item a {
	color: #c8c4bb !important;
	text-decoration: none !important;
	font-size: .83rem !important;
	letter-spacing: .04em;
	font-weight: 500;
	transition: color .2s !important;
	position: relative;
	padding-bottom: 2px;
}

.wp-block-navigation a::after,
.wp-block-navigation-item a::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 1px;
	background: #c9a227;
	transition: width .3s ease;
}

.wp-block-navigation a:hover,
.wp-block-navigation-item a:hover {
	color: #c9a227 !important;
}

.wp-block-navigation a:hover::after,
.wp-block-navigation-item a:hover::after {
	width: 100%;
}

/* ── TYPOGRAFIA ──────────────────────────────── */
body {
	font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
}

p {
	line-height: 1.8;
}

h1, h2, h3, h4 {
	line-height: 1.25;
	letter-spacing: -.02em;
}

/* Złote nagłówki */
h2.wp-block-heading {
	color: #c9a227 !important;
}

h3.wp-block-heading {
	color: #d4a82a !important;
}

/* ── LISTY – złote punktorki ─────────────────── */
.wp-block-list li,
ul li, ol li {
	position: relative;
	padding-left: 4px;
	margin-bottom: 6px;
	line-height: 1.75;
}

ul li::marker {
	color: #c9a227;
	font-size: 1.1em;
}

ol li::marker {
	color: #c9a227;
	font-weight: 700;
}

/* ── PRZYCISKI ───────────────────────────────── */
.wp-block-button__link,
.wp-element-button {
	border-radius: 5px !important;
	font-weight: 600 !important;
	letter-spacing: .05em !important;
	font-size: .875rem !important;
	transition: transform .22s ease, box-shadow .22s ease, background .22s ease !important;
}

.wp-block-button__link:hover,
.wp-element-button:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 8px 32px rgba(201,162,39,0.38) !important;
}

/* Wypełniony (fill) */
.is-style-fill .wp-block-button__link,
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background: linear-gradient(135deg, #b8911f, #d4a82a, #e8c547) !important;
	color: #080600 !important;
	border: none !important;
}

/* Outline */
.is-style-outline .wp-block-button__link {
	border: 1px solid #c9a227 !important;
	color: #c9a227 !important;
	background: transparent !important;
}

.is-style-outline .wp-block-button__link:hover {
	background: rgba(201,162,39,0.08) !important;
}

/* ── KARTY / GRUPY z obramowaniem ───────────── */
.wp-block-group[style*="border"] {
	transition: transform .28s ease, box-shadow .28s ease !important;
	border-radius: 10px !important;
}

.wp-block-group[style*="border"]:hover {
	transform: translateY(-6px) !important;
	box-shadow: 0 20px 50px rgba(201,162,39,0.18) !important;
}

/* ── LINKI W TREŚCI ──────────────────────────── */
.entry-content a:not(.wp-block-button__link),
.wp-block-post-content a:not(.wp-block-button__link),
.wp-block-paragraph a {
	color: #c9a227 !important;
	text-underline-offset: 3px;
	text-decoration-color: rgba(201,162,39,0.3);
	transition: text-decoration-color .2s;
}

.wp-block-paragraph a:hover {
	text-decoration-color: #c9a227;
}

/* ── SEPARATOR złota linia ──────────────────── */
hr, .wp-block-separator {
	border-color: rgba(201,162,39,0.25) !important;
	border-top-width: 1px !important;
}

/* ── FOOTER ──────────────────────────────────── */
footer.wp-block-template-part {
	background: #070707 !important;
	border-top: 1px solid rgba(201,162,39,0.25) !important;
	padding-top: 20px !important;
}

footer p, footer a {
	color: #888 !important;
	font-size: .85rem;
}

footer a:hover {
	color: #c9a227 !important;
}

/* ── ANIMACJA WEJŚCIA sekcji ────────────────── */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(24px);
	}
	
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.wp-block-group.alignfull {
	animation: fadeInUp .6s ease both;
}

/* ── SCROLLBAR ───────────────────────────────── */
::-webkit-scrollbar {
	width: 5px;
}

::-webkit-scrollbar-track {
	background: #0f0f0f;
}

::-webkit-scrollbar-thumb {
	background: linear-gradient(to bottom, #c9a227, #7a5e10);
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background: #e8c547;
}

/* ── SELEKCJA ────────────────────────────────── */
::selection {
	background: rgba(201,162,39,0.25);
	color: #fff;
}

/* ── CYTAT (blockquote) ──────────────────────── */
blockquote {
	border-left: 3px solid #c9a227 !important;
	padding-left: 1.2em !important;
	margin-left: 0 !important;
	color: #b0a890 !important;
	font-style: italic;
}

/* ── FOCUS OUTLINE dostępność ────────────────── */
a:focus-visible,
button:focus-visible {
	outline: 2px solid #c9a227;
	outline-offset: 3px;
	border-radius: 3px;
}

/* ═══════════════════════════════════════════════
   KONTRAST NAPISÓW — globalne nadpisanie
   Rozwiązuje problem nieczytelnych małych tekstów
   na ciemnym tle we wszystkich podstronach
   ═══════════════════════════════════════════════ */
/* Wszystkie małe opisy inline — jasny kolor */
[style*="color:#c8c4ba"],
[style*="color: #c8c4ba"],
[style*="color:#ccc8be"],
[style*="color: #ccc8be"],
[style*="color:#d0ccc2"],
[style*="color: #d0ccc2"] {
	color: #dedad4 !important;
}

/* Teksty w ciemnych boksach — minimum jasność */
.wp-block-html div[style*="background:#111009"] *,
.wp-block-html div[style*="background: #111009"] *,
.wp-block-html div[style*="background:#0d0d0a"] *,
.wp-block-html div[style*="background:#0a0d05"] *,
.wp-block-html div[style*="background:#0a1a05"] * {
	color: inherit;
}

/* Małe fonty — minimum 12px */
.wp-block-html [style*="font-size:11px"],
.wp-block-html [style*="font-size: 11px"] {
	font-size: 13px !important;
}

.wp-block-html [style*="font-size:10px"],
.wp-block-html [style*="font-size: 10px"] {
	font-size: 12px !important;
}

.wp-block-html [style*="font-size:9px"],
.wp-block-html [style*="font-size: 9px"] {
	font-size: 11px !important;
}

/* Opisy pod dużymi liczbami i wskaźnikami */
.wp-block-html [style*="margin-top:4px"],
.wp-block-html [style*="margin-top: 4px"] {
	color: #dedad4 !important;
	font-size: 12px !important;
}

/* Napisy w zielonych boksach CTA */
.wp-block-html [style*="background:#0a1a05"] [style*="font-size"],
.wp-block-html [style*="background:#0a0d05"] [style*="font-size"] {
	color: #dedad4 !important;
}

/* ═══════════════════════════════════════════════
   MENU MOBILNE — ciemny styl PROFINSTAL
   ═══════════════════════════════════════════════ */
/* Tło całego nakładki menu po otwarciu */
.wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation__responsive-container.has-background.is-menu-open {
	background-color: #0d0d0a !important;
	color: #f0ede4 !important;
}

/* Wewnętrzny kontener z listą linków */
.wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content {
	background-color: #0d0d0a !important;
	padding: 24px !important;
}

/* Złota linia na górze menu */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content::before {
	content: '';
	display: block;
	width: 36px;
	height: 3px;
	background: #c9a227;
	margin-bottom: 32px;
}

/* Linki menu */
.wp-block-navigation__responsive-container.is-menu-open a,
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content {
	color: #f0ede4 !important;
	font-size: 1.05em !important;
	font-weight: 600 !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	padding: 14px 0 !important;
	display: block;
	border-bottom: 1px solid rgba(201,162,39,0.15) !important;
	transition: color .2s;
}

/* Hover na linkach */
.wp-block-navigation__responsive-container.is-menu-open a:hover {
	color: #c9a227 !important;
}

/* Przycisk hamburgera — złoty */
.wp-block-navigation__responsive-container-open,
button.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-open span {
	color: #c9a227 !important;
	fill: #c9a227 !important;
}

/* Przycisk zamknięcia X — złoty */
.wp-block-navigation__responsive-container-close,
button.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close {
	color: #c9a227 !important;
	fill: #c9a227 !important;
}

.wp-block-navigation__responsive-container-close svg {
	color: #c9a227 !important;
	fill: #c9a227 !important;
	stroke: #c9a227 !important;
}

/* Usun biale tlo z klas WordPressa */
.wp-block-navigation__responsive-container.has-base-background-color {
	background-color: #0d0d0a !important;
}

.wp-block-navigation__responsive-container.has-contrast-color {
	color: #f0ede4 !important;
}

/* ═══════════════════════════════════════════════
   MENU MOBILNE — pełna wysokość i układ
   ═══════════════════════════════════════════════ */
/* Pełnoekranowe menu — napraw wysokość */
.wp-block-navigation__responsive-container.is-menu-open {
	min-height: 100svh !important;
	height: 100svh !important;
	position: fixed !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
	display: flex !important;
	flex-direction: column !important;
	z-index: 100000 !important;
}

/* Kontener wewnętrzny — zajmuje całą wysokość */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content {
	flex: 1 !important;
	display: flex !important;
	flex-direction: column !important;
	padding: 80px 32px 40px !important;
	gap: 0 !important;
}

/* Nagłówek z przyciskiem X */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close {
	position: absolute !important;
	top: 20px !important;
	right: 20px !important;
}

/* Każdy link jako pełna linia */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item {
	width: 100% !important;
	border-bottom: 1px solid rgba(201,162,39,0.18) !important;
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item a {
	display: block !important;
	width: 100% !important;
	padding: 18px 0 !important;
	font-size: 1em !important;
	font-weight: 700 !important;
	letter-spacing: .12em !important;
	text-transform: uppercase !important;
	color: #f0ede4 !important;
	text-decoration: none !important;
}

.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item a:hover {
	color: #c9a227 !important;
}

/* Złota kreska na górze listy */
.wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container {
	border-top: 3px solid #c9a227 !important;
	padding-top: 8px !important;
	margin-top: 0 !important;
}

/* ============================================
   PROFINSTAL — MOBILE RESPONSIVE FIX
   ============================================ */

/* --- GLOBAL: prevent horizontal scroll --- */
@media (max-width: 782px) {
  html, body {
    overflow-x: hidden !important;
  }

  /* --- HEADER: compact on mobile --- */
  header.wp-block-template-part {
    position: relative !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
  .wp-block-site-title {
    font-size: 1.1rem !important;
  }

  /* --- COLUMNS: stack vertically --- */
  .wp-block-columns {
    flex-direction: column !important;
  }
  .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
  }

  /* --- CONTENT: full-width padding --- */
  .wp-block-group.has-global-padding > * {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .entry-content {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* --- HEADINGS: scale down --- */
  h1 { font-size: 1.6rem !important; }
  h2 { font-size: 1.3rem !important; }
  h3 { font-size: 1.1rem !important; }

  /* --- BUTTONS: full width, bigger tap targets --- */
  .wp-block-button__link,
  .wp-element-button {
    min-height: 48px !important;
    padding: 12px 24px !important;
    font-size: 0.95rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* --- FLOATING SIDEBAR BUTTON: hide or reposition --- */
  .side-cta,
  [class*="sticky-float"],
  a[style*="writing-mode"],
  div[style*="writing-mode"] {
    display: none !important;
  }
}

/* --- SMALLER PHONES (<=480px) --- */
@media (max-width: 480px) {

  /* --- WYCENA CALCULATOR --- */
  #profinstal-calc-mat {
    max-width: 100% !important;
    padding: 10px 8px !important;
  }
  #profinstal-calc-mat .tabs {
    flex-wrap: wrap !important;
    gap: 4px !important;
  }
  #profinstal-calc-mat .tab-btn {
    flex: 1 1 45% !important;
    font-size: 0.65rem !important;
    padding: 8px 4px !important;
    min-height: 44px !important;
    text-align: center !important;
  }
  #profinstal-calc-mat .tab-btn svg,
  #profinstal-calc-mat .tab-btn .icon {
    display: none !important;
  }
  #profinstal-calc-mat .form-grid,
  #profinstal-calc-mat .form-grid.g3,
  #profinstal-calc-mat .form-grid.g4 {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #profinstal-calc-mat .cb-group {
    flex-direction: column !important;
    gap: 10px !important;
  }
  #profinstal-calc-mat .cb-group label {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }
  #profinstal-calc-mat .discount-bar {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  #profinstal-calc-mat .discount-bar > * {
    flex: 1 1 100% !important;
  }
  #profinstal-calc-mat input[type=number],
  #profinstal-calc-mat input[type=text],
  #profinstal-calc-mat select {
    width: 100% !important;
    min-height: 44px !important;
    font-size: 16px !important;
  }
  #profinstal-calc-mat button,
  #profinstal-calc-mat .btn-calc {
    width: 100% !important;
    min-height: 48px !important;
    font-size: 1rem !important;
  }
  #profinstal-calc-mat .summary-cards {
    grid-template-columns: 1fr !important;
  }

  /* --- ROI CALCULATOR --- */
  #profinstal-calc-roi {
    max-width: 100% !important;
    padding: 16px 10px !important;
  }
  #profinstal-calc-roi .form-grid,
  #profinstal-calc-roi .res-grid {
    grid-template-columns: 1fr !important;
  }
  #profinstal-calc-roi .calc-form {
    padding: 14px 10px !important;
  }
  #profinstal-calc-roi input,
  #profinstal-calc-roi select {
    width: 100% !important;
    min-height: 44px !important;
    font-size: 16px !important;
  }
  #profinstal-calc-roi .bar-row {
    font-size: 0.7rem !important;
  }
  #profinstal-calc-roi .bar-track {
    min-width: 0 !important;
    flex: 1 !important;
  }
  #profinstal-calc-roi .res-item {
    padding: 12px !important;
  }
  #profinstal-calc-roi .result {
    font-size: 1.5rem !important;
  }

  /* --- GENERAL: bigger tap targets --- */
  a, button, [role="button"] {
    min-height: 44px;
  }

  /* --- TABLES: horizontal scroll wrapper --- */
  table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    max-width: 100% !important;
  }

  /* --- IMAGES: constrain --- */
  img, video, iframe {
    max-width: 100% !important;
    height: auto !important;
  }

  /* --- NAVIGATION LINKS (footer, etc) --- */
  .wp-block-navigation__container {
    gap: 8px !important;
  }
  .wp-block-navigation-item__content {
    padding: 8px 4px !important;
    font-size: 0.85rem !important;
  }
}

/* --- HERO/COVER SECTION: fix text overflow on mobile --- */
@media (max-width: 782px) {
  .wp-block-cover,
  .wp-block-cover .wp-block-cover__inner-container {
    padding-left: 16px !important;
    padding-right: 16px !important;
    box-sizing: border-box !important;
    max-width: 100vw !important;
    overflow: hidden !important;
  }
  .wp-block-cover h1,
  .wp-block-cover h2 {
    font-size: 1.5rem !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }
  .wp-block-cover p {
    font-size: 0.9rem !important;
  }

  /* --- Fix any full-width blocks that overflow --- */
  .alignfull {
    max-width: 100vw !important;
    overflow: hidden !important;
  }
  /* --- Ensure mobile nav overlay is not clipped by header --- */
  header .alignfull,
  .wp-block-template-part .alignfull {
    overflow: visible !important;
    animation: none !important;
    transform: none !important;
  }

  /* --- Paski boczne (side bars) - hide on mobile --- */
  .side-stripe-left,
  .side-stripe-right,
  [class*="side-stripe"],
  [class*="paski-boczne"] {
    display: none !important;
  }
}

/* --- FIX: inline-styled containers with excessive padding --- */
@media (max-width: 782px) {
  .entry-content div[style*="max-width"],
  .entry-content div[style*="padding"] {
    max-width: 100% !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
  .entry-content .wp-block-group[style*="padding"] {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  /* Fix wp-block-post-content overflow */
  .wp-block-post-content,
  .entry-content {
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  /* Scale hero section heading better */
  .entry-content h1[style*="font-size"],
  .wp-block-heading[style*="font-size"] {
    font-size: 1.4rem !important;
    line-height: 1.3 !important;
  }
}

/* ══════════════════════════════════════════
   NOTEBOOK / SMALL DESKTOP (783–1440px)
   ══════════════════════════════════════════ */

/* --- Kompaktowa nawigacja – wszystko w 1 wierszu --- */
@media (min-width: 783px) and (max-width: 1440px) {
  .wp-block-navigation__container {
    gap: 6px !important;
  }
  .wp-block-navigation .wp-block-navigation-item a,
  .wp-block-navigation .wp-block-navigation-submenu__toggle {
    font-size: 0.72rem !important;
    letter-spacing: 0.15px !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  /* Mniejszy header */
  .wp-block-template-part header .wp-block-group.alignwide,
  header .wp-block-group.alignwide {
    row-gap: 2px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
  /* Logo mniejsze */
  .wp-block-site-title {
    font-size: 1rem !important;
  }
}

/* --- Paski boczne – ukryj na notebookach (za ciasne) --- */
@media (min-width: 1200px) and (max-width: 1440px) {
  .wp-site-blocks::before,
  .wp-site-blocks::after {
    display: none !important;
  }
  .wp-site-blocks {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

/* --- Tablet/mały notebook (783–1024px) --- */
@media (min-width: 783px) and (max-width: 1024px) {
  .wp-block-navigation .wp-block-navigation-item a,
  .wp-block-navigation .wp-block-navigation-submenu__toggle {
    font-size: 0.65rem !important;
    letter-spacing: 0 !important;
  }
  .wp-block-navigation__container {
    gap: 4px !important;
  }
  .wp-block-columns {
    gap: 16px !important;
  }
  h1 { font-size: 1.8rem !important; }
  h2 { font-size: 1.4rem !important; }
}

/* ══════════════════════════════════════════
   YOUTUBE ICON – HEADER & FOOTER
   ══════════════════════════════════════════ */

/* --- Header YouTube icon --- */
.prof-yt-header {
  margin-left: 8px !important;
  align-self: center !important;
}
.prof-yt-header .wp-social-link {
  width: 36px !important;
  height: 36px !important;
  background: #2e7d32 !important;
  border-radius: 8px !important;
  transition: transform 0.2s ease, background 0.2s ease !important;
}
.prof-yt-header .wp-social-link:hover {
  transform: scale(1.12) !important;
  background: #1b5e20 !important;
}
.prof-yt-header .wp-social-link svg {
  width: 20px !important;
  height: 20px !important;
  fill: #fff !important;
}
/* Podpis "YouTube" w headerze */
.prof-yt-header .wp-block-social-link-label {
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  color: #ccc !important;
}

/* --- Footer YouTube icon --- */
.prof-yt-footer {
  justify-content: center !important;
  margin-top: 24px !important;
  margin-bottom: 8px !important;
}
.prof-yt-footer .wp-social-link {
  width: 42px !important;
  height: 42px !important;
  background: #2e7d32 !important;
  border-radius: 10px !important;
  transition: transform 0.2s ease, background 0.2s ease !important;
}
.prof-yt-footer .wp-social-link:hover {
  transform: scale(1.15) !important;
  background: #1b5e20 !important;
}
.prof-yt-footer .wp-social-link svg {
  width: 24px !important;
  height: 24px !important;
  fill: #fff !important;
}
/* Podpis "YouTube" w stopce */
.prof-yt-footer .wp-block-social-link-label {
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  color: #ccc !important;
}

/* --- Mobile adjustments --- */
@media (max-width: 782px) {
  .prof-yt-header {
    display: none !important;
  }
}

/* --- Notebook adjustments --- */
@media (min-width: 783px) and (max-width: 1440px) {
  .prof-yt-header {
    margin-left: 4px !important;
  }
  .prof-yt-header .wp-social-link {
    width: 30px !important;
    height: 30px !important;
  }
  .prof-yt-header .wp-social-link svg {
    width: 17px !important;
    height: 17px !important;
  }
}

/* =============================================
   PROFINSTAL — Mobile Responsive (<=782px)
   ============================================= */

@media (max-width: 782px) {

  /* --- ARTICLES: Hero grids --- */
  .pi-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 20px !important;
  }
  .pi-hero-grid img {
    max-width: 100% !important;
    height: auto !important;
    order: -1;
  }

  .pi-hero {
    grid-template-columns: 1fr !important;
    padding: 20px !important;
  }

  /* --- ARTICLES: General layout --- */
  .pi-article {
    padding: 20px 16px !important;
  }
  .pi-art {
    padding: 0 !important;
  }

  /* --- ARTICLES: KPI row --- */
  .pi-kpi-row {
    flex-direction: column !important;
    gap: 12px !important;
  }
  .pi-kpi {
    min-width: 100% !important;
  }

  /* --- ARTICLES: Compare tables --- */
  .pi-compare {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    display: block !important;
  }
  .pi-compare table {
    min-width: 500px !important;
  }

  /* --- ARTICLES: Tech grid --- */
  .pi-tech {
    grid-template-columns: 1fr !important;
  }

  /* --- ARTICLES: Steps --- */
  .pi-steps {
    grid-template-columns: 1fr !important;
  }

  /* --- ARTICLES: Scenarios --- */
  .pi-scenarios {
    grid-template-columns: 1fr !important;
  }
  .pi-sc {
    padding: 16px !important;
  }

  /* --- ARTICLES: FAQ --- */
  .pi-faq details {
    padding: 12px !important;
  }

  /* --- ARTICLES: CTA box --- */
  .pi-cta-box {
    padding: 20px !important;
  }

  /* --- ARTICLES: Links grid --- */
  .pi-links {
    grid-template-columns: 1fr !important;
  }

  /* --- O PROFINSTAL: Hero --- */
  .pi-about .pi-hero {
    padding: 24px 16px !important;
    text-align: center;
  }
  .pi-hero__title {
    font-size: 1.6rem !important;
  }

  /* --- O PROFINSTAL: Owner grid --- */
  .pi-owner__grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .pi-owner__card {
    text-align: center;
  }

  /* --- O PROFINSTAL: Team competencies grid --- */
  .pi-team__grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* --- O PROFINSTAL: Team persons (avatars) --- */
  .pi-team-persons {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  /* --- O PROFINSTAL: Credentials --- */
  .pi-creds__list {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  /* --- O PROFINSTAL: Approach --- */
  .pi-approach__grid {
    grid-template-columns: 1fr !important;
  }
  .pi-approach__steps {
    grid-template-columns: 1fr !important;
  }

  /* --- O PROFINSTAL: CTA --- */
  .pi-cta {
    padding: 24px 16px !important;
    text-align: center;
  }
  .pi-cta__btn {
    width: 100% !important;
    text-align: center !important;
  }

  /* --- O PROFINSTAL: Sections padding --- */
  .pi-section, .pi-section--wide {
    padding: 24px 16px !important;
  }

  /* --- LISTING PAGE: Article cards with flex + image --- */
  .entry-content a[style*="display:flex"] {
    flex-direction: column !important;
  }
  .entry-content a[style*="display:flex"] > img {
    width: 100% !important;
    max-width: 100% !important;
    flex-shrink: unset !important;
  }

  /* --- HOMEPAGE: WP columns --- */
  .wp-block-columns {
    flex-direction: column !important;
  }
  .wp-block-column {
    flex-basis: 100% !important;
    width: 100% !important;
  }

  /* --- Global: Reduce oversized headings --- */
  h1 { font-size: 1.6rem !important; }
  h2 { font-size: 1.3rem !important; }

  /* --- Global: Full-width images --- */
  .entry-content img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* --- Global: Tables responsive --- */
  .entry-content table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}

/* --- Extra small screens (<=480px) --- */
@media (max-width: 480px) {
  .pi-hero-grid {
    padding: 14px !important;
    gap: 14px !important;
  }
  .pi-hero__title {
    font-size: 1.3rem !important;
  }
  .pi-team-person img {
    width: 90px !important;
    height: 90px !important;
  }
  .pi-owner__card {
    padding: 16px !important;
  }
  .pi-creds__card {
    padding: 14px !important;
  }
  .pi-article {
    padding: 14px 10px !important;
  }
}

/* ===== PISMA MODERN LOOK v2 — scoped to /dla-mieszkancow/pisma/ ===== */
.page-id-1297 .pi-tpl-grid{
  gap: 20px;
  margin: 28px 0 36px;
}
.page-id-1297 .pi-tpl-card{
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0.025) 100%);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 26px 22px 22px;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 8px 22px rgba(0,0,0,0.28);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
  overflow: hidden;
  isolation: isolate;
}
.page-id-1297 .pi-tpl-card::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(480px circle at 85% -10%, rgba(255,200,70,0.10), transparent 45%);
  opacity: .55;
  pointer-events:none;
  transition: opacity .22s ease;
  z-index:0;
}
.page-id-1297 .pi-tpl-card > *{ position: relative; z-index: 1; }
.page-id-1297 .pi-tpl-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,200,70,0.38);
  background: linear-gradient(180deg, rgba(255,255,255,0.09) 0%, rgba(255,255,255,0.035) 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,0.08) inset, 0 18px 38px rgba(0,0,0,0.42), 0 0 0 1px rgba(255,200,70,0.18);
}
.page-id-1297 .pi-tpl-card:hover::before{ opacity:1; }

.page-id-1297 .pi-tpl-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(255,200,70,0.18), rgba(255,200,70,0.06));
  border: 1px solid rgba(255,200,70,0.28);
  font-size: 22px;
  margin-bottom: 10px;
}
.page-id-1297 .pi-tpl-tag{
  display:inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.85);
}
.page-id-1297 .pi-tpl-tag.wniosek{ background: rgba(90,160,255,0.14); border-color: rgba(90,160,255,0.32); color:#bcd7ff; }
.page-id-1297 .pi-tpl-tag.reklamacja{ background: rgba(255,120,120,0.14); border-color: rgba(255,120,120,0.32); color:#ffc7c7; }
.page-id-1297 .pi-tpl-tag.audyt{ background: rgba(120,220,170,0.14); border-color: rgba(120,220,170,0.32); color:#c7f1de; }
.page-id-1297 .pi-tpl-tag.korekta{ background: rgba(255,200,70,0.16); border-color: rgba(255,200,70,0.38); color:#ffe6a6; }

.page-id-1297 .pi-tpl-arrow{
  position: absolute;
  top: 22px;
  right: 20px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  color: #fff;
  font-size: 14px;
  transition: transform .22s ease, background .22s ease, border-color .22s ease;
}
.page-id-1297 .pi-tpl-card:hover .pi-tpl-arrow{
  background: rgba(255,200,70,0.22);
  border-color: rgba(255,200,70,0.55);
  transform: translateX(3px);
}
.page-id-1297 .pi-tpl-card h3{
  margin: 6px 0 6px !important;
  font-size: 1.12rem;
  line-height: 1.3;
  letter-spacing: -0.005em;
}
.page-id-1297 .pi-tpl-card p{
  margin: 0 !important;
  color: rgba(255,255,255,0.72);
  font-size: .92rem;
  line-height: 1.45;
}

/* --- 3 kroki: circular numbered badges --- */
.page-id-1297 .pi-how-step{
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 22px 20px 18px;
  transition: transform .22s ease, border-color .22s ease;
}
.page-id-1297 .pi-how-step:hover{
  transform: translateY(-2px);
  border-color: rgba(255,200,70,0.28);
}
.page-id-1297 .pi-how-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ffc846 0%, #f0a020 100%);
  color:#1a1a1a;
  font-weight: 800;
  font-size: 16px;
  margin-bottom: 10px;
  box-shadow: 0 6px 14px rgba(240,160,32,0.28), 0 0 0 3px rgba(255,200,70,0.10);
}
.page-id-1297 .pi-how-step h4{
  margin: 4px 0 6px !important;
  font-size: 1.02rem;
  letter-spacing: -0.005em;
}
.page-id-1297 .pi-how-step p{
  margin: 0 !important;
  color: rgba(255,255,255,0.72);
  font-size: .92rem;
  line-height: 1.45;
}

/* --- Hero label polish --- */
.page-id-1297 .pi-hero__label{
  display: inline-block;
  letter-spacing: .14em;
  font-size: 12px;
  font-weight: 700;
  color: #ffc846;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1px solid rgba(255,200,70,0.35);
  border-radius: 999px;
  background: rgba(255,200,70,0.08);
  margin-bottom: 10px;
}

/* --- Form polish inside Wybierz pismo --- */
.page-id-1297 .pi-tpl-form-wrap{
  background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 22px 20px;
}

/* --- Responsive tweaks --- */
@media (max-width: 782px){
  .page-id-1297 .pi-tpl-grid{
    grid-template-columns: 1fr !important;
  }
  .page-id-1297 .pi-tpl-card{ padding: 22px 18px 18px; }
}
/* ===== END PISMA MODERN LOOK v2 ===== */


/* ===== PISMA MODERN LOOK v2 — overrides for inline-style rules ===== */
body.page-id-1297 .pi-how-num{
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #ffc846 0%, #f0a020 100%) !important;
  color:#1a1a1a !important;
  font-weight: 800 !important;
  font-size: 16px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow: 0 6px 14px rgba(240,160,32,0.28), 0 0 0 3px rgba(255,200,70,0.10) !important;
  margin-bottom: 10px !important;
  padding: 0 !important;
  line-height: 1 !important;
}
body.page-id-1297 .pi-tpl-icon{
  width: 44px !important;
  height: 44px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(255,200,70,0.18), rgba(255,200,70,0.06)) !important;
  border: 1px solid rgba(255,200,70,0.28) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size: 22px !important;
}
body.page-id-1297 .pi-tpl-arrow{
  position: absolute !important;
  top: 22px !important;
  right: 20px !important;
}
/* ===== END overrides ===== */


/* ===== TWOJE PRAWA MODERN LOOK v1 — scoped to /dla-mieszkancow/twoje-prawa/ ===== */
/* Eyebrow (first paragraph "TWOJE PRAWA JAKO MIESZKAŃCA") */
body.page-id-1296 .entry-content > p:first-of-type{
  display: inline-block;
  letter-spacing: .14em;
  font-size: 12px !important;
  font-weight: 700;
  color: #ffc846;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1px solid rgba(255,200,70,0.35);
  border-radius: 999px;
  background: rgba(255,200,70,0.08);
  margin: 0 0 14px !important;
}
body.page-id-1296 .entry-content > h1{
  letter-spacing: -0.015em;
  margin-bottom: 14px !important;
}
body.page-id-1296 .entry-content > h1 + p{
  color: rgba(255,255,255,0.78);
  font-size: 1.05rem;
  max-width: 68ch;
}

/* Rights grid container */
body.page-id-1296 .entry-content div:has(> .pi-m-right){
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
  margin: 32px 0 40px;
}

/* Right card */
body.page-id-1296 .pi-m-right{
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0.025) 100%);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 26px 22px 22px;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 8px 22px rgba(0,0,0,0.28);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
  overflow: hidden;
  isolation: isolate;
}
body.page-id-1296 .pi-m-right::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(520px circle at 90% -10%, rgba(255,200,70,0.09), transparent 50%);
  opacity: .6;
  pointer-events:none;
  transition: opacity .22s ease;
  z-index:0;
}
body.page-id-1296 .pi-m-right > *{ position: relative; z-index: 1; }
body.page-id-1296 .pi-m-right:hover{
  transform: translateY(-3px);
  border-color: rgba(255,200,70,0.38);
  background: linear-gradient(180deg, rgba(255,255,255,0.09) 0%, rgba(255,255,255,0.035) 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,0.08) inset, 0 18px 38px rgba(0,0,0,0.42), 0 0 0 1px rgba(255,200,70,0.18);
}
body.page-id-1296 .pi-m-right:hover::before{ opacity:1; }

/* Right tag (eyebrow inside each card) */
body.page-id-1296 .pi-m-right-tag{
  display:inline-block !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: rgba(255,200,70,0.14) !important;
  border: 1px solid rgba(255,200,70,0.34) !important;
  color: #ffe6a6 !important;
  margin-bottom: 12px;
}
/* Color variation per card */
body.page-id-1296 .pi-m-right:nth-child(1) .pi-m-right-tag{ background: rgba(90,160,255,0.14) !important; border-color: rgba(90,160,255,0.34) !important; color:#bcd7ff !important; }
body.page-id-1296 .pi-m-right:nth-child(2) .pi-m-right-tag{ background: rgba(160,120,255,0.14) !important; border-color: rgba(160,120,255,0.34) !important; color:#dccfff !important; }
body.page-id-1296 .pi-m-right:nth-child(3) .pi-m-right-tag{ background: rgba(255,120,120,0.14) !important; border-color: rgba(255,120,120,0.34) !important; color:#ffc7c7 !important; }
body.page-id-1296 .pi-m-right:nth-child(4) .pi-m-right-tag{ background: rgba(120,220,170,0.14) !important; border-color: rgba(120,220,170,0.34) !important; color:#c7f1de !important; }
body.page-id-1296 .pi-m-right:nth-child(5) .pi-m-right-tag{ background: rgba(255,200,70,0.16) !important; border-color: rgba(255,200,70,0.38) !important; color:#ffe6a6 !important; }

body.page-id-1296 .pi-m-right h3{
  margin: 8px 0 8px !important;
  font-size: 1.12rem;
  line-height: 1.32;
  letter-spacing: -0.005em;
}
body.page-id-1296 .pi-m-right p{
  margin: 0 !important;
  color: rgba(255,255,255,0.74);
  font-size: .94rem;
  line-height: 1.5;
}

/* CTA box at bottom */
body.page-id-1296 .entry-content div:has(> .pi-m-btn){
  margin-top: 28px;
  padding: 28px 24px;
  background: linear-gradient(180deg, rgba(255,200,70,0.08) 0%, rgba(255,255,255,0.025) 100%);
  border: 1px solid rgba(255,200,70,0.24);
  border-radius: 18px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.32);
}
body.page-id-1296 .entry-content div:has(> .pi-m-btn) h3{
  margin: 0 0 8px !important;
  font-size: 1.25rem;
  letter-spacing: -0.01em;
}
body.page-id-1296 .entry-content div:has(> .pi-m-btn) p{
  color: rgba(255,255,255,0.78);
  margin: 0 0 16px !important;
}

/* Primary button */
body.page-id-1296 .pi-m-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 22px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #ffc846 0%, #f0a020 100%) !important;
  color: #1a1a1a !important;
  font-weight: 700;
  text-decoration: none !important;
  box-shadow: 0 8px 18px rgba(240,160,32,0.32), 0 0 0 1px rgba(255,200,70,0.35) inset;
  transition: transform .18s ease, box-shadow .22s ease;
  margin-right: 10px;
}
body.page-id-1296 .pi-m-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 24px rgba(240,160,32,0.40), 0 0 0 1px rgba(255,200,70,0.55) inset;
}
body.page-id-1296 .pi-m-btn::after{
  content: "\2192";
  font-weight: 800;
  transition: transform .22s ease;
}
body.page-id-1296 .pi-m-btn:hover::after{ transform: translateX(3px); }

/* Ghost button */
body.page-id-1296 .pi-m-btn-ghost{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #ffe6a6 !important;
  border: 1px solid rgba(255,200,70,0.45) !important;
  font-weight: 600;
  text-decoration: none !important;
  transition: background .22s ease, border-color .22s ease, transform .18s ease;
}
body.page-id-1296 .pi-m-btn-ghost:hover{
  background: rgba(255,200,70,0.10) !important;
  border-color: rgba(255,200,70,0.75) !important;
  transform: translateY(-2px);
}

/* Responsive */
@media (max-width: 640px){
  body.page-id-1296 .entry-content div:has(> .pi-m-right){ grid-template-columns: 1fr; }
  body.page-id-1296 .pi-m-right{ padding: 22px 18px 18px; }
  body.page-id-1296 .entry-content div:has(> .pi-m-btn){ padding: 22px 18px; }
  body.page-id-1296 .pi-m-btn{ margin-bottom: 10px; }
}
/* ===== END TWOJE PRAWA MODERN LOOK v1 ===== */


/* ===== JAK DZIAŁAĆ MODERN LOOK v1 — scoped to /dla-mieszkancow/jak-dzialac/ ===== */
/* Role color tokens */
body.page-id-1295{
  --pi-r-resident: 90,160,255;
  --pi-r-manager: 160,120,255;
  --pi-r-auditor: 120,220,170;
  --pi-r-effect: 255,200,70;
}

/* Eyebrow */
body.page-id-1295 .entry-content > p:first-of-type{
  display: inline-block;
  letter-spacing: .14em;
  font-size: 12px !important;
  font-weight: 700;
  color: #ffc846;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1px solid rgba(255,200,70,0.35);
  border-radius: 999px;
  background: rgba(255,200,70,0.08);
  margin: 0 0 14px !important;
}
body.page-id-1295 .entry-content > h1{
  letter-spacing: -0.015em;
  margin-bottom: 14px !important;
}
body.page-id-1295 .entry-content > h1 + p{
  color: rgba(255,255,255,0.78);
  font-size: 1.05rem;
  max-width: 68ch;
}

/* ===== Chain (Mieszkaniec → Zarządca → Audytor → Efekt) ===== */
body.page-id-1295 .pi-m-chain{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 22px 18px;
  margin: 28px 0 40px;
  background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.015) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
}
body.page-id-1295 .pi-m-chain-node{
  display: inline-flex;
  align-items: center;
  padding: 10px 16px;
  border-radius: 999px;
  font-weight: 700;
  font-size: .95rem;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.12);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
body.page-id-1295 .pi-m-chain-node.resident{ background: rgba(var(--pi-r-resident),0.14); border-color: rgba(var(--pi-r-resident),0.42); color:#bcd7ff; box-shadow: 0 6px 14px rgba(var(--pi-r-resident),0.20); }
body.page-id-1295 .pi-m-chain-node.manager{ background: rgba(var(--pi-r-manager),0.14); border-color: rgba(var(--pi-r-manager),0.42); color:#dccfff; box-shadow: 0 6px 14px rgba(var(--pi-r-manager),0.20); }
body.page-id-1295 .pi-m-chain-node.auditor{ background: rgba(var(--pi-r-auditor),0.14); border-color: rgba(var(--pi-r-auditor),0.42); color:#c7f1de; box-shadow: 0 6px 14px rgba(var(--pi-r-auditor),0.20); }
body.page-id-1295 .pi-m-chain-node.effect{ background: rgba(var(--pi-r-effect),0.16); border-color: rgba(var(--pi-r-effect),0.48); color:#ffe6a6; box-shadow: 0 6px 14px rgba(var(--pi-r-effect),0.22); }
body.page-id-1295 .pi-m-chain-arrow{
  color: rgba(255,255,255,0.5);
  font-size: 1.1rem;
  font-weight: 700;
}

/* ===== Steps stack ===== */
body.page-id-1295 .pi-m-steps{
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 24px 0 36px;
  position: relative;
}
body.page-id-1295 .pi-m-step{
  position: relative;
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 20px;
  align-items: start;
  padding: 22px 22px 22px 22px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,0.055) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 8px 22px rgba(0,0,0,0.28);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  overflow: hidden;
  isolation: isolate;
}
body.page-id-1295 .pi-m-step::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width: 4px;
  background: rgba(255,255,255,0.12);
  transition: background .22s ease;
}
body.page-id-1295 .pi-m-step:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,0.18);
  box-shadow: 0 1px 0 rgba(255,255,255,0.08) inset, 0 14px 30px rgba(0,0,0,0.38);
}
/* Number column */
body.page-id-1295 .pi-m-step-num{
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 28px !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em;
  color: #fff;
  background: linear-gradient(135deg, rgba(255,200,70,0.2), rgba(255,200,70,0.05));
  border: 1px solid rgba(255,200,70,0.28);
  border-radius: 14px;
  padding: 14px 12px !important;
  text-align: center;
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
/* Role tag in step */
body.page-id-1295 .pi-m-step-role{
  display:inline-block !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-bottom: 8px !important;
}
body.page-id-1295 .pi-m-step-role.resident{ background: rgba(var(--pi-r-resident),0.14) !important; border: 1px solid rgba(var(--pi-r-resident),0.34) !important; color:#bcd7ff !important; }
body.page-id-1295 .pi-m-step-role.manager{ background: rgba(var(--pi-r-manager),0.14) !important; border: 1px solid rgba(var(--pi-r-manager),0.34) !important; color:#dccfff !important; }
body.page-id-1295 .pi-m-step-role.auditor{ background: rgba(var(--pi-r-auditor),0.14) !important; border: 1px solid rgba(var(--pi-r-auditor),0.34) !important; color:#c7f1de !important; }
body.page-id-1295 .pi-m-step-role.effect{ background: rgba(var(--pi-r-effect),0.16) !important; border: 1px solid rgba(var(--pi-r-effect),0.38) !important; color:#ffe6a6 !important; }

/* Left stripe color by role (use :has()) */
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.resident)::before{ background: linear-gradient(180deg, rgba(var(--pi-r-resident),0.9), rgba(var(--pi-r-resident),0.4)); }
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.manager)::before{ background: linear-gradient(180deg, rgba(var(--pi-r-manager),0.9), rgba(var(--pi-r-manager),0.4)); }
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.auditor)::before{ background: linear-gradient(180deg, rgba(var(--pi-r-auditor),0.9), rgba(var(--pi-r-auditor),0.4)); }
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.effect)::before{ background: linear-gradient(180deg, rgba(var(--pi-r-effect),0.95), rgba(var(--pi-r-effect),0.45)); }

/* Number column color by role */
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.resident) .pi-m-step-num{ background: linear-gradient(135deg, rgba(var(--pi-r-resident),0.22), rgba(var(--pi-r-resident),0.06)); border-color: rgba(var(--pi-r-resident),0.40); }
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.manager) .pi-m-step-num{ background: linear-gradient(135deg, rgba(var(--pi-r-manager),0.22), rgba(var(--pi-r-manager),0.06)); border-color: rgba(var(--pi-r-manager),0.40); }
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.auditor) .pi-m-step-num{ background: linear-gradient(135deg, rgba(var(--pi-r-auditor),0.22), rgba(var(--pi-r-auditor),0.06)); border-color: rgba(var(--pi-r-auditor),0.40); }
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.effect) .pi-m-step-num{ background: linear-gradient(135deg, rgba(var(--pi-r-effect),0.28), rgba(var(--pi-r-effect),0.08)); border-color: rgba(var(--pi-r-effect),0.48); color:#ffe6a6; }

/* Step content typography */
body.page-id-1295 .pi-m-step h3,
body.page-id-1295 .pi-m-step h2,
body.page-id-1295 .pi-m-step h4{
  margin: 4px 0 8px !important;
  font-size: 1.14rem;
  line-height: 1.3;
  letter-spacing: -0.005em;
}
body.page-id-1295 .pi-m-step p{
  margin: 0 0 10px !important;
  color: rgba(255,255,255,0.76);
  font-size: .95rem;
  line-height: 1.5;
}
body.page-id-1295 .pi-m-step p:last-child{ margin-bottom: 0 !important; }

/* Step link → inline pill button */
body.page-id-1295 .pi-m-step-link{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  font-weight: 600;
  font-size: .9rem;
  text-decoration: none !important;
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  color: #fff !important;
  transition: background .2s ease, border-color .2s ease, transform .18s ease;
}
body.page-id-1295 .pi-m-step-link:hover{
  background: rgba(255,200,70,0.14) !important;
  border-color: rgba(255,200,70,0.48) !important;
  transform: translateX(2px);
}
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.resident) .pi-m-step-link:hover{ background: rgba(var(--pi-r-resident),0.18) !important; border-color: rgba(var(--pi-r-resident),0.55) !important; color:#e3edff !important; }
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.manager) .pi-m-step-link:hover{ background: rgba(var(--pi-r-manager),0.18) !important; border-color: rgba(var(--pi-r-manager),0.55) !important; color:#ece5ff !important; }
body.page-id-1295 .pi-m-step:has(.pi-m-step-role.auditor) .pi-m-step-link:hover{ background: rgba(var(--pi-r-auditor),0.18) !important; border-color: rgba(var(--pi-r-auditor),0.55) !important; color:#ddf5ea !important; }

/* ===== Final CTA box ===== */
body.page-id-1295 .entry-content div:has(> .pi-m-btn){
  margin-top: 28px;
  padding: 28px 24px;
  background: linear-gradient(180deg, rgba(255,200,70,0.08) 0%, rgba(255,255,255,0.025) 100%);
  border: 1px solid rgba(255,200,70,0.24);
  border-radius: 18px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.32);
}
body.page-id-1295 .entry-content div:has(> .pi-m-btn) h3{
  margin: 0 0 8px !important;
  font-size: 1.25rem;
  letter-spacing: -0.01em;
}
body.page-id-1295 .entry-content div:has(> .pi-m-btn) p{
  color: rgba(255,255,255,0.78);
  margin: 0 0 16px !important;
}

/* Primary + ghost buttons (same as twoje-prawa) */
body.page-id-1295 .pi-m-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 22px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #ffc846 0%, #f0a020 100%) !important;
  color: #1a1a1a !important;
  font-weight: 700;
  text-decoration: none !important;
  box-shadow: 0 8px 18px rgba(240,160,32,0.32), 0 0 0 1px rgba(255,200,70,0.35) inset;
  transition: transform .18s ease, box-shadow .22s ease;
  margin-right: 10px;
}
body.page-id-1295 .pi-m-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 24px rgba(240,160,32,0.40), 0 0 0 1px rgba(255,200,70,0.55) inset;
}
body.page-id-1295 .pi-m-btn::after{
  content: "\2192";
  font-weight: 800;
  transition: transform .22s ease;
}
body.page-id-1295 .pi-m-btn:hover::after{ transform: translateX(3px); }

body.page-id-1295 .pi-m-btn-ghost{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #ffe6a6 !important;
  border: 1px solid rgba(255,200,70,0.45) !important;
  font-weight: 600;
  text-decoration: none !important;
  transition: background .22s ease, border-color .22s ease, transform .18s ease;
}
body.page-id-1295 .pi-m-btn-ghost:hover{
  background: rgba(255,200,70,0.10) !important;
  border-color: rgba(255,200,70,0.75) !important;
  transform: translateY(-2px);
}

/* Responsive */
@media (max-width: 640px){
  body.page-id-1295 .pi-m-chain{ padding: 16px 12px; gap: 6px; }
  body.page-id-1295 .pi-m-chain-arrow{ font-size: .9rem; }
  body.page-id-1295 .pi-m-step{ grid-template-columns: 1fr; gap: 12px; padding: 20px 18px; }
  body.page-id-1295 .pi-m-step-num{ font-size: 20px !important; min-height: 48px; padding: 8px 10px !important; max-width: 120px; }
  body.page-id-1295 .entry-content div:has(> .pi-m-btn){ padding: 22px 18px; }
  body.page-id-1295 .pi-m-btn{ margin-bottom: 10px; }
}
/* ===== END JAK DZIAŁAĆ MODERN LOOK v1 ===== */


/* ===== SPRAWDZ RACHUNEK MODERN LOOK v1 — scoped to /dla-mieszkancow/sprawdz-rachunek/ ===== */
/* Eyebrow */
body.page-id-1294 .entry-content > p:first-of-type{
  display: inline-block;
  letter-spacing: .14em;
  font-size: 12px !important;
  font-weight: 700;
  color: #ffc846;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1px solid rgba(255,200,70,0.35);
  border-radius: 999px;
  background: rgba(255,200,70,0.08);
  margin: 0 0 14px !important;
}
body.page-id-1294 .entry-content > h1{
  letter-spacing: -0.015em;
  margin-bottom: 14px !important;
}
body.page-id-1294 .entry-content > h1 + p{
  color: rgba(255,255,255,0.78);
  font-size: 1.05rem;
  max-width: 68ch;
}

/* ===== Tab switcher (CO / CWU) — override inline styles ===== */
body.page-id-1294 .entry-content > div:has(> button){
  display: flex !important;
  gap: 8px !important;
  padding: 6px !important;
  margin: 28px 0 10px !important;
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 14px !important;
  backdrop-filter: blur(8px);
}
body.page-id-1294 .entry-content > div > button{
  flex: 1 !important;
  padding: 12px 18px !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  border: 1px solid transparent !important;
  border-bottom: 1px solid transparent !important;
  background: transparent !important;
  color: rgba(255,255,255,0.55) !important;
  border-radius: 10px !important;
  transition: background .22s ease, color .22s ease, border-color .22s ease, transform .18s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
}
body.page-id-1294 .entry-content > div > button:hover{
  background: rgba(255,255,255,0.04) !important;
  color: rgba(255,255,255,0.82) !important;
}
/* Active tab detection: CO button active when pi-section-co visible; CWU when pi-section-cwu visible.
   We fallback to inline-style attr contains "rgba(201,162,39,.08)" which is set by JS for active state. */
body.page-id-1294 .entry-content > div > button[style*="rgba(201,162,39,.08)"],
body.page-id-1294 .entry-content > div > button[style*="rgba(201, 162, 39, 0.08)"]{
  background: linear-gradient(135deg, rgba(255,200,70,0.22), rgba(255,200,70,0.08)) !important;
  color: #ffe6a6 !important;
  border: 1px solid rgba(255,200,70,0.42) !important;
  box-shadow: 0 6px 14px rgba(240,160,32,0.22);
}

/* ===== Calculator wrapper / box ===== */
body.page-id-1294 .pi-m-calc,
body.page-id-1294 .pi-m-calc-wrap{
  background: linear-gradient(180deg, rgba(255,255,255,0.055) 0%, rgba(255,255,255,0.02) 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 18px !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 10px 28px rgba(0,0,0,0.32) !important;
  padding: 28px 26px !important;
  margin: 18px 0 22px !important;
}

/* Inputs */
body.page-id-1294 .pi-q-input{
  background: rgba(0,0,0,0.35) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  border-radius: 10px !important;
  padding: 11px 14px !important;
  color: #fff !important;
  font-size: .98rem !important;
  transition: border-color .22s ease, background .22s ease, box-shadow .22s ease !important;
  width: 100%;
  box-sizing: border-box;
}
body.page-id-1294 .pi-q-input:hover{
  border-color: rgba(255,255,255,0.22) !important;
}
body.page-id-1294 .pi-q-input:focus{
  outline: none !important;
  border-color: rgba(255,200,70,0.60) !important;
  background: rgba(0,0,0,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,200,70,0.14) !important;
}
body.page-id-1294 .pi-q-input::placeholder{ color: rgba(255,255,255,0.38); }
body.page-id-1294 select.pi-q-input option{ background: #1a1a1a; color: #fff; }

/* Hint text (.hint) */
body.page-id-1294 .hint{
  color: rgba(255,255,255,0.55) !important;
  font-size: 12px !important;
  letter-spacing: .02em;
}

/* Calculate button */
body.page-id-1294 .pi-m-calc-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 26px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #ffc846 0%, #f0a020 100%) !important;
  color: #1a1a1a !important;
  font-weight: 800 !important;
  font-size: 1rem !important;
  border: none !important;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(240,160,32,0.32), 0 0 0 1px rgba(255,200,70,0.35) inset !important;
  transition: transform .18s ease, box-shadow .22s ease !important;
  width: auto !important;
}
body.page-id-1294 .pi-m-calc-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(240,160,32,0.42), 0 0 0 1px rgba(255,200,70,0.6) inset !important;
}
body.page-id-1294 .pi-m-calc-btn:active{ transform: translateY(0); }

/* Result box */
body.page-id-1294 .pi-m-result{
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.015) 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 16px !important;
  padding: 26px 24px !important;
  margin-top: 20px !important;
  transition: border-color .3s ease, box-shadow .3s ease;
  overflow: hidden;
  isolation: isolate;
}
body.page-id-1294 .pi-m-result::before{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(600px circle at 90% -20%, rgba(255,200,70,0.08), transparent 45%);
  pointer-events:none;
  z-index:0;
}
body.page-id-1294 .pi-m-result > *{ position: relative; z-index: 1; }
body.page-id-1294 .pi-m-result.ok{
  background: linear-gradient(180deg, rgba(120,220,170,0.10) 0%, rgba(120,220,170,0.025) 100%) !important;
  border: 1px solid rgba(120,220,170,0.30) !important;
  box-shadow: 0 0 0 1px rgba(120,220,170,0.18) inset, 0 10px 24px rgba(0,0,0,0.30) !important;
}
body.page-id-1294 .pi-m-result.warn,
body.page-id-1294 .pi-m-result[class*="warn"]{
  background: linear-gradient(180deg, rgba(255,180,80,0.10) 0%, rgba(255,180,80,0.025) 100%) !important;
  border: 1px solid rgba(255,180,80,0.36) !important;
  box-shadow: 0 0 0 1px rgba(255,180,80,0.20) inset, 0 10px 24px rgba(0,0,0,0.30) !important;
}
body.page-id-1294 .pi-m-result.bad,
body.page-id-1294 .pi-m-result[class*="bad"]{
  background: linear-gradient(180deg, rgba(255,120,120,0.10) 0%, rgba(255,120,120,0.025) 100%) !important;
  border: 1px solid rgba(255,120,120,0.36) !important;
  box-shadow: 0 0 0 1px rgba(255,120,120,0.20) inset, 0 10px 24px rgba(0,0,0,0.30) !important;
}
body.page-id-1294 .res-label{
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  padding: 3px 10px;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 999px;
  background: rgba(255,255,255,0.05);
  margin-bottom: 12px !important;
}
body.page-id-1294 .pi-m-result.ok .res-label{ color: #c7f1de; border-color: rgba(120,220,170,0.34); background: rgba(120,220,170,0.12); }
body.page-id-1294 .res-value{
  font-size: 2.1rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em;
  line-height: 1.1;
  margin: 0 0 10px !important;
}
body.page-id-1294 .res-bench{
  color: rgba(255,255,255,0.68) !important;
  font-size: .95rem;
  margin: 0 0 6px !important;
}
body.page-id-1294 .res-advice{
  color: rgba(255,255,255,0.78);
  font-size: .94rem;
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px dashed rgba(255,255,255,0.12);
}

/* Formula box */
body.page-id-1294 .pi-m-formula{
  background: rgba(0,0,0,0.35) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  padding: 16px 18px !important;
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: .88rem !important;
  color: rgba(255,255,255,0.78) !important;
  line-height: 1.55;
}

/* Info box */
body.page-id-1294 .pi-m-infobox{
  background: linear-gradient(180deg, rgba(90,160,255,0.08) 0%, rgba(90,160,255,0.02) 100%) !important;
  border: 1px solid rgba(90,160,255,0.24) !important;
  border-radius: 14px !important;
  padding: 18px 20px !important;
  color: rgba(255,255,255,0.82);
}
body.page-id-1294 .pi-m-infobox h3,
body.page-id-1294 .pi-m-infobox h4{
  margin: 0 0 8px !important;
  color: #bcd7ff;
  font-size: 1rem;
  letter-spacing: -0.003em;
}

/* ===== "CO DALEJ?" cards (.pi-m-cards / .pi-m-card) ===== */
body.page-id-1294 .pi-m-cards{
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  gap: 16px !important;
  margin: 16px 0 8px !important;
}
body.page-id-1294 .pi-m-card{
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0.065) 0%, rgba(255,255,255,0.02) 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 16px !important;
  padding: 22px 20px !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.06) inset, 0 8px 22px rgba(0,0,0,0.28);
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
  overflow: hidden;
  isolation: isolate;
}
body.page-id-1294 .pi-m-card::before{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(460px circle at 85% -10%, rgba(255,200,70,0.08), transparent 45%);
  pointer-events:none;
  transition: opacity .22s ease;
  z-index:0;
}
body.page-id-1294 .pi-m-card > *{ position: relative; z-index: 1; }
body.page-id-1294 .pi-m-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,200,70,0.38);
  box-shadow: 0 1px 0 rgba(255,255,255,0.08) inset, 0 16px 32px rgba(0,0,0,0.42), 0 0 0 1px rgba(255,200,70,0.18);
}
body.page-id-1294 .pi-m-card h3,
body.page-id-1294 .pi-m-card h4{
  margin: 0 0 8px !important;
  font-size: 1.06rem;
  letter-spacing: -0.005em;
}
body.page-id-1294 .pi-m-card p{
  margin: 0 0 12px !important;
  color: rgba(255,255,255,0.74);
  font-size: .92rem;
  line-height: 1.5;
}
body.page-id-1294 .pi-m-card p:last-child{ margin-bottom: 0 !important; }

/* Card link */
body.page-id-1294 .pi-m-link{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  font-weight: 600;
  font-size: .9rem;
  text-decoration: none !important;
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  color: #fff !important;
  transition: background .2s ease, border-color .2s ease, transform .18s ease;
}
body.page-id-1294 .pi-m-link:hover{
  background: rgba(255,200,70,0.14) !important;
  border-color: rgba(255,200,70,0.50) !important;
  color: #ffe6a6 !important;
  transform: translateX(2px);
}

/* "CO DALEJ?" wrapper — the div that holds h3 + h3 + p + cards */
body.page-id-1294 .entry-content div:has(> .pi-m-cards){
  margin-top: 32px;
  padding: 26px 24px;
  background: linear-gradient(180deg, rgba(255,200,70,0.07) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,200,70,0.22);
  border-radius: 18px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.30);
}
body.page-id-1294 .entry-content div:has(> .pi-m-cards) > :first-child{
  display: inline-block;
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #ffc846;
  padding: 3px 10px;
  border: 1px solid rgba(255,200,70,0.38);
  border-radius: 999px;
  background: rgba(255,200,70,0.10);
  margin: 0 0 10px !important;
}
body.page-id-1294 .entry-content div:has(> .pi-m-cards) h2,
body.page-id-1294 .entry-content div:has(> .pi-m-cards) h3{
  margin: 2px 0 8px !important;
  font-size: 1.3rem;
  letter-spacing: -0.01em;
}

/* Legal / footnote box (last plain div with border before script) */
body.page-id-1294 .entry-content > div:not([id]):not(.pi-m-calc):not(.pi-m-calc-wrap):last-of-type{
  font-size: .86rem;
  color: rgba(255,255,255,0.55);
}

/* Labels above inputs */
body.page-id-1294 .pi-m-calc label{
  display: block;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .02em;
  color: rgba(255,255,255,0.72);
  margin-bottom: 6px;
}
body.page-id-1294 .pi-m-calc label strong{
  color: #fff;
  font-weight: 700;
}

/* Responsive */
@media (max-width: 640px){
  body.page-id-1294 .entry-content > div:has(> button){ flex-direction: column; }
  body.page-id-1294 .pi-m-cards{ grid-template-columns: 1fr !important; }
  body.page-id-1294 .pi-m-calc,
  body.page-id-1294 .pi-m-calc-wrap{ padding: 22px 18px !important; }
  body.page-id-1294 .res-value{ font-size: 1.7rem !important; }
}
/* ===== END SPRAWDZ RACHUNEK MODERN LOOK v1 ===== */





/* ===== SPRAWDZ RACHUNEK DESKTOP POLISH v3 — constrain entire entry + hero ===== */
/* Constrain the WHOLE post-content to a centered column so ALL children (inline-block, block, raw divs) align */
body.page-id-1294 .wp-block-post-content,
body.page-id-1294 .entry-content{
  max-width: 820px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  box-sizing: border-box;
  position: relative;
}

/* Reset the per-element max-width we applied in v2 — everything now flows inside the constrained parent */
body.page-id-1294 .entry-content > *{
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Eyebrow — inline-block pill, left-aligned naturally within the 820 column */
body.page-id-1294 .entry-content > p:first-of-type{
  margin: 18px 0 14px !important;
}

/* Hero H1 with gradient text */
body.page-id-1294 .entry-content > h1{
  font-size: clamp(2.0rem, 3.2vw, 2.6rem) !important;
  line-height: 1.14 !important;
  margin: 6px 0 14px !important;
  letter-spacing: -0.02em;
  background: linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,0.80) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Intro paragraph */
body.page-id-1294 .entry-content > h1 + p{
  font-size: 1.06rem !important;
  line-height: 1.55 !important;
  color: rgba(255,255,255,0.80);
  margin: 0 0 4px !important;
  max-width: 640px !important;
}

/* Trust strip via pseudo-element — no content change needed */
body.page-id-1294 .entry-content > h1 + p::after{
  content: "⚡ Wynik w 30 sekund   ·   🔒 Nic nie wychodzi z przegl\0105 darki   ·   📊 Benchmarki 2025/2026";
  display: block;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed rgba(255,255,255,0.12);
  font-size: .9rem;
  color: rgba(255,255,255,0.62);
  letter-spacing: .01em;
  font-weight: 500;
}

/* Soft ambient glow behind hero */
body.page-id-1294 .entry-content::before{
  content: "";
  position: absolute;
  top: -60px;
  left: 50%;
  transform: translateX(-50%);
  width: min(1000px, 120%);
  height: 420px;
  background:
    radial-gradient(420px circle at 28% 45%, rgba(255,200,70,0.11), transparent 60%),
    radial-gradient(460px circle at 78% 30%, rgba(90,160,255,0.09), transparent 60%);
  pointer-events: none;
  z-index: 0;
  filter: blur(2px);
}
body.page-id-1294 .entry-content > *{ position: relative; z-index: 1; }

/* Tabs — now part of the same 820 column (no breakout) */
body.page-id-1294 .entry-content > div:has(> button){
  width: 100% !important;
  margin: 28px 0 14px !important;
  padding: 8px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.015) 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.28);
  box-sizing: border-box;
}
body.page-id-1294 .entry-content > div > button{
  padding: 14px 20px !important;
  font-size: 1rem !important;
  letter-spacing: -0.005em;
}

/* Section intros below tabs */
body.page-id-1294 #pi-section-co > p:first-child,
body.page-id-1294 #pi-section-cwu > p:first-child{
  color: rgba(255,255,255,0.74);
  font-size: 1rem;
  line-height: 1.55;
  margin: 10px 0 18px;
}

/* Calculator fills the 820 column */
body.page-id-1294 .pi-m-calc,
body.page-id-1294 .pi-m-calc-wrap{
  width: 100% !important;
  box-sizing: border-box;
}

/* Responsive */
@media (max-width: 820px){
  body.page-id-1294 .wp-block-post-content,
  body.page-id-1294 .entry-content{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  body.page-id-1294 .entry-content > h1{ font-size: 1.9rem !important; }
  body.page-id-1294 .entry-content > h1 + p::after{
    font-size: .82rem; line-height: 1.75;
  }
  body.page-id-1294 .entry-content::before{ display: none; }
}
/* ===== END SPRAWDZ RACHUNEK DESKTOP POLISH v3 ===== */

/* ===== DLA MIESZKANCOW MODERN LOOK v1 ===== */

/* ----- 1. Layout & container ----- */
body.page-id-106 .wp-block-post-content,
body.page-id-106 .entry-content{
  max-width: 920px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  box-sizing: border-box;
  position: relative;
}
body.page-id-106 .entry-content > *{
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Role color tokens (re-used in chain and stats) */
body.page-id-106{
  --pi-r-resident: 90,160,255;
  --pi-r-manager: 160,120,255;
  --pi-r-auditor: 120,220,170;
  --pi-r-effect: 255,200,70;
  --pi-gold: 201,162,39;
}

/* Ambient glow behind hero */
body.page-id-106 .entry-content::before{
  content: "";
  position: absolute;
  top: -40px; left: 50%;
  transform: translateX(-50%);
  width: min(1100px, 120%);
  height: 520px;
  background:
    radial-gradient(460px circle at 25% 40%, rgba(255,200,70,0.12), transparent 60%),
    radial-gradient(520px circle at 78% 25%, rgba(90,160,255,0.09), transparent 62%),
    radial-gradient(420px circle at 55% 70%, rgba(160,120,255,0.07), transparent 65%);
  pointer-events: none;
  z-index: 0;
  filter: blur(2px);
}
body.page-id-106 .entry-content > *{ position: relative; z-index: 1; }

/* ----- 2. Top cross-links nav strip ----- */
body.page-id-106 .entry-content > div:first-of-type[style*="max-width:960px"]{
  max-width: 100% !important;
  margin: 0 0 28px !important;
  padding: 12px 18px !important;
  background: linear-gradient(135deg, rgba(20,20,14,0.85), rgba(11,11,8,0.92)) !important;
  border: 1px solid rgba(201,162,39,0.22) !important;
  border-radius: 12px;
  font-size: 12px !important;
  letter-spacing: 0.3px;
  display: flex !important;
  align-items: center;
  gap: 10px 16px !important;
  flex-wrap: wrap;
  backdrop-filter: blur(6px);
}
body.page-id-106 .entry-content > div:first-of-type[style*="max-width:960px"] br{ display: none; }
body.page-id-106 .entry-content > div:first-of-type[style*="max-width:960px"] > span:first-child{
  color: #fff !important;
  font-weight: 600;
  letter-spacing: .08em;
  padding: 4px 10px;
  background: rgba(255,200,70,0.12);
  border: 1px solid rgba(255,200,70,0.28);
  border-radius: 999px;
}
body.page-id-106 .entry-content > div:first-of-type[style*="max-width:960px"] > span{
  color: #bbb !important;
}
body.page-id-106 .entry-content > div:first-of-type[style*="max-width:960px"] a{
  color: #e6d89a !important;
  text-decoration: none !important;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(201,162,39,0.22);
  background: rgba(11,11,8,0.6);
  transition: all .2s ease;
}
body.page-id-106 .entry-content > div:first-of-type[style*="max-width:960px"] a:hover{
  background: rgba(201,162,39,0.16);
  border-color: rgba(201,162,39,0.45);
  color: #fff !important;
  transform: translateY(-1px);
}

/* ----- 3. Hero block ----- */
/* Hero wrapper = 4th child (the one containing H1) */
body.page-id-106 .entry-content > div:has(> h1){
  margin-top: 12px !important;
  margin-bottom: 44px !important;
  padding-bottom: 8px;
}

/* Eyebrow pill */
body.page-id-106 .entry-content > div:has(> h1) > p:first-child[style*="letter-spacing"]{
  display: inline-block !important;
  padding: 7px 16px !important;
  margin-bottom: 18px !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  letter-spacing: .18em !important;
  color: #ffce5a !important;
  background: linear-gradient(135deg, rgba(255,200,70,0.16), rgba(255,200,70,0.05)) !important;
  border: 1px solid rgba(255,200,70,0.32);
  border-radius: 999px;
  text-transform: uppercase !important;
}

/* Hero H1: big, gradient */
body.page-id-106 .entry-content > div:has(> h1) > h1{
  font-size: clamp(2.1rem, 3.6vw, 3.0rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.02em !important;
  font-weight: 800 !important;
  margin: 6px 0 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,0.78) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  max-width: 780px !important;
}
body.page-id-106 .entry-content > div:has(> h1) > h1 strong,
body.page-id-106 .entry-content > div:has(> h1) > h1 b{
  background: linear-gradient(135deg, #ffce5a, #ffa93a);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 800;
}

/* Hero intro paragraph */
body.page-id-106 .entry-content > div:has(> h1) > p[style*="max-width:680px"]{
  font-size: 1.04rem !important;
  color: rgba(255,255,255,0.72) !important;
  line-height: 1.72 !important;
  max-width: 680px !important;
  margin: 0 0 6px !important;
}

/* Trust strip (via ::after on intro P) */
body.page-id-106 .entry-content > div:has(> h1) > p[style*="max-width:680px"]::after{
  content: "⚡ Analiza gratis   ·   📄 Raport na 1 stronie   ·   🔒 Dyskretnie   ·   📍 Kraków i okolice";
  display: block;
  margin-top: 18px;
  padding: 12px 0;
  border-top: 1px dashed rgba(255,255,255,0.12);
  border-bottom: 1px dashed rgba(255,255,255,0.12);
  font-size: .9rem;
  color: rgba(255,255,255,0.6);
  letter-spacing: 0.2px;
}

/* Trust badge "KRAKÓW I OKOLICE" - inline-flex pill */
body.page-id-106 .entry-content > div:has(> h1) > div[style*="inline-flex"][style*="KRAKÓW"],
body.page-id-106 .entry-content > div:has(> h1) > div[style*="display:inline-flex"]{
  margin-top: 20px !important;
  padding: 10px 18px !important;
  background: linear-gradient(135deg, rgba(20,20,14,0.9), rgba(11,11,8,0.95)) !important;
  border: 1px solid rgba(201,162,39,0.35) !important;
  border-radius: 999px;
  box-shadow: 0 2px 14px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.04);
}

/* ----- 4. .pi-m-chain : reuse role colors (like jak-dzialac) ----- */
body.page-id-106 .pi-m-chain{
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 6px;
  margin: 28px 0 8px !important;
  padding: 18px 18px;
  background: linear-gradient(135deg, rgba(15,15,11,0.85), rgba(10,10,8,0.92));
  border: 1px solid rgba(201,162,39,0.18);
  border-radius: 14px;
  position: relative;
  overflow: hidden;
}
body.page-id-106 .pi-m-chain::before{
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(300px circle at 20% 50%, rgba(90,160,255,0.05), transparent 60%),
              radial-gradient(300px circle at 80% 50%, rgba(255,200,70,0.05), transparent 60%);
  pointer-events: none;
}
body.page-id-106 .pi-m-chain-node{
  flex: 1 1 120px;
  min-width: 0;
  padding: 12px 10px;
  background: rgba(11,11,8,0.7);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  font-size: .86rem;
  line-height: 1.35;
  font-weight: 600;
  color: #fff;
  text-align: center;
  position: relative;
  transition: transform .2s ease, border-color .2s ease;
  z-index: 1;
}
body.page-id-106 .pi-m-chain-node:hover{ transform: translateY(-1px); }
body.page-id-106 .pi-m-chain-node::before{
  content: "";
  position: absolute;
  top: 6px; left: 50%;
  width: 22px; height: 3px;
  transform: translateX(-50%);
  border-radius: 2px;
}
body.page-id-106 .pi-m-chain-node.resident{ border-color: rgba(var(--pi-r-resident), 0.4); background: linear-gradient(180deg, rgba(var(--pi-r-resident),0.09), rgba(11,11,8,0.7)); }
body.page-id-106 .pi-m-chain-node.resident::before{ background: rgb(var(--pi-r-resident)); }
body.page-id-106 .pi-m-chain-node.manager{ border-color: rgba(var(--pi-r-manager), 0.4); background: linear-gradient(180deg, rgba(var(--pi-r-manager),0.09), rgba(11,11,8,0.7)); }
body.page-id-106 .pi-m-chain-node.manager::before{ background: rgb(var(--pi-r-manager)); }
body.page-id-106 .pi-m-chain-node.auditor{ border-color: rgba(var(--pi-r-auditor), 0.4); background: linear-gradient(180deg, rgba(var(--pi-r-auditor),0.09), rgba(11,11,8,0.7)); }
body.page-id-106 .pi-m-chain-node.auditor::before{ background: rgb(var(--pi-r-auditor)); }
body.page-id-106 .pi-m-chain-node.effect{ border-color: rgba(var(--pi-r-effect), 0.55); background: linear-gradient(180deg, rgba(var(--pi-r-effect),0.14), rgba(11,11,8,0.7)); }
body.page-id-106 .pi-m-chain-node.effect::before{ background: rgb(var(--pi-r-effect)); }

body.page-id-106 .pi-m-chain-arrow{
  flex: 0 0 auto;
  color: rgba(255,255,255,0.3);
  font-size: 1rem;
  line-height: 1;
  padding: 0 2px;
  z-index: 1;
}

/* ----- 5. CTA buttons ----- */
body.page-id-106 a.pi-m-btn{
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 14px 26px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #0b0b08 !important;
  background: linear-gradient(135deg, #ffce5a 0%, #ffa93a 100%) !important;
  border: 1px solid rgba(255,200,70,0.9) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  box-shadow: 0 6px 22px rgba(255,200,70,0.28), inset 0 1px 0 rgba(255,255,255,0.35);
  transition: transform .2s ease, box-shadow .2s ease;
  letter-spacing: 0.2px;
}
body.page-id-106 a.pi-m-btn::after{
  content: "→";
  font-size: 1.1rem;
  transition: transform .2s ease;
}
body.page-id-106 a.pi-m-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(255,200,70,0.38), inset 0 1px 0 rgba(255,255,255,0.4);
}
body.page-id-106 a.pi-m-btn:hover::after{ transform: translateX(3px); }

body.page-id-106 a.pi-m-btn-ghost{
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 14px 22px !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #e6d89a !important;
  background: rgba(11,11,8,0.6) !important;
  border: 1px solid rgba(201,162,39,0.35) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  transition: all .2s ease;
}
body.page-id-106 a.pi-m-btn-ghost:hover{
  background: rgba(201,162,39,0.14) !important;
  border-color: rgba(201,162,39,0.55) !important;
  color: #fff !important;
  transform: translateY(-1px);
}

/* ----- 6. Stats trust bar ----- */
body.page-id-106 .pi-m-stats{
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin: 18px 0 56px !important;
  padding: 0 !important;
}
body.page-id-106 .pi-m-stat{
  position: relative;
  padding: 22px 20px 20px;
  background: linear-gradient(180deg, rgba(18,18,12,0.9), rgba(11,11,8,0.95));
  border: 1px solid rgba(201,162,39,0.22);
  border-radius: 14px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.04);
  overflow: hidden;
  transition: transform .2s ease, border-color .2s ease;
}
body.page-id-106 .pi-m-stat::before{
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #ffce5a, #ffa93a);
  opacity: .7;
}
body.page-id-106 .pi-m-stat:nth-child(1)::before{ background: linear-gradient(90deg, rgb(var(--pi-r-resident)), rgba(var(--pi-r-resident),.4)); }
body.page-id-106 .pi-m-stat:nth-child(2)::before{ background: linear-gradient(90deg, #ff6f61, rgba(255,111,97,.4)); }
body.page-id-106 .pi-m-stat:nth-child(3)::before{ background: linear-gradient(90deg, rgb(var(--pi-r-auditor)), rgba(var(--pi-r-auditor),.4)); }
body.page-id-106 .pi-m-stat:nth-child(4)::before{ background: linear-gradient(90deg, #ffce5a, rgba(255,200,70,.4)); }

body.page-id-106 .pi-m-stat:hover{
  transform: translateY(-2px);
  border-color: rgba(201,162,39,0.4);
}
body.page-id-106 .pi-m-stat .num{
  font-size: clamp(1.8rem, 3vw, 2.2rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em;
  margin-bottom: 10px;
  background: linear-gradient(135deg, #fff 0%, rgba(255,255,255,0.7) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
body.page-id-106 .pi-m-stat:nth-child(4) .num{
  background: linear-gradient(135deg, #ffce5a, #ffa93a);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
body.page-id-106 .pi-m-stat .desc{
  font-size: .82rem !important;
  color: rgba(255,255,255,0.62) !important;
  line-height: 1.5 !important;
}

/* ----- 7. Form section (Child 5) : main long section ----- */
body.page-id-106 .entry-content > div[style*="margin-top:64px"]:nth-of-type(3){
  /* This is the outer form section wrapper; we leave it but ensure spacing */
  margin-top: 48px !important;
}

/* Eyebrow inside form section */
body.page-id-106 .entry-content > div > p[style*="letter-spacing:.16em"]{
  display: inline-block !important;
  padding: 6px 14px !important;
  font-size: .7rem !important;
  font-weight: 700 !important;
  color: #ffce5a !important;
  letter-spacing: .16em !important;
  background: linear-gradient(135deg, rgba(255,200,70,0.14), rgba(255,200,70,0.04)) !important;
  border: 1px solid rgba(255,200,70,0.28);
  border-radius: 999px;
  margin-bottom: 16px !important;
  text-transform: uppercase !important;
}

/* All H2 headings inside form section get gradient & spacing */
body.page-id-106 .entry-content h2{
  font-size: clamp(1.6rem, 2.6vw, 2.1rem) !important;
  line-height: 1.22 !important;
  letter-spacing: -0.015em !important;
  font-weight: 800 !important;
  margin: 8px 0 14px !important;
  color: #fff !important;
  background: linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,0.82) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Soft dark cards (inline bg #0d0d0a or #11100a) */
body.page-id-106 .entry-content div[style*="background:#0d0d0a"],
body.page-id-106 .entry-content div[style*="background: #0d0d0a"]{
  background: linear-gradient(180deg, rgba(15,15,11,0.92), rgba(11,11,8,0.96)) !important;
  border-radius: 14px;
  box-shadow: 0 6px 22px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.03);
}
body.page-id-106 .entry-content div[style*="background:#11100a"],
body.page-id-106 .entry-content div[style*="background: #11100a"]{
  background: linear-gradient(180deg, rgba(20,19,11,0.92), rgba(13,12,7,0.96)) !important;
  border-radius: 14px;
}

/* Expert bio card (Kto analizuje) */
body.page-id-106 .entry-content div[style*="display:flex"][style*="background:#0d0d0a"]{
  padding: 32px 30px !important;
  gap: 26px !important;
  border: 1px solid rgba(201,162,39,0.3) !important;
}

/* Callout "Dlaczego to darmowe" */
body.page-id-106 .entry-content div[style*="border-left:3px solid #d4a017"]{
  border-left: 3px solid #ffa93a !important;
  padding: 28px 32px !important;
  border-radius: 0 14px 14px 0;
  background: linear-gradient(180deg, rgba(20,19,11,0.92), rgba(13,12,7,0.96)) !important;
}

/* "Porozmawiaj z zarządcą" blockquote-style box */
body.page-id-106 .entry-content div[style*="max-width:680px"][style*="rgba(13,13,10,0.8)"]{
  padding: 28px 32px !important;
  border: 1px solid rgba(201,162,39,0.28) !important;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(15,15,11,0.9), rgba(11,11,8,0.94)) !important;
  box-shadow: 0 6px 22px rgba(0,0,0,0.2);
  position: relative;
}
body.page-id-106 .entry-content div[style*="max-width:680px"][style*="rgba(13,13,10,0.8)"]::before{
  content: "";
  position: absolute;
  top: 0; left: 20px; right: 20px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,200,70,0.5), transparent);
}

/* FAQ details/summary (if present) */
body.page-id-106 #faq details{
  margin: 10px 0;
  padding: 0;
  border: 1px solid rgba(201,162,39,0.18);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(15,15,11,0.8), rgba(11,11,8,0.9));
  overflow: hidden;
  transition: border-color .2s ease;
}
body.page-id-106 #faq details:hover{
  border-color: rgba(201,162,39,0.32);
}
body.page-id-106 #faq details[open]{
  border-color: rgba(255,200,70,0.4);
  background: linear-gradient(180deg, rgba(20,19,11,0.85), rgba(13,12,7,0.92));
}
body.page-id-106 #faq summary{
  padding: 14px 18px;
  font-weight: 600;
  color: #fff;
  cursor: pointer;
  list-style: none;
  position: relative;
  padding-right: 40px;
}
body.page-id-106 #faq summary::-webkit-details-marker{ display: none; }
body.page-id-106 #faq summary::after{
  content: "+";
  position: absolute;
  right: 16px; top: 50%;
  transform: translateY(-50%);
  font-size: 1.3rem;
  color: #ffce5a;
  transition: transform .2s ease;
}
body.page-id-106 #faq details[open] summary::after{
  content: "−";
  transform: translateY(-50%);
}
body.page-id-106 #faq details > *:not(summary){
  padding: 0 18px 16px !important;
  color: rgba(255,255,255,0.72) !important;
  line-height: 1.65 !important;
}

/* Form wrapper */
body.page-id-106 #formularz{
  margin-top: 56px !important;
  padding: 40px 36px 36px !important;
  background: linear-gradient(180deg, rgba(18,17,11,0.95), rgba(11,11,8,0.98)) !important;
  border: 1px solid rgba(255,200,70,0.35) !important;
  border-radius: 18px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.35), 0 0 0 1px rgba(255,200,70,0.08);
  position: relative;
  overflow: hidden;
}
body.page-id-106 #formularz::before{
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, #ffce5a, #ffa93a, #ffce5a);
}

/* Sticky mobile CTA */
body.page-id-106 .pi-m-sticky-cta{
  background: linear-gradient(180deg, rgba(5,5,3,0.98), rgba(11,11,8,1)) !important;
  border-top: 1px solid rgba(255,200,70,0.35) !important;
  box-shadow: 0 -8px 30px rgba(0,0,0,0.5);
}
body.page-id-106 .pi-m-sticky-cta a{
  background: linear-gradient(135deg, #ffce5a, #ffa93a) !important;
  color: #0b0b08 !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 18px rgba(255,200,70,0.35);
}

/* Inline links on this page */
body.page-id-106 .entry-content a:not(.pi-m-btn):not(.pi-m-btn-ghost):not([class*="pi-"]){
  color: #ffce5a;
  text-decoration: none;
  border-bottom: 1px dashed rgba(255,200,70,0.35);
  transition: all .15s ease;
}
body.page-id-106 .entry-content a:not(.pi-m-btn):not(.pi-m-btn-ghost):not([class*="pi-"]):hover{
  color: #fff;
  border-bottom-color: rgba(255,200,70,0.8);
}

/* Smooth section separators in form section */
body.page-id-106 .entry-content > div > div[style*="margin-top:64px"]{
  padding-top: 28px;
  position: relative;
}
body.page-id-106 .entry-content > div > div[style*="margin-top:72px"]{
  padding-top: 28px;
}

/* Mock report section polish */
body.page-id-106 .pi-mock-section{
  padding: 60px 0 24px !important;
}

/* ----- 8. Mobile responsive ----- */
@media (max-width: 820px){
  body.page-id-106 .entry-content{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  body.page-id-106 .pi-m-stats{
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px;
  }
  body.page-id-106 .pi-m-chain{
    flex-direction: column;
    align-items: stretch;
    padding: 14px;
  }
  body.page-id-106 .pi-m-chain-node{ flex: 0 0 auto; }
  body.page-id-106 .pi-m-chain-arrow{
    transform: rotate(90deg);
    text-align: center;
    padding: 2px 0;
  }
  body.page-id-106 .entry-content > div:first-of-type[style*="max-width:960px"]{
    font-size: 11px !important;
    padding: 10px 12px !important;
  }
  body.page-id-106 .entry-content div[style*="display:flex"][style*="background:#0d0d0a"]{
    padding: 24px 22px !important;
    gap: 18px !important;
  }
  body.page-id-106 #formularz{
    padding: 28px 20px !important;
  }
}

@media (max-width: 560px){
  body.page-id-106 .pi-m-stats{
    grid-template-columns: 1fr !important;
  }
  body.page-id-106 .entry-content > div:has(> h1) > h1{
    font-size: clamp(1.8rem, 7vw, 2.2rem) !important;
  }
  body.page-id-106 a.pi-m-btn,
  body.page-id-106 a.pi-m-btn-ghost{
    width: 100%;
    justify-content: center;
  }
}


/* Chain clickable nodes */
body.page-id-106 a.pi-m-chain-node{
  text-decoration: none !important;
  color: inherit;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
  position: relative;
}
body.page-id-106 a.pi-m-chain-node:hover{
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(0,0,0,0.45), 0 0 0 1px rgba(201,162,39,0.35);
  border-color: rgba(255,206,90,0.55) !important;
}
body.page-id-106 a.pi-m-chain-node.resident:hover{
  border-color: rgba(90,160,255,0.65) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,0.45), 0 0 0 1px rgba(90,160,255,0.35);
}
body.page-id-106 a.pi-m-chain-node.effect:hover{
  border-color: rgba(255,200,70,0.75) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,200,70,0.45);
}
body.page-id-106 a.pi-m-chain-node::after{
  content: "↗";
  position: absolute;
  top: 6px;
  right: 8px;
  font-size: 11px;
  opacity: 0.45;
  transition: opacity .18s ease, transform .18s ease;
}
body.page-id-106 a.pi-m-chain-node:hover::after{
  opacity: 1;
  transform: translate(2px, -2px);
}








/* === CHAIN & STEPS V2 PATCH === */

/* Primary button arrow fix (override broken encoding) */
body.page-id-106 a.pi-m-btn{ text-decoration: none !important; }
body.page-id-106 a.pi-m-btn::after{
  content: "→" !important;
  font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
  margin-left: 10px;
  display: inline-block;
  transition: transform .18s ease;
}
body.page-id-106 a.pi-m-btn:hover::after{ transform: translateX(4px); }
body.page-id-106 a.pi-m-btn-ghost{ text-decoration: none !important; }

/* Chain nodes: keep on single line desktop, wrap mobile */
body.page-id-106 .pi-m-chain-node{ white-space: nowrap; line-height: 1.2; }
@media (max-width: 820px){
  body.page-id-106 .pi-m-chain-node{ white-space: normal; }
}

/* ===== STEPS — SEQUENTIAL TIMELINE LAYOUT ===== */
body.page-id-106 .pi-m-steps{
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  margin: 40px auto 32px !important;
  max-width: 900px;
  position: relative;
  padding-left: 8px;
}

/* Vertical connector line behind badges */
body.page-id-106 .pi-m-steps::before{
  content: "";
  position: absolute;
  left: 40px;
  top: 40px;
  bottom: 40px;
  width: 2px;
  background: linear-gradient(180deg, rgba(201,162,39,0.6) 0%, rgba(201,162,39,0.25) 50%, rgba(201,162,39,0) 100%);
  z-index: 0;
  pointer-events: none;
}

body.page-id-106 .pi-m-step{
  position: relative;
  display: grid !important;
  grid-template-columns: 80px 1fr;
  gap: 28px;
  align-items: flex-start;
  padding: 32px 34px 32px 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
  margin: 0;
  isolation: auto;
}
body.page-id-106 .pi-m-step + .pi-m-step{
  border-top: 1px solid rgba(255,255,255,0.06) !important;
}
body.page-id-106 .pi-m-step::before,
body.page-id-106 .pi-m-step::after{
  content: none !important;
}
body.page-id-106 .pi-m-step:hover{
  transform: none !important;
  box-shadow: none !important;
}

/* Large circular number badge on the left */
body.page-id-106 .pi-m-step-num{
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: 0 !important; /* hide text "Krok XX" */
  background: radial-gradient(circle at 30% 30%, #FFE082 0%, #FFCE5A 35%, #C9A227 100%) !important;
  box-shadow: 0 10px 30px rgba(201,162,39,0.35), inset 0 2px 0 rgba(255,255,255,0.4), 0 0 0 6px rgba(201,162,39,0.10) !important;
  color: #0b1020 !important;
  margin-bottom: 0 !important;
  position: relative;
  z-index: 2;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
/* Display the numeric part of "Krok 01" via a fixed element using nth-child on parent .pi-m-step */
body.page-id-106 .pi-m-step:nth-of-type(1) .pi-m-step-num::after{ content: "01"; }
body.page-id-106 .pi-m-step:nth-of-type(2) .pi-m-step-num::after{ content: "02"; }
body.page-id-106 .pi-m-step:nth-of-type(3) .pi-m-step-num::after{ content: "03"; }
body.page-id-106 .pi-m-step-num::after{
  font-size: 26px !important;
  font-weight: 800;
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
  color: #0b1020;
  letter-spacing: -0.02em;
  line-height: 1;
}
body.page-id-106 .pi-m-step-num::before{ content: none !important; }

/* Content column */
body.page-id-106 .pi-m-step > div{
  padding-top: 4px;
}
body.page-id-106 .pi-m-step h3{
  font-size: clamp(20px, 1.4vw + 13px, 26px) !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 0 12px !important;
  line-height: 1.25 !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: initial !important;
  letter-spacing: -0.01em;
}
body.page-id-106 .pi-m-step h3::before{
  content: "KROK " counter(pim-step, decimal-leading-zero);
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .22em;
  color: rgba(255,206,90,0.95);
  text-transform: uppercase;
  margin-bottom: 8px;
}
body.page-id-106 .pi-m-steps{ counter-reset: pim-step; }
body.page-id-106 .pi-m-step{ counter-increment: pim-step; }
body.page-id-106 .pi-m-step p{
  font-size: 16px !important;
  color: rgba(255,255,255,0.82) !important;
  line-height: 1.65 !important;
  margin: 0 0 14px !important;
}
body.page-id-106 .pi-m-step p:last-child{
  margin-bottom: 0 !important;
  display: inline-block;
  font-size: 13px !important;
  font-weight: 600;
  letter-spacing: .02em;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(90,160,255,0.12);
  color: rgba(180,215,255,0.95) !important;
  border: 1px solid rgba(90,160,255,0.32);
}

/* Mobile: compact but still readable */
@media (max-width: 820px){
  body.page-id-106 .pi-m-steps{
    padding-left: 0;
    max-width: 100%;
    margin: 28px 0 20px !important;
  }
  body.page-id-106 .pi-m-steps::before{
    left: 28px;
    top: 28px;
    bottom: 28px;
  }
  body.page-id-106 .pi-m-step{
    grid-template-columns: 56px 1fr;
    gap: 18px;
    padding: 22px 4px 22px 0 !important;
  }
  body.page-id-106 .pi-m-step-num{
    width: 56px;
    height: 56px;
    box-shadow: 0 8px 22px rgba(201,162,39,0.32), inset 0 2px 0 rgba(255,255,255,0.4), 0 0 0 4px rgba(201,162,39,0.10) !important;
  }
  body.page-id-106 .pi-m-step-num::after{ font-size: 20px !important; }
  body.page-id-106 .pi-m-step h3{ font-size: 19px !important; margin-bottom: 10px !important; }
  body.page-id-106 .pi-m-step h3::before{ font-size: 11px; margin-bottom: 6px; }
  body.page-id-106 .pi-m-step p{ font-size: 15px !important; line-height: 1.55 !important; }
}

/* === END V2 PATCH === */

/* ===== END DLA MIESZKANCOW MODERN LOOK v1 ===== */

/* PI-CTA-NAV — CTA button in main navigation */
.wp-block-navigation .pi-cta-nav > a,
.wp-block-navigation-item.pi-cta-nav > a{
  background:var(--pi-gold,#C9A227);
  color:#0F0F0F !important;
  padding:8px 18px !important;
  border-radius:8px !important;
  font-weight:700 !important;
  transition:background .2s ease;
}
.wp-block-navigation .pi-cta-nav > a:hover,
.wp-block-navigation-item.pi-cta-nav > a:hover{
  background:var(--pi-gold-hover,#E0B634) !important;
}

/* PI-KALK-UNIFY — unify calculator gold color */
:where(.kalkulator,.calc,.pi-calc) [style*="#d4af37"],
:where(.kalkulator,.calc,.pi-calc) [style*="#D4AF37"]{color:var(--pi-gold,#C9A227) !important;}

/* PI-CTA-TEXT-FIX — force dark text on gold buttons (theme override) */
.pi-home-hero .cta .primary,
.pi-lp .cta .primary,
.pi-lp .price-card a,
.pi-cen .card a:not(.ghost),
.pi-cen .hero a,
.pi-meth .cta a,
.pi-order .pi-order-form input[type=submit],
.pi-about .pi-btn-primary,
.wp-block-navigation .pi-cta-nav > a,
.wp-block-navigation-item.pi-cta-nav > a{
  color:#0F0F0F !important;
  background:#C9A227 !important;
  text-shadow:none !important;
}
.pi-home-hero .cta .primary:hover,
.pi-lp .cta .primary:hover,
.pi-lp .price-card a:hover,
.pi-cen .card a:not(.ghost):hover,
.pi-meth .cta a:hover,
.pi-order .pi-order-form input[type=submit]:hover,
.pi-about .pi-btn-primary:hover,
.wp-block-navigation .pi-cta-nav > a:hover{
  color:#0F0F0F !important;
  background:#E0B634 !important;
}
/* Ghost / outline variants — keep gold text */
.pi-home-hero .cta .ghost,
.pi-lp .cta .ghost,
.pi-cen .card.ghost a{
  color:#E8E8E8 !important;
  background:transparent !important;
}
.pi-cen .card.ghost a{color:#C9A227 !important}
.pi-home-hero .cta .ghost:hover,
.pi-lp .cta .ghost:hover{
  color:#C9A227 !important;
  border-color:#C9A227 !important;
}


/* PI-CTA-NAV-MOBILE-HIDE — hide sticky gold CTA on mobile entirely */
@media (max-width:768px){
  body{padding-bottom:0 !important}
  .pi-cta-nav{
    position:static !important;
    left:auto !important; right:auto !important; bottom:auto !important;
    z-index:auto !important;
    box-shadow:none !important;
  }
  .pi-cta-nav > a{
    box-shadow:none !important;
    padding:8px 14px !important;
    font-size:14px !important;
  }
}


/* PI-BTN-PRIMARY-FIX — force dark text on all .pi-btn-primary (global) */
.pi-btn-primary,
a.pi-btn-primary,
.pi-cta a.pi-btn-primary,
.pi-cta .pi-btn-primary{
  color:#0F0F0F !important;
  background:#C9A227 !important;
}
.pi-btn-primary:hover,
a.pi-btn-primary:hover,
.pi-cta a.pi-btn-primary:hover{
  color:#0F0F0F !important;
  background:#E0B634 !important;
}