/* Sekcja tekst+zdjęcie — blok feuer/tekst-zdjecie (K17; task03.18, makieta: makieta/css/tekst-zdjecie.css — task01.39).
   Wg FeuerDS: „Dlaczego warto 2" 7:7096 (dwa rzędy: zdjęcie z lewej, zdjęcie z prawej),
   „Dlaczego warto 4" 108:4577 (= górny rząd „2"), mobile 7:6934 / 108:4490 (stan 2026-09-13).
   Jeden blok = jeden rząd „zdjęcie + kolumna tekstu" po 6 kolumn siatki; strona zdjęcia
   parametrem bloku (klasa .tekst-zdjecie-rzad-prawy). Bez H2 sekcji i bez odstępu 48 między
   rzędami (task03.18, „Odstępstwa od makiety") — kolejne bloki dzielą odstępy sekcji.
   Kolumna tekstu = treść A40 (.tresc) — bez własnych stylów tekstu.
   Zdjęcie 586×400, bez woalu. Odstęp sekcji u góry / u dołu wyłączany w ustawieniach bloku —
   padding 0 po tej stronie na każdej szerokości.
   Tablet (640–1023) bez projektu — układ mobile. Wartości px z Figmy w rem (baza 16). */

.tekst-zdjecie {
  max-width: 90rem;                       /* stop skali z task01.06 — jak .terminy */
  margin-inline: auto;
  padding-block: var(--odstep-8);         /* 64/64 (ramki 62/75 i 64/64 — kanon 64) */
}

.tekst-zdjecie-bez-gory { padding-top: 0; }
.tekst-zdjecie-bez-dolu { padding-bottom: 0; }

/* Zdjęcie: 586×400 (6 kolumn), kadr cover; kolumna tekstu wyrównana do góry zdjęcia. */
.tekst-zdjecie-foto {
  margin: 0;
  height: 25rem;                          /* 400 */
}

.tekst-zdjecie-foto img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Zdjęcie z prawej: ta sama kolejność w DOM (zdjęcie przed tekstem — na mobile zdjęcie
   zawsze nad tekstem), na desktopie zamiana miejscami przez order. */
.tekst-zdjecie-rzad-prawy .tekst-zdjecie-foto { order: 1; }

/* ---- Tablet i mobile: zdjęcie nad tekstem (ramki 7:6934 / 108:4490) ---- */

/* Selektory z .tekst-zdjecie — wyższa specyficzność niż .siatka / .kol-6 (siatka.css motywu): kolejność arkuszy
   motywu i bloku nie jest pewna. */
@media (max-width: 1023px) {
  .tekst-zdjecie .tekst-zdjecie-rzad { row-gap: var(--odstep-3); }   /* zdjęcie → tekst 24 */

  .tekst-zdjecie .tekst-zdjecie-rzad > * { grid-column: 1 / -1; }   /* jedna kolumna także na tablecie */

  .tekst-zdjecie-rzad-prawy .tekst-zdjecie-foto { order: 0; }

  .tekst-zdjecie-foto {
    height: auto;
    aspect-ratio: 361 / 246;              /* ramka mobile 361×246 */
  }
}