/* Builder: hero podstrony (breadcrumbs + H1 + tekst) — wariant ciemny/jasny.
   .breadcrumb stylowane tu, bo blog.css nie ładuje się na zwykłych podstronach. */
.page-hero{padding:44px 0 48px}
.page-hero .breadcrumb{font-size:13px;margin-bottom:24px}
.page-hero .eyebrow{margin-bottom:8px}
.page-hero__title{display:block;font-family:var(--display);font-weight:700;line-height:.98;letter-spacing:.5px;font-size:clamp(34px,5vw,58px);text-transform:uppercase;margin:0}
.page-hero__sub{margin:12px 0 0;font-size:17px;line-height:1.6;max-width:680px}

/* wariant jasny */
.page-hero--light{background:var(--paper);border-bottom:1px solid var(--line);color:var(--ink)}
.page-hero--light .page-hero__title{color:var(--ink)}
.page-hero--light .page-hero__sub{color:var(--ink-2)}
.page-hero--light .breadcrumb,.page-hero--light .breadcrumb a{color:var(--muted)}
.page-hero--light .breadcrumb a:hover{color:var(--brand)}

/* wariant ciemny (domyślny, kolor stopki) */
.page-hero--dark{background:var(--ink);color:#fff}
.page-hero--dark .page-hero__title{color:#fff}
.page-hero--dark .page-hero__sub{color:#c9c4be}
.page-hero--dark .breadcrumb,.page-hero--dark .breadcrumb a{color:#8d8881}
.page-hero--dark .breadcrumb a:hover{color:#fff}
.page-hero--dark .breadcrumb .breadcrumb_last{color:#cfcbc6}

@media(max-width:640px){
  .page-hero{padding:32px 0 34px}
}