{"id":13472,"date":"2026-02-05T12:18:48","date_gmt":"2026-02-05T12:18:48","guid":{"rendered":"https:\/\/tamavadv.com\/prx\/?page_id=13472"},"modified":"2026-05-02T16:26:50","modified_gmt":"2026-05-02T16:26:50","slug":"before-afters","status":"publish","type":"page","link":"https:\/\/tamavadv.com\/prx\/before-afters\/","title":{"rendered":"Before &amp; Afters"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"13472\" class=\"elementor elementor-13472\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-317d3f9 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"317d3f9\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-dc447ba top column-style-top\" data-id=\"dc447ba\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-8a36cdf elementor-widget elementor-widget-html\" data-id=\"8a36cdf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\n  @import url('https:\/\/fonts.googleapis.com\/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;1,300&display=swap');\n  \n  #prx-gallery *, #prx-gallery *::before, #prx-gallery *::after { box-sizing: border-box; margin: 0; padding: 0; }\n  \n  #prx-gallery {\n    --brand: #6E2655;\n    --gold:  #C9A96E;\n    --dark:  #0f0a0d;\n    --dark2: #1a1018;\n    --cream: #F7F3EE;\n    --muted: rgba(247,243,238,0.5);\n    font-family: 'Poppins', sans-serif;\n    background: var(--dark);\n    color: var(--cream);\n    width: 100%;\n    overflow: hidden;\n  }\n  \n  \/* HERO *\/\n  #prx-gallery .pg-hero { background: var(--brand); padding: 3rem 2.5rem 2.5rem; position: relative; overflow: hidden; }\n  #prx-gallery .pg-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 60% at 90% 50%, rgba(201,169,110,0.18) 0%, transparent 60%), radial-gradient(ellipse 50% 80% at 10% 20%, rgba(0,0,0,0.3) 0%, transparent 70%); pointer-events: none; }\n  #prx-gallery .pg-hero-inner { position: relative; z-index: 1; max-width: 720px; }\n  #prx-gallery .pg-eyebrow { font-size: 0.65rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 0.75rem; display: flex; align-items: center; gap: 0.8rem; }\n  #prx-gallery .pg-eyebrow::before { content: ''; display: block; width: 32px; height: 1px; background: var(--gold); }\n  #prx-gallery .pg-hero h1 { font-size: clamp(1.8rem, 4vw, 2.8rem); font-weight: 300; line-height: 1.15; margin-bottom: 0.8rem; letter-spacing: -0.02em; color: #fff; }\n  #prx-gallery .pg-hero h1 strong { font-weight: 600; display: block; }\n  #prx-gallery .pg-hero p { font-size: 0.8rem; color: var(--muted); line-height: 1.7; font-weight: 300; max-width: 520px; }\n  #prx-gallery .pg-stats { display: flex; gap: 2.5rem; margin-top: 2rem; flex-wrap: wrap; }\n  #prx-gallery .pg-stat-num { font-size: 1.6rem; font-weight: 600; color: var(--gold); line-height: 1; }\n  #prx-gallery .pg-stat-label { font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); margin-top: 0.25rem; }\n  \n  \/* FILTERS *\/\n  #prx-gallery .pg-filters { background: var(--dark2); border-bottom: 1px solid rgba(110,38,85,0.3); padding: 1rem 2rem; display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; position: sticky; top: 0; z-index: 100; }\n  #prx-gallery .pg-filter-label { font-size: 0.62rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); font-weight: 500; margin-right: 0.4rem; white-space: nowrap; }\n  #prx-gallery .pg-filter-btn { background: transparent; border: 1px solid rgba(201,169,110,0.22); color: var(--muted); padding: 0.35rem 0.85rem; border-radius: 20px; font-family: 'Poppins', sans-serif; font-size: 0.64rem; font-weight: 500; letter-spacing: 0.05em; cursor: pointer; transition: all 0.2s; white-space: nowrap; }\n  #prx-gallery .pg-filter-btn:hover { border-color: var(--gold); color: var(--gold); }\n  #prx-gallery .pg-filter-btn.active { background: var(--brand); border-color: var(--brand); color: #fff; }\n  #prx-gallery .pg-count { margin-left: auto; font-size: 0.64rem; color: var(--muted); letter-spacing: 0.08em; white-space: nowrap; }\n  #prx-gallery .pg-count span { color: var(--gold); font-weight: 600; }\n  \n  \/* GRID *\/\n  #prx-gallery .pg-grid { padding: 2rem; columns: 3 270px; column-gap: 1rem; }\n  \n  \/* CARD *\/\n  #prx-gallery .pg-card { break-inside: avoid; margin-bottom: 1rem; border-radius: 6px; overflow: hidden; background: var(--dark2); border: 1px solid rgba(110,38,85,0.2); transition: transform 0.25s, box-shadow 0.25s; cursor: pointer; animation: pgFadeUp 0.45s ease both; }\n  @keyframes pgFadeUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }\n  #prx-gallery .pg-card:hover { transform: translateY(-3px); box-shadow: 0 16px 48px rgba(110,38,85,0.35); border-color: rgba(201,169,110,0.4); }\n  \n  \/* =====================================================\n     COMPARE SLIDER \u2014 clip-path approach\n     Both .img-before and .img-after are full-size,\n     absolutely stacked. We clip .img-before using\n     clip-path inset(0 X% 0 0) where X = 100 - sliderPos\n     No wrapper tricks, no width manipulation.\n  ===================================================== *\/\n  #prx-gallery .pg-compare {\n    position: relative;\n    width: 100%;\n    aspect-ratio: 4 \/ 5;\n    overflow: hidden;\n    user-select: none;\n    -webkit-user-select: none;\n    background: #111;\n    cursor: ew-resize;\n    display: block;\n  }\n  \n  #prx-gallery .pg-compare .img-after,\n  #prx-gallery .pg-compare .img-before {\n    position: absolute !important;\n    top: 0 !important; left: 0 !important;\n    width: 100% !important; height: 100% !important;\n    max-width: none !important; max-height: none !important;\n    object-fit: cover !important;\n    object-position: center top !important;\n    display: block !important;\n    pointer-events: none;\n    margin: 0 !important; padding: 0 !important;\n    border: none !important; box-shadow: none !important;\n  }\n  \n  \/* before sits on top, clipped from right by JS *\/\n  #prx-gallery .pg-compare .img-before {\n    z-index: 2;\n    clip-path: inset(0 50% 0 0); \/* updated by JS *\/\n  }\n  #prx-gallery .pg-compare .img-after {\n    z-index: 1;\n  }\n  \n  #prx-gallery .pg-compare .cmp-line {\n    position: absolute; top: 0; bottom: 0;\n    left: 50%; width: 2px;\n    background: rgba(255,255,255,0.88);\n    transform: translateX(-50%);\n    z-index: 4; pointer-events: none;\n    box-shadow: 0 0 8px rgba(0,0,0,0.5);\n  }\n  #prx-gallery .pg-compare .cmp-handle {\n    position: absolute; top: 50%; left: 50%;\n    transform: translate(-50%, -50%);\n    width: 40px; height: 40px; border-radius: 50%;\n    background: #fff; border: 2.5px solid #6E2655;\n    display: flex; align-items: center; justify-content: center;\n    z-index: 5; pointer-events: none;\n    box-shadow: 0 2px 12px rgba(0,0,0,0.45);\n  }\n  #prx-gallery .pg-compare .lbl-before,\n  #prx-gallery .pg-compare .lbl-after {\n    position: absolute; bottom: 0.6rem;\n    font-size: 0.55rem; font-weight: 700; letter-spacing: 0.18em;\n    text-transform: uppercase; padding: 0.18rem 0.5rem;\n    border-radius: 2px; z-index: 6; pointer-events: none;\n    font-family: 'Poppins', sans-serif;\n  }\n  #prx-gallery .pg-compare .lbl-before { left: 0.6rem; background: rgba(0,0,0,0.7); color: #fff; }\n  #prx-gallery .pg-compare .lbl-after  { right: 0.6rem; background: #6E2655; color: #fff; }\n  \n  \/* CARD FOOTER *\/\n  #prx-gallery .pg-card-footer { padding: 0.85rem 1rem 1rem; }\n  #prx-gallery .pg-card-tag { font-size: 0.57rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 0.3rem; }\n  #prx-gallery .pg-card-title { font-size: 0.8rem; font-weight: 500; color: var(--cream); line-height: 1.4; }\n  #prx-gallery .pg-card-note { font-size: 0.64rem; color: var(--muted); font-weight: 300; font-style: italic; line-height: 1.5; margin-top: 0.3rem; }\n  #prx-gallery .pg-expand-hint { display: inline-flex; align-items: center; gap: 0.35rem; margin-top: 0.65rem; font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(201,169,110,0.5); font-weight: 500; transition: color 0.2s; }\n  #prx-gallery .pg-card:hover .pg-expand-hint { color: var(--gold); }\n  \n  \/* LIGHTBOX *\/\n  #prx-lb { display: none; position: fixed; inset: 0; z-index: 99999; background: rgba(8,3,7,0.97); align-items: center; justify-content: center; }\n  #prx-lb.open { display: flex; animation: pgFadeIn 0.22s ease; }\n  @keyframes pgFadeIn { from { opacity: 0; } to { opacity: 1; } }\n  \n  #prx-lb .lb-inner {\n    font-family: 'Poppins', sans-serif; color: #F7F3EE;\n    width: min(94vw, 900px);\n    display: flex; flex-direction: column; gap: 1rem;\n    padding: 1.5rem;\n  }\n  #prx-lb .lb-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-shrink: 0; }\n  #prx-lb .lb-eyebrow { font-size: 0.58rem; letter-spacing: 0.22em; text-transform: uppercase; color: #C9A96E; font-weight: 600; margin-bottom: 0.25rem; }\n  #prx-lb .lb-title { font-size: 1rem; font-weight: 500; color: #F7F3EE; }\n  #prx-lb .lb-close { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(247,243,238,0.25); background: transparent; color: #F7F3EE; font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background 0.2s; flex-shrink: 0; }\n  #prx-lb .lb-close:hover { background: #6E2655; border-color: #6E2655; }\n  \n  \/* Lightbox compare uses the SAME clip-path technique *\/\n  #prx-lb .lb-compare {\n    position: relative;\n    width: 100%;\n    height: 60vh;\n    border-radius: 8px;\n    overflow: hidden;\n    background: #111;\n    cursor: ew-resize;\n    flex-shrink: 0;\n  }\n  \n  #prx-lb .lb-compare .img-after,\n  #prx-lb .lb-compare .img-before {\n    position: absolute !important;\n    top: 0 !important; left: 0 !important;\n    width: 100% !important; height: 100% !important;\n    max-width: none !important; max-height: none !important;\n    object-fit: contain !important;\n    object-position: center !important;\n    display: block !important;\n    pointer-events: none;\n    margin: 0 !important; padding: 0 !important;\n    border: none !important; box-shadow: none !important;\n  }\n  #prx-lb .lb-compare .img-before { z-index: 2; clip-path: inset(0 50% 0 0); }\n  #prx-lb .lb-compare .img-after  { z-index: 1; }\n  \n  #prx-lb .lb-compare .cmp-line { position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; background: rgba(255,255,255,0.88); transform: translateX(-50%); z-index: 4; pointer-events: none; }\n  #prx-lb .lb-compare .cmp-handle { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 50px; height: 50px; border-radius: 50%; background: #fff; border: 3px solid #6E2655; display: flex; align-items: center; justify-content: center; z-index: 5; pointer-events: none; box-shadow: 0 4px 20px rgba(0,0,0,0.6); }\n  #prx-lb .lb-compare .lbl-before,\n  #prx-lb .lb-compare .lbl-after { position: absolute; bottom: 1rem; font-size: 0.62rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; padding: 0.25rem 0.7rem; border-radius: 2px; z-index: 6; pointer-events: none; font-family: 'Poppins', sans-serif; }\n  #prx-lb .lb-compare .lbl-before { left: 1rem; background: rgba(0,0,0,0.75); color: #fff; }\n  #prx-lb .lb-compare .lbl-after  { right: 1rem; background: #6E2655; color: #fff; }\n  \n  #prx-lb .lb-note { font-size: 0.68rem; color: rgba(247,243,238,0.5); font-style: italic; font-weight: 300; text-align: center; line-height: 1.6; flex-shrink: 0; }\n  #prx-lb .lb-nav { display: flex; align-items: center; justify-content: center; gap: 1rem; flex-shrink: 0; }\n  #prx-lb .lb-nav-btn { background: rgba(110,38,85,0.35); border: 1px solid rgba(110,38,85,0.6); color: #F7F3EE; padding: 0.5rem 1.5rem; border-radius: 3px; font-family: 'Poppins', sans-serif; font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 500; cursor: pointer; transition: background 0.2s; }\n  #prx-lb .lb-nav-btn:hover { background: #6E2655; border-color: #6E2655; }\n  #prx-lb .lb-nav-counter { font-size: 0.75rem; color: rgba(247,243,238,0.5); min-width: 64px; text-align: center; }\n  \n  \/* DISCLAIMER *\/\n  #prx-gallery .pg-disclaimer { padding: 1.5rem 2rem; border-top: 1px solid rgba(110,38,85,0.2); font-size: 0.63rem; color: var(--muted); font-style: italic; font-weight: 300; line-height: 1.7; text-align: center; }\n  \n  \/* RESPONSIVE *\/\n  @media (max-width: 600px) {\n    #prx-gallery .pg-grid { padding: 1rem; columns: 1; }\n    #prx-gallery .pg-hero { padding: 2rem 1.2rem 1.8rem; }\n    #prx-gallery .pg-filters { padding: 0.8rem 1rem; }\n    #prx-gallery .pg-compare { aspect-ratio: 1 \/ 1; }\n    #prx-lb .lb-compare { height: 50vw; }\n  }\n  @media (min-width: 601px) and (max-width: 960px) { #prx-gallery .pg-grid { columns: 2 240px; } }\n  <\/style>\n  \n  <!-- HTML -->\n  <div id=\"prx-gallery\">\n    <div class=\"pg-hero\">\n      <div class=\"pg-hero-inner\">\n        <div class=\"pg-eyebrow\">Clinical Results &middot; PRX-Plus\u00ae<\/div>\n        <h1>Real Results.<br><strong>Visible Transformation.<\/strong><\/h1>\n        <p>Drag the slider on each image to reveal the before and after. All cases treated exclusively with PRX-Plus\u00ae by NAOS. Individual results may vary.<\/p>\n        <div class=\"pg-stats\">\n          <div><div class=\"pg-stat-num\">46<\/div><div class=\"pg-stat-label\">Clinical Cases<\/div><\/div>\n          <div><div class=\"pg-stat-num\">6<\/div><div class=\"pg-stat-label\">Treatment Categories<\/div><\/div>\n          <div><div class=\"pg-stat-num\">0<\/div><div class=\"pg-stat-label\">Downtime<\/div><\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  \n    <div class=\"pg-filters\" id=\"pgFilters\">\n      <span class=\"pg-filter-label\">Category<\/span>\n      <button class=\"pg-filter-btn active\" data-filter=\"all\">All (46)<\/button>\n      <button class=\"pg-filter-btn\" data-filter=\"injectables\">Injectables (3)<\/button>\n      <button class=\"pg-filter-btn\" data-filter=\"laser\">Laser (2)<\/button>\n      <button class=\"pg-filter-btn\" data-filter=\"microneedling\">Microneedling (5)<\/button>\n      <button class=\"pg-filter-btn\" data-filter=\"pigmentation\">Pigmentation (15)<\/button>\n      <button class=\"pg-filter-btn\" data-filter=\"signs\">Aging and Firmness (15)<\/button>\n      <button class=\"pg-filter-btn\" data-filter=\"pores\">Texture and Glow (6)<\/button>\n      <span class=\"pg-count\" id=\"pgCount\"><span>46<\/span> results<\/span>\n    <\/div>\n  \n    <div class=\"pg-grid\" id=\"pgGrid\"><\/div>\n  \n    <div class=\"pg-disclaimer\">\n      All images show actual patients treated with PRX-Plus\u00ae by NAOS. Results are individual and may vary.\n      Treatments performed by certified professionals only. Consult a qualified specialist before proceeding.\n    <\/div>\n  <\/div>\n  \n  <!-- LIGHTBOX -->\n  <div id=\"prx-lb\">\n    <div class=\"lb-inner\">\n      <div class=\"lb-header\">\n        <div>\n          <div class=\"lb-eyebrow\" id=\"lbEyebrow\">PRX-Plus\u00ae &middot; Before and After<\/div>\n          <div class=\"lb-title\"   id=\"lbTitle\"><\/div>\n        <\/div>\n        <button class=\"lb-close\" id=\"lbClose\">X<\/button>\n      <\/div>\n  \n      <div class=\"lb-compare\" id=\"lbCompare\">\n        <img decoding=\"async\" class=\"img-after\"  id=\"lbAfterImg\"  src=\"\" alt=\"After\">\n        <img decoding=\"async\" class=\"img-before\" id=\"lbBeforeImg\" src=\"\" alt=\"Before\">\n        <div class=\"cmp-line\"   id=\"lbLine\"><\/div>\n        <div class=\"cmp-handle\" id=\"lbHandle\">\n          <svg width=\"22\" height=\"22\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#6E2655\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <path d=\"M8 5l-5 7 5 7M16 5l5 7-5 7\"><\/path>\n          <\/svg>\n        <\/div>\n        <div class=\"lbl-before\">Before<\/div>\n        <div class=\"lbl-after\">After<\/div>\n      <\/div>\n  \n      <div class=\"lb-note\" id=\"lbNote\"><\/div>\n      <div class=\"lb-nav\">\n        <button class=\"lb-nav-btn\" id=\"lbPrev\">Prev<\/button>\n        <span   class=\"lb-nav-counter\" id=\"lbCounter\"><\/span>\n        <button class=\"lb-nav-btn\" id=\"lbNext\">Next<\/button>\n      <\/div>\n    <\/div>\n  <\/div>\n  \n  <script>\n  (function () {\n  \n    var BASE = 'https:\/\/tamavadv.com\/prx\/wp-content\/uploads\/prx-plus\/';\n  \n    function pad(n) { return n < 10 ? '0' + n : String(n); }\n  \n    function makeCases(slug, count, label, titles, note) {\n      var result = [], i, idx;\n      for (i = 1; i <= count; i++) {\n        idx = (i - 1) % titles.length;\n        result.push({\n          filter: slug,\n          label:  label,\n          title:  titles[idx],\n          note:   note,\n          before: BASE + 'Pic_' + pad(i) + '_' + slug + '_before.jpg',\n          after:  BASE + 'Pic_' + pad(i) + '_' + slug + '_after.jpg'\n        });\n      }\n      return result;\n    }\n  \n    var CASES = [].concat(\n      makeCases('injectables', 3, 'Combination - Injectables',\n        ['PRX-Plus\u00ae + Injectables', 'Combined Injectable Protocol', 'Injectables Combination'],\n        'PRX-Plus\u00ae combined with injectables. Actual patient. Individual results may vary.'\n      ),\n      makeCases('laser', 2, 'Combination - Laser',\n        ['PRX-Plus\u00ae + Laser', 'Laser Combination Protocol'],\n        'PRX-Plus\u00ae combined with laser treatment. Actual patient. Individual results may vary.'\n      ),\n      makeCases('microneedling', 5, 'Combination - Microneedling',\n        ['PRX-Plus\u00ae + Microneedling', 'Microneedling Protocol', 'Combined Microneedling', 'Microneedling Treatment', 'Combination Protocol'],\n        'PRX-Plus\u00ae combined with microneedling. Actual patient. Individual results may vary.'\n      ),\n      makeCases('pigmentation', 15, 'Pigmentation and Lightening',\n        ['Pigmentation Correction', 'Uneven Skin Tone', 'Dark Spot Reduction',\n         'Melasma Treatment', 'Sun Damage Repair', 'Post-Inflammatory Hyperpigmentation',\n         'Lightening and Brightening', 'Tone Correction', 'Pigmentation Lightening'],\n        'PRX-Plus\u00ae for pigmentation and lightening. Actual patient. Individual results may vary.'\n      ),\n      makeCases('signs', 15, 'Signs of Aging - Firmness - Wrinkles',\n        ['Anti-Aging and Firming', 'Wrinkle Reduction', 'Skin Lifting Effect',\n         'Fine Lines Treatment', 'Elasticity Restoration', 'Firmness and Tightening',\n         'Age Reversal Protocol', 'Deep Wrinkle Treatment', 'Facial Firmness'],\n        'PRX-Plus\u00ae for signs of aging, firmness and wrinkles. Actual patient. Individual results may vary.'\n      ),\n      makeCases('pores', 6, 'Texture - Pores - Brightening and Glow',\n        ['Texture and Pore Refinement', 'Even Skin Tone', 'Radiance and Glow',\n         'Skin Brightening', 'Pore Minimizing', 'Luminosity Boost'],\n        'PRX-Plus\u00ae for texture, pores and brightening. Actual patient. Individual results may vary.'\n      )\n    );\n  \n    var activeFilter = 'all';\n    var lbIndex      = 0;\n    var visible      = CASES.slice();\n  \n    \/* =====================================================\n       SLIDER \u2014 clip-path on the before image\n       pos: 0\u2013100 (percentage from left where divider sits)\n       clip-path: inset(0 RIGHT% 0 0) where RIGHT = 100 - pos\n    ===================================================== *\/\n    function initSlider(container) {\n      var imgBefore = container.querySelector('.img-before');\n      var line      = container.querySelector('.cmp-line');\n      var handle    = container.querySelector('.cmp-handle');\n      var down      = false;\n  \n      function setPos(pos) {\n        pos = Math.max(1, Math.min(99, pos));\n        var right = (100 - pos).toFixed(2);\n        imgBefore.style.clipPath = 'inset(0 ' + right + '% 0 0)';\n        line.style.left          = pos + '%';\n        handle.style.left        = pos + '%';\n      }\n  \n      function posFromEvent(e) {\n        var r = container.getBoundingClientRect();\n        var clientX = e.touches ? e.touches[0].clientX : e.clientX;\n        return ((clientX - r.left) \/ r.width) * 100;\n      }\n  \n      container.addEventListener('mousedown', function (e) {\n        down = true;\n        setPos(posFromEvent(e));\n        e.preventDefault();\n      });\n      container.addEventListener('touchstart', function (e) {\n        down = true;\n        setPos(posFromEvent(e));\n      }, { passive: true });\n  \n      window.addEventListener('mousemove', function (e) {\n        if (down) { setPos(posFromEvent(e)); }\n      });\n      window.addEventListener('touchmove', function (e) {\n        if (down) { setPos(posFromEvent(e)); }\n      }, { passive: true });\n      window.addEventListener('mouseup',  function () { down = false; });\n      window.addEventListener('touchend', function () { down = false; });\n  \n      setPos(50);\n      return { setPos: setPos };\n    }\n  \n    \/* =====================================================\n       BUILD GRID\n    ===================================================== *\/\n    function buildGrid() {\n      var grid = document.getElementById('pgGrid');\n      var i, c, card, delay;\n      grid.innerHTML = '';\n      visible = (activeFilter === 'all')\n        ? CASES\n        : CASES.filter(function (c) { return c.filter === activeFilter; });\n  \n      document.getElementById('pgCount').innerHTML =\n        '<span>' + visible.length + '<\/span> result' + (visible.length !== 1 ? 's' : '');\n  \n      for (i = 0; i < visible.length; i++) {\n        c     = visible[i];\n        delay = Math.min(i * 0.04, 0.5);\n        card  = document.createElement('div');\n        card.className = 'pg-card';\n        card.style.animationDelay = delay + 's';\n  \n        card.innerHTML = [\n          '<div class=\"pg-compare\">',\n            '<img decoding=\"async\" class=\"img-after\"  src=\"', c.after,  '\" alt=\"After\">',\n            '<img decoding=\"async\" class=\"img-before\" src=\"', c.before, '\" alt=\"Before\">',\n            '<div class=\"cmp-line\"><\/div>',\n            '<div class=\"cmp-handle\">',\n              '<svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#6E2655\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">',\n                '<path d=\"M8 5l-5 7 5 7M16 5l5 7-5 7\"><\/path>',\n              '<\/svg>',\n            '<\/div>',\n            '<div class=\"lbl-before\">Before<\/div>',\n            '<div class=\"lbl-after\">After<\/div>',\n          '<\/div>',\n          '<div class=\"pg-card-footer\">',\n            '<div class=\"pg-card-tag\">',   c.label, '<\/div>',\n            '<div class=\"pg-card-title\">', c.title, '<\/div>',\n            '<div class=\"pg-card-note\">',  c.note,  '<\/div>',\n            '<div class=\"pg-expand-hint\">Tap to expand<\/div>',\n          '<\/div>'\n        ].join('');\n  \n        initSlider(card.querySelector('.pg-compare'));\n        attachOpen(card, i);\n        grid.appendChild(card);\n      }\n    }\n  \n    function attachOpen(card, idx) {\n      var cmp = card.querySelector('.pg-compare');\n      var startX;\n      cmp.addEventListener('mousedown', function (e) { startX = e.clientX; });\n      cmp.addEventListener('mouseup',   function (e) {\n        if (Math.abs(e.clientX - startX) < 6) { openLb(idx); }\n      });\n      cmp.addEventListener('touchend', function (e) {\n        if (e.cancelable) { e.preventDefault(); }\n        openLb(idx);\n      }, { passive: false });\n    }\n  \n    \/* FILTERS *\/\n    document.querySelectorAll('#pgFilters .pg-filter-btn').forEach(function (btn) {\n      btn.addEventListener('click', function () {\n        document.querySelectorAll('#pgFilters .pg-filter-btn').forEach(function (b) { b.classList.remove('active'); });\n        btn.classList.add('active');\n        activeFilter = btn.dataset.filter;\n        buildGrid();\n      });\n    });\n  \n    \/* =====================================================\n       LIGHTBOX\n    ===================================================== *\/\n    var lb       = document.getElementById('prx-lb');\n    var lbCmp    = document.getElementById('lbCompare');\n    var lbAI     = document.getElementById('lbAfterImg');\n    var lbBI     = document.getElementById('lbBeforeImg');\n    var lbSlider = initSlider(lbCmp);\n  \n    function loadLb() {\n      var c = visible[lbIndex];\n      if (!c) { return; }\n      lbAI.src = c.after;\n      lbBI.src = c.before;\n      lbSlider.setPos(50);\n      document.getElementById('lbEyebrow').textContent = c.label + ' - PRX-Plus\u00ae';\n      document.getElementById('lbTitle').textContent   = c.title;\n      document.getElementById('lbNote').textContent    = c.note;\n      document.getElementById('lbCounter').textContent = (lbIndex + 1) + ' \/ ' + visible.length;\n    }\n  \n    function openLb(idx) {\n      lbIndex = idx;\n      loadLb();\n      lb.classList.add('open');\n      document.body.style.overflow = 'hidden';\n    }\n  \n    function closeLb() {\n      lb.classList.remove('open');\n      document.body.style.overflow = '';\n    }\n  \n    document.getElementById('lbClose').addEventListener('click', closeLb);\n    lb.addEventListener('click', function (e) { if (e.target === lb) { closeLb(); } });\n  \n    document.getElementById('lbPrev').addEventListener('click', function () {\n      lbIndex = (lbIndex - 1 + visible.length) % visible.length;\n      loadLb();\n    });\n    document.getElementById('lbNext').addEventListener('click', function () {\n      lbIndex = (lbIndex + 1) % visible.length;\n      loadLb();\n    });\n  \n    document.addEventListener('keydown', function (e) {\n      if (!lb.classList.contains('open')) { return; }\n      if (e.key === 'Escape')     { closeLb(); }\n      if (e.key === 'ArrowLeft')  { lbIndex = (lbIndex - 1 + visible.length) % visible.length; loadLb(); }\n      if (e.key === 'ArrowRight') { lbIndex = (lbIndex + 1) % visible.length; loadLb(); }\n    });\n  \n    buildGrid();\n  \n  }());\n  <\/script>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Clinical Results &middot; PRX-Plus\u00ae Real Results.Visible Transformation. Drag the slider on each image to reveal the before and after. All cases treated exclusively with PRX-Plus\u00ae by NAOS. Individual results may [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-13472","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tamavadv.com\/prx\/wp-json\/wp\/v2\/pages\/13472","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tamavadv.com\/prx\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tamavadv.com\/prx\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tamavadv.com\/prx\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tamavadv.com\/prx\/wp-json\/wp\/v2\/comments?post=13472"}],"version-history":[{"count":19,"href":"https:\/\/tamavadv.com\/prx\/wp-json\/wp\/v2\/pages\/13472\/revisions"}],"predecessor-version":[{"id":14270,"href":"https:\/\/tamavadv.com\/prx\/wp-json\/wp\/v2\/pages\/13472\/revisions\/14270"}],"wp:attachment":[{"href":"https:\/\/tamavadv.com\/prx\/wp-json\/wp\/v2\/media?parent=13472"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}