{"id":1171,"date":"2026-01-14T02:21:38","date_gmt":"2026-01-14T01:21:38","guid":{"rendered":"https:\/\/foodfixyou.eu\/?page_id=1171"},"modified":"2026-01-14T02:24:43","modified_gmt":"2026-01-14T01:24:43","slug":"test","status":"publish","type":"page","link":"https:\/\/foodfixyou.eu\/nl\/test\/","title":{"rendered":"test"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"1171\" class=\"elementor elementor-1171\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9dd6b56 e-flex e-con-boxed e-con e-parent\" data-id=\"9dd6b56\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d7b6d80 elementor-widget elementor-widget-html\" data-id=\"d7b6d80\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- === PROWIZJE \/ PLAN KARIERY === -->\r\n<div id=\"career-plan-widget\" class=\"cpw\">\r\n  <div class=\"cpw__head\">\r\n  \r\n    <div class=\"cpw__legend\">\r\n      <span class=\"dot dot--pt\"><\/span> PT (drempel)\r\n      <span class=\"dot dot--income\"><\/span> Gemiddeld inkomen\r\n      <span class=\"dot dot--percent\"><\/span> % commissie\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"cpw__chart\" role=\"img\" aria-label=\"Carri\u00e8re- en commissieschema\"><\/div>\r\n\r\n  <div class=\"cpw__table-wrap\">\r\n    <table class=\"cpw__table\" aria-label=\"Carri\u00e8replan tabel\">\r\n      <thead>\r\n        <tr>\r\n          <th>Niveau<\/th>\r\n          <th>PT (drempel)<\/th>\r\n          <th>Commissie<\/th>\r\n          <th>Gemiddeld inkomen\/maand<\/th>\r\n        <\/tr>\r\n      <\/thead>\r\n      <tbody><\/tbody>\r\n    <\/table>\r\n  <\/div>\r\n<\/div>\r\n<!-- Font Montserrat -->\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n  \/* ====== USTAWIENIA (kolory\/spacing) ====== *\/\r\n  .cpw{\r\n    --bg:#ffffff; --text:#0a0706; --muted:#8a8a8a;\r\n    --bar:#000000; --barLite:#111111; --accent:#0a0706;\r\n    --radius:16px; --gap:16px; --shadow:0 12px 24px rgba(0,0,0,.08);\r\n    color:var(--text); background:var(--bg);\r\n    font-family:'Montserrat', sans-serif;\r\n\r\n  }\r\n  .cpw *{ box-sizing:border-box; }\r\n\r\n  .cpw__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; }\r\n  .cpw__title{ margin:0; font-size:clamp(18px,2vw,24px); font-weight:700; letter-spacing:.2px; }\r\n  .cpw__legend{ display:flex; gap:14px; font-size:12px; color:var(--muted); flex-wrap:wrap; }\r\n  .dot{ display:inline-flex; align-items:center; gap:6px; }\r\n  .dot::before{ content:\"\"; width:10px; height:10px; border-radius:50%; display:inline-block; background:var(--bar); }\r\n  .dot--income::before{ background:linear-gradient(180deg,var(--accent),var(--bar)); }\r\n  .dot--percent::before{ background:transparent; border:2px solid var(--accent); }\r\n\r\n  \/* ====== CHART ====== *\/\r\n  .cpw__chart{\r\n    display:grid;\r\n    grid-template-columns:repeat(10, minmax(56px, 1fr));\r\n    gap:var(--gap);\r\n    padding:18px;\r\n    border:1px solid #eaeaea; border-radius:var(--radius);\r\n    box-shadow:var(--shadow);\r\n    overflow-x:auto;\r\n    position:relative; \/* HINT: kotwica dla ::after *\/\r\n  }\r\n\r\n  \/* HINT: pigu\u0142ka \u201e\u2190 przewi\u0144 \u2192\u201d *\/\r\n  .cpw__chart::after{\r\n    content:\"\u2190 przewi\u0144 \u2192\";\r\n    position:absolute;\r\n    left:50%; bottom:8px; transform:translateX(-50%);\r\n    background:#000; color:#fff; font-size:12px; line-height:1;\r\n    padding:8px 12px; border-radius:999px;\r\n    box-shadow:0 6px 16px rgba(0,0,0,.25);\r\n    pointer-events:none; opacity:.9;\r\n    transition:opacity .4s ease, transform .4s ease;\r\n    animation:cpw-bob 2.2s ease-in-out infinite;\r\n  }\r\n  .cpw__chart.scrolled::after{ opacity:0; transform:translateX(-50%) translateY(6px); }\r\n  @keyframes cpw-bob{ 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(-3px)} }\r\n\r\n  .cpw__bar{\r\n    display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:8px;\r\n    min-height:220px;\r\n  }\r\n  .cpw__bar-col{ position:relative; width:100%; background:var(--barLite); border-radius:14px; overflow:hidden; }\r\n  .cpw__bar-fill{ position:absolute; left:0; right:0; bottom:0; height:0%; background:var(--bar); transition:height .9s cubic-bezier(.2,.7,.2,1); }\r\n  .cpw__bar-income{\r\n    position:absolute; left:6px; right:6px; bottom:0; height:0%;\r\n    background:linear-gradient(180deg, rgba(10,7,6,.2), rgba(10,7,6,.9));\r\n    border:1px solid rgba(10,7,6,.35); border-bottom:none;\r\n    border-top-left-radius:12px; border-top-right-radius:12px; mix-blend-mode:normal;\r\n    transition:height .9s .05s cubic-bezier(.2,.7,.2,1);\r\n  }\r\n  .cpw__cap{ position:absolute; top:-10px; right:0; transform:translateY(-100%); background:var(--accent); color:#fff; padding:3px 6px; border-radius:10px; font-size:11px; line-height:1; white-space:nowrap; }\r\n  .cpw__label{ text-align:center; font-size:12px; line-height:1.2; }\r\n  .cpw__label b{ display:block; font-size:12px; margin-bottom:4px; }\r\n  .cpw__pt {\r\n  margin-top: 6px;\r\n  font-size: 12px;\r\n  font-weight: 500;\r\n  color: var(--accent);\r\n  text-align: center;\r\n  white-space: nowrap;\r\n}\r\n\r\n  .cpw__percent{ position:absolute; left:6px; top:6px; font-size:11px; color:var(--accent); padding:2px 6px; border:1px solid var(--accent); border-radius:999px; background:#fff; }\r\n\r\n  \/* ====== TABELA ====== *\/\r\n  .cpw__table-wrap{ margin-top:16px; border:1px solid #eaeaea; border-radius:var(--radius); overflow:hidden; }\r\n  .cpw__table{ width:100%; border-collapse:separate; border-spacing:0; font-size:14px; }\r\n  .cpw__table thead th{ text-align:left; padding:12px 14px; background:#111; color:#fff; font-weight:600; }\r\n  .cpw__table tbody td{ padding:12px 14px; border-top:1px solid #efefef; }\r\n  .cpw__table tbody tr:nth-child(even) td{ background:#fafafa; }\r\n\r\n  \/* ====== TOOLTIP ====== *\/\r\n  .cpw__tooltip{\r\n    position:absolute; left:50%; transform:translateX(-50%) translateY(-8px);\r\n    bottom:100%; background:#000; color:#fff; padding:8px 10px; border-radius:10px;\r\n    font-size:12px; white-space:nowrap; opacity:0; pointer-events:none; transition:.2s;\r\n  }\r\n  .cpw__bar:hover .cpw__tooltip{ opacity:1; transform:translateX(-50%) translateY(-12px); }\r\n\r\n  \/* ====== RESPONSYWNO\u015a\u0106 ====== *\/\r\n  @media (max-width:900px){ .cpw__chart{ grid-template-columns:repeat(10, minmax(56px, 1fr)); } }\r\n  @media (max-width:640px){\r\n    .cpw__legend{ font-size:11px; }\r\n    .cpw__label{ font-size:11px; }\r\n    .cpw__pt {\r\n  position:absolute;\r\n  bottom:6px;\r\n  left:35%;\r\n  transform:translateX(-50%);\r\n  color:#fff;\r\n  font-size:11px;\r\n  opacity:.9;\r\n  text-align:center;\r\n  white-space:nowrap;\r\n}\r\n    .cpw__chart{ padding:14px; gap:12px; }\r\n  }\r\n  \r\n  \/* PT nad nazw\u0105 \u2013 zawsze widoczny, te\u017c na mobile *\/\r\n.cpw .cpw__pt{\r\n  position: static !important;   \/* nadpisuje wcze\u015bniejsze absolute *\/\r\n  display: block !important;\r\n  margin-top: 6px;\r\n  font-size: 12px;\r\n  font-weight: 500;\r\n  color: var(--accent);\r\n  text-align: center;\r\n  white-space: nowrap;\r\n  z-index: 2;\r\n}\r\n\r\n\/* troch\u0119 wi\u0119cej miejsca na bardzo w\u0105skich ekranach *\/\r\n@media (max-width: 640px){\r\n  .cpw .cpw__pt{ font-size: 11px; margin-top: 4px; }\r\n}\r\n\/* === mobile: pokazuj 3\u20134 s\u0142upki i przewijaj w bok === *\/\r\n@media (max-width: 768px){\r\n  \/* zwi\u0119kszamy minimaln\u0105 szeroko\u015b\u0107 kolumn, \u017ceby nie \u015bciska\u0107 PT i nazw *\/\r\n  .cpw .cpw__chart{\r\n    grid-template-columns: repeat(10, minmax(120px, 1fr)); \/* ~3\u20134 kolumny na ekran *\/\r\n    gap: 14px;\r\n  }\r\n  .cpw .cpw__bar{ min-width: 120px; } \/* bezpiecze\u0144stwo przy iOS *\/\r\n  \/* PT nad nazw\u0105 \u2013 pewne wy\u015brodkowanie i brak \u0142amania *\/\r\n  .cpw .cpw__pt{\r\n    position: static !important;\r\n    display: block !important;\r\n    margin-top: 6px;\r\n    font-size: 12px;\r\n    font-weight: 500;\r\n    color: var(--accent);\r\n    text-align: center;\r\n    white-space: nowrap;\r\n    z-index: 2;\r\n  }\r\n  \/* podpisy \u2013 ciut mniejsze, by \u0142adniej si\u0119 mie\u015bci\u0142y *\/\r\n  .cpw .cpw__label{ font-size: 11px; }\r\n}\r\n\r\n\/* bardzo w\u0105skie telefony *\/\r\n\/* === mobile: widoczne 3\u20134 s\u0142upki, reszta przewijana === *\/\r\n@media (max-width: 768px){\r\n  .cpw .cpw__chart{\r\n    grid-template-columns: repeat(10, minmax(90px, 1fr)); \/* 3\u20134 kolumny naraz *\/\r\n    gap: 12px;\r\n  }\r\n  .cpw .cpw__bar{ min-width: 90px; }\r\n\r\n  .cpw .cpw__pt{\r\n    position: static !important;\r\n    display: block !important;\r\n    margin-top: 6px;\r\n    font-size: 11px;\r\n    font-weight: 500;\r\n    color: var(--accent);\r\n    text-align: center;\r\n    white-space: nowrap;\r\n    z-index: 2;\r\n  }\r\n  .cpw .cpw__label{ font-size: 11px; }\r\n}\r\n\r\n\/* === mobile: widoczne 3\u20134 s\u0142upki, reszta przewijana === *\/\r\n@media (max-width: 768px){\r\n  .cpw .cpw__chart{\r\n    grid-template-columns: repeat(10, minmax(90px, 1fr)); \/* 3\u20134 kolumny naraz *\/\r\n    gap: 12px;\r\n  }\r\n  .cpw .cpw__bar{ min-width: 90px; }\r\n\r\n  .cpw .cpw__pt{\r\n    position: static !important;\r\n    display: block !important;\r\n    margin-top: 6px;\r\n    font-size: 11px;\r\n    font-weight: 500;\r\n    color: var(--accent);\r\n    text-align: center;\r\n    white-space: nowrap;\r\n    z-index: 2;\r\n  }\r\n  .cpw .cpw__label{ font-size: 11px; }\r\n}\r\n\r\n\/* bardzo w\u0105skie telefony *\/\r\n@media (max-width: 420px){\r\n  .cpw .cpw__chart{\r\n    grid-template-columns: repeat(10, minmax(80px, 1fr)); \/* ~3 s\u0142upki *\/\r\n    gap: 10px;\r\n  }\r\n  .cpw .cpw__bar{ min-width: 80px; }\r\n}\r\n\r\n\/* PT dok\u0142adnie nad nazw\u0105 poziomu *\/\r\n.cpw .cpw__bar {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: flex-end;\r\n}\r\n\r\n\/* wy\u015brodkowanie PT + nazwy *\/\r\n.cpw .cpw__pt {\r\n  order: 2;\r\n  margin-top: 6px;\r\n  margin-bottom: 2px;\r\n  font-size: 12px;\r\n  font-weight: 500;\r\n  color: var(--accent);\r\n  text-align: center;\r\n  white-space: nowrap;\r\n}\r\n\r\n.cpw .cpw__label {\r\n  order: 3;\r\n  font-size: 12px;\r\n  line-height: 1.2;\r\n  text-align: center;\r\n}\r\n\r\n\/* troch\u0119 cia\u015bniej na telefonach *\/\r\n@media (max-width: 640px) {\r\n  .cpw .cpw__pt {\r\n    font-size: 11px;\r\n    margin-top: 4px;\r\n    margin-bottom: 1px;\r\n  }\r\n  .cpw .cpw__label {\r\n    font-size: 11px;\r\n  }\r\n}\r\n\/* PT w \u015brodku s\u0142upka \u2013 wycentrowane na dole *\/\r\n.cpw .cpw__pt{\r\n  position:absolute !important;\r\n  left:50% !important;\r\n  bottom:6px !important;\r\n  transform:translateX(-50%) !important;\r\n  margin:0 !important;\r\n  padding:0 !important;\r\n  width:auto !important;\r\n  white-space:nowrap !important;\r\n  text-align:center !important;\r\n  color:#fff !important;\r\n  font-size:11px !important;\r\n  font-weight:500 !important;\r\n  line-height:1.2 !important;\r\n}\r\n\r\n\/* Pozwala przewija\u0107 tabelk\u0119 w bok nawet je\u015bli body ma overflow-x:hidden *\/\r\n.cpw__table-wrap {\r\n  position: relative;\r\n  overflow-x: auto !important;   \/* wymuszamy lokalne przewijanie *\/\r\n  -webkit-overflow-scrolling: touch; \/* p\u0142ynne scrollowanie na iOS *\/\r\n  max-width: 100vw;              \/* nie wyje\u017cd\u017ca poza ekran *\/\r\n}\r\n\r\n\/* Wewn\u0105trz tabeli \u2014 zabezpieczenie przed ucink\u0105 *\/\r\n.cpw__table {\r\n  min-width: 600px;              \/* szeroko\u015b\u0107 minimalna dla scrolla *\/\r\n  display: block;\r\n}\r\n\/* Kontener tabeli: lokalny poziomy scroll (zostaje) *\/\r\n.cpw__table-wrap{\r\n  position: relative;\r\n  overflow-x: auto !important;\r\n  -webkit-overflow-scrolling: touch;\r\n}\r\n\r\n\/* TABELA \u2013 desktop: pe\u0142na szeroko\u015b\u0107 (usu\u0144 display:block, kt\u00f3ry zaw\u0119\u017ca\u0142) *\/\r\n.cpw__table{\r\n  width: 100% !important;\r\n  min-width: 0;               \/* \u017cadnego wymuszania szeroko\u015bci na desktopie *\/\r\n  display: table !important;  \/* wracamy do normalnej tabeli *\/\r\n  table-layout: fixed;        \/* kolumny r\u00f3wnomierne, bez \u201ezje\u017cd\u017cania\u201d *\/\r\n}\r\n\r\n\/* Nag\u0142\u00f3wki\/kom\u00f3rki \u2013 nie zawijaj zbyt agresywnie *\/\r\n.cpw__table th, .cpw__table td{\r\n  white-space: nowrap;\r\n}\r\n\r\n\/* MOBILE: dopiero tutaj wymuszamy min-width, aby pojawi\u0142 si\u0119 scroll w bok *\/\r\n@media (max-width: 768px){\r\n  .cpw__table{\r\n    min-width: 700px;   \/* mo\u017cesz podnie\u015b\u0107\/obni\u017cy\u0107 wg uznania *\/\r\n  }\r\n}\r\n@media (max-width: 420px){\r\n  .cpw__table{\r\n    min-width: 620px;\r\n  }\r\n}\/* Naprawa: procent zawsze nad overlayem i wype\u0142nieniem *\/\r\n.cpw .cpw__bar-col { position: relative; }\r\n.cpw .cpw__bar-fill { z-index: 1; }\r\n.cpw .cpw__bar-income { z-index: 2; }\r\n.cpw .cpw__percent { z-index: 4; position: absolute; } \/* nad wszystkim *\/\r\n.cpw .cpw__cap { z-index: 5; } \/* etykieta dochodu te\u017c nad overlayem *\/\r\n\/* ===== WSZYSTKIE S\u0141UPKI W JEDNYM RZ\u0118DZIE \u2013 R\u00d3WNA SZEROKO\u015a\u0106 ===== *\/\r\n.cpw .cpw__chart{\r\n  display: flex !important;\r\n  flex-wrap: nowrap !important;\r\n  overflow-x: auto !important;\r\n  overflow-y: hidden !important;\r\n  gap: 16px !important;\r\n  padding-bottom: 12px !important;\r\n  scroll-behavior: smooth;\r\n}\r\n\r\n.cpw .cpw__bar{\r\n  flex: 0 0 120px !important;   \/* sta\u0142a szeroko\u015b\u0107 *\/\r\n  min-width: 120px !important;\r\n  max-width: 120px !important;\r\n}\r\n\r\n\/* scroll na iOS *\/\r\n.cpw .cpw__chart::-webkit-scrollbar{\r\n  height: 8px;\r\n}\r\n.cpw .cpw__chart::-webkit-scrollbar-thumb{\r\n  background:#aaa;\r\n  border-radius: 4px;\r\n}\r\n\r\n\/* TELEFONY \u2013 minimalnie w\u0119\u017csze s\u0142upki *\/\r\n@media (max-width: 768px){\r\n  .cpw .cpw__bar{\r\n    flex: 0 0 100px !important;\r\n    min-width: 100px !important;\r\n    max-width: 100px !important;\r\n  }\r\n}\r\n@media (max-width: 420px){\r\n  .cpw .cpw__bar{\r\n    flex: 0 0 90px !important;\r\n    min-width: 90px !important;\r\n    max-width: 90px !important;\r\n  }\r\n}\r\n\r\n\/* Sta\u0142a wysoko\u015b\u0107 klocka + label nie wp\u0142ywa na wysoko\u015b\u0107 *\/\r\n.cpw .cpw__chart{\r\n  padding-bottom: 44px !important;   \/* miejsce na podpisy pod s\u0142upkiem *\/\r\n}\r\n\r\n.cpw .cpw__bar{\r\n  position: relative;\r\n  height: 260px !important;          \/* sta\u0142a wysoko\u015b\u0107 \u201eklocka\u201d *\/\r\n  flex: 0 0 120px !important;        \/* z Twojego setupu *\/\r\n  min-width: 120px !important;\r\n  max-width: 120px !important;\r\n}\r\n\r\n.cpw .cpw__bar-col{\r\n  height: 220px !important;          \/* czarna cz\u0119\u015b\u0107 jak wcze\u015bniej *\/\r\n}\r\n\r\n\/* podpis przenosimy \u201ena zewn\u0105trz\u201d klocka, na sam d\u00f3\u0142 *\/\r\n.cpw .cpw__label{\r\n  position: absolute !important;\r\n  left: 50% !important;\r\n  bottom: -30px !important;          \/* poni\u017cej klocka *\/\r\n  transform: translateX(-50%) !important;\r\n  width: 100% !important;\r\n  text-align: center !important;\r\n  line-height: 1.15 !important;\r\n  white-space: normal !important;    \/* mo\u017ce si\u0119 \u0142ama\u0107 na 2 linie *\/\r\n  pointer-events: none;              \/* nie \u0142apie przypadkowych klik\u00f3w *\/\r\n  font-size: 12px;                   \/* Twoje dotychczasowe *\/\r\n  font-weight: 700;\r\n}\r\n\r\n\/* mobile \u2013 troche cia\u015bniej, dalej r\u00f3wna wysoko\u015b\u0107 klock\u00f3w *\/\r\n@media (max-width: 768px){\r\n  .cpw .cpw__bar{\r\n    height: 240px !important;\r\n    flex: 0 0 100px !important;\r\n    min-width: 100px !important;\r\n    max-width: 100px !important;\r\n  }\r\n  .cpw .cpw__bar-col{ height: 205px !important; }\r\n  .cpw .cpw__label{ bottom: -28px !important; font-size: 11px !important; }\r\n  .cpw .cpw__chart{ padding-bottom: 42px !important; }\r\n}\r\n\r\n@media (max-width: 420px){\r\n  .cpw .cpw__bar{\r\n    height: 230px !important;\r\n    flex: 0 0 90px !important;\r\n    min-width: 90px !important;\r\n    max-width: 90px !important;\r\n  }\r\n  .cpw .cpw__bar-col{ height: 195px !important; }\r\n  .cpw .cpw__label{ bottom: -26px !important; }\r\n  .cpw .cpw__chart{ padding-bottom: 40px !important; }\r\n}\r\n\/* Wi\u0119cej miejsca pod s\u0142upkami na etykiety (2 linie) *\/\r\n.cpw .cpw__chart{\r\n  padding-bottom: 58px !important; \/* by\u0142o ~44px *\/\r\n}\r\n\r\n\/* Etykieta pod s\u0142upkiem \u2013 ni\u017cej i zawsze czytelna *\/\r\n.cpw .cpw__label{\r\n  bottom: -36px !important;        \/* by\u0142o -28\/-30px *\/\r\n  line-height: 1.2 !important;\r\n  white-space: normal !important;   \/* 2 linie OK *\/\r\n  max-width: 100% !important;\r\n  z-index: 3 !important;            \/* nad paskiem scrolla\/pt *\/\r\n}\r\n\r\n\/* Mobile \u2013 ciut cia\u015bniej, ale nadal bez styku *\/\r\n@media (max-width: 768px){\r\n  .cpw .cpw__chart{ padding-bottom: 54px !important; }\r\n  .cpw .cpw__label{ bottom: -34px !important; font-size: 11px !important; }\r\n}\r\n@media (max-width: 420px){\r\n  .cpw .cpw__chart{ padding-bottom: 52px !important; }\r\n  .cpw .cpw__label{ bottom: -32px !important; }\r\n}\r\n\r\n.cpw .cpw__bar-income{ display:none !important; }\r\n\r\n.cpw .cpw__bar-col{\r\n  transition: height .9s cubic-bezier(.2,.7,.2,1); \/* animacja wysoko\u015bci *\/\r\n}\r\n\r\n\r\n.cpw__bar-col {\r\n  position: relative;\r\n  width: 100%;\r\n  background: transparent !important; \/* by\u0142o var(--barLite) *\/\r\n  border-radius: 14px;\r\n  overflow: hidden;\r\n  border: 1px solid rgba(0, 0, 0, 0.1); \/* delikatny obrys, opcjonalnie *\/\r\n}\r\n\r\n\/* === WSKAZ\u00d3WKA \u201e\u2190 przewi\u0144 \u2192\u201d pod tabel\u0105 === *\/\r\n.cpw__table-wrap {\r\n  position: relative;\r\n}\r\n\r\n\/* domy\u015blnie ukryte na desktopie *\/\r\n.cpw__table-wrap::after {\r\n  content: \"\u2190 przewi\u0144 \u2192\";\r\n  position: absolute;\r\n  left: 50%;\r\n  bottom: 6px;\r\n  transform: translateX(-50%);\r\n  background: #000;\r\n  color: #fff;\r\n  font-size: 12px;\r\n  line-height: 1;\r\n  padding: 6px 10px;\r\n  border-radius: 999px;\r\n  box-shadow: 0 6px 16px rgba(0,0,0,.25);\r\n  opacity: 0;\r\n  pointer-events: none;\r\n  transition: opacity .4s ease, transform .4s ease;\r\n  animation: cpw-bob 2.2s ease-in-out infinite;\r\n}\r\n\r\n\/* pokazujemy tylko na mobile *\/\r\n@media (max-width: 768px) {\r\n  .cpw__table-wrap::after {\r\n    opacity: 0.9;\r\n  }\r\n  .cpw__table-wrap.scrolled::after {\r\n    opacity: 0;\r\n    transform: translateX(-50%) translateY(6px);\r\n  }\r\n}\r\n\r\n\/* animacja \u201epulsowania\u201d (ta sama co dla wykresu) *\/\r\n@keyframes cpw-bob {\r\n  0%,100% { transform: translateX(-50%) translateY(0); }\r\n  50%     { transform: translateX(-50%) translateY(-3px); }\r\n}\r\n\r\n\/* procent + doch\u00f3d w jednej pigu\u0142ce (2 linie) *\/\r\n.cpw .cpw__percent{\r\n  display:inline-flex;\r\n  flex-direction:column;\r\n  align-items:center;\r\n  justify-content:center;\r\n  line-height:1.05;\r\n  gap:2px;\r\n  padding:4px 6px;          \/* ciut wy\u017csza pigu\u0142ka *\/\r\n  text-align:center;\r\n}\r\n.cpw .cpw__mini-income{\r\n  font-size:10px;\r\n  font-weight:600;\r\n  white-space:nowrap;\r\n  color:var(--accent);\r\n  opacity:.95;\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n(function(){\r\n  \/\/ ===== KONFIGURACJA J\u0118ZYKA \/ WALUTY =====\r\n  const lang = (document.documentElement.lang || \"pl-PL\");\r\n  const currencyByLang = { \"pl\":\"PLN\",\"pl-PL\":\"PLN\",\"en\":\"EUR\",\"en-GB\":\"GBP\",\"en-US\":\"USD\",\"de\":\"EUR\",\"it\":\"EUR\",\"fr\":\"EUR\" };\r\n  const currency = currencyByLang[lang] || \"PLN\";\r\n  const nf = new Intl.NumberFormat(lang, { style:\"currency\", currency, maximumFractionDigits:0 });\r\n\r\n  \/\/ ===== DANE =====\r\nconst levels = [\r\n  { name:\"Partner\",          pt: 500,       percent: 4,    income: 220,     color:\"#E58A2A\" }, \/\/ pomara\u0144cz\r\n  { name:\"Junior Lider\",     pt: 1500,      percent: 8,    income: 900,     color:\"#18B4B4\" }, \/\/ turkus\r\n  { name:\"Senior Lider\",     pt: 3500,      percent: 12,   income: 1750,    color:\"#C055A4\" }, \/\/ fuksja\r\n  { name:\"Team Lider\",       pt: 7000,      percent: 16,   income: 3900,    color:\"#58B24E\" }, \/\/ ziele\u0144\r\n  { name:\"Ametyst\",          pt: 15000,     percent: 23,   income: 10080,   color:\"#6F3D91\" }, \/\/ ametyst\r\n  { name:\"Onyks\",            pt: 25000,     percent: 25,   income: 21000,   color:\"#6C6C6C\" }, \/\/ grafit\r\n  { name:\"Szafir\",           pt: 50000,     percent: 26,   income: 34650,   color:\"#2D6CDF\" }, \/\/ szafir (niebieski)\r\n  { name:\"Szmaragd\",         pt: 100000,    percent: 28,   income: 59130,   color:\"#35A86A\" }, \/\/ szmaragd\r\n  { name:\"Rubin\",            pt: 200000,    percent: 29.5, income: 88240,   color:\"#C73A3A\" }, \/\/ rubin\r\n  { name:\"Diament\",          pt: 400000,    percent: 30.5, income: 159210,  color:\"#41B8F5\" }, \/\/ diament (b\u0142\u0119kit)\r\n  \/\/ dalsze rangi bez koloru (zostanie kolor domy\u015blny strony)\r\n  { name:\"Manager\",          pt: 800000,    percent: 32.5, income: 250000 },\r\n  { name:\"Senior Manager\",   pt: 1600000,   percent: 33.5, income: 400000 },\r\n  { name:\"World Manager\",    pt: 3500000,   percent: 34,   income: 600000 },\r\n  { name:\"Top Manager\",      pt: 7000000,   percent: 34.5, income: 900000 },\r\n  { name:\"President\",        pt: 15000000,  percent: 35,   income: 1500000 },\r\n];\r\n\r\n\r\n\r\n  \/\/ ===== RYSOWANIE WYKRESU =====\r\n  const maxPT = Math.max(...levels.map(l=>l.pt));\r\n  \r\n  const maxPercent = Math.max(...levels.map(l => l.percent));\r\n\r\n  const maxIncome = Math.max(...levels.map(l=>l.income));\r\n  const chart = document.querySelector(\"#career-plan-widget .cpw__chart\");\r\n  const tbody = document.querySelector(\"#career-plan-widget .cpw__table tbody\");\r\n\r\n  levels.forEach(l=>{\r\n    const bar = document.createElement(\"div\");\r\n    bar.className = \"cpw__bar\";\r\nbar.innerHTML = `\r\n  <div class=\"cpw__bar-col\" aria-hidden=\"true\" style=\"height: 220px;\">\r\n<div class=\"cpw__percent\">\r\n  ${l.percent}%<br><span class=\"cpw__mini-income\">${nf.format(l.income)}<\/span>\r\n<\/div>\r\n\r\n    <div class=\"cpw__bar-fill\" style=\"height:0%\"><\/div>\r\n    <div class=\"cpw__bar-income\" style=\"height:0%\"><\/div>\r\n    <div class=\"cpw__cap\">${nf.format(l.income)}<\/div>\r\n    <div class=\"cpw__pt\">${l.pt.toLocaleString(lang)} PT<\/div>\r\n    <div class=\"cpw__tooltip\">\r\n      <strong>${l.name}<\/strong><br>\r\n      ${l.pt.toLocaleString(lang)} PT \u2022 ${l.percent}% \u2022 ${nf.format(l.income)}\r\n    <\/div>\r\n  <\/div>\r\n  <div class=\"cpw__label\"><b style=\"color:${l.color || 'inherit'}\">${l.name}<\/b><\/div>\r\n\r\n`;\r\n\r\n\r\n    chart.appendChild(bar);\r\n\r\n    requestAnimationFrame(()=>{\r\n       bar.querySelector(\".cpw__bar-fill\").style.height = (l.percent \/ maxPercent * 100) + \"%\";\r\n       \r\n      bar.querySelector(\".cpw__bar-income\").style.height = Math.max(8,(l.income\/maxIncome*100)) + \"%\";\r\n    });\r\n\r\n    const tr = document.createElement(\"tr\");\r\n    tr.innerHTML = `\r\n      <td><strong style=\"color:${l.color || 'inherit'}\">${l.name}<\/strong><\/td>\r\n\r\n      <td>${l.pt.toLocaleString(lang)} PT<\/td>\r\n      <td>${l.percent}%<\/td>\r\n      <td>${nf.format(l.income)}<\/td>\r\n    `;\r\n    tbody.appendChild(tr);\r\n  });\r\n\r\n  \/* HINT: ukryj pigu\u0142k\u0119 po przewini\u0119ciu \/ je\u015bli nie ma overflow *\/\r\n  chart.addEventListener('scroll', function(){\r\n    if (chart.scrollLeft > 8) chart.classList.add('scrolled');\r\n  });\r\n  function hideHintIfNoOverflow(){\r\n    if (chart.clientWidth >= chart.scrollWidth) chart.classList.add('scrolled');\r\n  }\r\n  hideHintIfNoOverflow();\r\n  window.addEventListener('resize', hideHintIfNoOverflow);\r\n})();\r\n\r\n\r\n(function(){\r\n  const tableWrap = document.querySelector('.cpw__table-wrap');\r\n  if (!tableWrap) return;\r\n\r\n  tableWrap.addEventListener('scroll', () => {\r\n    if (tableWrap.scrollLeft > 8) {\r\n      tableWrap.classList.add('scrolled');\r\n    }\r\n  });\r\n\r\n  function hideHintIfNoOverflow(){\r\n    if (tableWrap.clientWidth >= tableWrap.scrollWidth) {\r\n      tableWrap.classList.add('scrolled');\r\n    }\r\n  }\r\n  hideHintIfNoOverflow();\r\n  window.addEventListener('resize', hideHintIfNoOverflow);\r\n})();\r\n\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>PT (pr\u00f3g) \u015ar. doch\u00f3d Prowizja % Poziom PT (pr\u00f3g) Prowizja \u015aredni doch\u00f3d\/msc<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-1171","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/foodfixyou.eu\/nl\/wp-json\/wp\/v2\/pages\/1171","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/foodfixyou.eu\/nl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/foodfixyou.eu\/nl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/foodfixyou.eu\/nl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/foodfixyou.eu\/nl\/wp-json\/wp\/v2\/comments?post=1171"}],"version-history":[{"count":4,"href":"https:\/\/foodfixyou.eu\/nl\/wp-json\/wp\/v2\/pages\/1171\/revisions"}],"predecessor-version":[{"id":1175,"href":"https:\/\/foodfixyou.eu\/nl\/wp-json\/wp\/v2\/pages\/1171\/revisions\/1175"}],"wp:attachment":[{"href":"https:\/\/foodfixyou.eu\/nl\/wp-json\/wp\/v2\/media?parent=1171"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}