function Testimonials(){
const quotes=[["Very well organized and structured course focused on students' pitfalls","Dr Brevis, Delhi"],["Individualized course and very useful for beginners","Dr. Mousami, Kolkata"],["Comprehensive effective mentors and user friendly ambience.","Dr. Rajesh, Hyderabad"],["Very systematic training witnessed. I would strongly recommend","Dr. Ravish, Bangalore"]];
const [i,setI]=React.useState(0);
const UserIcon=()=>(<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="var(--pp-blue-600)" strokeWidth="2"><circle cx="12" cy="8" r="4"/><path d="M4 20c0-4 3.6-7 8-7s8 3 8 7"/></svg>);
return(<section style={{padding:'64px 0',backgroundColor:'#fff',overflow:'hidden'}}>
<div className="pp-testimonial-row pp-container" style={{display:'flex',gap:48,alignItems:'flex-end',maxWidth:1200,margin:'0 auto'}}>
<div style={{flex:1,paddingBottom:40,minWidth:0}}>
<h2 style={{fontFamily:'var(--font-display)',fontSize:'clamp(18px,2.6vw,var(--text-h2))',fontWeight:700,color:'var(--color-text-heading)',margin:'0 0 8px',lineHeight:'var(--lh-tight)',textAlign:'left'}}>Words from Our PACES<br/>Champions</h2>
<div style={{fontFamily:'Arial,sans-serif',fontWeight:800,fontSize:110,color:'#4a4d52',lineHeight:1,height:100,margin:'0 0 12px'}}>{'\u201c'}</div>
<div style={{position:'relative',maxWidth:340,margin:'0 auto',width:1800,paddingLeft:40,paddingRight:40}}>
<button aria-label="Previous" onClick={()=>setI(v=>(v-1+quotes.length)%quotes.length)} style={{position:'absolute',left:-16,top:'30%',transform:'translateY(-50%)',width:36,height:36,borderRadius:'50%',border:'1px solid var(--color-border)',background:'#fff',cursor:'pointer',display:'flex',alignItems:'center',justifyContent:'center',zIndex:2,boxShadow:'0 4px 12px rgba(15,40,60,.12)'}}><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--color-text-heading)" strokeWidth="2"><path d="M15 18l-6-6 6-6"/></svg></button>
<button aria-label="Next" onClick={()=>setI(v=>(v+1)%quotes.length)} style={{position:'absolute',right:-16,top:'30%',transform:'translateY(-50%)',width:36,height:36,borderRadius:'50%',border:'1px solid var(--color-border)',background:'#fff',cursor:'pointer',display:'flex',alignItems:'center',justifyContent:'center',zIndex:2,boxShadow:'0 4px 12px rgba(15,40,60,.12)'}}><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--color-text-heading)" strokeWidth="2"><path d="M9 18l6-6-6-6"/></svg></button>
<p style={{fontFamily:'var(--font-body)',fontWeight:300,fontSize:'var(--text-lg)',color:'var(--color-text-heading)',margin:'0 0 24px',maxWidth:380,lineHeight:'var(--lh-normal)',textAlign:'center',transition:'opacity .4s'}} key={i}>{quotes[i][0]}</p>
<div style={{display:'flex',alignItems:'center',justifyContent:'center',gap:10,marginBottom:20}}><UserIcon/><span style={{fontFamily:'var(--font-body)',fontSize:'var(--text-sm)',fontWeight:600,color:'var(--color-text-heading)'}}>{quotes[i][1]}</span></div>
<div style={{display:'flex',justifyContent:'center',gap:6}}>{quotes.map((_,j)=>(<button key={j} onClick={()=>setI(j)} style={{width:8,height:8,borderRadius:'50%',border:'none',background:j===i?'var(--color-accent)':'var(--color-border)',cursor:'pointer',padding:0}}></button>))}</div>
</div>
</div>
<div style={{width:380,maxWidth:'40%',flexShrink:1,alignSelf:'flex-end'}}><img src="assets/testimonial-doctor.png" style={{width:'100%',height:'auto',display:'block'}} alt="Doctor pointing"/></div>
</div>
</section>);
}
window.Testimonials=Testimonials;
