/* =================== page-blog-index.css =================== */
.page-blog-index .blog-index__featured-title a {color: var(--sf-ink);
  text-decoration: none;}
.page-blog-index .blog-index__chips {
display: flex; flex-wrap: wrap; gap: 6px;
  margin-bottom: 24px;
}
.page-blog-index .blog-index__featured-body {
padding: clamp(28px, 3vw, 48px);
  display: grid;
  align-content: start;
  gap: 14px;
  min-width: 0;
}
.page-blog-index .blog-index__featured-cover {
display: block;
  min-height: 100%;
  background: linear-gradient(145deg, #e4d3ac, #efe2c8);
}
.page-blog-index .blog-index__featured-cover .blog-art {
width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.page-blog-index .blog-index__featured-image {
width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
.page-blog-index .blog-index__featured-title {
margin: 0;
  font-size: clamp(36px, 3vw, 54px);
  line-height: 0.98;
  max-width: 15ch;
  text-wrap: balance;
}
.page-blog-index .blog-index__featured {
display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(0, 1.14fr);
  gap: 0;
  overflow: hidden;
  min-height: clamp(360px, 31vw, 470px);
  border-radius: 22px;
  box-shadow: 0 22px 70px rgba(41, 30, 18, 0.07);
}
.page-blog-index .blog-index__lead-grid {
display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(320px, 0.9fr);
  gap: 18px;
  align-items: stretch;
}
.page-blog-index .blog-index__lede {
font-size: 15px; line-height: 1.55;
  color: rgba(26, 23, 20, 0.62);
  max-width: 60ch;
  margin: 8px 0 22px;
}
.page-blog-index .blog-index__side-pick {
min-height: 0;
}
.page-blog-index .blog-index__side-picks {
display: grid;
  gap: 14px;
}
.page-blog-index .blog-index__title {
font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: 36px; font-weight: 500;
  letter-spacing: -0.015em;
  margin: 18px 0 6px;
  color: var(--hc-ink, #1a1714);
}
.page-blog-index .blog-top-signals {
  display: flex; flex-wrap: wrap; gap: 6px 18px;
  margin: 6px 0 10px;
}
.page-blog-index .blog-top-signals span {
  font-size: 11px; letter-spacing: 0.10em;
  text-transform: uppercase; font-weight: 500;
  color: rgba(26, 23, 20, 0.55);
  font-family: "JetBrains Mono", monospace;
  position: relative;
  padding-left: 14px;
}
.page-blog-index .blog-top-signals span::before {
  content: ""; position: absolute;
  left: 0; top: 50%; transform: translateY(-50%);
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--hc-accent, #8b7355);
  opacity: 0.45;
}
.page-blog-index .blog-top-signals span:first-child::before {
  background: var(--hc-ink, #1a1714);
  opacity: 0.85;
}
@media (max-width: 1024px) {
  .page-blog-index .blog-index__lead-grid {grid-template-columns: 1fr;}
  .page-blog-index .blog-index__featured {grid-template-columns: 1fr;
    min-height: auto;}
  .page-blog-index .blog-index__featured-cover {min-height: 280px;}
  .page-blog-index .blog-index__featured-title {font-size: clamp(34px, 6.4vw, 50px);
    max-width: 16ch;}
}
@media (max-width: 480px) {
  .page-blog-index .blog-index__featured-cover {min-height: 220px;}
}
@media(max-width:1024px) {
  .page-blog-index .blog-index__title {margin-top: 24px}
}