/* global React, Reveal, CountUp, Spark, Eyebrow, Ethno, DividerMark */

function NumbersClients() {
  const stats = [
    { to: 35000, suffix: "+", l: "ёлочных игрушек продано в сезон 2025" },
    { to: 1, prefix: "№", l: "в категории новогодних игрушек на Kaspi" },
    { to: 10, suffix: " млн+", l: "охватов в наших социальных сетях" },
    { to: 200, suffix: "+", l: "корпоративных заказов" },
    { to: 86, suffix: "%", l: "средний процент выкупа во всех магазинах" },
  ];
  // Real partner logos rendered as a single cream silhouette via CSS mask.
  // `file: null` = no official transparent logo could be sourced → styled wordmark.
  const wall = [
    { nm: "Marwin", file: "marwin.png" },
    { nm: "Galmart", file: "galmart.svg" },
    { nm: "Esentai Gourmet", file: "esentai.png" },
    { nm: "Colibri", file: "colibri.png" },
    { nm: "Столичный", file: "stolichny.png?v=2" },
    { nm: "Freedom Bank", file: "freedom.svg" },
    { nm: "ForteBank", file: "forte.png" },
    { nm: "Halyk Bank", file: "halyk.svg" },
  ];
  return React.createElement("section", { className: "lp-section lp-red", id: "cifry",
    style: { scrollMarginTop: 96, position: "relative", overflow: "hidden" } },
    React.createElement(Ethno, { color: "#fff", variant: "faint", parallax: 0.05 }),
    React.createElement("div", { className: "lp-glow", style: { width: 440, height: 440, right: "-8%", top: "-12%", background: "radial-gradient(circle, rgba(242,161,78,0.4), rgba(242,161,78,0))" } }),
    React.createElement("div", { className: "lp-inner lp-pad-lg" },
      React.createElement("div", { style: { maxWidth: 660 } },
        React.createElement(Reveal, null, React.createElement(Eyebrow, { onRed: true }, "Доказательства")),
        React.createElement(Reveal, { tag: "h2", className: "lp-h2", delay: 1, style: { color: "#fff", marginTop: 16 } }, "Mereke в цифрах"),
        React.createElement(Reveal, { tag: "p", className: "lp-lead", delay: 2, style: { color: "rgba(255,238,228,0.9)", marginTop: 16 } },
          "За первый сезон бренд стал заметным явлением — в Казахстане и за его пределами.")),
      React.createElement("div", { className: "lp-stats", style: { marginTop: 48 } },
        stats.map((s, i) => React.createElement(Reveal, { key: i, delay: (i % 4) + 1, className: "lp-stat" },
          React.createElement("div", { className: "v" }, React.createElement(CountUp, { to: s.to, prefix: s.prefix, suffix: s.suffix })),
          React.createElement("div", { className: "l" }, s.l)))),
      React.createElement(Reveal, { delay: 2, style: { marginTop: 44, display: "flex", justifyContent: "center" } },
        React.createElement("div", { className: "lp-glass", style: { padding: "16px 30px", display: "inline-flex", flexWrap: "wrap", gap: "10px 18px", alignItems: "center", justifyContent: "center", maxWidth: "100%" } },
          React.createElement("span", { style: { fontFamily: "var(--font-body)", fontWeight: 700, fontSize: 13, letterSpacing: "0.12em", textTransform: "uppercase", color: "var(--amber-400)", display: "inline-flex", alignItems: "center", gap: 8 } },
            React.createElement(Spark, { style: { width: 12, height: 12, color: "var(--amber-400)" } }), "Экспорт"),
          ["США", "Франция", "Германия", "ОАЭ", "Россия"].flatMap((c, i) => [
            i > 0 && React.createElement("span", { key: c + "-d", "aria-hidden": "true", style: { width: 4, height: 4, borderRadius: "50%", background: "rgba(255,221,196,0.5)" } }),
            React.createElement("span", { key: c, style: { fontFamily: "var(--font-display)", fontWeight: 700, fontSize: "clamp(1.05rem,2.4vw,1.4rem)", color: "#fff" } }, c),
          ]))),

      React.createElement("div", { className: "lp-statline" }),

      React.createElement(Reveal, null,
        React.createElement("span", { style: { fontFamily: "var(--font-body)", fontWeight: 700, fontSize: 13, letterSpacing: "0.12em", textTransform: "uppercase", color: "var(--amber-400)" } }, "Сети и компании, которые нам доверяют"),
        React.createElement("p", { style: { margin: "10px 0 0", color: "rgba(255,236,224,0.74)", fontSize: 15, maxWidth: "62ch" } }, "Продавались в крупнейших сетях в 2025-м и снова в 2026-м, выбраны как корпоративный подарок ведущими банками.")),
      React.createElement(Reveal, { delay: 1, className: "lp-logowall", style: { marginTop: 22 } },
        wall.map((b) => React.createElement("div", { key: b.nm, className: "lp-logo", role: "img", "aria-label": b.nm },
          b.file
            ? React.createElement("span", { className: `logo-mark${b.big ? " big" : ""}`, style: { "--logo": `url(/assets/logos/${b.file})` } })
            : React.createElement("span", { className: "logo-word" }, b.nm)))),

      React.createElement(Reveal, { style: { marginTop: 60 } }, React.createElement(DividerMark)),

      React.createElement("div", { style: { maxWidth: 640, marginTop: 48, marginLeft: "auto", marginRight: "auto", textAlign: "center" } },
        React.createElement(Reveal, null, React.createElement("div", { style: { display: "flex", justifyContent: "center" } }, React.createElement(Eyebrow, { onRed: true }, "Кто за брендом"))),
        React.createElement(Reveal, { tag: "h2", className: "lp-h2", delay: 1, style: { color: "#fff", marginTop: 16 } }, "Коллаборация elki.kz × Decode")),
      React.createElement(Reveal, { delay: 1, className: "lp-collab", style: { marginTop: 36 } },
        React.createElement("div", { className: "lp-collab-card" },
          React.createElement("h4", null, "elki.kz"),
          React.createElement("p", null, "Лидер по искусственным ёлкам и корпоративным проектам в Казахстане. Собственное производство — качество и масштаб, которые тянут любой объём в срок.")),
        React.createElement("div", { className: "x" }, "×"),
        React.createElement("div", { className: "lp-collab-card" },
          React.createElement("h4", null, "Decode"),
          React.createElement("p", null, "Крупнейший продюсерский центр Казахстана. Доступ к блогерам и звёздам — охват и культурный вес бренда на всю страну."))),
      React.createElement(Reveal, { delay: 2, style: { marginTop: 24, textAlign: "center" } },
        React.createElement("p", { style: { fontFamily: "var(--font-display)", fontStyle: "italic", fontSize: "clamp(1.15rem,2.6vw,1.5rem)", color: "var(--amber-300)", margin: 0, maxWidth: "40ch", marginLeft: "auto", marginRight: "auto" } },
          "Качество производства + охват на весь Казахстан. Объём и сроки — не проблема."))
    )
  );
}

Object.assign(window, { NumbersClients });
