In Loving Memory of Michelle Chanice Mwende<\/title>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Ubuntu:ital,wght@0,300;0,400;0,700;1,300;1,400&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&display=swap\" rel=\"stylesheet\">\r\n<script>\r\n\r\nconst IMAGES = {\r\n \/* \u2500\u2500 Scroll panels (5) \u2500\u2500 *\/\r\n panel1:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_0980_magicstudio_j1siiymwsoq-1-1.png\", panel2:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188393.jpg\", panel3:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/class9.jpg\",\r\n panel4:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260312-WA0020.jpg\", panel5:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20150223_124736-1new-1-scaled.jpg\",\r\n\r\n \/* \u2500\u2500 Life section (5) \u2500\u2500 *\/\r\n life1:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20140426_143521.jpg\", life2:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0020-scaled.jpg\", life3:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188226.jpg\",\r\n life4:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260228-WA0021.jpg\", life5:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188408.jpg\",\r\n\r\n \/* \u2500\u2500 Gallery \u2014 50 slots \u2500\u2500\r\n \u2014\r\n placeholders are shown automatically for any empty slot. *\/\r\n g1:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_1086.jpg\", g2:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/PXL_20230203_081926049-1-scaled.jpg\", g3:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_1088.jpg\",\r\n g4:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_0589.jpg\", g5:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/PXL_20230131_081221518-1-scaled.jpg\", g6:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/PXL_20231014_100323095-1-scaled.jpg\",\r\n g7:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20191210_213347-scaled.jpg\", g8:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188230.jpg\", g9:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260315-WA0003.jpg\",\r\n g10:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188405.jpg\", g11:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260228-WA0018.jpg\", g12:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188425.jpg\",\r\n g13:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188208.jpg\", g14:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260312-WA0019.jpg\", g15:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260228-WA0025.jpg\",\r\n g16:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20150223_123838-scaled.jpg\", g17:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0004.jpg\", g18:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260304-WA0008.jpg\",\r\n g19:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0018.jpg\", g20:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188415.jpg\", g21:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260312-WA0021.jpg\",\r\n g22:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/6d1d7258-7761-4bdb-9d68-9ac5a87c2686.jpg\", g23:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188419.jpg\", g24:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188413.jpg\",\r\n g25:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188387.jpg\", g26:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_1920-scaled.jpg\", g27:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188384.jpg\",\r\n g28:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/aa597038-fb2a-42bc-a5e9-6a3790c8fd74.jpg\", g29:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188417.jpg\", g30:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_0106-scaled.jpg\",\r\n g31:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260315-WA0008.jpg\", g32:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260321-WA0000.jpg\", g33:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260313-WA0000.jpg\",\r\n g34:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_1952-scaled.jpg\", g35:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188399.jpg\", g36:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260313-WA0001.jpg\",\r\n g37:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0002.jpg\", g38:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/FB_IMG_1469893031482.jpg\", g39:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188402.jpg\",\r\n g40:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188411-scaled.jpg\", g41:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0023.jpg\", g42:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0009.jpg\",\r\n g43:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20140427_150950.jpg\", g44:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0016.jpg\", g45:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188396.jpg\",\r\n g46:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188390.jpg\", g47:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260226-WA0005.jpg\", g48:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188381.jpg\",\r\n g49:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260312-WA0017.jpg\", g50:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0012.jpg\",\r\n};\r\n\r\n\r\nconst MUSIC_URL = \"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/Coldplay-Paradise.mp3\";\r\n\r\n\r\nconst PDF_URL = \"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/FUNERAL-SERVICE-PROGRAMME.pdf\";\r\n\r\n\/* \u2500\u2500 Venue directions \u2014 paste a Google Maps share link below \u2500\u2500 *\/\r\nconst VENUE_MAPS_LINK = \"https:\/\/maps.google.com\/?q=CITAM+Karen+Nairobi\";\r\n\/* To get your link:\r\n 1. Search your venue on maps.google.com\r\n 2. Click Share \u2192 Copy link\r\n Paste it between the quotes above. *\/\r\n\r\n\/* Gallery captions \u2014 one per slot (g1\u2013g50).\r\n Edit any caption to match your photo. *\/\r\nconst GALLERY_CAPTIONS = [\r\n \"A moment of joy\",\"In the Ocean\",\"With family\",\"Memories\",\"On an adventure\",\r\n \"Siz Love\",\"Home\",\"Love never fades\",\"Friendship\",\"Your memory lives on\",\r\n \"Her light\",\"Your light remains\",\"Karen, Nairobi\",\"Your memory lives on\",\"Carried in our hearts\",\r\n \"Family is Forever\",\"Friends\",\"Precious memories remain\",\"Love remembers\",\"Michelle, always\",\r\n \"Laughter\",\"A quiet afternoon\",\"A soul never dies\",\"Childhood days\",\"Deeply missed\",\r\n \"Still with us\",\"A gentle soul\",\"Always present\",\"A beautiful soul remembered\",\"Beloved\",\r\n \"Remembered with love\",\"Loved beyond words\",\"Family moments\",\"Pure joy\",\"Carefree\",\r\n \"Dreaming\",\"Gone, never lost\",\"Peaceful\",\"Gone, yet near\",\"Forever remembered\",\r\n \"Tender moments\",\"The little things\",\"Radiant\",\"Her world\",\"Loved beyond words\",\r\n \"Always close to heart\",\"Cherished\",\"Still here\",\"Until we meet again\",\"In Our Hearts\"\r\n];\r\n<\/script>\r\n<style>\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n RESET & TOKENS\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }\r\n:root {\r\n --black:#0a0a0a; --white:#f5f3ef; --gray:#888; --lgray:#c8c4bc; --accent:#d4b896;\r\n --nav-size:13px; \/* corner nav font size *\/\r\n --section-px:80px; \/* horizontal padding in overlays *\/\r\n}\r\nhtml {\r\n scroll-behavior:smooth;\r\n margin:0; padding:0; width:100%; height:100%;\r\n}\r\nbody {\r\n background:var(--black); color:var(--white);\r\n font-family:'Cormorant Garamond',serif;\r\n overflow-x:hidden; cursor:crosshair;\r\n margin:0; padding:0; width:100%; min-height:100%;\r\n}\r\n\/* Film grain *\/\r\nbody::after {\r\n content:''; position:fixed; inset:0; pointer-events:none;\r\n z-index:9999; opacity:0.35; mix-blend-mode:overlay;\r\n background-image:url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'\/%3E%3C\/svg%3E\");\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n MUSIC PLAYER \u2014 top centre pulse bar\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n#music-bar {\r\n position:fixed; top:28px; left:50%; transform:translateX(-50%);\r\n z-index:1100; display:flex; align-items:center; gap:10px;\r\n padding:8px 18px 8px 14px;\r\n background:rgba(10,10,10,0.55);\r\n backdrop-filter:blur(10px);\r\n border:1px solid rgba(212,184,150,0.18);\r\n border-radius:20px;\r\n cursor:pointer; user-select:none;\r\n transition:background 0.3s, border-color 0.3s;\r\n}\r\n#music-bar:hover { background:rgba(10,10,10,0.85); border-color:rgba(212,184,150,0.4); }\r\n\r\n\/* Animated waveform bars *\/\r\n.wave { display:flex; align-items:center; gap:2px; height:16px; }\r\n.wave span {\r\n display:block; width:2px; background:var(--accent);\r\n border-radius:2px; transform-origin:bottom;\r\n}\r\n.wave span:nth-child(1) { height:4px; animation:wb 1.1s 0.0s ease-in-out infinite alternate; }\r\n.wave span:nth-child(2) { height:10px; animation:wb 1.1s 0.2s ease-in-out infinite alternate; }\r\n.wave span:nth-child(3) { height:14px; animation:wb 1.1s 0.1s ease-in-out infinite alternate; }\r\n.wave span:nth-child(4) { height:8px; animation:wb 1.1s 0.3s ease-in-out infinite alternate; }\r\n.wave span:nth-child(5) { height:12px; animation:wb 1.1s 0.15s ease-in-out infinite alternate; }\r\n.wave span:nth-child(6) { height:6px; animation:wb 1.1s 0.25s ease-in-out infinite alternate; }\r\n.wave span:nth-child(7) { height:10px; animation:wb 1.1s 0.05s ease-in-out infinite alternate; }\r\n@keyframes wb {\r\n from { transform:scaleY(0.25); opacity:0.4; }\r\n to { transform:scaleY(1); opacity:1; }\r\n}\r\n#music-bar.paused .wave span { animation-play-state:paused; opacity:0.3; }\r\n#music-bar.paused .wave span { transform:scaleY(0.25); }\r\n\r\n.music-label {\r\n font-family:'Ubuntu',sans-serif; font-size:9px;\r\n letter-spacing:0.38em; text-transform:uppercase;\r\n color:rgba(245,243,239,0.4); transition:color 0.3s; white-space:nowrap;\r\n}\r\n#music-bar:hover .music-label { color:var(--accent); }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n CORNER NAV \u2014 larger, cleaner\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.corner-nav { position:fixed; z-index:1000; }\r\n.corner-nav button {\r\n background:none; border:none; cursor:pointer;\r\n font-family:'Ubuntu',sans-serif;\r\n font-size:var(--nav-size); font-weight:400;\r\n letter-spacing:0.3em; text-transform:uppercase;\r\n color:rgba(245,243,239,0.5);\r\n padding:8px 0; line-height:1;\r\n transition:color 0.4s, opacity 0.4s;\r\n position:relative;\r\n animation:navPulse 3.5s ease-in-out infinite;\r\n}\r\n.corner-nav button::after {\r\n content:''; position:absolute; bottom:0; left:0;\r\n width:100%; height:1px; background:var(--accent);\r\n transform:scaleX(0); transform-origin:left; transition:transform 0.4s;\r\n}\r\n.corner-nav button:hover { color:var(--accent); }\r\n.corner-nav button:hover::after { transform:scaleX(1); }\r\n@keyframes navPulse {\r\n 0%,100% { opacity:0.5; }\r\n 50% { opacity:1; }\r\n}\r\n#nav-life { top:36px; left:40px; }\r\n#nav-gallery { top:36px; right:40px; }\r\n#nav-programme { bottom:40px; left:40px; }\r\n#nav-tributes { bottom:40px; right:40px; }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n PANELS \u2014 continuous scroll\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.journey { position:relative; }\r\n.panel {\r\n position:relative; height:100vh; width:100%;\r\n display:flex; align-items:center; justify-content:center;\r\n overflow:hidden;\r\n}\r\n.panel-img {\r\n position:absolute; inset:0; width:100%; height:100%;\r\n object-fit:cover;\r\n filter:grayscale(100%) contrast(1.12) brightness(0.85);\r\n transform:scale(1); will-change:transform; z-index:0;\r\n}\r\n.panel-bg {\r\n position:absolute; inset:0; background:#111; z-index:0;\r\n display:flex; align-items:center; justify-content:center;\r\n}\r\n.panel-bg svg { opacity:0.06; }\r\n.panel-vignette {\r\n position:absolute; inset:0; z-index:1;\r\n background:radial-gradient(ellipse at 50% 50%, transparent 35%, rgba(10,10,10,0.62) 100%);\r\n}\r\n\/* Always overlaid on image \u2014 never below it on any screen size *\/\r\n.panel-content {\r\n position:absolute; inset:0; z-index:2;\r\n display:flex; align-items:center; justify-content:center;\r\n width:100%; pointer-events:none;\r\n}\r\n.panel-content > * { pointer-events:auto; }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n HERO\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.hero-inner { text-align:center; padding:0 clamp(20px,5vw,60px); }\r\n.hero-eyebrow {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1.2vw,10px);\r\n letter-spacing:0.55em; text-transform:uppercase; color:var(--accent);\r\n margin-bottom:clamp(16px,3vh,28px);\r\n opacity:0; animation:fadeUp 1.2s 0.4s forwards;\r\n text-shadow:0 1px 8px rgba(0,0,0,0.8);\r\n}\r\n.hero-title {\r\n font-family:'Ubuntu',sans-serif;\r\n font-size:clamp(16px,3vw,40px); font-weight:300; font-style:italic;\r\n letter-spacing:0.05em; line-height:1.4; color:var(--white);\r\n opacity:0; animation:fadeUp 1.2s 0.8s forwards;\r\n text-shadow:0 2px 20px rgba(0,0,0,0.85), 0 1px 4px rgba(0,0,0,0.9);\r\n}\r\n.hero-name {\r\n display:block; font-weight:700; font-style:normal;\r\n font-size:clamp(26px,5.5vw,72px); letter-spacing:0.13em;\r\n text-transform:uppercase; color:var(--white); margin-top:8px;\r\n text-shadow:0 2px 24px rgba(0,0,0,0.85), 0 1px 4px rgba(0,0,0,0.9);\r\n}\r\n.hero-dates {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(12px,1.6vw,18px); font-weight:400; font-style:italic;\r\n letter-spacing:0.35em; color:var(--white); margin-top:clamp(14px,2.5vh,22px);\r\n opacity:0; animation:fadeUp 1.2s 1.2s forwards;\r\n text-shadow:0 1px 12px rgba(0,0,0,0.9), 0 2px 32px rgba(0,0,0,0.7);\r\n}\r\n.hero-rule {\r\n width:1px; height:clamp(36px,5vh,52px); background:var(--accent);\r\n margin:clamp(18px,3vh,30px) auto 0;\r\n opacity:0; animation:fadeUp 1.2s 1.5s forwards;\r\n}\r\n\r\n\/* Scroll cue \u2014 text BELOW the line, fully centred *\/\r\n.scroll-cue {\r\n position:absolute; bottom:clamp(24px,4vh,44px); left:50%;\r\n transform:translateX(-50%); z-index:3;\r\n display:flex; flex-direction:column; align-items:center; gap:0;\r\n opacity:0; animation:fadeUp 1.2s 2.2s forwards;\r\n}\r\n.scroll-line {\r\n width:1px; height:clamp(28px,4vh,40px);\r\n background:linear-gradient(to bottom, rgba(212,184,150,0.55), transparent);\r\n animation:linePulse 2s ease-in-out infinite;\r\n}\r\n.scroll-cue span {\r\n display:block; margin-top:8px;\r\n font-family:'Ubuntu',sans-serif; font-size:8px;\r\n letter-spacing:0.5em; text-transform:uppercase;\r\n color:rgba(245,243,239,0.25);\r\n}\r\n@keyframes linePulse {\r\n 0%,100% { opacity:1; transform:scaleY(1); }\r\n 50% { opacity:0.3; transform:scaleY(0.45); }\r\n}\r\n@keyframes fadeUp {\r\n from { opacity:0; transform:translateY(20px); }\r\n to { opacity:1; transform:translateY(0); }\r\n}\r\n\r\n\/* Panel quote styles \u2014 width:100% needed because parent is position:absolute *\/\r\n.pq-left { width:100%; padding:0 clamp(20px,10%,120px) 0 clamp(20px,8%,96px); max-width:none; }\r\n.pq-right { width:100%; padding:0 clamp(20px,8%,96px) 0 clamp(20px,10%,120px); max-width:none; text-align:right; }\r\n.pq-center { width:100%; text-align:center; padding:0 clamp(20px,6%,80px); }\r\n.pq-center .pq-text { max-width:640px; margin:0 auto; }\r\n\/* Constrain the actual text block so it doesn't span full width *\/\r\n.pq-left .pq-text, .pq-left .pq-tag { max-width:600px; }\r\n.pq-right .pq-text, .pq-right .pq-tag { max-width:600px; margin-left:auto; }\r\n.pq-tag {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.42em; text-transform:uppercase; color:var(--accent); margin-bottom:16px;\r\n}\r\n.pq-text {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(16px,2.8vw,36px); font-weight:300; font-style:italic;\r\n line-height:1.5; color:var(--white);\r\n text-shadow:0 2px 30px rgba(0,0,0,0.75);\r\n}\r\n.pq-source {\r\n display:block; margin-top:14px; font-family:'Ubuntu',sans-serif;\r\n font-size:clamp(9px,1.1vw,11px); letter-spacing:0.3em;\r\n color:var(--lgray); font-style:normal;\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n SECTION OVERLAYS\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.section-overlay { position:fixed; inset:0; z-index:500; pointer-events:none; visibility:hidden; }\r\n.section-overlay.active { pointer-events:auto; visibility:visible; }\r\n.section-panel {\r\n position:absolute; inset:0; background:var(--black);\r\n overflow-y:auto; overflow-x:hidden;\r\n transform:translateX(-100%);\r\n transition:transform 0.85s cubic-bezier(0.76,0,0.24,1);\r\n padding:0 var(--section-px) 100px;\r\n scrollbar-width:thin; scrollbar-color:rgba(212,184,150,0.25) transparent;\r\n}\r\n#overlay-gallery .section-panel { transform:translateX(100%); }\r\n#overlay-programme .section-panel { transform:translateY(100%); }\r\n#overlay-tributes .section-panel { transform:translateY(100%); }\r\n.section-overlay.active .section-panel { transform:translate(0,0); }\r\n\r\n\/* Sticky close bar *\/\r\n.sec-close-bar {\r\n position:sticky; top:0; background:var(--black);\r\n padding:clamp(18px,3vh,30px) 0 16px;\r\n display:flex; justify-content:flex-end;\r\n z-index:10; border-bottom:1px solid rgba(245,243,239,0.04);\r\n margin-bottom:clamp(32px,5vh,56px);\r\n}\r\n.btn-close {\r\n background:none; border:none; color:var(--gray);\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(9px,1.2vw,11px);\r\n letter-spacing:0.3em; text-transform:uppercase;\r\n cursor:pointer; padding:40px 0; transition:color 0.3s;\r\n display:flex; align-items:center; gap:12px;\r\n}\r\n.btn-close::before {\r\n content:''; display:block; width:24px; height:1px;\r\n background:currentColor; transition:width 0.3s;\r\n}\r\n.btn-close:hover { color:var(--accent); }\r\n.btn-close:hover::before { width:44px; }\r\n\r\n\/* Section headings *\/\r\n.sec-tag {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.5em; text-transform:uppercase; color:var(--accent); margin-bottom:12px;\r\n}\r\n.sec-title {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(32px,5vw,66px); font-weight:300; font-style:italic;\r\n line-height:1.1; color:var(--white);\r\n margin-bottom:clamp(32px,5vh,52px);\r\n padding-bottom:clamp(24px,4vh,36px);\r\n border-bottom:1px solid rgba(212,184,150,0.14);\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n LIFE SECTION\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.life-intro {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(17px,2.2vw,28px); font-weight:300; line-height:1.65;\r\n color:var(--white); max-width:800px; margin-bottom:20px;\r\n}\r\n.life-body {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(16px,1.8vw,19px); font-weight:300; line-height:1.95;\r\n color:var(--lgray); max-width:800px; margin-bottom:16px;\r\n}\r\n.life-body strong { color:var(--white); font-weight:400; }\r\n.life-body em { color:rgba(245,243,239,0.85); }\r\n\r\n.life-ch {\r\n display:grid; grid-template-columns:1fr 1fr;\r\n gap:clamp(28px,5vw,68px); margin:clamp(40px,7vh,76px) 0; align-items:start;\r\n}\r\n.life-ch.flip { direction:rtl; }\r\n.life-ch.flip > * { direction:ltr; }\r\n\r\n.life-yr {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.45em; text-transform:uppercase; color:var(--accent); margin-bottom:12px;\r\n}\r\n.life-cht {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(20px,2.8vw,40px); font-weight:300; font-style:italic;\r\n line-height:1.2; color:var(--white); margin-bottom:20px;\r\n}\r\n.life-pull {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(18px,2.4vw,32px); font-style:italic; font-weight:300;\r\n line-height:1.48; color:var(--white);\r\n border-left:1px solid var(--accent); padding-left:clamp(16px,2vw,30px);\r\n margin:clamp(32px,5vh,52px) 0;\r\n}\r\n.life-pull cite {\r\n display:block; font-size:clamp(11px,1.2vw,13px); font-style:normal;\r\n letter-spacing:0.22em; text-transform:uppercase; color:var(--gray); margin-top:12px;\r\n}\r\n.life-rule { width:40px; height:1px; background:var(--accent); margin:clamp(32px,5vh,52px) 0; }\r\n\r\n.life-img-wrap { position:relative; }\r\n.life-ghost {\r\n font-family:'Cormorant Garamond',serif; font-size:clamp(60px,8vw,96px); font-weight:300;\r\n line-height:1; color:rgba(245,243,239,0.04);\r\n position:absolute; right:-8px; top:-24px;\r\n user-select:none; pointer-events:none;\r\n}\r\n.life-img {\r\n width:100%; object-fit:cover; display:block;\r\n filter:grayscale(100%) contrast(1.05);\r\n}\r\n.life-img-cap {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(7px,0.9vw,8px);\r\n letter-spacing:0.28em; text-transform:uppercase; color:var(--gray); margin-top:9px;\r\n}\r\n.life-img-ph {\r\n width:100%; background:#141414;\r\n display:flex; align-items:center; justify-content:center;\r\n flex-direction:column; gap:8px;\r\n}\r\n.life-img-ph span {\r\n font-family:'Ubuntu',sans-serif; font-size:7px;\r\n letter-spacing:0.3em; text-transform:uppercase; color:rgba(245,243,239,0.08);\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n GALLERY\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.gallery-grid {\r\n display:grid;\r\n grid-template-columns:repeat(12,1fr);\r\n grid-auto-rows:54px; gap:5px; margin-top:12px;\r\n}\r\n.gi { overflow:hidden; position:relative; cursor:zoom-in; }\r\n.gi::after {\r\n content:attr(data-cap); position:absolute; bottom:0; left:0; right:0;\r\n background:rgba(10,10,10,0.9); color:var(--lgray);\r\n font-family:'Ubuntu',sans-serif; font-size:8px;\r\n letter-spacing:0.24em; text-transform:uppercase; padding:7px 10px;\r\n transform:translateY(100%); transition:transform 0.3s;\r\n}\r\n.gi:hover::after { transform:translateY(0); }\r\n.gi img {\r\n width:100%; height:100%; object-fit:cover; display:block;\r\n filter:grayscale(100%) contrast(1.05);\r\n transition:filter 0.5s, transform 0.6s;\r\n}\r\n.gi:hover img { filter:grayscale(50%) contrast(1.1); transform:scale(1.05); }\r\n\/* mosaic positions \u2014 generated by JS, no hard-coded positions needed *\/\r\n.gi { grid-column: var(--gc); grid-row: var(--gr); }\r\n\r\n\/* Lightbox *\/\r\n.lightbox {\r\n position:fixed; inset:0; z-index:2000;\r\n background:rgba(10,10,10,0.97);\r\n display:flex; align-items:center; justify-content:center;\r\n opacity:0; pointer-events:none; transition:opacity 0.3s;\r\n}\r\n.lightbox.open { opacity:1; pointer-events:auto; }\r\n.lightbox img { max-width:92vw; max-height:92vh; object-fit:contain; \/* full colour \u2014 no filter *\/ }\r\n.lb-close {\r\n position:absolute; top:clamp(20px,4vh,32px); right:clamp(20px,4vw,40px);\r\n background:none; border:none; cursor:pointer; color:var(--gray);\r\n font-family:'Ubuntu',sans-serif; font-size:10px;\r\n letter-spacing:0.3em; text-transform:uppercase; transition:color 0.3s;\r\n}\r\n.lb-close:hover { color:var(--accent); }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n TRIBUTES\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.trib-intro {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(16px,1.9vw,20px); font-weight:300; font-style:italic;\r\n color:var(--lgray); line-height:1.78; max-width:580px; margin-bottom:clamp(40px,7vh,68px);\r\n}\r\n.trib-list { display:flex; flex-direction:column; }\r\n.trib-item {\r\n border-top:1px solid rgba(245,243,239,0.06);\r\n padding:clamp(28px,5vh,50px) 0;\r\n display:grid; grid-template-columns:clamp(120px,16vw,200px) 1fr;\r\n gap:clamp(20px,4vw,60px); align-items:start;\r\n transition:border-color 0.3s;\r\n}\r\n.trib-item:hover { border-color:rgba(212,184,150,0.16); }\r\n.trib-name {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(10px,1.2vw,12px); font-weight:400;\r\n letter-spacing:0.22em; text-transform:uppercase; color:var(--white); margin-bottom:6px;\r\n}\r\n.trib-rel { font-family:'Cormorant Garamond',serif; font-size:15px; font-style:italic; color:var(--gray); }\r\n.trib-body {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(16px,1.8vw,20px); font-weight:300;\r\n line-height:1.88; color:var(--lgray); position:relative; padding-left:18px;\r\n}\r\n.trib-body::before {\r\n content:'\\201C'; font-size:clamp(60px,8vw,88px); line-height:0.72;\r\n color:rgba(212,184,150,0.09); position:absolute; left:-6px; top:8px;\r\n font-family:'Cormorant Garamond',serif;\r\n}\r\n.trib-body p { margin-bottom:14px; }\r\n.trib-body p:last-child { margin-bottom:0; }\r\n.trib-body em { color:var(--white); font-style:normal; }\r\n.trib-scripture {\r\n font-family:'Cormorant Garamond',serif; font-size:15px; font-style:italic;\r\n color:var(--gray); margin-top:16px; padding-top:14px;\r\n border-top:1px solid rgba(245,243,239,0.06);\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n PROGRAMME\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.prog-intro {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(17px,2.2vw,26px); font-weight:300; line-height:1.65;\r\n color:var(--white); max-width:800px; margin-bottom:clamp(32px,5vh,52px);\r\n}\r\n.prog-meta-grid {\r\n display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr));\r\n gap:clamp(20px,3vw,40px);\r\n margin-bottom:clamp(40px,7vh,72px);\r\n padding-bottom:clamp(32px,5vh,52px);\r\n border-bottom:1px solid rgba(212,184,150,0.14);\r\n}\r\n.prog-meta-label {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.45em; text-transform:uppercase; color:var(--accent); margin-bottom:8px;\r\n}\r\n.prog-meta-value {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(15px,1.8vw,19px); font-weight:300; color:var(--white); line-height:1.55;\r\n}\r\n.prog-meta-value em { color:var(--lgray); font-style:normal; font-size:0.88em; display:block; }\r\n.prog-order-title {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.45em; text-transform:uppercase; color:var(--accent);\r\n margin-bottom:clamp(24px,4vh,40px);\r\n}\r\n.prog-item {\r\n display:grid; grid-template-columns:clamp(80px,10vw,130px) 1fr;\r\n gap:clamp(16px,3vw,48px);\r\n border-top:1px solid rgba(245,243,239,0.06);\r\n padding:clamp(18px,3vh,32px) 0;\r\n transition:border-color 0.3s;\r\n}\r\n.prog-item:hover { border-color:rgba(212,184,150,0.2); }\r\n.prog-item-time {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(9px,1vw,10px);\r\n letter-spacing:0.2em; color:var(--gray); padding-top:6px;\r\n}\r\n.prog-item-name {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(17px,2vw,24px); font-weight:300; color:var(--white);\r\n line-height:1.3; margin-bottom:5px;\r\n}\r\n.prog-item-detail {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(14px,1.5vw,16px); font-weight:300; font-style:italic;\r\n color:var(--gray); line-height:1.6;\r\n}\r\n.prog-rule { width:40px; height:1px; background:var(--accent); margin:clamp(32px,5vh,52px) 0; }\r\n.prog-directions-btn {\r\n display:inline-flex; align-items:center; gap:10px;\r\n padding:13px 24px; border:1px solid rgba(212,184,150,0.26);\r\n color:var(--accent); font-family:'Ubuntu',sans-serif;\r\n font-size:clamp(9px,1vw,10px); letter-spacing:0.3em; text-transform:uppercase;\r\n text-decoration:none; background:none; transition:background 0.3s, color 0.3s; cursor:pointer;\r\n}\r\n.prog-directions-btn:hover { background:rgba(212,184,150,0.08); color:var(--white); }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n RESPONSIVE BREAKPOINTS\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n\/* Tablet \u2014 \u2264 1024px *\/\r\n@media(max-width:1024px) {\r\n :root { --section-px:48px; }\r\n #nav-life { top:28px; left:28px; }\r\n #nav-gallery { top:28px; right:28px; }\r\n #nav-programme { bottom:28px; left:28px; }\r\n #nav-tributes { bottom:28px; right:28px; }\r\n .gallery-grid { grid-auto-rows:46px; }\r\n}\r\n\r\n\/* Mobile \u2014 \u2264 768px *\/\r\n@media(max-width:768px) {\r\n :root { --section-px:24px; --nav-size:11px; }\r\n #music-bar { padding:6px 12px 6px 10px; }\r\n .music-label { display:none; }\r\n #nav-life { top:22px; left:22px; }\r\n #nav-gallery { top:22px; right:22px; }\r\n #nav-programme { bottom:22px; left:22px; }\r\n #nav-tributes { bottom:22px; right:22px; }\r\n .life-ch { grid-template-columns:1fr; gap:28px; }\r\n .life-ch.flip { direction:ltr; }\r\n .life-ghost { display:none; }\r\n .trib-item { grid-template-columns:1fr; gap:14px; }\r\n .prog-item { grid-template-columns:1fr; gap:4px; }\r\n .prog-layout { grid-template-columns:1fr; }\r\n .gallery-grid { grid-template-columns:repeat(4,1fr); grid-auto-rows:48px; }\r\n \/* Keep panel quotes in their left\/right\/center positions on mobile \u2014\r\n just reduce padding so they don't overflow *\/\r\n .pq-left { padding:0 16px 0 20px; }\r\n .pq-right { padding:0 20px 0 16px; }\r\n}\r\n\r\n\/* Phone only \u2014 \u2264 480px: reduce hero text so it fits over the image *\/\r\n@media(max-width:480px) {\r\n :root { --section-px:18px; }\r\n\r\n \/* Hero text \u2014 smaller on phones only *\/\r\n .hero-eyebrow { font-size:8px; letter-spacing:0.35em; margin-bottom:12px; }\r\n .hero-title { font-size:14px; }\r\n .hero-name { font-size:22px; letter-spacing:0.07em; margin-top:6px; }\r\n .hero-dates { font-size:10px; letter-spacing:0.2em; margin-top:10px; }\r\n .hero-rule { height:28px; margin-top:14px; }\r\n .hero-inner { padding:0 16px; }\r\n\r\n \/* Panel quotes \u2014 slightly smaller text on small phones *\/\r\n .pq-text { font-size:15px; }\r\n .pq-left { padding:0 12px 0 16px; }\r\n .pq-right { padding:0 16px 0 12px; }\r\n\r\n \/* Gallery \u2014 2-column on very small screens *\/\r\n .gallery-grid { grid-template-columns:repeat(2,1fr); grid-auto-rows:52px; }\r\n .panel-img { transform:scale(1.04); }\r\n}\r\n\r\n\/* Touch devices \u2014 disable hover captions (use tap) *\/\r\n@media(hover:none) {\r\n .gi::after { transition:none; }\r\n .gi:active::after { transform:translateY(0); }\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n FORCE OVERLAY FIX (STRONG OVERRIDE)\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n.panel {\r\n position: relative !important;\r\n height: 100vh !important;\r\n min-height: 100vh !important;\r\n overflow: hidden !important;\r\n}\r\n\r\n.panel-img {\r\n position: absolute !important;\r\n inset: 0 !important;\r\n width: 100% !important;\r\n height: 100% !important;\r\n object-fit: cover !important;\r\n z-index: 1 !important;\r\n}\r\n\r\n\/* \ud83d\udd25 THIS IS THE MAIN FIX *\/\r\n.panel-content {\r\n position: absolute !important;\r\n top: 0 !important;\r\n left: 0 !important;\r\n width: 100% !important;\r\n height: 100% !important;\r\n z-index: 5 !important;\r\n\r\n display: flex !important;\r\n align-items: center !important;\r\n justify-content: center !important;\r\n\r\n text-align: center !important;\r\n padding: 0 20px !important;\r\n}\r\n\r\n\/* Remove weird spacing on mobile *\/\r\n@media(max-width:768px) {\r\n .panel {\r\n height: 100vh !important;\r\n }\r\n\r\n .hero-inner {\r\n transform: translateY(-12%) !important;\r\n padding: 0 16px !important;\r\n }\r\n\r\n .hero-title {\r\n margin-bottom: 6px !important;\r\n }\r\n\r\n .hero-dates {\r\n margin-top: 4px !important;\r\n }\r\n\r\n .hero-rule {\r\n margin-top: 8px !important;\r\n height: 18px !important;\r\n }\r\n\r\n .scroll-cue {\r\n bottom: 18px !important;\r\n }\r\n}\r\n\r\n.panel-img {\r\n object-position: center top;\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n TEXT VISIBILITY BOOST (FRONT PANELS)\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n\/* Main quote text *\/\r\n.pq-text {\r\n color: #ffffff !important;\r\n text-shadow:\r\n 0 2px 20px rgba(0,0,0,0.85),\r\n 0 1px 6px rgba(0,0,0,0.9);\r\n}\r\n\r\n\/* Small heading (e.g. \"A Precious Gift\") *\/\r\n.pq-tag {\r\n color: #e6d3b0 !important; \/* slightly brighter accent *\/\r\n text-shadow: 0 1px 8px rgba(0,0,0,0.8);\r\n}\r\n\r\n\/* Source text *\/\r\n.pq-source {\r\n color: #d6d1c7 !important;\r\n}\r\n\r\n.pq-text {\r\n text-shadow:\r\n 0 0 8px rgba(255,255,255,0.15),\r\n 0 2px 20px rgba(0,0,0,0.9);\r\n}\r\n\r\n.panel-vignette {\r\n background: radial-gradient(\r\n ellipse at 50% 50%,\r\n rgba(0,0,0,0.2) 20%,\r\n rgba(0,0,0,0.75) 100%\r\n );\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n HERO TEXT VISIBILITY BOOST\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n\/* Top small text (dates) *\/\r\n.hero-eyebrow {\r\n color: #e6d3b0 !important;\r\n text-shadow:\r\n 0 1px 8px rgba(0,0,0,0.85),\r\n 0 0 6px rgba(255,255,255,0.15);\r\n}\r\n\r\n\/* Main title *\/\r\n.hero-title {\r\n color: #ffffff !important;\r\n text-shadow:\r\n 0 2px 24px rgba(0,0,0,0.9),\r\n 0 0 10px rgba(255,255,255,0.12);\r\n}\r\n\r\n\/* Name (make this the visual anchor) *\/\r\n.hero-name {\r\n color: #ffffff !important;\r\n text-shadow:\r\n 0 3px 30px rgba(0,0,0,0.95),\r\n 0 0 12px rgba(255,255,255,0.18);\r\n}\r\n\r\n\/* Bottom descriptor text *\/\r\n.hero-dates {\r\n color: #f0ebe3 !important;\r\n text-shadow:\r\n 0 2px 16px rgba(0,0,0,0.9),\r\n 0 0 6px rgba(255,255,255,0.1);\r\n}\r\n\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n\r\n<div id=\"music-bar\" title=\"Play \/ Pause music\" aria-label=\"Toggle background music\">\r\n <div class=\"wave\">\r\n <span><\/span><span><\/span><span><\/span><span><\/span>\r\n <span><\/span><span><\/span><span><\/span>\r\n <\/div>\r\n <span class=\"music-label\" id=\"music-label\">Play Music<\/span>\r\n<\/div>\r\n<audio id=\"bg-audio\" loop preload=\"auto\"><\/audio>\r\n\r\n\r\n<div class=\"corner-nav\" id=\"nav-life\">\r\n <button id=\"btn-life\">Life<\/button>\r\n<\/div>\r\n<div class=\"corner-nav\" id=\"nav-gallery\">\r\n <button id=\"btn-gallery\">Gallery<\/button>\r\n<\/div>\r\n<div class=\"corner-nav\" id=\"nav-programme\">\r\n <button id=\"btn-programme\">Programme<\/button>\r\n<\/div>\r\n<div class=\"corner-nav\" id=\"nav-tributes\">\r\n <button id=\"btn-tributes\">Tributes<\/button>\r\n<\/div>\r\n\r\n\r\n<main class=\"journey\">\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg1\">\r\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\"><circle cx=\"32\" cy=\"22\" r=\"12\" stroke=\"#f5f3ef\" stroke-width=\"1\" fill=\"none\"\/><path d=\"M8 60c0-13.3 10.7-24 24-24s24 10.7 24 24\" stroke=\"#f5f3ef\" stroke-width=\"1\" fill=\"none\"\/><\/svg>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-panel1\" class=\"panel-img\" src=\"\" alt=\"Michelle Chanice Mwende\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"hero-inner\">\r\n <p class=\"hero-eyebrow\">26 April 2004 — 25 February 2025<\/p>\r\n <h1 class=\"hero-title\">\r\n In Loving Memory of\r\n <span class=\"hero-name\">Michelle Chanice<br>Mwende<\/span>\r\n <\/h1>\r\n <p class=\"hero-dates\">Beloved Daughter · Sister · Aunt · Friend<\/p>\r\n <div class=\"hero-rule\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"scroll-cue\">\r\n <div class=\"scroll-line\"><\/div>\r\n <span>Scroll<\/span>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg2\"><\/div>\r\n <img decoding=\"async\" id=\"img-panel2\" class=\"panel-img\" src=\"\" alt=\"\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"pq-left\">\r\n <p class=\"pq-tag\">A Precious Gift<\/p>\r\n <p class=\"pq-text\">\"Her presence brought warmth, gentleness and quiet joy into the lives of all who knew her.\"<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg3\"><\/div>\r\n <img decoding=\"async\" id=\"img-panel3\" class=\"panel-img\" src=\"\" alt=\"\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"pq-right\">\r\n <p class=\"pq-tag\">St. Christopher’s · Karen<\/p>\r\n <p class=\"pq-text\">\"From a shy young girl, she rose to contest for the top presidential position in her school — a testament to her belief that with God, nothing is impossible.\"<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg4\"><\/div>\r\n <img decoding=\"async\" id=\"img-panel4\" class=\"panel-img\" src=\"\" alt=\"\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"pq-left\">\r\n <p class=\"pq-tag\">University of Western Australia · 2023<\/p>\r\n <p class=\"pq-text\">\"She carried with her a bright mind, a hopeful spirit and dreams of making a difference in the world.\"<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg5\"><\/div>\r\n <img decoding=\"async\" id=\"img-panel5\" class=\"panel-img\" src=\"\" alt=\"\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"pq-center\">\r\n <p class=\"pq-tag\" style=\"text-align:center;\">Nothing is impossible with God<\/p>\r\n <p class=\"pq-text\">\"Do not let your hearts be troubled. Believe in God; believe also in me. In my Father’s house are many rooms.\"<span class=\"pq-source\">— John 14:1–3<\/span><\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\" style=\"background:var(--black);\">\r\n <div class=\"panel-content\">\r\n <div style=\"text-align:center;padding:clamp(20px,5vw,40px);\">\r\n <p class=\"pq-tag\" style=\"text-align:center;\">Until We Meet Again<\/p>\r\n <p style=\"font-family:'Cormorant Garamond',serif;font-size:clamp(15px,2vw,24px);font-weight:300;font-style:italic;color:var(--lgray);max-width:460px;margin:0 auto;line-height:1.85;\">Gone from our sight, but never from our hearts.<br>Rest well, our dearest Michelle.<\/p>\r\n <div style=\"width:1px;height:clamp(50px,8vh,80px);background:linear-gradient(to bottom,var(--accent),transparent);margin:clamp(32px,6vh,52px) auto 0;\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n<\/main>\r\n\r\n\r\n<div class=\"section-overlay\" id=\"overlay-life\">\r\n <div class=\"section-panel\">\r\n <div class=\"sec-close-bar\">\r\n <button class=\"btn-close\" id=\"close-life\">Close<\/button>\r\n <\/div>\r\n\r\n <p class=\"sec-tag\">The Story of a Life<\/p>\r\n <h2 class=\"sec-title\">Michelle<br>Chanice Mwende<\/h2>\r\n\r\n <p class=\"life-intro\">Today, we gather with heavy hearts, yet with deep gratitude to God for the life of <strong>Michelle Chanice Mwende<\/strong> \u2014 a beloved daughter, sister, aunt, cousin, niece and friend to so many.<\/p>\r\n <p class=\"life-body\">Michelle was born on the <strong>26th of April, 2004<\/strong>and was called home on the <strong>25th of February, 2025<\/strong> \u2014 a precious gift whose presence brought warmth, gentleness and quiet joy into the lives of all who knew her. Though her time with us was far too short, her life was full of meaning, love and beautiful memories that will remain with us forever.<\/p>\r\n\r\n <div class=\"life-rule\"><\/div>\r\n\r\n \r\n <div class=\"life-ch\">\r\n <div style=\"position:relative;\">\r\n <span class=\"life-ghost\">01<\/span>\r\n <p class=\"life-yr\">Early Education<\/p>\r\n <h3 class=\"life-cht\">Our Lady of Peace<br>& St. Christopher’s<\/h3>\r\n <p class=\"life-body\">Michelle began her early years at <strong>Our Lady of Peace Primary School in Karen<\/strong>, from nursery through to Standard 4. She then continued at <strong>St. Christopher’s International School<\/strong>, where she studied from Year 4 to Year 13.<\/p>\r\n <p class=\"life-body\">It was there that her character blossomed \u2014 she grew not only academically but also in confidence, courage and leadership. From being a shy young girl, she rose to <em>contest for the top presidential position in her school<\/em> \u2014 a true testament to her strength and belief that with God, nothing is impossible.<\/p>\r\n <\/div>\r\n <div class=\"life-img-wrap\">\r\n <div class=\"life-img-ph\" id=\"life-ph1\" style=\"aspect-ratio:3\/4;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>Childhood \u00b7 School Years<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life1\" class=\"life-img\" style=\"aspect-ratio:3\/4;display:none;\" src=\"\" alt=\"Michelle \u2014 School years\">\r\n <p class=\"life-img-cap\">Michelle · Karen, Nairobi<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <blockquote class=\"life-pull\">\r\n “It was hard to fight with Michelle — because she carried within her a gentle spirit that sought understanding and harmony.”\r\n <cite>— Family<\/cite>\r\n <\/blockquote>\r\n\r\n \r\n <div class=\"life-ch flip\">\r\n <div style=\"position:relative;\">\r\n <span class=\"life-ghost\">02<\/span>\r\n <p class=\"life-yr\">Who She Was<\/p>\r\n <h3 class=\"life-cht\">Kind, Calm,<br>Deeply Thoughtful<\/h3>\r\n <p class=\"life-body\">Michelle was a truly special soul — <strong>kind, calm, loving and deeply thoughtful<\/strong>. She was the kind of person who listened more than she spoke, who brought peace rather than conflict. She had a rare gift of choosing friends wisely and building meaningful, lasting relationships.<\/p>\r\n <p class=\"life-body\">She was also beautifully creative. Michelle loved <strong>art<\/strong> — she expressed herself through drawing and found joy in creating. <strong>Music<\/strong> was part of her everyday life; she could not take a shower without singing along, knowing songs word for word. Her love for <strong>stories and novels<\/strong> began from a young age — books were her treasured companions and novels were always the best gift she could receive.<\/p>\r\n <\/div>\r\n <div class=\"life-img-wrap\">\r\n <div class=\"life-img-ph\" id=\"life-ph2\" style=\"aspect-ratio:4\/5;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>Character \u00b7 Friends<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life2\" class=\"life-img\" style=\"aspect-ratio:4\/5;display:none;\" src=\"\" alt=\"Michelle \u2014 Character\">\r\n <p class=\"life-img-cap\">Michelle · Studying’ At Home<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div style=\"margin:clamp(28px,5vh,52px) 0 12px;\">\r\n <div class=\"life-img-ph\" id=\"life-ph3\" style=\"aspect-ratio:16\/7;width:100%;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>Family \u00b7 Group<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life3\" class=\"life-img\" style=\"aspect-ratio:16\/7;display:none;\" src=\"\" alt=\"Michelle with family\">\r\n <p class=\"life-img-cap\">Michelle with her family<\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"life-ch\" style=\"margin-top:clamp(40px,7vh,72px);\">\r\n <div style=\"position:relative;\">\r\n <span class=\"life-ghost\">03<\/span>\r\n <p class=\"life-yr\">July 2023<\/p>\r\n <h3 class=\"life-cht\">University of<br>Western Australia<\/h3>\r\n <p class=\"life-body\">In <strong>July 2023<\/strong>, Michelle joined the <strong>University of Western Australia<\/strong> to pursue a degree in <strong>Biomedical Science<\/strong>. She carried with her a bright mind, a hopeful spirit and dreams of making a difference in the world.<\/p>\r\n <p class=\"life-body\">Her dream was to become a <em>children’s doctor<\/em> — which showed just how caring and selfless she truly was. She found joy in simple and meaningful things — swimming, going on adventures and spending time with those she loved. And at home, she always expressed her love in the most beautiful ways, even through something as simple as <strong>making pancakes<\/strong>.<\/p>\r\n <\/div>\r\n <div class=\"life-img-wrap\">\r\n <div class=\"life-img-ph\" id=\"life-ph4\" style=\"aspect-ratio:3\/4;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>University \u00b7 Perth<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life4\" class=\"life-img\" style=\"aspect-ratio:3\/4;display:none;\" src=\"\" alt=\"Michelle \u2014 UWA\">\r\n <p class=\"life-img-cap\">Michelle · With Nature<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"life-ch flip\">\r\n <div style=\"position:relative;\">\r\n <span class=\"life-ghost\">04<\/span>\r\n <p class=\"life-yr\">Faith<\/p>\r\n <h3 class=\"life-cht\">A Devoted<br>Catholic Christian<\/h3>\r\n <p class=\"life-body\">Michelle was a devoted Catholic Christian. She was baptised, received her First Holy Communion and later the Sacrament of Confirmation at <strong>Regina Caeli Catholic Church in Karen<\/strong>. Her faith was not just something she practiced — it was something she <em>lived<\/em>.<\/p>\r\n <p class=\"life-body\">She believed firmly that <strong>nothing is impossible with God<\/strong> and held onto that belief through every stage of her life. She testified to His healing power, believing He healed her from asthma as a young child and guided her through her personal growth and transformation.<\/p>\r\n <\/div>\r\n <div class=\"life-img-wrap\">\r\n <div class=\"life-img-ph\" id=\"life-ph5\" style=\"aspect-ratio:4\/5;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>Faith \u00b7 Church<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life5\" class=\"life-img\" style=\"aspect-ratio:4\/5;display:none;\" src=\"\" alt=\"Michelle \u2014 Faith\">\r\n <p class=\"life-img-cap\">Michelle · Bright Smiles<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"life-rule\"><\/div>\r\n <p class=\"life-yr\" style=\"margin-bottom:12px;\">Her Family<\/p>\r\n <p class=\"life-intro\">Above all, Michelle loved her family deeply.<\/p>\r\n <p class=\"life-body\">She was a cherished daughter to <strong>Hellen Muthoni Njiru<\/strong>, a loving sister to <strong>Stella Adlike Njura<\/strong> and <strong>Wilson John Muriuki<\/strong> and a dear sister-in-law to <strong>Oleg Bukrev<\/strong> and <strong>Evarline Wambui<\/strong>. She was a proud and loving aunt to <strong>Hazel Nia Muthoni<\/strong> and <strong>Blane Gichuki<\/strong>, a cousin, a niece and a friend to many. Her presence in the family was one of warmth, unity, and quiet strength.<\/p>\r\n\r\n <blockquote class=\"life-pull\" style=\"margin-top:clamp(28px,5vh,48px);\">\r\n “Michelle, you were deeply loved and you will forever be missed. Your light will continue to shine in our hearts, in our memories and in the love you left behind.”\r\n <cite>— From the Family<\/cite>\r\n <\/blockquote>\r\n <p class=\"life-body\" style=\"font-style:italic;color:var(--gray);margin-top:10px;\">May her beautiful soul rest in eternal peace. Amen.<\/p>\r\n <\/div>\r\n<\/div>\r\n\r\n\r\n<div class=\"section-overlay\" id=\"overlay-gallery\">\r\n <div class=\"section-panel\">\r\n <div class=\"sec-close-bar\">\r\n <button class=\"btn-close\" id=\"close-gallery\">Close<\/button>\r\n <\/div>\r\n <p class=\"sec-tag\">Moments in Time<\/p>\r\n <h2 class=\"sec-title\">Gallery<\/h2>\r\n <div class=\"gallery-grid\" id=\"gallery-grid\"><\/div>\r\n <p style=\"font-family:'Ubuntu',sans-serif;font-size:8px;letter-spacing:0.3em;text-transform:uppercase;color:rgba(245,243,239,0.16);text-align:center;margin-top:clamp(24px,4vh,48px);\">Hover to reveal caption · Click to enlarge<\/p>\r\n <\/div>\r\n<\/div>\r\n\r\n\r\n<div class=\"section-overlay\" id=\"overlay-programme\">\r\n <div class=\"section-panel\">\r\n <div class=\"sec-close-bar\">\r\n <button class=\"btn-close\" id=\"close-programme\">Close<\/button>\r\n <\/div>\r\n <p class=\"sec-tag\">Order of Service<\/p>\r\n <h2 class=\"sec-title\">Programme<\/h2>\r\n\r\n <p class=\"prog-intro\">We gather to honour, celebrate and bid farewell to <strong>Michelle Chanice Mwende<\/strong> \u2014 a beloved daughter, sister, aunt and friend. May this service bring comfort, peace and the assurance of God’s eternal love.<\/p>\r\n\r\n \r\n <div class=\"prog-meta-grid\">\r\n <div>\r\n <p class=\"prog-meta-label\">Date<\/p>\r\n <p class=\"prog-meta-value\">18th April, 2026<\/p>\r\n <\/div>\r\n <div>\r\n <p class=\"prog-meta-label\">Time<\/p>\r\n <p class=\"prog-meta-value\">10:00 AM <em>to 12:00 PM<\/em><\/p>\r\n <\/div>\r\n <div>\r\n <p class=\"prog-meta-label\">Venue<\/p>\r\n <p class=\"prog-meta-value\">CITAM Karen <em>Nairobi, Kenya<\/em><\/p>\r\n <\/div>\r\n <div>\r\n <p class=\"prog-meta-label\">Officiated by<\/p>\r\n <p class=\"prog-meta-value\">Bishop Cathy Kiuna<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <p class=\"prog-order-title\">Order of Service<\/p>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\">10:00 AM<\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Procession & Opening<\/p>\r\n <p class=\"prog-item-detail\">Family and congregation take their seats. Entry of the cort\u00e8ge.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Opening Prayer<\/p>\r\n <p class=\"prog-item-detail\">Led by Bishop Cathy Kiuna<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Worship & Praise<\/p>\r\n <p class=\"prog-item-detail\">Congregational singing<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Scripture Reading<\/p>\r\n <p class=\"prog-item-detail\">John 14:1–6 — <em>“Do not let your hearts be troubled…”<\/em><\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Tributes<\/p>\r\n <p class=\"prog-item-detail\">From family and friends<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Eulogy<\/p>\r\n <p class=\"prog-item-detail\">A celebration of the life of Michelle Chanice Mwende<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Sermon<\/p>\r\n <p class=\"prog-item-detail\">Bishop Cathy Kiuna<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Final Commendation & Prayer<\/p>\r\n <p class=\"prog-item-detail\">Committal of Michelle into God’s care<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\">12:00 PM<\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Recessional<\/p>\r\n <p class=\"prog-item-detail\">Departure of the family and cort\u00e8ge<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-rule\"><\/div>\r\n\r\n <blockquote class=\"life-pull\">\r\n “I am the resurrection and the life. Whoever believes in me, though he die, yet shall he live.”\r\n <cite>— John 11:25<\/cite>\r\n <\/blockquote>\r\n\r\n <div class=\"prog-rule\"><\/div>\r\n\r\n \r\n <p class=\"prog-order-title\">Directions<\/p>\r\n <p style=\"font-family:'Cormorant Garamond',serif;font-size:clamp(15px,1.7vw,18px);font-weight:300;color:var(--lgray);line-height:1.8;margin-bottom:clamp(16px,2vh,24px);\">CITAM Karen — Ngong Road, Karen, Nairobi<\/p>\r\n <a id=\"directions-btn\" href=\"#\" target=\"_blank\" rel=\"noopener\" class=\"prog-directions-btn\" style=\"display:none;\">Open in Google Maps \u2197<\/a>\r\n <p id=\"map-no-url\" style=\"font-family:'Ubuntu',sans-serif;font-size:8px;letter-spacing:0.2em;color:rgba(245,243,239,0.16);display:none;\">Set VENUE_MAPS_LINK in the config to enable directions<\/p>\r\n\r\n <\/div>\r\n<\/div>\r\n\r\n\r\n<div class=\"section-overlay\" id=\"overlay-tributes\">\r\n <div class=\"section-panel\">\r\n <div class=\"sec-close-bar\">\r\n <button class=\"btn-close\" id=\"close-tributes\">Close<\/button>\r\n <\/div>\r\n <p class=\"sec-tag\">Words of Love<\/p>\r\n <h2 class=\"sec-title\">Tributes<\/h2>\r\n\r\n <p class=\"trib-intro\">Those who loved her most speak here — in their own words, with their own grief and with a love that does not end.<\/p>\r\n\r\n <div class=\"trib-list\">\r\n \r\n <div class=\"trib-item\">\r\n <div>\r\n <p class=\"trib-name\">Hellen Muthoni<\/p>\r\n <p class=\"trib-rel\">Mother<\/p>\r\n <\/div>\r\n <div class=\"trib-body\">\r\n <p>My dearest daughter, <em>Michy Mwesh, Sweety<\/em> — today, I stand with a heart full of love and deep sorrow as I remember you. In your 21 years, you brought so much light into my life. You were calm, always smiling and your quiet happiness filled our home with peace.<\/p>\r\n <p>You were so talented; your artwork was a gift — the way you could look at someone and draw them so beautifully. You loved your little baby pink world and it reflected your gentle and loving heart. You also loved music so deeply; you knew every song word for word and you brought songs to life in such a special way.<\/p>\r\n <p>You were not just my daughter — <em>you were my confidant and my best friend.<\/em> You stood by me in everything; helping me with my work, my emails and so many responsibilities. You were my strength. On every trip, you were my partner, my roommate, my joy.<\/p>\r\n <p>I remember how I used to call you my <em>“handbag,”<\/em> and how you loved it. People would even ask where my handbag was if I came without you. And you would always hold my hand like a little baby, all through your life. That love we shared was so special.<\/p>\r\n <p>You grew from a quiet girl into a strong and confident young woman. You made me so proud and your dream of becoming a children’s doctor showed just how caring and selfless you were. Though my heart aches, I find comfort in knowing you are resting in God’s presence, where there is no pain, only peace. <em>Until we meet again — I love you endlessly.<\/em><\/p>\r\n <p class=\"trib-scripture\">Revelation 21:4 — “He will wipe every tear from their eyes.”<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"trib-item\">\r\n <div>\r\n <p class=\"trib-name\">Stella Adline<\/p>\r\n <p class=\"trib-rel\">Sister<\/p>\r\n <\/div>\r\n <div class=\"trib-body\">\r\n <p>Dear Sis — I will always love you. I’m so grateful for the last three years we had together. Those years meant everything to me. We truly got to know each other — to learn, to grow, and to build a bond that I will always treasure. I’m thankful that I had the chance to tell you and to show you, just how much I loved you.<\/p>\r\n <p>We had so many dreams — dreams I held for you and for us. I dreamed of seeing you graduate, of watching you get married and of seeing you have children of your own.<\/p>\r\n <p>But I promise you this — <em>I will keep your memory alive.<\/em> I will miss your laughter, and that infectious smile that could light up a room. I will miss how you always listened, how you were always there. I will miss your wisdom, your presence and the comfort you brought just by being you.<\/p>\r\n <p>When you joined me in Australia, <em>something inside me felt safe in a way I can’t fully explain.<\/em> Having you there gave me strength and reassurance and I will always hold onto that. It’s been a month since you left us, yet the pain still feels as fresh as if it happened only moments ago. <em>Until we meet again, my baby. I will always love you.<\/em><\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"trib-item\">\r\n <div>\r\n <p class=\"trib-name\">Wilson Muriuki<\/p>\r\n <p class=\"trib-rel\">Brother<\/p>\r\n <\/div>\r\n <div class=\"trib-body\">\r\n <p>Michelle, I still remember how excited I was when I heard I was going to be your big brother. Your arrival was one of the happiest days of my life. You brought me so much joy growing up — especially in those early days when you believed I was your baby, and we held onto that little story for so long until you discovered I was actually your elder brother.<\/p>\r\n <p>Every time you were around, I found myself turning into a comedian with my dry jokes — <em>all just to see your beautiful smile and those dimples light up.<\/em><\/p>\r\n <p>I wish we could celebrate more milestones together — see you graduate, build your career and become the billionaire you always dreamed of. But God had better plans and we pray you are in a better place.<\/p>\r\n <p><em>You’ve left us far too soon, siz<\/em>, but I will forever be grateful for the time God gave us with you. Your humility, love and caring heart taught me so much. I LOVE YOU SO MUCH, lil siz — and I will forever miss you. This is not goodbye, it’s a see you later.<\/p>\r\n <p class=\"trib-scripture\">Psalm 34:18 — “The Lord is close to the brokenhearted and saves those who are crushed in spirit.”<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div style=\"text-align:center;margin-top:clamp(40px,8vh,76px);padding-top:clamp(28px,5vh,56px);border-top:1px solid rgba(245,243,239,0.06);\">\r\n <p style=\"font-family:'Cormorant Garamond',serif;font-size:clamp(16px,1.8vw,19px);font-weight:300;font-style:italic;color:var(--lgray);line-height:1.8;\">To share a tribute, please contact the family at<br><span style=\"color:var(--accent);font-style:normal;font-size:clamp(13px,1.5vw,15px);\">[<a href=\"\/cdn-cgi\/l\/email-protection\" class=\"__cf_email__\" data-cfemail=\"6600070b0f0a1f26030b070f0a4805090b\">[email protected]<\/a>]<\/span><\/p>\r\n <\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n\r\n<div class=\"lightbox\" id=\"lightbox\">\r\n <button class=\"lb-close\" id=\"lb-close-btn\">Close<\/button>\r\n <img decoding=\"async\" id=\"lightbox-img\" src=\"\" alt=\"\">\r\n<\/div>\r\n\r\n<script data-cfasync=\"false\" src=\"\/cdn-cgi\/scripts\/5c5dd728\/cloudflare-static\/email-decode.min.js\"><\/script><script>\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 All logic runs after DOM is ready \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n\r\n\/* Init directions link *\/\r\n(function initMap() {\r\n if (typeof VENUE_MAPS_LINK !== 'undefined' && VENUE_MAPS_LINK && !VENUE_MAPS_LINK.startsWith('YOUR_MAP')) {\r\n var btn = document.getElementById('directions-btn');\r\n if (btn) { btn.href = VENUE_MAPS_LINK; btn.style.display = 'inline-flex'; }\r\n } else {\r\n var noUrl = document.getElementById('map-no-url');\r\n if (noUrl) noUrl.style.display = 'block';\r\n }\r\n})();\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Helpers \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nfunction isReal(url) { return url && !url.startsWith('YOUR_IMAGE') && !url.startsWith('YOUR_AUDIO'); }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Music \u2014 autoplay, loop, click to pause\/play \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nconst audio = document.getElementById('bg-audio');\r\nconst musicBar = document.getElementById('music-bar');\r\nconst musicLabel = document.getElementById('music-label');\r\n\r\nif (isReal(MUSIC_URL)) {\r\n audio.src = MUSIC_URL;\r\n audio.volume = 0.35;\r\n audio.loop = true;\r\n\r\n \/* Autoplay \u2014 browsers require a user gesture first.\r\n We attempt silent autoplay; if blocked, we wait for\r\n the first click\/touch anywhere and then start. *\/\r\n const tryAutoplay = () => {\r\n audio.play().then(() => {\r\n musicBar.classList.remove('paused');\r\n musicLabel.textContent = 'Now Playing';\r\n }).catch(() => {\r\n \/* Autoplay blocked \u2014 wait for first interaction *\/\r\n musicBar.classList.add('paused');\r\n musicLabel.textContent = 'Play Music';\r\n const startOnInteraction = () => {\r\n audio.play().then(() => {\r\n musicBar.classList.remove('paused');\r\n musicLabel.textContent = 'Now Playing';\r\n }).catch(() => {});\r\n document.removeEventListener('click', startOnInteraction);\r\n document.removeEventListener('touchstart', startOnInteraction);\r\n };\r\n document.addEventListener('click', startOnInteraction, { once:true });\r\n document.addEventListener('touchstart', startOnInteraction, { once:true });\r\n });\r\n };\r\n tryAutoplay();\r\n} else {\r\n \/* No music configured \u2014 show bar in disabled state *\/\r\n musicBar.classList.add('paused');\r\n musicLabel.textContent = 'Add Music URL';\r\n musicBar.style.opacity = '0.5';\r\n musicBar.style.cursor = 'default';\r\n}\r\n\r\nfunction toggleMusic() {\r\n if (!isReal(MUSIC_URL)) return;\r\n if (audio.paused) {\r\n audio.play().then(() => {\r\n musicBar.classList.remove('paused');\r\n musicLabel.textContent = 'Now Playing';\r\n }).catch(() => {});\r\n } else {\r\n audio.pause();\r\n musicBar.classList.add('paused');\r\n musicLabel.textContent = 'Play Music';\r\n }\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Apply images \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nfunction applyImages() {\r\n ['panel1','panel2','panel3','panel4','panel5'].forEach((key, i) => {\r\n const idx = i + 1;\r\n const img = document.getElementById('img-panel' + idx);\r\n const bg = document.getElementById('pbg' + idx);\r\n if (isReal(IMAGES[key])) {\r\n img.src = IMAGES[key]; img.style.display = 'block';\r\n if (bg) bg.style.display = 'none';\r\n }\r\n });\r\n ['life1','life2','life3','life4','life5'].forEach((key, i) => {\r\n const idx = i + 1;\r\n const img = document.getElementById('img-life' + idx);\r\n const ph = document.getElementById('life-ph' + idx);\r\n if (img && isReal(IMAGES[key])) {\r\n img.src = IMAGES[key]; img.style.display = 'block';\r\n if (ph) ph.style.display = 'none';\r\n }\r\n });\r\n buildGallery();\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Gallery \u2014 self-scaling mosaic engine \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n Works for any number of images (1\u201350+).\r\n Positions are calculated algorithmically so no CSS changes\r\n are ever needed when adding more photos.\r\n Lazy loading is applied automatically to all gallery images.\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n\/* Mosaic tile templates \u2014 repeating pattern of 5 tiles per group.\r\n Each entry: [colSpan, rowSpan] on a 12-column grid.\r\n Pattern tiles across the page, shifting columns each group. *\/\r\nconst TILE_PATTERNS = [\r\n \/* Group A \u2014 left-heavy *\/\r\n [[5,6],[3,4],[4,5],[3,4],[4,5]],\r\n \/* Group B \u2014 centre cluster *\/\r\n [[4,5],[4,6],[4,5],[5,5],[4,6]],\r\n \/* Group C \u2014 right-heavy *\/\r\n [[4,5],[3,4],[5,6],[4,4],[3,5]],\r\n \/* Group D \u2014 balanced *\/\r\n [[3,4],[5,5],[4,6],[4,5],[3,4]],\r\n];\r\n\r\nfunction computeMosaicLayout(total, cols) {\r\n \/* On mobile we use a simple 2-wide alternating layout *\/\r\n if (cols <= 2) {\r\n const layout = [];\r\n let row = 1;\r\n for (let i = 0; i < total; i++) {\r\n const col = (i % 2 === 0) ? 1 : 2;\r\n const span = (i % 3 === 0) ? 5 : 4;\r\n if (i % 2 === 0 && i > 0) row += 4;\r\n layout.push({ cs: col, ce: col + 1, rs: row, re: row + span });\r\n }\r\n return layout;\r\n }\r\n\r\n \/* On 4-col mobile \u2014 two wide columns alternating tall\/short *\/\r\n if (cols <= 4) {\r\n const layout = [];\r\n let row = 1;\r\n for (let i = 0; i < total; i++) {\r\n const isLeft = i % 2 === 0;\r\n const cs = isLeft ? 1 : 3;\r\n const rowSpan = (i % 4 < 2) ? 4 : 5;\r\n if (isLeft && i > 0) row += (layout[i-1].re - layout[i-1].rs);\r\n layout.push({ cs, ce: cs + 2, rs: row, re: row + rowSpan });\r\n }\r\n return layout;\r\n }\r\n\r\n \/* Desktop 12-col \u2014 rich asymmetric mosaic *\/\r\n const layout = [];\r\n let cursor = 1; \/* current grid row *\/\r\n let groupIdx = 0;\r\n\r\n for (let i = 0; i < total; ) {\r\n const pattern = TILE_PATTERNS[groupIdx % TILE_PATTERNS.length];\r\n groupIdx++;\r\n\r\n \/* Place a group of up to 5 tiles, packed left\u2192right *\/\r\n let col = 1;\r\n let groupMaxRow = cursor;\r\n\r\n for (let t = 0; t < pattern.length && i < total; t++, i++) {\r\n const [cs, rs] = pattern[t];\r\n const ce = Math.min(col + cs, 13);\r\n const re = cursor + rs;\r\n layout.push({ cs: col, ce, rs: cursor, re });\r\n col = ce;\r\n if (col >= 13) { col = 1; cursor = groupMaxRow; }\r\n if (re > groupMaxRow) groupMaxRow = re;\r\n }\r\n cursor = groupMaxRow;\r\n }\r\n return layout;\r\n}\r\n\r\nconst GBG = ['#141414','#151515','#131313','#161616','#121212','#141414','#111111',\r\n '#151515','#131313','#121212','#161616','#141414','#111111','#151515',\r\n '#131313','#121212','#141414','#161616','#111111','#131313'];\r\n\r\nfunction buildGallery() {\r\n const grid = document.getElementById('gallery-grid');\r\n const TOTAL = 50;\r\n\r\n \/* Collect only populated slots \u2014 skip empty\/placeholder URLs *\/\r\n const slots = [];\r\n for (let i = 1; i <= TOTAL; i++) {\r\n const src = IMAGES['g' + i];\r\n const cap = GALLERY_CAPTIONS[i - 1] || ('Photo ' + i);\r\n slots.push({ src: isReal(src) ? src : null, cap, idx: i });\r\n }\r\n\r\n \/* Detect column count for layout engine *\/\r\n function getCols() {\r\n const w = window.innerWidth;\r\n if (w <= 480) return 2;\r\n if (w <= 768) return 4;\r\n return 12;\r\n }\r\n\r\n function render() {\r\n grid.innerHTML = '';\r\n const cols = getCols();\r\n const layout = computeMosaicLayout(slots.length, cols);\r\n\r\n slots.forEach((slot, i) => {\r\n const pos = layout[i];\r\n if (!pos) return;\r\n\r\n const div = document.createElement('div');\r\n div.className = 'gi';\r\n div.dataset.cap = slot.cap;\r\n div.style.setProperty('--gc', `${pos.cs}\/${pos.ce}`);\r\n div.style.setProperty('--gr', `${pos.rs}\/${pos.re}`);\r\n\r\n if (slot.src) {\r\n div.style.cursor = 'zoom-in';\r\n div.addEventListener('click', () => openLightbox(slot.src, slot.cap));\r\n const img = document.createElement('img');\r\n img.src = slot.src;\r\n img.alt = slot.cap;\r\n img.loading = 'lazy'; \/* native lazy load *\/\r\n div.appendChild(img);\r\n } else {\r\n const bg = GBG[i % GBG.length];\r\n div.innerHTML = `<div style=\"width:100%;height:100%;background:${bg};display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg><span style=\"font-family:'Ubuntu',sans-serif;font-size:7px;letter-spacing:0.28em;color:rgba(245,243,239,0.08);text-transform:uppercase;\">${slot.cap}<\/span><\/div>`;\r\n }\r\n grid.appendChild(div);\r\n });\r\n }\r\n\r\n render();\r\n\r\n \/* Re-render mosaic on resize so layout stays correct across breakpoints *\/\r\n let resizeTimer;\r\n window.addEventListener('resize', () => {\r\n clearTimeout(resizeTimer);\r\n resizeTimer = setTimeout(render, 200);\r\n });\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Section open\/close \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nconst ALL_SECTIONS = ['life','gallery','programme','tributes'];\r\n\r\nfunction openSection(name) {\r\n document.body.style.overflow = 'hidden';\r\n const overlay = document.getElementById('overlay-' + name);\r\n overlay.classList.add('active');\r\n const panel = overlay.querySelector('.section-panel');\r\n panel.scrollTop = 0;\r\n requestAnimationFrame(() => { panel.style.transform = 'translate(0,0)'; });\r\n \/* Hide every nav button except the active section's *\/\r\n ALL_SECTIONS.forEach(n => {\r\n if (n !== name) {\r\n const nav = document.getElementById('nav-' + n);\r\n nav.style.opacity = '0';\r\n nav.style.pointerEvents = 'none';\r\n nav.style.transition = 'opacity 0.4s ease';\r\n }\r\n });\r\n}\r\nfunction closeSection(name) {\r\n const overlay = document.getElementById('overlay-' + name);\r\n const panel = overlay.querySelector('.section-panel');\r\n const origins = { life:'translateX(-100%)', gallery:'translateX(100%)', programme:'translateY(100%)', tributes:'translateY(100%)' };\r\n panel.style.transform = origins[name];\r\n setTimeout(() => { overlay.classList.remove('active'); document.body.style.overflow = ''; }, 860);\r\n \/* Restore all nav buttons *\/\r\n ALL_SECTIONS.forEach(n => {\r\n const nav = document.getElementById('nav-' + n);\r\n nav.style.opacity = '';\r\n nav.style.pointerEvents = '';\r\n });\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Parallax \u2014 disabled on very small screens \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nfunction handleParallax() {\r\n if (window.innerWidth < 480) return;\r\n const wh = window.innerHeight;\r\n document.querySelectorAll('.panel').forEach(panel => {\r\n const rect = panel.getBoundingClientRect();\r\n const progress = -rect.top \/ wh;\r\n if (progress > -1.3 && progress < 1.3) {\r\n const img = panel.querySelector('.panel-img');\r\n if (img && img.style.display !== 'none') {\r\n img.style.transform = `scale(1.1) translateY(${progress * 7}%)`;\r\n }\r\n }\r\n });\r\n}\r\nwindow.addEventListener('scroll', handleParallax, { passive:true });\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Lightbox \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nfunction openLightbox(src, cap) {\r\n document.getElementById('lightbox-img').src = src;\r\n document.getElementById('lightbox-img').alt = cap || '';\r\n document.getElementById('lightbox').classList.add('open');\r\n}\r\nfunction closeLightbox() {\r\n document.getElementById('lightbox').classList.remove('open');\r\n}\r\ndocument.getElementById('lightbox').addEventListener('click', function(e) {\r\n if (e.target === this) closeLightbox();\r\n});\r\ndocument.getElementById('lb-close-btn').addEventListener('click', closeLightbox);\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Keyboard \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\ndocument.addEventListener('keydown', e => {\r\n if (e.key === 'Escape') {\r\n closeLightbox();\r\n ALL_SECTIONS.forEach(n => {\r\n if (document.getElementById('overlay-'+n).classList.contains('active')) closeSection(n);\r\n });\r\n }\r\n});\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Nav buttons \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nALL_SECTIONS.forEach(name => {\r\n document.getElementById('btn-' + name).addEventListener('click', () => openSection(name));\r\n document.getElementById('close-' + name).addEventListener('click', () => closeSection(name));\r\n});\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Music bar click \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\ndocument.getElementById('music-bar').addEventListener('click', toggleMusic);\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Init \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\napplyImages();\r\n\r\n}); \/* end DOMContentLoaded *\/<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>In Loving Memory of Michelle Chanice Mwende Play Music Life Gallery Programme Tributes 26 April 2004 — 25 February 2025 In Loving Memory of Michelle ChaniceMwende Beloved Daughter · Sister · Aunt · Friend Scroll A Precious Gift “Her presence brought warmth, gentleness and quiet joy into the lives of all who knew her.” St. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-112","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/pages\/112","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/comments?post=112"}],"version-history":[{"count":19,"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/pages\/112\/revisions"}],"predecessor-version":[{"id":211,"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/pages\/112\/revisions\/211"}],"wp:attachment":[{"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/media?parent=112"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\nIn Loving Memory of Michelle Chanice Mwende<\/title>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Ubuntu:ital,wght@0,300;0,400;0,700;1,300;1,400&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&display=swap\" rel=\"stylesheet\">\r\n<script>\r\n\r\nconst IMAGES = {\r\n \/* \u2500\u2500 Scroll panels (5) \u2500\u2500 *\/\r\n panel1:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_0980_magicstudio_j1siiymwsoq-1-1.png\", panel2:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188393.jpg\", panel3:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/class9.jpg\",\r\n panel4:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260312-WA0020.jpg\", panel5:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20150223_124736-1new-1-scaled.jpg\",\r\n\r\n \/* \u2500\u2500 Life section (5) \u2500\u2500 *\/\r\n life1:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20140426_143521.jpg\", life2:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0020-scaled.jpg\", life3:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188226.jpg\",\r\n life4:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260228-WA0021.jpg\", life5:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188408.jpg\",\r\n\r\n \/* \u2500\u2500 Gallery \u2014 50 slots \u2500\u2500\r\n \u2014\r\n placeholders are shown automatically for any empty slot. *\/\r\n g1:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_1086.jpg\", g2:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/PXL_20230203_081926049-1-scaled.jpg\", g3:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_1088.jpg\",\r\n g4:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_0589.jpg\", g5:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/PXL_20230131_081221518-1-scaled.jpg\", g6:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/PXL_20231014_100323095-1-scaled.jpg\",\r\n g7:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20191210_213347-scaled.jpg\", g8:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188230.jpg\", g9:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260315-WA0003.jpg\",\r\n g10:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188405.jpg\", g11:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260228-WA0018.jpg\", g12:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188425.jpg\",\r\n g13:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188208.jpg\", g14:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260312-WA0019.jpg\", g15:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260228-WA0025.jpg\",\r\n g16:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20150223_123838-scaled.jpg\", g17:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0004.jpg\", g18:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260304-WA0008.jpg\",\r\n g19:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0018.jpg\", g20:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188415.jpg\", g21:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260312-WA0021.jpg\",\r\n g22:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/6d1d7258-7761-4bdb-9d68-9ac5a87c2686.jpg\", g23:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188419.jpg\", g24:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188413.jpg\",\r\n g25:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188387.jpg\", g26:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_1920-scaled.jpg\", g27:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188384.jpg\",\r\n g28:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/aa597038-fb2a-42bc-a5e9-6a3790c8fd74.jpg\", g29:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188417.jpg\", g30:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_0106-scaled.jpg\",\r\n g31:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260315-WA0008.jpg\", g32:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260321-WA0000.jpg\", g33:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260313-WA0000.jpg\",\r\n g34:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG_1952-scaled.jpg\", g35:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188399.jpg\", g36:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260313-WA0001.jpg\",\r\n g37:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0002.jpg\", g38:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/FB_IMG_1469893031482.jpg\", g39:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188402.jpg\",\r\n g40:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188411-scaled.jpg\", g41:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0023.jpg\", g42:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0009.jpg\",\r\n g43:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/20140427_150950.jpg\", g44:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0016.jpg\", g45:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188396.jpg\",\r\n g46:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188390.jpg\", g47:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260226-WA0005.jpg\", g48:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/1000188381.jpg\",\r\n g49:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260312-WA0017.jpg\", g50:\"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/IMG-20260324-WA0012.jpg\",\r\n};\r\n\r\n\r\nconst MUSIC_URL = \"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/Coldplay-Paradise.mp3\";\r\n\r\n\r\nconst PDF_URL = \"https:\/\/mwende.amkadigital.co.ke\/wp-content\/uploads\/2026\/04\/FUNERAL-SERVICE-PROGRAMME.pdf\";\r\n\r\n\/* \u2500\u2500 Venue directions \u2014 paste a Google Maps share link below \u2500\u2500 *\/\r\nconst VENUE_MAPS_LINK = \"https:\/\/maps.google.com\/?q=CITAM+Karen+Nairobi\";\r\n\/* To get your link:\r\n 1. Search your venue on maps.google.com\r\n 2. Click Share \u2192 Copy link\r\n Paste it between the quotes above. *\/\r\n\r\n\/* Gallery captions \u2014 one per slot (g1\u2013g50).\r\n Edit any caption to match your photo. *\/\r\nconst GALLERY_CAPTIONS = [\r\n \"A moment of joy\",\"In the Ocean\",\"With family\",\"Memories\",\"On an adventure\",\r\n \"Siz Love\",\"Home\",\"Love never fades\",\"Friendship\",\"Your memory lives on\",\r\n \"Her light\",\"Your light remains\",\"Karen, Nairobi\",\"Your memory lives on\",\"Carried in our hearts\",\r\n \"Family is Forever\",\"Friends\",\"Precious memories remain\",\"Love remembers\",\"Michelle, always\",\r\n \"Laughter\",\"A quiet afternoon\",\"A soul never dies\",\"Childhood days\",\"Deeply missed\",\r\n \"Still with us\",\"A gentle soul\",\"Always present\",\"A beautiful soul remembered\",\"Beloved\",\r\n \"Remembered with love\",\"Loved beyond words\",\"Family moments\",\"Pure joy\",\"Carefree\",\r\n \"Dreaming\",\"Gone, never lost\",\"Peaceful\",\"Gone, yet near\",\"Forever remembered\",\r\n \"Tender moments\",\"The little things\",\"Radiant\",\"Her world\",\"Loved beyond words\",\r\n \"Always close to heart\",\"Cherished\",\"Still here\",\"Until we meet again\",\"In Our Hearts\"\r\n];\r\n<\/script>\r\n<style>\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n RESET & TOKENS\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }\r\n:root {\r\n --black:#0a0a0a; --white:#f5f3ef; --gray:#888; --lgray:#c8c4bc; --accent:#d4b896;\r\n --nav-size:13px; \/* corner nav font size *\/\r\n --section-px:80px; \/* horizontal padding in overlays *\/\r\n}\r\nhtml {\r\n scroll-behavior:smooth;\r\n margin:0; padding:0; width:100%; height:100%;\r\n}\r\nbody {\r\n background:var(--black); color:var(--white);\r\n font-family:'Cormorant Garamond',serif;\r\n overflow-x:hidden; cursor:crosshair;\r\n margin:0; padding:0; width:100%; min-height:100%;\r\n}\r\n\/* Film grain *\/\r\nbody::after {\r\n content:''; position:fixed; inset:0; pointer-events:none;\r\n z-index:9999; opacity:0.35; mix-blend-mode:overlay;\r\n background-image:url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'\/%3E%3C\/svg%3E\");\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n MUSIC PLAYER \u2014 top centre pulse bar\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n#music-bar {\r\n position:fixed; top:28px; left:50%; transform:translateX(-50%);\r\n z-index:1100; display:flex; align-items:center; gap:10px;\r\n padding:8px 18px 8px 14px;\r\n background:rgba(10,10,10,0.55);\r\n backdrop-filter:blur(10px);\r\n border:1px solid rgba(212,184,150,0.18);\r\n border-radius:20px;\r\n cursor:pointer; user-select:none;\r\n transition:background 0.3s, border-color 0.3s;\r\n}\r\n#music-bar:hover { background:rgba(10,10,10,0.85); border-color:rgba(212,184,150,0.4); }\r\n\r\n\/* Animated waveform bars *\/\r\n.wave { display:flex; align-items:center; gap:2px; height:16px; }\r\n.wave span {\r\n display:block; width:2px; background:var(--accent);\r\n border-radius:2px; transform-origin:bottom;\r\n}\r\n.wave span:nth-child(1) { height:4px; animation:wb 1.1s 0.0s ease-in-out infinite alternate; }\r\n.wave span:nth-child(2) { height:10px; animation:wb 1.1s 0.2s ease-in-out infinite alternate; }\r\n.wave span:nth-child(3) { height:14px; animation:wb 1.1s 0.1s ease-in-out infinite alternate; }\r\n.wave span:nth-child(4) { height:8px; animation:wb 1.1s 0.3s ease-in-out infinite alternate; }\r\n.wave span:nth-child(5) { height:12px; animation:wb 1.1s 0.15s ease-in-out infinite alternate; }\r\n.wave span:nth-child(6) { height:6px; animation:wb 1.1s 0.25s ease-in-out infinite alternate; }\r\n.wave span:nth-child(7) { height:10px; animation:wb 1.1s 0.05s ease-in-out infinite alternate; }\r\n@keyframes wb {\r\n from { transform:scaleY(0.25); opacity:0.4; }\r\n to { transform:scaleY(1); opacity:1; }\r\n}\r\n#music-bar.paused .wave span { animation-play-state:paused; opacity:0.3; }\r\n#music-bar.paused .wave span { transform:scaleY(0.25); }\r\n\r\n.music-label {\r\n font-family:'Ubuntu',sans-serif; font-size:9px;\r\n letter-spacing:0.38em; text-transform:uppercase;\r\n color:rgba(245,243,239,0.4); transition:color 0.3s; white-space:nowrap;\r\n}\r\n#music-bar:hover .music-label { color:var(--accent); }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n CORNER NAV \u2014 larger, cleaner\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.corner-nav { position:fixed; z-index:1000; }\r\n.corner-nav button {\r\n background:none; border:none; cursor:pointer;\r\n font-family:'Ubuntu',sans-serif;\r\n font-size:var(--nav-size); font-weight:400;\r\n letter-spacing:0.3em; text-transform:uppercase;\r\n color:rgba(245,243,239,0.5);\r\n padding:8px 0; line-height:1;\r\n transition:color 0.4s, opacity 0.4s;\r\n position:relative;\r\n animation:navPulse 3.5s ease-in-out infinite;\r\n}\r\n.corner-nav button::after {\r\n content:''; position:absolute; bottom:0; left:0;\r\n width:100%; height:1px; background:var(--accent);\r\n transform:scaleX(0); transform-origin:left; transition:transform 0.4s;\r\n}\r\n.corner-nav button:hover { color:var(--accent); }\r\n.corner-nav button:hover::after { transform:scaleX(1); }\r\n@keyframes navPulse {\r\n 0%,100% { opacity:0.5; }\r\n 50% { opacity:1; }\r\n}\r\n#nav-life { top:36px; left:40px; }\r\n#nav-gallery { top:36px; right:40px; }\r\n#nav-programme { bottom:40px; left:40px; }\r\n#nav-tributes { bottom:40px; right:40px; }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n PANELS \u2014 continuous scroll\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.journey { position:relative; }\r\n.panel {\r\n position:relative; height:100vh; width:100%;\r\n display:flex; align-items:center; justify-content:center;\r\n overflow:hidden;\r\n}\r\n.panel-img {\r\n position:absolute; inset:0; width:100%; height:100%;\r\n object-fit:cover;\r\n filter:grayscale(100%) contrast(1.12) brightness(0.85);\r\n transform:scale(1); will-change:transform; z-index:0;\r\n}\r\n.panel-bg {\r\n position:absolute; inset:0; background:#111; z-index:0;\r\n display:flex; align-items:center; justify-content:center;\r\n}\r\n.panel-bg svg { opacity:0.06; }\r\n.panel-vignette {\r\n position:absolute; inset:0; z-index:1;\r\n background:radial-gradient(ellipse at 50% 50%, transparent 35%, rgba(10,10,10,0.62) 100%);\r\n}\r\n\/* Always overlaid on image \u2014 never below it on any screen size *\/\r\n.panel-content {\r\n position:absolute; inset:0; z-index:2;\r\n display:flex; align-items:center; justify-content:center;\r\n width:100%; pointer-events:none;\r\n}\r\n.panel-content > * { pointer-events:auto; }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n HERO\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.hero-inner { text-align:center; padding:0 clamp(20px,5vw,60px); }\r\n.hero-eyebrow {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1.2vw,10px);\r\n letter-spacing:0.55em; text-transform:uppercase; color:var(--accent);\r\n margin-bottom:clamp(16px,3vh,28px);\r\n opacity:0; animation:fadeUp 1.2s 0.4s forwards;\r\n text-shadow:0 1px 8px rgba(0,0,0,0.8);\r\n}\r\n.hero-title {\r\n font-family:'Ubuntu',sans-serif;\r\n font-size:clamp(16px,3vw,40px); font-weight:300; font-style:italic;\r\n letter-spacing:0.05em; line-height:1.4; color:var(--white);\r\n opacity:0; animation:fadeUp 1.2s 0.8s forwards;\r\n text-shadow:0 2px 20px rgba(0,0,0,0.85), 0 1px 4px rgba(0,0,0,0.9);\r\n}\r\n.hero-name {\r\n display:block; font-weight:700; font-style:normal;\r\n font-size:clamp(26px,5.5vw,72px); letter-spacing:0.13em;\r\n text-transform:uppercase; color:var(--white); margin-top:8px;\r\n text-shadow:0 2px 24px rgba(0,0,0,0.85), 0 1px 4px rgba(0,0,0,0.9);\r\n}\r\n.hero-dates {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(12px,1.6vw,18px); font-weight:400; font-style:italic;\r\n letter-spacing:0.35em; color:var(--white); margin-top:clamp(14px,2.5vh,22px);\r\n opacity:0; animation:fadeUp 1.2s 1.2s forwards;\r\n text-shadow:0 1px 12px rgba(0,0,0,0.9), 0 2px 32px rgba(0,0,0,0.7);\r\n}\r\n.hero-rule {\r\n width:1px; height:clamp(36px,5vh,52px); background:var(--accent);\r\n margin:clamp(18px,3vh,30px) auto 0;\r\n opacity:0; animation:fadeUp 1.2s 1.5s forwards;\r\n}\r\n\r\n\/* Scroll cue \u2014 text BELOW the line, fully centred *\/\r\n.scroll-cue {\r\n position:absolute; bottom:clamp(24px,4vh,44px); left:50%;\r\n transform:translateX(-50%); z-index:3;\r\n display:flex; flex-direction:column; align-items:center; gap:0;\r\n opacity:0; animation:fadeUp 1.2s 2.2s forwards;\r\n}\r\n.scroll-line {\r\n width:1px; height:clamp(28px,4vh,40px);\r\n background:linear-gradient(to bottom, rgba(212,184,150,0.55), transparent);\r\n animation:linePulse 2s ease-in-out infinite;\r\n}\r\n.scroll-cue span {\r\n display:block; margin-top:8px;\r\n font-family:'Ubuntu',sans-serif; font-size:8px;\r\n letter-spacing:0.5em; text-transform:uppercase;\r\n color:rgba(245,243,239,0.25);\r\n}\r\n@keyframes linePulse {\r\n 0%,100% { opacity:1; transform:scaleY(1); }\r\n 50% { opacity:0.3; transform:scaleY(0.45); }\r\n}\r\n@keyframes fadeUp {\r\n from { opacity:0; transform:translateY(20px); }\r\n to { opacity:1; transform:translateY(0); }\r\n}\r\n\r\n\/* Panel quote styles \u2014 width:100% needed because parent is position:absolute *\/\r\n.pq-left { width:100%; padding:0 clamp(20px,10%,120px) 0 clamp(20px,8%,96px); max-width:none; }\r\n.pq-right { width:100%; padding:0 clamp(20px,8%,96px) 0 clamp(20px,10%,120px); max-width:none; text-align:right; }\r\n.pq-center { width:100%; text-align:center; padding:0 clamp(20px,6%,80px); }\r\n.pq-center .pq-text { max-width:640px; margin:0 auto; }\r\n\/* Constrain the actual text block so it doesn't span full width *\/\r\n.pq-left .pq-text, .pq-left .pq-tag { max-width:600px; }\r\n.pq-right .pq-text, .pq-right .pq-tag { max-width:600px; margin-left:auto; }\r\n.pq-tag {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.42em; text-transform:uppercase; color:var(--accent); margin-bottom:16px;\r\n}\r\n.pq-text {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(16px,2.8vw,36px); font-weight:300; font-style:italic;\r\n line-height:1.5; color:var(--white);\r\n text-shadow:0 2px 30px rgba(0,0,0,0.75);\r\n}\r\n.pq-source {\r\n display:block; margin-top:14px; font-family:'Ubuntu',sans-serif;\r\n font-size:clamp(9px,1.1vw,11px); letter-spacing:0.3em;\r\n color:var(--lgray); font-style:normal;\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n SECTION OVERLAYS\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.section-overlay { position:fixed; inset:0; z-index:500; pointer-events:none; visibility:hidden; }\r\n.section-overlay.active { pointer-events:auto; visibility:visible; }\r\n.section-panel {\r\n position:absolute; inset:0; background:var(--black);\r\n overflow-y:auto; overflow-x:hidden;\r\n transform:translateX(-100%);\r\n transition:transform 0.85s cubic-bezier(0.76,0,0.24,1);\r\n padding:0 var(--section-px) 100px;\r\n scrollbar-width:thin; scrollbar-color:rgba(212,184,150,0.25) transparent;\r\n}\r\n#overlay-gallery .section-panel { transform:translateX(100%); }\r\n#overlay-programme .section-panel { transform:translateY(100%); }\r\n#overlay-tributes .section-panel { transform:translateY(100%); }\r\n.section-overlay.active .section-panel { transform:translate(0,0); }\r\n\r\n\/* Sticky close bar *\/\r\n.sec-close-bar {\r\n position:sticky; top:0; background:var(--black);\r\n padding:clamp(18px,3vh,30px) 0 16px;\r\n display:flex; justify-content:flex-end;\r\n z-index:10; border-bottom:1px solid rgba(245,243,239,0.04);\r\n margin-bottom:clamp(32px,5vh,56px);\r\n}\r\n.btn-close {\r\n background:none; border:none; color:var(--gray);\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(9px,1.2vw,11px);\r\n letter-spacing:0.3em; text-transform:uppercase;\r\n cursor:pointer; padding:40px 0; transition:color 0.3s;\r\n display:flex; align-items:center; gap:12px;\r\n}\r\n.btn-close::before {\r\n content:''; display:block; width:24px; height:1px;\r\n background:currentColor; transition:width 0.3s;\r\n}\r\n.btn-close:hover { color:var(--accent); }\r\n.btn-close:hover::before { width:44px; }\r\n\r\n\/* Section headings *\/\r\n.sec-tag {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.5em; text-transform:uppercase; color:var(--accent); margin-bottom:12px;\r\n}\r\n.sec-title {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(32px,5vw,66px); font-weight:300; font-style:italic;\r\n line-height:1.1; color:var(--white);\r\n margin-bottom:clamp(32px,5vh,52px);\r\n padding-bottom:clamp(24px,4vh,36px);\r\n border-bottom:1px solid rgba(212,184,150,0.14);\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n LIFE SECTION\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.life-intro {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(17px,2.2vw,28px); font-weight:300; line-height:1.65;\r\n color:var(--white); max-width:800px; margin-bottom:20px;\r\n}\r\n.life-body {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(16px,1.8vw,19px); font-weight:300; line-height:1.95;\r\n color:var(--lgray); max-width:800px; margin-bottom:16px;\r\n}\r\n.life-body strong { color:var(--white); font-weight:400; }\r\n.life-body em { color:rgba(245,243,239,0.85); }\r\n\r\n.life-ch {\r\n display:grid; grid-template-columns:1fr 1fr;\r\n gap:clamp(28px,5vw,68px); margin:clamp(40px,7vh,76px) 0; align-items:start;\r\n}\r\n.life-ch.flip { direction:rtl; }\r\n.life-ch.flip > * { direction:ltr; }\r\n\r\n.life-yr {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.45em; text-transform:uppercase; color:var(--accent); margin-bottom:12px;\r\n}\r\n.life-cht {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(20px,2.8vw,40px); font-weight:300; font-style:italic;\r\n line-height:1.2; color:var(--white); margin-bottom:20px;\r\n}\r\n.life-pull {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(18px,2.4vw,32px); font-style:italic; font-weight:300;\r\n line-height:1.48; color:var(--white);\r\n border-left:1px solid var(--accent); padding-left:clamp(16px,2vw,30px);\r\n margin:clamp(32px,5vh,52px) 0;\r\n}\r\n.life-pull cite {\r\n display:block; font-size:clamp(11px,1.2vw,13px); font-style:normal;\r\n letter-spacing:0.22em; text-transform:uppercase; color:var(--gray); margin-top:12px;\r\n}\r\n.life-rule { width:40px; height:1px; background:var(--accent); margin:clamp(32px,5vh,52px) 0; }\r\n\r\n.life-img-wrap { position:relative; }\r\n.life-ghost {\r\n font-family:'Cormorant Garamond',serif; font-size:clamp(60px,8vw,96px); font-weight:300;\r\n line-height:1; color:rgba(245,243,239,0.04);\r\n position:absolute; right:-8px; top:-24px;\r\n user-select:none; pointer-events:none;\r\n}\r\n.life-img {\r\n width:100%; object-fit:cover; display:block;\r\n filter:grayscale(100%) contrast(1.05);\r\n}\r\n.life-img-cap {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(7px,0.9vw,8px);\r\n letter-spacing:0.28em; text-transform:uppercase; color:var(--gray); margin-top:9px;\r\n}\r\n.life-img-ph {\r\n width:100%; background:#141414;\r\n display:flex; align-items:center; justify-content:center;\r\n flex-direction:column; gap:8px;\r\n}\r\n.life-img-ph span {\r\n font-family:'Ubuntu',sans-serif; font-size:7px;\r\n letter-spacing:0.3em; text-transform:uppercase; color:rgba(245,243,239,0.08);\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n GALLERY\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.gallery-grid {\r\n display:grid;\r\n grid-template-columns:repeat(12,1fr);\r\n grid-auto-rows:54px; gap:5px; margin-top:12px;\r\n}\r\n.gi { overflow:hidden; position:relative; cursor:zoom-in; }\r\n.gi::after {\r\n content:attr(data-cap); position:absolute; bottom:0; left:0; right:0;\r\n background:rgba(10,10,10,0.9); color:var(--lgray);\r\n font-family:'Ubuntu',sans-serif; font-size:8px;\r\n letter-spacing:0.24em; text-transform:uppercase; padding:7px 10px;\r\n transform:translateY(100%); transition:transform 0.3s;\r\n}\r\n.gi:hover::after { transform:translateY(0); }\r\n.gi img {\r\n width:100%; height:100%; object-fit:cover; display:block;\r\n filter:grayscale(100%) contrast(1.05);\r\n transition:filter 0.5s, transform 0.6s;\r\n}\r\n.gi:hover img { filter:grayscale(50%) contrast(1.1); transform:scale(1.05); }\r\n\/* mosaic positions \u2014 generated by JS, no hard-coded positions needed *\/\r\n.gi { grid-column: var(--gc); grid-row: var(--gr); }\r\n\r\n\/* Lightbox *\/\r\n.lightbox {\r\n position:fixed; inset:0; z-index:2000;\r\n background:rgba(10,10,10,0.97);\r\n display:flex; align-items:center; justify-content:center;\r\n opacity:0; pointer-events:none; transition:opacity 0.3s;\r\n}\r\n.lightbox.open { opacity:1; pointer-events:auto; }\r\n.lightbox img { max-width:92vw; max-height:92vh; object-fit:contain; \/* full colour \u2014 no filter *\/ }\r\n.lb-close {\r\n position:absolute; top:clamp(20px,4vh,32px); right:clamp(20px,4vw,40px);\r\n background:none; border:none; cursor:pointer; color:var(--gray);\r\n font-family:'Ubuntu',sans-serif; font-size:10px;\r\n letter-spacing:0.3em; text-transform:uppercase; transition:color 0.3s;\r\n}\r\n.lb-close:hover { color:var(--accent); }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n TRIBUTES\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.trib-intro {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(16px,1.9vw,20px); font-weight:300; font-style:italic;\r\n color:var(--lgray); line-height:1.78; max-width:580px; margin-bottom:clamp(40px,7vh,68px);\r\n}\r\n.trib-list { display:flex; flex-direction:column; }\r\n.trib-item {\r\n border-top:1px solid rgba(245,243,239,0.06);\r\n padding:clamp(28px,5vh,50px) 0;\r\n display:grid; grid-template-columns:clamp(120px,16vw,200px) 1fr;\r\n gap:clamp(20px,4vw,60px); align-items:start;\r\n transition:border-color 0.3s;\r\n}\r\n.trib-item:hover { border-color:rgba(212,184,150,0.16); }\r\n.trib-name {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(10px,1.2vw,12px); font-weight:400;\r\n letter-spacing:0.22em; text-transform:uppercase; color:var(--white); margin-bottom:6px;\r\n}\r\n.trib-rel { font-family:'Cormorant Garamond',serif; font-size:15px; font-style:italic; color:var(--gray); }\r\n.trib-body {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(16px,1.8vw,20px); font-weight:300;\r\n line-height:1.88; color:var(--lgray); position:relative; padding-left:18px;\r\n}\r\n.trib-body::before {\r\n content:'\\201C'; font-size:clamp(60px,8vw,88px); line-height:0.72;\r\n color:rgba(212,184,150,0.09); position:absolute; left:-6px; top:8px;\r\n font-family:'Cormorant Garamond',serif;\r\n}\r\n.trib-body p { margin-bottom:14px; }\r\n.trib-body p:last-child { margin-bottom:0; }\r\n.trib-body em { color:var(--white); font-style:normal; }\r\n.trib-scripture {\r\n font-family:'Cormorant Garamond',serif; font-size:15px; font-style:italic;\r\n color:var(--gray); margin-top:16px; padding-top:14px;\r\n border-top:1px solid rgba(245,243,239,0.06);\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n PROGRAMME\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.prog-intro {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(17px,2.2vw,26px); font-weight:300; line-height:1.65;\r\n color:var(--white); max-width:800px; margin-bottom:clamp(32px,5vh,52px);\r\n}\r\n.prog-meta-grid {\r\n display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr));\r\n gap:clamp(20px,3vw,40px);\r\n margin-bottom:clamp(40px,7vh,72px);\r\n padding-bottom:clamp(32px,5vh,52px);\r\n border-bottom:1px solid rgba(212,184,150,0.14);\r\n}\r\n.prog-meta-label {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.45em; text-transform:uppercase; color:var(--accent); margin-bottom:8px;\r\n}\r\n.prog-meta-value {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(15px,1.8vw,19px); font-weight:300; color:var(--white); line-height:1.55;\r\n}\r\n.prog-meta-value em { color:var(--lgray); font-style:normal; font-size:0.88em; display:block; }\r\n.prog-order-title {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(8px,1vw,9px);\r\n letter-spacing:0.45em; text-transform:uppercase; color:var(--accent);\r\n margin-bottom:clamp(24px,4vh,40px);\r\n}\r\n.prog-item {\r\n display:grid; grid-template-columns:clamp(80px,10vw,130px) 1fr;\r\n gap:clamp(16px,3vw,48px);\r\n border-top:1px solid rgba(245,243,239,0.06);\r\n padding:clamp(18px,3vh,32px) 0;\r\n transition:border-color 0.3s;\r\n}\r\n.prog-item:hover { border-color:rgba(212,184,150,0.2); }\r\n.prog-item-time {\r\n font-family:'Ubuntu',sans-serif; font-size:clamp(9px,1vw,10px);\r\n letter-spacing:0.2em; color:var(--gray); padding-top:6px;\r\n}\r\n.prog-item-name {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(17px,2vw,24px); font-weight:300; color:var(--white);\r\n line-height:1.3; margin-bottom:5px;\r\n}\r\n.prog-item-detail {\r\n font-family:'Cormorant Garamond',serif;\r\n font-size:clamp(14px,1.5vw,16px); font-weight:300; font-style:italic;\r\n color:var(--gray); line-height:1.6;\r\n}\r\n.prog-rule { width:40px; height:1px; background:var(--accent); margin:clamp(32px,5vh,52px) 0; }\r\n.prog-directions-btn {\r\n display:inline-flex; align-items:center; gap:10px;\r\n padding:13px 24px; border:1px solid rgba(212,184,150,0.26);\r\n color:var(--accent); font-family:'Ubuntu',sans-serif;\r\n font-size:clamp(9px,1vw,10px); letter-spacing:0.3em; text-transform:uppercase;\r\n text-decoration:none; background:none; transition:background 0.3s, color 0.3s; cursor:pointer;\r\n}\r\n.prog-directions-btn:hover { background:rgba(212,184,150,0.08); color:var(--white); }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n RESPONSIVE BREAKPOINTS\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n\/* Tablet \u2014 \u2264 1024px *\/\r\n@media(max-width:1024px) {\r\n :root { --section-px:48px; }\r\n #nav-life { top:28px; left:28px; }\r\n #nav-gallery { top:28px; right:28px; }\r\n #nav-programme { bottom:28px; left:28px; }\r\n #nav-tributes { bottom:28px; right:28px; }\r\n .gallery-grid { grid-auto-rows:46px; }\r\n}\r\n\r\n\/* Mobile \u2014 \u2264 768px *\/\r\n@media(max-width:768px) {\r\n :root { --section-px:24px; --nav-size:11px; }\r\n #music-bar { padding:6px 12px 6px 10px; }\r\n .music-label { display:none; }\r\n #nav-life { top:22px; left:22px; }\r\n #nav-gallery { top:22px; right:22px; }\r\n #nav-programme { bottom:22px; left:22px; }\r\n #nav-tributes { bottom:22px; right:22px; }\r\n .life-ch { grid-template-columns:1fr; gap:28px; }\r\n .life-ch.flip { direction:ltr; }\r\n .life-ghost { display:none; }\r\n .trib-item { grid-template-columns:1fr; gap:14px; }\r\n .prog-item { grid-template-columns:1fr; gap:4px; }\r\n .prog-layout { grid-template-columns:1fr; }\r\n .gallery-grid { grid-template-columns:repeat(4,1fr); grid-auto-rows:48px; }\r\n \/* Keep panel quotes in their left\/right\/center positions on mobile \u2014\r\n just reduce padding so they don't overflow *\/\r\n .pq-left { padding:0 16px 0 20px; }\r\n .pq-right { padding:0 20px 0 16px; }\r\n}\r\n\r\n\/* Phone only \u2014 \u2264 480px: reduce hero text so it fits over the image *\/\r\n@media(max-width:480px) {\r\n :root { --section-px:18px; }\r\n\r\n \/* Hero text \u2014 smaller on phones only *\/\r\n .hero-eyebrow { font-size:8px; letter-spacing:0.35em; margin-bottom:12px; }\r\n .hero-title { font-size:14px; }\r\n .hero-name { font-size:22px; letter-spacing:0.07em; margin-top:6px; }\r\n .hero-dates { font-size:10px; letter-spacing:0.2em; margin-top:10px; }\r\n .hero-rule { height:28px; margin-top:14px; }\r\n .hero-inner { padding:0 16px; }\r\n\r\n \/* Panel quotes \u2014 slightly smaller text on small phones *\/\r\n .pq-text { font-size:15px; }\r\n .pq-left { padding:0 12px 0 16px; }\r\n .pq-right { padding:0 16px 0 12px; }\r\n\r\n \/* Gallery \u2014 2-column on very small screens *\/\r\n .gallery-grid { grid-template-columns:repeat(2,1fr); grid-auto-rows:52px; }\r\n .panel-img { transform:scale(1.04); }\r\n}\r\n\r\n\/* Touch devices \u2014 disable hover captions (use tap) *\/\r\n@media(hover:none) {\r\n .gi::after { transition:none; }\r\n .gi:active::after { transform:translateY(0); }\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n FORCE OVERLAY FIX (STRONG OVERRIDE)\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n.panel {\r\n position: relative !important;\r\n height: 100vh !important;\r\n min-height: 100vh !important;\r\n overflow: hidden !important;\r\n}\r\n\r\n.panel-img {\r\n position: absolute !important;\r\n inset: 0 !important;\r\n width: 100% !important;\r\n height: 100% !important;\r\n object-fit: cover !important;\r\n z-index: 1 !important;\r\n}\r\n\r\n\/* \ud83d\udd25 THIS IS THE MAIN FIX *\/\r\n.panel-content {\r\n position: absolute !important;\r\n top: 0 !important;\r\n left: 0 !important;\r\n width: 100% !important;\r\n height: 100% !important;\r\n z-index: 5 !important;\r\n\r\n display: flex !important;\r\n align-items: center !important;\r\n justify-content: center !important;\r\n\r\n text-align: center !important;\r\n padding: 0 20px !important;\r\n}\r\n\r\n\/* Remove weird spacing on mobile *\/\r\n@media(max-width:768px) {\r\n .panel {\r\n height: 100vh !important;\r\n }\r\n\r\n .hero-inner {\r\n transform: translateY(-12%) !important;\r\n padding: 0 16px !important;\r\n }\r\n\r\n .hero-title {\r\n margin-bottom: 6px !important;\r\n }\r\n\r\n .hero-dates {\r\n margin-top: 4px !important;\r\n }\r\n\r\n .hero-rule {\r\n margin-top: 8px !important;\r\n height: 18px !important;\r\n }\r\n\r\n .scroll-cue {\r\n bottom: 18px !important;\r\n }\r\n}\r\n\r\n.panel-img {\r\n object-position: center top;\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n TEXT VISIBILITY BOOST (FRONT PANELS)\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n\/* Main quote text *\/\r\n.pq-text {\r\n color: #ffffff !important;\r\n text-shadow:\r\n 0 2px 20px rgba(0,0,0,0.85),\r\n 0 1px 6px rgba(0,0,0,0.9);\r\n}\r\n\r\n\/* Small heading (e.g. \"A Precious Gift\") *\/\r\n.pq-tag {\r\n color: #e6d3b0 !important; \/* slightly brighter accent *\/\r\n text-shadow: 0 1px 8px rgba(0,0,0,0.8);\r\n}\r\n\r\n\/* Source text *\/\r\n.pq-source {\r\n color: #d6d1c7 !important;\r\n}\r\n\r\n.pq-text {\r\n text-shadow:\r\n 0 0 8px rgba(255,255,255,0.15),\r\n 0 2px 20px rgba(0,0,0,0.9);\r\n}\r\n\r\n.panel-vignette {\r\n background: radial-gradient(\r\n ellipse at 50% 50%,\r\n rgba(0,0,0,0.2) 20%,\r\n rgba(0,0,0,0.75) 100%\r\n );\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n HERO TEXT VISIBILITY BOOST\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n\/* Top small text (dates) *\/\r\n.hero-eyebrow {\r\n color: #e6d3b0 !important;\r\n text-shadow:\r\n 0 1px 8px rgba(0,0,0,0.85),\r\n 0 0 6px rgba(255,255,255,0.15);\r\n}\r\n\r\n\/* Main title *\/\r\n.hero-title {\r\n color: #ffffff !important;\r\n text-shadow:\r\n 0 2px 24px rgba(0,0,0,0.9),\r\n 0 0 10px rgba(255,255,255,0.12);\r\n}\r\n\r\n\/* Name (make this the visual anchor) *\/\r\n.hero-name {\r\n color: #ffffff !important;\r\n text-shadow:\r\n 0 3px 30px rgba(0,0,0,0.95),\r\n 0 0 12px rgba(255,255,255,0.18);\r\n}\r\n\r\n\/* Bottom descriptor text *\/\r\n.hero-dates {\r\n color: #f0ebe3 !important;\r\n text-shadow:\r\n 0 2px 16px rgba(0,0,0,0.9),\r\n 0 0 6px rgba(255,255,255,0.1);\r\n}\r\n\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n\r\n<div id=\"music-bar\" title=\"Play \/ Pause music\" aria-label=\"Toggle background music\">\r\n <div class=\"wave\">\r\n <span><\/span><span><\/span><span><\/span><span><\/span>\r\n <span><\/span><span><\/span><span><\/span>\r\n <\/div>\r\n <span class=\"music-label\" id=\"music-label\">Play Music<\/span>\r\n<\/div>\r\n<audio id=\"bg-audio\" loop preload=\"auto\"><\/audio>\r\n\r\n\r\n<div class=\"corner-nav\" id=\"nav-life\">\r\n <button id=\"btn-life\">Life<\/button>\r\n<\/div>\r\n<div class=\"corner-nav\" id=\"nav-gallery\">\r\n <button id=\"btn-gallery\">Gallery<\/button>\r\n<\/div>\r\n<div class=\"corner-nav\" id=\"nav-programme\">\r\n <button id=\"btn-programme\">Programme<\/button>\r\n<\/div>\r\n<div class=\"corner-nav\" id=\"nav-tributes\">\r\n <button id=\"btn-tributes\">Tributes<\/button>\r\n<\/div>\r\n\r\n\r\n<main class=\"journey\">\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg1\">\r\n <svg width=\"64\" height=\"64\" viewBox=\"0 0 64 64\"><circle cx=\"32\" cy=\"22\" r=\"12\" stroke=\"#f5f3ef\" stroke-width=\"1\" fill=\"none\"\/><path d=\"M8 60c0-13.3 10.7-24 24-24s24 10.7 24 24\" stroke=\"#f5f3ef\" stroke-width=\"1\" fill=\"none\"\/><\/svg>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-panel1\" class=\"panel-img\" src=\"\" alt=\"Michelle Chanice Mwende\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"hero-inner\">\r\n <p class=\"hero-eyebrow\">26 April 2004 — 25 February 2025<\/p>\r\n <h1 class=\"hero-title\">\r\n In Loving Memory of\r\n <span class=\"hero-name\">Michelle Chanice<br>Mwende<\/span>\r\n <\/h1>\r\n <p class=\"hero-dates\">Beloved Daughter · Sister · Aunt · Friend<\/p>\r\n <div class=\"hero-rule\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"scroll-cue\">\r\n <div class=\"scroll-line\"><\/div>\r\n <span>Scroll<\/span>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg2\"><\/div>\r\n <img decoding=\"async\" id=\"img-panel2\" class=\"panel-img\" src=\"\" alt=\"\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"pq-left\">\r\n <p class=\"pq-tag\">A Precious Gift<\/p>\r\n <p class=\"pq-text\">\"Her presence brought warmth, gentleness and quiet joy into the lives of all who knew her.\"<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg3\"><\/div>\r\n <img decoding=\"async\" id=\"img-panel3\" class=\"panel-img\" src=\"\" alt=\"\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"pq-right\">\r\n <p class=\"pq-tag\">St. Christopher’s · Karen<\/p>\r\n <p class=\"pq-text\">\"From a shy young girl, she rose to contest for the top presidential position in her school — a testament to her belief that with God, nothing is impossible.\"<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg4\"><\/div>\r\n <img decoding=\"async\" id=\"img-panel4\" class=\"panel-img\" src=\"\" alt=\"\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"pq-left\">\r\n <p class=\"pq-tag\">University of Western Australia · 2023<\/p>\r\n <p class=\"pq-text\">\"She carried with her a bright mind, a hopeful spirit and dreams of making a difference in the world.\"<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\">\r\n <div class=\"panel-bg\" id=\"pbg5\"><\/div>\r\n <img decoding=\"async\" id=\"img-panel5\" class=\"panel-img\" src=\"\" alt=\"\" style=\"display:none;\">\r\n <div class=\"panel-vignette\"><\/div>\r\n <div class=\"panel-content\">\r\n <div class=\"pq-center\">\r\n <p class=\"pq-tag\" style=\"text-align:center;\">Nothing is impossible with God<\/p>\r\n <p class=\"pq-text\">\"Do not let your hearts be troubled. Believe in God; believe also in me. In my Father’s house are many rooms.\"<span class=\"pq-source\">— John 14:1–3<\/span><\/p>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n \r\n <section class=\"panel\" style=\"background:var(--black);\">\r\n <div class=\"panel-content\">\r\n <div style=\"text-align:center;padding:clamp(20px,5vw,40px);\">\r\n <p class=\"pq-tag\" style=\"text-align:center;\">Until We Meet Again<\/p>\r\n <p style=\"font-family:'Cormorant Garamond',serif;font-size:clamp(15px,2vw,24px);font-weight:300;font-style:italic;color:var(--lgray);max-width:460px;margin:0 auto;line-height:1.85;\">Gone from our sight, but never from our hearts.<br>Rest well, our dearest Michelle.<\/p>\r\n <div style=\"width:1px;height:clamp(50px,8vh,80px);background:linear-gradient(to bottom,var(--accent),transparent);margin:clamp(32px,6vh,52px) auto 0;\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n<\/main>\r\n\r\n\r\n<div class=\"section-overlay\" id=\"overlay-life\">\r\n <div class=\"section-panel\">\r\n <div class=\"sec-close-bar\">\r\n <button class=\"btn-close\" id=\"close-life\">Close<\/button>\r\n <\/div>\r\n\r\n <p class=\"sec-tag\">The Story of a Life<\/p>\r\n <h2 class=\"sec-title\">Michelle<br>Chanice Mwende<\/h2>\r\n\r\n <p class=\"life-intro\">Today, we gather with heavy hearts, yet with deep gratitude to God for the life of <strong>Michelle Chanice Mwende<\/strong> \u2014 a beloved daughter, sister, aunt, cousin, niece and friend to so many.<\/p>\r\n <p class=\"life-body\">Michelle was born on the <strong>26th of April, 2004<\/strong>and was called home on the <strong>25th of February, 2025<\/strong> \u2014 a precious gift whose presence brought warmth, gentleness and quiet joy into the lives of all who knew her. Though her time with us was far too short, her life was full of meaning, love and beautiful memories that will remain with us forever.<\/p>\r\n\r\n <div class=\"life-rule\"><\/div>\r\n\r\n \r\n <div class=\"life-ch\">\r\n <div style=\"position:relative;\">\r\n <span class=\"life-ghost\">01<\/span>\r\n <p class=\"life-yr\">Early Education<\/p>\r\n <h3 class=\"life-cht\">Our Lady of Peace<br>& St. Christopher’s<\/h3>\r\n <p class=\"life-body\">Michelle began her early years at <strong>Our Lady of Peace Primary School in Karen<\/strong>, from nursery through to Standard 4. She then continued at <strong>St. Christopher’s International School<\/strong>, where she studied from Year 4 to Year 13.<\/p>\r\n <p class=\"life-body\">It was there that her character blossomed \u2014 she grew not only academically but also in confidence, courage and leadership. From being a shy young girl, she rose to <em>contest for the top presidential position in her school<\/em> \u2014 a true testament to her strength and belief that with God, nothing is impossible.<\/p>\r\n <\/div>\r\n <div class=\"life-img-wrap\">\r\n <div class=\"life-img-ph\" id=\"life-ph1\" style=\"aspect-ratio:3\/4;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>Childhood \u00b7 School Years<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life1\" class=\"life-img\" style=\"aspect-ratio:3\/4;display:none;\" src=\"\" alt=\"Michelle \u2014 School years\">\r\n <p class=\"life-img-cap\">Michelle · Karen, Nairobi<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <blockquote class=\"life-pull\">\r\n “It was hard to fight with Michelle — because she carried within her a gentle spirit that sought understanding and harmony.”\r\n <cite>— Family<\/cite>\r\n <\/blockquote>\r\n\r\n \r\n <div class=\"life-ch flip\">\r\n <div style=\"position:relative;\">\r\n <span class=\"life-ghost\">02<\/span>\r\n <p class=\"life-yr\">Who She Was<\/p>\r\n <h3 class=\"life-cht\">Kind, Calm,<br>Deeply Thoughtful<\/h3>\r\n <p class=\"life-body\">Michelle was a truly special soul — <strong>kind, calm, loving and deeply thoughtful<\/strong>. She was the kind of person who listened more than she spoke, who brought peace rather than conflict. She had a rare gift of choosing friends wisely and building meaningful, lasting relationships.<\/p>\r\n <p class=\"life-body\">She was also beautifully creative. Michelle loved <strong>art<\/strong> — she expressed herself through drawing and found joy in creating. <strong>Music<\/strong> was part of her everyday life; she could not take a shower without singing along, knowing songs word for word. Her love for <strong>stories and novels<\/strong> began from a young age — books were her treasured companions and novels were always the best gift she could receive.<\/p>\r\n <\/div>\r\n <div class=\"life-img-wrap\">\r\n <div class=\"life-img-ph\" id=\"life-ph2\" style=\"aspect-ratio:4\/5;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>Character \u00b7 Friends<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life2\" class=\"life-img\" style=\"aspect-ratio:4\/5;display:none;\" src=\"\" alt=\"Michelle \u2014 Character\">\r\n <p class=\"life-img-cap\">Michelle · Studying’ At Home<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div style=\"margin:clamp(28px,5vh,52px) 0 12px;\">\r\n <div class=\"life-img-ph\" id=\"life-ph3\" style=\"aspect-ratio:16\/7;width:100%;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>Family \u00b7 Group<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life3\" class=\"life-img\" style=\"aspect-ratio:16\/7;display:none;\" src=\"\" alt=\"Michelle with family\">\r\n <p class=\"life-img-cap\">Michelle with her family<\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"life-ch\" style=\"margin-top:clamp(40px,7vh,72px);\">\r\n <div style=\"position:relative;\">\r\n <span class=\"life-ghost\">03<\/span>\r\n <p class=\"life-yr\">July 2023<\/p>\r\n <h3 class=\"life-cht\">University of<br>Western Australia<\/h3>\r\n <p class=\"life-body\">In <strong>July 2023<\/strong>, Michelle joined the <strong>University of Western Australia<\/strong> to pursue a degree in <strong>Biomedical Science<\/strong>. She carried with her a bright mind, a hopeful spirit and dreams of making a difference in the world.<\/p>\r\n <p class=\"life-body\">Her dream was to become a <em>children’s doctor<\/em> — which showed just how caring and selfless she truly was. She found joy in simple and meaningful things — swimming, going on adventures and spending time with those she loved. And at home, she always expressed her love in the most beautiful ways, even through something as simple as <strong>making pancakes<\/strong>.<\/p>\r\n <\/div>\r\n <div class=\"life-img-wrap\">\r\n <div class=\"life-img-ph\" id=\"life-ph4\" style=\"aspect-ratio:3\/4;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>University \u00b7 Perth<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life4\" class=\"life-img\" style=\"aspect-ratio:3\/4;display:none;\" src=\"\" alt=\"Michelle \u2014 UWA\">\r\n <p class=\"life-img-cap\">Michelle · With Nature<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"life-ch flip\">\r\n <div style=\"position:relative;\">\r\n <span class=\"life-ghost\">04<\/span>\r\n <p class=\"life-yr\">Faith<\/p>\r\n <h3 class=\"life-cht\">A Devoted<br>Catholic Christian<\/h3>\r\n <p class=\"life-body\">Michelle was a devoted Catholic Christian. She was baptised, received her First Holy Communion and later the Sacrament of Confirmation at <strong>Regina Caeli Catholic Church in Karen<\/strong>. Her faith was not just something she practiced — it was something she <em>lived<\/em>.<\/p>\r\n <p class=\"life-body\">She believed firmly that <strong>nothing is impossible with God<\/strong> and held onto that belief through every stage of her life. She testified to His healing power, believing He healed her from asthma as a young child and guided her through her personal growth and transformation.<\/p>\r\n <\/div>\r\n <div class=\"life-img-wrap\">\r\n <div class=\"life-img-ph\" id=\"life-ph5\" style=\"aspect-ratio:4\/5;\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg>\r\n <span>Faith \u00b7 Church<\/span>\r\n <\/div>\r\n <img decoding=\"async\" id=\"img-life5\" class=\"life-img\" style=\"aspect-ratio:4\/5;display:none;\" src=\"\" alt=\"Michelle \u2014 Faith\">\r\n <p class=\"life-img-cap\">Michelle · Bright Smiles<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"life-rule\"><\/div>\r\n <p class=\"life-yr\" style=\"margin-bottom:12px;\">Her Family<\/p>\r\n <p class=\"life-intro\">Above all, Michelle loved her family deeply.<\/p>\r\n <p class=\"life-body\">She was a cherished daughter to <strong>Hellen Muthoni Njiru<\/strong>, a loving sister to <strong>Stella Adlike Njura<\/strong> and <strong>Wilson John Muriuki<\/strong> and a dear sister-in-law to <strong>Oleg Bukrev<\/strong> and <strong>Evarline Wambui<\/strong>. She was a proud and loving aunt to <strong>Hazel Nia Muthoni<\/strong> and <strong>Blane Gichuki<\/strong>, a cousin, a niece and a friend to many. Her presence in the family was one of warmth, unity, and quiet strength.<\/p>\r\n\r\n <blockquote class=\"life-pull\" style=\"margin-top:clamp(28px,5vh,48px);\">\r\n “Michelle, you were deeply loved and you will forever be missed. Your light will continue to shine in our hearts, in our memories and in the love you left behind.”\r\n <cite>— From the Family<\/cite>\r\n <\/blockquote>\r\n <p class=\"life-body\" style=\"font-style:italic;color:var(--gray);margin-top:10px;\">May her beautiful soul rest in eternal peace. Amen.<\/p>\r\n <\/div>\r\n<\/div>\r\n\r\n\r\n<div class=\"section-overlay\" id=\"overlay-gallery\">\r\n <div class=\"section-panel\">\r\n <div class=\"sec-close-bar\">\r\n <button class=\"btn-close\" id=\"close-gallery\">Close<\/button>\r\n <\/div>\r\n <p class=\"sec-tag\">Moments in Time<\/p>\r\n <h2 class=\"sec-title\">Gallery<\/h2>\r\n <div class=\"gallery-grid\" id=\"gallery-grid\"><\/div>\r\n <p style=\"font-family:'Ubuntu',sans-serif;font-size:8px;letter-spacing:0.3em;text-transform:uppercase;color:rgba(245,243,239,0.16);text-align:center;margin-top:clamp(24px,4vh,48px);\">Hover to reveal caption · Click to enlarge<\/p>\r\n <\/div>\r\n<\/div>\r\n\r\n\r\n<div class=\"section-overlay\" id=\"overlay-programme\">\r\n <div class=\"section-panel\">\r\n <div class=\"sec-close-bar\">\r\n <button class=\"btn-close\" id=\"close-programme\">Close<\/button>\r\n <\/div>\r\n <p class=\"sec-tag\">Order of Service<\/p>\r\n <h2 class=\"sec-title\">Programme<\/h2>\r\n\r\n <p class=\"prog-intro\">We gather to honour, celebrate and bid farewell to <strong>Michelle Chanice Mwende<\/strong> \u2014 a beloved daughter, sister, aunt and friend. May this service bring comfort, peace and the assurance of God’s eternal love.<\/p>\r\n\r\n \r\n <div class=\"prog-meta-grid\">\r\n <div>\r\n <p class=\"prog-meta-label\">Date<\/p>\r\n <p class=\"prog-meta-value\">18th April, 2026<\/p>\r\n <\/div>\r\n <div>\r\n <p class=\"prog-meta-label\">Time<\/p>\r\n <p class=\"prog-meta-value\">10:00 AM <em>to 12:00 PM<\/em><\/p>\r\n <\/div>\r\n <div>\r\n <p class=\"prog-meta-label\">Venue<\/p>\r\n <p class=\"prog-meta-value\">CITAM Karen <em>Nairobi, Kenya<\/em><\/p>\r\n <\/div>\r\n <div>\r\n <p class=\"prog-meta-label\">Officiated by<\/p>\r\n <p class=\"prog-meta-value\">Bishop Cathy Kiuna<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <p class=\"prog-order-title\">Order of Service<\/p>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\">10:00 AM<\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Procession & Opening<\/p>\r\n <p class=\"prog-item-detail\">Family and congregation take their seats. Entry of the cort\u00e8ge.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Opening Prayer<\/p>\r\n <p class=\"prog-item-detail\">Led by Bishop Cathy Kiuna<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Worship & Praise<\/p>\r\n <p class=\"prog-item-detail\">Congregational singing<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Scripture Reading<\/p>\r\n <p class=\"prog-item-detail\">John 14:1–6 — <em>“Do not let your hearts be troubled…”<\/em><\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Tributes<\/p>\r\n <p class=\"prog-item-detail\">From family and friends<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Eulogy<\/p>\r\n <p class=\"prog-item-detail\">A celebration of the life of Michelle Chanice Mwende<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Sermon<\/p>\r\n <p class=\"prog-item-detail\">Bishop Cathy Kiuna<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\"><\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Final Commendation & Prayer<\/p>\r\n <p class=\"prog-item-detail\">Committal of Michelle into God’s care<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-item\">\r\n <p class=\"prog-item-time\">12:00 PM<\/p>\r\n <div>\r\n <p class=\"prog-item-name\">Recessional<\/p>\r\n <p class=\"prog-item-detail\">Departure of the family and cort\u00e8ge<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"prog-rule\"><\/div>\r\n\r\n <blockquote class=\"life-pull\">\r\n “I am the resurrection and the life. Whoever believes in me, though he die, yet shall he live.”\r\n <cite>— John 11:25<\/cite>\r\n <\/blockquote>\r\n\r\n <div class=\"prog-rule\"><\/div>\r\n\r\n \r\n <p class=\"prog-order-title\">Directions<\/p>\r\n <p style=\"font-family:'Cormorant Garamond',serif;font-size:clamp(15px,1.7vw,18px);font-weight:300;color:var(--lgray);line-height:1.8;margin-bottom:clamp(16px,2vh,24px);\">CITAM Karen — Ngong Road, Karen, Nairobi<\/p>\r\n <a id=\"directions-btn\" href=\"#\" target=\"_blank\" rel=\"noopener\" class=\"prog-directions-btn\" style=\"display:none;\">Open in Google Maps \u2197<\/a>\r\n <p id=\"map-no-url\" style=\"font-family:'Ubuntu',sans-serif;font-size:8px;letter-spacing:0.2em;color:rgba(245,243,239,0.16);display:none;\">Set VENUE_MAPS_LINK in the config to enable directions<\/p>\r\n\r\n <\/div>\r\n<\/div>\r\n\r\n\r\n<div class=\"section-overlay\" id=\"overlay-tributes\">\r\n <div class=\"section-panel\">\r\n <div class=\"sec-close-bar\">\r\n <button class=\"btn-close\" id=\"close-tributes\">Close<\/button>\r\n <\/div>\r\n <p class=\"sec-tag\">Words of Love<\/p>\r\n <h2 class=\"sec-title\">Tributes<\/h2>\r\n\r\n <p class=\"trib-intro\">Those who loved her most speak here — in their own words, with their own grief and with a love that does not end.<\/p>\r\n\r\n <div class=\"trib-list\">\r\n \r\n <div class=\"trib-item\">\r\n <div>\r\n <p class=\"trib-name\">Hellen Muthoni<\/p>\r\n <p class=\"trib-rel\">Mother<\/p>\r\n <\/div>\r\n <div class=\"trib-body\">\r\n <p>My dearest daughter, <em>Michy Mwesh, Sweety<\/em> — today, I stand with a heart full of love and deep sorrow as I remember you. In your 21 years, you brought so much light into my life. You were calm, always smiling and your quiet happiness filled our home with peace.<\/p>\r\n <p>You were so talented; your artwork was a gift — the way you could look at someone and draw them so beautifully. You loved your little baby pink world and it reflected your gentle and loving heart. You also loved music so deeply; you knew every song word for word and you brought songs to life in such a special way.<\/p>\r\n <p>You were not just my daughter — <em>you were my confidant and my best friend.<\/em> You stood by me in everything; helping me with my work, my emails and so many responsibilities. You were my strength. On every trip, you were my partner, my roommate, my joy.<\/p>\r\n <p>I remember how I used to call you my <em>“handbag,”<\/em> and how you loved it. People would even ask where my handbag was if I came without you. And you would always hold my hand like a little baby, all through your life. That love we shared was so special.<\/p>\r\n <p>You grew from a quiet girl into a strong and confident young woman. You made me so proud and your dream of becoming a children’s doctor showed just how caring and selfless you were. Though my heart aches, I find comfort in knowing you are resting in God’s presence, where there is no pain, only peace. <em>Until we meet again — I love you endlessly.<\/em><\/p>\r\n <p class=\"trib-scripture\">Revelation 21:4 — “He will wipe every tear from their eyes.”<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"trib-item\">\r\n <div>\r\n <p class=\"trib-name\">Stella Adline<\/p>\r\n <p class=\"trib-rel\">Sister<\/p>\r\n <\/div>\r\n <div class=\"trib-body\">\r\n <p>Dear Sis — I will always love you. I’m so grateful for the last three years we had together. Those years meant everything to me. We truly got to know each other — to learn, to grow, and to build a bond that I will always treasure. I’m thankful that I had the chance to tell you and to show you, just how much I loved you.<\/p>\r\n <p>We had so many dreams — dreams I held for you and for us. I dreamed of seeing you graduate, of watching you get married and of seeing you have children of your own.<\/p>\r\n <p>But I promise you this — <em>I will keep your memory alive.<\/em> I will miss your laughter, and that infectious smile that could light up a room. I will miss how you always listened, how you were always there. I will miss your wisdom, your presence and the comfort you brought just by being you.<\/p>\r\n <p>When you joined me in Australia, <em>something inside me felt safe in a way I can’t fully explain.<\/em> Having you there gave me strength and reassurance and I will always hold onto that. It’s been a month since you left us, yet the pain still feels as fresh as if it happened only moments ago. <em>Until we meet again, my baby. I will always love you.<\/em><\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"trib-item\">\r\n <div>\r\n <p class=\"trib-name\">Wilson Muriuki<\/p>\r\n <p class=\"trib-rel\">Brother<\/p>\r\n <\/div>\r\n <div class=\"trib-body\">\r\n <p>Michelle, I still remember how excited I was when I heard I was going to be your big brother. Your arrival was one of the happiest days of my life. You brought me so much joy growing up — especially in those early days when you believed I was your baby, and we held onto that little story for so long until you discovered I was actually your elder brother.<\/p>\r\n <p>Every time you were around, I found myself turning into a comedian with my dry jokes — <em>all just to see your beautiful smile and those dimples light up.<\/em><\/p>\r\n <p>I wish we could celebrate more milestones together — see you graduate, build your career and become the billionaire you always dreamed of. But God had better plans and we pray you are in a better place.<\/p>\r\n <p><em>You’ve left us far too soon, siz<\/em>, but I will forever be grateful for the time God gave us with you. Your humility, love and caring heart taught me so much. I LOVE YOU SO MUCH, lil siz — and I will forever miss you. This is not goodbye, it’s a see you later.<\/p>\r\n <p class=\"trib-scripture\">Psalm 34:18 — “The Lord is close to the brokenhearted and saves those who are crushed in spirit.”<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div style=\"text-align:center;margin-top:clamp(40px,8vh,76px);padding-top:clamp(28px,5vh,56px);border-top:1px solid rgba(245,243,239,0.06);\">\r\n <p style=\"font-family:'Cormorant Garamond',serif;font-size:clamp(16px,1.8vw,19px);font-weight:300;font-style:italic;color:var(--lgray);line-height:1.8;\">To share a tribute, please contact the family at<br><span style=\"color:var(--accent);font-style:normal;font-size:clamp(13px,1.5vw,15px);\">[<a href=\"\/cdn-cgi\/l\/email-protection\" class=\"__cf_email__\" data-cfemail=\"6600070b0f0a1f26030b070f0a4805090b\">[email protected]<\/a>]<\/span><\/p>\r\n <\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n\r\n<div class=\"lightbox\" id=\"lightbox\">\r\n <button class=\"lb-close\" id=\"lb-close-btn\">Close<\/button>\r\n <img decoding=\"async\" id=\"lightbox-img\" src=\"\" alt=\"\">\r\n<\/div>\r\n\r\n<script data-cfasync=\"false\" src=\"\/cdn-cgi\/scripts\/5c5dd728\/cloudflare-static\/email-decode.min.js\"><\/script><script>\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 All logic runs after DOM is ready \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n\r\n\/* Init directions link *\/\r\n(function initMap() {\r\n if (typeof VENUE_MAPS_LINK !== 'undefined' && VENUE_MAPS_LINK && !VENUE_MAPS_LINK.startsWith('YOUR_MAP')) {\r\n var btn = document.getElementById('directions-btn');\r\n if (btn) { btn.href = VENUE_MAPS_LINK; btn.style.display = 'inline-flex'; }\r\n } else {\r\n var noUrl = document.getElementById('map-no-url');\r\n if (noUrl) noUrl.style.display = 'block';\r\n }\r\n})();\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Helpers \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nfunction isReal(url) { return url && !url.startsWith('YOUR_IMAGE') && !url.startsWith('YOUR_AUDIO'); }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Music \u2014 autoplay, loop, click to pause\/play \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nconst audio = document.getElementById('bg-audio');\r\nconst musicBar = document.getElementById('music-bar');\r\nconst musicLabel = document.getElementById('music-label');\r\n\r\nif (isReal(MUSIC_URL)) {\r\n audio.src = MUSIC_URL;\r\n audio.volume = 0.35;\r\n audio.loop = true;\r\n\r\n \/* Autoplay \u2014 browsers require a user gesture first.\r\n We attempt silent autoplay; if blocked, we wait for\r\n the first click\/touch anywhere and then start. *\/\r\n const tryAutoplay = () => {\r\n audio.play().then(() => {\r\n musicBar.classList.remove('paused');\r\n musicLabel.textContent = 'Now Playing';\r\n }).catch(() => {\r\n \/* Autoplay blocked \u2014 wait for first interaction *\/\r\n musicBar.classList.add('paused');\r\n musicLabel.textContent = 'Play Music';\r\n const startOnInteraction = () => {\r\n audio.play().then(() => {\r\n musicBar.classList.remove('paused');\r\n musicLabel.textContent = 'Now Playing';\r\n }).catch(() => {});\r\n document.removeEventListener('click', startOnInteraction);\r\n document.removeEventListener('touchstart', startOnInteraction);\r\n };\r\n document.addEventListener('click', startOnInteraction, { once:true });\r\n document.addEventListener('touchstart', startOnInteraction, { once:true });\r\n });\r\n };\r\n tryAutoplay();\r\n} else {\r\n \/* No music configured \u2014 show bar in disabled state *\/\r\n musicBar.classList.add('paused');\r\n musicLabel.textContent = 'Add Music URL';\r\n musicBar.style.opacity = '0.5';\r\n musicBar.style.cursor = 'default';\r\n}\r\n\r\nfunction toggleMusic() {\r\n if (!isReal(MUSIC_URL)) return;\r\n if (audio.paused) {\r\n audio.play().then(() => {\r\n musicBar.classList.remove('paused');\r\n musicLabel.textContent = 'Now Playing';\r\n }).catch(() => {});\r\n } else {\r\n audio.pause();\r\n musicBar.classList.add('paused');\r\n musicLabel.textContent = 'Play Music';\r\n }\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Apply images \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nfunction applyImages() {\r\n ['panel1','panel2','panel3','panel4','panel5'].forEach((key, i) => {\r\n const idx = i + 1;\r\n const img = document.getElementById('img-panel' + idx);\r\n const bg = document.getElementById('pbg' + idx);\r\n if (isReal(IMAGES[key])) {\r\n img.src = IMAGES[key]; img.style.display = 'block';\r\n if (bg) bg.style.display = 'none';\r\n }\r\n });\r\n ['life1','life2','life3','life4','life5'].forEach((key, i) => {\r\n const idx = i + 1;\r\n const img = document.getElementById('img-life' + idx);\r\n const ph = document.getElementById('life-ph' + idx);\r\n if (img && isReal(IMAGES[key])) {\r\n img.src = IMAGES[key]; img.style.display = 'block';\r\n if (ph) ph.style.display = 'none';\r\n }\r\n });\r\n buildGallery();\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Gallery \u2014 self-scaling mosaic engine \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n Works for any number of images (1\u201350+).\r\n Positions are calculated algorithmically so no CSS changes\r\n are ever needed when adding more photos.\r\n Lazy loading is applied automatically to all gallery images.\r\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n\/* Mosaic tile templates \u2014 repeating pattern of 5 tiles per group.\r\n Each entry: [colSpan, rowSpan] on a 12-column grid.\r\n Pattern tiles across the page, shifting columns each group. *\/\r\nconst TILE_PATTERNS = [\r\n \/* Group A \u2014 left-heavy *\/\r\n [[5,6],[3,4],[4,5],[3,4],[4,5]],\r\n \/* Group B \u2014 centre cluster *\/\r\n [[4,5],[4,6],[4,5],[5,5],[4,6]],\r\n \/* Group C \u2014 right-heavy *\/\r\n [[4,5],[3,4],[5,6],[4,4],[3,5]],\r\n \/* Group D \u2014 balanced *\/\r\n [[3,4],[5,5],[4,6],[4,5],[3,4]],\r\n];\r\n\r\nfunction computeMosaicLayout(total, cols) {\r\n \/* On mobile we use a simple 2-wide alternating layout *\/\r\n if (cols <= 2) {\r\n const layout = [];\r\n let row = 1;\r\n for (let i = 0; i < total; i++) {\r\n const col = (i % 2 === 0) ? 1 : 2;\r\n const span = (i % 3 === 0) ? 5 : 4;\r\n if (i % 2 === 0 && i > 0) row += 4;\r\n layout.push({ cs: col, ce: col + 1, rs: row, re: row + span });\r\n }\r\n return layout;\r\n }\r\n\r\n \/* On 4-col mobile \u2014 two wide columns alternating tall\/short *\/\r\n if (cols <= 4) {\r\n const layout = [];\r\n let row = 1;\r\n for (let i = 0; i < total; i++) {\r\n const isLeft = i % 2 === 0;\r\n const cs = isLeft ? 1 : 3;\r\n const rowSpan = (i % 4 < 2) ? 4 : 5;\r\n if (isLeft && i > 0) row += (layout[i-1].re - layout[i-1].rs);\r\n layout.push({ cs, ce: cs + 2, rs: row, re: row + rowSpan });\r\n }\r\n return layout;\r\n }\r\n\r\n \/* Desktop 12-col \u2014 rich asymmetric mosaic *\/\r\n const layout = [];\r\n let cursor = 1; \/* current grid row *\/\r\n let groupIdx = 0;\r\n\r\n for (let i = 0; i < total; ) {\r\n const pattern = TILE_PATTERNS[groupIdx % TILE_PATTERNS.length];\r\n groupIdx++;\r\n\r\n \/* Place a group of up to 5 tiles, packed left\u2192right *\/\r\n let col = 1;\r\n let groupMaxRow = cursor;\r\n\r\n for (let t = 0; t < pattern.length && i < total; t++, i++) {\r\n const [cs, rs] = pattern[t];\r\n const ce = Math.min(col + cs, 13);\r\n const re = cursor + rs;\r\n layout.push({ cs: col, ce, rs: cursor, re });\r\n col = ce;\r\n if (col >= 13) { col = 1; cursor = groupMaxRow; }\r\n if (re > groupMaxRow) groupMaxRow = re;\r\n }\r\n cursor = groupMaxRow;\r\n }\r\n return layout;\r\n}\r\n\r\nconst GBG = ['#141414','#151515','#131313','#161616','#121212','#141414','#111111',\r\n '#151515','#131313','#121212','#161616','#141414','#111111','#151515',\r\n '#131313','#121212','#141414','#161616','#111111','#131313'];\r\n\r\nfunction buildGallery() {\r\n const grid = document.getElementById('gallery-grid');\r\n const TOTAL = 50;\r\n\r\n \/* Collect only populated slots \u2014 skip empty\/placeholder URLs *\/\r\n const slots = [];\r\n for (let i = 1; i <= TOTAL; i++) {\r\n const src = IMAGES['g' + i];\r\n const cap = GALLERY_CAPTIONS[i - 1] || ('Photo ' + i);\r\n slots.push({ src: isReal(src) ? src : null, cap, idx: i });\r\n }\r\n\r\n \/* Detect column count for layout engine *\/\r\n function getCols() {\r\n const w = window.innerWidth;\r\n if (w <= 480) return 2;\r\n if (w <= 768) return 4;\r\n return 12;\r\n }\r\n\r\n function render() {\r\n grid.innerHTML = '';\r\n const cols = getCols();\r\n const layout = computeMosaicLayout(slots.length, cols);\r\n\r\n slots.forEach((slot, i) => {\r\n const pos = layout[i];\r\n if (!pos) return;\r\n\r\n const div = document.createElement('div');\r\n div.className = 'gi';\r\n div.dataset.cap = slot.cap;\r\n div.style.setProperty('--gc', `${pos.cs}\/${pos.ce}`);\r\n div.style.setProperty('--gr', `${pos.rs}\/${pos.re}`);\r\n\r\n if (slot.src) {\r\n div.style.cursor = 'zoom-in';\r\n div.addEventListener('click', () => openLightbox(slot.src, slot.cap));\r\n const img = document.createElement('img');\r\n img.src = slot.src;\r\n img.alt = slot.cap;\r\n img.loading = 'lazy'; \/* native lazy load *\/\r\n div.appendChild(img);\r\n } else {\r\n const bg = GBG[i % GBG.length];\r\n div.innerHTML = `<div style=\"width:100%;height:100%;background:${bg};display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" opacity=\"0.1\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" fill=\"#f5f3ef\"\/><path d=\"M21 15l-5-5L5 21\" stroke=\"#f5f3ef\" stroke-width=\"1\"\/><\/svg><span style=\"font-family:'Ubuntu',sans-serif;font-size:7px;letter-spacing:0.28em;color:rgba(245,243,239,0.08);text-transform:uppercase;\">${slot.cap}<\/span><\/div>`;\r\n }\r\n grid.appendChild(div);\r\n });\r\n }\r\n\r\n render();\r\n\r\n \/* Re-render mosaic on resize so layout stays correct across breakpoints *\/\r\n let resizeTimer;\r\n window.addEventListener('resize', () => {\r\n clearTimeout(resizeTimer);\r\n resizeTimer = setTimeout(render, 200);\r\n });\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Section open\/close \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nconst ALL_SECTIONS = ['life','gallery','programme','tributes'];\r\n\r\nfunction openSection(name) {\r\n document.body.style.overflow = 'hidden';\r\n const overlay = document.getElementById('overlay-' + name);\r\n overlay.classList.add('active');\r\n const panel = overlay.querySelector('.section-panel');\r\n panel.scrollTop = 0;\r\n requestAnimationFrame(() => { panel.style.transform = 'translate(0,0)'; });\r\n \/* Hide every nav button except the active section's *\/\r\n ALL_SECTIONS.forEach(n => {\r\n if (n !== name) {\r\n const nav = document.getElementById('nav-' + n);\r\n nav.style.opacity = '0';\r\n nav.style.pointerEvents = 'none';\r\n nav.style.transition = 'opacity 0.4s ease';\r\n }\r\n });\r\n}\r\nfunction closeSection(name) {\r\n const overlay = document.getElementById('overlay-' + name);\r\n const panel = overlay.querySelector('.section-panel');\r\n const origins = { life:'translateX(-100%)', gallery:'translateX(100%)', programme:'translateY(100%)', tributes:'translateY(100%)' };\r\n panel.style.transform = origins[name];\r\n setTimeout(() => { overlay.classList.remove('active'); document.body.style.overflow = ''; }, 860);\r\n \/* Restore all nav buttons *\/\r\n ALL_SECTIONS.forEach(n => {\r\n const nav = document.getElementById('nav-' + n);\r\n nav.style.opacity = '';\r\n nav.style.pointerEvents = '';\r\n });\r\n}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Parallax \u2014 disabled on very small screens \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nfunction handleParallax() {\r\n if (window.innerWidth < 480) return;\r\n const wh = window.innerHeight;\r\n document.querySelectorAll('.panel').forEach(panel => {\r\n const rect = panel.getBoundingClientRect();\r\n const progress = -rect.top \/ wh;\r\n if (progress > -1.3 && progress < 1.3) {\r\n const img = panel.querySelector('.panel-img');\r\n if (img && img.style.display !== 'none') {\r\n img.style.transform = `scale(1.1) translateY(${progress * 7}%)`;\r\n }\r\n }\r\n });\r\n}\r\nwindow.addEventListener('scroll', handleParallax, { passive:true });\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Lightbox \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nfunction openLightbox(src, cap) {\r\n document.getElementById('lightbox-img').src = src;\r\n document.getElementById('lightbox-img').alt = cap || '';\r\n document.getElementById('lightbox').classList.add('open');\r\n}\r\nfunction closeLightbox() {\r\n document.getElementById('lightbox').classList.remove('open');\r\n}\r\ndocument.getElementById('lightbox').addEventListener('click', function(e) {\r\n if (e.target === this) closeLightbox();\r\n});\r\ndocument.getElementById('lb-close-btn').addEventListener('click', closeLightbox);\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Keyboard \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\ndocument.addEventListener('keydown', e => {\r\n if (e.key === 'Escape') {\r\n closeLightbox();\r\n ALL_SECTIONS.forEach(n => {\r\n if (document.getElementById('overlay-'+n).classList.contains('active')) closeSection(n);\r\n });\r\n }\r\n});\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Nav buttons \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\nALL_SECTIONS.forEach(name => {\r\n document.getElementById('btn-' + name).addEventListener('click', () => openSection(name));\r\n document.getElementById('close-' + name).addEventListener('click', () => closeSection(name));\r\n});\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Music bar click \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\ndocument.getElementById('music-bar').addEventListener('click', toggleMusic);\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 Init \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\napplyImages();\r\n\r\n}); \/* end DOMContentLoaded *\/<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>In Loving Memory of Michelle Chanice Mwende Play Music Life Gallery Programme Tributes 26 April 2004 — 25 February 2025 In Loving Memory of Michelle ChaniceMwende Beloved Daughter · Sister · Aunt · Friend Scroll A Precious Gift “Her presence brought warmth, gentleness and quiet joy into the lives of all who knew her.” St. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-112","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/pages\/112","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/comments?post=112"}],"version-history":[{"count":19,"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/pages\/112\/revisions"}],"predecessor-version":[{"id":211,"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/pages\/112\/revisions\/211"}],"wp:attachment":[{"href":"https:\/\/mwende.amkadigital.co.ke\/index.php\/wp-json\/wp\/v2\/media?parent=112"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}