/* Poster/landing page styling - recreates the flyer's horizontal banner
   layout: laurel-ringed logo on the left, title + date/time/location strip
   in the middle, a gold contact band, and a dark tagline strip at the foot.
   Reuses the color tokens defined in style.css's :root. */

.poster {
  background: linear-gradient(135deg, var(--navy-dark), var(--navy-light));
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(13, 27, 62, 0.25);
}

.poster-banner {
  position: relative;
  display: flex;
  align-items: center;
  gap: clamp(20px, 4vw, 48px);
  padding: clamp(28px, 5vw, 48px) clamp(24px, 5vw, 48px);
  flex-wrap: wrap;
}

.poster-fx {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}

.poster-logo-col {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
}

.laurel-frame {
  position: relative;
  width: clamp(120px, 20vw, 190px);
  height: clamp(120px, 20vw, 190px);
  border-radius: 50%;
  border: 2px solid var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(10px, 2vw, 18px);
}
.laurel-frame::before {
  content: '';
  position: absolute;
  inset: -14px;
  border-radius: 50%;
  border: 1px solid rgba(201, 169, 97, 0.35);
}
.laurel-frame img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: var(--cream);
  border-radius: 50%;
  padding: 10px;
}
.laurel-sprig {
  position: absolute;
  width: 46px;
  height: 46px;
  color: var(--gold);
  opacity: 0.9;
}
.laurel-sprig.left { left: -20px; bottom: 6px; transform: rotate(-15deg); }
.laurel-sprig.right { right: -20px; bottom: 6px; transform: rotate(15deg) scaleX(-1); }

.poster-main-col {
  position: relative;
  z-index: 2;
  flex: 1 1 320px;
  min-width: 0;
}

.poster-title {
  font-size: clamp(24px, 4.5vw, 34px);
  font-weight: bold;
  color: #fff;
  margin: 0 0 8px;
  line-height: 1.15;
}
.poster-tagline {
  color: var(--muted);
  font-size: clamp(13px, 2.6vw, 15px);
  line-height: 1.55;
  margin: 0 0 20px;
  max-width: 60ch;
}

.poster-meta-strip {
  display: flex;
  align-items: stretch;
  gap: 0;
  flex-wrap: wrap;
  border-top: 1px solid rgba(201, 169, 97, 0.3);
  padding-top: 18px;
}
.poster-meta-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px clamp(14px, 2.5vw, 26px);
  border-right: 1px solid rgba(201, 169, 97, 0.3);
}
.poster-meta-cell:first-child { padding-left: 0; }
.poster-meta-cell:last-child { border-right: none; }
.poster-meta-cell svg {
  flex-shrink: 0;
  color: var(--gold);
}
.poster-meta-cell .meta-text {
  display: flex;
  flex-direction: column;
  line-height: 1.3;
}
.poster-meta-cell .meta-label {
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold);
  opacity: 0.85;
}
.poster-meta-cell .meta-value {
  font-size: clamp(13px, 2.6vw, 15px);
  color: #fff;
}

/* Gold contact band, mirroring the flyer's bottom info bar */
.poster-gold-band {
  background: linear-gradient(90deg, var(--tan-band), var(--gold-light));
  padding: clamp(16px, 3vw, 22px) clamp(24px, 5vw, 48px);
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 40px);
  flex-wrap: wrap;
}
.poster-band-cell {
  display: flex;
  align-items: center;
  gap: 10px;
}
.poster-band-icon {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--navy);
  color: var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
}
.poster-band-cell .band-label {
  font-size: 10px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #6b5c2e;
  font-weight: bold;
}
.poster-band-cell .band-value {
  font-size: 13px;
  color: #2b2410;
}
.poster-band-cell .band-value strong { color: #16130a; }
.poster-band-divider {
  width: 1px;
  align-self: stretch;
  background: rgba(43, 36, 16, 0.2);
}

/* Dark tagline strip at the very bottom */
.poster-tagline-strip {
  position: relative;
  background: linear-gradient(180deg, var(--navy), var(--navy-dark));
  padding: 22px 20px;
  text-align: center;
  overflow: hidden;
}
.poster-tagline-strip .strip-text {
  position: relative;
  z-index: 2;
  color: var(--gold-light);
  font-style: italic;
  font-size: clamp(14px, 2.6vw, 17px);
  display: inline-flex;
  align-items: center;
  gap: 14px;
}
.poster-tagline-strip svg {
  color: var(--gold);
  opacity: 0.8;
  flex-shrink: 0;
}

@media (max-width: 640px) {
  .poster-banner { flex-direction: column; text-align: center; }
  .poster-meta-strip { flex-direction: column; border-top: none; }
  .poster-meta-cell {
    border-right: none;
    border-top: 1px solid rgba(201, 169, 97, 0.25);
    justify-content: center;
    padding: 10px 0;
  }
  .poster-meta-cell:first-child { border-top: none; padding-top: 0; }
  .poster-gold-band { flex-direction: column; align-items: flex-start; }
  .poster-band-divider { display: none; }
}