/*
 * Shared styling for the inner public pages, mirroring the visual language
 * established by the front page (see home.css).
 */

/* Page header ------------------------------------------------------------ */

.page-header {
  max-height: 340px;
}

.page-header-image {
  height: 340px;
  object-position: center;
}

.page-header-fallback {
  height: 220px;
  background: linear-gradient(135deg, #3a0d0a 0%, var(--intense-color) 100%);
}

.page-header-overlay {
  background: linear-gradient(to right, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.25) 60%, transparent 100%);
}

.page-header-eyebrow {
  letter-spacing: 0.08em;
  opacity: 0.85;
}

.page-header-subtitle {
  opacity: 0.9;
}

/* Cards ------------------------------------------------------------------ */

.play-card,
.person-card,
.archive-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.play-card:hover,
.person-card:hover,
.archive-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.12) !important;
}

.play-card-media {
  height: 220px;
  overflow: hidden;
}

.person-card-media {
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.play-card-placeholder,
.person-card-placeholder,
.person-portrait-placeholder {
  background: linear-gradient(135deg, #333 0%, #666 100%);
}

/* Person portrait -------------------------------------------------------- */

.person-portrait {
  aspect-ratio: 3 / 4;
}

/* Date badge ------------------------------------------------------------- */

.date-badge {
  background-color: var(--highlight-color);
  color: #000;
  border-radius: 0.5rem;
  padding: 0.5rem 0.75rem;
  min-width: 4.5rem;
}

.date-badge-lg {
  min-width: 5.5rem;
  padding: 0.75rem 1rem;
  font-size: 1.1rem;
}

/* Showtime rows ---------------------------------------------------------- */

.showtime-row:last-child {
  border-bottom: 0 !important;
}

/* Rich text -------------------------------------------------------------- */

.play-description :last-child {
  margin-bottom: 0;
}

.search-thumb {
  width: 4rem;
  height: 4rem;
  object-fit: cover;
  border-radius: .35rem;
}

.article-cover {
  height: 200px;
  object-fit: cover;
}

.news-cover {
  min-height: 250px;
}