/* Icons on the public pages (owner, 2026-10-21). includes/public_icons.php
   writes them; this sets how they sit in each kind of list. Colour comes
   from the list, so the brand settings reach them too. */
.fa-ic { flex: none; fill: currentColor; stroke: none; }
.fa-ic path { fill: currentColor; stroke: none; }

/* Bullet lists: the icon in a small tinted tile. */
.bullets li { grid-template-columns: 30px minmax(0, 1fr); align-items: start; }
.bullets .fa-ic { width: 14px; height: 14px; margin-top: 0; padding: 8px; box-sizing: content-box; border-radius: 9px;
  color: var(--rn-accent-deep, #39bba6); background: color-mix(in srgb, var(--rn-accent, #5fe0cc) 13%, transparent);
  border: 1px solid color-mix(in srgb, var(--rn-accent, #5fe0cc) 24%, transparent); }
.sec.cr .bullets .fa-ic, .hero .bullets .fa-ic, .fcta .bullets .fa-ic { color: var(--rn-accent, #5fe0cc); }

/* The short lines under a hero's buttons. */
.ticks .fa-ic { width: 15px; height: 15px; color: var(--cyan, var(--rn-accent, #5fe0cc)); }

/* Any other list a tick used to lead. */
li > .fa-ic:first-child { width: 15px; height: 15px; color: var(--rn-accent-deep, #39bba6); }
.ticks li > .fa-ic:first-child { color: var(--cyan, var(--rn-accent, #5fe0cc)); }
.bullets li > .fa-ic:first-child { width: 14px; height: 14px; }

/* An icon at the start of a card heading. */
.ci { display: inline-grid; place-items: center; width: 30px; height: 30px; margin-right: 10px; vertical-align: -8px; flex: none; border-radius: 9px;
  color: var(--rn-accent-deep, #39bba6); background: color-mix(in srgb, var(--rn-accent, #5fe0cc) 13%, transparent);
  border: 1px solid color-mix(in srgb, var(--rn-accent, #5fe0cc) 24%, transparent); }
.ci .ci-ic { width: 14px; height: 14px; fill: currentColor; }
.cr .ci, .hero .ci, .dim .ci, .glass .ci { color: var(--rn-accent, #5fe0cc); }
.dim-top b { display: inline-flex; align-items: center; }
h3:has(> .ci), h4:has(> .ci), b:has(> .ci) { display: flex; align-items: center; gap: 10px; }
h3:has(> .ci) > .ci, h4:has(> .ci) > .ci, b:has(> .ci) > .ci { margin-right: 0; }
