/* ==========================================================================
   Bory Home — podstrony „dlaczego my"
   Siedem stron o różnych układach sekcji; wspólne są tylko komponenty.
   Wartości z prototypów `Bory Home <nazwa>.dc.html`.
   ========================================================================== */

/* Rytm sekcji tych podstron to 96 px (jak na stronie głównej), więc nie
   nadpisujemy `--bh-pad-y`. Nagłówki sekcji mają 42 px — tyle, ile daje
   pasek sekcji w bazie; różnice punktowe siedzą przy poszczególnych stronach. */

@media (min-width: 641px) {
  .bh-whyhead .bh-h2,
  .bh-whystack .bh-h2,
  .bh-finhead .bh-h2,
  .bh-whybar .bh-h2 {
    font-size: 42px;
    line-height: 1.05;
    letter-spacing: -.032em;
  }
}

/* Pasek sekcji ma na tych stronach 46 px odstępu, nie 40 jak w bazie. */
.bh-whybar { margin-bottom: 46px; }

/* --- Hero (wyśrodkowany, bez zdjęcia) ------------------------------------- */

.bh-whyhero { padding-block: 84px 92px; }
.bh-whyhero__head { max-width: 760px; margin: 0 auto 48px; text-align: center; }
.bh-whyhero__head .bh-eyebrow { display: block; margin: 0 0 16px; }

.bh-whyhero__title {
  font-size: 62px;
  line-height: 1.02;
  font-weight: 800;
  letter-spacing: -.038em;
  margin: 0 0 24px;
}
.bh-whyhero__lead {
  font-size: 17.5px;
  line-height: 1.65;
  color: var(--bh-text-2);
  margin: 0 auto 30px;
  max-width: 52ch;
}

.bh-whyhero__badges { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }
.bh-whybadge {
  font: 500 12.5px/1 var(--bh-font);
  color: var(--bh-text-3);
  background: var(--bh-surface-alt);
  padding: 10px 14px;
  border-radius: var(--bh-pill);
}

/* --- Gwarancja: karty zakresu --------------------------------------------- */

.bh-warranty { gap: 18px; }
.bh-warranty__card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* Prototyp nie ma resetu `border-box`, więc jego 230 px to sama treść —
     dopełnienie dochodzi na zewnątrz (patrz README, pułapka `box-sizing`). */
  box-sizing: content-box;
  min-height: 230px;
  background: var(--bh-surface-alt);
  border-radius: 24px;
  padding: 32px 30px 30px;
}
.bh-warranty__card--dark { background: var(--bh-ink); color: #fff; }

/* Plakietka ma pod sobą 4 px — na samej plakietce margines schodzi
   z blokiem nadrzędnym, więc niesie go obudowa. */
.bh-warranty__head { margin: 0 0 4px; }

.bh-warranty__tag {
  display: inline-block;
  font: 700 12px/1 var(--bh-font);
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--bh-ink);
  background: var(--bh-surface);
  padding: 9px 12px;
  border-radius: 8px;
}
.bh-warranty__tag--accent { background: var(--bh-accent); }
/* Trzecia karta ma plakietkę u góry, bez dolnego marginesu i o stopień większą. */
.bh-warranty__tag--top { align-self: flex-start; font-size: 13px; letter-spacing: .06em; margin: 0; }

.bh-warranty__title {
  font: 800 20px/1.2 var(--bh-font);
  letter-spacing: -.022em;
  margin: 0 0 9px;
}
.bh-warranty__title--wide { margin: 0 0 14px; }
.bh-warranty__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 16px; }
.bh-warranty__card--dark .bh-warranty__desc { color: #8FA0AC; }

.bh-warranty__rows { display: flex; flex-direction: column; gap: 9px; }
.bh-warranty__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.bh-warranty__row:not(:last-child) { padding: 0 0 9px; border-bottom: 1px solid var(--bh-border-strong); }
.bh-warranty__card--dark .bh-warranty__row:not(:last-child) { border-bottom-color: var(--bh-ink-soft); }

.bh-warranty__row span:first-child { font: 400 13.5px/1.4 var(--bh-font); color: var(--bh-text-2); }
.bh-warranty__row span:last-child { font: 700 13.5px/1 var(--bh-font); color: var(--bh-ink); white-space: nowrap; }
.bh-warranty__card--dark .bh-warranty__row span { font-size: 13px; }
.bh-warranty__card--dark .bh-warranty__row span:first-child { color: #8FA0AC; }
.bh-warranty__card--dark .bh-warranty__row span:last-child { color: var(--bh-accent); }

/* --- Kolumny z żółtą kreską u góry ---------------------------------------- */

.bh-rules { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.bh-rule { border-top: 2px solid var(--bh-accent); padding: 20px 0 0; }
.bh-rule__num { font: 700 11.5px/1 var(--bh-font); color: var(--bh-text-4); margin: 0 0 14px; }
.bh-rule__title {
  font: 700 17px/1.25 var(--bh-font);
  letter-spacing: -.015em;
  margin: 0 0 9px;
}
.bh-rule__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); }

/* --- Kafle korzyści ------------------------------------------------------- */

/* Skrót `margin` kasuje `margin-inline: auto` z `.bh-section-head--center`
   (ten sam zasięg, a ten arkusz wchodzi później), więc blok 720 px przyklejał
   się do lewej krawędzi zamiast stać na środku sekcji. */
.bh-whyhead { margin: 0 auto 44px; }
.bh-whyhead__title { max-width: 24ch; margin-inline: auto; }

.bh-benefits { gap: 18px; }
.bh-benefit {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 20px;
  padding: 26px 26px 24px;
  transition: border-color .3s, transform .3s;
}
.bh-benefit:hover { border-color: var(--bh-accent); transform: translateY(-3px); }
.bh-benefit__title {
  font: 700 17px/1.25 var(--bh-font);
  letter-spacing: -.015em;
  margin: 0 0 9px;
}
.bh-benefit__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); }

/* --- Kafle czasu reakcji -------------------------------------------------- */

.bh-sla { display: flex; gap: 10px; flex: none; }
.bh-sla__tile { background: var(--bh-surface); border-radius: 16px; padding: 16px 20px; text-align: center; }
.bh-sla__value { font: 800 22px/1 var(--bh-font); letter-spacing: -.03em; margin: 0 0 6px; }
.bh-sla__label { font: 400 11.5px/1 var(--bh-font); color: var(--bh-text-4); }

/* --- Kroki z plakietką ---------------------------------------------------- */

.bh-flow { gap: 18px; margin: 0 0 26px; }
/* Karty mają w projekcie to samo tło co sekcja — nośnikiem rytmu jest
   biała plakietka kroku, nie obudowa karty. */
.bh-flow__card { background: var(--bh-surface-alt); border-radius: 24px; padding: 30px 28px 28px; }
.bh-flow__pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--bh-surface);
  border-radius: var(--bh-pill);
  padding: 7px 12px;
  margin: 0 0 20px;
  font: 700 10px/1 var(--bh-font);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.bh-flow__pill .bh-dot { width: 6px; height: 6px; }
.bh-flow__title {
  font: 800 19px/1.2 var(--bh-font);
  letter-spacing: -.02em;
  margin: 0 0 10px;
}
.bh-flow__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); }

/* --- Pas CTA w jednym wierszu --------------------------------------------- */

.bh-cta-band--row { gap: 40px; padding: 44px 48px; border-radius: 28px; flex-wrap: nowrap; }
.bh-cta-band--row .bh-cta-band__heading { font-size: 32px; margin: 0 0 12px; }
.bh-cta-band--row .bh-cta-band__text { line-height: 1.6; max-width: 56ch; }
.bh-cta-band__cta { flex: none; font-size: 15px; padding: 19px 28px; }

/* --- Progi ---------------------------------------------------------------- */

@media (max-width: 1100px) {
  .bh-rules { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .bh-whyhero__title { font-size: 48px; }
}

@media (max-width: 860px) {
  .bh-cta-band--row { flex-wrap: wrap; padding: 32px 28px; gap: 24px; }
  .bh-cta-band--row .bh-cta-band__heading { font-size: 26px; }
}

/* --- Szybka realizacja ---------------------------------------------------- */

/* Wariant hero wyrównany do lewej (Gwarancja ma wyśrodkowany). */
.bh-whyhero--left { padding-block: 84px 88px; }
.bh-whyhero--left .bh-whyhero__head { max-width: 840px; margin: 0 0 40px; text-align: left; }
.bh-whyhero--left .bh-whyhero__title { font-size: 56px; line-height: 1.03; max-width: 20ch; }
.bh-whyhero--left .bh-whyhero__lead { margin: 0 0 32px; max-width: 56ch; }

.bh-whyhero__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.bh-whyhero__actions .bh-btn { font-size: 15px; padding: 18px 26px; }
.bh-whyhero__actions .bh-btn--ghost { padding: 17px 26px; }

.bh-stages { gap: 18px; margin: 0 0 18px; }
.bh-stage { background: var(--bh-surface-alt); border-radius: 22px; padding: 26px 26px 24px; }
.bh-stage__value { font: 800 34px/1 var(--bh-font); letter-spacing: -.035em; margin: 0 0 10px; }
.bh-stage__label { font: 400 13px/1.4 var(--bh-font); color: var(--bh-text-2); }

.bh-notice {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--bh-accent-bg);
  border: 1px solid var(--bh-accent);
  border-radius: var(--bh-r-lg);
  padding: 16px 20px;
  font: 400 13.5px/1.5 var(--bh-font);
  color: var(--bh-text-3);
}
.bh-notice .bh-dot { width: 6px; height: 6px; }
.bh-notice b { font-weight: 700; }
.bh-notice a { font-weight: 700; border-bottom: 1px solid var(--bh-accent); }

/* Nagłówek sekcji ułożony w kolumnie (eyebrow → H2 → lead). */
.bh-whystack { margin: 0 0 40px; }
/* Zasięg jak w regule główki sekcji, inaczej tamta wygrywa na swoistości. */
.bh-whystack .bh-h2 { max-width: 22ch; margin: 0 0 14px; }
.bh-whystack .bh-lead { font-size: 16px; line-height: 1.6; max-width: 48ch; }

/* Pasek sekcji z odstępem 44 px zamiast 46. */
.bh-whybar--44 { margin-bottom: 44px; }

.bh-steps3 { gap: 18px; }
.bh-step3 {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 24px;
  padding: 30px 28px 28px;
  transition: border-color .3s, transform .3s;
}
.bh-step3:hover { border-color: var(--bh-accent); transform: translateY(-4px); }
.bh-step3__num { font: 700 11.5px/1 var(--bh-font); color: #B3BEC5; margin: 0 0 18px; }
.bh-step3__title { font: 800 20px/1.2 var(--bh-font); letter-spacing: -.022em; margin: 0 0 10px; }
.bh-step3__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); }

/* Kolumny bez numeracji — na stronie „szybka realizacja" jest ich trzy. */
.bh-rules--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 0 0 40px; }

/* --- Porównanie z budową tradycyjną --------------------------------------- */

.bh-versus { gap: 20px; }
.bh-versus__card {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: var(--bh-r-2xl);
  padding: 32px 32px 28px;
}
.bh-versus__card--ours { background: var(--bh-accent-bg); border: 1.5px solid var(--bh-accent); }

.bh-versus__head { display: flex; align-items: center; gap: 10px; margin: 0 0 20px; }
.bh-versus__dot { width: 7px; height: 7px; background: #D7DEE2; }
.bh-versus__label {
  font: 700 12px/1 var(--bh-font);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.bh-versus__label--muted { color: #B3BEC5; }

.bh-versus__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(12, 26, 34, .1);
}
.bh-versus__card:not(.bh-versus__card--ours) .bh-versus__row { border-bottom-color: var(--bh-rule); }
.bh-versus__row span:first-child { font: 400 13.5px/1.4 var(--bh-font); color: var(--bh-text-2); }
.bh-versus__row span:last-child { font: 700 13.5px/1.3 var(--bh-font); color: var(--bh-ink); white-space: nowrap; }
.bh-versus__row--muted span:last-child { color: var(--bh-text-2); }

.bh-versus__total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 0 0;
  font: 700 14px/1.3 var(--bh-font);
}
.bh-versus__sum { font: 800 24px/1 var(--bh-font); letter-spacing: -.03em; }
.bh-versus__total--muted { color: var(--bh-text-2); }
.bh-versus__note { font: 400 11.5px/1.5 var(--bh-font); color: var(--bh-text-4); margin: 14px 0 0; }

/* --- Karty „dla kogo" z plakietkami --------------------------------------- */

.bh-cases { gap: 18px; }
.bh-case {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 24px;
  padding: 28px 26px 26px;
}
.bh-case__title { font: 700 19px/1.25 var(--bh-font); letter-spacing: -.02em; margin: 0 0 10px; }
.bh-case__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 18px; }
.bh-case__tags { display: flex; gap: 8px; flex-wrap: wrap; padding: 16px 0 0; border-top: 1px solid var(--bh-rule); }
.bh-case__tag {
  font: 600 11.5px/1 var(--bh-font);
  color: var(--bh-text-3);
  background: var(--bh-surface-alt);
  padding: 9px 12px;
  border-radius: var(--bh-pill);
}
.bh-case__tag--accent { color: var(--bh-ink); background: var(--bh-accent-bg); }

/* Mniejszy wariant pasa CTA (30 px nagłówka, węższe dopełnienie). */
.bh-cta-band--sm { padding: 40px 44px; border-radius: var(--bh-r-2xl); }
.bh-cta-band--sm .bh-cta-band__heading { font-size: 30px; }
.bh-cta-band--sm .bh-cta-band__text { max-width: 52ch; }
.bh-cta-band--sm .bh-cta-band__actions { flex: none; gap: 10px; }
.bh-cta-band--sm .bh-cta-band__cta { padding: 19px 26px; }
.bh-cta-band--sm .bh-btn--on-dark { padding: 18px 26px; border-color: rgba(255, 255, 255, .24); }

@media (max-width: 1100px) {
  .bh-rules--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bh-whyhero--left .bh-whyhero__title { font-size: 44px; }
}

@media (max-width: 860px) {
  .bh-versus { grid-template-columns: 1fr; }
  .bh-cta-band--sm { flex-wrap: wrap; padding: 28px 24px; }
}

/* --- Niskie koszty utrzymania --------------------------------------------- */

.bh-whyhero--split { padding-block: 84px 88px; }
.bh-whysplit { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items: center; }
.bh-whyhero--split .bh-eyebrow { display: block; margin: 0 0 16px; }
.bh-whyhero--split .bh-whyhero__title { font-size: 58px; line-height: 1.03; max-width: 16ch; text-align: left; }
.bh-whyhero--split .bh-whyhero__lead { margin: 0 0 32px; max-width: 52ch; }

.bh-uframe { display: flex; flex-direction: column; gap: 12px; }
.bh-uframe__hero { background: var(--bh-ink); border-radius: 24px; padding: 28px 28px 26px; color: #fff; }
.bh-uframe__value {
  font: 800 40px/1 var(--bh-font);
  letter-spacing: -.04em;
  color: var(--bh-accent);
  margin: 0 0 10px;
}
.bh-uframe__label { font: 700 14px/1.3 var(--bh-font); }

.bh-uframe__pair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bh-uframe__tile { background: var(--bh-surface-alt); border-radius: var(--bh-r-xl); padding: 24px 22px; }
.bh-uframe__tile--accent { background: var(--bh-accent-bg); border: 1px solid var(--bh-accent); }
.bh-uframe__number { font: 800 30px/1 var(--bh-font); letter-spacing: -.035em; margin: 0 0 8px; }
.bh-uframe__caption { font: 400 12px/1.4 var(--bh-font); color: var(--bh-text-2); }

/* Lead paska sekcji bywa węższy od bazowych 34ch tylko na tej stronie. */

.bh-facts { gap: 16px; margin: 0 0 20px; }
.bh-fact {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 24px;
  padding: 28px 26px 26px;
  transition: border-color .3s, transform .3s;
}
.bh-fact:hover { border-color: var(--bh-accent); transform: translateY(-3px); }
.bh-fact__title { font: 800 19px/1.2 var(--bh-font); letter-spacing: -.022em; margin: 0 0 10px; }
.bh-fact__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 20px; }
.bh-fact__tag {
  align-self: flex-start;
  font: 600 11px/1 var(--bh-font);
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--bh-ink);
  background: var(--bh-accent-bg);
  padding: 9px 12px;
  border-radius: var(--bh-pill);
}

.bh-facts2 { gap: 18px; }
.bh-fact2 {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: var(--bh-r-2xl);
  padding: 30px 30px 28px;
}
.bh-fact2__title { font: 800 21px/1.2 var(--bh-font); letter-spacing: -.022em; margin: 0 0 10px; }
.bh-fact2__desc { font: 400 14px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 20px; }
.bh-fact2__items { display: flex; flex-direction: column; gap: 10px; padding: 18px 0 0; border-top: 1px solid var(--bh-rule); }
.bh-fact2__item { display: flex; gap: 10px; font: 400 13.5px/1.45 var(--bh-font); color: var(--bh-text-3); }
.bh-fact2__mark { flex: 0 0 10px; min-width: 0; color: var(--bh-ink); }

/* --- Parametry z paskami U ------------------------------------------------ */

.bh-params { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.bh-params .bh-eyebrow { display: block; margin: 0 0 16px; }
.bh-params__title { font-size: 40px; line-height: 1.06; letter-spacing: -.032em; max-width: 20ch; margin: 0 0 16px; }
.bh-params__lead { font: 400 16px/1.65 var(--bh-font); color: var(--bh-text-2); margin: 0 0 26px; max-width: 48ch; }

.bh-params__points { display: flex; flex-direction: column; gap: 14px; }
.bh-params__point { display: flex; gap: 12px; }
.bh-params__point .bh-dot { width: 6px; height: 6px; margin: 8px 0 0; }
.bh-params__point-title { font: 700 14.5px/1.3 var(--bh-font); margin: 0 0 4px; }
.bh-params__point-desc { font: 400 13px/1.5 var(--bh-font); color: var(--bh-text-2); }

.bh-ubox { background: var(--bh-surface-alt); border-radius: var(--bh-r-2xl); padding: 32px 32px 28px; }
.bh-ubar:not(:last-of-type) { margin: 0 0 24px; }
.bh-ubar:last-of-type { margin: 0 0 22px; }
.bh-ubar__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 10px;
}
.bh-ubar__label { font: 600 12.5px/1.3 var(--bh-font); color: var(--bh-text-2); }
.bh-ubar__value { font: 800 20px/1 var(--bh-font); letter-spacing: -.025em; white-space: nowrap; }
.bh-ubar__track { height: 8px; border-radius: var(--bh-pill); background: var(--bh-border-strong); overflow: hidden; }
.bh-ubar__fill { height: 100%; border-radius: var(--bh-pill); background: var(--bh-ink); }
.bh-ubar__fill--accent { background: var(--bh-accent); }

.bh-ubox__note {
  font: 400 12px/1.6 var(--bh-font);
  color: var(--bh-text-4);
  padding: 18px 0 0;
  border-top: 1px solid var(--bh-border-strong);
}
.bh-ubox__note b { font-weight: 700; color: var(--bh-text-3); }

/* --- Pas „dom gotowy na przyszłość" --------------------------------------- */

.bh-cta-band--future { gap: 48px; padding: 48px 52px; border-radius: 28px; flex-wrap: nowrap; }
.bh-cta-band--future .bh-cta-band__text { font-size: 16px; line-height: 1.6; max-width: 54ch; margin: 0 0 20px; }
.bh-cta-band__contacts { display: flex; gap: 22px; flex-wrap: wrap; }
.bh-cta-band__contacts a {
  font: 700 14px/1 var(--bh-font);
  color: #fff;
  border-bottom: 1px solid var(--bh-accent);
  padding: 0 0 4px;
}
.bh-cta-band__contacts a:hover { color: var(--bh-accent); }
.bh-cta-band--future .bh-cta-band__stack { flex: none; gap: 10px; }
.bh-cta-band--future .bh-cta-band__cta { justify-content: center; padding: 19px 28px; }
.bh-cta-band--future .bh-btn--on-dark { padding: 18px 28px; border-color: rgba(255, 255, 255, .24); }

@media (max-width: 1100px) {
  .bh-whysplit { grid-template-columns: 1fr; gap: 36px; }
  .bh-whyhero--split .bh-whyhero__title { font-size: 46px; }
  .bh-params { grid-template-columns: 1fr; gap: 36px; }
}

@media (max-width: 860px) {
  .bh-facts2 { grid-template-columns: 1fr; }
  .bh-cta-band--future { flex-wrap: wrap; padding: 32px 28px; gap: 26px; }
}

/* --- Obsługa formalna budowy ---------------------------------------------- */

/* Zasięg jak w regule wariantu hero — patrz uwaga przy `--22`. */
.bh-whyhero .bh-whyhero__head--tight { margin: 0; }
/* Zasięg jak w regule wariantu hero, inaczej tamta wygrywa na swoistości. */
.bh-whyhero .bh-whyhero__title--22 { max-width: 22ch; }
.bh-whyhero__actions--gap { margin: 0 0 26px; }
.bh-whyhero__badges--left { justify-content: flex-start; }

/* Nagłówek sekcji bez leadu — sam odstęp pod spodem. */
.bh-whystack--notitle { margin: 0 0 40px; }

.bh-services { gap: 18px; }
.bh-service {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 22px;
  padding: 26px 26px 24px;
  transition: border-color .3s, transform .3s;
}
.bh-service:hover { border-color: var(--bh-accent); transform: translateY(-3px); }
.bh-service__num { font: 700 11.5px/1 var(--bh-font); color: #B3BEC5; margin: 0 0 16px; }
.bh-service__title { font: 700 17.5px/1.25 var(--bh-font); letter-spacing: -.018em; margin: 0 0 10px; }
.bh-service__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); }
.bh-service__desc--tags { margin: 0 0 16px; }
.bh-service__tags { display: flex; gap: 6px; flex-wrap: wrap; }
.bh-service__tag {
  font: 600 11px/1 var(--bh-font);
  color: var(--bh-text-3);
  background: var(--bh-surface-alt);
  padding: 8px 11px;
  border-radius: var(--bh-pill);
}

/* --- Pakiet adaptacji ----------------------------------------------------- */

.bh-offer { display: grid; grid-template-columns: 1.35fr .65fr; gap: 20px; align-items: start; }

.bh-offer__main {
  background: var(--bh-accent-bg);
  border: 1.5px solid var(--bh-accent);
  border-radius: 28px;
  padding: 36px 36px 32px;
}
.bh-offer__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 30px;
  margin: 0 0 24px;
}
.bh-offer__kicker {
  font: 600 11px/1 var(--bh-font);
  letter-spacing: .11em;
  text-transform: uppercase;
  margin: 0 0 12px;
}
.bh-offer__title { font: 800 28px/1.15 var(--bh-font); letter-spacing: -.028em; margin: 0 0 8px; }
.bh-offer__sub { font: 400 13.5px/1.5 var(--bh-font); color: var(--bh-text-2); }
.bh-offer__price { flex: none; text-align: right; }
.bh-offer__amount { font: 800 32px/1 var(--bh-font); letter-spacing: -.035em; white-space: nowrap; }
.bh-offer__note { font: 400 12px/1.4 var(--bh-font); color: var(--bh-text-2); margin: 8px 0 0; }

.bh-offer__list { background: var(--bh-surface); border-radius: var(--bh-r-xl); padding: 10px 22px 22px; }
.bh-offer__item {
  display: flex;
  gap: 12px;
  font: 400 13.5px/1.6 var(--bh-font);
  color: var(--bh-text-3);
  padding: 13px 0;
  border-bottom: 1px solid var(--bh-rule);
}
.bh-offer__item:last-child { padding: 13px 0 0; border-bottom: 0; }
.bh-offer__item b { font-weight: 700; }
.bh-offer__mark { flex: 0 0 10px; min-width: 0; color: var(--bh-ink); }

.bh-offer__cta {
  display: block;
  text-align: center;
  font: 700 15px/1 var(--bh-font);
  color: var(--bh-accent);
  background: var(--bh-ink);
  padding: 18px;
  border-radius: var(--bh-pill);
  margin: 22px 0 0;
  transition: background var(--bh-t-base), color var(--bh-t-base);
}
.bh-offer__cta:hover { background: var(--bh-ink-soft); color: var(--bh-accent); }

.bh-offer__aside { background: var(--bh-surface-alt); border-radius: 28px; padding: 32px 30px 30px; }
.bh-offer__aside-title { font: 700 17px/1.25 var(--bh-font); letter-spacing: -.018em; margin: 0 0 8px; }
.bh-offer__aside-lead { font: 400 12.5px/1.55 var(--bh-font); color: var(--bh-text-4); margin: 0 0 20px; }
.bh-offer__excluded { display: flex; flex-direction: column; gap: 12px; }
.bh-offer__out { display: flex; gap: 11px; font: 400 13px/1.55 var(--bh-font); color: #8A9AA5; }
.bh-offer__cross { flex: none; color: #C7CFD4; }

/* --- Małe kafle „dla kogo" ------------------------------------------------ */

.bh-mini { gap: 16px; }
.bh-mini__card {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 22px;
  padding: 24px 24px 22px;
}
.bh-mini__title { font: 700 17px/1.25 var(--bh-font); letter-spacing: -.018em; margin: 0 0 9px; }
.bh-mini__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); }

@media (max-width: 1100px) {
  .bh-offer { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  /* Tytuł i kwota przestają stać obok siebie. Kwota ma `flex: none`, więc
     nie kurczyła się ani o piksel, a dopisek pod nią („brutto za kompletny
     pakiet") jest po przetłumaczeniu dłuższy — razem wypychały sekcję poza
     ekran. Pod sobą obie części mają całą szerokość karty. */
  .bh-offer__head { display: block; }
  .bh-offer__price { text-align: left; margin: 18px 0 0; }
  .bh-offer__amount { font-size: 28px; }
}

/* --- Personalizacja domu -------------------------------------------------- */

.bh-whyhero .bh-whyhero__head--820 { max-width: 820px; margin: 0 0 40px; }
/* Modyfikatory nagłówka hero: `--18` mówi o szerokości łamania, `--58`
   o stopniu pisma — na „Personalizacji" jest 58 px, na „Wnętrzach" 56 px. */
.bh-whyhero .bh-whyhero__title--18 { max-width: 18ch; }
.bh-whyhero .bh-whyhero__title--58 { font-size: 58px; line-height: 1.03; }
.bh-whyhero .bh-whyhero__lead--54 { max-width: 54ch; }

.bh-triple { gap: 18px; }
.bh-triple__card { background: var(--bh-surface-alt); border-radius: 22px; padding: 26px 26px 24px; }
.bh-triple__title { font: 700 18px/1.2 var(--bh-font); letter-spacing: -.02em; margin: 0 0 8px; }
.bh-triple__desc { font: 400 13.5px/1.5 var(--bh-font); color: var(--bh-text-2); }

/* Pasek sekcji z odstępem 30 px — nad notą, nie nad kartami. */
.bh-whybar--30 { margin-bottom: 30px; }

/* Nota pełnej szerokości, na białym tle, z ikoną wyrównaną do pierwszej linii. */
/* Szeroka nota ma interlinię 1,6 zamiast 1,5 z wariantu bazowego. */
.bh-notice--wide {
  align-items: flex-start;
  line-height: 1.6;
  background: var(--bh-surface);
  border-radius: 18px;
  padding: 20px 24px;
  margin: 0 0 22px;
}
.bh-notice--wide .bh-dot { margin: 7px 0 0; }

.bh-options { gap: 18px; }
.bh-option {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 22px;
  padding: 26px 26px 24px;
  transition: border-color .3s, transform .3s;
}
.bh-option:hover { border-color: var(--bh-accent); transform: translateY(-3px); }
.bh-option__title { font: 700 17.5px/1.25 var(--bh-font); letter-spacing: -.018em; margin: 0 0 16px; }
.bh-option__items { display: flex; flex-direction: column; gap: 10px; }
.bh-option__item { display: flex; gap: 10px; font: 400 13.5px/1.45 var(--bh-font); color: var(--bh-text-3); }
.bh-option__dot { width: 5px; height: 5px; margin: 7px 0 0; }
.bh-option__tags { display: flex; gap: 6px; flex-wrap: wrap; }
.bh-option__tag {
  font: 600 11.5px/1 var(--bh-font);
  color: var(--bh-text-3);
  background: var(--bh-surface-alt);
  padding: 9px 12px;
  border-radius: var(--bh-pill);
}

.bh-quote {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--bh-ink);
  border-radius: 22px;
  padding: 30px 28px;
  margin: 0;
}
.bh-quote__mark { font: 400 34px/1 var(--bh-font); color: var(--bh-accent); margin: 0 0 12px; }
.bh-quote__text { font: 700 19px/1.35 var(--bh-font); letter-spacing: -.02em; color: #fff; }

/* --- Co w cenie, co opcjonalnie ------------------------------------------- */

.bh-scope2 { gap: 20px; }
.bh-scope2__card {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: var(--bh-r-2xl);
  padding: 32px 32px 28px;
}
.bh-scope2__card--accent { background: var(--bh-accent-bg); border: 1.5px solid var(--bh-accent); }
.bh-scope2__title { font: 800 24px/1.15 var(--bh-font); letter-spacing: -.025em; margin: 0 0 6px; }
.bh-scope2__lead { font: 400 13.5px/1.5 var(--bh-font); color: var(--bh-text-2); margin: 0 0 18px; }

.bh-scope2__list { background: var(--bh-surface); border-radius: 18px; padding: 8px 22px 16px; }
.bh-scope2__card:not(.bh-scope2__card--accent) .bh-scope2__list { background: var(--bh-surface-alt); }
.bh-scope2__item {
  display: flex;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(12, 26, 34, .1);
}
.bh-scope2__item--last { padding: 14px 0 0; border-bottom: 0; }
.bh-scope2__mark { flex: 0 0 10px; min-width: 0; color: var(--bh-ink); }
.bh-scope2__mark--plus { color: var(--bh-text-3); }
.bh-scope2__name { display: block; font: 700 14px/1.3 var(--bh-font); margin: 0 0 4px; }
.bh-scope2__desc { display: block; font: 400 12.5px/1.5 var(--bh-font); color: var(--bh-text-2); }

/* --- Trzy kroki personalizacji -------------------------------------------- */

.bh-path--3 { margin: 0 0 40px; }
.bh-path__card--flat { padding: 30px 28px 28px; }
.bh-path__index { font: 800 13px/1 var(--bh-font); color: #B3BEC5; margin: 0 0 18px; }
.bh-path__card--first .bh-path__index { color: var(--bh-ink); }
.bh-path__title--lg { font-size: 20px; letter-spacing: -.02em; margin: 0 0 10px; }

/* Zasięg jak w wariancie pasa, inaczej tamten wygrywa na swoistości. */
.bh-cta-band .bh-cta-band__text--52 { max-width: 52ch; }

@media (max-width: 860px) {
  .bh-scope2 { grid-template-columns: 1fr; }
}

/* --- Przemyślane wnętrza -------------------------------------------------- */

.bh-isohero { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; margin: 0 0 40px; }
.bh-isohero .bh-eyebrow { display: block; margin: 0 0 16px; }

.bh-iso { background: var(--bh-surface-alt); border-radius: 28px; padding: 24px; text-align: center; margin: 0; }
.bh-iso img { width: 100%; height: auto; margin: 0 0 10px; }
.bh-iso__caption { font: 400 12px/1.4 var(--bh-font); color: var(--bh-text-4); }

/* Filozofia: pięć kolumn w siatce po trzy plus cytat na ostatnim miejscu. */
.bh-rules--wrap { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 28px; margin: 0; }
.bh-quote--rule { border-radius: 22px; padding: 28px 26px; }
.bh-quote--rule .bh-quote__mark { font-size: 32px; margin: 0 0 10px; }
.bh-quote--rule .bh-quote__text { font-size: 18px; line-height: 1.4; margin: 0 0 12px; }
/* Odcień spoza tokenów — ten sam, którego prototyp używa na granacie. */
.bh-quote__source { font: 400 12px/1.4 var(--bh-font); color: #8FA0AC; }

/* --- Strefy dzienna i nocna ----------------------------------------------- */

.bh-whystack--36 { margin: 0 0 36px; }

.bh-zones { display: flex; flex-direction: column; gap: 20px; }
.bh-zone {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 40px;
  align-items: center;
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 28px;
  overflow: hidden;
  padding: 0 0 0 40px;
}
/* Odwrócona strefa ma zdjęcie po lewej — kolejność zmienia siatka, nie DOM. */
.bh-zone--flip { grid-template-columns: .9fr 1.1fr; padding: 0 40px 0 0; }
.bh-zone--flip .bh-zone__body { order: 2; }
.bh-zone--flip .bh-zone__media { order: 1; }

.bh-zone__body { padding: 38px 0; }
.bh-zone__kicker {
  font: 600 11px/1 var(--bh-font);
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--bh-text-4);
  margin: 0 0 14px;
}
.bh-zone__title { font: 800 26px/1.15 var(--bh-font); letter-spacing: -.028em; margin: 0 0 12px; }
.bh-zone__desc { font: 400 15px/1.65 var(--bh-font); color: var(--bh-text-2); margin: 0 0 22px; max-width: 44ch; }
.bh-zone__items { display: flex; flex-direction: column; gap: 11px; padding: 20px 0 0; border-top: 1px solid var(--bh-rule); }
.bh-zone__item { display: flex; gap: 11px; font: 400 13.5px/1.45 var(--bh-font); color: var(--bh-text-3); }
.bh-zone__mark { flex: 0 0 10px; min-width: 0; color: var(--bh-ink); }

/* Zdjęcie jest wyjęte z przepływu (`absolute`), więc nie wnosi swojej
   wysokości do wiersza siatki — kadr przycina się do wysokości kolumny
   z tekstem, tak jak w projekcie. W przepływie portretowy plik 1536×2048
   rozpychał kartę z 318 px do 673 px. */
.bh-zone__media { position: relative; align-self: stretch; background: #EEF1F3; overflow: hidden; }
.bh-zone__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* --- Układy i warianty ---------------------------------------------------- */

.bh-layouts { gap: 18px; margin: 0 0 22px; }
.bh-layout {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 24px;
  overflow: hidden;
  transition: border-color .3s, transform .3s;
}
.bh-layout:hover { border-color: var(--bh-accent); transform: translateY(-4px); }
.bh-layout__media { position: relative; aspect-ratio: 4 / 3; background: #EEF1F3; overflow: hidden; }
.bh-layout__media img { width: 100%; height: 100%; object-fit: cover; }
.bh-layout__area {
  position: absolute;
  top: 12px; right: 12px;
  font: 800 12.5px/1 var(--bh-font);
  color: var(--bh-ink);
  background: var(--bh-accent);
  padding: 9px 11px;
  border-radius: 9px;
}
.bh-layout__body { padding: 24px 26px 0; }
.bh-layout__title { font: 800 21px/1.15 var(--bh-font); letter-spacing: -.025em; margin: 0 0 10px; }
.bh-layout__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 18px; }
.bh-layout__items {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 16px 0 0;
  border-top: 1px solid var(--bh-rule);
  margin: 0 0 20px;
}
.bh-layout__item { display: flex; gap: 10px; font: 400 13px/1.45 var(--bh-font); color: var(--bh-text-3); }
.bh-layout__dot { width: 5px; height: 5px; margin: 7px 0 0; }
.bh-layout__cta {
  display: block;
  text-align: center;
  font: 700 13.5px/1 var(--bh-font);
  color: var(--bh-ink);
  border: 1px solid var(--bh-border-strong);
  padding: 14px;
  border-radius: var(--bh-pill);
  margin: 0 26px 26px;
  transition: border-color .25s, background .25s;
}
.bh-layout__cta:hover { border-color: var(--bh-accent); background: var(--bh-accent); }

.bh-helprow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  background: var(--bh-surface);
  border-radius: 22px;
  padding: 26px 30px;
}
.bh-helprow__title { font: 700 17px/1.25 var(--bh-font); margin: 0 0 6px; }
.bh-helprow__desc { font: 400 13.5px/1.5 var(--bh-font); color: var(--bh-text-2); }
.bh-helprow__cta { flex: none; padding: 16px 22px; }

/* --- Estetyka ------------------------------------------------------------- */

.bh-aesthetic { display: grid; grid-template-columns: 1.05fr .95fr; gap: 52px; align-items: center; }
.bh-aesthetic .bh-eyebrow { display: block; margin: 0 0 16px; }
.bh-aesthetic__title { font-size: 40px; line-height: 1.06; letter-spacing: -.032em; max-width: 20ch; margin: 0 0 16px; }
.bh-aesthetic__lead { font: 400 16px/1.65 var(--bh-font); color: var(--bh-text-2); margin: 0 0 26px; max-width: 48ch; }
.bh-aesthetic__items { display: flex; flex-direction: column; gap: 12px; }
.bh-aesthetic__item { display: flex; gap: 11px; font: 400 14.5px/1.5 var(--bh-font); color: var(--bh-text-3); }
.bh-aesthetic__mark { flex: 0 0 10px; min-width: 0; color: var(--bh-ink); }

.bh-persocard {
  background: var(--bh-accent-bg);
  border: 1.5px solid var(--bh-accent);
  border-radius: var(--bh-r-2xl);
  padding: 32px 30px 30px;
}
.bh-persocard__title { font: 800 22px/1.15 var(--bh-font); letter-spacing: -.025em; margin: 0 0 10px; }
.bh-persocard__desc { font: 400 14px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 22px; }
.bh-persocard__tags { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 24px; }
.bh-persocard__tag {
  font: 600 12px/1 var(--bh-font);
  color: var(--bh-ink);
  background: var(--bh-surface);
  padding: 11px 14px;
  border-radius: var(--bh-pill);
}
.bh-persocard__cta {
  display: block;
  text-align: center;
  font: 700 14px/1 var(--bh-font);
  color: var(--bh-accent);
  background: var(--bh-ink);
  padding: 16px;
  border-radius: var(--bh-pill);
  transition: background var(--bh-t-base);
}
.bh-persocard__cta:hover { background: var(--bh-ink-soft); color: var(--bh-accent); }

@media (max-width: 1100px) {
  .bh-isohero { grid-template-columns: 1fr; gap: 36px; }
  .bh-aesthetic { grid-template-columns: 1fr; gap: 36px; }
  .bh-rules--wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .bh-zone, .bh-zone--flip { grid-template-columns: 1fr; gap: 0; padding: 0; }
  .bh-zone__body { padding: 28px 24px; }
  .bh-zone--flip .bh-zone__body { order: 0; }
  .bh-zone--flip .bh-zone__media { order: 0; }
  .bh-zone__media { height: 260px; }
  .bh-helprow { flex-wrap: wrap; gap: 18px; }
}

/* --- Technologia ---------------------------------------------------------- */

.bh-whyhero--tech { padding-block: 84px 92px; }
.bh-techhero { display: grid; grid-template-columns: 1.05fr .95fr; gap: 64px; align-items: center; }
.bh-techhero .bh-eyebrow { display: block; margin: 0 0 16px; }
.bh-whyhero .bh-whyhero__title--17 { max-width: 17ch; }
.bh-whyhero .bh-whyhero__lead--50 { max-width: 50ch; }

.bh-crossbox { background: var(--bh-surface-alt); border-radius: 28px; padding: 28px; text-align: center; margin: 0; }
.bh-crossbox img { width: 100%; height: auto; margin: 0 0 18px; }
.bh-crossbox__kicker {
  display: block;
  font: 600 11px/1 var(--bh-font);
  letter-spacing: .11em;
  text-transform: uppercase;
  color: var(--bh-text-4);
  margin: 0 0 8px;
}
.bh-crossbox__title { display: block; font: 700 15px/1.3 var(--bh-font); }

.bh-pillars { gap: 18px; }
.bh-pillar {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 24px;
  padding: 30px 28px 26px;
  transition: border-color .3s, transform .3s;
}
.bh-pillar:hover { border-color: var(--bh-accent); transform: translateY(-3px); }
.bh-pillar__title { font: 800 20px/1.2 var(--bh-font); letter-spacing: -.022em; margin: 0 0 10px; }
.bh-pillar__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 26px; }
.bh-pillar__stat { display: flex; align-items: baseline; gap: 9px; padding: 18px 0 0; border-top: 1px solid var(--bh-rule); }
.bh-pillar__value { font: 800 26px/1 var(--bh-font); letter-spacing: -.03em; }
.bh-pillar__label { font: 400 12px/1.3 var(--bh-font); color: var(--bh-text-4); }

/* --- Dlaczego szkielet drewniany ------------------------------------------ */

.bh-frame { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.bh-frame .bh-eyebrow { display: block; margin: 0 0 16px; }
/* Nagłówek poza paskiem sekcji — stopień trzeba podać wprost. */
.bh-frame__title {
  font-size: 42px;
  line-height: 1.05;
  letter-spacing: -.032em;
  max-width: 18ch;
  margin: 0 0 16px;
}
.bh-frame__lead { font: 400 16.5px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 34px; max-width: 44ch; }
.bh-frame__list { display: flex; flex-direction: column; gap: 26px; }
.bh-frame__item { border-left: 2px solid var(--bh-accent); padding: 0 0 0 20px; }
.bh-frame__item-title { font: 700 18px/1.25 var(--bh-font); letter-spacing: -.018em; margin: 0 0 9px; }
.bh-frame__item-desc { font: 400 14px/1.6 var(--bh-font); color: var(--bh-text-2); }

.bh-frame__tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bh-frame__tile { background: var(--bh-surface-alt); border-radius: 24px; padding: 26px 24px; }
.bh-frame__tile--dark { grid-column: span 2; background: var(--bh-ink); color: #fff; padding: 30px 26px; }
.bh-frame__big { font: 800 44px/1 var(--bh-font); letter-spacing: -.04em; color: var(--bh-accent); margin: 0 0 10px; }
.bh-frame__caption { font: 700 15px/1.3 var(--bh-font); }
.bh-frame__value { font: 800 24px/1.1 var(--bh-font); letter-spacing: -.03em; margin: 0 0 8px; }
.bh-frame__desc { font: 400 12.5px/1.5 var(--bh-font); color: var(--bh-text-2); }

/* --- Porównanie: trzy strumienie komórek ---------------------------------- */

.bh-vs { background: var(--bh-surface); border-radius: 28px; padding: 14px 34px 34px; }
.bh-vs__grid { display: grid; grid-template-columns: .9fr 1.15fr 1.15fr; align-items: stretch; }

/* Podpis „czyja to wartość" jest potrzebny dopiero po rozłożeniu tabeli
   na telefonie — w układzie kolumnowym powtarzałby nagłówek dziesięć razy. */
.bh-vs__who { display: none; }

.bh-vs__head {
  font: 600 10.5px/1 var(--bh-font);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #B3BEC5;
  align-self: end;
}
.bh-vs__head--criterion { padding: 22px 20px 16px 0; }
.bh-vs__head--theirs { padding: 22px 0 16px 24px; }
/* Kolumna „Bory Home" ma ciągłe kremowe tło od nagłówka po ostatni wiersz. */
.bh-vs__head--ours {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 20px 24px 16px;
  background: var(--bh-accent-bg);
  border-radius: 18px 18px 0 0;
  font: 700 12px/1 var(--bh-font);
  letter-spacing: .1em;
  color: var(--bh-ink);
  align-self: stretch;
}

.bh-vs__criterion {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 24px 20px 24px 0;
  border-bottom: 1px solid var(--bh-rule);
}
.bh-vs__num { flex: none; font: 700 11px/1 var(--bh-font); color: #B3BEC5; }
.bh-vs__label { font: 700 15px/1.3 var(--bh-font); }

.bh-vs__ours { padding: 24px; background: var(--bh-accent-bg); }
.bh-vs__ours--last { border-radius: 0 0 18px 18px; }
.bh-vs__theirs { padding: 24px 0 24px 24px; border-bottom: 1px solid var(--bh-rule); }
.bh-vs__cell--last { border-bottom: 0; }

.bh-vs__value {
  display: flex;
  align-items: center;
  gap: 9px;
  font: 800 16.5px/1.2 var(--bh-font);
  letter-spacing: -.02em;
  margin: 0 0 8px;
}
/* Kolumna tradycyjna ma o stopień lżejszy i mniejszy napis. */
.bh-vs__value--muted { font: 700 16px/1.2 var(--bh-font); color: var(--bh-text-2); }
.bh-vs__icon { display: flex; flex: none; color: var(--bh-ink); }
.bh-vs__icon--muted { color: #B3BEC5; }
.bh-vs__desc { font: 400 13px/1.55 var(--bh-font); color: var(--bh-text-2); }
.bh-vs__desc--muted { color: var(--bh-text-4); }

.bh-vs__note {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  background: var(--bh-surface);
  border-radius: 12px;
  padding: 12px 14px;
  margin: 12px 0 0;
  font: 400 11.5px/1.5 var(--bh-font);
  color: var(--bh-text-2);
}
.bh-vs__note .bh-dot { width: 5px; height: 5px; margin: 5px 0 0; }
.bh-vs__note b { font-weight: 700; color: var(--bh-ink); }

/* --- Pas pytań technicznych ----------------------------------------------- */

.bh-cta-band--wide { gap: 48px; padding: 52px 56px; border-radius: 28px; flex-wrap: nowrap; }
.bh-cta-band__text--16 { font-size: 16px; line-height: 1.6; max-width: 52ch; }
.bh-cta-band--wide .bh-cta-band__actions { flex: none; gap: 10px; }
.bh-cta-band--wide .bh-cta-band__cta { padding: 19px 26px; }
.bh-cta-band--wide .bh-btn--on-dark { padding: 18px 26px; border-color: rgba(255, 255, 255, .24); }

@media (max-width: 1100px) {
  .bh-techhero { grid-template-columns: 1fr; gap: 36px; }
  .bh-frame { grid-template-columns: 1fr; gap: 36px; }
}

@media (max-width: 860px) {
  .bh-vs { padding: 14px 20px 24px; overflow-x: auto; contain: paint; }
  .bh-vs__grid { min-width: 640px; }
  .bh-cta-band--wide { flex-wrap: wrap; padding: 32px 28px; gap: 24px; }
}

/* --- Generalne wykonawstwo -------------------------------------------------
   Strona siedzi w zakładce „Poznaj nas", ale konstrukcyjnie należy do rodziny
   „dlaczego my" — hero do lewej, kolumny z żółtą kreską i ścieżka w krokach.
   Dlatego dzieli ten arkusz, zamiast dublować komponenty w about.css. */

.bh-gcvhero .bh-whyhero__head { max-width: 820px; margin-bottom: 0; }
.bh-gcvhero .bh-whyhero__title { font-size: 58px; }
/* Prototyp tej strony podkreśla nagłówek odrobinę węższym marginesem. */
.bh-gcvhero .bh-mark { padding: 0 12px 5px; }
.bh-gcvhero .bh-whyhero__actions { margin: 0 0 26px; }
.bh-gcvhero .bh-whyhero__badges { justify-content: flex-start; }

/* Pasy zdjęć na tej stronie są wyższe niż domyślne 560px i mają równe kolumny. */
.bh-photoband--tall { height: 600px; }
.bh-photoband--thirds { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* Nagłówki sekcji są o stopień mniejsze niż domyślne H2 (jak w pasku). */
.bh-gcvhead .bh-h2 { font-size: 42px; line-height: 1.05; }
.bh-gcvhead--center { margin: 0 auto 44px; }
.bh-gcvhead--center .bh-h2 { margin: 0 auto 14px; }
.bh-gcvhead--center .bh-lead { font-size: 16px; line-height: 1.6; max-width: 48ch; }
.bh-gcvhead--40 { margin: 0 0 40px; }
.bh-gcvhead--40 .bh-h2 { margin: 0; }
.bh-gcvhead--36 { margin: 0 0 36px; }
.bh-gcvhead--36 .bh-h2 { margin: 0; }
.bh-gcvbar--44 { margin-bottom: 44px; }

/* Dwa modele budowy — karta „nasza" na żółtym tle. */
.bh-gcvmodel { gap: 20px; }
.bh-gcvmodel__card {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: var(--bh-r-2xl);
  padding: 32px 32px 30px;
}
.bh-gcvmodel__card--ours { background: var(--bh-accent-bg); border: 1.5px solid var(--bh-accent); }

.bh-gcvmodel__label {
  font: 600 11px/1 var(--bh-font);
  letter-spacing: .11em;
  text-transform: uppercase;
  color: #B3BEC5;
  margin: 0 0 14px;
}
.bh-gcvmodel__card--ours .bh-gcvmodel__label { color: var(--bh-ink); }
.bh-gcvmodel__title { font: 800 24px/1.15 var(--bh-font); letter-spacing: -.025em; margin: 0 0 12px; }
.bh-gcvmodel__desc { font: 400 14.5px/1.6 var(--bh-font); color: var(--bh-text-2); margin: 0 0 22px; }

.bh-gcvmodel__list {
  display: flex;
  flex-direction: column;
  gap: 11px;
  padding: 20px 0 0;
  border-top: 1px solid var(--bh-rule);
}
.bh-gcvmodel__card--ours .bh-gcvmodel__list { border-top-color: rgba(12, 26, 34, .1); }
.bh-gcvmodel__item { display: flex; gap: 10px; font: 400 13.5px/1.45 var(--bh-font); color: #8A9AA5; }
.bh-gcvmodel__card--ours .bh-gcvmodel__item { color: var(--bh-text-3); }
/* Znaki ✓/✕ pochodzą z fontu zastępczego — bez stałej szerokości ich zmiana
   przesuwałaby tekst względem prototypu. */
.bh-gcvmodel__sign { flex: none; color: #B3BEC5; }
.bh-gcvmodel__card--ours .bh-gcvmodel__sign { color: var(--bh-ink); }

/* Sześć korzyści — trzy kolumny zamiast czterech, z ciaśniejszym wierszem. */
.bh-gcvrules { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 28px; margin: 0; }

/* Zakres prac — karty i plakietki technologii. */
.bh-gcvscope { gap: 18px; margin: 0 0 22px; }
.bh-gcvscope__card {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 22px;
  padding: 26px 26px 24px;
}
.bh-gcvscope__title { font: 700 17.5px/1.25 var(--bh-font); letter-spacing: -.018em; margin: 0 0 10px; }
.bh-gcvscope__desc { font: 400 13.5px/1.6 var(--bh-font); color: var(--bh-text-2); }

.bh-gcvtags { display: flex; gap: 8px; flex-wrap: wrap; }
.bh-gcvtag {
  font: 600 12px/1 var(--bh-font);
  color: var(--bh-ink);
  background: var(--bh-surface);
  padding: 12px 16px;
  border-radius: var(--bh-pill);
}

/* Ścieżka procesu kończy sekcję, więc bez marginesu spod komponentu. */
.bh-gcvpath { margin: 0; }

.bh-gcvfaq .bh-accordion { margin: 0 0 26px; }
.bh-gcvfaq .bh-cta-band__cta { padding: 19px 28px; }
/* Pas CTA na tej stronie ma ciaśniejszy nagłówek i interlinię niż wariant --sm. */
.bh-gcvfaq .bh-cta-band__heading { margin-bottom: 12px; }
.bh-gcvfaq .bh-cta-band__text { line-height: 1.6; }

/* Progi pośrednie tej strony. Modyfikatory `--tall`/`--thirds`/`--gcv*` stoją
   w arkuszu niżej niż reguły bazowe, więc muszą powtórzyć własne zwężenia. */
@media (max-width: 1100px) {
  .bh-gcvrules { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bh-gcvhero .bh-whyhero__title { font-size: 44px; }
}

@media (max-width: 900px) {
  .bh-photoband--tall { height: 340px; }
  .bh-photoband--thirds { grid-template-columns: 1fr 1fr; }
  .bh-photoband--thirds > *:last-child { display: none; }
}

/* --- Pomoc w kredycie ------------------------------------------------------
   Prawie cała strona stoi na komponentach tego arkusza (usługi, przepływ
   kroków, cytat, pasek pomocy, kolumny z kreską). Własne są tylko karty
   „dla kogo" i punktowe różnice wymiarów wobec prototypu. */

.bh-finhero { padding-block: 84px 88px; }
.bh-finhero .bh-whyhero__head { max-width: 800px; margin-bottom: 0; }
.bh-finhero .bh-whyhero__title { font-size: 60px; }
.bh-finhero .bh-whyhero__lead { margin-bottom: 32px; max-width: 56ch; }
.bh-finhero .bh-whyhero__actions { justify-content: center; }
.bh-finhero .bh-mark { padding: 0 12px 5px; }

/* Karty oferty: plakietka trzyma się dołu, więc treść i tag są rozepchnięte. */
.bh-finservices { margin: 0 0 20px; }
.bh-service--split { display: flex; flex-direction: column; justify-content: space-between; }
.bh-service--split:hover { transform: translateY(-4px); }
.bh-service__num--sm { font-size: 11px; }
.bh-service__desc--split { margin: 0 0 20px; }
.bh-service__tag--accent {
  display: inline-flex;
  align-self: flex-start;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--bh-ink);
  background: var(--bh-accent-bg);
  padding: 9px 12px;
}

/* Nagłówek wyśrodkowany — `margin` skrótem, więc z `auto` po bokach,
   inaczej blok 720 px przykleiłby się do lewej krawędzi sekcji. */
/* Paski sekcji mają na tej stronie 44 px odstępu, nie 46 jak w bazie. */
.bh-finbar { margin-bottom: 44px; }

.bh-finhead { margin: 0 auto 44px; }
/* Zasięg rodzica jest konieczny: `.bh-section-head .bh-h2` z komponentów
   ma dwie klasy i inaczej wygrywa swoim marginesem 16 px. */
.bh-finhead .bh-finhead__title { margin: 0 auto 14px; }
.bh-finhead__lead { font-size: 16px; line-height: 1.6; max-width: 44ch; }

/* Pierwszy krok jest wyróżniony żółtym tłem; obwódkę mają wszystkie karty,
   żeby wyróżnienie nie zwężało treści o 2 px względem sąsiadów. */
.bh-finflow .bh-flow__card { border: 1px solid transparent; }
.bh-finflow .bh-flow__card--first { background: var(--bh-accent-bg); border-color: var(--bh-accent); }
.bh-flow__title--20 { font-size: 20px; margin: 0 0 6px; }
.bh-flow__sub { font: 600 12px/1 var(--bh-font); color: var(--bh-text-4); margin: 0 0 12px; }

/* Cytat jako pas na całą szerokość sekcji, nie kolumna obok treści. */
.bh-quote--band { border-radius: 24px; padding: 36px 40px; text-align: center; }
.bh-quote--band .bh-quote__text { font-size: 24px; max-width: 34ch; margin: 0 auto; }

/* Karty „kto korzysta" — podtytuł i dwa punkty pod kreską. */
.bh-finwho { gap: 16px; margin: 0 0 20px; }
.bh-finwho__card {
  background: var(--bh-surface);
  border: 1px solid var(--bh-border);
  border-radius: 22px;
  padding: 24px 24px 22px;
}
.bh-finwho__title { font: 700 17px/1.25 var(--bh-font); letter-spacing: -.018em; margin: 0 0 5px; }
.bh-finwho__sub { font: 400 12.5px/1.3 var(--bh-font); color: var(--bh-text-4); margin: 0 0 16px; }
.bh-finwho__list {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 15px 0 0;
  border-top: 1px solid var(--bh-rule);
}
.bh-finwho__item { display: flex; gap: 9px; font: 400 13px/1.4 var(--bh-font); color: var(--bh-text-3); }
.bh-finwho__check { color: var(--bh-ink); }

@media (max-width: 1100px) {
  .bh-finhero .bh-whyhero__title { font-size: 46px; }
}