/* Chrápátko – hlavní stránka blogu (Shoptet výpis článků) */
body.type-posts-listing{
  --cbi-primary:var(--color-primary,#003140);
  --cbi-accent:var(--color-secondary,#007599);
  --cbi-green:#009901;
  --cbi-ink:#33424a;
  --cbi-muted:#657579;
  --cbi-border:#e4ebec;
  --cbi-card:#fff;
  --cbi-shadow:0 1px 2px rgba(0,49,64,.05),0 4px 14px rgba(0,49,64,.06);
  --cbi-shadow-hover:0 10px 34px rgba(0,49,64,.16);
}

/* ---- page heading -------------------------------------------------------- */
body.type-posts-listing #content h1,
body.type-posts-listing .in-blog h1{
  font-family:"Poppins",system-ui,Arial,sans-serif;
  font-size:40px;font-weight:700;letter-spacing:-.01em;line-height:1.12;
  color:var(--cbi-primary);margin:0 0 22px
}
body.type-posts-listing .category-perex,
body.type-posts-listing .category-annotation{
  font-size:17px;line-height:1.7;color:var(--cbi-ink);max-width:70ch;margin:0 0 30px
}

/* ---- blog sub-category tiles ------------------------------------------------ */
body.type-posts-listing ul.subcategories.with-image{
  list-style:none;margin:0 0 44px;padding:0;display:grid!important;gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr))
}
body.type-posts-listing ul.subcategories.with-image > li{
  width:auto!important;max-width:none!important;min-width:0!important;
  margin:0!important;padding:0!important;float:none!important;list-style:none
}
body.type-posts-listing ul.subcategories.with-image > li > a{
  position:relative;display:block!important;width:100%!important;height:auto!important;
  overflow:hidden;border-radius:14px;aspect-ratio:3/2;text-decoration:none;
  background:var(--cbi-primary);box-shadow:var(--cbi-shadow);
  transition:transform .18s ease,box-shadow .18s ease
}
body.type-posts-listing ul.subcategories.with-image > li > a > .image{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  border-radius:0!important;margin:0!important;background-size:cover;background-position:center;
  transition:transform .5s ease
}
body.type-posts-listing ul.subcategories.with-image > li > a img{
  width:100%!important;height:100%!important;object-fit:cover;display:block;
  border-radius:0!important;transition:transform .5s ease
}
body.type-posts-listing ul.subcategories.with-image > li > a::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top,rgba(0,26,34,.85) 0%,rgba(0,26,34,.35) 42%,rgba(0,26,34,.02) 70%)
}
body.type-posts-listing ul.subcategories.with-image > li > a:hover{
  transform:translateY(-3px);box-shadow:var(--cbi-shadow-hover)
}
body.type-posts-listing ul.subcategories.with-image > li > a:hover > .image,
body.type-posts-listing ul.subcategories.with-image > li > a:hover img{transform:scale(1.07)}
body.type-posts-listing ul.subcategories.with-image > li > a > .text{
  position:absolute;left:0;right:0;bottom:0;z-index:2;padding:14px 16px;
  color:#fff;font-weight:700;font-size:16px;line-height:1.25;
  text-shadow:0 1px 6px rgba(0,20,28,.4);
  font-family:"Poppins",system-ui,Arial,sans-serif
}

/* ---- article grid -------------------------------------------------------- */
body.type-posts-listing #newsWrapper,
body.type-posts-listing .news-wrapper{
  display:grid!important;gap:26px;
  grid-template-columns:repeat(auto-fill,minmax(310px,1fr));
  margin:0 0 36px;padding:0;float:none!important;overflow:visible!important;width:auto
}
body.type-posts-listing #newsWrapper > .news-item,
body.type-posts-listing .news-wrapper > .news-item{
  width:auto!important;max-width:none!important;min-width:0!important;
  float:none!important;margin:0!important;padding:0!important;
  position:relative;display:flex!important;flex-direction:column;background:var(--cbi-card);
  border:1px solid var(--cbi-border);border-radius:18px;overflow:hidden;
  box-shadow:var(--cbi-shadow);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease
}
body.type-posts-listing .news-item:hover{
  transform:translateY(-5px);border-color:var(--cbi-accent);
  box-shadow:var(--cbi-shadow-hover)
}

/* image */
body.type-posts-listing .news-item .image{margin:0!important;padding:0!important;width:auto!important;overflow:hidden;background:#e3edee}
body.type-posts-listing .news-item .image a{display:block!important;width:100%!important;height:auto!important;aspect-ratio:16/10;overflow:hidden}
body.type-posts-listing .news-item .image img{
  width:100%!important;height:100%!important;object-fit:cover;display:block;transition:transform .5s ease
}
body.type-posts-listing .news-item:hover .image img{transform:scale(1.05)}

/* text */
body.type-posts-listing .news-item .text{
  display:flex;flex-direction:column;flex:1;padding:18px 20px 20px;gap:0
}
body.type-posts-listing .news-item .title,
body.type-posts-listing .news-item .title:visited{
  font-family:"Poppins",system-ui,Arial,sans-serif;
  font-size:19px;font-weight:700;letter-spacing:-.01em;line-height:1.32;
  color:var(--cbi-primary);text-decoration:none!important;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  overflow:hidden;transition:color .15s ease
}
body.type-posts-listing .news-item:hover .title{color:var(--cbi-accent)}
body.type-posts-listing .news-item a.title,
body.type-posts-listing .news-item a.title:visited,
body.type-posts-listing .news-item a.title:hover{text-decoration:none!important}
body.type-posts-listing .news-item a.title:visited{color:var(--cbi-primary)}
/* stretch the title link over the whole card + a11y focus ring */
body.type-posts-listing .news-item .title::after{content:"";position:absolute;inset:0;z-index:2;border-radius:18px}
body.type-posts-listing .news-item .title:focus-visible::after{outline:3px solid var(--cbi-accent);outline-offset:2px}
body.type-posts-listing .news-item time{
  display:block;margin:9px 0 9px;font-size:11px;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--cbi-muted)
}
body.type-posts-listing .news-item .description{
  font-size:14.5px;line-height:1.7;color:var(--cbi-ink);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden
}
body.type-posts-listing .news-item .description p{margin:0}
body.type-posts-listing .news-item .text::after{
  content:"Číst více  →";margin-top:auto;padding-top:14px;
  font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--cbi-green);
  transition:transform .18s ease
}
body.type-posts-listing .news-item:hover .text::after{transform:translateX(3px)}

/* ---- featured (newest) article – full-width hero row -------------------- */
@media (min-width:761px){
  body.type-posts-listing #newsWrapper > .news-item:first-child,
  body.type-posts-listing .news-wrapper > .news-item:first-child{
    grid-column:1/-1;flex-direction:row;align-items:stretch
  }
  body.type-posts-listing .news-item:first-child .image{flex:0 0 44%;max-width:44%;align-self:stretch}
  body.type-posts-listing .news-item:first-child .image a{
    height:100%!important;min-height:100%;aspect-ratio:auto
  }
  body.type-posts-listing .news-item:first-child .text{
    justify-content:center;padding:32px 36px;min-height:340px;max-height:440px
  }
  body.type-posts-listing .news-item:first-child .title{font-size:26px;line-height:1.25;-webkit-line-clamp:3}
  body.type-posts-listing .news-item:first-child .description{font-size:16px;line-height:1.65;-webkit-line-clamp:4;margin-top:2px}
  body.type-posts-listing .news-item:first-child time{margin:12px 0}
  body.type-posts-listing .news-item:first-child .text::after{margin-top:18px;padding-top:0}
}

/* ---- listing controls / count ---------------------------------------------- */
body.type-posts-listing .listingControls{
  border:0;padding:0;margin:0 0 20px;display:flex;justify-content:flex-end
}
body.type-posts-listing .itemsTotal{font-size:13px;color:var(--cbi-muted)}
body.type-posts-listing .itemsTotal strong{color:var(--cbi-primary)}

/* ---- pagination (if present) --------------------------------------------- */
body.type-posts-listing .pagination{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:32px 0;padding:0;list-style:none}
body.type-posts-listing .pagination a,
body.type-posts-listing .pagination span{
  display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;
  padding:0 12px;border:1px solid var(--cbi-border);border-radius:10px;
  text-decoration:none;color:var(--cbi-primary);font-size:14px;font-weight:600;background:#fff;
  transition:border-color .12s ease,color .12s ease,background .12s ease
}
body.type-posts-listing .pagination a:hover{border-color:var(--cbi-accent);color:var(--cbi-accent)}
body.type-posts-listing .pagination .active span,
body.type-posts-listing .pagination a.active{background:var(--cbi-primary);border-color:var(--cbi-primary);color:#fff}

/* ---- responsive ------------------------------------------------------------ */
@media (max-width:900px){
  body.type-posts-listing #content h1,body.type-posts-listing .in-blog h1{font-size:32px}
  body.type-posts-listing #newsWrapper,body.type-posts-listing .news-wrapper{gap:20px}
}
@media (max-width:560px){
  body.type-posts-listing #newsWrapper,body.type-posts-listing .news-wrapper{grid-template-columns:1fr;gap:16px}
  body.type-posts-listing ul.subcategories.with-image{grid-template-columns:1fr 1fr!important;gap:10px;margin-bottom:30px}
  body.type-posts-listing ul.subcategories.with-image > li > a{aspect-ratio:4/3}
  body.type-posts-listing ul.subcategories.with-image > li > a > .text{font-size:14px;padding:10px 12px}
  body.type-posts-listing #content h1,body.type-posts-listing .in-blog h1{font-size:27px}
  body.type-posts-listing .news-item .text{padding:16px 17px 18px}
  body.type-posts-listing .news-item .title{font-size:18px}
}