:root {
  --cat-models: #315cff;
  --cat-agents: #6658c9;
  --cat-skills: #377565;
  --cat-media: #ae4f5b;
  --cat-workflow: #8b6b34;
  --cat-productivity: #607080;

  --theme-commerce: #315cff;
  --theme-drama: #ae4f5b;
  --theme-radar: #377565;
}

.cat-models { --cat: var(--cat-models); }
.cat-agents { --cat: var(--cat-agents); }
.cat-skills { --cat: var(--cat-skills); }
.cat-media { --cat: var(--cat-media); }
.cat-workflow { --cat: var(--cat-workflow); }
.cat-productivity { --cat: var(--cat-productivity); }

.kicker.cat-models,
.kicker.cat-agents,
.kicker.cat-skills,
.kicker.cat-media,
.kicker.cat-workflow,
.kicker.cat-productivity { color: var(--cat); }

/* ---- Primary editorial themes ---- */
.themes { padding: 8px 0 68px; }
.theme-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 34px;
  border-top: 1px solid var(--rule);
  border-left: 1px solid var(--rule);
}
.theme-card {
  --theme: var(--ai);
  position: relative;
  min-height: 285px;
  padding: 32px 30px 30px;
  border-right: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  background: rgba(255,255,255,.22);
  scroll-margin-top: 140px;
}
.theme-card::before {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  top: -1px;
  height: 4px;
  background: var(--theme);
}
.theme-commerce { --theme: var(--theme-commerce); }
.theme-drama { --theme: var(--theme-drama); }
.theme-radar { --theme: var(--theme-radar); }
.theme-code {
  color: var(--theme);
  font: italic 11px/1.3 "Spectral", Georgia, serif;
  letter-spacing: .09em;
}
.theme-card h3 {
  margin: 22px 0 13px;
  font-size: 30px;
  line-height: 1.18;
  letter-spacing: -.03em;
}
.theme-card p {
  color: var(--ink-2);
  font-size: 14px;
  line-height: 1.85;
}
.theme-examples {
  position: absolute;
  left: 30px;
  right: 30px;
  bottom: 26px;
  padding-top: 10px;
  border-top: 1px solid var(--rule);
  color: var(--ink-3);
  font: italic 9px/1.5 "Spectral", Georgia, serif;
  letter-spacing: .045em;
}

/* ---- Secondary type index ---- */
.categories { padding: 8px 0 66px; }
.type-index { padding-top: 0; }
.category-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 34px;
  border-top: 1px solid var(--rule);
  border-left: 1px solid var(--rule);
}
.category-card {
  position: relative;
  min-height: 245px;
  padding: 28px 28px 25px;
  border-right: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  background: rgba(255,255,255,.18);
}
.category-card::before {
  content: "";
  position: absolute;
  left: -1px;
  right: -1px;
  top: -1px;
  height: 3px;
  background: var(--cat);
}
.category-code {
  color: var(--cat);
  font: italic 10px/1.3 "Spectral", Georgia, serif;
  letter-spacing: .08em;
}
.category-card h3 {
  margin: 22px 0 10px;
  font-size: 27px;
  line-height: 1.2;
  letter-spacing: -.025em;
}
.category-card p {
  color: var(--ink-2);
  font-size: 13px;
  line-height: 1.75;
}
.category-examples {
  position: absolute;
  left: 28px;
  right: 28px;
  bottom: 24px;
  padding-top: 9px;
  border-top: 1px solid var(--rule);
  color: var(--ink-3);
  font: italic 9px/1.5 "Spectral", Georgia, serif;
  letter-spacing: .035em;
}

.post.cat-models,
.post.cat-agents,
.post.cat-skills,
.post.cat-media,
.post.cat-workflow,
.post.cat-productivity { --post-accent: var(--cat); }

.post-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 13px;
}
.post-tag {
  padding: 2px 7px 1px;
  border: 1px solid var(--rule);
  color: var(--ink-3);
  font: italic 9px/1.5 "Spectral", Georgia, serif;
  letter-spacing: .03em;
}
.post-category {
  color: var(--cat);
  font: italic 10px/1.4 "Spectral", Georgia, serif;
  letter-spacing: .06em;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .theme-grid,
  .category-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
  .theme-grid,
  .category-grid { grid-template-columns: 1fr; }
  .theme-card { min-height: 245px; }
  .category-card { min-height: 220px; }
}