@charset "UTF-8";
/* ============================================================
   PAGE-HEADER — banner podstron: breadcrumbs + H1.
   Wzór 1:1 z katalogu produktów (nk-catalog-banner): jasne tło,
   szare okruszki z separatorem "/", duży czarny tytuł, linia pod spodem.
   Padding-top robi miejsce pod fixed header — wysokość bierzemy z
   --header-height (definicja: templates/default/header/style.scss,
   64px mobile / 92px desktop). NIE definiuj jej tutaj drugi raz.
   ============================================================ */
.tb-page-header {
  width: 100%;
  background: var(--wp--preset--color--white);
  border-bottom: 1px solid rgba(11, 13, 18, 0.08);
}
.tb-page-header__content {
  padding: calc(var(--header-height) + var(--space-md)) 0 var(--space-lg);
}
.tb-page-header__title {
  margin: 0;
  font-size: clamp(1.75rem, 3.2vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -0.015em;
  line-height: 1.15;
  color: var(--wp--preset--color--black);
}

.tb-breadcrumbs {
  margin-bottom: var(--space-md);
}
.tb-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
  line-height: 1.4;
}
.tb-breadcrumbs li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.tb-breadcrumbs li + li::before {
  content: "/";
  color: var(--wp--preset--color--gray);
  opacity: 0.6;
}
.tb-breadcrumbs a {
  color: var(--wp--preset--color--gray);
  transition: color var(--transition, 220ms ease);
}
.tb-breadcrumbs a:hover {
  color: var(--wp--preset--color--primary);
}
.tb-breadcrumbs span[aria-current] {
  color: var(--wp--preset--color--black);
  font-weight: 600;
}