/* toolbox-talk.css: the free toolbox talks at /toolbox-talks/<slug>/, 7 October 2026.

   Loads after content.css, downloads.css and rams-guide.css. The hero, the
   facts strip, the answer grid, the talk sheet frame (.rg-tbt), the related
   cards and the other-talks list are all rams-guide.css unchanged, because a
   talk page is a RAMS guide's talk block grown into a page of its own. What is
   here is only what a talk needs that a guide never drew: the "why it
   matters" opening, the named points, the do and do not columns, and the
   close. Same materials: hairlines, a 2px ink rule over each group, square
   corners, Oxford on labels only. Values that tie with rams-guide.css are
   restated, because this sheet loads last and would win any tie anyway. */

.page-tbt .rg-hero h1{max-width:18ch}

/* ── Why it matters: the opening read aloud, with its source ─────────────── */
.tt-why{margin-top:28px;padding-top:24px;border-top:1px solid var(--rule);max-width:72ch}
.tt-why h3,.tt-points h3,.tt-do h3,.tt-dont h3,.tt-close h3{margin:0;font-family:var(--f-ui);font-size:var(--fs-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute)}
.tt-why p{margin:12px 0 0;font-size:var(--fs-lg);line-height:1.6;color:var(--ink)}
.tt-why p + p{font-size:var(--fs-md);color:var(--ink-2)}
.tt-why cite{display:block;margin-top:10px;font-style:normal;font-size:var(--fs-xs);color:var(--ink-mute)}
.tt-why cite a{color:var(--ink-mute);border-bottom:1px solid var(--rule)}
.tt-why cite a:hover{color:var(--ink)}

/* ── The points: a named heading and what to say, with a tick box ────────── */
.tt-points{margin-top:28px;padding-top:24px;border-top:1px solid var(--rule)}
.tt-pts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 40px;margin-top:16px}
.tt-pt{position:relative;padding-left:34px}
.tt-pt::before{content:"";position:absolute;left:0;top:.25em;width:16px;height:16px;border:1.5px solid var(--ink)}
.tt-pt h4{margin:0;font-family:var(--f-ui);font-size:var(--fs-md);font-weight:600;line-height:1.35;color:var(--ink)}
.tt-pt p{margin:6px 0 0;font-size:var(--fs-sm);line-height:1.6;color:var(--ink-2)}

/* ── Do and do not: two columns, a rule over each ────────────────────────── */
.tt-dd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 40px;margin-top:28px;padding-top:24px;border-top:1px solid var(--rule)}
.tt-dd ul{list-style:none;margin:12px 0 0;padding:0}
.tt-dd li{position:relative;padding-left:22px;margin:0 0 10px;font-size:var(--fs-sm);line-height:1.55;color:var(--ink)}
.tt-dd li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--ink)}
.tt-dont li::before{background:none;border:1.5px solid var(--ink);width:7px;height:7px;top:.58em}

/* ── Questions and the close ─────────────────────────────────────────────── */
.tt-ask-row{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}
.tt-close p{margin:12px 0 0;font-size:var(--fs-md);line-height:1.6;color:var(--ink)}
.tt-record{padding:14px 18px;border:1px solid var(--rule);background:var(--paper);font-size:var(--fs-sm);color:var(--ink-2)}
.tt-record b{color:var(--ink)}

/* ── The guide behind the talk ───────────────────────────────────────────── */
.tt-deeper{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:32px}
.tt-deeper .rg-rel-card{margin:0}

/* The other-talks list runs in five themes, not two kinds. */
.tt-more-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.tt-more-grid .rg-more-list li{grid-template-columns:minmax(0,1fr)}

@media (max-width:1100px){
  .tt-more-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .tt-pts,.tt-dd,.tt-ask-row,.tt-deeper{grid-template-columns:minmax(0,1fr)}
  .tt-more-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .tt-pts{gap:16px}
}

@media print{
  .tt-pts,.tt-dd{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tt-record{border-color:#999}
}

/* ── The topics page: a theme block per heading, unwritten topics in grey ── */
.tt-theme{margin-top:36px}
.tt-theme h3{margin:0;padding-bottom:12px;border-bottom:2px solid var(--ink);font-family:var(--f-ui);font-size:var(--fs-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute)}
.tt-theme .rg-more-list li{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.tt-soon{font-family:var(--f-ui);font-size:var(--fs-md);font-weight:600;line-height:1.35;color:var(--ink-mute)}
@media (max-width:900px){.tt-theme .rg-more-list li{grid-template-columns:minmax(0,1fr)}}