/* Legal — Julie Janes · GraceLife Coaching */
const { useState } = React;

const SECTIONS = [
  { id: "privacy", title: "Privacy Policy", body: [
    { kind: "p", text: "Last Updated: June 2026" },
    { kind: "p", text: "Julie Janes and GraceLife Coaching (\"I,\" \"me,\" or \"my\") is committed to protecting your privacy. The women who reach out are often sharing deeply personal things. I take that trust seriously, and I handle your information accordingly." },
    { kind: "p", text: "By using this website or participating in any coaching offering, you consent to the practices described in this policy. If anything is unclear, reach out directly — I'd rather explain it plainly than hide behind legal language." },
    { kind: "p", text: "I collect information you provide directly, including name, email, and phone for coaching purposes only. This information is never sold, rented, or shared with third parties for marketing purposes. For any data requests, contact juliesspa@yahoo.com." },
    { kind: "li", text: "Personal Data: Name, email, phone, and contact details from booking, contact form, or program enrollment." },
    { kind: "li", text: "Session Information: Notes and records, kept strictly confidential and never shared." },
    { kind: "li", text: "Payment Information: Processed through secure third-party processors. I do not store full card information on my servers." },
    { kind: "li", text: "Usage Data: Standard analytics — pages visited, time on site, device type — used only to improve the website." },
  ] },
  { id: "terms", title: "Terms of Service", body: [
    { kind: "p", text: "Last Updated: June 2026" },
    { kind: "p", text: "By accessing this site or services, you agree to these Terms. Lawful use only; no commercial reproduction without explicit written permission." },
    { kind: "p", text: "All content on this website — including text, frameworks, teachings, and program materials — is the intellectual property of Julie Janes and GraceLife Coaching and may not be reproduced, distributed, or used without permission." },
    { kind: "p", text: "Sessions are recorded with client consent. Recordings are the property of Julie Janes and GraceLife Coaching and are shared with the client for personal use only." },
    { kind: "p", text: "Behavior that is disrespectful, harmful, or contrary to the well-being of other women in shared spaces (such as the GraceLife Circle) may result in termination of services." },
    { kind: "p", text: "Jurisdiction: Wisconsin. We reserve the right to update these terms. Continued use of this website or services following changes constitutes acceptance of the revised terms." },
  ] },
  { id: "disclaimer", title: "Coaching Disclaimer", body: [
    { kind: "p", text: "Julie Janes and GraceLife Coaching provide faith-based life coaching. Coaching is not therapy, counseling, psychiatry, or any form of licensed mental health treatment. I am not a licensed therapist, psychologist, or medical professional." },
    { kind: "p", text: "The work we do together helps women identify root-level patterns — childhood wounds, attachment history, identity in Christ — and build grace-led practices for lasting transformation. It is designed to complement, not replace, professional mental health care." },
    { kind: "p", text: "If you are experiencing a mental health crisis, suicidal ideation, or acute trauma symptoms, please contact a licensed mental health professional or call 988 immediately. I encourage clients in therapy to continue alongside coaching." },
    { kind: "p", text: "Results from coaching vary based on individual circumstances, commitment, and willingness to engage in the process. Testimonials shared on this site reflect individual experiences and are not guarantees of specific outcomes." },
  ] },
  { id: "refund", title: "Refund Policy", body: [
    { kind: "p", text: "Refunds are handled with grace and on a case-by-case basis." },
    { kind: "li", text: "Grace & Truth (1:1 Coaching): 48-hour cancellation notice is required to reschedule a session. Sessions missed without 48-hour notice are non-refundable." },
    { kind: "li", text: "GraceLife Circle (Group Cohort): Due to limited cohort size, enrollment is non-refundable after the first call. Extenuating circumstances are handled with grace and on a case-by-case basis." },
    { kind: "li", text: "Renew Your Mind (Self-Paced Course): Due to immediate digital access, refunds are not available after enrollment. Contact me immediately for any technical issues and I will resolve them." },
    { kind: "p", text: "Extenuating circumstances are always considered with grace. If something unexpected happens, reach out directly and we will find a path forward together." },
  ] },
];

function App() {
  const [active, setActive] = useState("privacy");
  const section = SECTIONS.find((s) => s.id === active);
  return (
    <>
      <Nav current="" />
      <main>
        <PageHero
          eyebrow="Legal"
          title="The fine print"
          italic="you deserve to know."
          subtitle="Kept honest and plain. Please review these policies at your convenience. If anything is unclear, ask — I'd rather explain it directly than hide behind legal language."
        />
        <section className="section" style={{ background: "var(--cream)", paddingTop: 20 }}>
          <div className="container" style={{ display: "grid", gridTemplateColumns: "1fr 2.4fr", gap: 64, alignItems: "start" }}>
            <aside style={{ position: "sticky", top: 120 }}>
              <div className="smallcaps" style={{ color: "var(--terracotta)", marginBottom: 16 }}>✦ Quick navigation</div>
              <ol style={{ listStyle: "none", display: "flex", flexDirection: "column", gap: 0, borderTop: "1px solid var(--rule)" }}>
                {SECTIONS.map((s, i) => (
                  <li key={s.id}>
                    <button onClick={() => setActive(s.id)} style={{ background: "transparent", border: "none", display: "flex", gap: 14, alignItems: "center", width: "100%", padding: "14px 0", borderBottom: "1px solid var(--rule)", cursor: "pointer", textAlign: "left", color: active === s.id ? "var(--terracotta)" : "var(--walnut)" }}>
                      <span className="mono" style={{ fontSize: 11, color: "var(--terracotta)" }}>{String(i + 1).padStart(2, "0")}</span>
                      <span className="grotesk" style={{ fontSize: 14.5, fontWeight: active === s.id ? 500 : 400 }}>{s.title}</span>
                      {active === s.id && <span style={{ marginLeft: "auto", color: "var(--terracotta)" }}>→</span>}
                    </button>
                  </li>
                ))}
              </ol>
            </aside>
            <div>
              <article>
                <div className="smallcaps" style={{ color: "var(--terracotta)", marginBottom: 12 }}>Section · {section.id}</div>
                <h2 className="display" style={{ fontSize: "clamp(40px, 5vw, 64px)", color: "var(--walnut)", lineHeight: 0.98, fontWeight: 500, marginBottom: 40 }}>{section.title}</h2>
                <div style={{ maxWidth: 740, fontSize: 17, lineHeight: 1.7, color: "var(--walnut-soft)" }}>
                  {section.body.map((b, i) => b.kind === "li"
                    ? <div key={i} style={{ display: "grid", gridTemplateColumns: "32px 1fr", gap: 12, padding: "12px 0", borderBottom: "1px solid var(--rule)" }}>
                        <span className="mono" style={{ fontSize: 11, color: "var(--terracotta)", paddingTop: 6 }}>{String(i + 1).padStart(2, "0")}</span>
                        <p>{b.text}</p>
                      </div>
                    : <p key={i} style={{ marginBottom: 22 }}>{b.text}</p>
                  )}
                </div>
              </article>
            </div>
          </div>
        </section>
      </main>
      <Footer />
      <PaletteTweaksPanel />
    </>
  );
}

ReactDOM.createRoot(document.getElementById("root")).render(<App />);