/* ═══════════════════════════════════════════════════════════════════
   DESIGN SYSTEM — "Modern Fintech" · Warm Neutrals, Red & Orange
   (Material Design palette — Red 500-900 / Deep Orange 500-900)
   Loads LAST — uses !important to override twentytwenty-style-css.css
   ═══════════════════════════════════════════════════════════════════ */

:root {
  /* Warm neutrals (near-black / warm-gray text & surfaces) */
  --ink-950: #1a0f0e;
  --ink-900: #251615;
  --ink-800: #3d2422;
  --ink-700: #593836;
  --ink-600: #77504c;
  --ink-300: #e8d3d1;
  --ink-200: #f2e0de;
  --ink-100: #f9ecea;

  /* Red (primary accent — links, CTAs, headings) */
  --emerald-800: #b71c1c;
  --emerald-700: #c62828;
  --emerald-600: #d32f2f;
  --emerald-500: #e53935;
  --emerald-400: #ef5350;
  --emerald-100: #fbd6d5;
  --emerald-50:  #fdf0ef;

  /* Deep Orange (secondary accent — highlights, badges, dividers) */
  --gold-700: #9a3412;
  --gold-600: #c2410c;
  --gold-500: #ea580c;
  --gold-400: #f97316;
  --gold-100: #ffedd5;

  /* Backgrounds */
  --paper:     #fbf6f3;
  --paper-alt: #f5e9e4;
  --surface:   #ffffff;

  /* Text */
  --t1: #241414;
  --t2: #6b4a45;
  --t3: #a68a84;

  /* Borders */
  --bdr:    #f0dedd;
  --bdr-md: #e0c4c1;

  /* Shadows */
  --sh-xs: 0 1px 2px rgba(36,20,20,.06), 0 1px 1px rgba(36,20,20,.03);
  --sh-sm: 0 4px 14px rgba(36,20,20,.08), 0 1px 4px rgba(36,20,20,.04);
  --sh-md: 0 14px 34px rgba(36,20,20,.11), 0 3px 10px rgba(36,20,20,.05);
  --sh-lg: 0 26px 64px rgba(36,20,20,.20), 0 8px 20px rgba(36,20,20,.09);

  /* Radii — larger, softer, modern */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-full: 9999px;

  /* Misc */
  --ease: 0.18s cubic-bezier(.4,0,.2,1);
  --font: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-serif: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* ═══════════════════════════════════════════════════════════════════
   RESET & BASE
   ═══════════════════════════════════════════════════════════════════ */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font) !important;
  background: var(--paper) !important;
  color: var(--t1) !important;
  -webkit-font-smoothing: antialiased;
}

#site-content {
  background: var(--paper) !important;
}

p,
li {
  font-size: 1.5rem;
  line-height: 1.75;
  color: var(--t2);
}

a {
  color: var(--emerald-600);
  text-decoration: none;
  transition: color var(--ease);
}

a:hover {
  color: var(--emerald-700);
}

.section-inner,
.thin {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 28px !important;
  padding-right: 28px !important;
  width: 100% !important;
}

/* ═══════════════════════════════════════════════════════════════════
   HERO — Homepage. Full-bleed background photo, but a split
   composition: copy block anchored left, a glass "stats" panel
   floating on the right. Deliberately unlike the inner-page hero
   (contained gradient card) and the TOC (tile grid) below it.
   ═══════════════════════════════════════════════════════════════════ */

.hero {
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  width: 100vw !important;
  max-width: 100vw !important;
  color: #fff !important;
  overflow: hidden !important;
}

.hero-main {
  min-height: 0 !important;
  display: block !important;
  padding: 0 !important;
}

.hero-media {
  position: absolute !important;
  inset: 0 !important;
  background: url('../media/heo.jpg') center 38% / cover no-repeat !important;
  z-index: 0 !important;
}

.hero-scrim {
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(115deg, rgba(26,15,14,.94) 0%, rgba(26,15,14,.80) 34%, rgba(26,15,14,.42) 62%, rgba(211,47,47,.28) 100%) !important;
  z-index: 1 !important;
}

.hero-frame {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 96px 32px 84px !important;
  text-align: left !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 320px !important;
  column-gap: 64px !important;
  align-items: center !important;
}

.hero-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  backdrop-filter: blur(6px) !important;
  border-radius: var(--r-full) !important;
  padding: 7px 18px 7px 14px !important;
  margin: 0 0 26px !important;
  width: fit-content !important;
}

.hero-badge::before {
  content: '' !important;
  display: inline-block !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: var(--gold-400) !important;
  box-shadow: 0 0 0 3px rgba(249,115,22,.25) !important;
}

.hero h1 {
  grid-column: 1 !important;
  grid-row: 2 !important;
  font-family: var(--font) !important;
  color: #fff !important;
  font-size: clamp(2.2rem, 4.4vw, 3.6rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 22px !important;
  line-height: 1.1 !important;
  text-align: left !important;
  max-width: 17ch !important;
}

.hero h1::after {
  display: none !important;
}

.hero-lede {
  grid-column: 1 !important;
  grid-row: 3 !important;
  color: rgba(255,255,255,.80) !important;
  font-size: 1.6rem !important;
  max-width: 48ch !important;
  margin: 0 0 36px !important;
  line-height: 1.6 !important;
  text-align: left !important;
}

.hero-actions {
  grid-column: 1 !important;
  grid-row: 4 !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  margin-bottom: 0 !important;
}

.hero-btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  background: linear-gradient(135deg, var(--emerald-500), var(--gold-600)) !important;
  color: #fff !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  padding: 16px 30px !important;
  border-radius: var(--r-md) !important;
  text-decoration: none !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  box-shadow: 0 14px 30px rgba(211,47,47,.40) !important;
  transition: all var(--ease) !important;
}

.hero-btn-primary:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-2px) !important;
}

.hero-btn-secondary {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 1.4rem !important;
  font-weight: 600 !important;
  color: #fff !important;
  text-decoration: none !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: var(--r-md) !important;
  padding: 15px 26px !important;
  transition: background var(--ease), border-color var(--ease) !important;
}

.hero-btn-secondary:hover {
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.5) !important;
}

/* ── Floating glass stats panel (right column) ──────────────────── */

.hero-stats {
  grid-column: 2 !important;
  grid-row: 1 / 5 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  align-self: stretch !important;
  justify-content: center !important;
  background: rgba(15,23,42,.38) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-radius: var(--r-xl) !important;
  padding: 8px 30px !important;
  box-shadow: var(--sh-lg) !important;
  border-top: none !important;
}

.hero-stat {
  flex: none !important;
  text-align: left !important;
  padding: 22px 0 !important;
  position: relative !important;
}

.hero-stat:not(:last-child)::after {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  top: auto !important;
  width: auto !important;
  height: 1px !important;
  background: rgba(255,255,255,.16) !important;
}

.hero-stat strong {
  display: block !important;
  font-family: var(--font) !important;
  font-size: 1.9rem !important;
  font-weight: 800 !important;
  color: var(--gold-400) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
}

.hero-stat span {
  display: block !important;
  font-size: 1.12rem !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,.66) !important;
  text-transform: uppercase !important;
  letter-spacing: .07em !important;
  margin-top: 5px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   HERO — Inner pages ("floating gradient card": contained, rounded,
   indigo→slate gradient, left-aligned copy with an oversized icon
   glyph pinned to the right). Deliberately unlike the homepage photo
   hero and the TOC tile grid below it.
   ═══════════════════════════════════════════════════════════════════ */

.hero-inner {
  position: static !important;
  left: auto !important;
  right: auto !important;
  margin: 36px auto 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  background: linear-gradient(120deg, var(--ink-900) 0%, var(--emerald-700) 130%) !important;
  padding: 0 !important;
  display: block !important;
  grid-template-columns: unset !important;
  gap: unset !important;
  min-height: unset !important;
  text-align: left !important;
  border-left: none !important;
  position: relative !important;
  overflow: hidden !important;
  border-top: none !important;
  border-bottom: none !important;
  border-radius: var(--r-xl) !important;
  box-shadow: var(--sh-lg) !important;
}

.hero-inner .hero-container {
  grid-template-columns: unset !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 52px 44px !important;
  position: relative !important;
  z-index: 1 !important;
  text-align: left !important;
}

.hero-inner .hero-container::before {
  display: none !important;
}

/* Oversized ghost glyph, pinned to the right side */
.hero-inner::before {
  content: '↗' !important;
  position: absolute !important;
  right: -18px !important;
  top: 50% !important;
  left: auto !important;
  transform: translateY(-50%) !important;
  font-family: var(--font) !important;
  font-weight: 800 !important;
  font-size: 11rem !important;
  line-height: 1 !important;
  color: #fff !important;
  opacity: .07 !important;
  pointer-events: none !important;
  display: block !important;
}

.hero-inner::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(560px 260px at 0% 0%, rgba(234,88,12,.22), transparent 70%) !important;
  pointer-events: none !important;
}

.hero-inner h1 {
  font-family: var(--font) !important;
  font-size: clamp(1.8rem, 3.2vw, 2.5rem) !important;
  margin: 0 !important;
  color: #fff !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
}

.hero-inner h1::after {
  display: none !important;
}

/* Kicker rendered as a small pill above the heading */
.hero-inner .hero-breadcrumb {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  color: var(--gold-400) !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: var(--r-full) !important;
  padding: 6px 16px !important;
  margin-bottom: 16px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   TABLE OF CONTENTS (inner pages) — tile grid with numbered chips,
   distinct from both hero treatments and from the offer grid layouts.
   ═══════════════════════════════════════════════════════════════════ */

.page-toc {
  background: var(--bdr) !important;
  border: 1px solid var(--bdr) !important;
  border-left: none !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-xs) !important;
  padding: 0 !important;
  margin: 32px 0 44px !important;
  max-width: none !important;
  display: grid !important;
  grid-template-columns: 100% !important;
  gap: 1px !important;
  overflow: hidden !important;
}

.page-toc-title {
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--t3) !important;
  margin: 0 !important;
  display: block !important;
  background: var(--surface) !important;
  padding: 16px 22px !important;
  border-right: none !important;
}

.page-toc ol,
.page-toc ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  gap: 1px !important;
  counter-reset: toc-step !important;
  background: var(--bdr) !important;
}

.page-toc li {
  list-style: none !important;
  counter-increment: toc-step !important;
  position: relative !important;
  background: var(--surface) !important;
}

.page-toc li::after {
  display: none !important;
}

.page-toc a {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--ink-800) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  border-radius: 0 !important;
  border: none !important;
  padding: 20px 22px !important;
  min-height: 92px !important;
  transition: background var(--ease), color var(--ease) !important;
  white-space: normal !important;
  position: relative !important;
}

.page-toc a::before {
  content: counter(toc-step, decimal-leading-zero) !important;
  position: relative !important;
  z-index: 1 !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: var(--r-sm) !important;
  background: var(--emerald-50) !important;
  color: var(--emerald-700) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  transition: background var(--ease), color var(--ease) !important;
}

.page-toc a::after {
  content: '→' !important;
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  color: var(--t3) !important;
  font-weight: 700 !important;
  opacity: 0 !important;
  transform: translateX(-4px) !important;
  transition: opacity var(--ease), transform var(--ease) !important;
}

.page-toc a:hover {
  color: var(--emerald-700) !important;
  background: var(--emerald-50) !important;
}

.page-toc a:hover::before {
  background: var(--emerald-600) !important;
  color: #fff !important;
}

.page-toc a:hover::after {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

/* Inner page h2 headings styled as section markers */
.entry-content h2 {
  font-family: var(--font) !important;
  font-size: 1.7rem !important;
  font-weight: 800 !important;
  color: var(--ink-900) !important;
  margin: 40px 0 14px !important;
  padding: 0 0 12px !important;
  background: none !important;
  border-left: none !important;
  border-bottom: 2px solid var(--bdr-md) !important;
  border-radius: 0 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.3 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   MAIN CONTENT AREA
   ═══════════════════════════════════════════════════════════════════ */

.post-inner.thin {
  padding-top: 0 !important;
  padding-bottom: 60px !important;
}

.hero-main ~ article .post-inner.thin {
  padding-top: 56px !important;
}

.entry-content {
  padding: 0 !important;
}

#lista--ofert {
  max-width: 100% !important;
  width: 100% !important;
  text-align: left !important;
}

/* ── Section heading banner ─────────────────────────────────────── */

#szybkie--pozyczki {
  display: flex !important;
  align-items: baseline !important;
  gap: 16px !important;
  margin: 48px 0 32px !important;
  padding: 0 0 18px !important;
  background: none !important;
  border: none !important;
  border-bottom: 2px solid var(--bdr-md) !important;
  border-radius: 0 !important;
  color: var(--ink-900) !important;
  font-family: var(--font) !important;
  font-size: clamp(1.3rem, 2.5vw, 1.7rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.25 !important;
  box-shadow: none !important;
  overflow: visible !important;
  position: relative !important;
}

#szybkie--pozyczki::before {
  content: '01' !important;
  display: inline-flex !important;
  flex-shrink: 0 !important;
  font-family: var(--font) !important;
  font-size: 1.1rem !important;
  font-weight: 800 !important;
  color: var(--gold-700) !important;
  border: 1px solid var(--gold-500) !important;
  border-radius: var(--r-full) !important;
  padding: 3px 11px !important;
  background: var(--gold-100) !important;
}

#szybkie--pozyczki::after {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   OFFER CARDS — Full-width horizontal row layout
   ═══════════════════════════════════════════════════════════════════ */

.widok--desktop {
  width: 100% !important;
}

.widok--desktop > div {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  align-items: stretch !important;
  overflow: hidden !important;
  grid-template-columns: unset !important;
}

.et_pb_post {
  display: none !important;
}

.widok--desktop > div::after {
  content: '' !important;
  display: table !important;
  clear: both !important;
}

/* ── Individual offer card (horizontal row) ─────────────────────── */

.rzedy-porownaj {
  background: var(--surface) !important;
  border: 1px solid var(--bdr) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-xs) !important;
  position: relative !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  transition: box-shadow var(--ease), transform var(--ease), border-color var(--ease) !important;
  float: none !important;
  min-height: 90px !important;
}

.rzedy-porownaj:hover {
  box-shadow: var(--sh-md) !important;
  transform: translateY(-2px) !important;
  border-color: var(--emerald-400) !important;
}

.offer-position-1,
.offer-position-2,
.offer-position-3 {
  border-left: none !important;
}

.rzedy-porownaj::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, var(--emerald-500), var(--gold-500)) !important;
  opacity: 0 !important;
  transition: opacity var(--ease) !important;
  z-index: 1 !important;
  width: auto !important;
  border: none !important;
}

.rzedy-porownaj:hover::before {
  opacity: 1 !important;
}

.offer-position-1::before,
.offer-position-2::before,
.offer-position-3::before {
  opacity: 1 !important;
}

/* ── .rzad → horizontal flex row ─────────────────────────────────── */

.rzad {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 0 !important;
  flex: 1 !important;
  width: 100% !important;
  overflow: visible !important;
  min-height: 90px !important;
}

.rzad::after {
  content: '' !important;
  display: table !important;
  clear: both !important;
}

/* ── Rank badge — left sidebar column ───────────────────────────── */

.rank_position {
  position: static !important;
  top: auto !important;
  left: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  width: 60px !important;
  height: auto !important;
  min-height: 90px !important;
  background: var(--paper-alt) !important;
  color: var(--ink-700) !important;
  font-family: var(--font) !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  border-radius: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: auto !important;
  letter-spacing: 0 !important;
  float: none !important;
  padding: 0 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  pointer-events: none !important;
  flex-shrink: 0 !important;
  border-right: 1px solid var(--bdr) !important;
}

.offer-position-1 .rank_position,
.offer-position-2 .rank_position,
.offer-position-3 .rank_position {
  background: linear-gradient(160deg, var(--emerald-600), var(--emerald-800)) !important;
  color: var(--gold-400) !important;
  box-shadow: none !important;
  width: 60px !important;
  height: auto !important;
  min-height: 90px !important;
  font-size: 1.15rem !important;
  top: auto !important;
  left: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  border-radius: 0 !important;
  position: static !important;
}

/* Recommended badge — repositioned for horizontal layout */
.dopasowana-badge {
  position: absolute !important;
  top: 8px !important;
  right: 150px !important;
  left: auto !important;
  background: linear-gradient(120deg, var(--gold-600), var(--emerald-600)) !important;
  color: #fff !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  padding: 3px 10px !important;
  border-radius: var(--r-full) !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  box-shadow: 0 2px 8px rgba(211,47,47,.35) !important;
  z-index: 4 !important;
  float: none !important;
  bottom: auto !important;
}

/* ── Logo area (fixed width column) ─────────────────────────────── */

.logo_firmy {
  background: #fff !important;
  border-bottom: none !important;
  border-right: 1px solid var(--bdr) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px 20px !important;
  min-height: 90px !important;
  width: 160px !important;
  flex-shrink: 0 !important;
  float: none !important;
  margin: 0 !important;
  text-align: center !important;
  box-sizing: border-box !important;
  position: static !important;
}

.logo_firmy img {
  max-height: 100% !important;
  width: auto !important;
  height: 52px !important;
  object-fit: contain !important;
  float: none !important;
  display: block !important;
  margin: 0 auto !important;
  max-width: 130px !important;
}

.logo_firmy a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.logo_firmy a:hover img {
  opacity: 0.80 !important;
}

/* ── Amount (kol-1) ──────────────────────────────────────────────── */

.kol-1 {
  text-align: center !important;
  padding: 0 22px !important;
  border-bottom: none !important;
  border-right: 1px solid var(--bdr) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  float: none !important;
  width: 150px !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
  min-height: 90px !important;
}

.kol-1 strong {
  font-size: 1.2rem !important;
  font-weight: 800 !important;
  color: var(--ink-800) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
  display: block !important;
}

.kol-1 span {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--t3) !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  display: block !important;
  width: auto !important;
}

/* ── Feature list (kol-3) — horizontal tags ─────────────────────── */

.kol-3 {
  padding: 14px 20px !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: center !important;
  border-bottom: none !important;
  border-right: 1px solid var(--bdr) !important;
  min-height: 90px !important;
  float: none !important;
  flex: 1 !important;
  width: auto !important;
  box-sizing: border-box !important;
  text-align: left !important;
  align-content: center !important;
}

.kol-3 > div {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  color: var(--t2) !important;
  background: var(--paper-alt) !important;
  border: 1px solid var(--bdr) !important;
  border-radius: var(--r-sm) !important;
  padding: 4px 10px !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  float: none !important;
  margin: 0 !important;
  transition: background var(--ease), border-color var(--ease) !important;
}

.kol-3 > div::before {
  content: '✓' !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  background: var(--emerald-50) !important;
  border: 1.5px solid rgba(211,47,47,.30) !important;
  color: var(--emerald-700) !important;
  font-size: 1.25rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

/* Active feature items — indigo accent pill */
.zadarmo-1,
.wyplata-1,
.bezbik-1,
.wysoka-1,
.bezzas-1,
.wyskwo-1 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--emerald-800) !important;
  background: var(--emerald-50) !important;
  border: 1px solid var(--emerald-100) !important;
  border-radius: var(--r-sm) !important;
  padding: 4px 10px !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  float: none !important;
  margin: 0 !important;
}

.zadarmo-1::before,
.wyplata-1::before,
.bezbik-1::before,
.wysoka-1::before,
.bezzas-1::before,
.wyskwo-1::before {
  content: '✓' !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  background: var(--emerald-600) !important;
  border: none !important;
  color: #fff !important;
  font-size: 1.25rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

.zadarmo-,
.wyplata-,
.bezbik-,
.wysoka-,
.bezzas-,
.wyskwo- {
  float: none !important;
}

.kol-3 .wylacz-1,
.wylacz-1 {
  display: none !important;
}

/* ── Rating (kol-4) ──────────────────────────────────────────────── */

.kol-4 {
  padding: 14px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  border-bottom: none !important;
  border-right: 1px solid var(--bdr) !important;
  float: none !important;
  width: 120px !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
  text-align: center !important;
  min-height: 90px !important;
}

.kol-4 > span {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--t3) !important;
  display: block !important;
  white-space: nowrap !important;
  width: auto !important;
  margin-left: 0 !important;
}

.rating {
  display: inline-flex !important;
  align-items: center !important;
  background: none !important;
  height: auto !important;
  width: auto !important;
  border-radius: 0 !important;
  overflow: visible !important;
  text-align: center !important;
  flex-shrink: 0 !important;
}

.ocena {
  position: relative !important;
  display: inline-block !important;
  background: none !important;
  height: 18px !important;
  overflow: visible !important;
  padding: 0 !important;
  line-height: 18px !important;
  font-size: 14px !important;
  width: 76px !important;
  border-radius: 0 !important;
}

/* Empty star track */
.ocena::before {
  content: '★★★★★' !important;
  display: block !important;
  font-size: 14px !important;
  line-height: 18px !important;
  letter-spacing: 1px !important;
  color: var(--bdr-md) !important;
  white-space: nowrap !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 76px !important;
  z-index: 0 !important;
}

/* Filled star overlay — width set inline per row via style="width: N%" */
.ocena ocena {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  overflow: hidden !important;
  display: block !important;
  height: 100% !important;
  background: none !important;
  z-index: 1 !important;
  white-space: nowrap !important;
}

.ocena ocena::before {
  content: '★★★★★' !important;
  display: block !important;
  font-size: 14px !important;
  line-height: 18px !important;
  letter-spacing: 1px !important;
  color: var(--gold-500) !important;
  white-space: nowrap !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 76px !important;
}

/* ── CTA (kol-5) ─────────────────────────────────────────────────── */

.kol-5 {
  padding: 16px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  width: 150px !important;
  float: none !important;
  box-sizing: border-box !important;
  text-align: center !important;
  min-height: 90px !important;
  flex: unset !important;
}

.kol-5 a {
  text-decoration: none !important;
  display: block !important;
  width: 100% !important;
  box-shadow: none !important;
  border: none !important;
  cursor: pointer !important;
}

button.przycisk,
.kol-5 button.przycisk,
a button.przycisk {
  display: block !important;
  width: 100% !important;
  background: linear-gradient(135deg, var(--emerald-500), var(--emerald-700)) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--r-md) !important;
  padding: 13px 14px !important;
  font-family: var(--font) !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  letter-spacing: .02em !important;
  text-align: center !important;
  text-transform: none !important;
  white-space: nowrap !important;
  float: none !important;
  box-shadow: 0 6px 16px rgba(211,47,47,.30) !important;
  transition: all var(--ease) !important;
  line-height: normal !important;
  margin: 0 !important;
}

button.przycisk:hover,
.kol-5 button.przycisk:hover {
  filter: brightness(1.08) !important;
  box-shadow: 0 10px 22px rgba(211,47,47,.42) !important;
  transform: translateY(-1px) !important;
}

/* ── Offer extras (dodatkowy-opis) ──────────────────────────────── */

.dodatkowy-opis {
  font-size: 1.25rem !important;
  color: var(--t3) !important;
  padding: 6px 60px 6px !important;
  border-top: 1px solid var(--bdr) !important;
  margin: 0 !important;
  background: var(--paper) !important;
  line-height: 1.5 !important;
  display: block !important;
}

/* ═══════════════════════════════════════════════════════════════════
   OFFERS PODIUM (top 3) — vertical featured cards with a corner rank
   chip, 3-up grid. Distinct from the compact row list below.
   ═══════════════════════════════════════════════════════════════════ */

.offers-podium {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 22px !important;
  margin: 0 0 6px !important;
}

.offers-podium .rzedy-porownaj {
  flex-direction: column !important;
  align-items: stretch !important;
  min-height: 0 !important;
  border-radius: var(--r-xl) !important;
  border-left: none !important;
  border-top: none !important;
}

.offers-podium .rzad {
  flex-direction: column !important;
  min-height: 0 !important;
  width: 100% !important;
}

.offers-podium .rank_position {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  z-index: 4 !important;
  width: 38px !important;
  height: 38px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border-right: none !important;
  background: linear-gradient(160deg, var(--emerald-500), var(--emerald-800)) !important;
  color: var(--gold-400) !important;
  font-size: 1.05rem !important;
  box-shadow: 0 4px 12px rgba(211,47,47,.35) !important;
}

.offers-podium .logo_firmy {
  order: 1 !important;
  width: 100% !important;
  min-height: 108px !important;
  padding: 40px 24px 16px !important;
  border-right: none !important;
  border-bottom: 1px solid var(--bdr) !important;
}

.offers-podium .kol-1 {
  order: 2 !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 16px 20px !important;
  border-right: none !important;
  border-bottom: 1px solid var(--bdr) !important;
}

.offers-podium .kol-4 {
  order: 3 !important;
  width: 100% !important;
  min-height: 0 !important;
  flex-direction: row !important;
  padding: 14px 20px !important;
  border-right: none !important;
  border-bottom: 1px solid var(--bdr) !important;
}

.offers-podium .kol-3 {
  order: 4 !important;
  width: 100% !important;
  min-height: 0 !important;
  flex: unset !important;
  border-right: none !important;
  border-bottom: 1px solid var(--bdr) !important;
  padding: 16px 20px !important;
}

.offers-podium .kol-5 {
  order: 5 !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 18px 20px 20px !important;
}

.offers-podium .dopasowana-badge {
  top: 14px !important;
  right: 14px !important;
  left: auto !important;
}

/* ═══════════════════════════════════════════════════════════════════
   OFFERS LIST (remaining offers) — compact horizontal rows.
   ═══════════════════════════════════════════════════════════════════ */

.offers-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.offers-list .rzedy-porownaj,
.offers-list .rzad {
  min-height: 74px !important;
}

.offers-list .rank_position {
  width: 46px !important;
  min-height: 74px !important;
  font-size: 1rem !important;
}

.offers-list .logo_firmy {
  width: 130px !important;
  min-height: 74px !important;
  padding: 10px 16px !important;
}

.offers-list .logo_firmy img {
  height: 38px !important;
}

.offers-list .kol-1 {
  width: 120px !important;
  min-height: 74px !important;
  padding: 0 16px !important;
}

.offers-list .kol-4 {
  width: 100px !important;
  min-height: 74px !important;
  padding: 10px 14px !important;
}

.offers-list .kol-5 {
  width: 130px !important;
  min-height: 74px !important;
  padding: 12px 16px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   EDITORIAL CARDS + FAQ — asymmetric numbered layout
   ═══════════════════════════════════════════════════════════════════ */

.editorial-grid {
  display: grid !important;
  grid-template-columns: 7fr 5fr !important;
  gap: 0 !important;
  margin: 0 0 44px !important;
  background: var(--surface) !important;
  border: 1px solid var(--bdr) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-xs) !important;
  overflow: hidden !important;
}

.editorial-card {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 32px 32px !important;
  position: relative !important;
}

.editorial-card:first-child {
  border-right: 1px solid var(--bdr) !important;
}

.editorial-card:nth-child(1)::before {
  content: '01' !important;
}

.editorial-card:nth-child(2)::before {
  content: '02' !important;
}

.editorial-card::before {
  display: inline-block !important;
  font-family: var(--font) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  color: var(--gold-700) !important;
  border: 1px solid var(--gold-500) !important;
  border-radius: var(--r-full) !important;
  padding: 2px 11px !important;
  background: var(--gold-100) !important;
  margin-bottom: 14px !important;
}

.editorial-card h2 {
  margin-top: 0 !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
}

.editorial-section--flush-top {
  padding-top: 52px !important;
  padding-bottom: 0 !important;
}

.faq-title {
  margin-bottom: 20px !important;
}

.faq-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  background: var(--surface) !important;
  border: 1px solid var(--bdr) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-xs) !important;
  overflow: hidden !important;
  counter-reset: faq-step !important;
}

.faq-item {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  overflow: hidden !important;
  counter-increment: faq-step !important;
}

.faq-item:not(:last-child) {
  border-bottom: 1px solid var(--bdr) !important;
}

.faq-item summary {
  list-style: none !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 20px 24px !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
}

.faq-item summary::-webkit-details-marker {
  display: none !important;
}

.faq-item summary::before {
  content: counter(faq-step, decimal-leading-zero) !important;
  flex-shrink: 0 !important;
  font-family: var(--font) !important;
  font-size: 1.1rem !important;
  font-weight: 800 !important;
  color: var(--gold-600) !important;
}

.faq-item summary::after {
  content: '+' !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  border: 1px solid var(--bdr-md) !important;
  color: var(--emerald-600) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  transition: transform var(--ease), background var(--ease), color var(--ease) !important;
}

.faq-item[open] summary::after {
  transform: rotate(45deg) !important;
  background: var(--emerald-600) !important;
  border-color: var(--emerald-600) !important;
  color: #fff !important;
}

.faq-item p {
  margin: 0 !important;
  padding: 0 24px 22px 60px !important;
  color: var(--t2) !important;
}

/* Flat content lists (e.g. partner list page) as a bordered card */
.entry-content > ul {
  list-style: none !important;
  margin: 24px 0 !important;
  padding: 6px !important;
  background: var(--surface) !important;
  border: 1px solid var(--bdr) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-xs) !important;
}

.entry-content > ul > li {
  padding: 12px 16px 12px 40px !important;
  position: relative !important;
  font-size: 1.35rem !important;
}

.entry-content > ul > li:not(:last-child) {
  border-bottom: 1px solid var(--bdr) !important;
}

.entry-content > ul > li::before {
  content: '' !important;
  position: absolute !important;
  left: 14px !important;
  top: 18px !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: var(--gold-500) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   FOOTER AREAS
   ═══════════════════════════════════════════════════════════════════ */

/* Legal disclaimer strip */
.footer-widgets.column-two {
  background: var(--paper-alt) !important;
  border-top: 2px solid var(--bdr-md) !important;
  margin-left: 0 !important;
  padding: 0 !important;
}

#dodatkowe--info {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 32px 28px !important;
  font-size: 1.5rem !important;
  color: var(--t2) !important;
  line-height: 1.75 !important;
  text-align: left !important;
}

#dodatkowe--info strong {
  color: var(--ink-800) !important;
}

#dodatkowe--info a {
  color: var(--emerald-600) !important;
  text-decoration: underline !important;
}

.footer-widgets-outer-wrapper {
  padding: 0 !important;
}

.footer-nav-widgets-wrapper.header-footer-group {
  background: transparent !important;
  padding: 0 !important;
  border-top: none !important;
  margin-top: 0 !important;
}

.footer-inner.section-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.footer-inner-flush {
  max-width: none !important;
  padding: 0 !important;
}

.footer-widgets-wrapper {
  padding: 0 !important;
}

.footer-widgets.column-one.grid-item {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}

/* IOD contact line */
.kontakt_iod {
  display: block !important;
  font-size: 1.25rem !important;
  color: rgba(255,255,255,.78) !important;
  padding: 22px 28px !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  background: var(--ink-950) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
}

.kontakt_iod a {
  color: var(--gold-400) !important;
  text-decoration: none !important;
}

.kontakt_iod a:hover {
  text-decoration: underline !important;
}

.footer-widgets .widget_text .widget-content,
.footer-widgets .widget_text .textwidget {
  display: block !important;
}

#stopka--info {
  display: block !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 18px 28px !important;
  background: var(--ink-950) !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}

#stopka--info p {
  font-size: 1.25rem !important;
  color: rgba(255,255,255,.78) !important;
  line-height: 1.75 !important;
  margin: 0 0 22px !important;
}

#stopka--info p:last-child {
  margin-bottom: 0 !important;
}

#stopka--info a {
  color: var(--gold-400) !important;
  text-decoration: underline !important;
}

/* ── Footer — brand column + link columns, cyan hairline top ─────── */

.footer-grid-bg {
  background: var(--ink-950) !important;
  width: 100% !important;
  border-top: 3px solid transparent !important;
  border-image: linear-gradient(90deg, var(--emerald-500), var(--gold-500)) 1 !important;
  position: relative !important;
}

.footer-grid-bg::before {
  display: none !important;
}

/* Nav strip rendered as a slim left-aligned link row */
.footer-top-strip {
  background: var(--ink-900) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}

.footer-nav-row {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 16px 28px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px 22px !important;
}

.footer-nav-row a {
  font-size: 1.3rem !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,.75) !important;
  text-decoration: none !important;
  padding: 6px 0 !important;
  border-radius: 0 !important;
  border-bottom: 1px solid transparent !important;
  transition: color var(--ease), border-color var(--ease) !important;
}

.footer-nav-row a:hover {
  color: var(--gold-400) !important;
  border-color: var(--gold-400) !important;
  background: none !important;
}

.footer-grid {
  display: grid !important;
  grid-template-columns: 1fr .8fr .8fr .8fr !important;
  gap: 0 !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  color: rgba(255,255,255,.85) !important;
}

.footer-col {
  padding: 44px 32px 40px !important;
  box-sizing: border-box !important;
  position: relative !important;
}

.footer-col:not(:last-child)::after {
  content: '' !important;
  position: absolute !important;
  top: 44px !important;
  bottom: 40px !important;
  right: 0 !important;
  width: 1px !important;
  background: rgba(255,255,255,.09) !important;
}

.footer-col:first-child {
  padding-left: 28px !important;
  grid-column: span 1 !important;
}

.footer-col-title {
  font-family: var(--font) !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  color: var(--gold-400) !important;
  margin: 0 0 18px !important;
  line-height: 1.2 !important;
  display: inline-block !important;
}

.footer-col-text {
  font-size: 1.4rem !important;
  color: rgba(255,255,255,.86) !important;
  line-height: 1.78 !important;
  margin: 0 !important;
}

.footer-col-text--tight {
  margin-top: 14px !important;
}

.footer-col-text--loose {
  margin-top: 16px !important;
}

.footer-brand-name {
  color: #fff !important;
  font-weight: 700 !important;
}

.footer-contact-item {
  margin-bottom: 18px !important;
}

.footer-contact-label {
  display: block !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  color: rgba(255,255,255,.55) !important;
  margin-bottom: 5px !important;
}

.footer-contact-value {
  font-size: 1.3rem !important;
  color: rgba(255,255,255,.92) !important;
  line-height: 1.55 !important;
}

.footer-contact-value a {
  color: var(--gold-400) !important;
}

.footer-contact-value a:hover {
  color: var(--gold-100) !important;
}

/* Bottom copyright bar */
#site-footer.header-footer-group {
  background: var(--ink-950) !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
  padding: 0 !important;
  color: rgba(255,255,255,.50) !important;
  font-size: 1.25rem !important;
}

.reduced-spacing.footer-top-visible .footer-nav-widgets-wrapper,
.reduced-spacing.footer-top-hidden #site-footer {
  background: var(--ink-950) !important;
  border: none !important;
  margin-top: 0 !important;
}

#site-footer .section-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  max-width: 1240px !important;
}

.footer-credits {
  display: flex !important;
  align-items: center !important;
}

.footer-copyright {
  font-size: 1.25rem !important;
  color: rgba(255,255,255,.50) !important;
  margin: 0 !important;
}

.to-the-top {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  background: none !important;
  color: var(--gold-400) !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  padding: 6px 0 !important;
  border-radius: 0 !important;
  border: none !important;
  border-bottom: 1px solid var(--gold-500) !important;
  text-decoration: none !important;
  transition: all var(--ease) !important;
  letter-spacing: .02em !important;
}

.to-the-top:hover {
  color: var(--gold-100) !important;
}

.to-the-top-long {
  display: inline !important;
}

.to-the-top-short {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   COOKIE CONSENT BAR
   ═══════════════════════════════════════════════════════════════════ */

#cc-bar,
#cc-settings-panel {
  display: none;
}

#cc-bar {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 99999 !important;
  background: var(--ink-950) !important;
  box-shadow: 0 -4px 24px rgba(15,12,8,.30), 0 -1px 0 rgba(255,255,255,.06) !important;
  font-family: var(--font) !important;
  border-top: 3px solid var(--gold-500) !important;
}

#cc-settings-panel {
  background: var(--ink-900) !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
  padding: 1.1rem 1.4rem !important;
}

.cc-settings-inner {
  max-width: 1240px !important;
  margin: 0 auto !important;
}

.cc-settings-header strong {
  display: block !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: .3rem !important;
}

.cc-settings-header p {
  font-size: 1.25rem !important;
  color: rgba(255,255,255,.65) !important;
  margin: 0 0 1rem !important;
  line-height: 1.5 !important;
}

.cc-categories {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  margin-bottom: 1rem !important;
}

.cc-category {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: var(--r-md) !important;
  padding: 10px 14px !important;
}

.cc-category-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 4px !important;
}

.cc-category-name {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: #fff !important;
}

.cc-category-desc {
  font-size: 1.25rem !important;
  color: rgba(255,255,255,.55) !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}

.cc-always-on {
  font-size: 1.25rem !important;
  color: var(--gold-400) !important;
  font-weight: 600 !important;
}

.cc-toggle {
  position: relative !important;
  display: inline-block !important;
  width: 36px !important;
  height: 20px !important;
  flex-shrink: 0 !important;
  cursor: pointer !important;
}

.cc-toggle input {
  opacity: 0 !important;
  width: 100% !important;
  height: 100% !important;
  inset: 0 !important;
  position: absolute !important;
  margin: 0 !important;
  cursor: pointer !important;
  z-index: 2 !important;
}

.cc-toggle-slider {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(255,255,255,.14) !important;
  border-radius: 20px !important;
  transition: background .2s !important;
  pointer-events: none !important;
}

.cc-toggle-slider::before {
  content: '' !important;
  position: absolute !important;
  width: 14px !important;
  height: 14px !important;
  left: 3px !important;
  top: 3px !important;
  background: #fff !important;
  border-radius: 50% !important;
  transition: transform .2s !important;
}

.cc-toggle input:checked + .cc-toggle-slider {
  background: var(--emerald-600) !important;
}

.cc-toggle input:checked + .cc-toggle-slider::before {
  transform: translateX(16px) !important;
}

.cc-settings-actions {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  padding-top: 8px !important;
}

.cc-bar-inner {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px 24px !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 14px 28px !important;
}

.cc-bar-text {
  flex: 1 1 260px !important;
}

.cc-bar-text strong {
  display: block !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: 2px !important;
}

.cc-bar-text span {
  font-size: 1.25rem !important;
  color: rgba(255,255,255,.65) !important;
  line-height: 1.5 !important;
}

.cc-privacy-link {
  color: var(--gold-400) !important;
  text-decoration: underline !important;
}

.cc-bar-actions {
  display: flex !important;
  flex-shrink: 0 !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.cc-btn {
  padding: 8px 18px !important;
  border: 1px solid transparent !important;
  border-radius: var(--r-sm) !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all var(--ease) !important;
  line-height: 1.4 !important;
  font-family: var(--font) !important;
  float: none !important;
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
}

.cc-btn:hover {
  opacity: .86 !important;
  transform: none !important;
}

.cc-btn-accept {
  background: linear-gradient(135deg, var(--emerald-500), var(--emerald-700)) !important;
  color: #fff !important;
  border-color: var(--emerald-600) !important;
}

.cc-btn-necessary {
  background: transparent !important;
  color: rgba(255,255,255,.75) !important;
  border-color: rgba(255,255,255,.25) !important;
}

.cc-btn-settings {
  background: transparent !important;
  color: rgba(255,255,255,.50) !important;
  border-color: transparent !important;
  text-decoration: underline !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   UTILITY CLASSES — small one-off overrides used directly in markup,
   in place of inline style="" attributes.
   ═══════════════════════════════════════════════════════════════════ */

.bg-none {
  background: none;
}

.required-mark {
  color: #c0392b;
}

/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════════ */

@media (max-width: 1100px) {
  .kol-5 { width: 130px !important; }
  .kol-4 { width: 110px !important; }
  .kol-1 { width: 130px !important; }
  .logo_firmy { width: 140px !important; }

  .hero-frame { padding: 84px 24px 48px !important; grid-template-columns: 1fr !important; }
  .hero-stats { grid-column: 1 !important; grid-row: 5 !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 32px !important; padding: 10px 24px !important; }
  .hero-stat { flex: 1 1 140px !important; padding: 14px 10px !important; }
  .hero-stat:not(:last-child)::after { top: 8px !important; bottom: 8px !important; right: 0 !important; left: auto !important; width: 1px !important; height: auto !important; }

  .offers-podium { grid-template-columns: 1fr 1fr !important; }
  .offers-podium .rzedy-porownaj:first-child { grid-column: 1 / -1 !important; }

  .footer-grid { grid-template-columns: 1fr 1fr 1fr !important; }
  .footer-col:first-child { grid-column: 1 / -1 !important; }
  .footer-col:first-child::after { display: none !important; }
}

@media (max-width: 880px) {
  .hero-inner { margin-top: 20px !important; border-radius: var(--r-lg) !important; }
  .hero-inner .hero-container { padding: 40px 24px !important; flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; }
  .hero-inner::before { font-size: 7rem !important; opacity: .05 !important; right: -10px !important; }

  .editorial-grid { grid-template-columns: 1fr !important; }
  .editorial-card:first-child { border-right: none !important; border-bottom: 1px solid var(--bdr) !important; }
  .offers-podium { grid-template-columns: 1fr !important; }
  .offers-podium .rzedy-porownaj:first-child { grid-column: auto !important; }

  .page-toc ol, .page-toc ul { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important; }

  /* Cards: stack columns vertically */
  .rzedy-porownaj { flex-direction: column !important; min-height: auto !important; }
  .rzad { flex-direction: column !important; align-items: stretch !important; min-height: auto !important; }

  .rank_position {
    width: 100% !important;
    min-height: 44px !important;
    height: 44px !important;
    flex-direction: row !important;
    border-right: none !important;
    border-bottom: 1px solid var(--bdr) !important;
    font-size: 1.25rem !important;
    justify-content: center !important;
  }

  .offer-position-1 .rank_position,
  .offer-position-2 .rank_position,
  .offer-position-3 .rank_position {
    min-height: 32px !important;
    height: 17px !important;
  }

  .logo_firmy {
    width: 100% !important;
    min-height: 80px !important;
    border-right: none !important;
    border-bottom: 1px solid var(--bdr) !important;
  }

  .kol-1 {
    width: 100% !important;
    min-height: auto !important;
    padding: 16px 20px !important;
    border-right: none !important;
    border-bottom: 1px solid var(--bdr) !important;
  }

  .kol-3 {
    border-right: none !important;
    border-bottom: 1px solid var(--bdr) !important;
    min-height: auto !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
  }

  .kol-4 {
    width: 100% !important;
    min-height: auto !important;
    border-right: none !important;
    border-bottom: 1px solid var(--bdr) !important;
    flex-direction: row !important;
    gap: 12px !important;
    padding: 12px 20px !important;
  }

  .kol-4 > span { margin-left: 0 !important; }

  .kol-5 { width: 100% !important; min-height: auto !important; }

  .offers-list .rank_position,
  .offers-list .logo_firmy,
  .offers-list .kol-1,
  .offers-list .kol-4,
  .offers-list .kol-5 {
    width: 100% !important;
    min-height: auto !important;
  }

  .dopasowana-badge { right: auto !important; left: 70px !important; top: 12px !important; }

  .footer-grid { grid-template-columns: 1fr 1fr !important; }
  .footer-col:first-child { grid-column: 1 / -1 !important; }
  .footer-col::after { display: none !important; }
  .footer-col { border-bottom: 1px solid rgba(255,255,255,.07) !important; }
}

@media (max-width: 600px) {
  .hero-frame { padding: 64px 20px 36px !important; }
  .hero h1 { font-size: 2rem !important; max-width: none !important; }
  .hero-lede { font-size: 1.5rem !important; }
  .hero-stats { flex-direction: column !important; gap: 4px !important; }
  .hero-stat:not(:last-child)::after { left: 0 !important; right: 0 !important; bottom: 0 !important; top: auto !important; width: auto !important; height: 1px !important; }

  #szybkie--pozyczki { font-size: 1.4rem !important; }

  .page-toc ol, .page-toc ul { grid-template-columns: 1fr !important; }

  .footer-top-strip .footer-nav-row { padding: 14px 20px !important; }
  .footer-grid { grid-template-columns: 1fr !important; }
  .footer-col:first-child { grid-column: auto !important; }
  .footer-col { padding: 32px 24px 28px !important; }
  .footer-col::after { display: none !important; }
  .footer-col { border-bottom: 1px solid rgba(255,255,255,.07) !important; }
  .footer-col:last-child { border-bottom: none !important; }

  #site-footer .section-inner { flex-direction: column !important; gap: 10px !important; text-align: center !important; }
  .to-the-top-long  { display: none !important; }
  .to-the-top-short { display: inline !important; }

  .cc-bar-actions { width: 100% !important; }
  .cc-btn { flex: 1 1 0 !important; justify-content: center !important; }
  .cc-settings-actions { flex-direction: column !important; }
  .cc-settings-actions .cc-btn { width: 100% !important; }

  .section-inner, .thin { padding-left: 16px !important; padding-right: 16px !important; }
}

@media (max-width: 420px) {
  .dopasowana-badge { display: none !important; }
}