/* cheers – Städte und Ratgeber (/kneipentour/, /ratgeber/, /ueber-cheers) */

.crumbs { margin-bottom: var(--s5); font-size: var(--text-secondary); color: var(--text-faint); }
.crumbs ol { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s2); }
.crumbs li { display: inline-flex; align-items: center; gap: var(--s2); min-width: 0; }
.crumbs li + li::before { content: "/"; color: var(--border-hover); }
.crumbs a { color: var(--text-muted); text-decoration: none; }
.crumbs a:hover { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
.crumbs [aria-current] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 60vw; }

.article-lead { margin-top: var(--s4); max-width: 36em; }
.article-cta { display: flex; flex-wrap: wrap; gap: var(--s3); margin-top: var(--s5); }
@media (max-width: 479.98px) {
  .article-cta .btn { width: 100%; }
}

.article-section { margin-top: var(--s7); }
.article-section > h2,
.article .article-section.prose > h2 {
  margin: 0 0 var(--s4);
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 6.5vw, 2.25rem);
  font-weight: 600;
  line-height: 1.1;
  color: var(--text);
  text-wrap: balance;
}
.article .prose { max-width: 40rem; line-height: 1.65; }
.article .prose h3 { margin-top: var(--s5); }
.article .prose li { margin-bottom: var(--s1); }
.article .prose li::marker { color: var(--text-faint); }

/* Kleine Tabellen in Ratgebern */
.article .prose table {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: var(--s4) 0;
  overflow-x: auto;
  border-collapse: collapse;
  font-size: var(--text-secondary);
}
.article .prose th,
.article .prose td { padding: var(--s2) var(--s3); border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.article .prose th { color: var(--text); font-weight: 600; white-space: nowrap; }
.article .prose tbody tr:last-child td { border-bottom: 0; }

/* Ausgehviertel */
.quarters { display: flex; flex-direction: column; gap: var(--s3); }
.quarter {
  padding: var(--s5) var(--s4);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
}
@media (min-width: 768px) {
  .quarter { padding: var(--s5); }
}
.quarter h3 { margin-bottom: var(--s2); font-size: 1.125rem; font-weight: 600; line-height: 1.3; }
.quarter .prose p:last-child { margin-bottom: 0; }
.quarter__link {
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  min-height: var(--hit);
  margin-top: var(--s2);
  color: var(--accent);
  font-size: var(--text-secondary);
  font-weight: 500;
  text-decoration: none;
}
.quarter__link svg { width: 18px; height: 18px; flex: none; }
.quarter__link:hover { color: var(--accent-hover); text-decoration: underline; text-underline-offset: 3px; }

/* Inhaltsverzeichnis */
.toc {
  margin-top: var(--s6);
  padding: var(--s4);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  font-size: var(--text-secondary);
}
.toc__title { margin-bottom: var(--s2); color: var(--text-faint); font-size: var(--text-meta); text-transform: uppercase; letter-spacing: 0.06em; }
.toc ol { display: flex; flex-direction: column; gap: var(--s1); list-style: decimal; padding-left: 1.25rem; color: var(--text-faint); }
.toc a { color: var(--text-muted); text-underline-offset: 3px; }
.toc a:hover { color: var(--text); }

/* Quellen und Stand */
.article-foot { margin-top: var(--s7); padding-top: var(--s4); border-top: 1px solid var(--border); }
.article-sources summary { color: var(--text-muted); font-size: var(--text-secondary); }
.article-sources ul { display: flex; flex-direction: column; gap: var(--s2); padding-bottom: var(--s4); font-size: var(--text-secondary); }
.article-sources a { color: var(--text-muted); text-underline-offset: 3px; overflow-wrap: anywhere; }
.article-sources a:hover { color: var(--text); }
.article-foot .meta { margin-top: var(--s2); }

/* Linklisten (Übersichten, Weiterlesen) */
.link-list { border-top: 1px solid var(--border); }
.link-list li { border-bottom: 1px solid var(--border); }
.link-list a {
  display: grid;
  grid-template-columns: 1fr auto;
  column-gap: var(--s3);
  align-items: center;
  min-height: 60px;
  padding-block: var(--s3);
  color: inherit;
  text-decoration: none;
}
.link-list__title { grid-column: 1; font-weight: 500; }
.link-list__teaser { grid-column: 1; margin-top: 2px; font-size: var(--text-secondary); color: var(--text-faint); }
.link-list__chev { grid-column: 2; grid-row: 1 / span 2; width: 20px; height: 20px; color: var(--text-faint); transition: transform var(--dur-fast) var(--ease-out), color var(--dur-fast); }
.link-list a:hover .link-list__title { color: var(--accent); }
.link-list a:hover .link-list__chev { color: var(--accent); transform: translateX(2px); }
@media (prefers-reduced-motion: reduce) {
  .link-list__chev { transition: none; }
}

.more-link { margin-top: var(--s4); font-size: var(--text-secondary); }
.more-link a { color: var(--text-muted); text-underline-offset: 3px; }
.more-link a:hover { color: var(--text); }