/* ============================================================================
   HINT IT — v2 design system : ARTICLE / LEGAL prose
   ----------------------------------------------------------------------------
   Reusable layout for long-form prose pages (giveaway rules, privacy, terms,
   business terms). Page-specific enough to live outside the core components, but
   shared across every legal/article page — so it's linked per-page (from the
   page's <HeadContent>), not from V2Shell. Scoped under `.hint-v2`, token-driven.
   ============================================================================ */

/* Brand-band base (bg/color/padding) + eyebrow color come from shared `.hero-brand`
   (components.css) — the hero <section> carries both classes. */
.hint-v2 .v2-article-hero h1 {
  color: var(--text-on-brand);
  margin-block: var(--space-3);
}
.hint-v2 .v2-article-hero p {
  color: var(--text-on-brand-muted);
  line-height: var(--leading-relaxed);
}
.hint-v2 .v2-article-hero .v2-article-updated {
  font-size: var(--text-label);
  margin-bottom: var(--space-3);
}

.hint-v2 .v2-article {
  padding-block: var(--space-9);
}
.hint-v2 .v2-article > section + section {
  margin-top: var(--space-7);
}
.hint-v2 .v2-article h2 {
  font-size: var(--text-heading);
  margin-bottom: var(--space-3);
}
.hint-v2 .v2-article p {
  margin-bottom: var(--space-3);
  line-height: var(--leading-relaxed);
  color: var(--text-primary);
}
.hint-v2 .v2-article ul,
.hint-v2 .v2-article ol {
  margin: var(--space-3) 0 var(--space-4);
  padding-left: var(--space-6);
}
.hint-v2 .v2-article ul { list-style: disc; }
.hint-v2 .v2-article ol { list-style: decimal; }
.hint-v2 .v2-article li {
  margin-bottom: var(--space-2);
  line-height: var(--leading-relaxed);
}
.hint-v2 .v2-article a {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}