const AM_CECI_PLATES=[
  {src:'assets/ceci/palestra-leis-universais.jpg',cap:'Palestra “Alinhamento com as Leis Universais”',pos:'center'},
  {src:'assets/ceci/londres-flilp.jpg',cap:'FLILP 2026 · Goldsmiths, University of London',pos:'center'},
  {src:'assets/ceci-com-o-livro.jpg',cap:'Lançamento · De mãos dadas com o Universo',pos:'center'},
  {src:'assets/ceci/palestra-publico.jpg',cap:'Sala cheia · palestra internacional',pos:'top center'},
  {src:'assets/ceci/palestra-posicionamento.jpg',cap:'“Posicionamento gera respeito” · Londres',pos:'center'}
];
function Ceci(){
  const AM=window[window.AM_NS];
  const {Eyebrow,RevealImage,Spotlight,GoldRule}=AM;
  const ref=React.useRef(null);
  const [p,setP]=React.useState(.5);
  React.useEffect(()=>AMMotion.scroll(()=>{
    if(!ref.current) return;
    const r=ref.current.getBoundingClientRect();
    setP(Math.round(Math.min(1,Math.max(0,1-(r.top+r.height*.35)/window.innerHeight))*70)/70);
  }),[]);
  const s=AMMotion.reduced?.5:p;
  return (
    <section className="am-ceci-section" id="ceci" ref={ref}>
      <div className="am-ceci-light" aria-hidden="true" style={{transform:'translate3d(0,'+((s-.5)*-120)+'px,0)'}}/>
      <div className="am-inner am-ceci">
        <div className="am-ceci-figure" data-am-reveal>
          <span className="am-ceci-halo" aria-hidden="true"/>
          <span className="am-ceci-frame" aria-hidden="true"/>
          <Spotlight radius={460} intensity={.2}>
            <RevealImage src="assets/ceci-corpo-inteiro-1-web.png" alt="Ceci Alves" ratio="3 / 4"
              mask="base-fade" mode="blur" objectPosition="top center"/>
          </Spotlight>
        </div>
        <div className="am-ceci-copy" data-am-reveal data-am-delay="160">
          <Eyebrow rule={false}>Ceci Alves</Eyebrow>
          <h2 className="am-ceci-title">Quem estuda estrutura<em> começa pela própria.</em></h2>
          <p className="am-ceci-text">De Londres, onde construiu uma empresa com mais de 150 clientes, ao palco de
            Dubai e Lisboa. Autora de três livros, mentora, palestrante. A autoridade dela não vem de discurso.
            Vem de ter atravessado o que ensina.</p>
          <GoldRule width="180px"/>
          <ul className="am-ceci-facts">
            <li><b>Londres</b><span>Empresária · 150+ clientes</span></li>
            <li><b>Dubai · Lisboa · Londres</b><span>Palestras internacionais</span></li>
            <li><b>Três livros</b><span>O terceiro chega em novembro</span></li>
            <li><b>Mentoria</b><span>Acompanhamento individual e em grupo</span></li>
          </ul>
        </div>
      </div>
      <div className="am-ceci-rail-wrap">
      <div className="am-ceci-rail">
        {[...AM_CECI_PLATES,...AM_CECI_PLATES].map((t,i)=>(
          <figure key={t.cap+i} className="am-ceci-plate">
            <div className="am-ceci-plate-img">
              {t.src
                ? <img src={t.src} alt={t.cap} style={{width:'100%',height:'100%',objectFit:'cover',objectPosition:t.pos,display:'block'}}/>
                : <image-slot id={t.slot} shape="rect" fit="cover" placeholder={t.ph}></image-slot>}
            </div>
            <figcaption>{t.cap}</figcaption>
          </figure>
        ))}
      </div>
      </div>
    </section>
  );
}
Object.assign(window,{Ceci,AM_CECI_PLATES});