{"id":1762,"date":"2026-08-22T05:12:02","date_gmt":"2026-08-22T05:12:02","guid":{"rendered":"https:\/\/demo.freshosoft.in\/bargach\/?page_id=1762"},"modified":"2026-08-23T06:37:06","modified_gmt":"2026-08-23T06:37:06","slug":"success-stories","status":"publish","type":"page","link":"https:\/\/demo.freshosoft.in\/bargach\/success-stories\/","title":{"rendered":"Success Stories"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1762\" class=\"elementor elementor-1762\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-99ddde5 e-con e-atomic-element e-flexbox-base e-10f316b \" data-id=\"99ddde5\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"99ddde5\">\n    \t\t<div class=\"elementor-element elementor-element-a083630 elementor-widget elementor-widget-html\" data-id=\"a083630\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     BARGACH \u00b7 STORIES OF CHANGE \u2013 LIGHT & COLORFUL\r\n     Modern slider with animated cards, gradient text,\r\n     floating counter badge, dot navigation, and auto-play.\r\n     Dark theme removed \u2014 now warm, airy & vibrant.\r\n     ============================================================ -->\r\n<style>\r\n  @import url('https:\/\/fonts.googleapis.com\/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,380;0,9..144,560;1,9..144,380&family=Inter:wght@300;400;500;600;700&display=swap');\r\n\r\n  .bgpr-stories-slider {\r\n    --ink: #1f2a26;\r\n    --teal: #166358;\r\n    --teal-2: #1a7a6b;\r\n    --mint: #f5f2eb;\r\n    --gold: #d48c3c;\r\n    --gold-2: #e8b86d;\r\n    --text-dark: #1f2a26;\r\n    --text-body: #4a5a52;\r\n    --text-muted: #8a9e93;\r\n    --hairline: rgba(26, 122, 107, 0.10);\r\n\r\n    --bgpr-serif: 'Fraunces', Georgia, 'Times New Roman', serif;\r\n    --bgpr-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\r\n\r\n    position: relative;\r\n    width: 100%;\r\n    background: var(--mint);\r\n    color: var(--text-dark);\r\n    font-family: var(--bgpr-sans);\r\n    padding: clamp(60px, 8vw, 100px) 0;\r\n    overflow: hidden;\r\n  }\r\n  .bgpr-stories-slider *,\r\n  .bgpr-stories-slider *::before,\r\n  .bgpr-stories-slider *::after {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  \/* ---------- background texture ---------- *\/\r\n  .bgpr-stories-slider .stories-bg {\r\n    position: absolute;\r\n    inset: 0;\r\n    z-index: 0;\r\n    background:\r\n      radial-gradient(ellipse at 5% 15%, rgba(212, 140, 60, 0.06) 0%, transparent 50%),\r\n      radial-gradient(ellipse at 95% 85%, rgba(26, 122, 107, 0.04) 0%, transparent 50%),\r\n      radial-gradient(ellipse at 50% 50%, rgba(22, 99, 88, 0.02) 0%, transparent 60%);\r\n    pointer-events: none;\r\n  }\r\n\r\n  .bgpr-stories-slider .stories-container {\r\n    position: relative;\r\n    z-index: 1;\r\n    max-width: 1200px;\r\n    margin: 0 auto;\r\n    padding: 0 clamp(22px, 4.5vw, 56px);\r\n  }\r\n\r\n  \/* ========== HEADER ========== *\/\r\n  .bgpr-stories-slider .stories-header {\r\n    text-align: center;\r\n    margin-bottom: clamp(40px, 5vw, 56px);\r\n  }\r\n  .bgpr-stories-slider .stories-tag {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    font-size: 11.5px;\r\n    font-weight: 600;\r\n    letter-spacing: 0.18em;\r\n    text-transform: uppercase;\r\n    color: var(--teal-2);\r\n    margin: 0 0 12px;\r\n  }\r\n  .bgpr-stories-slider .stories-tag::before,\r\n  .bgpr-stories-slider .stories-tag::after {\r\n    content: \"\";\r\n    width: 30px;\r\n    height: 1px;\r\n    background: var(--gold);\r\n    display: inline-block;\r\n  }\r\n  .bgpr-stories-slider .stories-header h2 {\r\n    font-family: var(--bgpr-serif);\r\n    font-weight: 380;\r\n    font-size: clamp(34px, 4.4vw, 58px);\r\n    line-height: 1.08;\r\n    margin: 0 0 12px;\r\n    color: var(--ink);\r\n  }\r\n  .bgpr-stories-slider .stories-header h2 .gradient-text {\r\n    background: linear-gradient(135deg, var(--teal-2), var(--gold));\r\n    -webkit-background-clip: text;\r\n    -webkit-text-fill-color: transparent;\r\n    background-clip: text;\r\n  }\r\n  .bgpr-stories-slider .stories-header .stories-sub {\r\n    font-size: clamp(15px, 1.2vw, 18px);\r\n    color: var(--text-body);\r\n    font-weight: 300;\r\n    max-width: 620px;\r\n    margin: 0 auto;\r\n    line-height: 1.6;\r\n  }\r\n\r\n  \/* ========== FLOATING COUNTER BADGE ========== *\/\r\n  .bgpr-stories-slider .counter-badge {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 12px;\r\n    background: rgba(255, 255, 255, 0.75);\r\n    backdrop-filter: blur(8px);\r\n    -webkit-backdrop-filter: blur(8px);\r\n    padding: 8px 20px 8px 16px;\r\n    border-radius: 999px;\r\n    border: 1px solid rgba(26, 122, 107, 0.06);\r\n    box-shadow: 0 4px 20px rgba(31, 42, 38, 0.04);\r\n    margin-bottom: 20px;\r\n    font-size: 13px;\r\n    color: var(--text-muted);\r\n  }\r\n  .bgpr-stories-slider .counter-badge .counter-num {\r\n    font-family: var(--bgpr-serif);\r\n    font-weight: 560;\r\n    font-size: 20px;\r\n    color: var(--teal-2);\r\n  }\r\n  .bgpr-stories-slider .counter-badge .counter-dot {\r\n    width: 4px;\r\n    height: 4px;\r\n    border-radius: 50%;\r\n    background: var(--gold);\r\n    display: inline-block;\r\n  }\r\n\r\n  \/* ========== SLIDER ========== *\/\r\n  .bgpr-stories-slider .slider-wrapper {\r\n    position: relative;\r\n    overflow: hidden;\r\n    border-radius: 20px;\r\n    margin-bottom: 30px;\r\n  }\r\n\r\n  .bgpr-stories-slider .slider-track {\r\n    display: flex;\r\n    transition: transform 0.7s cubic-bezier(0.65, 0, 0.35, 1);\r\n    will-change: transform;\r\n  }\r\n\r\n  \/* ========== STORY SLIDE ========== *\/\r\n  .bgpr-stories-slider .story-slide {\r\n    flex: 0 0 100%;\r\n    padding: 0 4px;\r\n  }\r\n\r\n  .bgpr-stories-slider .story-card {\r\n    background: rgba(255, 255, 255, 0.85);\r\n    backdrop-filter: blur(8px);\r\n    -webkit-backdrop-filter: blur(8px);\r\n    border-radius: 20px;\r\n    padding: clamp(30px, 4vw, 44px) clamp(28px, 3.5vw, 40px);\r\n    border: 1px solid rgba(26, 122, 107, 0.06);\r\n    box-shadow: 0 8px 30px rgba(31, 42, 38, 0.04);\r\n    transition: transform 0.4s cubic-bezier(.22, .68, .2, 1), box-shadow 0.4s ease;\r\n    position: relative;\r\n    min-height: 280px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n  }\r\n  .bgpr-stories-slider .story-card:hover {\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 20px 60px rgba(31, 42, 38, 0.08);\r\n    border-color: rgba(212, 140, 60, 0.12);\r\n  }\r\n\r\n  \/* story number badge *\/\r\n  .bgpr-stories-slider .story-card .story-number {\r\n    font-family: var(--bgpr-serif);\r\n    font-weight: 560;\r\n    font-size: clamp(14px, 1.2vw, 18px);\r\n    color: var(--gold);\r\n    letter-spacing: 0.04em;\r\n    margin-bottom: 12px;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n  }\r\n  .bgpr-stories-slider .story-card .story-number::after {\r\n    content: \"\";\r\n    flex: 1;\r\n    height: 1px;\r\n    background: var(--hairline);\r\n  }\r\n\r\n  \/* story name *\/\r\n  .bgpr-stories-slider .story-card .story-name {\r\n    font-family: var(--bgpr-serif);\r\n    font-weight: 560;\r\n    font-size: clamp(28px, 3vw, 42px);\r\n    color: var(--ink);\r\n    margin: 0 0 10px;\r\n    line-height: 1.1;\r\n  }\r\n  .bgpr-stories-slider .story-card .story-name .highlight {\r\n    color: var(--teal-2);\r\n  }\r\n\r\n  \/* story description *\/\r\n  .bgpr-stories-slider .story-card .story-desc {\r\n    font-size: clamp(15px, 1.1vw, 17px);\r\n    line-height: 1.7;\r\n    color: var(--text-body);\r\n    font-weight: 300;\r\n    margin: 0 0 18px;\r\n    max-width: 640px;\r\n  }\r\n  .bgpr-stories-slider .story-card .story-desc strong {\r\n    color: var(--teal-2);\r\n    font-weight: 500;\r\n  }\r\n\r\n  \/* story outcome badge *\/\r\n  .bgpr-stories-slider .story-card .story-outcome {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n    font-size: clamp(13px, 0.9vw, 14px);\r\n    font-weight: 500;\r\n    color: var(--teal-2);\r\n    background: rgba(212, 140, 60, 0.08);\r\n    border: 1px solid rgba(212, 140, 60, 0.12);\r\n    padding: 8px 20px;\r\n    border-radius: 999px;\r\n    align-self: flex-start;\r\n  }\r\n  .bgpr-stories-slider .story-card .story-outcome .outcome-icon {\r\n    font-size: 15px;\r\n  }\r\n\r\n  \/* ========== SLIDER CONTROLS ========== *\/\r\n  .bgpr-stories-slider .slider-controls {\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 20px;\r\n    margin-top: 8px;\r\n  }\r\n\r\n  \/* dots *\/\r\n  .bgpr-stories-slider .slider-dots {\r\n    display: flex;\r\n    gap: 10px;\r\n  }\r\n  .bgpr-stories-slider .slider-dots .dot {\r\n    width: 10px;\r\n    height: 10px;\r\n    border-radius: 50%;\r\n    background: rgba(26, 122, 107, 0.15);\r\n    border: none;\r\n    cursor: pointer;\r\n    transition: all 0.3s ease;\r\n    padding: 0;\r\n  }\r\n  .bgpr-stories-slider .slider-dots .dot.active {\r\n    background: var(--gold);\r\n    transform: scale(1.25);\r\n    box-shadow: 0 0 20px rgba(212, 140, 60, 0.3);\r\n  }\r\n  .bgpr-stories-slider .slider-dots .dot:hover {\r\n    background: rgba(26, 122, 107, 0.30);\r\n  }\r\n  .bgpr-stories-slider .slider-dots .dot.active:hover {\r\n    background: var(--gold);\r\n  }\r\n\r\n  \/* nav buttons *\/\r\n  .bgpr-stories-slider .slider-nav {\r\n    width: 44px;\r\n    height: 44px;\r\n    border-radius: 50%;\r\n    border: 1px solid var(--hairline);\r\n    background: rgba(255, 255, 255, 0.80);\r\n    backdrop-filter: blur(4px);\r\n    -webkit-backdrop-filter: blur(4px);\r\n    cursor: pointer;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    font-size: 20px;\r\n    color: var(--text-dark);\r\n    transition: all 0.3s ease;\r\n    box-shadow: 0 4px 12px rgba(31, 42, 38, 0.04);\r\n  }\r\n  .bgpr-stories-slider .slider-nav:hover {\r\n    background: var(--gold);\r\n    border-color: var(--gold);\r\n    color: var(--ink);\r\n    transform: scale(1.05);\r\n  }\r\n  .bgpr-stories-slider .slider-nav:disabled {\r\n    opacity: 0.3;\r\n    cursor: not-allowed;\r\n    transform: none;\r\n  }\r\n  .bgpr-stories-slider .slider-nav:disabled:hover {\r\n    background: rgba(255, 255, 255, 0.80);\r\n    border-color: var(--hairline);\r\n    color: var(--text-dark);\r\n  }\r\n\r\n  \/* ========== CTA BUTTON ========== *\/\r\n  .bgpr-stories-slider .stories-cta {\r\n    text-align: center;\r\n    margin-top: 32px;\r\n  }\r\n  .bgpr-stories-slider .stories-cta .btn-stories {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n    padding: 14px 36px;\r\n    background: var(--gold);\r\n    color: var(--ink);\r\n    border: none;\r\n    border-radius: 999px;\r\n    font-family: var(--bgpr-sans);\r\n    font-size: 15px;\r\n    font-weight: 600;\r\n    cursor: pointer;\r\n    text-decoration: none;\r\n    transition: all 0.3s ease;\r\n    box-shadow: 0 4px 20px rgba(212, 140, 60, 0.25);\r\n  }\r\n  .bgpr-stories-slider .stories-cta .btn-stories:hover {\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 8px 40px rgba(212, 140, 60, 0.35);\r\n  }\r\n  .bgpr-stories-slider .stories-cta .btn-stories .btn-arrow {\r\n    display: inline-block;\r\n    transition: transform 0.3s ease;\r\n  }\r\n  .bgpr-stories-slider .stories-cta .btn-stories:hover .btn-arrow {\r\n    transform: translateX(6px);\r\n  }\r\n\r\n  \/* ========== RESPONSIVE ========== *\/\r\n  @media (max-width: 768px) {\r\n    .bgpr-stories-slider .story-card {\r\n      padding: 24px 20px;\r\n      min-height: 240px;\r\n    }\r\n    .bgpr-stories-slider .story-card .story-name {\r\n      font-size: clamp(24px, 5vw, 32px);\r\n    }\r\n    .bgpr-stories-slider .story-card .story-desc {\r\n      font-size: 14px;\r\n    }\r\n    .bgpr-stories-slider .slider-nav {\r\n      width: 38px;\r\n      height: 38px;\r\n      font-size: 16px;\r\n    }\r\n  }\r\n\r\n  @media (max-width: 480px) {\r\n    .bgpr-stories-slider .stories-header h2 {\r\n      font-size: clamp(28px, 7vw, 38px);\r\n    }\r\n    .bgpr-stories-slider .story-card {\r\n      padding: 20px 16px;\r\n      min-height: 200px;\r\n    }\r\n    .bgpr-stories-slider .story-card .story-name {\r\n      font-size: clamp(20px, 5vw, 26px);\r\n    }\r\n    .bgpr-stories-slider .story-card .story-desc {\r\n      font-size: 13px;\r\n    }\r\n    .bgpr-stories-slider .story-card .story-outcome {\r\n      font-size: 12px;\r\n      padding: 6px 14px;\r\n    }\r\n    .bgpr-stories-slider .slider-controls {\r\n      gap: 12px;\r\n    }\r\n    .bgpr-stories-slider .slider-nav {\r\n      width: 34px;\r\n      height: 34px;\r\n      font-size: 14px;\r\n    }\r\n    .bgpr-stories-slider .slider-dots .dot {\r\n      width: 8px;\r\n      height: 8px;\r\n    }\r\n    .bgpr-stories-slider .counter-badge {\r\n      font-size: 12px;\r\n      padding: 6px 14px 6px 12px;\r\n    }\r\n    .bgpr-stories-slider .counter-badge .counter-num {\r\n      font-size: 17px;\r\n    }\r\n    .bgpr-stories-slider .stories-cta .btn-stories {\r\n      padding: 12px 28px;\r\n      font-size: 14px;\r\n    }\r\n  }\r\n\r\n  \/* Reduced Motion *\/\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .bgpr-stories-slider * {\r\n      transition-duration: 0.01ms !important;\r\n      animation-duration: 0.01ms !important;\r\n    }\r\n    .bgpr-stories-slider .slider-track {\r\n      transition: none !important;\r\n    }\r\n    .bgpr-stories-slider .story-card:hover {\r\n      transform: none !important;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<!-- ============================================================\r\n     STORIES OF CHANGE \u2013 SLIDER HTML (LIGHT & COLORFUL)\r\n     ============================================================ -->\r\n<section class=\"bgpr-stories-slider\" aria-label=\"Stories of Change\">\r\n  <div class=\"stories-bg\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"stories-container\">\r\n\r\n    <!-- Header with Counter Badge -->\r\n    <div class=\"stories-header\">\r\n      <div class=\"stories-tag\">People Behind the Numbers<\/div>\r\n\r\n      <!-- Floating Counter Badge -->\r\n      <div class=\"counter-badge\">\r\n        <span class=\"counter-num\">04<\/span>\r\n        <span class=\"counter-dot\"><\/span>\r\n        <span>Stories of Transformation<\/span>\r\n      <\/div>\r\n\r\n      <h2>\r\n        Change is measured in <span class=\"gradient-text\">lives<\/span>,<br>\r\n        not just numbers.\r\n      <\/h2>\r\n      <p class=\"stories-sub\">\r\n        Behind every programme is a person \u2014 a student finding confidence, a young person stepping into employment, or a community gaining access to essential resources.\r\n      <\/p>\r\n    <\/div>\r\n\r\n    <!-- Slider -->\r\n    <div class=\"slider-wrapper\">\r\n      <div class=\"slider-track\" id=\"storiesTrack\">\r\n\r\n        <!-- Slide 01 -->\r\n        <div class=\"story-slide\">\r\n          <div class=\"story-card\">\r\n            <div class=\"story-number\">01 \/ 04<\/div>\r\n            <h3 class=\"story-name\"><span class=\"highlight\">Annu<\/span> Shaw<\/h3>\r\n            <p class=\"story-desc\">\r\n              After completing her training, <strong>Annu Shaw<\/strong> secured employment at <strong>mPokket<\/strong>.\r\n              <br>\r\n              Her aspiration is to become financially stable while supporting the education of her sisters.\r\n            <\/p>\r\n            <div class=\"story-outcome\">\r\n              <span class=\"outcome-icon\">\ud83d\udcbc<\/span>\r\n              mPokket \u00b7 Financial Stability\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Slide 02 -->\r\n        <div class=\"story-slide\">\r\n          <div class=\"story-card\">\r\n            <div class=\"story-number\">02 \/ 04<\/div>\r\n            <h3 class=\"story-name\"><span class=\"highlight\">Kaushiki<\/span> Malik<\/h3>\r\n            <p class=\"story-desc\">\r\n              For <strong>Kaushiki Malik<\/strong>, the training became a turning point.\r\n              <br>\r\n              She successfully secured a position at <strong>HDB Financial Services<\/strong>, moving towards greater financial independence.\r\n            <\/p>\r\n            <div class=\"story-outcome\">\r\n              <span class=\"outcome-icon\">\ud83c\udfe6<\/span>\r\n              HDB Financial Services \u00b7 Independence\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Slide 03 -->\r\n        <div class=\"story-slide\">\r\n          <div class=\"story-card\">\r\n            <div class=\"story-number\">03 \/ 04<\/div>\r\n            <h3 class=\"story-name\"><span class=\"highlight\">Gouri Sankar<\/span> Chatterjee<\/h3>\r\n            <p class=\"story-desc\">\r\n              <strong>Gouri Sankar Chatterjee<\/strong> successfully joined <strong>Bandhan Bank<\/strong>.\r\n              <br>\r\n              His journey towards financial independence has also strengthened his motivation and confidence about his career.\r\n            <\/p>\r\n            <div class=\"story-outcome\">\r\n              <span class=\"outcome-icon\">\ud83c\udfdb\ufe0f<\/span>\r\n              Bandhan Bank \u00b7 Confidence &amp; Growth\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Slide 04 -->\r\n        <div class=\"story-slide\">\r\n          <div class=\"story-card\">\r\n            <div class=\"story-number\">04 \/ 04<\/div>\r\n            <h3 class=\"story-name\"><span class=\"highlight\">Moumita<\/span> Mondal<\/h3>\r\n            <p class=\"story-desc\">\r\n              <strong>Moumita Mondal<\/strong> joined <strong>HDB Financial Services<\/strong>.\r\n              <br>\r\n              For her, becoming financially independent has been an important milestone.\r\n            <\/p>\r\n            <div class=\"story-outcome\">\r\n              <span class=\"outcome-icon\">\ud83d\udcaa<\/span>\r\n              HDB Financial Services \u00b7 Milestone Achieved\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- Controls -->\r\n    <div class=\"slider-controls\">\r\n      <button class=\"slider-nav\" id=\"prevBtn\" aria-label=\"Previous\">\u2039<\/button>\r\n\r\n      <div class=\"slider-dots\" id=\"sliderDots\">\r\n        <button class=\"dot active\" data-index=\"0\" aria-label=\"Story 1\"><\/button>\r\n        <button class=\"dot\" data-index=\"1\" aria-label=\"Story 2\"><\/button>\r\n        <button class=\"dot\" data-index=\"2\" aria-label=\"Story 3\"><\/button>\r\n        <button class=\"dot\" data-index=\"3\" aria-label=\"Story 4\"><\/button>\r\n      <\/div>\r\n\r\n      <button class=\"slider-nav\" id=\"nextBtn\" aria-label=\"Next\">\u203a<\/button>\r\n    <\/div>\r\n\r\n    <!-- CTA Button -->\r\n    <div class=\"stories-cta\">\r\n      <a href=\"https:\/\/demo.freshosoft.in\/bargach\/success-stories\/\" class=\"btn-stories\">\r\n        Read More Stories <span class=\"btn-arrow\">\u2192<\/span>\r\n      <\/a>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- ============================================================\r\n     SLIDER SCRIPT\r\n     ============================================================ -->\r\n<script>\r\n  (function() {\r\n    var track = document.getElementById('storiesTrack');\r\n    var dots = document.querySelectorAll('#sliderDots .dot');\r\n    var prevBtn = document.getElementById('prevBtn');\r\n    var nextBtn = document.getElementById('nextBtn');\r\n    var slides = track.querySelectorAll('.story-slide');\r\n    var totalSlides = slides.length;\r\n    var currentIndex = 0;\r\n    var isAnimating = false;\r\n    var autoplayInterval = null;\r\n    var autoplayDelay = 5000;\r\n\r\n    function goToSlide(index) {\r\n      if (isAnimating || index === currentIndex) return;\r\n      if (index < 0) index = totalSlides - 1;\r\n      if (index >= totalSlides) index = 0;\r\n\r\n      isAnimating = true;\r\n      track.style.transform = 'translateX(-' + (index * 100) + '%)';\r\n\r\n      dots.forEach(function(dot, i) {\r\n        dot.classList.toggle('active', i === index);\r\n      });\r\n\r\n      currentIndex = index;\r\n\r\n      setTimeout(function() {\r\n        isAnimating = false;\r\n      }, 750);\r\n    }\r\n\r\n    \/\/ Dot click handlers\r\n    dots.forEach(function(dot) {\r\n      dot.addEventListener('click', function() {\r\n        var index = parseInt(this.getAttribute('data-index'));\r\n        goToSlide(index);\r\n        resetAutoplay();\r\n      });\r\n    });\r\n\r\n    \/\/ Nav buttons\r\n    prevBtn.addEventListener('click', function() {\r\n      goToSlide(currentIndex - 1);\r\n      resetAutoplay();\r\n    });\r\n\r\n    nextBtn.addEventListener('click', function() {\r\n      goToSlide(currentIndex + 1);\r\n      resetAutoplay();\r\n    });\r\n\r\n    \/\/ Keyboard navigation\r\n    document.addEventListener('keydown', function(e) {\r\n      var section = document.querySelector('.bgpr-stories-slider');\r\n      if (!section) return;\r\n      var rect = section.getBoundingClientRect();\r\n      if (e.key === 'ArrowLeft' && rect.top < window.innerHeight && rect.bottom > 0) {\r\n        e.preventDefault();\r\n        goToSlide(currentIndex - 1);\r\n        resetAutoplay();\r\n      } else if (e.key === 'ArrowRight' && rect.top < window.innerHeight && rect.bottom > 0) {\r\n        e.preventDefault();\r\n        goToSlide(currentIndex + 1);\r\n        resetAutoplay();\r\n      }\r\n    });\r\n\r\n    \/\/ Touch swipe\r\n    var touchStartX = 0;\r\n    var touchEndX = 0;\r\n    var sliderWrapper = document.querySelector('.bgpr-stories-slider .slider-wrapper');\r\n\r\n    sliderWrapper.addEventListener('touchstart', function(e) {\r\n      touchStartX = e.changedTouches[0].screenX;\r\n    }, { passive: true });\r\n\r\n    sliderWrapper.addEventListener('touchend', function(e) {\r\n      touchEndX = e.changedTouches[0].screenX;\r\n      var diff = touchStartX - touchEndX;\r\n      if (Math.abs(diff) > 50) {\r\n        if (diff > 0) {\r\n          goToSlide(currentIndex + 1);\r\n        } else {\r\n          goToSlide(currentIndex - 1);\r\n        }\r\n        resetAutoplay();\r\n      }\r\n    }, { passive: true });\r\n\r\n    \/\/ Autoplay\r\n    function startAutoplay() {\r\n      if (autoplayInterval) clearInterval(autoplayInterval);\r\n      autoplayInterval = setInterval(function() {\r\n        goToSlide(currentIndex + 1);\r\n      }, autoplayDelay);\r\n    }\r\n\r\n    function resetAutoplay() {\r\n      if (autoplayInterval) {\r\n        clearInterval(autoplayInterval);\r\n        startAutoplay();\r\n      }\r\n    }\r\n\r\n    \/\/ Start autoplay\r\n    startAutoplay();\r\n\r\n    \/\/ Pause on hover\r\n    sliderWrapper.addEventListener('mouseenter', function() {\r\n      if (autoplayInterval) {\r\n        clearInterval(autoplayInterval);\r\n        autoplayInterval = null;\r\n      }\r\n    });\r\n\r\n    sliderWrapper.addEventListener('mouseleave', function() {\r\n      startAutoplay();\r\n    });\r\n\r\n    \/\/ Expose API\r\n    window.bgprStoriesSlider = {\r\n      goTo: goToSlide,\r\n      next: function() { goToSlide(currentIndex + 1); },\r\n      prev: function() { goToSlide(currentIndex - 1); },\r\n      current: function() { return currentIndex; }\r\n    };\r\n\r\n  })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>People Behind the Numbers 04 Stories of Transformation Change is measured in lives, not just numbers. Behind every programme is a person \u2014 a student finding confidence, a young person stepping into employment, or a community gaining access to essential resources. 01 \/ 04 Annu Shaw After completing her training, Annu Shaw secured employment at [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-1762","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/pages\/1762","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/comments?post=1762"}],"version-history":[{"count":7,"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/pages\/1762\/revisions"}],"predecessor-version":[{"id":1949,"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/pages\/1762\/revisions\/1949"}],"wp:attachment":[{"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/media?parent=1762"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}