/* =============================================================================
   R73-E (30.10.2026) - karta wpisu bloga: JEDEN wygląd wszędzie (Filip: „wpisy na blogu itd. mają wyglądać tak samo
   na każdej stronie”, „ikonki platform w zdjęciach wpisów zasłaniają teksty”).
   Gdzie: /blog/ (motyw home.php: .lb-card), kategorie bloga (r50-blog-kategoria.php: .lk-post-card), strona główna
   (blog-glowna.php: .bcard.ljk-wpis) i „Poradniki” na stronie usługi (motyw single-product.php: #poradniki .lajk-blog-card).
   Układ karty (ten sam w czterech miejscach):
     okładka 16:9 bez niczego na obrazku (ikona platformy zdjęta - r50-blog.php),
     wiersz: plakietka kategorii/platformy + data,
     tytuł (do 3 linii, słowa się nie łamią), zajawka (do 3 linii),
     dół: „N min czytania” po lewej, „Czytaj” po prawej (link tekstowy, bez strzałki).
   Biała karta, cienka ramka, bez cienia i bez podskoku; najechanie = ciemniejsza ramka + fiolet w tytule.
   /blog/ ma datę w dolnym wierszu w HTML motywu - tu ją przenosimy do góry siatką (display:contents na .lb-meta).
   Kolory z tokenów R71/R72 (z zapasem w var()). Kontrast: szary #5b5470 7:1, fiolet #6d28d9 7:1, plakietka 7,9:1.
   Ładowany wszędzie przez r73.php (wp_head 1080). Siła: html:root body.ljk-r73:not(#r73a#r73b#r73c) (3 id) - wygrywa
   z jasny.css, naturalny*.css, r66-wyglad.css / r69-glowna.css (główna) i r71/produkt.css (Poradniki).
   ============================================================================= */

/* ---------- 1. Karta ---------- */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card,.lk-blog-grid .lk-post-card,#lajk-home .bcard.ljk-wpis,#lajk-root #poradniki .lajk-blog-card){
  position:relative;min-width:0;overflow:hidden;
  background:#fff!important;border:1px solid var(--r72-linia,#ebe5f4)!important;border-radius:16px!important;
  box-shadow:none!important;transform:none!important;
  color:var(--r71-atrament,#1d1530);text-decoration:none!important;
  transition:border-color .15s ease!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card,.lk-blog-grid .lk-post-card,#lajk-home .bcard.ljk-wpis,#lajk-root #poradniki .lajk-blog-card):hover{
  background:#fff!important;border-color:#c9b8ef!important;box-shadow:none!important;transform:none!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card a.lb-link,.lk-blog-grid a.lk-post-link){display:flex;flex-direction:column;height:100%;color:inherit!important;text-decoration:none!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card a.lb-link,.lk-blog-grid a.lk-post-link,#lajk-home a.bcard.ljk-wpis,#lajk-root #poradniki a.lajk-blog-card):focus-visible{
  outline:3px solid var(--r71-fiolet,#7c3aed)!important;outline-offset:2px!important;border-radius:16px;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home a.bcard.ljk-wpis{display:flex!important;flex-direction:column;padding:0!important}
/* gdy karta /blog/ i kategorii łapie fokus wewnątrz (link), obwódka nie może być ucięta przez overflow karty */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card,.lk-blog-grid .lk-post-card):has(a:focus-visible){overflow:visible}

/* ---------- 2. Okładka 16:9, nic na obrazku ---------- */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card .lb-thumb,.lk-blog-grid .lk-post-thumb){
  position:relative;flex:none;aspect-ratio:16/9;height:auto!important;margin:0!important;overflow:hidden;
  background:var(--r71-fiolet-j,#f3edff)!important;border-bottom:1px solid var(--r72-linia,#ebe5f4)!important;border-radius:15px 15px 0 0;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-img-wrap{
  position:relative;flex:none;aspect-ratio:16/9;height:auto!important;margin:0!important;overflow:hidden;
  background:var(--r71-fiolet-j,#f3edff)!important;border-bottom:1px solid var(--r72-linia,#ebe5f4)!important;border-radius:15px 15px 0 0;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card .lb-thumb img,.lk-blog-grid .lk-post-thumb img,#lajk-root #poradniki .lajk-blog-img-wrap img){
  display:block;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center;transform:none!important;transition:none!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lk-blog-grid .lk-post-thumb::after,#lajk-root #poradniki .lajk-blog-overlay){display:none!important}
/* zapas: gdyby ikona jednak przyszła w HTML (np. stara strona z pamięci) - nie na obrazku */
html:root body.ljk-r73:not(#r73a#r73b#r73c) .r50-ok{display:none!important}
/* główna: okładka to ::before z --bimg (jasny.css, r67-avif.php) */
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home .bcard.ljk-wpis.bcard-img::before{
  content:""!important;display:block!important;flex:none;aspect-ratio:16/9!important;margin:0!important;
  border-bottom:1px solid var(--r72-linia,#ebe5f4)!important;background-color:var(--r71-fiolet-j,#f3edff)!important;
  background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important;
  opacity:1!important;filter:none!important;transform:none!important;
}

/* ---------- 3. Treść karty ---------- */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card .lb-body,.lk-blog-grid .lk-post-body){
  flex:1 1 auto;display:flex;flex-direction:column;gap:8px;padding:16px 18px 0!important;min-width:0;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-body{
  flex:1 1 auto;display:flex;flex-direction:column;gap:8px;padding:16px 18px 0!important;min-width:0;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lk-blog-grid .lk-post-body{padding-bottom:16px!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home .bcard.ljk-wpis>:not(.bcard-footer){margin-left:18px!important;margin-right:18px!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home .bcard.ljk-wpis>.ljk-wpis-gora{margin-top:16px!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home .bcard.ljk-wpis>h3{margin-top:8px!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home .bcard.ljk-wpis>p{margin-top:8px!important;margin-bottom:0!important}

/* wiersz: plakietka + data (Poradniki osobno - :is() z #lajk-root podbijałoby siłę reguły także dla głównej) */
html:root body.ljk-r73:not(#r73a#r73b#r73c) .ljk-wpis-gora{
  display:flex!important;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0!important;min-width:0;
  font-size:13px!important;font-weight:500;line-height:1.3;color:var(--r71-szary,#5b5470)!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-meta{
  display:flex!important;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0!important;min-width:0;
  font-size:13px!important;font-weight:500;line-height:1.3;color:var(--r71-szary,#5b5470)!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.ljk-wpis-gora time,.lk-blog-grid .lk-post-pubdate,#lajk-root #poradniki .lajk-blog-meta time,.lb .lb-card .lb-meta time){
  font-size:13px!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important;color:var(--r71-szary,#5b5470)!important;white-space:nowrap;
}
/* plakietka kategorii / platformy - pigułka „informacja” z R72 (jedna dla wszystkich platform, bez gradientów) */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.ljk-wpis-pig,.lb .lb-card .lb-cat,.lk-blog-grid .r50-pin-l,#lajk-root #poradniki .lajk-blog-tag){
  position:static!important;display:inline-flex!important;align-items:center;align-self:auto;flex:0 1 auto;min-width:0;max-width:100%;
  height:auto;min-height:var(--r72-pig-h,24px);margin:0!important;padding:2px var(--r72-pig-px,10px)!important;
  border:0!important;border-radius:var(--r72-pig-r,999px)!important;
  background:var(--r72-pig-info-tlo,#f3edff)!important;color:var(--r72-pig-info-t,#5b21b6)!important;-webkit-text-fill-color:currentColor;
  font-size:12.5px!important;font-weight:700!important;line-height:1.25!important;letter-spacing:0!important;text-transform:none!important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:none!important;
}

/* tytuł */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card h3,.lk-blog-grid .lk-post-title,#lajk-home .bcard.ljk-wpis h3){
  margin:0;font-size:17px!important;line-height:1.35!important;font-weight:700!important;letter-spacing:0!important;
  color:var(--r71-atrament,#1d1530)!important;-webkit-text-fill-color:currentColor!important;background:none!important;
  display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:3!important;line-clamp:3;overflow:hidden;
  overflow-wrap:normal!important;word-break:normal!important;-webkit-hyphens:manual;hyphens:manual!important;text-wrap:pretty;
  transition:color .15s ease;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-title{
  margin:0;font-size:17px!important;line-height:1.35!important;font-weight:700!important;letter-spacing:0!important;
  color:var(--r71-atrament,#1d1530)!important;-webkit-text-fill-color:currentColor!important;background:none!important;
  display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:3!important;line-clamp:3;overflow:hidden;
  overflow-wrap:normal!important;word-break:normal!important;-webkit-hyphens:manual;hyphens:manual!important;text-wrap:pretty;
  transition:color .15s ease;
}
/* zajawka */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card .lb-ex,.lk-blog-grid .lk-post-excerpt,#lajk-home .bcard.ljk-wpis>p){
  margin:0;font-size:14.5px!important;line-height:1.55!important;color:var(--r71-szary,#5b5470)!important;-webkit-text-fill-color:currentColor;
  display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:3!important;line-clamp:3;overflow:hidden;
  overflow-wrap:normal;word-break:normal;hyphens:manual;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-excerpt{
  margin:0;font-size:14.5px!important;line-height:1.55!important;color:var(--r71-szary,#5b5470)!important;-webkit-text-fill-color:currentColor;
  display:-webkit-box!important;-webkit-box-orient:vertical;-webkit-line-clamp:3!important;line-clamp:3;overflow:hidden;
  overflow-wrap:normal;word-break:normal;hyphens:manual;
}

/* dół: czas czytania po lewej, „Czytaj” po prawej */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lk-blog-grid .lk-post-meta,#lajk-home .bcard.ljk-wpis .bcard-footer){
  display:flex!important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;
  margin-top:auto!important;padding:12px 0 0!important;border-top:0!important;
  font-size:13px!important;line-height:1.3;color:var(--r71-szary,#5b5470)!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-footer{
  display:flex!important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px;
  margin-top:auto!important;padding:12px 0 0!important;border-top:0!important;
  font-size:13px!important;line-height:1.3;color:var(--r71-szary,#5b5470)!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home .bcard.ljk-wpis .bcard-footer{margin:auto 18px 0!important;padding:12px 0 16px!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-footer{padding:12px 18px 16px!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lk-blog-grid .lk-post-date,.ljk-wpis-min,#lajk-root #poradniki .lajk-blog-read-time,.lb .lb-card .lb-meta>span:not(.lb-more)){
  font-size:13px!important;font-weight:500!important;color:var(--r71-szary,#5b5470)!important;-webkit-text-fill-color:currentColor;white-space:nowrap;
}
/* „Czytaj” - link tekstowy (fiolet), nie przycisk; podkreślenie przy najechaniu na kartę */
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card .lb-more,.lk-blog-grid .lk-post-more,#lajk-home .bcard.ljk-wpis .read){
  order:2;display:inline-flex!important;align-items:center;gap:4px;margin-left:auto!important;padding:0!important;
  border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;
  font-size:14px!important;font-weight:700!important;line-height:1.3!important;
  color:var(--r72-akcent-c,#6d28d9)!important;-webkit-text-fill-color:currentColor!important;
  text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px;text-decoration-thickness:1.5px;
  transition:text-decoration-color .15s ease!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-read{
  order:2;display:inline-flex!important;align-items:center;gap:4px;margin-left:auto!important;padding:0!important;
  border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;
  font-size:14px!important;font-weight:700!important;line-height:1.3!important;
  color:var(--r72-akcent-c,#6d28d9)!important;-webkit-text-fill-color:currentColor!important;
  text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px;text-decoration-thickness:1.5px;
  transition:text-decoration-color .15s ease!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki .lajk-blog-read svg{display:none!important}

@media (hover:hover) and (pointer:fine){
  html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card,.lk-blog-grid .lk-post-card,#lajk-home .bcard.ljk-wpis,#lajk-root #poradniki .lajk-blog-card):hover :is(h3,.lk-post-title,.lajk-blog-title){color:var(--r72-akcent-c,#6d28d9)!important}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card,.lk-blog-grid .lk-post-card,#lajk-home .bcard.ljk-wpis,#lajk-root #poradniki .lajk-blog-card):hover :is(.lb-more,.lk-post-more,.read,.lajk-blog-read){text-decoration-color:currentColor;background:none!important;color:var(--r72-akcent-c,#6d28d9)!important}
}

/* ---------- 4. /blog/ (motyw home.php): data do górnego wiersza siatką ---------- */
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card .lb-body{
  display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:auto auto auto 1fr;
  grid-template-areas:"kat data data" "tyt tyt tyt" "zaj zaj zaj" "min min czy";
  align-items:center;column-gap:10px;row-gap:8px;padding:16px 18px 16px!important;
}
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card .lb-meta{display:contents!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card .lb-cat{grid-area:kat;justify-self:start}
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card .lb-meta time{grid-area:data;justify-self:start}
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card h3{grid-area:tyt}
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card .lb-ex{grid-area:zaj}
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card .lb-meta>span:not(.lb-more){grid-area:min;align-self:end;padding-top:4px}
html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card .lb-more{grid-area:czy;align-self:end;padding-top:4px!important}
/* wąski ekran: data pod plakietką, żeby długa nazwa kategorii nie ściskała daty */
@media (max-width:379px){
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card .lb-body{grid-template-areas:"kat kat kat" "data data data" "tyt tyt tyt" "zaj zaj zaj" "min min czy";grid-template-rows:auto auto auto auto 1fr;row-gap:6px}
}
/* duża karta na górze /blog/ (obrazek po lewej) */
@media (min-width:900px){
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card.lb-feat .lb-thumb{aspect-ratio:auto;min-height:100%;border-bottom:0!important;border-right:1px solid var(--r72-linia,#ebe5f4)!important;border-radius:15px 0 0 15px}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card.lb-feat .lb-body{grid-template-rows:auto auto auto auto;align-content:center;row-gap:12px;padding:28px 30px!important}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card.lb-feat h3{font-size:clamp(1.35rem,2vw,1.75rem)!important;line-height:1.25!important;-webkit-line-clamp:4!important;line-clamp:4}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lb .lb-card.lb-feat .lb-ex{font-size:15.5px!important;-webkit-line-clamp:4!important;line-clamp:4}
}

/* ---------- 5. Kategorie bloga: przypięty poradnik ---------- */
@media (min-width:760px){
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lk-blog-grid .r50-pin .lk-post-link{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lk-blog-grid .r50-pin .lk-post-thumb{aspect-ratio:auto;min-height:100%;border-bottom:0!important;border-right:1px solid var(--r72-linia,#ebe5f4)!important;border-radius:15px 0 0 15px}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lk-blog-grid .r50-pin .lk-post-body{justify-content:center;gap:12px;padding:28px 30px!important}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lk-blog-grid .r50-pin .lk-post-title{font-size:clamp(1.3rem,2vw,1.65rem)!important;line-height:1.25!important}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) .lk-blog-grid .r50-pin .lk-post-meta{margin-top:6px!important}
}

/* ---------- 6. Strona główna: siatka 3 kart bez „dziur” ---------- */
/* 2 kolumny dawały 2 + 1 (trzecia na całą szerokość); teraz: telefon 1 kolumna, środek - karta pozioma, komputer 3 kolumny */
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home #lajk-blog-grid-s{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;align-items:stretch}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home #lajk-blog-grid-s>.bcard{grid-column:auto!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home #lajk-blog-grid-s>.ljk-bg-sub{grid-column:1/-1!important;text-transform:none!important;letter-spacing:0!important;font-size:15px!important;color:var(--r71-atrament,#1d1530)!important}
html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(#lajk-home .bcard.ljk-wpis .read,.lb .lb-card .lb-more,.lk-blog-grid .lk-post-more)::after{content:none!important}
@media (min-width:600px) and (max-width:899px){
  html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home #lajk-blog-grid-s>a.bcard.ljk-wpis{display:grid!important;grid-template-columns:minmax(0,40%) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;align-content:start}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home #lajk-blog-grid-s>a.bcard.ljk-wpis.bcard-img::before{grid-column:1;grid-row:1/-1;aspect-ratio:auto!important;min-height:100%;border-bottom:0!important;border-right:1px solid var(--r72-linia,#ebe5f4)!important}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home #lajk-blog-grid-s>a.bcard.ljk-wpis>*{grid-column:2}
  html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home #lajk-blog-grid-s>a.bcard.ljk-wpis:not(.bcard-img)>*{grid-column:1/-1}
}
@media (min-width:900px){
  html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-home #lajk-blog-grid-s{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* ---------- 7. Strona usługi: „Poradniki” - karta jak wyżej (siatka i przewijanie na telefonie zostają z R71) ---------- */
html:root body.ljk-r73:not(#r73a#r73b#r73c) #lajk-root #poradniki a.lajk-blog-card{display:flex!important;flex-direction:column}

/* ---------- 8. Mniej ruchu ---------- */
@media (prefers-reduced-motion:reduce){
  html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card,.lk-blog-grid .lk-post-card,#lajk-home .bcard.ljk-wpis,#lajk-root #poradniki .lajk-blog-card),
  html:root body.ljk-r73:not(#r73a#r73b#r73c) :is(.lb .lb-card,.lk-blog-grid .lk-post-card,#lajk-home .bcard.ljk-wpis,#lajk-root #poradniki .lajk-blog-card) *{transition:none!important}
}