.grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(20px, 4vw, 44px);
  align-items: start;
}
@media (max-width: 820px) {
  .grid { grid-template-columns: 1fr; }
}

.details dl {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.9rem 1.4rem;
}
.details dt {
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold);
  padding-top: 0.35rem;
  white-space: nowrap;
}
.details dd {
  margin: 0;
  font-size: clamp(17px, 1.9vw, 21px);
  color: #4f3528;
  line-height: 1.45;
}
.tbd { color: var(--muted); font-style: italic; }
.mapBtn { margin-top: 1.6rem; }

.stream {
  position: relative;
}
.videoBox {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 4px;
  overflow: hidden;
}
.videoBox iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.6rem;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 4px;
  background:
    radial-gradient(120% 120% at 50% 0%, rgba(255, 240, 210, 0.5), rgba(120, 22, 32, 0.06)),
    linear-gradient(180deg, #2a1620, #4a1c24);
  color: #f3ddc3;
  padding: 2rem;
}
.placeholder .icon { font-size: 2.4rem; }
.placeholder .msg { font-size: clamp(16px, 2vw, 20px); font-style: italic; }
.afterNote { color: var(--muted); font-size: 0.95rem; margin-top: 1rem; text-align: center; }
