/* global React, Reveal, useParallax, Spark, Eyebrow, Ethno, DividerMark, CTA */

function Problem() {
  const forget = ["Кружки", "Термокружки", "Ежедневники", "Сладкие наборы", "PowerBank", "Сертификаты"];
  return React.createElement("section", { className: "lp-section lp-cream-alt", id: "problema",
    style: { scrollMarginTop: 96, position: "relative", overflow: "hidden" } },
    React.createElement(Ethno, { color: "var(--red-800)", variant: "faint", parallax: 0.05 }),
    React.createElement("div", { className: "lp-inner lp-pad-lg" },
      React.createElement(Reveal, null, React.createElement(Eyebrow, null, "Боль · честно о подарках")),
      React.createElement("div", { className: "lp-grid lp-grid-2", style: { marginTop: 28, alignItems: "center", gap: 48 } },
        React.createElement("div", null,
          React.createElement(Reveal, { tag: "h2", className: "lp-h2", delay: 1 },
            "Кружки и ежедневники ", React.createElement("span", { className: "lp-red-ink" }, "забываются за неделю")),
          React.createElement(Reveal, { tag: "p", className: "lp-lead", delay: 2, style: { marginTop: 18 } },
            "Каждый год — одно и то же. Их передаривают, оставляют в офисе или убирают в дальний ящик. Бюджет потрачен — а эмоции не осталось."),
          React.createElement(Reveal, { className: "lp-forget", delay: 3, style: { marginTop: 26 } },
            forget.map((t) => React.createElement("span", { key: t }, t)))
        ),
        React.createElement(Reveal, { delay: 2 },
          React.createElement("div", { className: "lp-glass-light lp-glare", style: { padding: "34px 32px", position: "relative", overflow: "hidden" } },
            React.createElement("div", { className: "lp-glow", style: { width: 240, height: 240, right: "-14%", top: "-22%", background: "radial-gradient(circle, rgba(216,30,44,0.16), rgba(216,30,44,0))", filter: "blur(54px)" } }),
            React.createElement("span", { style: { fontFamily: "var(--font-body)", fontWeight: 700, fontSize: 12, letterSpacing: "0.14em", textTransform: "uppercase", color: "var(--text-accent)" } }, "А Mereke — остаётся"),
            React.createElement("p", { style: { fontFamily: "var(--font-display)", fontWeight: 800, fontSize: "clamp(1.5rem,3.2vw,2.05rem)", lineHeight: 1.18, color: "var(--ink-900)", margin: "14px 0 0" } },
              "Игрушку достают снова и снова. Каждый Новый год она напоминает о компании, которая подарила эту эмоцию."),
            React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 12, marginTop: 22, color: "var(--amber-600)" } },
              React.createElement(Spark, { style: { width: 18, height: 18 } }),
              React.createElement("span", { style: { fontFamily: "var(--font-body)", fontWeight: 700, color: "var(--ink-700)", fontSize: 15 } }, "Подарок, который живёт в семье годами"))
          )
        )
      )
    )
  );
}

function Emotion() {
  const bgRef = useParallax(0.12);
  const embers = [[8, 0, 14], [19, 3.5, 17], [31, 6, 15.5], [44, 1.6, 19], [57, 4.4, 16], [69, 2.2, 18.5], [82, 5.5, 20], [92, 7.2, 15], [14, 8.5, 16.5], [38, 10, 18], [63, 11.5, 14.5], [88, 9.2, 19.5]];
  return React.createElement("section", { className: "lp-band lp-pad-lg", id: "emotion",
    style: { scrollMarginTop: 96, position: "relative", overflow: "hidden", display: "flex", alignItems: "center", minHeight: "70vh" } },
    React.createElement("div", { className: "lp-band-bg", ref: bgRef, style: { position: "absolute", inset: 0, zIndex: 0 } },
      React.createElement("picture", { style: { display: "contents" } },
        React.createElement("source", { media: "(max-width: 640px)", srcSet: "assets/lifestyle/emotion-bg-mobile.jpg?v=2" }),
        React.createElement("img", { src: "assets/lifestyle/emotion-bg.jpg?v=2", alt: "Коллекция ёлочных игрушек Mereke", style: { width: "100%", height: "118%", objectFit: "cover", objectPosition: "center 50%", willChange: "transform" } }))),
    React.createElement("div", { className: "lp-band-scrim" }),
    React.createElement("div", { className: "lp-hero-embers", "aria-hidden": "true" },
      embers.map((e, i) => React.createElement("span", { key: i, style: { left: e[0] + "%", animationDelay: e[1] + "s", animationDuration: e[2] + "s" } }))),
    React.createElement("div", { className: "lp-inner", style: { position: "relative", zIndex: 2 } },
      React.createElement(Reveal, null, React.createElement(Eyebrow, { onRed: true }, "Почему Mereke остаётся в семье")),
      React.createElement(Reveal, { tag: "h2", className: "lp-h2", delay: 1, style: { color: "#fff", maxWidth: "none", marginTop: 18 } },
        "Мы продаём не стекло.", React.createElement("br"), "Мы продаём ", React.createElement("span", { className: "lp-amber" }, "момент.")),
      React.createElement("div", { style: { maxWidth: 640, marginTop: 24 } },
        React.createElement(Reveal, { tag: "p", className: "lp-lead", delay: 2, style: { color: "rgba(255,240,228,0.92)" } },
          "Сотрудник приходит домой после корпоратива. Открывает красивую коробку. Достаёт игрушку и вместе с детьми украшает ёлку."),
        React.createElement(Reveal, { tag: "p", className: "lp-lead", delay: 3, style: { color: "rgba(255,240,228,0.92)", marginTop: 16 } },
          "А через год — снова достаёт её. И каждый раз вспоминает компанию, которая подарила это тепло. Так рождаются настоящие традиции."))
    )
  );
}

function Features() {
  const F = [
    ["Современный нац. дизайн", "Культурный код Казахстана в премиальном, не сувенирном исполнении."],
    ["Ручная роспись", "Каждую игрушку расписывают вручную золотом по выдувному стеклу."],
    ["Лимитированные коллекции", "Дизайнерский продукт. Некоторые серии раскупают ещё до Нового года."],
    ["Премиальная упаковка", "Подарочные боксы, которые приятно открыть и не стыдно вручить."],
    ["Безопасные материалы", "Настоящее выдувное стекло и безопасные краски."],
    ["Семейная ценность", "Игрушка не заканчивается после праздника — она остаётся дома."],
  ];
  return React.createElement("section", { className: "lp-section", style: { background: "var(--surface-page)", position: "relative", overflow: "hidden" } },
    React.createElement(Ethno, { color: "var(--ink-900)", variant: "faint", parallax: 0.04 }),
    React.createElement("div", { className: "lp-inner lp-pad-lg" },
      React.createElement("div", { style: { maxWidth: 660 } },
        React.createElement(Reveal, null, React.createElement(Eyebrow, null, "Решение · почему это не сувенир")),
        React.createElement(Reveal, { tag: "h2", className: "lp-h2", delay: 1, style: { marginTop: 16 } }, "Дизайнерский продукт, а не сувенир"),
        React.createElement(Reveal, { tag: "p", className: "lp-lead", delay: 2, style: { marginTop: 16 } },
          "Шесть причин, по которым Mereke воспринимается как ценная вещь — и остаётся в семье на годы.")),
      React.createElement("div", { className: "lp-grid lp-grid-3", style: { marginTop: 48 } },
        F.map(([t, d], i) => React.createElement(Reveal, { key: t, delay: (i % 3) + 1 },
          React.createElement("div", { className: "lp-card lp-glare lp-feature" },
            React.createElement("span", { className: "ic" }, React.createElement(Spark)),
            React.createElement("h3", null, t),
            React.createElement("p", null, d))))
      ),
      React.createElement(Reveal, { style: { marginTop: 56 } }, React.createElement(DividerMark))
    )
  );
}

Object.assign(window, { Problem, Emotion, Features });