/* EquiWork website, Services: index + five detail pages, data-driven. */
const svcDS = window.EquiWorkDesignSystem_e8fee2;

const SERVICES = [
  {
    slug: "policy", name: "Policy drafting",
    card: "An Act-compliant anti-sexual-harassment policy, drafted for your organisation, not downloaded.",
    stand: "A policy that is specific to your structure, workforce, and locations, not a template with your logo on it.",
    what: [
      "The Rules require every employer to formulate and widely disseminate an internal policy against sexual harassment. A downloaded template rarely survives contact with a real complaint: it names the wrong committee, misstates timelines, and describes someone else's workforce.",
      "We draft yours around how your organisation actually works (locations, shifts, contractors, client sites, and remote work), so the document employees read matches the process your committee runs.",
    ],
    statute: { cite: "Rule 13(a), PoSH Rules 2013", text: "…formulate and widely disseminate an internal policy or charter or resolution or declaration for prohibition, prevention and redressal of sexual harassment at the workplace intended to promote gender sensitive safe spaces and remove underlying factors that contribute towards a hostile work environment against women…" },
    deliverables: [
      { l: "Client-specific anti-sexual-harassment policy", r: "Rule 13(a)" },
      { l: "Plain-language summary for the employee handbook" },
      { l: "Display-poster text for the workplace notice", r: "s. 19(b), PoSH Act" },
      { l: "Policy roll-out note for HR and managers" },
      { l: "Version prepared for board adoption" },
    ],
    timeline: ["Intake", "Draft", "Client review", "Board adoption", "Roll-out"],
  },
  {
    slug: "ic", name: "IC constitution",
    card: "Constitute a valid Internal Committee, correct composition, a qualified external member, defensible records.",
    stand: "A validly constituted Internal Committee, correct composition, a qualified external member, and records that hold up.",
    what: [
      "A defect in constitution infects everything the committee later does: an inquiry run by an invalid IC is vulnerable on appeal regardless of its merits. Composition, tenure, and the external member are where employers most often go wrong.",
      "We map your offices and workforce, then constitute one or more committees as the Act requires, including at each administrative unit where your offices sit at different locations. Where you lack a qualified external member, EquiWork can be empanelled or help you identify one.",
    ],
    statute: { cite: "s. 4(2), PoSH Act 2013", text: "a Presiding Officer who shall be a woman employed at a senior level at workplace from amongst the employees … one member from amongst non-governmental organisations or associations committed to the cause of women or a person familiar with the issues relating to sexual harassment: Provided that at least one-half of the total Members so nominated shall be women." },
    deliverables: [
      { l: "IC constitution order, in writing", r: "s. 4(1)" },
      { l: "Member appointment and consent letters", r: "s. 4(2)" },
      { l: "External-member engagement and fee terms", r: "s. 4(2)(c) & (4)" },
      { l: "Register and record templates for the committee" },
      { l: "Branch-office IC guidance where offices sit at different locations", r: "s. 4(1) proviso" },
    ],
    timeline: ["Mapping", "Member selection", "Constitution order", "Notification", "Induction"],
  },
  {
    slug: "training", name: "Training",
    card: "Audience-specific tracks: employees, managers, employer/board, and IC members.",
    stand: "Audience-specific training, so IC members can run a defensible inquiry, and employees recognise conduct early.",
    what: [
      "One generic session for everyone satisfies nobody and protects nothing. The employee who needs to recognise a pattern, the manager who must act on what they see, and the IC member who will one day write an inquiry report need different material at different depths.",
      "EquiWork delivers four tracks, each built from the Act, the Rules, and the courts' expectations, with attendance and completion records your annual return can cite.",
    ],
    statute: { cite: "s. 19(c), PoSH Act 2013", text: "organise workshops and awareness programmes at regular intervals for sensitising the employees with the provisions of the Act and orientation programmes for the members of the Internal Committee in the manner as may be prescribed" },
    deliverables: [
      { l: "IC-member deep-dive: inquiry procedure, natural justice, report writing", r: "Rule 13(b) & (d)" },
      { l: "Manager module: the duty to act, escalation, what not to do" },
      { l: "Employee awareness session, scenario-based", r: "Rule 13(c)" },
      { l: "Employer / board briefing on statutory duties and exposure", r: "s. 19" },
      { l: "Attendance and completion records for the annual return", r: "s. 21" },
    ],
    timeline: ["Scoping", "Scheduling", "Delivery", "Records", "Refresher"],
    crossLink: { label: "See the four training tracks", route: "training" },
  },
  {
    slug: "audit", name: "Compliance audit",
    card: "A gap assessment against the Act, the Rules, Supreme Court directions, and the SHe-Box mandate.",
    stand: "A gap assessment against the Act, the Rules, Supreme Court directions, and the SHe-Box mandate, with a prioritised remediation plan.",
    what: [
      "Most organisations believe they are compliant until the file is opened: a policy adopted years ago, an IC whose external member quietly lapsed, training that stopped after the first year, returns never filed.",
      "The audit reviews documents, interviews the people who operate the process, and reports findings against each obligation, neutral, amber, or red; never a decorative green tick. Every finding carries a remediation step and an owner.",
    ],
    statute: { cite: "SHe-Box FAQs, Ministry of Women & Child Development", text: "It is mandatory for all workplaces including private entities/ bodies to onboard the portal." },
    deliverables: [
      { l: "Anti-sexual-harassment policy present, current, and disseminated", r: "Rule 13(a)" },
      { l: "IC validly constituted, tenure within three years", r: "s. 4" },
      { l: "External member engaged and paid as prescribed", r: "s. 4(2)(c)" },
      { l: "Annual report prepared and submitted to the District Officer", r: "s. 21" },
      { l: "SHe-Box onboarding and IC details uploaded", r: "SHe-Box mandate" },
      { l: "Awareness training current for employees and IC", r: "s. 19(c)" },
      { l: "Penal consequences and IC order displayed at the workplace", r: "s. 19(b)" },
      { l: "Committee registers and inquiry records maintained" },
    ],
    checklistStatus: "pending",
    auditLegend: true,
    timeline: ["Document review", "Interviews", "Findings", "Remediation plan", "Re-audit"],
  },
  {
    slug: "retainer", name: "Retainer advisory", hide: true,
    card: "Standing counsel for your committee, through live inquiries and the questions that come up mid-process.",
    stand: "Standing counsel for the committee through live inquiries, natural justice, timelines, and the questions that come up mid-process.",
    what: [
      "An inquiry runs on a statutory clock, and the questions arrive mid-process: can the respondent bring a lawyer, what interim protection can we recommend, what happens if a witness resigns. The committee needs an answer that day, not a seminar next quarter.",
      "Under retainer, EquiWork is on call for your IC, reviewing notices and records as they are produced, keeping the inquiry inside its timelines, and supporting the annual return at year end.",
    ],
    statute: { cite: "s. 11(4), PoSH Act 2013", text: "The inquiry under sub-section (1) shall be completed within a period of ninety days." },
    deliverables: [
      { l: "On-call advisory for the Presiding Officer and members" },
      { l: "Inquiry hand-holding: notices, hearings, record of proceedings", r: "s. 11" },
      { l: "Document review before findings issue", r: "s. 13(1)" },
      { l: "Annual-return preparation and filing support", r: "s. 21 & 22" },
      { l: "Quarterly compliance review across all obligations" },
    ],
    timelineTitle: "The statutory inquiry clock",
    timeline: null,
    clock: [
      { label: "Complaint", deadline: "within 3 months of incident · s. 9(1)" },
      { label: "Inquiry", deadline: "completed within 90 days · s. 11(4)" },
      { label: "Report", deadline: "within 10 days of completion · s. 13(1)" },
      { label: "Employer action", deadline: "within 60 days · s. 13(4)" },
      { label: "Appeal", deadline: "within 90 days · s. 18(2)" },
    ],
  },
];

function ServiceDetail({ svc, onNavigate }) {
  const { Section, CtaBand, PageHead, proseStyles: ps } = window;
  const steps = svc.clock || svc.timeline.map((label, i) => ({ label, deadline: "stage " + (i + 1) + " of " + svc.timeline.length, done: i === 0 }));
  return (
    <div className="page-services">
      <PageHead
        crumbs={[{ label: "Home", href: "#home" }, { label: "Services", href: "#services" }, { label: svc.name }]}
        eyebrow="Service" title={svc.name} standfirst={svc.stand} wide />
      <Section bg="var(--canvas)">
        <div className="grid-split wide-left">
          <div>
            <h2 style={{ ...ps.h2, marginTop: 0 }}>What it is</h2>
            {svc.what.map((t, i) => <p key={i} style={ps.p}>{t}</p>)}
            {svc.statute && <SvcStatute statute={svc.statute} />}
            <h2 style={ps.h2}>Scope &amp; deliverables</h2>
            {svc.deliverables.map((d) => (
              <svcDS.ChecklistRow key={d.l} status={svc.checklistStatus || "complete"} label={d.l} reference={d.r} />
            ))}
            {svc.auditLegend && (
              <div style={{ display: "flex", gap: 12, alignItems: "center", marginTop: 20, flexWrap: "wrap" }}>
                <span style={{ fontSize: 14, color: "var(--ink-600)" }}>Findings are reported as</span>
                <svcDS.StatusChip status="pending">To verify</svcDS.StatusChip>
                <svcDS.StatusChip status="pending">Partial</svcDS.StatusChip>
                <svcDS.StatusChip status="overdue">Gap found</svcDS.StatusChip>
              </div>
            )}
            {svc.crossLink && (
              <div style={{ marginTop: 28, padding: "20px 24px", background: "var(--parchment)", border: "1px solid var(--hairline)", borderRadius: "var(--radius-lg)", display: "flex", alignItems: "center", justifyContent: "space-between", gap: 16, flexWrap: "wrap" }}>
                <p style={{ margin: 0, fontSize: 16, color: "var(--ink-800)" }}>The four audience tracks (content, duration, and outcomes) live on the Training page.</p>
                <svcDS.Button variant="ghost" size="sm" onClick={() => onNavigate(svc.crossLink.route)}>{svc.crossLink.label}</svcDS.Button>
              </div>
            )}
          </div>
          <aside>
            <svcDS.Card variant="tier" eyebrow={svc.timelineTitle || "How the engagement runs"} title={svc.clock ? "Once a complaint is made" : "Typical sequence"}>
              <div style={{ marginTop: 8 }}>
                <svcDS.DeadlineTimeline className="timeline" steps={steps} />
              </div>
              {svc.clock && <p style={{ margin: "16px 0 0", fontSize: 13, lineHeight: 1.5, color: "var(--ink-600)" }}>Time limits as enacted; the committee may extend the complaint window by up to three months for recorded reasons (s. 9(1), proviso).</p>}
              <div style={{ marginTop: 24 }}>
                <svcDS.Button onClick={() => onNavigate("engage")}>Discuss this engagement</svcDS.Button>
              </div>
            </svcDS.Card>
          </aside>
        </div>
      </Section>
      <CtaBand title="Discuss this engagement, in confidence." lead="A first conversation establishes scope; nothing proceeds without a written scope of work." onClick={() => onNavigate("engage")} />
    </div>
  );
}

function SvcStatute({ statute }) {
  return <svcDS.StatuteCallout citation={statute.cite}>{statute.text}</svcDS.StatuteCallout>;
}

function ServicesIndex({ onNavigate }) {
  const { Section, CtaBand, PageHead } = window;
  return (
    <div className="page-services">
      <PageHead
        crumbs={[{ label: "Home", href: "#home" }, { label: "Services" }]}
        eyebrow="What we do" title="Advisory across the full compliance lifecycle"
        standfirst="Five engagements, from first policy to a live inquiry. Each proceeds under a written scope of work, and each leaves your committee with records that hold up." wide />
      <Section bg="var(--canvas)">
        <div className="grid-3">
          {SERVICES.filter((s) => !s.hide).map((s) => (
            <svcDS.Card key={s.slug} variant="service" title={s.name} footer={<svcDS.Button variant="ghost" size="sm" onClick={() => onNavigate("services/" + s.slug)}>Read more</svcDS.Button>}>
              <p style={{ margin: 0, fontSize: 16, lineHeight: 1.55, color: "var(--ink-700)", textAlign: s.slug === "policy" ? "left" : "justify" }}>{s.card}</p>
            </svcDS.Card>
          ))}
        </div>
      </Section>
      <CtaBand title="Not sure where to start?" lead="A short conversation usually settles it: most engagements begin with either the audit or the committee." onClick={() => onNavigate("engage")} />
    </div>
  );
}

function ServiceScreen({ route = "services", onNavigate }) {
  const slug = route.split("/")[1];
  const svc = SERVICES.find((s) => s.slug === slug);
  return svc ? <ServiceDetail svc={svc} onNavigate={onNavigate} /> : <ServicesIndex onNavigate={onNavigate} />;
}

Object.assign(window, { ServiceScreen });
