/* MW Motyw — BLOG: lista wpisów + dodatki wpisu (proza z strona.css) */

/* rytm jak home: utility .mw-sections (tokeny.css); manifest z wlasnym gutterem */
/* stronicowanie nalezy do siatki: 48 pod kartami, nie odstep sekcji */
.mw-blog__main > .navigation.pagination{ margin-block-start:calc(var(--mw-s7) - var(--mw-section-gap)); }
.mw-blog__main > :not(.mw-manifesto){ padding-inline:var(--mw-page-pad); }

/* telefon 1, ~670 px 2, od 900 stale 3 */
.mw-blog__grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(20rem,100%),1fr)); gap:var(--mw-tile-gap); }

/* desktop: okruszki i manifest w jednym wierszu, 96 nad manifestem */
@media (width >= 900px){ /* bp:desktop */
  .mw-blog__main{ grid-template-columns:auto minmax(0,1fr); align-items:baseline; padding-block-start:var(--mw-section-gap); }
  .mw-blog__main > :not(.mw-okruszki, .mw-manifesto){ grid-column:1 / -1; }
  /* okruszki na linii eyebrow: to samo podniesienie co .mw-manifesto__eyebrow */
  .mw-blog__main > .mw-okruszki{ translate:0 calc((var(--mw-fs-display) * .625 - 1em * .65) / -2); }
  .mw-blog__grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (width < 900px){ /* bp:desktop */
  .mw-blog__main .mw-post-card__body{ padding:var(--mw-s2) var(--mw-s3) var(--mw-s3); }
}

/* cien mocniejszy niz opinia */
.mw-post-card{ display:flex; flex-direction:column; box-shadow:var(--mw-shadow-strong); }
.mw-post-card__media{ display:block; aspect-ratio:1200/628; /* proporcje okladek wpisow: napis w grafice bez obcietych bokow */ overflow:hidden; background:var(--mw-surface-2); border-radius:var(--mw-radius); }
/* zoom jak pory roku na home: 1.03, .6s, tylko mysz od 900 */
.mw-post-card__media img{ transition:scale .6s var(--mw-ease); } /* wypelnienie kadru: utility w tokeny.css */
@media (hover: hover) and (width >= 900px){ /* bp:desktop */ .mw-post-card:hover .mw-post-card__media img{ scale:1.03; } }
/* skora karty: utility „karta biala” w tokeny.css (jak opinia na home) */
.mw-post-card__body{ display:flex; flex-direction:column; flex:1; gap:var(--mw-s2); padding:var(--mw-s3) var(--mw-s4) var(--mw-s4); container-type:inline-size; }
/* kroj, waga, rozmiar: utility tytulu nad akapitem w tokeny.css */
.mw-post-card__title{ line-height:var(--mw-lh-snug); text-wrap:pretty; }
/* hover jak linki tekstowe sklepu: podkreslenie, kolor bez zmian */
.mw-post-card__title a{ color:var(--mw-ink); text-decoration:none; }
.mw-post-card__title a:is(:hover, :focus-visible){ text-decoration:underline; }
.mw-widok .mw-post-card__excerpt{ color:var(--mw-ink-3); margin-block:var(--mw-s2) var(--mw-s3); }
/* krój, kreska i zjazd: utility link-etykieta w tokeny.css */
.mw-post-card__more{ margin-top:auto; align-self:flex-start; text-decoration:none; }

/* meta: data, autor, czas; krój z utility etykiety */
:is(.mw-post-card__meta, .mw-post__meta){ color:var(--mw-ink-3); }
.mw-widok :is(.mw-post-card__meta, .mw-post__meta){ letter-spacing:var(--mw-ls-caps-sm); } /* drobne wersaliki, jak liczniki (14.10) */
/* karta: data z lewej, autor na srodku, czas z prawej */
.mw-widok .mw-post-card__meta{ font-size:var(--mw-fs-xs); display:grid; grid-template-columns:auto 1fr auto; column-gap:var(--mw-s2); align-items:baseline; margin-block-end:var(--mw-s2); }
.mw-post-card__meta > :nth-child(2){ text-align:center; }
/* pelna albo krotka wersja (post-meta.php): krotka na telefonie (karta i wpis) */
.mw-post-meta__short{ display:none; }
@media (width < 900px){ /* bp:desktop */
  /* telefon: data, autor i czas w jednym wierszu; 14 px to minimum wersalikow, wiec ciasniej litery */
  .mw-widok :is(.mw-post-card__meta, .mw-post__meta){ white-space:nowrap; }
  :is(.mw-post-card__meta, .mw-post__meta) .mw-post-meta__long{ display:none; }
  :is(.mw-post-card__meta, .mw-post__meta) .mw-post-meta__short{ display:inline; }
}
/* desktop, waska karta (do ~1440): data i czas w wierszu, autor pod spodem */
@media (width >= 900px){ /* bp:desktop */
  @container (width < 28rem){
    .mw-widok .mw-post-card__meta{ grid-template-columns:auto auto; justify-content:space-between; }
    .mw-post-card__meta > :nth-child(2){ grid-column:1 / -1; order:1; text-align:start; } /* autor na koniec, cala szerokosc */
  }
}

/* paginacja WP: jeden rzad, bez ramek; biezaca podkreslona, reszta na hover */
/* center, nie baseline: rozne kroje cyfr i „Starsze” rozpychaly pasek do 52 (Tomek 07.10) */
.mw-blog__main .nav-links{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:var(--mw-s2) var(--mw-s4); }
.mw-widok .mw-blog__main .page-numbers{ display:inline-flex; align-items:baseline; justify-content:center; gap:var(--mw-s2); min-inline-size:var(--mw-control-h); min-block-size:var(--mw-control-h);
  line-height:1; font-variant-numeric:lining-nums; /* kroj: naglowek 24/500 w tokeny.css */
  color:var(--mw-ink-3); text-decoration:none; transition:color var(--mw-dur-fast) var(--mw-ease); }
/* biezaca i najazd: utility link w tresci (tokeny.css) */
.mw-widok .mw-blog__main .page-numbers.current{ font-weight:700; } /* biezaca strona wyrozniona (Tomek 15.10) */
/* Nowsze / Starsze: krój z utility link-etykieta */
.mw-widok .mw-blog__main :is(.page-numbers.prev, .page-numbers.next){ color:var(--mw-ink); }

/* lead: klasa z mw_post_lead() (czesci/post-meta.php) */
.mw-strona__tresc .mw-lead{ font-weight:500; }

/* spis tresci: akordeon z utility (tokeny.css), lista numerowana z prozy */
.mw-strona__tresc .mw-post-toc{ margin-block:var(--mw-s5) var(--mw-s6); }
.mw-widok .mw-strona__tresc .mw-post-toc ol{ margin-block:var(--mw-s2) var(--mw-s4); }
/* kotwica nie chowa naglowka pod przyklejonym paskiem */
.mw-strona__tresc h2[id]{ scroll-margin-block-start:var(--mw-sticky-top); }

/* autorka pod wpisem: kadr z wspolnego zdjecia 111159 (Karolina z prawej); wlasny portret = object-position center */
.mw-post-author{ display:flex; align-items:center; gap:var(--mw-s4); margin-block-start:var(--mw-s8); padding-block-start:var(--mw-s5); border-block-start:1px solid var(--mw-line); }
.mw-post-author__frame{ flex:none; inline-size:8rem; block-size:10rem; overflow:hidden; } /* cien: .mw-shadow */
/* zblizenie na twarz (ok. 76% / 44% zdjecia): skala 2.2 wokol punktu, ktory przenosi twarz na srodek ramki */
.mw-post-author__photo{ inline-size:100%; block-size:100%; object-fit:cover; object-position:100% 0; scale:2.2; transform-origin:73% 46%; }
.mw-widok .mw-post-author__label{ color:var(--mw-ink-3); margin-block-end:var(--mw-s1); }
.mw-post-author__name{ line-height:var(--mw-lh-snug); }
.mw-widok .mw-post-author__bio{ margin-block-start:var(--mw-s2); color:var(--mw-ink-3); }

/* wpis: meta + zdjęcie główne */
.mw-post__meta{ display:flex; flex-wrap:wrap; gap:0 var(--mw-s3); margin:0 0 var(--mw-s2); }
/* hero wpisu: srodkiem jest sam tytul (50% wysokosci); okruszki nad nim i meta pod nim poza przeplywem */
/* teksty na srodku w pionie i poziomie */
.mw-post__hero .mw-hero__inner{ inset-block-start:50%; inset-inline:var(--mw-page-pad); translate:0 -50%; text-align:center; }
.mw-post__hero .mw-okruszki{ position:absolute; inset-block-end:100%; inset-inline:0; justify-content:center; padding-block:0 var(--mw-s8); color:var(--mw-on-dark); }
.mw-post__hero .mw-okruszki :is(a, [aria-current]){ color:var(--mw-on-dark); }
/* tekst 48 pod hero */
.mw-post__hero + .mw-strona__main{ padding-block-start:var(--mw-s7); }
/* meta zamiast lidu: jasna na zdjeciu, odstep jak .mw-hero__lead */
.mw-post__hero .mw-post__meta{ position:absolute; inset-block-start:100%; inset-inline:0; justify-content:center; margin:0; padding-block-start:var(--mw-s3); color:var(--mw-on-dark); }
