/* ===========================================================================
   Talent Quest — strona internetowa, wersja v3 B (warstwa wizualna).

   Teksty i kolejność sekcji są 1:1 z wersją v3 (dokument z 28.09.2026).
   Ten arkusz zmienia wyłącznie formę. Stoi na tokenach marki (tokens.css),
   krojach produktu (Bricolage Grotesque w nagłówkach, jak w aplikacjach
   i na certyfikacie; Inter w treści) i na kolorach kafli aplikacji z pulpitu.

   Zasady, które porządkują całość:
   - produkt jest ilustracją: raport, pulpit, certyfikat i Giełda zamiast
     zdjęć stockowych i wymyślonych grafik;
   - piktogramy to ikony Lucide — ta sama rodzina co w aplikacjach;
   - kolor niesie znaczenie: zieleń marki = działanie, limonka = dowód
     (wyróżnienia i znaczniki na raporcie), kolory aplikacji = narzędzia;
   - rytm: jasne sekcje przełamane jedną ciemną „sceną dowodu” na stronę.
   =========================================================================== */

.v3b {
  --ink: #0c0e0c;
  --ink-2: #323733;
  --ink-3: #5c635e;
  --ink-4: #666c67;      /* drobny tekst wyciszony: ≥ 4,5:1 na każdym jasnym tle */
  --ink-tail: #7a807b;   /* druga część dwutonowych nagłówków (duży tekst, ≥ 3:1) */
  --line: rgba(12, 30, 18, 0.09);
  --line-2: rgba(12, 30, 18, 0.15);
  --canvas: #f7f8f6;
  --paper: #ffffff;
  --mist: #eff2ef;
  --mint-25: #f3f9f4;
  --mint-50: #eaf4ed;
  --mint-100: #d6ead8;
  --mint-200: #b6d4ba;
  --forest-400: #65a275;
  --forest-500: #4c8a5e;
  --forest-600: #3c744a;
  --forest-700: #155e2c;
  --forest-800: #0f401e;
  --forest-900: #021509;
  --night: #05160c;
  --night-2: #0a2314;
  --night-line: rgba(214, 234, 216, 0.12);
  --lime: #c8ee7a;
  --lime-2: #b4e05c;
  --lime-soft: rgba(200, 238, 122, 0.16);
  --lavender: #c7bae8;
  --lavender-50: #f5f2fc;
  --peach: #f1c9be;
  --peach-50: #fdf4f1;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-2xl: 36px;
  --shadow-1: 0 1px 2px rgba(12, 30, 18, 0.05), 0 1px 1px rgba(12, 30, 18, 0.03);
  --shadow-2: 0 1px 2px rgba(12, 30, 18, 0.04), 0 12px 32px -14px rgba(12, 30, 18, 0.16);
  --shadow-3: 0 2px 6px rgba(12, 30, 18, 0.05), 0 34px 80px -28px rgba(12, 30, 18, 0.32);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --tq-app-mail-1: #367bf3; --tq-app-mail-2: #2563eb;
  --tq-app-chat-1: #2cc785; --tq-app-chat-2: #17a34b;
  --tq-app-ai-1: #9c77f7; --tq-app-ai-2: #7d3bed;
  --tq-app-browser-1: #1bc1dd; --tq-app-browser-2: #0891b2;
  --tq-app-erp-1: #7e8da1; --tq-app-erp-2: #475569;
  --tq-app-crm-1: #f2ab1c; --tq-app-crm-2: #d97807;
  --tq-app-files-1: #f6c454; --tq-app-files-2: #e39c17;
  --tq-app-kalendarz-1: #f4746a; --tq-app-kalendarz-2: #dc4436;
  --wrap: 1240px;
  --header-h: 68px;

  background: var(--canvas);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 16.5px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  scroll-padding-top: calc(var(--header-h) + 16px);
}
.v3b ::selection { background: var(--lime); color: var(--forest-900); }
.v3b img, .v3b svg { max-width: 100%; }
:where(.v3b) a { color: inherit; text-decoration: none; }
.v3b :focus-visible { outline: 2px solid var(--forest-600); outline-offset: 3px; border-radius: 6px; }
.b-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

/* --- Siatka i sekcje ------------------------------------------------------- */
.b-wrap { max-width: var(--wrap); margin-inline: auto; padding-inline: clamp(20px, 4vw, 40px); }
.b-sec { position: relative; padding-block: clamp(84px, 10vw, 140px); }
.b-sec--tight { padding-block: clamp(56px, 7vw, 96px); }
.b-sec--paper { background: var(--paper); }
.b-sec--mist { background: var(--mist); }
.b-sec--tint {
  background:
    radial-gradient(60% 80% at 0% 0%, rgba(182, 212, 186, 0.45), transparent 60%),
    radial-gradient(50% 70% at 100% 100%, rgba(199, 186, 232, 0.30), transparent 60%),
    var(--mint-25);
}
.b-sec--warm {
  background:
    radial-gradient(55% 75% at 100% 0%, rgba(241, 201, 190, 0.45), transparent 60%),
    radial-gradient(50% 70% at 0% 100%, rgba(199, 186, 232, 0.35), transparent 60%),
    var(--peach-50);
}
.b-sec--night {
  background:
    radial-gradient(50% 55% at 18% 0%, rgba(76, 138, 94, 0.30), transparent 70%),
    radial-gradient(45% 50% at 100% 100%, rgba(200, 238, 122, 0.10), transparent 70%),
    var(--night);
  color: #e9f1ea;
  overflow: clip; /* nie „hidden”: to zatrzymywało przyklejoną scenę pokazu w tej sekcji */
}
/* Delikatna siatka linii na ciemnej scenie — jak papier milimetrowy raportu. */
.b-sec--night::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(var(--night-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--night-line) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, #000 20%, transparent 75%);
  opacity: 0.55;
}
.b-sec > .b-wrap { position: relative; }

/* Kropki w tle hero i scen — wygaszone ku brzegom. */
.b-dots::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image: radial-gradient(rgba(12, 30, 18, 0.14) 1px, transparent 1.3px);
  background-size: 22px 22px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 25%, transparent 75%);
}

/* --- Typografia ------------------------------------------------------------ */
.b-display, .b-h1, .b-h2, .b-h3 {
  margin: 0; font-family: var(--font-display); font-weight: 600; color: inherit;
  text-wrap: balance; font-optical-sizing: auto;
}
.b-display { font-size: clamp(50px, 7.6vw, 104px); line-height: 0.96; letter-spacing: -0.038em; }
.b-h1 { font-size: clamp(40px, 5.1vw, 70px); line-height: 1.0; letter-spacing: -0.034em; }
.b-h2 { font-size: clamp(33px, 4.1vw, 56px); line-height: 1.04; letter-spacing: -0.03em; }
.b-h3 { font-size: clamp(21px, 1.8vw, 25px); line-height: 1.2; letter-spacing: -0.014em; }
.b-h2 .b-tail, .b-h1 .b-tail, .b-display .b-tail { color: var(--ink-tail); }
.b-sec--night .b-h2 .b-tail { color: var(--mint-200); }
.b-lead { margin: 0; font-size: clamp(18px, 1.45vw, 21px); line-height: 1.55; color: var(--ink-2); text-wrap: pretty; }
.b-body { margin: 0; font-size: 16.5px; line-height: 1.65; color: var(--ink-2); text-wrap: pretty; }
.b-small { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--ink-3); }
.b-strong { margin: 0; font-weight: 700; color: var(--ink); font-size: 17px; line-height: 1.5; }
.b-punch { margin: 0; font-family: var(--font-display); font-size: clamp(22px, 2vw, 28px); font-weight: 600; line-height: 1.2; letter-spacing: -0.018em; color: var(--forest-700); }
.b-muted { color: var(--ink-4); }
.b-sec--night .b-lead, .b-sec--night .b-body { color: rgba(233, 241, 234, 0.78); }
.b-sec--night .b-strong { color: #fff; }

/* Słowa pisane w dokumencie wielkimi literami to wyróżnienie — pokazujemy je
   markerem, zostawiając zapis bez zmian. */
.b-mark {
  background-image: linear-gradient(transparent 58%, var(--lime) 58%, var(--lime) 90%, transparent 90%);
  background-repeat: no-repeat; padding-inline: 0.06em; border-radius: 2px;
}
/* „(się)” w haśle — lżej i zielenią, jak dopowiedzenie na marginesie. */
.b-aside { font-weight: 300; color: var(--forest-600); letter-spacing: -0.02em; }

.b-eyebrow {
  display: inline-flex; align-items: center; gap: 9px; align-self: flex-start;
  padding: 6px 13px 6px 10px; border-radius: 999px;
  background: rgba(21, 94, 44, 0.08); color: var(--forest-700);
  font-size: 12.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.3;
}
.b-eyebrow::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%; flex: none;
  background: var(--forest-600); box-shadow: 0 0 0 3px rgba(60, 116, 74, 0.18);
}
.b-sec--night .b-eyebrow { background: var(--lime-soft); color: var(--lime); }
.b-sec--night .b-eyebrow::before { background: var(--lime); box-shadow: 0 0 0 3px rgba(200, 238, 122, 0.2); }

.b-head { display: flex; flex-direction: column; gap: 18px; max-width: 760px; margin-bottom: clamp(40px, 5vw, 64px); }
.b-head--center { align-items: center; text-align: center; margin-inline: auto; }
.b-head--center .b-eyebrow { align-self: center; }
.b-head--split {
  max-width: none; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 20px clamp(32px, 5vw, 80px); align-items: end;
}
.b-head--split > .b-head__side { display: flex; flex-direction: column; gap: 14px; }
@media (max-width: 900px) { .b-head--split { grid-template-columns: 1fr; } }

/* --- Przyciski i linki -------------------------------------------------------- */
/* `assets/styles.css` barwi KAŻDY link po najechaniu (`a:hover`) na ciemną zieleń — przyciski
   są linkami, więc każdy wariant ma kolor napisu ustawiony także w stanie :hover. */
.b-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 50px; padding: 0 24px; border-radius: 999px; border: 0;
  font: inherit; font-size: 15.5px; font-weight: 650; letter-spacing: -0.005em; line-height: 1.2;
  cursor: pointer; white-space: nowrap; text-align: center;
  transition: transform 0.2s var(--ease), box-shadow 0.2s var(--ease), background 0.2s ease, color 0.2s ease;
}
.b-btn--sm { min-height: 40px; padding: 0 18px; font-size: 14.5px; }
@media (max-width: 560px) { .b-btn { max-width: 100%; white-space: normal; padding-block: 12px; } .b-btn--lg { padding-inline: 24px; } }
.b-btn--lg { min-height: 56px; padding: 0 30px; font-size: 16.5px; }
.b-btn--primary {
  color: #fff;
  background: linear-gradient(180deg, #1c6d37 0%, #145a2a 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 1px 2px rgba(2, 21, 9, 0.22), 0 10px 22px -10px rgba(21, 94, 44, 0.65);
}
.b-btn--primary:hover { color: #fff; transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 2px 4px rgba(2, 21, 9, 0.2), 0 16px 30px -12px rgba(21, 94, 44, 0.7); }
.b-btn--ghost { color: var(--ink); background: #fff; box-shadow: inset 0 0 0 1px var(--line-2), var(--shadow-1); }
.b-btn--ghost:hover { color: var(--ink); transform: translateY(-1px); box-shadow: inset 0 0 0 1px rgba(21, 94, 44, 0.35), 0 10px 22px -12px rgba(12, 30, 18, 0.25); }
.b-btn--lime { color: var(--forest-900); background: var(--lime); box-shadow: 0 10px 26px -12px rgba(200, 238, 122, 0.7); }
.b-btn--lime:hover { color: var(--forest-900); transform: translateY(-1px); background: #d4f48f; }
.b-btn--white { color: var(--forest-800); background: #fff; }
.b-btn--white:hover { color: var(--forest-800); transform: translateY(-1px); }
.b-btn .b-arrow, .b-link .b-arrow { display: inline-block; transition: transform 0.2s var(--ease); }
.b-btn:hover .b-arrow, .b-link:hover .b-arrow, a:hover > .b-card .b-arrow { transform: translateX(3px); }
.b-link { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 650; color: var(--forest-700); }
.b-link:hover { color: var(--forest-800); }
.b-sec--night .b-link { color: var(--lime); }
.b-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.b-actions--center { justify-content: center; }

/* --- Kafle ikon (piktogramy) ---------------------------------------------------- */
.b-tile {
  flex: none; display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 13px;
  background: linear-gradient(160deg, #f2f9f3, #e2f0e5); color: var(--forest-700);
  box-shadow: inset 0 0 0 1px rgba(21, 94, 44, 0.12), 0 1px 2px rgba(12, 30, 18, 0.05);
}
.b-tile svg { width: 22px; height: 22px; }
.b-tile--sm { width: 32px; height: 32px; border-radius: 9px; }
.b-tile--sm svg { width: 16px; height: 16px; }
.b-tile--lg { width: 58px; height: 58px; border-radius: 16px; }
.b-tile--lg svg { width: 27px; height: 27px; }
.b-tile--app {
  color: #fff; background: linear-gradient(160deg, var(--g1) 0%, var(--g2) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.32), 0 6px 14px -6px var(--g2);
}
.b-tile--forest { color: var(--lime); background: linear-gradient(160deg, #1c6d37, #0f401e); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 8px 18px -8px rgba(15, 64, 30, 0.7); }
.b-tile--lav { color: #5b44a8; background: linear-gradient(160deg, #f5f2fc, #e6dff7); box-shadow: inset 0 0 0 1px rgba(91, 68, 168, 0.14); }
.b-tile--night { color: var(--lime); background: var(--lime-soft); box-shadow: inset 0 0 0 1px rgba(200, 238, 122, 0.22); }

/* Zestaw narzędzi stanowiska: kafle aplikacji jak w docku pulpitu. */
.b-tools { display: flex; gap: 6px; }
.b-tools .b-tile--app { width: 34px; height: 34px; border-radius: 10px; }
.b-tools .b-tile--app svg { width: 17px; height: 17px; }

/* --- Karty ---------------------------------------------------------------------- */
.b-card {
  position: relative; background: var(--paper); border-radius: var(--r-lg);
  border: 1px solid var(--line); box-shadow: var(--shadow-2); padding: clamp(22px, 2.2vw, 30px);
}
.b-card--lift { transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease), border-color 0.25s ease; }
.b-card--lift:hover { transform: translateY(-4px); box-shadow: var(--shadow-3); border-color: rgba(21, 94, 44, 0.18); }
.b-card h3 { margin: 0; }
.b-card p { margin: 0; }

/* --- Okno produktu i scena --------------------------------------------------------- */
.b-window { position: relative; background: var(--paper); border-radius: 16px; border: 1px solid var(--line); box-shadow: var(--shadow-3); overflow: hidden; }
.b-window__bar {
  display: flex; align-items: center; gap: 12px; min-height: 42px; padding: 0 14px;
  border-bottom: 1px solid var(--line); background: linear-gradient(180deg, #fcfdfc, #f4f6f4);
}
.b-window__dots { display: inline-flex; gap: 6px; flex: none; }
.b-window__dots i { width: 10px; height: 10px; border-radius: 50%; background: #dde2de; }
.b-window__dots i:nth-child(1) { background: #f2a3a0; }
.b-window__dots i:nth-child(2) { background: #f3d18a; }
.b-window__dots i:nth-child(3) { background: #a9d8a8; }
.b-window__title { font-size: 12.5px; font-weight: 600; color: var(--ink-3); }

.b-stage {
  position: relative; isolation: isolate; border-radius: var(--r-2xl);
  padding: clamp(18px, 3vw, 44px);
  background:
    radial-gradient(55% 60% at 12% 12%, rgba(199, 186, 232, 0.65), transparent 62%),
    radial-gradient(50% 55% at 92% 20%, rgba(241, 201, 190, 0.6), transparent 62%),
    radial-gradient(70% 65% at 50% 105%, rgba(182, 212, 186, 0.75), transparent 66%),
    #eef1ee;
  box-shadow: inset 0 0 0 1px rgba(12, 30, 18, 0.06);
}
.b-stage::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background-image: radial-gradient(rgba(12, 30, 18, 0.12) 1px, transparent 1.3px);
  background-size: 20px 20px;
  mask-image: radial-gradient(ellipse 75% 70% at 50% 45%, #000 20%, transparent 80%);
}
.b-stage--night {
  background:
    radial-gradient(55% 60% at 20% 10%, rgba(76, 138, 94, 0.45), transparent 65%),
    radial-gradient(50% 55% at 90% 90%, rgba(200, 238, 122, 0.14), transparent 65%),
    #0b2415;
  box-shadow: inset 0 0 0 1px rgba(214, 234, 216, 0.10);
}
.b-stage--night::before { background-image: radial-gradient(rgba(214, 234, 216, 0.14) 1px, transparent 1.3px); }

/* --- Nagłówek strony ------------------------------------------------------------ */
.b-header {
  position: sticky; top: 0; z-index: 50; height: var(--header-h);
  background: rgba(247, 248, 246, 0.72);
  backdrop-filter: saturate(1.6) blur(14px); -webkit-backdrop-filter: saturate(1.6) blur(14px);
  border-bottom: 1px solid transparent; transition: border-color 0.2s ease, background 0.2s ease;
}
.b-header.is-scrolled { border-bottom-color: var(--line); background: rgba(247, 248, 246, 0.86); }
.b-header__inner { height: 100%; display: flex; align-items: center; gap: 24px; }
.b-logo { display: inline-flex; align-items: center; flex: none; }
.b-logo img { display: block; width: auto; height: 30px; }
.b-nav { flex: 1; display: flex; justify-content: center; align-items: center; gap: 4px; }
.b-nav > a, .b-nav__dropbtn {
  display: inline-flex; align-items: center; gap: 4px; padding: 8px 12px; border-radius: 999px;
  border: 0; background: none; font: inherit; font-size: 14.5px; font-weight: 550; color: var(--ink-2);
  cursor: pointer; white-space: nowrap; transition: background 0.15s ease, color 0.15s ease;
}
.b-nav > a:hover, .b-nav__dropbtn:hover { background: rgba(12, 30, 18, 0.05); color: var(--ink); }
.b-nav > a[aria-current="page"] { color: var(--forest-700); background: rgba(21, 94, 44, 0.08); }
.b-nav__drop { position: relative; }
.b-nav__drop::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 12px; }
.b-nav__chev { width: 14px; height: 14px; transition: transform 0.18s ease; }
.b-nav__menu {
  position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%);
  min-width: 250px; padding: 8px; display: none; flex-direction: column; gap: 2px; z-index: 60;
  background: var(--paper); border-radius: 16px; border: 1px solid var(--line); box-shadow: var(--shadow-3);
}
.b-nav__drop:hover .b-nav__menu, .b-nav__drop:focus-within .b-nav__menu, .b-nav__drop.is-open .b-nav__menu { display: flex; }
.b-nav__drop:hover .b-nav__chev, .b-nav__drop.is-open .b-nav__chev { transform: rotate(180deg); }
.b-nav__menu a { display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 10px; font-size: 14.5px; font-weight: 550; color: var(--ink-2); }
.b-nav__menu a:hover, .b-nav__menu a:focus-visible { background: var(--mint-50); color: var(--ink); }
.b-nav__menu .b-tile { width: 32px; height: 32px; border-radius: 9px; }
.b-nav__menu .b-tile svg { width: 16px; height: 16px; }
.b-header__actions { display: flex; align-items: center; gap: 10px; flex: none; }
.b-burger {
  display: none; width: 42px; height: 42px; border-radius: 12px; border: 0; cursor: pointer;
  background: rgba(12, 30, 18, 0.05); color: var(--ink); place-items: center;
}
.b-burger svg { width: 20px; height: 20px; }
.b-mobnav {
  display: none; position: fixed; inset: var(--header-h) 0 auto 0; z-index: 49;
  max-height: calc(100dvh - var(--header-h)); overflow: auto;
  padding: 12px clamp(20px, 4vw, 40px) 24px; background: var(--canvas); border-bottom: 1px solid var(--line);
  box-shadow: 0 30px 40px -30px rgba(12, 30, 18, 0.35);
}
.b-mobnav a { display: block; padding: 13px 4px; border-bottom: 1px solid var(--line); font-size: 17px; font-weight: 600; }
.b-mobnav .b-mobnav__sub a { padding-left: 18px; font-size: 15.5px; font-weight: 550; color: var(--ink-2); }
.b-mobnav .b-btn { margin-top: 18px; width: 100%; }
.b-header.is-open + .b-mobnav { display: block; }
@media (max-width: 1080px) {
  .b-nav { display: none; }
  .b-burger { display: inline-grid; }
  .b-header__inner { justify-content: space-between; }
  .b-header__actions .b-btn { display: none; }
}

/* --- Pojawianie się przy przewijaniu ------------------------------------------------ */
[data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity 0.7s var(--ease), transform 0.7s var(--ease); transition-delay: calc(var(--i, 0) * 70ms); }
[data-reveal].is-in { opacity: 1; transform: none; }
.no-js [data-reveal] { opacity: 1; transform: none; }

/* =============================================================================
   STRONA GŁÓWNA — bramka
   ============================================================================= */
.b-gate { position: relative; padding: clamp(40px, 6vw, 76px) 0 clamp(64px, 8vw, 104px); overflow: hidden; isolation: isolate; }
.b-gate::before {
  content: ""; position: absolute; inset: -10% -10% 30% -10%; z-index: -2; pointer-events: none;
  background:
    radial-gradient(40% 55% at 18% 18%, rgba(199, 186, 232, 0.55), transparent 65%),
    radial-gradient(38% 50% at 84% 12%, rgba(241, 201, 190, 0.55), transparent 65%),
    radial-gradient(45% 55% at 50% 70%, rgba(182, 212, 186, 0.55), transparent 70%);
  filter: blur(8px);
}
.b-gate__intro { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 20px; text-align: center; }
.b-gate__intro .b-lead { max-width: 64ch; }
.b-gate__sub { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: clamp(20px, 2.1vw, 28px); letter-spacing: -0.02em; color: var(--forest-700); }
.b-gate__ask {
  margin: clamp(10px, 1.5vw, 18px) 0 0; display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3);
}
.b-gate__ask::before, .b-gate__ask::after { content: ""; width: 44px; height: 1px; background: linear-gradient(90deg, transparent, var(--line-2)); }
.b-gate__ask::after { transform: scaleX(-1); }
.b-halves {
  position: relative; z-index: 1; display: flex; gap: 16px; max-width: 1480px;
  margin: clamp(26px, 3vw, 38px) auto 0; padding-inline: clamp(16px, 2.5vw, 32px);
}
.b-half {
  position: relative; flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 18px;
  padding: clamp(24px, 2.6vw, 36px) clamp(24px, 2.6vw, 36px) 0; overflow: hidden;
  border-radius: var(--r-2xl); background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(255, 255, 255, 0.9); color: var(--ink);
  box-shadow: 0 1px 2px rgba(12, 30, 18, 0.05), 0 24px 60px -30px rgba(12, 30, 18, 0.35);
  backdrop-filter: blur(6px);
  transition: flex-grow 0.45s var(--ease), background 0.3s ease, box-shadow 0.3s ease;
}
.b-half::before {
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity 0.35s ease;
  background: radial-gradient(80% 60% at 30% 0%, rgba(182, 212, 186, 0.55), transparent 70%);
}
.b-half--cand::before { background: radial-gradient(80% 60% at 30% 0%, rgba(199, 186, 232, 0.55), transparent 70%); }
.b-half__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.b-half__who { display: inline-flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 800; letter-spacing: 0.12em; color: var(--forest-700); }
.b-half--cand .b-half__who { color: #5b44a8; }
.b-half__go {
  display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; flex: none;
  background: var(--ink); color: #fff; transition: transform 0.3s var(--ease), background 0.2s ease;
}
.b-half__go svg { width: 18px; height: 18px; }
.b-half:hover .b-half__go, .b-half:focus-visible .b-half__go { transform: rotate(45deg); background: var(--forest-700); }
.b-half__text { display: flex; flex-direction: column; gap: 12px; max-width: 48ch; }
.b-half__title { margin: 0; font-family: var(--font-display); font-weight: 600; font-size: clamp(27px, 2.9vw, 40px); line-height: 1.05; letter-spacing: -0.028em; }
.b-half__desc { margin: 0; font-size: clamp(15px, 1.15vw, 17px); line-height: 1.6; color: var(--ink-2); }
.b-half__cta { align-self: flex-start; pointer-events: none; margin-top: 4px; }
.b-half__kolaz { margin-top: auto; flex-shrink: 0; }
/* Najechanie: karta się poszerza, podgląd produktu przybliża. Treść jest widoczna
   zawsze (dotyk, klawiatura), a stała szerokość tekstu chroni przed przeskakiwaniem. */
.b-half__text { width: min(440px, 100%); }
@media (hover: hover) and (min-width: 900px) {
  .b-half:hover, .b-half:focus-visible { flex-grow: 1.22; background: #fff; box-shadow: 0 1px 2px rgba(12, 30, 18, 0.05), 0 40px 80px -34px rgba(12, 30, 18, 0.45); }
  .b-half:hover::before, .b-half:focus-visible::before { opacity: 1; }
  .b-halves:has(.b-half:hover) .b-half:not(:hover),
  .b-halves:has(.b-half:focus-visible) .b-half:not(:focus-visible) { flex-grow: 0.86; }
}
@media (max-width: 899px) {
  .b-halves { flex-direction: column; }
  .b-half { flex: none; }
}

/* =============================================================================
   Wspólne sekcje
   ============================================================================= */

/* --- Dwie kolumny --------------------------------------------------------------- */
.b-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(36px, 5vw, 88px); align-items: center; }
.b-split--top { align-items: start; }
.b-split--wide-left { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); }
.b-split--wide-right { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); }
@media (max-width: 960px) { .b-split, .b-split--wide-left, .b-split--wide-right { grid-template-columns: 1fr; } }
.b-stack { display: flex; flex-direction: column; gap: 18px; }
.b-stack > * { margin: 0; }
.b-stack--tight { gap: 12px; }

/* --- Dwie karty „dla pracodawcy / dla kandydata” ---------------------------------- */
.b-duo-row { display: grid; grid-template-columns: minmax(0, 0.75fr) minmax(0, 1fr) minmax(0, 1fr); gap: 16px clamp(24px, 3vw, 40px); align-items: stretch; margin-top: clamp(64px, 8vw, 112px); }
.b-duo-row > .b-h3 { align-self: center; }
.b-duo-row > .b-h3 { font-size: clamp(28px, 2.9vw, 40px); line-height: 1.08; letter-spacing: -0.026em; }
@media (max-width: 1000px) { .b-duo-row { grid-template-columns: 1fr 1fr; } .b-duo-row > .b-h3 { grid-column: 1 / -1; } }
@media (max-width: 640px) { .b-duo-row { grid-template-columns: 1fr; } }
.b-duo__card { display: flex; flex-direction: column; gap: 14px; }
.b-duo__label { font-size: 12.5px; font-weight: 800; letter-spacing: 0.12em; color: var(--forest-700); }
.b-duo__card--cand .b-duo__label { color: #5b44a8; }
.b-duo__title { font-family: var(--font-display); font-size: 23px; font-weight: 600; line-height: 1.15; letter-spacing: -0.018em; }
.b-duo__kicker { display: block; margin-bottom: 6px; font-size: 13.5px; font-weight: 700; letter-spacing: 0.01em; color: var(--forest-700); }
.b-duo__card--cand .b-duo__kicker { color: #5b44a8; }
.b-duo__card p { font-size: 15.5px; line-height: 1.6; color: var(--ink-2); }

/* --- Social proof (miejsca na treść) ------------------------------------------------- */
.b-logos { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-radius: var(--r-lg); overflow: hidden;
  border: 1px solid var(--line); background: var(--line); gap: 1px; }
.b-logocell { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; height: 104px; background: var(--paper); color: var(--ink-4); }
.b-logocell svg { width: 26px; height: 26px; opacity: 0.55; }
.b-logocell span { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.06em; color: var(--ink-4); }
.b-quotes { margin-top: 16px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 16px; }
.b-quote { margin: 0; display: flex; flex-direction: column; gap: 22px; }
.b-quote__mark { width: 34px; height: 34px; color: var(--mint-200); }
.b-quote blockquote { margin: 0; font-family: var(--font-display); font-size: clamp(19px, 1.7vw, 23px); line-height: 1.35; letter-spacing: -0.01em; color: var(--ink-3); }
.b-quote figcaption { display: flex; align-items: center; gap: 12px; font-size: 14px; }
.b-quote figcaption > span:last-child { display: flex; flex-direction: column; }
.b-quote figcaption strong { color: var(--ink); }
.b-quote figcaption .b-muted { color: var(--ink-4); }
.b-avatar-ph { width: 42px; height: 42px; border-radius: 50%; flex: none; display: grid; place-items: center; background: var(--mist); color: var(--ink-4); }
.b-avatar-ph svg { width: 20px; height: 20px; }
@media (max-width: 760px) { .b-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); } .b-logocell:last-child { grid-column: 1 / -1; } }

/* --- Oś kroków (poziomo) ---------------------------------------------------------- */
.b-timeline { --n: 5; list-style: none; margin: 0; padding: 0; position: relative;
  display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 20px; }
.b-timeline::before {
  content: ""; position: absolute; top: 23px; left: 30px; right: 30px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, var(--mint-200), var(--forest-500) 55%, var(--lime-2));
}
.b-tstep { position: relative; display: flex; flex-direction: column; gap: 16px; }
.b-tstep__node { display: flex; align-items: center; gap: 12px; }
.b-tstep__node .b-tile { position: relative; z-index: 1; background: #fff; box-shadow: 0 0 0 6px var(--canvas), inset 0 0 0 1px rgba(21, 94, 44, 0.16), 0 6px 14px -8px rgba(15, 64, 30, 0.35); }
.b-sec--paper .b-tstep__node .b-tile { box-shadow: 0 0 0 6px var(--paper), inset 0 0 0 1px rgba(21, 94, 44, 0.16), 0 6px 14px -8px rgba(15, 64, 30, 0.35); }
.b-sec--mist .b-tstep__node .b-tile { box-shadow: 0 0 0 6px var(--mist), inset 0 0 0 1px rgba(21, 94, 44, 0.16), 0 6px 14px -8px rgba(15, 64, 30, 0.35); }
.b-tstep__num { position: relative; z-index: 1; padding: 3px 9px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px rgba(21, 94, 44, 0.16); font-family: var(--font-mono); font-size: 11.5px; font-weight: 600; color: var(--forest-600); letter-spacing: 0.04em; }
.b-tstep h3 { margin: 0; font-family: var(--font-display); font-size: 20px; font-weight: 600; line-height: 1.2; letter-spacing: -0.014em; }
.b-tstep p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink-2); }
.b-tstep__body { display: flex; flex-direction: column; gap: 8px; }
@media (max-width: 1000px) {
  .b-timeline { grid-template-columns: 1fr; gap: 0; }
  .b-timeline::before { top: 24px; bottom: 24px; left: 22px; right: auto; width: 2px; height: auto; background: linear-gradient(180deg, var(--mint-200), var(--forest-500) 55%, var(--lime-2)); }
  .b-tstep { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 4px 18px; padding-bottom: 30px; }
  .b-tstep__node { grid-row: 1 / span 3; align-items: flex-start; }
  .b-tstep__node .b-tstep__num { display: none; }
}

/* --- Karty stanowisk -------------------------------------------------------------- */
.b-roles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 212px), 1fr)); gap: 14px; }
.b-role { display: flex; flex-direction: column; gap: 14px; }
.b-role__title { margin: 0; font-family: var(--font-display); font-size: 19.5px; font-weight: 600; line-height: 1.2; letter-spacing: -0.014em; }
.b-role p { flex: 1; font-size: 15px; line-height: 1.6; color: var(--ink-2); }
.b-role { padding: 22px; }
.b-role .b-link { display: inline; font-size: 14.5px; line-height: 1.5; }
.b-role .b-link .b-arrow { margin-left: 4px; }
.b-nw { white-space: nowrap; }
.b-role--ph p { color: var(--ink-4); font-style: italic; }

.b-callout {
  display: flex; align-items: center; gap: 16px; padding: 18px 22px; border-radius: var(--r-lg);
  background: rgba(255, 255, 255, 0.7); border: 1px solid rgba(21, 94, 44, 0.14);
}
.b-callout p { margin: 0; font-weight: 650; color: var(--ink); line-height: 1.5; }

/* Pas z wezwaniem do działania wewnątrz sekcji. */
.b-band {
  margin-top: clamp(36px, 4vw, 56px); position: relative; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 22px 40px;
  padding: clamp(24px, 3vw, 36px) clamp(24px, 3vw, 40px); border-radius: var(--r-xl);
  background: linear-gradient(120deg, #ffffff 0%, #f3f9f4 60%, #eaf4ed 100%);
  border: 1px solid rgba(21, 94, 44, 0.12); box-shadow: var(--shadow-1);
}
.b-band__copy { display: flex; flex-direction: column; gap: 10px; max-width: 64ch; }
.b-band__copy > * { margin: 0; }
.b-band__lead { display: flex; align-items: center; gap: 22px; min-width: 0; }
@media (max-width: 860px) { .b-band { grid-template-columns: 1fr; } .b-band > .b-btn { justify-self: start; } }
@media (max-width: 520px) { .b-band__lead { flex-direction: column; align-items: flex-start; } }
.b-band--night { background: linear-gradient(120deg, #0d2a18, #0a2314 60%, #123a20); border-color: rgba(214, 234, 216, 0.12); color: #e9f1ea; }
.b-band--night .b-body { color: rgba(233, 241, 234, 0.78); }

/* Mały certyfikat jako ilustracja w pasie. */
.b-minicert { width: 132px; flex: none; transform: rotate(-4deg); }

/* --- Giełda i okna z produktem ------------------------------------------------------ */
.b-gielda { position: relative; }
.b-gielda .tq-card { border: 0; box-shadow: none; padding: 20px; }
.b-bullets { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 14px; }
.b-bullets li { display: flex; align-items: flex-start; gap: 14px; font-size: 16px; line-height: 1.55; color: var(--ink-2); }
.b-bullets li strong { color: var(--ink); }
.b-bullets .b-tile { margin-top: -4px; }
.b-sec--night .b-bullets li { color: rgba(233, 241, 234, 0.8); }
.b-sec--night .b-bullets li strong { color: #fff; }
.b-checks { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 11px; }
.b-checks li { display: flex; align-items: flex-start; gap: 12px; font-size: 15.5px; line-height: 1.5; color: var(--ink-2); }
.b-checks li::before {
  content: ""; flex: none; width: 20px; height: 20px; margin-top: 1px; border-radius: 50%;
  background: var(--mint-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155e2c' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 12px no-repeat;
  box-shadow: inset 0 0 0 1px rgba(21, 94, 44, 0.14);
}

/* --- FAQ w dwóch kolumnach ----------------------------------------------------------- */
.b-faq { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.b-faq__head { position: sticky; top: calc(var(--header-h) + 32px); display: flex; flex-direction: column; gap: 22px; }
.b-faq__art { display: flex; gap: 10px; }
.b-faq__list { border-top: 1px solid var(--line-2); }
.b-faq__list details { border-bottom: 1px solid var(--line-2); }
.b-faq__list summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 20px;
  padding: 22px 2px; font-family: var(--font-display); font-size: clamp(18px, 1.5vw, 21px); font-weight: 600; letter-spacing: -0.012em; line-height: 1.3;
}
.b-faq__list summary::-webkit-details-marker { display: none; }
.b-faq__icon { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--mint-50); color: var(--forest-700); transition: transform 0.25s var(--ease), background 0.2s ease; }
.b-faq__icon svg { width: 16px; height: 16px; }
.b-faq__list details[open] .b-faq__icon { transform: rotate(45deg); background: var(--forest-700); color: #fff; }
.b-faq__list summary:hover .b-faq__icon { background: var(--mint-100); }
.b-faq__list details[open] summary:hover .b-faq__icon { background: var(--forest-800); }
.b-faq__answer { padding: 0 56px 24px 2px; display: flex; flex-direction: column; gap: 10px; }
.b-faq__answer p { margin: 0; font-size: 16px; line-height: 1.65; color: var(--ink-2); }
@media (max-width: 900px) { .b-faq { grid-template-columns: 1fr; } .b-faq__head { position: static; } .b-faq__answer { padding-right: 2px; } }

/* --- Dla kogo -------------------------------------------------------------------------- */
.b-audience { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: 16px; }
.b-audience__col { display: flex; flex-direction: column; gap: 16px; }
.b-audience__who { display: flex; align-items: center; gap: 14px; font-size: 13px; font-weight: 800; letter-spacing: 0.1em; color: var(--forest-700); }
.b-audience__col--cand .b-audience__who { color: #5b44a8; }
.b-audience__who h3 { margin: 0; font: inherit; letter-spacing: inherit; color: inherit; }
.b-audience__col .b-strong { font-family: var(--font-display); font-size: 23px; font-weight: 600; letter-spacing: -0.016em; line-height: 1.2; }

.b-personas { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 14px; }
.b-persona { display: flex; flex-direction: column; gap: 14px; }
.b-persona h3 { margin: 0; font-size: 12.5px; font-weight: 800; letter-spacing: 0.1em; line-height: 1.45; color: var(--forest-700); }
.b-persona p { font-size: 15.5px; line-height: 1.6; color: var(--ink-2); }
.b-persona--cand h3 { color: #5b44a8; }

/* --- Stopka ----------------------------------------------------------------------------- */
.b-footer { position: relative; overflow: hidden; background: var(--night); color: rgba(233, 241, 234, 0.72); padding: clamp(56px, 7vw, 88px) 0 28px; }
.b-footer__grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 0.7fr); gap: 32px 48px; position: relative; z-index: 1; }
.b-footer .b-logo img { height: 34px; }
.b-footer__brand { display: flex; flex-direction: column; gap: 16px; }
.b-footer__brand p { margin: 0; max-width: 34ch; font-size: 15px; line-height: 1.6; }
.b-footer__col { display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.b-footer__col a:hover { color: var(--lime); }
.b-footer__word { position: relative; z-index: 0; margin-top: clamp(40px, 6vw, 72px); user-select: none; }
.b-footer__word img { display: block; width: 100%; height: auto; opacity: 0.08; }
/* Pasek dofinansowania: znaki FE/RP/UE muszą stać na jasnym tle, więc białe pole pod dużym logo. */
.b-footer__funding { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: clamp(24px, 3vw, 36px); padding: clamp(18px, 2.4vw, 26px) clamp(18px, 3vw, 40px); border-radius: 20px; background: #fff; }
/* Znaki FE wg podręcznika FE 2021-2027: zestawienie, czarna pionowa kreska, za nią INDUSTRY LAB nie wyższe niż
   flaga UE (s. 18–19). Flaga zajmuje 111/162 wysokości pliku zestawienia, treść logo INDUSTRY LAB 222/243 jego
   pliku — logo w 0,72 wysokości zestawienia jest o włos niższe od flagi. */
.b-footer__logos { display: flex; align-items: center; justify-content: center; gap: clamp(18px, 2.4vw, 28px); }
.b-footer__logos img { display: block; max-width: 100%; }
.b-footer__logos .b-footer__znaki { height: 50px; width: auto; }
.b-footer__kreska { align-self: stretch; width: 1px; background: #000; }
.b-footer__logos .b-footer__dodatkowy { height: 36px; width: auto; }
.b-footer__projekt { font-size: 14px; font-weight: 600; text-align: center; color: var(--forest-700); text-decoration: underline; text-underline-offset: 3px; }
.b-footer__projekt:hover { color: var(--forest-900); }
/* Wąski ekran: INDUSTRY LAB pod zestawieniem, czyli poza linią znaków — bez kreski, nadal niższe od flagi
   (19% szerokości zestawienia = 93% wysokości flagi). */
@media (max-width: 899px) {
  .b-footer__logos { flex-direction: column; gap: 14px; width: 100%; }
  .b-footer__logos .b-footer__znaki { width: 100%; max-width: 560px; height: auto; }
  .b-footer__kreska { display: none; }
  .b-footer__logos .b-footer__dodatkowy { width: min(19%, 106px); height: auto; }
}
.b-footer__grid--4 { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 0.8fr) minmax(0, 1fr); }
/* Sekcje, do których prowadzą linki z innych miejsc strony: nagłówek nie zasłania ich początku. */
.v3b section[id] { scroll-margin-top: var(--header-h); }
/* Blok kontaktu — cel linku „Kontakt” z menu (przewija na dół strony). */
.b-footer__contact { scroll-margin-top: calc(var(--header-h) + 24px); }
.b-footer__label { margin: 0 0 2px; font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--lime); }
.b-footer__contact a { color: #fff; font-weight: 600; }
@media (max-width: 1040px) and (min-width: 761px) { .b-footer__grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .b-footer__grid, .b-footer__grid--4 { grid-template-columns: 1fr; } }

/* =============================================================================
   PRACODAWCA
   ============================================================================= */
.b-hero { position: relative; overflow: hidden; isolation: isolate; padding: clamp(40px, 5vw, 72px) 0 clamp(72px, 8vw, 112px); }
.b-hero::before {
  content: ""; position: absolute; inset: -20% -10% 20% 30%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(40% 45% at 60% 30%, rgba(199, 186, 232, 0.5), transparent 65%),
    radial-gradient(40% 45% at 90% 60%, rgba(241, 201, 190, 0.45), transparent 65%),
    radial-gradient(45% 50% at 50% 80%, rgba(182, 212, 186, 0.55), transparent 70%);
}
.b-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(36px, 5vw, 72px); align-items: center; }
@media (max-width: 1040px) { .b-hero__grid { grid-template-columns: 1fr; } }
.b-hero__copy { display: flex; flex-direction: column; gap: 24px; }
.b-hero__h1 { font-size: clamp(38px, 4.3vw, 60px); }
.b-hero__h1 .b-lead-word { color: var(--forest-700); }

.b-form {
  display: flex; flex-direction: column; gap: 12px; padding: 22px; border-radius: var(--r-xl);
  background: rgba(255, 255, 255, 0.82); border: 1px solid rgba(255, 255, 255, 0.95);
  box-shadow: 0 1px 2px rgba(12, 30, 18, 0.05), 0 24px 50px -28px rgba(12, 30, 18, 0.35);
  backdrop-filter: blur(8px); max-width: 560px;
}
.b-form__title { margin: 0; font-family: var(--font-display); font-size: 21px; font-weight: 600; letter-spacing: -0.014em; }
.b-form p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.b-form p strong { color: var(--ink); }
.b-form__row { display: flex; gap: 8px; padding: 6px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); }
.b-form__row:focus-within { box-shadow: inset 0 0 0 2px var(--forest-600); }
.b-form__row input { flex: 1; min-width: 0; border: 0; background: none; padding: 0 12px 0 16px; font: inherit; font-size: 15.5px; color: var(--ink); outline: none; }
.b-form__row input::placeholder { color: var(--ink-4); }
.b-form__row .b-btn { min-height: 44px; padding: 0 20px; }
.b-form__fine { display: flex; align-items: center; gap: 8px; font-size: 13.5px !important; color: var(--ink-3) !important; }
.b-form__fine svg { width: 15px; height: 15px; color: var(--forest-600); flex: none; }
@media (max-width: 520px) { .b-form__row { flex-direction: column; border-radius: 18px; } .b-form__row input { min-height: 44px; } .b-form__row .b-btn { width: 100%; } }

.b-hero__visual { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.b-hero__vlead { margin: 0; font-family: var(--font-display); font-size: clamp(19px, 1.7vw, 23px); font-weight: 600; line-height: 1.25; letter-spacing: -0.014em; }
.b-hero__vlead .b-tail { color: var(--ink-tail); }
/* Zielone dopowiedzenie tam, gdzie nagłówek nie jest kontrastem „dziś / z Talent Questem”.
   Limonka jako tekst na jasnym tle ma ok. 1,3:1, więc na jasnych sekcjach zieleń marki (5,5:1). */
.b-h1 .b-tail--green, .b-h2 .b-tail--green, .b-display .b-tail--green, .b-hero__vlead .b-tail--green { color: var(--forest-600); }

/* Raport w oknie: zakładki jak przełącznik segmentowy. */

/* Karty produktu wewnątrz okien — mniej ramek, więcej treści. */
.v3b .tq-card { border-radius: 14px; }
@media (max-width: 560px) {
  .v3b .tq-trait { flex-wrap: wrap; row-gap: 8px; }
  .v3b .tq-trait__name { flex: 1 1 100%; }
  .v3b .tq-trait__bar { flex: 1 1 auto; width: auto; }
}

/* --- Trzy filary (Sprawdź / Porównaj / Zdecyduj) ------------------------------------- */
.b-pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.b-pillar { display: flex; flex-direction: column; gap: 14px; }
.b-pillar__word { font-size: 13px; font-weight: 800; letter-spacing: 0.12em; color: var(--forest-700); }
.b-pillar__line { font-family: var(--font-display); font-size: 21px; font-weight: 600; line-height: 1.22; letter-spacing: -0.014em; color: var(--ink); }
.b-pillar__more { display: flex; align-items: flex-start; gap: 10px; padding-top: 14px; border-top: 1px dashed var(--line-2); font-size: 15px; line-height: 1.55; color: var(--ink-2); }
.b-pillar__more svg { width: 18px; height: 18px; flex: none; margin-top: 2px; color: var(--forest-600); }
@media (max-width: 900px) { .b-pillars { grid-template-columns: 1fr; } }

/* --- Jak to działa: kroki z przyklejoną sceną ------------------------------------------ */
.b-scrolly { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(36px, 5vw, 80px); align-items: start; }
.b-scrolly__steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.b-sstep { position: relative; display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 6px 20px; padding: 26px 0 26px; border-top: 1px solid var(--line); }
.b-sstep:first-child { border-top: 0; padding-top: 4px; }
.b-sstep .b-tile, .b-sstep__bubble { grid-row: 1 / span 3; transition: background 0.3s ease, color 0.3s ease, box-shadow 0.3s ease, filter 0.3s ease, opacity 0.3s ease, transform 0.3s var(--ease); }
.b-sstep__num { font-family: var(--font-mono); font-size: 12px; font-weight: 600; color: var(--ink-4); letter-spacing: 0.04em; transition: color 0.3s ease; }
.b-sstep h3 { margin: 0; font-family: var(--font-display); font-size: clamp(20px, 1.8vw, 24px); font-weight: 600; line-height: 1.2; letter-spacing: -0.016em; color: var(--ink-3); transition: color 0.3s ease; }
.b-sstep__body { display: flex; flex-direction: column; gap: 8px; }
.b-sstep__body p { margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--ink-3); transition: color 0.3s ease; }
.b-sstep.is-active h3 { color: var(--ink); }
.b-sstep.is-active .b-sstep__num { color: var(--forest-600); }
.b-sstep.is-active .b-sstep__body p { color: var(--ink-2); }
.b-sstep.is-active .b-tile:not(.b-tile--app) { color: var(--lime); background: linear-gradient(160deg, #1c6d37, #0f401e); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 8px 18px -8px rgba(15, 64, 30, 0.7); }
.b-sstep__inline { display: none; }
.b-scrolly__stage { position: sticky; top: calc(var(--header-h) + 40px); }
.b-scrolly__frame { position: relative; min-height: 510px; }
/* Zapas pod ostatnim krokiem: scena zostaje przyklejona, dopóki czyta się ostatni opis. */
.b-scrolly__steps { padding-bottom: 20vh; }
.b-scrolly--anatomia .b-scrolly__steps { padding-bottom: 36vh; }
.b-vis { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; opacity: 0; transform: translateY(10px) scale(0.99); transition: opacity 0.28s ease, transform 0.45s var(--ease); pointer-events: none; }
.b-vis.is-active { opacity: 1; transform: none; pointer-events: auto; }
@media (max-width: 960px) {
  .b-scrolly { grid-template-columns: 1fr; }
  .b-scrolly__steps, .b-scrolly--anatomia .b-scrolly__steps { padding-bottom: 0; }
  .b-scrolly__stage { display: none; }
  .b-sstep h3, .b-sstep__body p { color: var(--ink-2); }
  .b-sstep h3 { color: var(--ink); }
  .b-sstep__inline { display: block; grid-column: 1 / -1; margin-top: 16px; }
  .b-sstep__inline .b-stage { padding: 16px; }
}

/* Ujęcia produktu w krokach (uproszczone, z prawdziwymi etykietami aplikacji). */
.b-vig { width: 100%; max-width: 520px; }
/* Kroki na węższych ekranach (makieta pod opisem kroku): okno pośrodku pola, nie przy lewej krawędzi. */
.b-sstep__inline .b-stage > .b-vig { margin-inline: auto; }
.b-vig__steps { display: flex; gap: 6px; flex-wrap: wrap; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.b-vig__step { display: inline-flex; align-items: center; gap: 7px; padding: 5px 10px 5px 6px; border-radius: 999px; font-size: 12px; font-weight: 600; color: var(--ink-3); background: var(--mist); }
.b-vig__step b { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: #fff; font-size: 10.5px; color: var(--ink-3); }
.b-vig__step.is-on { color: var(--forest-700); background: var(--mint-50); }
.b-vig__step.is-on b { background: var(--forest-700); color: #fff; }
.b-vig__body { padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.b-vig__label { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-4); }
.b-vig__table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.b-vig__table th { text-align: left; padding: 10px 12px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.1em; color: var(--ink-4); border-bottom: 1px solid var(--line); }
.b-vig__table td { padding: 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.b-vig__table tr:last-child td { border-bottom: 0; }
.b-vig__score { display: flex; align-items: center; gap: 10px; min-width: 120px; }
.b-vig__score .tq-bar { flex: 1; }
.b-vig__score b { font-variant-numeric: tabular-nums; font-size: 13px; }
.b-vig__btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 999px; font-size: 12px; font-weight: 650; white-space: nowrap; color: #fff; background: var(--forest-700); }
.b-vig__btn svg { width: 12px; height: 12px; }
.b-vig__btn--ghost { color: var(--forest-700); background: var(--mint-50); }
.b-vig .tq-zapros__scena { position: static; }
.b-vig__step.is-done { color: var(--forest-700); background: var(--mint-25); }
.b-vig__step.is-done b { background: var(--mint-100); color: var(--forest-700); }
.b-vig__step b svg { width: 11px; height: 11px; }
.b-vig__title { font-family: var(--font-display); font-size: 17px; font-weight: 600; line-height: 1.25; letter-spacing: -0.012em; color: var(--ink); }
.b-vig__sub { margin-top: -4px; font-size: 13px; color: var(--ink-3); }
.b-vig__field { display: flex; flex-direction: column; gap: 6px; }
.b-vig__input { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 10px; border: 1.5px solid var(--forest-600); background: #fff; font-size: 14px; font-weight: 600; box-shadow: 0 0 0 3px rgba(21, 94, 44, 0.08); }
.b-vig__pill { padding: 3px 9px; border-radius: 999px; background: var(--mint-50); color: var(--forest-700); font-size: 11px; font-weight: 700; }
.b-vig__cols { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 12px; }
.b-vig__cols > div { display: flex; flex-direction: column; gap: 4px; }
.b-vig__cols .b-vig__label { margin-bottom: 4px; }
.b-vig__row { padding: 8px 10px; border-radius: 9px; font-size: 13px; font-weight: 550; color: var(--ink-2); }
.b-vig__row.is-on { background: var(--mint-50); color: var(--forest-800); font-weight: 650; box-shadow: inset 0 0 0 1px rgba(21, 94, 44, 0.2); }
.b-vig__checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.b-vig__check { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line); font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--ink-2); background: #fff; }
.b-vig__check i { flex: none; width: 18px; height: 18px; border-radius: 5px; display: grid; place-items: center; border: 1.5px solid var(--line-2); color: #fff; }
.b-vig__check i svg { width: 12px; height: 12px; }
.b-vig__check.is-on { border-color: rgba(21, 94, 44, 0.35); background: var(--mint-25); color: var(--forest-800); }
.b-vig__check.is-on i { background: var(--forest-700); border-color: var(--forest-700); }
.b-vig__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding-top: 12px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--ink-3); }
.b-vig__foot b { color: var(--forest-700); }
.b-vig__desk { position: relative; min-height: 330px; padding: 18px 18px 78px; background: radial-gradient(60% 70% at 15% 10%, #efe9fb, transparent 65%), radial-gradient(55% 60% at 90% 25%, #f8ebe6, transparent 65%), linear-gradient(180deg, #eef3ef, #e6efe8); }
.b-vig__panel { width: min(100%, 360px); display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 14px; background: rgba(255, 255, 255, 0.94); border: 1px solid rgba(255, 255, 255, 0.9); box-shadow: 0 20px 40px -22px rgba(12, 30, 18, 0.45); }
.b-vig__panel-head { display: flex; align-items: center; gap: 8px; }
.b-vig__panel-head svg { width: 18px; height: 18px; color: var(--forest-700); }
.b-vig__panel-head strong { font-size: 14.5px; }
.b-vig__panel-head span { margin-left: auto; font-size: 11.5px; font-weight: 650; color: var(--ink-3); }
.b-vig__task { display: flex; align-items: center; gap: 8px; padding: 10px; border-radius: 10px; border: 1px solid var(--line); background: #fff; }
.b-vig__task.is-on { border-color: rgba(21, 94, 44, 0.35); background: var(--mint-25); }
.b-vig__task-t { flex: 1; min-width: 0; font-size: 12.5px; font-weight: 600; line-height: 1.35; }
.b-vig__timer { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-mono); font-size: 11.5px; color: var(--forest-700); }
.b-vig__timer svg { width: 12px; height: 12px; }
.b-vig__dock { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); display: flex; gap: 6px; padding: 7px; border-radius: 16px; background: rgba(255, 255, 255, 0.72); border: 1px solid rgba(255, 255, 255, 0.9); box-shadow: 0 12px 24px -14px rgba(12, 30, 18, 0.4); backdrop-filter: blur(8px); }
.b-vig__dock .b-tile--app { width: 30px; height: 30px; border-radius: 9px; }
.b-vig__dock .b-tile--app svg { width: 16px; height: 16px; }
.b-vig__who { display: inline-flex; align-items: center; gap: 9px; font-weight: 600; white-space: nowrap; }
.b-vig__who i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--mint-50); color: var(--forest-700); font-style: normal; font-size: 10.5px; font-weight: 700; }
@media (max-width: 520px) { .b-vig__score .tq-bar, .b-vig__who i { display: none; } .b-vig__score { min-width: 0; } .b-vig__who { white-space: normal; } .b-vig__btn { padding: 5px 9px; font-size: 11.5px; } .b-vig__table td, .b-vig__table th { padding: 10px 6px; } .b-vig__checks, .b-vig__cols { grid-template-columns: 1fr; } .b-vig__dock .b-tile--app { width: 24px; height: 24px; } .b-vig__dock .b-tile--app svg { width: 13px; height: 13px; } }

/* --- Podpisy i cytat --------------------------------------------------------- */
.b-caption { margin: 14px 0 0; text-align: center; font-size: 14px; color: var(--ink-3); }
.b-caption .mk-ph-txt { font-style: italic; color: var(--ink-4); }
/* Film na ciemnym tle (strona kandydata, v3 C): bez jasnej sceny wokół nagrania, jasne podpisy. */
.b-sec--night .b-video .b-stage { padding: 0; background: none; box-shadow: none; }
.b-sec--night .b-video .b-stage::before, .b-sec--night .b-video .b-stage::after { display: none; }
.b-sec--night .b-video .tq-media { box-shadow: 0 40px 90px -40px rgba(0, 0, 0, 0.8), 0 0 0 1px rgba(214, 234, 216, 0.12); }
.b-sec--night .b-caption, .b-sec--night .b-caption .mk-ph-txt { color: rgba(233, 241, 234, 0.72); }
.b-pull { margin: 0; display: flex; flex-direction: column; gap: 18px; }
.b-pull svg { width: 38px; height: 38px; color: var(--forest-500); }
.b-pull p { margin: 0; font-family: var(--font-display); font-size: clamp(25px, 2.6vw, 34px); font-weight: 600; line-height: 1.18; letter-spacing: -0.022em; color: var(--ink); text-wrap: balance; }

/* --- Case study (miejsce na treść) --------------------------------------------------------- */
.b-case { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); overflow: hidden; border-radius: var(--r-2xl); background: var(--paper); border: 1px solid var(--line); box-shadow: var(--shadow-2); }
.b-case__copy { display: flex; flex-direction: column; gap: 22px; padding: clamp(28px, 4vw, 56px); }
.b-case__stats { display: flex; flex-wrap: wrap; gap: 20px 56px; }
.b-case__stat { display: flex; flex-direction: column; gap: 4px; font-size: 15px; color: var(--ink-3); }
.b-case__num { font-family: var(--font-display); font-size: clamp(48px, 5vw, 72px); font-weight: 600; line-height: 0.95; letter-spacing: -0.04em; color: var(--forest-700); }
.b-case blockquote { margin: 0; font-family: var(--font-display); font-size: clamp(19px, 1.7vw, 23px); line-height: 1.35; color: var(--ink-3); font-style: normal; }
.b-case__art { position: relative; display: grid; place-items: center; min-height: 280px; background: linear-gradient(160deg, #0f401e, #05160c); overflow: hidden; }
.b-case__art::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 60% at 30% 20%, rgba(200, 238, 122, 0.25), transparent 70%); }
.b-case__glass {
  position: relative; width: min(76%, 300px); display: flex; flex-direction: column; gap: 18px; padding: 24px;
  border-radius: 22px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(214, 234, 216, 0.16);
  box-shadow: 0 34px 60px -30px rgba(0, 0, 0, 0.7); transform: rotate(-3deg); backdrop-filter: blur(6px);
}
.b-case__top { display: flex; align-items: center; gap: 14px; }
.b-case__lines { display: flex; flex-direction: column; gap: 8px; }
.b-case__lines i { display: block; width: 130px; height: 8px; border-radius: 4px; background: rgba(214, 234, 216, 0.24); }
.b-case__lines i + i { width: 84px; opacity: 0.6; }
.b-case__bars { display: flex; flex-direction: column; gap: 11px; }
.b-case__bars span { display: block; height: 10px; border-radius: 6px; background: linear-gradient(90deg, var(--lime) var(--w), rgba(214, 234, 216, 0.12) var(--w)); }
.b-case__bars span:nth-child(n+3) { background: linear-gradient(90deg, rgba(200, 238, 122, 0.55) var(--w), rgba(214, 234, 216, 0.12) var(--w)); }
.b-case__badge {
  position: absolute; right: 16%; top: 22%; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center;
  background: var(--lime); color: var(--forest-900); box-shadow: 0 0 0 8px rgba(200, 238, 122, 0.18), 0 14px 30px -10px rgba(0, 0, 0, 0.6);
}
.b-case__badge svg { width: 26px; height: 26px; }
@media (max-width: 860px) { .b-case { grid-template-columns: 1fr; } .b-case__art { min-height: 180px; order: -1; } }

/* --- Końcowe wezwanie ------------------------------------------------------------------------ */
.b-final {
  position: relative; overflow: hidden; isolation: isolate; border-radius: var(--r-2xl);
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 32px clamp(32px, 5vw, 72px); align-items: center;
  padding: clamp(32px, 5vw, 72px); color: #fff;
  background:
    radial-gradient(60% 80% at 0% 0%, rgba(76, 138, 94, 0.55), transparent 65%),
    radial-gradient(50% 70% at 100% 100%, rgba(200, 238, 122, 0.22), transparent 65%),
    var(--night);
}
.b-final::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(var(--night-line) 1px, transparent 1px), linear-gradient(90deg, var(--night-line) 1px, transparent 1px);
  background-size: 56px 56px; mask-image: radial-gradient(ellipse 70% 80% at 20% 40%, #000 10%, transparent 70%); opacity: 0.6;
}
.b-final__copy { display: flex; flex-direction: column; gap: 16px; }
.b-final__copy h2 { color: #fff; }
.b-final__copy p { margin: 0; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; color: rgba(233, 241, 234, 0.8); }
.b-final .b-form { background: rgba(255, 255, 255, 0.96); color: var(--ink); }
.b-final .b-form__row { flex-direction: column; border-radius: 18px; }
.b-final .b-form__row input { min-height: 46px; }
.b-final .b-form__row .b-btn { width: 100%; }
.b-sec--end { padding-top: 0; padding-bottom: clamp(64px, 7vw, 104px); }
@media (max-width: 960px) { .b-final { grid-template-columns: 1fr; } }

/* Dwie ścieżki na końcu strony głównej. */
.b-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.b-path {
  position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; gap: 18px; min-height: 300px;
  padding: clamp(28px, 3.5vw, 48px); border-radius: var(--r-2xl);
}
.b-path h3 { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: 0.14em; }
.b-path p { margin: 0; font-family: var(--font-display); font-size: clamp(22px, 2.2vw, 30px); font-weight: 600; line-height: 1.2; letter-spacing: -0.02em; }
.b-path .b-btn { margin-top: auto; align-self: flex-start; }
.b-path--cand { background: linear-gradient(150deg, #ffffff, #f4f1fb 70%, #ece6fa); border: 1px solid rgba(91, 68, 168, 0.14); color: var(--ink); }
.b-path--cand h3 { color: #5b44a8; }
.b-path--emp { color: #fff; background: radial-gradient(70% 80% at 100% 0%, rgba(200, 238, 122, 0.25), transparent 60%), linear-gradient(150deg, #1c6d37, #0f401e 55%, #05160c); }
.b-path--emp h3 { color: var(--lime); }
.b-path__art { position: absolute; right: -24px; bottom: -24px; z-index: -1; width: 180px; height: 180px; border-radius: 48px; opacity: 0.5; transform: rotate(-12deg); display: grid; place-items: center; }
.b-path__art svg { width: 110px; height: 110px; }
.b-path--cand .b-path__art { color: #d8cff3; }
.b-path--emp .b-path__art { color: rgba(200, 238, 122, 0.25); }
@media (max-width: 800px) { .b-paths { grid-template-columns: 1fr; } }

/* =============================================================================
   KANDYDAT
   ============================================================================= */
.b-hero--cand::before {
  background:
    radial-gradient(40% 45% at 62% 28%, rgba(199, 186, 232, 0.62), transparent 65%),
    radial-gradient(40% 45% at 92% 62%, rgba(241, 201, 190, 0.5), transparent 65%),
    radial-gradient(45% 50% at 55% 85%, rgba(182, 212, 186, 0.5), transparent 70%);
}
.b-nochips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.b-nochips li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 10px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 14.5px; font-weight: 650; color: var(--ink); }
.b-nochips svg { width: 16px; height: 16px; color: var(--forest-600); }
.b-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.b-stat { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: var(--r-lg); background: rgba(255, 255, 255, 0.8); border: 1px solid rgba(255, 255, 255, 0.95); box-shadow: var(--shadow-1); }
.b-stat__v { font-family: var(--font-display); font-size: clamp(22px, 2vw, 27px); font-weight: 600; line-height: 1.05; letter-spacing: -0.02em; }
.b-stat__l { font-size: 13.5px; line-height: 1.45; color: var(--ink-3); }
@media (max-width: 560px) { .b-stats { grid-template-columns: 1fr; gap: 8px; } .b-stat { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 2px 14px; align-items: center; padding: 14px 16px; } .b-stat .b-tile { grid-row: 1 / span 2; } }

.b-apps { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.b-apps li { display: inline-flex; align-items: center; gap: 9px; padding: 6px 12px 6px 6px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); font-size: 13.5px; font-weight: 600; color: var(--ink-2); }
.b-apps .b-tile--app { width: 26px; height: 26px; border-radius: 8px; }
.b-apps .b-tile--app svg { width: 14px; height: 14px; }

.b-video { position: relative; }
.b-video .tq-media { border-radius: 18px; border: 0; box-shadow: var(--shadow-3); }
.b-video .tq-media__play .tq-btn { border-radius: 999px; }

.b-feats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 28px; }
.b-feat { display: flex; flex-direction: column; gap: 10px; }
.b-feat h3 { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: 0.1em; color: var(--forest-700); }
.b-feat p { margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--ink-2); }
.b-flash { display: inline-flex; align-items: center; gap: 12px; padding: 12px 18px 12px 12px; border-radius: 999px; background: var(--forest-700); color: #fff; font-weight: 650; }
.b-flash svg { width: 18px; height: 18px; color: var(--lime); }
.b-flash .b-tile { width: 30px; height: 30px; border-radius: 50%; }
@media (max-width: 560px) { .b-feats { grid-template-columns: 1fr; } }

/* Profil kandydata. */
.b-profile .tq-card { border: 0; box-shadow: none; padding: 22px; }
.b-plist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.b-plist li { display: flex; gap: 14px; align-items: flex-start; padding: 16px; border-radius: 16px; background: #fff; border: 1px solid var(--line); }
.b-plist li:last-child:nth-child(odd) { grid-column: 1 / -1; }
.b-plist b { display: block; font-size: 12.5px; font-weight: 800; letter-spacing: 0.1em; color: var(--forest-700); }
.b-plist__d { display: block; margin-top: 3px; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); }
@media (max-width: 560px) { .b-plist { grid-template-columns: 1fr; } }

/* Końcowe wezwanie kandydata. */
.b-finalk { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; align-items: center; gap: 22px; text-align: center; padding: clamp(40px, 6vw, 88px) clamp(20px, 4vw, 64px); border-radius: var(--r-2xl);
  background:
    radial-gradient(50% 70% at 10% 10%, rgba(199, 186, 232, 0.7), transparent 60%),
    radial-gradient(45% 65% at 95% 20%, rgba(241, 201, 190, 0.65), transparent 60%),
    radial-gradient(60% 70% at 50% 110%, rgba(200, 238, 122, 0.55), transparent 65%),
    #f4f6f4;
}
.b-finalk > * { margin: 0; }
.b-finalk .b-body { max-width: 60ch; }
.b-bigchips { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0; padding: 0; list-style: none; }
.b-bigchips li { display: inline-flex; align-items: center; gap: 10px; padding: 12px 20px 12px 12px; border-radius: 999px; background: #fff; box-shadow: var(--shadow-2); font-family: var(--font-display); font-size: clamp(18px, 1.8vw, 23px); font-weight: 600; letter-spacing: -0.014em; }
.b-bigchips .b-tile { width: 34px; height: 34px; border-radius: 50%; }
.b-bigchips .b-tile svg { width: 17px; height: 17px; }

/* --- Certyfikat: układ 1:1 z wydrukiem w aplikacji kandydata ---------------
   Źródło: TQ-candidate src/app/certificates/certificate-print.ts (A4 poziomo,
   zielony pas marki, nazwa w Bricolage Grotesque, wynik w ramce, stopka z numerem).
   Wymiary liczymy od szerokości karty, więc certyfikat skaluje się jak kartka. */
.mk-cert {
  container-type: inline-size;
  margin: 0; width: 100%; aspect-ratio: 297 / 210;
  display: flex; flex-direction: column; overflow: hidden;
  border-radius: 10px; background: #fff; color: #0c0e0c;
  box-shadow: 0 24px 60px rgba(12, 30, 18, 0.16), 0 3px 10px rgba(12, 30, 18, 0.08);
  font-family: var(--font-sans);
}
.mk-cert__band {
  display: flex; align-items: center; gap: 2.4cqw; padding: 3.8cqw 8cqw;
  background: linear-gradient(80.49deg, #155e2c 10.5%, #021509 92.2%); color: #fff;
}
.mk-cert__logo { display: block; width: auto; height: 5.4cqw; }
.mk-cert__tile {
  width: 6.4cqw; height: 6.4cqw; display: flex; align-items: center; justify-content: center;
  border-radius: 1.8cqw; background: rgba(255, 255, 255, 0.14);
  font-weight: 600; font-size: 2.2cqw; letter-spacing: 0.04em;
}
.mk-cert__brand { font-family: var(--font-display); font-size: 3.2cqw; font-weight: 500; }
.mk-cert__kind { margin-left: auto; font-size: 1.75cqw; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.85; }
.mk-cert__body { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.2cqw; padding: 0 8cqw; text-align: center; }
.mk-cert__body p { margin: 0; }
.mk-cert__eyebrow { font-size: 1.75cqw; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: #626863; }
.mk-cert__holder { font-family: var(--font-display); font-size: 5.8cqw; font-weight: 600; line-height: 1.15; }
.mk-cert__lead { max-width: 48ch; font-size: 2.15cqw; line-height: 1.45; color: #323733; text-wrap: balance; }
.mk-cert__subject { font-family: var(--font-display); font-size: 4.9cqw; font-weight: 600; line-height: 1.2; color: #155e2c; }
.mk-cert__score {
  margin-top: 1.6cqw; display: inline-flex; flex-direction: column; align-items: center; gap: 0.5cqw;
  padding: 2cqw 4cqw; border: 1px solid #d6ead8; border-radius: 2.3cqw; background: #eaf4ed;
}
.mk-cert__score-value { font-family: var(--font-display); font-size: 4cqw; font-weight: 600; color: #155e2c; }
.mk-cert__score-caption { font-size: 1.75cqw; color: #626863; }
.mk-cert__foot {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 4cqw;
  padding: 3.2cqw 8cqw 4.2cqw; border-top: 1px solid #dce0dc;
}
.mk-cert__meta { display: flex; flex-direction: column; gap: 0.3cqw; }
.mk-cert__meta span { font-size: 1.45cqw; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #626863; }
.mk-cert__meta strong { font-size: 2cqw; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: 0.04em; }
.mk-cert__note { margin: 0; max-width: 30ch; font-size: 1.6cqw; line-height: 1.5; color: #626863; text-align: right; }

/* Miejsca na treść, której dokument jeszcze nie dostarcza. */
.mk-ph-txt { font-style: italic; color: var(--ink-4); }

/* =============================================================================
   Uwagi PO z 28.09
   ============================================================================= */

/* --- Karty-odnośniki (cała karta klikalna, nazwa linku = etykieta) ---------------- */
.b-card--link { transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease), border-color 0.25s ease; }
.b-card--link:hover { transform: translateY(-4px); box-shadow: var(--shadow-3); border-color: rgba(21, 94, 44, 0.22); }
.b-card--link:focus-within { outline: 2px solid var(--forest-600); outline-offset: 3px; }
.b-stretch::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.b-stretch:focus-visible { outline: none; }
.b-card__go {
  position: absolute; top: 20px; right: 20px; width: 36px; height: 36px; border-radius: 50%;
  display: grid; place-items: center; background: var(--ink); color: #fff;
  transition: transform 0.3s var(--ease), background 0.2s ease;
}
.b-card__go svg { width: 16px; height: 16px; }
.b-card--link:hover .b-card__go { transform: rotate(45deg); background: var(--forest-700); }
.b-duo__label.b-stretch:hover { text-decoration: underline; text-underline-offset: 3px; }
.b-audience__who .b-card__go { top: 24px; right: 24px; }

/* --- Przewijane pokazy: warianty -------------------------------------------------- */
.b-sstep__app { width: 46px !important; height: 46px !important; border-radius: 13px !important; }
.b-sstep__app svg { width: 22px !important; height: 22px !important; }
.b-sstep:not(.is-active) .b-sstep__app { filter: grayscale(1); opacity: 0.4; }
.b-sstep.is-active .b-sstep__app { transform: scale(1.06); box-shadow: 0 0 0 4px rgba(21, 94, 44, 0.1), 0 10px 20px -10px var(--g2, #155e2c); }
.b-sstep__app--neutral { color: var(--lime); background: linear-gradient(160deg, #1c6d37, #0f401e); --g2: #0f401e; }
.b-scrolly--pokaz { grid-template-columns: minmax(0, 0.68fr) minmax(0, 1.32fr); gap: clamp(28px, 4vw, 64px); }
.b-scrolly--pokaz .b-sstep { padding: 22px 0; min-height: 24vh; align-content: start; }
.b-scrolly--pokaz .b-scrolly__frame { min-height: 470px; }
.b-scrolly--pokaz .b-stage { padding: clamp(16px, 2.4vw, 32px); }

.b-scrolly--anatomia { grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr); gap: clamp(28px, 4vw, 64px); }
.b-scrolly--anatomia .rp { font-size: 13px; }
.b-scrolly--anatomia .b-stage { padding: clamp(16px, 2vw, 26px); }
.b-scrolly--anatomia .b-scrolly__stage { order: -1; }
.b-scrolly--anatomia .b-stage {
  background:
    radial-gradient(55% 60% at 20% 10%, rgba(76, 138, 94, 0.42), transparent 65%),
    radial-gradient(50% 55% at 90% 90%, rgba(200, 238, 122, 0.12), transparent 65%),
    #0b2415;
  box-shadow: inset 0 0 0 1px rgba(214, 234, 216, 0.1);
}
.b-scrolly--anatomia .b-stage::before { background-image: radial-gradient(rgba(214, 234, 216, 0.14) 1px, transparent 1.3px); }
/* Anatomia: jeden ciągły raport w oknie na wysokość ekranu (mieści się też na 13-calowym laptopie).
   Okno przesuwa raport do części z aktywnego kroku, pozostałe części przygasza i rozmywa brzegi w tło sekcji. */
.b-scrolly--anatomia .b-scrolly__stage { top: calc(var(--header-h) + 36px); }
.b-anat { position: relative; height: clamp(440px, calc(100vh - var(--header-h) - 72px), 760px); overflow: hidden;
  -webkit-mask-image: linear-gradient(transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(transparent, #000 6%, #000 94%, transparent); }
.b-anat__track { position: relative; display: flex; flex-direction: column; gap: 22px; padding: 30px 0; transition: transform 0.7s var(--ease); will-change: transform; }
.b-anat__part { opacity: 0.22; transition: opacity 0.45s ease; }
.b-anat__part.is-active { opacity: 1; }
.b-anat__part > .rp--part { max-width: none; }
.b-anat__part .rp-part, .b-anat__part .rp-card, .b-anat__part .rp-table, .b-anat__part .rp-questions { box-shadow: 0 30px 60px -34px rgba(0, 0, 0, 0.75); }
.b-scrolly--anatomia .b-sstep { min-height: 22vh; padding: 26px 0; border-top-color: var(--night-line); align-content: start; }
.b-scrolly--anatomia .b-sstep h3 { color: rgba(233, 241, 234, 0.42); }
.b-scrolly--anatomia .b-sstep.is-active h3 { color: #fff; }
.b-scrolly--anatomia .b-sstep__body p { color: rgba(233, 241, 234, 0.38); }
.b-scrolly--anatomia .b-sstep.is-active .b-sstep__body p { color: rgba(233, 241, 234, 0.82); }
.b-sstep__bubble {
  width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
  font-size: 15px; font-weight: 800; color: var(--lime); box-shadow: inset 0 0 0 1.5px rgba(200, 238, 122, 0.45);
}
.b-sstep.is-active .b-sstep__bubble { background: var(--lime); color: var(--forest-900); box-shadow: 0 0 0 7px rgba(200, 238, 122, 0.18); transform: scale(1.06); }
.b-scrolly .b-vis > .rp--part { box-shadow: 0 34px 70px -34px rgba(0, 0, 0, 0.7); }
@media (max-width: 960px) {
  .b-scrolly--pokaz, .b-scrolly--anatomia { grid-template-columns: 1fr; }
  .b-scrolly--pokaz .b-sstep__inline .b-stage, .b-scrolly--anatomia .b-sstep__inline .b-stage { padding: 8px; border-radius: 18px; }
  .b-scrolly--pokaz .b-sstep, .b-scrolly--anatomia .b-sstep { min-height: 0; }
  .b-scrolly--pokaz .b-scrolly__steps, .b-scrolly--anatomia .b-scrolly__steps {
    flex-direction: row; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
    margin-inline: calc(-1 * clamp(20px, 4vw, 40px)); padding: 4px clamp(20px, 4vw, 40px) 14px; scrollbar-width: thin;
  }
  .b-scrolly--pokaz .b-sstep, .b-scrolly--anatomia .b-sstep {
    flex: 0 0 min(86%, 440px); scroll-snap-align: center; align-content: start;
    padding: 18px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255, 255, 255, 0.72);
  }
  .b-scrolly--pokaz .b-sstep:first-child, .b-scrolly--anatomia .b-sstep:first-child { padding-top: 18px; border-top: 1px solid var(--line); }
  .b-scrolly--anatomia .b-sstep, .b-scrolly--anatomia .b-sstep:first-child { background: rgba(214, 234, 216, 0.05); border-color: var(--night-line); }
  .b-scrolly--anatomia .b-sstep h3 { color: #fff; }
  .b-scrolly--anatomia .b-sstep__body p { color: rgba(233, 241, 234, 0.82); }
  .b-scrolly--anatomia .b-sstep__bubble { background: var(--lime); color: var(--forest-900); }
  .b-scrolly--anatomia .b-sstep__inline .b-stage { background: #0b2415; }
  .b-sstep:not(.is-active) .b-sstep__app { filter: none; opacity: 1; }
}

/* --- Raport kandydata: wierne odwzorowanie ekranu z aplikacji -----------------------
   Źródło: TQ-employer report-view.scss (kolory tonów: od 75% zielony, od 50% bursztynowy). */
.rp { display: flex; flex-direction: column; gap: 14px; color: #1a1d1a; font-family: var(--font-sans); font-size: 13.5px; line-height: 1.55; text-align: left; }
.rp p { margin: 0; }
.rp ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.rp svg { width: 15px; height: 15px; flex: none; }
.rp-contact { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 16px 18px; background: #fff; border: 1px solid #e2e1e9; border-radius: 16px; }
.rp-contact__id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.rp-avatar { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; flex: none; background: linear-gradient(180deg, #4c8a5e, #155e2c); color: #fff; font-weight: 600; font-size: 16px; }
.rp-name { font-family: var(--font-display); font-size: 21px; font-weight: 500; line-height: 1.2; letter-spacing: -0.01em; }
.rp-contact__row { display: flex; align-items: center; gap: 6px; margin-top: 2px !important; font-size: 12.5px; font-weight: 500; color: #80808f; }
.rp-contact__row svg { width: 14px; height: 14px; }
.rp-pdf { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px; background: #155e2c; color: #fff; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.rp-pdf svg { width: 14px; height: 14px; }
.rp-strip { display: flex; align-items: center; gap: 10px; padding-left: 2px; }
.rp-strip__no { width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; flex: none; background: #155e2c; color: #fff; font-size: 12.5px; font-weight: 600; }
.rp-strip__title { font-size: 12.5px; font-weight: 700; text-transform: uppercase; color: #43434f; white-space: nowrap; }
.rp-strip__line { flex: 1; height: 1px; background: #e2e1e9; }
.rp-hero { display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid #e2e1e9; border-radius: 16px; }
.rp-hero .rp-score { border-bottom: 1px solid #e2e1e9; }
.rp-score { display: flex; flex-direction: column; gap: 10px; padding: 18px 20px; }
.rp-score__label { font-size: 11px; font-weight: 600; text-transform: uppercase; color: #80808f; }
.rp-score__value { font-family: var(--font-display); font-weight: 700; font-size: 60px; line-height: 1.05; color: #1a1d1a; }
.rp-score__value span { font-size: 24px; color: #80808f; }
.rp-score__meta { margin-top: -6px !important; font-size: 12.5px; color: #80808f; }
.rp-sep { width: 100%; height: 1px; margin: 2px 0; border: 0; background: #e2e1e9; }
.rp-stat { display: flex; flex-direction: column; gap: 7px; }
.rp-stat__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; font-weight: 500; color: #43434f; }
.rp-stat__row b { font-size: 15px; color: #1a1d1a; }
.rp-bar { display: block; flex: none; height: 7px; overflow: hidden; border-radius: 999px; background: #e2e1e9; }
.rp-bar i { display: block; height: 100%; border-radius: inherit; background: #22c55e; }
.rp-bar--mini { width: 84px; }
.rp-mini { display: inline-flex; align-items: center; gap: 8px; }
.rp-mini b { min-width: 42px; text-align: right; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.rp-mini[data-tone="success"] b { color: #15803d; }
.rp-mini[data-tone="warning"] i { background: #a8741a; }
.rp-mini[data-tone="warning"] b { color: #b45309; }
.rp-mini[data-tone="error"] i { background: #ef4444; }
.rp-mini[data-tone="error"] b { color: #b91c1c; }
.rp-hero__analysis { display: flex; flex-direction: column; gap: 18px; padding: 18px 20px; }
.rp-ai { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; background: #fffbf5; border: 1px solid #fde6c3; border-radius: 14px; }
.rp-ai__head { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 700; }
.rp-ai__badge { padding: 2px 7px; border-radius: 6px; background: #0f401e; color: #fff; font-size: 10.5px; font-weight: 700; }
.rp-ai__lead { font-weight: 500; }
.rp-ai__point { display: flex; flex-direction: column; gap: 4px; padding-top: 12px; border-top: 1px solid #fde6c3; }
.rp-ai__title { font-size: 13.5px; font-weight: 600; }
.rp-ai__take { color: #5d5d6b; }
.rp-ai__take b { font-weight: 600; color: #1a1d1a; }
.rp-insights { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; }
.rp-insights > div { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.rp-kicker { font-size: 10.5px; font-weight: 700; text-transform: uppercase; color: #43434f; }
.rp-check { display: flex; align-items: flex-start; gap: 7px; font-size: 12.5px; font-weight: 500; line-height: 1.45; color: #43434f; }
.rp-check svg { width: 14px; height: 14px; margin-top: 2px; }
.rp-check > span { display: flex; flex-direction: column; }
.rp-check--ok svg { color: #16a34a; }
.rp-check--ask svg { color: #b45309; }
.rp-check--fail svg { color: #dc2626; }
.rp-jump { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: #155e2c; }
.rp-jump svg { width: 14px; height: 14px; }
.rp-disclaimer { display: flex; gap: 7px; font-size: 12px; line-height: 1.5; color: #80808f; }
.rp-disclaimer svg { width: 14px; height: 14px; margin-top: 2px; }
.rp-card { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; background: #fff; border: 1px solid #e2e1e9; border-radius: 16px; }
.rp-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.rp-card__title { display: flex; align-items: center; gap: 8px; font-family: var(--font-display); font-size: 17px; font-weight: 600; }
.rp-pill { padding: 3px 7px; border-radius: 6px; background: #f1f0f4; color: #43434f; font-family: var(--font-sans); font-size: 10px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.rp-expand { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: #43434f; }
.rp-expand svg { width: 13px; height: 13px; }
.rp-acc-list { display: flex; flex-direction: column; gap: 8px; }
.rp-acc { border: 1px solid #e2e1e9; border-radius: 12px; background: #fff; }
.rp-acc--warn { border-color: #fbd0d0; background: #fff8f8; }
.rp-acc__head { display: flex; align-items: center; gap: 10px; padding: 10px 12px; }
.rp-acc__title { flex: 1; min-width: 0; font-size: 13px; font-weight: 600; }
.rp-chev { color: #80808f; }
.rp-warn { display: flex; align-items: center; gap: 6px; padding: 0 12px 10px; font-size: 12px; font-weight: 600; color: #b91c1c; }
.rp-warn svg { width: 14px; height: 14px; }
.rp-table { overflow: hidden; background: #fff; border: 1px solid #e2e1e9; border-radius: 16px; }
.rp-table__head, .rp-task__row { display: grid; grid-template-columns: 26px minmax(0, 1fr) 86px 52px 42px 16px; gap: 10px; align-items: center; }
.rp-table__head { padding: 10px 14px; border-bottom: 1px solid #e2e1e9; font-size: 10.5px; font-weight: 600; text-transform: uppercase; color: #80808f; }
.rp-table__head span:first-child { grid-column: span 2; display: flex; align-items: center; gap: 10px; }
.rp-legend { display: inline-flex; align-items: center; gap: 5px; font-style: normal; text-transform: none; font-weight: 500; }
.rp-legend b { width: 9px; height: 9px; border-radius: 3px; background: #d6ead8; }
.rp-task + .rp-task { border-top: 1px solid #e2e1e9; }
.rp-task__row { padding: 12px 14px; align-items: start; }
.rp-task__no { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: #eaf4ed; color: #155e2c; font-size: 13px; font-weight: 700; }
.rp-task__title { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 13px; font-weight: 700; line-height: 1.4; }
.rp-task__tool { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 500; color: #80808f; }
.rp-task__tool svg { width: 12px; height: 12px; }
.rp-task__desc { margin-top: 4px !important; font-size: 12px; line-height: 1.5; color: #5d5d6b; }
.rp-status { justify-self: start; padding: 3px 9px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 11px; font-weight: 600; white-space: nowrap; }
.rp-task__time { font-size: 12px; color: #43434f; white-space: nowrap; }
.rp-task__score { font-size: 14px; font-weight: 700; }
.rp-task__score[data-tone="warning"] { color: #b45309; }
.rp-task__score[data-tone="error"] { color: #b91c1c; }
.rp-task__row > .rp-chev { margin-top: 5px; }
.rp-task__detail { display: grid; gap: 14px; padding: 2px 14px 16px 50px; }
.rp-finding { display: flex; flex-direction: column; gap: 8px; }
.rp-tags { display: flex; flex-wrap: wrap; gap: 3px 10px; margin-top: 3px; font-size: 11px; font-weight: 500; color: #80808f; }
.rp-tags span { display: inline-flex; align-items: center; gap: 4px; }
.rp-tags svg { width: 11px; height: 11px; margin: 0; }
.rp-questions { display: flex; flex-direction: column; gap: 10px; }
.rp-alert { display: flex; gap: 8px; padding: 12px 14px; border-radius: 12px; background: #eaf4ed; border: 1px solid #d6ead8; font-size: 12.5px; line-height: 1.5; color: #0f401e; }
.rp-alert svg { width: 16px; height: 16px; margin-top: 1px; }
.rp-q { display: flex; gap: 12px; padding: 14px 16px; background: #fff; border: 1px solid #e2e1e9; border-radius: 14px; }
.rp-q--warn { border-color: #fbd0d0; }
.rp-q__icon { width: 30px; height: 30px; flex: none; border-radius: 9px; display: grid; place-items: center; background: #eaf4ed; color: #16a34a; }
.rp-q--warn .rp-q__icon { background: #fef2f2; color: #dc2626; }
.rp-q__tag { font-size: 11.5px; font-weight: 600; color: #43434f; }
.rp-q__text { margin-top: 4px !important; font-size: 13.5px; font-weight: 600; line-height: 1.5; }
.rp-q__tip { display: flex; gap: 6px; margin-top: 8px !important; font-size: 12px; line-height: 1.5; color: #80808f; }
.rp-q__tip svg { width: 14px; height: 14px; margin-top: 2px; }
.rp--part { width: 100%; max-width: 680px; }
.rp-part { padding: 18px 20px; background: #fff; border: 1px solid #e2e1e9; border-radius: 16px; }
.rp-part--score { padding: 4px; }
.rp-part--score .rp-score { padding: 22px 24px; }
.b-scrolly--anatomia .rp--part > .rp-strip .rp-strip__title { color: rgba(233, 241, 234, 0.85); }
.b-scrolly--anatomia .rp--part > .rp-strip .rp-strip__line { background: rgba(214, 234, 216, 0.2); }
.b-scrolly--anatomia .rp--part > .rp-strip .rp-strip__no { background: var(--lime); color: var(--forest-900); }

/* Raport w oknie na górze strony pracodawcy: bez zakładek, kończy się na analizie cech. */
.b-rwin { display: flex; flex-direction: column; }
.b-rwin__body { max-height: 640px; overflow-y: auto; padding: 16px; background: #f8f7f9; overscroll-behavior: contain; scrollbar-width: thin; }
.b-rwin__fade { position: absolute; left: 0; right: 0; bottom: 0; height: 60px; pointer-events: none; background: linear-gradient(rgba(248, 247, 249, 0), #f8f7f9 80%); }
@media (max-width: 520px) { .b-rwin__body { max-height: 560px; padding: 10px; } .rp-score__value { font-size: 48px; } }

/* --- Mini-pulpit (ujęcia narzędzi w pokazach i w kolażu) ------------------------------ */
.mp {
  width: 100%; max-width: 680px; margin-inline: auto; display: flex; flex-direction: column; overflow: hidden;
  border-radius: 16px; font-family: var(--font-sans); font-size: 12px; line-height: 1.45; color: #1a1d1a; text-align: left;
  background: radial-gradient(60% 70% at 12% 8%, #e6dcf7, transparent 65%), radial-gradient(55% 60% at 92% 30%, #f6e2da, transparent 65%), linear-gradient(170deg, #eee8f6, #f3ece9 60%, #e9f0ea);
  box-shadow: 0 30px 60px -30px rgba(12, 30, 18, 0.45), 0 0 0 1px rgba(12, 30, 18, 0.06);
}
.mp svg { width: 12px; height: 12px; flex: none; }
.mp p { margin: 0; }
.mp__top { display: flex; align-items: center; gap: 10px; padding: 8px 12px; background: rgba(255, 255, 255, 0.74); border-bottom: 1px solid rgba(12, 30, 18, 0.06); }
.mp__brand { display: inline-flex; align-items: center; gap: 7px; margin-right: auto; font-size: 12px; font-weight: 600; }
.mp__brand i { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: #d56454; color: #fff; font-style: normal; font-size: 10px; font-weight: 700; }
.mp__meta { font-size: 11px; color: #5d5d6b; }
.mp__timer { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 999px; background: #fee2e2; color: #c0271f; font-size: 11px; font-weight: 600; }
.mp__end { display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 7px; background: #dc2626; color: #fff; font-size: 11px; font-weight: 600; }
.mp__desk { display: flex; gap: 12px; height: 346px; padding: 14px 14px 8px; }
.mp--solo .mp__desk { justify-content: flex-end; }
.mp__win { flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden; background: #fff; border-radius: 12px; box-shadow: 0 18px 40px -22px rgba(12, 30, 18, 0.45), 0 0 0 1px rgba(12, 30, 18, 0.06); }
.mp__winbar { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-bottom: 1px solid #f1f0f4; font-size: 12px; }
.mp__winbar .mp__wintile { width: 20px; height: 20px; border-radius: 6px; box-shadow: none; }
.mp__winbar .mp__wintile svg { width: 11px; height: 11px; }
.mp__winctl { margin-left: auto; display: inline-flex; gap: 5px; }
.mp__winctl i { width: 8px; height: 8px; border-radius: 50%; background: #e2e1e9; }
.mp__winbody { flex: 1; min-height: 0; overflow: hidden; }
.mp__panel { width: 240px; flex: none; overflow: hidden; border-radius: 12px; background: rgba(255, 255, 255, 0.95); box-shadow: 0 18px 40px -22px rgba(12, 30, 18, 0.45), 0 0 0 1px rgba(12, 30, 18, 0.06); }
.mp--solo .mp__panel { width: min(100%, 330px); }
.mp__dock { align-self: center; display: flex; align-items: center; gap: 6px; margin: 0 auto 10px; padding: 6px 8px; border-radius: 14px; background: rgba(255, 255, 255, 0.74); box-shadow: 0 10px 22px -14px rgba(12, 30, 18, 0.4); }
.mp__dock .b-tile--app { width: 26px; height: 26px; border-radius: 8px; box-shadow: none; transition: transform 0.3s var(--ease); }
.mp__dock .b-tile--app svg { width: 14px; height: 14px; }
.mp__dock .b-tile--app.is-on { transform: translateY(-3px); box-shadow: 0 0 0 2px #fff, 0 8px 14px -6px var(--g2); }
.mp__tasks { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 9px; background: #fff; font-size: 11px; font-weight: 600; }
.mp__sep { width: 1px; height: 18px; background: rgba(12, 30, 18, 0.12); }
.mp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 4px 9px; border-radius: 7px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.mp-btn--dark { background: #1a1d1a; color: #fff; }
.mp-btn--green { background: #155e2c; color: #fff; }
.mp-btn--light { background: #fff; color: #1a1d1a; box-shadow: inset 0 0 0 1px #e2e1e9; }
.mp-btn--block { width: 100%; padding: 7px 9px; }
.mp-btn.is-hot { box-shadow: 0 0 0 4px rgba(21, 94, 44, 0.18); }
/* zadania */
.mp-tasks { display: flex; flex-direction: column; gap: 8px; padding: 12px; }
.mp-tasks__head { display: flex; align-items: center; gap: 7px; font-size: 13px; }
.mp-tasks__head svg { width: 14px; height: 14px; }
.mp-tasks__prog { display: flex; justify-content: space-between; font-size: 11px; color: #43434f; }
.mp-tasks__bar { display: block; height: 5px; overflow: hidden; border-radius: 999px; background: #f1f0f4; }
.mp-tasks__bar i { display: block; height: 100%; background: #22c55e; }
.mp-tasks__sect { margin-top: 4px !important; font-size: 10px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: #80808f; }
.mp-tasks__sect span { font-weight: 500; }
.mp-task { display: flex; align-items: center; gap: 8px; padding: 9px; border-radius: 10px; border: 1px solid #ecebf0; background: #fff; }
.mp-task.is-on { border-color: #f3d9b1; background: #fffbf5; }
.mp-task__box { width: 14px; height: 14px; flex: none; border-radius: 4px; border: 1.5px solid #cfced8; display: grid; place-items: center; }
.mp-task__t { flex: 1; min-width: 0; font-size: 11.5px; font-weight: 600; line-height: 1.35; }
.mp-task__timer { display: inline-flex; align-items: center; gap: 3px; padding: 2px 6px; border-radius: 999px; background: #fee2e2; color: #c0271f; font-size: 10.5px; font-weight: 600; }
.mp-task.is-done { border-color: transparent; background: transparent; padding-inline: 2px; }
.mp-task.is-done .mp-task__box { border: 0; background: #22c55e; color: #fff; }
.mp-task.is-done .mp-task__box svg { width: 10px; height: 10px; }
.mp-task.is-done s { font-size: 11.5px; color: #5d5d6b; }
.mp-tasks__lock { display: flex; gap: 6px; padding: 9px; border-radius: 10px; border: 1px dashed #d4d3dc; font-size: 10.5px; line-height: 1.4; color: #5d5d6b; }
/* poczta */
.mp-mail { display: flex; height: 100%; }
.mp-mail__side { width: 118px; flex: none; display: flex; flex-direction: column; gap: 2px; padding: 10px 8px; border-right: 1px solid #f1f0f4; font-size: 11px; color: #43434f; }
.mp-mail__side .mp-btn { margin-bottom: 6px; }
.mp-mail__side > span:not(.mp-btn) { display: flex; justify-content: space-between; padding: 5px 7px; border-radius: 7px; }
.mp-mail__side > span.is-on { background: #f1f5ff; color: #1a1d1a; font-weight: 600; }
.mp-mail__side b { color: #2563eb; }
.mp-mail__list { flex: 1; min-width: 0; }
.mp-mail__head { display: flex; justify-content: space-between; padding: 8px 12px; border-bottom: 1px solid #f1f0f4; font-weight: 600; }
.mp-mail__head span { font-weight: 400; color: #80808f; }
.mp-mail__row { display: grid; grid-template-columns: 8px 92px minmax(0, 1fr) 34px; gap: 8px; align-items: center; padding: 9px 12px; border-bottom: 1px solid #f6f5f8; font-size: 11px; color: #5d5d6b; }
.mp-mail__row > i { width: 6px; height: 6px; border-radius: 50%; }
.mp-mail__row.is-unread > i { background: #2563eb; }
.mp-mail__row b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 500; color: #1a1d1a; }
.mp-mail__row.is-unread b { font-weight: 700; }
.mp-mail__row > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mp-mail__row strong { color: #1a1d1a; font-weight: 600; }
.mp-mail__row time { text-align: right; font-size: 10.5px; }
.mp-mail__row.is-on { background: #eef4ff; box-shadow: inset 3px 0 0 #2563eb; }
.mp-compose { display: flex; flex-direction: column; height: 100%; }
.mp-compose__row { display: flex; gap: 10px; padding: 8px 14px; border-bottom: 1px solid #f1f0f4; }
.mp-compose__row span { width: 44px; color: #80808f; }
.mp-compose__text { flex: 1; display: flex; flex-direction: column; gap: 7px; padding: 12px 14px; font-size: 12px; line-height: 1.55; }
.mp-compose__text i { display: block; height: 7px; border-radius: 4px; background: #eeedf2; }
.mp-compose__foot { display: flex; justify-content: flex-end; padding: 10px 14px; border-top: 1px solid #f1f0f4; }
/* komunikator i asystent */
.mp-chat { display: flex; height: 100%; }
.mp-chat__list { width: 170px; flex: none; display: flex; flex-direction: column; gap: 2px; padding: 8px; border-right: 1px solid #f1f0f4; }
.mp-chat__who { display: flex; align-items: center; gap: 8px; padding: 6px; border-radius: 9px; }
.mp-chat__who.is-on { background: #ecfdf3; }
.mp-chat__who i { width: 26px; height: 26px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #e2e1e9; font-style: normal; font-size: 10px; font-weight: 700; color: #43434f; }
.mp-chat__who.is-on i { background: #17a34b; color: #fff; }
.mp-chat__who b { display: block; font-size: 11px; }
.mp-chat__who em { display: block; font-style: normal; font-size: 10px; color: #80808f; }
.mp-chat__conv { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 12px; }
.mp-bubble { max-width: 86%; padding: 8px 11px; border-radius: 12px 12px 12px 4px; background: #f1f0f4; font-size: 11.5px; line-height: 1.45; }
.mp-bubble--me { align-self: flex-end; border-radius: 12px 12px 4px 12px; background: #dcfce7; }
.mp-bubble--ai { max-width: 94%; background: #f5f0ff; }
.mp-bubble--ai ol { margin: 4px 0; padding-left: 18px; }
.mp-bubble--ai p + p { margin-top: 4px; }
.mp-input { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto !important; padding: 6px 6px 6px 12px; border-radius: 10px; border: 1px solid #e2e1e9; color: #80808f; font-size: 11px; }
.mp-ai { display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 12px; }
.mp-ai__sub { font-size: 11px; color: #80808f; }
/* pliki */
.mp-files { padding: 12px; }
.mp-files__head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px !important; }
.mp-files__head span { font-size: 11px; color: #80808f; }
.mp-files__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.mp-file { display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: 9px; border: 1px solid #f1f0f4; font-size: 11px; font-weight: 500; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mp-file.is-on { border-color: #f3c96a; background: #fffaeb; box-shadow: 0 0 0 3px rgba(243, 201, 106, 0.25); }
.mp-file__ico { width: 24px; height: 24px; flex: none; border-radius: 6px; display: grid; place-items: center; font-style: normal; }
.mp-file__ico--pdf { background: #fee2e2; color: #dc2626; }
.mp-file__ico--xls { background: #dcfce7; color: #15803d; }
.mp-file__ico--doc { background: #dbeafe; color: #2563eb; }
/* CRM, ERP, przeglądarka */
.mp-crm, .mp-erp { padding: 10px 12px; }
.mp-crm__tabs, .mp-erp__nav, .mp-www__tabs, .mp-kurier__nav { display: flex; gap: 4px; margin-bottom: 8px !important; font-size: 11px; color: #5d5d6b; }
.mp-crm__tabs span, .mp-erp__nav span, .mp-kurier__nav span { padding: 4px 9px; border-radius: 7px; }
.mp-crm__tabs .is-on, .mp-erp__nav .is-on, .mp-kurier__nav .is-on { background: #f1f0f4; color: #1a1d1a; font-weight: 600; }
.mp-crm__chips { display: flex; gap: 5px; margin-bottom: 8px !important; font-size: 10.5px; }
.mp-crm__chips span { padding: 3px 8px; border-radius: 999px; border: 1px solid #e2e1e9; color: #43434f; }
.mp-crm__chips .is-on { border-color: #d97807; background: #fff7ed; color: #9a4f05; font-weight: 600; }
.mp-crm__group { margin: 6px 0 4px !important; font-size: 10px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: #80808f; }
.mp-crm__row { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1.2fr) minmax(0, 0.7fr) 66px; gap: 8px; padding: 7px 8px; border-radius: 8px; border: 1px solid #f1f0f4; margin-bottom: 4px; font-size: 10.5px; color: #43434f; }
.mp-crm__row span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mp-crm__row b { color: #1a1d1a; }
.mp-crm__row .is-late { color: #c0271f; font-weight: 600; }
.mp-erp__head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px !important; }
.mp-erp__head b { font-size: 13px; }
.mp-erp__head > span:nth-child(2) { color: #80808f; }
.mp-erp__head .mp-btn { margin-left: auto; }
.mp-table { width: 100%; border-collapse: collapse; font-size: 10.5px; }
.mp-table th { padding: 6px 8px; text-align: left; font-size: 9.5px; font-weight: 700; text-transform: uppercase; color: #80808f; background: #f8f7f9; }
.mp-table td { padding: 7px 8px; border-bottom: 1px solid #f1f0f4; white-space: nowrap; }
.mp-table td:last-child, .mp-table th:last-child { text-align: right; }
.mp-st { padding: 2px 7px; border-radius: 999px; font-size: 10px; font-weight: 600; }
.mp-st--zaks { background: #dcfce7; color: #15803d; }
.mp-st--zatw { background: #dbeafe; color: #1d4ed8; }
.mp-st--robo { background: #f1f0f4; color: #43434f; }
.mp-www { display: flex; flex-direction: column; height: 100%; }
.mp-www__tabs { margin: 0 !important; padding: 7px 10px 0; background: #f8f7f9; }
.mp-www__tabs span { padding: 5px 10px; border-radius: 8px 8px 0 0; }
.mp-www__tabs .is-on { background: #fff; color: #1a1d1a; font-weight: 600; }
.mp-www__url { display: flex; align-items: center; gap: 6px; margin: 8px 10px 0 !important; padding: 5px 10px; border-radius: 8px; background: #f1f0f4; font-size: 10.5px; color: #5d5d6b; }
.mp-kurier { display: flex; flex-direction: column; gap: 8px; padding: 10px 14px; }
.mp-kurier__nav { margin: 0 !important; }
.mp-kurier__title { font-size: 14px; }
.mp-kurier__sub { font-size: 11px; color: #5d5d6b; }
.mp-kurier__search { display: flex; gap: 6px; }
.mp-kurier__search > span:first-child { flex: 1; padding: 6px 10px; border-radius: 8px; border: 1px solid #e2e1e9; font-family: var(--font-mono); font-size: 11px; }
.mp-kurier__status { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 10px; background: #ecfeff; border: 1px solid #a5f3fc; }
.mp-kurier__status span { font-size: 10px; font-weight: 700; text-transform: uppercase; color: #0e7490; }
.mp-kurier__status b { font-size: 13px; }
.mp-kurier__status em { font-style: normal; font-size: 11px; color: #43434f; }
.mp-kurier__steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.mp-kstep { display: flex; flex-direction: column; gap: 5px; font-size: 10px; color: #80808f; }
.mp-kstep i { height: 4px; border-radius: 999px; background: #e2e1e9; }
.mp-kstep.is-done i { background: #0891b2; }
.mp-kstep.is-now { color: #0e7490; font-weight: 700; }
.mp-kstep.is-now i { background: linear-gradient(90deg, #0891b2 60%, #e2e1e9 60%); }
@media (max-width: 560px) {
  .mp__desk { height: 250px; padding: 10px 10px 6px; }
  .mp__meta, .mp__timer, .mp__end { display: none; }
  .mp__brand { margin-right: 0; }
  .mp-mail__side, .mp-chat__list { display: none; }
  .mp__panel { width: 100%; }
  .mp__dock .b-tile--app { width: 20px; height: 20px; border-radius: 6px; }
  .mp__dock .b-tile--app svg { width: 11px; height: 11px; }
  .mp__tasks, .mp__sep { display: none; }
  .mp-crm__row { grid-template-columns: minmax(0, 1fr) 60px; }
  .mp-crm__row span:nth-child(2), .mp-crm__row span:nth-child(3) { display: none; }
}

/* dymek z wynikiem i przełącznik widoczności */
.kf-score { display: flex; flex-direction: column; gap: 4px; width: 200px; padding: 16px 18px; border-radius: 16px; color: #fff; background: linear-gradient(160deg, #1c6d37, #0f401e 70%); box-shadow: 0 24px 48px -22px rgba(2, 21, 9, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.14); }
.kf-score__label { font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255, 255, 255, 0.66); }
.kf-score__value { margin: 0; font-family: var(--font-display); font-size: 44px; font-weight: 600; line-height: 1; }
.kf-score__value span { font-size: 18px; color: rgba(255, 255, 255, 0.7); }
.kf-score__sub { font-size: 11px; color: rgba(255, 255, 255, 0.8); }
.kf-vis { display: flex; align-items: center; gap: 10px; width: 240px; padding: 12px 14px; border-radius: 14px; background: #fff; box-shadow: 0 24px 48px -24px rgba(12, 30, 18, 0.45), 0 0 0 1px rgba(12, 30, 18, 0.06); }
.kf-vis b { display: block; font-size: 12.5px; }
.kf-vis i { display: block; font-style: normal; font-size: 11px; color: var(--ink-3); }
.b-toggle { width: 38px; height: 22px; border-radius: 999px; background: var(--forest-700); position: relative; flex: none; }
.b-toggle::after { content: ""; position: absolute; right: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; }
/* lista kandydatów pracodawcy */
.kl { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 16px; background: #f8f7f9; box-shadow: 0 30px 60px -30px rgba(12, 30, 18, 0.45), 0 0 0 1px rgba(12, 30, 18, 0.06); font-family: var(--font-sans); font-size: 12px; color: #1a1d1a; }
.kl p { margin: 0; }
.kl svg { width: 13px; height: 13px; flex: none; }
.kl-crumb { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: #155e2c; font-weight: 600; }
.kl-crumb span { color: #80808f; }
.kl-crumb b { color: #43434f; font-weight: 500; }
.kl-card { display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: 14px; background: #fff; border: 1px solid #e2e1e9; }
.kl-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.kl-title { font-family: var(--font-display); font-size: 18px; font-weight: 600; }
.kl-status { display: flex; align-items: center; gap: 8px; margin-top: 4px !important; font-size: 11px; color: #80808f; }
.kl-pill { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 999px; background: #dcfce7; color: #15803d; font-weight: 600; }
.kl-pill i { width: 6px; height: 6px; border-radius: 50%; background: #22c55e; }
.kl-actions { display: flex; gap: 6px; }
.kl-btn { display: inline-flex; align-items: center; gap: 5px; padding: 6px 11px; border-radius: 9px; border: 1px solid #e2e1e9; font-size: 11.5px; font-weight: 600; }
.kl-btn--primary { border-color: #155e2c; background: #155e2c; color: #fff; }
.kl-tools { display: flex; align-items: center; gap: 6px; font-size: 11px; color: #5d5d6b; }
.kl-tools > span { padding: 4px 9px; border-radius: 8px; }
.kl-tools > .is-on { background: #eaf4ed; color: #155e2c; font-weight: 600; }
.kl-search { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; border: 1px solid #e2e1e9; color: #80808f; }
.kl-table { display: flex; flex-direction: column; }
.kl-th, .kl-row { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1.1fr) 142px 118px; gap: 10px; align-items: center; }
.kl-th { padding: 6px 8px; font-size: 9.5px; font-weight: 700; text-transform: uppercase; color: #80808f; border-bottom: 1px solid #e2e1e9; }
.kl-row { padding: 9px 8px; border-bottom: 1px solid #f1f0f4; }
.kl-who { display: flex; align-items: center; gap: 8px; font-weight: 600; white-space: nowrap; overflow: hidden; }
.kl-who i { width: 26px; height: 26px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #eaf4ed; color: #155e2c; font-style: normal; font-size: 10px; font-weight: 700; }
.kl-time { font-size: 11px; color: #5d5d6b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kl-row .rp-mini b { font-size: 12.5px; min-width: 36px; }
.kl-row .rp-bar--mini { width: 70px; }
.kl-act { justify-self: end; padding: 5px 10px; border-radius: 8px; font-size: 11px; font-weight: 600; white-space: nowrap; color: #155e2c; background: #eaf4ed; }
.kl-act--lock { color: #fff; background: #155e2c; }

/* --- Profil i wynik kandydata --------------------------------------------------------------- */
.pf { display: flex; flex-direction: column; gap: 16px; }
.pf-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.pf-exp { font-size: 12px; color: var(--ink-4); }
.pf-who { display: flex; align-items: center; gap: 12px; }
.pf-who b { display: block; font-size: 16px; }
.pf-who em { display: block; font-style: normal; font-size: 13px; color: var(--ink-3); }
.pf-score { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 12px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pf-score__value { margin: 0; font-family: var(--font-display); font-size: 52px; font-weight: 700; line-height: 1; }
.pf-score__value span { font-size: 22px; color: var(--ink-4); }
.pf-score__cap { font-size: 13px; font-weight: 600; color: var(--ink-2); }
.pf-score__sub { flex-basis: 100%; font-size: 12px; color: var(--ink-4); }
.pf-block { display: flex; flex-direction: column; gap: 10px; }
.pf-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.pf-chip { padding: 4px 10px; border-radius: 999px; background: var(--mist); font-size: 12px; font-weight: 600; color: var(--ink-2); }

/* --- Strona kandydata: akcent fioletowy przy piktogramach i etykietach ------------------------ */
.v3b--cand .b-pillar__word, .v3b--cand .b-feat h3, .v3b--cand .b-plist b { color: #5b44a8; }

/* =============================================================================
   CENNIK (v3 C): plany, kalkulator kredytów z suwakiem, FAQ. Liczy jak okno „Doładuj kredyty”.
   ============================================================================= */
.b-price-hero {
  position: relative; padding: clamp(48px, 7vw, 96px) 0 clamp(32px, 4vw, 48px);
  background:
    radial-gradient(45% 80% at 85% 0%, rgba(199, 186, 232, 0.32), transparent 70%),
    radial-gradient(40% 70% at 10% 100%, rgba(182, 212, 186, 0.4), transparent 70%),
    var(--paper);
}
.b-price-hero .b-head { max-width: 860px; }
.b-price-hero__title { font-size: clamp(36px, 5vw, 64px); }
.b-price-hero__facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 8px 0 0; padding: 0; list-style: none; }
.b-price-hero__facts li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 11px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 14.5px; font-weight: 600; color: var(--ink-2); }
.b-price-hero__facts svg { width: 16px; height: 16px; color: var(--forest-600); }

.b-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2vw, 24px); align-items: stretch; }
.b-plan { display: flex; flex-direction: column; gap: 20px; padding: clamp(24px, 2.4vw, 32px); border-radius: 26px; background: #fff; box-shadow: inset 0 0 0 1px var(--line), var(--shadow-1); }
.b-plan__head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.b-plan__head h2 { margin: 0; font-family: var(--font-display); font-size: 22px; font-weight: 600; letter-spacing: -0.012em; color: var(--ink); }
.b-plan__badge { margin-left: auto; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: 0.02em; color: var(--forest-900); background: var(--lime); }
.b-plan__price { display: flex; flex-direction: column; gap: 4px; margin: 0; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.b-plan__price strong { font-family: var(--font-display); font-size: clamp(38px, 3.6vw, 50px); font-weight: 650; line-height: 1; letter-spacing: -0.03em; color: var(--ink); }
.b-plan__price span { font-size: 14.5px; color: var(--ink-3); }
.b-plan__list { display: flex; flex-direction: column; gap: 11px; margin: 0; padding: 0; list-style: none; }
.b-plan__list li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; font-size: 15px; line-height: 1.45; color: var(--ink-2); }
.b-plan__list svg { width: 18px; height: 18px; margin-top: 1px; color: var(--forest-600); }
.b-plan__cta { margin-top: auto; padding-top: 6px; }
.b-plan__cta .b-btn { width: 100%; }
.b-plan--pro {
  color: #e9f1ea; transform: translateY(-10px);
  background: radial-gradient(70% 60% at 100% 0%, rgba(200, 238, 122, 0.16), transparent 70%), linear-gradient(165deg, #134d27, #071a0e 80%);
  box-shadow: 0 0 0 1px rgba(200, 238, 122, 0.28), 0 40px 80px -40px rgba(7, 26, 14, 0.9);
}
.b-plan--pro .b-plan__head h2, .b-plan--pro .b-plan__price strong { color: #fff; }
.b-plan--pro .b-plan__price { border-color: rgba(214, 234, 216, 0.16); }
.b-plan--pro .b-plan__price span, .b-plan--pro .b-plan__list li { color: rgba(233, 241, 234, 0.82); }
.b-plan--pro .b-plan__list svg { color: var(--lime); }
.b-plans__note { margin: clamp(22px, 3vw, 32px) auto 0; max-width: 72ch; text-align: center; font-size: 14.5px; line-height: 1.6; color: var(--ink-3); }
.b-plans__note .b-link { font-size: 14.5px; }

.b-calc { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: clamp(20px, 3vw, 36px); margin-top: clamp(32px, 4vw, 48px); padding: clamp(20px, 3vw, 36px); border-radius: 30px; background: rgba(255, 255, 255, 0.04); box-shadow: inset 0 0 0 1px rgba(214, 234, 216, 0.14), 0 40px 90px -50px rgba(0, 0, 0, 0.8); backdrop-filter: blur(6px); }
.b-calc__main { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.b-calc__qty { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.b-calc__label { font-size: 16px; font-weight: 650; color: #fff; }
.b-stepper { display: inline-flex; align-items: center; border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(214, 234, 216, 0.22); }
.b-stepper button { display: grid; place-items: center; width: 46px; height: 46px; border: 0; border-radius: 50%; background: none; color: #fff; cursor: pointer; }
.b-stepper button:hover { background: rgba(214, 234, 216, 0.1); }
.b-stepper button:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
.b-stepper svg { width: 18px; height: 18px; }
.b-stepper input { width: 76px; height: 46px; border: 0; background: none; text-align: center; font: 700 22px/1 var(--font-display); color: #fff; -moz-appearance: textfield; appearance: textfield; }
.b-stepper input::-webkit-outer-spin-button, .b-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.b-stepper input:focus-visible { outline: 2px solid var(--lime); outline-offset: -2px; border-radius: 10px; }
.b-calc__slider { position: relative; padding: 8px 0 26px; --fill: calc(13px + (100% - 26px) * var(--f)); }
.b-calc__range { -webkit-appearance: none; appearance: none; display: block; width: 100%; height: 26px; margin: 0; background: none; cursor: pointer; }
.b-calc__range::-webkit-slider-runnable-track { height: 8px; border-radius: 99px; background: linear-gradient(to right, var(--lime) 0 var(--fill), rgba(214, 234, 216, 0.18) var(--fill) 100%); }
.b-calc__range::-webkit-slider-thumb { -webkit-appearance: none; width: 26px; height: 26px; margin-top: -9px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 5px rgba(200, 238, 122, 0.45), 0 6px 14px rgba(0, 0, 0, 0.45); transition: transform 0.15s ease; }
.b-calc__range:active::-webkit-slider-thumb { transform: scale(1.1); }
.b-calc__range::-moz-range-track { height: 8px; border-radius: 99px; background: rgba(214, 234, 216, 0.18); }
.b-calc__range::-moz-range-progress { height: 8px; border-radius: 99px; background: var(--lime); }
.b-calc__range::-moz-range-thumb { width: 26px; height: 26px; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 0 0 5px rgba(200, 238, 122, 0.45), 0 6px 14px rgba(0, 0, 0, 0.45); }
.b-calc__range:focus-visible { outline: none; }
.b-calc__range:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 5px var(--lime), 0 0 0 8px rgba(200, 238, 122, 0.35); }
.b-calc__range:focus-visible::-moz-range-thumb { box-shadow: 0 0 0 5px var(--lime), 0 0 0 8px rgba(200, 238, 122, 0.35); }
.b-calc__ticks { position: absolute; left: 0; right: 0; bottom: 0; height: 18px; }
.b-calc__tick { position: absolute; left: calc(13px + (100% - 26px) * var(--f)); transform: translateX(-50%); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; color: rgba(233, 241, 234, 0.72); }
.b-calc__hint { display: flex; align-items: center; gap: 8px; margin: -4px 0 0; font-size: 14px; color: rgba(233, 241, 234, 0.78); }
.b-calc__hint svg { width: 16px; height: 16px; color: var(--lime); }
.b-tiers { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.b-tier { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-radius: 14px; box-shadow: inset 0 0 0 1px rgba(214, 234, 216, 0.14); font-size: 15px; color: rgba(233, 241, 234, 0.82); transition: background 0.2s ease, box-shadow 0.2s ease, color 0.2s ease; }
.b-tier__price { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; color: #fff; }
.b-tier__off { padding: 2px 8px; border-radius: 999px; font-style: normal; font-size: 12px; font-weight: 700; color: var(--forest-900); background: var(--lime); }
.b-tier.is-on { color: #fff; background: rgba(200, 238, 122, 0.1); box-shadow: inset 0 0 0 1.5px var(--lime); font-weight: 650; }
.b-calc__sum { display: flex; flex-direction: column; gap: 14px; padding: clamp(20px, 2.4vw, 28px); border-radius: 22px; background: rgba(255, 255, 255, 0.06); box-shadow: inset 0 0 0 1px rgba(214, 234, 216, 0.12); }
.b-calc__kicker { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(233, 241, 234, 0.72); }
.b-calc__unit { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 0; }
.b-calc__unit strong { font-family: var(--font-display); font-size: clamp(44px, 4.6vw, 60px); font-weight: 650; line-height: 1; letter-spacing: -0.03em; color: #fff; }
.b-calc__unit span { font-size: 16px; color: rgba(233, 241, 234, 0.78); }
.b-calc__off { align-self: center; padding: 3px 9px; border-radius: 999px; font-style: normal; font-size: 13px; font-weight: 700; color: var(--forest-900); background: var(--lime); }
.b-calc__rows { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 0; }
.b-calc__rows div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 15px; }
.b-calc__rows dt { color: rgba(233, 241, 234, 0.78); }
.b-calc__rows dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; color: #fff; }
.b-calc__rows .b-calc__total { margin-top: 6px; padding-top: 12px; border-top: 1px solid rgba(214, 234, 216, 0.16); font-size: 17px; }
.b-calc__rows .b-calc__total dt { color: #fff; font-weight: 600; }
.b-calc__rows .b-calc__total dd { font-family: var(--font-display); font-size: 30px; font-weight: 650; letter-spacing: -0.02em; }
.b-calc__save { margin: 0; font-size: 14px; line-height: 1.5; color: var(--lime); }
.b-calc__pro { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; padding: 14px 16px; border-radius: 16px; background: rgba(200, 238, 122, 0.1); box-shadow: inset 0 0 0 1px rgba(200, 238, 122, 0.3); }
.b-calc__pro[hidden] { display: none; }
.b-calc__pro svg { width: 20px; height: 20px; margin-top: 2px; color: var(--lime); }
.b-calc__pro p { margin: 0; font-size: 14.5px; line-height: 1.5; color: rgba(233, 241, 234, 0.88); }
.b-calc__pro strong { color: #fff; }
.b-calc__sum .b-btn { width: 100%; margin-top: 4px; }
.b-calc__secure { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0; font-size: 13px; color: rgba(233, 241, 234, 0.72); }
.b-calc__secure svg { width: 15px; height: 15px; }
.b-calc__big { margin: 22px 0 0; text-align: center; font-size: 15px; color: rgba(233, 241, 234, 0.78); }
.b-calc__big a { color: var(--lime); font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1040px) { .b-plans { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; } .b-plan--pro { transform: none; } .b-calc { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .b-calc { padding: 16px; border-radius: 22px; } .b-calc__tick:nth-child(2) { display: none; } }

/* =============================================================================
   DOKUMENTY PRAWNE (v3 C): regulaminy, polityka prywatności, informacja o danych.
   Treść 1:1 z dokumentacji; tu tylko czytelność: spis treści, podsumowania, numeracja, druk.
   ============================================================================= */
.b-doc-hero {
  position: relative; padding: clamp(40px, 6vw, 76px) 0 clamp(26px, 3vw, 36px); border-bottom: 1px solid var(--line);
  background:
    radial-gradient(45% 80% at 90% 0%, rgba(199, 186, 232, 0.28), transparent 70%),
    radial-gradient(40% 70% at 0% 100%, rgba(182, 212, 186, 0.32), transparent 70%),
    var(--paper);
}
.b-doc-hero__title { margin: 14px 0 0; max-width: 24ch; font-family: var(--font-display); font-size: clamp(32px, 4.2vw, 54px); font-weight: 600; line-height: 1.06; letter-spacing: -0.028em; color: var(--ink); }
.b-doc-hero__row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 18px; }
.b-doc-hero__meta { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; color: var(--ink-3); }
.b-doc-hero__meta svg { width: 17px; height: 17px; color: var(--forest-600); }
.b-doc-hero__row .b-btn svg { width: 17px; height: 17px; }
.b-doc-switch { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.b-doc-switch a { padding: 8px 15px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 14px; font-weight: 600; color: var(--ink-2); transition: background 0.2s ease, color 0.2s ease; }
.b-doc-switch a:hover { color: var(--forest-700); background: var(--mist); }
.b-doc-switch a[aria-current="page"] { color: #fff; background: var(--forest-700); box-shadow: none; }

.b-doc { display: grid; grid-template-columns: minmax(0, 270px) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); padding-block: clamp(36px, 5vw, 64px) clamp(72px, 9vw, 120px); }
.b-doc__toc { position: sticky; top: calc(var(--header-h) + 24px); align-self: start; max-height: calc(100vh - var(--header-h) - 48px); overflow-y: auto; scrollbar-width: thin; }
.b-doc__tocbox summary { list-style: none; margin-bottom: 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-4); cursor: default; }
.b-doc__tocbox summary::-webkit-details-marker { display: none; }
.b-doc__toclist, .b-doc__toclist ol { margin: 0; padding: 0; list-style: none; }
.b-doc__toclist ol { margin: 2px 0 6px 12px; padding-left: 10px; border-left: 1px solid var(--line); }
.b-doc__toclist a { display: block; padding: 6px 10px; border-radius: 9px; font-size: 14px; line-height: 1.35; color: var(--ink-3); transition: background 0.2s ease, color 0.2s ease; }
.b-doc__toclist a:hover { color: var(--ink); background: var(--mist); }
.b-doc__toclist a.is-active { color: var(--forest-800); background: var(--mint-25, #f3f9f4); box-shadow: inset 2px 0 0 var(--forest-600); font-weight: 600; }

.b-doc__body { max-width: 76ch; font-size: 16px; line-height: 1.7; color: var(--ink-2); }
.b-doc__body > p:first-child { margin-top: 0; font-size: 17.5px; line-height: 1.65; color: var(--ink); }
.b-doc__body p { margin: 0 0 12px; }
.b-doc__body a { color: var(--forest-700); text-decoration: underline; text-decoration-color: rgba(21, 94, 44, 0.35); text-underline-offset: 3px; }
.b-doc__body a:hover { color: var(--forest-800); text-decoration-color: currentColor; }
.b-doc__ch { display: flex; align-items: flex-start; gap: 14px; margin: 56px 0 16px; scroll-margin-top: calc(var(--header-h) + 28px); font-family: var(--font-display); font-size: clamp(22px, 2.2vw, 28px); font-weight: 600; line-height: 1.2; letter-spacing: -0.016em; color: var(--ink); }
.b-doc__chno { flex: none; display: inline-grid; place-items: center; min-width: 36px; height: 36px; margin-top: -2px; padding: 0 8px; border-radius: 11px; font-size: 16px; font-weight: 700; color: var(--lime); background: linear-gradient(160deg, #1c6d37, #0f401e); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14); }
.b-doc__chno::before { content: attr(data-nr); }
.b-doc__ch--annex { margin-top: 72px; padding-top: 28px; border-top: 1px solid var(--line); }
.b-doc__sub { margin: 36px 0 12px; scroll-margin-top: calc(var(--header-h) + 28px); font-family: var(--font-display); font-size: 20px; font-weight: 600; line-height: 1.25; color: var(--ink); }
.b-doc__h4 { margin: 26px 0 10px; font-size: 16px; font-weight: 700; color: var(--ink); }
.b-doc__label { margin: 16px 0 6px !important; font-weight: 700; color: var(--ink); }
.b-doc__sum { display: flex; gap: 12px; margin: 0 0 20px; padding: 16px 18px; border-radius: 16px; background: var(--mint-25, #f3f9f4); box-shadow: inset 0 0 0 1px rgba(21, 94, 44, 0.14); }
.b-doc__sum svg { flex: none; width: 20px; height: 20px; margin-top: 3px; color: var(--forest-600); }
.b-doc__sum p { margin: 0; color: var(--ink); }
.b-doc__pt { display: grid; grid-template-columns: 3.4em minmax(0, 1fr); gap: 0 8px; margin: 0 0 10px; scroll-margin-top: calc(var(--header-h) + 28px); }
.b-doc__no { padding-top: 0; font-size: 14.5px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--ink-4); line-height: 1.85; }
.b-doc__txt > :last-child { margin-bottom: 0; }
.b-doc__abc { margin: 4px 0 10px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.b-doc__abc li { display: grid; grid-template-columns: 1.8em minmax(0, 1fr); }
.b-doc__abcno { font-weight: 600; color: var(--ink-4); }
.b-doc__list { margin: 4px 0 18px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.b-doc__list li { position: relative; padding-left: 22px; }
.b-doc__list li::before { content: ""; position: absolute; left: 4px; top: 0.72em; width: 7px; height: 7px; border-radius: 50%; background: var(--forest-600); }
.b-doc__table { overflow-x: auto; margin: 8px 0 24px; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--line); }
.b-doc__table table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.5; }
.b-doc__table th { padding: 11px 14px; text-align: left; font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-3); background: var(--mist); }
.b-doc__table td { padding: 12px 14px; vertical-align: top; border-top: 1px solid var(--line); }
.b-doc__date { margin-top: 40px !important; padding-top: 16px; border-top: 1px solid var(--line); font-size: 14px; color: var(--ink-4); }
.b-doc__form { display: flex; flex-direction: column; gap: 14px; padding: clamp(20px, 3vw, 32px); border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2), var(--shadow-2); }
.b-doc__form p { margin: 0; }
.b-doc__field { display: grid; grid-template-columns: auto minmax(80px, 1fr); align-items: end; gap: 10px; }
.b-doc__line { display: block; height: 1px; margin-bottom: 7px; border-bottom: 1.5px dotted var(--ink-4); }
@media (max-width: 960px) {
  .b-doc { grid-template-columns: 1fr; gap: 24px; }
  .b-doc__toc { position: static; max-height: none; padding: 14px 16px; border-radius: 16px; background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
  .b-doc__tocbox summary { margin: 0; cursor: pointer; display: flex; align-items: center; justify-content: space-between; }
  .b-doc__tocbox summary::after { content: "+"; font-size: 18px; font-weight: 600; color: var(--ink-3); }
  .b-doc__tocbox[open] summary { margin-bottom: 10px; }
  .b-doc__tocbox[open] summary::after { content: "−"; }
}
@media (max-width: 560px) {
  .b-doc-switch { flex-wrap: nowrap; overflow-x: auto; margin-inline: -20px; padding: 2px 20px 6px; scrollbar-width: none; }
  .b-doc-switch::-webkit-scrollbar { display: none; }
  .b-doc-switch a { flex: none; }
  .b-doc__pt { grid-template-columns: 1fr; }
  .b-doc__no { line-height: 1.4; }
  .b-doc__table table, .b-doc__table thead, .b-doc__table tbody, .b-doc__table tr, .b-doc__table td { display: block; }
  .b-doc__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .b-doc__table tr { padding: 10px 14px; border-top: 1px solid var(--line); }
  .b-doc__table tr:first-child { border-top: 0; }
  .b-doc__table td { padding: 3px 0; border: 0; }
  .b-doc__table td::before { content: attr(data-kol) ": "; font-weight: 700; color: var(--ink-3); }
}
@media print {
  .b-header, .b-mobnav, .b-footer, .tq-skip, .b-doc__toc, .b-doc-switch, .b-doc-hero .b-btn, .b-doc-hero .b-eyebrow { display: none !important; }
  .b-doc-hero { padding: 0 0 12px; background: none; border: 0; }
  .b-doc { display: block; padding: 0; }
  .b-doc__body { max-width: none; font-size: 11pt; }
  .b-doc__body a { color: inherit; text-decoration: none; }
  .b-doc__sum { background: none; box-shadow: inset 0 0 0 1px #bbb; }
  .b-doc__chno { color: #000; background: none; box-shadow: inset 0 0 0 1px #000; }
  .b-doc__ch, .b-doc__sub { break-after: avoid; }
  .b-doc__pt, .b-doc__sum, .b-doc__table tr { break-inside: avoid; }
}

/* =============================================================================
   KOLAŻE I KOMPOZYCJE
   Każdy blok „KOLAŻ: …” i „KOMPOZYCJA: …” jest samodzielny: przy pracy z Claude Design
   wymienia się cały blok (paczkę składa _zrodlo/pakuj-kolaze.py). Bloki stoją na końcu
   arkusza, więc na stronie i w paczce wygrywają z tymi samymi regułami.
   ============================================================================= */
/* --- Kolaże: wspólna mechanika ---------------------------------------------------------
   Scena 1200×900 px skalowana do szerokości kontenera; warstwy (.b-kolaz__base = okno w tle,
   .b-kolaz__f--* = karty z przodu) leżą absolutnie w pikselach sceny. Kompozycja każdego kolażu
   stoi w osobnym bloku „KOLAŻ: …” niżej — przy pracy z Claude Design wymienia się cały blok. */
.b-kolaz { position: relative; width: 100%; height: clamp(300px, 31vw, 450px); overflow: hidden; container-type: inline-size; }
.b-kolaz--static { height: auto; aspect-ratio: 1200 / 900; }
.b-kolaz__scene { position: absolute; left: 0; top: 0; width: 1200px; height: 900px; transform: scale(calc(100cqw / 1200px)); transform-origin: top left; }
.b-kolaz__base, .b-kolaz__f { position: absolute; transition: transform 0.6s var(--ease); }
.b-kolaz .rp-expand { display: none; }
/* Kolaże v5 zaprojektowano w podglądzie bez `assets/styles.css`, czyli bez globalnego `box-sizing: border-box`.
   W scenie liczymy więc wymiary po staremu (content-box) — tylko tak kolaże wyglądają 1:1 jak zaakceptowany projekt. */
.b-kolaz__scene *, .b-kolaz__scene *::before, .b-kolaz__scene *::after { box-sizing: content-box; }
@media (max-width: 899px) { .b-kolaz { height: auto; aspect-ratio: 1200 / 880; } }
.b-stage--kolaz { padding: clamp(10px, 1.6vw, 20px); }

/* ===== KOLAŻ: bramka — pracodawca (.b-kolaz--emp) — v5 ================================ */
/* Trzy karty bez nachodzenia, każda lekko obrócona (−1,5° / +1,5° / −1°), naprzemiennie.
   Lewa: lista (bohater). Prawa: podsumowanie AI nad „Analizą cech”. Całość w górnych ~740 px sceny. */
.b-kolaz--emp .b-kolaz__bg--glow { position: absolute; left: 0; top: 0; width: 1200px; height: 900px; pointer-events: none;
  background: radial-gradient(closest-side, rgba(200, 238, 122, 0.30), transparent) 640px 200px / 560px 560px no-repeat,
              radial-gradient(closest-side, rgba(182, 212, 186, 0.45), transparent) 0 0 / 900px 760px no-repeat; }
.b-kolaz--emp .b-kolaz__base { left: 32px; top: 186px; transform: rotate(-1.5deg); }
.b-kolaz--emp .b-kolaz__base > .kl { width: 370px; zoom: 1.6; padding: 4px; border-radius: 18px; background: #fff; }
.b-kolaz--emp .kl-card { border: 0; gap: 10px; }
.b-kolaz--emp .kl-row { grid-template-columns: minmax(0, 1fr) 116px; padding: 10px 8px; }
.b-kolaz--emp .kl-row:last-child { border-bottom: 0; }
.b-kolaz--emp .kz-hot { position: relative; z-index: 1; margin: 2px -8px; padding: 10px 16px; border-radius: 12px; border-bottom-color: transparent;
  background: #f3f9f4; box-shadow: 0 0 0 1.5px #155e2c, 0 14px 26px -16px rgba(12, 30, 18, 0.5); }
.b-kolaz--emp .b-kolaz__bg--ai { position: absolute; left: 676px; top: 28px; transform: rotate(1.5deg); transition: transform 0.6s var(--ease); }
.b-kolaz--emp .b-kolaz__bg--ai > .rp { width: 400px; zoom: 1.2; }
.b-kolaz--emp .b-kolaz__bg--ai .rp-ai { gap: 10px; background: #fff; border-color: #ecebf0; box-shadow: 0 40px 70px -32px rgba(12, 30, 18, 0.5), 0 2px 6px rgba(12, 30, 18, 0.05); }
.b-kolaz--emp .b-kolaz__bg--ai .rp-ai__lead { font-size: 12.5px; line-height: 1.55; color: #43434f; font-weight: 400; }
.b-kolaz--emp .b-kolaz__bg--ai .rp-ai__point { gap: 3px; padding-top: 10px; border-top-color: #f1f0f4; }
.b-kolaz--emp .b-kolaz__bg--ai .rp-ai__take { font-size: 12.5px; line-height: 1.5; }
.b-kolaz--emp .b-kolaz__f--card { left: 676px; top: 400px; transform: rotate(-1deg); }
.b-kolaz--emp .b-kolaz__f--card > .rp { width: 400px; zoom: 1.2; }
.b-kolaz--emp .b-kolaz__f--card .rp-card { box-shadow: 0 40px 70px -32px rgba(12, 30, 18, 0.5), 0 2px 6px rgba(12, 30, 18, 0.05); }
.b-kolaz--emp .rp-acc__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 12px; padding: 11px 14px 13px; }
.b-kolaz--emp .rp-acc__head > .rp-mini { display: contents; }
.b-kolaz--emp .rp-acc__head > svg { display: none; }
.b-kolaz--emp .rp-acc__title { grid-column: 1; grid-row: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.b-kolaz--emp .rp-acc__head .rp-mini b { grid-column: 2; grid-row: 1; min-width: 0; }
.b-kolaz--emp .rp-acc__head .rp-bar--mini { grid-column: 1 / -1; grid-row: 2; width: 100%; height: 6px; }
.b-kolaz--emp .rp-warn { padding: 0 14px 12px; }
@media (hover: hover) and (min-width: 900px) {
  .b-half:is(:hover, :focus-visible, .is-hover) .b-kolaz--emp .b-kolaz__base { transform: translateY(-10px) rotate(-1deg); }
  .b-half:is(:hover, :focus-visible, .is-hover) .b-kolaz--emp .b-kolaz__bg--ai { transform: translate(-4px, -8px) rotate(1deg); }
  .b-half:is(:hover, :focus-visible, .is-hover) .b-kolaz--emp .b-kolaz__f--card { transform: translate(-6px, -16px) rotate(-0.5deg); }
}

/* ===== KOLAŻ: bramka — kandydat (.b-kolaz--cand) — v5 ================================= */
/* Lustro kolażu 1: trzy karty bez nachodzenia, obroty −1,5° / +1,5° / −1°.
   Lewa: panel „Zadania” (bohater). Prawa: wirtualny pulpit nad certyfikatem. Całość w górnych ~740 px sceny. */
.b-kolaz--cand .b-kolaz__bg--glow { position: absolute; left: 0; top: 0; width: 1200px; height: 900px; pointer-events: none;
  background: radial-gradient(closest-side, rgba(241, 201, 190, 0.45), transparent) 640px 220px / 560px 560px no-repeat,
              radial-gradient(closest-side, rgba(199, 186, 232, 0.50), transparent) 0 0 / 900px 760px no-repeat; }
.b-kolaz--cand .b-kolaz__base { left: 32px; top: 150px; transform: rotate(-1.5deg); }
.b-kolaz--cand .b-kolaz__base > .kz-tasks { zoom: 1.6; }
.b-kolaz--cand .kz-tasks { width: 330px; padding: 4px; border-radius: 18px; background: #fff; font-family: var(--font-sans); font-size: 12px; line-height: 1.45; color: #1a1d1a;
  box-shadow: 0 30px 60px -30px rgba(12, 30, 18, 0.45), 0 0 0 1px rgba(12, 30, 18, 0.06); }
.b-kolaz--cand .kz-tasks p { margin: 0; }
.b-kolaz--cand .kz-tasks svg { width: 12px; height: 12px; flex: none; }
.b-kolaz--cand .kz-tasks .mp-tasks__head svg { width: 15px; height: 15px; }
.b-kolaz--cand .kz-tasks .mp-tasks__head b { font-family: var(--font-display); font-size: 16px; font-weight: 600; }
.b-kolaz--cand .mp-task { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; column-gap: 8px; row-gap: 8px; padding: 11px; }
.b-kolaz--cand .mp-task__t { grid-column: 2 / 4; font-size: 12.5px; text-wrap: pretty; }
.b-kolaz--cand .mp-task__timer { grid-column: 2; justify-self: start; }
.b-kolaz--cand .mp-task > .mp-btn { grid-column: 3; }
.b-kolaz--cand .b-kolaz__bg--desk { position: absolute; left: 626px; top: 40px; transform: rotate(1.5deg); transition: transform 0.6s var(--ease); }
.b-kolaz--cand .b-kolaz__bg--desk > .mp { width: 530px; max-width: none; zoom: 1; }
.b-kolaz--cand .b-kolaz__bg--desk .mp__brand { visibility: hidden; }
.b-kolaz--cand .b-kolaz__bg--desk .mp__desk { height: 214px; }
.b-kolaz--cand .b-kolaz__bg--desk .mp-mail__side { display: none; }
.b-kolaz--cand .b-kolaz__bg--desk .mp-mail__row { grid-template-columns: 8px 104px minmax(0, 1fr) 34px; }
.b-kolaz--cand .b-kolaz__f--cert { left: 680px; top: 396px; width: 460px; transform: rotate(-1deg); }
.b-kolaz--cand .b-kolaz__f--cert .mk-cert { box-shadow: 0 40px 70px -32px rgba(12, 30, 18, 0.5), 0 2px 6px rgba(12, 30, 18, 0.05); }
@media (hover: hover) and (min-width: 900px) {
  .b-half:is(:hover, :focus-visible, .is-hover) .b-kolaz--cand .b-kolaz__base { transform: translateY(-10px) rotate(-1deg); }
  .b-half:is(:hover, :focus-visible, .is-hover) .b-kolaz--cand .b-kolaz__bg--desk { transform: translate(-4px, -8px) rotate(1deg); }
  .b-half:is(:hover, :focus-visible, .is-hover) .b-kolaz--cand .b-kolaz__f--cert { transform: translate(-6px, -16px) rotate(-0.5deg); }
}

/* ===== KOLAŻ: strona pracodawcy — pulpit i raport (.b-kolaz--praca) — v3 minimalna ===== */
/* v4: wiersze cech o równej wysokości (nazwa + wynik, pasek pod spodem). Trzy kroki po przekątnej: „Zadania” (praca) → „Wynik kandydata” → „Analiza cech” (raport). */
.b-kolaz--praca .b-kolaz__bg--glow { position: absolute; left: 0; top: 0; width: 1200px; height: 900px; pointer-events: none;
  background: radial-gradient(closest-side, rgba(182, 212, 186, 0.6), transparent) 520px 280px / 660px 620px no-repeat, radial-gradient(closest-side, rgba(199, 186, 232, 0.45), transparent) 0 0 / 880px 700px no-repeat; }
.b-kolaz--praca .b-kolaz__base { left: 44px; top: 120px; transform: rotate(-1.5deg); }
.b-kolaz--praca .b-kolaz__base > .kz-tasks { zoom: 1.6; }
.b-kolaz--praca .kz-tasks { width: 330px; padding: 4px; border-radius: 18px; background: #fff; font-family: var(--font-sans); font-size: 12px; line-height: 1.45; color: #1a1d1a;
  box-shadow: 0 30px 60px -30px rgba(12, 30, 18, 0.45), 0 0 0 1px rgba(12, 30, 18, 0.06); }
.b-kolaz--praca .kz-tasks p { margin: 0; }
.b-kolaz--praca .kz-tasks svg { width: 12px; height: 12px; flex: none; }
.b-kolaz--praca .kz-tasks .mp-tasks__head svg { width: 15px; height: 15px; }
.b-kolaz--praca .kz-tasks .mp-tasks__head b { font-family: var(--font-display); font-size: 16px; font-weight: 600; }
.b-kolaz--praca .mp-task { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; column-gap: 8px; row-gap: 8px; padding: 11px; }
.b-kolaz--praca .mp-task__t { grid-column: 2 / 4; font-size: 12.5px; text-wrap: pretty; }
.b-kolaz--praca .mp-task__timer { grid-column: 2; justify-self: start; }
.b-kolaz--praca .mp-task > .mp-btn { grid-column: 3; }
.b-kolaz--praca .b-kolaz__f--path { left: 0; top: 0; width: 1200px; height: 900px; pointer-events: none; }
.b-kolaz--praca .b-kolaz__f--path svg { display: block; width: 1200px; height: 900px; }
.b-kolaz--praca .b-kolaz__f--score { left: 700px; top: 176px; transform: rotate(1.5deg); }
.b-kolaz--praca .b-kolaz__f--score > .kf-score { zoom: 1.5; }
.b-kolaz--praca .b-kolaz__f--card { left: 672px; top: 394px; transform: rotate(-1deg); }
.b-kolaz--praca .b-kolaz__f--card > .rp { width: 380px; zoom: 1.3; }
/* Wiersz cechy: nazwa i wynik w jednej linii, pasek pod spodem na całą szerokość — wiersze mają równą wysokość. */
.b-kolaz--praca .rp-acc__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 12px; padding: 11px 14px 13px; }
.b-kolaz--praca .rp-acc__head > .rp-mini { display: contents; }
.b-kolaz--praca .rp-acc__head > svg { display: none; }
.b-kolaz--praca .rp-acc__title { grid-column: 1; grid-row: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.b-kolaz--praca .rp-acc__head .rp-mini b { grid-column: 2; grid-row: 1; min-width: 0; }
.b-kolaz--praca .rp-acc__head .rp-bar--mini { grid-column: 1 / -1; grid-row: 2; width: 100%; height: 6px; }
.b-kolaz--praca .rp-warn { padding: 0 14px 12px; }
.b-kolaz--praca .b-kolaz__f--card .rp-card { box-shadow: 0 40px 70px -30px rgba(12, 30, 18, 0.5), 0 2px 6px rgba(12, 30, 18, 0.05); }

/* ===== KOMPOZYCJA: strona główna — CV i raport (.b-cvill) ========================================== */
.b-cvill { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1.08fr); align-items: center; gap: 6px; padding: 12px 0; }
.b-cvill__cv { display: flex; flex-direction: column; gap: 9px; padding: 20px; border-radius: 16px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-2); transform: rotate(-3deg); filter: grayscale(1); }
.b-cvill__head { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; }
.b-cvill__photo { width: 44px; height: 44px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #eef0ee; color: #9aa09b; }
.b-cvill__photo svg { width: 22px; height: 22px; }
.b-cvill__head b { display: block; font-size: 15px; }
.b-cvill__head em { display: block; font-style: normal; font-size: 12px; color: var(--ink-4); }
.b-cvill__label { margin-top: 6px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-4); }
.b-cvill__line { display: block; height: 7px; border-radius: 4px; background: #e8ebe8; }
.b-cvill__claims { display: flex; flex-wrap: wrap; gap: 6px; }
.b-cvill__claim { display: inline-flex; align-items: center; gap: 6px; padding: 5px 6px 5px 10px; border-radius: 999px; background: #f1f3f1; font-size: 12px; font-weight: 600; color: var(--ink-2); }
.b-cvill__claim b { width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center; background: #cfd4cf; color: #fff; font-size: 10px; }
.b-cvill__arrow { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; justify-self: center; background: var(--lime); color: var(--forest-900); box-shadow: 0 0 0 7px rgba(200, 238, 122, 0.25); position: relative; z-index: 1; }
.b-cvill__arrow svg { width: 22px; height: 22px; }
.b-cvill__rep { position: relative; padding: 18px; border-radius: 16px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-3); transform: rotate(2deg); gap: 10px; }
.b-cvill__rep .rp-card__title { font-size: 15px; }
.b-cvill__badge { position: absolute; top: -14px; right: -12px; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--forest-700); color: var(--lime); box-shadow: 0 8px 16px -8px rgba(15, 64, 30, 0.8); }
.b-cvill__badge svg { width: 18px; height: 18px; }
@media (max-width: 640px) { .b-cvill { grid-template-columns: 1fr; gap: 14px; } .b-cvill__arrow { transform: rotate(90deg); } }
.b-cvill__rep .rp-acc__head { flex-wrap: wrap; row-gap: 6px; }
.b-cvill__rep .rp-acc__title { flex-basis: 100%; }
.b-cvill__rep .rp-mini { flex: 1; }
.b-cvill__rep .rp-bar--mini { flex: 1; width: auto; }

/* ===== KOMPOZYCJA: kandydat — hero, certyfikat i widoczność (.b-certstage) ========================= */
.b-certstage { position: relative; perspective: 1400px; padding: clamp(18px, 3vw, 36px) clamp(8px, 2vw, 24px) clamp(56px, 6vw, 72px); }
.b-certstage .mk-cert { transform: rotateY(-9deg) rotateX(5deg) rotate(1deg); transform-origin: 60% 50%; box-shadow: 0 50px 90px -40px rgba(12, 30, 18, 0.5), 0 6px 16px rgba(12, 30, 18, 0.08); transition: transform 0.6s var(--ease); }
.b-certstage:hover .mk-cert { transform: rotateY(-4deg) rotateX(2deg); }
.b-certstage__float {
  position: absolute; left: 0; bottom: 10px; z-index: 2; width: min(330px, 70%);
  display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px;
  background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-3);
}
.b-certstage__float b { display: block; font-size: 14px; }
.b-certstage__float i { display: block; font-style: normal; font-size: 12.5px; color: var(--ink-3); }
.b-certstage__badge { position: absolute; right: 6%; top: 0; z-index: 2; }
@media (prefers-reduced-motion: reduce) { .b-certstage .mk-cert { transform: none; } }

/* ===== KOMPOZYCJA: kandydat — słowa z CV i sprawdzenie (.b-claims) ================================= */
.b-claims { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1fr); gap: 10px; align-items: center; }
.b-claims__cv, .b-claims__proof { display: flex; flex-direction: column; gap: 10px; padding: 20px; border-radius: 18px; }
.b-claims__cv { background: #fff; border: 1px dashed var(--line-2); transform: rotate(-2deg); }
.b-claims__proof { background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-3); transform: rotate(1.5deg); }
.b-claims__tag { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-4); }
.b-claim { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 10px; background: var(--mist); font-size: 14px; font-weight: 600; color: var(--ink-2); }
.b-claim svg { width: 16px; height: 16px; color: var(--ink-4); flex: none; }
.b-claims__arrow { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: var(--lime); color: var(--forest-900); box-shadow: 0 0 0 7px rgba(200, 238, 122, 0.25); justify-self: center; }
.b-claims__arrow svg { width: 22px; height: 22px; }
@media (max-width: 640px) { .b-claims { grid-template-columns: 1fr; } .b-claims__arrow { transform: rotate(90deg); } }
.b-claims__proof.rp { gap: 8px; }
.b-claims__proof .rp-acc__head { flex-wrap: wrap; row-gap: 6px; }
.b-claims__proof .rp-acc__title { flex-basis: 100%; }
.b-claims__proof .rp-mini { flex: 1; }
.b-claims__proof .rp-bar--mini { flex: 1; width: auto; }

/* ===== KOMPOZYCJA: kandydat — kolejne podejścia (.b-quotecard) ===================================== */
.b-growth { display: flex; align-items: flex-end; gap: 12px; height: 210px; padding: 0 4px; }
.b-try { position: relative; flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 18px; background: #fff; box-shadow: var(--shadow-2); border: 1px solid var(--line); }
.b-try:nth-child(1) { margin-bottom: 0; opacity: 0.75; }
.b-try:nth-child(2) { margin-bottom: 36px; opacity: 0.9; }
.b-try:nth-child(3) { margin-bottom: 74px; }
.b-try__ring { display: block; width: 44px; height: 44px; border-radius: 50%; background: conic-gradient(var(--forest-500) calc(var(--v) * 1%), #e6ece7 0); -webkit-mask: radial-gradient(circle, transparent 13px, #000 14px); mask: radial-gradient(circle, transparent 13px, #000 14px); }
.b-try__bar { display: block; height: 8px; border-radius: 4px; background: linear-gradient(90deg, var(--mint-200) var(--w), #edf0ed var(--w)); }
.b-try--best { border-color: rgba(150, 200, 60, 0.55); box-shadow: 0 0 0 4px rgba(200, 238, 122, 0.35), 0 22px 40px -20px rgba(90, 130, 20, 0.55); }
.b-try--best .b-try__ring { background: conic-gradient(var(--forest-700) calc(var(--v) * 1%), #e6ece7 0); }
.b-try--best .b-try__bar { background: linear-gradient(90deg, var(--lime-2) var(--w), #edf0ed var(--w)); }
.b-try__badge { position: absolute; top: -14px; right: -12px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--forest-700); color: var(--lime); box-shadow: 0 8px 16px -8px rgba(15, 64, 30, 0.8); }
.b-try__badge svg { width: 18px; height: 18px; }
.b-quotecard { display: flex; flex-direction: column; gap: 22px; padding: clamp(26px, 3.2vw, 44px); border-radius: var(--r-2xl); background: rgba(255, 255, 255, 0.72); border: 1px solid rgba(255, 255, 255, 0.95); box-shadow: var(--shadow-2); }

/* ===== KOMPOZYCJA: kandydat — wynik i certyfikat (.b-result) ======================================= */
.b-result { position: relative; }
.b-result .tq-card { border: 0; box-shadow: none; padding: 22px; }
.b-result__cert { position: absolute; right: -18px; bottom: -36px; width: 46%; z-index: 2; transform: rotate(3deg); }
.b-result__cert .mk-cert { box-shadow: 0 30px 60px -28px rgba(12, 30, 18, 0.55); }
@media (max-width: 960px) { .b-result__cert { position: relative; right: auto; bottom: auto; width: 70%; margin: -24px 0 0 auto; } }

/* ===== koniec bloków kolaży i kompozycji =========================================================== */

/* Link „Kontakt” przewija płynnie, chyba że ktoś wyłączył animacje. */
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

/* Szacunek dla ustawień dostępności. */
@media (prefers-reduced-motion: reduce) {
  .v3b *, .v3b *::before, .v3b *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
  [data-reveal] { opacity: 1; transform: none; }
}

/* =============================================================================
   PROJEKT DOFINANSOWANY Z FUNDUSZY EUROPEJSKICH — opis projektu wg podręcznika FE 2021-2027 (s. 35)
   ============================================================================= */
.b-ue { padding-block: clamp(32px, 4vw, 56px) clamp(64px, 8vw, 104px); }
.b-ue__body { max-width: 760px; }
.b-ue__znaki { padding: 20px 24px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
.b-ue__znaki img { display: block; width: 100%; height: auto; }
.b-ue__body p, .b-ue__body li { font-size: 17px; line-height: 1.65; color: var(--ink-2); }
.b-ue__body p { margin: 16px 0 0; }
.b-ue__body .b-ue__lead { margin-top: 28px; font-size: 19px; font-weight: 500; color: var(--ink); }
.b-ue__body h2 { margin: 36px 0 0; font-family: var(--font-display); font-size: 24px; font-weight: 600; line-height: 1.2; letter-spacing: -0.014em; color: var(--ink); }
.b-ue__body ul { margin: 14px 0 0; padding-left: 22px; }
.b-ue__body li + li { margin-top: 6px; }
.b-ue__kwoty { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 36px 0 0; }
.b-ue__kwoty div { padding: 18px 20px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
.b-ue__kwoty dt { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-3); }
.b-ue__kwoty dd { margin: 6px 0 0; font-family: var(--font-display); font-size: 26px; font-weight: 600; color: var(--ink); }
@media (max-width: 560px) { .b-ue__kwoty { grid-template-columns: 1fr; } }

/* =============================================================================
   TELEFON: makiety w wąskich kartach (PO 01.10 — „rozlatuje się tekst”)
   Układ zmienia się według szerokości samej makiety (container queries), nie ekranu,
   więc wersja na komputer zostaje bez zmian.
   ============================================================================= */

/* Karuzele na telefonie: karta kończy się tam, gdzie jej treść — bez ciemnych pustych pól
   pod krótszymi kartami. Długie fragmenty raportu są ucięte łagodnym wygaszeniem
   (gradient w pikselach, więc krótsze fragmenty nie bledną). */
@media (max-width: 960px) {
  .b-scrolly--pokaz .b-scrolly__steps { align-items: flex-start; }
  /* Anatomia raportu (PO 01.10): wszystkie karty tej samej wysokości. Okno z fragmentem raportu ma stałą
     wysokość i stoi u dołu karty, różnicę długości opisu przejmuje odstęp nad nim (3. wiersz siatki,
     obok numeru). Krótki fragment stoi pośrodku okna, dłuższy (klasa is-cut z v3b.js) dostaje wygaszenie. */
  .b-scrolly--anatomia .b-scrolly__steps { align-items: stretch; }
  .b-scrolly--anatomia .b-sstep { grid-template-rows: auto auto 1fr auto; align-content: stretch; }
  .b-scrolly--anatomia .b-sstep__inline .rp--part { height: 430px; overflow: hidden; }
  .b-scrolly--anatomia .b-sstep__inline .rp--part > * { flex-shrink: 0; }  /* tabela nie ściska się do okna */
  .b-scrolly--anatomia .b-sstep__inline .rp--part > :first-child { margin-top: auto; }
  .b-scrolly--anatomia .b-sstep__inline .rp--part > :last-child { margin-bottom: auto; }
  .b-scrolly--anatomia .b-sstep__inline .rp--part.is-cut {
    -webkit-mask-image: linear-gradient(#000 340px, transparent 430px); mask-image: linear-gradient(#000 340px, transparent 430px);
  }
}

/* Raport: fragmenty jak w aplikacji pracodawcy na wąskim ekranie. Kontenerem są tylko fragmenty
   raportu (sekcja o raporcie i okno raportu na górze strony pracodawcy) — kompozycje z Claude Design
   („CV → analiza cech”) też używają klas .rp i zostają 1:1. */
/* Kontenery tylko poniżej 960 px: na komputerze żadna reguła z tej części nie może zadziałać
   (panel zadań w kroku „Kandydat pracuje” ma tam 326 px, okno raportu na górze ok. 380 px). */
@media (max-width: 960px) {
  .rp--part, .b-rwin__body > .rp { container: tq-makieta / inline-size; }
}
@container tq-makieta (max-width: 380px) {
  /* Analiza cech: nazwa (i strzałka) w pierwszym wierszu na prawie całą szerokość, pod spodem pasek
     z wynikiem — jak w kompozycji „CV → analiza cech”. Wynik obok nazwy nie mieścił się przy 375 px:
     „Komunikatywność” ma ok. 118 px, a na nazwę zostawało 107 px. */
  .rp-acc__head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 7px 10px; padding: 10px 11px; }
  .rp-acc__head > .rp-mini { display: contents; }
  .rp-acc__title { grid-column: 1; grid-row: 1; }
  .rp-acc__head > .rp-chev { grid-column: 2; grid-row: 1; justify-self: end; }
  .rp-acc__head .rp-bar { grid-column: 1; grid-row: 2; width: auto; }
  .rp-acc__head .rp-mini b { grid-column: 2; grid-row: 2; min-width: 0; font-size: 13.5px; }
  .rp-card { padding: 14px 14px; }
  .rp-card__head { flex-wrap: wrap; row-gap: 6px; }
  .rp-card__title { white-space: nowrap; }
  .rp-strip__title { white-space: normal; line-height: 1.3; }
}
/* Najwęższe telefony (320–360 px): makieta raportu ciaśniej, żeby najdłuższe słowa
   („Komunikatywność”, „Podsumowanie”) mieściły się w swoich polach. */
@container tq-makieta (max-width: 250px) {
  .rp { font-size: 12.5px; }
  .rp-part, .rp-card { padding: 12px; }
  .rp-card__title { flex-wrap: wrap; row-gap: 4px; white-space: normal; font-size: 15.5px; }
  .rp-acc__head { grid-template-columns: minmax(0, 1fr) auto auto; padding: 9px; gap: 6px 8px; }
  .rp-acc__title { grid-column: 1 / -1; font-size: 12.5px; }
  .rp-acc__head > .rp-chev { grid-column: 3; grid-row: 2; }
  .rp-ai { padding: 12px; gap: 10px; }
  .rp-ai__head { gap: 8px; font-size: 13.5px; }
  .rp-ai__title { font-size: 12.5px; }
  .rp-q { padding: 12px; gap: 10px; }
  .rp-q__text { font-size: 12.5px; }
}
/* Szczegółowa analiza zadań: zamiast tabeli karta zadania — tytuł i opis na całą szerokość,
   pod spodem status, czas i wynik z małymi etykietami (TQ-employer report-view.scss, @container 56rem). */
@container tq-makieta (max-width: 520px) {
  .rp-table__head { display: none; }
  /* Numer w lewym marginesie, więc tytuł, opis i wiersz z wynikiem zaczynają się w jednej linii. */
  .rp-task__row { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding-left: 52px; }
  .rp-task__no { position: absolute; left: 14px; top: 12px; }
  .rp-task__info { flex: 1 1 100%; min-width: 0; }
  .rp-task__time, .rp-task__score { display: inline-flex; align-items: baseline; gap: 5px; }
  .rp-task__time::before, .rp-task__score::before {
    content: attr(data-label); font-size: 10px; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase; color: #80808f;
  }
  .rp-task__row > .rp-chev { margin: 0 0 0 auto; }
  .rp-task__detail { padding: 2px 14px 16px 52px; }
}

/* Okna aplikacji w pokazach: paski zakładek i filtrów zachowują się jak przewijane paski
   w aplikacji na telefonie (jedna linia, wygaszony brzeg), zamiast łamać się w pół słowa. */
@media (max-width: 960px) {
  .mp__winbody { container: tq-makieta / inline-size; }
}
@container tq-makieta (max-width: 330px) {
  .mp-crm__tabs, .mp-erp__nav, .mp-www__tabs, .mp-kurier__nav, .mp-crm__chips {
    flex-wrap: nowrap; overflow: hidden; white-space: nowrap;
    -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent);
  }
  .mp-crm__tabs > span, .mp-erp__nav > span, .mp-www__tabs > span, .mp-kurier__nav > span, .mp-crm__chips > span { flex: none; }
  .mp-erp__head { flex-wrap: wrap; row-gap: 6px; }
  .mp-erp__head b { white-space: nowrap; }
  .mp-table th:nth-child(n+3), .mp-table td:nth-child(n+3) { display: none; }
  .mp-kurier__search > span:first-child { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mp-www__url { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mp-kurier__steps { display: none; }
  .mp-files__grid { grid-template-columns: 1fr; }
  .mp-task { flex-wrap: wrap; }
  .mp-task__t, .mp-task.is-done s { flex: 1 1 calc(100% - 22px); min-width: 0; }
  .mp-task > :nth-child(3) { margin-left: auto; }
}

/* Panel zadań obok okna: kontenerem tylko na telefonie — na komputerze panel ma stałe 240 px
   i zostaje w obecnym układzie. */
@media (max-width: 960px) {
  .mp__panel { container: tq-makieta / inline-size; }
}

/* Krok „Kandydat pracuje”: przyciski pod tytułem zadania, a nie obok w wąskiej kolumnie. */
@media (max-width: 960px) {
  .b-vig__panel { container: tq-makieta / inline-size; }
}
@container tq-makieta (max-width: 330px) {
  .b-vig__task { flex-wrap: wrap; }
  .b-vig__task-t { flex: 1 1 100%; }
  .b-vig__task > :nth-child(2) { margin-left: auto; }
}

/* Krok „Wyślij link”: na telefonie zwykły układ zamiast pomniejszonego ekranu 880 px
   (przy 300 px tekst miał ok. 6 px). */
@media (max-width: 600px) {
  .b-vig .tq-zapros { aspect-ratio: auto; }
  .b-vig .tq-zapros__scena { width: auto; height: auto; transform: none; padding: 26px 16px; gap: 12px; }
  .b-vig .tq-zapros__ikona { width: 46px; height: 46px; border-radius: 13px; }
  .b-vig .tq-zapros__ikona svg { width: 23px; height: 23px; }
  .b-vig .tq-zapros__tytul { font-size: 18px; }
  .b-vig .tq-zapros__lead { font-size: 13.5px; }
  .b-vig .tq-zapros__lead br { display: none; }
  .b-vig .tq-zapros__akcja { flex-direction: column; align-items: stretch; width: 100%; gap: 8px; }
  .b-vig .tq-zapros__pole, .b-vig .tq-zapros__btn { height: 42px; padding: 0 14px; gap: 8px; font-size: 12.5px; justify-content: center; }
  .b-vig .tq-zapros__pole { display: block; line-height: 39px; overflow: hidden; text-overflow: ellipsis; font-size: 11.5px; }
  .b-vig .tq-zapros__pole svg { display: inline; vertical-align: middle; margin: -2px 6px 0 0; width: 15px; height: 15px; }
  .b-vig .tq-zapros__btn svg { width: 16px; height: 16px; }
  .b-vig .tq-zapros__potw { font-size: 12.5px; }
}

/* --- Baner zgody na cookies (zgoda.js) ---------------------------------------------------
   Oba przyciski wyglądają tak samo: odmowa ma być równie łatwa jak zgoda. */
.tq-zgoda {
  position: fixed; z-index: 70; left: 16px; bottom: 16px; width: min(560px, calc(100% - 32px));
  padding: 20px 22px; border: 1px solid var(--line-2); border-radius: var(--r-lg);
  background: var(--paper); color: var(--ink-2); box-shadow: var(--shadow-3);
  font-size: 15px; line-height: 1.55; max-height: calc(100vh - 32px); overflow-y: auto;
}
.tq-zgoda[hidden] { display: none; }
.tq-zgoda p { margin: 0 0 8px; }
.tq-zgoda__tytul { font-size: 16.5px; font-weight: 700; color: var(--ink); }
.tq-zgoda a { color: var(--forest-700); text-decoration: underline; text-underline-offset: 2px; }
.tq-zgoda__stan { font-weight: 600; color: var(--ink); }
.tq-zgoda__przyciski { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }
.tq-zgoda__przyciski .b-btn { flex: 1 1 140px; }
.tq-zgoda__rozwin {
  padding: 8px 4px; border: 0; background: none; font: inherit; font-weight: 600; color: var(--forest-700);
  text-decoration: underline; text-underline-offset: 2px; cursor: pointer;
}
.tq-zgoda__szczegoly { margin: 4px 0 8px; padding: 12px 14px; border-radius: var(--r-sm); background: var(--mint-25); font-size: 14.5px; }
.tq-zgoda__szczegoly[hidden] { display: none; }
.tq-zgoda__szczegoly p:last-child { margin-bottom: 0; }
.tq-zgoda__szczegoly strong { color: var(--ink); }
@media (prefers-reduced-motion: no-preference) {
  .tq-zgoda { animation: tq-zgoda-wjazd 0.3s var(--ease); }
  @keyframes tq-zgoda-wjazd { from { opacity: 0; transform: translateY(12px); } }
}
/* „Ustawienia cookies” w stopce: przycisk, który wygląda jak sąsiednie linki. */
.b-footer__zgoda { align-self: flex-start; padding: 0; border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.b-footer__zgoda:hover { color: var(--lime); }
.no-js .b-footer__zgoda { display: none; }