/* ═══════════════════════════════════════════════════════════════════════
   Webgold — homepage IRIS HIGHLIGHT COLOUR: purple → Webgold orange #FC4521
   (own file so it stays when the icon continuation is switched off)
   Two layers paint the highlighted words in both iris sections:
   1. Elementor (widgets ce25bf0 in, 2f5a781 out; per-word repeater items)
      fills the word spans with an animated gradient clipped to the text:
      linear-gradient(342deg, #9168F0 20%, #FBFAFF 80%) or the reverse
      (#FFFFFF 20%, #9168F0 80%), animation gradientMove 5s, size 200%.
      This is what is visible.
   2. webgold-rail.css colours .customized--word with --wg-iris-accent
      (#A786F3). Hidden behind layer 1, but it is the fallback.
   Only the colour stops change; angle, positions, size and animation are
   Elementor's. #FBFAFF (purple-tinted white) becomes #FFF9F7 (the same
   white tinted orange). ID-scoped, so it beats Elementor's (0,4,1)
   selectors without !important and touches nothing outside these two
   sections. The text only paints inside the black circle (6.0:1).
   ═══════════════════════════════════════════════════════════════════════ */

#circleContainIn,
#circleContainOut{
  --wg-iris-accent: #FC4521;
}

/* purple → white items ("Caribbean", "thrive", "Together.”") */
#circleContainIn  .elementor-repeater-item-a4da228 span,
#circleContainIn  .elementor-repeater-item-a4da228:not(:has(span)),
#circleContainIn  .elementor-repeater-item-ed1ecad span,
#circleContainIn  .elementor-repeater-item-ed1ecad:not(:has(span)),
#circleContainOut .elementor-repeater-item-a4da228 span,
#circleContainOut .elementor-repeater-item-a4da228:not(:has(span)){
  background-image: linear-gradient(342deg, #FC4521 20%, #FFF9F7 80%);
}

/* white → purple items ("digital", "age", "“Let’s") */
#circleContainIn  .elementor-repeater-item-13fb8a6 span,
#circleContainIn  .elementor-repeater-item-13fb8a6:not(:has(span)),
#circleContainOut .elementor-repeater-item-13fb8a6 span,
#circleContainOut .elementor-repeater-item-13fb8a6:not(:has(span)){
  background-image: linear-gradient(342deg, #FFFFFF 20%, #FC4521 80%);
}
