/* Aktualności — K35, task03.34 (styl per komponent — docs/podejscie-css.md). Bez makiety — wg FeuerDS:
   Home Desktop sekcja 2:788 (grupa 1583 szeroka, tło #f5f7fb wystaje poza ramkę 1440), Home Mobile
   2:1558 / 2:1559 / 2:1563. Wartości px z Figmy zapisane w rem (baza 16).
   Typografia i linie w kanonie atomów (spojnosc-designu.md): H2 Bold 32/44.8 (mobile 28/39.2) z akcentem
   A65 (projekt: 32/42 + 34/48, mobile 24/32 + 32/42), data 14/19.6 (14/22), tytuł pozycji tekstowej
   H4 Bold 20/28 (20/32), tytuł dużej karty H3 Bold 26/36.4 (24/32), opis 16/22.4 (16/24),
   linie --kolor-linii (#e2e7ef), link = atom A43 (#262626).
   Tablet (640–1023) bez projektu — układ mobile, jak w belce informacyjnej i stopce. */

.aktualnosci {
  position: relative;
  isolation: isolate;                      /* znak w tle (z-index -1) nad tłem sekcji, pod treścią */
  overflow: hidden;                        /* znak ucięty krawędzią sekcji… */
  max-width: 90rem;                        /* stop skali z task01.06 — jak inne sekcje */
  margin-inline: auto;
  padding-block: var(--odstep-8);          /* 64 / 64 jak pozostałe sekcje (projekt: 82 / 112, mobile 64 / 128 — rejestr spojnosc-designu.md) */
  background: var(--kolor-tla-wyroznionego);
}

/* …chyba że sekcja zamyka treść strony: znak wchodzi w przezroczystą lewą część pasa certyfikatów
   stopki, pod którą ciągnie się tło sekcji (Home Desktop; wzorzec „Zobacz także" z makiety). */
.wp-block-post-content > .aktualnosci:last-child {
  overflow: visible;
  clip-path: inset(0 0 -10rem 0);          /* znak najwyżej do dołu pasa certyfikatów (160 — stopka.css), nie w ciemną część stopki */
}
body:has(.wp-block-post-content > .aktualnosci:last-child) .stopka-certyfikaty { background: var(--kolor-tla-wyroznionego); }

/* Znak z logo w tle („Logo Big", ikony/logo-duze.svg jako maska) w kolorze tła białego — tylko desktop. */
.aktualnosci-znak {
  position: absolute;
  z-index: -1;
  top: 11.75rem;                           /* 188 od góry sekcji = 124 pod górą nagłówka, jak w projekcie */
  left: 9.6875rem;                         /* 155 od lewej krawędzi */
  width: 71.9375rem;                       /* 1151 */
  height: 40.9375rem;                      /* 655 */
  background: var(--kolor-tla);
  mask: url("../ikony/logo-duze.svg") 0 0 / contain no-repeat;
}

/* ---- Nagłówek: H2 z lewej, link akcji z prawej w osi nagłówka; 32 do pozycji ---- */

.aktualnosci-naglowek {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--odstep-4);
  margin-bottom: var(--odstep-4);
}

.aktualnosci-tytul {
  margin: 0;
  font-size: var(--tekst-32);
  line-height: var(--interlinia-32);
  font-weight: var(--waga-gruba);
}

.aktualnosci-naglowek .link-akcji { flex: none; }

/* ---- Pozycje: duża karta 380 (4 kolumny siatki) + lista trzech tekstowych (8 kolumn) ---- */

.aktualnosci-pozycje {
  display: grid;
  grid-template-columns: 23.75rem minmax(0, 1fr);   /* 380 + reszta kontenera (792) */
  gap: var(--odstep-4);                              /* gutter 32 */
  align-items: start;
}

.aktualnosci-lista {
  margin: 0;
  padding: 0;
  list-style: none;
}

.aktualnosci-lista li + li {                         /* 16 · linia · 16 */
  margin-top: var(--odstep-2);
  padding-top: var(--odstep-2);
  border-top: 1px solid var(--kolor-linii);
}

.aktualnosci-karta {
  display: block;
  color: var(--kolor-tekstu);
  text-decoration: none;
}

.aktualnosci-karta:hover .aktualnosci-nazwa { color: var(--kolor-marki); }   /* hover bez projektu — tytuł w kolorze marki (spojnosc-designu.md) */

.aktualnosci-zdjecie {
  display: block;
  margin-bottom: var(--odstep-3);                    /* 24 do daty */
}

.aktualnosci-zdjecie img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 380 / 264;
  object-fit: cover;
}

.aktualnosci-data {
  display: block;
  font-size: var(--tekst-14);
  line-height: var(--interlinia-14);
}

.aktualnosci-nazwa {
  margin: var(--odstep-05) 0 0;                      /* 4 pod datą */
  font-size: var(--tekst-20);
  line-height: var(--interlinia-20);
  font-weight: var(--waga-gruba);
}

.aktualnosci-pozycje > .aktualnosci-karta .aktualnosci-nazwa {   /* duża karta */
  font-size: var(--tekst-26);                        /* H3 Bold 26/36.4 (projekt: 24/32) */
  line-height: var(--interlinia-26);
}

.aktualnosci-opis {
  margin: var(--odstep-2) 0 0;                       /* 16 pod tytułem */
  font-size: var(--tekst-16);
  line-height: var(--interlinia-16);
}

.aktualnosci-strzalka {                              /* ↗ 32 z wektorem 18 (jak w kaflach — atomy.css) */
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin-top: var(--odstep-2);                       /* 16 */
  color: var(--kolor-marki);
}

.aktualnosci-strzalka svg {
  width: 1.125rem;
  height: 1.125rem;
}

/* Edytor: komunikat w miejscu pozycji, gdy nie ma wpisów. */
.aktualnosci-brak {
  margin: 0;
  font-size: var(--tekst-16);
  line-height: var(--interlinia-16);
  color: var(--kolor-tekstu-pomocniczy);
}

/* ---- Mobile (Home Mobile; także tablet): nagłówek, 16, link, 24, pozycje w stosie
   rozdzielone 24 · linia · 24; bez znaku. ---- */

@media (max-width: 1023px) {
  .aktualnosci-znak { display: none; }

  .aktualnosci-naglowek {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--odstep-2);
    margin-bottom: var(--odstep-3);
  }

  .aktualnosci-tytul {
    font-size: var(--tekst-28);
    line-height: var(--interlinia-28);
  }

  .aktualnosci-pozycje {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .aktualnosci-lista li,
  .aktualnosci-lista li + li {
    margin-top: var(--odstep-3);
    padding-top: var(--odstep-3);
    border-top: 1px solid var(--kolor-linii);
  }

  .aktualnosci-zdjecie img { aspect-ratio: 361 / 249; }
}