/* ==========================================================================
   Rodzina B — Strona główna (front-page.php)
   Źródło: Figma „Home” desktop 1440 (14841:31411, węzły REST) i mobile 375 (14910:3820, węzły REST).
   Parametry sekcji (szerokość treści, przesunięcie, paddingi) pochodzą z absoluteBoundingBox węzłów Figmy.
   Prefiksy: .kr-hero, .kr-stats, .kr-hp-* (wspólne), .kr-card, .kr-services, .kr-case-study, .kr-info,
   .kr-steps, .kr-why, .kr-opinions, .kr-contact, .kr-posts.
   ========================================================================== */

body.home {
  --kr-hp-gut: clamp(24px, calc(24px + (100vw - 375px) * .1014), 96px); /* 24 px (mobile) -> 96 px (>=1080) */
  --kr-hp-py: clamp(64px, calc(64px + (100vw - 375px) * .06), 128px);
  --kr-hp-gap: 24px;
  --kr-hp-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.2328 4.70617C10.2575 4.71436 10.2785 4.73198 10.2904 4.755V4.75597L13.8891 11.9532C13.896 11.9671 13.8998 11.9826 13.8998 11.9982C13.8998 12.0136 13.896 12.0293 13.8891 12.0431L10.2904 19.2403L10.2895 19.2433C10.2837 19.255 10.2749 19.2649 10.265 19.2736C10.2552 19.2821 10.2442 19.2889 10.2318 19.2931C10.2194 19.2973 10.2059 19.2999 10.1928 19.2989C10.1796 19.298 10.1665 19.2941 10.1547 19.2882C10.143 19.2823 10.1329 19.2737 10.1244 19.2638C10.1159 19.2538 10.109 19.2421 10.1049 19.2296C10.1009 19.2173 10.099 19.2044 10.1 19.1915C10.101 19.1784 10.1048 19.1652 10.1107 19.1534L10.1127 19.1495L13.5756 12.2218L13.6879 11.9982L13.5756 11.7745L10.1127 4.84582L10.102 4.80773C10.1011 4.795 10.1028 4.78199 10.1068 4.76964C10.1152 4.74454 10.134 4.72388 10.1576 4.71203C10.181 4.70039 10.208 4.69804 10.2328 4.70617Z' fill='%23000' stroke='%23000'/%3E%3C/svg%3E"); /* Figma Arrow_Right_MD: wąski szewron (nie strzałka →) */
}

/* --- Wspólne: kontener, sekcja, nagłówek ------------------------------------ */
.kr-hp-wrap {
  --w: var(--kr-hp-w, 1176px);
  width: min(var(--w), 100% - 2 * var(--kr-hp-gut));
  margin-inline: auto;
  box-sizing: border-box;
}
@media (min-width: 1440px) {
  /* Ramka 1440: część sekcji ma treść przesuniętą względem środka (dx z geometrii Figmy). */
  .kr-hp-wrap { margin-left: calc(50% - var(--w) / 2 + var(--kr-hp-dx, 0px)); margin-right: auto; }
}
.kr-hp-sec {
  position: relative; overflow-x: clip; background: #fff; color: var(--kr-navy-950);
  padding-block: var(--kr-hp-pt, var(--kr-hp-py)) var(--kr-hp-pb, var(--kr-hp-py));
}
.kr-hp-sec--gold { background: var(--kr-gold-50); }
.kr-hp-sec h2, .kr-hp-sec h3 { margin: 0; }

.kr-hp-head { margin: 0 0 calc(var(--kr-hp-head-gap, 64px) - 1px); padding-top: 1px; } /* +1 px: glify Figmy leżą 1 px niżej niż w box modelu Chromium */
.kr-hp-eyebrow {
  display: flex; align-items: flex-start; gap: 16px; height: 26px; margin-bottom: 8px;
  font-size: var(--kr-fs-body); line-height: 20.8px; color: var(--kr-navy-950);
}
.kr-hp-eyebrow::after { content: ""; flex: 0 0 30px; height: 1px; margin-top: 12px; background: var(--kr-gold-400); }
.kr-hp-title,
body.kr .kr-hp-title {
  font-size: clamp(30px, calc(30px + (100vw - 375px) * .0169), 48px);
  line-height: 1.2; letter-spacing: -.02em; font-weight: 600;
  color: var(--kr-gold-400); /* Figma #be914c — decyzja projektanta (weryfikacja 30.09): nagłówki złote mają być #be914c */
  margin: 0;
}
@media (min-width: 1440px) { .kr-hp-title, body.kr .kr-hp-title { line-height: 58px; position: relative; top: -1px; } } /* Figma: 48 px × 1,2 = 57,6 → 58 px na wiersz (wysokość pola = n × 58) */
.kr-hp-head--on-dark .kr-hp-eyebrow { color: #fff; }
.kr-hp-head--on-dark .kr-hp-eyebrow::after { background: #fff; }
body.kr .kr-hp-head--on-dark .kr-hp-title { color: #fff; }

.kr-hp-lead { font-size: var(--kr-fs-body-l); line-height: 23px; margin: 0 0 24px; color: var(--kr-navy-950); position: relative; top: 2px; } /* pozycja glifów Jost 18 px w Figmie: +2 px względem box modelu */
.kr-hp-prose { font-size: var(--kr-fs-body); line-height: 21px; } /* Figma zaokrągla interlinię do pełnych px (16 px × 1,3 = 20,8 → 21; 18 px × 1,3 = 23,4 → 23) */
.kr-hp-prose p { margin: 0 0 8px; }
.kr-hp-prose > :last-child { margin-bottom: 0; }

.kr-hp-actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 48px; }
.kr-hp-actions--center { justify-content: center; margin-top: 64px; }
@media (min-width: 1440px) { #case-study .kr-hp-actions--center { position: relative; left: calc(-1 * var(--kr-hp-dx)); } } /* Figma: przycisk wyśrodkowany względem ramki 1440 */

/* Przyciski (baza .kr-btn z components.css) + strzałka Figmy (Arrow_Right_MD 24 px) */
.kr-hp-sec .kr-btn { min-height: 48px; }
.kr-hp-sec .kr-btn--arrow { padding: 14px 16px 10px 24px; gap: 12px; margin: -1px; } /* Figma: obrys przycisku leży NA ZEWNĄTRZ ramki 48 px (wizualnie 50 px); 4 px gap + 8 px label-container */
.kr-hp-sec .kr-btn--arrow::after {
  content: ""; flex: 0 0 24px; width: 24px; height: 24px; background: currentColor;
  -webkit-mask: var(--kr-hp-arrow) center / contain no-repeat; mask: var(--kr-hp-arrow) center / contain no-repeat;
  transition: transform .2s;
}
.kr-hp-sec a.kr-btn--arrow:hover::after { transform: translateX(3px); }
body.kr .kr-hp-sec .kr-btn--outline { color: var(--kr-navy-950); background: transparent; border-color: var(--kr-navy-950); }
body.kr .kr-hp-sec a.kr-btn--outline:hover, body.kr .kr-hp-sec a.kr-card:hover .kr-btn--outline { background: var(--kr-navy-950); color: #fff; }

/* Rozwijanie „czytaj całość” (Bootstrap collapse; przełącza aria-expanded / .collapsed) */
.kr-readmore {
  appearance: none; background: none; border: 0; padding: 0; margin: 8px 0 0; display: block;
  font: inherit; font-size: 17px; line-height: 24px; color: var(--kr-gold-600); cursor: pointer;
  text-decoration: underline; text-underline-offset: .18em;
}
.kr-readmore:hover { color: var(--kr-gold-700); }
.kr-readmore[aria-expanded="false"] .kr-readmore__hide,
.kr-readmore[aria-expanded="true"] .kr-readmore__show { display: none; }
.kr-readmore__body { margin-top: 8px; }
.kr-readmore__body.collapsing { transition-duration: .25s; }

/* Karta bazowa (usługi, case, korzyści, wpisy) */
.kr-hp-grid { display: grid; gap: var(--kr-hp-gap); align-items: stretch; }
.kr-card {
  display: flex; flex-direction: column; min-width: 0; box-sizing: border-box;
  background: #fff; color: var(--kr-navy-950);
  border: 1px solid var(--kr-gold-400); border-radius: var(--kr-r-xl);
  text-decoration: none; position: relative;
  transition: box-shadow .25s, border-color .25s;
}
body.kr a.kr-card, body.kr a.kr-card:hover { color: var(--kr-navy-950); }
a.kr-card:hover { box-shadow: var(--kr-sh-card-2); border-color: var(--kr-gold-600); }
.kr-card lord-icon { display: block; flex: 0 0 50px; width: 50px; height: 50px; }
.kr-card__title,
body.kr .kr-card__title { font-size: 20px; line-height: 24px; letter-spacing: -.02em; font-weight: 600; margin: 0; overflow-wrap: break-word; }
.kr-card__text { font-size: var(--kr-fs-body); line-height: 21px; }

/* ==========================================================================
   HERO — jeden ekran (bez slidera), treść z ACF `hero` (template-parts/b-hero.php). Wygląd 1:1 z dawnym slajdem „Home”
   z MasterSlider (Figma Home 1440 / mobile 991).
   Geometria w „jednostkach projektu” --u (px projektu x --u):
     >= 992 px : ramka 1440 x 900, --u = min(1px, szerokość/1440) — poniżej 1440 px całość skaluje się proporcjonalnie,
                 powyżej 1440 treść stoi wyśrodkowana w ramce 1440, zdjęcie przylega do prawej krawędzi, reszta = kolor tła;
     <  992 px : ramka 991 x 2914,86 (zdjęcie pod tekstem), --u = szerokość/991.
   Szerokość = container query (100cqw, bez paska przewijania); bez cqw fallback do 100vw.
   ========================================================================== */
.kr-hero { position: relative; background: #e1cdb8; }
.kr-hero__banner { container-type: inline-size; background: var(--kr-hero-bg, #e1cdb8); }
.kr-hero__stage {
  --w: 100vw; --u: calc(var(--w) / 991);
  position: relative; height: calc(2914.86 * var(--u)); color: var(--kr-navy-950);
}
@supports (width: 1cqw) { .kr-hero__stage { --w: 100cqw; } }
.kr-hero__img {
  position: absolute; left: 0; top: calc(1616 * var(--u)); display: block;
  width: calc(991 * var(--u)); height: calc(1298 * var(--u)); max-width: none; object-fit: cover;
}
.kr-hero__content { position: absolute; left: calc(87 * var(--u)); top: calc(539 * var(--u)); width: calc(816.58 * var(--u)); }
.kr-hero__eyebrow, .kr-hero__lead {
  margin: 0; font-family: var(--kr-font-body); font-weight: 400; font-size: calc(42.28 * var(--u)); line-height: 1.3;
}
.kr-hero__eyebrow { margin-bottom: calc(65.1 * var(--u)); }
.kr-hero__title,
body.kr .kr-hero__title {
  margin: 0 0 calc(61.5 * var(--u)); font-family: var(--kr-font-heading); font-weight: 600;
  font-size: calc(95.14 * var(--u)); line-height: 1.2; letter-spacing: -.02em; color: inherit;
}
.kr-hero__lead { margin-bottom: calc(130.2 * var(--u)); }
.kr-hero .kr-br-m { display: inline; }
.kr-hero__actions { display: flex; flex-direction: column; gap: calc(31.2 * var(--u)); align-items: stretch; }

/* Przyciski: wypełniony (granat) i z obrysem; strzałka = maska SVG (kolor currentColor) */
.kr-hero__btn,
body.kr .kr-hero a.kr-hero__btn {
  position: relative; display: block; box-sizing: border-box; border: 1px solid var(--kr-navy-950); border-radius: 999px;
  height: calc(126.85 * var(--u)); padding: 0 calc(97.81 * var(--u)) 0 calc(60.75 * var(--u));
  font-family: var(--kr-font-body); font-weight: 500; font-size: calc(42.28 * var(--u)); line-height: calc(121.6 * var(--u));
  letter-spacing: 0; text-align: center; white-space: nowrap; text-decoration: none;
}
.kr-hero__btn::after {
  content: ""; position: absolute; right: calc(50% - 196.9 * var(--u)); top: calc(29.04 * var(--u));
  width: calc(63.42 * var(--u)); height: calc(63.42 * var(--u)); background: currentColor;
  -webkit-mask: var(--kr-hero-chevron) center / contain no-repeat; mask: var(--kr-hero-chevron) center / contain no-repeat;
}
body.kr .kr-hero a.kr-hero__btn--primary { background: var(--kr-navy-950); color: #fff; }
body.kr .kr-hero a.kr-hero__btn--primary:hover { background: var(--kr-navy-800); border-color: var(--kr-navy-800); color: #fff; }
body.kr .kr-hero a.kr-hero__btn--outline { background: transparent; color: var(--kr-navy-950); }
body.kr .kr-hero a.kr-hero__btn--outline:hover { background: var(--kr-navy-950); color: #fff; }
body.kr .kr-hero a.kr-hero__btn:focus-visible { outline: 3px solid var(--kr-gold-400); outline-offset: 3px; }
.kr-hero__banner { --kr-hero-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 4.5Q13.6 8 14.6 12Q13.6 16 9.5 19.5'/%3E%3C/svg%3E"); }

@media (min-width: 992px) {
  .kr-hero__stage { --u: min(1px, calc(var(--w) / 1440)); height: calc(900 * var(--u)); }
  .kr-hero__img { left: auto; right: 0; top: 0; width: calc(1440 * var(--u)); height: calc(900 * var(--u)); }
  .kr-hero__content { left: calc(50% - 623 * var(--u)); top: calc(288 * var(--u)); width: calc(476 * var(--u)); } /* 97 px od lewej krawędzi ramki 1440 */
  .kr-hero__eyebrow, .kr-hero__lead { font-size: calc(16 * var(--u)); }
  .kr-hero__eyebrow { margin-bottom: calc(24.4 * var(--u)); }
  .kr-hero__title, body.kr .kr-hero__title { font-size: calc(70 * var(--u)); line-height: 1.1; margin-bottom: calc(32 * var(--u)); }
  .kr-hero__lead { margin-bottom: calc(49.8 * var(--u)); }
  .kr-hero .kr-br-m { display: none; }
  .kr-hero__actions { flex-direction: row; align-items: flex-start; gap: calc(16 * var(--u)); }
  .kr-hero__btn, body.kr .kr-hero a.kr-hero__btn {
    display: inline-block; height: calc(48 * var(--u)); padding: 0 calc(51 * var(--u)) 0 calc(23 * var(--u));
    font-size: calc(16 * var(--u)); line-height: calc(46 * var(--u)); text-align: left;
  }
  .kr-hero__btn::after { right: calc(15 * var(--u)); top: calc(11 * var(--u)); width: calc(24 * var(--u)); height: calc(24 * var(--u)); }
}

/* ==========================================================================
   Pasek statystyk — Figma „Frame 72” (14841:31780; mobile 14910:3834)
   ========================================================================== */
.kr-stats { background: #fff; }
.kr-stats__row { display: flex; flex-wrap: wrap; } /* Figma (weryfikacja 30.09): pasek liczb na całą szerokość ekranu */
.kr-stats__cell {
  flex: 1 1 0; min-width: 0; box-sizing: border-box; min-height: 134px;
  display: flex; flex-direction: column; justify-content: center; gap: 4px;
  padding: 32px clamp(24px, 2.8vw, 40px); background: rgba(255, 255, 255, .7);
  border: 1px solid var(--kr-gold-400); margin-left: -1px; color: var(--kr-navy-950);
}
.kr-stats__cell:first-child { margin-left: 0; }
.kr-stats__title,
body.kr .kr-stats__title { font-size: clamp(20px, calc(14px + .84vw), 24px); line-height: 1.2; letter-spacing: -.02em; margin: 0; font-weight: 600; }
.kr-stats__title u { text-decoration: none; }
@media (min-width: 992px) { body.kr .kr-stats__title { max-width: 140px; line-height: 29px; } } /* Figma: tytuł łamie się na 3 wiersze × 28,8 (Jesteśmy / liderem / w Polsce) */
.kr-stats__value { font-family: var(--kr-font-heading); font-weight: 600; font-size: 20px; line-height: 24px; letter-spacing: -.02em; }
.kr-stats__legend { font-size: var(--kr-fs-body-xs); line-height: 1.5; }
@media (min-width: 992px) { .kr-stats__cell { height: 134px; } }
@media (min-width: 1200px) { .kr-stats__cell:nth-child(4) .kr-stats__legend { margin-inline: -5px; } } /* Figma: legenda kafla „2,5x” ma pole 218 px (x=898) — mieści się w 3 wierszach */
@media (max-width: 991.98px) {
  .kr-stats__cell { flex: 1 1 28%; min-height: 96px; margin-top: -1px; }
  .kr-stats__cell--title { flex: 1 1 100%; min-height: 72px; padding-block: 24px; margin-left: 0; margin-top: 0; }
}
@media (max-width: 575.98px) {
  /* Figma mobile: komórki 72 / 81 / 102 (2-wierszowa legenda) / 81 px ułożone bez zakładki; obrys wewnątrz wymiaru (border 1 + padding 15/23) */
  .kr-stats__cell { flex: 1 1 100%; margin: 0; min-height: 0; justify-content: flex-start; padding: 15px 23px 16px; border-bottom-width: 0; }
  .kr-stats__cell:last-child { padding-bottom: 15px; border-bottom-width: 1px; }
  .kr-stats__cell--title { padding: 23px 23px 24px; }
  .kr-stats__value { font-size: 18px; line-height: 21.6px; min-height: 24px; letter-spacing: -.02em; }
}

/* ==========================================================================
   Usługi — Figma Section 14841:31426 / mobile 14910:3847
   ========================================================================== */
#services { --kr-hp-w: 1156px; --kr-hp-head-gap: 80px; }
.kr-services__grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 256px), 1fr)); }
.kr-card--service { padding: 95px 23px 47px; gap: 8px; } /* wymiary Figmy 96/24/48 liczone z obramowaniem wewnątrz ramki */
.kr-card--service .kr-card__title { color: var(--kr-navy-950); max-width: 176px; } /* odwzorowuje ręczne łamanie wierszy tytułów w Figmie (Restrukturyzacja / firmy / jednoosobowej) */
@media (min-width: 1200px) {
  #services { --kr-hp-pt: 144px; --kr-hp-pb: 163.61px; }
  .kr-services__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  #services { --kr-hp-head-gap: 40px; }
  .kr-services__grid > :nth-child(5) .kr-card__title { max-width: 270px; } /* Figma mobile: 5. karta ma 3 wiersze (ręczne łamanie) */
  .kr-services__grid { gap: 16px; }
}

/* ==========================================================================
   Case studies — Figma Section 14841:31792 / mobile 14910:4209
   ========================================================================== */
#case-study { --kr-hp-w: 1125px; --kr-hp-dx: 14.5px; --kr-hp-head-gap: 78px; }
#case-study .kr-hp-head { width: max-content; max-width: calc(100vw - 2 * var(--kr-hp-gut)); }
.kr-case-study__grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.kr-card--case { padding: 54px 48px 48px; }
.kr-card--case .kr-card__title { min-height: 72px; color: #000; }
.kr-card--case, body.kr a.kr-card--case, body.kr a.kr-card--case:hover { color: #000; } /* Figma: teksty kart case w kolorze #000 */
.kr-card--case .kr-card__text { height: 157.8px; margin-top: 26.2px; max-width: 248px; line-height: 29px; } /* Figma: każdy wiersz opisu to osobny akapit (20,8 + 8 px) */
.kr-case-data { display: flex; flex-direction: column; gap: 11px; margin-top: 42px; }
.kr-case-data__row { display: flex; gap: 20px; align-items: flex-start; min-height: 85px; }
.kr-case-data__text { font-size: var(--kr-fs-body-l); line-height: 31px; margin-top: -2px; height: 85px; color: #000; } /* Figma: wiersze wartości to osobne akapity (23,4 + 8 px) */
.kr-case-data__text strong { font-weight: 700; }
.kr-card--case .kr-card__cta { align-self: flex-start; margin-top: auto; }
@media (min-width: 992px) {
  .kr-card--case { min-height: 766px; }
}
@media (min-width: 1200px) {
  #case-study { --kr-hp-pt: 108px; --kr-hp-pb: 94.41px; }
  .kr-case-study__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  #case-study { --kr-hp-head-gap: 40px; }
  .kr-case-study__grid { gap: 16px; }
  .kr-card--case { min-height: 766.4px; border-radius: var(--kr-r-l); padding: 66px 48px 48px; }
  .kr-card--case .kr-card__title { max-width: 225.6px; } /* Figma: pole tytułu 225,6 px (Restrukturyzacja / firmy z branży OZE) */
  /* Figma: opis = pole 144 px, tekst wyśrodkowany w pionie, wiersze co 20,8 px, szerokość ~216 px (łamanie jak we wzorcu) */
  .kr-card--case .kr-card__text { margin-top: 28.4px; height: 144px; max-width: 216.2px; line-height: 21px; display: flex; flex-direction: column; justify-content: center; }
  .kr-hp-sec .kr-btn--arrow { padding-block: 12px; }
  .kr-card--case .kr-card__cta { align-self: stretch; margin-inline: -25px; }
  #case-study .kr-hp-actions .kr-btn { width: 100%; background: var(--kr-navy-950); border-color: var(--kr-navy-950); }
  #case-study .kr-hp-actions--center { margin-top: 40px; }
}

/* ==========================================================================
   Informacje — Figma Section 14841:32113 / mobile 14910:4532
   ========================================================================== */
.kr-info { --kr-hp-w: 1131px; --kr-hp-dx: 22.5px; }
.kr-info::before { /* dekoracja Figmy „Subtract” (znak KPR, overlay) */
  content: ""; position: absolute; left: calc(50% - 720px + 713px); top: 36px; width: 1190px; height: 1275px; pointer-events: none;
  background: url("../img/b-info-mark.svg") 0 0 / 100% 100% no-repeat; mix-blend-mode: overlay; z-index: 0;
}
.kr-info .kr-hp-wrap { position: relative; z-index: 1; }
.kr-info__layout { display: grid; grid-template-columns: minmax(0, 474px) minmax(0, 476px); justify-content: space-between; gap: 48px 64px; align-items: start; }
.kr-info .kr-hp-head { margin-bottom: 47px; }
.kr-info .kr-hp-lead { font-weight: 500; margin-bottom: 24px; }
.kr-info .kr-hp-prose { font-size: 16px; line-height: 21px; }
.kr-person { margin: 0; border-radius: var(--kr-r-xl); overflow: hidden; background: var(--kr-gold-400); }
.kr-person__img, body.kr .kr-person__img { display: block; width: 100%; height: auto; aspect-ratio: 476 / 554; object-fit: cover; object-position: top center; }
.kr-person__caption { background: var(--kr-gold-400); color: #fff; padding: 0 24px; height: 80px; display: flex; align-items: center; font-size: 17px; line-height: 24px; }
.kr-person__caption p { margin: 0; }
.kr-person__caption strong { font-weight: 700; }
@media (min-width: 1200px) {
  .kr-info { --kr-hp-pt: 167px; --kr-hp-pb: 165px; }
  .kr-info__layout { gap: 0 181px; }
}
@media (max-width: 991.98px) {
  .kr-info__layout { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .kr-person { max-width: 476px; }
}
@media (max-width: 575.98px) {
  .kr-info { --kr-hp-pb: 63.72px; } /* Figma: sekcja 1251,3 px; kolejne sekcje zaczynają się na 7692,5 (ułamki wg auto-layoutu) */
  .kr-info::before { left: 24px; top: 834px; width: 628px; height: 673px; }
  .kr-info .kr-hp-actions .kr-btn { width: 100%; }
  .kr-info .kr-hp-actions { margin-top: 48px; }
}

/* ==========================================================================
   Kroki postępowania — Figma Section 14841:32136 / mobile 14910:4554
   ========================================================================== */
.kr-steps { --kr-hp-w: 1211px; --kr-hp-dx: 17.5px; }
.kr-steps__layout { display: grid; grid-template-columns: minmax(0, 449px) minmax(0, 624px); justify-content: space-between; gap: 48px 64px; align-items: start; }
.kr-steps__text { margin-top: 31px; }
.kr-steps .kr-hp-lead { font-weight: 300; margin-bottom: 16px; }
.kr-steps .kr-readmore { position: relative; top: 0; }
.kr-steps .kr-hp-prose { font-size: 18px; line-height: 23px; font-weight: 500; position: relative; top: 2px; }
.kr-steps__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--kr-hp-gap); }
.kr-step {
  display: flex; flex-direction: column; gap: 9px; box-sizing: border-box; min-height: 233px;
  padding: 79px 22px 21px 24px; background: #fff; color: var(--kr-navy-950);
  border: 1px solid var(--kr-gold-400); border-radius: var(--kr-r-xl); min-width: 0;
}
.kr-step:last-child { min-height: 209px; }
.kr-step lord-icon { display: block; flex: 0 0 50px; width: 50px; height: 50px; margin: 1px 0 -1px; } /* Figma: ikona na y=81 od góry karty */
.kr-step__title, body.kr .kr-step__title { font-size: 20px; line-height: 24px; letter-spacing: -.02em; margin: 0; overflow-wrap: break-word; max-width: 205px; } /* jak ręczne łamanie tytułów kroków w Figmie */
@media (min-width: 1200px) { .kr-steps { --kr-hp-pt: 143px; --kr-hp-pb: 94px; } }
@media (max-width: 1199.98px) { .kr-steps__layout { grid-template-columns: minmax(0, 1fr); } .kr-steps__text { margin-top: 0; } }
@media (max-width: 575.98px) {
  /* Figma mobile: karty 2 kolumny na całą szerokość ekranu (187/188 px), wysokość 257/233 */
  .kr-steps__layout { gap: 40px; }
  .kr-steps .kr-hp-prose { height: 161px; }
  .kr-steps__grid { gap: 0; margin-inline: calc(-1 * var(--kr-hp-gut)); overflow: clip; }
  .kr-steps .kr-hp-head { margin-bottom: 23px; }
  .kr-step { min-height: 258px; padding: 79px 4px 24px 25px; gap: 34.5px; border-radius: 0; margin: 0 0 -1px -1px; } /* 258 − zakładka 1 px = rytm rzędów 257 px jak w Figmie */
  .kr-step:last-child { min-height: 233px; margin-bottom: 0; padding-bottom: 22px; }
  .kr-step__title, body.kr .kr-step__title { font-size: 18px; line-height: 22px; max-width: none; } /* Figma: 21,6 → 22 px */
}
@media (max-width: 359.98px) {
  .kr-step { padding-inline: 12px 2px; }
  .kr-step__title, body.kr .kr-step__title { font-size: 15px; }
}

/* ==========================================================================
   Dlaczego my — Figma Section 14841:32289 / mobile 14910:4708
   ========================================================================== */
.kr-why { --kr-hp-w: 1156px; --kr-hp-dx: -10px; --kr-hp-head-gap: 48px; }
.kr-why .kr-hp-title { max-width: 945px; }
.kr-why__lead { font-weight: 300; color: var(--kr-ink-2); margin-bottom: 48px; }
.kr-why__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kr-card--icon { padding: 47px 23px; gap: 16px; }
.kr-card--icon .kr-card__text { font-size: var(--kr-fs-body-l); line-height: 23px; max-width: 193px; }
.kr-card--icon .kr-card__title { max-width: 223px; }
.kr-card--icon:last-child .kr-card__text { position: relative; top: 2px; } /* glify (i przycisk) karty licencji leżą 2 px niżej niż w box modelu */
.kr-card--icon:last-child { gap: 32px; }
.kr-card--icon:last-child .kr-card__text { max-width: 218px; }
.kr-card--icon .kr-card__text a.btn,
.kr-card--icon .kr-card__text a[class*="btn"] {
  position: relative; top: -3px; display: flex; width: fit-content; align-items: center; gap: 4px; margin: 31px 0 -1px -1px !important; padding: 14px 24px 10px; min-height: 48px; box-sizing: border-box; /* Figma: przycisk 32 px pod tekstem, obrys na zewnątrz ramki 48 px */
  border: 1px solid var(--kr-navy-950); border-radius: 999px; background: transparent; color: var(--kr-navy-950);
  font-size: var(--kr-fs-btn); font-weight: 500; line-height: 1.5; text-decoration: none; transition: background-color .2s, color .2s;
}
.kr-card--icon .kr-card__text a.btn:hover,
.kr-card--icon .kr-card__text a[class*="btn"]:hover { background: var(--kr-navy-950); color: #fff; }
.kr-card--icon .kr-card__text a.btn,
.kr-card--icon .kr-card__text a[class*="btn"] { gap: 12px; padding-right: 16px; } /* Figma: etykieta 8 + odstęp 4 + szewron 24 + padding 16 */
.kr-card--icon .kr-card__text a.btn::after,
.kr-card--icon .kr-card__text a[class*="btn"]::after {
  content: ""; flex: 0 0 24px; width: 24px; height: 24px; background: currentColor;
  -webkit-mask: var(--kr-hp-arrow) center / contain no-repeat; mask: var(--kr-hp-arrow) center / contain no-repeat; transition: transform .2s;
}
.kr-card--icon .kr-card__text a.btn:hover::after { transform: translateX(3px); }
.kr-why__video { width: min(760px, 100%); margin: 80px auto 0; min-width: 0; }
.kr-why__video > div { display: block !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; flex: none !important; }
.kr-why__video p { margin: 0; font-size: 0; line-height: 0; height: 0; overflow: hidden; }
.kr-why__video .video-wrapper { position: relative; aspect-ratio: 760 / 437; border-radius: var(--kr-r-xl); overflow: hidden; background: #000; }
.kr-why__video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.kr-yt__play { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; background: #000; cursor: pointer; }
.kr-yt__play img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kr-yt__icon { position: absolute; top: 50%; left: 50%; width: 68px; height: 48px; transform: translate(-50%, -50%); transition: transform .2s; }
.kr-yt__play:hover .kr-yt__icon, .kr-yt__play:focus-visible .kr-yt__icon { transform: translate(-50%, -50%) scale(1.1); }
.kr-yt__play:focus-visible { outline: 3px solid var(--kr-gold-400); outline-offset: -3px; }
@media (min-width: 1200px) { .kr-why { --kr-hp-pt: 126px; --kr-hp-pb: 99px; } }
@media (max-width: 1099.98px) { .kr-why__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639.98px) {
  .kr-why { --kr-hp-head-gap: 56px; } /* lead Figmy: y=262 */
  .kr-card--icon:last-child { min-height: 533px; } /* Figma: karta licencji 533 px (auto-layout dawałby 522) */
  .kr-card--icon:last-child .kr-card__text, .kr-card--icon:last-child .kr-card__title { max-width: none; }
  .kr-why__grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .kr-why__video { margin-top: 80px; }
  .kr-why__video .video-wrapper { aspect-ratio: 327 / 188; border-radius: var(--kr-r-m); }
}

/* ==========================================================================
   Opinie (Trustindex) — Figma Section 14841:32508 / mobile 14910:4929
   ========================================================================== */
.kr-opinions { --kr-hp-w: 1160px; --kr-hp-dx: -3px; } /* sekcja w Figmie ma x=-3 */
@media (min-width: 1200px) { .kr-opinions { --kr-hp-pt: 133px; --kr-hp-pb: 131.79px; } }
.kr-opinions { overflow-x: clip; }
.kr-opinions__widget { max-width: 100%; min-width: 0; min-height: 238px; }
.kr-opinions__widget img { max-width: 100%; }

/* ==========================================================================
   Kontakt — Figma „Wizualizacja-formularz-dekstop” (14841:32714) / mobile 14910:5004
   ========================================================================== */
.kr-contact { --kr-hp-w: 1127px; --kr-hp-dx: 9.5px; }
@media (min-width: 1200px) { .kr-contact { --kr-hp-pt: 139px; --kr-hp-pb: 133.83px; } }
.kr-contact {
  color: #fff; background-color: var(--kr-navy-800);
  /* Figma (desktop): navy #1a2e70 + zdjęcie (skala szara, multiply) + gradient navy-900 od 38 % do 86 % wysokości */
  background-image: linear-gradient(to bottom, rgba(16, 33, 89, 0) 38.13%, var(--kr-navy-900) 85.95%), url("../img/b-contact-bg.webp");
  background-size: 100% 100%, 105.6% 100%; background-position: 0 0, 72.8% 0; background-repeat: no-repeat; /* Figma „stretch”: kadr zdjęcia dopasowany korelacją do wzorca (1521 × 1306 px przy x=-59) */
  background-blend-mode: normal, multiply;
}
@media (max-width: 767.98px) {
  /* Figma mobile: warstwy zdjęcia i gradient są wyłączone — jednolity navy #102360; pola formularza jasnoszare #f1f1f1 z obrysem #b2b2b2 */
  .kr-contact { background-image: none; background-color: #102360; }
  .kr-contact .wpcf7 { --kr-f-input-bg: #f1f1f1; --kr-f-border: #b2b2b2; }
}
.kr-contact__layout { display: grid; grid-template-columns: minmax(0, 442px) minmax(0, 565px); gap: 48px 120px; align-items: start; justify-content: space-between; }
.kr-contact__form { min-width: 0; }
.kr-contact__info { min-width: 0; }
.kr-contact__lead { font-size: 22px; font-weight: 300; line-height: 24px; margin: 0 0 -5px; padding-top: 5px; max-width: 469px; } /* Figma: 2 wiersze wyśrodkowane w polu 56 px */
.kr-contact__rule { border: 0; border-top: 1px solid var(--kr-gold-400); opacity: .25; margin: 57px 0 0 4px; }
@media (min-width: 1200px) { .kr-contact__rule { width: 576px; max-width: none; } }
.kr-contact__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px 32px; margin-top: 30px; }
@media (min-width: 1200px) { .kr-contact__grid { grid-template-columns: 168px 168px 165px; } }
.kr-contact__item { min-width: 0; font-size: 17px; line-height: 24px; }
.kr-contact__item lord-icon { display: block; width: 50px; height: 50px; }
.kr-contact__data p { margin: 0; }
.kr-contact__item lord-icon { margin-bottom: 21px; }
.kr-contact a, body.kr .kr-contact__data a { color: #fff; text-decoration: none; overflow-wrap: anywhere; }
.kr-contact__data a:hover, body.kr .kr-contact__data a:hover { color: var(--kr-gold-300); text-decoration: underline; }
.kr-contact .contact-pos--mail-legend { font-size: var(--kr-fs-body-xs); line-height: 16px; margin-bottom: 0; }
@media (max-width: 991.98px) { .kr-contact__layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767.98px) { .kr-contact__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 32px; } }
@media (max-width: 575.98px) {
  /* Figma mobile 14910:5004: gutter 12 px, góra 120, odstępy 58/118, siatka 1 kolumna z odstępem 48 */
  .kr-contact { --kr-hp-pt: 120px; --kr-hp-pb: 67px; --kr-hp-head-gap: 58px; }
  .kr-contact .kr-hp-wrap { width: calc(100% - 24px); }
  .kr-contact__layout { gap: 118px; }
  .kr-contact__lead { line-height: 26.4px; }
  body.kr .kr-contact .wpcf7 .wpcf7-privacy-note { line-height: 16px; }
  .kr-contact__rule { margin: 26px 0 0; }
  .kr-contact__grid { grid-template-columns: minmax(0, 1fr); gap: 48px; margin-top: 40px; }
}

/* Formularz CF7: style globalne rodziny A (f-a-forms.css), wariant ciemny przez klasę .kr-form--dark na kontenerze.
   Lokalnie tylko wysokość pola wiadomości wg Figmy (Textarea 268 px). */
body.kr .kr-contact .wpcf7 textarea { height: 268px; min-height: 268px; }
body.kr .kr-contact .wpcf7 label:has(textarea) { padding-bottom: 6px; margin-bottom: 0; }
body.kr .kr-contact .wpcf7 .wpcf7-privacy-note { margin-top: 18px; }
body.kr .kr-contact .wpcf7 .wpcf7-form-control-wrap:has(> .wpcf7-acceptance) { margin: 12px 0 45px; }
body.kr .kr-contact .wpcf7 .cf7-cf-turnstile { margin: 0 !important; }
body.kr .kr-contact .wpcf7 input[type="submit"] { margin-bottom: 0; }

/* ==========================================================================
   Aktualności — Figma Section 14841:32877 / mobile 14910:5159
   ========================================================================== */
.kr-posts { --kr-hp-w: 1128px; }
@media (min-width: 1200px) { .kr-posts { --kr-hp-pt: 128px; --kr-hp-pb: 127.99px; } }
.kr-posts__grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
@media (min-width: 1200px) { .kr-posts__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.kr-posts .kr-hp-actions { margin-top: 64px; }
.kr-card--post { overflow: hidden; min-height: 538px; }
.kr-card__media { display: block; position: relative; overflow: hidden; height: 249px; flex: 0 0 249px; background: var(--kr-gold-50); } /* 249 + obramowanie 1 px = 250 px zdjęcia w Figmie */
/* Figma: zdjęcie = ramka o szerokości karty i wysokości 0,4 × wysokość pliku (wypełnienie „stretch”), wyśrodkowana w kadrze 250 px; --kr-img-h ustawia szablon */
.kr-card__img, body.kr .kr-card__img { display: block; position: absolute; left: 0; top: calc(50% - 1px); width: 100%; height: var(--kr-img-h, 100%); max-width: none; object-fit: fill; transform: translateY(-50%); }
.kr-card__body { display: flex; flex-direction: column; gap: 16px; padding: 40px 23px 38px; flex: 1 1 auto; } /* padding 23 + obramowanie 1 = 24 px od krawędzi karty */
.kr-card__category { font-size: var(--kr-fs-body-l); font-weight: 500; line-height: 23px; color: var(--kr-gold-600); margin-bottom: -6px; }
.kr-card--post .kr-card__title { max-width: none; }
.kr-card--post .kr-card__title a,
body.kr .kr-card--post .kr-card__title a { color: #101010; text-decoration: none; }
.kr-card--post .kr-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.kr-card--post .kr-card__title a:hover { color: var(--kr-gold-700); }
.kr-card--post:hover { box-shadow: var(--kr-sh-card-2); border-color: var(--kr-gold-600); }
.kr-card--post:focus-within { outline: 3px solid var(--kr-gold-400); outline-offset: 2px; }
.kr-card--post .kr-card__title a:focus-visible { outline: 0; }
.kr-card__date { display: flex; align-items: center; gap: 20px; margin-top: 10px; font-size: var(--kr-fs-body-l); line-height: 23px; color: var(--kr-ink-2); }
.kr-card__date::before { content: ""; flex: 0 0 40px; height: 1px; background: var(--kr-gold-400); }
@media (max-width: 575.98px) {
  .kr-posts__grid { gap: 16px; }
  .kr-posts .kr-hp-actions .kr-btn { width: 100%; }
  .kr-posts .kr-hp-actions { margin-top: 64px; }
}

/* Treść z edytora (Gutenberg) na dole strony */
.kr-hp-gutenberg { padding-block: 32px 64px; background: #fff; }
.kr-hp-gutenberg .kr-hp-wrap { width: min(1176px, 100% - 2 * var(--kr-hp-gut)); }

/* Ruch zredukowany */
@media (prefers-reduced-motion: reduce) {
  .kr-card, .kr-readmore__body.collapsing, .kr-hp-sec .kr-btn--arrow::after { transition: none !important; }
}

@media (max-width: 575.98px) {
  body.kr .kr-contact .wpcf7 .wpcf7-form-control-wrap:has(> .wpcf7-acceptance) { margin-bottom: 23px; } /* Figma mobile: brak rezerwy pod captchę + krótsza zgoda */
}


/* Legenda „wygranych / restrukturyzacji”: łamanie wiersza tylko od 576 px (Figma desktop 2 wiersze, mobile 1 wiersz) */
.kr-stats__legend .kr-br-d { display: none; }
@media (min-width: 576px) { .kr-stats__legend .kr-br-d { display: inline; } }