/* ComunAI family layer, v1 (2026-10-04). Source: comun-kit/web/family/.
   Copy this file into a product's web dir as comun-family.css and link it AFTER the site's own stylesheet.
   It is self-contained (cx- prefix), inherits the site's font and text colour, and works on light and dark footers.
   Products keep their own palette, type and icon; only these pieces are shared. */

.cx-endorse, .cx-evidence, .cx-short {
  --cx-sky: #CBE7F2; --cx-butter: #F8DC7A; --cx-mint: #D3EFDD; --cx-ink: #11302D;
  --cx-line: color-mix(in srgb, currentColor 18%, transparent);
  --cx-soft: color-mix(in srgb, currentColor 72%, transparent);
}

/* 1. Endorsement strip: goes in every page footer */
.cx-endorse { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding-top: 18px; margin-top: 18px; border-top: 1px solid var(--cx-line); font-size: 14px; line-height: 1.45; text-align: left; }
.cx-endorse.cx-center { justify-content: center; text-align: center; }
.cx-endorse .cx-by, .cx-pillar { text-decoration: none !important; }
.cx-endorse .cx-by { display: inline-flex; align-items: center; gap: 9px; font-weight: 600; color: inherit; text-decoration: none; }
.cx-endorse .cx-by:hover span { text-decoration: underline; text-underline-offset: 3px; }
.cx-endorse .cx-by svg { width: 22px; height: 22px; flex: none; isolation: isolate; }
.cx-endorse .cx-by b { font-weight: 750; }
.cx-pillar { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; line-height: 1.2; text-decoration: none; color: var(--cx-ink) !important; background: var(--cx-pc, var(--cx-sky)); }
.cx-pillar::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--cx-ink); opacity: .55; }
.cx-pillar[data-pillar="self"] { --cx-pc: var(--cx-sky); }
.cx-pillar[data-pillar="work"] { --cx-pc: var(--cx-butter); }
.cx-pillar[data-pillar="community"] { --cx-pc: var(--cx-mint); }
.cx-endorse .cx-co { flex-basis: 100%; margin: 0; color: var(--cx-soft); font-size: 13px; }
.cx-endorse .cx-co a { color: inherit; }

/* 2. Evidence block: "Built on", one per product home page, inside or after its science section */
.cx-evidence { margin-block: 28px 0; text-align: left; }
.cx-evidence .cx-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 18px; margin-bottom: 12px; }
.cx-evidence .cx-head h3 { margin: 0; font-size: 1.15em; }
.cx-evidence .cx-head a { font-size: 13.5px; color: inherit; opacity: .8; }
.cx-evidence ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--cx-line); }
.cx-evidence li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; padding-block: 14px; border-bottom: 1px solid var(--cx-line); }
.cx-evidence .cx-claim { font-weight: 600; margin: 0; }
.cx-evidence .cx-src { grid-column: 1; margin: 0; font-size: 13.5px; color: var(--cx-soft); }
.cx-grade { grid-row: 1 / span 2; grid-column: 2; align-self: start; padding: 4px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; line-height: 1.2; white-space: nowrap; color: var(--cx-ink); }
.cx-grade[data-grade="strong"] { background: #BFE6CF; }
.cx-grade[data-grade="moderate"] { background: #CBE7F2; }
.cx-grade[data-grade="early"] { background: #F8E7A8; }
.cx-grade[data-grade="contested"] { background: #F6D3CC; }
@media (max-width: 520px) { .cx-evidence li { grid-template-columns: 1fr; } .cx-grade { grid-row: auto; grid-column: 1; justify-self: start; margin-top: 4px; } }

/* 3. Privacy summary: top of every privacy policy */
.cx-short { margin: 0 0 28px; padding: 18px 22px; border: 1px solid var(--cx-line); border-radius: 14px; text-align: left; }
.cx-short h2 { margin: 0 0 8px; font-size: 1.1em; }
.cx-short ul { margin: 0; padding-left: 20px; display: grid; gap: 4px; }