(async function loadLandingContent() {
  try {
    const response = await fetch(`/content/landing.json?v=${Date.now()}`, {
      cache: "no-store",
    });

    if (!response.ok) return;

    const content = await response.json();
    document.querySelectorAll("[data-content-key]").forEach((element) => {
      const key = element.getAttribute("data-content-key");
      const value = key ? content[key] : undefined;

      if (typeof value === "string") {
        element.textContent = value;
      }
    });

    document.querySelectorAll("[data-link-key]").forEach((element) => {
      const key = element.getAttribute("data-link-key");
      const value = key ? content[key] : undefined;

      if (typeof value === "string") {
        element.setAttribute("href", value);
      }
    });

    document.querySelectorAll("[data-image-key]").forEach((element) => {
      const key = element.getAttribute("data-image-key");
      const value = key ? content[key] : undefined;

      if (typeof value === "string") {
        element.setAttribute("src", value);
      }
    });

    document.querySelectorAll("[data-background-key]").forEach((element) => {
      const key = element.getAttribute("data-background-key");
      const value = key ? content[key] : undefined;

      if (typeof value === "string") {
        element.style.setProperty("--hero-image", `url(${JSON.stringify(value)})`);
      }
    });

    document.querySelectorAll("[data-form-action-key]").forEach((element) => {
      const key = element.getAttribute("data-form-action-key");
      const value = key ? content[key] : undefined;

      if (typeof value === "string") {
        element.setAttribute("action", value);
      }
    });

    document.querySelectorAll("[data-placeholder-key]").forEach((element) => {
      const key = element.getAttribute("data-placeholder-key");
      const value = key ? content[key] : undefined;

      if (typeof value === "string") {
        element.setAttribute("placeholder", value);
      }
    });

    document.documentElement.dataset.contentReady = "true";
    window.__PFP_CONTENT__ = content;
    document.dispatchEvent(new CustomEvent("pfp:content-ready", { detail: content }));
  } catch {
    // The server-rendered copy remains visible if the content file is unavailable.
  }
})();