import { J as jsxRuntimeExports } from "./server-OKiEnFgZ.js";
import { d as PageShell, P as PageHero, B as Button, L as Link, A as ArrowRight, S as Section, f as SectionHead, a as Check, E as Eyebrow, C as CTASection } from "./router-DhFPDtNP.js";
function ServicePage({ eyebrow, h1, subtitle, benefits, features, process, faqs, related }) {
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(PageShell, { children: [
    /* @__PURE__ */ jsxRuntimeExports.jsx(
      PageHero,
      {
        eyebrow,
        h1,
        subtitle,
        children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-wrap gap-3", children: [
          /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { asChild: true, size: "lg", className: "h-12 rounded-full bg-gradient-primary px-7 text-white shadow-soft hover:opacity-95", children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Link, { to: "/contact", children: [
            "Book Free Consultation ",
            /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowRight, { className: "ml-1 h-4 w-4" })
          ] }) }),
          /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { asChild: true, size: "lg", variant: "outline", className: "h-12 rounded-full border-2 px-7", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { to: "/portfolio", children: "See Our Work" }) })
        ] })
      }
    ),
    /* @__PURE__ */ jsxRuntimeExports.jsxs(Section, { className: "!pt-4", children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx(SectionHead, { eyebrow: "Why it matters", title: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
        "Built for measurable ",
        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-gradient-primary", children: "business outcomes" })
      ] }) }),
      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-10 grid gap-6 md:grid-cols-3", children: benefits.map(({ icon: Icon, title, desc }) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-3xl border border-border bg-card p-6 shadow-card transition-all hover:-translate-y-1 hover:shadow-glow", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid h-12 w-12 place-items-center rounded-2xl bg-gradient-primary text-white shadow-soft", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { className: "h-5 w-5" }) }),
        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "mt-4 text-lg", children: title }),
        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-2 text-sm leading-relaxed text-ink-soft", children: desc })
      ] }, title)) })
    ] }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(Section, { className: "!pt-0", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "grid items-start gap-10 lg:grid-cols-2", children: [
      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx(SectionHead, { eyebrow: "What you get", title: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
          "Everything included in your ",
          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-gradient-primary", children: "project" })
        ] }) }),
        /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "mt-8 space-y-3", children: features.map((f) => /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { className: "flex gap-3 rounded-2xl border border-border bg-card p-4 shadow-card", children: [
          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid h-7 w-7 shrink-0 place-items-center rounded-full bg-primary-soft text-primary", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Check, { className: "h-4 w-4" }) }),
          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-sm text-ink", children: f })
        ] }, f)) })
      ] }),
      process && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "rounded-3xl bg-[#0e0e0e] p-8 text-white shadow-glow", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx(Eyebrow, { children: "Process" }),
        /* @__PURE__ */ jsxRuntimeExports.jsx("h3", { className: "mt-3 text-2xl !text-white", children: "How we deliver" }),
        /* @__PURE__ */ jsxRuntimeExports.jsx("ol", { className: "mt-6 space-y-5", children: process.map((s) => /* @__PURE__ */ jsxRuntimeExports.jsxs("li", { className: "flex gap-4 border-b border-white/10 pb-5 last:border-0 last:pb-0", children: [
          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-sm font-bold text-gradient-accent", children: s.n }),
          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-semibold text-white", children: s.title }),
            /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-1 text-sm leading-relaxed text-white/70", children: s.desc })
          ] })
        ] }, s.n)) })
      ] })
    ] }) }),
    faqs && faqs.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(Section, { children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx(SectionHead, { eyebrow: "FAQ", title: "Common questions" }),
      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mx-auto mt-8 max-w-3xl space-y-3", children: faqs.map((f, i) => /* @__PURE__ */ jsxRuntimeExports.jsxs("details", { className: "group rounded-2xl border border-border bg-card p-5 shadow-card open:shadow-glow", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsxs("summary", { className: "flex cursor-pointer list-none items-center justify-between gap-4 font-semibold text-ink", children: [
          f.q,
          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "grid h-7 w-7 shrink-0 place-items-center rounded-full bg-primary-soft text-primary transition-transform group-open:rotate-45", children: "+" })
        ] }),
        /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "mt-3 text-sm leading-relaxed text-ink-soft", children: f.a })
      ] }, i)) })
    ] }),
    related && related.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs(Section, { className: "!pt-0", children: [
      /* @__PURE__ */ jsxRuntimeExports.jsx(SectionHead, { eyebrow: "Related services", title: "Explore more" }),
      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-8 grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: related.map((r) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Link, { to: r.to, className: "group rounded-2xl border border-border bg-card p-5 shadow-card hover:-translate-y-1 hover:shadow-glow", children: [
        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-semibold text-ink", children: r.title }),
        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "mt-2 inline-flex items-center gap-1 text-sm font-semibold text-primary", children: [
          "Learn more ",
          /* @__PURE__ */ jsxRuntimeExports.jsx(ArrowRight, { className: "h-4 w-4 transition-transform group-hover:translate-x-1" })
        ] })
      ] }, r.to)) })
    ] }),
    /* @__PURE__ */ jsxRuntimeExports.jsx(CTASection, {})
  ] });
}
export {
  ServicePage as S
};
