/* ==========================================================================
   COMPONENT: feature-list
   --------------------------------------------------------------------------
   Vertical list of bullets, each prefixed with a check icon. The most
   commonly reused list pattern on the site — used in hero subheadlines,
   home sections (HomeInbound, HomeMcp, HomeListEnrichment), and feature
   pages.

   Markup contract:
     <ul class="e-feature-list">
         <li class="e-feature-list__item">
             <svg class="e-feature-list__icon">...</svg>
             <span>Item content (HTML allowed)</span>
         </li>
     </ul>

   Variants:
     .e-feature-list--accent   icons render in accent orange instead of blue
     .e-feature-list--compact  tighter gap between items
   ========================================================================== */

/* Mirror of legacy `.subheadline` + `ul.subheadline` (components.css 331-368)
   plus `.check-icon` (style.css 1-9). The hero subheadline + every section's
   "highlights" list resolves to these styles. font-size 14px, line-height
   1.6, gap 10px between items, items center-aligned, icon 20x20. */

.e-feature-list {
    list-style: none;
    padding-left: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--e-color-ink);
    font-weight: var(--e-font-weight-medium);
}

.e-feature-list__item {
    display: flex;
    gap: 10px;
    align-items: center;
    color: var(--e-color-ink);
    font-weight: var(--e-font-weight-medium);
    transition: color 0.4s ease;
}

.e-feature-list__icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}


/* CHECK-ICON FILL TRANSITIONS — mirror of style.css 6-9 + 20-22. */

.e-feature-list__icon circle {
    fill: var(--e-color-primary);
    transition: fill 0.4s ease;
}


/* INLINE EMPHASIS WITHIN ITEMS — mirror of legacy `.subheadline .highlight-2`.
   Default color is primary blue (matches legacy interaction default). */

.e-feature-list__item .e-feature-list__highlight {
    font-weight: 700;
    color: var(--e-color-primary);
    transition: color 0.4s ease;
}


/* ACCENT ITEM (per-item override — legacy `ul.subheadline li.accent ...`). */

.e-feature-list__item.accent .e-feature-list__icon circle { fill: var(--e-color-accent); }
.e-feature-list__item.accent .e-feature-list__highlight   { color: var(--e-color-accent); }


/* DARK SURFACE INHERITANCE — kept for sections that flip to dark backgrounds
   (HomeMcp). Legacy uses inline color overrides on those sections. */

.e-section--dark .e-feature-list__item { color: rgba(255, 255, 255, 0.7); }
.e-section--dark .e-feature-list__icon circle { fill: var(--e-color-secondary); }


/* ACCENT VARIANT — orange icons. */

.e-feature-list--accent .e-feature-list__icon circle { fill: var(--e-color-accent); }


/* COMPACT VARIANT — tighter gap. */

.e-feature-list--compact { gap: 6px; }