/* ============================================================
   HEJ NYKÖPING — Prose bundle
   ------------------------------------------------------------
   Medvetet utbruten delmängd av components.css för konsumenter
   som behöver artikel-/brödtexttypografi utan hela katalogen.

   Innehåller: .prose (rubriker, länkar, listor, citat, kod,
   bilder, hr, figcaption).
   Källa: components.css. Håll i synk vid ändringar.
   Konsumerar BARA tokens från ../tokens.css.
   ============================================================ */

.prose {
  max-width: var(--prose-max);
  color: var(--prose-text);
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
}
.prose > * + * { margin-top: var(--space-4); }
.prose h2, .prose h3, .prose h4 { font-family: var(--font-display); color: var(--prose-heading); line-height: var(--leading-snug); margin-top: var(--space-8); }
.prose h2 { font-size: var(--text-3xl); font-weight: var(--weight-bold); }
.prose h3 { font-size: var(--text-2xl); font-weight: var(--weight-bold); }
.prose h4 { font-size: var(--text-xl); font-weight: var(--weight-bold); }
.prose a { color: var(--prose-link); text-decoration: underline; text-underline-offset: 0.2em; }
/* Knappar i prosa behåller sina egna färger — annars vinner `.prose a`
   och ger t.ex. orange text på en orange knapp. */
.prose a.btn { text-decoration: none; color: var(--color-foreground); }
.prose a.btn--primary,
.prose a.btn--on-dark { color: var(--color-on-primary); }
.prose a.btn--ghost { color: var(--btn-ghost-text); }
.prose ul, .prose ol { padding-left: var(--space-6); }
.prose li + li { margin-top: var(--space-2); }
.prose blockquote { border-left: 4px solid var(--prose-blockquote-border); padding-left: var(--space-5); font-style: italic; color: var(--prose-muted); }
.prose code { background: var(--prose-code-bg); color: var(--prose-code-text); padding: 0.1em 0.35em; border-radius: var(--radius-sm); font-size: 0.9em; }
.prose pre { background: var(--prose-code-bg); padding: var(--space-4); border-radius: var(--radius-md); overflow-x: auto; }
.prose pre code { background: transparent; padding: 0; }
.prose img { max-width: 100%; height: auto; border-radius: var(--prose-figure-radius); }
.prose hr { border: none; border-top: 1px solid var(--prose-hr); margin: var(--space-8) 0; }
.prose figcaption { font-size: var(--text-sm); color: var(--prose-muted); margin-top: var(--space-2); }