/* AudiobookStories — structural layout: single-post column, header block. */

.abs-single-main {
  background: var(--abs-bg);
  padding-bottom: var(--abs-space-16);
}

.abs-article {
  max-width: var(--abs-content-width);
  margin: 0 auto;
  padding: var(--abs-space-6) var(--abs-space-4) 0;
}

@media (min-width: 782px) {
  .abs-article { padding-top: var(--abs-space-8); }
}

/* No sidebar anywhere on this theme — full-width content column. */
.abs-single-main .abs-article,
.abs-single-main .entry-content {
  width: 100%;
}

.abs-archive-main {
  background: var(--abs-bg);
  padding-bottom: var(--abs-space-8);
}

/* ── Post header block ──────────────────────────────────────────────── */

.abs-post-header {
  margin-bottom: var(--abs-space-6);
}

.abs-kicker {
  display: inline-block;
  font-family: var(--abs-font-body);
  font-size: var(--abs-fs-kicker);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--abs-accent);
  background: var(--abs-badge-bg);
  padding: var(--abs-space-1) var(--abs-space-3);
  border-radius: 999px;
  margin-bottom: var(--abs-space-3);
}

.abs-title {
  font-size: var(--abs-fs-title-sm);
  margin: 0 0 var(--abs-space-4);
  letter-spacing: -0.01em;
}

@media (min-width: 782px) {
  .abs-title { font-size: var(--abs-fs-title-lg); }
}

.abs-post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--abs-space-1) var(--abs-space-3);
  font-size: 0.9rem;
  color: var(--abs-ink-muted);
  margin-bottom: var(--abs-space-2);
}

.abs-post-meta .abs-meta-sep {
  color: var(--abs-border);
}

.abs-post-meta .abs-meta-category {
  color: var(--abs-accent);
  font-weight: 600;
}

/* ── Content column ──────────────────────────────────────────────────── */

.abs-content {
  max-width: 100%;
}

/* ── Homepage sections ───────────────────────────────────────────────── */

.abs-home-section {
  width: 100%;
}

.abs-home-inner {
  max-width: var(--abs-page-width);
  margin: 0 auto;
  padding: 0 var(--abs-space-4);
}

/* Hero is capped, not full-viewport, specifically so real content (the
   category grid) is visible in the first viewport on load — no blank
   fold on mobile or desktop. */
.abs-hero {
  padding: var(--abs-space-8) 0 var(--abs-space-6);
}

@media (min-width: 782px) {
  .abs-hero { padding: var(--abs-space-12) 0 var(--abs-space-8); }
}

@media (min-width: 1200px) {
  .abs-hero { padding-top: var(--abs-space-16); }
}