{"id":683,"date":"2026-07-25T22:20:12","date_gmt":"2026-07-25T22:20:12","guid":{"rendered":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/?page_id=683"},"modified":"2026-09-15T01:16:41","modified_gmt":"2026-09-15T01:16:41","slug":"credencial","status":"publish","type":"page","link":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/credencial\/","title":{"rendered":"Credencial"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"683\" class=\"elementor elementor-683\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-acbac14 e-con-full e-flex e-con e-parent\" data-id=\"acbac14\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-613aa79 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"613aa79\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n\/* ==========================================================\r\n   CREDENCIAL OFICIAL\r\n   ========================================================== *\/\r\n#cm-seccion-credencial,\r\n#cm-seccion-credencial * {\r\n    box-sizing: border-box;\r\n}\r\n\r\n#cm-seccion-credencial {\r\n    --cm-primary-gold: #8c6814;\r\n    --cm-badge-bg: #f4efdf;\r\n    --cm-text-dark: #111827;\r\n    --cm-text-gray: #4b5563;\r\n    --cm-btn-hover: #735510;\r\n\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    min-width: 100vw;\r\n    padding: 100px 5%;\r\n    \r\n    background-image:\r\n        radial-gradient(\r\n            ellipse 70% 50% at 50% -15%,\r\n            rgba(212, 175, 55, 0.35) 0%,\r\n            rgba(140, 104, 20, 0.08) 60%,\r\n            transparent 100%\r\n        ),\r\n        url('ruta-a-tu-fondo.jpg');\r\n    background-size: cover;\r\n    background-position: center;\r\n    background-repeat: no-repeat;\r\n    background-color: #fbfbfb;\r\n\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    position: relative;\r\n}\r\n\r\n\/* ==========================================================\r\n   CONTENEDOR INTERNO\r\n   ========================================================== *\/\r\n#cm-seccion-credencial .cm-cred-container {\r\n    width: 100%;\r\n    max-width: 1200px;\r\n    margin: 0 auto;\r\n    display: flex;\r\n    flex-direction: row;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    gap: 60px;\r\n    position: relative;\r\n    z-index: 1;\r\n}\r\n\r\n\/* ==========================================================\r\n   COLUMNA IZQUIERDA\r\n   ========================================================== *\/\r\n#cm-seccion-credencial .cm-cred-info {\r\n    flex: 1 1 50%;\r\n    max-width: 580px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: flex-start;\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-badge {\r\n    background-color: var(--cm-badge-bg);\r\n    color: var(--cm-primary-gold);\r\n    padding: 6px 16px;\r\n    border-radius: 20px;\r\n    font-size: 11px;\r\n    font-weight: 700;\r\n    letter-spacing: 1.2px;\r\n    text-transform: uppercase;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n    margin-bottom: 24px;\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-badge i {\r\n    font-size: 13px;\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-title {\r\n    font-size: 48px;\r\n    line-height: 1.15;\r\n    color: var(--cm-text-dark);\r\n    margin: 0 0 20px;\r\n    font-weight: 400;\r\n    letter-spacing: -1px;\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-desc {\r\n    font-size: 17px;\r\n    line-height: 1.4;\r\n    color: var(--cm-text-gray);\r\n    margin: 0 0 35px;\r\n    text-align: justify;\r\n    width: 100%;\r\n}\r\n\r\n\/* ==========================================================\r\n   BOTONES\r\n   ========================================================== *\/\r\n#cm-seccion-credencial .cm-cred-buttons {\r\n    display: flex;\r\n    flex-direction: row;\r\n    gap: 12px;\r\n    width: 100%;\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-btn {\r\n    padding: 12px 20px;\r\n    border-radius: 4px;\r\n    font-size: 11px;\r\n    font-weight: 700;\r\n    text-decoration: none;\r\n    letter-spacing: 0.5px;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 8px;\r\n    transition: all 0.3s ease;\r\n    text-transform: uppercase;\r\n    white-space: nowrap;\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-btn-primary {\r\n    background-color: var(--cm-primary-gold);\r\n    color: #ffffff;\r\n    border: 1px solid var(--cm-primary-gold);\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-btn-primary:hover {\r\n    background-color: var(--cm-btn-hover);\r\n    color: #ffffff;\r\n    transform: translateY(-2px);\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-btn-secondary {\r\n    background-color: #ffffff;\r\n    color: var(--cm-text-dark);\r\n    border: 1px solid transparent;\r\n    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-btn-secondary:hover {\r\n    color: var(--cm-text-dark);\r\n    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.10);\r\n    transform: translateY(-2px);\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-btn-secondary i {\r\n    color: var(--cm-primary-gold);\r\n    font-size: 14px;\r\n}\r\n\r\n\/* ==========================================================\r\n   COLUMNA DERECHA (CARRUSEL)\r\n   ========================================================== *\/\r\n#cm-seccion-credencial .cm-cred-visual {\r\n    flex: 1 1 50%;\r\n    display: flex;\r\n    justify-content: center;\r\n    position: relative;\r\n    max-width: 520px;\r\n    margin: 0 auto;\r\n}\r\n\r\n#cm-seccion-credencial .cm-cred-visual-wrapper {\r\n    position: relative;\r\n    width: 100%;\r\n    max-width: 460px;\r\n    filter: drop-shadow(0 20px 40px rgba(140, 104, 20, 0.20));\r\n}\r\n\r\n#cm-seccion-credencial .cm-carousel-container {\r\n    overflow: hidden;\r\n    border-radius: 12px;\r\n    position: relative;\r\n    width: 100%;\r\n}\r\n\r\n#cm-seccion-credencial .cm-carousel-track {\r\n    display: flex;\r\n    transition: transform 0.5s ease-in-out;\r\n    width: 100%;\r\n}\r\n\r\n#cm-seccion-credencial .cm-carousel-track img {\r\n    width: 100%;\r\n    flex: 0 0 100%;\r\n    height: auto;\r\n    display: block;\r\n    border-radius: 12px;\r\n}\r\n\r\n\/* ==========================================================\r\n   CONTROLES DEL CARRUSEL\r\n   ========================================================== *\/\r\n#cm-seccion-credencial .cm-car-btn {\r\n    position: absolute;\r\n    top: 50%;\r\n    transform: translateY(-50%);\r\n    background: rgba(255, 255, 255, 0.8);\r\n    color: var(--cm-text-dark);\r\n    border: none;\r\n    width: 40px;\r\n    height: 40px;\r\n    border-radius: 50%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    cursor: pointer;\r\n    z-index: 10;\r\n    transition: all 0.3s ease;\r\n    box-shadow: 0 4px 10px rgba(0,0,0,0.1);\r\n}\r\n\r\n#cm-seccion-credencial .cm-car-btn:hover {\r\n    background: var(--cm-primary-gold);\r\n    color: #fff;\r\n}\r\n\r\n#cm-seccion-credencial .cm-car-prev { left: 10px; }\r\n#cm-seccion-credencial .cm-car-next { right: 10px; }\r\n\r\n#cm-seccion-credencial .cm-car-dots {\r\n    position: absolute;\r\n    bottom: 15px;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    display: flex;\r\n    gap: 8px;\r\n    z-index: 10;\r\n}\r\n\r\n#cm-seccion-credencial .cm-car-dot {\r\n    width: 8px;\r\n    height: 8px;\r\n    border-radius: 50%;\r\n    background: rgba(255,255,255,0.5);\r\n    cursor: pointer;\r\n    transition: all 0.3s ease;\r\n}\r\n\r\n#cm-seccion-credencial .cm-car-dot.active {\r\n    background: var(--cm-primary-gold);\r\n    transform: scale(1.2);\r\n}\r\n\r\n\/* ==========================================================\r\n   MEDIA QUERIES\r\n   ========================================================== *\/\r\n@media (max-width: 1024px) {\r\n    #cm-seccion-credencial .cm-cred-title {\r\n        font-size: 40px;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-buttons {\r\n        flex-wrap: wrap;\r\n    }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    #cm-seccion-credencial {\r\n        padding: 60px 24px;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-container {\r\n        flex-direction: column;\r\n        gap: 50px;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-info {\r\n        max-width: 100%;\r\n        align-items: center;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-title {\r\n        font-size: 34px;\r\n        text-align: center;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-desc {\r\n        font-size: 16px;\r\n        text-align: center;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-buttons {\r\n        flex-direction: column;\r\n        width: 100%;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-btn {\r\n        width: 100%;\r\n        white-space: normal;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-visual {\r\n        max-width: 100%;\r\n        width: 100%;\r\n    }\r\n    #cm-seccion-credencial .cm-cred-visual-wrapper {\r\n        max-width: 380px;\r\n        width: 90%;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<section id=\"cm-seccion-credencial\">\r\n    <div class=\"cm-cred-container\">\r\n        \r\n        <div class=\"cm-cred-info\">\r\n\r\n            <h2 class=\"cm-cred-title\">\r\n                Credencial Oficial de la Comunidad Musulmana en M\u00e9xico\r\n            <\/h2>\r\n\r\n            <p class=\"cm-cred-desc\">\r\n                Tu llave de identidad, hermandad y beneficios exclusivos en toda la Rep\u00fablica Mexicana. Un documento avalado con validez representativa y convenios activos a nivel nacional.\r\n            <\/p>\r\n\r\n            <div class=\"cm-cred-buttons\">\r\n                <a href=\"https:\/\/docs.google.com\/forms\/d\/e\/1FAIpQLSckinbDXZSMiXRJTh56Burk4VC31y3W0_TDQwg8FYVF-GPF0w\/viewform\" class=\"cm-cred-btn cm-cred-btn-primary\">\r\n                    \u00a1REG\u00cdSTRATE YA!\r\n                    <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n                <\/a>\r\n\r\n                <a href=\"#aliados\" class=\"cm-cred-btn cm-cred-btn-secondary\">\r\n                    <i class=\"fa-solid fa-store\"><\/i>\r\n                    CONOCE LOS COMERCIOS ALIADOS\r\n                <\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"cm-cred-visual\">\r\n            <div class=\"cm-cred-visual-wrapper\">\r\n                \r\n                <div class=\"cm-carousel-container\" id=\"cm-carousel-container\">\r\n                    <div class=\"cm-carousel-track\" id=\"cm-carousel-track\">\r\n                        <!-- Imagen 1 -->\r\n                        <img decoding=\"async\" src=\"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/wp-content\/uploads\/2026\/09\/ejora_unauglo_toma_cercana_cercana_2K_20260912183320.webp\" alt=\"Credencial Frontal\">\r\n                        <!-- Imagen 2 -->\r\n                        <img decoding=\"async\" src=\"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/wp-content\/uploads\/2026\/09\/ejora_unauglo_toma_cercana_cercana_2K_20260912183106.webp\" alt=\"Credencial Trasera\">\r\n                        <!-- Imagen 3 -->\r\n                        <img decoding=\"async\" src=\"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/wp-content\/uploads\/2026\/09\/Professional_credential_mockup_r\u2026_2K_20260912182153.webp\" alt=\"Credencial Trasera1\">\r\n                        <!-- Imagen 4  -->\r\n                        <img decoding=\"async\" src=\"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/wp-content\/uploads\/2026\/09\/Cambiar_credencial_de_imagen_2K_20260912182147.webp\" alt=\"Credencial Cuarta\">\r\n                    <\/div>\r\n                    \r\n                    <!-- Controles Flechas -->\r\n                    <button class=\"cm-car-btn cm-car-prev\" id=\"cm-car-prev\" aria-label=\"Anterior\">\r\n                        <i class=\"fa-solid fa-chevron-left\"><\/i>\r\n                    <\/button>\r\n                    <button class=\"cm-car-btn cm-car-next\" id=\"cm-car-next\" aria-label=\"Siguiente\">\r\n                        <i class=\"fa-solid fa-chevron-right\"><\/i>\r\n                    <\/button>\r\n\r\n                    <!-- Puntos (Se agregaron 4 puntos para que coincidan con las 4 im\u00e1genes) -->\r\n                    <div class=\"cm-car-dots\">\r\n                        <span class=\"cm-car-dot active\" data-index=\"0\"><\/span>\r\n                        <span class=\"cm-car-dot\" data-index=\"1\"><\/span>\r\n                        <span class=\"cm-car-dot\" data-index=\"2\"><\/span>\r\n                        <span class=\"cm-car-dot\" data-index=\"3\"><\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/section>\r\n\r\n<!-- ==========================================================\r\n   SCRIPT CARRUSEL (TOUCH Y AUTOPLAY)\r\n   ========================================================== -->\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', () => {\r\n    const track = document.getElementById('cm-carousel-track');\r\n    const dots = document.querySelectorAll('.cm-car-dot');\r\n    const prevBtn = document.getElementById('cm-car-prev');\r\n    const nextBtn = document.getElementById('cm-car-next');\r\n    const carouselContainer = document.getElementById('cm-carousel-container');\r\n    \r\n    \/\/ Cambiado a 4 para reflejar el total de im\u00e1genes\r\n    const totalSlides = 4;\r\n    let currentIndex = 0;\r\n    let autoPlayInterval;\r\n\r\n    const updateCarousel = () => {\r\n        track.style.transform = `translateX(-${currentIndex * 100}%)`;\r\n        dots.forEach(dot => dot.classList.remove('active'));\r\n        dots[currentIndex].classList.add('active');\r\n    };\r\n\r\n    const nextSlide = () => {\r\n        currentIndex = (currentIndex + 1) % totalSlides;\r\n        updateCarousel();\r\n        resetAutoPlay();\r\n    };\r\n\r\n    const prevSlide = () => {\r\n        currentIndex = (currentIndex - 1 + totalSlides) % totalSlides;\r\n        updateCarousel();\r\n        resetAutoPlay();\r\n    };\r\n\r\n    const startAutoPlay = () => {\r\n        autoPlayInterval = setInterval(nextSlide, 4000);\r\n    };\r\n\r\n    const resetAutoPlay = () => {\r\n        clearInterval(autoPlayInterval);\r\n        startAutoPlay();\r\n    };\r\n\r\n    nextBtn.addEventListener('click', nextSlide);\r\n    prevBtn.addEventListener('click', prevSlide);\r\n\r\n    dots.forEach((dot, index) => {\r\n        dot.addEventListener('click', () => {\r\n            currentIndex = index;\r\n            updateCarousel();\r\n            resetAutoPlay();\r\n        });\r\n    });\r\n\r\n    let startX = 0;\r\n    let endX = 0;\r\n\r\n    carouselContainer.addEventListener('touchstart', (e) => {\r\n        startX = e.changedTouches[0].screenX;\r\n        clearInterval(autoPlayInterval);\r\n    }, {passive: true});\r\n\r\n    carouselContainer.addEventListener('touchend', (e) => {\r\n        endX = e.changedTouches[0].screenX;\r\n        handleSwipe();\r\n        startAutoPlay();\r\n    }, {passive: true});\r\n\r\n    const handleSwipe = () => {\r\n        const swipeThreshold = 40;\r\n        if (startX - endX > swipeThreshold) {\r\n            nextSlide();\r\n        }\r\n        if (endX - startX > swipeThreshold) {\r\n            prevSlide();\r\n        }\r\n    };\r\n\r\n    startAutoPlay();\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-62aeef3 e-flex e-con-boxed e-con e-parent\" data-id=\"62aeef3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-615db10 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"615db10\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n\/* ==========================================================\r\n    BENEFICIOS PARA MIEMBROS\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios,\r\n#cm-seccion-beneficios * {\r\n    box-sizing: border-box;\r\n}\r\n\r\n\r\n#cm-seccion-beneficios {\r\n\r\n    --cm-gold: #a87600;\r\n    --cm-gold-hover: #8f6500;\r\n\r\n    \/* Azul gris\u00e1ceo MUY sutil *\/\r\n    --cm-blue-gray: #71899c;\r\n    --cm-blue-gray-bg: #edf1f4;\r\n\r\n    --cm-text: #101820;\r\n    --cm-text-gray: #657384;\r\n\r\n    \/* FULL BLEED *\/\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n\r\n    min-width: 100vw;\r\n\r\n    padding:\r\n        75px\r\n        24px\r\n        80px;\r\n\r\n    background: #f4f4f4;\r\n\r\n    font-family: Helvetica, Arial, sans-serif;\r\n\r\n    position: relative;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    ENCABEZADO\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefits-header {\r\n\r\n    width: min(760px, 100%);\r\n\r\n    margin:\r\n        0 auto\r\n        42px;\r\n\r\n    text-align: center;\r\n}\r\n\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefits-eyebrow {\r\n\r\n    margin: 0 0 8px;\r\n\r\n    color:\r\n        var(--cm-gold);\r\n\r\n    font-size: 11px;\r\n\r\n    font-weight: 700;\r\n\r\n    letter-spacing:\r\n        0.15em;\r\n\r\n    line-height: 1.3;\r\n\r\n    text-transform: uppercase;\r\n}\r\n\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefits-title {\r\n\r\n    margin: 0 0 10px;\r\n\r\n    color:\r\n        var(--cm-text);\r\n\r\n    font-family:\r\n        Helvetica,\r\n        Arial,\r\n        sans-serif;\r\n\r\n    font-size:\r\n        clamp(\r\n            28px,\r\n            3vw,\r\n            39px\r\n        );\r\n\r\n    font-weight: 400;\r\n\r\n    letter-spacing:\r\n        -0.035em;\r\n\r\n    line-height:\r\n        1.15;\r\n}\r\n\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefits-subtitle {\r\n\r\n    width:\r\n        min(700px, 100%);\r\n\r\n    margin:\r\n        0 auto;\r\n\r\n    color:\r\n        var(--cm-text-gray);\r\n\r\n    font-size: 14px;\r\n\r\n    font-weight: 400;\r\n\r\n    line-height:\r\n        1.55;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    GRID\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefits-grid {\r\n\r\n    width:\r\n        min(\r\n            1150px,\r\n            100%\r\n        );\r\n\r\n    margin:\r\n        0 auto;\r\n\r\n    display: grid;\r\n\r\n    grid-template-columns:\r\n        repeat(\r\n            3,\r\n            minmax(0, 1fr)\r\n        );\r\n\r\n    gap: 19px;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    TARJETAS\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-card {\r\n\r\n    position: relative;\r\n\r\n    min-height:\r\n        274px;\r\n\r\n    \/* PADDING CON !IMPORTANT PARA EVITAR QUE SE SOBREESCRIBA *\/\r\n    padding:\r\n        30px 22px 26px !important;\r\n\r\n    display:\r\n        flex;\r\n\r\n    flex-direction:\r\n        column;\r\n\r\n    background:\r\n        #ffffff;\r\n\r\n    border:\r\n        1px solid\r\n        rgba(\r\n            20,\r\n            35,\r\n            48,\r\n            0.05\r\n        );\r\n\r\n    border-radius:\r\n        7px;\r\n\r\n    box-shadow:\r\n        0 2px 5px\r\n        rgba(\r\n            16,\r\n            24,\r\n            32,\r\n            0.025\r\n        ),\r\n        0 8px 20px\r\n        rgba(\r\n            16,\r\n            24,\r\n            32,\r\n            0.025\r\n        );\r\n\r\n    overflow:\r\n        hidden;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    TARJETA ANCHA\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-card.cm-benefit-wide {\r\n\r\n    grid-column:\r\n        span 2;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    ICONOS\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-icon {\r\n\r\n    width: 40px;\r\n    height: 40px;\r\n\r\n    flex: 0 0 40px;\r\n\r\n    display:\r\n        flex;\r\n\r\n    align-items:\r\n        center;\r\n\r\n    justify-content:\r\n        center;\r\n\r\n    \/* MARGEN INFERIOR CON !IMPORTANT *\/\r\n    margin:\r\n        0 0 18px !important;\r\n\r\n    border-radius:\r\n        3px;\r\n\r\n    background:\r\n        #f4efdf;\r\n\r\n    color:\r\n        var(--cm-gold);\r\n\r\n    font-size:\r\n        17px;\r\n\r\n    transition:\r\n        background-color\r\n        0.3s ease,\r\n\r\n        color\r\n        0.3s ease,\r\n\r\n        transform\r\n        0.3s ease,\r\n\r\n        box-shadow\r\n        0.3s ease;\r\n}\r\n\r\n\r\n\/* ICONOS AZUL-GRIS *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-card.cm-benefit-blue\r\n.cm-benefit-icon {\r\n\r\n    background:\r\n        var(--cm-blue-gray-bg);\r\n\r\n    color:\r\n        var(--cm-blue-gray);\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    HOVER SOBRE TODA LA TARJETA\r\n    PERO SOLO SE ANIMA EL ICONO\r\n    ========================================================== *\/\r\n\r\n\r\n\/* Tarjetas doradas *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-card:hover\r\n.cm-benefit-icon {\r\n\r\n    background:\r\n        var(--cm-gold);\r\n\r\n    color:\r\n        #ffffff;\r\n\r\n    transform:\r\n        translateY(-3px);\r\n\r\n    box-shadow:\r\n        0 7px 16px\r\n        rgba(\r\n            168,\r\n            118,\r\n            0,\r\n            0.18\r\n        );\r\n}\r\n\r\n\r\n\/* Tarjetas azul-gris *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-card.cm-benefit-blue:hover\r\n.cm-benefit-icon {\r\n\r\n    background:\r\n        var(--cm-blue-gray);\r\n\r\n    color:\r\n        #ffffff;\r\n\r\n    transform:\r\n        translateY(-3px);\r\n\r\n    box-shadow:\r\n        0 7px 16px\r\n        rgba(\r\n            113,\r\n            137,\r\n            156,\r\n            0.20\r\n        );\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    T\u00cdTULO\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-title {\r\n\r\n    margin:\r\n        0 0 10px;\r\n\r\n    color:\r\n        var(--cm-text);\r\n\r\n    font-family:\r\n        Helvetica,\r\n        Arial,\r\n        sans-serif;\r\n\r\n    font-size:\r\n        20px;\r\n\r\n    font-weight:\r\n        400;\r\n\r\n    letter-spacing:\r\n        -0.02em;\r\n\r\n    line-height:\r\n        1.25;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    DESCRIPCI\u00d3N (JUSTIFICADA)\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-text {\r\n\r\n    margin:\r\n        0;\r\n\r\n    color:\r\n        var(--cm-text-gray);\r\n\r\n    font-family:\r\n        Helvetica,\r\n        Arial,\r\n        sans-serif;\r\n\r\n    font-size:\r\n        14px;\r\n\r\n    font-weight:\r\n        400;\r\n\r\n    line-height:\r\n        1.5;\r\n\r\n    text-align: justify;\r\n    text-justify: inter-word;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    LINK INFERIOR\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-link {\r\n\r\n    margin-top:\r\n        auto !important;\r\n\r\n    \/* PADDING CON !IMPORTANT *\/\r\n    padding-top:\r\n        26px !important;\r\n\r\n    padding-bottom:\r\n        2px !important;\r\n\r\n    display:\r\n        inline-flex;\r\n\r\n    align-items:\r\n        center;\r\n\r\n    width:\r\n        fit-content;\r\n\r\n    gap:\r\n        9px;\r\n\r\n    color:\r\n        #111827;\r\n\r\n    font-family:\r\n        Helvetica,\r\n        Arial,\r\n        sans-serif;\r\n\r\n    font-size:\r\n        11px;\r\n\r\n    font-weight:\r\n        700;\r\n\r\n    letter-spacing:\r\n        0.05em;\r\n\r\n    line-height:\r\n        1.3;\r\n\r\n    text-decoration:\r\n        none;\r\n\r\n    transition:\r\n        color\r\n        0.3s ease,\r\n\r\n        gap\r\n        0.3s ease;\r\n}\r\n\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-arrow {\r\n\r\n    font-size:\r\n        17px;\r\n\r\n    font-weight:\r\n        400;\r\n\r\n    line-height:\r\n        1;\r\n\r\n    transition:\r\n        transform\r\n        0.3s ease;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    HOVER SOLO DEL LINK\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-link:hover {\r\n\r\n    color:\r\n        var(--cm-gold);\r\n\r\n    gap:\r\n        13px;\r\n}\r\n\r\n\r\n#cm-seccion-beneficios\r\n.cm-benefit-link:hover\r\n.cm-benefit-arrow {\r\n\r\n    transform:\r\n        translateX(3px);\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    #cm-seccion-beneficios {\r\n\r\n        padding:\r\n            65px\r\n            20px\r\n            70px;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefits-grid {\r\n\r\n        grid-template-columns:\r\n            repeat(\r\n                2,\r\n                minmax(0, 1fr)\r\n            );\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefit-card.cm-benefit-wide {\r\n\r\n        grid-column:\r\n            span 2;\r\n    }\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    M\u00d3VIL\r\n    ========================================================== *\/\r\n\r\n@media (max-width: 620px) {\r\n\r\n    #cm-seccion-beneficios {\r\n\r\n        padding:\r\n            55px\r\n            15px\r\n            60px;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefits-header {\r\n\r\n        margin-bottom:\r\n            30px;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefits-title {\r\n\r\n        font-size:\r\n            29px;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefits-subtitle {\r\n\r\n        font-size:\r\n            13px;\r\n\r\n        line-height:\r\n            1.55;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefits-grid {\r\n\r\n        grid-template-columns:\r\n            1fr;\r\n\r\n        gap:\r\n            14px;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefit-card,\r\n    #cm-seccion-beneficios\r\n    .cm-benefit-card.cm-benefit-wide {\r\n\r\n        grid-column:\r\n            span 1;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefit-card {\r\n\r\n        min-height:\r\n            250px;\r\n\r\n        padding:\r\n            26px 19px 24px !important;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefit-title {\r\n\r\n        font-size:\r\n            19px;\r\n    }\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    M\u00d3VIL PEQUE\u00d1O\r\n    ========================================================== *\/\r\n\r\n@media (max-width: 400px) {\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefits-title {\r\n\r\n        font-size:\r\n            27px;\r\n    }\r\n\r\n\r\n    #cm-seccion-beneficios\r\n    .cm-benefit-text {\r\n\r\n        font-size:\r\n            13px;\r\n    }\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n<section id=\"cm-seccion-beneficios\">\r\n\r\n    <div class=\"cm-benefits-header\">\r\n\r\n        <p class=\"cm-benefits-eyebrow\">\r\n            VALOR INTEGRAL\r\n        <\/p>\r\n\r\n\r\n        <h2 class=\"cm-benefits-title\">\r\n            Beneficios Exclusivos para Miembros\r\n        <\/h2>\r\n\r\n\r\n        <p class=\"cm-benefits-subtitle\">\r\n            Dise\u00f1ada para acompa\u00f1arte en tu vida cotidiana,\r\n            formaci\u00f3n espiritual, vinculaci\u00f3n profesional\r\n            y respaldo legal en M\u00e9xico.\r\n        <\/p>\r\n\r\n    <\/div>\r\n\r\n\r\n    <div class=\"cm-benefits-grid\">\r\n\r\n\r\n        <!-- ==================================================\r\n             1\r\n             ================================================== -->\r\n\r\n        <article class=\"cm-benefit-card\">\r\n\r\n            <div class=\"cm-benefit-icon\">\r\n                <i class=\"fa-solid fa-utensils\"><\/i>\r\n            <\/div>\r\n\r\n\r\n            <h3 class=\"cm-benefit-title\">\r\n                Descuentos en Comercios y Restaurantes Halal\r\n            <\/h3>\r\n\r\n\r\n            <p class=\"cm-benefit-text\">\r\n                Ahorros preferenciales del\r\n                <strong>10% al 25%<\/strong>\r\n                en alimentos certificados, librer\u00edas,\r\n                cafeter\u00edas, agencias de viaje y tiendas\r\n                de aromaterapia y estilo de vida.\r\n            <\/p>\r\n\r\n\r\n            <a\r\n                href=\"#convenios\"\r\n                class=\"cm-benefit-link\"\r\n            >\r\n\r\n                Ver convenios vigentes\r\n\r\n                <span class=\"cm-benefit-arrow\">\r\n                    \u203a\r\n                <\/span>\r\n\r\n            <\/a>\r\n\r\n        <\/article>\r\n\r\n\r\n        <!-- ==================================================\r\n             2\r\n             ================================================== -->\r\n\r\n        <article class=\"cm-benefit-card cm-benefit-blue\">\r\n\r\n            <div class=\"cm-benefit-icon\">\r\n                <i class=\"fa-solid fa-graduation-cap\"><\/i>\r\n            <\/div>\r\n\r\n\r\n            <h3 class=\"cm-benefit-title\">\r\n                Acceso Prioritario a Eventos y Cursos\r\n            <\/h3>\r\n\r\n\r\n            <p class=\"cm-benefit-text\">\r\n                Asientos reservados y becas en conferencias\r\n                magistrales con acad\u00e9micos internacionales,\r\n                diplomados de lengua \u00e1rabe cor\u00e1nica\r\n                y seminarios teol\u00f3gicos.\r\n            <\/p>\r\n\r\n\r\n            <a\r\n                href=\"#calendario\"\r\n                class=\"cm-benefit-link\"\r\n            >\r\n\r\n                Calendario acad\u00e9mico\r\n\r\n                <span class=\"cm-benefit-arrow\">\r\n                    \u203a\r\n                <\/span>\r\n\r\n            <\/a>\r\n\r\n        <\/article>\r\n\r\n\r\n        <!-- ==================================================\r\n             3\r\n             ================================================== -->\r\n\r\n        <article class=\"cm-benefit-card cm-benefit-blue\">\r\n\r\n            <div class=\"cm-benefit-icon\">\r\n                <i class=\"fa-solid fa-gavel\"><\/i>\r\n            <\/div>\r\n\r\n\r\n            <h3 class=\"cm-benefit-title\">\r\n                Asistencia Espiritual y Jur\u00eddica Gratuita\r\n            <\/h3>\r\n\r\n\r\n            <p class=\"cm-benefit-text\">\r\n                Consejer\u00eda familiar, mediaci\u00f3n de conflictos\r\n                conforme a la \u00e9tica isl\u00e1mica y orientaci\u00f3n\r\n                jur\u00eddica ante dependencias p\u00fablicas\r\n                o tr\u00e1mites migratorios.\r\n            <\/p>\r\n\r\n\r\n            <a\r\n                href=\"#atencion\"\r\n                class=\"cm-benefit-link\"\r\n            >\r\n\r\n                Atenci\u00f3n pastoral y legal\r\n\r\n                <span class=\"cm-benefit-arrow\">\r\n                    \u203a\r\n                <\/span>\r\n\r\n            <\/a>\r\n\r\n        <\/article>\r\n\r\n\r\n        <!-- ==================================================\r\n             4\r\n             ================================================== -->\r\n\r\n        <article class=\"cm-benefit-card\">\r\n\r\n            <div class=\"cm-benefit-icon\">\r\n                <i class=\"fa-solid fa-users\"><\/i>\r\n            <\/div>\r\n\r\n\r\n            <h3 class=\"cm-benefit-title\">\r\n                Red de Networking Profesional y Hermandad\r\n            <\/h3>\r\n\r\n\r\n            <p class=\"cm-benefit-text\">\r\n                Conexi\u00f3n directa mediante directorio reservado\r\n                con m\u00e9dicos, abogados, desarrolladores,\r\n                ingenieros y empresarios musulmanes\r\n                para sinergias y mentor\u00edas.\r\n            <\/p>\r\n\r\n\r\n            <a\r\n                href=\"#directorio\"\r\n                class=\"cm-benefit-link\"\r\n            >\r\n\r\n                Directorio comunitario\r\n\r\n                <span class=\"cm-benefit-arrow\">\r\n                    \u203a\r\n                <\/span>\r\n\r\n            <\/a>\r\n\r\n        <\/article>\r\n\r\n\r\n        <!-- ==================================================\r\n             5\r\n             ================================================== -->\r\n\r\n        <article\r\n            class=\"\r\n                cm-benefit-card\r\n                cm-benefit-blue\r\n                cm-benefit-wide\r\n            \"\r\n        >\r\n\r\n            <div class=\"cm-benefit-icon\">\r\n                <i class=\"fa-solid fa-file-circle-check\"><\/i>\r\n            <\/div>\r\n\r\n\r\n            <h3 class=\"cm-benefit-title\">\r\n                Certificaci\u00f3n y Tr\u00e1mites Simplificados\r\n            <\/h3>\r\n\r\n\r\n            <p class=\"cm-benefit-text\">\r\n                Expedici\u00f3n \u00e1gil de certificados notariales\r\n                de Shahada, acta de matrimonio religioso\r\n                (Nikah), cartas consulares para peregrinaci\u00f3n\r\n                de Hajj \/ Umrah y validaci\u00f3n de fe de vida\r\n                avalada por el CIM ante embajadas.\r\n            <\/p>\r\n\r\n\r\n            <a\r\n                href=\"#tramites\"\r\n                class=\"cm-benefit-link\"\r\n            >\r\n\r\n                Tr\u00e1mites institucionales\r\n\r\n                <span class=\"cm-benefit-arrow\">\r\n                    \u203a\r\n                <\/span>\r\n\r\n            <\/a>\r\n\r\n        <\/article>\r\n\r\n    <\/div>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-905b3e4 e-flex e-con-boxed e-con e-parent\" data-id=\"905b3e4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ed69aac elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"ed69aac\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* ==========================================================\r\n    VARIABLES Y CONTENEDOR GENERAL\r\n   ========================================================== *\/\r\n#cm-seccion-impacto,\r\n#cm-seccion-impacto * {\r\n    box-sizing: border-box !important;\r\n}\r\n\r\n#cm-seccion-impacto {\r\n    --cm-bg-color: #172432; \r\n    --cm-gold: #c5a059;\r\n    --cm-gold-hover: #d4af65;\r\n    --cm-text: #ffffff;\r\n    --cm-text-gray: #94a3b8;\r\n    --cm-separator: rgba(255, 255, 255, 0.15); \/* Color de la l\u00ednea separadora *\/\r\n\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    min-width: 100vw;\r\n\r\n    padding: 80px 24px !important;\r\n    background: var(--cm-bg-color);\r\n    font-family: 'Helvetica', Arial, sans-serif;\r\n    position: relative;\r\n    overflow: hidden;\r\n}\r\n\r\n\/* ==========================================================\r\n    ENCABEZADO\r\n   ========================================================== *\/\r\n#cm-seccion-impacto .cm-impact-header {\r\n    width: min(760px, 100%);\r\n    margin: 0 auto 40px;\r\n    text-align: center;\r\n}\r\n\r\n#cm-seccion-impacto .cm-impact-title {\r\n    margin: 0 0 12px;\r\n    color: var(--cm-text);\r\n    font-size: clamp(26px, 3vw, 34px);\r\n    font-weight: 500;\r\n    letter-spacing: -0.02em;\r\n    line-height: 1.15;\r\n}\r\n\r\n#cm-seccion-impacto .cm-impact-subtitle {\r\n    width: min(650px, 100%);\r\n    margin: 0 auto;\r\n    color: var(--cm-text-gray);\r\n    font-size: 14px;\r\n    font-weight: 400;\r\n    line-height: 1.6;\r\n}\r\n\r\n\/* ==========================================================\r\n    ESTAD\u00cdSTICA PRINCIPAL (SUPERIOR) - SIN BORDES\r\n   ========================================================== *\/\r\n#cm-seccion-impacto .cm-top-stat-wrapper {\r\n    width: min(1000px, 100%);\r\n    margin: 0 auto 40px;\r\n    text-align: center;\r\n}\r\n\r\n#cm-seccion-impacto .cm-featured-stat {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    padding: 0 20px;\r\n}\r\n\r\n#cm-seccion-impacto .cm-featured-stat .cm-impact-icon {\r\n    font-size: 26px;\r\n    color: var(--cm-gold);\r\n    margin-bottom: 12px;\r\n}\r\n\r\n#cm-seccion-impacto .cm-featured-stat .cm-card-number {\r\n    font-size: clamp(38px, 5vw, 54px);\r\n    color: var(--cm-gold);\r\n    margin-bottom: 6px;\r\n    font-weight: 700;\r\n    line-height: 1;\r\n}\r\n\r\n#cm-seccion-impacto .cm-featured-stat .cm-card-label-title {\r\n    font-size: 18px;\r\n    color: var(--cm-text);\r\n    margin-bottom: 8px;\r\n    font-weight: 600;\r\n}\r\n\r\n#cm-seccion-impacto .cm-featured-stat .cm-card-desc {\r\n    font-size: 14px;\r\n    color: var(--cm-text-gray);\r\n    max-width: 450px;\r\n    margin: 0 auto;\r\n}\r\n\r\n\/* ==========================================================\r\n    GRID INFERIOR (3 COLUMNAS CON SEPARADORES)\r\n   ========================================================== *\/\r\n#cm-seccion-impacto .cm-impact-grid-3 {\r\n    width: min(1000px, 100%);\r\n    margin: 0 auto 50px;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: flex-start;\r\n}\r\n\r\n#cm-seccion-impacto .cm-stat-item {\r\n    flex: 1;\r\n    position: relative;\r\n    text-align: center;\r\n    padding: 0 30px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n}\r\n\r\n\/* L\u00edneas separadoras verticales *\/\r\n#cm-seccion-impacto .cm-stat-item:not(:last-child)::after {\r\n    content: '';\r\n    position: absolute;\r\n    right: 0;\r\n    top: 10%;\r\n    height: 80%;\r\n    width: 1px;\r\n    background: var(--cm-separator);\r\n}\r\n\r\n#cm-seccion-impacto .cm-stat-item .cm-impact-icon {\r\n    color: #ffffff;\r\n    font-size: 22px;\r\n    margin-bottom: 12px;\r\n    opacity: 0.8;\r\n}\r\n\r\n#cm-seccion-impacto .cm-stat-item .cm-card-number {\r\n    margin: 0 0 6px;\r\n    color: var(--cm-text);\r\n    font-size: 30px;\r\n    font-weight: 700;\r\n    letter-spacing: -0.02em;\r\n    line-height: 1;\r\n}\r\n\r\n#cm-seccion-impacto .cm-stat-item .cm-card-label-title {\r\n    margin: 0 0 8px;\r\n    color: var(--cm-text);\r\n    font-size: 15px;\r\n    font-weight: 600;\r\n    line-height: 1.3;\r\n}\r\n\r\n#cm-seccion-impacto .cm-stat-item .cm-card-desc {\r\n    margin: 0;\r\n    color: var(--cm-text-gray);\r\n    font-size: 13px;\r\n    font-weight: 400;\r\n    line-height: 1.5;\r\n}\r\n\r\n\/* ==========================================================\r\n    BANNER INFERIOR (CTA) - SIN CAJA, SOLO TEXTO Y BOT\u00d3N\r\n   ========================================================== *\/\r\n#cm-seccion-impacto .cm-impact-cta-banner {\r\n    width: min(800px, 100%);\r\n    margin: 0 auto;\r\n    padding-top: 40px;\r\n    border-top: 1px solid var(--cm-separator); \/* L\u00ednea horizontal sutil arriba *\/\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    gap: 30px;\r\n}\r\n\r\n#cm-seccion-impacto .cm-cta-text {\r\n    flex: 1;\r\n}\r\n\r\n#cm-seccion-impacto .cm-cta-title {\r\n    margin: 0 0 6px;\r\n    color: var(--cm-text);\r\n    font-size: 18px;\r\n    font-weight: 600;\r\n}\r\n\r\n#cm-seccion-impacto .cm-cta-desc {\r\n    margin: 0;\r\n    color: var(--cm-text-gray);\r\n    font-size: 13px;\r\n}\r\n\r\n#cm-seccion-impacto .cm-cta-button {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 8px;\r\n    padding: 12px 24px !important;\r\n    background: var(--cm-gold);\r\n    color: #ffffff;\r\n    font-size: 12px;\r\n    font-weight: 700;\r\n    letter-spacing: 0.05em;\r\n    text-transform: uppercase;\r\n    text-decoration: none;\r\n    border-radius: 4px;\r\n    white-space: nowrap;\r\n    transition: all 0.3s ease;\r\n}\r\n\r\n#cm-seccion-impacto .cm-cta-button:hover {\r\n    background: var(--cm-gold-hover);\r\n    transform: translateY(-2px);\r\n}\r\n\r\n\/* ==========================================================\r\n    RESPONSIVE\r\n   ========================================================== *\/\r\n@media (max-width: 768px) {\r\n    #cm-seccion-impacto .cm-impact-grid-3 {\r\n        flex-direction: column;\r\n        gap: 40px;\r\n    }\r\n    \r\n    #cm-seccion-impacto .cm-stat-item {\r\n        width: 100%;\r\n        padding: 0 15px;\r\n    }\r\n\r\n    \/* Ocultar l\u00edneas separadoras verticales en m\u00f3vil y ponerlas horizontales *\/\r\n    #cm-seccion-impacto .cm-stat-item:not(:last-child)::after {\r\n        right: auto;\r\n        left: 25%;\r\n        bottom: -20px;\r\n        top: auto;\r\n        height: 1px;\r\n        width: 50%;\r\n    }\r\n\r\n    #cm-seccion-impacto .cm-impact-cta-banner {\r\n        flex-direction: column;\r\n        text-align: center;\r\n        gap: 20px;\r\n    }\r\n}\r\n<\/style>\r\n\r\n\r\n<section id=\"cm-seccion-impacto\">\r\n\r\n    <!-- ENCABEZADO -->\r\n    <div class=\"cm-impact-header\">\r\n        <h2 class=\"cm-impact-title\">Nuestro Impacto en Cifras Reales<\/h2>\r\n        <p class=\"cm-impact-subtitle\">\r\n            Cientos de hermanas y hermanos en toda la Rep\u00fablica fortalecen diariamente el tejido comunitario del CIM. \u00bfY t\u00fa, qu\u00e9 esperas para sumarte?\r\n        <\/p>\r\n    <\/div>\r\n\r\n    <!-- 1. ESTAD\u00cdSTICA PRINCIPAL (ARRIBA) -->\r\n    <div class=\"cm-top-stat-wrapper\">\r\n        <div class=\"cm-featured-stat\">\r\n            <div class=\"cm-impact-icon\">\r\n                <i class=\"fa-solid fa-id-card\"><\/i>\r\n            <\/div>\r\n            <h3 class=\"cm-card-number\">\r\n                +<span class=\"cm-animate-number\" data-target=\"3480\">0<\/span>\r\n            <\/h3>\r\n            <h4 class=\"cm-card-label-title\">Miembros Registrados<\/h4>\r\n            <p class=\"cm-card-desc\">Acreditados formalmente ante el Concilio Isl\u00e1mico Mexicano. En crecimiento continuo durante este mes.<\/p>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <!-- 2. TRES COLUMNAS INFERIORES CON SEPARADORES -->\r\n    <div class=\"cm-impact-grid-3\">\r\n\r\n        <!-- Columna 1 -->\r\n        <div class=\"cm-stat-item\">\r\n            <div class=\"cm-impact-icon\">\r\n                <i class=\"fa-solid fa-map\"><\/i>\r\n            <\/div>\r\n            <h3 class=\"cm-card-number\">\r\n                <span class=\"cm-animate-number\" data-target=\"100\">0<\/span>%\r\n            <\/h3>\r\n            <h4 class=\"cm-card-label-title\">Estados con Afiliados<\/h4>\r\n            <p class=\"cm-card-desc\">Cobertura activa en las 32 entidades federativas.<\/p>\r\n        <\/div>\r\n\r\n        <!-- Columna 2 -->\r\n        <div class=\"cm-stat-item\">\r\n            <div class=\"cm-impact-icon\">\r\n                <i class=\"fa-solid fa-store\"><\/i>\r\n            <\/div>\r\n            <h3 class=\"cm-card-number\">\r\n                +<span class=\"cm-animate-number\" data-target=\"45\">0<\/span>\r\n            <\/h3>\r\n            <h4 class=\"cm-card-label-title\">Comercios Aliados<\/h4>\r\n            <p class=\"cm-card-desc\">Establecimientos con beneficios exclusivos.<\/p>\r\n        <\/div>\r\n\r\n        <!-- Columna 3 -->\r\n        <div class=\"cm-stat-item\">\r\n            <div class=\"cm-impact-icon\">\r\n                <i class=\"fa-solid fa-thumbs-up\"><\/i>\r\n            <\/div>\r\n            <h3 class=\"cm-card-number\">\r\n                <span class=\"cm-animate-number\" data-target=\"98.6\">0<\/span>%\r\n            <\/h3>\r\n            <h4 class=\"cm-card-label-title\">Satisfacci\u00f3n<\/h4>\r\n            <p class=\"cm-card-desc\">Respaldo positivo de nuestros miembros.<\/p>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n    <!-- BANNER INFERIOR -->\r\n    <div class=\"cm-impact-cta-banner\">\r\n        <div class=\"cm-cta-text\">\r\n            <h3 class=\"cm-cta-title\">\u00a1Solo faltas t\u00fa para completar esta gran familia!<\/h3>\r\n            <p class=\"cm-cta-desc\">Cientos de personas en todo M\u00e9xico ya cuentan con su credencial oficial.<\/p>\r\n        <\/div>\r\n        <a href=\"#registro\" class=\"cm-cta-button\">\r\n            Quiero registrarme <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n        <\/a>\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n<!-- ==========================================================\r\n    SCRIPT DE ANIMACI\u00d3N DE N\u00daMEROS\r\n   ========================================================== -->\r\n<script>\r\ndocument.addEventListener(\"DOMContentLoaded\", () => {\r\n    const counters = document.querySelectorAll('.cm-animate-number');\r\n    \r\n    const animateCountUp = (el) => {\r\n        const target = parseFloat(el.getAttribute('data-target'));\r\n        const duration = 2000; \r\n        const frameRate = 1000 \/ 60; \r\n        const totalFrames = Math.round(duration \/ frameRate);\r\n        const isDecimal = target % 1 !== 0; \r\n        \r\n        let frame = 0;\r\n        \r\n        const counter = setInterval(() => {\r\n            frame++;\r\n            const progress = 1 - Math.pow(1 - frame \/ totalFrames, 4);\r\n            let currentCount = (target * progress);\r\n            \r\n            if (isDecimal) {\r\n                el.innerText = currentCount.toFixed(1);\r\n            } else {\r\n                el.innerText = Math.round(currentCount);\r\n            }\r\n            \r\n            if (frame === totalFrames) {\r\n                clearInterval(counter);\r\n                el.innerText = isDecimal ? target.toFixed(1) : target;\r\n            }\r\n        }, frameRate);\r\n    };\r\n\r\n    const observerOptions = {\r\n        threshold: 0.5 \r\n    };\r\n\r\n    const observer = new IntersectionObserver((entries, obs) => {\r\n        entries.forEach(entry => {\r\n            if (entry.isIntersecting) {\r\n                counters.forEach(counter => {\r\n                    animateCountUp(counter);\r\n                });\r\n                obs.disconnect(); \r\n            }\r\n        });\r\n    }, observerOptions);\r\n\r\n    const section = document.getElementById('cm-seccion-impacto');\r\n    if (section) {\r\n        observer.observe(section);\r\n    }\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-eafeab6 e-flex e-con-boxed e-con e-parent\" data-id=\"eafeab6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-1cdf73b e-con-full e-flex e-con e-child\" data-id=\"1cdf73b\" data-element_type=\"container\" data-e-type=\"container\" id=\"aliados\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3c3c7f7 elementor-widget elementor-widget-menu-anchor\" data-id=\"3c3c7f7\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"aliados\" data-widget_type=\"menu-anchor.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-menu-anchor\" id=\"directorio\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-00df675 elementor-widget elementor-widget-shortcode\" data-id=\"00df675\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\n    <div id=\"directorio-wrapper\">\n        <h2 class=\"directorio-titulo-seccion\">Conoce nuestros aliados<\/h2>\n\t\t<h3 class=\"directorio-subtitulo-seccion\">Busca y encuentra empresas afiliadas y servicios recomendados en nuestro directorio<\/h3>\n        <!-- FILTROS -->\n        <div id=\"directorio-filtros\">\n            <div class=\"dir-input-group\">\n                <input\n                    type=\"text\"\n                    id=\"dir-input-nombre\"\n                    placeholder=\"Buscar empresa por nombre...\"\n                    autocomplete=\"off\"\n                >\n                <i class=\"fas fa-search dir-search-icon\"><\/i>\n            <\/div>\n\n            <select id=\"dir-select-giro\">\n                <option value=\"\">Todos los giros comerciales<\/option>\n                                                            <option value=\"alimentos\">\n                            Alimentos                        <\/option>\n                                            <option value=\"alimentos-halal\">\n                            Alimentos halal                        <\/option>\n                                            <option value=\"banquetes\">\n                            Banquetes                        <\/option>\n                                            <option value=\"belleza\">\n                            Belleza                        <\/option>\n                                            <option value=\"cafeteria\">\n                            Cafeter\u00eda                        <\/option>\n                                            <option value=\"clinicas\">\n                            Cl\u00ednicas                        <\/option>\n                                            <option value=\"comercial\">\n                            Comercial                        <\/option>\n                                            <option value=\"comercio\">\n                            Comercio                        <\/option>\n                                            <option value=\"cursos\">\n                            Cursos                        <\/option>\n                                            <option value=\"educacion\">\n                            Educaci\u00f3n                        <\/option>\n                                            <option value=\"farmacia\">\n                            Farmacia                        <\/option>\n                                            <option value=\"marketing\">\n                            Marketing                        <\/option>\n                                            <option value=\"ong\">\n                            ONG                        <\/option>\n                                            <option value=\"restaurante\">\n                            Restaurante                        <\/option>\n                                            <option value=\"salud\">\n                            Salud                        <\/option>\n                                            <option value=\"seguros\">\n                            Seguros                        <\/option>\n                                            <option value=\"servicios-medicos\">\n                            Servicios M\u00e9dicos                        <\/option>\n                                            <option value=\"servicios-profesionales\">\n                            Servicios Profesionales                        <\/option>\n                                            <option value=\"tecnologia\">\n                            Tecnolog\u00eda                        <\/option>\n                                            <option value=\"tienda\">\n                            Tienda                        <\/option>\n                                                <\/select>\n        <\/div>\n\n        <!-- CONTADOR -->\n        <p id=\"directorio-contador\"><\/p>\n\n        <!-- GRID DE TARJETAS -->\n        <div id=\"directorio-grid\">\n            <p class=\"directorio-cargando\">Cargando empresas...<\/p>\n        <\/div>\n\n        <!-- BOT\u00d3N CARGAR M\u00c1S -->\n        <div id=\"directorio-cargar-mas-container\">\n            <button id=\"dir-btn-cargar-mas\" style=\"display: none;\">Cargar m\u00e1s empresas<\/button>\n        <\/div>\n\n    <\/div>\n\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9c32e43 e-flex e-con-boxed e-con e-parent\" data-id=\"9c32e43\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3ccb4e0 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"3ccb4e0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n\/* ==========================================================\r\n    C\u00d3MO OBTENER TU CREDENCIAL EN 3 PASOS\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-pasos,\r\n#cm-seccion-pasos * {\r\n    box-sizing: border-box !important;\r\n}\r\n\r\n\r\n#cm-seccion-pasos {\r\n\r\n    --cm-gold: #a87600;\r\n    --cm-gold-hover: #8f6500;\r\n\r\n    --cm-blue-gray: #71899c;\r\n    --cm-blue-gray-bg: #edf1f4;\r\n\r\n    --cm-text: #101820;\r\n    --cm-text-gray: #657384;\r\n\r\n    \/* FULL BLEED *\/\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    min-width: 100vw;\r\n\r\n    padding: 75px 24px 80px !important;\r\n    background: #f4f4f4;\r\n    font-family: Helvetica, Arial, sans-serif;\r\n    position: relative;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    ENCABEZADO\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-pasos\r\n.cm-steps-header {\r\n    width: min(760px, 100%);\r\n    margin: 0 auto 45px;\r\n    text-align: center;\r\n}\r\n\r\n\r\n#cm-seccion-pasos\r\n.cm-steps-eyebrow {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 6px;\r\n    margin: 0 0 12px;\r\n    padding: 5px 14px;\r\n    background: #f4efdf;\r\n    color: var(--cm-gold);\r\n    font-size: 11px;\r\n    font-weight: 700;\r\n    letter-spacing: 0.12em;\r\n    line-height: 1.3;\r\n    text-transform: uppercase;\r\n    border-radius: 20px;\r\n}\r\n\r\n\r\n#cm-seccion-pasos\r\n.cm-steps-title {\r\n    margin: 0 0 12px;\r\n    color: var(--cm-text);\r\n    font-family: Helvetica, Arial, sans-serif;\r\n    font-size: clamp(28px, 3vw, 39px);\r\n    font-weight: 400;\r\n    letter-spacing: -0.035em;\r\n    line-height: 1.15;\r\n}\r\n\r\n\r\n#cm-seccion-pasos\r\n.cm-steps-subtitle {\r\n    width: min(700px, 100%);\r\n    margin: 0 auto;\r\n    color: var(--cm-text-gray);\r\n    font-size: 14px;\r\n    font-weight: 400;\r\n    line-height: 1.55;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    GRID DE 3 PASOS\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-pasos\r\n.cm-steps-grid {\r\n    width: min(1150px, 100%);\r\n    margin: 0 auto;\r\n    display: grid;\r\n    grid-template-columns: repeat(3, minmax(0, 1fr));\r\n    gap: 22px;\r\n}\r\n\r\n\r\n#cm-seccion-pasos\r\n.cm-step-card {\r\n    position: relative;\r\n    padding: 30px 24px 26px !important;\r\n    display: flex;\r\n    flex-direction: column;\r\n    background: #ffffff;\r\n    border: 1px solid rgba(20, 35, 48, 0.05);\r\n    border-radius: 7px;\r\n    box-shadow: 0 2px 5px rgba(16, 24, 32, 0.025), 0 8px 20px rgba(16, 24, 32, 0.025);\r\n    overflow: hidden;\r\n    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    N\u00daMERO \/ INSIGNIA DEL PASO\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-pasos\r\n.cm-step-number-box {\r\n    width: 40px;\r\n    height: 40px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    border-radius: 6px;\r\n    background: var(--cm-text);\r\n    color: #ffffff;\r\n    font-size: 18px;\r\n    font-weight: 700;\r\n    margin-bottom: 24px;\r\n    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;\r\n}\r\n\r\n\r\n\/* Estilo espec\u00edfico para el paso 2 (Azul-Gris para mantener simetr\u00eda visual) *\/\r\n#cm-seccion-pasos\r\n.cm-step-card.cm-step-blue\r\n.cm-step-number-box {\r\n    background: var(--cm-blue-gray);\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    EFECTOS HOVER (GLOW \/ RESPLANDOR)\r\n    ========================================================== *\/\r\n\r\n\/* Tarjetas Doradas (Paso 1 y Paso 3) *\/\r\n#cm-seccion-pasos\r\n.cm-step-card:not(.cm-step-blue):hover {\r\n    transform: translateY(-4px);\r\n    border-color: rgba(168, 118, 0, 0.25);\r\n    box-shadow: 0 10px 25px rgba(168, 118, 0, 0.08), 0 4px 10px rgba(16, 24, 32, 0.03);\r\n}\r\n\r\n#cm-seccion-pasos\r\n.cm-step-card:not(.cm-step-blue):hover\r\n.cm-step-number-box {\r\n    background: var(--cm-gold);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 6px 14px rgba(168, 118, 0, 0.25);\r\n}\r\n\r\n\r\n\/* Tarjetas Azul-Gris (Paso 2) *\/\r\n#cm-seccion-pasos\r\n.cm-step-card.cm-step-blue:hover {\r\n    transform: translateY(-4px);\r\n    border-color: rgba(113, 137, 156, 0.3);\r\n    box-shadow: 0 10px 25px rgba(113, 137, 156, 0.1), 0 4px 10px rgba(16, 24, 32, 0.03);\r\n}\r\n\r\n#cm-seccion-pasos\r\n.cm-step-card.cm-step-blue:hover\r\n.cm-step-number-box {\r\n    background: var(--cm-text);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 6px 14px rgba(16, 24, 32, 0.2);\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    TEXTOS DE LA TARJETA\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-pasos\r\n.cm-step-title {\r\n    margin: 0 0 12px;\r\n    color: var(--cm-text);\r\n    font-family: Helvetica, Arial, sans-serif;\r\n    font-size: 20px;\r\n    font-weight: 700;\r\n    letter-spacing: -0.02em;\r\n    line-height: 1.25;\r\n}\r\n\r\n\r\n#cm-seccion-pasos\r\n.cm-step-desc {\r\n    margin: 0 0 auto;\r\n    color: var(--cm-text-gray);\r\n    font-size: 13.5px;\r\n    font-weight: 400;\r\n    line-height: 1.55;\r\n    text-align: justify;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    PIE DE TARJETA (DETALLE \/ TIEMPO)\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-pasos\r\n.cm-step-footer {\r\n    margin-top: 24px !important;\r\n    padding-top: 14px !important;\r\n    border-top: 1px solid rgba(20, 35, 48, 0.06);\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 7px;\r\n    color: var(--cm-text-gray);\r\n    font-size: 11.5px;\r\n    font-weight: 600;\r\n}\r\n\r\n\r\n#cm-seccion-pasos\r\n.cm-step-footer i {\r\n    color: var(--cm-gold);\r\n    font-size: 13px;\r\n}\r\n\r\n\r\n#cm-seccion-pasos\r\n.cm-step-card.cm-step-blue\r\n.cm-step-footer i {\r\n    color: var(--cm-blue-gray);\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    RESPONSIVE TABLET\r\n    ========================================================== *\/\r\n\r\n@media (max-width: 900px) {\r\n    #cm-seccion-pasos\r\n    .cm-steps-grid {\r\n        grid-template-columns: 1fr;\r\n        max-width: 500px;\r\n        gap: 16px;\r\n    }\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    RESPONSIVE M\u00d3VIL\r\n    ========================================================== *\/\r\n\r\n@media (max-width: 600px) {\r\n    #cm-seccion-pasos {\r\n        padding: 55px 15px 60px !important;\r\n    }\r\n\r\n    #cm-seccion-pasos\r\n    .cm-step-card {\r\n        padding: 24px 20px 20px !important;\r\n    }\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n<section id=\"cm-seccion-pasos\">\r\n\r\n    <!-- ENCABEZADO DE LA SECCI\u00d3N -->\r\n    <div class=\"cm-steps-header\">\r\n        <div class=\"cm-steps-eyebrow\">\r\n            Proceso \u00c1gil y Confiable\r\n        <\/div>\r\n\r\n        <h2 class=\"cm-steps-title\">\r\n            C\u00f3mo Obtener tu Credencial en 3 Pasos\r\n        <\/h2>\r\n\r\n        <p class=\"cm-steps-subtitle\">\r\n            Un tr\u00e1mite 100% en l\u00ednea dise\u00f1ado para certificar a los miembros con la debida formalidad y transparencia.\r\n        <\/p>\r\n    <\/div>\r\n\r\n\r\n    <!-- GRID DE 3 PASOS -->\r\n    <div class=\"cm-steps-grid\">\r\n\r\n        <!-- PASO 1 -->\r\n        <article class=\"cm-step-card\">\r\n            <div class=\"cm-step-number-box\">\r\n                1\r\n            <\/div>\r\n\r\n            <h3 class=\"cm-step-title\">Formulario Digital<\/h3>\r\n            <p class=\"cm-step-desc\">\r\n                Ingresa tus datos personales, fotograf\u00eda infantil de perfil sobrio y mezquita o comunidad a la que asistes habitualmente.\r\n            <\/p>\r\n\r\n            <div class=\"cm-step-footer\">\r\n                <i class=\"fa-regular fa-clock\"><\/i> Toma menos de 5 minutos\r\n            <\/div>\r\n        <\/article>\r\n\r\n\r\n        <!-- PASO 2 (Estilo intermedio azul-gris) -->\r\n        <article class=\"cm-step-card cm-step-blue\">\r\n            <div class=\"cm-step-number-box\">\r\n                2\r\n            <\/div>\r\n\r\n            <h3 class=\"cm-step-title\">Validaci\u00f3n Comunitaria<\/h3>\r\n            <p class=\"cm-step-desc\">\r\n                El comit\u00e9 directivo del Concilio Isl\u00e1mico Mexicano verifica la solicitud para resguardar la solemnidad y seguridad del padr\u00f3n oficial.\r\n            <\/p>\r\n\r\n            <div class=\"cm-step-footer\">\r\n                <i class=\"fa-solid fa-shield-halved\"><\/i> Revisi\u00f3n en 24 a 48 hrs\r\n            <\/div>\r\n        <\/article>\r\n\r\n\r\n        <!-- PASO 3 -->\r\n        <article class=\"cm-step-card\">\r\n            <div class=\"cm-step-number-box\">\r\n                3\r\n            <\/div>\r\n\r\n            <h3 class=\"cm-step-title\">Emisi\u00f3n & Entrega<\/h3>\r\n            <p class=\"cm-step-desc\">\r\n                Descarga de inmediato tu credencial virtual con c\u00f3digo QR criptogr\u00e1fico seguro y recibe tu tarjeta f\u00edsica en tu domicilio o centro comunitario local.\r\n            <\/p>\r\n\r\n            <div class=\"cm-step-footer\">\r\n                <i class=\"fa-solid fa-truck-fast\"><\/i> Env\u00edo a todo M\u00e9xico\r\n            <\/div>\r\n        <\/article>\r\n\r\n    <\/div>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-feed8d1 e-flex e-con-boxed e-con e-parent\" data-id=\"feed8d1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b59c5a2 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"b59c5a2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n\/* ==========================================================\r\n    LLAMADO A LA ACCI\u00d3N FINAL (DARK GLOW SECTION)\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-cta-final,\r\n#cm-seccion-cta-final * {\r\n    box-sizing: border-box !important;\r\n}\r\n\r\n\r\n#cm-seccion-cta-final {\r\n\r\n    --cm-gold: #c69214;\r\n    --cm-gold-hover: #b08111;\r\n\r\n    --cm-dark-bg: #1b252f;\r\n    --cm-text-light: #ffffff;\r\n    --cm-text-muted: #94a3b8;\r\n\r\n    \/* FULL BLEED *\/\r\n    width: 100vw;\r\n    margin-left: calc(50% - 50vw);\r\n    min-width: 100vw;\r\n\r\n    padding: 95px 24px 100px !important;\r\n    background-color: var(--cm-dark-bg);\r\n    font-family: Helvetica, Arial, sans-serif;\r\n    position: relative;\r\n    overflow: hidden;\r\n    text-align: center;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    EFECTO DE \"GLARE\" \/ RESPLANDOR IZQUIERDO EN EL FONDO\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-cta-final::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 20%;\r\n    left: -150px;\r\n    width: 500px;\r\n    height: 500px;\r\n    background: radial-gradient(\r\n        circle,\r\n        rgba(255, 255, 255, 0.055) 0%,\r\n        rgba(255, 255, 255, 0.015) 40%,\r\n        transparent 70%\r\n    );\r\n    pointer-events: none;\r\n    border-radius: 50%;\r\n    z-index: 1;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    CONTENEDOR INTERNO (PARA ASEGURAR QUE EST\u00c9 SOBRE EL GLARE)\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-cta-final\r\n.cm-cta-content-wrapper {\r\n    position: relative;\r\n    z-index: 2;\r\n    max-width: 750px;\r\n    margin: 0 auto;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    ICONO SUPERIOR ENMARCADO\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-cta-final\r\n.cm-cta-badge-icon {\r\n    width: 46px;\r\n    height: 46px;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    background: rgba(198, 146, 20, 0.12);\r\n    border: 1px solid rgba(198, 146, 20, 0.3);\r\n    border-radius: 8px;\r\n    color: var(--cm-gold);\r\n    font-size: 18px;\r\n    margin-bottom: 24px;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    T\u00cdTULOS Y DESCRIPCI\u00d3N\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-cta-final\r\n.cm-cta-main-title {\r\n    margin: 0 0 16px;\r\n    color: var(--cm-text-light);\r\n    font-family: Helvetica, Arial, sans-serif;\r\n    font-size: clamp(30px, 3.5vw, 42px);\r\n    font-weight: 400;\r\n    letter-spacing: -0.03em;\r\n    line-height: 1.2;\r\n}\r\n\r\n\r\n#cm-seccion-cta-final\r\n.cm-cta-main-desc {\r\n    margin: 0 0 36px;\r\n    color: var(--cm-text-muted);\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 1.6;\r\n    max-width: 620px;\r\n    text-align: justify;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    BOT\u00d3N PRINCIPAL DORADO\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-cta-final\r\n.cm-cta-main-button {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 12px;\r\n    padding: 16px 32px !important;\r\n    background: var(--cm-gold);\r\n    color: #ffffff;\r\n    font-size: 12.5px;\r\n    font-weight: 700;\r\n    letter-spacing: 0.08em;\r\n    text-transform: uppercase;\r\n    text-decoration: none;\r\n    border-radius: 6px;\r\n    box-shadow: 0 6px 20px rgba(198, 146, 20, 0.25);\r\n    transition: background 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;\r\n    margin-bottom: 20px;\r\n}\r\n\r\n\r\n#cm-seccion-cta-final\r\n.cm-cta-main-button:hover {\r\n    background: var(--cm-gold-hover);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 8px 25px rgba(198, 146, 20, 0.35);\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    PIE DE SEGURIDAD\r\n    ========================================================== *\/\r\n\r\n#cm-seccion-cta-final\r\n.cm-cta-security-note {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 7px;\r\n    color: #64748b;\r\n    font-size: 12px;\r\n    font-weight: 500;\r\n}\r\n\r\n\r\n#cm-seccion-cta-final\r\n.cm-cta-security-note i {\r\n    color: var(--cm-gold);\r\n    font-size: 11px;\r\n}\r\n\r\n\r\n\/* ==========================================================\r\n    RESPONSIVE M\u00d3VIL\r\n    ========================================================== *\/\r\n\r\n@media (max-width: 600px) {\r\n    #cm-seccion-cta-final {\r\n        padding: 70px 18px 75px !important;\r\n    }\r\n\r\n    #cm-seccion-cta-final\r\n    .cm-cta-main-desc {\r\n        font-size: 14px;\r\n        margin-bottom: 28px;\r\n    }\r\n\r\n    #cm-seccion-cta-final\r\n    .cm-cta-main-button {\r\n        width: 100%;\r\n        padding: 15px 20px !important;\r\n    }\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n<section id=\"cm-seccion-cta-final\">\r\n\r\n    <div class=\"cm-cta-content-wrapper\">\r\n\r\n        <!-- ICONO SUPERIOR -->\r\n        <div class=\"cm-cta-badge-icon\">\r\n            <i class=\"fa-solid fa-award\"><\/i>\r\n        <\/div>\r\n\r\n        <!-- T\u00cdTULO PRINCIPAL -->\r\n        <h2 class=\"cm-cta-main-title\">\r\n            \u00bfListo para formar parte activa de nuestra comunidad?\r\n        <\/h2>\r\n\r\n        <!-- DESCRIPCI\u00d3N -->\r\n        <p class=\"cm-cta-main-desc\">\r\n            \u00danete a cientos de hermanas y hermanos en todo el territorio mexicano. Accede a tu respaldo formal, descuentos preferenciales y fortalece los lazos de hermandad del Concilio.\r\n        <\/p>\r\n\r\n        <!-- BOT\u00d3N DE ACCI\u00d3N -->\r\n        <a href=\"https:\/\/docs.google.com\/forms\/d\/e\/1FAIpQLSckinbDXZSMiXRJTh56Burk4VC31y3W0_TDQwg8FYVF-GPF0w\/viewform\" class=\"cm-cta-main-button\">\r\n            <i class=\"fa-solid fa-user-plus\"><\/i> \u00a1Reg\u00edstrate aqu\u00ed! Haz clic aqu\u00ed <i class=\"fa-solid fa-arrow-right\"><\/i>\r\n        <\/a>\r\n\r\n        <!-- NOTA DE SEGURIDAD -->\r\n        <div class=\"cm-cta-security-note\">\r\n            <i class=\"fa-solid fa-lock\"><\/i> Tr\u00e1mite 100% digital, seguro y confidencial\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Credencial Oficial de la Comunidad Musulmana en M\u00e9xico Tu llave de identidad, hermandad y beneficios exclusivos en toda la Rep\u00fablica Mexicana. Un documento avalado con validez representativa y convenios activos a nivel nacional. \u00a1REG\u00cdSTRATE YA! CONOCE LOS COMERCIOS ALIADOS VALOR INTEGRAL Beneficios Exclusivos para Miembros Dise\u00f1ada para acompa\u00f1arte en tu vida cotidiana, formaci\u00f3n espiritual, vinculaci\u00f3n [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_joinchat":[],"footnotes":""},"class_list":["post-683","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/wp-json\/wp\/v2\/pages\/683","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/wp-json\/wp\/v2\/comments?post=683"}],"version-history":[{"count":107,"href":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/wp-json\/wp\/v2\/pages\/683\/revisions"}],"predecessor-version":[{"id":1189,"href":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/wp-json\/wp\/v2\/pages\/683\/revisions\/1189"}],"wp:attachment":[{"href":"https:\/\/beautiful-hoover.193-203-169-147.plesk.page\/index.php\/wp-json\/wp\/v2\/media?parent=683"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}