/* ===========================
   Speaker Programs
   =========================== */
body { margin:0; font-family: Arial, sans-serif; background:#fff; color:#000; }
.container-narrow { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }

/* Header */
.spk-header { display:flex; align-items:center; }
.spk-title  { margin:0; padding:2.25rem 0 1.25rem; font-size:2.1rem; font-weight:800; text-transform:uppercase; letter-spacing:.01em; }
.spk-dot    { width:1.6rem; height:1.6rem; border-radius:50%; background:#0C8DB0; display:inline-block; margin-left:.6rem; }
.spk-rule   { border:none; border-top:1px solid #cfcfcf; margin:0 0 1.25rem; }

/* Intro */
.spk-intro p { line-height:1.75; color:#222; margin:.5rem 0 1.5rem; }
.spk-link { color:#0C8DB0; text-decoration:none; border-bottom:1px solid transparent; }
.spk-link:hover { border-bottom-color:#0C8DB0; }

/* Poster grid */
.spk-grid {
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px 34px;              /* row / column spacing */
  padding-bottom: 40px;
}

/* Poster card */
.poster { margin:0; background:#fff; }
.poster img {
  width:100%;
  aspect-ratio: 6/6;           /* proportion similar to the mock */
  object-fit: cover;
  display:block;
  border: 1px solid #e6e6e6;   /* subtle edge like print border */
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}

/* Optional red frame variant (use on the middle row posters) */
.poster--framed img {
  border: 4px solid #B63A33;   /* deep red frame */
}

/* Hover polish (optional) */
.poster img:hover {
  transform: translateY(-1px);
  transition: transform .15s ease, box-shadow .15s ease;
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
}

/* Responsive */
@media (max-width: 900px) {
  .container-narrow { padding: 0 1.25rem; }
  .spk-grid { grid-template-columns: 1fr; gap: 22px; }
  .spk-title { font-size: 1.9rem; }
}