{"id":15,"date":"2026-07-30T13:34:23","date_gmt":"2026-07-30T13:34:23","guid":{"rendered":"https:\/\/mahall.org\/?page_id=15"},"modified":"2026-07-30T13:36:24","modified_gmt":"2026-07-30T13:36:24","slug":"home-page-1","status":"publish","type":"page","link":"https:\/\/mahall.org\/index.php\/home-page-1\/","title":{"rendered":"Home Page"},"content":{"rendered":"\n<!--\n  MAHALL \u2014 homepage\n  ------------------------------------------------------------------\n  HOW TO USE IN WORDPRESS\n  1. Add a \"Custom HTML\" block (or use this as a full custom page\n     template if your theme supports raw HTML pages).\n  2. Paste this entire file's contents into the block.\n  3. The AI search bar and AI Concierge chat call two endpoints:\n       \/wp-json\/mahall\/v1\/ai-search\n       \/wp-json\/mahall\/v1\/ai-concierge\n     Until you wire those up server-side (see mahall-ai-proxy.php),\n     they fall back to a local mock so the page still feels alive.\n     NEVER put your Anthropic API key in this file \u2014 it would be\n     visible to every visitor. The key lives only in the PHP proxy.\n------------------------------------------------------------------- -->\n<style>\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..700;1,9..144,400..600&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');\n\n#mahall{\n  --bg:#16130F; --bg-raised:#1E1A14; --bg-card:#241F18;\n  --ink:#F3ECE0; --ink-soft:#BBAE99; --ink-faint:#7A7163;\n  --gold:#D98E33; --gold-soft:#E8B978;\n  --teal:#2F6F62; --teal-soft:#5C988B;\n  --terracotta:#B5532D;\n  --line:rgba(243,236,224,0.12);\n  --radius:14px;\n  font-family:'Inter',sans-serif; background:var(--bg); color:var(--ink);\n  -webkit-font-smoothing:antialiased; overflow-x:hidden;\n}\n#mahall *{box-sizing:border-box; margin:0; padding:0;}\n#mahall a{color:inherit; text-decoration:none;}\n#mahall .wrap{max-width:1180px; margin:0 auto; padding:0 28px;}\n#mahall .eyebrow{\n  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em;\n  text-transform:uppercase; color:var(--gold-soft);\n}\n#mahall h1,#mahall h2,#mahall h3{font-family:'Fraunces',serif; font-weight:500; line-height:1.08; color:var(--ink);}\n#mahall p{color:var(--ink-soft); line-height:1.65;}\n#mahall .btn{\n  display:inline-flex; align-items:center; gap:8px; font-family:'Inter',sans-serif;\n  font-weight:500; font-size:14px; padding:12px 22px; border-radius:999px;\n  border:1px solid var(--line); cursor:pointer; background:transparent; color:var(--ink);\n  transition:border-color .2s, transform .15s, background .2s;\n}\n#mahall .btn:hover{border-color:var(--gold-soft); transform:translateY(-1px);}\n#mahall .btn:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}\n#mahall .btn-solid{background:var(--gold); border-color:var(--gold); color:#1A1305;}\n#mahall .btn-solid:hover{background:var(--gold-soft); border-color:var(--gold-soft);}\n\n\/* zellige star \u2014 signature mark, built from two squares *\/\n#mahall .star{position:relative; width:18px; height:18px; flex:none;}\n#mahall .star span{position:absolute; inset:0; border:1.4px solid var(--gold); }\n#mahall .star span:first-child{transform:rotate(0deg);}\n#mahall .star span:last-child{transform:rotate(45deg);}\n#mahall .stitch{\n  display:flex; align-items:center; justify-content:center; gap:22px;\n  padding:6px 0; opacity:0; transform:translateY(8px); transition:opacity .6s, transform .6s;\n}\n#mahall .stitch.in{opacity:1; transform:none;}\n#mahall .stitch .star{width:10px; height:10px; opacity:.55;}\n#mahall .stitch .rule{height:1px; width:64px; background:var(--line);}\n\n\/* nav *\/\n#mahall nav{\n  position:sticky; top:0; z-index:40; backdrop-filter:blur(10px);\n  background:rgba(22,19,15,0.86); border-bottom:1px solid var(--line);\n}\n#mahall nav .row{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; max-width:1180px; margin:0 auto;}\n#mahall .logo{display:flex; align-items:center; gap:10px; font-family:'Fraunces',serif; font-size:20px; letter-spacing:.01em;}\n#mahall .navlinks{display:flex; gap:32px; font-size:14px; color:var(--ink-soft);}\n#mahall .navlinks a:hover{color:var(--ink);}\n#mahall .navcta{display:flex; gap:10px;}\n#mahall .navtoggle{display:none; background:none; border:none; color:var(--ink); font-size:22px; cursor:pointer;}\n@media (max-width:860px){\n  #mahall .navlinks{display:none;}\n  #mahall .navtoggle{display:block;}\n}\n\n\/* hero *\/\n#mahall .hero{padding:96px 0 64px; position:relative;}\n#mahall .hero .wrap{max-width:760px; text-align:center; margin:0 auto;}\n#mahall .hero .eyebrow{display:block; margin-bottom:18px;}\n#mahall .hero h1{font-size:clamp(40px,6vw,64px); margin-bottom:18px;}\n#mahall .hero h1 em{font-style:italic; color:var(--gold-soft);}\n#mahall .hero p.lead{font-size:17px; max-width:540px; margin:0 auto 36px;}\n\n#mahall .search{\n  display:flex; gap:8px; background:var(--bg-raised); border:1px solid var(--line);\n  border-radius:999px; padding:8px; max-width:640px; margin:0 auto 18px; flex-wrap:wrap;\n}\n#mahall .search input{\n  flex:1; min-width:160px; background:transparent; border:none; color:var(--ink);\n  font-family:'Inter',sans-serif; font-size:14px; padding:10px 14px; outline:none;\n}\n#mahall .search input::placeholder{color:var(--ink-faint);}\n#mahall .search button{\n  background:var(--gold); color:#1A1305; border:none; border-radius:999px;\n  font-family:'Inter',sans-serif; font-weight:600; font-size:14px; padding:10px 20px;\n  cursor:pointer; display:flex; align-items:center; gap:6px; transition:background .2s;\n}\n#mahall .search button:hover{background:var(--gold-soft);}\n#mahall .search-hint{font-size:12px; color:var(--ink-faint); text-align:center; margin-bottom:8px;}\n#mahall .search-result{\n  max-width:640px; margin:0 auto; padding:14px 18px; border-radius:var(--radius);\n  background:var(--bg-card); border:1px solid var(--line); font-size:13px; color:var(--ink-soft);\n  display:none; text-align:left;\n}\n#mahall .search-result.show{display:block;}\n#mahall .search-result b{color:var(--gold-soft); font-weight:500;}\n\n#mahall .stats{display:flex; justify-content:center; gap:40px; margin-top:48px; flex-wrap:wrap;}\n#mahall .stat{text-align:center;}\n#mahall .stat b{display:block; font-family:'Fraunces',serif; font-size:26px; color:var(--gold-soft);}\n#mahall .stat span{font-size:12px; color:var(--ink-faint); letter-spacing:.05em;}\n\n\/* section heading pattern *\/\n#mahall .section{padding:64px 0;}\n#mahall .section-head{max-width:560px; margin-bottom:36px;}\n#mahall .section-head .eyebrow{margin-bottom:10px; display:block;}\n#mahall .section-head h2{font-size:30px;}\n\n\/* categories *\/\n#mahall .cat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}\n#mahall .cat-card{\n  background:var(--bg-card); border:1px solid var(--line); border-radius:var(--radius);\n  padding:20px; cursor:pointer; transition:border-color .2s, transform .15s; text-align:left;\n}\n#mahall .cat-card:hover{border-color:var(--gold-soft); transform:translateY(-2px);}\n#mahall .cat-card.active{border-color:var(--gold); background:rgba(217,142,51,0.08);}\n#mahall .cat-card .ic{font-size:20px; margin-bottom:14px; display:block;}\n#mahall .cat-card h3{font-size:15px; font-weight:500; font-family:'Inter',sans-serif; margin-bottom:4px; color:var(--ink);}\n#mahall .cat-card p{font-size:12px; color:var(--ink-faint); margin:0;}\n@media (max-width:860px){ #mahall .cat-grid{grid-template-columns:repeat(2,1fr);} }\n\n\/* venues *\/\n#mahall .filters{display:flex; gap:8px; margin-bottom:28px; flex-wrap:wrap;}\n#mahall .filter-pill{\n  font-family:'JetBrains Mono',monospace; font-size:12px; padding:8px 16px; border-radius:999px;\n  border:1px solid var(--line); color:var(--ink-soft); cursor:pointer; background:transparent;\n  transition:border-color .2s, color .2s;\n}\n#mahall .filter-pill.active{border-color:var(--gold); color:var(--gold-soft);}\n#mahall .venue-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}\n#mahall .venue-card{\n  background:var(--bg-card); border:1px solid var(--line); border-radius:var(--radius);\n  overflow:hidden; transition:transform .2s, border-color .2s;\n}\n#mahall .venue-card:hover{transform:translateY(-3px); border-color:var(--gold-soft);}\n#mahall .venue-img{\n  height:160px; position:relative; overflow:hidden;\n  background:repeating-linear-gradient(45deg, rgba(217,142,51,.10) 0 10px, rgba(47,111,98,.10) 10px 20px);\n  display:flex; align-items:flex-end; padding:12px;\n}\n#mahall .venue-tag{\n  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.06em; text-transform:uppercase;\n  background:rgba(22,19,15,0.7); color:var(--gold-soft); padding:4px 9px; border-radius:999px; border:1px solid var(--line);\n}\n#mahall .venue-body{padding:16px 18px;}\n#mahall .venue-body h3{font-size:16px; font-family:'Inter',sans-serif; font-weight:600; margin-bottom:4px;}\n#mahall .venue-body p{font-size:13px; margin:0;}\n#mahall .venue-price{display:flex; justify-content:space-between; align-items:center; margin-top:10px; font-size:12px; color:var(--ink-faint);}\n#mahall .venue-price b{color:var(--gold-soft); font-weight:500;}\n@media (max-width:860px){ #mahall .venue-grid{grid-template-columns:1fr 1fr;} }\n@media (max-width:560px){ #mahall .venue-grid{grid-template-columns:1fr;} }\n\n\/* owner CTA banner *\/\n#mahall .cta-band{\n  background:linear-gradient(180deg, rgba(47,111,98,.16), rgba(47,111,98,.05));\n  border:1px solid var(--line); border-radius:20px; padding:48px; text-align:center;\n}\n#mahall .cta-band h2{font-size:28px; margin-bottom:10px;}\n#mahall .cta-band p{max-width:440px; margin:0 auto 26px;}\n\n\/* footer *\/\n#mahall footer{border-top:1px solid var(--line); padding:48px 0 28px;}\n#mahall .foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; margin-bottom:36px;}\n#mahall .foot-grid h4{font-family:'Inter',sans-serif; font-size:13px; font-weight:600; margin-bottom:14px; color:var(--ink);}\n#mahall .foot-grid a{display:block; font-size:13px; color:var(--ink-soft); margin-bottom:8px;}\n#mahall .foot-grid a:hover{color:var(--gold-soft);}\n#mahall .foot-bottom{display:flex; justify-content:space-between; font-size:12px; color:var(--ink-faint); flex-wrap:wrap; gap:8px;}\n@media (max-width:860px){ #mahall .foot-grid{grid-template-columns:1fr 1fr;} }\n\n\/* reveal-on-scroll *\/\n#mahall .reveal{opacity:0; transform:translateY(16px); transition:opacity .7s, transform .7s;}\n#mahall .reveal.in{opacity:1; transform:none;}\n\n\/* AI concierge *\/\n#mahall .ai-fab{\n  position:fixed; bottom:24px; right:24px; z-index:60; width:58px; height:58px; border-radius:50%;\n  background:var(--gold); color:#1A1305; border:none; cursor:pointer; font-size:22px;\n  box-shadow:0 0 0 0 rgba(217,142,51,.5); animation:pulse 2.6s infinite;\n  display:flex; align-items:center; justify-content:center;\n}\n@keyframes pulse{\n  0%{box-shadow:0 0 0 0 rgba(217,142,51,.45);}\n  70%{box-shadow:0 0 0 14px rgba(217,142,51,0);}\n  100%{box-shadow:0 0 0 0 rgba(217,142,51,0);}\n}\n#mahall .ai-panel{\n  position:fixed; bottom:92px; right:24px; z-index:60; width:340px; max-height:480px;\n  background:var(--bg-raised); border:1px solid var(--line); border-radius:16px;\n  display:none; flex-direction:column; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.4);\n}\n#mahall .ai-panel.open{display:flex;}\n#mahall .ai-head{padding:14px 16px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:10px;}\n#mahall .ai-head b{font-family:'Fraunces',serif; font-size:15px;}\n#mahall .ai-head span{font-size:11px; color:var(--ink-faint); display:block;}\n#mahall .ai-body{flex:1; overflow-y:auto; padding:14px 16px; display:flex; flex-direction:column; gap:10px; font-size:13px;}\n#mahall .msg{max-width:85%; padding:9px 12px; border-radius:12px; line-height:1.5;}\n#mahall .msg.bot{background:var(--bg-card); align-self:flex-start; color:var(--ink-soft);}\n#mahall .msg.me{background:var(--gold); color:#1A1305; align-self:flex-end;}\n#mahall .ai-input{display:flex; gap:8px; padding:12px; border-top:1px solid var(--line);}\n#mahall .ai-input input{\n  flex:1; background:var(--bg); border:1px solid var(--line); border-radius:999px;\n  padding:9px 14px; color:var(--ink); font-size:13px; outline:none;\n}\n#mahall .ai-input button{\n  background:var(--gold); border:none; color:#1A1305; border-radius:999px; width:36px; height:36px; cursor:pointer;\n}\n\n@media (prefers-reduced-motion: reduce){\n  #mahall .ai-fab{animation:none;}\n  #mahall .reveal, #mahall .stitch{transition:none;}\n}\n<\/style>\n\n<div id=\"mahall\">\n\n  <nav>\n    <div class=\"row\">\n      <div class=\"logo\"><span class=\"star\"><span><\/span><span><\/span><\/span> Mahall<\/div>\n      <div class=\"navlinks\">\n        <a href=\"#categories\">Categories<\/a>\n        <a href=\"#venues\">Venues<\/a>\n        <a href=\"#owners\">For owners<\/a>\n        <a href=\"#footer\">Contact<\/a>\n      <\/div>\n      <div class=\"navcta\">\n        <a class=\"btn\" href=\"#\" data-role=\"login\">Log in<\/a>\n        <a class=\"btn btn-solid\" href=\"#owners\">List your venue<\/a>\n      <\/div>\n      <button class=\"navtoggle\" aria-label=\"Menu\">&#9776;<\/button>\n    <\/div>\n  <\/nav>\n\n  <section class=\"hero\">\n    <div class=\"wrap\">\n      <span class=\"eyebrow\">Morocco &rarr; MENA &middot; est. 2026<\/span>\n      <h1>Spaces with stories.<br><em>Events that belong nowhere else.<\/em><\/h1>\n      <p class=\"lead\">Riads, kasbahs, desert camps, beach clubs \u2014 Mahall connects Morocco&#8217;s most distinctive venues with the people planning weddings, retreats, and brand experiences.<\/p>\n\n      <div class=\"search\">\n        <input id=\"ai-search-input\" type=\"text\" placeholder=\"Describe what you need \u2014 &quot;beachfront venue for 150, wedding, Essaouira&quot;\">\n        <button id=\"ai-search-btn\">Search &#10148;<\/button>\n      <\/div>\n      <div class=\"search-hint\">AI-assisted search &middot; understands natural language, not just keywords<\/div>\n      <div class=\"search-result\" id=\"ai-search-result\"><\/div>\n\n      <div class=\"stats\">\n        <div class=\"stat\"><b>18+<\/b><span>VENUE CATEGORIES<\/span><\/div>\n        <div class=\"stat\"><b>10+<\/b><span>SUPPLIER CATEGORIES<\/span><\/div>\n        <div class=\"stat\"><b>MENA<\/b><span>SCALING REGION<\/span><\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <div class=\"stitch\" id=\"stitch-1\"><span class=\"star\"><span><\/span><span><\/span><\/span><span class=\"rule\"><\/span><span class=\"star\"><span><\/span><span><\/span><\/span><span class=\"rule\"><\/span><span class=\"star\"><span><\/span><span><\/span><\/span><\/div>\n\n  <section class=\"section reveal\" id=\"categories\">\n    <div class=\"wrap\">\n      <div class=\"section-head\">\n        <span class=\"eyebrow\">Browse by category<\/span>\n        <h2>Eight worlds, one ecosystem<\/h2>\n      <\/div>\n      <div class=\"cat-grid\" id=\"cat-grid\"><\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"section reveal\" id=\"venues\">\n    <div class=\"wrap\">\n      <div class=\"section-head\">\n        <span class=\"eyebrow\">Featured listings<\/span>\n        <h2>Where your next event could happen<\/h2>\n      <\/div>\n      <div class=\"filters\" id=\"filters\"><\/div>\n      <div class=\"venue-grid\" id=\"venue-grid\"><\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"section reveal\" id=\"owners\">\n    <div class=\"wrap\">\n      <div class=\"cta-band\">\n        <h2>Own a space worth discovering?<\/h2>\n        <p>List your venue, set your own visibility tier, and start receiving qualified inquiries from event planners, brands, and travelers across Morocco.<\/p>\n        <a class=\"btn btn-solid\" href=\"#\">Register your venue &#10148;<\/a>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <footer id=\"footer\">\n    <div class=\"wrap\">\n      <div class=\"foot-grid\">\n        <div>\n          <div class=\"logo\" style=\"margin-bottom:12px;\"><span class=\"star\"><span><\/span><span><\/span><\/span> Mahall<\/div>\n          <p style=\"max-width:240px; font-size:13px;\">Connecting Morocco&#8217;s most unique venues with event, hospitality, and experience buyers.<\/p>\n        <\/div>\n        <div>\n          <h4>Discover<\/h4>\n          <a href=\"#venues\">Browse venues<\/a>\n          <a href=\"#categories\">Categories<\/a>\n          <a href=\"#\">How it works<\/a>\n        <\/div>\n        <div>\n          <h4>For owners<\/h4>\n          <a href=\"#owners\">List your venue<\/a>\n          <a href=\"#\">Pricing<\/a>\n          <a href=\"#\">Owner dashboard<\/a>\n        <\/div>\n        <div>\n          <h4>Company<\/h4>\n          <a href=\"#\">About<\/a>\n          <a href=\"#\">Vision 2030<\/a>\n          <a href=\"#footer\">Contact<\/a>\n        <\/div>\n      <\/div>\n      <div class=\"foot-bottom\">\n        <span>&copy; 2026 Mahall. Morocco &rarr; MENA.<\/span>\n        <span>mahall.org<\/span>\n      <\/div>\n    <\/div>\n  <\/footer>\n\n  <button class=\"ai-fab\" id=\"ai-fab\" aria-label=\"Open Mahall AI concierge\">&#10022;<\/button>\n  <div class=\"ai-panel\" id=\"ai-panel\">\n    <div class=\"ai-head\">\n      <span class=\"star\"><span><\/span><span><\/span><\/span>\n      <div><b>Mahall concierge<\/b><span>Ask about venues, pricing, or booking<\/span><\/div>\n    <\/div>\n    <div class=\"ai-body\" id=\"ai-body\">\n      <div class=\"msg bot\">Marhaba! I can help you find a venue, explain how listing works, or route you to the right form. What are you planning?<\/div>\n    <\/div>\n    <div class=\"ai-input\">\n      <input id=\"ai-chat-input\" type=\"text\" placeholder=\"Type a message...\">\n      <button id=\"ai-chat-send\" aria-label=\"Send\">&#10148;<\/button>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n(function(){\n  var ROOT = document.getElementById('mahall');\n\n  var CATEGORIES = [\n    {code:'heritage', name:'Heritage & cultural', desc:'Riads, kasbahs, palaces', ic:'&#127963;'},\n    {code:'resort', name:'Hospitality & resort', desc:'Hotels, beach & golf resorts', ic:'&#127869;'},\n    {code:'private', name:'Private & exclusive', desc:'Villas, estates, gardens', ic:'&#127968;'},\n    {code:'nature', name:'Nature & adventure', desc:'Desert camps, eco lodges', ic:'&#9978;'},\n    {code:'coastal', name:'Coastal & leisure', desc:'Beach clubs, marinas', ic:'&#9973;'},\n    {code:'urban', name:'Urban & lifestyle', desc:'Rooftops, lounges, restaurants', ic:'&#127961;'},\n    {code:'corporate', name:'Corporate & MICE', desc:'Convention & exhibition halls', ic:'&#128202;'},\n    {code:'entertainment', name:'Entertainment & production', desc:'Studios, arenas, theaters', ic:'&#127909;'}\n  ];\n\n  var VENUES = [\n    {name:'Riad Zahra', city:'Marrakech', cat:'heritage', price:'4,000', tag:'Featured'},\n    {name:'Dunes Camp Erg', city:'Merzouga', cat:'nature', price:'6,500', tag:'New'},\n    {name:'Atlas Beach Club', city:'Essaouira', cat:'coastal', price:'3,200', tag:'Featured'},\n    {name:'Villa Janoub', city:'Tangier', cat:'private', price:'8,000', tag:''},\n    {name:'Kasbah Ait Noir', city:'Ouarzazate', cat:'heritage', price:'5,400', tag:''},\n    {name:'Skyline Rooftop', city:'Casablanca', cat:'urban', price:'2,800', tag:'New'},\n    {name:'Palmeraie Resort', city:'Marrakech', cat:'resort', price:'7,200', tag:''},\n    {name:'Centre Atlantique', city:'Rabat', cat:'corporate', price:'9,500', tag:''},\n    {name:'Studio Lumi\u00e8re', city:'Casablanca', cat:'entertainment', price:'3,900', tag:'Featured'}\n  ];\n\n  var activeCat = 'all';\n\n  function renderCategories(){\n    var grid = document.getElementById('cat-grid');\n    grid.innerHTML = CATEGORIES.map(function(c){\n      return '<button class=\"cat-card\" data-cat=\"'+c.code+'\"><span class=\"ic\">'+c.ic+'<\/span><h3>'+c.name+'<\/h3><p>'+c.desc+'<\/p><\/button>';\n    }).join('');\n    grid.addEventListener('click', function(e){\n      var card = e.target.closest('.cat-card');\n      if(!card) return;\n      setActiveCategory(card.getAttribute('data-cat'));\n      document.getElementById('venues').scrollIntoView({behavior:'smooth'});\n    });\n  }\n\n  function renderFilters(){\n    var codes = ['all'].concat(CATEGORIES.map(function(c){return c.code;}));\n    var labels = {all:'All venues'};\n    CATEGORIES.forEach(function(c){ labels[c.code] = c.name; });\n    var el = document.getElementById('filters');\n    el.innerHTML = codes.map(function(code){\n      return '<button class=\"filter-pill\" data-cat=\"'+code+'\">'+labels[code]+'<\/button>';\n    }).join('');\n    el.addEventListener('click', function(e){\n      var pill = e.target.closest('.filter-pill');\n      if(!pill) return;\n      setActiveCategory(pill.getAttribute('data-cat'));\n    });\n  }\n\n  function setActiveCategory(code){\n    activeCat = code;\n    document.querySelectorAll('.cat-card').forEach(function(c){\n      c.classList.toggle('active', c.getAttribute('data-cat') === code);\n    });\n    document.querySelectorAll('.filter-pill').forEach(function(p){\n      p.classList.toggle('active', p.getAttribute('data-cat') === code);\n    });\n    renderVenues();\n  }\n\n  function renderVenues(){\n    var list = activeCat === 'all' ? VENUES : VENUES.filter(function(v){ return v.cat === activeCat; });\n    var grid = document.getElementById('venue-grid');\n    if(list.length === 0){\n      grid.innerHTML = '<p>No listings in this category yet \u2014 be the first to register one.<\/p>';\n      return;\n    }\n    grid.innerHTML = list.map(function(v){\n      return '<div class=\"venue-card\">'+\n        '<div class=\"venue-img\">'+(v.tag ? '<span class=\"venue-tag\">'+v.tag+'<\/span>' : '')+'<\/div>'+\n        '<div class=\"venue-body\"><h3>'+v.name+'<\/h3><p>'+v.city+'<\/p>'+\n        '<div class=\"venue-price\"><span>From<\/span><b>'+v.price+' MAD<\/b><\/div><\/div>'+\n        '<\/div>';\n    }).join('');\n  }\n\n  function revealOnScroll(){\n    var targets = document.querySelectorAll('#mahall .reveal, #mahall .stitch');\n    var io = new IntersectionObserver(function(entries){\n      entries.forEach(function(en){\n        if(en.isIntersecting) en.target.classList.add('in');\n      });\n    }, {threshold:0.15});\n    targets.forEach(function(t){ io.observe(t); });\n  }\n\n  \/* ---- AI search: tries the WP REST proxy first, falls back to a local parser ---- *\/\n  function localParse(text){\n    var t = text.toLowerCase();\n    var cat = CATEGORIES.find(function(c){ return t.indexOf(c.code) > -1 || t.indexOf(c.name.toLowerCase().split(' ')[0]) > -1; });\n    var cityMatch = VENUES.map(function(v){return v.city;}).find(function(city){ return t.indexOf(city.toLowerCase()) > -1; });\n    var guestsMatch = t.match(\/(\\d{2,4})\\s*(guests|people|pax)\/);\n    return {\n      category: cat ? cat.code : null,\n      city: cityMatch || null,\n      guests: guestsMatch ? guestsMatch[1] : null\n    };\n  }\n\n  async function runAiSearch(query){\n    var resultEl = document.getElementById('ai-search-result');\n    resultEl.classList.add('show');\n    resultEl.textContent = 'Thinking...';\n    var parsed;\n    try{\n      var res = await fetch('\/wp-json\/mahall\/v1\/ai-search', {\n        method:'POST', headers:{'Content-Type':'application\/json'},\n        body: JSON.stringify({query: query})\n      });\n      if(!res.ok) throw new Error('proxy not configured');\n      parsed = await res.json();\n    }catch(err){\n      parsed = localParse(query); \/* offline fallback, no key needed *\/\n    }\n    if(parsed.category) setActiveCategory(parsed.category);\n    var bits = [];\n    if(parsed.category) bits.push('category <b>'+parsed.category+'<\/b>');\n    if(parsed.city) bits.push('city <b>'+parsed.city+'<\/b>');\n    if(parsed.guests) bits.push('<b>'+parsed.guests+'<\/b> guests');\n    resultEl.innerHTML = bits.length\n      ? 'Filtering for '+bits.join(', ')+' \u2014 showing matches below.'\n      : 'Showing all venues \u2014 try mentioning a city, category, or guest count for tighter results.';\n  }\n\n  \/* ---- AI concierge chat: same pattern, proxy first, scripted fallback ---- *\/\n  var FALLBACK_REPLIES = [\n    \"I can help with that. For venue searches, try the search bar above \u2014 for booking, open any listing and use its inquiry form.\",\n    \"Listing your venue takes about ten minutes: pick a category, add photos, and choose a visibility tier. Want the link?\",\n    \"Mahall covers eight venue categories across Morocco, expanding into MENA next. Anything specific you're planning \u2014 a wedding, retreat, or corporate event?\"\n  ];\n  var fallbackIndex = 0;\n\n  function addMsg(text, who){\n    var body = document.getElementById('ai-body');\n    var div = document.createElement('div');\n    div.className = 'msg ' + (who === 'me' ? 'me' : 'bot');\n    div.textContent = text;\n    body.appendChild(div);\n    body.scrollTop = body.scrollHeight;\n  }\n\n  async function sendConciergeMessage(text){\n    addMsg(text, 'me');\n    try{\n      var res = await fetch('\/wp-json\/mahall\/v1\/ai-concierge', {\n        method:'POST', headers:{'Content-Type':'application\/json'},\n        body: JSON.stringify({message: text})\n      });\n      if(!res.ok) throw new Error('proxy not configured');\n      var data = await res.json();\n      addMsg(data.reply, 'bot');\n    }catch(err){\n      addMsg(FALLBACK_REPLIES[fallbackIndex % FALLBACK_REPLIES.length], 'bot');\n      fallbackIndex++;\n    }\n  }\n\n  function wireAi(){\n    document.getElementById('ai-search-btn').addEventListener('click', function(){\n      var v = document.getElementById('ai-search-input').value.trim();\n      if(v) runAiSearch(v);\n    });\n    document.getElementById('ai-search-input').addEventListener('keydown', function(e){\n      if(e.key === 'Enter'){ runAiSearch(this.value.trim()); }\n    });\n\n    var fab = document.getElementById('ai-fab');\n    var panel = document.getElementById('ai-panel');\n    fab.addEventListener('click', function(){ panel.classList.toggle('open'); });\n\n    document.getElementById('ai-chat-send').addEventListener('click', function(){\n      var input = document.getElementById('ai-chat-input');\n      var v = input.value.trim();\n      if(!v) return;\n      sendConciergeMessage(v);\n      input.value = '';\n    });\n    document.getElementById('ai-chat-input').addEventListener('keydown', function(e){\n      if(e.key === 'Enter'){ document.getElementById('ai-chat-send').click(); }\n    });\n  }\n\n  renderCategories();\n  renderFilters();\n  renderVenues();\n  setActiveCategory('all');\n  revealOnScroll();\n  wireAi();\n})();\n<\/script>\n\n","protected":false},"excerpt":{"rendered":"<p>Mahall Categories Venues For owners Contact Log in List your venue &#9776; Morocco &rarr; MENA &middot; est. 2026 Spaces with stories.Events that belong nowhere else. Riads, kasbahs, desert camps, beach clubs \u2014 Mahall connects Morocco&#8217;s most distinctive venues with the people planning weddings, retreats, and brand experiences. Search &#10148; AI-assisted search &middot; understands natural language, [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"folder":[],"class_list":["post-15","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/pages\/15","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/comments?post=15"}],"version-history":[{"count":2,"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/pages\/15\/revisions"}],"predecessor-version":[{"id":17,"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/pages\/15\/revisions\/17"}],"wp:attachment":[{"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/media?parent=15"}],"wp:term":[{"taxonomy":"folder","embeddable":true,"href":"https:\/\/mahall.org\/index.php\/wp-json\/wp\/v2\/folder?post=15"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}