/* How It Works — 3 étapes réelles de dbpilot */

function HowItWorks() {
  return (
    <section id="how">
      <div className="container">
        <Reveal>
          <div className="section-head">
            <span className="eyebrow"><span className="dot"></span>en 3 commandes</span>
            <h2 className="gradient-text">De zéro à backups,<br/>en moins d'une minute.</h2>
            <p>
              Aucun opérateur à déployer, aucun CRD à installer. dbpilot lit ta kubeconfig,
              génère la config, et crée les CronJobs dans ton cluster.
            </p>
          </div>
        </Reveal>

        <Reveal stagger>
          <div className="steps">
            <div className="step">
              <div className="step-num">01 / detect</div>
              <h3>Détecte tes bases</h3>
              <p>dbpilot scanne ton cluster, trouve les instances PostgreSQL accessibles et génère <code style={{fontFamily:'var(--font-mono)',fontSize:'0.85em'}}>~/.config/dbpilot/backup.yaml</code>.</p>
              <div className="step-cmd">
                <span className="prompt">$</span>dbpilot detect
              </div>
              <span className="step-arrow">→</span>
            </div>

            <div className="step">
              <div className="step-num">02 / deploy</div>
              <h3>Déploie les CronJobs</h3>
              <p>Édite la config générée (schedule, bucket S3, credentials), puis déploie un CronJob par base dans le cluster.</p>
              <div className="step-cmd">
                <span className="prompt">$</span>dbpilot deploy myapp
              </div>
              <span className="step-arrow">→</span>
            </div>

            <div className="step">
              <div className="step-num">03 / backup</div>
              <h3>Lance le premier backup</h3>
              <p>Déclenche un backup manuel pour vérifier que tout fonctionne. Ensuite le cron prend le relais.</p>
              <div className="step-cmd">
                <span className="prompt">$</span>dbpilot backup myapp run --wait
              </div>
            </div>
          </div>
        </Reveal>
      </div>
    </section>
  );
}

window.HowItWorks = HowItWorks;