/* ═══════════════════════════════════════════════════════════════════════
   LOMAinsights homepage tokens (homepage-scoped, --hm-* namespace)

   Palette derived from the ribbon mark at /brand/lomainsights-mark.svg:
   stem lavender #c3b2e0 → slate #a1b4d0 → teal #77b3bd / #51a5aa / #398f9b,
   loop #88b2ba → #549eae → #357d9e → #244b83, tail indigo #343b7d → #4792ba.
   Deep-ink surfaces are darkened from the indigo end; light surfaces are
   warm whites tinted toward the lavender end.
   ═══════════════════════════════════════════════════════════════════════ */
.ln-page,
.home,
.ribbon-public {
    /* Ink (deep) surfaces */
    --hm-ink: #0d1430;
    --hm-ink-2: #131c40;
    --hm-ink-3: #1c2750;
    --hm-on-ink: #f4f6fb;
    --hm-on-ink-muted: #b8c4e0;

    /* Light (airy) surfaces */
    --hm-paper: #fbfaf8;
    --hm-paper-2: #f2f1ee;
    --hm-on-paper: #17203f;
    --hm-on-paper-muted: #4e5a7c;

    /* Ribbon hues */
    --hm-lavender: #c3b2e0;
    --hm-slate: #a1b4d0;
    --hm-teal: #51a5aa;
    --hm-teal-deep: #357d9e;
    --hm-indigo: #343b7d;
    --hm-blue: #4792ba;

    --hm-line-ink: rgba(196, 210, 240, 0.18);
    --hm-line-paper: rgba(23, 32, 63, 0.12);

    /* Spacing — 4px base */
    --hm-1: 4px;
    --hm-2: 8px;
    --hm-3: 12px;
    --hm-4: 16px;
    --hm-5: 24px;
    --hm-6: 32px;
    --hm-7: 48px;
    --hm-8: 72px;
    --hm-9: 112px;

    /* Type — editorial scale */
    --hm-display: clamp(2.75rem, 7vw, 5.75rem);
    --hm-h2: clamp(1.9rem, 3.8vw, 3.25rem);
    --hm-h3: clamp(1.125rem, 1.6vw, 1.375rem);
    --hm-lead: clamp(1.0625rem, 1.4vw, 1.3125rem);
    --hm-body: 1rem;
    --hm-small: 0.875rem;
    --hm-micro: 0.75rem;

    --hm-radius-sm: 8px;
    --hm-radius: 16px;
    --hm-radius-lg: 28px;
    --hm-radius-pill: 999px;

    --hm-ease: cubic-bezier(0.2, 0, 0, 1);
    --hm-ease-emphasized: cubic-bezier(0.05, 0.7, 0.1, 1);
    --hm-dur-hover: 0.16s;
    --hm-dur-ui: 0.24s;
    --hm-dur-reveal: 0.6s;

    --hm-shadow: 0 1px 2px rgba(16, 24, 48, 0.06), 0 12px 32px rgba(16, 24, 48, 0.08);
    --hm-shadow-lift: 0 2px 4px rgba(16, 24, 48, 0.08), 0 20px 48px rgba(16, 24, 48, 0.14);
    --hm-max: 1240px;
    --hm-anchor-offset: 92px;
}