const DS = window.HennaByMasuDesignSystem_0b7f2a; const { Button, Eyebrow, Icon, Ornament, SectionHeading, StyleCard, StepMarker, Quote, ImagePlate, GalleryTile } = DS; const GUTTER = "clamp(20px,5vw,72px)"; const SECTION_Y = "clamp(80px,10vw,160px)"; const LINEN = "repeating-linear-gradient(135deg,rgba(247,241,232,.016) 0 2px,transparent 2px 5px)"; function Reveal({ children, delay = 0, as = "div", style }) { const ref = React.useRef(null); const [seen, setSeen] = React.useState(false); const [instant, setInstant] = React.useState(false); React.useEffect(() => { const el = ref.current; if (!el) return; const show = () => { if (document.hidden) setInstant(true); setSeen(true); }; if (window.matchMedia("(prefers-reduced-motion: reduce)").matches || document.hidden) { setInstant(true); setSeen(true); return; } let done = false; const check = () => { if (done) return; const r = el.getBoundingClientRect(); if (r.top < window.innerHeight * 0.9 && r.bottom > 0) { done = true; show(); stop(); } }; const onScroll = () => check(); const stop = () => { window.removeEventListener("scroll", onScroll); window.removeEventListener("resize", onScroll); clearInterval(poll); }; window.addEventListener("scroll", onScroll, { passive: true }); window.addEventListener("resize", onScroll); const poll = setInterval(check, 300); check(); return () => stop(); }, []); const Tag = as; return {children}; } const GALLERY = [ { src: "assets/bridal-veil-portrait.jpg", cat: "Bridal", title: "Red velvet veil, kundan ring", ratio: "4 / 5", pos: "50% 35%" }, { src: "assets/bridal-temple-hands.jpg", cat: "Bridal", title: "Temple arch, lotus crown", span: 2, ratio: "16 / 11", pos: "50% 45%" }, { src: "assets/detail-fresh-cone.jpg", cat: "Details", title: "Fresh cone, fine jaali", ratio: "4 / 5", pos: "50% 40%" }, { src: "assets/modern-diamond.jpg", cat: "Modern", title: "Diamond panel, open ground", ratio: "4 / 5", pos: "50% 45%" }, { src: "assets/bridal-portrait.jpg", cat: "Bridal", title: "Both hands, matched borders", ratio: "4 / 5", pos: "50% 40%" }, { src: "assets/bridal-kalire-hands.jpg", cat: "Bridal", title: "Kalire, held out to the light", span: 2, ratio: "16 / 11", pos: "50% 38%" }, { src: "assets/bridal-mangalsutra.jpg", cat: "Bridal", title: "Mangalsutra across two palms", ratio: "4 / 5", pos: "50% 55%" }, { src: "assets/bridal-couple-blush.jpg", cat: "Bridal", title: "Blush nikah, hands together", ratio: "4 / 5", pos: "50% 50%" }, { src: "assets/pair-navy.jpg", cat: "Modern", title: "Paisley trail on navy", span: 2, ratio: "16 / 11", pos: "50% 62%" }, { src: "assets/festive-red.jpg", cat: "Festive", title: "Mandala back-hand, festive red", ratio: "4 / 5", pos: "50% 45%" }, { video: "assets/hero-clip.mp4", src: "assets/detail-fresh-cone.jpg", cat: "Details", title: "The cone, in motion", ratio: "4 / 5", pos: "50% 40%" }, ]; function Tile({ item, onOpen }) { const [hover, setHover] = React.useState(false); return ( ); } function Lightbox({ items, index, onClose, onStep }) { const ref = React.useRef(null); React.useEffect(() => { const onKey = (e) => { if (e.key === "Escape") onClose(); if (e.key === "ArrowRight") onStep(1); if (e.key === "ArrowLeft") onStep(-1); }; document.addEventListener("keydown", onKey); if (ref.current) ref.current.focus(); document.body.style.overflow = "hidden"; return () => { document.removeEventListener("keydown", onKey); document.body.style.overflow = ""; }; }, [onClose, onStep]); const touch = React.useRef(0); const item = items[index]; const navBtn = { display: "grid", placeItems: "center", width: "48px", height: "48px", background: "transparent", border: "1px solid var(--border-hairline)", color: "var(--ivory-50)", cursor: "pointer" }; return (
{ touch.current = e.changedTouches[0].clientX; }} onTouchEnd={(e) => { const d = e.changedTouches[0].clientX - touch.current; if (Math.abs(d) > 50) onStep(d < 0 ? 1 : -1); }} style={{ position: "fixed", inset: 0, zIndex: 90, background: "rgba(7,8,6,.96)", display: "flex", flexDirection: "column", padding: `20px ${GUTTER} 28px`, boxSizing: "border-box", outline: "none" }}>
{item.cat}
{item.video ?
{item.title} {index + 1} / {items.length}
); } function Intro() { return (
The atelier

Every line is personal. Every design is drawn for the moment it becomes part of your story.

); } function Services() { return (
{[ { index: "01", title: "Bridal mehendi", src: "assets/bridal-veil-portrait.jpg", description: "Full hands, feet and forearms drawn freehand across an unhurried session — temple arches, lotus and jaali worked around the motifs that matter to you.", detail: "Discover more" }, { index: "02", title: "Private celebrations", src: "assets/modern-diamond.jpg", description: "Engagements, Eid and birthdays at home. Fine modern linework or dense traditional panels, whichever the evening calls for.", detail: "Discover more" }, { index: "03", title: "Events & guest henna", src: "assets/festive-red.jpg", description: "A table for your guests, with quick, complete designs that still look drawn by hand — because every one of them is.", detail: "Discover more" }, { index: "04", title: "Eid mehendi", src: "assets/detail-fresh-cone.jpg", description: "Chaand Raat sittings for the family, drawn the night before — fine jaali, trailing vines and a stain deepened in time for the morning.", detail: "Discover more" }, ].map((s, i) => )}
); } function Gallery() { const [filter, setFilter] = React.useState("All"); const [open, setOpen] = React.useState(-1); const cats = ["All", "Bridal", "Modern", "Festive", "Details"]; const items = filter === "All" ? GALLERY : GALLERY.filter((g) => g.cat === filter); return (
{cats.map((c) => ( ))}
{items.map((item) => ( setOpen(items.indexOf(item))} /> ))}
{open >= 0 ? setOpen(-1)} onStep={(d) => setOpen((i) => (i + d + items.length) % items.length)} /> : null}
); } function BridalFeature() { return (
Bride holding out both hennaed hands with gold kalire For the bride

A design as individual as your celebration.

Your booking opens with a conversation — the ceremony, the outfit, the names and motifs you want carried into the work. A drawn proposal follows, revised once and never repeated for another bride.

On the day the session is calm and unhurried, with aftercare and a stain plan so the colour deepens the way it should.

); } function Process() { return (
); } function Artist() { return (
Masuma, henna artist, with her own hands hennaed The artist

Masuma

Every design on this page is drawn by Masuma, working from her studio in Leicester and travelling to homes and venues for the day itself.

Freehand, cone-drawn, one pair of hands from the first line to the last.

); } function Testimonial() { return (
“She drew our whole story into my hands.”
); } function Booking() { return (
By appointment

Let’s create something unforgettable.

Send the date and the celebration. We reply with availability and a proposal.

34 Beckingham Rd, Leicester LE2 1HB

); } function Footer() { const link = { font: "var(--type-body)", fontSize: "var(--fs-small)", color: "var(--text-body)", textDecoration: "none" }; return ( ); } Object.assign(window, { Reveal, Intro, Services, Gallery, BridalFeature, Process, Artist, Testimonial, Booking, Footer, GUTTER, SECTION_Y, LINEN });