/* Warianty jednego komponentu; typografia wyłącznie przez role t-*. */
.has-hero .c-site-header {
  position: absolute;
  inset-inline: 0;
  z-index: var(--z-header);
}

.c-site-main--hero { padding-block: var(--space-0); }
.c-page-content { padding-block: var(--section-space); }

.c-hero {
  --color-link: var(--color-hero);
  --color-focus: var(--color-hero);
  --color-action: var(--color-hero);
  --color-action-hover: var(--c-white-muted);
  --color-on-action: var(--color-hero-base);
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  min-block-size: var(--hero-height);
  padding-block: calc(var(--header-height) + var(--space-7)) var(--space-6);
  color: var(--color-hero);
  background: var(--color-hero-base);
}

.c-hero--home { min-block-size: var(--hero-height-home); }
.c-hero--article { min-block-size: var(--hero-height-article); }

.c-hero__media,
.c-hero__media img,
.c-hero::before {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
}

.c-hero__media { z-index: -2; }
.c-hero__media img { object-fit: cover; }
.c-hero::before {
  content: "";
  z-index: -1;
  pointer-events: none;
  background: var(--gradient-hero-photo);
}
.c-hero--home::before { background: var(--gradient-hero-bottom), var(--gradient-hero-home-photo); }
.c-hero--article::before { background: var(--gradient-hero-article-photo); }
.c-hero--gradient::before { background: var(--gradient-hero-plain); }

.c-hero__inner,
.c-hero__content,
.c-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.c-hero__inner,
.c-hero__content { gap: var(--space-6); }
.c-hero__content { inline-size: 100%; }
.c-hero__copy { gap: var(--space-4); inline-size: 100%; }
.c-hero--home .c-hero__copy { gap: var(--space-3); }
.c-hero__description p + p { margin-block-start: var(--space-4); }
.c-hero__desktop-copy { display: none; }
.c-hero__mobile-copy { display: block; }

.c-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-4); max-inline-size: 100%; }
.c-hero__actions--pair { flex-direction: column; inline-size: 100%; }
/* Long editable labels wrap safely; mobile pairs use the full available width. */
.c-hero__actions--pair .c-button { inline-size: 100%; padding-inline: var(--space-2); text-align: center; }
.c-hero__actions .c-button { max-inline-size: 100%; }
.c-hero__actions .c-button[aria-disabled="true"] { opacity: 1; }

.c-hero__breadcrumbs {
  position: absolute;
  inset-block-start: calc(var(--header-height) + var(--breadcrumb-offset));
  inset-inline: 0;
}
.c-hero__breadcrumbs ol { display: flex; gap: var(--space-1); padding: 0; list-style: none; }
.c-hero__breadcrumbs li:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.c-hero__breadcrumbs a { text-decoration: none; }
.c-hero__breadcrumbs a:hover { text-decoration: underline; }
.c-hero__meta { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.c-hero__badge { display: inline-flex; align-items: center; gap: 0.625rem; padding: var(--space-2) var(--space-4); border-radius: var(--radius-full); background: var(--color-badge); }
.c-hero__badge img { flex: none; }

.c-hero--gradient { padding-block: calc(var(--header-height) + var(--space-8)) var(--space-7); min-block-size: 0; }
.c-hero--gradient .c-hero__inner,
.c-hero--gradient .c-hero__content,
.c-hero--gradient .c-hero__copy { align-items: center; text-align: center; }
.c-hero--gradient .c-hero__content { max-inline-size: var(--hero-content-centered-width); margin-inline: auto; }
.c-hero--gradient .c-hero__actions { justify-content: center; }
.c-hero--gradient .c-hero__copy { gap: var(--space-4); }

@media (max-width: 69.999rem) {
  .c-hero:has(.c-hero__actions--pair) .c-hero__content { gap: var(--space-4); }
  .c-hero--home:has(.c-hero__actions--pair) .c-hero__content { gap: var(--space-6); }
}

@media (min-width: 70rem) {
  .c-hero { align-items: center; padding-block: 6.25rem var(--space-0); }
  .c-hero--home { padding-block-start: 5.5rem; }
  .c-hero__content { max-inline-size: var(--hero-content-width); gap: var(--space-7); }
  .c-hero__copy,
  .c-hero--home .c-hero__copy { gap: var(--space-5); }
  .c-hero--home .c-hero__content { max-inline-size: var(--hero-content-home-width); }
  .c-hero--brief .c-hero__content { max-inline-size: var(--hero-content-brief-width); gap: var(--space-6); }
  .c-hero__meta { flex-direction: row; flex-wrap: wrap; }
  .c-hero__actions--pair { flex-direction: row; inline-size: auto; }
  .c-hero__actions--pair .c-button { inline-size: auto; padding-inline: calc(var(--space-6) - var(--border-width-sm)); }
  .c-hero__desktop-copy { display: block; }
  .c-hero__mobile-copy { display: none; }
  .c-hero--article { align-items: flex-end; padding-block-start: calc(var(--header-height) + var(--breadcrumb-offset) + var(--font-size-caption) * var(--line-height-sm) + var(--space-5)); padding-block-end: var(--space-6); }
  .c-hero--article .c-hero__inner { flex-direction: row; align-items: flex-end; justify-content: space-between; }
  .c-hero--article .c-hero__content { max-inline-size: var(--hero-content-article-width); padding-block-end: var(--space-8); }
  .c-hero--gradient { padding-block: calc(var(--header-height) + var(--space-8)) var(--space-7); }
}