// Testimonials carousel + FAQ accordion
const TESTIMONIALS = [
  "Veidas kaip po plastinės operacijos, atrodo net raumenys atsirado. Jūs nereali! Žiūriu ir neatsigrožiu.",
  "Po masažo sprandas visiškai atsipalaidavęs! Net galva tapo lengvesnė, kūne — daugiau energijos ir lengvumo. Veidas atrodo daug gyvesnis.",
  "Noriu padėkoti už profesionalumą, meilę darbui ir kruopštumą! Šis masažas — geriausia, ką gali padovanoti sau ir artimai sielai.",
  "Man taip sunku rasti tą patį pas kitą meistrą. Dirbama visai kitokia technika, nei įprasta — absoliučiai išpildo tai, ko seniai ieškojau.",
  "Highly recommend! Very professional, gentle, and precise technique – I felt real results right after. The atmosphere is calm and cozy.",
  "Atsikėliau pailsėjusi ir atsipalaidavusi, kai anksčiau nuo pat ryto būdavo įtampa veide. Skruostai jaučiasi lyg pripildyti, toks liftingas matosi.",
  "Visada gera apsilankyti — naudinga išgirsti 'nuogą tiesą' apie savo veidą iš šios specialistės. Rekomenduoju kiekvienai."
];

const Testimonials = () => {
  const [i, setI] = useState(0);
  const perView = () => window.innerWidth < 780 ? 1 : 2;
  const [pv, setPv] = useState(perView());
  useEffect(() => {
    const r = () => setPv(perView());
    window.addEventListener('resize', r);
    return () => window.removeEventListener('resize', r);
  }, []);
  const max = Math.ceil(TESTIMONIALS.length / pv);
  const prev = () => setI((i - 1 + max) % max);
  const next = () => setI((i + 1) % max);

  return (
    <section className="section testimonials" id="results">
      <div className="container">
        <Reveal>
          <div className="section-intro">
            <div>
              <div className="eyebrow label" style={{display:'flex', alignItems:'center', gap:14}}>
                <span style={{width:28, height:1, background:'var(--sage)', display:'inline-block'}}></span>
                <span>Ką sako klientai</span>
              </div>
            </div>
            <div>
              <h2>Atsiliepimai, <em>be filtrų</em>.</h2>
              <p className="body" style={{marginTop: 20}}>Nurašyta iš tikrų klientų žinučių ir viešų atsiliepimų.</p>
            </div>
          </div>
        </Reveal>
        <div className="testimonial-viewport">
          <div className="testimonial-track" style={{transform: `translateX(-${i * 100}%)`}}>
            {TESTIMONIALS.map((q, idx) => (
              <div key={idx} className="testimonial">
                <div className="stars">★★★★★</div>
                <blockquote>„{q}"</blockquote>
                <div className="who">
                  <div className="meta">Patikrintas atsiliepimas</div>
                </div>
              </div>
            ))}
          </div>
        </div>
        <div className="test-controls">
          <div className="counter">{String(i+1).padStart(2,'0')} / {String(max).padStart(2,'0')}</div>
          <div className="arrows">
            <button onClick={prev} aria-label="Ankstesnis"><Icon name="arrow-left" size={16} /></button>
            <button onClick={next} aria-label="Kitas"><Icon name="arrow-right" size={16} /></button>
          </div>
        </div>
      </div>
    </section>
  );
};

const FAQ = () => {
  const items = [
    { q: 'Ar procedūra skausminga?', a: 'Ne. Procedūra atliekama švelniomis rankų technikomis. Įtemptose zonose galima jausti nedidelį spaudimą ar jautrumą, tačiau tai greitai praeina.' },
    { q: 'Kiek seansų reikia pirmiems rezultatams?', a: 'Priklauso nuo individualios situacijos, tačiau dauguma klientų pokyčius pastebi jau po pirmo seanso. Stabiliam rezultatui rekomenduojamas 1–4 seansų kursas pagrindinei disfunkcijai koreguoti.' },
    { q: 'Kaip ilgai išsilaiko efektas?', a: 'Priklauso nuo to, kiek organizmas sugeba išlaikyti naują pusiausvyrą — gyvenimo būdo, streso, laikysenos įpročių. Rezultatą įtvirtina periodiniai seansai ir korekciniai pratimai namuose.' },
    { q: 'Kuo skiriasi nuo kosmetologinio masažo, botokso ar užpildų?', a: 'Kosmetologija ir injekcinės procedūros veikia paviršutiniškai. Osteopatija dirba giliau — su kaulų padėtimi, fascijomis, kraujotaka ir visu organizmu, siekdama pašalinti pokyčio priežastį, o ne tik pasekmę.' },
    { q: 'Ar yra kontraindikacijų?', a: 'Kaip ir bet kuriai manualinei procedūrai — ūmios uždegiminės būklės, aukšta temperatūra, tam tikros onkologinės ligos, šviežios traumos ar operacijos, pirmasis nėštumo trimestras. Sveikatos būklė visada aptariama individualiai prieš seansą.' },
    { q: 'Nuo kokio amžiaus verta pradėti?', a: 'Tinka suaugusiems įvairaus amžiaus — jaunesniems prevenciškai, vyresniems amžiaus požymiams sušvelninti.' },
    { q: 'Kaip dažnai reikia lankytis?', a: 'Priklauso nuo paslaugos: veido masažas — 1–3 k./sav., OsteoEstetika seansas — kartą per savaitę, OsteoEstetika + pratimai — kas 10–12 dienų.' },
    { q: 'Ką pajusiu iš karto po seanso?', a: 'Dažniausiai lengvumą, atsipalaidavimą, šilumą veide. Kai kurie klientai iškart pastebi matomą veido kontūrų pagerėjimą.' },
    { q: 'Ar procedūra saugi? Ar būna šalutinis poveikis?', a: 'Taip, saugi ir neinvazinė.' },
    { q: 'Ar tinka esant raukšlėms, asimetrijai, patinimams, dvigubam smakrui?', a: 'Taip — būtent šioms problemoms spręsti skirta estetinė osteopatija.' },
    { q: 'Ar galima derinti su kitomis grožio procedūromis?', a: 'Taip, dera su kosmetologinėmis procedūromis ir gali pagerinti jų rezultatą. Derinant su injekcinėmis procedūromis, laiką verta suderinti individualiai.' },
    { q: 'Ar reikia kaip nors pasiruošti?', a: 'Rekomenduojama atsinešti laisvus, tampius drabužius (leginsus, sportines kelnes) — jie nevaržo judesio diagnostikos ir korekcijos metu. Po seanso naudinga gerti daugiau vandens.' }
  ];
  const [open, setOpen] = useState(0);

  return (
    <section className="section bg-white" id="faq">
      <div className="container">
        <Reveal>
          <div className="section-intro">
            <div>
              <div className="eyebrow label" style={{display:'flex', alignItems:'center', gap:14}}>
                <span style={{width:28, height:1, background:'var(--sage)', display:'inline-block'}}></span>
                <span>Dažniausi klausimai</span>
              </div>
            </div>
            <div>
              <h2>Viskas, ko klausia <em>prieš registruodamiesi</em>.</h2>
              <p className="body" style={{marginTop: 20}}>Jei tavo klausimo čia nėra — parašyk per WhatsApp arba Instagram, atsakau asmeniškai.</p>
            </div>
          </div>
        </Reveal>
        <div className="faq-list">
          {items.map((it, idx) => (
            <div key={idx} className={`faq-item ${open === idx ? 'open' : ''}`}>
              <button className="faq-q" onClick={()=>setOpen(open === idx ? -1 : idx)}>
                <span>{it.q}</span>
                <span className="plus">+</span>
              </button>
              <div className="faq-a">{it.a}</div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
};

Object.assign(window, { Testimonials, FAQ });
