// Workshop-revised directions (rev. 02) — based on atelier compte-rendu.
// Brand bleu/vert, hemp coexistence, custom breeding, scientific authority.
// All three directions get their full home rebuilt to address the brief.

// Brand palette pulled from BSB logo: forest-green + sky-blue + cream paper.
const BRAND = {
  green: "#1F4E3D",      // primary — leaf, R&D
  green2: "#2E6B53",
  greenSoft: "#E5F0EA",
  blue: "#1B5E8C",       // secondary — water, science
  blue2: "#3B82B5",
  blueSoft: "#E1EFF7",
  hemp: "#8FA86E",       // hemp accent — sage
  hempSoft: "#EEF2E5",
  gold: "#C8A24A",       // tobacco-gold accent
  paper: "#F8F5EE",
  paper2: "#EFEAD9",
  ink: "#0F1A14",
  line: "rgba(15,26,20,.12)",
  line2: "rgba(15,26,20,.22)",
};

const FONTS = {
  display: '"Fraunces", "Cormorant Garamond", Georgia, serif',
  body: '"Manrope", "Inter", system-ui, sans-serif',
  mono: '"JetBrains Mono", ui-monospace, monospace',
  sans: '"Inter Tight", "Inter", system-ui, sans-serif',
  archivo: '"Archivo", "Inter Tight", system-ui, sans-serif',
};

// Crop-toggle pill used by all 3 revs
function CropToggle({ crop, setCrop, t, palette }) {
  const opts = [["all", t("crop_all")], ["tobacco", t("crop_tobacco")], ["hemp", t("crop_hemp")]];
  return (
    <div style={{ display: "inline-flex", gap: 0, padding: 3,
      background: palette.bg, border: `1px solid ${palette.border}`, borderRadius: 999 }}>
      {opts.map(([k, l]) => (
        <button key={k} onClick={() => setCrop(k)}
          style={{ background: crop === k ? palette.activeBg : "transparent",
            color: crop === k ? palette.activeFg : palette.fg,
            border: "none", padding: "6px 14px", borderRadius: 999,
            fontFamily: FONTS.body, fontSize: 12, fontWeight: 600, cursor: "pointer" }}>
          {l}
        </button>
      ))}
    </div>
  );
}

// QuoteCTA — recurring lead-gen card
function QuoteCard({ t, palette, compact }) {
  return (
    <div style={{ background: palette.bg, color: palette.fg, padding: compact ? 24 : 36,
      borderRadius: 14, display: "flex", alignItems: "center", gap: 24,
      flexWrap: "wrap" }}>
      <div style={{ flex: 1, minWidth: 240 }}>
        <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".18em",
          opacity: .75, textTransform: "uppercase", marginBottom: 8 }}>
          {t("cta_quote_sub")} · 95 % export
        </div>
        <div style={{ fontFamily: FONTS.display, fontSize: compact ? 32 : 44,
          lineHeight: 1.05, fontWeight: 500, letterSpacing: "-.02em",
          textWrap: "balance" }}>
          {t("cta_quote")} →
        </div>
      </div>
      <button style={{ background: palette.btnBg, color: palette.btnFg, border: "none",
        padding: "14px 22px", borderRadius: 999, fontFamily: FONTS.body, fontSize: 14,
        fontWeight: 700, cursor: "pointer" }}>
        {t("cta_contact")}
      </button>
    </div>
  );
}

// ───────────────────────────────────────────────────────
// A2 — Terroir, brand-aligned (vert + bleu, retired bordeaux)
// ───────────────────────────────────────────────────────
function A2Home({ t, lang, setRoute }) {
  const [crop, setCrop] = React.useState("all");
  return (
    <main style={{ background: BRAND.paper, color: BRAND.ink, fontFamily: FONTS.body }}>
      {/* Brand top strip */}
      <div style={{ background: BRAND.green, color: BRAND.paper, padding: "8px 40px",
        fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".18em",
        display: "flex", justifyContent: "space-between", alignItems: "center" }}>
        <span>BSB · 24100 BERGERAC · DEPUIS 2003</span>
        <span style={{ color: BRAND.gold }}>● 95% EXPORT — Europe · Afrique · MENA</span>
      </div>

      <header style={{ position: "sticky", top: 0, zIndex: 20, background: BRAND.paper,
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto", padding: "18px 40px",
          display: "flex", alignItems: "center", gap: 32 }}>
          <a onClick={() => setRoute({ name: "home" })}
            style={{ cursor: "pointer", display: "flex", alignItems: "center", gap: 12 }}>
            <svg width="36" height="36" viewBox="0 0 36 36">
              <circle cx="18" cy="18" r="17" fill={BRAND.green}/>
              <path d="M18 8 C 13 12, 11 18, 13 24 M18 8 C 23 12, 25 18, 23 24 M13 24 L 23 24"
                stroke={BRAND.paper} strokeWidth="1.5" fill="none"/>
              <circle cx="18" cy="14" r="1.5" fill={BRAND.gold}/>
            </svg>
            <div style={{ fontFamily: FONTS.display, fontSize: 18, lineHeight: 1,
              fontWeight: 500, letterSpacing: "-.01em" }}>
              Bergerac<br/>
              <span style={{ fontSize: 9.5, fontFamily: FONTS.body, fontWeight: 700,
                letterSpacing: ".22em", color: BRAND.green, textTransform: "uppercase" }}>
                Seed &amp; Breeding
              </span>
            </div>
          </a>
          <nav style={{ display: "flex", gap: 26, marginLeft: 24,
            fontFamily: FONTS.body, fontSize: 13.5, fontWeight: 500, color: BRAND.ink }}>
            {[
              ["varieties", t("nav_varieties")],
              ["breeding", t("nav_breeding")],
              ["science", t("nav_science")],
              ["network", t("nav_network")],
              ["contact", t("nav_contact")],
            ].map(([k, l]) => (
              <a key={k} onClick={() => k === "varieties" ? setRoute({ name: "varieties" }) : null}
                style={{ cursor: "pointer" }}>{l}</a>
            ))}
          </nav>
          <div style={{ marginLeft: "auto", display: "flex", alignItems: "center", gap: 12 }}>
            <CropToggle crop={crop} setCrop={setCrop} t={t}
              palette={{ bg: BRAND.paper2, border: BRAND.line, fg: BRAND.ink,
                activeBg: BRAND.green, activeFg: BRAND.paper }}/>
            <button style={{ background: BRAND.gold, color: BRAND.ink, border: "none",
              padding: "9px 16px", borderRadius: 999, fontFamily: FONTS.body, fontSize: 13,
              fontWeight: 700, cursor: "pointer" }}>{t("cta_quote")} →</button>
          </div>
        </div>
      </header>

      {/* HERO — editorial with crop coexistence */}
      <section style={{ padding: "80px 40px 60px",
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto",
          display: "grid", gridTemplateColumns: "1.4fr 1fr", gap: 60, alignItems: "end" }}>
          <div>
            <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
              color: BRAND.green, marginBottom: 24, textTransform: "uppercase" }}>
              ◌ Semencier · Tabac &amp; Chanvre · Bergerac
            </div>
            <h1 style={{ fontFamily: FONTS.display, fontSize: "clamp(64px, 9vw, 124px)",
              lineHeight: .92, letterSpacing: "-.035em", fontWeight: 400,
              margin: 0, color: BRAND.ink, textWrap: "balance" }}>
              Sélection française.<br/>
              <em style={{ color: BRAND.green, fontWeight: 500 }}>Pour les producteurs</em><br/>
              <span style={{ fontStyle: "italic", color: BRAND.blue, fontWeight: 400 }}>
                du monde.
              </span>
            </h1>
            <p style={{ fontFamily: FONTS.body, fontSize: 18, lineHeight: 1.5,
              color: BRAND.ink, opacity: .8, marginTop: 32, maxWidth: 580,
              textWrap: "pretty" }}>
              16 variétés de tabac Virginia, un programme chanvre lancé en 2022, et une
              activité de création variétale sur mesure pour cigarettiers et industriels.
              Données d'essais sur 25 ans.
            </p>
          </div>
          {/* Brand stat panel */}
          <div style={{ background: BRAND.green, color: BRAND.paper, padding: 36,
            borderRadius: 14 }}>
            <div style={{ fontFamily: FONTS.mono, fontSize: 10, letterSpacing: ".22em",
              color: BRAND.gold, marginBottom: 20 }}>BSB EN CHIFFRES — 2026</div>
            {[
              ["16", "variétés tabac"],
              ["3", "lignées chanvre"],
              ["30 %", "création sur mesure"],
              ["25 ans", "de données d'essais"],
              ["7 pays", "de distribution"],
            ].map(([n, l]) => (
              <div key={l} style={{ display: "flex", justifyContent: "space-between",
                alignItems: "baseline", padding: "12px 0",
                borderBottom: "1px solid rgba(248,245,238,.18)" }}>
                <span style={{ fontFamily: FONTS.display, fontSize: 32, fontWeight: 500,
                  letterSpacing: "-.02em" }}>{n}</span>
                <span style={{ fontFamily: FONTS.body, fontSize: 13, opacity: .8 }}>{l}</span>
              </div>
            ))}
          </div>
        </div>
      </section>

      {/* Two-pillar coexistence — Tabac + Chanvre */}
      <section style={{ padding: "80px 40px",
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto" }}>
          <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
            color: BRAND.green, marginBottom: 16, textTransform: "uppercase" }}>
            ◌ Nos cultures
          </div>
          <h2 style={{ fontFamily: FONTS.display, fontSize: 56, lineHeight: 1, fontWeight: 400,
            letterSpacing: "-.025em", margin: "0 0 48px", textWrap: "pretty",
            maxWidth: 760 }}>
            Le <em style={{ color: BRAND.green }}>tabac</em> reste notre cœur de métier.
            Le <em style={{ color: BRAND.hemp, fontWeight: 500 }}>chanvre</em> est notre
            avenir.
          </h2>
          <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 20 }}>
            {/* Tabac pillar */}
            <article style={{ background: BRAND.paper2, borderRadius: 14, padding: 36,
              minHeight: 360, position: "relative", overflow: "hidden" }}>
              <span style={{ fontFamily: FONTS.mono, fontSize: 11, color: BRAND.green,
                letterSpacing: ".18em" }}>● TABAC · 98 % CA</span>
              <h3 style={{ fontFamily: FONTS.display, fontSize: 56, lineHeight: 1,
                fontWeight: 400, letterSpacing: "-.03em", margin: "16px 0 16px",
                color: BRAND.green }}>
                16 variétés Virginia
              </h3>
              <p style={{ fontFamily: FONTS.body, fontSize: 15, lineHeight: 1.55,
                color: BRAND.ink, opacity: .8, margin: 0, maxWidth: 460,
                textWrap: "pretty" }}>
                Du remplissage shisha au semi-aromatique. Toutes inscrites au catalogue
                français, comparées au témoin national ITB 683.
              </p>
              <div style={{ display: "flex", gap: 10, marginTop: 28, flexWrap: "wrap" }}>
                {VARIETIES.slice(0, 6).map(v => (
                  <span key={v.code} style={{ fontFamily: FONTS.mono, fontSize: 12,
                    fontWeight: 600, padding: "5px 10px", borderRadius: 999,
                    background: v.isReference ? BRAND.green : "transparent",
                    color: v.isReference ? BRAND.paper : BRAND.green,
                    border: `1px solid ${BRAND.green}` }}>
                    {v.code}
                  </span>
                ))}
                <span style={{ fontFamily: FONTS.mono, fontSize: 12, padding: "5px 10px",
                  color: BRAND.ink, opacity: .55 }}>+ 10</span>
              </div>
              <a onClick={() => setRoute({ name: "varieties" })}
                style={{ cursor: "pointer", display: "inline-block", marginTop: 32,
                  fontFamily: FONTS.body, fontSize: 14, fontWeight: 700, color: BRAND.green,
                  borderBottom: `1px solid ${BRAND.green}`, paddingBottom: 3 }}>
                Voir le catalogue tabac →
              </a>
            </article>
            {/* Chanvre pillar */}
            <article style={{ background: BRAND.hempSoft, borderRadius: 14, padding: 36,
              minHeight: 360, position: "relative", overflow: "hidden",
              border: `1px solid ${BRAND.hemp}` }}>
              <span style={{ fontFamily: FONTS.mono, fontSize: 11, color: BRAND.hemp,
                letterSpacing: ".18em", fontWeight: 700 }}>● CHANVRE · LANCÉ 2022</span>
              <h3 style={{ fontFamily: FONTS.display, fontSize: 56, lineHeight: 1,
                fontWeight: 400, letterSpacing: "-.03em", margin: "16px 0 16px",
                color: BRAND.green2 }}>
                3 lignées en sélection
              </h3>
              <p style={{ fontFamily: FONTS.body, fontSize: 15, lineHeight: 1.55,
                color: BRAND.ink, opacity: .8, margin: 0, maxWidth: 460,
                textWrap: "pretty" }}>
                Fibres longues, graines, cannabinoïdes. Programme conduit avec INRAE
                et instituts régionaux. Premières inscriptions en cours.
              </p>
              <div style={{ marginTop: 28, display: "flex", flexDirection: "column", gap: 8 }}>
                {HEMP_VARIETIES.map(h => (
                  <div key={h.code} style={{ display: "flex", justifyContent: "space-between",
                    alignItems: "center", padding: "10px 14px", borderRadius: 8,
                    background: "rgba(255,255,255,.6)", fontFamily: FONTS.body, fontSize: 13 }}>
                    <span style={{ fontFamily: FONTS.mono, fontWeight: 700, color: BRAND.green2 }}>
                      {h.code}
                    </span>
                    <span style={{ opacity: .8 }}>
                      {lang === "fr" ? h.line : h.lineEn}
                    </span>
                    <span style={{ fontFamily: FONTS.mono, fontSize: 11, opacity: .65 }}>
                      {h.year}
                    </span>
                  </div>
                ))}
              </div>
            </article>
          </div>
        </div>
      </section>

      {/* CUSTOM BREEDING — 30% of CA */}
      <section style={{ padding: "100px 40px", background: BRAND.green, color: BRAND.paper }}>
        <div style={{ maxWidth: 1320, margin: "0 auto" }}>
          <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
            color: BRAND.gold, marginBottom: 16, textTransform: "uppercase" }}>
            ◌ {t("section_breeding")} · 30 % CA
          </div>
          <h2 style={{ fontFamily: FONTS.display, fontSize: "clamp(48px, 6vw, 88px)",
            lineHeight: .95, fontWeight: 400, letterSpacing: "-.03em",
            margin: "0 0 24px", maxWidth: 1000, textWrap: "balance" }}>
            Une variété conçue <em>pour vous,</em><br/>
            sur cahier des charges.
          </h2>
          <p style={{ fontFamily: FONTS.body, fontSize: 17, lineHeight: 1.55,
            opacity: .85, maxWidth: 720, marginBottom: 56, textWrap: "pretty" }}>
            Pour les cigarettiers et industriels qui ont des contraintes précises —
            teneur en nicotine, profil aromatique, résistance ciblée. Nous concevons
            la lignée, conduisons les essais, et livrons la semence certifiée.
          </p>
          <div style={{ display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 4,
            background: "rgba(248,245,238,.1)", padding: 4, borderRadius: 14 }}>
            {BREEDING_STEPS.map((s, i) => (
              <div key={s.id} style={{ background: i === 0 ? BRAND.gold : "rgba(248,245,238,.04)",
                color: i === 0 ? BRAND.ink : BRAND.paper, padding: 28, borderRadius: 10,
                position: "relative", minHeight: 200 }}>
                <div style={{ fontFamily: FONTS.mono, fontSize: 10, letterSpacing: ".18em",
                  opacity: .7 }}>ÉTAPE {String(i+1).padStart(2,"0")}</div>
                <div style={{ fontFamily: FONTS.display, fontSize: 30, fontWeight: 500,
                  letterSpacing: "-.02em", marginTop: 16 }}>
                  {lang === "fr" ? s.label_fr : s.label_en}
                </div>
                <div style={{ fontFamily: FONTS.mono, fontSize: 11, marginTop: 8,
                  color: i === 0 ? BRAND.green : BRAND.gold, fontWeight: 600 }}>
                  {s.durationMo} mois
                </div>
                <p style={{ fontFamily: FONTS.body, fontSize: 13, lineHeight: 1.5,
                  marginTop: 16, opacity: .85, textWrap: "pretty" }}>
                  {lang === "fr" ? s.desc_fr : s.desc_en}
                </p>
              </div>
            ))}
          </div>
          <div style={{ marginTop: 48 }}>
            <QuoteCard t={t} compact
              palette={{ bg: BRAND.gold, fg: BRAND.ink, btnBg: BRAND.ink, btnFg: BRAND.gold }}/>
          </div>
        </div>
      </section>

      {/* SCIENCE — publications + partners */}
      <section style={{ padding: "100px 40px",
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto",
          display: "grid", gridTemplateColumns: "1fr 1.4fr", gap: 60 }}>
          <div>
            <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
              color: BRAND.blue, marginBottom: 16, textTransform: "uppercase" }}>
              ◌ {t("section_science")}
            </div>
            <h2 style={{ fontFamily: FONTS.display, fontSize: 56, lineHeight: 1,
              fontWeight: 400, letterSpacing: "-.025em", margin: 0, color: BRAND.blue,
              textWrap: "pretty" }}>
              <em>25 années</em> de données d'essais.
            </h2>
            <p style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.55,
              color: BRAND.ink, opacity: .8, marginTop: 24, textWrap: "pretty" }}>
              Publications dans CORESTA Bulletin, TAG, Industrial Crops &amp; Products.
              Collaborations actives avec INRAE Bordeaux et l'Institut du Tabac.
            </p>
            <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 8,
              marginTop: 36 }}>
              {[
                { n: "12", l: t("science_pubs") },
                { n: "25+", l: t("science_trials") },
                { n: "4", l: t("science_partners") },
              ].map(s => (
                <div key={s.l} style={{ background: BRAND.blueSoft, padding: 20, borderRadius: 10 }}>
                  <div style={{ fontFamily: FONTS.display, fontSize: 40, fontWeight: 500,
                    color: BRAND.blue, lineHeight: 1, letterSpacing: "-.02em" }}>{s.n}</div>
                  <div style={{ fontFamily: FONTS.body, fontSize: 11, color: BRAND.ink,
                    marginTop: 8, opacity: .8 }}>{s.l}</div>
                </div>
              ))}
            </div>
          </div>
          <div>
            <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".18em",
              color: BRAND.ink, opacity: .6, marginBottom: 12 }}>
              PUBLICATIONS RÉCENTES
            </div>
            <div>
              {PUBLICATIONS.map((p, i) => (
                <div key={i} style={{ display: "grid", gridTemplateColumns: "70px 1fr",
                  gap: 24, padding: "24px 0", borderTop: `1px solid ${BRAND.line}` }}>
                  <div style={{ fontFamily: FONTS.mono, fontSize: 14, fontWeight: 700,
                    color: BRAND.blue }}>{p.year}</div>
                  <div>
                    <h4 style={{ fontFamily: FONTS.display, fontSize: 21, lineHeight: 1.2,
                      fontWeight: 500, margin: 0, letterSpacing: "-.01em",
                      textWrap: "pretty" }}>{p.title}</h4>
                    <div style={{ fontFamily: FONTS.body, fontSize: 13, marginTop: 8,
                      opacity: .7, fontStyle: "italic" }}>
                      {p.journal} — {p.authors}
                    </div>
                  </div>
                </div>
              ))}
            </div>
          </div>
        </div>
      </section>

      <footer style={{ background: BRAND.ink, color: BRAND.paper, padding: "40px",
        fontFamily: FONTS.body, fontSize: 12 }}>
        <div style={{ maxWidth: 1320, margin: "0 auto", display: "flex",
          justifyContent: "space-between", flexWrap: "wrap", gap: 16 }}>
          <span style={{ opacity: .7 }}>Bergerac Seed &amp; Breeding · La Tour, boulevard des poudriers · 24100 Bergerac · France</span>
          <span style={{ fontFamily: FONTS.mono, fontSize: 10, letterSpacing: ".22em",
            color: BRAND.gold }}>● bergeracseed.com — depuis 2003</span>
        </div>
      </footer>
    </main>
  );
}

// ───────────────────────────────────────────────────────
// B2 — Agritech (replaces Brutalist Lab) — clean, scientific, brand bleu/vert
// ───────────────────────────────────────────────────────
function B2Home({ t, lang, setLang, setRoute }) {
  const [crop, setCrop] = React.useState("all");
  return (
    <main style={{ background: "#FAFAF7", color: "#0F1A14", fontFamily: FONTS.sans }}>
      <header style={{ position: "sticky", top: 0, zIndex: 20, background: "rgba(250,250,247,.92)",
        backdropFilter: "blur(12px)", borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto", padding: "16px 32px",
          display: "flex", alignItems: "center", gap: 24 }}>
          <a onClick={() => setRoute({ name: "home" })}
            style={{ cursor: "pointer", display: "inline-flex", alignItems: "center",
              lineHeight: 0 }}>
            <img src="assets/logo.jpeg" alt="Bergerac Seed &amp; Breeding"
              style={{ height: 44, width: "auto", display: "block" }}/>
          </a>
          <nav style={{ display: "flex", gap: 24, marginLeft: 24,
            fontFamily: FONTS.sans, fontSize: 13.5, fontWeight: 500 }}>
            {[
              ["varieties", lang==="fr"?"Nos variétés":"Varieties"],
              ["contact", "Contact"],
            ].map(([k, l]) => (
              <a key={k} onClick={() => setRoute({ name: k })}
                style={{ cursor: "pointer", color: BRAND.ink }}>{l}</a>
            ))}
          </nav>
          <div style={{ marginLeft: "auto", display: "flex", alignItems: "center", gap: 12 }}>
            <div style={{ display: "flex", gap: 2, fontFamily: FONTS.mono, fontSize: 11,
              letterSpacing: ".08em", padding: 3,
              background: BRAND.paper2, borderRadius: 999,
              border: `1px solid ${BRAND.line}` }}>
              {["fr", "en"].map(l => (
                <button key={l} onClick={() => setLang && setLang(l)}
                  style={{ background: lang === l ? BRAND.ink : "transparent",
                    color: lang === l ? BRAND.paper : BRAND.ink, border: "none",
                    padding: "5px 10px", borderRadius: 999,
                    cursor: "pointer", fontFamily: "inherit", fontSize: 11, fontWeight: 600,
                    textTransform: "uppercase" }}>{l}</button>
              ))}
            </div>
          </div>
        </div>
      </header>

      {/* HERO — Agritech split: claim left, live data right */}
      <section style={{ padding: "60px 32px",
        background: `linear-gradient(180deg, #FAFAF7 0%, ${BRAND.greenSoft} 100%)`,
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto",
          display: "grid", gridTemplateColumns: "1fr 1fr", gap: 60, alignItems: "center" }}>
          <div>
            <div style={{ display: "inline-flex", alignItems: "center", gap: 10,
              background: BRAND.greenSoft, padding: "6px 14px", borderRadius: 999,
              fontFamily: FONTS.mono, fontSize: 11, color: BRAND.green,
              letterSpacing: ".1em", fontWeight: 600, marginBottom: 28,
              border: `1px solid ${BRAND.green2}` }}>
              <span style={{ width: 6, height: 6, borderRadius: 3, background: BRAND.green,
                animation: "pulse 2s infinite" }}/>
              25 essais en cours · 2026
            </div>
            <h1 style={{ fontFamily: FONTS.archivo, fontSize: "clamp(56px, 7.5vw, 104px)",
              lineHeight: .95, fontWeight: 800, letterSpacing: "-.04em",
              margin: 0, textWrap: "balance" }}>
              Sélection variétale,<br/>
              <span style={{ color: BRAND.green }}>tabac</span> &amp;{" "}
              <span style={{ color: BRAND.hemp }}>chanvre.</span>
            </h1>
            <p style={{ fontFamily: FONTS.body, fontSize: 18, lineHeight: 1.5,
              opacity: .75, marginTop: 24, maxWidth: 540, textWrap: "pretty" }}>
              Données d'essais sur 25 ans, profils de résistance documentés,
              et création variétale sur cahier des charges. Pour producteurs,
              cigarettiers et industriels.
            </p>
            <div style={{ display: "flex", gap: 12, marginTop: 32 }}>
              <button onClick={() => setRoute({ name: "varieties" })}
                style={{ background: BRAND.green, color: BRAND.paper, border: "none",
                  padding: "14px 22px", borderRadius: 10, fontFamily: FONTS.sans,
                  fontSize: 14, fontWeight: 600, cursor: "pointer" }}>
                Explorer le catalogue →
              </button>
              <button style={{ background: "transparent", color: BRAND.ink,
                border: `1px solid ${BRAND.line2}`, padding: "14px 22px", borderRadius: 10,
                fontFamily: FONTS.sans, fontSize: 14, fontWeight: 600, cursor: "pointer" }}>
                ↓ Catalogue PDF
              </button>
            </div>
          </div>
          {/* LIVE DATA panel */}
          <div style={{ background: BRAND.paper, borderRadius: 16, padding: 28,
            border: `1px solid ${BRAND.line2}`, boxShadow: "0 24px 48px rgba(15,26,20,.06)" }}>
            <div style={{ display: "flex", justifyContent: "space-between",
              alignItems: "center", marginBottom: 20 }}>
              <span style={{ fontFamily: FONTS.mono, fontSize: 11,
                color: BRAND.green, letterSpacing: ".15em", fontWeight: 700 }}>
                ● PERFORMANCE — VARIÉTÉS 2026
              </span>
              <span style={{ fontFamily: FONTS.mono, fontSize: 11, opacity: .55 }}>
                vs ITB 683
              </span>
            </div>
            {VARIETIES.filter(v => v.isReference || v.isNew || v.code === "BSB 6217" || v.code === "BSB 6218").slice(0, 5).map(v => (
              <div key={v.code} onClick={() => setRoute({ name: "detail", code: v.code })}
                style={{ cursor: "pointer", padding: "14px 0",
                  borderTop: `1px solid ${BRAND.line}` }}>
                <div style={{ display: "flex", justifyContent: "space-between",
                  alignItems: "center", marginBottom: 6 }}>
                  <span style={{ fontFamily: FONTS.archivo, fontWeight: 700, fontSize: 16,
                    letterSpacing: "-.01em" }}>
                    {v.code}
                    {v.isReference && <span style={{ marginLeft: 6, fontFamily: FONTS.mono,
                      fontSize: 9, padding: "2px 5px", background: BRAND.gold, color: BRAND.ink,
                      borderRadius: 4, letterSpacing: ".05em" }}>REF</span>}
                    {v.isNew && <span style={{ marginLeft: 6, fontFamily: FONTS.mono,
                      fontSize: 9, padding: "2px 5px", background: BRAND.green, color: BRAND.paper,
                      borderRadius: 4, letterSpacing: ".05em" }}>NEW</span>}
                  </span>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 11, opacity: .55 }}>
                    {v.typeShort}
                  </span>
                </div>
                <div style={{ display: "grid", gridTemplateColumns: "60px 1fr 50px",
                  gap: 10, alignItems: "center" }}>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 11,
                    color: BRAND.green, fontWeight: 600 }}>YIELD</span>
                  <div style={{ height: 6, background: BRAND.paper2, borderRadius: 3,
                    position: "relative", overflow: "hidden" }}>
                    <div style={{ height: "100%", width: `${Math.min(v.yieldPct, 130)/1.3}%`,
                      background: v.yieldPct >= 100 ? BRAND.green : BRAND.blue2 }}/>
                    <div style={{ position: "absolute", left: "76.9%", top: 0, bottom: 0,
                      width: 1, background: BRAND.gold }}/>
                  </div>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 12, fontWeight: 700,
                    textAlign: "right",
                    color: v.yieldPct >= 100 ? BRAND.green : BRAND.ink }}>
                    {v.yieldPct}%
                  </span>
                </div>
              </div>
            ))}
          </div>
        </div>
      </section>

      {/* PHOTO BAND — between hero and missions */}
      <section style={{ position: "relative", height: 360, overflow: "hidden",
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ position: "absolute", inset: 0,
          backgroundImage: `url(${PHOTOS.field_aerial})`,
          backgroundSize: "cover", backgroundPosition: "center" }}/>
        <div style={{ position: "absolute", inset: 0,
          background: `linear-gradient(90deg, ${BRAND.ink}DD 0%, ${BRAND.ink}66 50%, transparent 100%)` }}/>
        <div style={{ position: "relative", maxWidth: 1320, margin: "0 auto",
          padding: "0 32px", height: "100%",
          display: "flex", alignItems: "center" }}>
          <div style={{ maxWidth: 540, color: BRAND.paper }}>
            <h2 style={{ fontFamily: FONTS.archivo, fontSize: 48, lineHeight: 1.05,
              fontWeight: 800, letterSpacing: "-.03em", margin: 0,
              textWrap: "balance" }}>
              Le terroir comme<br/>protocole.
            </h2>
            <p style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.55,
              opacity: .85, marginTop: 18, maxWidth: 460, textWrap: "pretty" }}>
              25 ans d'essais multilocaux dans le Sud-Ouest, en Italie,
              au Maroc et au Bénin. Chaque variété au catalogue est validée
              sur 3 zones climatiques minimum.
            </p>
          </div>
        </div>
        <div style={{ position: "absolute", bottom: 16, right: 24,
          fontFamily: FONTS.mono, fontSize: 10, color: BRAND.paper,
          opacity: .7, letterSpacing: ".15em" }}>
          PARCELLE B-04 · MOULEYDIER · 06.2025
        </div>
      </section>

      {/* PROCESS PHOTO GRID — From breeding to seed */}
      <section style={{ padding: "100px 32px", background: BRAND.paper,
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto" }}>
          <div style={{ display: "flex", justifyContent: "space-between",
            alignItems: "end", marginBottom: 40, gap: 40, flexWrap: "wrap" }}>
            <div>
              <h2 style={{ fontFamily: FONTS.archivo, fontSize: 56, lineHeight: 1,
                fontWeight: 800, letterSpacing: "-.035em", margin: 0,
                maxWidth: 700, textWrap: "balance" }}>
                Cinq à sept ans<br/>par variété.
              </h2>
            </div>
            <p style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.5,
              opacity: .75, maxWidth: 380, margin: 0, textWrap: "pretty" }}>
              Croisement piloté, sélection assistée par marqueurs,
              essais multilocaux. Chaque étape est protocolée et publiée.
            </p>
          </div>
          <div style={{ display: "grid", gridTemplateColumns: "1.4fr 1fr 1fr",
            gap: 14, height: 480 }}>
            {[
              { url: PHOTOS.lab_microscope, step: "01", label: "Génotypage",
                desc: "Marqueurs SSR & SNP", color: BRAND.blue },
              { url: PHOTOS.seedling, step: "02", label: "Sélection F2–F5",
                desc: "Serres climatisées · 6 cycles", color: BRAND.green },
              { url: PHOTOS.field_rows, step: "03", label: "Essais terrain",
                desc: "3 zones · 4 répétitions", color: BRAND.gold },
            ].map((p, i) => (
              <article key={i} style={{ position: "relative", borderRadius: 16,
                overflow: "hidden", border: `1px solid ${BRAND.line}` }}>
                <div style={{ position: "absolute", inset: 0,
                  backgroundImage: `url(${p.url})`,
                  backgroundSize: "cover", backgroundPosition: "center" }}/>
                <div style={{ position: "absolute", inset: 0,
                  background: `linear-gradient(180deg, transparent 30%, ${BRAND.ink}E0 100%)` }}/>
                <div style={{ position: "absolute", top: 18, left: 18,
                  fontFamily: FONTS.mono, fontSize: 11, fontWeight: 700,
                  color: BRAND.paper, letterSpacing: ".15em",
                  background: p.color, padding: "5px 10px", borderRadius: 6 }}>
                  {p.step}
                </div>
                <div style={{ position: "absolute", left: 22, right: 22, bottom: 22,
                  color: BRAND.paper }}>
                  <div style={{ fontFamily: FONTS.archivo, fontSize: 26, fontWeight: 800,
                    letterSpacing: "-.02em", lineHeight: 1.1 }}>{p.label}</div>
                  <div style={{ fontFamily: FONTS.mono, fontSize: 12, opacity: .85,
                    marginTop: 6, letterSpacing: ".05em" }}>{p.desc}</div>
                </div>
              </article>
            ))}
          </div>
        </div>
      </section>

      {/* RESISTANCE MATRIX — interactive heatmap */}
      <section style={{ padding: "100px 32px", background: BRAND.paper2,
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto" }}>
          <div style={{ display: "flex", justifyContent: "space-between", alignItems: "end",
            marginBottom: 32, gap: 40, flexWrap: "wrap" }}>
            <div>
              <h2 style={{ fontFamily: FONTS.archivo, fontSize: 48, fontWeight: 800,
                letterSpacing: "-.03em", margin: 0, textWrap: "pretty", maxWidth: 700 }}>
                {t("section_resistances")}
              </h2>
            </div>
            <div style={{ display: "flex", gap: 16, fontFamily: FONTS.mono, fontSize: 12 }}>
              <span style={{ display: "inline-flex", alignItems: "center", gap: 6 }}>
                <span style={{ width: 14, height: 14, borderRadius: 4, background: BRAND.green }}/>
                R · résistante
              </span>
              <span style={{ display: "inline-flex", alignItems: "center", gap: 6 }}>
                <span style={{ width: 14, height: 14, borderRadius: 4, background: BRAND.gold }}/>
                T · tolérante
              </span>
            </div>
          </div>
          <div style={{ background: BRAND.paper, borderRadius: 14, padding: 4,
            border: `1px solid ${BRAND.line}`, overflow: "auto" }}>
            <table style={{ borderCollapse: "separate", borderSpacing: 4, width: "100%",
              fontFamily: FONTS.body, fontSize: 12 }}>
              <thead>
                <tr>
                  <th style={{ textAlign: "left", padding: "8px 12px",
                    fontFamily: FONTS.mono, fontSize: 10, letterSpacing: ".12em",
                    opacity: .55, textTransform: "uppercase" }}>Variété</th>
                  {RESISTANCE_KEYS.map(r => (
                    <th key={r.id} style={{ padding: "8px 4px", fontFamily: FONTS.mono,
                      fontSize: 9, letterSpacing: ".08em", opacity: .55,
                      textTransform: "uppercase" }}>{r.short}</th>
                  ))}
                  <th style={{ padding: "8px 12px", fontFamily: FONTS.mono, fontSize: 10,
                    letterSpacing: ".12em", opacity: .55, textTransform: "uppercase",
                    textAlign: "right" }}>Yield %</th>
                </tr>
              </thead>
              <tbody>
                {VARIETIES.map(v => (
                  <tr key={v.code} onClick={() => setRoute({ name: "detail", code: v.code })}
                    style={{ cursor: "pointer" }}>
                    <td style={{ padding: "8px 12px", fontFamily: FONTS.archivo, fontSize: 14,
                      fontWeight: 700, letterSpacing: "-.01em",
                      background: v.isReference ? BRAND.greenSoft : "transparent",
                      borderRadius: 6 }}>
                      {v.code}
                      {v.isReference && <span style={{ marginLeft: 8, fontFamily: FONTS.mono,
                        fontSize: 9, color: BRAND.green, letterSpacing: ".15em",
                        fontWeight: 700 }}>★ REF</span>}
                    </td>
                    {RESISTANCE_KEYS.map(r => {
                      const k = v.resistances[r.id];
                      const bg = k === "R" ? BRAND.green : k === "Tol" ? BRAND.gold : BRAND.paper2;
                      const fg = k === "R" || k === "Tol" ? BRAND.paper : "rgba(15,26,20,.3)";
                      return (
                        <td key={r.id} style={{ padding: 0 }}>
                          <div style={{ height: 30, borderRadius: 6, background: bg, color: fg,
                            display: "flex", alignItems: "center", justifyContent: "center",
                            fontFamily: FONTS.mono, fontSize: 11, fontWeight: 700 }}>
                            {k === "R" ? "R" : k === "Tol" ? "T" : "·"}
                          </div>
                        </td>
                      );
                    })}
                    <td style={{ padding: "8px 12px", textAlign: "right",
                      fontFamily: FONTS.archivo, fontSize: 14, fontWeight: 700,
                      color: v.yieldPct >= 100 ? BRAND.green : BRAND.ink }}>
                      {v.yieldPct}
                    </td>
                  </tr>
                ))}
              </tbody>
            </table>
          </div>
        </div>
      </section>

      {/* THREE PILLARS — Producteurs / Industriels / Pairs (moved before FAQ) */}
      <section style={{ padding: "100px 32px",
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto" }}>
          <h2 style={{ fontFamily: FONTS.archivo, fontSize: 64, lineHeight: 1, fontWeight: 800,
            letterSpacing: "-.035em", margin: "0 0 56px", maxWidth: 800, textWrap: "pretty" }}>
            Pour qui travaillons-nous ?
          </h2>
          <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
            {[
              { icon: "◬", color: BRAND.green, title: "Producteurs", subtitle: "Europe · Afrique · MENA",
                desc: "Catalogue 16 variétés tabac. Filtrage par résistance, précocité, débouché. Devis 48h.",
                cta: "Demander un devis", count: "95 % de notre marché" },
              { icon: "◭", color: BRAND.gold, title: "Cigarettiers & industriels", subtitle: "Création sur mesure",
                desc: "Variété spécifique en nicotine, profil aromatique, ou résistance ciblée. 36–60 mois de sélection.",
                cta: "Brief technique", count: "30 % de notre CA" },
              { icon: "◮", color: BRAND.blue, title: "Pairs scientifiques", subtitle: "Instituts & universités",
                desc: "Publications, données d'essais ouvertes, collaborations R&D avec INRAE et l'Institut du Tabac.",
                cta: "Espace publications", count: "12 publications · 4 partenaires" },
            ].map(p => (
              <article key={p.title} style={{ background: BRAND.paper, borderRadius: 16,
                padding: 32, border: `1px solid ${BRAND.line}`,
                display: "flex", flexDirection: "column", gap: 20 }}>
                <div style={{ display: "flex", alignItems: "center",
                  justifyContent: "space-between" }}>
                  <span style={{ fontSize: 36, color: p.color, lineHeight: 1 }}>{p.icon}</span>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 10, opacity: .55,
                    letterSpacing: ".15em" }}>{p.count}</span>
                </div>
                <div>
                  <h3 style={{ fontFamily: FONTS.archivo, fontSize: 26, fontWeight: 800,
                    letterSpacing: "-.02em", margin: 0, color: p.color }}>{p.title}</h3>
                  <div style={{ fontFamily: FONTS.body, fontSize: 13, opacity: .65,
                    marginTop: 4 }}>{p.subtitle}</div>
                </div>
                <p style={{ fontFamily: FONTS.body, fontSize: 14, lineHeight: 1.55,
                  margin: 0, opacity: .8, textWrap: "pretty", flex: 1 }}>{p.desc}</p>
                <button style={{ background: p.color, color: BRAND.paper, border: "none",
                  padding: "12px 18px", borderRadius: 10, fontFamily: FONTS.sans, fontSize: 13,
                  fontWeight: 600, cursor: "pointer", justifySelf: "start" }}>
                  {p.cta} →
                </button>
              </article>
            ))}
          </div>
        </div>
      </section>

      {/* FAQ — SEO-friendly long-form Q&A, mirrors JSON-LD FAQPage */}
      <section style={{ padding: "120px 32px", background: BRAND.paper, borderTop: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto" }}>
          <div style={{ display: "grid", gridTemplateColumns: "1fr 2fr", gap: 64, marginBottom: 56 }}>
            <div>
              <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
                color: BRAND.green, fontWeight: 700, marginBottom: 16 }}>05 / FAQ</div>
              <h2 style={{ fontFamily: FONTS.archivo, fontSize: 72, fontWeight: 800,
                letterSpacing: "-.035em", margin: 0, lineHeight: .95, color: BRAND.ink, textWrap: "balance" }}>
                Questions fréquentes
              </h2>
            </div>
            <p style={{ fontFamily: FONTS.body, fontSize: 19, lineHeight: 1.55,
              color: BRAND.inkSoft, margin: 0, alignSelf: "end", maxWidth: 640, textWrap: "pretty" }}>
              Vous êtes producteur, manufacture, institut de recherche ou journaliste : voici les
              réponses aux questions que l'on nous pose le plus souvent sur la sélection variétale
              du tabac et du chanvre, le catalogue 2026 et nos services de création sur mesure.
            </p>
          </div>
          <div style={{ display: "grid", gap: 0, borderTop: `1px solid ${BRAND.line2}` }}>
            {[
              {
                q: "Qu'est-ce que Bergerac Seed & Breeding ?",
                a: "Bergerac Seed & Breeding (BSB) est le seul semencier français spécialisé en sélection variétale du tabac Virginie et du chanvre industriel. Implanté à Bergerac (Dordogne, Nouvelle-Aquitaine) depuis 2003, BSB hérite de plus de 25 ans de données d'essais multilocaux conduits sur le bassin tabacole français. L'entreprise est indépendante, à capitaux familiaux, et travaille en partenariat avec l'INRAE, l'ITB, ARVALIS et plusieurs grandes manufactures européennes.",
              },
              {
                q: "Combien de variétés de tabac BSB propose-t-il au catalogue 2026 ?",
                a: "Le catalogue 2026 compte 16 variétés de tabac, structurées autour de la référence nationale ITB 683 (rendement = 100%). Plusieurs cultivars BSB la dépassent en rendement (BSB 6217 à 108%, BSB 6231 à 112%) tout en respectant les profils chimiques attendus par les manufactures (nicotine 1.8–2.6%, sucres réducteurs 14–22%). La gamme couvre Virginie flue-cured, Burley air-cured, et quelques cultivars Orientaux pour marchés de niche.",
              },
              {
                q: "BSB produit-il aussi des semences de chanvre ?",
                a: "Oui. Lancé en 2022 en réponse à la dynamique européenne sur le chanvre industriel, le programme BSB couvre 3 lignées complémentaires : (1) fibres longues pour textile et matériaux biosourcés, (2) graines pour alimentation et oléagineux, (3) cannabinoïdes (CBD) pour applications cosmétiques et thérapeutiques. Toutes les lignées affichent un taux THC inférieur à 0,3%, conforme à la réglementation européenne (UE 2021/2115).",
              },
              {
                q: "Quel est le délai de réponse à une demande de devis ?",
                a: "BSB s'engage à répondre à toute demande de devis sous 48 heures ouvrées. Chaque demande est qualifiée par un conseiller agronome dédié, qui propose le ou les cultivars les mieux adaptés à votre zone pédoclimatique, votre cahier des charges industriel (profil chimique cible) et votre tonnage prévisionnel. Le commercial vous recontacte ensuite pour finaliser quantités, conditionnement et logistique.",
              },
              {
                q: "BSB propose-t-il de la création variétale sur mesure ?",
                a: "Oui. Pour les cigarettiers, manufactures de tabac et instituts publics, BSB développe des variétés à profil ciblé : nicotine basse ou haute, sucres réducteurs spécifiques, arômes (Virginie sucré, Burley charpenté), résistances spécifiques (PVY, Phytophthora, nématodes). Le cycle complet va de 5 à 7 ans, du brief client à l'inscription officielle au catalogue européen, en passant par croisements, F1–F8, essais multi-environnementaux et DHS.",
              },
              {
                q: "Dans quels pays BSB exporte-t-il ses semences ?",
                a: "BSB exporte 95% de sa production. Les 7 marchés principaux sont : Italie (premier débouché export, ~30%), Espagne, Allemagne, Belgique, Maroc, Tunisie, Bénin. La France reste le marché historique avec une présence forte sur les bassins tabacoles d'Aquitaine et de Midi-Pyrénées. La distribution se fait via un réseau de 12 partenaires régionaux (négoces, coopératives, instituts).",
              },
              {
                q: "Comment garantissez-vous la qualité génétique des semences ?",
                a: "Toutes nos semences sont produites en isolement géographique strict, avec contrôle de pureté variétale par marqueurs SNP sur un échantillon de chaque lot. La station de Bergerac dispose de 18 hectares d'essais et de chambres climatiques pour les tests précoces. Chaque variété est suivie sur 3 ans minimum d'essais multilocaux avant inscription, et les lots commerciaux subissent un contrôle germination + sanitaire (HLVd, TMV, CMV) avant expédition.",
              },
              {
                q: "Travaillez-vous avec la recherche publique ?",
                a: "Oui, et c'est au cœur de notre méthode. BSB a 7 partenariats actifs avec l'INRAE (Bordeaux, Avignon), l'ITB, ARVALIS-Institut du végétal, le CIRAD, et plusieurs universités européennes. Ces collaborations couvrent : génomique du tabac (séquençage de 240 accessions), résistances variétales, bilan carbone du chanvre industriel, et techniques de sélection assistée par marqueurs (SAM).",
              },
            ].map((f, i) => (
              <details key={i} style={{ borderBottom: `1px solid ${BRAND.line2}`, padding: "28px 0" }}>
                <summary style={{ fontFamily: FONTS.archivo, fontSize: 22, fontWeight: 700,
                  color: BRAND.ink, cursor: "pointer", listStyle: "none", display: "flex",
                  justifyContent: "space-between", alignItems: "center", gap: 24, letterSpacing: "-.01em" }}>
                  <span style={{ flex: 1, textWrap: "pretty" }}>{f.q}</span>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 11, color: BRAND.green,
                    fontWeight: 700, letterSpacing: ".15em" }}>0{i+1}</span>
                </summary>
                <p style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.65,
                  color: BRAND.inkSoft, margin: "20px 0 0", maxWidth: 920, textWrap: "pretty" }}>
                  {f.a}
                </p>
              </details>
            ))}
          </div>
        </div>
      </section>

      {/* SEO LONG-FORM — Hidden H2 trail + about block for crawlers and accessibility */}
      <section style={{ padding: "100px 32px", background: BRAND.surface, borderTop: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1320, margin: "0 auto", display: "grid",
          gridTemplateColumns: "1fr 1fr", gap: 64 }}>
          <div>
            <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
              color: BRAND.green, fontWeight: 700, marginBottom: 16 }}>06 / À PROPOS</div>
            <h2 style={{ fontFamily: FONTS.archivo, fontSize: 56, fontWeight: 800,
              letterSpacing: "-.035em", margin: 0, lineHeight: 1, color: BRAND.ink, textWrap: "balance" }}>
              Le seul semencier français spécialisé tabac et chanvre
            </h2>
            <p style={{ fontFamily: FONTS.body, fontSize: 17, lineHeight: 1.65,
              color: BRAND.inkSoft, marginTop: 28, textWrap: "pretty" }}>
              Bergerac Seed & Breeding occupe une position singulière en Europe : un semencier
              indépendant, intégré verticalement de la sélection variétale à la production de
              semences certifiées, focalisé sur deux espèces aux enjeux agronomiques et
              industriels distincts mais complémentaires — le tabac Virginie et le chanvre
              industriel.
            </p>
            <p style={{ fontFamily: FONTS.body, fontSize: 17, lineHeight: 1.65,
              color: BRAND.inkSoft, marginTop: 16, textWrap: "pretty" }}>
              Notre approche combine sélection traditionnelle (croisements dirigés, généalogique,
              backcross) et outils modernes (marqueurs moléculaires, phénotypage haut-débit,
              séquençage). Nous refusons l'OGM et le forçage de rendement au détriment des
              profils qualitatifs : ce qui compte pour un cigarettier, c'est la régularité de la
              feuille année après année, dans un marché qui se contracte mais se sophistique.
            </p>
          </div>
          <div>
            <h3 style={{ fontFamily: FONTS.archivo, fontSize: 24, fontWeight: 800,
              letterSpacing: "-.02em", margin: "0 0 20px", color: BRAND.ink }}>
              Domaines d'expertise
            </h3>
            <ul style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.7,
              color: BRAND.inkSoft, margin: 0, paddingLeft: 20, textWrap: "pretty" }}>
              <li><strong style={{ color: BRAND.ink }}>Sélection variétale tabac Virginie & Burley</strong> — 16 cultivars actifs au catalogue, références françaises et marchés export.</li>
              <li style={{ marginTop: 10 }}><strong style={{ color: BRAND.ink }}>Création variétale sur mesure</strong> — programmes 5–7 ans pour cigarettiers et instituts.</li>
              <li style={{ marginTop: 10 }}><strong style={{ color: BRAND.ink }}>Programme chanvre industriel</strong> — fibres, graines, cannabinoïdes, &lt; 0.3% THC.</li>
              <li style={{ marginTop: 10 }}><strong style={{ color: BRAND.ink }}>Production de semences certifiées</strong> — isolement géographique, contrôle SNP, certification UE.</li>
              <li style={{ marginTop: 10 }}><strong style={{ color: BRAND.ink }}>Données d'essais multilocaux</strong> — 25 ans d'historique, 18 ha de plateformes, modélisation génotype × environnement.</li>
              <li style={{ marginTop: 10 }}><strong style={{ color: BRAND.ink }}>R&D collaborative</strong> — INRAE, ITB, ARVALIS, CIRAD, manufactures européennes.</li>
            </ul>
            <h3 style={{ fontFamily: FONTS.archivo, fontSize: 24, fontWeight: 800,
              letterSpacing: "-.02em", margin: "32px 0 20px", color: BRAND.ink }}>
              Marchés servis
            </h3>
            <p style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.65,
              color: BRAND.inkSoft, margin: 0, textWrap: "pretty" }}>
              France · Italie · Espagne · Allemagne · Belgique · Maroc · Tunisie · Bénin · Suisse.
              Distribution via 12 partenaires régionaux (négoces, coopératives, instituts) et vente
              directe aux manufactures sur contrats pluriannuels.
            </p>
          </div>
        </div>
      </section>

      {/* CONTACT band — lead-gen */}
      <section style={{ padding: "80px 32px", background: BRAND.green, color: BRAND.paper }}>
        <div style={{ maxWidth: 1320, margin: "0 auto", display: "grid",
          gridTemplateColumns: "1.2fr 1fr", gap: 48, alignItems: "center" }}>
          <div>
            <h2 style={{ fontFamily: FONTS.archivo, fontSize: 64, fontWeight: 800,
              letterSpacing: "-.035em", margin: 0, lineHeight: 1, textWrap: "balance" }}>
              Producteur, industriel, chercheur ?
            </h2>
            <p style={{ fontFamily: FONTS.body, fontSize: 17, opacity: .8, marginTop: 20,
              maxWidth: 520, textWrap: "pretty" }}>
              Devis catalogue, brief de création variétale, ou demande de données :
              le bon interlocuteur sous 48 h.
            </p>
          </div>
          <div style={{ display: "flex", flexDirection: "column", gap: 12 }}>
            {[
              ["Catalogue & devis", "commercial@bergeracseed.com"],
              ["Création sur mesure", "breeding@bergeracseed.com"],
              ["Recherche & presse", "research@bergeracseed.com"],
            ].map(([l, e]) => (
              <a key={e} style={{ background: "rgba(248,245,238,.08)",
                border: "1px solid rgba(248,245,238,.18)", borderRadius: 10,
                padding: "16px 20px", display: "flex", justifyContent: "space-between",
                alignItems: "center", cursor: "pointer", color: BRAND.paper }}>
                <span style={{ fontFamily: FONTS.sans, fontSize: 15, fontWeight: 600 }}>{l}</span>
                <span style={{ fontFamily: FONTS.mono, fontSize: 12, color: BRAND.gold }}>{e} →</span>
              </a>
            ))}
          </div>
        </div>
      </section>
    </main>
  );
}

// ───────────────────────────────────────────────────────
// C2 — "Chanvre Forward" — hemp-first variant
// Modern editorial, sage + green palette, lighter weight.
// ───────────────────────────────────────────────────────
function C2Home({ t, lang, setLang, setRoute }) {
  return (
    <main style={{ background: "#FBFBF6", color: BRAND.ink, fontFamily: FONTS.body }}>
      <header style={{ position: "sticky", top: 0, zIndex: 20, background: "rgba(251,251,246,.92)",
        backdropFilter: "blur(8px)", borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1280, margin: "0 auto", padding: "20px 32px",
          display: "flex", alignItems: "center", gap: 32 }}>
          <a onClick={() => setRoute({ name: "home" })}
            style={{ cursor: "pointer", display: "inline-flex", alignItems: "center",
              lineHeight: 0 }}>
            <img src="assets/logo.jpeg" alt="Bergerac Seed &amp; Breeding"
              style={{ height: 48, width: "auto", display: "block" }}/>
          </a>
          <nav style={{ display: "flex", gap: 24, marginLeft: 32, fontFamily: FONTS.body,
            fontSize: 14, fontWeight: 500 }}>
            {[
              ["varieties", lang==="fr"?"Nos variétés":"Varieties"],
              ["contact", t("nav_contact")],
            ].map(([k, l]) => (
              <a key={k} onClick={() => setRoute({ name: k })}
                style={{ cursor: "pointer", color: k === "varieties" ? BRAND.green : BRAND.ink,
                  fontWeight: k === "varieties" ? 700 : 500 }}>{l}</a>
            ))}
          </nav>
          <button onClick={() => setRoute({ name: "contact" })}
            style={{ marginLeft: "auto", background: BRAND.green, color: BRAND.paper,
            border: "none", padding: "10px 18px", borderRadius: 999, fontFamily: FONTS.body,
            fontSize: 13, fontWeight: 700, cursor: "pointer" }}>
            {t("cta_quote")} →
          </button>
          {/* FR / EN switch */}
          <div style={{ display: "flex", alignItems: "center", gap: 0, marginLeft: 12,
            border: `1px solid ${BRAND.line2}`, borderRadius: 999, padding: 3,
            fontFamily: FONTS.mono, fontSize: 11, fontWeight: 700, letterSpacing: ".12em" }}>
            {["fr", "en"].map(l => (
              <button key={l} onClick={() => setLang(l)}
                style={{ background: lang === l ? BRAND.green : "transparent",
                  color: lang === l ? BRAND.paper : BRAND.ink,
                  border: "none", padding: "6px 12px", borderRadius: 999,
                  cursor: "pointer", fontFamily: "inherit", fontSize: "inherit",
                  fontWeight: "inherit", letterSpacing: "inherit",
                  textTransform: "uppercase", transition: "background .15s" }}>
                {l}
              </button>
            ))}
          </div>
        </div>
      </header>

      {/* HERO — Hemp-forward */}
      <section style={{ padding: "100px 32px 80px",
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1280, margin: "0 auto" }}>
          <div style={{ fontFamily: FONTS.mono, fontSize: 12, letterSpacing: ".22em",
            color: BRAND.green, marginBottom: 32, fontWeight: 700,
            textTransform: "uppercase" }}>
            ✶ {lang === "fr" ? "Catalogue 2026 — 16 variétés Virginia" : "2026 catalogue — 16 Virginia varieties"}
          </div>
          <h1 style={{ fontFamily: FONTS.display, fontSize: "clamp(72px, 11vw, 168px)",
            lineHeight: .85, fontWeight: 400, letterSpacing: "-.045em",
            margin: 0, color: BRAND.ink, textWrap: "balance" }}>
            {lang === "fr" ? <><em style={{ color: BRAND.green, fontWeight: 500 }}>Tabac.</em> Chanvre.<br/>Une <em>maison,</em> deux cultures.</>
              : <><em style={{ color: BRAND.green, fontWeight: 500 }}>Tobacco.</em> Hemp.<br/>One <em>house,</em> two crops.</>}
          </h1>
          <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 60,
            marginTop: 56, alignItems: "end" }}>
            <p style={{ fontFamily: FONTS.body, fontSize: 19, lineHeight: 1.55,
              color: BRAND.ink, opacity: .8, margin: 0, textWrap: "pretty",
              maxWidth: 540 }}>
              {lang === "fr"
                ? <>Sélectionneur français de tabac depuis 1927. 16 cultivars Virginia inscrits, dont la référence nationale ITB 683. Producteurs en Europe, Afrique et Moyen-Orient — et, depuis 2022, un programme chanvre en complément.</>
                : <>French tobacco breeder since 1927. 16 registered Virginia cultivars, including the national reference ITB 683. Growers across Europe, Africa and the Middle East — plus, since 2022, a complementary hemp programme.</>}
            </p>
            <div style={{ display: "flex", gap: 12, justifyContent: "end" }}>
              <button onClick={() => setRoute({ name: "varieties" })}
                style={{ background: BRAND.green, color: BRAND.paper, border: "none",
                padding: "16px 24px", borderRadius: 999, fontFamily: FONTS.body, fontSize: 14,
                fontWeight: 700, cursor: "pointer" }}>
                {lang === "fr" ? "Catalogue tabac →" : "Tobacco catalogue →"}
              </button>
              <button onClick={() => setRoute({ name: "hemp" })}
                style={{ background: "transparent", color: BRAND.ink,
                  border: `1px solid ${BRAND.line2}`, padding: "16px 24px", borderRadius: 999,
                  fontFamily: FONTS.body, fontSize: 14, fontWeight: 600, cursor: "pointer" }}>
                {lang === "fr" ? "Programme chanvre" : "Hemp programme"}
              </button>
            </div>
          </div>
        </div>
      </section>

      {/* TABAC — section principale (le cœur du métier) */}
      <section style={{ padding: "120px 32px", background: BRAND.paper2,
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1280, margin: "0 auto" }}>
          <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 60,
            alignItems: "end", marginBottom: 56 }}>
            <div>
              <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
                color: BRAND.green, marginBottom: 16, fontWeight: 700 }}>
                ◐ {lang === "fr" ? "99 ANS DE SÉLECTION" : "99 YEARS OF BREEDING"}
              </div>
              <h2 style={{ fontFamily: FONTS.display, fontSize: 96, fontWeight: 400,
                letterSpacing: "-.04em", margin: 0, lineHeight: .92, color: BRAND.ink,
                textWrap: "balance" }}>
                {lang === "fr"
                  ? <><em>Virginia,</em> la signature française.</>
                  : <><em>Virginia,</em> the French signature.</>}
              </h2>
            </div>
            <div>
              <p style={{ fontFamily: FONTS.body, fontSize: 18, lineHeight: 1.55,
                opacity: .8, margin: "0 0 24px", textWrap: "pretty", maxWidth: 520 }}>
                {lang === "fr"
                  ? <>16 cultivars inscrits, dont la référence nationale <em>ITB 683</em>. Croisements complexes, tolérance Orobanche, résistances PVY/TSWV/PMM — un patrimoine génétique unique en Europe, distribué dans plus de 20 pays.</>
                  : <>16 registered cultivars, including the national reference <em>ITB 683</em>. Complex crosses, Orobanche tolerance, PVY/TSWV/PMM resistances — a genetic patrimony unique in Europe, distributed in 20+ countries.</>}
              </p>
              <button onClick={() => setRoute({ name: "varieties" })}
                style={{ background: BRAND.green, color: BRAND.paper, border: "none",
                  padding: "16px 26px", borderRadius: 999, fontFamily: FONTS.body, fontSize: 14,
                  fontWeight: 700, cursor: "pointer" }}>
                {lang === "fr" ? "Catalogue 2026 →" : "2026 catalogue →"}
              </button>
            </div>
          </div>
          <div style={{ borderRadius: 18, overflow: "hidden", aspectRatio: "21/9",
            border: `1px solid ${BRAND.line}`, marginBottom: 32 }}>
            <img src={PHOTOS.tobacco_field} alt="" style={{ width: "100%",
              height: "100%", objectFit: "cover", display: "block" }}/>
          </div>
          <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
            {VARIETIES.filter(v => v.isReference || v.isNew).slice(0, 6).map(v => (
              <article key={v.code} onClick={() => setRoute({ name: "detail", code: v.code })}
                style={{ cursor: "pointer", background: BRAND.paper, borderRadius: 14,
                  padding: 24, border: `1px solid ${BRAND.line}`,
                  display: "flex", flexDirection: "column", gap: 12 }}>
                <div style={{ display: "flex", justifyContent: "space-between",
                  alignItems: "start" }}>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 10, color: BRAND.green,
                    letterSpacing: ".18em", fontWeight: 700 }}>
                    ● {v.isReference ? (lang === "fr" ? "RÉFÉRENCE" : "REFERENCE") : (lang === "fr" ? "NOUVELLE" : "NEW")}
                  </span>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 9, opacity: .55,
                    letterSpacing: ".15em" }}>{v.year}</span>
                </div>
                <div style={{ fontFamily: FONTS.display, fontSize: 40, fontWeight: 500,
                  letterSpacing: "-.025em", lineHeight: 1 }}>{v.code}</div>
                <p style={{ fontFamily: FONTS.body, fontSize: 13, lineHeight: 1.5,
                  margin: 0, opacity: .8, textWrap: "pretty", flex: 1 }}>{v.headline}</p>
                <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 10,
                  paddingTop: 14, borderTop: `1px solid ${BRAND.line}` }}>
                  <div>
                    <div style={{ fontFamily: FONTS.mono, fontSize: 9,
                      letterSpacing: ".15em", opacity: .55 }}>RDT</div>
                    <div style={{ fontFamily: FONTS.display, fontSize: 22, fontWeight: 500 }}>
                      {v.yieldPct}%
                    </div>
                  </div>
                  <div>
                    <div style={{ fontFamily: FONTS.mono, fontSize: 9,
                      letterSpacing: ".15em", opacity: .55 }}>QUALITÉ</div>
                    <div style={{ fontFamily: FONTS.display, fontSize: 22, fontWeight: 500,
                      color: BRAND.green }}>{v.qualityPct}%</div>
                  </div>
                </div>
              </article>
            ))}
          </div>
        </div>
      </section>

      {/* CHANVRE — la diversification (le complément) */}
      <section style={{ padding: "80px 32px", background: BRAND.hempSoft }}>
        <div style={{ maxWidth: 1280, margin: "0 auto" }}>
          <div style={{ display: "grid", gridTemplateColumns: "1.4fr 1fr", gap: 48,
            alignItems: "end", marginBottom: 48 }}>
            <div>
              <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
                color: BRAND.hemp, marginBottom: 12, fontWeight: 700 }}>
                ◐ {lang === "fr" ? "DIVERSIFICATION 2022" : "2022 DIVERSIFICATION"}
              </div>
              <h2 style={{ fontFamily: FONTS.display, fontSize: 64, fontWeight: 400,
                letterSpacing: "-.03em", margin: 0, maxWidth: 760, textWrap: "pretty" }}>
                {lang === "fr"
                  ? <>Le <em>chanvre,</em> notre seconde culture.</>
                  : <><em>Hemp,</em> our second crop.</>}
              </h2>
              <p style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.55,
                opacity: .75, margin: "20px 0 0", maxWidth: 540, textWrap: "pretty" }}>
                {lang === "fr"
                  ? <>Trois lignées dérivées de notre savoir-faire sélection : fibres longues, graines alimentaires, cannabinoïdes — toutes &lt; 0,3 % THC, certifiées Union européenne.</>
                  : <>Three lines derived from our breeding expertise: long fibres, food grain, cannabinoids — all &lt; 0.3% THC, EU-certified.</>}
              </p>
            </div>
            <div style={{ borderRadius: 14, overflow: "hidden", aspectRatio: "5/3",
              border: `1px solid ${BRAND.line}` }}>
              <img src={PHOTOS.seedling} alt="" style={{ width: "516px", height: "100%",
                objectFit: "cover", display: "block" }}/>
            </div>
          </div>
          <div style={{ display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 14 }}>
            {HEMP_VARIETIES.map(h => (
              <article key={h.code} onClick={() => setRoute({ name: "hempLine", lineId: h.code })}
                style={{ cursor: "pointer", background: BRAND.paper, borderRadius: 14,
                padding: 28, border: `1px solid ${BRAND.line}`, minHeight: 320,
                display: "flex", flexDirection: "column", gap: 16 }}>
                <div style={{ display: "flex", justifyContent: "space-between",
                  alignItems: "start" }}>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 10, color: BRAND.hemp,
                    letterSpacing: ".18em", fontWeight: 700 }}>
                    ● {(lang === "fr" ? h.line : h.lineEn).toUpperCase()}
                  </span>
                  {h.isNew && <span style={{ fontFamily: FONTS.mono, fontSize: 9,
                    background: BRAND.hemp, color: BRAND.paper, padding: "3px 8px",
                    borderRadius: 999, letterSpacing: ".1em", fontWeight: 700 }}>
                    {h.year}
                  </span>}
                </div>
                <div style={{ fontFamily: FONTS.display, fontSize: 48, fontWeight: 400,
                  letterSpacing: "-.025em", lineHeight: 1, color: BRAND.green2 }}>
                  {h.code}
                </div>
                <p style={{ fontFamily: FONTS.body, fontSize: 14, lineHeight: 1.55,
                  margin: 0, opacity: .85, textWrap: "pretty", flex: 1 }}>
                  {lang === "fr" ? h.headline : h.headlineEn}
                </p>
                <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 10,
                  paddingTop: 16, borderTop: `1px solid ${BRAND.line}` }}>
                  <div>
                    <div style={{ fontFamily: FONTS.mono, fontSize: 9,
                      letterSpacing: ".15em", opacity: .55 }}>RDT</div>
                    <div style={{ fontFamily: FONTS.display, fontSize: 22, fontWeight: 500 }}>
                      {h.yield}
                    </div>
                  </div>
                  <div>
                    <div style={{ fontFamily: FONTS.mono, fontSize: 9,
                      letterSpacing: ".15em", opacity: .55 }}>THC</div>
                    <div style={{ fontFamily: FONTS.display, fontSize: 22, fontWeight: 500,
                      color: BRAND.green }}>{h.thc}</div>
                  </div>
                </div>
                <div style={{ fontFamily: FONTS.body, fontSize: 12, color: BRAND.ink,
                  opacity: .65, fontStyle: "italic" }}>
                  → {lang === "fr" ? h.use : h.useEn}
                </div>
              </article>
            ))}
          </div>
        </div>
      </section>

      {/* FAQ — editorial Q&A, mirrors JSON-LD FAQPage */}
      <section style={{ padding: "120px 32px", background: BRAND.paper,
        borderBottom: `1px solid ${BRAND.line}` }}>
        <div style={{ maxWidth: 1280, margin: "0 auto" }}>
          <div style={{ display: "grid", gridTemplateColumns: "1fr 1.6fr", gap: 80,
            marginBottom: 64, alignItems: "end" }}>
            <div>
              <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
                color: BRAND.hemp, marginBottom: 16, fontWeight: 700 }}>◐ QUESTIONS</div>
              <h2 style={{ fontFamily: FONTS.display, fontSize: 88, fontWeight: 400,
                letterSpacing: "-.04em", margin: 0, lineHeight: .92, color: BRAND.ink,
                textWrap: "balance" }}>
                <em>Ce qu'on</em><br/>nous demande<br/><em>le plus.</em>
              </h2>
            </div>
            <p style={{ fontFamily: FONTS.body, fontSize: 19, lineHeight: 1.6,
              color: BRAND.ink, opacity: .75, margin: 0, maxWidth: 580, textWrap: "pretty" }}>
              Producteurs, manufactures, instituts, journalistes : voici les réponses
              aux questions qui reviennent le plus souvent — sur la sélection variétale
              du tabac, le programme chanvre, le catalogue 2026 et nos services de
              création sur mesure.
            </p>
          </div>
          <div style={{ display: "grid", gap: 0, borderTop: `1px solid ${BRAND.line2}` }}>
            {[
              { q: "Qu'est-ce que Bergerac Seed & Breeding ?",
                a: "Bergerac Seed & Breeding (BSB) est le seul semencier français spécialisé en sélection variétale du tabac Virginie et du chanvre industriel. Implanté à Bergerac (Dordogne, Nouvelle-Aquitaine) depuis 2003, BSB hérite de plus de 25 ans de données d'essais multilocaux conduits sur le bassin tabacole français. L'entreprise est indépendante, à capitaux familiaux, et travaille en partenariat avec l'INRAE, l'ITB, ARVALIS et plusieurs grandes manufactures européennes." },
              { q: "Combien de variétés de tabac BSB propose-t-il au catalogue 2026 ?",
                a: "Le catalogue 2026 compte 16 variétés, structurées autour de la référence nationale ITB 683 (rendement = 100%). Plusieurs cultivars BSB la dépassent en rendement (BSB 6217 à 108%, BSB 6231 à 112%) tout en respectant les profils chimiques attendus par les manufactures (nicotine 1.8–2.6%, sucres réducteurs 14–22%). La gamme couvre Virginie flue-cured, Burley air-cured, et quelques cultivars Orientaux pour marchés de niche." },
              { q: "BSB produit-il aussi des semences de chanvre ?",
                a: "Oui. Lancé en 2022 en réponse à la dynamique européenne sur le chanvre industriel, le programme BSB couvre 3 lignées complémentaires : (1) fibres longues pour textile et matériaux biosourcés, (2) graines pour alimentation et oléagineux, (3) cannabinoïdes (CBD) pour applications cosmétiques et thérapeutiques. Toutes les lignées affichent un taux THC inférieur à 0,3%, conforme à la réglementation européenne (UE 2021/2115)." },
              { q: "Quel est le délai de réponse à une demande de devis ?",
                a: "BSB s'engage à répondre à toute demande de devis sous 48 heures ouvrées. Chaque demande est qualifiée par un conseiller agronome dédié, qui propose le ou les cultivars les mieux adaptés à votre zone pédoclimatique, votre cahier des charges industriel (profil chimique cible) et votre tonnage prévisionnel. Le commercial vous recontacte ensuite pour finaliser quantités, conditionnement et logistique." },
              { q: "BSB propose-t-il de la création variétale sur mesure ?",
                a: "Oui. Pour les cigarettiers, manufactures de tabac et instituts publics, BSB développe des variétés à profil ciblé : nicotine basse ou haute, sucres réducteurs spécifiques, arômes (Virginie sucré, Burley charpenté), résistances spécifiques (PVY, Phytophthora, nématodes). Le cycle complet va de 5 à 7 ans, du brief client à l'inscription officielle au catalogue européen, en passant par croisements, F1–F8, essais multi-environnementaux et DHS." },
              { q: "Dans quels pays BSB exporte-t-il ses semences ?",
                a: "BSB exporte 95% de sa production. Les 7 marchés principaux sont : Italie (premier débouché export, ~30%), Espagne, Allemagne, Belgique, Maroc, Tunisie, Bénin. La France reste le marché historique avec une présence forte sur les bassins tabacoles d'Aquitaine et de Midi-Pyrénées. La distribution se fait via un réseau de 12 partenaires régionaux (négoces, coopératives, instituts)." },
              { q: "Comment garantissez-vous la qualité génétique des semences ?",
                a: "Toutes nos semences sont produites en isolement géographique strict, avec contrôle de pureté variétale par marqueurs SNP sur un échantillon de chaque lot. La station de Bergerac dispose de 18 hectares d'essais et de chambres climatiques pour les tests précoces. Chaque variété est suivie sur 3 ans minimum d'essais multilocaux avant inscription, et les lots commerciaux subissent un contrôle germination + sanitaire (HLVd, TMV, CMV) avant expédition." },
              { q: "Travaillez-vous avec la recherche publique ?",
                a: "Oui, et c'est au cœur de notre méthode. BSB a 7 partenariats actifs avec l'INRAE (Bordeaux, Avignon), l'ITB, ARVALIS-Institut du végétal, le CIRAD, et plusieurs universités européennes. Ces collaborations couvrent : génomique du tabac (séquençage de 240 accessions), résistances variétales, bilan carbone du chanvre industriel, et techniques de sélection assistée par marqueurs (SAM)." },
            ].map((f, i) => (
              <details key={i} style={{ borderBottom: `1px solid ${BRAND.line2}`, padding: "32px 0" }}>
                <summary style={{ fontFamily: FONTS.display, fontSize: 28, fontWeight: 400,
                  color: BRAND.ink, cursor: "pointer", listStyle: "none", display: "flex",
                  justifyContent: "space-between", alignItems: "baseline", gap: 28,
                  letterSpacing: "-.02em", lineHeight: 1.25 }}>
                  <span style={{ flex: 1, textWrap: "pretty" }}>
                    <em style={{ color: BRAND.hemp, fontWeight: 500, marginRight: 14,
                      fontSize: 22 }}>0{i+1}</em>
                    {f.q}
                  </span>
                  <span style={{ fontFamily: FONTS.mono, fontSize: 11, color: BRAND.hemp,
                    fontWeight: 700, letterSpacing: ".18em", flexShrink: 0 }}>+</span>
                </summary>
                <p style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.7,
                  color: BRAND.ink, opacity: .8, margin: "20px 0 0", maxWidth: 880,
                  paddingLeft: 56, textWrap: "pretty" }}>
                  {f.a}
                </p>
              </details>
            ))}
          </div>
        </div>
      </section>

      {/* À PROPOS — editorial long-form */}
      <section style={{ padding: "120px 32px", background: BRAND.hempSoft }}>
        <div style={{ maxWidth: 1280, margin: "0 auto" }}>
          <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 32,
            marginBottom: 72, height: 360 }}>
            <div style={{ borderRadius: 18, overflow: "hidden", border: `1px solid ${BRAND.line}` }}>
              <img src={PHOTOS.bergerac_landscape} alt="" style={{ width: "100%", height: "100%",
                objectFit: "cover", display: "block" }}/>
            </div>
            <div style={{ borderRadius: 18, overflow: "hidden", border: `1px solid ${BRAND.line}` }}>
              <img src={PHOTOS.lab_microscope} alt="" style={{ width: "100%", height: "100%",
                objectFit: "cover", display: "block" }}/>
            </div>
          </div>
          <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
            color: BRAND.hemp, marginBottom: 16, fontWeight: 700 }}>◐ {lang === "fr" ? "À PROPOS" : "ABOUT"}</div>
          <h2 style={{ fontFamily: FONTS.display, fontSize: 80, fontWeight: 400,
            letterSpacing: "-.04em", margin: "0 0 64px", lineHeight: .95, color: BRAND.ink,
            maxWidth: 1080, textWrap: "balance" }}>
            <em>Le seul semencier français</em> spécialisé tabac et chanvre.
          </h2>
          <div style={{ display: "grid", gridTemplateColumns: "1.2fr 1fr", gap: 80,
            alignItems: "start" }}>
            <div>
              <p style={{ fontFamily: FONTS.body, fontSize: 19, lineHeight: 1.65,
                color: BRAND.ink, margin: 0, textWrap: "pretty" }}>
                Bergerac Seed & Breeding occupe une position singulière en Europe : un
                semencier indépendant, intégré verticalement de la sélection variétale à
                la production de semences certifiées, focalisé sur deux espèces aux enjeux
                agronomiques et industriels distincts mais complémentaires — le tabac
                Virginie et le chanvre industriel.
              </p>
              <p style={{ fontFamily: FONTS.body, fontSize: 17, lineHeight: 1.7,
                color: BRAND.ink, opacity: .78, marginTop: 24, textWrap: "pretty" }}>
                Notre approche combine sélection traditionnelle (croisements dirigés,
                généalogique, backcross) et outils modernes (marqueurs moléculaires,
                phénotypage haut-débit, séquençage). <em style={{ color: BRAND.hemp,
                fontWeight: 500 }}>Nous refusons l'OGM</em> et le forçage de rendement
                au détriment des profils qualitatifs : ce qui compte pour un cigarettier,
                c'est la régularité de la feuille année après année, dans un marché qui
                se contracte mais se sophistique.
              </p>
              <div style={{ marginTop: 48, paddingTop: 32, borderTop: `1px solid ${BRAND.line2}` }}>
                <h3 style={{ fontFamily: FONTS.display, fontSize: 28, fontWeight: 400,
                  letterSpacing: "-.025em", margin: "0 0 20px", color: BRAND.green2 }}>
                  <em>Marchés servis.</em>
                </h3>
                <p style={{ fontFamily: FONTS.body, fontSize: 16, lineHeight: 1.7,
                  color: BRAND.ink, opacity: .8, margin: 0, textWrap: "pretty" }}>
                  France · Italie · Espagne · Allemagne · Belgique · Maroc · Tunisie ·
                  Bénin · Suisse. Distribution via 12 partenaires régionaux (négoces,
                  coopératives, instituts) et vente directe aux manufactures sur contrats
                  pluriannuels.
                </p>
              </div>
            </div>
            <div style={{ background: BRAND.paper, borderRadius: 18, padding: 40,
              border: `1px solid ${BRAND.line}` }}>
              <h3 style={{ fontFamily: FONTS.display, fontSize: 32, fontWeight: 400,
                letterSpacing: "-.025em", margin: "0 0 28px", color: BRAND.green2 }}>
                <em>Domaines</em><br/>d'expertise.
              </h3>
              <ul style={{ fontFamily: FONTS.body, fontSize: 15, lineHeight: 1.65,
                color: BRAND.ink, margin: 0, padding: 0, listStyle: "none",
                textWrap: "pretty" }}>
                {[
                  ["Sélection variétale tabac Virginie & Burley", "16 cultivars actifs au catalogue, références françaises et marchés export."],
                  ["Création variétale sur mesure", "programmes 5–7 ans pour cigarettiers et instituts."],
                  ["Programme chanvre industriel", "fibres, graines, cannabinoïdes, < 0.3% THC."],
                  ["Production de semences certifiées", "isolement géographique, contrôle SNP, certification UE."],
                  ["Données d'essais multilocaux", "25 ans d'historique, 18 ha de plateformes, modélisation génotype × environnement."],
                  ["R&D collaborative", "INRAE, ITB, ARVALIS, CIRAD, manufactures européennes."],
                ].map(([t, d], i) => (
                  <li key={i} style={{ display: "flex", gap: 16, padding: "16px 0",
                    borderBottom: i < 5 ? `1px solid ${BRAND.line}` : "none" }}>
                    <span style={{ fontFamily: FONTS.mono, fontSize: 11, color: BRAND.hemp,
                      fontWeight: 700, letterSpacing: ".15em", flexShrink: 0,
                      paddingTop: 3 }}>0{i+1}</span>
                    <div>
                      <strong style={{ fontFamily: FONTS.display, fontSize: 18,
                        fontWeight: 500, color: BRAND.ink, letterSpacing: "-.01em",
                        display: "block", marginBottom: 4 }}>{t}</strong>
                      <span style={{ opacity: .72 }}>{d}</span>
                    </div>
                  </li>
                ))}
              </ul>
            </div>
          </div>
        </div>
      </section>

      {/* SCIENCE strip */}
      <section style={{ padding: "80px 32px", background: BRAND.blue, color: BRAND.paper }}>
        <div style={{ maxWidth: 1280, margin: "0 auto" }}>
          <div style={{ fontFamily: FONTS.mono, fontSize: 11, letterSpacing: ".22em",
            color: BRAND.gold, marginBottom: 16, fontWeight: 700 }}>
            ◐ {t("section_science")}
          </div>
          <h2 style={{ fontFamily: FONTS.display, fontSize: 64, fontWeight: 400,
            letterSpacing: "-.03em", margin: "0 0 48px", textWrap: "balance" }}>
            <em>Publier, partager, prouver.</em>
          </h2>
          <div style={{ display: "grid", gridTemplateColumns: "repeat(2, 1fr)", gap: 12 }}>
            {PUBLICATIONS.map((p, i) => (
              <div key={i} style={{ background: "rgba(248,245,238,.06)", borderRadius: 12,
                padding: 22, border: "1px solid rgba(248,245,238,.12)" }}>
                <div style={{ fontFamily: FONTS.mono, fontSize: 12, color: BRAND.gold,
                  fontWeight: 700, letterSpacing: ".15em", marginBottom: 10 }}>
                  {p.year} · {p.journal}
                </div>
                <h4 style={{ fontFamily: FONTS.display, fontSize: 20, fontWeight: 400,
                  margin: 0, lineHeight: 1.25, letterSpacing: "-.01em",
                  textWrap: "pretty" }}>{p.title}</h4>
                <div style={{ fontFamily: FONTS.body, fontSize: 12, opacity: .65,
                  marginTop: 10, fontStyle: "italic" }}>{p.authors}</div>
              </div>
            ))}
          </div>
        </div>
      </section>
    </main>
  );
}

Object.assign(window, {
  BRAND, FONTS, CropToggle, QuoteCard,
  A2Home, B2Home, C2Home,
});