/* Story page template (includes/shell/story.php). Tokens only; marketing mode. Page-specific styles: css/ds/pages/<page>.css */
.story-eyebrow { margin: 0; font-size: var(--ds-text-xs); letter-spacing: .1em; text-transform: uppercase; color: var(--ds-accent); font-variant-numeric: lining-nums tabular-nums; }
.story-hero { position: relative; background: var(--ds-dawn); color: var(--ds-text); border-block-end: 1px solid var(--ds-border); overflow-x: clip; }
.story-hero__inner { display: grid; gap: var(--ds-space-8); margin-inline: auto; max-inline-size: 72rem; padding: var(--ds-space-10) var(--ds-space-4) var(--ds-space-6); min-inline-size: 0; }
.story-hero__text { display: flex; flex-direction: column; gap: var(--ds-space-4); min-inline-size: 0; }
.story-hero__title { margin: 0; font-family: var(--ds-font-display); font-weight: 600; font-size: var(--ds-text-4xl); line-height: var(--ds-leading-tight); overflow-wrap: break-word; }
.story-hero__lede { margin: 0; max-inline-size: 60ch; font-size: var(--ds-text-lg); line-height: var(--ds-leading-normal); color: var(--ds-text-muted); }
.story-hero__media { min-inline-size: 0; }
.story-hero__trust { margin-inline: auto; max-inline-size: 72rem; padding: 0 var(--ds-space-4) var(--ds-space-6); }
.story-actions { display: flex; flex-wrap: wrap; gap: var(--ds-space-3); }
.story-trust { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--ds-space-2) var(--ds-space-5); font-size: var(--ds-text-sm); color: var(--ds-text-muted); }
.story-trust__item { position: relative; padding-inline-start: var(--ds-space-4); }
.story-trust__item::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: .5em; inline-size: .45em; block-size: .45em; border-radius: 50%; background: var(--ds-accent); }
.story-next { display: grid; gap: var(--ds-space-6); }
.story-next__cell { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ds-space-2); min-inline-size: 0; }
.story-next__note { margin: 0; font-size: var(--ds-text-sm); color: var(--ds-text-muted); max-inline-size: 36ch; }
.story-facts { margin: 0; display: grid; gap: var(--ds-space-4); }
.story-facts__row { display: grid; gap: var(--ds-space-1); padding-block-end: var(--ds-space-4); border-block-end: 1px solid var(--ds-border); }
.story-facts dt { font-size: var(--ds-text-xs); letter-spacing: .08em; text-transform: uppercase; color: var(--ds-accent); }
.story-facts dd { margin: 0; font-size: var(--ds-text-md); line-height: var(--ds-leading-normal); overflow-wrap: anywhere; }
.story-prose { max-inline-size: 65ch; font-size: var(--ds-text-md); line-height: var(--ds-leading-normal); }
.story-prose p { margin: 0 0 var(--ds-space-4); }
.story-prose a, .story-facts a { color: var(--ds-accent); text-underline-offset: .2em; }
@media (min-width: 48rem) {
  .story-hero__inner { padding-inline: var(--ds-space-8); padding-block: var(--ds-space-12) var(--ds-space-8); }
  .story-hero__inner:has(.story-hero__media) { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; }
  .story-hero__trust { padding-inline: var(--ds-space-8); }
  .story-next { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .story-facts__row { grid-template-columns: 12rem minmax(0, 1fr); gap: var(--ds-space-6); }
}

/* Your first Sunday (includes/shell/first-sunday.php) */
.ds-sunday { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-3); }
.ds-sunday__item { display: grid; gap: var(--ds-space-1); min-inline-size: 0; padding: var(--ds-space-4); background: var(--ds-surface-raised); border: 1px solid var(--ds-border); border-radius: var(--ds-radius-md); }
.ds-sunday__k { font-size: var(--ds-text-xs); letter-spacing: .08em; text-transform: uppercase; color: var(--ds-accent); }
.ds-sunday__v { font-size: var(--ds-text-md); line-height: var(--ds-leading-normal); overflow-wrap: anywhere; }
.ds-sunday__note { margin: var(--ds-space-4) 0 0; max-inline-size: 65ch; font-size: var(--ds-text-sm); color: var(--ds-text-muted); }
.ds-sunday__note a { display: inline-flex; align-items: center; min-block-size: 2.75rem; color: var(--ds-accent); text-underline-offset: .2em; }
@media (min-width: 48rem) { .ds-sunday { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 75rem) { .ds-sunday { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
