{"id":2990,"date":"2023-05-08T11:36:51","date_gmt":"2023-05-08T11:36:51","guid":{"rendered":"https:\/\/themepanthers.com\/wp\/copygen\/v1\/?page_id=2990"},"modified":"2026-05-16T06:45:08","modified_gmt":"2026-05-16T06:45:08","slug":"contact","status":"publish","type":"page","link":"https:\/\/gramiewer.com\/contact\/","title":{"rendered":"Contact"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2990\" class=\"elementor elementor-2990\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6da5eca e-con-full e-flex e-con e-parent\" data-id=\"6da5eca\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7b203aa elementor-widget elementor-widget-shortcode\" data-id=\"7b203aa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><style>\r\n    \/* ============================================\r\n       ROOT VARIABLES - Contact Us Page\r\n       Prefix: --contact-us-\r\n       ============================================ *\/\r\n    :root {\r\n        --contact-us-primary: #9D45EF;\r\n        --contact-us-accent: #9D45EF87;\r\n        --contact-us-primary-light: #C08EF0;\r\n        --contact-us-primary-dark: #7D35D8;\r\n        --contact-us-primary-rgb: 157, 69, 239;\r\n        --contact-us-brand-secondary: #C08EF0;\r\n        --contact-us-brand-secondary-rgb: 192, 142, 240;\r\n        --contact-us-secondary: #C08EF0;\r\n        --contact-us-secondary-light: #D6B4F5;\r\n        --contact-us-secondary-dark: #A56CEB;\r\n        --contact-us-ink: #1a0f28;\r\n        --contact-us-ink-mid: #2a1a3d;\r\n        --contact-us-ink-deep: #110618;\r\n        --contact-us-white: #FFFFFF;\r\n        --contact-us-gray-50: #F8F9FC;\r\n        --contact-us-gray-100: #F1F3F8;\r\n        --contact-us-gray-200: #E2E6EF;\r\n        --contact-us-gray-300: #CDD3E0;\r\n        --contact-us-gray-400: #9BA3B5;\r\n        --contact-us-gray-500: #6B7280;\r\n        --contact-us-gray-600: #4B5563;\r\n        --contact-us-gray-700: #374151;\r\n        --contact-us-gray-800: #1F2937;\r\n        --contact-us-gray-900: #111827;\r\n        --contact-us-success: #10B981;\r\n        --contact-us-warning: #F59E0B;\r\n        --contact-us-danger: #EF4444;\r\n        --contact-us-glass-bg: rgba(255, 255, 255, 0.08);\r\n        --contact-us-glass-border: rgba(255, 255, 255, 0.15);\r\n        --contact-us-glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);\r\n        --contact-us-card-shadow: 0 4px 24px rgba(236, 72, 153, 0.12);\r\n        --contact-us-card-shadow-hover: 0 12px 40px rgba(236, 72, 153, 0.22);\r\n        --contact-us-transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n        --contact-us-radius-sm: 8px;\r\n        --contact-us-radius-md: 14px;\r\n        --contact-us-radius-lg: 20px;\r\n        --contact-us-radius-xl: 28px;\r\n        --contact-us-max-width: 1300px;\r\n        --contact-us-font: 'Inter', sans-serif;\r\n    }\r\n  \r\n    \/* ============================================\r\n       BASE RESET & TYPOGRAPHY\r\n       ============================================ *\/\r\n  \r\n    .contact-us-wrapper {\r\n        max-width: var(--contact-us-max-width);\r\n        margin: 0 auto;\r\n        padding: 0 20px;\r\n    }\r\n  \r\n    \/* ============================================\r\n       SECTION 1: HERO BANNER\r\n       ============================================ *\/\r\n    .contact-us-hero {\r\n        position: relative;\r\n        background: linear-gradient(130deg, #6b14bc 0%, #38224c 100%);\r\n        padding: 80px 0 90px;\r\n        overflow: hidden;\r\n        color: #ffffff;\r\n        border-radius: 0 0 40px 40px;\r\n    }\r\n  \r\n    .contact-us-hero::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: -120px;\r\n        right: -80px;\r\n        width: 450px;\r\n        height: 450px;\r\n        background: radial-gradient(circle, rgba(255, 255, 255, 0.22) 0%, transparent 70%);\r\n        border-radius: 50%;\r\n        filter: blur(60px);\r\n        pointer-events: none;\r\n        animation: contact-us-float 8s ease-in-out infinite;\r\n    }\r\n  \r\n    .contact-us-hero::after {\r\n        content: '';\r\n        position: absolute;\r\n        bottom: -100px;\r\n        left: -60px;\r\n        width: 350px;\r\n        height: 350px;\r\n        background: radial-gradient(circle, rgba(255, 255, 255, 0.12) 0%, transparent 70%);\r\n        border-radius: 50%;\r\n        filter: blur(50px);\r\n        pointer-events: none;\r\n        animation: contact-us-float 10s ease-in-out infinite reverse;\r\n    }\r\n  \r\n    @keyframes contact-us-float {\r\n        0%, 100% { transform: translateY(0) scale(1); }\r\n        50% { transform: translateY(-30px) scale(1.05); }\r\n    }\r\n  \r\n    .contact-us-hero-grid {\r\n        display: grid;\r\n        grid-template-columns: 1fr 1fr;\r\n        gap: 60px;\r\n        align-items: center;\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n  \r\n    .contact-us-hero-content {\r\n        color: var(--contact-us-white);\r\n    }\r\n  \r\n    .contact-us-hero-badge {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 8px;\r\n        background: rgba(255, 255, 255, 0.12);\r\n        backdrop-filter: blur(10px);\r\n        border: 1px solid rgba(255, 255, 255, 0.2);\r\n        padding: 8px 18px;\r\n        border-radius: 50px;\r\n        font-size: 13px;\r\n        font-weight: 500;\r\n        letter-spacing: 0.5px;\r\n        margin-bottom: 24px;\r\n        color: var(--contact-us-white);\r\n    }\r\n  \r\n    .contact-us-hero-badge i {\r\n        color: #e9d5ff;\r\n        font-size: 16px;\r\n    }\r\n  \r\n    .contact-us-hero-title {\r\n        font-size: clamp(32px, 4vw, 52px);\r\n        font-weight: 800;\r\n        line-height: 1.15;\r\n        margin-bottom: 20px;\r\n        letter-spacing: -0.5px;\r\n        color: #ffffff;\r\n    }\r\n  \r\n    .contact-us-hero-title span {\r\n        background: linear-gradient(135deg, #ffffff 0%, #fae8ff 45%, #f5d0fe 100%);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        background-clip: text;\r\n    }\r\n  \r\n    .contact-us-hero-subtitle {\r\n        font-size: 17px;\r\n        font-weight: 400;\r\n        line-height: 1.8;\r\n        color: rgba(255, 255, 255, 0.92);\r\n        margin-bottom: 36px;\r\n        max-width: 460px;\r\n    }\r\n  \r\n    .contact-us-hero-stats {\r\n        display: flex;\r\n        gap: 36px;\r\n    }\r\n  \r\n    .contact-us-hero-stat {\r\n        text-align: center;\r\n    }\r\n  \r\n    .contact-us-hero-stat-number {\r\n        font-size: 32px;\r\n        font-weight: 800;\r\n        line-height: 1;\r\n        margin-bottom: 4px;\r\n        background: linear-gradient(180deg, var(--contact-us-white) 0%, rgba(255,255,255,0.7) 100%);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        background-clip: text;\r\n    }\r\n  \r\n    .contact-us-hero-stat-label {\r\n        font-size: 12px;\r\n        font-weight: 600;\r\n        color: rgba(255, 255, 255, 0.8);\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n  \r\n    .contact-us-hero-image {\r\n        position: relative;\r\n        display: flex;\r\n        justify-content: center;\r\n    }\r\n  \r\n    .contact-us-hero-image-wrapper {\r\n        position: relative;\r\n        width: 100%;\r\n        max-width: 440px;\r\n    }\r\n  \r\n    .contact-us-hero-image-wrapper img {\r\n        width: 100%;\r\n        border-radius: var(--contact-us-radius-xl);\r\n        object-fit: cover;\r\n        position: relative;\r\n        z-index: 2;\r\n        border: 3px solid rgba(255, 255, 255, 0.15);\r\n        box-shadow: 0 30px 60px rgba(0, 0, 0, 0.3);\r\n    }\r\n  \r\n    .contact-us-hero-image-bg {\r\n        position: absolute;\r\n        inset: 15px -15px -15px 15px;\r\n        border-radius: var(--contact-us-radius-xl);\r\n        border: 2px dashed rgba(255, 255, 255, 0.15);\r\n        z-index: 1;\r\n    }\r\n  \r\n    .contact-us-hero-floating-card {\r\n        position: absolute;\r\n        background: linear-gradient(135deg, rgba(255, 255, 255, 0.24), rgba(226, 196, 255, 0.14));\r\n        backdrop-filter: blur(18px);\r\n        border: 1px solid rgba(255, 255, 255, 0.34);\r\n        border-radius: var(--contact-us-radius-md);\r\n        padding: 14px 18px;\r\n        z-index: 3;\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 10px;\r\n        color: var(--contact-us-white);\r\n        font-size: 13px;\r\n        font-weight: 500;\r\n        box-shadow: 0 12px 30px rgba(8, 5, 18, 0.28);\r\n    }\r\n  \r\n    .contact-us-hero-floating-card strong {\r\n        color: var(--contact-us-white);\r\n    }\r\n  \r\n    .contact-us-hero-floating-card span {\r\n        color: rgba(255, 255, 255, 0.88);\r\n        opacity: 1 !important;\r\n    }\r\n  \r\n    .contact-us-hero-floating-card.top-left {\r\n        top: 20px;\r\n        left: -135px;\r\n        animation: contact-us-card-float 4s ease-in-out infinite;\r\n    }\r\n  \r\n    .contact-us-hero-floating-card.bottom-right {\r\n        bottom: 30px;\r\n        right: -180px;\r\n        animation: contact-us-card-float 5s ease-in-out infinite reverse;\r\n    }\r\n  \r\n    .contact-us-hero-floating-card i {\r\n        font-size: 22px;\r\n        color: var(--contact-us-primary-light);\r\n    }\r\n  \r\n    @keyframes contact-us-card-float {\r\n        0%, 100% { transform: translateY(0); }\r\n        50% { transform: translateY(-10px); }\r\n    }\r\n  \r\n    \/* Decorative dots *\/\r\n    .contact-us-hero-dots {\r\n        position: absolute;\r\n        z-index: 1;\r\n    }\r\n  \r\n    .contact-us-hero-dots.top-right {\r\n        top: 30px;\r\n        right: 40px;\r\n    }\r\n  \r\n    .contact-us-hero-dots.bottom-left {\r\n        bottom: 40px;\r\n        left: 30px;\r\n    }\r\n  \r\n    .contact-us-hero-dots span {\r\n        display: block;\r\n        width: 6px;\r\n        height: 6px;\r\n        background: rgba(255, 255, 255, 0.2);\r\n        border-radius: 50%;\r\n        margin: 6px 0;\r\n    }\r\n  \r\n    .contact-us-hero-dots span:nth-child(2) { margin-left: 12px; }\r\n    .contact-us-hero-dots span:nth-child(3) { margin-left: 6px; }\r\n  \r\n    \/* ============================================\r\n       SECTION 2: CONTACT INFO CARDS\r\n       ============================================ *\/\r\n    .contact-us-info-section {\r\n        padding: 80px 0 20px;\r\n        margin-top: -45px;\r\n        position: relative;\r\n        z-index: 5;\r\n    }\r\n  \r\n    .contact-us-info-grid {\r\n        display: grid;\r\n        grid-template-columns: repeat(4, 1fr);\r\n        gap: 20px;\r\n    }\r\n  \r\n    .contact-us-info-card {\r\n        background: var(--contact-us-white);\r\n        border-radius: var(--contact-us-radius-lg);\r\n        padding: 32px 24px;\r\n        text-align: center;\r\n        border: 1px solid var(--contact-us-gray-200);\r\n        transition: var(--contact-us-transition);\r\n        cursor: default;\r\n        position: relative;\r\n  \/*         overflow: hidden; *\/\r\n    }\r\n  \r\n    .contact-us-info-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        right: 0;\r\n        height: 4px;\r\n        background: linear-gradient(90deg, var(--contact-us-primary), var(--contact-us-primary-light));\r\n        transform: scaleX(0);\r\n        transition: transform 0.4s ease;\r\n    }\r\n  \r\n    .contact-us-info-card:hover::before {\r\n        transform: scaleX(1);\r\n    }\r\n  \r\n    .contact-us-info-card:hover {\r\n        transform: translateY(-8px);\r\n        box-shadow: var(--contact-us-card-shadow-hover);\r\n        border-color: transparent;\r\n    }\r\n  \r\n    .contact-us-info-card-icon {\r\n        width: 64px;\r\n        height: 64px;\r\n        border-radius: var(--contact-us-radius-md);\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 28px;\r\n        margin-bottom: 18px;\r\n        transition: var(--contact-us-transition);\r\n    }\r\n  \r\n    .contact-us-info-card:nth-child(1) .contact-us-info-card-icon {\r\n        background: linear-gradient(135deg, rgba(var(--contact-us-primary-rgb), 0.12), rgba(var(--contact-us-primary-rgb), 0.05));\r\n        color: var(--contact-us-primary);\r\n    }\r\n  \r\n    .contact-us-info-card:nth-child(2) .contact-us-info-card-icon {\r\n        background: linear-gradient(135deg, rgba(16,185,129,0.1), rgba(16,185,129,0.05));\r\n        color: var(--contact-us-success);\r\n    }\r\n  \r\n    .contact-us-info-card:nth-child(3) .contact-us-info-card-icon {\r\n        background: linear-gradient(135deg, rgba(245,158,11,0.1), rgba(245,158,11,0.05));\r\n        color: var(--contact-us-warning);\r\n    }\r\n  \r\n    .contact-us-info-card:nth-child(4) .contact-us-info-card-icon {\r\n        background: linear-gradient(135deg, rgba(59,130,246,0.1), rgba(59,130,246,0.05));\r\n        color: #3B82F6;\r\n    }\r\n  \r\n    .contact-us-info-card:hover .contact-us-info-card-icon {\r\n        transform: scale(1.1) rotate(-5deg);\r\n    }\r\n  \r\n    .contact-us-info-card-title {\r\n        font-size: 16px;\r\n        font-weight: 700;\r\n        color: var(--contact-us-gray-900);\r\n        margin-bottom: 8px;\r\n    }\r\n  \r\n    .contact-us-info-card-text {\r\n        font-size: 14px;\r\n        color: var(--contact-us-gray-500);\r\n        line-height: 1.6;\r\n        margin-bottom: 12px;\r\n    }\r\n  \r\n    .contact-us-info-card-value {\r\n        font-size: 15px;\r\n        font-weight: 600;\r\n        color: var(--contact-us-primary);\r\n        text-decoration: none;\r\n        transition: var(--contact-us-transition);\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 6px;\r\n    }\r\n  \r\n    .contact-us-info-card-value:hover {\r\n        color: var(--contact-us-primary-dark);\r\n        gap: 10px;\r\n    }\r\n  \r\n    \/* ============================================\r\n       SECTION 3: MAIN CONTACT SECTION\r\n       ============================================ *\/\r\n    .contact-us-main-section {\r\n        padding: 80px 0;\r\n    }\r\n  \r\n    .contact-us-section-header {\r\n        text-align: center;\r\n        margin-bottom: 56px;\r\n    }\r\n  \r\n    .contact-us-section-label {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 8px;\r\n        font-size: 13px;\r\n        font-weight: 600;\r\n        text-transform: uppercase;\r\n        letter-spacing: 2px;\r\n        color: var(--contact-us-primary);\r\n        margin-bottom: 14px;\r\n    }\r\n  \r\n    .contact-us-section-label::before,\r\n    .contact-us-section-label::after {\r\n        content: '';\r\n        width: 30px;\r\n        height: 2px;\r\n        background: linear-gradient(90deg, var(--contact-us-primary), transparent);\r\n        border-radius: 2px;\r\n    }\r\n  \r\n    .contact-us-section-label::after {\r\n        background: linear-gradient(90deg, transparent, var(--contact-us-primary));\r\n    }\r\n  \r\n    .contact-us-section-title {\r\n        font-size: clamp(28px, 3.5vw, 40px);\r\n        font-weight: 800;\r\n        color: var(--contact-us-gray-900);\r\n        margin-bottom: 14px;\r\n        letter-spacing: -0.3px;\r\n    }\r\n  \r\n    .contact-us-section-desc {\r\n        font-size: 16px;\r\n        color: var(--contact-us-gray-500);\r\n        max-width: 560px;\r\n        margin: 0 auto;\r\n        line-height: 1.8;\r\n    }\r\n  \r\n    .contact-us-main-grid {\r\n        display: grid;\r\n        grid-template-columns: 1.15fr 0.85fr;\r\n        gap: 48px;\r\n        align-items: start;\r\n    }\r\n  \r\n    \/* FORM STYLES *\/\r\n    .contact-us-form-card {\r\n        background: var(--contact-us-white);\r\n        border-radius: var(--contact-us-radius-lg);\r\n        padding: 44px;\r\n        border: 1px solid var(--contact-us-gray-200);\r\n        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);\r\n    }\r\n  \r\n    .contact-us-form-title {\r\n        font-size: 22px;\r\n        font-weight: 700;\r\n        color: var(--contact-us-gray-900);\r\n        margin-bottom: 6px;\r\n    }\r\n  \r\n    .contact-us-form-subtitle {\r\n        font-size: 14px;\r\n        color: var(--contact-us-gray-400);\r\n        margin-bottom: 30px;\r\n    }\r\n  \r\n    .contact-us-form-row {\r\n        display: grid;\r\n        grid-template-columns: 1fr 1fr;\r\n        gap: 18px;\r\n    }\r\n  \r\n    .contact-us-form-group {\r\n        margin-bottom: 20px;\r\n    }\r\n  \r\n    .contact-us-form-group label {\r\n        display: block;\r\n        font-size: 13px;\r\n        font-weight: 600;\r\n        color: var(--contact-us-gray-700);\r\n        margin-bottom: 8px;\r\n        letter-spacing: 0.3px;\r\n    }\r\n  \r\n    .contact-us-form-group label .required {\r\n        color: var(--contact-us-danger);\r\n        margin-left: 2px;\r\n    }\r\n  \r\n    .contact-us-form-control {\r\n        width: 100%;\r\n        padding: 13px 18px;\r\n        font-size: 14px;\r\n        font-family: var(--contact-us-font);\r\n        color: var(--contact-us-gray-800);\r\n        background: var(--contact-us-gray-50);\r\n        border: 2px solid var(--contact-us-gray-200);\r\n        border-radius: var(--contact-us-radius-sm);\r\n        outline: none;\r\n        transition: var(--contact-us-transition);\r\n    }\r\n  \r\n    .contact-us-form-control::placeholder {\r\n        color: var(--contact-us-gray-400);\r\n    }\r\n  \r\n    .contact-us-form-control:focus {\r\n        border-color: var(--contact-us-primary);\r\n        background: var(--contact-us-white);\r\n        box-shadow: 0 0 0 4px rgba(var(--contact-us-primary-rgb), 0.1);\r\n    }\r\n  \r\n    textarea.contact-us-form-control {\r\n        resize: vertical;\r\n        min-height: 130px;\r\n    }\r\n  \r\n    select.contact-us-form-control {\r\n        cursor: pointer;\r\n        appearance: none;\r\n        background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='16' height='16' viewBox='0 0 24 24' fill='%236B7280'%3E%3Cpath d='M7 10l5 5 5-5z'\/%3E%3C\/svg%3E\");\r\n        background-repeat: no-repeat;\r\n        background-position: right 14px center;\r\n        padding-right: 40px;\r\n    }\r\n  \r\n    .contact-us-form-submit {\r\n        width: 100%;\r\n        padding: 15px 32px;\r\n        font-size: 15px;\r\n        font-weight: 700;\r\n        font-family: var(--contact-us-font);\r\n        color: var(--contact-us-white);\r\n        background: linear-gradient(135deg, var(--contact-us-primary), var(--contact-us-primary-dark));\r\n        border: none;\r\n        border-radius: var(--contact-us-radius-sm);\r\n        cursor: pointer;\r\n        transition: var(--contact-us-transition);\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        gap: 10px;\r\n        letter-spacing: 0.3px;\r\n        position: relative;\r\n        overflow: hidden;\r\n    }\r\n  \r\n    .contact-us-form-submit::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0;\r\n        left: -100%;\r\n        width: 100%;\r\n        height: 100%;\r\n        background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);\r\n        transition: left 0.6s ease;\r\n    }\r\n  \r\n    .contact-us-form-submit:hover::before {\r\n        left: 100%;\r\n    }\r\n  \r\n    .contact-us-form-submit:hover {\r\n        transform: translateY(-2px);\r\n        box-shadow: 0 8px 25px rgba(var(--contact-us-primary-rgb), 0.35);\r\n    }\r\n  \r\n    .contact-us-form-submit:active {\r\n        transform: translateY(0);\r\n    }\r\n  \r\n    .contact-us-form-note {\r\n        text-align: center;\r\n        margin-top: 16px;\r\n        font-size: 12px;\r\n        color: var(--contact-us-gray-400);\r\n    }\r\n  \r\n    .contact-us-form-note i {\r\n        color: var(--contact-us-success);\r\n    }\r\n  \r\n    \/* Contact Form 7 custom skin *\/\r\n    .contact-us-cf7 .wpcf7 {\r\n        width: 100%;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-form p {\r\n        margin: 0 0 18px;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-form p:last-of-type {\r\n        margin-bottom: 0;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-form label {\r\n        display: block;\r\n        font-size: 13px;\r\n        font-weight: 600;\r\n        color: var(--contact-us-gray-700);\r\n        margin-bottom: 8px;\r\n        letter-spacing: 0.3px;\r\n    }\r\n  \r\n    .contact-us-cf7 .required {\r\n        color: var(--contact-us-danger);\r\n        margin-left: 2px;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-form-control:not(.wpcf7-submit) {\r\n        width: 100%;\r\n        padding: 13px 18px;\r\n        font-size: 14px;\r\n        font-family: var(--contact-us-font);\r\n        color: var(--contact-us-gray-800);\r\n        background: var(--contact-us-gray-50);\r\n        border: 2px solid var(--contact-us-gray-200);\r\n        border-radius: var(--contact-us-radius-sm);\r\n        outline: none;\r\n        transition: var(--contact-us-transition);\r\n        box-sizing: border-box;\r\n    }\r\n  \r\n    .contact-us-cf7 textarea.wpcf7-form-control {\r\n        resize: vertical;\r\n        min-height: 130px;\r\n    }\r\n  \r\n    .contact-us-cf7 select.wpcf7-form-control {\r\n        cursor: pointer;\r\n        appearance: none;\r\n        background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='16' height='16' viewBox='0 0 24 24' fill='%236B7280'%3E%3Cpath d='M7 10l5 5 5-5z'\/%3E%3C\/svg%3E\");\r\n        background-repeat: no-repeat;\r\n        background-position: right 14px center;\r\n        padding-right: 40px;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-form-control:focus {\r\n        border-color: var(--contact-us-primary);\r\n        background: var(--contact-us-white);\r\n        box-shadow: 0 0 0 4px rgba(var(--contact-us-primary-rgb), 0.1);\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-submit,\r\n    .contact-us-cf7 .wpcf7-form input[type=\"submit\"],\r\n    .contact-us-cf7 .wpcf7-form button[type=\"submit\"] {\r\n        width: 100%;\r\n        padding: 15px 32px;\r\n        font-size: 15px;\r\n        font-weight: 700;\r\n        font-family: var(--contact-us-font);\r\n        color: var(--contact-us-white);\r\n        background: linear-gradient(135deg, var(--contact-us-primary), var(--contact-us-primary-dark));\r\n        border: none;\r\n        border-radius: var(--contact-us-radius-sm);\r\n        cursor: pointer;\r\n        transition: var(--contact-us-transition);\r\n        letter-spacing: 0.3px;\r\n        appearance: none;\r\n        -webkit-appearance: none;\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        text-align: center;\r\n        text-decoration: none;\r\n        box-shadow: 0 4px 16px rgba(var(--contact-us-primary-rgb), 0.24);\r\n        line-height: 1.2;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-submit,\r\n    .contact-us-cf7 .wpcf7-form input[type=\"submit\"] {\r\n        white-space: normal;\r\n    }\r\n  \r\n    \/* Override conflicting plugin\/theme submit styles *\/\r\n    .contact-us-cf7 .wpcf7-form input[type=\"submit\"],\r\n    .contact-us-cf7 .wpcf7-form button[type=\"submit\"] {\r\n        background: linear-gradient(135deg, var(--contact-us-primary), var(--contact-us-primary-dark)) !important;\r\n        color: var(--contact-us-white) !important;\r\n        border: none !important;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-submit:hover,\r\n    .contact-us-cf7 .wpcf7-form input[type=\"submit\"]:hover,\r\n    .contact-us-cf7 .wpcf7-form button[type=\"submit\"]:hover {\r\n        transform: translateY(-2px);\r\n        box-shadow: 0 8px 25px rgba(var(--contact-us-primary-rgb), 0.35);\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-spinner {\r\n        margin-left: 10px;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7-not-valid-tip {\r\n        font-size: 12px;\r\n        margin-top: 6px;\r\n    }\r\n  \r\n    .contact-us-cf7 .wpcf7 form .wpcf7-response-output {\r\n        margin: 14px 0 0;\r\n        padding: 10px 12px;\r\n        border-radius: 8px;\r\n        font-size: 13px;\r\n    }\r\n  \r\n    \/* RIGHT SIDE - TRUST CONTENT *\/\r\n    .contact-us-trust-content {\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 24px;\r\n    }\r\n  \r\n    .contact-us-why-card {\r\n        background: linear-gradient(135deg, var(--contact-us-ink) 0%, var(--contact-us-ink-mid) 100%);\r\n        border-radius: var(--contact-us-radius-lg);\r\n        padding: 36px 30px;\r\n        color: var(--contact-us-white);\r\n        position: relative;\r\n        overflow: hidden;\r\n    }\r\n  \r\n    .contact-us-why-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: -40px;\r\n        right: -40px;\r\n        width: 160px;\r\n        height: 160px;\r\n        background: radial-gradient(circle, rgba(var(--contact-us-primary-rgb), 0.35) 0%, transparent 70%);\r\n        border-radius: 50%;\r\n        filter: blur(30px);\r\n    }\r\n  \r\n    .contact-us-why-card h3 {\r\n        font-size: 20px;\r\n        font-weight: 700;\r\n        margin-bottom: 22px;\r\n        position: relative;\r\n        z-index: 2;\r\n        color: #ffffff !important;\r\n    }\r\n  \r\n    .contact-us-why-list {\r\n        list-style: none;\r\n        padding: 0;\r\n        margin: 0;\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 16px;\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n  \r\n    .contact-us-why-list li {\r\n        display: flex;\r\n        align-items: flex-start;\r\n        gap: 14px;\r\n        font-size: 14px;\r\n        font-weight: 400;\r\n        line-height: 1.6;\r\n        opacity: 0.9;\r\n        color: rgba(255, 255, 255, 0.94) !important;\r\n    }\r\n  \r\n    .contact-us-why-list li span,\r\n    .contact-us-why-list li strong {\r\n        color: rgba(255, 255, 255, 0.96) !important;\r\n    }\r\n  \r\n    .contact-us-why-list li .icon-wrap {\r\n        width: 32px;\r\n        height: 32px;\r\n        min-width: 32px;\r\n        border-radius: 8px;\r\n        background: rgba(var(--contact-us-primary-rgb), 0.28);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 16px;\r\n        color: var(--contact-us-primary-light);\r\n        margin-top: 1px;\r\n    }\r\n  \r\n    \/* Testimonial Mini Card *\/\r\n    .contact-us-testi-card {\r\n        background: var(--contact-us-white);\r\n        border-radius: var(--contact-us-radius-lg);\r\n        padding: 28px;\r\n        border: 1px solid var(--contact-us-gray-200);\r\n        position: relative;\r\n    }\r\n  \r\n    .contact-us-testi-card::before {\r\n        content: '\\e944';\r\n        font-family: 'boxicons';\r\n        position: absolute;\r\n        top: 18px;\r\n        right: 22px;\r\n        font-size: 40px;\r\n        color: var(--contact-us-primary);\r\n        opacity: 0.08;\r\n    }\r\n  \r\n    .contact-us-testi-stars {\r\n        display: flex;\r\n        gap: 3px;\r\n        margin-bottom: 14px;\r\n    }\r\n  \r\n    .contact-us-testi-stars i {\r\n        font-size: 16px;\r\n        color: var(--contact-us-warning);\r\n    }\r\n  \r\n    .contact-us-testi-text {\r\n        font-size: 14px;\r\n        color: var(--contact-us-gray-600);\r\n        line-height: 1.8;\r\n        margin-bottom: 18px;\r\n        font-style: italic;\r\n    }\r\n  \r\n    .contact-us-testi-author {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 12px;\r\n    }\r\n  \r\n    .contact-us-testi-avatar {\r\n        width: 44px;\r\n        height: 44px;\r\n        border-radius: 12px;\r\n        object-fit: cover;\r\n        border: 2px solid var(--contact-us-gray-100);\r\n    }\r\n  \r\n    .contact-us-testi-name {\r\n        font-size: 14px;\r\n        font-weight: 700;\r\n        color: var(--contact-us-gray-900);\r\n    }\r\n  \r\n    .contact-us-testi-role {\r\n        font-size: 12px;\r\n        color: var(--contact-us-gray-400);\r\n    }\r\n  \r\n    \/* Response Time Card *\/\r\n    .contact-us-response-card {\r\n        background: linear-gradient(135deg, rgba(var(--contact-us-primary-rgb), 0.06), rgba(var(--contact-us-primary-rgb), 0.02));\r\n        border: 1px solid rgba(var(--contact-us-primary-rgb), 0.12);\r\n        border-radius: var(--contact-us-radius-lg);\r\n        padding: 24px 28px;\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 18px;\r\n    }\r\n  \r\n    .contact-us-response-icon {\r\n        width: 52px;\r\n        height: 52px;\r\n        min-width: 52px;\r\n        border-radius: var(--contact-us-radius-md);\r\n        background: linear-gradient(135deg, var(--contact-us-primary), var(--contact-us-primary-dark));\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 24px;\r\n        color: var(--contact-us-white);\r\n    }\r\n  \r\n    .contact-us-response-text strong {\r\n        display: block;\r\n        font-size: 15px;\r\n        color: var(--contact-us-gray-900);\r\n        margin-bottom: 2px;\r\n    }\r\n  \r\n    .contact-us-response-text span {\r\n        font-size: 13px;\r\n        color: var(--contact-us-gray-500);\r\n    }\r\n  \r\n    \/* ============================================\r\n       SECTION 4: FAQ ACCORDION\r\n       ============================================ *\/\r\n    .contact-us-faq-section {\r\n        padding: 80px 0;\r\n        background: var(--contact-us-white);\r\n    }\r\n  \r\n    .contact-us-faq-grid {\r\n        display: grid;\r\n        grid-template-columns: 1fr;\r\n        gap: 24px;\r\n        align-items: start;\r\n    }\r\n  \r\n    .contact-us-faq-left {\r\n        position: sticky;\r\n        top: 30px;\r\n    }\r\n  \r\n    .contact-us-faq-left-image {\r\n        width: 100%;\r\n        border-radius: var(--contact-us-radius-lg);\r\n        object-fit: cover;\r\n        margin-bottom: 28px;\r\n        aspect-ratio: 4\/3;\r\n    }\r\n  \r\n    .contact-us-faq-left-text {\r\n        font-size: 15px;\r\n        color: var(--contact-us-gray-500);\r\n        line-height: 1.8;\r\n    }\r\n  \r\n    .contact-us-faq-left-text a {\r\n        color: var(--contact-us-primary);\r\n        text-decoration: none;\r\n        font-weight: 600;\r\n    }\r\n  \r\n    .contact-us-faq-left-text a:hover {\r\n        text-decoration: underline;\r\n    }\r\n  \r\n    .contact-us-accordion {\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 12px;\r\n    }\r\n  \r\n    .contact-us-accordion-item {\r\n        background: var(--contact-us-gray-50);\r\n        border: 1px solid var(--contact-us-gray-200);\r\n        border-radius: var(--contact-us-radius-md);\r\n        overflow: hidden;\r\n        transition: var(--contact-us-transition);\r\n    }\r\n  \r\n    .contact-us-accordion-item.active {\r\n        background: #9D45EF;\r\n        border-color: #9D45EF;\r\n        box-shadow: 0 8px 24px rgba(var(--contact-us-primary-rgb), 0.24);\r\n    }\r\n  \r\n    .contact-us-accordion-header {\r\n        width: 100%;\r\n        padding: 20px 24px;\r\n        background: none;\r\n        border: none;\r\n        font-size: 15px;\r\n        font-weight: 600;\r\n        font-family: var(--contact-us-font);\r\n        color: var(--contact-us-gray-800);\r\n        cursor: pointer;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: space-between;\r\n        gap: 16px;\r\n        text-align: left;\r\n        transition: var(--contact-us-transition);\r\n    }\r\n  \r\n    .contact-us-accordion-header:hover {\r\n        color: var(--contact-us-primary);\r\n    }\r\n  \r\n    \/* Conflict-safe hover styles for accordion text *\/\r\n    .contact-us-accordion-item:hover {\r\n        background: #9D45EF !important;\r\n        border-color: #9D45EF !important;\r\n    }\r\n  \r\n    .contact-us-accordion-item:hover .contact-us-accordion-header,\r\n    .contact-us-accordion-item:hover .contact-us-accordion-body-inner {\r\n        color: #ffffff !important;\r\n    }\r\n  \r\n    .contact-us-accordion-item.active .contact-us-accordion-header {\r\n        color: #ffffff;\r\n    }\r\n  \r\n    .contact-us-accordion-item.active .contact-us-accordion-body-inner {\r\n        color: #ffffff;\r\n    }\r\n  \r\n    .contact-us-accordion-icon {\r\n        width: 32px;\r\n        height: 32px;\r\n        min-width: 32px;\r\n        border-radius: 50%;\r\n        background: var(--contact-us-gray-200);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 18px;\r\n        color: var(--contact-us-gray-600);\r\n        transition: var(--contact-us-transition);\r\n    }\r\n  \r\n    .contact-us-accordion-item.active .contact-us-accordion-icon {\r\n        background: rgba(255, 255, 255, 0.2);\r\n        color: var(--contact-us-white);\r\n        transform: rotate(180deg);\r\n    }\r\n  \r\n    .contact-us-accordion-body {\r\n        max-height: 0;\r\n        overflow: hidden;\r\n        transition: max-height 0.4s ease, padding 0.4s ease;\r\n    }\r\n  \r\n    .contact-us-accordion-item.active .contact-us-accordion-body {\r\n        max-height: 300px;\r\n    }\r\n  \r\n    .contact-us-accordion-body-inner {\r\n        padding: 0 24px 20px;\r\n        font-size: 14px;\r\n        color: var(--contact-us-gray-500);\r\n        line-height: 1.8;\r\n    }\r\n  \r\n    \/* ============================================\r\n       SECTION 5: MAP SECTION\r\n       ============================================ *\/\r\n    .contact-us-map-section {\r\n        padding: 80px 0;\r\n    }\r\n  \r\n    .contact-us-map-grid {\r\n        display: grid;\r\n        grid-template-columns: 1fr 1.4fr;\r\n        gap: 36px;\r\n        align-items: stretch;\r\n    }\r\n  \r\n    .contact-us-map-info {\r\n        background: linear-gradient(135deg, var(--contact-us-ink) 0%, var(--contact-us-ink-mid) 100%);\r\n        border-radius: var(--contact-us-radius-lg);\r\n        padding: 44px 36px;\r\n        color: var(--contact-us-white);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n    }\r\n  \r\n    .contact-us-map-info h3 {\r\n        font-size: 24px;\r\n        font-weight: 700;\r\n        margin-bottom: 10px;\r\n    }\r\n  \r\n    .contact-us-map-info > p {\r\n        font-size: 14px;\r\n        opacity: 0.7;\r\n        margin-bottom: 32px;\r\n        line-height: 1.8;\r\n    }\r\n  \r\n    .contact-us-map-detail {\r\n        display: flex;\r\n        align-items: flex-start;\r\n        gap: 16px;\r\n        margin-bottom: 24px;\r\n    }\r\n  \r\n    .contact-us-map-detail-icon {\r\n        width: 44px;\r\n        height: 44px;\r\n        min-width: 44px;\r\n        border-radius: 12px;\r\n        background: rgba(var(--contact-us-primary-rgb), 0.22);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 20px;\r\n        color: var(--contact-us-primary-light);\r\n    }\r\n  \r\n    .contact-us-map-detail-text strong {\r\n        display: block;\r\n        font-size: 14px;\r\n        font-weight: 600;\r\n        margin-bottom: 2px;\r\n    }\r\n  \r\n    .contact-us-map-detail-text span {\r\n        font-size: 13px;\r\n        opacity: 0.7;\r\n        line-height: 1.6;\r\n    }\r\n  \r\n    .contact-us-map-socials {\r\n        display: flex;\r\n        gap: 12px;\r\n        margin-top: 32px;\r\n        padding-top: 28px;\r\n        border-top: 1px solid rgba(255, 255, 255, 0.1);\r\n    }\r\n  \r\n    .contact-us-map-social {\r\n        width: 42px;\r\n        height: 42px;\r\n        border-radius: 12px;\r\n        background: rgba(255, 255, 255, 0.08);\r\n        border: 1px solid rgba(255, 255, 255, 0.12);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        color: var(--contact-us-white);\r\n        font-size: 18px;\r\n        text-decoration: none;\r\n        transition: var(--contact-us-transition);\r\n    }\r\n  \r\n    .contact-us-map-social:hover {\r\n        background: var(--contact-us-primary);\r\n        border-color: var(--contact-us-primary);\r\n        transform: translateY(-3px);\r\n    }\r\n  \r\n    .contact-us-map-embed {\r\n        border-radius: var(--contact-us-radius-lg);\r\n        overflow: hidden;\r\n        border: 2px solid var(--contact-us-gray-200);\r\n        height: 100%;\r\n        min-height: 400px;\r\n    }\r\n  \r\n    .contact-us-map-embed iframe {\r\n        width: 100%;\r\n        height: 100%;\r\n        min-height: 400px;\r\n        border: none;\r\n        filter: saturate(0.8) contrast(1.05);\r\n    }\r\n  \r\n    \/* ============================================\r\n       SECTION 6: CTA SECTION\r\n       ============================================ *\/\r\n    .contact-us-cta-section {\r\n        padding: 80px 0 100px;\r\n    }\r\n  \r\n    .contact-us-cta-card {\r\n        background: linear-gradient(135deg, var(--contact-us-primary) 0%, var(--contact-us-brand-secondary) 45%, var(--contact-us-ink-deep) 100%);\r\n        border-radius: var(--contact-us-radius-xl);\r\n        padding: 64px 60px;\r\n        position: relative;\r\n        overflow: hidden;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: space-between;\r\n        gap: 40px;\r\n    }\r\n  \r\n    .contact-us-cta-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: -80px;\r\n        right: -40px;\r\n        width: 350px;\r\n        height: 350px;\r\n        background: radial-gradient(circle, rgba(var(--contact-us-primary-rgb), 0.4) 0%, transparent 70%);\r\n        border-radius: 50%;\r\n        filter: blur(50px);\r\n    }\r\n  \r\n    .contact-us-cta-card::after {\r\n        content: '';\r\n        position: absolute;\r\n        bottom: -60px;\r\n        left: 20%;\r\n        width: 250px;\r\n        height: 250px;\r\n        background: radial-gradient(circle, rgba(6, 17, 32, 0.4) 0%, transparent 70%);\r\n        border-radius: 50%;\r\n        filter: blur(40px);\r\n    }\r\n  \r\n    .contact-us-cta-content {\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n  \r\n    .contact-us-cta-badge {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 6px;\r\n        background: rgba(255, 255, 255, 0.12);\r\n        backdrop-filter: blur(8px);\r\n        border: 1px solid rgba(255, 255, 255, 0.15);\r\n        padding: 6px 16px;\r\n        border-radius: 50px;\r\n        font-size: 12px;\r\n        font-weight: 600;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1.5px;\r\n        color: var(--contact-us-white);\r\n        margin-bottom: 18px;\r\n    }\r\n  \r\n    .contact-us-cta-badge .dot {\r\n        width: 8px;\r\n        height: 8px;\r\n        background: var(--contact-us-success);\r\n        border-radius: 50%;\r\n        animation: contact-us-pulse-dot 2s ease-in-out infinite;\r\n    }\r\n  \r\n    @keyframes contact-us-pulse-dot {\r\n        0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5); }\r\n        50% { opacity: 0.7; box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); }\r\n    }\r\n  \r\n    .contact-us-cta-title {\r\n        font-size: clamp(26px, 3vw, 38px);\r\n        font-weight: 800;\r\n        color: var(--contact-us-white);\r\n        margin-bottom: 12px;\r\n        line-height: 1.2;\r\n    }\r\n  \r\n    .contact-us-cta-text {\r\n        font-size: 16px;\r\n        color: rgba(255, 255, 255, 0.7);\r\n        max-width: 480px;\r\n        line-height: 1.7;\r\n    }\r\n  \r\n    .contact-us-cta-buttons {\r\n        display: flex;\r\n        gap: 16px;\r\n        position: relative;\r\n        z-index: 2;\r\n        flex-shrink: 0;\r\n    }\r\n  \r\n    .contact-us-cta-btn {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 10px;\r\n        padding: 16px 32px;\r\n        border-radius: var(--contact-us-radius-sm);\r\n        font-size: 15px;\r\n        font-weight: 700;\r\n        font-family: var(--contact-us-font);\r\n        text-decoration: none;\r\n        transition: var(--contact-us-transition);\r\n        cursor: pointer;\r\n        border: none;\r\n        white-space: nowrap;\r\n    }\r\n  \r\n    .contact-us-cta-btn-primary {\r\n        background: var(--contact-us-white);\r\n        color: var(--contact-us-primary);\r\n    }\r\n  \r\n    .contact-us-cta-btn-primary:hover {\r\n        transform: translateY(-3px);\r\n        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);\r\n    }\r\n  \r\n    .contact-us-cta-btn-outline {\r\n        background: rgba(255, 255, 255, 0.08);\r\n        color: var(--contact-us-white);\r\n        border: 2px solid rgba(255, 255, 255, 0.25);\r\n        backdrop-filter: blur(8px);\r\n    }\r\n  \r\n    .contact-us-cta-btn-outline:hover {\r\n        background: rgba(255, 255, 255, 0.15);\r\n        border-color: rgba(255, 255, 255, 0.4);\r\n        transform: translateY(-3px);\r\n    }\r\n  \r\n    \/* ============================================\r\n       TOAST NOTIFICATION\r\n       ============================================ *\/\r\n    .contact-us-toast {\r\n        position: fixed;\r\n        bottom: 30px;\r\n        right: 30px;\r\n        background: var(--contact-us-white);\r\n        border-radius: var(--contact-us-radius-md);\r\n        padding: 18px 24px;\r\n        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 14px;\r\n        z-index: 9999;\r\n        transform: translateX(calc(100% + 40px));\r\n        transition: transform 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);\r\n        border-left: 4px solid var(--contact-us-success);\r\n    }\r\n  \r\n    .contact-us-toast.show {\r\n        transform: translateX(0);\r\n    }\r\n  \r\n    .contact-us-toast-icon {\r\n        width: 40px;\r\n        height: 40px;\r\n        min-width: 40px;\r\n        border-radius: 10px;\r\n        background: rgba(16, 185, 129, 0.1);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        font-size: 22px;\r\n        color: var(--contact-us-success);\r\n    }\r\n  \r\n    .contact-us-toast-text strong {\r\n        display: block;\r\n        font-size: 14px;\r\n        color: var(--contact-us-gray-900);\r\n    }\r\n  \r\n    .contact-us-toast-text span {\r\n        font-size: 12px;\r\n        color: var(--contact-us-gray-500);\r\n    }\r\n  \r\n    \/* ============================================\r\n       RESPONSIVE DESIGN\r\n       ============================================ *\/\r\n    @media (max-width: 1024px) {\r\n        .contact-us-hero-grid {\r\n            grid-template-columns: 1fr;\r\n            gap: 40px;\r\n            text-align: center;\r\n        }\r\n  \r\n        .contact-us-hero-subtitle {\r\n            margin: 0 auto 36px;\r\n        }\r\n  \r\n        .contact-us-hero-stats {\r\n            justify-content: center;\r\n        }\r\n  \r\n        .contact-us-hero-image {\r\n            order: -1;\r\n        }\r\n  \r\n        .contact-us-hero-image-wrapper {\r\n            max-width: 360px;\r\n            margin: 0 auto;\r\n        }\r\n  \r\n        .contact-us-hero-floating-card.top-left {\r\n            left: 0;\r\n            top: 10px;\r\n        }\r\n  \r\n        .contact-us-hero-floating-card.bottom-right {\r\n            right: 0;\r\n            bottom: 15px;\r\n        }\r\n  \r\n        .contact-us-info-grid {\r\n            grid-template-columns: repeat(2, 1fr);\r\n        }\r\n  \r\n        .contact-us-main-grid {\r\n            grid-template-columns: 1fr;\r\n        }\r\n  \r\n        .contact-us-faq-grid {\r\n            grid-template-columns: 1fr;\r\n            gap: 40px;\r\n        }\r\n  \r\n        .contact-us-faq-left {\r\n            position: static;\r\n            text-align: center;\r\n        }\r\n  \r\n        .contact-us-map-grid {\r\n            grid-template-columns: 1fr;\r\n        }\r\n  \r\n        .contact-us-cta-card {\r\n            flex-direction: column;\r\n            text-align: center;\r\n            padding: 48px 32px;\r\n        }\r\n  \r\n        .contact-us-cta-text {\r\n            margin: 0 auto;\r\n        }\r\n  \r\n        .contact-us-cta-buttons {\r\n            justify-content: center;\r\n            flex-wrap: wrap;\r\n        }\r\n    }\r\n  \r\n    @media (max-width: 768px) {\r\n        .contact-us-hero {\r\n            padding: 50px 0 60px;\r\n            border-radius: 0 0 28px 28px;\r\n        }\r\n  \r\n        .contact-us-hero-title {\r\n            font-size: 30px;\r\n        }\r\n  \r\n        .contact-us-info-grid {\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 14px;\r\n        }\r\n  \r\n        .contact-us-info-card {\r\n            padding: 24px 16px;\r\n        }\r\n  \r\n        .contact-us-form-card {\r\n            padding: 28px 22px;\r\n        }\r\n  \r\n        .contact-us-form-row {\r\n            grid-template-columns: 1fr;\r\n            gap: 0;\r\n        }\r\n  \r\n        .contact-us-map-info {\r\n            padding: 32px 24px;\r\n        }\r\n  \r\n        .contact-us-cta-buttons {\r\n            flex-direction: column;\r\n            width: 100%;\r\n        }\r\n  \r\n        .contact-us-cta-btn {\r\n            justify-content: center;\r\n        }\r\n    }\r\n  \r\n    @media (max-width: 480px) {\r\n        .contact-us-cf7 .wpcf7-form-control:not(.wpcf7-submit) {\r\n            margin-bottom: 10px;\r\n        }\r\n  \r\n        .contact-us-info-grid {\r\n            grid-template-columns: 1fr;\r\n        }\r\n  \r\n        .contact-us-hero-stats {\r\n            gap: 20px;\r\n        }\r\n  \r\n        .contact-us-hero-stat-number {\r\n            font-size: 26px;\r\n        }\r\n    }\r\n  <\/style>\r\n  \r\n  <!-- ============================================\r\n     SECTION 1: HERO BANNER\r\n     ============================================ -->\r\n  <section class=\"contact-us-hero\">\r\n    <div class=\"contact-us-hero-dots top-right\">\r\n        <span><\/span><span><\/span><span><\/span>\r\n    <\/div>\r\n    <div class=\"contact-us-hero-dots bottom-left\">\r\n        <span><\/span><span><\/span><span><\/span>\r\n    <\/div>\r\n  \r\n    <div class=\"contact-us-wrapper\">\r\n        <div class=\"contact-us-hero-grid\">\r\n            <div class=\"contact-us-hero-content\" data-aos=\"fade-right\" data-aos-duration=\"800\">\r\n                <div class=\"contact-us-hero-badge\">\r\n                    <i class='bx bx-support'><\/i>\r\n                    Gramiewer \u00b7 Support\r\n                <\/div>\r\n                <h1 class=\"contact-us-hero-title\">\r\n                    Talk to Our Team\r\n                <\/h1>\r\n                <p class=\"contact-us-hero-subtitle\">\r\n                    Questions about Gramiewer access, profile limits, plan upgrades, or account security? Reach out - we help creators, agencies, and brands get the most from Gramiewer.\r\n                <\/p>\r\n                <div class=\"contact-us-hero-stats\">\r\n                    <div class=\"contact-us-hero-stat\">\r\n                        <div class=\"contact-us-hero-stat-number\">500K+<\/div>\r\n                        <div class=\"contact-us-hero-stat-label\">Profile Checks \/ Mo<\/div>\r\n                    <\/div>\r\n                    <div class=\"contact-us-hero-stat\">\r\n                        <div class=\"contact-us-hero-stat-number\"><2h<\/div>\r\n                        <div class=\"contact-us-hero-stat-label\">Avg. Response<\/div>\r\n                    <\/div>\r\n                    <div class=\"contact-us-hero-stat\">\r\n                        <div class=\"contact-us-hero-stat-number\">99%<\/div>\r\n                        <div class=\"contact-us-hero-stat-label\">CSAT (90 days)<\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n  \r\n            <div class=\"contact-us-hero-image\" data-aos=\"fade-left\" data-aos-duration=\"800\" data-aos-delay=\"200\">\r\n                <div class=\"contact-us-hero-image-wrapper\">\r\n                    <div class=\"contact-us-hero-image-bg\"><\/div>\r\n                    <img decoding=\"async\" src=\"https:\/\/gramiewer.com\/wp-content\/uploads\/2026\/04\/contact-us-insta.webp\" alt=\"Customer success team for Gramiewer\">\r\n                    <div class=\"contact-us-hero-floating-card top-left\">\r\n                        <i class='bx bxs-message-dots'><\/i>\r\n                        <div>\r\n                            <strong style=\"display:block;font-size:13px;\">Product chat<\/strong>\r\n                            <span style=\"font-size:11px;opacity:0.7;\">Profiles & billing<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                    <div class=\"contact-us-hero-floating-card bottom-right\">\r\n                        <i class='bx bxs-check-circle'><\/i>\r\n                        <div>\r\n                            <strong style=\"display:block;font-size:13px;\">Searches today<\/strong>\r\n                            <span style=\"font-size:11px;opacity:0.7;\">12.4K profile checks<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n  <\/section>\r\n  \r\n  \r\n  <!-- ============================================\r\n     SECTION 2: CONTACT INFO CARDS\r\n     ============================================ -->\r\n  <section class=\"contact-us-info-section\">\r\n    <div class=\"contact-us-wrapper\">\r\n        <div class=\"contact-us-info-grid\">\r\n  \r\n            <div class=\"contact-us-info-card\" data-aos=\"fade-up\" data-aos-duration=\"600\" data-aos-delay=\"0\">\r\n                <div class=\"contact-us-info-card-icon\">\r\n                    <i class='bx bxs-phone-call'><\/i>\r\n                <\/div>\r\n                <div class=\"contact-us-info-card-title\">Phone Support<\/div>\r\n                <div class=\"contact-us-info-card-text\">Call us for billing, seat upgrades, and urgent Instagram profile viewer access issues during business hours<\/div>\r\n                <a href=\"tel:+19072605648\" class=\"contact-us-info-card-value\">\r\n                    (907) 260-5648 <i class='bx bx-right-arrow-alt'><\/i>\r\n                <\/a>\r\n            <\/div>\r\n  \r\n            <div class=\"contact-us-info-card\" data-aos=\"fade-up\" data-aos-duration=\"600\" data-aos-delay=\"100\">\r\n                <div class=\"contact-us-info-card-icon\">\r\n                    <i class='bx bxs-envelope'><\/i>\r\n                <\/div>\r\n                <div class=\"contact-us-info-card-title\">Email Address<\/div>\r\n                <div class=\"contact-us-info-card-text\">Email product questions, profile troubleshooting, or compliance requests \u2014 we reply within two hours on business days<\/div>\r\n                <a href=\"mailto:support@gramiewer.com\" class=\"contact-us-info-card-value\">\r\n                    support@gramiewer.com <i class='bx bx-right-arrow-alt'><\/i>\r\n                <\/a>\r\n            <\/div>\r\n  \r\n            <div class=\"contact-us-info-card\" data-aos=\"fade-up\" data-aos-duration=\"600\" data-aos-delay=\"200\">\r\n                <div class=\"contact-us-info-card-icon\">\r\n                    <i class='bx bxs-map'><\/i>\r\n                <\/div>\r\n                <div class=\"contact-us-info-card-title\">Office Location<\/div>\r\n                <div class=\"contact-us-info-card-text\">Our HQ handles partnerships, enterprise contracts, and on-site training for agency teams<\/div>\r\n                <span class=\"contact-us-info-card-value\" style=\"cursor:default;line-height:1.55;\">\r\n                    44433, Soldotna, Alaska 99669<br>\r\n                    United States\r\n                <\/span>\r\n            <\/div>\r\n  \r\n            <div class=\"contact-us-info-card\" data-aos=\"fade-up\" data-aos-duration=\"600\" data-aos-delay=\"300\">\r\n                <div class=\"contact-us-info-card-icon\">\r\n                    <i class='bx bxs-time-five'><\/i>\r\n                <\/div>\r\n                <div class=\"contact-us-info-card-title\">Working Hours<\/div>\r\n                <div class=\"contact-us-info-card-text\">SaaS support covers profile viewer uptime questions, API quotas, and workspace administration all week<\/div>\r\n                <span class=\"contact-us-info-card-value\" style=\"cursor:default;\">\r\n                    Mon \u2013 Sat, 8 AM \u2013 8 PM <i class='bx bx-right-arrow-alt'><\/i>\r\n                <\/span>\r\n            <\/div>\r\n  \r\n        <\/div>\r\n    <\/div>\r\n  <\/section>\r\n  \r\n  \r\n  <!-- ============================================\r\n     SECTION 3: MAIN CONTACT SECTION\r\n     ============================================ -->\r\n  <section class=\"contact-us-main-section\">\r\n    <div class=\"contact-us-wrapper\">\r\n        <div class=\"contact-us-section-header\" data-aos=\"fade-up\">\r\n            <div class=\"contact-us-section-label\">Contact product support<\/div>\r\n            <h2 class=\"contact-us-section-title\">We'd Love to Hear From You<\/h2>\r\n            <p class=\"contact-us-section-desc\">\r\n                Tell us what you need \u2014 Instagram profile viewing support, workspace invites, or plan advice. A real human on our SaaS team will reply with clear next steps, not a canned auto-message.\r\n            <\/p>\r\n        <\/div>\r\n  \r\n        <div class=\"contact-us-main-grid\">\r\n            <!-- LEFT: Contact Form -->\r\n            <div class=\"contact-us-form-card\" id=\"contactForm\" data-aos=\"fade-right\" data-aos-duration=\"700\">\r\n                <h3 class=\"contact-us-form-title\">Send Us a Message<\/h3>\r\n                <p class=\"contact-us-form-subtitle\">Include your workspace email and, if relevant, the @username you are checking so we can troubleshoot faster (*)<\/p>\r\n                <div class=\"contact-us-cf7\">\r\n                    \n<div class=\"wpcf7 no-js\" id=\"wpcf7-f2907-o1\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"2907\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/wp-json\/wp\/v2\/pages\/2990?lang=fr#wpcf7-f2907-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" novalidate=\"novalidate\" data-status=\"init\">\n<fieldset class=\"hidden-fields-container\"><input type=\"hidden\" name=\"_wpcf7\" value=\"2907\" \/><input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.1.6\" \/><input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/><input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f2907-o1\" \/><input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/><input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<\/fieldset>\n<p><span class=\"wpcf7-form-control-wrap\" data-name=\"your-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" autocomplete=\"name\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Enter Your Name\" value=\"\" type=\"text\" name=\"your-name\" \/><\/span><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email\" autocomplete=\"email\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Enter Your Email\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-subject\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Enter Subject\" value=\"\" type=\"text\" name=\"your-subject\" \/><\/span><br \/>\n<span class=\"wpcf7-form-control-wrap\" data-name=\"your-message\"><textarea cols=\"40\" rows=\"10\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea\" aria-invalid=\"false\" placeholder=\"Enter Your Message\" name=\"your-message\"><\/textarea><\/span><br \/>\n[recaptcha]<br \/>\n<input class=\"wpcf7-form-control wpcf7-submit has-spinner\" type=\"submit\" value=\"Send Message\" \/>\n<\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n\r\n                <\/div>\r\n                <p class=\"contact-us-form-note\">\r\n                    <i class='bx bx-shield-quarter'><\/i>\r\n                    We never ask for your password. Your details are used only to support your Gramiewer account.\r\n                <\/p>\r\n            <\/div>\r\n  \r\n            <!-- RIGHT: Trust Content -->\r\n            <div class=\"contact-us-trust-content\">\r\n                <div class=\"contact-us-why-card\" data-aos=\"fade-left\" data-aos-duration=\"700\" data-aos-delay=\"100\">\r\n                    <h3>Why Teams Trust Gramiewer<\/h3>\r\n                    <ul class=\"contact-us-why-list\">\r\n                        <li>\r\n                            <span class=\"icon-wrap\"><i class='bx bx-user-voice'><\/i><\/span>\r\n                            <span><strong style=\"color:#fff;\">Product specialists, not scripts<\/strong> \u2014 You talk to people who know Instagram profile workflows, media access paths, and agency operations \u2014 not a generic call center.<\/span>\r\n                        <\/li>\r\n                        <li>\r\n                            <span class=\"icon-wrap\"><i class='bx bx-bolt-circle'><\/i><\/span>\r\n                            <span><strong style=\"color:#fff;\">Fast answers on business days<\/strong> \u2014 Most billing and profile viewer questions are cleared in one thread; critical outages get priority routing.<\/span>\r\n                        <\/li>\r\n                        <li>\r\n                            <span class=\"icon-wrap\"><i class='bx bx-target-lock'><\/i><\/span>\r\n                            <span><strong style=\"color:#fff;\">Privacy-by-design<\/strong> \u2014 We help you use public Instagram data responsibly: SSO, audit logs, and clear data-retention options for workspaces.<\/span>\r\n                        <\/li>\r\n                        <li>\r\n                            <span class=\"icon-wrap\"><i class='bx bx-book-open'><\/i><\/span>\r\n                            <span><strong style=\"color:#fff;\">Free onboarding for paid plans<\/strong> \u2014 New admins get a short walkthrough on seats, exports, and API rate limits so your team ships reports faster.<\/span>\r\n                        <\/li>\r\n                    <\/ul>\r\n                <\/div>\r\n  \r\n                <div class=\"contact-us-response-card\" data-aos=\"fade-left\" data-aos-duration=\"700\" data-aos-delay=\"300\">\r\n                    <div class=\"contact-us-response-icon\">\r\n                        <i class='bx bx-time-five'><\/i>\r\n                    <\/div>\r\n                    <div class=\"contact-us-response-text\">\r\n                        <strong>Median first reply: under 1h 45m<\/strong>\r\n                        <span>Measured across 12,400+ Gramiewer tickets (plans, exports, integrations) in the last 90 days<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n  <\/section>\r\n  \r\n  \r\n  <!-- ============================================\r\n     SECTION 4: FAQ ACCORDION\r\n     ============================================ -->\r\n  <section class=\"contact-us-faq-section\">\r\n    <div class=\"contact-us-wrapper\">\r\n        <div class=\"contact-us-section-header\" data-aos=\"fade-up\">\r\n            <div class=\"contact-us-section-label\">Frequently Asked Questions<\/div>\r\n            <h2 class=\"contact-us-section-title\">Got Questions? We've Got Answers<\/h2>\r\n            <p class=\"contact-us-section-desc\">\r\n                Common questions about our Gramiewer SaaS \u2014 security, subscriptions, exports, and working with agencies.\r\n            <\/p>\r\n        <\/div>\r\n  \r\n        <div class=\"contact-us-faq-grid\">\r\n            <!-- RIGHT: Accordion -->\r\n            <div class=\"contact-us-accordion\" data-aos=\"fade-left\" data-aos-duration=\"700\">\r\n  \r\n                <div class=\"contact-us-accordion-item active\">\r\n                    <div class=\"contact-us-accordion-header\" role=\"button\" tabindex=\"0\" onclick=\"toggleAccordion(this)\" onkeydown=\"if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleAccordion(this);}\">\r\n                        How fast does your team reply to Gramiewer questions?\r\n                        <span class=\"contact-us-accordion-icon\"><i class='bx bx-chevron-down'><\/i><\/span>\r\n                    <\/div>\r\n                    <div class=\"contact-us-accordion-body\">\r\n                        <div class=\"contact-us-accordion-body-inner\">\r\n                            On business days (Mon\u2013Sat, 8 AM \u2013 8 PM in our support timezone), most emails get a first human reply in under two hours. Billing emergencies and workspace lockouts flagged as urgent are prioritized. Messages sent overnight are answered at the start of the next business day.\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n  \r\n                <div class=\"contact-us-accordion-item\">\r\n                    <div class=\"contact-us-accordion-header\" role=\"button\" tabindex=\"0\" onclick=\"toggleAccordion(this)\" onkeydown=\"if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleAccordion(this);}\">\r\n                        Do I need to share my password to get help?\r\n                        <span class=\"contact-us-accordion-icon\"><i class='bx bx-chevron-down'><\/i><\/span>\r\n                    <\/div>\r\n                    <div class=\"contact-us-accordion-body\">\r\n                        <div class=\"contact-us-accordion-body-inner\">\r\n                            No. Legitimate support will never ask for your password. We may ask for your workspace email, plan name, and the public @handle you are viewing so we can reproduce export or sync issues. If someone asks for credentials, report it to us immediately.\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n  \r\n                <div class=\"contact-us-accordion-item\">\r\n                    <div class=\"contact-us-accordion-header\" role=\"button\" tabindex=\"0\" onclick=\"toggleAccordion(this)\" onkeydown=\"if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleAccordion(this);}\">\r\n                        What can support help with on the viewer product?\r\n                        <span class=\"contact-us-accordion-icon\"><i class='bx bx-chevron-down'><\/i><\/span>\r\n                    <\/div>\r\n                    <div class=\"contact-us-accordion-body\">\r\n                        <div class=\"contact-us-accordion-body-inner\">\r\n                            We troubleshoot profile loading, CSV\/PDF exports, scheduled scans, API rate limits, SSO login, seat invitations, role permissions, and billing receipts. For custom data retention or compliance reviews, mention it in your message and we will route you to the right specialist.\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n  \r\n                <div class=\"contact-us-accordion-item\">\r\n                    <div class=\"contact-us-accordion-header\" role=\"button\" tabindex=\"0\" onclick=\"toggleAccordion(this)\" onkeydown=\"if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleAccordion(this);}\">\r\n                        How do refunds and subscription cancellations work?\r\n                        <span class=\"contact-us-accordion-icon\"><i class='bx bx-chevron-down'><\/i><\/span>\r\n                    <\/div>\r\n                    <div class=\"contact-us-accordion-body\">\r\n                        <div class=\"contact-us-accordion-body-inner\">\r\n                            Paid plans include a stated refund window in your checkout terms \u2014 typically a full refund if you cancel within the first week and have not exceeded fair-use export limits. After that, you can cancel renewal anytime; the workspace stays active until the end of the paid period. Prorated refunds may apply for annual seats in special cases \u2014 ask support with your invoice ID.\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n  \r\n                <div class=\"contact-us-accordion-item\">\r\n                    <div class=\"contact-us-accordion-header\" role=\"button\" tabindex=\"0\" onclick=\"toggleAccordion(this)\" onkeydown=\"if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleAccordion(this);}\">\r\n                        Do you offer agency or multi-seat pricing?\r\n                        <span class=\"contact-us-accordion-icon\"><i class='bx bx-chevron-down'><\/i><\/span>\r\n                    <\/div>\r\n                    <div class=\"contact-us-accordion-body\">\r\n                        <div class=\"contact-us-accordion-body-inner\">\r\n                            Yes. Agencies managing many client profiles can request pooled seats, shared export quotas, and optional white-label PDFs. We also support purchase orders and annual contracts for teams of five or more. Use the contact form and choose \u201cAgency \/ enterprise\u201d if your CRM offers that option, or mention client volume in the message body.\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n  \r\n                <div class=\"contact-us-accordion-item\">\r\n                    <div class=\"contact-us-accordion-header\" role=\"button\" tabindex=\"0\" onclick=\"toggleAccordion(this)\" onkeydown=\"if(event.key==='Enter'||event.key===' '){event.preventDefault();toggleAccordion(this);}\">\r\n                        How do you protect profile viewer data and workspace privacy?\r\n                        <span class=\"contact-us-accordion-icon\"><i class='bx bx-chevron-down'><\/i><\/span>\r\n                    <\/div>\r\n                    <div class=\"contact-us-accordion-body\">\r\n                        <div class=\"contact-us-accordion-body-inner\">\r\n                            We apply encryption in transit, strict access controls for staff, and configurable retention for exports. Workspaces can enable SSO, IP allow lists, and audit trails for who viewed or downloaded content. We only process public profile information needed to power the viewer \u2014 we do not store passwords, and you can request a data processing summary for your legal team.\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n  \r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n  <\/section>\r\n  <script>\r\n  \r\n    \/\/ ============================================\r\n    \/\/ ACCORDION FUNCTIONALITY\r\n    \/\/ ============================================\r\n    function toggleAccordion(header) {\r\n        const item = header.closest('.contact-us-accordion-item');\r\n        const allItems = document.querySelectorAll('.contact-us-accordion-item');\r\n  \r\n        allItems.forEach(function(el) {\r\n            if (el !== item) {\r\n                el.classList.remove('active');\r\n            }\r\n        });\r\n  \r\n        item.classList.toggle('active');\r\n    }\r\n  \r\n    \/\/ Contact Form 7 handles form submit\/validation.\r\n  \r\n    \/\/ ============================================\r\n    \/\/ TOAST NOTIFICATION\r\n    \/\/ ============================================\r\n    function showToast() {\r\n        const toast = document.getElementById('contactUsToast');\r\n        toast.classList.add('show');\r\n  \r\n        setTimeout(function() {\r\n            toast.classList.remove('show');\r\n        }, 5000);\r\n    }\r\n  \r\n    \/\/ Add helper keyframes dynamically\r\n    var styleSheet = document.createElement('style');\r\n    styleSheet.textContent = `\r\n        @keyframes spin {\r\n            from { transform: rotate(0deg); }\r\n            to { transform: rotate(360deg); }\r\n        }\r\n        @keyframes shake {\r\n            0%, 100% { transform: translateX(0); }\r\n            20% { transform: translateX(-6px); }\r\n            40% { transform: translateX(6px); }\r\n            60% { transform: translateX(-4px); }\r\n            80% { transform: translateX(4px); }\r\n        }\r\n    `;\r\n    document.head.appendChild(styleSheet);\r\n  <\/script><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-homepage.php","meta":{"footnotes":""},"class_list":["post-2990","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/gramiewer.com\/wp-json\/wp\/v2\/pages\/2990","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gramiewer.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/gramiewer.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/gramiewer.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gramiewer.com\/wp-json\/wp\/v2\/comments?post=2990"}],"version-history":[{"count":3,"href":"https:\/\/gramiewer.com\/wp-json\/wp\/v2\/pages\/2990\/revisions"}],"predecessor-version":[{"id":5370,"href":"https:\/\/gramiewer.com\/wp-json\/wp\/v2\/pages\/2990\/revisions\/5370"}],"wp:attachment":[{"href":"https:\/\/gramiewer.com\/wp-json\/wp\/v2\/media?parent=2990"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}