:root {
  --blog-ink: #10233b;
  --blog-muted: #5e6d7e;
  --blog-surface: #ffffff;
  --blog-bg: #f4f7fa;
  --blog-line: #dce5ed;
  --blog-blue: #1769a7;
  --blog-blue-dark: #0b4d80;
  --blog-green: #258a43;
  --blog-primary: #256fae;
  --blog-primary-dark: #174f7c;
  --blog-focus: #ffbf47;
}
.blog-page { background: var(--blog-bg); color: var(--blog-ink); min-height: 100vh; }
.blog-shell { width: min(1240px, calc(100% - 2rem)); margin-inline: auto; }
.blog-hero { position: relative; overflow: hidden; background: linear-gradient(135deg,#0c4f82 0%,#1769a7 58%,#258a43 145%); color:#fff; padding: clamp(3.75rem,7vw,6.5rem) 0 clamp(3rem,6vw,5rem); }
.blog-hero::after { content:""; position:absolute; width:28rem; height:28rem; border-radius:50%; right:-11rem; top:-14rem; background:rgba(255,255,255,.09); }
.blog-breadcrumb { display:flex; gap:.55rem; flex-wrap:wrap; align-items:center; font-size:.92rem; margin-bottom:1.3rem; color:rgba(255,255,255,.82); }
.blog-breadcrumb a { color:#fff; text-underline-offset:.2em; }
.blog-eyebrow { display:inline-flex; align-items:center; gap:.5rem; padding:.42rem .72rem; border:1px solid rgba(255,255,255,.32); border-radius:999px; background:rgba(255,255,255,.1); font-weight:700; font-size:.88rem; }
.blog-hero h1 { max-width: 920px; margin:.9rem 0 1rem; font-size:clamp(2.15rem,5vw,4.4rem); line-height:1.03; letter-spacing:-.045em; text-wrap:balance; color:#fff; }
.blog-hero p { max-width:760px; margin:0; color:rgba(255,255,255,.9); font-size:clamp(1.04rem,1.5vw,1.22rem); line-height:1.72; }
.blog-hero-meta { display:flex; gap:.75rem 1.5rem; flex-wrap:wrap; margin-top:1.6rem; font-weight:700; font-size:.95rem; }
.blog-controls-wrap { position:relative; z-index:3; margin-top:-2rem; }
.blog-controls { background:#fff; border:1px solid var(--blog-line); border-radius:1.25rem; padding:1rem; box-shadow:0 18px 45px rgba(16,35,59,.10); }
.blog-search-label { display:block; font-weight:800; margin-bottom:.45rem; color:var(--blog-ink); }
.blog-search { position:relative; }
.blog-search i { position:absolute; left:1rem; top:50%; transform:translateY(-50%); color:#687a8d; pointer-events:none; }
.blog-search input { min-height:50px; padding:.75rem 1rem .75rem 2.8rem; border:1px solid #aebdca; border-radius:.8rem; font-size:1rem; width:100%; }
.blog-search input:focus { outline:3px solid var(--blog-focus); outline-offset:2px; border-color:var(--blog-blue-dark); box-shadow:none; }
.blog-filter-list { display:flex; gap:.55rem; overflow-x:auto; padding:.85rem .1rem .1rem; scrollbar-width:thin; }
.blog-filter { min-height:42px; white-space:nowrap; border:1px solid #b9c7d3; background:#fff; color:#27425d; border-radius:999px; padding:.55rem .9rem; font-weight:750; }
.blog-filter:hover { border-color:var(--blog-blue); color:var(--blog-blue-dark); }
.blog-filter[aria-pressed="true"] { background:var(--blog-blue-dark); border-color:var(--blog-blue-dark); color:#fff; }
.blog-filter:focus-visible, .blog-card-link:focus-visible, .blog-reset:focus-visible { outline:3px solid var(--blog-focus); outline-offset:3px; }
.blog-content { padding:clamp(3rem,6vw,5.5rem) 0 5rem; }
.blog-heading-row { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; }
.blog-heading-row h2 { margin:0; font-size:clamp(1.65rem,3vw,2.45rem); letter-spacing:-.025em; color:var(--blog-ink); }
.blog-result-count { color:var(--blog-muted); margin:0; font-weight:700; }
.blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.4rem; }
.blog-card { position:relative; display:flex; flex-direction:column; min-width:0; overflow:hidden; border:1px solid var(--blog-line); border-radius:1.15rem; background:var(--blog-surface); box-shadow:0 7px 22px rgba(16,35,59,.055); transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.blog-card:hover { transform:translateY(-3px); border-color:#b8cad8; box-shadow:0 16px 34px rgba(16,35,59,.11); }
.blog-card-media { position:relative; aspect-ratio:16/9; overflow:hidden; background:#dfe8ef; }
.blog-card-media img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .28s ease; }
.blog-card:hover .blog-card-media img { transform:scale(1.025); }
.blog-badge { position:absolute; top:.8rem; left:.8rem; max-width:calc(100% - 1.6rem); border-radius:999px; padding:.38rem .65rem; background:rgba(8,39,65,.88); color:#fff; font-size:.76rem; font-weight:800; backdrop-filter:blur(5px); }
.blog-card-body { display:flex; flex:1; flex-direction:column; padding:1.15rem 1.2rem 1.25rem; }
.blog-card-meta { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; color:var(--blog-muted); font-size:.82rem; font-weight:700; margin-bottom:.65rem; }
.blog-card-meta span+span::before { content:"•"; margin-right:.6rem; color:#92a0ae; }
.blog-card h2 { margin:0 0 .7rem; font-size:clamp(1.12rem,1.8vw,1.38rem); line-height:1.25; letter-spacing:-.018em; color:var(--blog-ink); text-transform:none; text-align:left; }
.blog-card-summary { color:#526477; line-height:1.62; margin:0 0 1rem; font-size:.96rem; }
.blog-card-action { margin-top:auto; display:inline-flex; align-items:center; gap:.45rem; color:var(--blog-blue-dark); font-weight:850; }
.blog-card-link { color:inherit; text-decoration:none; }
.blog-card-link::after { content:""; position:absolute; inset:0; z-index:2; }
.blog-card-link:hover { color:var(--blog-blue-dark); text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:.18em; }
.blog-card[hidden] { display:none !important; }
.blog-empty { display:none; text-align:center; background:#fff; border:1px dashed #aebdca; border-radius:1rem; padding:3rem 1rem; }
.blog-empty.is-visible { display:block; }
.blog-reset { min-height:44px; margin-top:.75rem; border:0; border-radius:.7rem; padding:.65rem 1rem; background:var(--blog-blue-dark); color:#fff; font-weight:800; }
.blog-trust { margin-top:3rem; padding:clamp(1.4rem,3vw,2.2rem); border:1px solid var(--blog-line); border-radius:1.2rem; background:#fff; display:grid; grid-template-columns:1.3fr .7fr; gap:2rem; align-items:center; }
.blog-trust h2 { margin:0 0 .55rem; color:var(--blog-ink); text-transform:none; text-align:left; }
.blog-trust p { margin:0; color:var(--blog-muted); line-height:1.7; }
.blog-trust a { display:inline-flex; justify-content:center; align-items:center; min-height:48px; border:1px solid var(--blog-primary); border-radius:.75rem; background:var(--blog-primary); color:#fff; text-decoration:none; font-weight:850; padding:.75rem 1rem; }
.blog-trust a:hover, .blog-trust a:focus { background:var(--blog-primary-dark); border-color:var(--blog-primary-dark); color:#fff; }
@media (max-width:991.98px) { .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr));} .blog-trust{grid-template-columns:1fr;} }
@media (max-width:575.98px) { .blog-shell{width:min(100% - 1.1rem,1240px);} .blog-hero{padding-top:3rem;} .blog-controls{border-radius:1rem;} .blog-grid{grid-template-columns:1fr;gap:1rem;} .blog-heading-row{display:block;} .blog-result-count{margin-top:.35rem;} .blog-card-body{padding:1rem;} }
@media (prefers-reduced-motion:reduce) { .blog-card,.blog-card-media img{transition:none;} .blog-card:hover{transform:none;} }
/* Czytelność CTA oraz stabilne filtrowanie bloga — 2026-07-25 */
.blog-trust>a,.blog-trust>a:link,.blog-trust>a:visited{color:#fff!important;background:var(--blog-primary)!important;border-color:var(--blog-primary)!important;}
.blog-trust>a:hover,.blog-trust>a:focus{color:#fff!important;background:var(--blog-primary-dark)!important;border-color:var(--blog-primary-dark)!important;}
.blog-card[hidden],.blog-card.is-filtered-out{display:none!important;}
@media (max-width:575.98px){
  .blog-trust>a{width:100%;}
}