/* =============================================================
   StageHub /new — Detail článku, statická stránka (o-projekte),
   kontakt. Načíta sa s tokens.css + base.css.
   ============================================================= */

.sh-article { padding-block: var(--sh-space-8) var(--sh-space-16); }
.sh-article-inner { max-width: var(--sh-container-narrow); }

.sh-article-head { margin-bottom: var(--sh-space-6); }
.sh-article-title {
  font-family: var(--sh-font-head); font-size: var(--sh-text-4xl);
  line-height: var(--sh-leading-tight); letter-spacing: -0.02em;
  color: var(--sh-ink); margin: var(--sh-space-2) 0 var(--sh-space-3);
}
.sh-article-byline { font-size: var(--sh-text-sm); color: var(--sh-ink-50); display: flex; flex-wrap: wrap; gap: var(--sh-space-2); align-items: center; margin: 0; }

.sh-article-cover { margin: 0 0 var(--sh-space-8); border-radius: var(--sh-radius-lg); overflow: hidden; background: var(--sh-cream-1); }
.sh-article-cover img { width: 100%; height: auto; display: block; aspect-ratio: 16 / 9; object-fit: cover; }

/* Telo článku / obsah stránky */
.sh-article-body { font-size: var(--sh-text-lg); line-height: var(--sh-leading-normal); color: var(--sh-ink); }
.sh-article-body > * + * { margin-top: var(--sh-space-5); }
.sh-article-body h2 { font-family: var(--sh-font-head); font-size: var(--sh-text-2xl); margin-top: var(--sh-space-10); color: var(--sh-ink); }
.sh-article-body h3 { font-family: var(--sh-font-head); font-size: var(--sh-text-xl); margin-top: var(--sh-space-8); color: var(--sh-ink); }
.sh-article-body a { color: var(--sh-amber-text); text-decoration: underline; }
.sh-article-body img { max-width: 100%; height: auto; border-radius: var(--sh-radius-md); }
.sh-article-body ul, .sh-article-body ol { padding-left: var(--sh-space-6); }
.sh-article-body li + li { margin-top: var(--sh-space-2); }
.sh-article-body blockquote { border-left: 3px solid var(--sh-amber); padding-left: var(--sh-space-5); color: var(--sh-ink-70); font-style: italic; }

/* Interpreti v článku */
.sh-article-artists, .sh-article-related { margin-top: var(--sh-space-12); padding-top: var(--sh-space-8); border-top: 1px solid var(--sh-ink-12); }
.sh-mini-grid { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sh-space-5); }
.sh-mini-card a { display: flex; flex-direction: column; align-items: center; gap: var(--sh-space-2); text-align: center; color: inherit; width: 120px; }
.sh-mini-card img { width: 96px; height: 96px; border-radius: var(--sh-radius-pill); object-fit: cover; background: var(--sh-cream-1); }
.sh-mini-name { font-weight: var(--sh-weight-medium); font-size: var(--sh-text-sm); color: var(--sh-ink); }
.sh-mini-card a:hover .sh-mini-name { color: var(--sh-amber-text); }
.sh-mini-meta { font-size: var(--sh-text-xs); color: var(--sh-ink-50); }

/* Kontakt */
.sh-contact { padding-block: var(--sh-space-8) var(--sh-space-16); }
.sh-contact-inner { max-width: var(--sh-container-narrow); }
.sh-form { display: flex; flex-direction: column; gap: var(--sh-space-5); margin-top: var(--sh-space-6); }
.sh-form .sh-field { display: flex; flex-direction: column; gap: var(--sh-space-2); }
.sh-form label { font-size: var(--sh-text-sm); font-weight: var(--sh-weight-medium); color: var(--sh-ink); }
.sh-form input, .sh-form textarea {
  font-family: var(--sh-font-body); font-size: var(--sh-text-base); color: var(--sh-ink);
  padding: var(--sh-space-3) var(--sh-space-4); border: 1px solid var(--sh-ink-12);
  border-radius: var(--sh-radius-md); background: var(--sh-surface-raised); width: 100%;
}
.sh-form input:focus, .sh-form textarea:focus { outline: 2px solid var(--sh-amber); outline-offset: -1px; }
.sh-form textarea { resize: vertical; min-height: 8rem; }
.sh-field-actions { flex-direction: row; }
.sh-contact-alt { margin-top: var(--sh-space-6); font-size: var(--sh-text-sm); color: var(--sh-ink-70); }
.sh-contact-alt a { color: var(--sh-amber-text); text-decoration: underline; }