/* Blog listing (PZ-1029). Adapted from agency delivery V3 blog.css (2026-10-22): global body/header/footer rules dropped, everything scoped to .pz-blog so it cannot leak into the shared layout. Satoshi is already loaded by site.min.css. Loaded only on /blog and /blog/kategori/*. */
.pz-blog { --pz-blog-ink: #293e31; --pz-blog-green: #6c815d; --pz-blog-dark-green: #385940; --pz-blog-muted: #7b8474; --pz-blog-line: #dce2d6; color: var(--pz-blog-ink); background: #fff; font: 400 16px/1.5 Satoshi, Arial, sans-serif; padding-bottom: 20px; }
.pz-blog, .pz-blog * { box-sizing: border-box; }
.pz-blog a { color: inherit; text-decoration: none; }
.pz-blog a:focus-visible, .pz-blog input:focus-visible { outline: 3px solid #7b9a65; outline-offset: 4px; }
.pz-blog img { display: block; width: 100%; object-fit: cover; }
.pz-blog h1, .pz-blog h2, .pz-blog h3, .pz-blog p { margin: 0; }
.pz-blog h1, .pz-blog h2, .pz-blog h3 { font-weight: 500; line-height: 1.17; color: inherit; }

.pz-blog__bread { display: flex; gap: 12px; color: #89917f; font-size: 12px; margin: 26px 0 32px; }
.pz-blog__bread a { color: #41573d; }

.pz-blog__eyebrow { font-size: 10px; letter-spacing: 1.6px; font-weight: 700; color: #708164; display: block; }
.pz-blog__eyebrow--upper { text-transform: uppercase; }

.pz-blog__intro { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 34px; gap: 32px; }
.pz-blog__intro h1 { font-size: 53px; letter-spacing: -2px; margin-top: 14px; }
.pz-blog__intro em { font-style: normal; color: var(--pz-blog-green); }
.pz-blog__intro p { color: var(--pz-blog-muted); font-size: 16px; max-width: 360px; padding-bottom: 5px; }

.pz-blog__featured { display: grid; grid-template-columns: 1.55fr 1fr; gap: 30px; margin-bottom: 68px; }
.pz-blog__lead { background: #f4f5ef; border: 1px solid #e0e5d9; border-radius: 16px; overflow: hidden; display: grid; grid-template-columns: 1.1fr 1fr; min-height: 340px; }
.pz-blog__lead-image { position: relative; min-width: 0; }
.pz-blog__lead-image img { height: 100%; object-position: 45% center; }
.pz-blog__badge { position: absolute; top: 18px; left: 18px; background: #ffffffee; border-radius: 4px; padding: 7px 10px; font-size: 9px; letter-spacing: 1px; font-weight: 700; }
.pz-blog__lead-copy { padding: 30px 26px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.pz-blog__lead-copy h2 { font-size: 29px; letter-spacing: -.8px; margin: 13px 0; }
.pz-blog__lead-copy p { font-size: 14px; color: var(--pz-blog-muted); }

.pz-blog__read { display: flex; align-items: center; gap: 22px; font-size: 12px; font-weight: 600; margin-top: 22px; }
.pz-blog__read > span { font-size: 21px; line-height: 1; }

.pz-blog__feature-aside { display: flex; flex-direction: column; gap: 18px; }
.pz-blog__aside-head { display: flex; justify-content: space-between; font-size: 15px; padding-bottom: 12px; border-bottom: 1px solid #dfe4d7; }
.pz-blog__side { display: grid; grid-template-columns: 135px 1fr; gap: 18px; align-items: center; flex: 1; }
.pz-blog__side img { height: 122px; border-radius: 9px; }
.pz-blog__side h3 { font-size: 19px; letter-spacing: -.35px; margin-top: 7px; }
.pz-blog__side .pz-blog__eyebrow { font-size: 9px; letter-spacing: 1px; }
.pz-blog__side .pz-blog__read { margin-top: 9px; }

.pz-blog__library { border-top: 1px solid var(--pz-blog-line); padding-top: 32px; scroll-margin-top: 120px; }
.pz-blog__library-head { display: flex; justify-content: space-between; gap: 28px; align-items: center; }
.pz-blog__library h2 { font-size: 32px; letter-spacing: -1px; margin-top: 8px; }
.pz-blog__search { border: 1px solid var(--pz-blog-line); display: flex; gap: 12px; align-items: center; padding: 12px 16px; border-radius: 8px; width: 310px; margin: 0; }
.pz-blog__search svg { flex: 0 0 auto; }
.pz-blog__search input { border: 0; outline: none; width: 100%; min-width: 0; color: var(--pz-blog-ink); background: transparent; font: inherit; font-size: 14px; padding: 0; }
.pz-blog__search:focus-within { border-color: #607d50; }

.pz-blog__filters { display: flex; gap: 8px; overflow: auto; padding: 24px 0 20px; scrollbar-width: thin; }
.pz-blog__filters a { white-space: nowrap; border: 1px solid #dfe4d9; border-radius: 24px; padding: 10px 16px; background: #fff; font-size: 12px; }
.pz-blog__filters a[aria-current] { background: var(--pz-blog-dark-green); color: #fff; border-color: var(--pz-blog-dark-green); }

.pz-blog__results { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: #828b7a; margin-bottom: 20px; min-height: 24px; }
.pz-blog__results a { text-decoration: underline; }

.pz-blog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px 24px; }
.pz-blog__article { border: 1px solid #e2e6dd; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s; }
.pz-blog__article:hover { box-shadow: 0 8px 24px #2b3d310e; transform: translateY(-3px); }
.pz-blog__article img { height: 210px; background: #f2f4ee; }
.pz-blog__article .pz-blog__copy { padding: 21px 23px; display: flex; flex-direction: column; flex: 1; }
.pz-blog__article h3 { font-size: 22px; letter-spacing: -.5px; margin-top: 11px; margin-bottom: 20px; }
.pz-blog__article .pz-blog__read { margin-top: auto; justify-content: space-between; }

.pz-blog__more { text-align: center; padding: 32px 0 0; }
.pz-blog__more a { display: inline-block; background: #fff; border: 1px solid #cdd7c5; border-radius: 28px; padding: 13px 28px; font-size: 14px; }
.pz-blog__more a[aria-busy="true"] { opacity: .6; pointer-events: none; }
.pz-blog__more span { margin-left: 20px; }

.pz-blog__empty { text-align: center; padding: 48px 10px; color: #75816c; }
.pz-blog__empty h3 { font-size: 20px; margin-bottom: 8px; }

.pz-blog__help { background: #eef3e9; border: 1px solid #dce5d4; border-radius: 14px; margin: 58px 0 60px; padding: 34px 40px; display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.pz-blog__help h2 { font-size: 31px; letter-spacing: -.9px; margin: 8px 0; }
.pz-blog__help p { color: #748269; font-size: 14px; }
.pz-blog__help > a { background: #395b42; color: #fff; padding: 14px 22px; border-radius: 28px; white-space: nowrap; font-size: 14px; display: inline-flex; align-items: center; gap: 22px; }

@media (max-width: 1050px) {
  .pz-blog__featured { grid-template-columns: 1.2fr 1fr; }
  .pz-blog__lead { grid-template-columns: 1fr; }
  .pz-blog__lead-image { height: 220px; }
  .pz-blog__lead-copy { padding: 24px; }
  .pz-blog__article img { height: 180px; }
  .pz-blog__side { grid-template-columns: 110px 1fr; }
  .pz-blog__intro h1 { font-size: 45px; }
}

@media (max-width: 650px) {
  .pz-blog__bread { margin: 18px 0 24px; font-size: 11px; }
  .pz-blog__intro { display: block; margin-bottom: 24px; }
  .pz-blog__intro h1 { font-size: 37px; letter-spacing: -1.3px; margin-top: 10px; }
  .pz-blog__intro p { font-size: 14px; line-height: 1.55; margin-top: 18px; max-width: 330px; }
  .pz-blog__intro p br { display: none; }
  .pz-blog__eyebrow { font-size: 9px; letter-spacing: 1.3px; }
  .pz-blog__featured { display: block; margin-bottom: 36px; }
  .pz-blog__lead { min-height: 0; }
  .pz-blog__lead-image { height: 210px; }
  .pz-blog__lead-image img { object-position: 50% 55%; }
  .pz-blog__lead-copy { padding: 22px; }
  .pz-blog__lead-copy h2 { font-size: 26px; }
  .pz-blog__lead-copy .pz-blog__read { margin-top: 18px; }
  .pz-blog__badge { top: 14px; left: 14px; }
  .pz-blog__feature-aside { margin-top: 24px; gap: 18px; }
  .pz-blog__aside-head { font-size: 14px; }
  .pz-blog__side { grid-template-columns: 112px 1fr; gap: 15px; }
  .pz-blog__side h3 { font-size: 18px; }
  .pz-blog__side .pz-blog__eyebrow { font-size: 8px; }
  .pz-blog__side .pz-blog__read { font-size: 11px; }
  .pz-blog__library { padding-top: 26px; }
  .pz-blog__library-head { display: block; }
  .pz-blog__library h2 { font-size: 28px; }
  .pz-blog__search { width: 100%; margin-top: 22px; }
  .pz-blog__filters { margin-right: -12px; padding-right: 12px; padding-top: 16px; }
  .pz-blog__filters a { padding: 9px 14px; }
  .pz-blog__grid { grid-template-columns: 1fr; gap: 22px; }
  .pz-blog__article img { height: 210px; }
  .pz-blog__article h3 { font-size: 23px; }
  .pz-blog__article .pz-blog__copy { padding: 20px; }
  .pz-blog__help { margin: 38px 0; padding: 26px 24px; display: block; }
  .pz-blog__help h2 { font-size: 27px; }
  .pz-blog__help > a { margin-top: 22px; }
}
