{"id":1620,"date":"2026-08-21T16:46:19","date_gmt":"2026-08-21T16:46:19","guid":{"rendered":"https:\/\/demo.freshosoft.in\/bargach\/?page_id=1620"},"modified":"2026-08-21T16:46:46","modified_gmt":"2026-08-21T16:46:46","slug":"water-wash","status":"publish","type":"page","link":"https:\/\/demo.freshosoft.in\/bargach\/water-wash\/","title":{"rendered":"Water &amp; Wash"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1620\" class=\"elementor elementor-1620\" 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 WATER & WASH \u2013 PROGRAM PAGE\r\n     Clean, modern design with hero slider, impact strip,\r\n     and final call-to-action. Light colorful theme.\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  .bargach-wash {\r\n    --coral: #e07a5f;\r\n    --coral-light: #f0a38c;\r\n    --gold: #d48c3c;\r\n    --gold-2: #e8b86d;\r\n    --teal: #2a9d8f;\r\n    --teal-2: #1a7a6b;\r\n    --text-dark: #1f2a26;\r\n    --text-body: #3d534a;\r\n    --text-muted: #6a8a7a;\r\n    --text-muted-light: #8a9e93;\r\n    --bg-light: #f8f4ed;\r\n    --bg-card: rgba(255, 255, 255, 0.82);\r\n    --hairline: rgba(26, 122, 107, 0.08);\r\n    --serif: 'Fraunces', Georgia, 'Times New Roman', serif;\r\n    --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\r\n\r\n    position: relative;\r\n    width: 100%;\r\n    padding: clamp(40px, 5vw, 60px) 0;\r\n    background: var(--bg-light);\r\n    font-family: var(--sans);\r\n    color: var(--text-dark);\r\n    overflow: hidden;\r\n  }\r\n  .bargach-wash * { box-sizing: border-box; }\r\n\r\n  .bargach-wash .ws-bg {\r\n    position: absolute; inset: 0; z-index: 0;\r\n    background:\r\n      radial-gradient(ellipse at 10% 20%, rgba(212,140,60,0.04) 0%, transparent 50%),\r\n      radial-gradient(ellipse at 90% 80%, rgba(42,157,143,0.03) 0%, transparent 50%);\r\n    pointer-events: none;\r\n  }\r\n  .bargach-wash .ws-glow {\r\n    position: absolute; z-index: 1; pointer-events: none;\r\n    width: 50vw; height: 50vw; max-width: 500px;\r\n    top: -10%; right: -5%;\r\n    background: radial-gradient(circle, rgba(212,140,60,0.04) 0%, rgba(212,140,60,0.01) 40%, transparent 70%);\r\n    filter: blur(60px);\r\n  }\r\n\r\n  .bargach-wash .ws-container {\r\n    position: relative; z-index: 2;\r\n    max-width: 1100px; margin: 0 auto;\r\n    padding: 0 clamp(22px, 4.5vw, 56px);\r\n  }\r\n\r\n  \/* ========== DIVIDER ========== *\/\r\n  .bargach-wash .ws-divider {\r\n    display: flex; align-items: center; gap: 16px;\r\n    margin: clamp(40px, 5vw, 60px) 0 clamp(28px, 3vw, 40px);\r\n  }\r\n  .bargach-wash .ws-divider .line {\r\n    flex: 1; height: 1px; max-width: 80px;\r\n    background: linear-gradient(90deg, var(--coral), transparent);\r\n  }\r\n  .bargach-wash .ws-divider .diamond {\r\n    width: 8px; height: 8px; background: var(--coral);\r\n    transform: rotate(45deg); flex-shrink: 0; opacity: 0.4;\r\n  }\r\n\r\n  \/* ========== SECTION HEADER ========== *\/\r\n  .bargach-wash .ws-header {\r\n    text-align: center;\r\n    margin-bottom: clamp(32px, 4vw, 48px);\r\n    max-width: 760px;\r\n    margin-left: auto;\r\n    margin-right: auto;\r\n  }\r\n  .bargach-wash .ws-tag {\r\n    display: inline-flex; align-items: center; gap: 10px;\r\n    font-size: 11.5px; font-weight: 600; letter-spacing: 0.18em;\r\n    text-transform: uppercase; color: var(--coral); margin: 0 0 8px;\r\n  }\r\n  .bargach-wash .ws-tag::before,\r\n  .bargach-wash .ws-tag::after {\r\n    content: \"\"; width: 26px; height: 1px; background: var(--coral); display: inline-block;\r\n  }\r\n  .bargach-wash .ws-heading {\r\n    font-family: var(--serif); font-weight: 380;\r\n    font-size: clamp(28px, 3.5vw, 44px); line-height: 1.08;\r\n    margin: 0; color: var(--text-dark);\r\n  }\r\n  .bargach-wash .ws-heading .highlight {\r\n    background: linear-gradient(135deg, var(--coral), var(--gold));\r\n    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;\r\n  }\r\n  .bargach-wash .ws-sub {\r\n    font-size: clamp(15px, 1.1vw, 17px); line-height: 1.7;\r\n    color: var(--text-body); font-weight: 300; margin: 10px 0 0;\r\n  }\r\n\r\n  \/* ========== HERO ========== *\/\r\n  .bargach-wash .ws-hero {\r\n    text-align: center;\r\n    padding: clamp(10px, 1.5vw, 20px) 0 clamp(20px, 2.5vw, 32px);\r\n  }\r\n  .bargach-wash .ws-hero .ws-hero-badge {\r\n    font-size: 11px; font-weight: 600; letter-spacing: 0.12em;\r\n    text-transform: uppercase; color: var(--coral); margin: 0 0 8px;\r\n  }\r\n  .bargach-wash .ws-hero .ws-hero-headline {\r\n    font-family: var(--serif); font-weight: 560;\r\n    font-size: clamp(32px, 4.5vw, 58px);\r\n    color: var(--text-dark); margin: 0 0 14px; line-height: 1.08;\r\n  }\r\n  .bargach-wash .ws-hero .ws-hero-headline .highlight {\r\n    color: var(--coral);\r\n  }\r\n  .bargach-wash .ws-hero .ws-hero-text {\r\n    font-size: clamp(16px, 1.2vw, 19px); line-height: 1.7;\r\n    color: var(--text-body); font-weight: 300; max-width: 620px;\r\n    margin: 0 auto 24px;\r\n  }\r\n\r\n  \/* ========== SLIDER ========== *\/\r\n  .bargach-wash .ws-slider {\r\n    position: relative;\r\n    border-radius: 20px;\r\n    overflow: hidden;\r\n    margin: 0 auto 24px;\r\n    max-width: 800px;\r\n    box-shadow: 0 8px 30px rgba(31,42,38,0.06);\r\n    border: 1px solid var(--hairline);\r\n    background: var(--bg-card);\r\n  }\r\n  .bargach-wash .ws-slider .ws-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  .bargach-wash .ws-slider .ws-slide {\r\n    flex: 0 0 100%;\r\n    display: grid;\r\n    grid-template-columns: 1fr 0.9fr;\r\n    min-height: 280px;\r\n  }\r\n  @media (max-width: 768px) {\r\n    .bargach-wash .ws-slider .ws-slide {\r\n      grid-template-columns: 1fr;\r\n      min-height: auto;\r\n    }\r\n  }\r\n  .bargach-wash .ws-slider .ws-slide .ws-slide-image {\r\n    width: 100%; min-height: 240px;\r\n    overflow: hidden; position: relative;\r\n  }\r\n  .bargach-wash .ws-slider .ws-slide .ws-slide-image img {\r\n    width: 100%; height: 100%; min-height: 240px;\r\n    object-fit: cover; display: block;\r\n  }\r\n  .bargach-wash .ws-slider .ws-slide .ws-slide-image .ws-slide-number {\r\n    position: absolute; top: 14px; left: 14px;\r\n    background: rgba(255,255,255,0.88); backdrop-filter: blur(4px);\r\n    padding: 3px 14px; border-radius: 999px;\r\n    font-size: 9px; font-weight: 600; text-transform: uppercase;\r\n    letter-spacing: 0.08em; color: var(--coral);\r\n    border: 1px solid rgba(224,122,95,0.08);\r\n  }\r\n  .bargach-wash .ws-slider .ws-slide .ws-slide-content {\r\n    padding: clamp(24px, 3vw, 38px) clamp(20px, 2.5vw, 32px);\r\n    display: flex; flex-direction: column; justify-content: center;\r\n    background: rgba(255,255,255,0.40);\r\n    backdrop-filter: blur(8px);\r\n    -webkit-backdrop-filter: blur(8px);\r\n  }\r\n  .bargach-wash .ws-slider .ws-slide .ws-slide-content .ws-slide-headline {\r\n    font-family: var(--serif); font-weight: 560;\r\n    font-size: clamp(22px, 2.6vw, 34px);\r\n    color: var(--text-dark); margin: 0 0 8px; line-height: 1.1;\r\n  }\r\n  .bargach-wash .ws-slider .ws-slide .ws-slide-content .ws-slide-headline .highlight {\r\n    color: var(--coral);\r\n  }\r\n  .bargach-wash .ws-slider .ws-slide .ws-slide-content .ws-slide-desc {\r\n    font-size: clamp(14px, 1vw, 16px); line-height: 1.7;\r\n    color: var(--text-body); font-weight: 300; margin: 0;\r\n    max-width: 440px;\r\n  }\r\n\r\n  \/* Slider Controls *\/\r\n  .bargach-wash .ws-slider .ws-controls {\r\n    display: flex; align-items: center; justify-content: center;\r\n    gap: 14px; padding: 12px 16px 16px;\r\n    background: rgba(255,255,255,0.35);\r\n    backdrop-filter: blur(4px);\r\n    border-top: 1px solid var(--hairline);\r\n  }\r\n  .bargach-wash .ws-slider .ws-controls .ws-dots {\r\n    display: flex; gap: 8px;\r\n  }\r\n  .bargach-wash .ws-slider .ws-controls .ws-dots .dot {\r\n    width: 10px; height: 10px; border-radius: 50%;\r\n    background: rgba(31,42,38,0.12); border: none; cursor: pointer;\r\n    padding: 0; transition: all 0.3s ease;\r\n  }\r\n  .bargach-wash .ws-slider .ws-controls .ws-dots .dot.active {\r\n    background: var(--coral); transform: scale(1.25);\r\n    box-shadow: 0 0 20px rgba(224,122,95,0.15);\r\n  }\r\n  .bargach-wash .ws-slider .ws-controls .ws-dots .dot:hover {\r\n    background: rgba(31,42,38,0.25);\r\n  }\r\n  .bargach-wash .ws-slider .ws-controls .ws-dots .dot.active:hover {\r\n    background: var(--coral);\r\n  }\r\n  .bargach-wash .ws-slider .ws-controls .ws-nav {\r\n    width: 36px; height: 36px; border-radius: 50%;\r\n    border: 1px solid var(--hairline); background: rgba(255,255,255,0.60);\r\n    cursor: pointer; display: flex; align-items: center; justify-content: center;\r\n    font-size: 18px; color: var(--text-dark); transition: all 0.3s ease;\r\n  }\r\n  .bargach-wash .ws-slider .ws-controls .ws-nav:hover {\r\n    background: var(--coral); border-color: var(--coral); color: #fff;\r\n  }\r\n\r\n  \/* ========== IMPACT STRIP ========== *\/\r\n  .bargach-wash .ws-impact {\r\n    display: grid; grid-template-columns: repeat(3, 1fr);\r\n    gap: clamp(16px, 2vw, 24px);\r\n    margin: clamp(20px, 2vw, 30px) 0 clamp(30px, 4vw, 50px);\r\n  }\r\n  @media (max-width: 700px) {\r\n    .bargach-wash .ws-impact {\r\n      grid-template-columns: repeat(2, 1fr);\r\n    }\r\n  }\r\n  @media (max-width: 450px) {\r\n    .bargach-wash .ws-impact {\r\n      grid-template-columns: 1fr;\r\n      max-width: 320px; margin-left: auto; margin-right: auto;\r\n    }\r\n  }\r\n\r\n  .bargach-wash .ws-impact-card {\r\n    background: var(--bg-card); backdrop-filter: blur(8px);\r\n    -webkit-backdrop-filter: blur(8px);\r\n    border-radius: 16px; padding: clamp(24px, 2.5vw, 32px);\r\n    text-align: center; border: 1px solid var(--hairline);\r\n    transition: transform 0.4s ease, box-shadow 0.4s ease;\r\n  }\r\n  .bargach-wash .ws-impact-card:hover {\r\n    transform: translateY(-4px);\r\n    box-shadow: 0 12px 40px rgba(31,42,38,0.06);\r\n    border-color: rgba(212,140,60,0.08);\r\n  }\r\n  .bargach-wash .ws-impact-card .ws-impact-number {\r\n    font-family: var(--serif); font-weight: 560;\r\n    font-size: clamp(32px, 3.5vw, 48px);\r\n    background: linear-gradient(135deg, var(--coral), var(--gold));\r\n    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;\r\n    line-height: 1;\r\n  }\r\n  .bargach-wash .ws-impact-card .ws-impact-label {\r\n    font-size: clamp(14px, 1vw, 16px);\r\n    color: var(--text-muted); font-weight: 400; margin-top: 4px;\r\n  }\r\n  .bargach-wash .ws-impact-card .ws-impact-desc {\r\n    font-size: clamp(13px, 0.85vw, 14px);\r\n    color: var(--text-body); font-weight: 300; margin-top: 4px;\r\n  }\r\n\r\n  \/* ========== FINAL CTA ========== *\/\r\n  .bargach-wash .ws-final-cta {\r\n    background: var(--bg-card); backdrop-filter: blur(8px);\r\n    -webkit-backdrop-filter: blur(8px);\r\n    border-radius: 20px; padding: clamp(32px, 4vw, 48px) clamp(24px, 3vw, 40px);\r\n    border: 1px solid var(--hairline);\r\n    text-align: center;\r\n    box-shadow: 0 4px 20px rgba(31,42,38,0.04);\r\n    margin-top: clamp(20px, 2vw, 30px);\r\n  }\r\n  .bargach-wash .ws-final-cta .ws-cta-icon {\r\n    font-size: 32px; display: block; margin-bottom: 4px;\r\n  }\r\n  .bargach-wash .ws-final-cta .ws-cta-title {\r\n    font-family: var(--serif); font-weight: 380;\r\n    font-size: clamp(22px, 2.5vw, 34px);\r\n    color: var(--text-dark); margin: 0 0 10px;\r\n  }\r\n  .bargach-wash .ws-final-cta .ws-cta-title .highlight {\r\n    color: var(--coral);\r\n  }\r\n  .bargach-wash .ws-final-cta .ws-cta-btns {\r\n    display: flex; flex-wrap: wrap; gap: 12px; justify-content: center;\r\n  }\r\n\r\n  .bargach-wash .ws-btn-primary {\r\n    display: inline-flex; align-items: center; gap: 8px;\r\n    padding: 12px 28px; border-radius: 999px;\r\n    background: var(--gold); color: #fff;\r\n    font-size: 14px; font-weight: 600; text-decoration: none;\r\n    border: none; cursor: pointer; font-family: var(--sans);\r\n    transition: all 0.3s ease;\r\n  }\r\n  .bargach-wash .ws-btn-primary:hover {\r\n    transform: translateY(-3px);\r\n    box-shadow: 0 8px 30px rgba(212,140,60,0.25);\r\n    background: var(--coral);\r\n  }\r\n  .bargach-wash .ws-btn-primary .arrow {\r\n    display: inline-block; transition: transform 0.3s ease;\r\n  }\r\n  .bargach-wash .ws-btn-primary:hover .arrow {\r\n    transform: translateX(4px);\r\n  }\r\n  .bargach-wash .ws-btn-outline {\r\n    display: inline-flex; align-items: center; gap: 8px;\r\n    padding: 12px 28px; border-radius: 999px;\r\n    background: transparent; color: var(--coral);\r\n    border: 1px solid var(--coral);\r\n    font-size: 14px; font-weight: 600; text-decoration: none;\r\n    transition: all 0.3s ease; font-family: var(--sans);\r\n  }\r\n  .bargach-wash .ws-btn-outline:hover {\r\n    background: var(--coral); color: #fff;\r\n    transform: translateY(-3px);\r\n  }\r\n\r\n  \/* ========== ANIMATIONS ========== *\/\r\n  @keyframes fadeUp {\r\n    from { opacity: 0; transform: translateY(20px); }\r\n    to { opacity: 1; transform: translateY(0); }\r\n  }\r\n  .bargach-wash .ws-hero .ws-hero-badge { opacity: 0; animation: fadeUp 0.6s ease 0.1s forwards; }\r\n  .bargach-wash .ws-hero .ws-hero-headline { opacity: 0; animation: fadeUp 0.7s ease 0.2s forwards; }\r\n  .bargach-wash .ws-hero .ws-hero-text { opacity: 0; animation: fadeUp 0.7s ease 0.3s forwards; }\r\n  .bargach-wash .ws-slider { opacity: 0; animation: fadeUp 0.8s ease 0.2s forwards; }\r\n  .bargach-wash .ws-tag { opacity: 0; animation: fadeUp 0.6s ease 0.1s forwards; }\r\n  .bargach-wash .ws-heading { opacity: 0; animation: fadeUp 0.7s ease 0.2s forwards; }\r\n  .bargach-wash .ws-sub { opacity: 0; animation: fadeUp 0.7s ease 0.3s forwards; }\r\n  .bargach-wash .ws-impact-card { opacity: 0; animation: fadeUp 0.6s ease forwards; }\r\n  .bargach-wash .ws-impact-card:nth-child(1) { animation-delay: 0.15s; }\r\n  .bargach-wash .ws-impact-card:nth-child(2) { animation-delay: 0.2s; }\r\n  .bargach-wash .ws-impact-card:nth-child(3) { animation-delay: 0.25s; }\r\n  .bargach-wash .ws-final-cta { opacity: 0; animation: fadeUp 0.7s ease 0.3s forwards; }\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .bargach-wash * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }\r\n    .bargach-wash .ws-hero .ws-hero-badge,\r\n    .bargach-wash .ws-hero .ws-hero-headline,\r\n    .bargach-wash .ws-hero .ws-hero-text,\r\n    .bargach-wash .ws-slider,\r\n    .bargach-wash .ws-tag,\r\n    .bargach-wash .ws-heading,\r\n    .bargach-wash .ws-sub,\r\n    .bargach-wash .ws-impact-card,\r\n    .bargach-wash .ws-final-cta {\r\n      opacity: 1 !important; animation: none !important;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<!-- ============================================================\r\n     WATER & WASH \u2013 PROGRAM HTML\r\n     ============================================================ -->\r\n<section class=\"bargach-wash\" aria-label=\"Water & WASH Program\">\r\n\r\n  <div class=\"ws-bg\" aria-hidden=\"true\"><\/div>\r\n  <div class=\"ws-glow\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"ws-container\">\r\n\r\n    <!-- ====== HERO ====== -->\r\n    <div class=\"ws-hero\">\r\n      <div class=\"ws-hero-badge\">Safe Water &amp; Better Hygiene<\/div>\r\n      <h1 class=\"ws-hero-headline\">Clean water. <span class=\"highlight\">Safer<\/span> communities.<\/h1>\r\n      <p class=\"ws-hero-text\">We work with rural and semi-urban communities to improve access to safe drinking water, sanitation and everyday hygiene.<\/p>\r\n    <\/div>\r\n\r\n    <!-- ====== SLIDER ====== -->\r\n    <div class=\"ws-slider\" id=\"wsSlider\">\r\n      <div class=\"ws-track\" id=\"wsTrack\">\r\n\r\n        <!-- Slide 01 \u2013 Safe Drinking Water -->\r\n        <div class=\"ws-slide\">\r\n          <div class=\"ws-slide-image\">\r\n            <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1548839140-29a749e1cf4d?q=80&w=2070&auto=format&fit=crop\" alt=\"Safe Drinking Water\" loading=\"lazy\" \/>\r\n            <span class=\"ws-slide-number\">01<\/span>\r\n          <\/div>\r\n          <div class=\"ws-slide-content\">\r\n            <h3 class=\"ws-slide-headline\">Water <span class=\"highlight\">within reach<\/span>.<\/h3>\r\n            <p class=\"ws-slide-desc\">We help communities access safer and more reliable sources of drinking water.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Slide 02 \u2013 WASH Awareness -->\r\n        <div class=\"ws-slide\">\r\n          <div class=\"ws-slide-image\">\r\n            <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1584820927498-cfe5211fd8bf?q=80&w=2070&auto=format&fit=crop\" alt=\"WASH Awareness\" loading=\"lazy\" \/>\r\n            <span class=\"ws-slide-number\">02<\/span>\r\n          <\/div>\r\n          <div class=\"ws-slide-content\">\r\n            <h3 class=\"ws-slide-headline\">Better habits. <span class=\"highlight\">Healthier lives<\/span>.<\/h3>\r\n            <p class=\"ws-slide-desc\">Simple hygiene awareness helps families prevent illness and build healthier communities.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Slide 03 \u2013 Community Action -->\r\n        <div class=\"ws-slide\">\r\n          <div class=\"ws-slide-image\">\r\n            <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1532996122724-e3c354a0b15b?q=80&w=2070&auto=format&fit=crop\" alt=\"Community Action\" loading=\"lazy\" \/>\r\n            <span class=\"ws-slide-number\">03<\/span>\r\n          <\/div>\r\n          <div class=\"ws-slide-content\">\r\n            <h3 class=\"ws-slide-headline\">Solutions that <span class=\"highlight\">last<\/span>.<\/h3>\r\n            <p class=\"ws-slide-desc\">We work with local communities to create practical, sustainable WASH solutions.<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n      <!-- Controls -->\r\n      <div class=\"ws-controls\">\r\n        <button class=\"ws-nav\" id=\"wsPrev\" aria-label=\"Previous\">\u2039<\/button>\r\n        <div class=\"ws-dots\" id=\"wsDots\">\r\n          <button class=\"dot active\" data-index=\"0\" aria-label=\"Slide 1\"><\/button>\r\n          <button class=\"dot\" data-index=\"1\" aria-label=\"Slide 2\"><\/button>\r\n          <button class=\"dot\" data-index=\"2\" aria-label=\"Slide 3\"><\/button>\r\n        <\/div>\r\n        <button class=\"ws-nav\" id=\"wsNext\" aria-label=\"Next\">\u203a<\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- ====== IMPACT STRIP ====== -->\r\n    <div class=\"ws-impact\">\r\n      <div class=\"ws-impact-card\">\r\n        <div class=\"ws-impact-number\">1,200+<\/div>\r\n        <div class=\"ws-impact-label\">Villagers Supplied<\/div>\r\n        <div class=\"ws-impact-desc\">With safe drinking water<\/div>\r\n      <\/div>\r\n      <div class=\"ws-impact-card\">\r\n        <div class=\"ws-impact-number\">Safe Water<\/div>\r\n        <div class=\"ws-impact-label\">Community Solutions<\/div>\r\n        <div class=\"ws-impact-desc\">Practical water interventions<\/div>\r\n      <\/div>\r\n      <div class=\"ws-impact-card\">\r\n        <div class=\"ws-impact-number\">WASH<\/div>\r\n        <div class=\"ws-impact-label\">Hygiene &amp; Sanitation<\/div>\r\n        <div class=\"ws-impact-desc\">Awareness &amp; outreach<\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- ====== FINAL CTA ====== -->\r\n    <div class=\"ws-divider\">\r\n      <span class=\"line\"><\/span>\r\n      <span class=\"diamond\"><\/span>\r\n      <span class=\"line\" style=\"background:linear-gradient(270deg,var(--coral),transparent);\"><\/span>\r\n    <\/div>\r\n\r\n    <div class=\"ws-final-cta\">\r\n      <span class=\"ws-cta-icon\">\ud83d\udca7<\/span>\r\n      <h3 class=\"ws-cta-title\">Every community deserves <span class=\"highlight\">safe water<\/span>.<\/h3>\r\n      <div class=\"ws-cta-btns\">\r\n        <a href=\"#\" class=\"ws-btn-primary\">Support Our Work <span class=\"arrow\">\u2192<\/span><\/a>\r\n      <\/div>\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('wsTrack');\r\n    var dots = document.querySelectorAll('#wsDots .dot');\r\n    var prevBtn = document.getElementById('wsPrev');\r\n    var nextBtn = document.getElementById('wsNext');\r\n    var slides = track.querySelectorAll('.ws-slide');\r\n    var total = slides.length;\r\n    var current = 0;\r\n    var isAnimating = false;\r\n\r\n    function goTo(index) {\r\n      if (isAnimating || index === current) return;\r\n      if (index < 0) index = total - 1;\r\n      if (index >= total) index = 0;\r\n      isAnimating = true;\r\n      track.style.transform = 'translateX(-' + (index * 100) + '%)';\r\n      dots.forEach(function(d, i) { d.classList.toggle('active', i === index); });\r\n      current = index;\r\n      setTimeout(function() { isAnimating = false; }, 750);\r\n    }\r\n\r\n    dots.forEach(function(dot) {\r\n      dot.addEventListener('click', function() {\r\n        var idx = parseInt(this.getAttribute('data-index'));\r\n        goTo(idx);\r\n      });\r\n    });\r\n\r\n    prevBtn.addEventListener('click', function() { goTo(current - 1); });\r\n    nextBtn.addEventListener('click', function() { goTo(current + 1); });\r\n\r\n    \/\/ Keyboard\r\n    document.addEventListener('keydown', function(e) {\r\n      var section = document.querySelector('.bargach-wash');\r\n      if (!section) return;\r\n      var rect = section.getBoundingClientRect();\r\n      if (rect.top < window.innerHeight && rect.bottom > 0) {\r\n        if (e.key === 'ArrowLeft') { e.preventDefault(); goTo(current - 1); }\r\n        if (e.key === 'ArrowRight') { e.preventDefault(); goTo(current + 1); }\r\n      }\r\n    });\r\n\r\n    \/\/ Touch\r\n    var startX = 0, endX = 0;\r\n    var slider = document.getElementById('wsSlider');\r\n    slider.addEventListener('touchstart', function(e) {\r\n      startX = e.changedTouches[0].screenX;\r\n    }, { passive: true });\r\n    slider.addEventListener('touchend', function(e) {\r\n      endX = e.changedTouches[0].screenX;\r\n      var diff = startX - endX;\r\n      if (Math.abs(diff) > 50) {\r\n        if (diff > 0) goTo(current + 1);\r\n        else goTo(current - 1);\r\n      }\r\n    }, { passive: true });\r\n\r\n    \/\/ Autoplay\r\n    var autoplay = setInterval(function() { goTo(current + 1); }, 5000);\r\n    slider.addEventListener('mouseenter', function() { clearInterval(autoplay); });\r\n    slider.addEventListener('mouseleave', function() {\r\n      autoplay = setInterval(function() { goTo(current + 1); }, 5000);\r\n    });\r\n\r\n    window.bargachWashSlider = { goTo: goTo };\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>Safe Water &amp; Better Hygiene Clean water. Safer communities. We work with rural and semi-urban communities to improve access to safe drinking water, sanitation and everyday hygiene. 01 Water within reach. We help communities access safer and more reliable sources of drinking water. 02 Better habits. Healthier lives. Simple hygiene awareness helps families prevent illness [&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-1620","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/pages\/1620","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=1620"}],"version-history":[{"count":4,"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/pages\/1620\/revisions"}],"predecessor-version":[{"id":1624,"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/pages\/1620\/revisions\/1624"}],"wp:attachment":[{"href":"https:\/\/demo.freshosoft.in\/bargach\/wp-json\/wp\/v2\/media?parent=1620"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}