const { useState, useEffect, useMemo } = React; const L = (o, l) => (typeof o === "string" ? o : o?.[l] ?? o?.zh); const Ic = { drop: () => , flame: () => , leaf: () => , check: () => , phone: () => , pin: () => , mail: () => , clock: () => , wa: () => , menu: () => , }; // Brand logo — uploaded logo.jpg in the theme folder. // Theme URL is injected by functions.php as window.AftertailAPI.themeUrl. function Logo() { const base = (typeof window !== "undefined" && window.AftertailAPI && window.AftertailAPI.themeUrl) || ""; return ( 尾站 Aftertail ); } // Cloud SVG function Cloud({ size = 120, opacity = 1 }) { return ( ); } // Hero pet illustration — stylized cat/dog looking up function HeroPet() { return ( {/* body silhouette — pet sitting, looking up */} {/* head */} {/* ears */} {/* eyes closed/peaceful — small arcs */} {/* nose */} {/* mouth */} {/* whiskers */} {/* collar with small tag */} {/* small star/sparkle above head — gentle */} ); } function Mountains() { return ( ); } // ============= COPY ============= const T = { nav: { about: { zh: "關於我們", en: "About" }, services: { zh: "服務", en: "Services" }, pricing: { zh: "價錢", en: "Pricing" }, memorial: { zh: "紀念品", en: "Keepsakes" }, booking: { zh: "預約", en: "Booking" }, faq: { zh: "常見問題", en: "FAQ" }, contact: { zh: "聯絡", en: "Contact" }, }, }; const PAGES = [ { id: "about", href: "/about/", zh: "關於我們", en: "About" }, { id: "services", href: "/services/", zh: "服務", en: "Services" }, { id: "pricing", href: "/pricing/", zh: "價錢", en: "Pricing" }, { id: "memorial", href: "/memorial/", zh: "紀念品", en: "Keepsakes" }, { id: "booking", href: "/booking/", zh: "預約", en: "Booking" }, { id: "faq", href: "/faq/", zh: "常見問題", en: "FAQ" }, { id: "contact", href: "/contact/", zh: "聯絡", en: "Contact" }, ]; // ============= NAV ============= function UrgencyBar({ lang }) { return (
{lang === "zh" ? "24 小時待命" : "24/7 STANDBY"} · {lang === "zh" ? "最快 30 分鐘上門接收" : "PICKUP WITHIN 30 MIN"} · {lang === "zh" ? "全港 18 區免費接送" : "FREE PICKUP · ALL 18 DISTRICTS"}
); } function Nav({ lang, setLang, onMenu, section }) { return ( ); } function MobileMenu({ lang, open, onClose, section }) { return (
尾站
{PAGES.map(l => ( {lang === "zh" ? l.zh : l.en} {lang === "zh" ? l.en : l.zh} ))}
{lang === "zh" ? "24 小時熱線 9123 4567" : "24h Hotline · 9123 4567"}
); } // ============= HERO ============= function Hero({ lang }) { return (
{lang === "zh" ? "香港寵物善終 · Est. 2018" : "Hong Kong Pet Aftercare · Est. 2018"}

{lang === "zh" ? ( <> 溫柔的尾站 A gentle
last stop. ) : ( <> A gentle last stop. 溫柔的
尾站。 )}

{lang === "zh" ? ( <> 香港寵物水化、火化及追思服務。
在最後一程,給牠應得的尊重與溫柔。 Pet aquamation, cremation & memorial in Hong Kong. ) : ( <> Pet aquamation, cremation & memorial services.
Dignity and warmth, on the final journey home. 香港寵物水化、火化及追思服務 )}
24 Hours {lang === "zh" ? "全年無休待命" : "Always standby"}
30 Minutes {lang === "zh" ? "最快上門接收" : "Fastest pickup"}
18 Districts {lang === "zh" ? "全港免費接送" : "Free HK pickup"}
); } // ============= ABOUT ============= function About({ lang }) { const stats = [ { n: "1,800", l: lang === "zh" ? "服務家庭" : "Families served", s: "2018–2026" }, { n: "24", suf: "h", l: lang === "zh" ? "熱線待命" : "Hotline standby" }, { n: "30", suf: "min", l: lang === "zh" ? "平均到場" : "Avg. arrival" }, { n: "98", suf: "%", l: lang === "zh" ? "五星好評" : "5-star reviews" }, ]; return (
{lang === "zh" ? "關於尾站" : "About Aftertail"}

{lang === "zh" ? ( <>不是終點,溫柔的尾站。Not an end — a gentle last stop. ) : ( <>Not an end — a gentle last stop.不是終點,是溫柔的尾站。 )}

{lang === "zh" ? "「尾站」的意思,是這條路上最後一個停靠點。我們相信,離別不一定灰暗。像在晴天的小山頂,風吹過,雲飄過,毛孩靜靜地抬頭望著天——這就是我們想給每一位家人的告別。" : "A \"last stop\" is the final landing on a journey. We believe farewells don\u2019t have to be dark. Picture a hilltop on a bright day — wind, drifting clouds, your pet gazing up at the sky. That\u2019s the goodbye we wish to give every family."}

{stats.map((s, i) => (
{s.n}{s.suf && {s.suf}}
{s.l}
{s.s &&
{s.s}
}
))}
); } // ============= SERVICES ============= function Services({ lang }) { const data = { water: { title: { zh: "水化", en: "Aquamation" }, en: "Alkaline Hydrolysis", tag: { zh: "最環保", en: "MOST ECO" }, desc: { zh: "以溫水與微量鹼性溶液模擬自然分解。碳排放僅為火化的 1/10,沒有火、沒有煙,過程寧靜。", en: "Gentle alkaline hydrolysis mimics the natural decomposition process. 1/10th the carbon footprint of cremation — no fire, no smoke, a quiet farewell." }, features: [ { zh: "碳排放僅 1/10", en: "1/10 carbon footprint" }, { zh: "過程無煙無火", en: "No smoke, no flame" }, { zh: "骨灰量多 20%", en: "20% more ashes returned" }, { zh: "適合所有體型", en: "Suitable for all sizes" }, ], }, fire: { title: { zh: "火化", en: "Cremation" }, en: "Traditional Cremation", tag: { zh: "傳統", en: "TRADITIONAL" }, desc: { zh: "傳統火化服務,提供個別火化或集體火化兩種選擇,全程專人陪同,可選擇出席或視像觀禮。", en: "Traditional cremation — choose individual or communal. A dedicated attendant accompanies the whole process, with optional on-site or video viewing." }, features: [ { zh: "個別/集體可選", en: "Individual or communal" }, { zh: "可現場或視像觀禮", en: "On-site or video viewing" }, { zh: "約 60–90 分鐘完成", en: "Completes in 60–90 min" }, { zh: "提供紙鶴摺紙儀式", en: "Optional crane folding ritual" }, ], }, }; return (
{lang === "zh" ? "我們的服務" : "Our Services"}

{lang === "zh" ? <>水化,火化——
皆以家人之禮相送。 : <>Aquamation or cremation —
each a farewell given as family.}

{lang === "zh" ? "兩種儀式,同一份心意。由你決定,最適合牠的告別方式。" : "Two rites, one intent. You choose the farewell that feels right."}

{["water", "fire"].map(m => { const d = data[m]; return (
{m === "water" ? : }
{m === "water" ? : } {L(d.tag, lang)}

{L(d.title, lang)} {d.en}

{L(d.desc, lang)}

    {d.features.map((f, i) => (
  • {L(f, lang)}
  • ))}
{lang === "zh" ? "查看價錢" : "See pricing"} →
); })}
); } function WaterVisual() { return ( {[0, 1, 2, 3, 4].map(i => ( ))} {/* leaf */} ); } function FireVisual() { return ( ); } // ============= PROCESS ============= function Process({ lang }) { const steps = [ { zh: "聯絡我們", en: "Contact", d: { zh: "24 小時熱線、WhatsApp 或網上即時預約。", en: "24h hotline, WhatsApp or instant online booking." } }, { zh: "上門接送", en: "Pickup", d: { zh: "最快 30 分鐘到達,免費覆蓋全港 18 區。", en: "Arrival within 30 minutes, free across all 18 HK districts." } }, { zh: "告別儀式", en: "Farewell", d: { zh: "安排個別告別室,家人可陪同最後一程。", en: "Private farewell room, family can accompany the final moments." } }, { zh: "水化/火化", en: "Aftercare", d: { zh: "按預約的服務進行,過程可視像陪伴。", en: "As booked. Video accompaniment available throughout." } }, { zh: "交還骨灰", en: "Return", d: { zh: "翌日安排領取或送回府上,附證書與紀念相。", en: "Next-day collection or delivery, with certificate and memorial print." } }, ]; return (
{lang === "zh" ? "服務流程" : "Our Process"}

{lang === "zh" ? <>五步,安心同行。 : <>Five steps, walked together.}

{lang === "zh" ? "由第一通電話,到接毛孩回家,每一步都有專人陪伴。" : "From the first call to returning your companion home — every step, accompanied."}

{steps.map((s, i) => (
{i + 1}

{lang === "zh" ? s.zh : s.en}{lang === "zh" ? s.en : s.zh}

{L(s.d, lang)}

))}
); } // ============= PRICING ============= function Pricing({ lang }) { const [mode, setMode] = useState("water"); const [weight, setWeight] = useState(8); const tiers = [ { id: "c", n: { zh: "集體", en: "Communal" }, en: "Communal", r: { zh: "不分體重", en: "All sizes" }, amt: 980, per: { zh: "不保留骨灰", en: "Ashes not returned" }, feats: [ { zh: "上門接送(市區)", en: "Urban pickup" }, { zh: "集體儀式", en: "Communal rite" }, { zh: "紀念證書", en: "Memorial certificate" }, { zh: "毛孩相框", en: "Memorial photo print" }, ], }, { id: "i", n: { zh: "個別", en: "Individual" }, en: "Individual", r: { zh: "按體重計算", en: "By weight" }, amt: null, per: { zh: "可保留骨灰", en: "Ashes returned" }, feat: true, feats: [ { zh: "上門接送(全港)", en: "HK-wide pickup" }, { zh: "個別告別室(30 分鐘)", en: "Private room (30 min)" }, { zh: "全程可視像觀禮", en: "Live video viewing" }, { zh: "骨灰罐一個", en: "Urn included" }, { zh: "證書 + 相框 + 紙鶴", en: "Certificate, photo & crane" }, ], }, { id: "p", n: { zh: "尊尚", en: "Premium" }, en: "Premium", r: { zh: "全包套餐", en: "All inclusive" }, amt: 6800, per: { zh: "紀念品全套", en: "Full keepsake set" }, feats: [ { zh: "專車接送(含夜間)", en: "Priority 24h pickup" }, { zh: "個別告別室(60 分鐘)", en: "Private room (60 min)" }, { zh: "鮮花佈置 + 鋼琴音樂", en: "Floral setting & piano" }, { zh: "手工骨灰罐", en: "Hand-crafted urn" }, { zh: "爪印 + 毛髮紀念品", en: "Paw print & fur keepsake" }, { zh: "追思短片製作", en: "Memorial video produced" }, ], }, ]; const calcPrice = (w, m) => { // simplified model: water slightly pricier const base = m === "water" ? 1800 : 1500; const perKg = m === "water" ? 180 : 160; return Math.round(base + Math.max(0, w - 2) * perKg); }; return (
{lang === "zh" ? "價錢套餐" : "Pricing"}

{lang === "zh" ? <>明碼實價,無隱藏收費。 : <>Clear pricing, no hidden fees.}

{lang === "zh" ? "三套方案適合不同需要;個別套餐按體重計算,可即時試算。" : "Three packages for different needs. Individual is priced by weight — try the calculator below."}

{tiers.map(t => (
{t.feat &&
{lang === "zh" ? "最受歡迎" : "MOST CHOSEN"}
}

{L(t.n, lang)} {t.en}

{L(t.r, lang)}
HK$ {t.amt ?? (lang === "zh" ? 由 {calcPrice(2, "water")} 起 : from {calcPrice(2, "water")})}
{L(t.per, lang)}
    {t.feats.map((f, i) => (
  • {L(f, lang)}
  • ))}
{lang === "zh" ? "選擇此方案" : "Choose this"} →
))}
{/* Calculator */}

{lang === "zh" ? "按體重試算(個別)" : "By-weight calculator (Individual)"}

{lang === "zh" ? "參考價,不含特別紀念品。最終價錢以確認時為準。" : "Reference price excluding keepsakes. Final quote confirmed at booking."}

{weight}kg
setWeight(+e.target.value)}/>
1 KG50 KG
HK${calcPrice(weight, mode).toLocaleString()}
{lang === "zh" ? `${mode === "water" ? "水化" : "火化"}・個別套餐參考價` : `${mode === "water" ? "Aquamation" : "Cremation"} · Individual ref. price`}
); } // ============= MEMORIAL ============= function Memorial({ lang }) { const products = [ { n: { zh: "陶瓷骨灰罐", en: "Ceramic Urn" }, p: "HK$ 380+", ic: "urn" }, { n: { zh: "水晶吊墜", en: "Crystal Pendant" }, p: "HK$ 680", ic: "pendant" }, { n: { zh: "爪印紀念板", en: "Paw Print" }, p: "HK$ 280", ic: "paw" }, { n: { zh: "毛髮紀念瓶", en: "Fur Vial" }, p: "HK$ 220", ic: "vial" }, { n: { zh: "手繪相框", en: "Hand-painted Frame" }, p: "HK$ 480", ic: "frame" }, { n: { zh: "追思短片", en: "Memorial Video" }, p: "HK$ 980", ic: "video" }, { n: { zh: "紙摺紙鶴", en: "Origami Cranes" }, p: "HK$ 120", ic: "crane" }, { n: { zh: "紀念樹苗", en: "Memorial Sapling" }, p: "HK$ 380", ic: "tree" }, ]; const icons = { urn: , pendant: , paw: , vial: , frame: , video: , crane: , tree: , }; return (
{lang === "zh" ? "紀念品" : "Keepsakes"}

{lang === "zh" ? <>帶一片回家。 : <>Take a piece of sky home.}

{lang === "zh" ? "全部手工製作,可加刻毛孩名字、生忌或一句話。" : "All hand-crafted. Engrave a name, date, or a single line."}

{products.map((p, i) => (
{icons[p.ic]}
{L(p.n, lang)}
{p.n.en}
{p.p}
))}
); } // ============= TESTIMONIALS ============= function Testimonials({ lang }) { const data = [ { t: { zh: "半夜兩點嗰通電話,佢哋一個鐘內就到咗門口。陪我哋坐咗十五分鐘先捧走 Toby,好感謝。", en: "A 2 a.m. call — they arrived within the hour. Sat with us for fifteen minutes before taking Toby. So grateful." }, n: "Carmen", sm: "w/ Toby · 拉布拉多" }, { t: { zh: "最欣賞係全程冇 pushy sales。想加咩服務先介紹,唔夾硬推套餐。價錢清清楚楚。", en: "Zero pushy sales. They explained options only when asked. Transparent pricing end to end." }, n: "Alvin", sm: "w/ 妹妹 · 英短" }, { t: { zh: "選咗水化,覺得比較平靜。收到骨灰嗰日,連佢嘅小爪印同一首琴音短片都整埋,喊得好慘。", en: "Chose aquamation — it felt calmer. On the return day, they included her paw print and a piano memorial video. Ugly cried." }, n: "Phoebe", sm: "w/ 點點 · 貴婦" }, ]; return (
{lang === "zh" ? "家屬心聲" : "Family Voices"}

{lang === "zh" ? <>1,800 家的離別故事。 : <>1,800 family farewells told.}

{data.map((d, i) => (
"

{L(d.t, lang)}

{d.n[0]}
{d.n}
{d.sm}
))}
); } // ============= BOOKING ============= function BookingSystemSlot({ lang, service, slot }) { const api = (typeof window !== "undefined" && window.AftertailAPI) || {}; const embedUrl = api.bookingEmbedUrl || ""; return (
{lang === "zh" ? "公司預約系統" : "Company Booking System"}

{lang === "zh" ? "即時預約版面" : "Live Booking Panel"}

{embedUrl ? "LIVE" : "READY"}
{embedUrl ? (