{"id":51,"date":"2021-12-09T11:36:27","date_gmt":"2021-12-09T11:36:27","guid":{"rendered":"http:\/\/fastwpdemo.com\/demo\/charityhome\/?page_id=51"},"modified":"2026-09-26T22:21:50","modified_gmt":"2026-09-26T22:21:50","slug":"contact","status":"publish","type":"page","link":"https:\/\/alamal-association.com\/en\/contact\/","title":{"rendered":"Contact Us"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"51\" class=\"elementor elementor-51\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-4484395 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"4484395\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-94caa1f\" data-id=\"94caa1f\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-8194823 elementor-widget elementor-widget-html\" data-id=\"8194823\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* =========================================================\r\n   CONTACT \/ REACH US CARDS\r\n   WordPress + Elementor + TranslatePress\r\n\r\n   Arabic = RTL\r\n   English = LTR\r\n========================================================= *\/\r\n\r\n.ms-contact-cards,\r\n.ms-contact-cards * {\r\n    box-sizing: border-box;\r\n}\r\n\r\n.ms-contact-cards {\r\n    width: 100%;\r\n    max-width: 100%;\r\n\r\n    padding: 18px 24px 24px;\r\n\r\n    background: #ffffff;\r\n\r\n    direction: rtl;\r\n\r\n    font-family: \"Tajawal\", \"Arial\", sans-serif;\r\n\r\n    overflow: hidden;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CONTAINER\r\n========================================================= *\/\r\n\r\n.ms-contact-cards__container {\r\n    width: 100%;\r\n    max-width: none;\r\n\r\n    margin: 0;\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns:\r\n        repeat(4, minmax(0, 1fr));\r\n\r\n    gap: clamp(14px, 2vw, 28px);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CARD\r\n========================================================= *\/\r\n\r\n.ms-contact-card {\r\n    min-width: 0;\r\n\r\n    min-height: 190px;\r\n\r\n    padding: 20px 16px 14px;\r\n\r\n    background: #ffffff;\r\n\r\n    border: 1px solid #eeeeee;\r\n\r\n    border-radius: 16px;\r\n\r\n    display: flex;\r\n\r\n    flex-direction: column;\r\n\r\n    align-items: center;\r\n\r\n    justify-content: flex-start;\r\n\r\n    text-align: center;\r\n\r\n    text-decoration: none;\r\n\r\n    box-shadow:\r\n        0 4px 14px rgba(0, 0, 0, 0.035);\r\n\r\n    transition:\r\n        transform 0.25s ease,\r\n        box-shadow 0.25s ease;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HOVER\r\n========================================================= *\/\r\n\r\n.ms-contact-card:hover {\r\n    transform: translateY(-4px);\r\n\r\n    box-shadow:\r\n        0 9px 24px rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ICON\r\n========================================================= *\/\r\n\r\n.ms-contact-card__icon {\r\n    width: clamp(56px, 5vw, 68px);\r\n\r\n    height: clamp(56px, 5vw, 68px);\r\n\r\n    margin-bottom: 9px;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n\r\n    justify-content: center;\r\n\r\n    flex-shrink: 0;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SVG\r\n========================================================= *\/\r\n\r\n.ms-contact-card__icon svg {\r\n    width: 100%;\r\n\r\n    height: 100%;\r\n\r\n    display: block;\r\n\r\n    fill: none;\r\n\r\n    stroke: currentColor;\r\n\r\n    stroke-width: 2;\r\n\r\n    stroke-linecap: round;\r\n\r\n    stroke-linejoin: round;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ICON COLORS\r\n========================================================= *\/\r\n\r\n\/* Phone *\/\r\n.ms-contact-card--phone {\r\n    color: #071a35;\r\n}\r\n\r\n\/* WhatsApp *\/\r\n.ms-contact-card--whatsapp {\r\n    color: #25a95a;\r\n}\r\n\r\n\/* Email *\/\r\n.ms-contact-card--email {\r\n    color: #d32670;\r\n}\r\n\r\n\/* Location *\/\r\n.ms-contact-card--location {\r\n    color: #d32670;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   TITLE\r\n========================================================= *\/\r\n\r\n.ms-contact-card__title {\r\n    width: 100%;\r\n\r\n    margin: 0 0 6px;\r\n\r\n    color: #071a35;\r\n\r\n    font-size: clamp(16px, 1.45vw, 21px);\r\n\r\n    line-height: 1.4;\r\n\r\n    font-weight: 800;\r\n\r\n    text-align: center;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   DESCRIPTION\r\n========================================================= *\/\r\n\r\n.ms-contact-card__text {\r\n    width: 100%;\r\n\r\n    max-width: 230px;\r\n\r\n    margin: 0 auto;\r\n\r\n    color: #26344a;\r\n\r\n    font-size: clamp(12px, 1vw, 15px);\r\n\r\n    line-height: 1.6;\r\n\r\n    font-weight: 500;\r\n\r\n    text-align: center;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ARROW\r\n========================================================= *\/\r\n\r\n.ms-contact-card__arrow {\r\n    margin-top: auto;\r\n\r\n    padding-top: 10px;\r\n\r\n    color: #d32670;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 27px;\r\n\r\n    line-height: 1;\r\n\r\n    font-weight: 400;\r\n\r\n    transition: transform 0.2s ease;\r\n}\r\n\r\n.ms-contact-card:hover .ms-contact-card__arrow {\r\n    transform: translateX(-4px);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ENGLISH DIRECTION\r\n========================================================= *\/\r\n\r\nhtml[lang^=\"en\"] .ms-contact-cards {\r\n    direction: ltr;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   LARGE DESKTOP\r\n========================================================= *\/\r\n\r\n@media (min-width: 1500px) {\r\n\r\n    .ms-contact-cards {\r\n        padding-left: 40px;\r\n        padding-right: 40px;\r\n    }\r\n\r\n    .ms-contact-cards__container {\r\n        gap: 32px;\r\n    }\r\n\r\n    .ms-contact-card {\r\n        min-height: 205px;\r\n\r\n        padding: 22px 18px 16px;\r\n    }\r\n\r\n    .ms-contact-card__title {\r\n        font-size: 21px;\r\n    }\r\n\r\n    .ms-contact-card__text {\r\n        font-size: 15px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SMALL LAPTOP \/ MEDIUM DESKTOP\r\n========================================================= *\/\r\n\r\n@media (max-width: 1200px) {\r\n\r\n    .ms-contact-cards {\r\n        padding-left: 20px;\r\n        padding-right: 20px;\r\n    }\r\n\r\n    .ms-contact-cards__container {\r\n        gap: 16px;\r\n    }\r\n\r\n    .ms-contact-card {\r\n        min-height: 180px;\r\n\r\n        padding: 17px 12px 13px;\r\n    }\r\n\r\n    .ms-contact-card__icon {\r\n        width: 56px;\r\n        height: 56px;\r\n    }\r\n\r\n    .ms-contact-card__title {\r\n        font-size: 17px;\r\n    }\r\n\r\n    .ms-contact-card__text {\r\n        font-size: 13px;\r\n    }\r\n\r\n    .ms-contact-card__arrow {\r\n        font-size: 24px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   TABLET\r\n========================================================= *\/\r\n\r\n@media (max-width: 900px) {\r\n\r\n    .ms-contact-cards {\r\n        padding: 16px 16px 20px;\r\n    }\r\n\r\n    .ms-contact-cards__container {\r\n        grid-template-columns:\r\n            repeat(2, minmax(0, 1fr));\r\n\r\n        gap: 14px;\r\n    }\r\n\r\n    .ms-contact-card {\r\n        min-height: 175px;\r\n\r\n        padding: 16px 12px 12px;\r\n\r\n        border-radius: 14px;\r\n    }\r\n\r\n    .ms-contact-card__icon {\r\n        width: 54px;\r\n        height: 54px;\r\n\r\n        margin-bottom: 8px;\r\n    }\r\n\r\n    .ms-contact-card__title {\r\n        font-size: 16px;\r\n    }\r\n\r\n    .ms-contact-card__text {\r\n        max-width: 220px;\r\n\r\n        font-size: 12.5px;\r\n\r\n        line-height: 1.55;\r\n    }\r\n\r\n    .ms-contact-card__arrow {\r\n        font-size: 23px;\r\n\r\n        padding-top: 8px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MOBILE\r\n========================================================= *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n    .ms-contact-cards {\r\n        padding: 14px 10px 18px;\r\n    }\r\n\r\n    .ms-contact-cards__container {\r\n        grid-template-columns:\r\n            repeat(2, minmax(0, 1fr));\r\n\r\n        gap: 10px;\r\n    }\r\n\r\n    .ms-contact-card {\r\n        min-height: 165px;\r\n\r\n        padding: 14px 7px 10px;\r\n\r\n        border-radius: 12px;\r\n    }\r\n\r\n    .ms-contact-card__icon {\r\n        width: 48px;\r\n        height: 48px;\r\n\r\n        margin-bottom: 7px;\r\n    }\r\n\r\n    .ms-contact-card__title {\r\n        font-size: 14px;\r\n\r\n        line-height: 1.4;\r\n\r\n        margin-bottom: 5px;\r\n    }\r\n\r\n    .ms-contact-card__text {\r\n        max-width: 180px;\r\n\r\n        font-size: 11.5px;\r\n\r\n        line-height: 1.55;\r\n    }\r\n\r\n    .ms-contact-card__arrow {\r\n        font-size: 22px;\r\n\r\n        padding-top: 7px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SMALL MOBILE\r\n========================================================= *\/\r\n\r\n@media (max-width: 390px) {\r\n\r\n    .ms-contact-cards {\r\n        padding-left: 7px;\r\n        padding-right: 7px;\r\n    }\r\n\r\n    .ms-contact-cards__container {\r\n        gap: 8px;\r\n    }\r\n\r\n    .ms-contact-card {\r\n        min-height: 155px;\r\n\r\n        padding: 12px 6px 9px;\r\n\r\n        border-radius: 11px;\r\n    }\r\n\r\n    .ms-contact-card__icon {\r\n        width: 44px;\r\n        height: 44px;\r\n\r\n        margin-bottom: 6px;\r\n    }\r\n\r\n    .ms-contact-card__title {\r\n        font-size: 13px;\r\n\r\n        margin-bottom: 4px;\r\n    }\r\n\r\n    .ms-contact-card__text {\r\n        max-width: 160px;\r\n\r\n        font-size: 10.5px;\r\n\r\n        line-height: 1.5;\r\n    }\r\n\r\n    .ms-contact-card__arrow {\r\n        font-size: 20px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   VERY SMALL SCREENS\r\n========================================================= *\/\r\n\r\n@media (max-width: 320px) {\r\n\r\n    .ms-contact-cards {\r\n        padding-left: 5px;\r\n        padding-right: 5px;\r\n    }\r\n\r\n    .ms-contact-cards__container {\r\n        grid-template-columns: 1fr;\r\n\r\n        gap: 9px;\r\n    }\r\n\r\n    .ms-contact-card {\r\n        min-height: 145px;\r\n\r\n        padding: 13px 10px 10px;\r\n    }\r\n\r\n    .ms-contact-card__icon {\r\n        width: 46px;\r\n        height: 46px;\r\n    }\r\n\r\n    .ms-contact-card__title {\r\n        font-size: 15px;\r\n    }\r\n\r\n    .ms-contact-card__text {\r\n        max-width: 240px;\r\n\r\n        font-size: 12px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   LANGUAGE SWITCHING STABILITY\r\n   Prevent text flicker while TranslatePress changes language.\r\n========================================================= *\/\r\n\r\n.ms-contact-cards__title,\r\n.ms-contact-cards__text,\r\n.ms-contact-cards__arrow {\r\n    backface-visibility: hidden;\r\n    -webkit-font-smoothing: antialiased;\r\n}\r\n<\/style>\r\n\r\n\r\n<section class=\"ms-contact-cards\">\r\n\r\n    <div class=\"ms-contact-cards__container\">\r\n\r\n\r\n        <!-- =================================================\r\n             1 \u2014 PHONE\r\n        ================================================== -->\r\n\r\n        <a\r\n            href=\"tel:+201000000000\"\r\n            class=\"ms-contact-card ms-contact-card--phone\"\r\n        >\r\n\r\n            <div class=\"ms-contact-card__icon\">\r\n\r\n                <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                    <path\r\n                        d=\"M14 7\r\n                           c-2 1-4 4-3 7\r\n                           2 9 8 16 16 20\r\n                           4 2 7 1 9-1\r\n                           l3-3\r\n                           c1-1 1-3 0-4\r\n                           l-5-4\r\n                           c-1-1-3-1-4 0\r\n                           l-3 3\r\n                           c-3-2-6-5-8-8\r\n                           l3-3\r\n                           c1-1 1-3 0-4\r\n                           l-4-5\r\n                           c-1-1-2-1-4-1z\"\r\n                    \/>\r\n\r\n                <\/svg>\r\n\r\n            <\/div>\r\n\r\n\r\n            <h3\r\n                class=\"ms-contact-card__title\"\r\n                data-ar=\"\u0627\u062a\u0635\u0644 \u0628\u0646\u0627\"\r\n                data-en=\"Contact Us\"\r\n            >\r\n                \u0627\u062a\u0635\u0644 \u0628\u0646\u0627\r\n            <\/h3>\r\n\r\n\r\n            <p\r\n                class=\"ms-contact-card__text\"\r\n                data-ar=\"\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0639\u0628\u0631 \u0627\u0644\u0647\u0627\u062a\u0641\"\r\n                data-en=\"Get in touch with us by phone\"\r\n            >\r\n                \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0639\u0628\u0631 \u0627\u0644\u0647\u0627\u062a\u0641\r\n            <\/p>\r\n\r\n\r\n            <div\r\n                class=\"ms-contact-card__arrow\"\r\n                data-ar=\"\u2190\"\r\n                data-en=\"\u2192\"\r\n                aria-hidden=\"true\"\r\n            >\r\n                \u2190\r\n            <\/div>\r\n\r\n        <\/a>\r\n\r\n\r\n        <!-- =================================================\r\n             2 \u2014 WHATSAPP\r\n        ================================================== -->\r\n\r\n        <a\r\n            href=\"https:\/\/wa.me\/201000000000\"\r\n            class=\"ms-contact-card ms-contact-card--whatsapp\"\r\n            target=\"_blank\"\r\n            rel=\"noopener\"\r\n        >\r\n\r\n            <div class=\"ms-contact-card__icon\">\r\n\r\n                <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                    <!-- WhatsApp circle -->\r\n\r\n                    <path\r\n                        d=\"M24 6\r\n                           a18 18 0 0 1 15 28\r\n                           l3 8\r\n                           -8-3\r\n                           a18 18 0 1 1-10-33z\"\r\n                    \/>\r\n\r\n                    <!-- WhatsApp phone -->\r\n\r\n                    <path\r\n                        d=\"M18 16\r\n                           c-1 1-2 3-1 5\r\n                           2 5 5 8 10 10\r\n                           2 1 4 0 5-2\r\n                           l1-2\r\n                           -4-2\r\n                           -2 2\r\n                           c-2-1-4-3-5-5\r\n                           l2-2\r\n                           -2-4\r\n                           -4 0z\"\r\n                    \/>\r\n\r\n                <\/svg>\r\n\r\n            <\/div>\r\n\r\n\r\n            <h3\r\n                class=\"ms-contact-card__title\"\r\n                data-ar=\"\u0648\u0627\u062a\u0633\u0627\u0628\"\r\n                data-en=\"WhatsApp\"\r\n            >\r\n                \u0648\u0627\u062a\u0633\u0627\u0628\r\n            <\/h3>\r\n\r\n\r\n            <p\r\n                class=\"ms-contact-card__text\"\r\n                data-ar=\"\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0645\u0628\u0627\u0634\u0631\u0629 \u0639\u0628\u0631 \u0648\u0627\u062a\u0633\u0627\u0628\"\r\n                data-en=\"Contact us directly via WhatsApp\"\r\n            >\r\n                \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0645\u0628\u0627\u0634\u0631\u0629\r\n                \u0639\u0628\u0631 \u0648\u0627\u062a\u0633\u0627\u0628\r\n            <\/p>\r\n\r\n\r\n            <div\r\n                class=\"ms-contact-card__arrow\"\r\n                data-ar=\"\u2190\"\r\n                data-en=\"\u2192\"\r\n                aria-hidden=\"true\"\r\n            >\r\n                \u2190\r\n            <\/div>\r\n\r\n        <\/a>\r\n\r\n\r\n        <!-- =================================================\r\n             3 \u2014 EMAIL\r\n        ================================================== -->\r\n\r\n        <a\r\n            href=\"mailto:info@example.com\"\r\n            class=\"ms-contact-card ms-contact-card--email\"\r\n        >\r\n\r\n            <div class=\"ms-contact-card__icon\">\r\n\r\n                <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                    <!-- Envelope -->\r\n\r\n                    <rect\r\n                        x=\"5\"\r\n                        y=\"10\"\r\n                        width=\"38\"\r\n                        height=\"28\"\r\n                        rx=\"3\"\r\n                    \/>\r\n\r\n                    <!-- Envelope folds -->\r\n\r\n                    <path\r\n                        d=\"M7 13l17 14L41 13\"\r\n                    \/>\r\n\r\n                    <path\r\n                        d=\"M7 35l13-11\"\r\n                    \/>\r\n\r\n                    <path\r\n                        d=\"M41 35L28 24\"\r\n                    \/>\r\n\r\n                <\/svg>\r\n\r\n            <\/div>\r\n\r\n\r\n            <h3\r\n                class=\"ms-contact-card__title\"\r\n                data-ar=\"\u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\"\r\n                data-en=\"Email\"\r\n            >\r\n                \u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\r\n            <\/h3>\r\n\r\n\r\n            <p\r\n                class=\"ms-contact-card__text\"\r\n                data-ar=\"\u0631\u0627\u0633\u0644\u0646\u0627 \u0639\u0628\u0631 \u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\"\r\n                data-en=\"Send us a message by email\"\r\n            >\r\n                \u0631\u0627\u0633\u0644\u0646\u0627 \u0639\u0628\u0631 \u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\r\n            <\/p>\r\n\r\n\r\n            <div\r\n                class=\"ms-contact-card__arrow\"\r\n                data-ar=\"\u2190\"\r\n                data-en=\"\u2192\"\r\n                aria-hidden=\"true\"\r\n            >\r\n                \u2190\r\n            <\/div>\r\n\r\n        <\/a>\r\n\r\n\r\n        <!-- =================================================\r\n             4 \u2014 LOCATION\r\n        ================================================== -->\r\n\r\n        <a\r\n            href=\"#\"\r\n            class=\"ms-contact-card ms-contact-card--location\"\r\n        >\r\n\r\n            <div class=\"ms-contact-card__icon\">\r\n\r\n                <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                    <!-- Location pin -->\r\n\r\n                    <path\r\n                        d=\"M24 43\r\n                           s13-13 13-24\r\n                           a13 13 0 1 0-26 0\r\n                           c0 11 13 24 13 24z\"\r\n                    \/>\r\n\r\n                    <!-- Center -->\r\n\r\n                    <circle\r\n                        cx=\"24\"\r\n                        cy=\"19\"\r\n                        r=\"4\"\r\n                    \/>\r\n\r\n                <\/svg>\r\n\r\n            <\/div>\r\n\r\n\r\n            <h3\r\n                class=\"ms-contact-card__title\"\r\n                data-ar=\"\u0645\u0648\u0642\u0639\u0646\u0627\"\r\n                data-en=\"Our Location\"\r\n            >\r\n                \u0645\u0648\u0642\u0639\u0646\u0627\r\n            <\/h3>\r\n\r\n\r\n            <p\r\n                class=\"ms-contact-card__text\"\r\n                data-ar=\"\u062a\u0639\u0631\u0641 \u0639\u0644\u0649 \u0645\u0648\u0642\u0639\u0646\u0627 \u0648\u0633\u0627\u0639\u0627\u062a \u0627\u0644\u0639\u0645\u0644\"\r\n                data-en=\"Find our location and working hours\"\r\n            >\r\n                \u062a\u0639\u0631\u0641 \u0639\u0644\u0649 \u0645\u0648\u0642\u0639\u0646\u0627 \u0648\u0633\u0627\u0639\u0627\u062a \u0627\u0644\u0639\u0645\u0644\r\n            <\/p>\r\n\r\n\r\n            <div\r\n                class=\"ms-contact-card__arrow\"\r\n                data-ar=\"\u2190\"\r\n                data-en=\"\u2192\"\r\n                aria-hidden=\"true\"\r\n            >\r\n                \u2190\r\n            <\/div>\r\n\r\n        <\/a>\r\n\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\n(function () {\r\n\r\n    \"use strict\";\r\n\r\n\r\n    \/*\r\n     * ========================================================\r\n     * CONTACT CARDS LANGUAGE SYSTEM\r\n     * ========================================================\r\n     *\r\n     * This version intentionally does NOT:\r\n     *\r\n     * - listen to every click\r\n     * - use setInterval()\r\n     * - repeatedly rewrite the text\r\n     *\r\n     * It only updates when the <html lang=\"\"> attribute changes.\r\n     *\r\n     * This prevents the English text from flashing\/disappearing\r\n     * when the user clicks other elements on the page.\r\n     *\/\r\n\r\n\r\n    function updateContactLanguage() {\r\n\r\n        var html = document.documentElement;\r\n\r\n        var section = document.querySelector(\r\n            \".ms-contact-cards\"\r\n        );\r\n\r\n\r\n        \/*\r\n         * Section may not exist yet.\r\n         *\/\r\n\r\n        if (!section) {\r\n            return;\r\n        }\r\n\r\n\r\n        \/*\r\n         * Get current language.\r\n         *\/\r\n\r\n        var lang = (\r\n            html.getAttribute(\"lang\") || \"\"\r\n        ).toLowerCase();\r\n\r\n\r\n        \/*\r\n         * English if language starts with \"en\".\r\n         *\r\n         * Examples:\r\n         *\r\n         * en\r\n         * en-US\r\n         * en-GB\r\n         *\/\r\n\r\n        var isEnglish = lang.indexOf(\"en\") === 0;\r\n\r\n\r\n        \/*\r\n         * Set direction.\r\n         *\/\r\n\r\n        section.style.direction =\r\n            isEnglish ? \"ltr\" : \"rtl\";\r\n\r\n\r\n        \/*\r\n         * Update only elements that have translation\r\n         * attributes.\r\n         *\/\r\n\r\n        var translatedElements =\r\n            section.querySelectorAll(\r\n                \"[data-ar][data-en]\"\r\n            );\r\n\r\n\r\n        translatedElements.forEach(function (element) {\r\n\r\n            var arabicText =\r\n                element.getAttribute(\"data-ar\") || \"\";\r\n\r\n            var englishText =\r\n                element.getAttribute(\"data-en\") || \"\";\r\n\r\n\r\n            var newText =\r\n                isEnglish\r\n                    ? englishText\r\n                    : arabicText;\r\n\r\n\r\n            \/*\r\n             * IMPORTANT:\r\n             *\r\n             * Do not rewrite the DOM when the text\r\n             * is already correct.\r\n             *\r\n             * This is one of the things that prevents\r\n             * unnecessary flickering.\r\n             *\/\r\n\r\n            if (\r\n                element.textContent.trim() !==\r\n                newText.trim()\r\n            ) {\r\n\r\n                element.textContent = newText;\r\n\r\n            }\r\n\r\n        });\r\n\r\n    }\r\n\r\n\r\n    \/*\r\n     * ========================================================\r\n     * INITIAL LOAD\r\n     * ========================================================\r\n     *\/\r\n\r\n    updateContactLanguage();\r\n\r\n\r\n    \/*\r\n     * ========================================================\r\n     * TRANSLATEPRESS LANGUAGE OBSERVER\r\n     * ========================================================\r\n     *\r\n     * TranslatePress normally changes:\r\n     *\r\n     * <html lang=\"ar\">\r\n     *\r\n     * to:\r\n     *\r\n     * <html lang=\"en\">\r\n     *\r\n     * We watch ONLY this attribute.\r\n     *\/\r\n\r\n    var languageObserver =\r\n        new MutationObserver(function (mutations) {\r\n\r\n            for (\r\n                var i = 0;\r\n                i < mutations.length;\r\n                i++\r\n            ) {\r\n\r\n                var mutation = mutations[i];\r\n\r\n\r\n                if (\r\n                    mutation.type === \"attributes\" &&\r\n                    mutation.attributeName === \"lang\"\r\n                ) {\r\n\r\n                    updateContactLanguage();\r\n\r\n                    break;\r\n\r\n                }\r\n\r\n            }\r\n\r\n        });\r\n\r\n\r\n    languageObserver.observe(\r\n        document.documentElement,\r\n        {\r\n            attributes: true,\r\n            attributeFilter: [\"lang\"]\r\n        }\r\n    );\r\n\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-0679b9f elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"0679b9f\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-56b803d\" data-id=\"56b803d\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-527645b elementor-widget elementor-widget-html\" data-id=\"527645b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<style>\r\n\/* =========================================================\r\n   AL AMAL CONTACT SECTION\r\n   FULL WIDTH + LARGE RESPONSIVE TEXT\r\n   Arabic RTL \/ English LTR\r\n========================================================= *\/\r\n\r\n.amal-contact-section,\r\n.amal-contact-section * {\r\n    box-sizing: border-box;\r\n}\r\n\r\n.amal-contact-section {\r\n    width: 100%;\r\n    max-width: none;\r\n    margin: 0;\r\n    padding: 14px 20px 30px;\r\n    background: #ffffff;\r\n    direction: rtl;\r\n    font-family: \"Tajawal\", \"Arial\", sans-serif;\r\n    overflow: hidden;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CONTAINER\r\n========================================================= *\/\r\n\r\n.amal-contact-container {\r\n    width: 100%;\r\n    max-width: none;\r\n    margin: 0;\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns:\r\n        minmax(0, 1fr)\r\n        minmax(0, 1fr)\r\n        minmax(0, 1.65fr);\r\n\r\n    gap: 16px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CARD\r\n========================================================= *\/\r\n\r\n.amal-contact-card {\r\n    min-width: 0;\r\n    width: 100%;\r\n\r\n    background: #ffffff;\r\n\r\n    border: 1px solid #eeeeee;\r\n\r\n    border-radius: 14px;\r\n\r\n    box-shadow:\r\n        0 1px 6px rgba(0, 0, 0, .025);\r\n\r\n    overflow: hidden;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CARD TITLE\r\n========================================================= *\/\r\n\r\n.amal-contact-title {\r\n    margin: 0;\r\n    padding: 12px 14px 9px;\r\n\r\n    color: #071a35;\r\n\r\n    font-size: clamp(21px, 1.45vw, 30px);\r\n\r\n    line-height: 1.35;\r\n\r\n    font-weight: 800;\r\n\r\n    text-align: center;\r\n\r\n    position: relative;\r\n}\r\n\r\n.amal-contact-title::after {\r\n    content: \"\";\r\n\r\n    display: block;\r\n\r\n    width: 120px;\r\n    height: 2px;\r\n\r\n    margin: 6px auto 0;\r\n\r\n    background:\r\n        linear-gradient(\r\n            to right,\r\n            transparent,\r\n            #c99732 20%,\r\n            #d32670 50%,\r\n            #c99732 80%,\r\n            transparent\r\n        );\r\n}\r\n\r\n.amal-contact-title::before {\r\n    content: \"\u2665\";\r\n\r\n    position: absolute;\r\n\r\n    left: 50%;\r\n    bottom: -7px;\r\n\r\n    transform: translateX(-50%);\r\n\r\n    padding: 0 6px;\r\n\r\n    background: #ffffff;\r\n\r\n    color: #d32670;\r\n\r\n    font-size: 11px;\r\n\r\n    line-height: 1;\r\n\r\n    z-index: 3;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CONTACT INFORMATION\r\n========================================================= *\/\r\n\r\n.amal-contact-info {\r\n    padding: 5px 16px 14px;\r\n}\r\n\r\n.amal-contact-info-item {\r\n    min-height: 52px;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n\r\n    gap: 12px;\r\n\r\n    border-bottom: 1px solid #eeeeee;\r\n\r\n    color: #071a35;\r\n\r\n    font-size: clamp(15px, 1.05vw, 19px);\r\n\r\n    line-height: 1.55;\r\n\r\n    font-weight: 500;\r\n}\r\n\r\n.amal-contact-info-item:last-child {\r\n    border-bottom: 0;\r\n}\r\n\r\n.amal-contact-info-icon {\r\n    width: 30px;\r\n    height: 30px;\r\n\r\n    flex: 0 0 30px;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: #071a35;\r\n}\r\n\r\n.amal-contact-info-icon svg {\r\n    width: 25px;\r\n    height: 25px;\r\n\r\n    display: block;\r\n\r\n    fill: none;\r\n\r\n    stroke: currentColor;\r\n\r\n    stroke-width: 1.8;\r\n\r\n    stroke-linecap: round;\r\n\r\n    stroke-linejoin: round;\r\n}\r\n\r\n.amal-contact-info-text {\r\n    min-width: 0;\r\n\r\n    flex: 1;\r\n\r\n    text-align: right;\r\n\r\n    word-break: break-word;\r\n}\r\n\r\n.amal-contact-info-text a {\r\n    color: inherit;\r\n\r\n    text-decoration: none;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   FORM\r\n========================================================= *\/\r\n\r\n.amal-contact-form {\r\n    padding: 5px 16px 16px;\r\n}\r\n\r\n.amal-form-field {\r\n    width: 100%;\r\n\r\n    margin-bottom: 10px;\r\n\r\n    position: relative;\r\n}\r\n\r\n.amal-form-field input,\r\n.amal-form-field select,\r\n.amal-form-field textarea {\r\n    width: 100%;\r\n\r\n    border: 1px solid #e5e5e5 !important;\r\n\r\n    border-radius: 8px !important;\r\n\r\n    background: #ffffff !important;\r\n\r\n    color: #071a35 !important;\r\n\r\n    font-family: \"Tajawal\", \"Arial\", sans-serif !important;\r\n\r\n    font-size: clamp(15px, 1vw, 18px) !important;\r\n\r\n    line-height: 1.5 !important;\r\n\r\n    outline: none !important;\r\n\r\n    box-shadow: none !important;\r\n\r\n    transition:\r\n        border-color .2s ease,\r\n        box-shadow .2s ease;\r\n}\r\n\r\n.amal-form-field input,\r\n.amal-form-field select {\r\n    height: 48px;\r\n\r\n    padding: 8px 14px !important;\r\n}\r\n\r\n.amal-form-field textarea {\r\n    height: 110px;\r\n\r\n    min-height: 110px;\r\n\r\n    resize: vertical;\r\n\r\n    padding: 11px 14px !important;\r\n}\r\n\r\n.amal-form-field input::placeholder,\r\n.amal-form-field textarea::placeholder {\r\n    color: #26344a;\r\n\r\n    opacity: 1;\r\n}\r\n\r\n.amal-form-field input:focus,\r\n.amal-form-field select:focus,\r\n.amal-form-field textarea:focus {\r\n    border-color: #d32670 !important;\r\n\r\n    box-shadow:\r\n        0 0 0 3px rgba(211, 38, 112, .06) !important;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SELECT\r\n========================================================= *\/\r\n\r\n.amal-form-select {\r\n    appearance: none;\r\n\r\n    -webkit-appearance: none;\r\n\r\n    padding-left: 40px !important;\r\n}\r\n\r\n.amal-select-wrap {\r\n    position: relative;\r\n}\r\n\r\n.amal-select-arrow {\r\n    position: absolute;\r\n\r\n    left: 14px;\r\n\r\n    top: 50%;\r\n\r\n    transform: translateY(-50%);\r\n\r\n    pointer-events: none;\r\n\r\n    color: #071a35;\r\n\r\n    font-size: 20px;\r\n\r\n    line-height: 1;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   TEXTAREA\r\n========================================================= *\/\r\n\r\n.amal-message-wrap {\r\n    position: relative;\r\n}\r\n\r\n.amal-message-icon {\r\n    position: absolute;\r\n\r\n    right: 14px;\r\n    top: 13px;\r\n\r\n    width: 21px;\r\n    height: 21px;\r\n\r\n    color: #071a35;\r\n\r\n    pointer-events: none;\r\n}\r\n\r\n.amal-message-icon svg {\r\n    width: 21px;\r\n    height: 21px;\r\n\r\n    fill: none;\r\n\r\n    stroke: currentColor;\r\n\r\n    stroke-width: 1.7;\r\n\r\n    stroke-linecap: round;\r\n\r\n    stroke-linejoin: round;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SUBMIT BUTTON\r\n========================================================= *\/\r\n\r\n.amal-submit {\r\n    width: 190px;\r\n\r\n    height: 46px;\r\n\r\n    margin: 5px auto 0;\r\n\r\n    border: 0;\r\n\r\n    border-radius: 8px;\r\n\r\n    background:\r\n        linear-gradient(\r\n            90deg,\r\n            #d32670,\r\n            #e42d78\r\n        );\r\n\r\n    color: #ffffff;\r\n\r\n    font-family: \"Tajawal\", \"Arial\", sans-serif;\r\n\r\n    font-size: clamp(15px, 1vw, 18px);\r\n\r\n    font-weight: 800;\r\n\r\n    cursor: pointer;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n\r\n    justify-content: center;\r\n\r\n    gap: 8px;\r\n\r\n    box-shadow:\r\n        0 3px 8px rgba(211, 38, 112, .16);\r\n\r\n    transition:\r\n        transform .2s ease,\r\n        opacity .2s ease;\r\n}\r\n\r\n.amal-submit:hover {\r\n    transform: translateY(-1px);\r\n\r\n    opacity: .94;\r\n}\r\n\r\n.amal-submit:disabled {\r\n    cursor: wait;\r\n\r\n    opacity: .65;\r\n\r\n    transform: none;\r\n}\r\n\r\n.amal-submit svg {\r\n    width: 20px;\r\n    height: 20px;\r\n\r\n    fill: none;\r\n\r\n    stroke: currentColor;\r\n\r\n    stroke-width: 2;\r\n\r\n    stroke-linecap: round;\r\n\r\n    stroke-linejoin: round;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   FORM MESSAGE\r\n========================================================= *\/\r\n\r\n.amal-form-result {\r\n    min-height: 22px;\r\n\r\n    margin: 7px 0 0;\r\n\r\n    color: #071a35;\r\n\r\n    font-size: clamp(13px, .9vw, 16px);\r\n\r\n    line-height: 1.5;\r\n\r\n    text-align: center;\r\n}\r\n\r\n.amal-form-result.success {\r\n    color: #168a57;\r\n}\r\n\r\n.amal-form-result.error {\r\n    color: #c3264e;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MAP\r\n========================================================= *\/\r\n\r\n.amal-map {\r\n    width: 100%;\r\n\r\n    height: clamp(260px, 25vw, 420px);\r\n\r\n    overflow: hidden;\r\n\r\n    border-radius: 0 0 10px 10px;\r\n\r\n    position: relative;\r\n\r\n    background: #edf2f5;\r\n}\r\n\r\n.amal-map iframe {\r\n    width: 100%;\r\n\r\n    height: 100%;\r\n\r\n    border: 0;\r\n\r\n    display: block;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MAP INFORMATION\r\n========================================================= *\/\r\n\r\n.amal-map-bottom {\r\n    min-height: 82px;\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns:\r\n        1fr\r\n        1fr;\r\n\r\n    border-top: 1px solid #eeeeee;\r\n\r\n    background: #ffffff;\r\n}\r\n\r\n.amal-map-info {\r\n    padding: 10px 14px;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n\r\n    gap: 11px;\r\n}\r\n\r\n.amal-map-info + .amal-map-info {\r\n    border-right: 1px solid #eeeeee;\r\n}\r\n\r\n.amal-map-info-icon {\r\n    width: 36px;\r\n    height: 36px;\r\n\r\n    flex: 0 0 36px;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: #071a35;\r\n}\r\n\r\n.amal-map-info-icon svg {\r\n    width: 29px;\r\n    height: 29px;\r\n\r\n    fill: none;\r\n\r\n    stroke: currentColor;\r\n\r\n    stroke-width: 1.7;\r\n\r\n    stroke-linecap: round;\r\n\r\n    stroke-linejoin: round;\r\n}\r\n\r\n.amal-map-info-content {\r\n    min-width: 0;\r\n}\r\n\r\n.amal-map-info-title {\r\n    margin: 0 0 3px;\r\n\r\n    color: #071a35;\r\n\r\n    font-size: clamp(14px, .95vw, 18px);\r\n\r\n    font-weight: 800;\r\n\r\n    line-height: 1.4;\r\n}\r\n\r\n.amal-map-info-text {\r\n    margin: 0;\r\n\r\n    color: #26344a;\r\n\r\n    font-size: clamp(12px, .8vw, 15px);\r\n\r\n    line-height: 1.55;\r\n\r\n    font-weight: 500;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ENGLISH\r\n========================================================= *\/\r\n\r\nhtml[lang^=\"en\"] .amal-contact-section {\r\n    direction: ltr;\r\n}\r\n\r\nhtml[lang^=\"en\"] .amal-contact-info-text {\r\n    text-align: left;\r\n}\r\n\r\nhtml[lang^=\"en\"] .amal-form-select {\r\n    padding-left: 14px !important;\r\n    padding-right: 40px !important;\r\n}\r\n\r\nhtml[lang^=\"en\"] .amal-select-arrow {\r\n    left: auto;\r\n    right: 14px;\r\n}\r\n\r\nhtml[lang^=\"en\"] .amal-message-icon {\r\n    right: auto;\r\n    left: 14px;\r\n}\r\n\r\nhtml[lang^=\"en\"] .amal-map-info + .amal-map-info {\r\n    border-right: 0;\r\n    border-left: 1px solid #eeeeee;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   TABLET \/ SMALL LAPTOP\r\n========================================================= *\/\r\n\r\n@media (max-width: 950px) {\r\n\r\n    .amal-contact-section {\r\n        padding-left: 12px;\r\n        padding-right: 12px;\r\n    }\r\n\r\n    .amal-contact-container {\r\n        grid-template-columns:\r\n            minmax(0, 1fr)\r\n            minmax(0, 1fr)\r\n            minmax(0, 1.4fr);\r\n\r\n        gap: 12px;\r\n    }\r\n\r\n    .amal-contact-info {\r\n        padding-left: 11px;\r\n        padding-right: 11px;\r\n    }\r\n\r\n    .amal-contact-info-item {\r\n        font-size: clamp(14px, 1.6vw, 17px);\r\n        gap: 8px;\r\n    }\r\n\r\n    .amal-contact-info-icon {\r\n        width: 26px;\r\n        height: 26px;\r\n        flex-basis: 26px;\r\n    }\r\n\r\n    .amal-contact-info-icon svg {\r\n        width: 22px;\r\n        height: 22px;\r\n    }\r\n\r\n    .amal-form-field input,\r\n    .amal-form-field select,\r\n    .amal-form-field textarea {\r\n        font-size: clamp(14px, 1.5vw, 17px) !important;\r\n    }\r\n\r\n    .amal-map {\r\n        height: 260px;\r\n    }\r\n\r\n    .amal-map-info {\r\n        padding: 9px;\r\n        gap: 8px;\r\n    }\r\n\r\n    .amal-map-info-title {\r\n        font-size: 14px;\r\n    }\r\n\r\n    .amal-map-info-text {\r\n        font-size: 12px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MOBILE\r\n========================================================= *\/\r\n\r\n@media (max-width: 700px) {\r\n\r\n    .amal-contact-section {\r\n        padding: 10px 8px 20px;\r\n    }\r\n\r\n    .amal-contact-container {\r\n        grid-template-columns: 1fr;\r\n\r\n        gap: 12px;\r\n    }\r\n\r\n    .amal-contact-card {\r\n        width: 100%;\r\n    }\r\n\r\n    .amal-contact-title {\r\n        font-size: 21px;\r\n    }\r\n\r\n    .amal-contact-info {\r\n        padding: 5px 13px 12px;\r\n    }\r\n\r\n    .amal-contact-info-item {\r\n        min-height: 48px;\r\n\r\n        font-size: 15px;\r\n\r\n        gap: 9px;\r\n    }\r\n\r\n    .amal-contact-info-icon {\r\n        width: 27px;\r\n        height: 27px;\r\n        flex-basis: 27px;\r\n    }\r\n\r\n    .amal-contact-info-icon svg {\r\n        width: 23px;\r\n        height: 23px;\r\n    }\r\n\r\n    .amal-form-field input,\r\n    .amal-form-field select {\r\n        height: 46px;\r\n\r\n        font-size: 15px !important;\r\n    }\r\n\r\n    .amal-form-field textarea {\r\n        height: 105px;\r\n\r\n        font-size: 15px !important;\r\n    }\r\n\r\n    .amal-submit {\r\n        width: 190px;\r\n        height: 46px;\r\n\r\n        font-size: 15px;\r\n    }\r\n\r\n    .amal-map {\r\n        height: 280px;\r\n    }\r\n\r\n    .amal-map-bottom {\r\n        min-height: 82px;\r\n    }\r\n\r\n    .amal-map-info-title {\r\n        font-size: 14px;\r\n    }\r\n\r\n    .amal-map-info-text {\r\n        font-size: 12px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SMALL MOBILE\r\n========================================================= *\/\r\n\r\n@media (max-width: 390px) {\r\n\r\n    .amal-contact-section {\r\n        padding-left: 6px;\r\n        padding-right: 6px;\r\n    }\r\n\r\n    .amal-contact-title {\r\n        font-size: 20px;\r\n    }\r\n\r\n    .amal-contact-info-item {\r\n        font-size: 14px;\r\n    }\r\n\r\n    .amal-form-field input,\r\n    .amal-form-field select,\r\n    .amal-form-field textarea {\r\n        font-size: 14px !important;\r\n    }\r\n\r\n    .amal-map {\r\n        height: 240px;\r\n    }\r\n\r\n    .amal-map-bottom {\r\n        grid-template-columns: 1fr;\r\n    }\r\n\r\n    .amal-map-info + .amal-map-info {\r\n        border-right: 0;\r\n        border-left: 0;\r\n\r\n        border-top: 1px solid #eeeeee;\r\n    }\r\n\r\n    html[lang^=\"en\"] .amal-map-info + .amal-map-info {\r\n        border-right: 0;\r\n        border-left: 0;\r\n        border-top: 1px solid #eeeeee;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   VERY LARGE SCREENS\r\n========================================================= *\/\r\n\r\n@media (min-width: 1400px) {\r\n\r\n    .amal-contact-section {\r\n        padding-left: 28px;\r\n        padding-right: 28px;\r\n    }\r\n\r\n    .amal-contact-container {\r\n        gap: 20px;\r\n    }\r\n\r\n    .amal-contact-info-item {\r\n        font-size: clamp(17px, 1vw, 20px);\r\n    }\r\n\r\n    .amal-form-field input,\r\n    .amal-form-field select,\r\n    .amal-form-field textarea {\r\n        font-size: clamp(16px, .95vw, 19px) !important;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HONEYPOT\r\n========================================================= *\/\r\n\r\n.amal-honeypot {\r\n    position: absolute !important;\r\n\r\n    left: -9999px !important;\r\n\r\n    width: 1px !important;\r\n\r\n    height: 1px !important;\r\n\r\n    opacity: 0 !important;\r\n\r\n    pointer-events: none !important;\r\n}\r\n<\/style>\r\n\r\n\r\n<section class=\"amal-contact-section\">\r\n\r\n    <div class=\"amal-contact-container\">\r\n\r\n\r\n        <!-- =================================================\r\n             CONTACT INFORMATION CARD\r\n        ================================================== -->\r\n\r\n        <div class=\"amal-contact-card\">\r\n\r\n            <h2\r\n                class=\"amal-contact-title\"\r\n                data-ar=\"\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627\"\r\n                data-en=\"Contact Us\"\r\n            >\r\n                \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627\r\n            <\/h2>\r\n\r\n\r\n            <div class=\"amal-contact-info\">\r\n\r\n\r\n                <!-- PHONE -->\r\n\r\n                <div class=\"amal-contact-info-item\">\r\n\r\n                    <div class=\"amal-contact-info-icon\">\r\n\r\n                        <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                            <path\r\n                                d=\"M14 7\r\n                                   c-2 1-4 4-3 7\r\n                                   2 9 8 16 16 20\r\n                                   4 2 7 1 9-1\r\n                                   l3-3\r\n                                   c1-1 1-3 0-4\r\n                                   l-5-4\r\n                                   c-1-1-3-1-4 0\r\n                                   l-3 3\r\n                                   c-3-2-6-5-8-8\r\n                                   l3-3\r\n                                   c1-1 1-3 0-4\r\n                                   l-4-5\r\n                                   c-1-1-2-1-4-1z\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <div class=\"amal-contact-info-text\">\r\n\r\n                        <a\r\n                            href=\"tel:+201000000000\"\r\n                            data-ar=\"+20 100 000 0000\"\r\n                            data-en=\"+20 100 000 0000\"\r\n                        >\r\n                            +20 100 000 0000\r\n                        <\/a>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- WHATSAPP -->\r\n\r\n                <div class=\"amal-contact-info-item\">\r\n\r\n                    <div class=\"amal-contact-info-icon\">\r\n\r\n                        <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                            <path\r\n                                d=\"M24 6\r\n                                   a18 18 0 0 1 15 28\r\n                                   l3 8\r\n                                   -8-3\r\n                                   a18 18 0 1 1-10-33z\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M18 16\r\n                                   c-1 1-2 3-1 5\r\n                                   2 5 5 8 10 10\r\n                                   2 1 4 0 5-2\r\n                                   l1-2\r\n                                   -4-2\r\n                                   -2 2\r\n                                   c-2-1-4-3-5-5\r\n                                   l2-2\r\n                                   -2-4\r\n                                   -4 0z\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <div class=\"amal-contact-info-text\">\r\n\r\n                        <a\r\n                            href=\"https:\/\/wa.me\/201000000000\"\r\n                            target=\"_blank\"\r\n                            rel=\"noopener\"\r\n                            data-ar=\"\u0648\u0627\u062a\u0633\u0627\u0628\"\r\n                            data-en=\"WhatsApp\"\r\n                        >\r\n                            \u0648\u0627\u062a\u0633\u0627\u0628\r\n                        <\/a>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- EMAIL -->\r\n\r\n                <div class=\"amal-contact-info-item\">\r\n\r\n                    <div class=\"amal-contact-info-icon\">\r\n\r\n                        <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                            <rect\r\n                                x=\"5\"\r\n                                y=\"10\"\r\n                                width=\"38\"\r\n                                height=\"28\"\r\n                                rx=\"3\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M7 13l17 14L41 13\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M7 35l13-11\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M41 35L28 24\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <div class=\"amal-contact-info-text\">\r\n\r\n                        <a\r\n                            href=\"mailto:info@example.com\"\r\n                            data-ar=\"info@example.com\"\r\n                            data-en=\"info@example.com\"\r\n                        >\r\n                            info@example.com\r\n                        <\/a>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- ADDRESS -->\r\n\r\n                <div class=\"amal-contact-info-item\">\r\n\r\n                    <div class=\"amal-contact-info-icon\">\r\n\r\n                        <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                            <path\r\n                                d=\"M24 43\r\n                                   s13-13 13-24\r\n                                   a13 13 0 1 0-26 0\r\n                                   c0 11 13 24 13 24z\"\r\n                            \/>\r\n\r\n                            <circle\r\n                                cx=\"24\"\r\n                                cy=\"19\"\r\n                                r=\"4\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <div\r\n                        class=\"amal-contact-info-text\"\r\n                        data-ar=\"\u0627\u0644\u0642\u0627\u0647\u0631\u0629\u060c \u0645\u0635\u0631\"\r\n                        data-en=\"Cairo, Egypt\"\r\n                    >\r\n                        \u0627\u0644\u0642\u0627\u0647\u0631\u0629\u060c \u0645\u0635\u0631\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- WORKING HOURS -->\r\n\r\n                <div class=\"amal-contact-info-item\">\r\n\r\n                    <div class=\"amal-contact-info-icon\">\r\n\r\n                        <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                            <circle\r\n                                cx=\"24\"\r\n                                cy=\"24\"\r\n                                r=\"17\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M24 14v11l7 5\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <div\r\n                        class=\"amal-contact-info-text\"\r\n                        data-ar=\"\u0627\u0644\u0633\u0628\u062a \u2013 \u0627\u0644\u062e\u0645\u064a\u0633 | 9:00 \u0635 \u2013 5:00 \u0645\"\r\n                        data-en=\"Saturday \u2013 Thursday | 9:00 AM \u2013 5:00 PM\"\r\n                    >\r\n                        \u0627\u0644\u0633\u0628\u062a \u2013 \u0627\u0644\u062e\u0645\u064a\u0633 | 9:00 \u0635 \u2013 5:00 \u0645\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n        <!-- =================================================\r\n             CONTACT FORM CARD\r\n        ================================================== -->\r\n\r\n        <div class=\"amal-contact-card\">\r\n\r\n            <h2\r\n                class=\"amal-contact-title\"\r\n                data-ar=\"\u0623\u0631\u0633\u0644 \u0644\u0646\u0627 \u0631\u0633\u0627\u0644\u0629\"\r\n                data-en=\"Send Us a Message\"\r\n            >\r\n                \u0623\u0631\u0633\u0644 \u0644\u0646\u0627 \u0631\u0633\u0627\u0644\u0629\r\n            <\/h2>\r\n\r\n\r\n            <form\r\n                class=\"amal-contact-form\"\r\n                id=\"amalContactForm\"\r\n                novalidate\r\n            >\r\n\r\n\r\n                <!-- NAME -->\r\n\r\n                <div class=\"amal-form-field\">\r\n\r\n                    <input\r\n                        type=\"text\"\r\n                        name=\"name\"\r\n                        autocomplete=\"name\"\r\n                        data-placeholder-ar=\"\u0627\u0644\u0627\u0633\u0645 \u0627\u0644\u0643\u0627\u0645\u0644\"\r\n                        data-placeholder-en=\"Full Name\"\r\n                        placeholder=\"\u0627\u0644\u0627\u0633\u0645 \u0627\u0644\u0643\u0627\u0645\u0644\"\r\n                        aria-label=\"\u0627\u0644\u0627\u0633\u0645 \u0627\u0644\u0643\u0627\u0645\u0644\"\r\n                    \/>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- EMAIL -->\r\n\r\n                <div class=\"amal-form-field\">\r\n\r\n                    <input\r\n                        type=\"email\"\r\n                        name=\"email\"\r\n                        autocomplete=\"email\"\r\n                        data-placeholder-ar=\"\u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\"\r\n                        data-placeholder-en=\"Email Address\"\r\n                        placeholder=\"\u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\"\r\n                        aria-label=\"\u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a\"\r\n                    \/>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- PHONE -->\r\n\r\n                <div class=\"amal-form-field\">\r\n\r\n                    <input\r\n                        type=\"tel\"\r\n                        name=\"phone\"\r\n                        autocomplete=\"tel\"\r\n                        data-placeholder-ar=\"\u0631\u0642\u0645 \u0627\u0644\u0647\u0627\u062a\u0641\"\r\n                        data-placeholder-en=\"Phone Number\"\r\n                        placeholder=\"\u0631\u0642\u0645 \u0627\u0644\u0647\u0627\u062a\u0641\"\r\n                        aria-label=\"\u0631\u0642\u0645 \u0627\u0644\u0647\u0627\u062a\u0641\"\r\n                    \/>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- SUBJECT -->\r\n\r\n                <div class=\"amal-form-field amal-select-wrap\">\r\n\r\n                    <select\r\n                        name=\"subject\"\r\n                        class=\"amal-form-select\"\r\n                        aria-label=\"\u0627\u0644\u0645\u0648\u0636\u0648\u0639\"\r\n                    >\r\n\r\n                        <option\r\n                            value=\"\"\r\n                            data-ar=\"\u0627\u062e\u062a\u0631 \u0627\u0644\u0645\u0648\u0636\u0648\u0639\"\r\n                            data-en=\"Select a Subject\"\r\n                        >\r\n                            \u0627\u062e\u062a\u0631 \u0627\u0644\u0645\u0648\u0636\u0648\u0639\r\n                        <\/option>\r\n\r\n                        <option\r\n                            value=\"general\"\r\n                            data-ar=\"\u0627\u0633\u062a\u0641\u0633\u0627\u0631 \u0639\u0627\u0645\"\r\n                            data-en=\"General Inquiry\"\r\n                        >\r\n                            \u0627\u0633\u062a\u0641\u0633\u0627\u0631 \u0639\u0627\u0645\r\n                        <\/option>\r\n\r\n                        <option\r\n                            value=\"support\"\r\n                            data-ar=\"\u0637\u0644\u0628 \u062f\u0639\u0645\"\r\n                            data-en=\"Support Request\"\r\n                        >\r\n                            \u0637\u0644\u0628 \u062f\u0639\u0645\r\n                        <\/option>\r\n\r\n                        <option\r\n                            value=\"volunteer\"\r\n                            data-ar=\"\u0627\u0644\u062a\u0637\u0648\u0639\"\r\n                            data-en=\"Volunteering\"\r\n                        >\r\n                            \u0627\u0644\u062a\u0637\u0648\u0639\r\n                        <\/option>\r\n\r\n                        <option\r\n                            value=\"partnership\"\r\n                            data-ar=\"\u0634\u0631\u0627\u0643\u0629\"\r\n                            data-en=\"Partnership\"\r\n                        >\r\n                            \u0634\u0631\u0627\u0643\u0629\r\n                        <\/option>\r\n\r\n                        <option\r\n                            value=\"donation\"\r\n                            data-ar=\"\u0627\u0644\u062a\u0628\u0631\u0639\"\r\n                            data-en=\"Donation\"\r\n                        >\r\n                            \u0627\u0644\u062a\u0628\u0631\u0639\r\n                        <\/option>\r\n\r\n                    <\/select>\r\n\r\n\r\n                    <span\r\n                        class=\"amal-select-arrow\"\r\n                        aria-hidden=\"true\"\r\n                    >\r\n                        \u2304\r\n                    <\/span>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- MESSAGE -->\r\n\r\n                <div class=\"amal-form-field amal-message-wrap\">\r\n\r\n                    <textarea\r\n                        name=\"message\"\r\n                        data-placeholder-ar=\"\u0627\u0643\u062a\u0628 \u0631\u0633\u0627\u0644\u062a\u0643 \u0647\u0646\u0627...\"\r\n                        data-placeholder-en=\"Write your message here...\"\r\n                        placeholder=\"\u0627\u0643\u062a\u0628 \u0631\u0633\u0627\u0644\u062a\u0643 \u0647\u0646\u0627...\"\r\n                        aria-label=\"\u0627\u0644\u0631\u0633\u0627\u0644\u0629\"\r\n                    ><\/textarea>\r\n\r\n\r\n                    <div\r\n                        class=\"amal-message-icon\"\r\n                        aria-hidden=\"true\"\r\n                    >\r\n\r\n                        <svg viewBox=\"0 0 48 48\">\r\n\r\n                            <path\r\n                                d=\"M8 10\r\n                                   h32\r\n                                   v23\r\n                                   H20\r\n                                   l-9 7\r\n                                   v-7\r\n                                   H8\r\n                                   z\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M15 18h18\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M15 25h12\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- HONEYPOT -->\r\n\r\n                <div\r\n                    class=\"amal-honeypot\"\r\n                    aria-hidden=\"true\"\r\n                >\r\n\r\n                    <label>\r\n                        Website\r\n\r\n                        <input\r\n                            type=\"text\"\r\n                            name=\"website\"\r\n                            tabindex=\"-1\"\r\n                            autocomplete=\"off\"\r\n                        \/>\r\n\r\n                    <\/label>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- SUBMIT -->\r\n\r\n                <button\r\n                    type=\"submit\"\r\n                    class=\"amal-submit\"\r\n                >\r\n\r\n                    <span\r\n                        class=\"amal-submit-text\"\r\n                        data-ar=\"\u0625\u0631\u0633\u0627\u0644 \u0627\u0644\u0631\u0633\u0627\u0644\u0629\"\r\n                        data-en=\"Send Message\"\r\n                    >\r\n                        \u0625\u0631\u0633\u0627\u0644 \u0627\u0644\u0631\u0633\u0627\u0644\u0629\r\n                    <\/span>\r\n\r\n\r\n                    <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                        <path\r\n                            d=\"M6 24\r\n                               L42 6\r\n                               L31 42\r\n                               L22 27\r\n                               Z\"\r\n                        \/>\r\n\r\n                        <path\r\n                            d=\"M22 27\r\n                               L42 6\"\r\n                        \/>\r\n\r\n                    <\/svg>\r\n\r\n                <\/button>\r\n\r\n\r\n                <!-- RESULT -->\r\n\r\n                <p\r\n                    class=\"amal-form-result\"\r\n                    aria-live=\"polite\"\r\n                    data-ar=\"\"\r\n                    data-en=\"\"\r\n                ><\/p>\r\n\r\n            <\/form>\r\n\r\n        <\/div>\r\n\r\n\r\n        <!-- =================================================\r\n             MAP CARD\r\n        ================================================== -->\r\n\r\n        <div class=\"amal-contact-card\">\r\n\r\n            <h2\r\n                class=\"amal-contact-title\"\r\n                data-ar=\"\u0645\u0648\u0642\u0639\u0646\u0627\"\r\n                data-en=\"Our Location\"\r\n            >\r\n                \u0645\u0648\u0642\u0639\u0646\u0627\r\n            <\/h2>\r\n\r\n\r\n            <!-- MAP -->\r\n\r\n            <div class=\"amal-map\">\r\n\r\n                <iframe\r\n                    src=\"https:\/\/www.google.com\/maps?q=Cairo,Egypt&output=embed\"\r\n                    loading=\"lazy\"\r\n                    referrerpolicy=\"no-referrer-when-downgrade\"\r\n                    title=\"Al Amal location\"\r\n                ><\/iframe>\r\n\r\n            <\/div>\r\n\r\n\r\n            <!-- MAP INFORMATION -->\r\n\r\n            <div class=\"amal-map-bottom\">\r\n\r\n\r\n                <!-- ADDRESS -->\r\n\r\n                <div class=\"amal-map-info\">\r\n\r\n                    <div class=\"amal-map-info-icon\">\r\n\r\n                        <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                            <path\r\n                                d=\"M24 43\r\n                                   s13-13 13-24\r\n                                   a13 13 0 1 0-26 0\r\n                                   c0 11 13 24 13 24z\"\r\n                            \/>\r\n\r\n                            <circle\r\n                                cx=\"24\"\r\n                                cy=\"19\"\r\n                                r=\"4\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <div class=\"amal-map-info-content\">\r\n\r\n                        <h3\r\n                            class=\"amal-map-info-title\"\r\n                            data-ar=\"\u0627\u0644\u0639\u0646\u0648\u0627\u0646\"\r\n                            data-en=\"Address\"\r\n                        >\r\n                            \u0627\u0644\u0639\u0646\u0648\u0627\u0646\r\n                        <\/h3>\r\n\r\n                        <p\r\n                            class=\"amal-map-info-text\"\r\n                            data-ar=\"\u0627\u0644\u0642\u0627\u0647\u0631\u0629\u060c \u0645\u0635\u0631\"\r\n                            data-en=\"Cairo, Egypt\"\r\n                        >\r\n                            \u0627\u0644\u0642\u0627\u0647\u0631\u0629\u060c \u0645\u0635\u0631\r\n                        <\/p>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- HOURS -->\r\n\r\n                <div class=\"amal-map-info\">\r\n\r\n                    <div class=\"amal-map-info-icon\">\r\n\r\n                        <svg viewBox=\"0 0 48 48\" aria-hidden=\"true\">\r\n\r\n                            <circle\r\n                                cx=\"24\"\r\n                                cy=\"24\"\r\n                                r=\"17\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M24 14v11l7 5\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <div class=\"amal-map-info-content\">\r\n\r\n                        <h3\r\n                            class=\"amal-map-info-title\"\r\n                            data-ar=\"\u0633\u0627\u0639\u0627\u062a \u0627\u0644\u0639\u0645\u0644\"\r\n                            data-en=\"Working Hours\"\r\n                        >\r\n                            \u0633\u0627\u0639\u0627\u062a \u0627\u0644\u0639\u0645\u0644\r\n                        <\/h3>\r\n\r\n                        <p\r\n                            class=\"amal-map-info-text\"\r\n                            data-ar=\"\u0627\u0644\u0633\u0628\u062a \u2013 \u0627\u0644\u062e\u0645\u064a\u0633 | 9:00 \u0635 \u2013 5:00 \u0645\"\r\n                            data-en=\"Saturday \u2013 Thursday | 9:00 AM \u2013 5:00 PM\"\r\n                        >\r\n                            \u0627\u0644\u0633\u0628\u062a \u2013 \u0627\u0644\u062e\u0645\u064a\u0633 | 9:00 \u0635 \u2013 5:00 \u0645\r\n                        <\/p>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\n(function () {\r\n\r\n    \"use strict\";\r\n\r\n\r\n    \/* =========================================================\r\n       AL AMAL CONTACT LANGUAGE SYSTEM\r\n\r\n       IMPORTANT:\r\n       This version does NOT use:\r\n\r\n       - document click listeners\r\n       - setInterval()\r\n       - repeated language timers\r\n\r\n       It updates only when the <html lang=\"\"> attribute\r\n       actually changes.\r\n\r\n       This prevents the English\/Arabic text from\r\n       appearing -> disappearing -> appearing.\r\n    ========================================================= *\/\r\n\r\n\r\n    \/* =========================================================\r\n       GET SECTION\r\n    ========================================================= *\/\r\n\r\n    function getSection() {\r\n\r\n        return document.querySelector(\r\n            \".amal-contact-section\"\r\n        );\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       DETECT LANGUAGE\r\n    ========================================================= *\/\r\n\r\n    function isEnglish() {\r\n\r\n        var lang =\r\n            document.documentElement.getAttribute(\"lang\") || \"\";\r\n\r\n        lang = lang.toLowerCase().trim();\r\n\r\n        return lang.indexOf(\"en\") === 0;\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       TRANSLATE NORMAL TEXT\r\n\r\n       IMPORTANT:\r\n       Only change text when it is actually different.\r\n       This prevents unnecessary DOM updates.\r\n    ========================================================= *\/\r\n\r\n    function updateTextElements(section, english) {\r\n\r\n        section\r\n            .querySelectorAll(\"[data-ar][data-en]\")\r\n            .forEach(function (element) {\r\n\r\n                var arabic =\r\n                    element.getAttribute(\"data-ar\") || \"\";\r\n\r\n                var englishText =\r\n                    element.getAttribute(\"data-en\") || \"\";\r\n\r\n                var newText =\r\n                    english\r\n                        ? englishText\r\n                        : arabic;\r\n\r\n\r\n                \/*\r\n                 * Do not rewrite the element if the\r\n                 * text is already correct.\r\n                 *\/\r\n\r\n                if (\r\n                    element.textContent.trim() !==\r\n                    newText.trim()\r\n                ) {\r\n\r\n                    element.textContent = newText;\r\n\r\n                }\r\n\r\n            });\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       TRANSLATE PLACEHOLDERS\r\n    ========================================================= *\/\r\n\r\n    function updatePlaceholders(section, english) {\r\n\r\n        section\r\n            .querySelectorAll(\r\n                \"[data-placeholder-ar][data-placeholder-en]\"\r\n            )\r\n            .forEach(function (element) {\r\n\r\n                var arabic =\r\n                    element.getAttribute(\r\n                        \"data-placeholder-ar\"\r\n                    ) || \"\";\r\n\r\n                var englishText =\r\n                    element.getAttribute(\r\n                        \"data-placeholder-en\"\r\n                    ) || \"\";\r\n\r\n                var newPlaceholder =\r\n                    english\r\n                        ? englishText\r\n                        : arabic;\r\n\r\n\r\n                \/*\r\n                 * Only update if needed.\r\n                 *\/\r\n\r\n                if (\r\n                    element.getAttribute(\"placeholder\") !==\r\n                    newPlaceholder\r\n                ) {\r\n\r\n                    element.setAttribute(\r\n                        \"placeholder\",\r\n                        newPlaceholder\r\n                    );\r\n\r\n                }\r\n\r\n\r\n                var newAriaLabel =\r\n                    newPlaceholder;\r\n\r\n\r\n                if (\r\n                    element.getAttribute(\"aria-label\") !==\r\n                    newAriaLabel\r\n                ) {\r\n\r\n                    element.setAttribute(\r\n                        \"aria-label\",\r\n                        newAriaLabel\r\n                    );\r\n\r\n                }\r\n\r\n            });\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       TRANSLATE SELECT OPTIONS\r\n    ========================================================= *\/\r\n\r\n    function updateSelectOptions(section, english) {\r\n\r\n        section\r\n            .querySelectorAll(\r\n                \"select option[data-ar][data-en]\"\r\n            )\r\n            .forEach(function (option) {\r\n\r\n                var arabic =\r\n                    option.getAttribute(\"data-ar\") || \"\";\r\n\r\n                var englishText =\r\n                    option.getAttribute(\"data-en\") || \"\";\r\n\r\n                var newText =\r\n                    english\r\n                        ? englishText\r\n                        : arabic;\r\n\r\n\r\n                \/*\r\n                 * Only update if necessary.\r\n                 *\/\r\n\r\n                if (\r\n                    option.textContent.trim() !==\r\n                    newText.trim()\r\n                ) {\r\n\r\n                    option.textContent = newText;\r\n\r\n                }\r\n\r\n            });\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       UPDATE FORM ACCESSIBILITY LABELS\r\n    ========================================================= *\/\r\n\r\n    function updateFormLabels(section, english) {\r\n\r\n        var select =\r\n            section.querySelector(\r\n                \".amal-form-select\"\r\n            );\r\n\r\n\r\n        if (select) {\r\n\r\n            var selectLabel =\r\n                english\r\n                    ? \"Subject\"\r\n                    : \"\u0627\u0644\u0645\u0648\u0636\u0648\u0639\";\r\n\r\n\r\n            if (\r\n                select.getAttribute(\"aria-label\") !==\r\n                selectLabel\r\n            ) {\r\n\r\n                select.setAttribute(\r\n                    \"aria-label\",\r\n                    selectLabel\r\n                );\r\n\r\n            }\r\n\r\n        }\r\n\r\n\r\n        var textarea =\r\n            section.querySelector(\r\n                'textarea[name=\"message\"]'\r\n            );\r\n\r\n\r\n        if (textarea) {\r\n\r\n            var textareaLabel =\r\n                english\r\n                    ? \"Message\"\r\n                    : \"\u0627\u0644\u0631\u0633\u0627\u0644\u0629\";\r\n\r\n\r\n            if (\r\n                textarea.getAttribute(\"aria-label\") !==\r\n                textareaLabel\r\n            ) {\r\n\r\n                textarea.setAttribute(\r\n                    \"aria-label\",\r\n                    textareaLabel\r\n                );\r\n\r\n            }\r\n\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       UPDATE DIRECTION\r\n    ========================================================= *\/\r\n\r\n    function updateDirection(section, english) {\r\n\r\n        var direction =\r\n            english\r\n                ? \"ltr\"\r\n                : \"rtl\";\r\n\r\n\r\n        if (\r\n            section.style.direction !== direction\r\n        ) {\r\n\r\n            section.style.direction = direction;\r\n\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       LANGUAGE UPDATE\r\n    ========================================================= *\/\r\n\r\n    function updateAmalLanguage() {\r\n\r\n        var section =\r\n            getSection();\r\n\r\n\r\n        if (!section) {\r\n            return;\r\n        }\r\n\r\n\r\n        var english =\r\n            isEnglish();\r\n\r\n\r\n        \/*\r\n         * Update direction first.\r\n         *\/\r\n\r\n        updateDirection(\r\n            section,\r\n            english\r\n        );\r\n\r\n\r\n        \/*\r\n         * Update normal text.\r\n         *\/\r\n\r\n        updateTextElements(\r\n            section,\r\n            english\r\n        );\r\n\r\n\r\n        \/*\r\n         * Update placeholders.\r\n         *\/\r\n\r\n        updatePlaceholders(\r\n            section,\r\n            english\r\n        );\r\n\r\n\r\n        \/*\r\n         * Update select options.\r\n         *\/\r\n\r\n        updateSelectOptions(\r\n            section,\r\n            english\r\n        );\r\n\r\n\r\n        \/*\r\n         * Update accessibility labels.\r\n         *\/\r\n\r\n        updateFormLabels(\r\n            section,\r\n            english\r\n        );\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       FORM RESULT MESSAGE\r\n    ========================================================= *\/\r\n\r\n    function showFormMessage(\r\n        section,\r\n        arabicMessage,\r\n        englishMessage,\r\n        type\r\n    ) {\r\n\r\n        var result =\r\n            section.querySelector(\r\n                \".amal-form-result\"\r\n            );\r\n\r\n\r\n        if (!result) {\r\n            return;\r\n        }\r\n\r\n\r\n        result.setAttribute(\r\n            \"data-ar\",\r\n            arabicMessage\r\n        );\r\n\r\n\r\n        result.setAttribute(\r\n            \"data-en\",\r\n            englishMessage\r\n        );\r\n\r\n\r\n        result.classList.remove(\r\n            \"success\",\r\n            \"error\"\r\n        );\r\n\r\n\r\n        if (type) {\r\n\r\n            result.classList.add(type);\r\n\r\n        }\r\n\r\n\r\n        var message =\r\n            isEnglish()\r\n                ? englishMessage\r\n                : arabicMessage;\r\n\r\n\r\n        \/*\r\n         * Only change the result if necessary.\r\n         *\/\r\n\r\n        if (\r\n            result.textContent.trim() !==\r\n            message.trim()\r\n        ) {\r\n\r\n            result.textContent = message;\r\n\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       FORM\r\n    ========================================================= *\/\r\n\r\n    var section =\r\n        getSection();\r\n\r\n\r\n    if (section) {\r\n\r\n        var form =\r\n            section.querySelector(\r\n                \"#amalContactForm\"\r\n            );\r\n\r\n\r\n        if (form) {\r\n\r\n            form.addEventListener(\r\n                \"submit\",\r\n                function (event) {\r\n\r\n                    event.preventDefault();\r\n\r\n\r\n                    \/* =========================================\r\n                       HONEYPOT\r\n                    ========================================= *\/\r\n\r\n                    var honeypot =\r\n                        form.querySelector(\r\n                            'input[name=\"website\"]'\r\n                        );\r\n\r\n\r\n                    if (\r\n                        honeypot &&\r\n                        honeypot.value.trim() !== \"\"\r\n                    ) {\r\n\r\n                        return;\r\n\r\n                    }\r\n\r\n\r\n                    \/* =========================================\r\n                       GET FIELDS\r\n                    ========================================= *\/\r\n\r\n                    var name =\r\n                        form.querySelector(\r\n                            'input[name=\"name\"]'\r\n                        );\r\n\r\n\r\n                    var email =\r\n                        form.querySelector(\r\n                            'input[name=\"email\"]'\r\n                        );\r\n\r\n\r\n                    var message =\r\n                        form.querySelector(\r\n                            'textarea[name=\"message\"]'\r\n                        );\r\n\r\n\r\n                    \/* =========================================\r\n                       VALIDATION\r\n                    ========================================= *\/\r\n\r\n                    var valid = true;\r\n\r\n\r\n                    if (\r\n                        !name ||\r\n                        name.value.trim() === \"\"\r\n                    ) {\r\n\r\n                        valid = false;\r\n\r\n                    }\r\n\r\n\r\n                    if (\r\n                        !email ||\r\n                        email.value.trim() === \"\" ||\r\n                        !email.validity.valid\r\n                    ) {\r\n\r\n                        valid = false;\r\n\r\n                    }\r\n\r\n\r\n                    if (\r\n                        !message ||\r\n                        message.value.trim() === \"\"\r\n                    ) {\r\n\r\n                        valid = false;\r\n\r\n                    }\r\n\r\n\r\n                    \/* =========================================\r\n                       VALIDATION ERROR\r\n                    ========================================= *\/\r\n\r\n                    if (!valid) {\r\n\r\n                        showFormMessage(\r\n                            section,\r\n                            \"\u064a\u0631\u062c\u0649 \u062a\u0639\u0628\u0626\u0629 \u0627\u0644\u062d\u0642\u0648\u0644 \u0627\u0644\u0645\u0637\u0644\u0648\u0628\u0629 \u0628\u0634\u0643\u0644 \u0635\u062d\u064a\u062d.\",\r\n                            \"Please complete the required fields correctly.\",\r\n                            \"error\"\r\n                        );\r\n\r\n                        return;\r\n\r\n                    }\r\n\r\n\r\n                    \/* =========================================\r\n                       SUCCESS MESSAGE\r\n\r\n                       NOTE:\r\n                       This is currently a front-end demo.\r\n                       It does NOT send an actual email.\r\n\r\n                       Connect the form to your WordPress \/\r\n                       Elementor backend when ready.\r\n                    ========================================= *\/\r\n\r\n                    showFormMessage(\r\n                        section,\r\n                        \"\u062a\u0645 \u0627\u0633\u062a\u0644\u0627\u0645 \u0631\u0633\u0627\u0644\u062a\u0643. \u0634\u0643\u0631\u064b\u0627 \u0644\u062a\u0648\u0627\u0635\u0644\u0643 \u0645\u0639\u0646\u0627.\",\r\n                        \"Your message has been received. Thank you for contacting us.\",\r\n                        \"success\"\r\n                    );\r\n\r\n\r\n                    \/*\r\n                     * Reset form.\r\n                     *\/\r\n\r\n                    form.reset();\r\n\r\n\r\n                    \/*\r\n                     * Re-apply translated placeholders\r\n                     * after reset.\r\n                     *\/\r\n\r\n                    updateAmalLanguage();\r\n\r\n                }\r\n            );\r\n\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =========================================================\r\n       INITIAL LANGUAGE\r\n    ========================================================= *\/\r\n\r\n    updateAmalLanguage();\r\n\r\n\r\n    \/* =========================================================\r\n       TRANSLATEPRESS LANGUAGE OBSERVER\r\n\r\n       TranslatePress changes the language attribute:\r\n\r\n       <html lang=\"ar\">\r\n\r\n       to:\r\n\r\n       <html lang=\"en\">\r\n\r\n       We watch ONLY that attribute.\r\n\r\n       NO click listener.\r\n       NO setInterval.\r\n       NO repeated timers.\r\n    ========================================================= *\/\r\n\r\n    var htmlElement =\r\n        document.documentElement;\r\n\r\n\r\n    if (htmlElement) {\r\n\r\n        var lastLanguage =\r\n            (\r\n                htmlElement.getAttribute(\"lang\") || \"\"\r\n            ).toLowerCase();\r\n\r\n\r\n        var languageObserver =\r\n            new MutationObserver(\r\n                function (mutations) {\r\n\r\n                    var languageChanged = false;\r\n\r\n\r\n                    mutations.forEach(\r\n                        function (mutation) {\r\n\r\n                            if (\r\n                                mutation.type === \"attributes\" &&\r\n                                mutation.attributeName === \"lang\"\r\n                            ) {\r\n\r\n                                languageChanged = true;\r\n\r\n                            }\r\n\r\n                        }\r\n                    );\r\n\r\n\r\n                    \/*\r\n                     * Only update once per mutation batch.\r\n                     *\/\r\n\r\n                    if (languageChanged) {\r\n\r\n                        var currentLanguage =\r\n                            (\r\n                                htmlElement.getAttribute(\"lang\") || \"\"\r\n                            ).toLowerCase();\r\n\r\n\r\n                        \/*\r\n                         * Prevent duplicate updates.\r\n                         *\/\r\n\r\n                        if (\r\n                            currentLanguage !==\r\n                            lastLanguage\r\n                        ) {\r\n\r\n                            lastLanguage =\r\n                                currentLanguage;\r\n\r\n                            updateAmalLanguage();\r\n\r\n                        }\r\n\r\n                    }\r\n\r\n                }\r\n            );\r\n\r\n\r\n        languageObserver.observe(\r\n            htmlElement,\r\n            {\r\n                attributes: true,\r\n                attributeFilter: [\"lang\"]\r\n            }\r\n        );\r\n\r\n    }\r\n\r\n\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-782c22a elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"782c22a\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-467b463\" data-id=\"467b463\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-fda955b elementor-widget elementor-widget-html\" data-id=\"fda955b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<style>\r\n\/* =========================================================\r\n   AL AMAL \u2014 FAQ + SOCIAL MEDIA\r\n   FULL WIDTH + LARGE RESPONSIVE TEXT\r\n   Arabic RTL \/ English LTR\r\n========================================================= *\/\r\n\r\n.amal-faq-social,\r\n.amal-faq-social * {\r\n    box-sizing: border-box;\r\n}\r\n\r\n.amal-faq-social {\r\n    width: 100%;\r\n    max-width: none;\r\n    margin: 0;\r\n    padding: 14px 20px 30px;\r\n    background: #ffffff;\r\n    direction: rtl;\r\n    font-family: \"Tajawal\", \"Arial\", sans-serif;\r\n    overflow: hidden;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MAIN CONTAINER\r\n========================================================= *\/\r\n\r\n.amal-faq-social__container {\r\n    width: 100%;\r\n    max-width: none;\r\n    margin: 0;\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns:\r\n        minmax(0, 1fr)\r\n        minmax(0, 1.35fr);\r\n\r\n    gap: 16px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CARD\r\n========================================================= *\/\r\n\r\n.amal-faq-social__card {\r\n    min-width: 0;\r\n    width: 100%;\r\n\r\n    background: #ffffff;\r\n\r\n    border: 1px solid #eeeeee;\r\n    border-radius: 14px;\r\n\r\n    box-shadow:\r\n        0 1px 7px rgba(0, 0, 0, 0.025);\r\n\r\n    overflow: hidden;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   TITLE\r\n========================================================= *\/\r\n\r\n.amal-faq-social__title {\r\n    margin: 0;\r\n    padding: 12px 14px 9px;\r\n\r\n    color: #071a35;\r\n\r\n    font-size: clamp(21px, 1.45vw, 30px);\r\n    line-height: 1.35;\r\n    font-weight: 800;\r\n\r\n    text-align: center;\r\n\r\n    position: relative;\r\n}\r\n\r\n.amal-faq-social__title::after {\r\n    content: \"\";\r\n\r\n    display: block;\r\n\r\n    width: 120px;\r\n    height: 2px;\r\n\r\n    margin: 6px auto 0;\r\n\r\n    background:\r\n        linear-gradient(\r\n            to right,\r\n            transparent,\r\n            #c99732 20%,\r\n            #d32670 50%,\r\n            #c99732 80%,\r\n            transparent\r\n        );\r\n}\r\n\r\n.amal-faq-social__title::before {\r\n    content: \"\u2665\";\r\n\r\n    position: absolute;\r\n\r\n    left: 50%;\r\n    bottom: -7px;\r\n\r\n    transform: translateX(-50%);\r\n\r\n    padding: 0 6px;\r\n\r\n    background: #ffffff;\r\n    color: #d32670;\r\n\r\n    font-size: 11px;\r\n    line-height: 1;\r\n\r\n    z-index: 3;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SOCIAL MEDIA\r\n========================================================= *\/\r\n\r\n.amal-social {\r\n    padding: 18px 24px 22px;\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns:\r\n        repeat(4, minmax(0, 1fr));\r\n\r\n    gap: 16px;\r\n\r\n    align-items: start;\r\n\r\n    flex-direction: row !important;\r\n}\r\n\r\n.amal-social__item {\r\n    min-width: 0;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    align-items: center;\r\n    justify-content: flex-start;\r\n\r\n    text-decoration: none !important;\r\n\r\n    color: #071a35;\r\n\r\n    cursor: pointer;\r\n\r\n    transition:\r\n        transform .22s ease;\r\n}\r\n\r\n.amal-social__item:hover {\r\n    transform: translateY(-3px);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SOCIAL ICON\r\n========================================================= *\/\r\n\r\n.amal-social__icon {\r\n    width: 62px;\r\n    height: 62px;\r\n\r\n    margin-bottom: 8px;\r\n\r\n    border-radius: 50%;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: #ffffff;\r\n\r\n    font-family: Arial, sans-serif;\r\n\r\n    font-size: 28px;\r\n    font-weight: 700;\r\n\r\n    flex-shrink: 0;\r\n\r\n    box-shadow:\r\n        0 2px 7px rgba(0,0,0,.08);\r\n}\r\n\r\n\r\n\/* Facebook *\/\r\n\r\n.amal-social__item--facebook\r\n.amal-social__icon {\r\n    background: #1877f2;\r\n}\r\n\r\n\r\n\/* Instagram *\/\r\n\r\n.amal-social__item--instagram\r\n.amal-social__icon {\r\n    background:\r\n        radial-gradient(\r\n            circle at 30% 107%,\r\n            #fdf497 0%,\r\n            #fdf497 5%,\r\n            #fd5949 45%,\r\n            #d6249f 60%,\r\n            #285aeb 90%\r\n        );\r\n}\r\n\r\n\r\n\/* YouTube *\/\r\n\r\n.amal-social__item--youtube\r\n.amal-social__icon {\r\n    background: #ff0000;\r\n}\r\n\r\n\r\n\/* TikTok *\/\r\n\r\n.amal-social__item--tiktok\r\n.amal-social__icon {\r\n    background: #050505;\r\n}\r\n\r\n\r\n\/* SVG *\/\r\n\r\n.amal-social__icon svg {\r\n    width: 32px;\r\n    height: 32px;\r\n\r\n    display: block;\r\n\r\n    fill: currentColor;\r\n}\r\n\r\n\r\n\/* Instagram SVG *\/\r\n\r\n.amal-social__item--instagram\r\n.amal-social__icon svg {\r\n    fill: none;\r\n\r\n    stroke: currentColor;\r\n    stroke-width: 2.4;\r\n\r\n    stroke-linecap: round;\r\n    stroke-linejoin: round;\r\n}\r\n\r\n\r\n\/* TikTok SVG *\/\r\n\r\n.amal-social__item--tiktok\r\n.amal-social__icon svg {\r\n    fill: none;\r\n\r\n    stroke: currentColor;\r\n    stroke-width: 2.8;\r\n\r\n    stroke-linecap: round;\r\n    stroke-linejoin: round;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SOCIAL NAME\r\n========================================================= *\/\r\n\r\n.amal-social__name {\r\n    margin: 0;\r\n\r\n    color: #071a35;\r\n\r\n    font-family: Arial, \"Tajawal\", sans-serif;\r\n\r\n    font-size: clamp(14px, .95vw, 18px);\r\n    line-height: 1.45;\r\n\r\n    font-weight: 600;\r\n\r\n    text-align: center;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   FAQ\r\n========================================================= *\/\r\n\r\n.amal-faq {\r\n    padding: 10px 14px 16px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   FAQ ITEM\r\n========================================================= *\/\r\n\r\n.amal-faq__item {\r\n    width: 100%;\r\n\r\n    margin-bottom: 8px;\r\n\r\n    border: 1px solid #e8e8e8;\r\n    border-radius: 8px;\r\n\r\n    background: #ffffff;\r\n\r\n    overflow: hidden;\r\n}\r\n\r\n.amal-faq__item:last-child {\r\n    margin-bottom: 0;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   QUESTION\r\n========================================================= *\/\r\n\r\n.amal-faq__question {\r\n    width: 100%;\r\n    min-height: 48px;\r\n\r\n    padding: 10px 14px;\r\n\r\n    border: 0;\r\n\r\n    background: #ffffff;\r\n\r\n    color: #071a35;\r\n\r\n    font-family: \"Tajawal\", \"Arial\", sans-serif;\r\n\r\n    font-size: clamp(15px, 1vw, 19px);\r\n    line-height: 1.5;\r\n\r\n    font-weight: 700;\r\n\r\n    text-align: right;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n    justify-content: space-between;\r\n\r\n    gap: 12px;\r\n\r\n    cursor: pointer;\r\n}\r\n\r\n.amal-faq__question:hover {\r\n    background: #fffafd;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ARROW\r\n========================================================= *\/\r\n\r\n.amal-faq__arrow {\r\n    width: 22px;\r\n    height: 22px;\r\n\r\n    flex: 0 0 22px;\r\n\r\n    display: flex;\r\n\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: #071a35;\r\n\r\n    font-size: 19px;\r\n    line-height: 1;\r\n\r\n    transition:\r\n        transform .25s ease;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ANSWER\r\n========================================================= *\/\r\n\r\n.amal-faq__answer {\r\n    max-height: 0;\r\n\r\n    overflow: hidden;\r\n\r\n    transition:\r\n        max-height .3s ease;\r\n}\r\n\r\n.amal-faq__answer-inner {\r\n    padding: 0 16px 14px;\r\n\r\n    color: #26344a;\r\n\r\n    font-size: clamp(14px, .9vw, 17px);\r\n    line-height: 1.75;\r\n\r\n    font-weight: 500;\r\n\r\n    text-align: right;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   OPEN\r\n========================================================= *\/\r\n\r\n.amal-faq__item.is-open\r\n.amal-faq__answer {\r\n    max-height: 300px;\r\n}\r\n\r\n.amal-faq__item.is-open\r\n.amal-faq__arrow {\r\n    transform: rotate(180deg);\r\n\r\n    color: #d32670;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   ENGLISH\r\n========================================================= *\/\r\n\r\nhtml[lang^=\"en\"] .amal-faq-social {\r\n    direction: ltr;\r\n}\r\n\r\nhtml[lang^=\"en\"]\r\n.amal-faq__question {\r\n    text-align: left;\r\n}\r\n\r\nhtml[lang^=\"en\"]\r\n.amal-faq__answer-inner {\r\n    text-align: left;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   TABLET \/ SMALL LAPTOP\r\n========================================================= *\/\r\n\r\n@media (max-width: 950px) {\r\n\r\n    .amal-faq-social {\r\n        padding-left: 12px;\r\n        padding-right: 12px;\r\n    }\r\n\r\n    .amal-faq-social__container {\r\n        gap: 12px;\r\n    }\r\n\r\n    .amal-social {\r\n        padding-left: 16px;\r\n        padding-right: 16px;\r\n\r\n        gap: 10px;\r\n    }\r\n\r\n    .amal-social__icon {\r\n        width: 56px;\r\n        height: 56px;\r\n    }\r\n\r\n    .amal-social__icon svg {\r\n        width: 29px;\r\n        height: 29px;\r\n    }\r\n\r\n    .amal-social__name {\r\n        font-size: 14px;\r\n    }\r\n\r\n    .amal-faq__question {\r\n        font-size: 14px;\r\n        min-height: 46px;\r\n    }\r\n\r\n    .amal-faq__answer-inner {\r\n        font-size: 13px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MOBILE\r\n========================================================= *\/\r\n\r\n@media (max-width: 700px) {\r\n\r\n    .amal-faq-social {\r\n        padding: 10px 8px 20px;\r\n    }\r\n\r\n    .amal-faq-social__container {\r\n        grid-template-columns: 1fr;\r\n        gap: 12px;\r\n    }\r\n\r\n    .amal-faq-social__title {\r\n        font-size: 21px;\r\n    }\r\n\r\n    .amal-social {\r\n        padding: 16px 18px 20px;\r\n        gap: 10px;\r\n    }\r\n\r\n    .amal-social__icon {\r\n        width: 56px;\r\n        height: 56px;\r\n    }\r\n\r\n    .amal-social__icon svg {\r\n        width: 29px;\r\n        height: 29px;\r\n    }\r\n\r\n    .amal-social__name {\r\n        font-size: 14px;\r\n    }\r\n\r\n    .amal-faq {\r\n        padding: 10px 10px 14px;\r\n    }\r\n\r\n    .amal-faq__question {\r\n        min-height: 48px;\r\n\r\n        padding: 10px 12px;\r\n\r\n        font-size: 15px;\r\n        line-height: 1.5;\r\n    }\r\n\r\n    .amal-faq__answer-inner {\r\n        padding: 0 13px 13px;\r\n\r\n        font-size: 14px;\r\n        line-height: 1.75;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   SMALL MOBILE\r\n========================================================= *\/\r\n\r\n@media (max-width: 390px) {\r\n\r\n    .amal-faq-social {\r\n        padding-left: 6px;\r\n        padding-right: 6px;\r\n    }\r\n\r\n    .amal-social {\r\n        padding-left: 10px;\r\n        padding-right: 10px;\r\n\r\n        gap: 6px;\r\n    }\r\n\r\n    .amal-social__icon {\r\n        width: 50px;\r\n        height: 50px;\r\n    }\r\n\r\n    .amal-social__icon svg {\r\n        width: 26px;\r\n        height: 26px;\r\n    }\r\n\r\n    .amal-social__name {\r\n        font-size: 13px;\r\n    }\r\n\r\n    .amal-faq__question {\r\n        font-size: 14px;\r\n        min-height: 46px;\r\n    }\r\n\r\n    .amal-faq__answer-inner {\r\n        font-size: 13px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   VERY LARGE SCREENS\r\n========================================================= *\/\r\n\r\n@media (min-width: 1400px) {\r\n\r\n    .amal-faq-social {\r\n        padding-left: 28px;\r\n        padding-right: 28px;\r\n    }\r\n\r\n    .amal-faq-social__container {\r\n        gap: 20px;\r\n    }\r\n\r\n    .amal-social {\r\n        padding: 22px 30px 26px;\r\n        gap: 20px;\r\n    }\r\n\r\n    .amal-social__icon {\r\n        width: 68px;\r\n        height: 68px;\r\n    }\r\n\r\n    .amal-social__icon svg {\r\n        width: 35px;\r\n        height: 35px;\r\n    }\r\n\r\n    .amal-social__name {\r\n        font-size: 16px;\r\n    }\r\n\r\n    .amal-faq {\r\n        padding: 12px 16px 18px;\r\n    }\r\n\r\n    .amal-faq__question {\r\n        min-height: 52px;\r\n        font-size: 17px;\r\n    }\r\n\r\n    .amal-faq__answer-inner {\r\n        font-size: 15px;\r\n    }\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   BUTTON SAFETY\r\n========================================================= *\/\r\n\r\n.amal-faq-social button {\r\n    -webkit-tap-highlight-color: transparent;\r\n}\r\n<\/style>\r\n\r\n\r\n<section class=\"amal-faq-social\">\r\n\r\n    <div class=\"amal-faq-social__container\">\r\n\r\n\r\n        <!-- =================================================\r\n             SOCIAL MEDIA CARD\r\n        ================================================== -->\r\n\r\n        <div class=\"amal-faq-social__card\">\r\n\r\n            <h2\r\n                class=\"amal-faq-social__title\"\r\n                data-ar=\"\u062a\u0627\u0628\u0639\u0646\u0627 \u0639\u0644\u0649 \u0648\u0633\u0627\u0626\u0644 \u0627\u0644\u062a\u0648\u0627\u0635\u0644 \u0627\u0644\u0627\u062c\u062a\u0645\u0627\u0639\u064a\"\r\n                data-en=\"Follow Us on Social Media\"\r\n            >\r\n                \u062a\u0627\u0628\u0639\u0646\u0627 \u0639\u0644\u0649 \u0648\u0633\u0627\u0626\u0644 \u0627\u0644\u062a\u0648\u0627\u0635\u0644 \u0627\u0644\u0627\u062c\u062a\u0645\u0627\u0639\u064a\r\n            <\/h2>\r\n\r\n\r\n            <div class=\"amal-social\">\r\n\r\n\r\n                <!-- FACEBOOK -->\r\n\r\n                <a\r\n                    href=\"#\"\r\n                    class=\"amal-social__item amal-social__item--facebook\"\r\n                    target=\"_blank\"\r\n                    rel=\"noopener\"\r\n                    aria-label=\"Facebook\"\r\n                >\r\n\r\n                    <div\r\n                        class=\"amal-social__icon\"\r\n                        aria-hidden=\"true\"\r\n                    >\r\n\r\n                        <svg\r\n                            viewBox=\"0 0 24 24\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n\r\n                            <path\r\n                                d=\"M14 8h3V4h-3c-3.3 0-5 2-5 5v3H6v4h3v8h4v-8h3.5l.5-4H13V9c0-.7.3-1 1-1z\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <p\r\n                        class=\"amal-social__name\"\r\n                        data-ar=\"\u0641\u064a\u0633\u0628\u0648\u0643\"\r\n                        data-en=\"Facebook\"\r\n                    >\r\n                        \u0641\u064a\u0633\u0628\u0648\u0643\r\n                    <\/p>\r\n\r\n                <\/a>\r\n\r\n\r\n                <!-- INSTAGRAM -->\r\n\r\n                <a\r\n                    href=\"#\"\r\n                    class=\"amal-social__item amal-social__item--instagram\"\r\n                    target=\"_blank\"\r\n                    rel=\"noopener\"\r\n                    aria-label=\"Instagram\"\r\n                >\r\n\r\n                    <div\r\n                        class=\"amal-social__icon\"\r\n                        aria-hidden=\"true\"\r\n                    >\r\n\r\n                        <svg\r\n                            viewBox=\"0 0 24 24\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n\r\n                            <rect\r\n                                x=\"3\"\r\n                                y=\"3\"\r\n                                width=\"18\"\r\n                                height=\"18\"\r\n                                rx=\"5\"\r\n                            \/>\r\n\r\n                            <circle\r\n                                cx=\"12\"\r\n                                cy=\"12\"\r\n                                r=\"4\"\r\n                            \/>\r\n\r\n                            <circle\r\n                                cx=\"17.5\"\r\n                                cy=\"6.5\"\r\n                                r=\"1\"\r\n                                fill=\"currentColor\"\r\n                                stroke=\"none\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <p\r\n                        class=\"amal-social__name\"\r\n                        data-ar=\"\u0625\u0646\u0633\u062a\u063a\u0631\u0627\u0645\"\r\n                        data-en=\"Instagram\"\r\n                    >\r\n                        \u0625\u0646\u0633\u062a\u063a\u0631\u0627\u0645\r\n                    <\/p>\r\n\r\n                <\/a>\r\n\r\n\r\n                <!-- YOUTUBE -->\r\n\r\n                <a\r\n                    href=\"#\"\r\n                    class=\"amal-social__item amal-social__item--youtube\"\r\n                    target=\"_blank\"\r\n                    rel=\"noopener\"\r\n                    aria-label=\"YouTube\"\r\n                >\r\n\r\n                    <div\r\n                        class=\"amal-social__icon\"\r\n                        aria-hidden=\"true\"\r\n                    >\r\n\r\n                        <svg\r\n                            viewBox=\"0 0 24 24\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n\r\n                            <path\r\n                                d=\"M21 7.2\r\n                                   c-.2-1.2-1.1-2.1-2.3-2.3\r\n                                   C17 4.5 14.5 4.3 12 4.3\r\n                                   s-5 .2-6.7.6\r\n                                   C4.1 5.1 3.2 6 3 7.2\r\n                                   c-.3 1.3-.4 2.9-.4 4.8\r\n                                   s.1 3.5.4 4.8\r\n                                   c.2 1.2 1.1 2.1 2.3 2.3\r\n                                   1.7.4 4.2.6 6.7.6\r\n                                   s5-.2 6.7-.6\r\n                                   c1.2-.2 2.1-1.1 2.3-2.3\r\n                                   .3-1.3.4-2.9.4-4.8\r\n                                   s-.1-3.5-.4-4.8z\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M10 9v6l5-3z\"\r\n                                fill=\"#ff0000\"\r\n                                stroke=\"none\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <p\r\n                        class=\"amal-social__name\"\r\n                        data-ar=\"\u064a\u0648\u062a\u064a\u0648\u0628\"\r\n                        data-en=\"YouTube\"\r\n                    >\r\n                        \u064a\u0648\u062a\u064a\u0648\u0628\r\n                    <\/p>\r\n\r\n                <\/a>\r\n\r\n\r\n                <!-- TIKTOK -->\r\n\r\n                <a\r\n                    href=\"#\"\r\n                    class=\"amal-social__item amal-social__item--tiktok\"\r\n                    target=\"_blank\"\r\n                    rel=\"noopener\"\r\n                    aria-label=\"TikTok\"\r\n                >\r\n\r\n                    <div\r\n                        class=\"amal-social__icon\"\r\n                        aria-hidden=\"true\"\r\n                    >\r\n\r\n                        <svg\r\n                            viewBox=\"0 0 24 24\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n\r\n                            <path\r\n                                d=\"M14 4\r\n                                   v10\r\n                                   a4 4 0 1 1-4-4\"\r\n                            \/>\r\n\r\n                            <path\r\n                                d=\"M14 4\r\n                                   c1.1 2.4 2.8 3.8 5 4\"\r\n                            \/>\r\n\r\n                        <\/svg>\r\n\r\n                    <\/div>\r\n\r\n\r\n                    <p\r\n                        class=\"amal-social__name\"\r\n                        data-ar=\"\u062a\u064a\u0643 \u062a\u0648\u0643\"\r\n                        data-en=\"TikTok\"\r\n                    >\r\n                        \u062a\u064a\u0643 \u062a\u0648\u0643\r\n                    <\/p>\r\n\r\n                <\/a>\r\n\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n\r\n        <!-- =================================================\r\n             FAQ CARD\r\n        ================================================== -->\r\n\r\n        <div class=\"amal-faq-social__card\">\r\n\r\n            <h2\r\n                class=\"amal-faq-social__title\"\r\n                data-ar=\"\u0627\u0644\u0623\u0633\u0626\u0644\u0629 \u0627\u0644\u0634\u0627\u0626\u0639\u0629\"\r\n                data-en=\"Frequently Asked Questions\"\r\n            >\r\n                \u0627\u0644\u0623\u0633\u0626\u0644\u0629 \u0627\u0644\u0634\u0627\u0626\u0639\u0629\r\n            <\/h2>\r\n\r\n\r\n            <div class=\"amal-faq\">\r\n\r\n\r\n                <!-- FAQ 1 -->\r\n\r\n                <div class=\"amal-faq__item\">\r\n\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"amal-faq__question\"\r\n                        aria-expanded=\"false\"\r\n                    >\r\n\r\n                        <span\r\n                            data-ar=\"\u0643\u064a\u0641 \u064a\u0645\u0643\u0646\u0646\u064a \u0627\u0644\u0627\u0633\u062a\u0641\u0627\u062f\u0629 \u0645\u0646 \u062e\u062f\u0645\u0627\u062a\u0643\u0645\u061f\"\r\n                            data-en=\"How can I benefit from your services?\"\r\n                        >\r\n                            \u0643\u064a\u0641 \u064a\u0645\u0643\u0646\u0646\u064a \u0627\u0644\u0627\u0633\u062a\u0641\u0627\u062f\u0629 \u0645\u0646 \u062e\u062f\u0645\u0627\u062a\u0643\u0645\u061f\r\n                        <\/span>\r\n\r\n\r\n                        <span\r\n                            class=\"amal-faq__arrow\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n                            \u2193\r\n                        <\/span>\r\n\r\n                    <\/button>\r\n\r\n\r\n                    <div class=\"amal-faq__answer\">\r\n\r\n                        <div\r\n                            class=\"amal-faq__answer-inner\"\r\n                            data-ar=\"\u064a\u0645\u0643\u0646\u0643 \u0627\u0644\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0645\u0628\u0627\u0634\u0631\u0629 \u0644\u0645\u0639\u0631\u0641\u0629 \u0627\u0644\u062e\u062f\u0645\u0627\u062a \u0627\u0644\u0645\u062a\u0627\u062d\u0629 \u0648\u0645\u062a\u0637\u0644\u0628\u0627\u062a \u0627\u0644\u0627\u0633\u062a\u0641\u0627\u062f\u0629 \u0645\u0646\u0647\u0627.\"\r\n                            data-en=\"You can contact us directly to learn about the available services and their requirements.\"\r\n                        >\r\n                            \u064a\u0645\u0643\u0646\u0643 \u0627\u0644\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0645\u0628\u0627\u0634\u0631\u0629 \u0644\u0645\u0639\u0631\u0641\u0629 \u0627\u0644\u062e\u062f\u0645\u0627\u062a \u0627\u0644\u0645\u062a\u0627\u062d\u0629 \u0648\u0645\u062a\u0637\u0644\u0628\u0627\u062a \u0627\u0644\u0627\u0633\u062a\u0641\u0627\u062f\u0629 \u0645\u0646\u0647\u0627.\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- FAQ 2 -->\r\n\r\n                <div class=\"amal-faq__item\">\r\n\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"amal-faq__question\"\r\n                        aria-expanded=\"false\"\r\n                    >\r\n\r\n                        <span\r\n                            data-ar=\"\u0647\u0644 \u064a\u0645\u0643\u0646\u0646\u064a \u0627\u0644\u062a\u0637\u0648\u0639 \u0645\u0639 \u0627\u0644\u0645\u0624\u0633\u0633\u0629\u061f\"\r\n                            data-en=\"Can I volunteer with the organization?\"\r\n                        >\r\n                            \u0647\u0644 \u064a\u0645\u0643\u0646\u0646\u064a \u0627\u0644\u062a\u0637\u0648\u0639 \u0645\u0639 \u0627\u0644\u0645\u0624\u0633\u0633\u0629\u061f\r\n                        <\/span>\r\n\r\n\r\n                        <span\r\n                            class=\"amal-faq__arrow\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n                            \u2193\r\n                        <\/span>\r\n\r\n                    <\/button>\r\n\r\n\r\n                    <div class=\"amal-faq__answer\">\r\n\r\n                        <div\r\n                            class=\"amal-faq__answer-inner\"\r\n                            data-ar=\"\u0646\u0639\u0645\u060c \u0646\u0631\u062d\u0628 \u0628\u0627\u0644\u0645\u062a\u0637\u0648\u0639\u064a\u0646 \u0627\u0644\u0631\u0627\u063a\u0628\u064a\u0646 \u0641\u064a \u062f\u0639\u0645 \u0631\u0633\u0627\u0644\u062a\u0646\u0627. \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0644\u0645\u0639\u0631\u0641\u0629 \u0641\u0631\u0635 \u0627\u0644\u062a\u0637\u0648\u0639 \u0627\u0644\u0645\u062a\u0627\u062d\u0629.\"\r\n                            data-en=\"Yes. We welcome volunteers who would like to support our mission. Contact us to learn about available volunteer opportunities.\"\r\n                        >\r\n                            \u0646\u0639\u0645\u060c \u0646\u0631\u062d\u0628 \u0628\u0627\u0644\u0645\u062a\u0637\u0648\u0639\u064a\u0646 \u0627\u0644\u0631\u0627\u063a\u0628\u064a\u0646 \u0641\u064a \u062f\u0639\u0645 \u0631\u0633\u0627\u0644\u062a\u0646\u0627. \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0644\u0645\u0639\u0631\u0641\u0629 \u0641\u0631\u0635 \u0627\u0644\u062a\u0637\u0648\u0639 \u0627\u0644\u0645\u062a\u0627\u062d\u0629.\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- FAQ 3 -->\r\n\r\n                <div class=\"amal-faq__item\">\r\n\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"amal-faq__question\"\r\n                        aria-expanded=\"false\"\r\n                    >\r\n\r\n                        <span\r\n                            data-ar=\"\u0643\u064a\u0641 \u064a\u0645\u0643\u0646\u0646\u064a \u062f\u0639\u0645 \u0627\u0644\u0645\u0624\u0633\u0633\u0629\u061f\"\r\n                            data-en=\"How can I support the organization?\"\r\n                        >\r\n                            \u0643\u064a\u0641 \u064a\u0645\u0643\u0646\u0646\u064a \u062f\u0639\u0645 \u0627\u0644\u0645\u0624\u0633\u0633\u0629\u061f\r\n                        <\/span>\r\n\r\n\r\n                        <span\r\n                            class=\"amal-faq__arrow\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n                            \u2193\r\n                        <\/span>\r\n\r\n                    <\/button>\r\n\r\n\r\n                    <div class=\"amal-faq__answer\">\r\n\r\n                        <div\r\n                            class=\"amal-faq__answer-inner\"\r\n                            data-ar=\"\u064a\u0645\u0643\u0646\u0643 \u062f\u0639\u0645\u0646\u0627 \u0645\u0646 \u062e\u0644\u0627\u0644 \u0627\u0644\u062a\u0628\u0631\u0639 \u0623\u0648 \u0627\u0644\u062a\u0637\u0648\u0639 \u0623\u0648 \u0627\u0644\u0645\u0633\u0627\u0647\u0645\u0629 \u0641\u064a \u0646\u0634\u0631 \u0631\u0633\u0627\u0644\u062a\u0646\u0627.\"\r\n                            data-en=\"You can support us through donations, volunteering, or helping spread our mission.\"\r\n                        >\r\n                            \u064a\u0645\u0643\u0646\u0643 \u062f\u0639\u0645\u0646\u0627 \u0645\u0646 \u062e\u0644\u0627\u0644 \u0627\u0644\u062a\u0628\u0631\u0639 \u0623\u0648 \u0627\u0644\u062a\u0637\u0648\u0639 \u0623\u0648 \u0627\u0644\u0645\u0633\u0627\u0647\u0645\u0629 \u0641\u064a \u0646\u0634\u0631 \u0631\u0633\u0627\u0644\u062a\u0646\u0627.\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- FAQ 4 -->\r\n\r\n                <div class=\"amal-faq__item\">\r\n\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"amal-faq__question\"\r\n                        aria-expanded=\"false\"\r\n                    >\r\n\r\n                        <span\r\n                            data-ar=\"\u0643\u064a\u0641 \u064a\u0645\u0643\u0646\u0646\u064a \u0627\u0644\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0643\u0645\u061f\"\r\n                            data-en=\"How can I contact you?\"\r\n                        >\r\n                            \u0643\u064a\u0641 \u064a\u0645\u0643\u0646\u0646\u064a \u0627\u0644\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0643\u0645\u061f\r\n                        <\/span>\r\n\r\n\r\n                        <span\r\n                            class=\"amal-faq__arrow\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n                            \u2193\r\n                        <\/span>\r\n\r\n                    <\/button>\r\n\r\n\r\n                    <div class=\"amal-faq__answer\">\r\n\r\n                        <div\r\n                            class=\"amal-faq__answer-inner\"\r\n                            data-ar=\"\u064a\u0645\u0643\u0646\u0643 \u0627\u0644\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0639\u0628\u0631 \u0627\u0644\u0647\u0627\u062a\u0641 \u0623\u0648 \u0648\u0627\u062a\u0633\u0627\u0628 \u0623\u0648 \u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a \u0645\u0646 \u062e\u0644\u0627\u0644 \u0628\u064a\u0627\u0646\u0627\u062a \u0627\u0644\u0627\u062a\u0635\u0627\u0644 \u0627\u0644\u0645\u0648\u062c\u0648\u062f\u0629 \u0641\u064a \u0627\u0644\u0645\u0648\u0642\u0639.\"\r\n                            data-en=\"You can reach us by phone, WhatsApp, or email using the contact information provided on the website.\"\r\n                        >\r\n                            \u064a\u0645\u0643\u0646\u0643 \u0627\u0644\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0639\u0628\u0631 \u0627\u0644\u0647\u0627\u062a\u0641 \u0623\u0648 \u0648\u0627\u062a\u0633\u0627\u0628 \u0623\u0648 \u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a \u0645\u0646 \u062e\u0644\u0627\u0644 \u0628\u064a\u0627\u0646\u0627\u062a \u0627\u0644\u0627\u062a\u0635\u0627\u0644 \u0627\u0644\u0645\u0648\u062c\u0648\u062f\u0629 \u0641\u064a \u0627\u0644\u0645\u0648\u0642\u0639.\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n                <!-- FAQ 5 -->\r\n\r\n                <div class=\"amal-faq__item\">\r\n\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"amal-faq__question\"\r\n                        aria-expanded=\"false\"\r\n                    >\r\n\r\n                        <span\r\n                            data-ar=\"\u0647\u0644 \u064a\u0645\u0643\u0646 \u0644\u0644\u0645\u0624\u0633\u0633\u0627\u062a \u0627\u0644\u062a\u0639\u0627\u0648\u0646 \u0645\u0639\u0646\u0627\u061f\"\r\n                            data-en=\"Can organizations partner with us?\"\r\n                        >\r\n                            \u0647\u0644 \u064a\u0645\u0643\u0646 \u0644\u0644\u0645\u0624\u0633\u0633\u0627\u062a \u0627\u0644\u062a\u0639\u0627\u0648\u0646 \u0645\u0639\u0646\u0627\u061f\r\n                        <\/span>\r\n\r\n\r\n                        <span\r\n                            class=\"amal-faq__arrow\"\r\n                            aria-hidden=\"true\"\r\n                        >\r\n                            \u2193\r\n                        <\/span>\r\n\r\n                    <\/button>\r\n\r\n\r\n                    <div class=\"amal-faq__answer\">\r\n\r\n                        <div\r\n                            class=\"amal-faq__answer-inner\"\r\n                            data-ar=\"\u0646\u0639\u0645\u060c \u0646\u0631\u062d\u0628 \u0628\u0641\u0631\u0635 \u0627\u0644\u062a\u0639\u0627\u0648\u0646 \u0648\u0627\u0644\u0634\u0631\u0627\u0643\u0627\u062a \u0627\u0644\u062a\u064a \u062a\u0633\u0627\u0639\u062f \u0641\u064a \u062a\u062d\u0642\u064a\u0642 \u0623\u062b\u0631 \u0625\u064a\u062c\u0627\u0628\u064a \u0648\u0645\u0633\u062a\u062f\u0627\u0645.\"\r\n                            data-en=\"Yes. We welcome collaboration and partnership opportunities that help create a positive and sustainable impact.\"\r\n                        >\r\n                            \u0646\u0639\u0645\u060c \u0646\u0631\u062d\u0628 \u0628\u0641\u0631\u0635 \u0627\u0644\u062a\u0639\u0627\u0648\u0646 \u0648\u0627\u0644\u0634\u0631\u0627\u0643\u0627\u062a \u0627\u0644\u062a\u064a \u062a\u0633\u0627\u0639\u062f \u0641\u064a \u062a\u062d\u0642\u064a\u0642 \u0623\u062b\u0631 \u0625\u064a\u062c\u0627\u0628\u064a \u0648\u0645\u0633\u062a\u062f\u0627\u0645.\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n\r\n                <\/div>\r\n\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<script>\r\n(function () {\r\n\r\n    \"use strict\";\r\n\r\n\r\n    \/* =====================================================\r\n       GET SECTION\r\n    ===================================================== *\/\r\n\r\n    function getSection() {\r\n\r\n        return document.querySelector(\r\n            \".amal-faq-social\"\r\n        );\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       GET CURRENT LANGUAGE\r\n    ===================================================== *\/\r\n\r\n    function getLanguage() {\r\n\r\n        var html = document.documentElement;\r\n\r\n        if (!html) {\r\n            return \"\";\r\n        }\r\n\r\n        return (\r\n            html.getAttribute(\"lang\") || \"\"\r\n        ).toLowerCase();\r\n\r\n    }\r\n\r\n\r\n    function isEnglish() {\r\n\r\n        return getLanguage().indexOf(\"en\") === 0;\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       SAFE TEXT UPDATE\r\n       Only writes to DOM when the text actually changed.\r\n    ===================================================== *\/\r\n\r\n    function setTextIfChanged(\r\n        element,\r\n        value\r\n    ) {\r\n\r\n        if (\r\n            element &&\r\n            element.textContent !== value\r\n        ) {\r\n\r\n            element.textContent = value;\r\n\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       UPDATE TEXT\r\n    ===================================================== *\/\r\n\r\n    function updateText(\r\n        section,\r\n        english\r\n    ) {\r\n\r\n        section\r\n            .querySelectorAll(\r\n                \"[data-ar][data-en]\"\r\n            )\r\n            .forEach(\r\n                function (element) {\r\n\r\n                    var arabic =\r\n                        element.getAttribute(\r\n                            \"data-ar\"\r\n                        );\r\n\r\n                    var englishText =\r\n                        element.getAttribute(\r\n                            \"data-en\"\r\n                        );\r\n\r\n                    var newText =\r\n                        english\r\n                            ? englishText\r\n                            : arabic;\r\n\r\n                    setTextIfChanged(\r\n                        element,\r\n                        newText\r\n                    );\r\n\r\n                }\r\n            );\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       UPDATE DIRECTION\r\n    ===================================================== *\/\r\n\r\n    function updateDirection(\r\n        section,\r\n        english\r\n    ) {\r\n\r\n        var direction =\r\n            english\r\n                ? \"ltr\"\r\n                : \"rtl\";\r\n\r\n        if (\r\n            section.getAttribute(\"dir\") !==\r\n            direction\r\n        ) {\r\n\r\n            section.setAttribute(\r\n                \"dir\",\r\n                direction\r\n            );\r\n\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       UPDATE FAQ ALIGNMENT\r\n    ===================================================== *\/\r\n\r\n    function updateFAQ(\r\n        section,\r\n        english\r\n    ) {\r\n\r\n        var textAlign =\r\n            english\r\n                ? \"left\"\r\n                : \"right\";\r\n\r\n\r\n        section\r\n            .querySelectorAll(\r\n                \".amal-faq__question\"\r\n            )\r\n            .forEach(\r\n                function (button) {\r\n\r\n                    if (\r\n                        button.style.textAlign !==\r\n                        textAlign\r\n                    ) {\r\n\r\n                        button.style.textAlign =\r\n                            textAlign;\r\n\r\n                    }\r\n\r\n                }\r\n            );\r\n\r\n\r\n        section\r\n            .querySelectorAll(\r\n                \".amal-faq__answer-inner\"\r\n            )\r\n            .forEach(\r\n                function (answer) {\r\n\r\n                    if (\r\n                        answer.style.textAlign !==\r\n                        textAlign\r\n                    ) {\r\n\r\n                        answer.style.textAlign =\r\n                            textAlign;\r\n\r\n                    }\r\n\r\n                }\r\n            );\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       COMPLETE LANGUAGE UPDATE\r\n\r\n       IMPORTANT:\r\n       The previous version repeatedly called this function\r\n       after clicks and every 500ms.\r\n\r\n       That caused unnecessary DOM writes and could fight\r\n       with TranslatePress.\r\n\r\n       This version updates ONLY when the language changes.\r\n    ===================================================== *\/\r\n\r\n    var lastLanguage = null;\r\n\r\n\r\n    function updateLanguage(\r\n        force\r\n    ) {\r\n\r\n        var section =\r\n            getSection();\r\n\r\n        if (!section) {\r\n            return;\r\n        }\r\n\r\n\r\n        var language =\r\n            getLanguage();\r\n\r\n\r\n        \/*\r\n         * Do absolutely nothing if the language did not change.\r\n         *\/\r\n\r\n        if (\r\n            !force &&\r\n            language === lastLanguage\r\n        ) {\r\n\r\n            return;\r\n\r\n        }\r\n\r\n\r\n        lastLanguage =\r\n            language;\r\n\r\n\r\n        var english =\r\n            language.indexOf(\"en\") === 0;\r\n\r\n\r\n        updateText(\r\n            section,\r\n            english\r\n        );\r\n\r\n\r\n        updateDirection(\r\n            section,\r\n            english\r\n        );\r\n\r\n\r\n        updateFAQ(\r\n            section,\r\n            english\r\n        );\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       FAQ ACCORDION\r\n    ===================================================== *\/\r\n\r\n    function initializeFAQ() {\r\n\r\n        var section =\r\n            getSection();\r\n\r\n        if (!section) {\r\n            return;\r\n        }\r\n\r\n\r\n        var questions =\r\n            section.querySelectorAll(\r\n                \".amal-faq__question\"\r\n            );\r\n\r\n\r\n        questions.forEach(\r\n            function (question) {\r\n\r\n                question.addEventListener(\r\n                    \"click\",\r\n                    function () {\r\n\r\n                        var item =\r\n                            question.closest(\r\n                                \".amal-faq__item\"\r\n                            );\r\n\r\n\r\n                        if (!item) {\r\n                            return;\r\n                        }\r\n\r\n\r\n                        var isOpen =\r\n                            item.classList.contains(\r\n                                \"is-open\"\r\n                            );\r\n\r\n\r\n                        \/*\r\n                         * Close all other FAQ items.\r\n                         *\/\r\n\r\n                        section\r\n                            .querySelectorAll(\r\n                                \".amal-faq__item.is-open\"\r\n                            )\r\n                            .forEach(\r\n                                function (openItem) {\r\n\r\n                                    if (\r\n                                        openItem !== item\r\n                                    ) {\r\n\r\n                                        openItem.classList.remove(\r\n                                            \"is-open\"\r\n                                        );\r\n\r\n\r\n                                        var openButton =\r\n                                            openItem.querySelector(\r\n                                                \".amal-faq__question\"\r\n                                            );\r\n\r\n\r\n                                        if (openButton) {\r\n\r\n                                            openButton.setAttribute(\r\n                                                \"aria-expanded\",\r\n                                                \"false\"\r\n                                            );\r\n\r\n                                        }\r\n\r\n                                    }\r\n\r\n                                }\r\n                            );\r\n\r\n\r\n                        \/*\r\n                         * Toggle selected item.\r\n                         *\/\r\n\r\n                        if (isOpen) {\r\n\r\n                            item.classList.remove(\r\n                                \"is-open\"\r\n                            );\r\n\r\n                            question.setAttribute(\r\n                                \"aria-expanded\",\r\n                                \"false\"\r\n                            );\r\n\r\n                        } else {\r\n\r\n                            item.classList.add(\r\n                                \"is-open\"\r\n                            );\r\n\r\n                            question.setAttribute(\r\n                                \"aria-expanded\",\r\n                                \"true\"\r\n                            );\r\n\r\n                        }\r\n\r\n                    }\r\n                );\r\n\r\n            }\r\n        );\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       INITIALIZE AFTER DOM IS READY\r\n    ===================================================== *\/\r\n\r\n    function initialize() {\r\n\r\n        \/*\r\n         * First language update.\r\n         *\/\r\n\r\n        updateLanguage(true);\r\n\r\n\r\n        \/*\r\n         * Initialize FAQ only once.\r\n         *\/\r\n\r\n        initializeFAQ();\r\n\r\n\r\n        \/* =================================================\r\n           TRANSLATEPRESS LANGUAGE OBSERVER\r\n        ================================================= *\/\r\n\r\n        var htmlElement =\r\n            document.documentElement;\r\n\r\n\r\n        if (htmlElement) {\r\n\r\n            var languageObserver =\r\n                new MutationObserver(\r\n                    function (mutations) {\r\n\r\n                        for (\r\n                            var i = 0;\r\n                            i < mutations.length;\r\n                            i++\r\n                        ) {\r\n\r\n                            var mutation =\r\n                                mutations[i];\r\n\r\n\r\n                            if (\r\n                                mutation.type ===\r\n                                    \"attributes\" &&\r\n                                mutation.attributeName ===\r\n                                    \"lang\"\r\n                            ) {\r\n\r\n                                \/*\r\n                                 * TranslatePress changed\r\n                                 * the language.\r\n                                 *\r\n                                 * Update exactly once.\r\n                                 *\/\r\n\r\n                                updateLanguage(false);\r\n\r\n                                break;\r\n\r\n                            }\r\n\r\n                        }\r\n\r\n                    }\r\n                );\r\n\r\n\r\n            languageObserver.observe(\r\n                htmlElement,\r\n                {\r\n                    attributes: true,\r\n                    attributeFilter: [\"lang\"]\r\n                }\r\n            );\r\n\r\n        }\r\n\r\n    }\r\n\r\n\r\n    \/* =====================================================\r\n       DOM READY\r\n    ===================================================== *\/\r\n\r\n    if (\r\n        document.readyState ===\r\n        \"loading\"\r\n    ) {\r\n\r\n        document.addEventListener(\r\n            \"DOMContentLoaded\",\r\n            initialize,\r\n            {\r\n                once: true\r\n            }\r\n        );\r\n\r\n    } else {\r\n\r\n        initialize();\r\n\r\n    }\r\n\r\n\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-8997e84 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"8997e84\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-12d8457\" data-id=\"12d8457\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-a8df2c1 elementor-widget elementor-widget-html\" data-id=\"a8df2c1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<style>\r\n\/* =========================================\r\n   AMAL CTA SECTION\r\n   ========================================= *\/\r\n\r\n.amal-cta {\r\n    position: relative;\r\n    width: 100%;\r\n    overflow: hidden;\r\n    background: #f7f3ee;\r\n    direction: rtl;\r\n    padding: 90px 20px;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.amal-cta__inner {\r\n    position: relative;\r\n    max-width: 1200px;\r\n    margin: 0 auto;\r\n    min-height: 420px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n}\r\n\r\n\/* =========================================\r\n   DECORATIVE CIRCLES\r\n   ========================================= *\/\r\n\r\n.amal-cta__circle {\r\n    position: absolute;\r\n    border-radius: 50%;\r\n    pointer-events: none;\r\n    z-index: 0;\r\n}\r\n\r\n.amal-cta__circle--1 {\r\n    width: 280px;\r\n    height: 280px;\r\n    background: rgba(196, 164, 132, 0.10);\r\n    top: -100px;\r\n    right: -80px;\r\n}\r\n\r\n.amal-cta__circle--2 {\r\n    width: 180px;\r\n    height: 180px;\r\n    background: rgba(180, 145, 110, 0.08);\r\n    bottom: -70px;\r\n    left: -40px;\r\n}\r\n\r\n.amal-cta__circle--3 {\r\n    width: 100px;\r\n    height: 100px;\r\n    background: rgba(196, 164, 132, 0.08);\r\n    top: 35%;\r\n    left: 12%;\r\n}\r\n\r\n\/* =========================================\r\n   FLOATING HEARTS\r\n   ========================================= *\/\r\n\r\n.amal-cta__heart {\r\n    position: absolute;\r\n    color: rgba(180, 145, 110, 0.20);\r\n    pointer-events: none;\r\n    z-index: 0;\r\n    font-size: 24px;\r\n    line-height: 1;\r\n}\r\n\r\n.amal-cta__heart--1 {\r\n    top: 70px;\r\n    left: 18%;\r\n    transform: rotate(-15deg);\r\n}\r\n\r\n.amal-cta__heart--2 {\r\n    top: 120px;\r\n    right: 17%;\r\n    font-size: 18px;\r\n    transform: rotate(15deg);\r\n}\r\n\r\n.amal-cta__heart--3 {\r\n    bottom: 80px;\r\n    right: 10%;\r\n    font-size: 30px;\r\n    transform: rotate(-10deg);\r\n}\r\n\r\n.amal-cta__heart--4 {\r\n    bottom: 50px;\r\n    left: 24%;\r\n    font-size: 16px;\r\n    transform: rotate(12deg);\r\n}\r\n\r\n\/* =========================================\r\n   CONTENT\r\n   ========================================= *\/\r\n\r\n.amal-cta__content {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 760px;\r\n    width: 100%;\r\n    text-align: center;\r\n}\r\n\r\n.amal-cta__title {\r\n    margin: 0 0 18px;\r\n    color: #5f5146;\r\n    font-size: clamp(32px, 5vw, 54px);\r\n    font-weight: 700;\r\n    line-height: 1.25;\r\n    letter-spacing: -0.5px;\r\n}\r\n\r\n.amal-cta__title-heart {\r\n    display: inline-block;\r\n    margin: 0 5px;\r\n    color: #b89570;\r\n    font-size: 0.7em;\r\n    vertical-align: middle;\r\n}\r\n\r\n.amal-cta__subtitle {\r\n    margin: 0 auto 34px;\r\n    max-width: 650px;\r\n    color: #7a6c61;\r\n    font-size: 18px;\r\n    line-height: 1.9;\r\n    font-weight: 400;\r\n}\r\n\r\n\/* =========================================\r\n   BUTTONS\r\n   ========================================= *\/\r\n\r\n.amal-cta__buttons {\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 14px;\r\n    flex-wrap: wrap;\r\n    direction: rtl;\r\n}\r\n\r\n.amal-cta__button {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 10px;\r\n    min-width: 170px;\r\n    min-height: 54px;\r\n    padding: 14px 24px;\r\n    border-radius: 999px;\r\n    box-sizing: border-box;\r\n    text-decoration: none;\r\n    font-size: 16px;\r\n    font-weight: 600;\r\n    line-height: 1.2;\r\n    transition:\r\n        transform 0.25s ease,\r\n        box-shadow 0.25s ease,\r\n        background-color 0.25s ease;\r\n}\r\n\r\n.amal-cta__button:hover {\r\n    transform: translateY(-3px);\r\n}\r\n\r\n.amal-cta__button--message {\r\n    color: #ffffff;\r\n    background: #7b6a5d;\r\n    box-shadow: 0 10px 25px rgba(95, 81, 70, 0.18);\r\n}\r\n\r\n.amal-cta__button--message:hover {\r\n    background: #69594d;\r\n    box-shadow: 0 14px 30px rgba(95, 81, 70, 0.24);\r\n}\r\n\r\n.amal-cta__button--whatsapp {\r\n    color: #ffffff;\r\n    background: #8a9a7b;\r\n    box-shadow: 0 10px 25px rgba(106, 126, 91, 0.18);\r\n}\r\n\r\n.amal-cta__button--whatsapp:hover {\r\n    background: #798b6a;\r\n    box-shadow: 0 14px 30px rgba(106, 126, 91, 0.24);\r\n}\r\n\r\n.amal-cta__button--phone {\r\n    color: #6f5d4e;\r\n    background: #ffffff;\r\n    border: 1px solid rgba(111, 93, 78, 0.16);\r\n    box-shadow: 0 10px 25px rgba(95, 81, 70, 0.08);\r\n}\r\n\r\n.amal-cta__button--phone:hover {\r\n    background: #fbf8f4;\r\n    box-shadow: 0 14px 30px rgba(95, 81, 70, 0.13);\r\n}\r\n\r\n.amal-cta__button span {\r\n    display: inline-block;\r\n}\r\n\r\n.amal-cta__button-arrow {\r\n    font-size: 18px;\r\n    line-height: 1;\r\n    transition: transform 0.25s ease;\r\n}\r\n\r\n.amal-cta__button:hover .amal-cta__button-arrow {\r\n    transform: translateX(-3px);\r\n}\r\n\r\n\/* =========================================\r\n   ILLUSTRATION\r\n   ========================================= *\/\r\n\r\n.amal-cta__illustration {\r\n    position: absolute;\r\n    right: -20px;\r\n    bottom: 0;\r\n    width: 220px;\r\n    height: 220px;\r\n    pointer-events: none;\r\n    z-index: 1;\r\n}\r\n\r\n.amal-envelope {\r\n    position: absolute;\r\n    left: 50%;\r\n    bottom: 18px;\r\n    width: 150px;\r\n    height: 110px;\r\n    transform: translateX(-50%);\r\n    background: #d7c2aa;\r\n    border-radius: 10px;\r\n    box-shadow: 0 14px 35px rgba(95, 81, 70, 0.12);\r\n}\r\n\r\n.amal-envelope::before {\r\n    content: \"\";\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    width: 0;\r\n    height: 0;\r\n    border-left: 75px solid transparent;\r\n    border-right: 75px solid transparent;\r\n    border-top: 60px solid #c8af94;\r\n}\r\n\r\n.amal-envelope::after {\r\n    content: \"\";\r\n    position: absolute;\r\n    left: 0;\r\n    bottom: 0;\r\n    width: 0;\r\n    height: 0;\r\n    border-left: 75px solid #c3a98b;\r\n    border-top: 55px solid transparent;\r\n}\r\n\r\n.amal-envelope__heart {\r\n    position: absolute;\r\n    left: 50%;\r\n    top: 43px;\r\n    z-index: 3;\r\n    transform: translate(-50%, -50%);\r\n    color: #9f8061;\r\n    font-size: 28px;\r\n}\r\n\r\n.amal-paper {\r\n    position: absolute;\r\n    left: 50%;\r\n    top: 5px;\r\n    width: 105px;\r\n    height: 75px;\r\n    transform: translateX(-50%) rotate(-4deg);\r\n    background: #ffffff;\r\n    border-radius: 6px;\r\n    box-shadow: 0 8px 20px rgba(95, 81, 70, 0.10);\r\n    z-index: 2;\r\n}\r\n\r\n.amal-paper::before,\r\n.amal-paper::after {\r\n    content: \"\";\r\n    position: absolute;\r\n    left: 16px;\r\n    right: 16px;\r\n    height: 5px;\r\n    border-radius: 10px;\r\n    background: #e5ddd4;\r\n}\r\n\r\n.amal-paper::before {\r\n    top: 20px;\r\n}\r\n\r\n.amal-paper::after {\r\n    top: 34px;\r\n}\r\n\r\n\/* =========================================\r\n   ENGLISH DIRECTION\r\n   ========================================= *\/\r\n\r\nhtml[lang^=\"en\"] .amal-cta {\r\n    direction: ltr;\r\n}\r\n\r\nhtml[lang^=\"en\"] .amal-cta__content {\r\n    text-align: center;\r\n}\r\n\r\n\/* =========================================\r\n   LARGE SCREENS\r\n   ========================================= *\/\r\n\r\n@media (min-width: 1400px) {\r\n    .amal-cta {\r\n        padding: 110px 30px;\r\n    }\r\n\r\n    .amal-cta__inner {\r\n        min-height: 460px;\r\n    }\r\n\r\n    .amal-cta__illustration {\r\n        right: 20px;\r\n        width: 250px;\r\n        height: 250px;\r\n    }\r\n\r\n    .amal-envelope {\r\n        width: 170px;\r\n        height: 120px;\r\n    }\r\n\r\n    .amal-envelope::before {\r\n        border-left-width: 85px;\r\n        border-right-width: 85px;\r\n        border-top-width: 65px;\r\n    }\r\n\r\n    .amal-envelope::after {\r\n        border-left-width: 85px;\r\n        border-top-width: 60px;\r\n    }\r\n}\r\n\r\n\/* =========================================\r\n   TABLET\r\n   ========================================= *\/\r\n\r\n@media (max-width: 1100px) {\r\n    .amal-cta {\r\n        padding: 80px 20px;\r\n    }\r\n\r\n    .amal-cta__illustration {\r\n        right: -50px;\r\n        transform: scale(0.85);\r\n        transform-origin: bottom right;\r\n    }\r\n\r\n    .amal-cta__heart--1 {\r\n        left: 10%;\r\n    }\r\n\r\n    .amal-cta__heart--2 {\r\n        right: 10%;\r\n    }\r\n}\r\n\r\n\/* =========================================\r\n   MOBILE\r\n   ========================================= *\/\r\n\r\n@media (max-width: 700px) {\r\n    .amal-cta {\r\n        padding: 70px 18px;\r\n    }\r\n\r\n    .amal-cta__inner {\r\n        min-height: auto;\r\n    }\r\n\r\n    .amal-cta__content {\r\n        max-width: 100%;\r\n    }\r\n\r\n    .amal-cta__title {\r\n        font-size: clamp(30px, 8vw, 42px);\r\n        line-height: 1.35;\r\n        margin-bottom: 16px;\r\n    }\r\n\r\n    .amal-cta__subtitle {\r\n        font-size: 16px;\r\n        line-height: 1.8;\r\n        margin-bottom: 28px;\r\n    }\r\n\r\n    .amal-cta__buttons {\r\n        gap: 11px;\r\n    }\r\n\r\n    .amal-cta__button {\r\n        min-width: 150px;\r\n        min-height: 50px;\r\n        padding: 12px 20px;\r\n        font-size: 15px;\r\n    }\r\n\r\n    .amal-cta__illustration {\r\n        display: none;\r\n    }\r\n\r\n    .amal-cta__circle--1 {\r\n        width: 200px;\r\n        height: 200px;\r\n        right: -90px;\r\n    }\r\n\r\n    .amal-cta__circle--2 {\r\n        width: 130px;\r\n        height: 130px;\r\n        left: -60px;\r\n    }\r\n\r\n    .amal-cta__circle--3 {\r\n        width: 70px;\r\n        height: 70px;\r\n        left: 5%;\r\n    }\r\n}\r\n\r\n\/* =========================================\r\n   SMALL MOBILE\r\n   ========================================= *\/\r\n\r\n@media (max-width: 420px) {\r\n    .amal-cta {\r\n        padding: 60px 15px;\r\n    }\r\n\r\n    .amal-cta__title {\r\n        font-size: 30px;\r\n    }\r\n\r\n    .amal-cta__subtitle {\r\n        font-size: 15px;\r\n    }\r\n\r\n    .amal-cta__buttons {\r\n        flex-direction: column;\r\n        width: 100%;\r\n    }\r\n\r\n    .amal-cta__button {\r\n        width: 100%;\r\n        max-width: 300px;\r\n    }\r\n\r\n    .amal-cta__heart--1,\r\n    .amal-cta__heart--4 {\r\n        display: none;\r\n    }\r\n}\r\n\r\n\/* =========================================\r\n   VERY SMALL MOBILE\r\n   ========================================= *\/\r\n\r\n@media (max-width: 330px) {\r\n    .amal-cta {\r\n        padding-left: 12px;\r\n        padding-right: 12px;\r\n    }\r\n\r\n    .amal-cta__title {\r\n        font-size: 27px;\r\n    }\r\n\r\n    .amal-cta__subtitle {\r\n        font-size: 14px;\r\n    }\r\n\r\n    .amal-cta__button {\r\n        max-width: 280px;\r\n        font-size: 14px;\r\n    }\r\n}\r\n<\/style>\r\n\r\n\r\n<section class=\"amal-cta\" dir=\"rtl\">\r\n\r\n    <div class=\"amal-cta__inner\">\r\n\r\n        <!-- Decorative circles -->\r\n        <span class=\"amal-cta__circle amal-cta__circle--1\"><\/span>\r\n        <span class=\"amal-cta__circle amal-cta__circle--2\"><\/span>\r\n        <span class=\"amal-cta__circle amal-cta__circle--3\"><\/span>\r\n\r\n        <!-- Floating hearts -->\r\n        <span class=\"amal-cta__heart amal-cta__heart--1\">\u2661<\/span>\r\n        <span class=\"amal-cta__heart amal-cta__heart--2\">\u2661<\/span>\r\n        <span class=\"amal-cta__heart amal-cta__heart--3\">\u2661<\/span>\r\n        <span class=\"amal-cta__heart amal-cta__heart--4\">\u2661<\/span>\r\n\r\n        <!-- Main content -->\r\n        <div class=\"amal-cta__content\">\r\n\r\n            <h2 class=\"amal-cta__title\">\r\n                <span\r\n                    data-ar=\"\u064a\u0633\u0639\u062f\u0646\u0627 \u062a\u0648\u0627\u0635\u0644\u0643 \u0645\u0639\u0646\u0627\"\r\n                    data-en=\"We'd Love to Hear From You\"\r\n                >\r\n                    \u064a\u0633\u0639\u062f\u0646\u0627 \u062a\u0648\u0627\u0635\u0644\u0643 \u0645\u0639\u0646\u0627\r\n                <\/span>\r\n\r\n                <span class=\"amal-cta__title-heart\">\u2661<\/span>\r\n            <\/h2>\r\n\r\n            <p\r\n                class=\"amal-cta__subtitle\"\r\n                data-ar=\"\u0646\u062d\u0646 \u0647\u0646\u0627 \u0644\u0645\u0633\u0627\u0639\u062f\u062a\u0643 \u0648\u0627\u0644\u0625\u062c\u0627\u0628\u0629 \u0639\u0646 \u0627\u0633\u062a\u0641\u0633\u0627\u0631\u0627\u062a\u0643. \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0628\u0627\u0644\u0637\u0631\u064a\u0642\u0629 \u0627\u0644\u062a\u064a \u062a\u0646\u0627\u0633\u0628\u0643.\"\r\n                data-en=\"We are here to help and answer your questions. Contact us through the method that suits you best.\"\r\n            >\r\n                \u0646\u062d\u0646 \u0647\u0646\u0627 \u0644\u0645\u0633\u0627\u0639\u062f\u062a\u0643 \u0648\u0627\u0644\u0625\u062c\u0627\u0628\u0629 \u0639\u0646 \u0627\u0633\u062a\u0641\u0633\u0627\u0631\u0627\u062a\u0643. \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0628\u0627\u0644\u0637\u0631\u064a\u0642\u0629 \u0627\u0644\u062a\u064a \u062a\u0646\u0627\u0633\u0628\u0643.\r\n            <\/p>\r\n\r\n            <div class=\"amal-cta__buttons\">\r\n\r\n                <!-- Message -->\r\n                <a\r\n                    class=\"amal-cta__button amal-cta__button--message\"\r\n                    href=\"#contact\"\r\n                    data-ar-label=\"\u0623\u0631\u0633\u0644 \u0631\u0633\u0627\u0644\u0629\"\r\n                    data-en-label=\"Send a Message\"\r\n                    aria-label=\"\u0623\u0631\u0633\u0644 \u0631\u0633\u0627\u0644\u0629\"\r\n                >\r\n                    <span\r\n                        data-ar=\"\u0623\u0631\u0633\u0644 \u0631\u0633\u0627\u0644\u0629\"\r\n                        data-en=\"Send a Message\"\r\n                    >\r\n                        \u0623\u0631\u0633\u0644 \u0631\u0633\u0627\u0644\u0629\r\n                    <\/span>\r\n\r\n                    <span\r\n                        class=\"amal-cta__button-arrow\"\r\n                        data-ar=\"\u2190\"\r\n                        data-en=\"\u2192\"\r\n                    >\r\n                        \u2190\r\n                    <\/span>\r\n                <\/a>\r\n\r\n                <!-- WhatsApp -->\r\n                <a\r\n                    class=\"amal-cta__button amal-cta__button--whatsapp\"\r\n                    href=\"https:\/\/wa.me\/\"\r\n                    target=\"_blank\"\r\n                    rel=\"noopener noreferrer\"\r\n                    data-ar-label=\"\u062a\u0648\u0627\u0635\u0644 \u0639\u0628\u0631 \u0648\u0627\u062a\u0633\u0627\u0628\"\r\n                    data-en-label=\"Chat on WhatsApp\"\r\n                    aria-label=\"\u062a\u0648\u0627\u0635\u0644 \u0639\u0628\u0631 \u0648\u0627\u062a\u0633\u0627\u0628\"\r\n                >\r\n                    <span\r\n                        data-ar=\"\u062a\u0648\u0627\u0635\u0644 \u0639\u0628\u0631 \u0648\u0627\u062a\u0633\u0627\u0628\"\r\n                        data-en=\"Chat on WhatsApp\"\r\n                    >\r\n                        \u062a\u0648\u0627\u0635\u0644 \u0639\u0628\u0631 \u0648\u0627\u062a\u0633\u0627\u0628\r\n                    <\/span>\r\n\r\n                    <span\r\n                        class=\"amal-cta__button-arrow\"\r\n                        data-ar=\"\u2190\"\r\n                        data-en=\"\u2192\"\r\n                    >\r\n                        \u2190\r\n                    <\/span>\r\n                <\/a>\r\n\r\n                <!-- Phone -->\r\n                <a\r\n                    class=\"amal-cta__button amal-cta__button--phone\"\r\n                    href=\"tel:\"\r\n                    data-ar-label=\"\u0627\u062a\u0635\u0644 \u0628\u0646\u0627\"\r\n                    data-en-label=\"Call Us\"\r\n                    aria-label=\"\u0627\u062a\u0635\u0644 \u0628\u0646\u0627\"\r\n                >\r\n                    <span\r\n                        data-ar=\"\u0627\u062a\u0635\u0644 \u0628\u0646\u0627\"\r\n                        data-en=\"Call Us\"\r\n                    >\r\n                        \u0627\u062a\u0635\u0644 \u0628\u0646\u0627\r\n                    <\/span>\r\n\r\n                    <span\r\n                        class=\"amal-cta__button-arrow\"\r\n                        data-ar=\"\u2190\"\r\n                        data-en=\"\u2192\"\r\n                    >\r\n                        \u2190\r\n                    <\/span>\r\n                <\/a>\r\n\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- Illustration -->\r\n        <div class=\"amal-cta__illustration\" aria-hidden=\"true\">\r\n\r\n            <div class=\"amal-paper\"><\/div>\r\n\r\n            <div class=\"amal-envelope\">\r\n                <span class=\"amal-envelope__heart\">\u2661<\/span>\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/section>\r\n\r\n\r\n<script>\r\n(function () {\r\n    \"use strict\";\r\n\r\n    \/*\r\n     * =========================================\r\n     * AMAL CTA \u2014 ANTI-FLICKER LANGUAGE SWITCHER\r\n     * =========================================\r\n     *\r\n     * Important:\r\n     * - No document-wide click listener\r\n     * - No setInterval polling\r\n     * - Only reacts when <html lang=\"\"> actually changes\r\n     * - Only writes DOM values when they are different\r\n     *\/\r\n\r\n    function getSection() {\r\n        return document.querySelector(\".amal-cta\");\r\n    }\r\n\r\n    function getLanguage() {\r\n        var html = document.documentElement;\r\n\r\n        if (!html) {\r\n            return \"\";\r\n        }\r\n\r\n        return (html.getAttribute(\"lang\") || \"\").toLowerCase();\r\n    }\r\n\r\n    function setTextIfChanged(element, value) {\r\n        if (!element) {\r\n            return;\r\n        }\r\n\r\n        if (element.textContent !== value) {\r\n            element.textContent = value;\r\n        }\r\n    }\r\n\r\n    function setAttributeIfChanged(element, attribute, value) {\r\n        if (!element) {\r\n            return;\r\n        }\r\n\r\n        if (element.getAttribute(attribute) !== value) {\r\n            element.setAttribute(attribute, value);\r\n        }\r\n    }\r\n\r\n    var lastLanguage = null;\r\n\r\n    function updateLanguage(force) {\r\n        var section = getSection();\r\n\r\n        if (!section) {\r\n            return;\r\n        }\r\n\r\n        var language = getLanguage();\r\n\r\n        \/*\r\n         * Prevent duplicate DOM updates.\r\n         * TranslatePress can trigger several events while switching.\r\n         *\/\r\n        if (!force && language === lastLanguage) {\r\n            return;\r\n        }\r\n\r\n        lastLanguage = language;\r\n\r\n        var english = language.indexOf(\"en\") === 0;\r\n\r\n        \/*\r\n         * Section direction\r\n         *\/\r\n        setAttributeIfChanged(\r\n            section,\r\n            \"dir\",\r\n            english ? \"ltr\" : \"rtl\"\r\n        );\r\n\r\n        \/*\r\n         * Text translation\r\n         *\/\r\n        section\r\n            .querySelectorAll(\"[data-ar][data-en]\")\r\n            .forEach(function (element) {\r\n\r\n                var value = english\r\n                    ? (element.getAttribute(\"data-en\") || \"\")\r\n                    : (element.getAttribute(\"data-ar\") || \"\");\r\n\r\n                setTextIfChanged(element, value);\r\n            });\r\n\r\n        \/*\r\n         * Accessibility labels\r\n         *\/\r\n        section\r\n            .querySelectorAll(\"[data-ar-label][data-en-label]\")\r\n            .forEach(function (element) {\r\n\r\n                var value = english\r\n                    ? (element.getAttribute(\"data-en-label\") || \"\")\r\n                    : (element.getAttribute(\"data-ar-label\") || \"\");\r\n\r\n                setAttributeIfChanged(\r\n                    element,\r\n                    \"aria-label\",\r\n                    value\r\n                );\r\n            });\r\n\r\n        \/*\r\n         * Button direction\r\n         *\/\r\n        var buttons = section.querySelector(\".amal-cta__buttons\");\r\n\r\n        if (buttons) {\r\n            setAttributeIfChanged(\r\n                buttons,\r\n                \"dir\",\r\n                english ? \"ltr\" : \"rtl\"\r\n            );\r\n        }\r\n    }\r\n\r\n    function initialize() {\r\n\r\n        \/*\r\n         * Initial update\r\n         *\/\r\n        updateLanguage(true);\r\n\r\n        \/*\r\n         * Watch ONLY the <html lang=\"\"> attribute.\r\n         *\r\n         * This is much more stable than listening for every click\r\n         * and repeatedly updating the section.\r\n         *\/\r\n        var htmlElement = document.documentElement;\r\n\r\n        if (!htmlElement) {\r\n            return;\r\n        }\r\n\r\n        var observer = new MutationObserver(function (mutations) {\r\n\r\n            for (var i = 0; i < mutations.length; i++) {\r\n\r\n                var mutation = mutations[i];\r\n\r\n                if (\r\n                    mutation.type === \"attributes\" &&\r\n                    mutation.attributeName === \"lang\"\r\n                ) {\r\n                    updateLanguage(false);\r\n                    break;\r\n                }\r\n            }\r\n        });\r\n\r\n        observer.observe(htmlElement, {\r\n            attributes: true,\r\n            attributeFilter: [\"lang\"]\r\n        });\r\n    }\r\n\r\n    \/*\r\n     * Initialize after DOM is ready.\r\n     *\/\r\n    if (document.readyState === \"loading\") {\r\n\r\n        document.addEventListener(\r\n            \"DOMContentLoaded\",\r\n            initialize,\r\n            { once: true }\r\n        );\r\n\r\n    } else {\r\n\r\n        initialize();\r\n\r\n    }\r\n\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u0627\u062a\u0635\u0644 \u0628\u0646\u0627 \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0639\u0628\u0631 \u0627\u0644\u0647\u0627\u062a\u0641 \u2190 \u0648\u0627\u062a\u0633\u0627\u0628 \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 \u0645\u0628\u0627\u0634\u0631\u0629 \u0639\u0628\u0631 \u0648\u0627\u062a\u0633\u0627\u0628 \u2190 \u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a \u0631\u0627\u0633\u0644\u0646\u0627 \u0639\u0628\u0631 \u0627\u0644\u0628\u0631\u064a\u062f \u0627\u0644\u0625\u0644\u0643\u062a\u0631\u0648\u0646\u064a \u2190 \u0645\u0648\u0642\u0639\u0646\u0627 \u062a\u0639\u0631\u0641 \u0639\u0644\u0649 \u0645\u0648\u0642\u0639\u0646\u0627 \u0648\u0633\u0627\u0639\u0627\u062a \u0627\u0644\u0639\u0645\u0644 \u2190 \u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u0646\u0627 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"tpl-default-elementor.php","meta":{"footnotes":""},"class_list":["post-51","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/alamal-association.com\/en\/wp-json\/wp\/v2\/pages\/51","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alamal-association.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/alamal-association.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/alamal-association.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/alamal-association.com\/en\/wp-json\/wp\/v2\/comments?post=51"}],"version-history":[{"count":35,"href":"https:\/\/alamal-association.com\/en\/wp-json\/wp\/v2\/pages\/51\/revisions"}],"predecessor-version":[{"id":2087,"href":"https:\/\/alamal-association.com\/en\/wp-json\/wp\/v2\/pages\/51\/revisions\/2087"}],"wp:attachment":[{"href":"https:\/\/alamal-association.com\/en\/wp-json\/wp\/v2\/media?parent=51"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}