{"id":1054,"date":"2026-05-06T03:03:51","date_gmt":"2026-05-06T03:03:51","guid":{"rendered":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/?page_id=1054"},"modified":"2026-05-15T07:44:03","modified_gmt":"2026-05-15T07:44:03","slug":"services","status":"publish","type":"page","link":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/services\/","title":{"rendered":"Services"},"content":{"rendered":"\n<!doctype html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n<title>Corner Station Bar<\/title>\n\n<style>\n\/* ===== RESET ===== *\/\n*, *::before, *::after { box-sizing: border-box; }\n\nbody {\n  margin: 0;\n  background: #f6f7fb;\n  color: #111;\n}\nbody.modal-open { overflow: hidden; }\n\n\/* ===== WRAPPER ===== *\/\n.wrap {\n  max-width: 980px;\n  margin: 0 auto;\n  padding: 16px;\n}\n\n\/* ===== HEADER ===== *\/\n.menu-top {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 14px;\n  margin-bottom: 24px;\n}\n.menu-logo { max-width: 180px; }\n.menu-title { font-size: 22px; font-weight: 800; }\n\n\/* ===== CATEGORIES ===== *\/\n.cats {\n  display: grid;\n  grid-template-columns: repeat(2,1fr);\n  gap: 14px;\n}\n.cat-card {\n  position: relative;\n  min-height: 170px;\n  border-radius: 16px;\n  overflow: hidden;\n  cursor: pointer;\n}\n.cat-card img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n.cat-overlay {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: flex-end;\n  padding: 14px;\n  color: #fff;\n  background: linear-gradient(to top, rgba(0,0,0,.8), rgba(0,0,0,.15));\n}\n\n\/* Responsive *\/\n@media (min-width:720px){\n  .cats{ grid-template-columns: repeat(3,1fr); }\n}\n\n\/* ===== MODAL ===== *\/\n.modal{\n  position:fixed;\n  inset:0;\n  background:rgba(0,0,0,.6);\n  display:none;\n  align-items:flex-end;\n  justify-content:center;\n  z-index:999;\n}\n\n.modal.is-open{\n  display:flex;\n}\n\n.modal-sheet{\n  background:#fff;\n  width:100%;\n  max-width:700px;\n  height:85vh;\n  border-radius:24px 24px 0 0;\n  overflow:hidden;\n  display:flex;\n  flex-direction:column;\n}\n\n.modal-header{\n  display:flex;\n  justify-content:space-between;\n  align-items:center;\n  padding:18px;\n  border-bottom:1px solid #eee;\n}\n\n.modal-body{\n  overflow:auto;\n  padding:16px;\n}\n\n#closeModal{\n  border:none;\n  background:#111;\n  color:#fff;\n  width:38px;\n  height:38px;\n  border-radius:50%;\n  cursor:pointer;\n}\n\n\/* ===== ITEMS ===== *\/\n.items{\n  display:flex;\n  flex-direction:column;\n  gap:14px;\n}\n\n.item{\n  display:flex;\n  gap:14px;\n  background:#fff;\n  border-radius:14px;\n  overflow:hidden;\n  border:1px solid #eee;\n}\n\n.item img{\n  width:110px;\n  height:110px;\n  object-fit:cover;\n}\n\n.item-info{\n  padding:10px 10px 10px 0;\n  flex:1;\n}\n\n.item-name{\n  font-weight:700;\n  margin:0 0 6px;\n}\n\n.item-desc{\n  font-size:14px;\n  color:#666;\n  margin-bottom:10px;\n}\n\n.price{\n  display:inline-block;\n  background:#111;\n  color:#fff;\n  padding:4px 8px;\n  border-radius:999px;\n  font-size:13px;\n}\n\n\n<\/style>\n<\/head>\n\n<body>\n\n<div class=\"wrap\">\n  <div class=\"menu-top\">\n    <img decoding=\"async\"\n      src=\"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-content\/uploads\/sites\/127\/2026\/05\/17778654403026.png\"\n      class=\"menu-logo\"\n      alt=\"logo\"\n    >\n  <\/div>\n\n  <div class=\"cats\" id=\"menuCategories\"><\/div>\n<\/div>\n\n<!-- PRODUCT MODAL (CSS COMES FROM YOUR EXISTING STYLES) -->\n<div class=\"modal\" id=\"menuModal\" aria-hidden=\"true\">\n  <div class=\"modal-sheet\">\n    <div class=\"modal-header\">\n      <div>\n        <strong id=\"modalCatName\"><\/strong><br>\n        <span id=\"modalCatSub\"><\/span>\n      <\/div>\n      <button id=\"closeModal\">\u2715<\/button>\n    <\/div>\n    <div class=\"modal-body\">\n      <div class=\"items\" id=\"itemsContainer\"><\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n\n  const modal = document.getElementById(\"menuModal\");\n  const itemsContainer = document.getElementById(\"itemsContainer\");\n  const catsWrap = document.getElementById(\"menuCategories\");\n\n  if (!modal || !itemsContainer || !catsWrap) return;\n\n  function closeProductModal(){\n    modal.classList.remove(\"is-open\");\n    modal.setAttribute(\"aria-hidden\", \"true\");\n    document.body.classList.remove(\"modal-open\");\n  }\n\n  document.getElementById(\"closeModal\")\n    ?.addEventListener(\"click\", closeProductModal);\n\n  modal.addEventListener(\"click\", (e) => {\n    if (e.target === modal) closeProductModal();\n  });\n\n  catsWrap.addEventListener(\"click\", (e) => {\n    const card = e.target.closest(\".cat-card\");\n    if (!card) return;\n\n    const key = card.dataset.category;\n    const cat = window.MENU_DATA?.[key];\n    if (!cat) return;\n\n    modal.classList.add(\"is-open\");\n    modal.setAttribute(\"aria-hidden\", \"false\");\n    document.body.classList.add(\"modal-open\");\n\n    document.getElementById(\"modalCatName\").textContent = cat.title || \"\";\n    document.getElementById(\"modalCatSub\").textContent = cat.sub || \"\";\n\n    itemsContainer.innerHTML = (cat.items || []).map(i => {\n      const prices = Array.isArray(i.prices)\n        ? i.prices\n        : (i.price ? [i.price] : []);\n\n      return `\n        <div class=\"item\">\n          <img decoding=\"async\" src=\"${i.img || \"\"}\" loading=\"lazy\" alt=\"\">\n          <div class=\"item-info\">\n            <p class=\"item-name\">${i.name || \"\"}<\/p>\n            ${i.desc ? `<div class=\"item-desc\">${i.desc}<\/div>` : ``}\n            <div class=\"item-meta\">\n              ${prices.map(p => `<div class=\"price\">${p}<\/div>`).join(\"\")}\n            <\/div>\n          <\/div>\n        <\/div>\n      `;\n    }).join(\"\");\n  });\n\n  window.addEventListener(\"keydown\", (e) => {\n    if (e.key === \"Escape\") closeProductModal();\n  });\n\n});\n\n\nwindow.MENU_DATA = {\n\n  haircuts: {\n  title: \"Professional   Haircut Service\",\n  sub: \"\",\n\n  cover: \"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-content\/uploads\/sites\/127\/2026\/05\/1778563396167605.png\",\n\n  items: [\n\n    {\n      name: \"Haircut\",\n      desc: \"\",\n      price: \"Ks 18,000 - 25,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1621605815971-fbc98d665033?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Hair Wash\",\n      desc: \"\",\n      price: \"Ks 9,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1521590832167-7bcbfaa6381f?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Styling\",\n      desc: \"\",\n      price: \"Ks 5,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1503951458645-643d53bfd90f?q=80&w=1200&auto=format&fit=crop\"\n    }\n\n  ]\n},\nbeard: {\n  title: \"Beard Services\",\n  sub: \"\",\n\n  cover: \"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-content\/uploads\/sites\/127\/2026\/05\/1778563518905081.png\",\n\n  items: [\n\n    {\n      name: \"Beard Trimming\",\n      desc: \"\",\n      price: \"Ks 12,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1622286342621-4bd786c2447c?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Hot Towel Shaving\",\n      desc: \"\",\n      price: \"Ks 12,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1519014816548-bf5fe059798b?q=80&w=1200&auto=format&fit=crop\"\n    }\n\n  ]\n},\n\npremium: {\n  title: \"Perming Services\",\n  sub: \" \",\n\n  cover: \"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-content\/uploads\/sites\/127\/2026\/05\/perming.jpg\",\n\n  items: [\n\n    {\n      name: \"Perming\",\n      desc: \"\",\n      price: \"Ks 65,000 - 75,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1521119989659-a83eee488004?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Ruffled\",\n      desc: \"\",\n      price: \"Ks 85,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1504593811423-6dd665756598?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Afro\",\n      desc: \"\",\n      price: \"Ks 90,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1521572267360-ee0c2909d518?q=80&w=1200&auto=format&fit=crop\"\n    }\n\n  ]\n},\n\ncoloring: {\n  title: \"Coloring Services\",\n  sub: \"\",\n\n  cover: \"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-content\/uploads\/sites\/127\/2026\/05\/coloring.jpg\",\n\n  items: [\n\n    {\n      name: \"Black Coloring\",\n      desc: \"\",\n      price: \"Ks 30,000 - 40,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1524504388940-b1c1722653e1?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Normal Coloring\",\n      desc: \"\",\n      price: \"Ks 50,000 - 60,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1519741497674-611481863552?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Highlights\",\n      desc: \"\",\n      price: \"Ks 80,000 - 90,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1529626455594-4ff0802cfb7e?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Crazy Coloring\",\n      desc: \"\",\n      price: \"Ks 90,000 - 100,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1487412720507-e7ab37603c6f?q=80&w=1200&auto=format&fit=crop\"\n    }\n\n  ]\n},\n\ngrooming: {\n  title: \"Groming Combos\",\n  sub: \"\",\n\n  cover: \"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-content\/uploads\/sites\/127\/2026\/05\/grooming.jpg\",\n\n  items: [\n\n    {\n      name: \"Grooming Combo(A)\",\n      desc: \"Haircut + Hair Wash + Styling\",\n      price: \"Ks 24,000 - 32,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1500648767791-00dcc994a43e?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Grooming Combo(B)\",\n      desc: \"Haircut + Hair Wash + Styling + Beard Shaving\",\n      price: \"Ks 30,000 - 40,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1506794778202-cad84cf45f1d?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Grooming Combo(C)\",\n      desc: \"Haircut + Black Coloring + Hair Wash + Styling\",\n      price: \"Ks 45,000 - 60,000\",\n      img: \"https:\/\/images.unsplash.com\/photo-1504257432389-52343af06ae3?q=80&w=1200&auto=format&fit=crop\"\n    }\n\n  ]\n},\n\nbraids: {\n  title: \"Other Services\",\n  sub: \"\",\n\n  cover: \"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-content\/uploads\/sites\/127\/2026\/05\/Other.jpg\",\n\n  items: [\n\n    {\n      name: \"Braids\",\n      desc: \"Prices may vary depending on the chosen style and design\",\n      price: \"Custom Pricing\",\n      img: \"https:\/\/images.unsplash.com\/photo-1517841905240-472988babdf9?q=80&w=1200&auto=format&fit=crop\"\n    },\n\n    {\n      name: \"Dreadlocks\",\n      desc: \"Prices may vary depending on the chosen style and design\",\n      price: \"Custom Pricing\",\n      img: \"https:\/\/images.unsplash.com\/photo-1515886657613-9f3515b0c78f?q=80&w=1200&auto=format&fit=crop\"\n    }\n\n  ]\n}\n};\n\n\n\n\/* ===== RENDER CATEGORY CARDS ===== *\/\n\nconst catsWrap = document.getElementById(\"menuCategories\");\n\nObject.entries(window.MENU_DATA).forEach(([key, cat]) => {\n\n  catsWrap.innerHTML += `\n    <div class=\"cat-card\" data-category=\"${key}\">\n      <img decoding=\"async\" src=\"${cat.cover}\" alt=\"\">\n      <div class=\"cat-overlay\">\n        <div>\n          <strong>${cat.title}<\/strong><br>\n          <small>${cat.sub}<\/small>\n        <\/div>\n      <\/div>\n    <\/div>\n  `;\n\n});\n<\/script>\n\n<\/body>\n<\/html>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Corner Station Bar \u2715<\/p>\n","protected":false},"author":56,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1054","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-json\/wp\/v2\/pages\/1054","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-json\/wp\/v2\/users\/56"}],"replies":[{"embeddable":true,"href":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-json\/wp\/v2\/comments?post=1054"}],"version-history":[{"count":41,"href":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-json\/wp\/v2\/pages\/1054\/revisions"}],"predecessor-version":[{"id":1517,"href":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-json\/wp\/v2\/pages\/1054\/revisions\/1517"}],"wp:attachment":[{"href":"https:\/\/mm2.ezyqrmenu.com\/culturebarbershop\/wp-json\/wp\/v2\/media?parent=1054"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}