import { useState, useEffect, useRef } from "react"; // ── SVG Icons ────────────────────────────────────────────────────────────── const EmployeeRelationsIcon = () => ( {/* Two people shaking hands */} {/* Scale of justice */} ); const ResourcingIcon = () => ( {/* Podium / presenter */} {/* Head */} {/* Growth arrow */} {/* Star */} ); const WellbeingIcon = () => ( {/* Heart */} {/* EAP cross */} {/* Small leaves */} ); const CheckIcon = () => ( ); const StarIcon = () => ( ); // ── Intersection Observer Hook ───────────────────────────────────────────── function useInView(threshold = 0.15) { const ref = useRef(null); const [inView, setInView] = useState(false); useEffect(() => { const obs = new IntersectionObserver( ([entry]) => { if (entry.isIntersecting) setInView(true); }, { threshold } ); if (ref.current) obs.observe(ref.current); return () => obs.disconnect(); }, [threshold]); return { ref, inView }; } // ── Data ─────────────────────────────────────────────────────────────────── const services = [ { id: "er", Icon: EmployeeRelationsIcon, title: "Employee Relations", tagline: "Fair, Compliant & Confident Workplaces", description: "Navigate the complexities of employment law with confidence. I provide expert guidance across the full spectrum of employee relations, ensuring your business is legally protected and your people are treated fairly.", bullets: [ "Employment legislation advice & compliance", "Workplace investigations (grievance & disciplinary)", "Performance management frameworks", "Recruitment strategy & selection processes", "TUPE, redundancy & restructuring support", ], color: "from-violet-50 to-purple-50", accent: "#7c5cbf", }, { id: "res", Icon: ResourcingIcon, title: "Employee Resourcing", tagline: "Unlock the Potential in Your People", description: "As a qualified trainer and facilitator, I design and deliver engaging development programmes that build leadership capability and essential soft skills — tailored precisely to your organisation's goals.", bullets: [ "Leadership development programmes", "Soft skills & communication training", "Bespoke workshops & facilitation", "Coaching & mentoring frameworks", "Training needs analysis (TNA)", ], color: "from-sky-50 to-blue-50", accent: "#4a90d9", }, { id: "wb", Icon: WellbeingIcon, title: "Employee Well-being", tagline: "A Healthier, Happier, More Productive Team", description: "Employee well-being is at the heart of sustainable business performance. Through EAP (Employee Assistance Programme) counselling services and well-being strategies, I help organisations create cultures where people truly thrive.", bullets: [ "EAP counselling service provision", "Well-being strategy design", "Mental health awareness programmes", "Stress risk assessment & management", "Absence management & return-to-work support", ], color: "from-rose-50 to-pink-50", accent: "#c26b8a", }, ]; const pricingPlans = [ { name: "Essentials", price: "£350", per: "per day", description: "Ideal for occasional HR support and ad-hoc advice.", features: [ "HR advice & guidance (up to 8hrs)", "Employment law queries", "Policy review (1 policy)", "Email support", "Follow-up report", ], highlight: false, cta: "Get Started", }, { name: "Professional", price: "£950", per: "per month", description: "Perfect for growing SMEs needing consistent HR support.", features: [ "Up to 3 days consultancy per month", "Employee relations support", "Policy & procedure development", "Training delivery (1 session)", "Priority phone & email support", "Monthly HR health check", ], highlight: true, cta: "Most Popular", }, { name: "Partnership", price: "Bespoke", per: "tailored package", description: "Comprehensive HR outsourcing for ambitious SMEs.", features: [ "Unlimited HR consultancy days", "Full ER case management", "Annual training calendar", "EAP well-being programme", "Leadership coaching programme", "Dedicated HR partner", ], highlight: false, cta: "Let's Talk", }, ]; const testimonials = [ { quote: "Hermione transformed our approach to people management. Her expertise in employee relations saved us from a costly tribunal case and gave us the confidence to lead our team effectively.", author: "James O.", role: "Managing Director, Tech SME", avatar: "JO", }, { quote: "The leadership development programme Hermione designed for our team was outstanding. Practical, engaging, and immediately impactful. Our managers are a different calibre.", author: "Priya S.", role: "Operations Director, Healthcare Group", avatar: "PS", }, { quote: "Having access to the EAP counselling service has made a real difference to our team's well-being. Staff absences are down and morale is genuinely higher. Absolutely recommend.", author: "Marcus A.", role: "CEO, Creative Agency", avatar: "MA", }, ]; // ── Main App ─────────────────────────────────────────────────────────────── export default function App() { const [menuOpen, setMenuOpen] = useState(false); const [scrolled, setScrolled] = useState(false); const [formData, setFormData] = useState({ name: "", email: "", company: "", service: "", message: "", }); const [formStatus, setFormStatus] = useState<"idle" | "success" | "error">("idle"); useEffect(() => { const onScroll = () => setScrolled(window.scrollY > 40); window.addEventListener("scroll", onScroll); return () => window.removeEventListener("scroll", onScroll); }, []); const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); // Simulate submission setFormStatus("success"); setFormData({ name: "", email: "", company: "", service: "", message: "" }); setTimeout(() => setFormStatus("idle"), 5000); }; const { ref: aboutRef, inView: aboutInView } = useInView(); const { ref: servicesRef, inView: servicesInView } = useInView(); const { ref: pricingRef, inView: pricingInView } = useInView(); const { ref: testiRef, inView: testiInView } = useInView(); const { ref: contactRef, inView: contactInView } = useInView(); const navLinks = ["About", "Services", "Pricing", "Contact"]; return (
{/* ── NAVIGATION ───────────────────────────────────────────────── */} {/* ── HERO ─────────────────────────────────────────────────────── */}
{/* Decorative blobs */}
{/* Text */}
MCIPD Qualified · 25+ Years Experience

Your People.{" "} Your Greatest {" "} Asset.

Expert HR consultancy tailored for UK SMEs. From employment law to leadership development and employee well-being — I'm your dedicated HR partner, bringing 25 years of public sector expertise to your growing business.

{/* Stats */}
{[ { val: "25+", label: "Years Experience" }, { val: "MCIPD", label: "Qualified" }, { val: "100%", label: "SME Focused" }, ].map((stat) => (

{stat.val}

{stat.label}

))}
{/* Hero image grid */}
Diverse business team in meeting
Team wellbeing session
Team success celebration
Professional business meeting
{/* Floating badge */}

Trusted by UK SMEs

{["#7c5cbf", "#8fb4d9", "#b08cd9", "#c26b8a"].map((c, i) => (
{["J","P","M","S"][i]}
))}
+
{/* Wave */}
{/* ── ABOUT ────────────────────────────────────────────────────── */}
{/* Image */}
Professional HR consultant
{/* Credential badge */}
MC

MCIPD

Chartered Member

{/* Experience badge */}

25+

Years in HR

{/* Content */}

About Me

Where Expertise Meets Empathy

Hello, I'm Hermione Regis, MCIPD — a Chartered HR professional with over 25 years' experience, predominantly within the public sector and statutory bodies. I founded Regis HR Consultancy to bridge the gap between enterprise-level HR expertise and the practical, accessible support that UK SMEs genuinely need.

My career has given me deep exposure to employment legislation, complex employee relations cases, organisational learning and development, and the human side of the workplace. I understand that for a small or medium-sized business, getting your people strategy right is absolutely critical — and that's exactly where I come in.

{/* Specialisms */}
{[ "Employment Law & Compliance", "Workplace Investigations", "Leadership Development", "EAP Counselling Services", "Performance Management", "Well-being Strategy", ].map((item) => (
{item}
))}
Work With Me
CIPD Accredited | Public Sector Specialist
{/* ── SERVICES ─────────────────────────────────────────────────── */}

What I Offer

Comprehensive HR Services

Three specialised service areas, one trusted partner. I bring the full breadth of professional HR expertise directly to your business.

{services.map((svc, i) => (

{svc.tagline}

{svc.title}

{svc.description}

    {svc.bullets.map((b) => (
  • {b}
    • ))}
))}
{/* Photos row */}
{[ { url: "https://images.pexels.com/photos/5990046/pexels-photo-5990046.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=400&w=600", alt: "Team collaboration session" }, { url: "https://images.pexels.com/photos/4344878/pexels-photo-4344878.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=400&w=600", alt: "Professional interview setting" }, { url: "https://images.pexels.com/photos/7794041/pexels-photo-7794041.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=400&w=600", alt: "Team celebrating success" }, ].map(({ url, alt }) => (
{alt}
))}
{/* ── TESTIMONIALS ─────────────────────────────────────────────── */}

Client Stories

Trusted by Leaders Across the UK

{testimonials.map((t, i) => (
{[...Array(5)].map((_, j) => )}

"{t.quote}"

{t.avatar}

{t.author}

{t.role}

))}
{/* ── PRICING ──────────────────────────────────────────────────── */}

Transparent Pricing

Invest in Your People

Flexible packages designed around what SMEs actually need. All packages include an initial consultation at no charge.

{pricingPlans.map((plan, i) => (
{plan.highlight && (
⭐ Most Popular
)}

{plan.name}

{plan.price}

{plan.per}

{plan.description}

    {plan.features.map((f) => (
  • {f}
    • ))}
))}

All prices exclusive of VAT. Bespoke quotations available for project-based work. Get in touch to discuss your needs.

{/* ── CONTACT ──────────────────────────────────────────────────── */}
{/* Left info */}

Get in Touch

Let's Start the Conversation

Whether you have an immediate HR challenge or are thinking about how to strengthen your people strategy, I'd love to hear from you. The first consultation is completely free — no strings attached.

{/* Contact details */}
{[ { icon: ( ), label: "Email", value: "hello@regishr.co.uk", }, { icon: ( ), label: "Phone", value: "+44 (0) 7700 900 000", }, { icon: ( ), label: "Location", value: "United Kingdom (Remote & On-site)", }, ].map((item) => (
{item.icon}

{item.label}

{item.value}

))}
{/* Social links */}
{[ { name: "LinkedIn", icon: ( ), }, ].map((s) => ( {s.icon} ))}
🕐 Responds within 24 hours
{/* Contact form */}
{formStatus === "success" ? (

Message Sent!

Thank you for reaching out. Hermione will be in touch within 24 hours.

) : (

Book Your Free Consultation

setFormData({ ...formData, name: e.target.value })} placeholder="Jane Smith" className="form-input w-full px-4 py-3 rounded-xl text-sm border" style={{ borderColor: "#e2dff0", backgroundColor: "#fdfcff", color: "#1a1a2e" }} />
setFormData({ ...formData, email: e.target.value })} placeholder="jane@company.co.uk" className="form-input w-full px-4 py-3 rounded-xl text-sm border" style={{ borderColor: "#e2dff0", backgroundColor: "#fdfcff", color: "#1a1a2e" }} />
setFormData({ ...formData, company: e.target.value })} placeholder="Your Company Ltd" className="form-input w-full px-4 py-3 rounded-xl text-sm border" style={{ borderColor: "#e2dff0", backgroundColor: "#fdfcff", color: "#1a1a2e" }} />