/* talks.cote.io — shared stylesheet */

@font-face {
  font-family: 'Cartridge';
  src: url('vmug-ams-2026/themes/blue-boy/fonts/Cartridge-Regular.otf') format('opentype');
}
@font-face {
  font-family: 'Cartridge Rough';
  src: url('vmug-ams-2026/themes/blue-boy/fonts/Cartridge-Rough.otf') format('opentype');
}

body {
  font-family: 'Cartridge', -apple-system, sans-serif;
  background-color: #0091DA;
  color: #fff;
  margin: 0;
  padding: 2em;
  min-height: 100vh;
  font-size: 1.2em;
}
.container { max-width: 700px; margin: 0 auto; }

h1, h2, h3 { font-family: 'Cartridge Rough', 'Cartridge', sans-serif; }
h1 { font-size: 2.2em; margin-bottom: 0.2em; }
h2 { font-size: 1.1em; margin-top: 1.5em; margin-bottom: 0.3em; }
h3 { font-size: 1.6em; margin-top: 1.5em; margin-bottom: 0.5em; }

a { color: #fff; text-decoration: underline; }

/* Index page */
article { margin-bottom: 1.2em; display: grid; grid-template-columns: auto 1fr; column-gap: 0.6em; }
.talk-date { color: rgba(255,255,255,0.6); grid-row: 1; }
.talk-detail { grid-column: 2; }
.talk-title a { color: #fff; font-family: 'Cartridge', sans-serif; }
.talk-venue { color: rgba(255,255,255,0.6); display: block; font-size: 0.85em; margin-top: 0.1em; }
.talk-venue a { color: rgba(255,255,255,0.6); }
article .meta { margin-top: 0.2em; }

/* Talk pages */
.given { font-style: italic; margin-bottom: 0.5em; }
.summary { margin-bottom: 1.5em; line-height: 1.5; }
.related-blog ul, .related-talks ul { padding-left: 1.2em; list-style: none; }
.related-blog li, .related-talks li { margin-bottom: 0.4em; line-height: 1.4; }
.related-blog li::before, .related-talks li::before { content: '- '; margin-left: -1.2em; }
.slides { margin-bottom: 0.3em; position: relative; }
.slides iframe { border: 0.5em solid #333; background: #333; }
.dl-link { text-align: right; font-size: 0.85em; margin-top: 0.3em; }
.video { margin-bottom: 0.3em; }
.video iframe { border: none; }
.resources ul { padding-left: 1.2em; list-style: none; }
.resources li { margin-bottom: 0.4em; }
.resources li::before { content: '- '; margin-left: -1.2em; }
.nav-bottom { margin-top: 2em; margin-bottom: 1em; }

footer {
  margin-top: 3em;
  border-top: 1px solid rgba(255,255,255,0.4);
  padding-top: 1em;
  line-height: 1.5;
}

/* Transcript blocks
 * Style rule: only the .transcript section uses Times New Human (serif body
 * font, on a near-white panel for long-form readability). Everything else
 * on the page - headers, body, CTA, captions outside transcript - stays in
 * Cartridge / Cartridge Rough on the blue-boy theme. See cote-talks/CLAUDE.md.
 */
@font-face {
  font-family: 'Times New Human';
  src: url('fonts/TimesNewHuman-Reg.otf') format('opentype');
  font-weight: normal; font-style: normal;
}
@font-face {
  font-family: 'Times New Human';
  src: url('fonts/TimesNewHuman-Bol.otf') format('opentype');
  font-weight: bold; font-style: normal;
}
@font-face {
  font-family: 'Times New Human';
  src: url('fonts/TimesNewHuman-RegIta.otf') format('opentype');
  font-weight: normal; font-style: italic;
}
@font-face {
  font-family: 'Times New Human';
  src: url('fonts/TimesNewHuman-BolIta.otf') format('opentype');
  font-weight: bold; font-style: italic;
}
.transcript {
  background-color: #F0F2F5;
  color: #1a1a1a;
  font-family: 'Times New Human', 'Times New Roman', Times, serif;
  padding: 1.5em 2em;
  border-radius: 0.25em;
  line-height: 1.55;
  font-size: 1.05em;
}
.transcript h3 {
  font-family: 'Times New Human', 'Times New Roman', Times, serif;
  color: #1a1a1a;
  margin-top: 1.6em;
  font-size: 1.35em;
}
.transcript h3:first-of-type { margin-top: 0.5em; }
.transcript p:first-of-type { margin-top: 0; }
.transcript a { color: #0033aa; text-decoration: underline; }
.transcript a:visited { color: #551a8b; }
.transcript figure { margin: 1.5em 0; padding: 0; }
.transcript figure img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #d0d4da;
  border-radius: 0.15em;
}
.transcript figcaption {
  font-size: 0.85em;
  font-style: italic;
  color: #555;
  margin-top: 0.4em;
  text-align: center;
}

/* CTA block - white panel, blue-boy theme inherits Cartridge body font.
 * Use this at the bottom of talk pages for marketing call-to-action.
 */
.cta {
  margin: 2em 0 1em;
  padding: 1.25em 1.5em;
  background-color: #fff;
  color: #1a1a1a;
  border-radius: 0.15em;
}
.cta p { margin: 0; font-size: 1.05em; line-height: 1.5; color: #1a1a1a; }
.cta a {
  color: #0033aa;
  font-weight: bold;
  text-decoration: underline;
}
.cta a:visited { color: #551a8b; }