:root { --navy:#17213a; --red:#a22531; --green:#37ca37; --blue:#188bf6; --bg:#f6f7fb; --card:#fff; --text:#202633; --muted:#65708a; }
* { box-sizing: border-box; }
body { margin:0; font-family: 'Montserrat','Open Sans', Arial, Helvetica, sans-serif; color:var(--text); background:var(--bg); line-height:1.55; }
header.site { background:linear-gradient(135deg,#17213a,#263b66); color:#fff; padding:38px 20px 28px; text-align:center; }
header.site h1 { margin:0 0 8px; font-size:clamp(28px,4vw,44px); letter-spacing:0.2px; }
header.site p.tagline { margin:0; font-size:18px; opacity:.95; }
nav.book { background:#17213a; padding:0; display:flex; flex-wrap:wrap; justify-content:center; gap:0; border-top:1px solid #2a3552; }
nav.book a { color:#cfd4e2; text-decoration:none; padding:14px 18px; font-weight:600; font-size:15px; border-bottom:3px solid transparent; }
nav.book a:hover { color:#fff; background:#1f2a4a; }
nav.book a.active { color:#fff; border-bottom-color:var(--green); }
main { max-width:1120px; margin:0 auto; padding:28px 16px 60px; }
.card { background:var(--card); border-radius:14px; padding:24px; margin:0 0 22px; box-shadow:0 8px 24px rgba(23,33,58,.08); }
.card h2 { color:var(--navy); margin:0 0 14px; font-size:28px; }
.card h3 { color:var(--navy); margin:18px 0 10px; font-size:20px; }
.lead { font-size:18px; font-weight:600; color:var(--navy); }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:20px; margin:14px 0; }
.video-card { background:var(--card); border-radius:14px; padding:18px; box-shadow:0 6px 18px rgba(23,33,58,.08); display:flex; flex-direction:column; }
.video-card .pill { display:inline-block; background:var(--green); color:#fff; font-weight:700; font-size:12px; padding:4px 10px; border-radius:999px; text-transform:uppercase; letter-spacing:.5px; margin-bottom:10px; align-self:flex-start; }
.video-card h3 { color:var(--navy); margin:6px 0 8px; font-size:18px; }
.video-card p.speaker { margin:0 0 8px; color:var(--blue); font-weight:600; font-size:14px; }
.video-card p.desc { margin:0 0 12px; color:var(--text); font-size:14px; line-height:1.5; flex:1; }
.embed { position:relative; width:100%; padding-top:56.25%; margin:10px 0; background:#000; border-radius:10px; overflow:hidden; }
.embed.tall { padding-top:75%; }
.embed iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-card .open-link { margin-top:auto; display:inline-block; background:var(--red); color:#fff; padding:10px 14px; border-radius:8px; text-decoration:none; font-weight:700; text-align:center; font-size:14px; }
.video-card .open-link:hover { background:#7e1c25; }
.pager { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:30px 0 8px; }
.pager a { background:var(--navy); color:#fff; padding:12px 22px; border-radius:8px; text-decoration:none; font-weight:700; font-size:15px; }
.pager a.green { background:var(--green); }
.pager a:hover { opacity:.85; }
audio { width:100%; margin:8px 0 12px; }
.button { display:inline-block; background:var(--red); color:#fff; padding:12px 18px; border-radius:8px; text-decoration:none; font-weight:700; margin-right:8px; }
.button.secondary { background:var(--navy); }
.button.green { background:var(--green); }
.buttons { display:flex; flex-wrap:wrap; gap:12px; margin:16px 0 4px; }
.placeholder { background:#fff8e6; border-left:5px solid #d69e2e; padding:14px 16px; border-radius:8px; font-style:italic; color:#7a5b0f; }
footer.site { background:#17213a; color:#cfd4e2; padding:30px 20px 24px; margin-top:30px; text-align:center; font-size:14px; }
footer.site a { color:#fff; }
footer.site .legal { margin-top:10px; font-size:12px; color:#8a93ab; }
@media (max-width:600px) {
  nav.book a { padding:12px 12px; font-size:13px; }
  main { padding:18px 10px 40px; }
  .card { padding:18px; }
}