{"id":18,"date":"2026-03-13T07:38:27","date_gmt":"2026-03-13T07:38:27","guid":{"rendered":"https:\/\/demo4.yinwoodweb.com\/quezon\/?page_id=18"},"modified":"2026-06-17T14:05:58","modified_gmt":"2026-06-17T06:05:58","slug":"contact-us","status":"publish","type":"page","link":"https:\/\/demo4.yinwoodweb.com\/quezon\/contact-us\/","title":{"rendered":"Contact Us"},"content":{"rendered":"\n<div class=\"wp-block-uagb-container uagb-block-364395f0 alignfull uagb-is-root-container\">\n<style data-wp-block-html=\"css\">\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   ROOT & RESET\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n:root {\n    --gold: #b88a4a;\n    --gold-bright: #d4a95e;\n    --gold-dark: #8a6835;\n    --gold-pale: #e8d5b0;\n    --brown: #3b1f10;\n    --brown-deep: #2a1609;\n    --brown-light: #5c361c;\n    --brown-warm: #4e2a14;\n    --cream: #faf6ef;\n    --cream-dark: #eee6d6;\n    --off-white: #f5f0e8;\n    --text-dark: #1a0e06;\n    --text-muted: #7a6e5e;\n\n    --font-display: 'Instrument Serif', Georgia, serif;\n    --font-sans: 'Syne', sans-serif;\n    --font-mono: 'DM Mono', monospace;\n}\n\n*,\n*::before,\n*::after {\n    margin: 0;\n    padding: 0;\n    box-sizing: border-box;\n}\n\nhtml {\n    scroll-behavior: smooth;\n    font-size: 16px;\n}\n\nbody {\n    background: var(--cream);\n    color: var(--text-dark);\n    font-family: var(--font-sans);\n    overflow-x: hidden;\n    -webkit-font-smoothing: antialiased;\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   HERO\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.hero {\n    position: relative;\n    min-height: 100vh;\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    overflow: hidden;\n}\n\n.hero-left {\n    background: var(--brown);\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    padding: 6rem 5rem 6rem 6rem;\n    position: relative;\n}\n\n.hero-left::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    width: 1px;\n    background: linear-gradient(180deg, transparent 10%, var(--gold-dark) 50%, transparent 90%);\n    opacity: 0.3;\n}\n\n.hero-tag {\n    font-family: var(--font-mono);\n    font-size: 0.7rem;\n    font-weight: 400;\n    letter-spacing: 0.3em;\n    text-transform: uppercase;\n    color: var(--gold);\n    margin-bottom: 3rem;\n    display: flex;\n    align-items: center;\n    gap: 0.75rem;\n    opacity: 0;\n    animation: fadeRight 0.8s ease 0.3s forwards;\n}\n\n.hero-tag::before {\n    content: '';\n    width: 30px;\n    height: 1px;\n    background: var(--gold);\n}\n\n.hero-title {\n    font-family: var(--font-display);\n    font-size: clamp(3.5rem, 6vw, 6rem);\n    font-weight: 400;\n    line-height: 0.95;\n    color: var(--cream);\n    margin-bottom: 2rem;\n    opacity: 0;\n    animation: fadeRight 1s ease 0.5s forwards;\n}\n\n.hero-title em {\n    font-style: italic;\n    color: var(--gold-bright);\n    display: block;\n}\n\n.hero-sub {\n    font-family: var(--font-sans);\n    font-size: 1rem;\n    font-weight: 400;\n    line-height: 1.8;\n    color: var(--cream-dark);\n    opacity: 0;\n    max-width: 420px;\n    animation: fadeRight 0.8s ease 0.8s forwards;\n}\n\n.hero-right {\n    position: relative;\n    background: var(--brown-deep);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    overflow: hidden;\n}\n\n.hero-pattern {\n    position: absolute;\n    inset: 0;\n    display: grid;\n    grid-template-columns: repeat(6, 1fr);\n    grid-template-rows: repeat(8, 1fr);\n    gap: 0;\n    opacity: 0.08;\n}\n\n.hero-pattern span {\n    border: 0.5px solid var(--gold);\n}\n\n.hero-center-icon {\n    position: relative;\n    z-index: 2;\n    width: 140px;\n    height: 140px;\n    color: var(--gold);\n    opacity: 0;\n    animation: scaleIn 1.2s ease 0.6s forwards;\n}\n\n.hero-center-icon svg {\n    width: 100%;\n    height: 100%;\n}\n\n.hero-scroll-hint {\n    position: absolute;\n    bottom: 3rem;\n    right: 4rem;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 0.6rem;\n    opacity: 0;\n    animation: fadeUp 0.8s ease 1.2s forwards;\n}\n\n.scroll-line {\n    width: 1px;\n    height: 40px;\n    background: linear-gradient(180deg, var(--gold), transparent);\n    animation: scrollPulse 2s ease-in-out infinite;\n}\n\n@keyframes scrollPulse {\n    0%, 100% { opacity: 0.3; transform: scaleY(1); }\n    50%      { opacity: 0.8; transform: scaleY(1.2); }\n}\n\n.hero-scroll-hint span {\n    font-family: var(--font-mono);\n    font-size: 0.55rem;\n    letter-spacing: 0.3em;\n    text-transform: uppercase;\n    color: var(--gold-dark);\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   EDITORIAL SECTIONS\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.editorial-section {\n    display: grid;\n    grid-template-columns: 380px 1fr;\n    min-height: 70vh;\n    border-bottom: 1px solid rgba(59, 31, 16, 0.1);\n}\n\n.editorial-section--alt {\n    grid-template-columns: 1fr 380px;\n}\n\n.editorial-section--alt .section-aside {\n    order: 2;\n}\n\n.editorial-section--alt .section-content {\n    order: 1;\n}\n\n.editorial-section--alt .section-content-inner {\n    margin-left: auto;\n}\n\n\/* Aside *\/\n.section-aside {\n    background: var(--brown);\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    padding: 5rem 3.5rem;\n    position: relative;\n}\n\n.editorial-section:not(.editorial-section--alt) .section-aside::after {\n    content: '';\n    position: absolute;\n    right: 0;\n    top: 50%;\n    transform: translateY(-50%);\n    width: 1px;\n    height: 60%;\n    background: linear-gradient(180deg, transparent, var(--gold-dark), transparent);\n    opacity: 0.2;\n}\n\n.editorial-section--alt .section-aside::after {\n    content: '';\n    position: absolute;\n    left: 0;\n    top: 50%;\n    transform: translateY(-50%);\n    width: 1px;\n    height: 60%;\n    background: linear-gradient(180deg, transparent, var(--gold-dark), transparent);\n    opacity: 0.2;\n}\n\n.aside-number {\n    font-family: var(--font-display);\n    font-size: 8rem;\n    font-weight: 400;\n    color: var(--gold);\n    line-height: 0.85;\n    opacity: 0.12;\n    margin-bottom: 1.5rem;\n}\n\n.aside-label {\n    font-family: var(--font-mono);\n    font-size: 0.65rem;\n    font-weight: 500;\n    letter-spacing: 0.3em;\n    text-transform: uppercase;\n    color: var(--gold);\n    margin-bottom: 1rem;\n    position: relative;\n    padding-left: 2rem;\n}\n\n.aside-label::before {\n    content: '';\n    position: absolute;\n    left: 0;\n    top: 50%;\n    width: 14px;\n    height: 1px;\n    background: var(--gold);\n    transform: translateY(-50%);\n}\n\n.aside-title {\n    font-family: var(--font-display);\n    font-size: 2.8rem;\n    font-weight: 400;\n    line-height: 1.1;\n    color: var(--cream);\n}\n\n.aside-title em {\n    font-style: italic;\n    color: var(--gold-bright);\n}\n\n\/* Content *\/\n.section-content {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    padding: 5rem 5rem;\n}\n\n.section-content-inner {\n    max-width: 620px;\n}\n\n.content-text {\n    font-family: var(--font-sans);\n    font-size: 1rem;\n    font-weight: 400;\n    line-height: 1.85;\n    color: var(--brown-warm);\n}\n\n.content-text p + p {\n    margin-top: 1.5rem;\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   CONTACT CARDS\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.contact-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 1rem;\n    margin-top: 2.5rem;\n}\n\n.contact-card {\n    display: flex;\n    flex-direction: column;\n    gap: 0.6rem;\n    padding: 1.75rem;\n    background: var(--off-white);\n    border: 1px solid rgba(59, 31, 16, 0.08);\n    text-decoration: none;\n    color: inherit;\n    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);\n    position: relative;\n    overflow: hidden;\n}\n\n.contact-card::after {\n    content: '';\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    width: 0;\n    height: 2px;\n    background: linear-gradient(90deg, var(--gold), var(--gold-bright));\n    transition: width 0.4s ease;\n}\n\n.contact-card:hover {\n    background: #fff;\n    border-color: var(--gold-pale);\n    transform: translateY(-4px);\n    box-shadow: 0 12px 40px rgba(59, 31, 16, 0.08);\n}\n\n.contact-card:hover::after {\n    width: 100%;\n}\n\n.contact-card-icon {\n    width: 36px;\n    height: 36px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: rgba(184, 138, 74, 0.08);\n    border: 1px solid rgba(184, 138, 74, 0.15);\n    color: var(--gold);\n}\n\n.contact-card-icon svg {\n    width: 16px;\n    height: 16px;\n}\n\n.contact-card-label {\n    font-family: var(--font-mono);\n    font-size: 0.6rem;\n    font-weight: 500;\n    letter-spacing: 0.25em;\n    text-transform: uppercase;\n    color: var(--gold-dark);\n}\n\n.contact-card-value {\n    font-family: var(--font-sans);\n    font-size: 0.88rem;\n    font-weight: 400;\n    line-height: 1.6;\n    color: var(--brown-warm);\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   SCHEDULE\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.schedule-grid {\n    display: flex;\n    flex-direction: column;\n    gap: 1rem;\n}\n\n.schedule-card {\n    display: flex;\n    align-items: center;\n    gap: 2.5rem;\n    padding: 1.5rem 2rem;\n    background: var(--off-white);\n    border: 1px solid rgba(59, 31, 16, 0.08);\n    transition: all 0.3s ease;\n}\n\n.schedule-card:hover {\n    border-color: var(--gold-pale);\n    background: #fff;\n}\n\n.schedule-day {\n    font-family: var(--font-display);\n    font-size: 1.4rem;\n    font-weight: 400;\n    color: var(--brown);\n    min-width: 120px;\n}\n\n.schedule-times {\n    display: flex;\n    gap: 2rem;\n    flex-wrap: wrap;\n}\n\n.schedule-time {\n    display: flex;\n    flex-direction: column;\n    gap: 0.15rem;\n}\n\n.time-value {\n    font-family: var(--font-sans);\n    font-size: 0.9rem;\n    font-weight: 600;\n    color: var(--text-dark);\n}\n\n.time-label {\n    font-family: var(--font-mono);\n    font-size: 0.6rem;\n    letter-spacing: 0.15em;\n    color: var(--text-muted);\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   PULL QUOTE\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.pull-quote {\n    margin: 2.5rem 0;\n    padding-left: 2rem;\n    border-left: 3px solid var(--gold);\n}\n\n.pull-quote p {\n    font-family: var(--font-display);\n    font-size: 1.35rem;\n    font-style: italic;\n    line-height: 1.5;\n    color: var(--brown);\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   FORM SECTION\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.form-section {\n    background: var(--brown);\n    padding: 8rem 6rem;\n    position: relative;\n    overflow: hidden;\n}\n\n.form-section::before {\n    content: '';\n    position: absolute;\n    inset: 0;\n    background:\n        radial-gradient(ellipse at 10% 50%, rgba(184, 138, 74, 0.08) 0%, transparent 50%),\n        radial-gradient(ellipse at 90% 30%, rgba(184, 138, 74, 0.05) 0%, transparent 40%);\n    pointer-events: none;\n}\n\n.form-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 6rem;\n    position: relative;\n    z-index: 1;\n    max-width: 1400px;\n    margin: 0 auto;\n}\n\n.form-left {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n}\n\n.form-tag {\n    font-family: var(--font-mono);\n    font-size: 0.65rem;\n    font-weight: 500;\n    letter-spacing: 0.3em;\n    text-transform: uppercase;\n    color: var(--gold);\n    margin-bottom: 2rem;\n    display: flex;\n    align-items: center;\n    gap: 0.75rem;\n}\n\n.form-tag::before {\n    content: '';\n    width: 20px;\n    height: 1px;\n    background: var(--gold);\n}\n\n.form-title {\n    font-family: var(--font-display);\n    font-size: clamp(2.5rem, 4vw, 4rem);\n    font-weight: 400;\n    line-height: 1.05;\n    color: var(--cream);\n    margin-bottom: 2rem;\n}\n\n.form-title em {\n    font-style: italic;\n    color: var(--gold-bright);\n}\n\n.form-text {\n    font-family: var(--font-sans);\n    font-size: 1rem;\n    font-weight: 400;\n    line-height: 1.85;\n    color: var(--cream-dark);\n    opacity: 0.75;\n    max-width: 400px;\n}\n\n.form-note {\n    display: flex;\n    align-items: center;\n    gap: 0.6rem;\n    margin-top: 2.5rem;\n    font-family: var(--font-mono);\n    font-size: 0.7rem;\n    letter-spacing: 0.05em;\n    color: var(--gold-dark);\n}\n\n.form-note svg {\n    width: 16px;\n    height: 16px;\n    flex-shrink: 0;\n    color: var(--gold);\n    opacity: 0.6;\n}\n\n\/* \u2500\u2500 Form Card \u2500\u2500 *\/\n.form-right {\n    display: flex;\n    align-items: center;\n}\n\n.contact-form {\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    gap: 1.25rem;\n}\n\n.form-row {\n    display: flex;\n    gap: 1rem;\n}\n\n.form-row .form-group {\n    flex: 1;\n}\n\n.form-group {\n    display: flex;\n    flex-direction: column;\n    gap: 0.4rem;\n}\n\n.form-group label {\n    font-family: var(--font-mono);\n    font-size: 0.6rem;\n    font-weight: 500;\n    letter-spacing: 0.2em;\n    text-transform: uppercase;\n    color: var(--gold-dark);\n}\n\n.form-group input,\n.form-group textarea,\n.form-group select {\n    width: 100%;\n    background: rgba(184, 138, 74, 0.06);\n    border: 1px solid rgba(184, 138, 74, 0.15);\n    border-radius: 0;\n    padding: 0.85rem 1rem;\n    font-family: var(--font-sans);\n    font-size: 0.88rem;\n    font-weight: 400;\n    color: var(--cream);\n    outline: none;\n    transition: border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;\n    -webkit-appearance: none;\n    appearance: none;\n}\n\n.form-group input::placeholder,\n.form-group textarea::placeholder {\n    color: rgba(238, 230, 214, 0.3);\n}\n\n.form-group input:focus,\n.form-group textarea:focus,\n.form-group select:focus {\n    border-color: var(--gold);\n    background: rgba(184, 138, 74, 0.1);\n    box-shadow: 0 0 0 2px rgba(184, 138, 74, 0.08);\n}\n\n.form-group textarea {\n    resize: vertical;\n    line-height: 1.6;\n}\n\n.form-group select {\n    cursor: pointer;\n    background-image: url(\"data:image\/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23b88a4a' stroke-width='1.2' stroke-linecap='round'\/%3E%3C\/svg%3E\");\n    background-repeat: no-repeat;\n    background-position: right 1rem center;\n    padding-right: 2.5rem;\n    line-height: 1.5;\n    min-height: 44px;\n}\n\n.form-group select option {\n    background: var(--brown);\n    color: var(--cream);\n}\n\n\/* Submit Button *\/\n.submit-btn {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 0.75rem;\n    padding: 1rem 2rem;\n    background: var(--gold);\n    border: none;\n    border-radius: 0;\n    font-family: var(--font-sans);\n    font-size: 0.78rem;\n    font-weight: 600;\n    letter-spacing: 0.18em;\n    text-transform: uppercase;\n    color: var(--brown-deep);\n    cursor: pointer;\n    position: relative;\n    overflow: hidden;\n    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);\n    margin-top: 0.5rem;\n    align-self: flex-start;\n}\n\n.submit-btn svg {\n    width: 18px;\n    height: 18px;\n    transition: transform 0.3s ease;\n}\n\n.submit-btn:hover {\n    background: var(--gold-bright);\n    letter-spacing: 0.24em;\n    box-shadow: 0 8px 30px rgba(184, 138, 74, 0.3);\n}\n\n.submit-btn:hover svg {\n    transform: translateX(4px);\n}\n\n.submit-btn::after {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: -100%;\n    width: 100%;\n    height: 100%;\n    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.15), transparent);\n    transition: left 0.6s ease;\n}\n\n.submit-btn:hover::after {\n    left: 100%;\n}\n\n\/* \u2500\u2500 Success State \u2500\u2500 *\/\n.form-success {\n    display: none;\n    text-align: center;\n    padding: 3rem 2rem;\n    width: 100%;\n}\n\n.form-success.visible {\n    display: block;\n    animation: fadeUp 0.5s ease forwards;\n}\n\n.success-cross {\n    font-size: 2rem;\n    color: var(--gold);\n    opacity: 0.5;\n    margin-bottom: 1.5rem;\n}\n\n.form-success h3 {\n    font-family: var(--font-display);\n    font-size: 2rem;\n    font-weight: 400;\n    color: var(--cream);\n    margin-bottom: 0.75rem;\n}\n\n.form-success p {\n    font-family: var(--font-sans);\n    font-size: 0.9rem;\n    font-weight: 400;\n    color: var(--cream-dark);\n    opacity: 0.7;\n    line-height: 1.7;\n    max-width: 320px;\n    margin: 0 auto 1.5rem;\n}\n\n.reset-btn {\n    padding: 0.6rem 1.8rem;\n    background: transparent;\n    border: 1px solid rgba(184, 138, 74, 0.3);\n    font-family: var(--font-mono);\n    font-size: 0.65rem;\n    font-weight: 500;\n    letter-spacing: 0.2em;\n    text-transform: uppercase;\n    color: var(--gold);\n    cursor: pointer;\n    transition: all 0.3s ease;\n}\n\n.reset-btn:hover {\n    border-color: var(--gold);\n    background: rgba(184, 138, 74, 0.1);\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   DIVIDER\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.divider-band {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 2rem;\n    padding: 4rem 2rem;\n    background: var(--off-white);\n}\n\n.divider-band .line {\n    flex: 1;\n    max-width: 200px;\n    height: 1px;\n    background: linear-gradient(90deg, transparent, var(--gold-dark), transparent);\n    opacity: 0.3;\n}\n\n.divider-band .arch {\n    width: 40px;\n    height: 50px;\n    border: 1px solid var(--gold);\n    border-radius: 40px 40px 0 0;\n    opacity: 0.2;\n    position: relative;\n}\n\n.divider-band .arch::after {\n    content: '';\n    position: absolute;\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    width: 1px;\n    height: 60%;\n    background: var(--gold);\n    opacity: 0.5;\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   SCROLL ANIMATIONS\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n.anim.will-animate {\n    opacity: 0;\n    transform: translateY(28px);\n    transition: opacity 0.7s ease, transform 0.7s ease;\n}\n\n.anim.in-view {\n    opacity: 1;\n    transform: translateY(0);\n}\n\n.anim-right.will-animate {\n    opacity: 0;\n    transform: translateX(-30px);\n    transition: opacity 0.7s ease, transform 0.7s ease;\n}\n\n.anim-right.in-view {\n    opacity: 1;\n    transform: translateX(0);\n}\n\n[data-delay=\"1\"].will-animate { transition-delay: 0.1s; }\n[data-delay=\"2\"].will-animate { transition-delay: 0.2s; }\n[data-delay=\"3\"].will-animate { transition-delay: 0.35s; }\n[data-delay=\"4\"].will-animate { transition-delay: 0.5s; }\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   KEYFRAMES\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n@keyframes fadeRight {\n    from { opacity: 0; transform: translateX(-20px); }\n    to   { opacity: 1; transform: translateX(0); }\n}\n\n@keyframes fadeUp {\n    from { opacity: 0; transform: translateY(20px); }\n    to   { opacity: 1; transform: translateY(0); }\n}\n\n@keyframes scaleIn {\n    from { opacity: 0; transform: scale(0.85); }\n    to   { opacity: 1; transform: scale(1); }\n}\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   RESPONSIVE\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n@media (max-width: 1024px) {\n    .hero {\n        grid-template-columns: 1fr;\n        min-height: auto;\n    }\n\n    .hero-left {\n        padding: 6rem 3rem 4rem;\n    }\n\n    .hero-right {\n        min-height: 50vh;\n    }\n\n    .editorial-section {\n        grid-template-columns: 1fr !important;\n    }\n\n    .editorial-section .section-aside {\n        order: 0 !important;\n        padding: 4rem 3rem;\n    }\n\n    .editorial-section .section-content {\n        order: 1 !important;\n        padding: 3rem 3rem 4rem;\n    }\n\n    .editorial-section--alt .section-content-inner {\n        margin-left: 0;\n    }\n\n    .section-aside::after {\n        display: none !important;\n    }\n\n    .form-section {\n        padding: 5rem 3rem;\n    }\n\n    .form-grid {\n        grid-template-columns: 1fr;\n        gap: 3rem;\n    }\n\n    .contact-grid {\n        grid-template-columns: 1fr 1fr;\n    }\n}\n\n@media (max-width: 600px) {\n    .hero-left {\n        padding: 5rem 1.5rem 3rem;\n    }\n\n    .hero-title {\n        font-size: 2.8rem;\n    }\n\n    .section-aside {\n        padding: 3rem 1.5rem !important;\n    }\n\n    .aside-number {\n        font-size: 5rem;\n    }\n\n    .aside-title {\n        font-size: 2rem;\n    }\n\n    .section-content {\n        padding: 2.5rem 1.5rem 3rem !important;\n    }\n\n    .contact-grid {\n        grid-template-columns: 1fr;\n    }\n\n    .schedule-card {\n        flex-direction: column;\n        align-items: flex-start;\n        gap: 1rem;\n    }\n\n    .form-section {\n        padding: 4rem 1.5rem;\n    }\n\n    .form-row {\n        flex-direction: column;\n        gap: 0;\n    }\n\n    .hero-scroll-hint {\n        display: none;\n    }\n}\n<\/style>\n\n<script data-wp-block-html=\"js\">\n(function () {\n    'use strict';\n\n    \/\/ \u2500\u2500 Scroll Reveal \u2500\u2500\n    var animElements = document.querySelectorAll('.anim, .anim-right');\n\n    animElements.forEach(function (el) {\n        el.classList.add('will-animate');\n    });\n\n    if ('IntersectionObserver' in window) {\n        var observer = new IntersectionObserver(\n            function (entries) {\n                entries.forEach(function (entry) {\n                    if (entry.isIntersecting) {\n                        entry.target.classList.add('in-view');\n                        observer.unobserve(entry.target);\n                    }\n                });\n            },\n            { threshold: 0.1, rootMargin: '0px 0px -50px 0px' }\n        );\n\n        animElements.forEach(function (el) {\n            observer.observe(el);\n        });\n    } else {\n        animElements.forEach(function (el) {\n            el.classList.add('in-view');\n        });\n    }\n\n    setTimeout(function () {\n        animElements.forEach(function (el) {\n            if (!el.classList.contains('in-view')) {\n                el.classList.add('in-view');\n            }\n        });\n    }, 3000);\n\n    \/\/ \u2500\u2500 Form Handling \u2500\u2500\n    var form = document.getElementById('contactForm');\n    var success = document.getElementById('formSuccess');\n    var resetBtn = document.getElementById('resetBtn');\n\n    form.addEventListener('submit', function (e) {\n        e.preventDefault();\n\n        var btn = form.querySelector('.submit-btn');\n        btn.innerHTML = '<span>Sending...<\/span>';\n        btn.disabled = true;\n        btn.style.opacity = '0.6';\n\n        setTimeout(function () {\n            form.style.display = 'none';\n            success.classList.add('visible');\n        }, 1200);\n    });\n\n    resetBtn.addEventListener('click', function () {\n        success.classList.remove('visible');\n        form.style.display = 'flex';\n        form.reset();\n\n        var btn = form.querySelector('.submit-btn');\n        btn.innerHTML = '<span>Send Message<\/span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"\/><polyline points=\"12 5 19 12 12 19\"\/><\/svg>';\n        btn.disabled = false;\n        btn.style.opacity = '1';\n    });\n})();\n<\/script>\n\n<meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Contact Us \u2014 Holy Cross Parish Church<\/title>\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=Instrument+Serif:ital@0;1&amp;family=DM+Mono:wght@300;400;500&amp;family=Syne:wght@400;500;600;700;800&amp;display=swap\" rel=\"stylesheet\">\n    <link rel=\"stylesheet\" href=\"contact.css\">\n\n\n\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 HERO \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n    <header class=\"hero\">\n        <div class=\"hero-left\">\n            <div class=\"hero-tag\">Reach Out<\/div>\n            <h1 class=\"hero-title\">\n                Get in\n                <em>Touch<\/em>\n            <\/h1>\n            <p class=\"hero-sub\">\n                We welcome you to connect with our parish community.\n                Whether through prayer, service, or fellowship \u2014\n                we are here for you.\n            <\/p>\n        <\/div>\n\n        <div class=\"hero-right\">\n            <div class=\"hero-pattern\">\n                <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n                <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n                <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n                <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n                <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n                <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n                <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n                <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\n            <\/div>\n            <div class=\"hero-center-icon\">\n                <svg viewBox=\"0 0 80 80\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                    <rect x=\"4\" y=\"12\" width=\"72\" height=\"52\" rx=\"4\"><\/rect>\n                    <polyline points=\"4,12 40,44 76,12\"><\/polyline>\n                    <line x1=\"4\" y1=\"64\" x2=\"28\" y2=\"40\"><\/line>\n                    <line x1=\"76\" y1=\"64\" x2=\"52\" y2=\"40\"><\/line>\n                <\/svg>\n            <\/div>\n            <div class=\"hero-scroll-hint\">\n                <div class=\"scroll-line\"><\/div>\n                <span>Scroll<\/span>\n            <\/div>\n        <\/div>\n    <\/header>\n\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CONTACT INFO \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n    <section class=\"editorial-section\">\n        <div class=\"section-aside\">\n            <div class=\"aside-number anim-right\">01<\/div>\n            <p class=\"aside-label anim-right\" data-delay=\"1\">Reach Us<\/p>\n            <h2 class=\"aside-title anim-right\" data-delay=\"2\">Parish<br><em>Information<\/em><\/h2>\n        <\/div>\n        <div class=\"section-content\">\n            <div class=\"section-content-inner\">\n                <div class=\"content-text anim\" data-delay=\"2\">\n                    <p>The Holy Cross Parish Church welcomes all inquiries, prayer requests, and messages from our community. Our parish office is ready to assist you with sacramental services, event inquiries, and pastoral care.<\/p>\n                <\/div>\n\n                <div class=\"contact-grid anim\" data-delay=\"3\">\n                    <a href=\"https:\/\/maps.google.com\/?q=Holy+Cross+Parish+Church+Quezon+Philippines\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"contact-card\">\n                        <div class=\"contact-card-icon\">\n                            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                                <path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\"><\/path>\n                                <circle cx=\"12\" cy=\"10\" r=\"3\"><\/circle>\n                            <\/svg>\n                        <\/div>\n                        <div class=\"contact-card-label\">Visit Us<\/div>\n                        <div class=\"contact-card-value\">Municipality of Quezon,<br>Philippines<\/div>\n                    <\/a>\n\n                    <a href=\"tel:+639XXXXXXXX\" class=\"contact-card\">\n                        <div class=\"contact-card-icon\">\n                            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                                <path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z\"><\/path>\n                            <\/svg>\n                        <\/div>\n                        <div class=\"contact-card-label\">Call Us<\/div>\n                        <div class=\"contact-card-value\">+63 9XX XXX XXXX<\/div>\n                    <\/a>\n\n                    <a href=\"mailto:hcpcentennial@gmail.com\" class=\"contact-card\">\n                        <div class=\"contact-card-icon\">\n                            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                                <rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"><\/rect>\n                                <polyline points=\"22,4 12,13 2,4\"><\/polyline>\n                            <\/svg>\n                        <\/div>\n                        <div class=\"contact-card-label\">Email Us<\/div>\n                        <div class=\"contact-card-value\">hcpcentennial@gmail.com<\/div>\n                    <\/a>\n\n                    <a href=\"https:\/\/www.facebook.com\/HCPQuezon\/?ref=embed_page\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"contact-card\">\n                        <div class=\"contact-card-icon\">\n                            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                                <path d=\"M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z\"><\/path>\n                            <\/svg>\n                        <\/div>\n                        <div class=\"contact-card-label\">Follow Us<\/div>\n                        <div class=\"contact-card-value\">Holy Cross Parish on Facebook<\/div>\n                    <\/a>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 DIVIDER \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n    <div class=\"divider-band\">\n        <div class=\"line\"><\/div>\n        <div class=\"arch\"><\/div>\n        <div class=\"line\"><\/div>\n    <\/div>\n\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 SERVICE HOURS \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n    <section class=\"editorial-section editorial-section--alt\">\n        <div class=\"section-aside\">\n            <div class=\"aside-number anim-right\">02<\/div>\n            <p class=\"aside-label anim-right\" data-delay=\"1\">Worship<\/p>\n            <h2 class=\"aside-title anim-right\" data-delay=\"2\">Service<br><em>Schedule<\/em><\/h2>\n        <\/div>\n        <div class=\"section-content\">\n            <div class=\"section-content-inner\">\n                <div class=\"schedule-grid anim\" data-delay=\"2\">\n                    <div class=\"schedule-card\">\n                        <div class=\"schedule-day\">Sunday<\/div>\n                        <div class=\"schedule-times\">\n                            <div class=\"schedule-time\">\n                                <span class=\"time-value\">8:00 AM<\/span>\n                                <span class=\"time-label\">Holy Mass<\/span>\n                            <\/div>\n                            <div class=\"schedule-time\">\n                                <span class=\"time-value\">10:30 AM<\/span>\n                                <span class=\"time-label\">Holy Mass<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"schedule-card\">\n                        <div class=\"schedule-day\">Wednesday<\/div>\n                        <div class=\"schedule-times\">\n                            <div class=\"schedule-time\">\n                                <span class=\"time-value\">6:00 PM<\/span>\n                                <span class=\"time-label\">Prayer Service<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                    <div class=\"schedule-card\">\n                        <div class=\"schedule-day\">Friday<\/div>\n                        <div class=\"schedule-times\">\n                            <div class=\"schedule-time\">\n                                <span class=\"time-value\">6:00 PM<\/span>\n                                <span class=\"time-label\">Novenas &amp; Devotions<\/span>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n\n                <div class=\"pull-quote anim\" data-delay=\"3\">\n                    <p>The parish office is open Monday through Saturday, 8:00 AM to 5:00 PM for sacramental inquiries and pastoral assistance.<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 DIVIDER \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n    <div class=\"divider-band\">\n        <div class=\"line\"><\/div>\n        <div class=\"arch\"><\/div>\n        <div class=\"line\"><\/div>\n    <\/div>\n\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CONTACT FORM \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n    <section class=\"form-section\">\n        <div class=\"form-grid\">\n            <div class=\"form-left\">\n                <div class=\"form-tag anim\">Send a Message<\/div>\n                <h2 class=\"form-title anim\" data-delay=\"1\">\n                    We&#8217;d Love to<br><em>Hear from You<\/em>\n                <\/h2>\n                <div class=\"form-text anim\" data-delay=\"2\">\n                    <p>Whether you have a question, a prayer request, or simply wish to connect \u2014 fill out the form and our parish team will respond promptly.<\/p>\n                <\/div>\n                <div class=\"form-note anim\" data-delay=\"3\">\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <path d=\"M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z\"><\/path>\n                    <\/svg>\n                    <span>Your message matters to us. God bless you.<\/span>\n                <\/div>\n            <\/div>\n\n            <div class=\"form-right\">\n                <form id=\"contactForm\" class=\"contact-form anim\" data-delay=\"2\">\n                    <div class=\"form-row\">\n                        <div class=\"form-group\">\n                            <label for=\"firstName\">First Name<\/label>\n                            <input type=\"text\" id=\"firstName\" name=\"firstName\" placeholder=\"Your first name\" required=\"\">\n                        <\/div>\n                        <div class=\"form-group\">\n                            <label for=\"lastName\">Last Name<\/label>\n                            <input type=\"text\" id=\"lastName\" name=\"lastName\" placeholder=\"Your last name\" required=\"\">\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"form-group\">\n                        <label for=\"email\">Email Address<\/label>\n                        <input type=\"email\" id=\"email\" name=\"email\" placeholder=\"you@example.com\" required=\"\">\n                    <\/div>\n\n                    <div class=\"form-group\">\n                        <label for=\"subject\">Subject<\/label>\n                        <select id=\"subject\" name=\"subject\" required=\"\">\n                            <option value=\"\" disabled=\"\" selected=\"\">Select a topic<\/option>\n                            <option value=\"general\">General Inquiry<\/option>\n                            <option value=\"prayer\">Prayer Request<\/option>\n                            <option value=\"volunteer\">Volunteering<\/option>\n                            <option value=\"events\">Events &amp; Programs<\/option>\n                            <option value=\"pastoral\">Pastoral Care<\/option>\n                        <\/select>\n                    <\/div>\n\n                    <div class=\"form-group\">\n                        <label for=\"message\">Message<\/label>\n                        <textarea id=\"message\" name=\"message\" placeholder=\"Share your thoughts or request...\" rows=\"5\" required=\"\"><\/textarea>\n                    <\/div>\n\n                    <button type=\"submit\" class=\"submit-btn\">\n                        <span>Send Message<\/span>\n                        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                            <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"><\/line>\n                            <polyline points=\"12 5 19 12 12 19\"><\/polyline>\n                        <\/svg>\n                    <\/button>\n                <\/form>\n\n                <div class=\"form-success\" id=\"formSuccess\">\n                    <div class=\"success-cross\">\u271d<\/div>\n                    <h3>Message Sent<\/h3>\n                    <p>Thank you for reaching out. We&#8217;ll be in touch soon. May God bless you.<\/p>\n                    <button type=\"button\" class=\"reset-btn\" id=\"resetBtn\">Send Another<\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <script src=\"contact.js\"><\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Contact Us \u2014 Holy Cross Parish Church Reach Out Get in Touch We welcome you to connect with our parish [&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":"Contact Us - Holy Cross Parish","description":"Contact Us \u2014 Holy Cross Parish Church Reach Out Get in Touch We welcome you to connect with our parish community. Whether through prayer, service, or fellowship"},"footnotes":""},"class_list":["post-18","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":"phwpywadsa623","author_link":"https:\/\/demo4.yinwoodweb.com\/quezon\/blog\/author\/phwpywadsa623\/"},"uagb_comment_info":0,"uagb_excerpt":"Contact Us \u2014 Holy Cross Parish Church Reach Out Get in Touch We welcome you to connect with our parish [&hellip;]","_links":{"self":[{"href":"https:\/\/demo4.yinwoodweb.com\/quezon\/wp-json\/wp\/v2\/pages\/18","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo4.yinwoodweb.com\/quezon\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo4.yinwoodweb.com\/quezon\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo4.yinwoodweb.com\/quezon\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/demo4.yinwoodweb.com\/quezon\/wp-json\/wp\/v2\/comments?post=18"}],"version-history":[{"count":27,"href":"https:\/\/demo4.yinwoodweb.com\/quezon\/wp-json\/wp\/v2\/pages\/18\/revisions"}],"predecessor-version":[{"id":1089,"href":"https:\/\/demo4.yinwoodweb.com\/quezon\/wp-json\/wp\/v2\/pages\/18\/revisions\/1089"}],"wp:attachment":[{"href":"https:\/\/demo4.yinwoodweb.com\/quezon\/wp-json\/wp\/v2\/media?parent=18"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}