/* global React, Eyebrow, Reveal, tr */
/* ─── FOUNDER NOTE / THESIS ───────────────────────────────────── */

function Thesis({ lang }) {
  return (
    <section className="section section--tone" id="thesis">
      <div className="wrap">
        <Reveal>
          <Eyebrow>
            {tr(lang, {
              en: 'A note from the founder',
              hi: 'संस्थापक की ओर से एक नोट',
              mr: 'संस्थापकाकडून एक नोट',
              gu: 'સ્થાપક તરફથી એક નોંધ',
            })}
          </Eyebrow>
        </Reveal>

        <div className="split-2" style={{ marginTop: 36 }}>
          <Reveal>
            <h2 className="headline headline--lg">
              {tr(lang, {
                en: 'The platform is not',
                hi: 'मंच उत्पाद नहीं',
                mr: 'मंच हे उत्पादन',
                gu: 'પ્લેટફોર્મ ઉત્પાદન',
              })}
              <br />
              {tr(lang, {
                en: 'the product.',
                hi: 'है।',
                mr: 'नाही.',
                gu: 'નથી.',
              })}
              <br />
              <span className="italic h-sun">
                {tr(lang, {
                  en: 'The worker is.',
                  hi: 'कर्मिक है।',
                  mr: 'कर्मिक आहे.',
                  gu: 'કર્મિક છે.',
                })}
              </span>
            </h2>
          </Reveal>

          <Reveal delay={1}>
            <div className="founder-note">
              <div className="founder-note__bg" />
              <div className="founder-note__body">
                <p>
                  {tr(lang, {
                    en: 'Most platforms ship the worker last. The brand goes up, the dashboard goes up, the ad budget goes up — and then, eventually, a contract appears for the person actually doing the work.',
                    hi: 'अधिकांश मंच कर्मिक को आख़िर में रखते हैं। पहले ब्रांड बनता है, फिर डैशबोर्ड, फिर विज्ञापन का बजट — और अंत में काम करने वाले इंसान के लिए एक अनुबंध।',
                    mr: 'बहुतेक मंच कर्मिकाला शेवटी ठेवतात. आधी ब्रँड येतो, मग डॅशबोर्ड, मग जाहिरातीचा खर्च — आणि शेवटी काम करणाऱ्या व्यक्तीसाठी एक करार.',
                    gu: 'મોટાભાગના પ્લેટફોર્મ કર્મિકને છેલ્લે રાખે છે. પહેલા બ્રાન્ડ આવે છે, પછી ડેશબોર્ડ, પછી જાહેરાતનું બજેટ — અને છેલ્લે કામ કરનાર વ્યક્તિ માટે કરાર.',
                  })}
                </p>
                <p>
                  {tr(lang, {
                    en: 'We are starting from the other end. A Karmik — a worker — is not a row in a table. The fare on screen is the fare paid out. The take-rate is printed on every receipt. A welfare pool sits aside, by default, for the worker to actually own.',
                    hi: 'हम दूसरे छोर से शुरू कर रहे हैं। कर्मिक तालिका की पंक्ति नहीं है। स्क्रीन पर दिखने वाला किराया वही है जो भुगतान किया जाता है। हर रसीद पर प्लेटफ़ॉर्म-शुल्क छपा है। एक कल्याण कोष, डिफ़ॉल्ट रूप से, कर्मिक के लिए अलग रखा जाता है।',
                    mr: 'आम्ही दुसऱ्या टोकापासून सुरुवात करत आहोत. कर्मिक टेबलची ओळ नाही. स्क्रीनवर दिसणारे भाडे तेच आहे जे दिले जाते. प्रत्येक पावतीवर प्लॅटफॉर्म-शुल्क छापलेले आहे. एक कल्याण निधी, डिफॉल्टनुसार, कर्मिकासाठी बाजूला ठेवला जातो.',
                    gu: 'અમે બીજા છેડેથી શરૂ કરી રહ્યા છીએ. કર્મિક ટેબલની હરોળ નથી. સ્ક્રીન પર દેખાતું ભાડું એ જ છે જે ચૂકવાય છે. દરેક રસીદ પર પ્લેટફોર્મ-ફી છપાય છે. એક કલ્યાણ ફંડ, ડિફોલ્ટ રીતે, કર્મિક માટે અલગ રખાય છે.',
                  })}
                </p>
                <p>
                  <em>
                    {tr(lang, {
                      en: 'Fair pay. Portable benefits. No extraction.',
                      hi: 'उचित वेतन। पोर्टेबल लाभ। कोई शोषण नहीं।',
                      mr: 'योग्य वेतन. पोर्टेबल लाभ. शोषण नाही.',
                      gu: 'વાજબી વેતન. પોર્ટેબલ લાભ. શોષણ નહીં.',
                    })}
                  </em>
                </p>
                <p style={{ fontFamily: 'var(--body)', fontSize: 14, color: 'var(--ink-500)', fontStyle: 'normal' }}>
                  {tr(lang, {
                    en: 'This page is a founder preview. Booking, matching, payments, and SMS verification are not live yet. The pilot will be small and observed in person. Everything below describes what we are building toward — clearly labeled so you know which is which.',
                    hi: 'यह पृष्ठ एक फाउंडर प्रीव्यू है। बुकिंग, मिलान, भुगतान और SMS सत्यापन अभी लाइव नहीं हैं। पायलट छोटा होगा और व्यक्तिगत रूप से देखा जाएगा। नीचे जो कुछ भी है वह बताता है कि हम क्या बना रहे हैं — स्पष्ट रूप से लेबल किया गया।',
                    mr: 'हे पृष्ठ एक फाउंडर प्रीव्ह्यू आहे. बुकिंग, जुळवणी, देयके आणि SMS पडताळणी अद्याप लाइव्ह नाहीत. पायलट लहान असेल आणि वैयक्तिकरित्या निरीक्षण केले जाईल. खाली जे आहे ते सांगते की आम्ही काय बांधत आहोत — स्पष्टपणे लेबल केलेले.',
                    gu: 'આ પૃષ્ઠ એ ફાઉન્ડર પ્રિવ્યૂ છે. બુકિંગ, મેચિંગ, ચૂકવણી અને SMS ચકાસણી હજુ લાઇવ નથી. પાયલટ નાનો હશે અને વ્યક્તિગત રીતે અવલોકન કરાશે. નીચે જે છે તે જણાવે છે કે અમે શું બાંધી રહ્યા છીએ — સ્પષ્ટપણે લેબલ થયેલું.',
                  })}
                </p>
              </div>
              <div className="founder-note__sig">
                {tr(lang, {
                  en: '— founder, Mumbai · May 2026',
                  hi: '— संस्थापक, मुंबई · मई 2026',
                  mr: '— संस्थापक, मुंबई · मे 2026',
                  gu: '— સ્થાપક, મુંબઈ · મે 2026',
                })}
              </div>
            </div>
          </Reveal>
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { Thesis });