const Thesis = ({ variant }) => {
  const isEditorial = variant === 'B';
  return (
    <section data-screen-label="03 Thèse" className="lp-section" style={{
      background: '#fff', padding: '128px 40px', position: 'relative'
    }}>
      <div style={{ maxWidth: 1240, margin: '0 auto' }}>
        <div style={{ display: 'flex', alignItems: 'baseline', gap: 16, marginBottom: 48 }}>
          <span style={{
            fontSize: 12, fontWeight: 600, letterSpacing: '0.16em', textTransform: 'uppercase',
            color: '#2036FF'
          }}>01 — L'opportunité</span>
          <div style={{ flex: 1, height: 1, background: '#DEDEDE' }} />
        </div>

        <div className="thesis-grid" style={{
          display: 'grid',
          gridTemplateColumns: isEditorial ? '1fr' : '1fr 1.2fr',
          gap: 64, alignItems: 'start'
        }}>
          <h2 style={{
            fontSize: isEditorial ? 'clamp(48px, 6vw, 88px)' : 'clamp(36px, 4.2vw, 56px)',
            fontWeight: 900, lineHeight: 1.0, letterSpacing: '-0.028em',
            textTransform: 'uppercase', margin: 0, color: '#1E1E1E',
            fontStyle: isEditorial ? 'italic' : 'normal'
          }}>
            Riches en actifs,<br />
            <span style={{ color: '#A3A3A3' }}>à court de cash.</span>
          </h2>

          <div>
            <p style={{ fontSize: 19, lineHeight: 1.65, color: '#393A3D', margin: '0 0 24px' }}>
              <strong style={{ color: '#1E1E1E' }}>Imaginez un fondateur australien</strong> dont la société vaut
              plusieurs centaines de millions. Sur le papier, il est riche. En pratique, son patrimoine est immobilisé
              dans des parts non cotées qu'il ne peut — ou ne veut — pas céder. Et pourtant, il a besoin de liquidités.
            </p>
            <p style={{ fontSize: 19, lineHeight: 1.65, color: '#393A3D', margin: '0 0 24px' }}>
              Plutôt que de vendre prématurément ses actifs, il met une partie de ses titres en garantie pour obtenir
              un prêt court terme. Il accepte de payer un intérêt élevé, mais conserve l'<em>upside</em>.{' '}
              <strong style={{ color: '#1E1E1E' }}>C'est exactement ce besoin que Bridge Crédit finance</strong> — et
              c'est <strong style={{ color: '#1E1E1E' }}>vous</strong>, en tant qu'investisseur, qui en percevez les
              intérêts.
            </p>
            <p style={{ fontSize: 17, lineHeight: 1.65, color: '#393A3D', margin: 0 }}>
              Les banques australiennes sont restrictives et lentes. Cet écart crée une fenêtre rare pour les prêteurs
              spécialisés — et un rendement attractif pour ceux qui les financent.
            </p>

            {/* Three reassurance KPIs */}
            <div style={{
              marginTop: 40, padding: 32,
              background: '#F6F6F9', borderRadius: 16, border: '1px solid #E1E3F6'
            }}>
              <div style={{
                fontSize: 11, fontWeight: 600, letterSpacing: '0.16em', textTransform: 'uppercase',
                color: '#A3A3A3', marginBottom: 20
              }}>Trois indicateurs qui rassurent</div>
              <div className="thesis-kpis" style={{ display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: 24 }}>
                <div>
                  <div style={{ fontSize: 36, fontWeight: 900, color: '#2036FF', letterSpacing: '-0.02em', lineHeight: 1 }}>
                    10,9&nbsp;%
                  </div>
                  <div style={{ fontSize: 13, color: '#393A3D', marginTop: 8, lineHeight: 1.5 }}>
                    Pour 100&nbsp;€ prêtés, l'emprunteur met en moyenne{' '}
                    <strong>915&nbsp;€ d'actifs</strong> en garantie.
                  </div>
                </div>
                <div>
                  <div style={{ fontSize: 36, fontWeight: 900, color: '#1E1E1E', letterSpacing: '-0.02em', lineHeight: 1 }}>
                    170&nbsp;M$
                  </div>
                  <div style={{ fontSize: 13, color: '#393A3D', marginTop: 8, lineHeight: 1.5 }}>
                    Valeur totale des actifs apportés en garantie sur le portefeuille.
                  </div>
                </div>
                <div>
                  <div style={{ fontSize: 36, fontWeight: 900, color: '#00BD82', letterSpacing: '-0.02em', lineHeight: 1 }}>
                    0
                  </div>
                  <div style={{ fontSize: 13, color: '#393A3D', marginTop: 8, lineHeight: 1.5 }}>
                    Aucune perte en capital enregistrée à ce jour sur l'historique du fonds.*
                  </div>
                </div>
              </div>
              <small style={{ display: 'block', marginTop: 20, fontSize: 13, color: '#888', lineHeight: 1.55 }}>
                * Données historiques. Les performances passées ne préjugent pas des performances futures.
                La dette privée non cotée comporte un risque de perte en capital et est peu liquide.
              </small>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
};
window.Thesis = Thesis;