{"id":12,"date":"2026-03-13T07:28:08","date_gmt":"2026-03-13T07:28:08","guid":{"rendered":"https:\/\/Demo5.yinwoodweb.com\/agro\/?page_id=12"},"modified":"2026-07-22T02:54:15","modified_gmt":"2026-07-22T02:54:15","slug":"about-us","status":"publish","type":"page","link":"https:\/\/Demo5.yinwoodweb.com\/agro\/about-us\/","title":{"rendered":"About Us"},"content":{"rendered":"\n\n\n\n\n\n\n\n\n\n\n\n\n<div class=\"wp-block-uagb-container uagb-block-9ffe046c alignfull uagb-is-root-container\">\n<!-- Google Fonts -->\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&#038;family=DM+Sans:wght@400;500;600;700&#038;family=Playfair+Display:wght@700;800;900&#038;display=swap\" rel=\"stylesheet\">\n\n<!-- Material Symbols -->\n<link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@24,400,1,0\" \/>\n\n<style>\n  \/* ========================================\n     CSS CUSTOM PROPERTIES\n  ======================================== *\/\n  :root {\n    --gold: #EFD34A;\n    --gold-light: #f5e27a;\n    --gold-dark: #c9a820;\n    --gold-soft: #f8edbe;\n    --olive: #4B4E3A;\n    --olive-light: #6b6f54;\n    --olive-dark: #2e3024;\n    --olive-deeper: #1a1c14;\n    --bg-cream: #faf8f0;\n    --bg-warm: #f5f2e6;\n    --bg-card: #ffffff;\n    --text-body: #3a3c30;\n    --text-muted: #7a7c6e;\n    --shadow-soft: 0 4px 20px rgba(75, 78, 58, 0.08);\n    --shadow-medium: 0 8px 40px rgba(75, 78, 58, 0.12);\n    --shadow-strong: 0 16px 60px rgba(75, 78, 58, 0.18);\n    --radius-sm: 8px;\n    --radius-md: 14px;\n    --radius-lg: 22px;\n    --radius-xl: 32px;\n    --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n    --transition-smooth: 0.4s cubic-bezier(0.4, 0, 0.2, 1);\n    --transition-bounce: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);\n  }\n\n  \/* ========================================\n     RESET & BASE (scoped)\n  ======================================== *\/\n  .srmc-about-page *,\n  .srmc-about-page *::before,\n  .srmc-about-page *::after {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n  }\n\n  .srmc-about-page {\n    font-family: 'DM Sans', sans-serif;\n    font-size: 16px;\n    line-height: 1.7;\n    color: var(--text-body);\n    background-color: var(--bg-cream);\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    width: 100%;\n    max-width: 100%;\n    overflow-x: hidden;\n  }\n\n  .srmc-about-page img {\n    max-width: 100%;\n    height: auto;\n    display: block;\n  }\n\n  .srmc-about-page a {\n    text-decoration: none !important;\n  }\n\n  .srmc-about-page a:hover,\n  .srmc-about-page a:focus,\n  .srmc-about-page a:active,\n  .srmc-about-page a:visited {\n    text-decoration: none !important;\n  }\n\n  .srmc-about-page ul,\n  .srmc-about-page ol {\n    list-style: none;\n  }\n\n  .srmc-inner {\n    width: 100%;\n    max-width: 1200px;\n    margin: 0 auto;\n    padding: 0 24px;\n  }\n\n  .srmc-section {\n    padding: 80px 0;\n    position: relative;\n  }\n\n  \/* ========================================\n     TYPOGRAPHY UTILITIES\n  ======================================== *\/\n  .srmc-section-label {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    font-family: 'DM Sans', sans-serif;\n    font-size: 13px;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 3px;\n    color: var(--gold-dark);\n    margin-bottom: 16px;\n    padding: 8px 18px;\n    background: linear-gradient(135deg, rgba(239, 211, 74, 0.15), rgba(239, 211, 74, 0.05));\n    border: 1px solid rgba(239, 211, 74, 0.3);\n    border-radius: 100px;\n  }\n\n  .srmc-section-label .material-symbols-rounded {\n    font-size: 18px;\n    color: var(--gold-dark);\n  }\n\n  .srmc-section-label-light {\n    color: var(--gold);\n    background: rgba(239, 211, 74, 0.08);\n    border-color: rgba(239, 211, 74, 0.2);\n  }\n\n  .srmc-section-label-light .material-symbols-rounded {\n    color: var(--gold);\n  }\n\n  .srmc-section-title {\n    font-family: 'Playfair Display', serif;\n    font-weight: 800;\n    font-size: clamp(32px, 5vw, 52px);\n    line-height: 1.15;\n    color: var(--olive-dark);\n    margin-bottom: 16px;\n  }\n\n  .srmc-section-subtitle {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: clamp(18px, 2.5vw, 22px);\n    font-weight: 400;\n    font-style: italic;\n    color: var(--text-muted);\n    max-width: 640px;\n    line-height: 1.6;\n  }\n\n  \/* ========================================\n     BUTTONS \u2014 all solid fills, no outlines\n  ======================================== *\/\n  .srmc-btn {\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    font-family: 'DM Sans', sans-serif;\n    font-size: 15px;\n    font-weight: 700;\n    padding: 14px 32px;\n    border-radius: 100px;\n    cursor: pointer;\n    transition: all var(--transition-smooth);\n    border: none;\n    text-decoration: none !important;\n    position: relative;\n    overflow: hidden;\n  }\n\n  .srmc-btn:hover,\n  .srmc-btn:focus,\n  .srmc-btn:active,\n  .srmc-btn:visited {\n    text-decoration: none !important;\n  }\n\n  .srmc-btn .material-symbols-rounded {\n    font-size: 20px;\n    transition: transform var(--transition-bounce);\n  }\n\n  .srmc-btn:hover .material-symbols-rounded {\n    transform: translateX(3px);\n  }\n\n  .srmc-btn-primary {\n    background: var(--gold);\n    color: var(--olive-dark);\n    box-shadow: 0 4px 20px rgba(239, 211, 74, 0.35);\n  }\n\n  .srmc-btn-primary:hover {\n    background: var(--gold-light);\n    box-shadow: 0 8px 32px rgba(239, 211, 74, 0.45);\n    transform: translateY(-2px);\n    text-decoration: none !important;\n  }\n\n  \/* Solid cream fill \u2014 no border, strong contrast *\/\n  .srmc-btn-outline {\n    background: var(--gold-soft);\n    color: var(--olive-dark);\n    border: none;\n    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);\n    text-decoration: none !important;\n  }\n\n  .srmc-btn-outline:hover {\n    background: var(--gold-light);\n    color: var(--olive-dark);\n    transform: translateY(-2px);\n    box-shadow: 0 8px 32px rgba(239, 211, 74, 0.3);\n    text-decoration: none !important;\n  }\n\n  \/* Light variant for dark backgrounds *\/\n  .srmc-btn-outline--light {\n    background: rgba(255, 255, 255, 0.15);\n    color: #ffffff;\n    border: none;\n    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);\n    backdrop-filter: blur(4px);\n    -webkit-backdrop-filter: blur(4px);\n    text-decoration: none !important;\n  }\n\n  .srmc-btn-outline--light:hover {\n    background: var(--gold);\n    color: var(--olive-dark);\n    transform: translateY(-2px);\n    box-shadow: 0 8px 32px rgba(239, 211, 74, 0.4);\n    text-decoration: none !important;\n  }\n\n  .srmc-btn-olive {\n    background: var(--olive);\n    color: var(--gold-soft);\n    box-shadow: 0 4px 20px rgba(75, 78, 58, 0.3);\n    text-decoration: none !important;\n  }\n\n  .srmc-btn-olive:hover {\n    background: var(--olive-dark);\n    transform: translateY(-2px);\n    box-shadow: 0 8px 32px rgba(75, 78, 58, 0.4);\n    text-decoration: none !important;\n  }\n\n  .srmc-btn-sm {\n    font-size: 13px;\n    padding: 10px 22px;\n  }\n\n  \/* ========================================\n     1. HERO BANNER\n  ======================================== *\/\n  .srmc-hero {\n    position: relative;\n    width: 100%;\n    min-height: 440px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    background: linear-gradient(155deg, var(--olive-deeper) 0%, var(--olive-dark) 40%, var(--olive) 100%);\n    padding: 100px 24px;\n    overflow: hidden;\n  }\n\n  .srmc-hero::before {\n    content: '';\n    position: absolute;\n    top: -40%;\n    right: -10%;\n    width: 600px;\n    height: 600px;\n    border-radius: 50%;\n    background: radial-gradient(circle, rgba(239, 211, 74, 0.12) 0%, transparent 70%);\n    pointer-events: none;\n  }\n\n  .srmc-hero::after {\n    content: '';\n    position: absolute;\n    bottom: -30%;\n    left: -5%;\n    width: 500px;\n    height: 500px;\n    border-radius: 50%;\n    background: radial-gradient(circle, rgba(239, 211, 74, 0.08) 0%, transparent 70%);\n    pointer-events: none;\n  }\n\n  .srmc-hero-pattern {\n    position: absolute;\n    inset: 0;\n    background-image:\n      linear-gradient(45deg, rgba(239, 211, 74, 0.03) 25%, transparent 25%),\n      linear-gradient(-45deg, rgba(239, 211, 74, 0.03) 25%, transparent 25%),\n      linear-gradient(45deg, transparent 75%, rgba(239, 211, 74, 0.03) 75%),\n      linear-gradient(-45deg, transparent 75%, rgba(239, 211, 74, 0.03) 75%);\n    background-size: 60px 60px;\n    background-position: 0 0, 0 30px, 30px -30px, -30px 0;\n    pointer-events: none;\n  }\n\n  .srmc-hero-content {\n    position: relative;\n    z-index: 2;\n    max-width: 820px;\n    padding-top: 100px;\n  }\n\n  .srmc-hero-cross {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 64px;\n    height: 64px;\n    border-radius: 50%;\n    background: rgba(239, 211, 74, 0.12);\n    border: 2px solid rgba(239, 211, 74, 0.3);\n    margin-bottom: 28px;\n    animation: pulse-glow 3s ease-in-out infinite;\n  }\n\n  .srmc-hero-cross .material-symbols-rounded {\n    font-size: 30px;\n    color: var(--gold);\n  }\n\n  @keyframes pulse-glow {\n    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 211, 74, 0.2); }\n    50% { box-shadow: 0 0 24px 8px rgba(239, 211, 74, 0.12); }\n  }\n\n  .srmc-hero-topline {\n    font-family: 'DM Sans', sans-serif;\n    font-size: 13px;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 5px;\n    color: var(--gold);\n    margin-bottom: 20px;\n    opacity: 0;\n    animation: fadeInDown 0.8s 0.2s forwards;\n  }\n\n  .srmc-hero-title {\n    font-family: 'Playfair Display', serif;\n    font-weight: 900;\n    font-size: clamp(36px, 7vw, 72px);\n    line-height: 1.05;\n    margin-bottom: 12px;\n    background: linear-gradient(135deg, #ffffff 0%, var(--gold) 50%, var(--gold-light) 100%);\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n    background-clip: text;\n    opacity: 0;\n    animation: fadeInUp 0.8s 0.4s forwards;\n  }\n\n  .srmc-hero-subtitle {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: clamp(16px, 2.5vw, 22px);\n    font-style: italic;\n    color: var(--gold-soft);\n    margin-bottom: 32px;\n    line-height: 1.6;\n    opacity: 0;\n    animation: fadeInUp 0.8s 0.6s forwards;\n  }\n\n  .srmc-hero-btn-group {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 16px;\n    justify-content: center;\n    opacity: 0;\n    animation: fadeInUp 0.8s 0.8s forwards;\n  }\n\n  .srmc-hero-breadcrumb {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    font-size: 13px;\n    color: rgba(240, 237, 220, 0.5);\n    margin-bottom: 24px;\n    opacity: 0;\n    animation: fadeInDown 0.6s 0.1s forwards;\n  }\n\n  .srmc-hero-breadcrumb a {\n    color: rgba(240, 237, 220, 0.6);\n    transition: color var(--transition-fast);\n    text-decoration: none !important;\n  }\n\n  .srmc-hero-breadcrumb a:hover {\n    color: var(--gold);\n    text-decoration: none !important;\n  }\n\n  .srmc-hero-breadcrumb .sep {\n    font-size: 10px;\n  }\n\n  .srmc-hero-breadcrumb .current {\n    color: var(--gold);\n  }\n\n  @keyframes fadeInUp {\n    from { opacity: 0; transform: translateY(24px); }\n    to { opacity: 1; transform: translateY(0); }\n  }\n\n  @keyframes fadeInDown {\n    from { opacity: 0; transform: translateY(-16px); }\n    to { opacity: 1; transform: translateY(0); }\n  }\n\n  \/* ========================================\n     2. WELCOME \/ INTRO SECTION\n  ======================================== *\/\n  .srmc-welcome {\n    background: var(--bg-cream);\n  }\n\n  .srmc-welcome-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 56px;\n    align-items: center;\n  }\n\n  .srmc-welcome-image-wrap {\n    position: relative;\n    border-radius: var(--radius-xl);\n    overflow: hidden;\n    box-shadow: var(--shadow-strong);\n  }\n\n  .srmc-welcome-image-wrap::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    border-radius: var(--radius-xl);\n    border: 1px solid rgba(239, 211, 74, 0.15);\n    z-index: 1;\n    pointer-events: none;\n  }\n\n  .srmc-welcome-image-accent {\n    position: absolute;\n    top: -16px;\n    right: -16px;\n    width: 100%;\n    height: 100%;\n    border-radius: var(--radius-xl);\n    background: linear-gradient(135deg, var(--gold), var(--gold-light));\n    z-index: -1;\n    opacity: 0.3;\n  }\n\n  .srmc-welcome-image-wrap img {\n    width: 100%;\n    height: auto;\n    display: block;\n    aspect-ratio: 4 \/ 3;\n    object-fit: cover;\n  }\n\n  .srmc-welcome-text .srmc-section-subtitle {\n    margin-bottom: 20px;\n  }\n\n  .srmc-welcome-body {\n    font-size: 16px;\n    line-height: 1.8;\n    color: var(--text-body);\n    margin-bottom: 28px;\n    text-align: justify;\n  }\n\n  .srmc-welcome-body p + p {\n    margin-top: 16px;\n  }\n\n  .srmc-welcome-quote {\n    display: flex;\n    align-items: flex-start;\n    gap: 16px;\n    padding: 24px 28px;\n    background: linear-gradient(135deg, rgba(239, 211, 74, 0.08), rgba(239, 211, 74, 0.02));\n    border-radius: var(--radius-md);\n    border-left: 4px solid var(--gold);\n    margin-bottom: 28px;\n  }\n\n  .srmc-welcome-quote .material-symbols-rounded {\n    font-size: 28px;\n    color: var(--gold-dark);\n    flex-shrink: 0;\n  }\n\n  .srmc-welcome-quote blockquote {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: 18px;\n    font-style: italic;\n    color: var(--olive-dark);\n    line-height: 1.6;\n  }\n\n  .srmc-welcome-quote cite {\n    display: block;\n    font-family: 'DM Sans', sans-serif;\n    font-size: 13px;\n    font-style: normal;\n    font-weight: 600;\n    color: var(--text-muted);\n    margin-top: 8px;\n  }\n\n  \/* ========================================\n     3. MISSION & VISION SECTION\n  ======================================== *\/\n  .srmc-mission {\n    background: var(--olive-deeper);\n    color: #fff;\n    position: relative;\n    overflow: hidden;\n  }\n\n  .srmc-mission::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background:\n      radial-gradient(ellipse at 20% 30%, rgba(239, 211, 74, 0.06) 0%, transparent 50%),\n      radial-gradient(ellipse at 80% 70%, rgba(239, 211, 74, 0.04) 0%, transparent 50%);\n    pointer-events: none;\n  }\n\n  .srmc-mission .srmc-section-title {\n    color: #ffffff;\n  }\n\n  .srmc-mission .srmc-section-subtitle {\n    color: rgba(240, 237, 220, 0.6);\n  }\n\n  .srmc-mission-header {\n    text-align: center;\n    margin-bottom: 56px;\n    position: relative;\n    z-index: 1;\n  }\n\n  .srmc-mission-header .srmc-section-subtitle {\n    margin: 0 auto;\n  }\n\n  .srmc-mission-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 32px;\n    position: relative;\n    z-index: 1;\n  }\n\n  .srmc-mission-card {\n    padding: 40px 36px;\n    background: rgba(255, 255, 255, 0.03);\n    border: 1px solid rgba(239, 211, 74, 0.1);\n    border-radius: var(--radius-xl);\n    transition: all var(--transition-smooth);\n    position: relative;\n    overflow: hidden;\n  }\n\n  .srmc-mission-card::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    height: 3px;\n    background: linear-gradient(90deg, var(--gold), var(--gold-light));\n    transform: scaleX(0);\n    transform-origin: left;\n    transition: transform var(--transition-smooth);\n  }\n\n  .srmc-mission-card:hover {\n    background: rgba(239, 211, 74, 0.05);\n    border-color: rgba(239, 211, 74, 0.2);\n    transform: translateY(-4px);\n  }\n\n  .srmc-mission-card:hover::before {\n    transform: scaleX(1);\n  }\n\n  .srmc-mission-card-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 64px;\n    height: 64px;\n    border-radius: 50%;\n    background: rgba(239, 211, 74, 0.1);\n    margin-bottom: 24px;\n  }\n\n  .srmc-mission-card-icon .material-symbols-rounded {\n    font-size: 30px;\n    color: var(--gold);\n  }\n\n  .srmc-mission-card-title {\n    font-family: 'Playfair Display', serif;\n    font-weight: 700;\n    font-size: 26px;\n    color: #ffffff;\n    margin-bottom: 16px;\n  }\n\n  .srmc-mission-card-text {\n    font-size: 15px;\n    line-height: 1.8;\n    color: rgba(240, 237, 220, 0.65);\n    text-align: justify;\n  }\n\n  \/* ========================================\n     4. CORE VALUES SECTION\n  ======================================== *\/\n  .srmc-values {\n    background: var(--bg-warm);\n  }\n\n  .srmc-values-header {\n    text-align: center;\n    margin-bottom: 56px;\n  }\n\n  .srmc-values-header .srmc-section-subtitle {\n    margin: 0 auto;\n  }\n\n  .srmc-values-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\n    gap: 24px;\n  }\n\n  .srmc-value-card {\n    background: var(--bg-card);\n    border-radius: var(--radius-lg);\n    padding: 36px 28px;\n    text-align: center;\n    box-shadow: var(--shadow-soft);\n    border: 1px solid rgba(75, 78, 58, 0.06);\n    transition: all var(--transition-smooth);\n    position: relative;\n    overflow: hidden;\n  }\n\n  .srmc-value-card::after {\n    content: '';\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 3px;\n    background: linear-gradient(90deg, var(--gold), var(--gold-light));\n    transform: scaleX(0);\n    transition: transform var(--transition-smooth);\n  }\n\n  .srmc-value-card:hover {\n    transform: translateY(-6px);\n    box-shadow: var(--shadow-medium);\n  }\n\n  .srmc-value-card:hover::after {\n    transform: scaleX(1);\n  }\n\n  .srmc-value-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 72px;\n    height: 72px;\n    border-radius: 50%;\n    background: linear-gradient(135deg, rgba(239, 211, 74, 0.12), rgba(239, 211, 74, 0.04));\n    margin-bottom: 20px;\n    transition: all var(--transition-smooth);\n  }\n\n  .srmc-value-card:hover .srmc-value-icon {\n    background: linear-gradient(135deg, var(--gold), var(--gold-light));\n    transform: scale(1.08);\n  }\n\n  .srmc-value-icon .material-symbols-rounded {\n    font-size: 32px;\n    color: var(--gold-dark);\n    transition: color var(--transition-smooth);\n  }\n\n  .srmc-value-card:hover .srmc-value-icon .material-symbols-rounded {\n    color: var(--olive-dark);\n  }\n\n  .srmc-value-title {\n    font-family: 'Playfair Display', serif;\n    font-weight: 700;\n    font-size: 20px;\n    color: var(--olive-dark);\n    margin-bottom: 10px;\n  }\n\n  .srmc-value-desc {\n    font-size: 14px;\n    line-height: 1.7;\n    color: var(--text-muted);\n    text-align: justify;\n  }\n\n  \/* ========================================\n     5. HISTORY \/ TIMELINE SECTION\n  ======================================== *\/\n  .srmc-history {\n    background: var(--bg-cream);\n  }\n\n  .srmc-history-header {\n    text-align: center;\n    margin-bottom: 56px;\n  }\n\n  .srmc-history-header .srmc-section-subtitle {\n    margin: 0 auto;\n  }\n\n  .srmc-timeline {\n    position: relative;\n    max-width: 800px;\n    margin: 0 auto;\n  }\n\n  .srmc-timeline::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    width: 2px;\n    height: 100%;\n    background: linear-gradient(180deg, var(--gold), var(--gold-light), rgba(239, 211, 74, 0.2));\n    border-radius: 2px;\n  }\n\n  .srmc-timeline-item {\n    position: relative;\n    width: 50%;\n    padding: 0 40px 56px;\n  }\n\n  .srmc-timeline-item:nth-child(odd) {\n    left: 0;\n    text-align: right;\n    padding-right: 56px;\n    padding-left: 0;\n  }\n\n  .srmc-timeline-item:nth-child(even) {\n    left: 50%;\n    text-align: left;\n    padding-left: 56px;\n    padding-right: 0;\n  }\n\n  .srmc-timeline-item::before {\n    content: '';\n    position: absolute;\n    top: 8px;\n    width: 16px;\n    height: 16px;\n    border-radius: 50%;\n    background: var(--gold);\n    border: 3px solid var(--bg-cream);\n    box-shadow: 0 0 0 3px var(--gold);\n    z-index: 2;\n  }\n\n  .srmc-timeline-item:nth-child(odd)::before {\n    right: -8px;\n  }\n\n  .srmc-timeline-item:nth-child(even)::before {\n    left: -8px;\n  }\n\n  .srmc-timeline-year {\n    font-family: 'Playfair Display', serif;\n    font-weight: 800;\n    font-size: 28px;\n    color: var(--gold-dark);\n    margin-bottom: 6px;\n  }\n\n  .srmc-timeline-heading {\n    font-family: 'DM Sans', sans-serif;\n    font-weight: 700;\n    font-size: 17px;\n    color: var(--olive-dark);\n    margin-bottom: 8px;\n  }\n\n  .srmc-timeline-text {\n    font-size: 14px;\n    line-height: 1.7;\n    color: var(--text-muted);\n    text-align: justify;\n  }\n\n  \/* ========================================\n     6. PARISH PRIEST \/ LEADERSHIP SECTION\n  ======================================== *\/\n  .srmc-leadership {\n    background: var(--bg-warm);\n  }\n\n  .srmc-leadership-header {\n    text-align: center;\n    margin-bottom: 56px;\n  }\n\n  .srmc-leadership-header .srmc-section-subtitle {\n    margin: 0 auto;\n  }\n\n  .srmc-leadership-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n    gap: 28px;\n  }\n\n  .srmc-leader-card {\n    background: var(--bg-card);\n    border-radius: var(--radius-lg);\n    overflow: hidden;\n    box-shadow: var(--shadow-soft);\n    border: 1px solid rgba(75, 78, 58, 0.06);\n    transition: all var(--transition-smooth);\n  }\n\n  .srmc-leader-card:hover {\n    transform: translateY(-6px);\n    box-shadow: var(--shadow-strong);\n  }\n\n  .srmc-leader-photo {\n    width: 100%;\n    aspect-ratio: 1 \/ 1;\n    overflow: hidden;\n    background: linear-gradient(135deg, var(--olive), var(--olive-dark));\n    position: relative;\n  }\n\n  .srmc-leader-photo img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    transition: transform var(--transition-smooth);\n  }\n\n  .srmc-leader-card:hover .srmc-leader-photo img {\n    transform: scale(1.06);\n  }\n\n  .srmc-leader-photo-placeholder {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    height: 100%;\n  }\n\n  .srmc-leader-photo-placeholder .material-symbols-rounded {\n    font-size: 72px;\n    color: rgba(239, 211, 74, 0.2);\n  }\n\n  .srmc-leader-body {\n    padding: 28px;\n    text-align: center;\n  }\n\n  .srmc-leader-name {\n    font-family: 'Playfair Display', serif;\n    font-weight: 700;\n    font-size: 20px;\n    color: var(--olive-dark);\n    margin-bottom: 4px;\n  }\n\n  .srmc-leader-role {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: 15px;\n    font-style: italic;\n    color: var(--gold-dark);\n    margin-bottom: 14px;\n  }\n\n  .srmc-leader-bio {\n    font-size: 14px;\n    line-height: 1.7;\n    color: var(--text-muted);\n    text-align: justify;\n  }\n\n  \/* ========================================\n     7. FULL IMAGE \/ PARISH PHOTO SECTION\n  ======================================== *\/\n  .srmc-parish-photo {\n    padding: 0;\n    position: relative;\n  }\n\n  .srmc-parish-photo-wrap {\n    width: 100%;\n    height: 480px;\n    overflow: hidden;\n    position: relative;\n  }\n\n  .srmc-parish-photo-wrap img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n\n  .srmc-parish-photo-overlay {\n    position: absolute;\n    inset: 0;\n    background: linear-gradient(180deg, rgba(26, 28, 20, 0.3) 0%, rgba(26, 28, 20, 0.7) 100%);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    padding: 24px;\n  }\n\n  .srmc-parish-photo-content {\n    max-width: 640px;\n  }\n\n  .srmc-parish-photo-content h3 {\n    font-family: 'Playfair Display', serif;\n    font-weight: 800;\n    font-size: clamp(28px, 4vw, 44px);\n    color: #ffffff;\n    margin-bottom: 12px;\n    line-height: 1.2;\n  }\n\n  .srmc-parish-photo-content p {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: 20px;\n    font-style: italic;\n    color: var(--gold-soft);\n    line-height: 1.6;\n  }\n\n  \/* ========================================\n     8. CALL TO ACTION SECTION\n  ======================================== *\/\n  .srmc-cta {\n    background: linear-gradient(155deg, var(--olive-dark) 0%, var(--olive) 100%);\n    text-align: center;\n    position: relative;\n    overflow: hidden;\n  }\n\n  .srmc-cta::before {\n    content: '';\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    width: 800px;\n    height: 800px;\n    border-radius: 50%;\n    background: radial-gradient(circle, rgba(239, 211, 74, 0.06) 0%, transparent 60%);\n    pointer-events: none;\n  }\n\n  .srmc-cta-content {\n    position: relative;\n    z-index: 1;\n    max-width: 640px;\n    margin: 0 auto;\n  }\n\n  .srmc-cta-title {\n    font-family: 'Playfair Display', serif;\n    font-weight: 800;\n    font-size: clamp(28px, 4vw, 44px);\n    color: #ffffff;\n    margin-bottom: 16px;\n    line-height: 1.2;\n  }\n\n  .srmc-cta-title em {\n    color: var(--gold);\n    font-style: normal;\n  }\n\n  .srmc-cta-desc {\n    font-family: 'Cormorant Garamond', serif;\n    font-size: 18px;\n    font-style: italic;\n    color: rgba(240, 237, 220, 0.6);\n    margin-bottom: 32px;\n    line-height: 1.6;\n    text-align: justify;\n  }\n\n  .srmc-cta-buttons {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 16px;\n    justify-content: center;\n  }\n\n  \/* Stronger glow on CTA primary button *\/\n  .srmc-cta .srmc-btn-primary {\n    box-shadow: 0 4px 30px rgba(239, 211, 74, 0.4), 0 0 60px rgba(239, 211, 74, 0.1);\n  }\n\n  .srmc-cta .srmc-btn-primary:hover {\n    box-shadow: 0 8px 45px rgba(239, 211, 74, 0.5), 0 0 80px rgba(239, 211, 74, 0.15);\n  }\n\n  \/* ========================================\n     SCROLL REVEAL ANIMATIONS\n  ======================================== *\/\n  .srmc-reveal {\n    opacity: 0;\n    transform: translateY(32px);\n    transition: opacity 0.7s cubic-bezier(0.4, 0, 0.2, 1),\n                transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .srmc-reveal.srmc-visible {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  .srmc-reveal-left {\n    opacity: 0;\n    transform: translateX(-40px);\n    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),\n                transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .srmc-reveal-left.srmc-visible {\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  .srmc-reveal-right {\n    opacity: 0;\n    transform: translateX(40px);\n    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),\n                transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .srmc-reveal-right.srmc-visible {\n    opacity: 1;\n    transform: translateX(0);\n  }\n\n  .srmc-reveal-scale {\n    opacity: 0;\n    transform: scale(0.92);\n    transition: opacity 0.7s cubic-bezier(0.4, 0, 0.2, 1),\n                transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n\n  .srmc-reveal-scale.srmc-visible {\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  .srmc-delay-1 { transition-delay: 0.1s; }\n  .srmc-delay-2 { transition-delay: 0.2s; }\n  .srmc-delay-3 { transition-delay: 0.3s; }\n  .srmc-delay-4 { transition-delay: 0.4s; }\n  .srmc-delay-5 { transition-delay: 0.5s; }\n  .srmc-delay-6 { transition-delay: 0.6s; }\n\n  \/* ========================================\n     RESPONSIVE \u2014 TABLET\n  ======================================== *\/\n  @media (max-width: 1024px) {\n    .srmc-section {\n      padding: 60px 0;\n    }\n\n    .srmc-welcome-grid {\n      gap: 40px;\n    }\n\n    .srmc-timeline-item {\n      padding: 0 28px 40px;\n    }\n\n    .srmc-timeline-item:nth-child(odd) {\n      padding-right: 44px;\n    }\n\n    .srmc-timeline-item:nth-child(even) {\n      padding-left: 44px;\n    }\n  }\n\n  \/* ========================================\n     RESPONSIVE \u2014 MOBILE\n  ======================================== *\/\n  @media (max-width: 768px) {\n    .srmc-inner {\n      padding: 0 16px;\n    }\n\n    .srmc-section {\n      padding: 48px 0;\n    }\n\n    .srmc-hero {\n      min-height: 340px;\n      padding: 72px 16px;\n    }\n\n    .srmc-hero-btn-group {\n      flex-direction: column;\n      align-items: center;\n    }\n\n    .srmc-btn {\n      width: 100%;\n      max-width: 280px;\n      justify-content: center;\n    }\n\n    .srmc-welcome-grid {\n      grid-template-columns: 1fr;\n      gap: 32px;\n    }\n\n    .srmc-welcome-image-accent {\n      display: none;\n    }\n\n    .srmc-mission-grid {\n      grid-template-columns: 1fr;\n      gap: 20px;\n    }\n\n    .srmc-mission-card {\n      padding: 32px 28px;\n    }\n\n    .srmc-values-grid {\n      grid-template-columns: 1fr 1fr;\n    }\n\n    .srmc-timeline::before {\n      left: 8px;\n    }\n\n    .srmc-timeline-item {\n      width: 100%;\n      left: 0 !important;\n      text-align: left !important;\n      padding-left: 40px !important;\n      padding-right: 0 !important;\n    }\n\n    .srmc-timeline-item::before {\n      left: 0 !important;\n      right: auto !important;\n    }\n\n    .srmc-leadership-grid {\n      grid-template-columns: 1fr;\n    }\n\n    .srmc-parish-photo-wrap {\n      height: 320px;\n    }\n  }\n\n  @media (max-width: 480px) {\n    .srmc-values-grid {\n      grid-template-columns: 1fr;\n    }\n\n    .srmc-value-card {\n      padding: 28px 22px;\n    }\n  }\n<\/style>\n\n<div class=\"srmc-about-page\">\n\n  <!-- SECTION 1: HERO BANNER -->\n  <section class=\"srmc-hero\" id=\"top\">\n    <div class=\"srmc-hero-pattern\"><\/div>\n    <div class=\"srmc-hero-content\">\n      <nav class=\"srmc-hero-breadcrumb\">\n        <a href=\"#\">Home<\/a>\n        <span class=\"sep material-symbols-rounded\">chevron_right<\/span>\n        <span class=\"current\">About Us<\/span>\n      <\/nav>\n      <div class=\"srmc-hero-cross\">\n        <span class=\"material-symbols-rounded\">church<\/span>\n      <\/div>\n      <p class=\"srmc-hero-topline\">San Roque Mission Center Agro<\/p>\n      <h1 class=\"srmc-hero-title\">About Our Parish<\/h1>\n      <p class=\"srmc-hero-subtitle\">A community rooted in faith, growing in love, and serving God&#8217;s people in Catanauan, Quezon Province.<\/p>\n      <div class=\"srmc-hero-btn-group\">\n        <a href=\"#welcome\" class=\"srmc-btn srmc-btn-primary\">\n          <span>Our Story<\/span>\n          <span class=\"material-symbols-rounded\">arrow_downward<\/span>\n        <\/a>\n        <a href=\"#mission\" class=\"srmc-btn srmc-btn-outline--light\">\n          <span>Mission &amp; Vision<\/span>\n          <span class=\"material-symbols-rounded\">visibility<\/span>\n        <\/a>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 2: WELCOME \/ INTRODUCTION -->\n  <section class=\"srmc-section srmc-welcome\" id=\"welcome\">\n    <div class=\"srmc-inner\">\n      <div class=\"srmc-welcome-grid\">\n        <div class=\"srmc-welcome-image-wrap srmc-reveal-left\">\n          <div class=\"srmc-welcome-image-accent\"><\/div>\n          <img decoding=\"async\" src=\"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-content\/uploads\/sites\/6\/2026\/04\/516395843_711090325032810_1387084905495995987_n.jpg\" alt=\"San Roque Mission Center Church Building\" \/>\n        <\/div>\n        <div class=\"srmc-welcome-text srmc-reveal-right\">\n          <span class=\"srmc-section-label\">\n            <span class=\"material-symbols-rounded\">diversity_3<\/span>\n            Who We Are\n          <\/span>\n          <h2 class=\"srmc-section-title\">Welcome to San Roque Mission Center Agro<\/h2>\n          <p class=\"srmc-section-subtitle\">A living parish that journeys with its people in faith, hope, and charity.<\/p>\n          <div class=\"srmc-welcome-body\">\n            <p>San Roque Mission Center Agro is a Roman Catholic parish nestled in the heart of Catanauan, Quezon Province. For generations, our community has been a beacon of faith \u2014 nurturing souls through the sacraments, building bridges of fellowship, and extending Christ&#8217;s love to every corner of our town.<\/p>\n            <p>As a mission center, we are committed to bringing the Gospel to life through liturgical celebrations, catechetical formation, youth empowerment, agricultural stewardship, and outreach programs that uplift the most vulnerable among us.<\/p>\n          <\/div>\n          <div class=\"srmc-welcome-quote\">\n            <span class=\"material-symbols-rounded\">format_quote<\/span>\n            <div>\n              <blockquote>&#8220;I am the vine; you are the branches. Whoever remains in me and I in them will bear much fruit.&#8221;<\/blockquote>\n              <cite>\u2014 John 15:5<\/cite>\n            <\/div>\n          <\/div>\n          <a href=\"#leadership\" class=\"srmc-btn srmc-btn-olive\">\n            <span>Meet Our Parish Team<\/span>\n            <span class=\"material-symbols-rounded\">arrow_forward<\/span>\n          <\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 3: MISSION & VISION -->\n  <section class=\"srmc-section srmc-mission\" id=\"mission\">\n    <div class=\"srmc-inner\">\n      <div class=\"srmc-mission-header srmc-reveal\">\n        <span class=\"srmc-section-label srmc-section-label-light\">\n          <span class=\"material-symbols-rounded\">flag<\/span>\n          Our Purpose\n        <\/span>\n        <h2 class=\"srmc-section-title\">Mission &amp; Vision<\/h2>\n        <p class=\"srmc-section-subtitle\">Guided by the Holy Spirit, we seek to fulfill God&#8217;s plan for our community and the world.<\/p>\n      <\/div>\n\n      <div class=\"srmc-mission-grid\">\n        <div class=\"srmc-mission-card srmc-reveal-scale srmc-delay-1\">\n          <div class=\"srmc-mission-card-icon\">\n            <span class=\"material-symbols-rounded\">auto_awesome<\/span>\n          <\/div>\n          <h3 class=\"srmc-mission-card-title\">Our Mission<\/h3>\n          <p class=\"srmc-mission-card-text\">To proclaim the Gospel of Jesus Christ to all people in Catanauan and beyond, forming a community of disciples who are rooted in prayer, nourished by the sacraments, and sent forth to serve with compassion, justice, and love \u2014 especially the poor, the youth, and the farming families of our land.<\/p>\n        <\/div>\n\n        <div class=\"srmc-mission-card srmc-reveal-scale srmc-delay-2\">\n          <div class=\"srmc-mission-card-icon\">\n            <span class=\"material-symbols-rounded\">visibility<\/span>\n          <\/div>\n          <h3 class=\"srmc-mission-card-title\">Our Vision<\/h3>\n          <p class=\"srmc-mission-card-text\">A Christ-centered, self-sustaining, and empowered Catholic community where every family grows in holiness, every young person discovers their God-given purpose, and every farmer reaps the blessings of faithful stewardship \u2014 united as one body under the intercession of San Roque.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 4: CORE VALUES -->\n  <section class=\"srmc-section srmc-values\" id=\"values\">\n    <div class=\"srmc-inner\">\n      <div class=\"srmc-values-header srmc-reveal\">\n        <span class=\"srmc-section-label\">\n          <span class=\"material-symbols-rounded\">favorite<\/span>\n          What We Believe\n        <\/span>\n        <h2 class=\"srmc-section-title\">Our Core Values<\/h2>\n        <p class=\"srmc-section-subtitle\">The pillars that guide every ministry, every gathering, and every act of service in our parish.<\/p>\n      <\/div>\n\n      <div class=\"srmc-values-grid\">\n        <div class=\"srmc-value-card srmc-reveal srmc-delay-1\">\n          <div class=\"srmc-value-icon\">\n            <span class=\"material-symbols-rounded\">volunteer_activism<\/span>\n          <\/div>\n          <h3 class=\"srmc-value-title\">Faith<\/h3>\n          <p class=\"srmc-value-desc\">Deepening our relationship with God through prayer, the sacraments, and the living Word of Scripture.<\/p>\n        <\/div>\n\n        <div class=\"srmc-value-card srmc-reveal srmc-delay-2\">\n          <div class=\"srmc-value-icon\">\n            <span class=\"material-symbols-rounded\">diversity_3<\/span>\n          <\/div>\n          <h3 class=\"srmc-value-title\">Community<\/h3>\n          <p class=\"srmc-value-desc\">Walking together as one family of God \u2014 supporting, encouraging, and uplifting each other in love.<\/p>\n        <\/div>\n\n        <div class=\"srmc-value-card srmc-reveal srmc-delay-3\">\n          <div class=\"srmc-value-icon\">\n            <span class=\"material-symbols-rounded\">handshake<\/span>\n          <\/div>\n          <h3 class=\"srmc-value-title\">Service<\/h3>\n          <p class=\"srmc-value-desc\">Following Christ&#8217;s example by serving the poor, the sick, the elderly, and all who are in need.<\/p>\n        <\/div>\n\n        <div class=\"srmc-value-card srmc-reveal srmc-delay-4\">\n          <div class=\"srmc-value-icon\">\n            <span class=\"material-symbols-rounded\">eco<\/span>\n          <\/div>\n          <h3 class=\"srmc-value-title\">Stewardship<\/h3>\n          <p class=\"srmc-value-desc\">Caring for God&#8217;s creation \u2014 the land, the harvest, and the resources entrusted to our community.<\/p>\n        <\/div>\n\n        <div class=\"srmc-value-card srmc-reveal srmc-delay-5\">\n          <div class=\"srmc-value-icon\">\n            <span class=\"material-symbols-rounded\">diversity_3<\/span>\n          <\/div>\n          <h3 class=\"srmc-value-title\">Youth Empowerment<\/h3>\n          <p class=\"srmc-value-desc\">Investing in the next generation through formation, mentorship, and opportunities for leadership.<\/p>\n        <\/div>\n\n        <div class=\"srmc-value-card srmc-reveal srmc-delay-6\">\n          <div class=\"srmc-value-icon\">\n            <span class=\"material-symbols-rounded\">menu_book<\/span>\n          <\/div>\n          <h3 class=\"srmc-value-title\">Evangelization<\/h3>\n          <p class=\"srmc-value-desc\">Sharing the joy of the Gospel with every person we encounter \u2014 in word, deed, and witness of life.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 5: PARISH HISTORY \/ TIMELINE -->\n  <section class=\"srmc-section srmc-history\" id=\"history\">\n    <div class=\"srmc-inner\">\n      <div class=\"srmc-history-header srmc-reveal\">\n        <span class=\"srmc-section-label\">\n          <span class=\"material-symbols-rounded\">history<\/span>\n          Our Journey\n        <\/span>\n        <h2 class=\"srmc-section-title\">Parish History<\/h2>\n        <p class=\"srmc-section-subtitle\">Tracing the roots of faith that have grown and flourished in Catanauan through the decades.<\/p>\n      <\/div>\n\n      <div class=\"srmc-timeline\">\n        <div class=\"srmc-timeline-item srmc-reveal-left srmc-delay-1\">\n          <div class=\"srmc-timeline-year\">1950s<\/div>\n          <h4 class=\"srmc-timeline-heading\">Humble Beginnings<\/h4>\n          <p class=\"srmc-timeline-text\">The first Catholic faithful in the Agro area of Catanauan gathered for worship under a simple bamboo chapel, served by visiting priests from the central parish.<\/p>\n        <\/div>\n\n        <div class=\"srmc-timeline-item srmc-reveal-right srmc-delay-2\">\n          <div class=\"srmc-timeline-year\">1970s<\/div>\n          <h4 class=\"srmc-timeline-heading\">Establishment as a Mission Center<\/h4>\n          <p class=\"srmc-timeline-text\">Recognizing the growing Catholic community, the Diocese officially established San Roque as a mission center, appointing its first resident priest-in-charge.<\/p>\n        <\/div>\n\n        <div class=\"srmc-timeline-item srmc-reveal-left srmc-delay-3\">\n          <div class=\"srmc-timeline-year\">1990s<\/div>\n          <h4 class=\"srmc-timeline-heading\">Church Construction<\/h4>\n          <p class=\"srmc-timeline-text\">Through the collective effort and generous donations of parishioners, the current concrete church building was constructed, replacing the old wooden chapel.<\/p>\n        <\/div>\n\n        <div class=\"srmc-timeline-item srmc-reveal-right srmc-delay-4\">\n          <div class=\"srmc-timeline-year\">2000s<\/div>\n          <h4 class=\"srmc-timeline-heading\">Growth of Ministries<\/h4>\n          <p class=\"srmc-timeline-text\">Parish organizations flourished \u2014 the Legion of Mary, Youth Ministry, Choir, Bible Study groups, and the Agro Ministry became pillars of parish life and outreach.<\/p>\n        <\/div>\n\n        <div class=\"srmc-timeline-item srmc-reveal-left srmc-delay-5\">\n          <div class=\"srmc-timeline-year\">Today<\/div>\n          <h4 class=\"srmc-timeline-heading\">A Living, Growing Community<\/h4>\n          <p class=\"srmc-timeline-text\">San Roque Mission Center Agro continues to thrive \u2014 serving hundreds of families, empowering the youth, and bringing Christ&#8217;s love to every corner of Catanauan.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 6: FULL PARISH IMAGE -->\n  <section class=\"srmc-parish-photo\">\n    <div class=\"srmc-parish-photo-wrap srmc-reveal-scale\">\n      <img decoding=\"async\" src=\"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-content\/uploads\/sites\/6\/2026\/06\/539565489_755420303933145_5975078922793730751_n.jpg\" alt=\"San Roque Parish Community\" \/>\n      <div class=\"srmc-parish-photo-overlay\">\n        <div class=\"srmc-parish-photo-content\">\n          <h3>United in Faith, Rooted in Love<\/h3>\n          <p>&#8220;Where two or three gather in my name, there am I with them.&#8221; \u2014 Matthew 18:20<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 7: PARISH LEADERSHIP -->\n  <section class=\"srmc-section srmc-leadership\" id=\"leadership\">\n    <div class=\"srmc-inner\">\n      <div class=\"srmc-leadership-header srmc-reveal\">\n        <span class=\"srmc-section-label\">\n          <span class=\"material-symbols-rounded\">groups<\/span>\n          Parish Team\n        <\/span>\n        <h2 class=\"srmc-section-title\">Meet Our Leaders<\/h2>\n        <p class=\"srmc-section-subtitle\">The dedicated servants who shepherd our community with love, wisdom, and unwavering faith.<\/p>\n      <\/div>\n\n      <div class=\"srmc-leadership-grid\">\n        <div class=\"srmc-leader-card srmc-reveal srmc-delay-1\">\n          <div class=\"srmc-leader-photo\">\n            <img decoding=\"async\" src=\"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-content\/uploads\/sites\/6\/2026\/06\/ChatGPT-Image-Jun-11-2026-08_51_32-AM.png\" alt=\"Parish Priest\" \/>\n          <\/div>\n          <div class=\"srmc-leader-body\">\n            <h3 class=\"srmc-leader-name\">Rev. Fr. Renato C. Baldovino Jr.<\/h3>\n            <p class=\"srmc-leader-role\">Parish Priest<\/p>\n            <p class=\"srmc-leader-bio\">Shepherding the San Roque community with a heart for evangelization, agricultural ministry, and pastoral care for every family in Catanauan.<\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"srmc-leader-card srmc-reveal srmc-delay-2\">\n          <div class=\"srmc-leader-photo\">\n            <img decoding=\"async\" src=\"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-content\/uploads\/sites\/6\/2026\/04\/cropped-cropped-314560993_139698805493855_3964820517640959570_n-removebg-preview.png\" alt=\"Parish Coordinator\" \/>\n          <\/div>\n          <div class=\"srmc-leader-body\">\n            <h3 class=\"srmc-leader-name\">San Roque Mission Center<\/h3>\n            <p class=\"srmc-leader-role\">Parish Pastoral Coordinator<\/p>\n            <p class=\"srmc-leader-bio\">Overseeing the day-to-day pastoral programs and coordinating between the parish organizations, ministries, and the Diocese.<\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"srmc-leader-card srmc-reveal srmc-delay-3\">\n          <div class=\"srmc-leader-photo\">\n            <img decoding=\"async\" src=\"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-content\/uploads\/sites\/6\/2026\/04\/cropped-cropped-314560993_139698805493855_3964820517640959570_n-removebg-preview.png\" alt=\"Youth Ministry Leader\" \/>\n          <\/div>\n          <div class=\"srmc-leader-body\">\n            <h3 class=\"srmc-leader-name\">San Roque Mission Center<\/h3>\n            <p class=\"srmc-leader-role\">Youth Ministry Coordinator<\/p>\n            <p class=\"srmc-leader-bio\">Guiding the young people of San Roque through formation, fellowship, and service \u2014 building the next generation of faithful Catholic leaders.<\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SECTION 8: CALL TO ACTION -->\n  <section class=\"srmc-section srmc-cta\" id=\"get-involved\">\n    <div class=\"srmc-inner\">\n      <div class=\"srmc-cta-content srmc-reveal\">\n        <div class=\"srmc-hero-cross\" style=\"margin: 0 auto 28px;\">\n          <span class=\"material-symbols-rounded\">groups<\/span>\n        <\/div>\n        <h2 class=\"srmc-cta-title\">Be Part of <em>Our Community<\/em><\/h2>\n        <p class=\"srmc-cta-desc\">Whether you are a lifelong parishioner or visiting for the first time, there is a place for you at San Roque Mission Center Agro. Come and grow with us in faith.<\/p>\n        <div class=\"srmc-cta-buttons\">\n          <a href=\"#welcome\" class=\"srmc-btn srmc-btn-primary\">\n            <span>Visit Our Parish<\/span>\n            <span class=\"material-symbols-rounded\">arrow_forward<\/span>\n          <\/a>\n          <a href=\"#history\" class=\"srmc-btn srmc-btn-outline--light\">\n            <span>Our History<\/span>\n            <span class=\"material-symbols-rounded\">history<\/span>\n          <\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n<\/div>\n\n<script>\n(function() {\n  'use strict';\n\n  function initScrollReveal() {\n    var selectors = [\n      '.srmc-reveal',\n      '.srmc-reveal-left',\n      '.srmc-reveal-right',\n      '.srmc-reveal-scale'\n    ];\n    var elements = document.querySelectorAll(selectors.join(', '));\n\n    if ('IntersectionObserver' in window) {\n      var observer = new IntersectionObserver(function(entries) {\n        entries.forEach(function(entry) {\n          if (entry.isIntersecting) {\n            entry.target.classList.add('srmc-visible');\n            observer.unobserve(entry.target);\n          }\n        });\n      }, {\n        threshold: 0.1,\n        rootMargin: '0px 0px -40px 0px'\n      });\n      elements.forEach(function(el) { observer.observe(el); });\n    } else {\n      elements.forEach(function(el) { el.classList.add('srmc-visible'); });\n    }\n  }\n\n  function initSmoothScroll() {\n    document.querySelectorAll('.srmc-about-page a[href^=\"#\"]').forEach(function(anchor) {\n      anchor.addEventListener('click', function(e) {\n        var targetId = this.getAttribute('href');\n        if (targetId === '#') return;\n        var target = document.querySelector(targetId);\n        if (target) {\n          e.preventDefault();\n          var offset = 24;\n          var top = target.getBoundingClientRect().top + window.pageYOffset - offset;\n          window.scrollTo({ top: top, behavior: 'smooth' });\n        }\n      });\n    });\n  }\n\n  document.addEventListener('DOMContentLoaded', function() {\n    initScrollReveal();\n    initSmoothScroll();\n  });\n})();\n<\/script>\n<\/div>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>About Us Learn the history of San Roque and its healing for the community. Catanauan, Quezon Catanauan, located in the [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","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":""}},"slim_seo":{"title":"About Us - San Roque Mission Center","description":"Home chevron_right About Us church San Roque Mission Center Agro About Our Parish A community rooted in faith, growing in love, and serving God's people in Cata"},"footnotes":""},"class_list":["post-12","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Diocese of Gumaca","author_link":"https:\/\/Demo5.yinwoodweb.com\/agro\/blog\/author\/phwpywadsa623\/"},"uagb_comment_info":0,"uagb_excerpt":"About Us Learn the history of San Roque and its healing for the community. Catanauan, Quezon Catanauan, located in the [&hellip;]","_links":{"self":[{"href":"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-json\/wp\/v2\/pages\/12","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-json\/wp\/v2\/comments?post=12"}],"version-history":[{"count":27,"href":"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-json\/wp\/v2\/pages\/12\/revisions"}],"predecessor-version":[{"id":1512,"href":"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-json\/wp\/v2\/pages\/12\/revisions\/1512"}],"wp:attachment":[{"href":"https:\/\/Demo5.yinwoodweb.com\/agro\/wp-json\/wp\/v2\/media?parent=12"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}