/**
 * Aktualność — single article detail page (aktualnosc.php). No Figma
 * reference exists for this template (the source WordPress site has no
 * distinct visual design for individual posts either) — built from the
 * site's existing components/tokens per explicit user request: h1/.text-h1,
 * .text-body-md, .section-column and .btn-underline all come straight from
 * base.css/components.css, only the layout glue below is new.
 */

/* Navbar floats over the hero photo instead of sitting above it in normal
   flow (2026-09-01 fix — same overlay-on-hero technique as every other hero
   page, see .page-home in home.css). Needs the hero itself to start at the
   very top of the page, so this only applies when aktualnosc.php actually
   set body class="page-aktualnosc" (skipped for the "not found" fallback,
   which has no hero photo to float over — see aktualnosc.php). */
@media (min-width: 992px) {
  .page-aktualnosc .site-navbar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10;
  }

  .page-aktualnosc .site-navbar.site-navbar--stuck {
    position: fixed;
  }
}

/* min-height, not a fixed height: the news-card section (below) lives
   INSIDE this hero in normal document flow, on top of a full-bleed photo
   background — if that content ever needs more than one viewport (it
   reliably does: a heading + a full card row + footer is taller than the
   ~660px left over under the navbar on a 900px-tall screen), the container
   grows to fit it instead of clipping/overlapping the article content that
   follows. On an unusually short viewport the photo just crops a bit
   tighter (object-fit:cover) rather than the section overflowing — see the
   2026-09-01 fix note below on .home-news for the bug this replaced. */
.aktualnosc-article__media {
  position: relative;
  min-height: 100vh;
}

/* Direct-child combinator on purpose — .home-news lives inside this same
   container now (see below) and has its own <img> tags several levels down
   (news-card photos, carousel arrow icons); a plain descendant selector
   here matched ALL of them too, stretching the tiny carousel arrow icons to
   fill the entire hero and producing a huge, very wrong-looking diamond
   artifact (2026-09-01, caught in this session — cost real time to trace
   since it looked like a Glass Surface rendering bug at first). */
.aktualnosc-article__media > img {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Mobile: no background photo in the hero, plain white (2026-10-10, user
   request, every article page). Without the photo the 100vh floor would
   only leave an empty white gap under the news cards, so the hero sizes to
   its content. The photo is still in the markup and shown on desktop. */
@media (max-width: 991.98px) {
  .aktualnosc-article__media {
    min-height: 0;
    background: var(--color-white);
  }

  .aktualnosc-article__media > img {
    display: none;
  }
}

/* News-card section, inside the hero, below the navbar (2026-09-01 fix —
   first pass wrongly placed this as its own section AFTER the hero,
   instead of inside it; the follow-up attempt then made it position:absolute
   which overflowed past the hero's fixed 100vh and overlapped the article
   heading below it — this normal-flow version fixes both). On mobile the
   navbar is NOT overlaid (see the media-query-scoped rule above it in this
   file), so the hero already starts below it — .home-news's own 48px
   padding-top is enough. On desktop the navbar floats on top
   (position:absolute, z-index:10), so this needs a bigger top offset to
   clear it — 240px matches the current navbar-glass.php lockup (logo block
   + pill nav, ~224px tall at 1440px, see the trial writeup in
   memory/project-scope.md) plus a small gap; revisit this number if that
   navbar's own height changes. */
.aktualnosc-article__media .home-news {
  position: relative;
  z-index: 2;
}

/* .home-news__footer is a `justify-content: space-between` row of [link,
   carousel-controls] everywhere else — with the link removed here (see the
   comment in aktualnosc.php) that would otherwise leave the lone
   carousel-controls pinned to the left instead of the right. */
.aktualnosc-article__media .home-news__footer {
  justify-content: flex-end;
}

@media (min-width: 992px) {
  .aktualnosc-article__media .home-news {
    padding-top: 240px;
  }
}

.aktualnosc-article__header {
  padding-top: 32px;
  padding-bottom: 16px;
}

.aktualnosc-article__eyebrow {
  margin: 0 0 8px;
  font-family: var(--font-family-base);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
  font-size: 16px;
}

.aktualnosc-article__heading {
  margin: 0;
  max-width: 900px;
  font-family: var(--font-family-hero-heading);
  font-weight: var(--fw-regular);
}

.aktualnosc-article__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 32px;
}

.aktualnosc-article__body p {
  margin: 0;
  max-width: 760px;
  color: var(--color-black);
}

.aktualnosc-article__footer,
.aktualnosc-article__missing {
  padding-bottom: 64px;
}

.aktualnosc-article__missing {
  padding-top: 64px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

@media (min-width: 992px) {
  .aktualnosc-article__header {
    padding-top: 56px;
    padding-bottom: 24px;
  }

  .aktualnosc-article__eyebrow {
    font-size: 20px;
  }
}