/* Home: a complete concert feature, followed by a catalog only when needed.
   Real artwork stays uncropped; no text is positioned over the image. */
.fb-main--home { padding-top: 1.25rem; padding-bottom: 2rem; }
.fb-featured { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
.fb-featured__poster { display: block; min-width: 0; align-self: center; }
.fb-featured__poster .fb-poster:not(.fb-poster--empty) {
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  max-height: 28rem;
  object-fit: contain;
  object-position: center;
  background: transparent;
}
/* The title is sized by the width of its column (cqi), so it grows with the layout but keeps
   "two words per line" proportions on laptops; long titles use a smaller scale. */
.fb-featured__body { min-width: 0; align-self: center; container-type: inline-size; }
.fb-featured__label { margin-bottom: .625rem; }
.fb-featured__title {
  margin: 0 0 1rem;
  font-family: var(--fb-head);
  font-weight: 500;
  font-size: clamp(2rem, 8vw, 3rem);
  line-height: 1.06;
  letter-spacing: -.015em;
  overflow-wrap: anywhere;
}
.fb-featured__title a { text-decoration: none; }
.fb-featured__title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .12em; }
.fb-featured .fb-facts { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1rem; }
.fb-featured .fb-facts__row { display: block; }
.fb-featured .fb-facts dd { margin-top: .25rem; }
.fb-featured__buy { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 1rem; }
.fb-featured__buy .fb-btn { width: 100%; }
.fb-featured__price {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  margin: 0;
  font-family: var(--fb-head);
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.2;
}
.fb-featured__price-label {
  font-family: var(--fb-text);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--fb-muted);
}
.fb-btn--large { min-height: 3.5rem; padding-inline: 2rem; font-size: .875rem; }
.fb-featured__title--long { font-size: clamp(1.75rem, 7vw, 2.5rem); }
@media (min-width: 768px) {
  .fb-main--home { padding-top: 2rem; padding-bottom: 3rem; }
  .fb-main--home:has(.fb-featured--single) { display: grid; align-content: center; }
  .fb-featured { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 2.5rem; align-items: center; }
  .fb-featured__poster .fb-poster:not(.fb-poster--empty) { max-height: 40rem; }
  .fb-featured__title { font-size: clamp(2.25rem, 13.5cqi, 4.75rem); margin-bottom: 1.5rem; }
  .fb-featured__title--long { font-size: clamp(2rem, 8.5cqi, 3.25rem); }
  .fb-featured--single { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); }
  .fb-featured .fb-facts { display: block; }
  .fb-featured .fb-facts__row { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); }
  .fb-featured .fb-facts dd { margin-top: 0; }
  .fb-featured__buy { margin-top: 1.5rem; }
  .fb-featured__buy .fb-btn { width: auto; }
  .fb-featured__price { display: block; width: auto; font-size: 2.125rem; }
  .fb-featured__price-label { display: block; margin-bottom: .25rem; }
}
@media (min-width: 1200px) {
  .fb-featured { gap: 3.5rem; }
  /* A single concert gets the stage: the whole page (header and footer too) widens so the
     poster and title grow while everything stays aligned to the same edges. */
  .fb-page:has(.fb-featured--single) { --fb-max: 96rem; }
  .fb-featured--single { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 4rem; }
  .fb-featured--single .fb-featured__poster .fb-poster:not(.fb-poster--empty) { max-height: 48rem; }
  .fb-featured--single .fb-featured__title { font-size: clamp(3rem, 14cqi, 5.5rem); }
  .fb-featured--single .fb-featured__title--long { font-size: clamp(2.25rem, 9cqi, 3.75rem); }
  .fb-featured--single .fb-featured__price { font-size: 2.5rem; }
  .fb-featured__buy { gap: 1rem 2rem; margin-top: 2rem; }
}

/* Other events ------------------------------------------------------------ */

.fb-catalog { margin-top: 3rem; }
.fb-catalog__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: .625rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--fb-ink);
}

.fb-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 768px) {
  .fb-catalog { margin-top: 3rem; }
  .fb-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.75rem 1.5rem; }
}
@media (min-width: 1200px) {
  .fb-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.fb-card { position: relative; }
.fb-card .fb-poster { margin-bottom: .625rem; }
.fb-card p { margin: 0; }
.fb-card__date {
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--fb-muted);
}
.fb-card__title {
  margin: .25rem 0 .125rem;
  font-family: var(--fb-head);
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.fb-card__link { text-decoration: none; }
/* The whole card is clickable; the link text stays just the title. */
.fb-card__link::after { content: ""; position: absolute; inset: 0; }
.fb-card__link:focus-visible { outline: none; }
.fb-card:has(.fb-card__link:focus-visible) { outline: 2px solid var(--fb-ink); outline-offset: 4px; }
.fb-card:hover .fb-card__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .12em; }
.fb-card__venue {
  font-size: .8125rem;
  line-height: 1.35;
  color: var(--fb-muted);
  overflow-wrap: anywhere;
}
.fb-card__price {
  margin-top: .375rem !important;
  font-size: .875rem;
  font-weight: 600;
}
@media (min-width: 768px) {
  .fb-card__title { font-size: 1.25rem; }
}

/* Empty state ------------------------------------------------------------- */

.fb-empty {
  padding: 2rem 0 3rem;
  border-top: 1px solid var(--fb-ink);
}
.fb-empty .fb-label { margin: .75rem 0 2rem; }
.fb-empty__title {
  max-width: 32rem;
  margin: 0 0 .75rem;
  font-family: var(--fb-head);
  font-size: 1.75rem;
  font-weight: 500;
  line-height: 1.15;
}
.fb-empty__text { max-width: 32rem; margin: 0; color: var(--fb-muted); }


/* A stable catalog frame, with all original lettering and logos visible. */
.fb-card .fb-poster { aspect-ratio: 3 / 4; object-fit: contain; object-position: center; }