/*
 * "Stablecoins in the UK" under the homepage guides (Pen k5Ecoq, mobile fzIhT).
 * The body reuses the article template's blocks and type (d2.css, m-article.css);
 * this file only places it in the homepage's main column.
 */
.d2-hx { display: flex; flex-direction: column; gap: 32px; padding: 40px 0 8px; box-shadow: inset 0 1px 0 var(--line); }
.d2-hx__head { display: flex; flex-direction: column; gap: 8px; }
.d2-hx__title { font-family: var(--font-heading); font-size: 34px; line-height: 34px; font-weight: 400; color: var(--ink); font-variation-settings: "opsz" 18; }
.d2-hx__dek { max-width: 820px; font-size: 15px; line-height: 23px; color: var(--ink-secondary); }
.d2-hx__meta { font-size: 13px; line-height: 17px; color: var(--ink-muted); }
.d2-hx__row { display: flex; align-items: flex-start; gap: 44px; }
.d2 .d2-hx__toc { width: 200px; }
.d2 .d2-hx__content { flex: 1; width: auto; min-width: 0; }

/* A paragraph that is only a "Full guide →" link. */
.d2-acontent > p.d2-more { font-size: 14px; line-height: 18px; }
.d2-acontent > p.d2-more a { color: var(--accent); text-decoration: none; }
.d2-acontent > p.d2-more a:hover { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 760px) {
  .d2-hx { order: 9; gap: 22px; padding: 28px 16px; box-shadow: none; }
  .d2-hx .d2-eyebrow { font-size: 10px; line-height: 13px; letter-spacing: 1.4px; }
  .d2-hx__title { font-size: 28px; line-height: 28px; }
  .d2-hx__meta { font-size: 12px; line-height: 16px; }
  .d2-hx__row { display: block; }
  .d2 .d2-hx__toc { display: none; }
  .d2 .d2-hx__content { gap: 22px; }
}