/* =====================================================================
   jobtalk.css — deck-specific layout classes for jobtalk.Rmd
   Loaded after aml-fonts.css and aml-theme-dark.css. Typography and the
   palette come from the theme; only layout and a few accents live here.
   Palette (dark theme): bg #1e1e1e, text #e8e8e8, accent #6ca3d9,
   highlight #ff8c73, muted #a8c5d8, rule #555.
   ===================================================================== */

/* ---------- section dividers ---------- */
.jt-divider h1 {
  font-size: 58px;
  margin-top: 0;
}
.jt-divider .jt-divider-note {
  margin-top: 26px;
  font-size: 27px;
  color: #a8c5d8;
}
.jt-divider .jt-divider-q {
  margin-top: 34px;
  font-size: 30px;
  font-style: italic;
  color: #e8e8e8;
}

/* ---------- kicker / source / takeaway ---------- */
.jt-kicker {
  margin: 10px 0 22px;
  font-size: 27px;
  line-height: 1.3;
  color: #e8e8e8;
}
.jt-kicker.tight { margin: 4px 0 12px; }
.jt-source {
  position: absolute;
  bottom: 30px;
  left: 40px;
  right: 80px;
  font-size: 17px;
  line-height: 1.25;
  color: #a8c5d8;
}
.jt-source a { color: #a8c5d8; }
.jt-takeaway {
  margin-top: 26px;
  padding: 14px 22px;
  border-left: 4px solid #ff8c73;
  font-size: 28px;
  line-height: 1.3;
}
.jt-takeaway.small { font-size: 24px; margin-top: 16px; }
.jt-note {
  font-size: 20px;
  line-height: 1.3;
  color: #a8c5d8;
}

/* ---------- visual-abstract slides ---------- */
.va-slide h1 {
  font-size: 34px;
  margin-bottom: 8px;
}
.va-layout {
  display: grid;
  grid-template-columns: 72% 26%;
  column-gap: 2%;
  align-items: start;
}
.va-layout img.va-img {
  width: 100%;
  margin: 0;
  border-radius: 6px;
  box-shadow: 0 2px 14px rgba(0,0,0,0.55);
}
img.va-only {
  width: 90%;
  margin: 0;
  border-radius: 6px;
  box-shadow: 0 2px 14px rgba(0,0,0,0.55);
}
.va-frame dt {
  font-size: 19px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #6ca3d9;
  margin-top: 14px;
}
.va-frame dt:first-child { margin-top: 2px; }
.va-frame dd {
  margin: 4px 0 0;
  font-size: 21px;
  line-height: 1.32;
}
.va-frame dd.va-lesson {
  color: #ff8c73;
}
.va-thumbs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 30px;
  margin-top: 10px;
}
.va-thumbs img {
  width: 100%;
  margin: 0 0 8px;
  border-radius: 6px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.55);
}
.va-thumbs p {
  font-size: 21px;
  line-height: 1.3;
  margin: 0;
}

/* ---------- program / theme cards ---------- */
.jt-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
  margin-top: 22px;
}
.jt-cards.two { grid-template-columns: repeat(2, 1fr); }
.jt-cards.four { grid-template-columns: repeat(4, 1fr); gap: 18px; }
.jt-card {
  border-top: 2px solid #6ca3d9;
  padding-top: 14px;
  font-size: 23px;
  line-height: 1.3;
}
.jt-card .jt-card-title {
  display: block;
  font-size: 26px;
  color: #6ca3d9;
  margin-bottom: 8px;
}
.jt-card .jt-card-sub {
  display: block;
  font-size: 20px;
  color: #a8c5d8;
  margin-top: 8px;
}
.jt-card.accent { border-top-color: #ff8c73; }
.jt-card.accent .jt-card-title { color: #ff8c73; }
.jt-cards.two.large { gap: 40px; margin-top: 30px; }
.jt-cards.two.large .jt-card { font-size: 27px; line-height: 1.35; padding-top: 16px; }
.jt-cards.two.large .jt-card .jt-card-title { font-size: 31px; margin-bottom: 10px; }

/* ---------- key/value rows (definition lists) ---------- */
.jt-kv dt {
  font-size: 22px;
  color: #6ca3d9;
  margin-top: 16px;
}
.jt-kv dt:first-child { margin-top: 0; }
.jt-kv dd {
  margin: 4px 0 0;
  font-size: 24px;
  line-height: 1.3;
}
.jt-kv.compact dt { font-size: 20px; margin-top: 10px; }
.jt-kv.compact dd { font-size: 21px; }

/* ---------- stat tiles ---------- */
.jt-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px 26px;
  margin-top: 18px;
}
.jt-stats.three { grid-template-columns: repeat(3, 1fr); }
.jt-stat {
  border-top: 1px solid #555;
  padding-top: 12px;
}
.jt-stat .jt-num {
  display: block;
  font-size: 46px;
  line-height: 1.05;
  color: #e8e8e8;
  font-variant-numeric: tabular-nums;
}
.jt-stat .jt-num.accent { color: #ff8c73; }
.jt-stat .jt-label {
  display: block;
  font-size: 19px;
  line-height: 1.3;
  color: #a8c5d8;
  margin-top: 6px;
}

/* ---------- result callouts beside a figure ---------- */
.jt-callouts { margin-top: 6px; }
.jt-callout {
  margin: 0 0 22px;
  padding-left: 18px;
  border-left: 4px solid #6ca3d9;
}
.jt-callout.accent { border-left-color: #ff8c73; }
.jt-callout .jt-big {
  display: block;
  font-size: 44px;
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
}
.jt-callout.accent .jt-big { color: #ff8c73; }
.jt-callout .jt-small {
  display: block;
  font-size: 20px;
  line-height: 1.3;
  color: #a8c5d8;
  margin-top: 4px;
}

/* ---------- figures on a dark background ---------- */
img.jt-card-img {
  background: #fff;
  padding: 8px;
  border-radius: 6px;
  margin: 0;
}
.jt-fig-caption {
  font-size: 18px;
  line-height: 1.3;
  color: #a8c5d8;
  margin-top: 6px;
}
.jt-fig-center { text-align: center; }
.jt-fig-center img { margin: 0 auto; }

/* ---------- pipeline / flow diagrams (inline SVG) ---------- */
.jt-flow {
  display: block;
  width: 100%;
  margin: 10px 0 6px;
}
.jt-flow .jt-node {
  fill: #2a2a2a;
  stroke: #6ca3d9;
  stroke-width: 2;
}
.jt-flow .jt-node.accent { stroke: #ff8c73; }
.jt-flow .jt-node.dim { stroke: #555; }
.jt-flow .jt-node.excl { fill: #262626; stroke: #8a9a9a; stroke-dasharray: 6 5; }
.jt-flow text {
  fill: #e8e8e8;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 22px;
  text-anchor: middle;
}
.jt-flow text.small { font-size: 18px; fill: #a8c5d8; }
.jt-flow text.tiny { font-size: 16px; fill: #a8c5d8; }
.jt-flow text.accent { fill: #ff8c73; }
.jt-flow text.head { fill: #6ca3d9; font-size: 20px; }
.jt-flow text.num { font-size: 26px; fill: #e8e8e8; }
.jt-flow text.left { text-anchor: start; }
.jt-flow .jt-arrow {
  stroke: #6ca3d9;
  stroke-width: 2.5;
  fill: none;
}
.jt-flow .jt-arrow.dim { stroke: #8a9a9a; stroke-dasharray: 6 5; }
.jt-flow .jt-arrowhead { fill: #6ca3d9; }
.jt-flow .jt-arrowhead.dim { fill: #8a9a9a; }
.jt-flow .jt-line { stroke: #a8c5d8; stroke-width: 2; }
.jt-flow .jt-tick { stroke: #a8c5d8; stroke-width: 2; }
.jt-flow .jt-band { fill: #6ca3d9; opacity: 0.22; }
.jt-flow .jt-band.accent { fill: #ff8c73; opacity: 0.25; }
.jt-flow .jt-band.dim { fill: #8a9a9a; opacity: 0.18; }
.jt-flow .jt-dot { fill: #ff8c73; }

/* ---------- assumptions list ---------- */
.jt-assume {
  display: grid;
  grid-template-columns: 34% 62%;
  column-gap: 4%;
  row-gap: 16px;
  margin-top: 18px;
  font-size: 23px;
  line-height: 1.3;
}
.jt-assume .jt-a-name { color: #6ca3d9; font-size: 26px; }
.jt-assume .jt-a-name.struck {
  text-decoration: line-through;
  color: #8a9a9a;
}
.jt-assume .jt-a-what.struck { color: #8a9a9a; }

/* ---------- timing badge in speaker notes is plain text; nothing here ---------- */

/* ---------- misc ---------- */
.jt-muted { color: #a8c5d8; }
.jt-accent { color: #ff8c73; }
.jt-blue { color: #6ca3d9; }
.jt-small { font-size: 20px; line-height: 1.3; }
.jt-tight ul, .jt-tight ol { margin-top: 4px; }
.jt-tight li { margin-bottom: 6px; }
.jt-mt10 { margin-top: 10px; }
.jt-mt20 { margin-top: 20px; }
.jt-mt30 { margin-top: 30px; }
.jt-eq-note {
  font-size: 21px;
  color: #a8c5d8;
  line-height: 1.35;
  margin-top: 10px;
}
table.jt-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 22px;
}
table.jt-table th {
  text-align: left;
  font-weight: 400;
  color: #6ca3d9;
  padding: 8px 12px;
  border-bottom: 1px solid #555;
}
table.jt-table td {
  padding: 8px 12px;
  border-bottom: 1px solid #333;
  vertical-align: top;
}
table.jt-table td.num, table.jt-table th.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
table.jt-table tr:nth-child(even) { background: transparent; }
thead.jt-table, table.jt-table tfoot { background: transparent; }

/* ---------- additional SVG text sizes (added after first QA pass) ---------- */
.jt-flow text.mid { font-size: 19px; }
.jt-flow text.xs { font-size: 17px; fill: #a8c5d8; }
.jt-flow text.mid.accent { fill: #ff8c73; }

/* ---------- project question slides ---------- */
.jt-bigq {
  font-size: 34px;
  line-height: 1.35;
  margin: 14px 0 26px;
  color: #e8e8e8;
}
.jt-bigq em { color: #ff8c73; font-style: normal; }
