{"id":54,"date":"2026-08-28T15:49:03","date_gmt":"2026-08-28T15:49:03","guid":{"rendered":"https:\/\/al-ishraaq.com\/?page_id=54"},"modified":"2026-09-01T21:39:34","modified_gmt":"2026-09-01T21:39:34","slug":"research-center","status":"publish","type":"page","link":"https:\/\/al-ishraaq.com\/en\/research-center\/","title":{"rendered":"Research Center"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"54\" class=\"elementor elementor-54\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a2e588f e-con e-atomic-element e-flexbox-base e-a2e588f-7b6cf18 \" data-id=\"a2e588f\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"a2e588f\">\n    \t\t<div class=\"elementor-element elementor-element-9df334b elementor-widget elementor-widget-html\" data-id=\"9df334b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"cu-outer\">\r\n<style>\r\n    .cu-outer {\r\n        --primary: #0E5C46;\r\n        --primary-dark: #0a4535;\r\n        --primary-light: #1a7a5e;\r\n        --secondary: #D4A017;\r\n        --secondary-light: #f0c84b;\r\n        --text: #1B2A2F;\r\n        --bg-mint: #E7F1EC;\r\n        --bg-lavender: #f1f3ff;\r\n        --card-bg: #FFFFFF;\r\n        --shadow-sm: 0 2px 8px rgba(14, 92, 70, 0.08);\r\n        --shadow-md: 0 8px 30px rgba(14, 92, 70, 0.12);\r\n        --shadow-lg: 0 20px 60px rgba(14, 92, 70, 0.18);\r\n        --radius-sm: 8px;\r\n        --radius-md: 16px;\r\n        --radius-lg: 24px;\r\n        --radius-xl: 32px;\r\n        --transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n\r\n        position: relative;\r\n        box-sizing: border-box;\r\n        font-family: 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;\r\n        background: linear-gradient(160deg, var(--bg-mint) 0%, var(--bg-lavender) 50%, var(--bg-mint) 100%);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        padding: 3rem 2rem;\r\n        color: var(--text);\r\n        overflow: hidden;\r\n    }\r\n\r\n    .cu-outer *, .cu-outer *::before, .cu-outer *::after {\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    \/* Animated background blobs \u2014 absolute to the wrapper, not the viewport *\/\r\n    .cu-outer .bg-blob {\r\n        position: absolute;\r\n        border-radius: 50%;\r\n        filter: blur(80px);\r\n        opacity: 0.35;\r\n        pointer-events: none;\r\n        z-index: 0;\r\n        animation: cuBlobFloat 12s ease-in-out infinite;\r\n    }\r\n\r\n    .cu-outer .bg-blob-1 {\r\n        width: 500px;\r\n        height: 500px;\r\n        background: var(--primary);\r\n        top: -150px;\r\n        left: -150px;\r\n        animation-delay: 0s;\r\n    }\r\n\r\n    .cu-outer .bg-blob-2 {\r\n        width: 450px;\r\n        height: 450px;\r\n        background: var(--secondary);\r\n        bottom: -120px;\r\n        right: -120px;\r\n        animation-delay: -4s;\r\n        opacity: 0.25;\r\n    }\r\n\r\n    .cu-outer .bg-blob-3 {\r\n        width: 350px;\r\n        height: 350px;\r\n        background: var(--primary-light);\r\n        top: 50%;\r\n        left: 70%;\r\n        animation-delay: -8s;\r\n        opacity: 0.2;\r\n    }\r\n\r\n    @keyframes cuBlobFloat {\r\n        0%, 100% { transform: translate(0, 0) scale(1); }\r\n        25% { transform: translate(30px, -40px) scale(1.05); }\r\n        50% { transform: translate(-20px, 25px) scale(0.95); }\r\n        75% { transform: translate(40px, 15px) scale(1.02); }\r\n    }\r\n\r\n    \/* Subtle grid pattern overlay \u2014 absolute to wrapper *\/\r\n    .cu-outer .grid-overlay {\r\n        position: absolute;\r\n        top: 0; left: 0; width: 100%; height: 100%;\r\n        background-image:\r\n            linear-gradient(rgba(14, 92, 70, 0.04) 1px, transparent 1px),\r\n            linear-gradient(90deg, rgba(14, 92, 70, 0.04) 1px, transparent 1px);\r\n        background-size: 40px 40px;\r\n        pointer-events: none;\r\n        z-index: 1;\r\n    }\r\n\r\n    .cu-outer .construction-wrapper {\r\n        position: relative;\r\n        z-index: 2;\r\n        width: 100%;\r\n        max-width: 900px;\r\n        margin: 0 auto;\r\n    }\r\n\r\n    .cu-outer .construction-card {\r\n        background: var(--card-bg);\r\n        border-radius: var(--radius-xl);\r\n        box-shadow: var(--shadow-lg);\r\n        padding: 3.5rem 3rem 3rem;\r\n        text-align: center;\r\n        position: relative;\r\n        overflow: hidden;\r\n        border: 1px solid rgba(14, 92, 70, 0.1);\r\n        backdrop-filter: blur(10px);\r\n        transition: var(--transition);\r\n    }\r\n\r\n    .cu-outer .construction-card::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: 0; right: 0;\r\n        height: 6px;\r\n        background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 25%, var(--primary) 50%, var(--secondary) 75%, var(--primary) 100%);\r\n        background-size: 200% 100%;\r\n        animation: cuGradientShift 4s linear infinite;\r\n    }\r\n\r\n    @keyframes cuGradientShift {\r\n        0% { background-position: 200% 0%; }\r\n        100% { background-position: 0% 0%; }\r\n    }\r\n\r\n    .cu-outer .corner-accent {\r\n        position: absolute;\r\n        width: 80px;\r\n        height: 80px;\r\n        border-radius: 50%;\r\n        opacity: 0.08;\r\n        pointer-events: none;\r\n    }\r\n    .cu-outer .corner-accent.tl { top: -30px; left: -30px; background: var(--primary); }\r\n    .cu-outer .corner-accent.br { bottom: -30px; right: -30px; background: var(--secondary); }\r\n    .cu-outer .corner-accent.tr {\r\n        top: 20px; right: 40px; width: 40px; height: 40px;\r\n        background: var(--primary-light); opacity: 0.06;\r\n    }\r\n\r\n    .cu-outer .icon-container {\r\n        position: relative;\r\n        display: inline-flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        margin-bottom: 2rem;\r\n    }\r\n\r\n    .cu-outer .icon-ring {\r\n        width: 120px;\r\n        height: 120px;\r\n        border-radius: 50%;\r\n        background: linear-gradient(135deg, var(--bg-mint), var(--bg-lavender));\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        position: relative;\r\n        box-shadow: var(--shadow-md);\r\n        animation: cuPulseRing 3s ease-in-out infinite;\r\n    }\r\n\r\n    .cu-outer .icon-ring::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: -8px; left: -8px; right: -8px; bottom: -8px;\r\n        border-radius: 50%;\r\n        border: 2px dashed var(--secondary);\r\n        animation: cuSpinSlow 20s linear infinite;\r\n        opacity: 0.5;\r\n    }\r\n\r\n    .cu-outer .icon-ring::before {\r\n        content: '';\r\n        position: absolute;\r\n        top: -16px; left: -16px; right: -16px; bottom: -16px;\r\n        border-radius: 50%;\r\n        border: 1px solid rgba(14, 92, 70, 0.15);\r\n        animation: cuPulseRingOuter 3s ease-in-out infinite;\r\n    }\r\n\r\n    @keyframes cuPulseRing {\r\n        0%, 100% { box-shadow: var(--shadow-md), 0 0 0 0 rgba(212, 160, 23, 0.3); }\r\n        50% { box-shadow: var(--shadow-md), 0 0 0 20px rgba(212, 160, 23, 0); }\r\n    }\r\n\r\n    @keyframes cuPulseRingOuter {\r\n        0%, 100% { transform: scale(1); opacity: 1; }\r\n        50% { transform: scale(1.15); opacity: 0.3; }\r\n    }\r\n\r\n    @keyframes cuSpinSlow {\r\n        from { transform: rotate(0deg); }\r\n        to { transform: rotate(360deg); }\r\n    }\r\n\r\n    .cu-outer .icon-ring svg {\r\n        width: 56px;\r\n        height: 56px;\r\n        color: var(--primary);\r\n        animation: cuBounceSoft 2s ease-in-out infinite;\r\n    }\r\n\r\n    @keyframes cuBounceSoft {\r\n        0%, 100% { transform: translateY(0); }\r\n        50% { transform: translateY(-8px); }\r\n    }\r\n\r\n    .cu-outer .badge {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 0.5rem;\r\n        background: rgba(212, 160, 23, 0.12);\r\n        color: var(--primary-dark);\r\n        font-size: 0.75rem;\r\n        font-weight: 700;\r\n        letter-spacing: 0.12em;\r\n        text-transform: uppercase;\r\n        padding: 0.5rem 1.25rem;\r\n        border-radius: 50px;\r\n        border: 1px solid rgba(212, 160, 23, 0.3);\r\n        margin-bottom: 1.5rem;\r\n        animation: cuFadeInUp 0.8s ease-out;\r\n    }\r\n\r\n    .cu-outer .badge .dot {\r\n        width: 8px;\r\n        height: 8px;\r\n        border-radius: 50%;\r\n        background: var(--secondary);\r\n        animation: cuBlinkDot 1.5s ease-in-out infinite;\r\n    }\r\n\r\n    @keyframes cuBlinkDot {\r\n        0%, 100% { opacity: 1; transform: scale(1); }\r\n        50% { opacity: 0.3; transform: scale(0.7); }\r\n    }\r\n\r\n    .cu-outer .title {\r\n        font-size: clamp(2rem, 5vw, 3.2rem);\r\n        font-weight: 800;\r\n        color: var(--primary);\r\n        line-height: 1.15;\r\n        letter-spacing: -0.03em;\r\n        margin-bottom: 1rem;\r\n        animation: cuFadeInUp 0.8s ease-out 0.1s both;\r\n    }\r\n\r\n    .cu-outer .title .highlight {\r\n        color: var(--secondary);\r\n        position: relative;\r\n        display: inline-block;\r\n    }\r\n\r\n    .cu-outer .title .highlight::after {\r\n        content: '';\r\n        position: absolute;\r\n        bottom: 4px; left: 0; right: 0;\r\n        height: 4px;\r\n        background: var(--secondary);\r\n        border-radius: 2px;\r\n        opacity: 0.4;\r\n        transform: scaleX(0);\r\n        transform-origin: left;\r\n        animation: cuUnderlineGrow 1s ease-out 1.2s forwards;\r\n    }\r\n\r\n    @keyframes cuUnderlineGrow { to { transform: scaleX(1); } }\r\n\r\n    .cu-outer .subtitle {\r\n        font-size: clamp(1rem, 2vw, 1.2rem);\r\n        color: var(--text);\r\n        opacity: 0.75;\r\n        line-height: 1.7;\r\n        max-width: 550px;\r\n        margin: 0 auto 2.5rem;\r\n        font-weight: 400;\r\n        animation: cuFadeInUp 0.8s ease-out 0.2s both;\r\n    }\r\n\r\n    .cu-outer .progress-section {\r\n        max-width: 420px;\r\n        margin: 0 auto 2.5rem;\r\n        animation: cuFadeInUp 0.8s ease-out 0.3s both;\r\n    }\r\n\r\n    .cu-outer .progress-labels {\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        margin-bottom: 0.6rem;\r\n        font-size: 0.8rem;\r\n        font-weight: 600;\r\n        color: var(--text);\r\n        opacity: 0.7;\r\n    }\r\n\r\n    .cu-outer .progress-percent {\r\n        color: var(--primary);\r\n        font-weight: 700;\r\n        font-size: 0.9rem;\r\n    }\r\n\r\n    .cu-outer .progress-bar-track {\r\n        width: 100%;\r\n        height: 10px;\r\n        background: var(--bg-mint);\r\n        border-radius: 50px;\r\n        overflow: hidden;\r\n        position: relative;\r\n        box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06);\r\n    }\r\n\r\n    .cu-outer .progress-bar-fill {\r\n        height: 100%;\r\n        width: 72%;\r\n        background: linear-gradient(90deg, var(--primary), var(--primary-light), var(--secondary));\r\n        background-size: 200% 100%;\r\n        border-radius: 50px;\r\n        animation: cuGradientShift 3s linear infinite;\r\n        position: relative;\r\n        transition: width 0.3s ease;\r\n    }\r\n\r\n    .cu-outer .progress-bar-fill::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 0; left: 0; right: 0; bottom: 0;\r\n        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);\r\n        animation: cuShimmer 2s ease-in-out infinite;\r\n    }\r\n\r\n    @keyframes cuShimmer {\r\n        0% { transform: translateX(100%); }\r\n        100% { transform: translateX(-100%); }\r\n    }\r\n\r\n    .cu-outer .divider {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 1rem;\r\n        max-width: 400px;\r\n        margin: 2rem auto 2rem;\r\n        animation: cuFadeInUp 0.8s ease-out 0.4s both;\r\n    }\r\n    .cu-outer .divider-line {\r\n        flex: 1;\r\n        height: 1px;\r\n        background: linear-gradient(90deg, transparent, rgba(14, 92, 70, 0.2), transparent);\r\n    }\r\n    .cu-outer .divider-icon {\r\n        color: var(--secondary);\r\n        font-size: 1rem;\r\n        flex-shrink: 0;\r\n    }\r\n\r\n    .cu-outer .notify-form {\r\n        display: flex;\r\n        align-items: stretch;\r\n        gap: 0.75rem;\r\n        max-width: 480px;\r\n        margin: 0 auto 2rem;\r\n        animation: cuFadeInUp 0.8s ease-out 0.5s both;\r\n    }\r\n\r\n    .cu-outer .btn-primary {\r\n        -webkit-appearance: none !important;\r\n        appearance: none !important;\r\n        display: inline-flex !important;\r\n        align-items: center;\r\n        justify-content: center;\r\n        height: 54px !important;\r\n        margin: 0 !important;\r\n        padding: 0 1.8rem !important;\r\n        background: linear-gradient(135deg, var(--primary), var(--primary-dark));\r\n        color: #fff;\r\n        border: none;\r\n        border-radius: var(--radius-sm);\r\n        font-weight: 700;\r\n        font-size: 0.95rem;\r\n        line-height: 1.2 !important;\r\n        font-family: inherit;\r\n        cursor: pointer;\r\n        transition: var(--transition);\r\n        white-space: nowrap;\r\n        letter-spacing: 0.02em;\r\n        box-shadow: 0 4px 14px rgba(14, 92, 70, 0.3);\r\n        position: relative;\r\n        overflow: hidden;\r\n        box-sizing: border-box !important;\r\n    }\r\n\r\n    .cu-outer .btn-primary::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: 50%; left: 50%;\r\n        width: 0; height: 0;\r\n        border-radius: 50%;\r\n        background: rgba(255, 255, 255, 0.2);\r\n        transform: translate(-50%, -50%);\r\n        transition: width 0.6s, height 0.6s;\r\n    }\r\n\r\n    .cu-outer .btn-primary:hover::after { width: 300px; height: 300px; }\r\n\r\n    .cu-outer .btn-primary:hover {\r\n        background: linear-gradient(135deg, var(--primary-light), var(--primary));\r\n        box-shadow: 0 6px 20px rgba(14, 92, 70, 0.4);\r\n        transform: translateY(-2px);\r\n    }\r\n\r\n    .cu-outer .btn-primary:active {\r\n        transform: translateY(0);\r\n        box-shadow: 0 2px 8px rgba(14, 92, 70, 0.3);\r\n    }\r\n\r\n    .cu-outer .feature-list {\r\n        display: flex;\r\n        justify-content: center;\r\n        gap: 2rem;\r\n        flex-wrap: wrap;\r\n        animation: cuFadeInUp 0.8s ease-out 0.6s both;\r\n    }\r\n\r\n    .cu-outer .feature-item {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 0.5rem;\r\n        font-size: 0.85rem;\r\n        font-weight: 500;\r\n        color: var(--text);\r\n        opacity: 0.7;\r\n        transition: var(--transition);\r\n        cursor: default;\r\n    }\r\n\r\n    .cu-outer .feature-item:hover {\r\n        opacity: 1;\r\n        color: var(--primary);\r\n        transform: translateY(-2px);\r\n    }\r\n\r\n    .cu-outer .feature-dot {\r\n        width: 8px;\r\n        height: 8px;\r\n        border-radius: 50%;\r\n        background: var(--secondary);\r\n        flex-shrink: 0;\r\n    }\r\n\r\n    .cu-outer .social-links {\r\n        display: flex;\r\n        justify-content: center;\r\n        gap: 0.75rem;\r\n        margin-top: 2rem;\r\n        animation: cuFadeInUp 0.8s ease-out 0.7s both;\r\n    }\r\n\r\n    .cu-outer .social-link {\r\n        width: 42px;\r\n        height: 42px;\r\n        border-radius: 50%;\r\n        background: var(--bg-mint);\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        color: var(--primary);\r\n        text-decoration: none;\r\n        transition: var(--transition);\r\n        border: 1px solid rgba(14, 92, 70, 0.1);\r\n        font-size: 1.1rem;\r\n    }\r\n\r\n    .cu-outer .social-link:hover {\r\n        background: var(--primary);\r\n        color: #fff;\r\n        transform: translateY(-3px);\r\n        box-shadow: 0 6px 16px rgba(14, 92, 70, 0.3);\r\n        border-color: var(--primary);\r\n    }\r\n\r\n    \/* Floating particles \u2014 absolute to wrapper, not viewport *\/\r\n    .cu-outer .particle {\r\n        position: absolute;\r\n        border-radius: 50%;\r\n        pointer-events: none;\r\n        z-index: 1;\r\n        animation: cuParticleFloat 6s ease-in-out infinite;\r\n    }\r\n    .cu-outer .particle:nth-child(5) { width: 6px; height: 6px; background: var(--secondary); top: 15%; left: 10%; animation-delay: 0s; opacity: 0.5; }\r\n    .cu-outer .particle:nth-child(6) { width: 4px; height: 4px; background: var(--primary); top: 25%; right: 15%; animation-delay: -2s; opacity: 0.4; }\r\n    .cu-outer .particle:nth-child(7) { width: 8px; height: 8px; background: var(--secondary-light); bottom: 20%; left: 20%; animation-delay: -4s; opacity: 0.35; }\r\n    .cu-outer .particle:nth-child(8) { width: 5px; height: 5px; background: var(--primary-light); bottom: 30%; right: 8%; animation-delay: -1s; opacity: 0.45; }\r\n    .cu-outer .particle:nth-child(9) { width: 3px; height: 3px; background: var(--secondary); top: 60%; left: 5%; animation-delay: -3s; opacity: 0.5; }\r\n\r\n    @keyframes cuParticleFloat {\r\n        0%, 100% { transform: translateY(0) translateX(0) scale(1); opacity: 0.4; }\r\n        25% { transform: translateY(-30px) translateX(10px) scale(1.3); opacity: 0.7; }\r\n        50% { transform: translateY(-10px) translateX(-5px) scale(0.9); opacity: 0.3; }\r\n        75% { transform: translateY(-40px) translateX(8px) scale(1.1); opacity: 0.6; }\r\n    }\r\n\r\n    @keyframes cuFadeInUp {\r\n        from { opacity: 0; transform: translateY(24px); }\r\n        to { opacity: 1; transform: translateY(0); }\r\n    }\r\n\r\n    @media (max-width: 640px) {\r\n        .cu-outer { padding: 1.5rem 1rem; }\r\n        .cu-outer .construction-card { padding: 2.5rem 1.5rem 2rem; border-radius: var(--radius-lg); }\r\n        .cu-outer .notify-form { flex-direction: column; }\r\n        .cu-outer .btn-primary { width: 100%; padding: 0.9rem; }\r\n        .cu-outer .icon-ring { width: 90px; height: 90px; }\r\n        .cu-outer .icon-ring svg { width: 40px; height: 40px; }\r\n        .cu-outer .feature-list { gap: 1.25rem; }\r\n        .cu-outer .social-links { gap: 0.5rem; }\r\n        .cu-outer .social-link { width: 36px; height: 36px; font-size: 0.95rem; }\r\n    }\r\n\r\n    @media (max-width: 380px) {\r\n        .cu-outer .construction-card { padding: 1.75rem 1rem 1.5rem; border-radius: var(--radius-md); }\r\n        .cu-outer .title { font-size: 1.6rem; }\r\n        .cu-outer .feature-list { gap: 0.9rem; font-size: 0.75rem; }\r\n    }\r\n<\/style>\r\n\r\n    <!-- Animated Background Blobs -->\r\n    <div class=\"bg-blob bg-blob-1\"><\/div>\r\n    <div class=\"bg-blob bg-blob-2\"><\/div>\r\n    <div class=\"bg-blob bg-blob-3\"><\/div>\r\n    <div class=\"grid-overlay\"><\/div>\r\n\r\n    <!-- Floating Particles -->\r\n    <div class=\"particle\"><\/div>\r\n    <div class=\"particle\"><\/div>\r\n    <div class=\"particle\"><\/div>\r\n    <div class=\"particle\"><\/div>\r\n    <div class=\"particle\"><\/div>\r\n\r\n    <!-- Main Content -->\r\n    <div class=\"construction-wrapper\">\r\n        <div class=\"construction-card\">\r\n\r\n            <div class=\"corner-accent tl\"><\/div>\r\n            <div class=\"corner-accent br\"><\/div>\r\n            <div class=\"corner-accent tr\"><\/div>\r\n\r\n            <div class=\"icon-container\">\r\n                <div class=\"icon-ring\">\r\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                        <path d=\"M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z\"\/>\r\n                        <circle cx=\"5\" cy=\"19\" r=\"1.2\" fill=\"currentColor\" stroke=\"none\"\/>\r\n                    <\/svg>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"badge\">\r\n                <span class=\"dot\"><\/span>\r\n                Under Construction\r\n            <\/div>\r\n\r\n            <h1 class=\"title\">\r\n                We're Building<br>\r\n                Something <span class=\"highlight\">Amazing<\/span>\r\n            <\/h1>\r\n\r\n            <p class=\"subtitle\">\r\n                Our team is working hard to bring you an exceptional experience.\r\n                We're crafting every detail with care \u2014 stay tuned for the big reveal!\r\n            <\/p>\r\n\r\n            <div class=\"progress-section\">\r\n                <div class=\"progress-labels\">\r\n                    <span>Progress<\/span>\r\n                    <span class=\"progress-percent\">72%<\/span>\r\n                <\/div>\r\n                <div class=\"progress-bar-track\">\r\n                    <div class=\"progress-bar-fill\"><\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"divider\">\r\n                <span class=\"divider-line\"><\/span>\r\n                <span class=\"divider-icon\">\u2726<\/span>\r\n                <span class=\"divider-line\"><\/span>\r\n            <\/div>\r\n\r\n            <form class=\"notify-form\" onsubmit=\"event.preventDefault(); cuHandleNotify(this);\">\r\n                <input\r\n                type=\"email\"\r\n                class=\"cu-email-input\"\r\n                placeholder=\"Enter your email address\"\r\n                required\r\n                aria-label=\"Email address for notification\"\r\n                style=\"flex:1 1 auto !important; height:54px !important; min-height:54px !important; max-height:54px !important; width:100% !important; margin:0 !important; padding:0 1.25rem !important; border:2px solid rgba(14,92,70,0.15) !important; border-radius:8px !important; background:#E7F1EC !important; color:#1B2A2F !important; font-size:0.95rem !important; line-height:normal !important; box-sizing:border-box !important; box-shadow:none !important; -webkit-appearance:none !important; appearance:none !important;\"\r\n                \/>\r\n                <button type=\"submit\" class=\"btn-primary\"\r\n                style=\"height:54px !important; min-height:54px !important; max-height:54px !important; margin:0 !important; padding:0 1.8rem !important; border:none !important; border-radius:8px !important; box-sizing:border-box !important; line-height:normal !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; -webkit-appearance:none !important; appearance:none !important;\"\r\n                >Notify Me<\/button>\r\n            <\/form>\r\n\r\n            <div class=\"feature-list\">\r\n                <span class=\"feature-item\"><span class=\"feature-dot\"><\/span> Responsive Design<\/span>\r\n                <span class=\"feature-item\"><span class=\"feature-dot\"><\/span> SEO Optimized<\/span>\r\n                <span class=\"feature-item\"><span class=\"feature-dot\"><\/span> Fast Loading<\/span>\r\n                <span class=\"feature-item\"><span class=\"feature-dot\"><\/span> Secure<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"social-links\">\r\n                <a href=\"#\" class=\"social-link\" aria-label=\"Twitter\">\r\n                    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z\"\/><\/svg>\r\n                <\/a>\r\n                <a href=\"#\" class=\"social-link\" aria-label=\"LinkedIn\">\r\n                    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.225 0z\"\/><\/svg>\r\n                <\/a>\r\n                <a href=\"#\" class=\"social-link\" aria-label=\"Instagram\">\r\n                    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\"\/><path d=\"M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z\"\/><line x1=\"17.5\" y1=\"6.5\" x2=\"17.51\" y2=\"6.5\"\/><\/svg>\r\n                <\/a>\r\n                <a href=\"#\" class=\"social-link\" aria-label=\"GitHub\">\r\n                    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 0C5.374 0 0 5.373 0 12c0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.509 11.509 0 0 1 12 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12z\"\/><\/svg>\r\n                <\/a>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n    function cuHandleNotify(form) {\r\n        var scope = form.closest('.cu-outer');\r\n        var emailInput = scope.querySelector('.cu-email-input');\r\n        var email = emailInput.value.trim();\r\n\r\n        if (email) {\r\n            var btn = form.querySelector('.btn-primary');\r\n            var originalText = btn.textContent;\r\n            btn.textContent = '\u2713 Subscribed!';\r\n            btn.style.background = 'linear-gradient(135deg, #D4A017, #b8890f)';\r\n            emailInput.value = '';\r\n\r\n            setTimeout(function() {\r\n                btn.textContent = originalText;\r\n                btn.style.background = '';\r\n            }, 2500);\r\n\r\n            var card = scope.querySelector('.construction-card');\r\n            card.style.transition = 'transform 0.3s ease';\r\n            card.style.transform = 'scale(0.98)';\r\n            setTimeout(function() {\r\n                card.style.transform = 'scale(1)';\r\n            }, 200);\r\n        }\r\n    }\r\n    window.cuHandleNotify = cuHandleNotify;\r\n\r\n    \/\/ Dynamic progress percentage, scoped to each instance on the page\r\n    document.querySelectorAll('.cu-outer').forEach(function(scope){\r\n        var progressFill = scope.querySelector('.progress-bar-fill');\r\n        var progressPercent = scope.querySelector('.progress-percent');\r\n        var percentages = [68, 71, 73, 70, 72, 74, 69, 72];\r\n        var idx = 0;\r\n        setInterval(function(){\r\n            idx = (idx + 1) % percentages.length;\r\n            var val = percentages[idx];\r\n            progressFill.style.width = val + '%';\r\n            progressPercent.textContent = val + '%';\r\n        }, 3000);\r\n    });\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Under Construction We&#8217;re Building Something Amazing Our team is working hard to bring you an exceptional experience. We&#8217;re crafting every detail with care \u2014 stay tuned for the big reveal! Progress 72% \u2726 Notify Me Responsive Design SEO Optimized Fast Loading Secure<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-54","page","type-page","status-publish","hentry"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":7}},"_links":{"self":[{"href":"https:\/\/al-ishraaq.com\/en\/wp-json\/wp\/v2\/pages\/54","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/al-ishraaq.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/al-ishraaq.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/al-ishraaq.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/al-ishraaq.com\/en\/wp-json\/wp\/v2\/comments?post=54"}],"version-history":[{"count":4,"href":"https:\/\/al-ishraaq.com\/en\/wp-json\/wp\/v2\/pages\/54\/revisions"}],"predecessor-version":[{"id":455,"href":"https:\/\/al-ishraaq.com\/en\/wp-json\/wp\/v2\/pages\/54\/revisions\/455"}],"wp:attachment":[{"href":"https:\/\/al-ishraaq.com\/en\/wp-json\/wp\/v2\/media?parent=54"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}