/* Blog — Archive header, category pills, and "Najnovije objave" section heading.
   Hero uses the clinic ornament pattern: sage-300 hash marks around a teal
   icon, Fraunces serif title with teal underline accent. Category pills
   sit just below, scrollable on mobile. */

/* --- Archive hero ------------------------------------------------------
   Premium clinic-style header — sage hash eyebrow at top, large Fraunces
   title with italic em accent, muted description. Matches the section
   head treatment used across the rest of the site (hero, specialty,
   methodology, FAQ etc.). */
.pr-blog-archive__hero{
  text-align:center;
  padding:16px 24px 16px;
  max-width:820px;
  margin:0 auto 44px;
}

/* Eyebrow ("BLOG", "KATEGORIJA", "OZNAKA", "AUTOR", "PRETRAGA"). */
.pr-blog-archive__hero-eyebrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  font-family:"Hanken Grotesk",sans-serif;
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--sage);
  margin-bottom:22px;
}
.pr-blog-archive__hero-eyebrow::before,
.pr-blog-archive__hero-eyebrow::after{
  content:"";
  display:inline-block;
  width:30px;
  height:1.5px;
  background:var(--sage);
}

.pr-blog-archive__hero-title{
  font-family:"Fraunces",serif;
  font-size:clamp(2.2rem, 4.6vw, 3.4rem);
  font-weight:300;
  color:var(--pine);
  margin:0;
  line-height:1.12;
  letter-spacing:-.02em;
}
.pr-blog-archive__hero-title em,
.pr-blog-archive__hero-title span{
  color:var(--teal);
  font-weight:400;
  font-style:italic;
}

.pr-blog-archive__hero-desc{
  margin-top:20px;
  font-size:1.04rem;
  color:var(--ink-soft);
  line-height:1.65;
  max-width:54ch;
  margin-left:auto;
  margin-right:auto;
}

/* --- Category pills ---------------------------------------------------- */
.pr-blog-cat-pills{
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
  margin:0 0 40px;
  padding:0 8px;
}

.pr-blog-cat-pill{
  display:inline-flex;align-items:center;gap:10px;
  padding:9px 18px;
  border-radius:999px;
  background:var(--paper);
  color:var(--pine);
  text-decoration:none;
  font-family:"Hanken Grotesk",sans-serif;
  font-size:.84rem;font-weight:700;
  letter-spacing:.04em;
  border:1px solid var(--line);
  transition:background .25s ease, color .25s ease, border-color .25s ease, transform .2s ease;
}

.pr-blog-cat-pill:hover{
  background:var(--mint-50);
  border-color:var(--mint);
  color:var(--teal);
  transform:translateY(-2px);
}

.pr-blog-cat-pill.is-active{
  background:var(--teal);
  color:#fff;
  border-color:var(--teal);
}

.pr-blog-cat-pill__count{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:22px;height:20px;
  padding:0 7px;
  border-radius:999px;
  background:var(--mint-50);
  color:var(--teal);
  font-size:.7rem;font-weight:800;line-height:1;
}
.pr-blog-cat-pill.is-active .pr-blog-cat-pill__count{
  background:rgba(255,255,255,.22);
  color:#fff;
}

/* --- "Najnovije objave" section heading -------------------------------- */
.pr-blog-archive__list-head{
  text-align:center;
  margin:0 0 36px;
}

.pr-blog-archive__list-title{
  font-family:"Fraunces",serif;
  font-size:clamp(22px,2.4vw,30px);
  font-weight:300;
  color:var(--pine);
  margin:0;
  line-height:1.2;
  position:relative;
  display:inline-block;
  padding-bottom:12px;
  letter-spacing:-.01em;
}
.pr-blog-archive__list-title em{color:var(--teal);font-style:normal;font-weight:400}

.pr-blog-archive__list-title::after{
  content:'';
  position:absolute;left:50%;bottom:0;
  width:60px;height:3px;
  background:var(--teal);
  border-radius:2px;
  transform:translateX(-50%);
}

/* --- Post grid --------------------------------------------------------- */
.pr-blog-archive__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:28px;
  margin-bottom:48px;
}

.pr-blog-archive__grid--with-sidebar{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}

/* --- Responsive -------------------------------------------------------- */
@media(max-width:768px){
  .pr-blog-archive__hero{padding:8px 12px 8px;margin-bottom:30px}
  .pr-blog-archive__hero-eyebrow{font-size:.7rem;margin-bottom:16px;gap:9px}
  .pr-blog-archive__hero-eyebrow::before,
  .pr-blog-archive__hero-eyebrow::after{width:22px}
  .pr-blog-archive__hero-title{font-size:clamp(1.7rem, 6vw, 2.2rem)}
  .pr-blog-archive__hero-desc{font-size:.94rem;margin-top:14px}

  .pr-blog-cat-pills{
    justify-content:flex-start;
    overflow-x:auto;
    flex-wrap:nowrap;
    margin:0 -14px 28px;
    padding:4px 14px 12px;
    scrollbar-width:thin;
  }
  .pr-blog-cat-pill{white-space:nowrap;flex-shrink:0;padding:8px 14px;font-size:.78rem}

  .pr-blog-archive__grid,
  .pr-blog-archive__grid--with-sidebar{
    grid-template-columns:1fr;
    gap:18px;
  }

  .pr-blog-archive__list-title{font-size:1.35rem}
}

@media(max-width:480px){
  .pr-blog-archive__hero{margin-bottom:22px}
  .pr-blog-archive__hero-title{font-size:1.55rem;letter-spacing:-.015em}
  .pr-blog-archive__hero-desc{font-size:.9rem;line-height:1.55}
  .pr-blog-archive__list-head{margin:0 0 24px}
  .pr-blog-archive__list-title{font-size:1.2rem}
}