// SLIDE 11 — ACTION ITEMS & NEXT STEPS (on black, white pill rows)
function ActionItemsSlide() {
  const items = [
    "Change our overall paid strategy to focus on Traffic now that the site is launched",
    "Make sure all events are tracking correctly",
    "Update all case studies to our site",
  ];
  return (
    <Slide eyebrow="Q1 2026" logo="white" style={{label:"11 Action Items"}}>
      <TitleBlock row1="Action Items &" row2="Next Steps" topPad={80} width={1100} row1Weight={800}/>

      {/* White pill rows */}
      <div style={{position:'absolute', top: 380, left: 120, right: 120, display:'flex', flexDirection:'column', gap: 22}}>
        {items.map((t, i) => (
          <div key={i} style={{background:'#fff', color:R.ink, borderRadius:999, padding:'22px 30px', display:'flex', alignItems:'center', gap:22, boxShadow:'0 4px 24px rgba(0,0,0,.25)'}}>
            <CheckDot size={28}/>
            <div style={{fontSize:17, fontWeight:700}}>{t}</div>
          </div>
        ))}
      </div>
    </Slide>
  );
}

window.ActionItemsSlide = ActionItemsSlide;
