/* ===========================================================================
   Buying help — deploy 008.
   Loaded by the module, so pages without it do not pay for it.
   =========================================================================== */

.editorial{display:grid; gap:var(--s-7)}
@media(min-width:900px){
  .editorial{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:var(--s-8)}
}
/* The concept carried this as an inline style on the first paragraph. */
.editorial h2 + .prose{margin-top:var(--s-5)}

.guides{display:flex; flex-direction:column; border-top:1px solid var(--ink-700)}
.guide{display:flex; align-items:baseline; justify-content:space-between; gap:var(--s-4);
  padding:var(--s-4) 0; border-bottom:1px solid var(--ink-700); color:var(--text-primary)}
/* Own the colour on hover as well as at rest: Bootstrap's a:hover is (0,1,1)
   and would otherwise win. See deploy/_tools/check-link-hover.py. */
.guide:hover{text-decoration:none; color:var(--spark-cyan)}
.guide__t{font-weight:700; font-size:1.0625rem; line-height:1.35}
.guide__m{font-size:.8125rem; color:var(--text-tertiary); white-space:nowrap; flex:none}
