/* V3.1 blog page: shared site palette with the existing article index preserved. */
:root {
  --ink: #08224a;
  --ink-2: #27415f;
  --paper: #f5faff;
  --paper-2: #eaf4ff;
  --paper-3: #d8e9fb;
  --cobalt: #1267d6;
  --cobalt-deep: #0a4fa8;
  --blue: #1267d6;
  --blue-deep: #0a4fa8;
  --sky: #eaf4ff;
  --cream: #fff;
  --line: #dbe6f2;
  --line-strong: #c6d6e8;
  --muted: #5b6e85;
  --lime: #7eafe8;
  --serif: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
  --sans: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;
  --mono: "Space Grotesk", "Noto Sans JP", sans-serif;
  --display: "Space Grotesk", "Noto Sans JP", sans-serif;
}
body.v31-blog {
  background: var(--paper);
  color: var(--ink);
  font-feature-settings: "palt" 1;
}
body.v31-blog .container {
  width: min(calc(100% - var(--gutter)), var(--container));
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}
body.v31-blog #blog-hero {
  padding-top: clamp(48px, 6vw, 76px);
  background: linear-gradient(180deg, var(--paper) 0%, var(--cream) 100%);
}
body.v31-blog .featured-card {
  border-color: var(--line-strong);
  border-top-color: var(--blue);
}
body.v31-blog .article-card {
  border-radius: 12px 12px 3px 12px;
}
body.v31-blog .article-card::before { background: var(--blue); }
body.v31-blog .article-card:hover {
  box-shadow: 0 16px 48px rgba(8,34,74,.10);
}
body.v31-blog .article-card-thumb {
  position: relative;
  margin: -1px -1px 18px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--sky);
}
body.v31-blog .article-card-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
body.v31-blog .article-card:hover .article-card-thumb img { transform: scale(1.04); }
@media (max-width: 768px) {
  body.v31-blog .container { width: min(calc(100% - 40px), var(--container)); }
}
@media (prefers-reduced-motion: reduce) {
  body.v31-blog .article-card:hover .article-card-thumb img { transform: none; }
}