/* ============================================================
   SECTIONS EXTRA — Transformations · Anti-Sell · FAQ · Cookies
   ============================================================ */
const { useState: useStateX, useEffect: useEffectX, useRef: useRefX } = React;

function useRevealX() {
  const ref = useRefX(null);
  useEffectX(() => {
    const el = ref.current;
    if (!el) return;
    const obs = new IntersectionObserver(
      (entries) => entries.forEach(e => { if (e.isIntersecting) e.target.classList.add('in'); }),
      { threshold: 0.12 }
    );
    obs.observe(el);
    return () => obs.disconnect();
  }, []);
  return ref;
}

/* ============== TRANSFORMATIONS DOCUMENTÉES ============== */
function Transformations() {
  const ref = useRevealX();
  const cases = [
    {
      code: "01", date: "Mars 2026",
      who: "Cassandra V. · post-partum",
      verified: true,
      kpi: "−8 KG",
      kpiSub: "C2B débloqué",
      body: "Reprise progressive en post-partum. Entraînement maintenu jusqu'au terme, perte de 8 kg post-naissance, premier connecté C2B (chest-to-bar) débloqué.",
      quote: "Chantier en cours : construire une version plus forte et plus solide de moi-même.",
      tag: "RECOMP"
    },
    {
      code: "02", date: "Janvier 2026",
      who: "M. · 50 ans",
      kpi: "89 → 79 KG",
      kpiSub: "6-pack à 50 ans",
      body: "Recomposition complète sur 5 mois. Passage de 89 à 79 kg. Abdominaux visibles, performance fonctionnelle au plus haut depuis 20 ans.",
      note: "Ce n'est pas l'âge qui bloque. C'est l'absence de cadre.",
      tag: "RECOMP"
    },
    {
      code: "03", date: "Mars 2026",
      who: "M. · athlète confirmé",
      kpi: "−6 KG · 6 SEM.",
      kpiSub: "Performance maximale",
      body: "Pic de performance avant compétition. Physique découpé, masse maigre préservée, records personnels battus sur plusieurs mouvements de référence.",
      tag: "PERF"
    },
    {
      code: "04", date: "Mars 2026",
      who: "Michael M. · adulte",
      verified: true,
      kpi: "DÉCLIC",
      kpiSub: "Nutrition + performance",
      body: "Bascule mentale autour de la nutrition. Recomposition installée durablement, performance en hausse continue, sortie définitive du yoyo alimentaire.",
      tag: "RECOMP"
    },
    {
      code: "05", date: "Février 2026",
      who: "Yvan (@yvnice) · adulte",
      verified: true,
      kpi: "50 JOURS",
      kpiSub: "Silhouette dessinée",
      body: "50 jours. Physique transformé, silhouette dessinée, performance en hausse. Effet protocole — exécution sans interruption.",
      tag: "PERF"
    },
    {
      code: "06", date: "Continu",
      who: "Au-delà du physique",
      kpi: "ÉNERGIE",
      kpiSub: "Sommeil + humeur",
      body: "Énergie au réveil, sommeil profond, humeur stable. Ne subit plus sa journée — la conduit. Le résultat le plus sous-estimé du protocole.",
      note: "Le corps, c'est juste la partie visible.",
      tag: "ÉNERGIE"
    },
  ];
  return (
    <section id="transformations" ref={ref} className="section fade-in">
      <div className="section-head">
        <div className="section-tag">05 · Transformations documentées</div>
        <h2 className="section-title">
          Six cas réels et chiffrés.<br/><em>Pas des témoignages.</em>
        </h2>
      </div>

      <div className="metrics-bar">
        <span>CAS / ÉCHANTILLON 2026 · ANONYMISÉ</span>
        <span className="pulse">DONNÉES PROTOCOLE</span>
      </div>

      <div className="trans-grid">
        {cases.map((c) => (
          <article key={c.code} className="trans-card">
            <div className="trans-head">
              <span>CAS / {c.code}</span>
              <span className="trans-tag">{c.tag}</span>
            </div>
            <div className="trans-who">
              {c.who}
              {c.verified && <span className="trans-verified">● Cas réel vérifié</span>}
            </div>
            <div className="trans-kpi">
              <div className="trans-kpi-v">{c.kpi}</div>
              <div className="trans-kpi-s">{c.kpiSub}</div>
            </div>
            <p className="trans-body">{c.body}</p>
            {c.quote && (
              <blockquote className="trans-quote">
                <span className="qmark">"</span>{c.quote}
              </blockquote>
            )}
            {c.note && (
              <div className="trans-note">→ {c.note}</div>
            )}
            <div className="trans-foot">
              <span>{c.date}</span>
              <span className="trans-arrow">↳ SUIVI 90 J</span>
            </div>
          </article>
        ))}
      </div>
    </section>
  );
}

/* ============== ANTI-SELL ============== */
function AntiSell() {
  const ref = useRevealX();
  const items = [
    "Vous voulez perdre du poids sans changer vos habitudes.",
    "Vous cherchez une recette miracle en 3 semaines.",
    "Vous n'êtes pas prêt à mesurer vos données.",
    "Vous voulez un coach passif qui se contente d'exécuter.",
    "Vous ne voulez pas être poussé jusqu'à vos limites.",
  ];
  return (
    <section id="anti-sell" ref={ref} className="section fade-in">
      <div className="section-head">
        <div className="section-tag" style={{color: "var(--danger)"}}>
          07 · Filtrage
        </div>
        <h2 className="section-title">
          Ce programme n'est <span style={{color: "var(--danger)"}}>pas</span> pour vous<br/>
          <em>si…</em>
        </h2>
      </div>

      <div className="anti-grid">
        {items.map((t, i) => (
          <article key={i} className="anti-card">
            <div className="anti-num">
              <span>EXCLUSION / 0{i+1}</span>
              <span className="anti-x">✕</span>
            </div>
            <p className="anti-text">{t}</p>
          </article>
        ))}
        <article className="anti-card positive">
          <div className="anti-num">
            <span style={{color: "var(--accent)"}}>SINON / 06</span>
            <span className="anti-check">✓</span>
          </div>
          <p className="anti-text">
            Si rien de cela ne s'applique, vous êtes au bon endroit. Candidatez au Bilan Performance.
          </p>
          <a href="#contact" className="btn btn-primary anti-cta">
            Candidater au Bilan <span className="arrow">→</span>
          </a>
        </article>
      </div>
    </section>
  );
}

/* ============== FAQ ============== */
function Faq() {
  const ref = useRevealX();
  const [open, setOpen] = useStateX(0);
  const qs = [
    {
      q: "Combien ça coûte, exactement ?",
      a: <>
        <p>Tarification transparente, en TTC, sans frais cachés :</p>
        <ul>
          <li><strong>150 €</strong> — Bilan Performance (1h30, étape obligatoire)</li>
          <li><strong>1 290 € → 3 900 €</strong> — Protocole 90 jours (3 formules)</li>
          <li><strong>390 €/mois</strong> — Suivi continu Giants Performance, sans engagement</li>
        </ul>
        <p>Paiement en 3× sans frais possible sur demande. Aucune reconduction tacite.</p>
      </>
    },
    {
      q: "Quels résultats puis-je attendre, et en combien de temps ?",
      a: <>
        <p>Sur 90 jours d'exécution conforme, les résultats observés sur les cas documentés :</p>
        <ul>
          <li><strong>Semaines 1–4 :</strong> retour de l'énergie, sommeil consolidé, premiers ajustements de composition corporelle.</li>
          <li><strong>Semaines 5–8 :</strong> recomposition visible, force et conditionnement en hausse, discipline installée.</li>
          <li><strong>Semaines 9–12 :</strong> nouveau standard physique et mental durable, indépendance opérationnelle acquise.</li>
        </ul>
        <p>Les résultats dépendent du point de départ et de l'engagement. Aucune promesse de performance — un engagement de protocole et de présence.</p>
      </>
    },
    {
      q: "Est-ce confidentiel ?",
      a: <p>Oui. Les échanges, mesures, données de santé et identité sont strictement confidentiels. Aucune communication publique sans accord écrit explicite. Les cas documentés présentés sur ce site sont anonymisés. Vos données ne sont partagées avec aucun tiers.</p>
    },
    {
      q: "Est-ce compatible avec un dirigeant qui voyage beaucoup ?",
      a: <>
        <p>Oui — c'est précisément la cible. La formule <strong>Essentiel</strong> est 100 % à distance avec programmation auto-suffisante. La <strong>Signature</strong> permet de basculer librement entre présentiel à Giants et visio. L'<strong>Elite</strong> inclut une ligne directe 7j/7.</p>
        <p>La programmation est conçue pour fonctionner avec une valise et 2 m² de chambre d'hôtel — pas de salle exotique requise.</p>
      </>
    },
    {
      q: "En quoi est-ce différent d'un coach sportif classique ?",
      a: <>
        <p>Trois différences structurelles :</p>
        <ul>
          <li><strong>Périmètre élargi :</strong> corps + énergie/mental + discipline, pas uniquement la séance.</li>
          <li><strong>Profil dirigeant :</strong> intégré à un agenda à haute charge, pas à un loisir.</li>
          <li><strong>Cadre d'engagement :</strong> protocole signé, données mesurées, responsabilité hebdomadaire.</li>
        </ul>
        <p>Un coach sportif vous fait transpirer. Ce protocole reconstruit l'opérateur derrière les décisions.</p>
      </>
    },
    {
      q: "Que se passe-t-il si je dois suspendre temporairement ?",
      a: <p>Une suspension est possible pour raison médicale, opérationnelle majeure ou voyage prolongé, sur demande écrite avec avenant. Le protocole est mis en pause à date, sans frais supplémentaires, et reprend à la session manquée. Les conditions précises figurent à l'article 5 des CGV.</p>
    },
    {
      q: "Comment se passe le premier rendez-vous (Bilan Performance) ?",
      a: <>
        <p>1h30 en présentiel à Giants ou en visio, en trois temps :</p>
        <ul>
          <li><strong>00–30 min</strong> — Diagnostic complet : santé, sommeil, nutrition, charge mentale, antécédents sportifs.</li>
          <li><strong>30–60 min</strong> — Mesures objectives (composition corporelle, mobilité, marqueurs de force).</li>
          <li><strong>60–90 min</strong> — Plan d'attaque : objectifs 90 jours, formule recommandée, calendrier d'engagement.</li>
        </ul>
        <p>Vous repartez avec un diagnostic écrit et une recommandation chiffrée — que vous engagiez le protocole ou non.</p>
      </>
    },
    {
      q: "Y a-t-il une garantie de satisfaction ?",
      a: <p>Au-delà du droit légal de rétractation de 14 jours, je m'engage à un point de revue formel à <strong>30 jours</strong>. Si l'exécution conforme n'a produit aucun marqueur de progression, le protocole est repensé sans frais supplémentaires. Je ne garantis pas un résultat — je garantis l'intensité et la rigueur de l'accompagnement.</p>
    }
  ];
  return (
    <section id="faq" ref={ref} className="section fade-in">
      <div className="section-head">
        <div className="section-tag">08 · Questions fréquentes</div>
        <h2 className="section-title">
          Huit questions.<br/><em>Réponses directes.</em>
        </h2>
      </div>

      <div className="faq-list">
        {qs.map((item, i) => {
          const isOpen = open === i;
          return (
            <div key={i} className={"faq-row" + (isOpen ? " open" : "")}>
              <button className="faq-q" onClick={() => setOpen(isOpen ? -1 : i)}>
                <span className="faq-idx">Q.0{i+1}</span>
                <span className="faq-text">{item.q}</span>
                <span className="faq-toggle">{isOpen ? "−" : "+"}</span>
              </button>
              <div className="faq-a" aria-hidden={!isOpen}>
                <div className="faq-a-inner">{item.a}</div>
              </div>
            </div>
          );
        })}
      </div>
    </section>
  );
}

/* ============== COOKIE BANNER ============== */
function CookieBanner() {
  const [shown, setShown] = useStateX(false);
  useEffectX(() => {
    if (!localStorage.getItem("cookies_choice_v1")) {
      const t = setTimeout(() => setShown(true), 900);
      return () => clearTimeout(t);
    }
  }, []);
  const decide = (v) => {
    localStorage.setItem("cookies_choice_v1", v);
    setShown(false);
  };
  if (!shown) return null;
  return (
    <div className="cookie-banner" role="dialog" aria-label="Préférences de cookies">
      <div className="cookie-inner">
        <div className="cookie-text">
          <span className="cookie-label">COOKIES / 001</span>
          <p>
            Ce site utilise uniquement des cookies fonctionnels nécessaires à son fonctionnement.
            Aucun traceur publicitaire ni partage tiers. Vous pouvez refuser à tout moment.
            <a href="legal/confidentialite.html"> En savoir plus →</a>
          </p>
        </div>
        <div className="cookie-actions">
          <button className="cookie-btn ghost" onClick={() => decide("refused")}>Refuser</button>
          <button className="cookie-btn primary" onClick={() => decide("accepted")}>Accepter</button>
        </div>
      </div>
    </div>
  );
}

Object.assign(window, { Transformations, AntiSell, Faq, CookieBanner });
