/* DOMINANCE — Page 5: Declined (reject bucket → polite closure, no CTA)
   The reject path. We don't promise a personal reply, don't offer an email
   button, don't ask for a re-application. Just close the door respectfully
   so the prospect knows where they stand and we don't owe them follow-up. */

function DeclinedPage({ tweaks, navigate }) {
  return (
    <>
      <TopNav
        wordmark={true}
        status="Application reviewed"
        right={<span className="meta">REVIEWED</span>}
      />
      <main className="confirm">
        <div className="confirm-card fade-in">
          <img
            src="assets/dominance-wordmark-white.png"
            alt="DOMINANCE"
            className="confirm-wordmark fade-in-2"
          />

          <h1 className="display fade-in-2" style={{ fontSize: "clamp(40px, 5.6vw, 72px)" }}>
            Not the right fit.
          </h1>

          <p className="lede fade-in-3" style={{ textAlign: "center", maxWidth: "52ch" }}>
            Based on your answers, we wouldn't be a good match right now.
            Appreciate you taking the time.
          </p>

          <div className="confirm-divider fade-in-3" />

          <div className="confirm-sig fade-in-4" style={{ marginTop: 4 }}>— Nik</div>

          <div
            className="fade-in-4"
            style={{
              marginTop: 12,
              fontFamily: "var(--mono)",
              fontSize: 11,
              letterSpacing: "0.12em",
              textTransform: "uppercase",
              color: "var(--text-3)",
              display: "flex",
              gap: 14,
              alignItems: "center",
            }}
          >
            <span
              style={{
                width: 6,
                height: 6,
                background: "var(--text-3)",
                borderRadius: "50%",
              }}
            />
            <span>Ref. {Math.random().toString(36).slice(2, 8).toUpperCase()}-{new Date().getFullYear()}</span>
            <span>·</span>
            <span>Reviewed</span>
          </div>
        </div>
      </main>
      <Footer />
    </>
  );
}

window.DeclinedPage = DeclinedPage;