:root {
  /* fallbacks for pages that don't load custom.css */
  --icon-accent: var(--primary-green, #4a7c59);
}

/* ========================================
   ICONS — Flaticon UIcons primary, Lucide fallback
   ======================================== */
.fi {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  vertical-align: middle;
  font-style: normal;
}
.fi::before { line-height: 1; }
/* Lucide swaps the <i> for an <svg> that keeps the same classes */
svg.fi,
svg.lucide {
  width: 1em;
  height: 1em;
  stroke-width: 1.8;
  vertical-align: middle;
}.hero-btn .fi { font-size: 18px; }

.hero-tagline .fi { font-size: 15px; }
.hero-feature-icon .fi { font-size: 22px; }
.header-cta-btn .fi { font-size: 18px; }
.ina-topbar .fi { font-size: 14px; margin-right: 7px; }

h4 > .fi,
h3 > .fi,
h2 > .fi,
li > .fi,
strong > .fi { margin-right: 8px; color: var(--primary-green, #4a7c59); }
.ina_button .fi { margin-right: 8px; }
.ina_button_text .fi { font-size: 0.95em; margin-left: 6px; }
.flow-arrow .fi { font-size: 1.4rem; }
.desi-cow-icon .fi,
.visit-activity-icon .fi,
.volunteer-activity-icon .fi,
.seva-number .fi { color: var(--primary-green, #4a7c59); }
.impact-icon .fi,
.bg-green .fi,
.final-cta-section .fi,
.buying-impact-section .fi { color: #fff; }

/* check-marks read as confirmations wherever they appear */
.fi-rr-check { color: #4a7c59; margin-right: 8px; }

/* Lucide fallback draws strokes, which can't take a clipped gradient */
svg.fi.lucide {
  -webkit-text-fill-color: currentColor;
  background: none;
}

/* Banner (hero) feature icons: white glyph on the gradient circle */
.hero-feature-icon .fi::before {
  background: none;
  -webkit-text-fill-color: #fff;
  color: #fff;
}
.icons-lucide .hero-feature-icon .fi { color: #fff; }

/* Non-circle banner icons keep the dark green gradient glyph */
.hero-tagline .fi::before,
.hero-btn-outline .fi::before {
  background: linear-gradient(135deg, #4a8a3a 0%, #2b6127 45%, #16401a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.icons-lucide .hero-tagline .fi,
.icons-lucide .hero-btn-outline .fi { color: #2b6127; }

/* ========================================
   ICON SIZE PASS — everything a step smaller
   ======================================== */
.ina-topbar .fi { font-size: 12px; }
.header-cta-btn .fi { font-size: 15px; }
.header-phone-icon .fi { font-size: 14px; }

.hero-btn .fi { font-size: 15px; }
.hero-feature-icon .fi { font-size: 17px; }
.hero-tagline .fi { font-size: 13px; }

.seva-value-icon .fi { font-size: 21px; }
.who-point-icon .fi { font-size: 19px; }
.care-card-icon .fi { font-size: 17px; }
.belief-card-icon .fi { font-size: 30px; }
.flow-icon .fi { font-size: 30px; }
.flow-final-icon .fi { font-size: 20px; }
.flow-arrow .fi { font-size: 16px; }

.desi-cow-icon .fi,
.impact-icon .fi,
.visit-activity-icon .fi,
.volunteer-activity-icon .fi,
.seva-number .fi { font-size: 1.7rem; }

h2 > .fi,
h3 > .fi,
h4 > .fi,
li > .fi,
strong > .fi,
p > .fi { font-size: 0.88em; }
.ina_button .fi { font-size: 0.85em; }
.ina_button.header-cta-btn .fi { font-size: 15px; }
.hero-btn.ina_button .fi,
.hero-btn .fi { font-size: 15px; }
.ina_button_text .fi { font-size: 0.82em; }
.fi-rr-check { font-size: 0.88em; }

/* topbar sits on the orange bar — its icons read white */
.ina-topbar .fi { color: #fff; }