{"id":28058,"date":"2025-08-22T11:02:11","date_gmt":"2025-08-22T16:02:11","guid":{"rendered":"https:\/\/eliteforgecompany.com\/?page_id=28058"},"modified":"2025-08-30T16:25:38","modified_gmt":"2025-08-30T21:25:38","slug":"branding","status":"publish","type":"page","link":"https:\/\/eliteforgecompany.com\/en\/branding\/","title":{"rendered":"Branding"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t
\n\t\t\t
<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Branding<\/h1>

\u00a1\u00danete a nosotros y genera una identidad para tu marca!<\/p><\/div><\/div>\t\t\t\t<\/div>\n\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

\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Branding Showcase - Secci\u00f3n Promocional<\/title>\r\n <style>\r\n \/* ========================================\r\n CUSTOM PROPERTIES - SISTEMA DE COLORES AZUL OSCURO + BLANCO S\u00d3LIDO\r\n ======================================== *\/\r\n :root {\r\n \/* Gama de azules oscuros *\/\r\n --brand-primary: #0C1C48;\r\n --brand-secondary: #1765AF;\r\n --brand-tertiary: #0b3661;\r\n --brand-accent: #2B4C8C;\r\n \r\n \/* Blancos s\u00f3lidos - TODOS completamente blancos *\/\r\n --white-solid: #FFFFFF;\r\n --white-bright: #FFFFFF;\r\n --white-translucent: rgba(255, 255, 255, 0.15);\r\n --white-glow: rgba(255, 255, 255, 0.35);\r\n \r\n \/* Efectos sin fondo *\/\r\n --border-glow: 1px solid rgba(255, 255, 255, 0.2);\r\n --border-bright: 2px solid rgba(255, 255, 255, 0.3);\r\n --text-glow: 0 0 20px rgba(255, 255, 255, 0.3);\r\n --box-glow: 0 0 40px rgba(12, 28, 72, 0.3);\r\n \r\n \/* Layout variables *\/\r\n --section-padding: min(8vw, 120px);\r\n --content-max-width: 1400px;\r\n --border-radius: 24px;\r\n --transition-smooth: cubic-bezier(0.4, 0.0, 0.2, 1);\r\n --transition-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);\r\n }\r\n\r\n \/* ========================================\r\n RESET Y CONFIGURACI\u00d3N BASE - FONDO TRANSPARENTE\r\n ======================================== *\/\r\n .branding-section {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n position: relative;\r\n width: 100%;\r\n min-height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n overflow: hidden;\r\n \/* SIN FONDO - COMPLETAMENTE TRANSPARENTE *\/\r\n }\r\n\r\n .branding-section *,\r\n .branding-section *::before,\r\n .branding-section *::after {\r\n box-sizing: border-box;\r\n }\r\n\r\n \/* ========================================\r\n CONTENEDOR PRINCIPAL - SIN FONDO\r\n ======================================== *\/\r\n .branding-container {\r\n width: 100%;\r\n max-width: var(--content-max-width);\r\n margin: 0 auto;\r\n padding: var(--section-padding) 20px;\r\n position: relative;\r\n z-index: 10;\r\n }\r\n\r\n .branding-showcase {\r\n \/* SIN BACKGROUND NI BACKDROP-FILTER *\/\r\n border: var(--border-glow);\r\n border-radius: var(--border-radius);\r\n box-shadow: var(--box-glow);\r\n padding: 60px 40px;\r\n position: relative;\r\n overflow: visible;\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 80px;\r\n align-items: center;\r\n min-height: 70vh;\r\n opacity: 0;\r\n transform: translateY(60px);\r\n transition: all 1.2s var(--transition-smooth);\r\n }\r\n\r\n .branding-showcase.visible {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n \/* Efectos de brillo sin fondo *\/\r\n .branding-showcase::before {\r\n content: '';\r\n position: absolute;\r\n top: -2px;\r\n left: -2px;\r\n right: -2px;\r\n bottom: -2px;\r\n border-radius: var(--border-radius);\r\n background: linear-gradient(45deg, var(--brand-primary), transparent, var(--brand-secondary), transparent);\r\n opacity: 0.3;\r\n z-index: -1;\r\n animation: borderGlow 4s ease-in-out infinite alternate;\r\n }\r\n\r\n @keyframes borderGlow {\r\n 0% { opacity: 0.2; }\r\n 100% { opacity: 0.4; }\r\n }\r\n\r\n \/* ========================================\r\n SECCI\u00d3N DE CONTENIDO\r\n ======================================== *\/\r\n .content-section {\r\n position: relative;\r\n z-index: 40;\r\n animation: slideInLeft 1s var(--transition-smooth) 0.3s both;\r\n }\r\n\r\n .content-header {\r\n margin-bottom: 32px;\r\n }\r\n\r\n .section-badge {\r\n display: inline-block !important;\r\n padding: 8px 20px !important;\r\n background: var(--brand-primary) !important;\r\n color: #FFFFFF !important;\r\n font-size: 14px !important;\r\n font-weight: 600 !important;\r\n text-transform: uppercase !important;\r\n letter-spacing: 1px !important;\r\n border-radius: 50px !important;\r\n margin-bottom: 24px !important;\r\n border: var(--border-glow) !important;\r\n box-shadow: var(--text-glow) !important;\r\n transition: all 0.3s var(--transition-smooth) !important;\r\n }\r\n\r\n .section-badge:hover {\r\n transform: translateY(-2px);\r\n background: var(--brand-secondary);\r\n box-shadow: 0 8px 32px rgba(12, 28, 72, 0.4);\r\n }\r\n\r\n .main-title {\r\n font-size: clamp(2.5rem, 5vw, 4rem) !important;\r\n font-weight: 800 !important;\r\n line-height: 1.1 !important;\r\n margin-bottom: 20px !important;\r\n color: #FFFFFF !important;\r\n text-shadow: var(--text-glow) !important;\r\n position: relative !important;\r\n }\r\n\r\n .main-subtitle {\r\n font-size: 1.25rem !important;\r\n color: #FFFFFF !important;\r\n line-height: 1.6 !important;\r\n margin-bottom: 40px !important;\r\n font-weight: 300 !important;\r\n }\r\n\r\n \/* \u00c1rea de descripci\u00f3n del servicio (m\u00e1ximo 150 palabras) *\/\r\n .service-description {\r\n border: var(--border-glow);\r\n border-left: 4px solid var(--brand-primary);\r\n border-radius: 0 12px 12px 0;\r\n padding: 24px 28px;\r\n margin-bottom: 40px;\r\n position: relative;\r\n font-size: 1rem;\r\n line-height: 1.7;\r\n color: var(--white-solid);\r\n max-width: 500px;\r\n \/* SIN BACKGROUND *\/\r\n }\r\n\r\n .service-description::before {\r\n content: '\"';\r\n font-size: 4rem;\r\n color: var(--brand-primary);\r\n position: absolute;\r\n top: -10px;\r\n left: 12px;\r\n opacity: 0.6;\r\n font-family: serif;\r\n text-shadow: var(--text-glow);\r\n }\r\n\r\n \/* CTA Button *\/\r\n .cta-button {\r\n display: inline-flex !important;\r\n align-items: center !important;\r\n gap: 12px !important;\r\n padding: 18px 36px !important;\r\n background: var(--brand-primary) !important;\r\n color: #FFFFFF !important;\r\n text-decoration: none !important;\r\n border-radius: 12px !important;\r\n font-weight: 600 !important;\r\n font-size: 1.1rem !important;\r\n text-transform: uppercase !important;\r\n letter-spacing: 0.5px !important;\r\n position: relative !important;\r\n overflow: hidden !important;\r\n border: var(--border-glow) !important;\r\n cursor: pointer !important;\r\n transition: all 0.4s var(--transition-smooth) !important;\r\n box-shadow: 0 8px 32px rgba(12, 28, 72, 0.3) !important;\r\n }\r\n\r\n .cta-button::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: -100%;\r\n width: 100%;\r\n height: 100%;\r\n background: linear-gradient(90deg, transparent, var(--white-translucent), transparent);\r\n transition: left 0.6s ease;\r\n }\r\n\r\n .cta-button:hover {\r\n transform: translateY(-4px) scale(1.02) !important;\r\n background: var(--brand-secondary) !important;\r\n box-shadow: 0 16px 48px rgba(12, 28, 72, 0.4) !important;\r\n color: #FFFFFF !important;\r\n }\r\n\r\n .cta-button:hover::before {\r\n left: 100%;\r\n }\r\n\r\n .cta-button:active {\r\n transform: translateY(-2px) scale(1.01);\r\n }\r\n\r\n \/* ========================================\r\n SECCI\u00d3N DE MOCKUP CON LOGO REAL ELITE FORGE\r\n ======================================== *\/\r\n .mockup-section {\r\n position: relative;\r\n height: 600px;\r\n animation: slideInRight 1s var(--transition-smooth) 0.5s both;\r\n }\r\n\r\n \/* Dispositivo principal con logo Elite Forge real *\/\r\n .main-device {\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n transform: translate(-50%, -50%) rotateY(-5deg) rotateX(5deg);\r\n width: 320px;\r\n height: 480px;\r\n background: linear-gradient(145deg, var(--brand-tertiary), var(--brand-primary));\r\n border-radius: 32px;\r\n border: var(--border-bright);\r\n box-shadow: 0 30px 80px rgba(12, 28, 72, 0.4);\r\n z-index: 30;\r\n transition: all 0.6s var(--transition-smooth);\r\n overflow: hidden;\r\n }\r\n\r\n .main-device::before {\r\n content: '';\r\n position: absolute;\r\n top: 12px;\r\n left: 12px;\r\n right: 12px;\r\n bottom: 12px;\r\n background: radial-gradient(circle at center, var(--brand-secondary) 0%, var(--brand-primary) 100%);\r\n border-radius: 20px;\r\n border: 1px solid var(--white-translucent);\r\n }\r\n\r\n \/* Logo Elite Forge en el dispositivo *\/\r\n .main-device::after {\r\n content: '';\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n transform: translate(-50%, -50%);\r\n width: 80px;\r\n height: 80px;\r\n background: var(--white-solid);\r\n border-radius: 50%;\r\n background-image: url('data:image\/svg+xml;utf8,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 100 100\"><circle cx=\"50\" cy=\"50\" r=\"45\" fill=\"%230C1C48\" stroke=\"%23FFFFFF\" stroke-width=\"2\"\/><text x=\"50\" y=\"60\" text-anchor=\"middle\" font-family=\"Arial,sans-serif\" font-size=\"24\" font-weight=\"bold\" fill=\"%23FFFFFF\">EF<\/text><\/svg>');\r\n background-size: cover;\r\n box-shadow: 0 8px 24px rgba(255, 255, 255, 0.2);\r\n }\r\n\r\n .main-device:hover {\r\n transform: translate(-50%, -50%) rotateY(0deg) rotateX(0deg) scale(1.05);\r\n box-shadow: 0 40px 100px rgba(12, 28, 72, 0.5);\r\n }\r\n\r\n \/* Elementos flotantes con branding *\/\r\n .floating-element {\r\n position: absolute;\r\n border: var(--border-glow);\r\n border-radius: 16px;\r\n box-shadow: 0 8px 32px rgba(12, 28, 72, 0.2);\r\n transition: all 0.6s var(--transition-bounce);\r\n cursor: pointer;\r\n \/* SIN BACKGROUND *\/\r\n }\r\n\r\n .floating-element:hover {\r\n transform: translateY(-8px) rotateZ(2deg) scale(1.05);\r\n box-shadow: 0 16px 48px rgba(12, 28, 72, 0.3);\r\n border-color: var(--white-glow);\r\n }\r\n\r\n \/* Tarjeta de presentaci\u00f3n *\/\r\n .business-card {\r\n width: 180px !important;\r\n height: 110px !important;\r\n top: 20% !important;\r\n right: 10% !important;\r\n background: var(--brand-primary) !important;\r\n display: flex !important;\r\n align-items: center !important;\r\n justify-content: center !important;\r\n color: #FFFFFF !important;\r\n font-weight: 700 !important;\r\n font-size: 0.9rem !important;\r\n text-align: center !important;\r\n animation: float 6s ease-in-out infinite !important;\r\n }\r\n\r\n .business-card::before {\r\n content: 'ELITE FORGE\\ABUSINESS CARD' !important;\r\n white-space: pre-line !important;\r\n opacity: 0.9 !important;\r\n color: #FFFFFF !important;\r\n }\r\n\r\n \/* Logo sheet *\/\r\n .logo-sheet {\r\n width: 140px;\r\n height: 100px;\r\n top: 70%;\r\n right: 20%;\r\n background: var(--white-translucent);\r\n border: 2px solid var(--brand-primary);\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 8px;\r\n padding: 16px;\r\n animation: float 6s ease-in-out infinite 2s;\r\n }\r\n\r\n .logo-sheet::before,\r\n .logo-sheet::after {\r\n content: '';\r\n background: var(--brand-secondary);\r\n border-radius: 8px;\r\n opacity: 0.8;\r\n border: 1px solid var(--white-translucent);\r\n }\r\n\r\n \/* Letterhead *\/\r\n .letterhead {\r\n width: 120px;\r\n height: 160px;\r\n top: 15%;\r\n left: 5%;\r\n background: var(--white-translucent);\r\n border: 2px solid var(--brand-tertiary);\r\n display: flex;\r\n flex-direction: column;\r\n padding: 20px 16px;\r\n gap: 8px;\r\n animation: float 6s ease-in-out infinite 4s;\r\n }\r\n\r\n .letterhead::before {\r\n content: '';\r\n width: 100%;\r\n height: 20px;\r\n background: var(--brand-primary);\r\n border-radius: 4px;\r\n opacity: 0.9;\r\n }\r\n\r\n .letterhead::after {\r\n content: '' !important;\r\n width: 70% !important;\r\n height: 12px !important;\r\n background: #FFFFFF !important;\r\n border-radius: 2px !important;\r\n margin-top: 8px !important;\r\n }\r\n\r\n \/* Packaging mockup *\/\r\n .package-mockup {\r\n width: 100px !important;\r\n height: 120px !important;\r\n bottom: 10% !important;\r\n left: 15% !important;\r\n background: var(--brand-secondary) !important;\r\n border: 2px solid var(--white-translucent) !important;\r\n display: flex !important;\r\n align-items: center !important;\r\n justify-content: center !important;\r\n color: #FFFFFF !important;\r\n font-size: 2rem !important;\r\n animation: float 6s ease-in-out infinite 1s !important;\r\n }\r\n\r\n .package-mockup::before {\r\n content: '\ud83d\udce6';\r\n filter: brightness(1.2);\r\n }\r\n\r\n \/* Animaciones flotantes *\/\r\n @keyframes float {\r\n 0%, 100% { transform: translateY(0px) rotateZ(0deg); }\r\n 50% { transform: translateY(-15px) rotateZ(1deg); }\r\n }\r\n\r\n \/* ========================================\r\n SECCI\u00d3N DE ENTREGABLE - OCULTA INICIALMENTE\r\n ======================================== *\/\r\n .deliverable-section {\r\n width: 100%;\r\n min-height: 100vh;\r\n padding: var(--section-padding) 20px;\r\n display: none; \/* OCULTA INICIALMENTE *\/\r\n align-items: center;\r\n justify-content: center;\r\n opacity: 0;\r\n transform: translateY(40px);\r\n transition: all 0.8s var(--transition-smooth);\r\n \/* SIN FONDO *\/\r\n }\r\n\r\n .deliverable-section.visible {\r\n display: flex;\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n .brand-kit-showcase {\r\n max-width: var(--content-max-width);\r\n width: 100%;\r\n border: var(--border-glow);\r\n border-radius: var(--border-radius);\r\n padding: 60px 40px;\r\n position: relative;\r\n box-shadow: var(--box-glow);\r\n \/* SIN BACKGROUND *\/\r\n }\r\n\r\n .kit-header {\r\n text-align: center;\r\n margin-bottom: 60px;\r\n }\r\n\r\n .kit-title {\r\n font-size: clamp(2rem, 4vw, 3.5rem) !important;\r\n font-weight: 800 !important;\r\n color: #FFFFFF !important;\r\n text-shadow: 0 0 20px rgba(255, 255, 255, 0.8), 0 4px 12px rgba(0, 0, 0, 0.9) !important;\r\n margin-bottom: 16px !important;\r\n }\r\n\r\n .kit-subtitle {\r\n font-size: 1.2rem !important;\r\n color: #FFFFFF !important;\r\n font-weight: 300 !important;\r\n max-width: 600px !important;\r\n margin: 0 auto !important;\r\n text-shadow: 0 0 10px rgba(255, 255, 255, 0.5), 0 2px 6px rgba(0, 0, 0, 0.8) !important;\r\n }\r\n\r\n \/* Grid del brand kit - LAYOUT 2x2 *\/\r\n .brand-kit-grid {\r\n display: grid !important;\r\n grid-template-columns: repeat(2, 1fr) !important;\r\n grid-template-rows: repeat(2, 1fr) !important;\r\n gap: 30px !important;\r\n margin-bottom: 40px !important;\r\n align-items: stretch !important;\r\n min-height: 600px !important;\r\n }\r\n\r\n .kit-item {\r\n border: var(--border-glow);\r\n border-radius: 16px;\r\n padding: 25px;\r\n transition: all 0.4s var(--transition-smooth);\r\n \/* SIN BACKGROUND *\/\r\n position: relative;\r\n min-height: 300px;\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n\r\n .kit-item:hover {\r\n transform: translateY(-5px);\r\n border-color: var(--white-glow);\r\n box-shadow: 0 12px 40px rgba(12, 28, 72, 0.3);\r\n }\r\n\r\n .kit-item-title {\r\n font-size: 1.3rem;\r\n font-weight: 700;\r\n color: #FFFFFF !important;\r\n margin-bottom: 20px;\r\n text-shadow: var(--text-glow) !important;\r\n }\r\n\r\n \/* LOGOS REALES ELITE FORGE EN VARIACIONES *\/\r\n .logo-variations {\r\n display: grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 15px;\r\n margin-bottom: 20px;\r\n flex-grow: 1;\r\n }\r\n\r\n .logo-item {\r\n aspect-ratio: 1;\r\n border: 1px solid var(--white-translucent);\r\n border-radius: 12px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n background: var(--white-translucent);\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n \/* Logos reales Elite Forge seg\u00fan im\u00e1genes cargadas *\/\r\n .logo-item:nth-child(1)::before {\r\n content: '';\r\n width: 70px !important;\r\n height: 70px !important;\r\n background: #FFFFFF !important;\r\n border-radius: 50% !important;\r\n border: 2px solid var(--brand-primary) !important;\r\n position: relative !important;\r\n background-image: url('data:image\/svg+xml;utf8,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 100 100\"><circle cx=\"50\" cy=\"50\" r=\"48\" fill=\"%23FFFFFF\" stroke=\"%230C1C48\" stroke-width=\"2\"\/><text x=\"50\" y=\"65\" text-anchor=\"middle\" font-family=\"Arial,sans-serif\" font-size=\"32\" font-weight=\"bold\" fill=\"%230C1C48\">EF<\/text><\/svg>') !important;\r\n background-size: cover !important;\r\n }\r\n\r\n .logo-item:nth-child(2)::before {\r\n content: 'ELITE FORGE' !important;\r\n color: var(--brand-primary) !important;\r\n font-weight: 800 !important;\r\n font-size: 0.8rem !important;\r\n text-align: center !important;\r\n line-height: 1.2 !important;\r\n display: flex !important;\r\n align-items: center !important;\r\n justify-content: center !important;\r\n width: 100% !important;\r\n height: 100% !important;\r\n }\r\n\r\n .logo-item:nth-child(3)::before {\r\n content: '' !important;\r\n width: 70px !important;\r\n height: 70px !important;\r\n background: var(--brand-primary) !important;\r\n border-radius: 50% !important;\r\n border: 2px solid var(--brand-primary) !important;\r\n background-image: url('data:image\/svg+xml;utf8,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 100 100\"><circle cx=\"50\" cy=\"50\" r=\"48\" fill=\"%230C1C48\" stroke=\"%230C1C48\" stroke-width=\"2\"\/><text x=\"50\" y=\"65\" text-anchor=\"middle\" font-family=\"Arial,sans-serif\" font-size=\"32\" font-weight=\"bold\" fill=\"%23FFFFFF\">EF<\/text><\/svg>') !important;\r\n background-size: cover !important;\r\n }\r\n\r\n \/* Paleta de colores *\/\r\n .color-palette {\r\n display: flex;\r\n gap: 12px;\r\n margin-bottom: 20px;\r\n justify-content: center;\r\n }\r\n\r\n .color-swatch {\r\n width: 45px;\r\n height: 45px;\r\n border-radius: 8px;\r\n border: 2px solid var(--white-translucent);\r\n position: relative;\r\n }\r\n\r\n .color-primary { background: #2B4A7F; }\r\n .color-secondary { background: #1A5F8B; }\r\n .color-accent { background: #3D6FA1; }\r\n .color-neutral { background: #F8FAFC; }\r\n\r\n .color-code {\r\n position: absolute !important;\r\n bottom: -22px !important;\r\n left: 50% !important;\r\n transform: translateX(-50%) !important;\r\n font-size: 0.65rem !important;\r\n color: #FFFFFF !important;\r\n font-weight: 500 !important;\r\n white-space: nowrap !important;\r\n }\r\n\r\n \/* Tipograf\u00edas *\/\r\n .typography-sample {\r\n margin-bottom: 15px;\r\n }\r\n\r\n .font-primary {\r\n font-family: 'Arial Black', sans-serif;\r\n font-size: 1.6rem;\r\n font-weight: 800;\r\n color: var(--white-solid);\r\n margin-bottom: 8px;\r\n }\r\n\r\n .font-secondary {\r\n font-family: 'Helvetica Neue', sans-serif;\r\n font-size: 0.9rem;\r\n font-weight: 400;\r\n color: var(--white-solid);\r\n }\r\n\r\n \/* Especificaciones t\u00e9cnicas *\/\r\n .specs-list {\r\n list-style: none !important;\r\n padding: 0 !important;\r\n flex-grow: 1 !important;\r\n }\r\n\r\n .specs-list li {\r\n padding: 6px 0 !important;\r\n border-bottom: 1px solid var(--white-translucent) !important;\r\n color: #FFFFFF !important;\r\n font-size: 0.85rem !important;\r\n display: flex !important;\r\n justify-content: space-between !important;\r\n align-items: center !important;\r\n }\r\n\r\n .specs-list li:last-child {\r\n border-bottom: none !important;\r\n }\r\n\r\n .specs-label {\r\n font-weight: 600 !important;\r\n color: #FFFFFF !important;\r\n }\r\n\r\n \/* Disclaimer *\/\r\n .customization-note {\r\n text-align: center;\r\n padding: 25px;\r\n border: 2px dashed var(--brand-primary);\r\n border-radius: 16px;\r\n color: var(--white-solid);\r\n font-style: italic;\r\n \/* SIN BACKGROUND *\/\r\n }\r\n\r\n .customization-note strong {\r\n color: var(--white-solid);\r\n font-size: 1.1rem;\r\n }\r\n\r\n \/* ========================================\r\n ANIMACIONES DE ENTRADA\r\n ======================================== *\/\r\n @keyframes slideInLeft {\r\n from {\r\n opacity: 0;\r\n transform: translateX(-60px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateX(0);\r\n }\r\n }\r\n\r\n @keyframes slideInRight {\r\n from {\r\n opacity: 0;\r\n transform: translateX(60px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateX(0);\r\n }\r\n }\r\n\r\n \/* ========================================\r\n RESPONSIVE DESIGN - SIN ESPACIOS VAC\u00cdOS\r\n ======================================== *\/\r\n @media (max-width: 1024px) {\r\n .branding-showcase {\r\n grid-template-columns: 1fr;\r\n gap: 60px;\r\n padding: 40px 30px;\r\n text-align: center;\r\n }\r\n\r\n .mockup-section {\r\n height: 500px;\r\n order: -1;\r\n }\r\n\r\n .main-device {\r\n width: 280px;\r\n height: 420px;\r\n }\r\n\r\n .floating-element {\r\n transform: scale(0.8);\r\n }\r\n\r\n .brand-kit-grid {\r\n grid-template-columns: repeat(2, 1fr) !important;\r\n grid-template-rows: repeat(2, 1fr) !important;\r\n gap: 25px !important;\r\n min-height: 500px !important;\r\n }\r\n\r\n .kit-item {\r\n min-height: 280px;\r\n padding: 20px;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .branding-container,\r\n .brand-kit-showcase {\r\n padding: 40px 16px;\r\n }\r\n\r\n .branding-showcase {\r\n grid-template-columns: 1fr;\r\n padding: 40px 30px;\r\n gap: 60px;\r\n min-height: center;\r\n }\r\n \r\n .content-section {\r\n margin-top: 40px;\r\n }\r\n\r\n .main-title,\r\n .kit-title {\r\n font-size: 2.5rem;\r\n }\r\n\r\n .main-subtitle,\r\n .kit-subtitle {\r\n font-size: 1.1rem;\r\n }\r\n\r\n .service-description {\r\n font-size: 0.95rem;\r\n padding: 20px 24px;\r\n max-width: 100%;\r\n }\r\n\r\n .mockup-section {\r\n height: 300px;\r\n order: -1;\r\n }\r\n\r\n .main-device {\r\n width: 240px;\r\n height: 360px;\r\n transform: translate(-50%, -40%) rotateY(-5deg) rotateX(5deg);\r\n }\r\n\r\n .floating-element {\r\n transform: scale(0.7);\r\n }\r\n\r\n .business-card,\r\n .letterhead {\r\n display: none;\r\n }\r\n\r\n .brand-kit-grid {\r\n grid-template-columns: 1fr !important;\r\n grid-template-rows: auto !important;\r\n gap: 20px !important;\r\n min-height: auto !important;\r\n }\r\n\r\n .kit-item {\r\n min-height: 250px;\r\n padding: 18px;\r\n }\r\n\r\n .logo-variations {\r\n grid-template-columns: 1fr 1fr;\r\n gap: 12px;\r\n }\r\n\r\n .color-palette {\r\n justify-content: center;\r\n gap: 10px;\r\n }\r\n\r\n .color-swatch {\r\n width: 40px;\r\n height: 40px;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .main-title,\r\n .kit-title {\r\n font-size: 2rem;\r\n }\r\n\r\n .cta-button {\r\n padding: 16px 28px;\r\n font-size: 1rem;\r\n width: 100%;\r\n justify-content: center;\r\n }\r\n\r\n .mockup-section {\r\n height: 220px;\r\n order: -1;\r\n }\r\n\r\n .main-device {\r\n width: 200px;\r\n height: 300px;\r\n transform: translate(-50%, -35%) rotateY(-5deg) rotateX(5deg);\r\n }\r\n\r\n .floating-element {\r\n transform: scale(0.6);\r\n }\r\n\r\n .brand-kit-grid {\r\n grid-template-columns: 1fr !important;\r\n grid-template-rows: auto !important;\r\n gap: 15px !important;\r\n min-height: auto !important;\r\n }\r\n\r\n .logo-variations {\r\n grid-template-columns: 1fr !important;\r\n gap: 10px !important;\r\n }\r\n\r\n .kit-item {\r\n min-height: 220px;\r\n padding: 15px;\r\n }\r\n\r\n .kit-item-title {\r\n font-size: 1.1rem !important;\r\n padding: 6px 10px !important;\r\n }\r\n\r\n .font-primary {\r\n font-size: 1.3rem;\r\n }\r\n\r\n .specs-list li {\r\n font-size: 0.8rem;\r\n padding: 5px 0;\r\n }\r\n }\r\n\r\n \/* ========================================\r\n OPTIMIZACIONES DE PERFORMANCE\r\n ======================================== *\/\r\n .branding-section {\r\n will-change: transform;\r\n transform: translateZ(0);\r\n }\r\n\r\n .floating-element,\r\n .main-device,\r\n .cta-button {\r\n will-change: transform, box-shadow;\r\n transform: translateZ(0);\r\n }\r\n\r\n \/* ========================================\r\n PREFERS-REDUCED-MOTION\r\n ======================================== *\/\r\n @media (prefers-reduced-motion: reduce) {\r\n .floating-element {\r\n animation: none;\r\n }\r\n \r\n .branding-showcase,\r\n .deliverable-section {\r\n transition-duration: 0.3s;\r\n }\r\n \r\n .floating-element:hover,\r\n .main-device:hover {\r\n transform: scale(1.02);\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <!-- SECCI\u00d3N 1: PROMOCIONAL -->\r\n <section class=\"branding-section\" id=\"brandingSection\">\r\n <div class=\"branding-container\">\r\n <div class=\"branding-showcase\" id=\"brandingShowcase\">\r\n \r\n <!-- SECCI\u00d3N DE CONTENIDO -->\r\n <div class=\"content-section\">\r\n <div class=\"content-header\">\r\n <span class=\"section-badge\">Branding Profesional<\/span>\r\n <h2 class=\"main-title\">Transforma Tu Marca<\/h2>\r\n <p class=\"main-subtitle\">Creamos identidades visuales que conectan, comunican y convierten<\/p>\r\n <\/div>\r\n\r\n <!-- \u00c1REA DE DESCRIPCI\u00d3N DEL SERVICIO (MAX 150 PALABRAS) -->\r\n <div class=\"service-description\">\r\n <p>Desarrollamos sistemas de identidad visual completos que reflejan la esencia \u00fanica de tu marca. Desde el dise\u00f1o de logo hasta aplicaciones digitales y f\u00edsicas, cada elemento est\u00e1 cuidadosamente crafteado para generar impacto y reconocimiento. Nuestro proceso colaborativo garantiza que tu marca no solo se vea profesional, sino que tambi\u00e9n comunique tus valores y conecte emocionalmente con tu audiencia objetivo, diferenci\u00e1ndote en un mercado competitivo.<\/p>\r\n <\/div>\r\n\r\n <!-- CALL TO ACTION -->\r\n <button class=\"cta-button\" id=\"ctaButton\">\r\n <span>Ver Ejemplo Completo<\/span>\r\n <span>\u2192<\/span>\r\n <\/button>\r\n <\/div>\r\n\r\n <!-- SECCI\u00d3N DE MOCKUP -->\r\n <div class=\"mockup-section\">\r\n \r\n <!-- DISPOSITIVO PRINCIPAL CON LOGO ELITE FORGE REAL -->\r\n <div class=\"main-device\" id=\"mainDevice\"><\/div>\r\n\r\n <!-- ELEMENTOS FLOTANTES DE BRANDING -->\r\n <div class=\"floating-element business-card\" id=\"businessCard\"><\/div>\r\n \r\n <div class=\"floating-element logo-sheet\" id=\"logoSheet\"><\/div>\r\n \r\n <div class=\"floating-element letterhead\" id=\"letterhead\"><\/div>\r\n \r\n <div class=\"floating-element package-mockup\" id=\"packageMockup\"><\/div>\r\n \r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- SECCI\u00d3N 2: ENTREGABLE - OCULTA INICIALMENTE, APARECE AL HACER CLICK -->\r\n <section class=\"deliverable-section\" id=\"deliverable\">\r\n <div class=\"brand-kit-showcase\" id=\"brandKitShowcase\">\r\n \r\n <div class=\"kit-header\">\r\n <h2 class=\"kit-title\">Brand Kit Completo<\/h2>\r\n <p class=\"kit-subtitle\">Ejemplo de entregable profesional con especificaciones detalladas para implementaci\u00f3n<\/p>\r\n <\/div>\r\n\r\n <div class=\"brand-kit-grid\">\r\n \r\n <!-- VARIACIONES DEL LOGO CON LOGOS REALES ELITE FORGE -->\r\n <div class=\"kit-item\">\r\n <h3 class=\"kit-item-title\">Variaciones del Logo<\/h3>\r\n <div class=\"logo-variations\">\r\n <div class=\"logo-item\"><\/div>\r\n <div class=\"logo-item\"><\/div>\r\n <div class=\"logo-item\"><\/div>\r\n <\/div>\r\n <ul class=\"specs-list\">\r\n <li><span class=\"specs-label\">Formatos:<\/span> SVG, PNG, PDF<\/li>\r\n <li><span class=\"specs-label\">Resoluci\u00f3n:<\/span> Vectorial + 300 DPI<\/li>\r\n <li><span class=\"specs-label\">Tama\u00f1o m\u00ednimo:<\/span> 24px altura<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <!-- PALETA DE COLORES FICTICIA -->\r\n <div class=\"kit-item\">\r\n <h3 class=\"kit-item-title\">Paleta de Colores<\/h3>\r\n <div class=\"color-palette\">\r\n <div class=\"color-swatch color-primary\">\r\n <div class=\"color-code\">#2B4A7F<\/div>\r\n <\/div>\r\n <div class=\"color-swatch color-secondary\">\r\n <div class=\"color-code\">#1A5F8B<\/div>\r\n <\/div>\r\n <div class=\"color-swatch color-accent\">\r\n <div class=\"color-code\">#3D6FA1<\/div>\r\n <\/div>\r\n <div class=\"color-swatch color-neutral\">\r\n <div class=\"color-code\">#F8FAFC<\/div>\r\n <\/div>\r\n <\/div>\r\n <ul class=\"specs-list\">\r\n <li><span class=\"specs-label\">Primario:<\/span> Headers y logotipos<\/li>\r\n <li><span class=\"specs-label\">Secundario:<\/span> Acentos y botones<\/li>\r\n <li><span class=\"specs-label\">Neutral:<\/span> Fondos y textos<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <!-- TIPOGRAF\u00cdAS FICTICIAS -->\r\n <div class=\"kit-item\">\r\n <h3 class=\"kit-item-title\">Sistema Tipogr\u00e1fico<\/h3>\r\n <div class=\"typography-sample\">\r\n <div class=\"font-primary\">Modernist Pro Bold<\/div>\r\n <div class=\"font-secondary\">Para t\u00edtulos y headers principales<\/div>\r\n <\/div>\r\n <div class=\"typography-sample\">\r\n <div class=\"font-secondary\" style=\"font-weight: 500;\">Clarity Sans Medium<\/div>\r\n <div class=\"font-secondary\">Para cuerpo de texto y p\u00e1rrafos<\/div>\r\n <\/div>\r\n <ul class=\"specs-list\">\r\n <li><span class=\"specs-label\">T\u00edtulos H1:<\/span> 48px \/ LH: 1.2<\/li>\r\n <li><span class=\"specs-label\">Cuerpo:<\/span> 16px \/ LH: 1.6<\/li>\r\n <li><span class=\"specs-label\">Licencia:<\/span> Comercial incluida<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <!-- ESPECIFICACIONES DE USO FICTICIAS -->\r\n <div class=\"kit-item\">\r\n <h3 class=\"kit-item-title\">Especificaciones de Uso<\/h3>\r\n <ul class=\"specs-list\">\r\n <li><span class=\"specs-label\">Espacio protecci\u00f3n:<\/span> 2x altura logo<\/li>\r\n <li><span class=\"specs-label\">Fondos permitidos:<\/span> Blancos, neutros<\/li>\r\n <li><span class=\"specs-label\">Fondos prohibidos:<\/span> Patrones complejos<\/li>\r\n <li><span class=\"specs-label\">Rotaci\u00f3n m\u00e1xima:<\/span> \u00b115 grados<\/li>\r\n <li><span class=\"specs-label\">Transparencia m\u00edn.:<\/span> 100% opacidad<\/li>\r\n <li><span class=\"specs-label\">Versi\u00f3n monocrom.:<\/span> Disponible<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <!-- NOTA DE PERSONALIZACI\u00d3N -->\r\n <div class=\"customization-note\">\r\n <strong>Personalizaci\u00f3n Total<\/strong><br>\r\n Las tipograf\u00edas, colores, dimensiones y especificaciones de uso se adaptan completamente seg\u00fan las necesidades, personalidad y objetivos de cada cliente. Este es solo un ejemplo de la estructura profesional de entregables.\r\n <\/div>\r\n\r\n <\/div>\r\n <\/section>\r\n\r\n <script>\r\n \/**\r\n * BRANDING SHOWCASE - JAVASCRIPT VANILLA\r\n * Textos blancos + Logos reales + Entregable oculto inicialmente\r\n *\/\r\n\r\n class BrandingShowcase {\r\n constructor() {\r\n this.showcase = document.getElementById('brandingShowcase');\r\n this.deliverableSection = document.getElementById('deliverable');\r\n this.ctaButton = document.getElementById('ctaButton');\r\n this.floatingElements = document.querySelectorAll('.floating-element');\r\n \r\n this.isVisible = false;\r\n this.isDeliverableVisible = false;\r\n \r\n this.init();\r\n }\r\n\r\n init() {\r\n this.setupIntersectionObserver();\r\n this.setupEventListeners();\r\n this.setupAccessibility();\r\n this.initAnimations();\r\n }\r\n\r\n \/**\r\n * INTERSECTION OBSERVER PARA ANIMACI\u00d3N DE ENTRADA\r\n *\/\r\n setupIntersectionObserver() {\r\n const options = {\r\n root: null,\r\n rootMargin: '0px 0px -10% 0px',\r\n threshold: 0.1\r\n };\r\n\r\n const observer = new IntersectionObserver((entries) => {\r\n entries.forEach(entry => {\r\n if (entry.target === this.showcase && entry.isIntersecting && !this.isVisible) {\r\n this.animateShowcaseIn();\r\n this.isVisible = true;\r\n }\r\n });\r\n }, options);\r\n\r\n if (this.showcase) {\r\n observer.observe(this.showcase);\r\n }\r\n }\r\n\r\n \/**\r\n * ANIMACI\u00d3N DE ENTRADA SECCI\u00d3N PROMOCIONAL\r\n *\/\r\n animateShowcaseIn() {\r\n if (this.showcase) {\r\n this.showcase.classList.add('visible');\r\n }\r\n\r\n \/\/ Animar elementos flotantes secuencialmente\r\n this.floatingElements.forEach((element, index) => {\r\n setTimeout(() => {\r\n element.style.opacity = '1';\r\n element.style.transform = 'translateY(0) scale(1)';\r\n }, index * 200 + 800);\r\n });\r\n }\r\n\r\n \/**\r\n * MOSTRAR SECCI\u00d3N ENTREGABLE CON ANIMACI\u00d3N\r\n *\/\r\n showDeliverable() {\r\n if (this.deliverableSection && !this.isDeliverableVisible) {\r\n \/\/ Mostrar secci\u00f3n\r\n this.deliverableSection.style.display = 'flex';\r\n \r\n \/\/ Trigger reflow\r\n this.deliverableSection.offsetHeight;\r\n \r\n \/\/ Animar entrada\r\n setTimeout(() => {\r\n this.deliverableSection.classList.add('visible');\r\n }, 50);\r\n\r\n \/\/ Animar items del kit secuencialmente\r\n const kitItems = this.deliverableSection.querySelectorAll('.kit-item');\r\n kitItems.forEach((item, index) => {\r\n item.style.opacity = '0';\r\n item.style.transform = 'translateY(30px)';\r\n item.style.transition = 'all 0.6s cubic-bezier(0.4, 0.0, 0.2, 1)';\r\n \r\n setTimeout(() => {\r\n item.style.opacity = '1';\r\n item.style.transform = 'translateY(0)';\r\n }, index * 150 + 400);\r\n });\r\n\r\n \/\/ Scroll suave al entregable\r\n setTimeout(() => {\r\n this.deliverableSection.scrollIntoView({ \r\n behavior: 'smooth',\r\n block: 'start'\r\n });\r\n }, 200);\r\n\r\n this.isDeliverableVisible = true;\r\n }\r\n }\r\n\r\n \/**\r\n * EVENT LISTENERS\r\n *\/\r\n setupEventListeners() {\r\n \/\/ CTA Button - Mostrar entregable\r\n if (this.ctaButton) {\r\n this.ctaButton.addEventListener('click', (e) => {\r\n e.preventDefault();\r\n this.handleCTAClick(e);\r\n });\r\n this.ctaButton.addEventListener('mouseenter', this.handleCTAHover.bind(this));\r\n }\r\n\r\n \/\/ Touch events para elementos flotantes\r\n this.floatingElements.forEach(element => {\r\n element.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });\r\n element.addEventListener('touchend', this.handleTouchEnd.bind(this), { passive: true });\r\n });\r\n\r\n \/\/ Interacci\u00f3n con dispositivo principal\r\n const mainDevice = document.getElementById('mainDevice');\r\n if (mainDevice) {\r\n mainDevice.addEventListener('click', () => {\r\n mainDevice.style.transform = 'translate(-50%, -50%) scale(1.1) rotateY(10deg)';\r\n setTimeout(() => {\r\n mainDevice.style.transform = 'translate(-50%, -50%) scale(1.05) rotateY(0deg)';\r\n }, 300);\r\n });\r\n }\r\n }\r\n\r\n \/**\r\n * MANEJO DEL CTA BUTTON\r\n *\/\r\n handleCTAClick(e) {\r\n \/\/ Crear ripple effect\r\n this.createRippleEffect(e.currentTarget, e);\r\n \r\n \/\/ Mostrar entregable despu\u00e9s de un breve delay\r\n setTimeout(() => {\r\n this.showDeliverable();\r\n }, 300);\r\n }\r\n\r\n \/**\r\n * EFECTOS VISUALES\r\n *\/\r\n handleCTAHover() {\r\n const button = this.ctaButton;\r\n if (!button) return;\r\n \r\n \/\/ Glow effect mejorado\r\n button.style.boxShadow = '0 0 60px rgba(12, 28, 72, 0.7), 0 16px 48px rgba(12, 28, 72, 0.5)';\r\n button.style.transform = 'translateY(-6px) scale(1.03)';\r\n \r\n setTimeout(() => {\r\n button.style.boxShadow = '0 16px 48px rgba(12, 28, 72, 0.4)';\r\n button.style.transform = 'translateY(-4px) scale(1.02)';\r\n }, 300);\r\n }\r\n\r\n createRippleEffect(button, event) {\r\n const rect = button.getBoundingClientRect();\r\n const ripple = document.createElement('div');\r\n const size = Math.max(rect.width, rect.height);\r\n const x = event.clientX - rect.left - size \/ 2;\r\n const y = event.clientY - rect.top - size \/ 2;\r\n \r\n ripple.style.cssText = `\r\n position: absolute;\r\n border-radius: 50%;\r\n background: rgba(255, 255, 255, 0.4);\r\n width: ${size}px;\r\n height: ${size}px;\r\n left: ${x}px;\r\n top: ${y}px;\r\n animation: ripple 0.8s ease-out;\r\n pointer-events: none;\r\n z-index: 1000;\r\n `;\r\n \r\n button.style.position = 'relative';\r\n button.appendChild(ripple);\r\n \r\n setTimeout(() => {\r\n if (ripple.parentNode) {\r\n ripple.parentNode.removeChild(ripple);\r\n }\r\n }, 800);\r\n }\r\n\r\n handleTouchStart(e) {\r\n if (!e.currentTarget) return;\r\n e.currentTarget.style.transform += ' scale(0.95)';\r\n }\r\n\r\n handleTouchEnd(e) {\r\n if (!e.currentTarget) return;\r\n setTimeout(() => {\r\n const currentTransform = e.currentTarget.style.transform || '';\r\n e.currentTarget.style.transform = currentTransform.replace(' scale(0.95)', '');\r\n }, 150);\r\n }\r\n\r\n \/**\r\n * INICIALIZAR ANIMACIONES\r\n *\/\r\n initAnimations() {\r\n \/\/ Ocultar elementos flotantes para animaci\u00f3n de entrada\r\n this.floatingElements.forEach(element => {\r\n element.style.opacity = '0';\r\n element.style.transform = 'translateY(30px) scale(0.8)';\r\n element.style.transition = 'all 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55)';\r\n });\r\n }\r\n\r\n \/**\r\n * ACCESIBILIDAD\r\n *\/\r\n setupAccessibility() {\r\n \/\/ ARIA labels\r\n if (this.showcase) {\r\n this.showcase.setAttribute('aria-label', 'Showcase de servicios de branding profesional');\r\n }\r\n\r\n if (this.deliverableSection) {\r\n this.deliverableSection.setAttribute('aria-label', 'Ejemplo completo de brand kit');\r\n }\r\n\r\n \/\/ Navegaci\u00f3n por teclado en elementos flotantes\r\n this.floatingElements.forEach((element, index) => {\r\n element.setAttribute('tabindex', '0');\r\n element.setAttribute('role', 'button');\r\n element.setAttribute('aria-label', `Elemento de branding ${index + 1}: ${this.getElementDescription(element)}`);\r\n \r\n element.addEventListener('keydown', (e) => {\r\n if (e.key === 'Enter' || e.key === ' ') {\r\n e.preventDefault();\r\n element.click();\r\n }\r\n });\r\n });\r\n\r\n \/\/ Soporte para reduced motion\r\n if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {\r\n document.documentElement.style.setProperty('--transition-smooth', '0.2s ease');\r\n document.documentElement.style.setProperty('--transition-bounce', '0.2s ease');\r\n }\r\n }\r\n\r\n getElementDescription(element) {\r\n if (element.classList.contains('business-card')) return 'tarjeta de presentaci\u00f3n';\r\n if (element.classList.contains('logo-sheet')) return 'hoja de logos';\r\n if (element.classList.contains('letterhead')) return 'membrete corporativo';\r\n if (element.classList.contains('package-mockup')) return 'mockup de packaging';\r\n return 'elemento de marca';\r\n }\r\n }\r\n\r\n \/**\r\n * ANIMACI\u00d3N RIPPLE MEJORADA\r\n *\/\r\n const rippleKeyframes = `\r\n @keyframes ripple {\r\n 0% {\r\n transform: scale(0);\r\n opacity: 1;\r\n }\r\n 50% {\r\n opacity: 0.6;\r\n }\r\n 100% {\r\n transform: scale(4);\r\n opacity: 0;\r\n }\r\n }\r\n `;\r\n\r\n const style = document.createElement('style');\r\n style.textContent = rippleKeyframes;\r\n document.head.appendChild(style);\r\n\r\n \/**\r\n * UTILIDAD PARA PERSONALIZACI\u00d3N\r\n *\/\r\n window.BrandingShowcase = {\r\n updateColors: (primary, secondary, tertiary) => {\r\n document.documentElement.style.setProperty('--brand-primary', primary);\r\n document.documentElement.style.setProperty('--brand-secondary', secondary);\r\n document.documentElement.style.setProperty('--brand-tertiary', tertiary);\r\n }\r\n };\r\n\r\n \/**\r\n * INICIALIZACI\u00d3N\r\n *\/\r\n document.addEventListener('DOMContentLoaded', () => {\r\n new BrandingShowcase();\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\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-865c272 e-flex e-con-boxed e-con e-parent\" data-id=\"865c272\" 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-c573829 elementor-widget elementor-widget-html\" data-id=\"c573829\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"es\">\r\n<head>\r\n <meta charset=\"UTF-8\">\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n <title>Servicios Elite Forge<\/title>\r\n <style>\r\n \/* =================================\r\n ESTILOS GENERALES DEL CONTENEDOR\r\n ================================= *\/\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n background: transparent; \/* Sin fondo como solicitado *\/\r\n padding: 20px;\r\n min-height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin: 0;\r\n }\r\n\r\n \/* =================================\r\n CONTENEDOR PRINCIPAL\r\n ================================= *\/\r\n .services-container {\r\n max-width: 100%;\r\n width: 100%;\r\n text-align: center;\r\n padding: 40px 20px;\r\n }\r\n\r\n \/* =================================\r\n T\u00cdTULO PRINCIPAL\r\n ================================= *\/\r\n .main-title {\r\n font-size: 2.5rem !important;\r\n font-weight: 700 !important;\r\n color: white !important;\r\n margin-bottom: 20px !important;\r\n animation: titleSlideIn 1s ease-out;\r\n \/* FORZAR TIPOGRAF\u00cdA ESPEC\u00cdFICA *\/\r\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;\r\n font-style: normal !important;\r\n text-transform: none !important;\r\n letter-spacing: normal !important;\r\n line-height: 1.2 !important;\r\n text-decoration: none !important;\r\n\/* EFECTOS DE BRILLO *\/\r\n text-shadow: \r\n 0 0 10px rgba(255, 255, 255, 0.8),\r\n 0 0 20px rgba(255, 255, 255, 0.6),\r\n 0 0 30px rgba(255, 255, 255, 0.4),\r\n 0 0 40px rgba(255, 255, 255, 0.2) !important;\r\n}\r\n \/* =================================\r\n SUBT\u00cdTULO\r\n ================================= *\/\r\n .subtitle {\r\n font-size: 1.2rem;\r\n color: white;\r\n margin-bottom: 50px;\r\n line-height: 1.6;\r\n animation: subtitleFadeIn 1.2s ease-out 0.3s both;\r\n }\r\n\r\n \/* =================================\r\n CONTENEDOR DE BOTONES\r\n ================================= *\/\r\n .buttons-container {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\r\n gap: 30px;\r\n margin-top: 40px;\r\n }\r\n\r\n \/* =================================\r\n ESTILOS BASE DE LOS BOTONES\r\n ================================= *\/\r\n .service-button {\r\n position: relative;\r\n display: block;\r\n text-decoration: none;\r\n padding: 40px 30px;\r\n border-radius: 20px;\r\n transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n overflow: hidden;\r\n border: 2px solid transparent;\r\n background: transparent;\r\n animation: buttonSlideUp 1s ease-out;\r\n }\r\n\r\n \/* =================================\r\n BOT\u00d3N DE EDICI\u00d3N DE VIDEO\r\n ================================= *\/\r\n.video-button {\r\n animation-delay: 0.5s;\r\n animation-fill-mode: both;\r\n}\r\n.video-button::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background: linear-gradient(135deg, #30496b 0%, #30bbd2 150%);\r\n opacity: 0;\r\n transition: opacity 0.4s ease;\r\n z-index: 1;\r\n}\r\n.video-button:hover::before {\r\n opacity: 0.8; \/* Cambiado de 1 a 0.8 para semi-transparencia *\/\r\n}\r\n\r\n\/* =================================\r\n BOT\u00d3N DE DISE\u00d1OS & LOGOS\r\n ================================= *\/\r\n.design-button {\r\n animation-delay: 0.7s;\r\n animation-fill-mode: both;\r\n}\r\n.design-button::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background: linear-gradient(135deg, #476892 0%, #59335d 100%);\r\n opacity: 0;\r\n transition: opacity 0.4s ease;\r\n z-index: 1;\r\n}\r\n.design-button:hover::before {\r\n opacity: 0.8; \/* Cambiado de 1 a 0.8 para semi-transparencia *\/\r\n}\r\n\r\n \/* =================================\r\n EFECTOS HOVER GENERALES\r\n ================================= *\/\r\n .service-button:hover {\r\n transform: translateY(-10px) scale(1.02);\r\n box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);\r\n border-color: rgba(255, 255, 255, 0.3);\r\n }\r\n\r\n \/* =================================\r\n CONTENIDO DE LOS BOTONES\r\n ================================= *\/\r\n .button-content {\r\n position: relative;\r\n z-index: 2;\r\n transition: color 0.4s ease;\r\n color: white !important;\r\n }\r\n\r\n .button-content * {\r\n color: white !important;\r\n }\r\n\r\n .service-button:hover .button-content {\r\n color: white;\r\n }\r\n\r\n \/* =================================\r\n ICONOS DE LOS BOTONES\r\n ================================= *\/\r\n .button-icon {\r\n font-size: 3rem;\r\n margin-bottom: 20px;\r\n display: block;\r\n transition: transform 0.4s ease;\r\n }\r\n\r\n .service-button:hover .button-icon {\r\n transform: scale(1.1) rotate(5deg);\r\n }\r\n\r\n \/* =================================\r\n T\u00cdTULOS DE LOS BOTONES\r\n ================================= *\/\r\n .button-title {\r\n font-size: 2.1rem !important;\r\n font-weight: 600;\r\n margin-bottom: 15px;\r\n color: white !important;\r\n }\r\n\r\n \/* =================================\r\n DESCRIPCIONES DE LOS BOTONES\r\n ================================= *\/\r\n .button-description {\r\n font-size: 1rem;\r\n line-height: 1.5;\r\n color: white !important;\r\n opacity: 0.9;\r\n }\r\n\r\n \/* =================================\r\n ANIMACIONES KEYFRAMES\r\n ================================= *\/\r\n @keyframes titleSlideIn {\r\n from {\r\n opacity: 0;\r\n transform: translateY(-50px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n @keyframes subtitleFadeIn {\r\n from {\r\n opacity: 0;\r\n transform: translateY(-30px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n @keyframes buttonSlideUp {\r\n from {\r\n opacity: 0;\r\n transform: translateY(50px) scale(0.9);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0) scale(1);\r\n }\r\n }\r\n\r\n \/* =================================\r\n EFECTO DE PULSO EN HOVER\r\n ================================= *\/\r\n .service-button::after {\r\n content: '';\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n width: 0;\r\n height: 0;\r\n background: rgba(255, 255, 255, 0.3);\r\n border-radius: 50%;\r\n transform: translate(-50%, -50%);\r\n transition: width 0.6s ease, height 0.6s ease;\r\n }\r\n\r\n .service-button:hover::after {\r\n width: 300px;\r\n height: 300px;\r\n }\r\n\r\n \/* =================================\r\n RESPONSIVE DESIGN\r\n ================================= *\/\r\n @media (max-width: 768px) {\r\n .main-title {\r\n font-size: 2rem;\r\n }\r\n \r\n .subtitle {\r\n font-size: 1rem;\r\n }\r\n \r\n .buttons-container {\r\n grid-template-columns: 1fr;\r\n gap: 20px;\r\n }\r\n \r\n .service-button {\r\n padding: 30px 20px;\r\n }\r\n \r\n .button-icon {\r\n font-size: 2.5rem;\r\n }\r\n \r\n .button-title {\r\n font-size: 1.5rem;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .main-title {\r\n font-size: 1.8rem;\r\n }\r\n \r\n .service-button {\r\n padding: 25px 15px;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <!-- =================================\r\n CONTENEDOR PRINCIPAL DE SERVICIOS\r\n ================================= -->\r\n <div class=\"services-container\">\r\n \r\n <!-- T\u00edtulo principal con gradiente -->\r\n <h1 class=\"main-title\" data-original-text=\"Nuestros Servicios Creativos\">Nuestros Servicios Creativos<\/h1>\r\n \r\n <!-- Subt\u00edtulo descriptivo -->\r\n <p class=\"subtitle\">\r\n Explora nuestras especialidades en creaci\u00f3n visual y audiovisual.<br>\r\n Cada servicio est\u00e1 dise\u00f1ado para elevar tu marca al siguiente nivel.\r\n <\/p>\r\n \r\n <!-- Contenedor de botones con grid responsive -->\r\n <div class=\"buttons-container\">\r\n \r\n <!-- =================================\r\n BOT\u00d3N DE EDICI\u00d3N DE VIDEO\r\n ================================= -->\r\n <a href=\"https:\/\/eliteforgecompany.com\/edicion-de-videos\/\" class=\"service-button video-button\" \r\n onclick=\"navigateToService('video')\" \r\n onmouseover=\"playHoverSound()\" \r\n aria-label=\"Ir a servicios de edici\u00f3n de video\">\r\n \r\n <div class=\"button-content\">\r\n <!-- Icono representativo (puedes cambiar por tu preferencia) -->\r\n <span class=\"button-icon\">\ud83c\udfac<\/span>\r\n \r\n <!-- T\u00edtulo del servicio -->\r\n <h2 class=\"button-title\">Edici\u00f3n de Video<\/h2>\r\n \r\n <!-- Descripci\u00f3n del servicio -->\r\n <p class=\"button-description\">\r\n Creamos contenido audiovisual impactante que cuenta tu historia \r\n de manera profesional y cautivadora.\r\n <\/p>\r\n <\/div>\r\n <\/a>\r\n \r\n <!-- =================================\r\n BOT\u00d3N DE DISE\u00d1OS & LOGOS\r\n ================================= -->\r\n <a href=\"https:\/\/eliteforgecompany.com\/diseno-logos\/\" class=\"service-button design-button\" \r\n onclick=\"navigateToService('design')\" \r\n onmouseover=\"playHoverSound()\" \r\n aria-label=\"Ir a servicios de dise\u00f1o y logos\">\r\n \r\n <div class=\"button-content\">\r\n <!-- Icono representativo -->\r\n <span class=\"button-icon\">\ud83c\udfa8<\/span>\r\n \r\n <!-- T\u00edtulo del servicio -->\r\n <h2 class=\"button-title\">Dise\u00f1os & Logos<\/h2>\r\n \r\n <!-- Descripci\u00f3n del servicio -->\r\n <p class=\"button-description\">\r\n Desarrollamos identidades visuales \u00fanicas que reflejan \r\n la personalidad y valores de tu marca.\r\n <\/p>\r\n <\/div>\r\n <\/a>\r\n \r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/* =================================\r\n FUNCIONES JAVASCRIPT\r\n ================================= *\/\r\n \r\n \/**\r\n * Funci\u00f3n para manejar la navegaci\u00f3n a servicios\r\n * @param {string} serviceType - Tipo de servicio ('video' o 'design')\r\n *\/\r\n function navigateToService(serviceType) {\r\n \/\/ Aqu\u00ed puedes cambiar las URLs por las rutas reales de tu sitio\r\n const routes = {\r\n 'video': 'https:\/\/eliteforgecompany.com\/edicion-de-videos\/', \/\/ Cambia esta URL por la real\r\n 'design': 'https:\/\/eliteforgecompany.com\/diseno-logos\/' \/\/ Cambia esta URL por la real\r\n };\r\n \r\n \/\/ Log para debugging (puedes removerlo en producci\u00f3n)\r\n console.log(`Navegando a: ${routes[serviceType]}`);\r\n \r\n \/\/ Opcional: Agregar analytics o tracking aqu\u00ed\r\n \/\/ gtag('event', 'click', { service_type: serviceType });\r\n \r\n \/\/ La navegaci\u00f3n se maneja autom\u00e1ticamente por el href del enlace\r\n }\r\n\r\n \/**\r\n * Funci\u00f3n para efectos de sonido en hover (opcional)\r\n * Requiere archivos de audio para funcionar\r\n *\/\r\n function playHoverSound() {\r\n \/\/ Descomenta las siguientes l\u00edneas si tienes archivos de audio\r\n \/\/ const audio = new Audio('\/sounds\/hover.mp3');\r\n \/\/ audio.volume = 0.3;\r\n \/\/ audio.play().catch(e => console.log('Audio no disponible'));\r\n }\r\n\r\n \/**\r\n * Funci\u00f3n para inicializar efectos cuando carga la p\u00e1gina\r\n *\/\r\n document.addEventListener('DOMContentLoaded', function() {\r\n \/\/ Agregar clase de carga completada para animaciones\r\n document.body.classList.add('loaded');\r\n \r\n \/\/ Opcional: Lazy loading de im\u00e1genes si las agregas\r\n \/\/ initLazyLoading();\r\n \r\n \/\/ Opcional: Inicializar analytics\r\n \/\/ initAnalytics();\r\n });\r\n\r\n \/**\r\n * Funci\u00f3n para manejar efectos de teclado (accesibilidad)\r\n *\/\r\n document.addEventListener('keydown', function(e) {\r\n \/\/ Permitir navegaci\u00f3n con Enter en los botones\r\n if (e.key === 'Enter') {\r\n const focusedElement = document.activeElement;\r\n if (focusedElement.classList.contains('service-button')) {\r\n focusedElement.click();\r\n }\r\n }\r\n });\r\n\r\n \/* =================================\r\n CONFIGURACI\u00d3N ADICIONAL\r\n ================================= *\/\r\n \r\n \/\/ Configuraci\u00f3n para cambiar URLs f\u00e1cilmente\r\n const CONFIG = {\r\n videoServiceUrl: 'https:\/\/eliteforgecompany.com\/edicion-de-videos\/', \/\/ Cambia aqu\u00ed la URL real\r\n designServiceUrl: '\/disenos-logos', \/\/ Cambia aqu\u00ed la URL real\r\n enableSounds: false, \/\/ Cambiar a true si tienes archivos de audio\r\n enableAnalytics: false \/\/ Cambiar a true si usas Google Analytics\r\n };\r\n <\/script>\r\n<\/body>\r\n<\/html>\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-f048006 e-flex e-con-boxed e-con e-parent\" data-id=\"f048006\" 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-335e6aa elementor-widget elementor-widget-html\" data-id=\"335e6aa\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"es\">\r\n<head>\r\n <meta charset=\"UTF-8\">\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n <title>Secci\u00f3n 3 - CTA Intermedio<\/title>\r\n <style>\r\n \/* === MARCADORES EDITABLES - ESTILOS GENERALES === *\/\r\n .ia-funnel-container * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;\r\n }\r\n \r\n .ia-funnel-container body {\r\n background-color: #030617 !important;\r\n color: white !important;\r\n overflow-x: hidden;\r\n line-height: 1.6;\r\n position: relative;\r\n }\r\n \r\n .ia-funnel-container .container {\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 20px;\r\n }\r\n \r\n .ia-funnel-container .neural-background {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n z-index: -1;\r\n background: #030617;\r\n }\r\n\r\n \/* === SECCI\u00d3N CTA INTERMEDIO === *\/\r\n .intermediate-cta-section {\r\n padding: 4rem 1rem;\r\n text-align: center;\r\n position: relative;\r\n margin: 3rem 0;\r\n }\r\n\r\n .intermediate-cta-content {\r\n max-width: 800px;\r\n margin: 0 auto;\r\n opacity: 0;\r\n transform: translateY(30px);\r\n animation: fadeInUp 1s ease-out forwards;\r\n }\r\n\r\n \/* === MARCADORES EDITABLES - T\u00cdTULO PRINCIPAL === *\/\r\n .ia-funnel-container .intermediate-cta-title {\r\n font-size: 2.5rem; \/* EDITABLE: Tama\u00f1o del t\u00edtulo *\/\r\n font-weight: 700 !important; \/* EDITABLE: Peso de la fuente *\/\r\n color: #ffffff !important; \/* EDITABLE: Color del t\u00edtulo *\/\r\n margin-bottom: 1.5rem;\r\n line-height: 1.2;\r\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif !important; \/* EDITABLE: Fuente protegida *\/\r\n text-shadow: 0 0 20px rgba(255, 255, 255, 0.5), 0 0 40px rgba(255, 255, 255, 0.3);\r\n animation: titleGlow 2s ease-in-out infinite alternate;\r\n }\r\n\r\n @keyframes titleGlow {\r\n from {\r\n text-shadow: 0 0 20px rgba(255, 255, 255, 0.5), 0 0 40px rgba(255, 255, 255, 0.3);\r\n }\r\n to {\r\n text-shadow: 0 0 30px rgba(255, 255, 255, 0.8), 0 0 60px rgba(255, 255, 255, 0.5);\r\n }\r\n }\r\n\r\n }\r\n\r\n \/* === MARCADORES EDITABLES - SUBT\u00cdTULO === *\/\r\n .intermediate-cta-subtitle {\r\n font-size: 1.2rem; \/* EDITABLE: Tama\u00f1o del subt\u00edtulo *\/\r\n color: #ffffff; \/* EDITABLE: Color del subt\u00edtulo *\/\r\n margin-bottom: 2.5rem;\r\n font-weight: 300;\r\n line-height: 1.6;\r\n font-family: 'Avenir', Arial, sans-serif; \/* EDITABLE: Fuente *\/\r\n opacity: 0.9;\r\n }\r\n\r\n \/* === MARCADORES EDITABLES - BOT\u00d3N CTA === *\/\r\n .cta-button {\r\n display: inline-block;\r\n padding: 0.2rem 0.9rem; \/* EDITABLE: Padding del bot\u00f3n *\/\r\n background: linear-gradient(135deg, #92f1d5 0%, #30496b 180%); \/* EDITABLE: Color de fondo del bot\u00f3n *\/\r\n color: #ffffff; \/* EDITABLE: Color del texto del bot\u00f3n *\/\r\n text-decoration: none;\r\n border-radius: 5px; \/* EDITABLE: Radio de bordes *\/\r\n font-weight: 500;\r\n font-size: 1.1rem; \/* EDITABLE: Tama\u00f1o de fuente del bot\u00f3n *\/\r\n transition: all 0.3s ease;\r\n border: 2px solid #4b5563;\r\n position: relative;\r\n overflow: hidden;\r\n font-family: 'Avenir', Arial, sans-serif; \/* EDITABLE: Fuente del bot\u00f3n *\/\r\n box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);\r\n }\r\n\r\n .cta-button::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: -100%;\r\n width: 100%;\r\n height: 100%;\r\n background: linear-gradient(135deg, #92f1d5 0%, #30496b 180%), transparent);\r\n transition: left 0.5s ease;\r\n }\r\n\r\n .cta-button:hover::before {\r\n left: 100%;\r\n }\r\n\r\n .cta-button:hover {\r\n transform: translateY(-2px);\r\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);\r\n background: linear-gradient(135deg, #92f1d5 0%, #30496b 180%); \/* EDITABLE: Color hover del bot\u00f3n *\/\r\n border-color: #6b7280;\r\n }\r\n\r\n \/* === L\u00cdNEA DECORATIVA === *\/\r\n .decorative-line {\r\n width: 100px;\r\n height: 2px;\r\n background: linear-gradient(90deg, transparent, #ffffff, transparent);\r\n margin: 2rem auto;\r\n opacity: 0.5;\r\n }\r\n\r\n \/* === ANIMACIONES === *\/\r\n @keyframes fadeInUp {\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n \/* === RESPONSIVE === *\/\r\n @media (max-width: 768px) {\r\n .intermediate-cta-title {\r\n font-size: 2rem; \/* EDITABLE: Tama\u00f1o m\u00f3vil del t\u00edtulo *\/\r\n }\r\n \r\n .intermediate-cta-subtitle {\r\n font-size: 1.1rem; \/* EDITABLE: Tama\u00f1o m\u00f3vil del subt\u00edtulo *\/\r\n }\r\n \r\n .cta-button {\r\n padding: 0.8rem 2rem; \/* EDITABLE: Padding m\u00f3vil del bot\u00f3n *\/\r\n font-size: 1rem; \/* EDITABLE: Tama\u00f1o m\u00f3vil del bot\u00f3n *\/\r\n }\r\n \r\n .intermediate-cta-section {\r\n padding: 3rem 1rem;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"ia-funnel-container\">\r\n <!-- Fondo neuronal -->\r\n <div class=\"neural-background\" id=\"neuralBackground\"><\/div>\r\n \r\n <!-- Secci\u00f3n CTA Intermedio -->\r\n <section class=\"intermediate-cta-section\">\r\n <div class=\"intermediate-cta-content\">\r\n <!-- MARCADOR EDITABLE: T\u00cdTULO PRINCIPAL -->\r\n <h2 class=\"intermediate-cta-title\">\u00bfImaginas ver tu marca en productos reales?\"<\/h2>\r\n \r\n <!-- L\u00ednea decorativa -->\r\n <div class=\"decorative-line\"><\/div>\r\n \r\n <!-- MARCADOR EDITABLE: SUBT\u00cdTULO -->\r\n <p class=\"intermediate-cta-subtitle\">Creamos estrategias de branding integrales que van desde el logo hasta la comunicaci\u00f3n, desarrollando conceptos creativos \u00fanicos y mockups realistas para mostrarte todo el potencial de tu marca<\/p>\r\n \r\n <!-- MARCADOR EDITABLE: BOT\u00d3N CTA - Cambiar href por tu enlace -->\r\n <a href=\"https:\/\/eliteforgecompany.com\/calendario\/\" class=\"cta-button\">Empezar mi branding<\/a>\r\n <\/div>\r\n <\/section>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Efecto de fondo neuronal interactivo\r\n document.addEventListener('DOMContentLoaded', function() {\r\n const neuralBackground = document.getElementById('neuralBackground');\r\n if (!neuralBackground) return;\r\n \r\n let nodes = [];\r\n let connections = [];\r\n const nodeCount = 30;\r\n \r\n \/\/ Crear nodos\r\n for (let i = 0; i < nodeCount; i++) {\r\n nodes.push({\r\n x: Math.random() * 100,\r\n y: Math.random() * 100,\r\n vx: (Math.random() - 0.5) * 0.1,\r\n vy: (Math.random() - 0.5) * 0.1,\r\n size: Math.random() * 1.5 + 1\r\n });\r\n }\r\n \r\n \/\/ Crear conexiones\r\n for (let i = 0; i < nodes.length; i++) {\r\n for (let j = i + 1; j < nodes.length; j++) {\r\n const dx = nodes[i].x - nodes[j].x;\r\n const dy = nodes[i].y - nodes[j].y;\r\n const distance = Math.sqrt(dx * dx + dy * dy);\r\n \r\n if (distance < 15) {\r\n connections.push({\r\n from: i,\r\n to: j,\r\n opacity: 1 - (distance \/ 15)\r\n });\r\n }\r\n }\r\n }\r\n \r\n \/\/ Animaci\u00f3n\r\n const canvas = document.createElement('canvas');\r\n const ctx = canvas.getContext('2d');\r\n neuralBackground.appendChild(canvas);\r\n \r\n function resizeCanvas() {\r\n canvas.width = neuralBackground.offsetWidth;\r\n canvas.height = neuralBackground.offsetHeight;\r\n }\r\n \r\n resizeCanvas();\r\n window.addEventListener('resize', resizeCanvas);\r\n \r\n function draw() {\r\n ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n \r\n \/\/ Actualizar posiciones\r\n nodes.forEach(node => {\r\n node.x += node.vx;\r\n node.y += node.vy;\r\n \r\n \/\/ Rebote en bordes\r\n if (node.x < 0 || node.x > 100) node.vx *= -1;\r\n if (node.y < 0 || node.y > 100) node.vy *= -1;\r\n });\r\n \r\n \/\/ Recalcular conexiones\r\n connections = [];\r\n for (let i = 0; i < nodes.length; i++) {\r\n for (let j = i + 1; j < nodes.length; j++) {\r\n const dx = nodes[i].x - nodes[j].x;\r\n const dy = nodes[i].y - nodes[j].y;\r\n const distance = Math.sqrt(dx * dx + dy * dy);\r\n \r\n if (distance < 15) {\r\n connections.push({\r\n from: i,\r\n to: j,\r\n opacity: 1 - (distance \/ 15)\r\n });\r\n }\r\n }\r\n }\r\n \r\n \/\/ Dibujar conexiones\r\n connections.forEach(conn => {\r\n const nodeA = nodes[conn.from];\r\n const nodeB = nodes[conn.to];\r\n \r\n ctx.beginPath();\r\n ctx.moveTo(nodeA.x * canvas.width \/ 100, nodeA.y * canvas.height \/ 100);\r\n ctx.lineTo(nodeB.x * canvas.width \/ 100, nodeB.y * canvas.height \/ 100);\r\n ctx.strokeStyle = `rgba(255, 255, 255, ${conn.opacity * 0.1})`;\r\n ctx.lineWidth = 0.5;\r\n ctx.stroke();\r\n });\r\n \r\n \/\/ Dibujar nodos\r\n nodes.forEach(node => {\r\n ctx.beginPath();\r\n ctx.arc(node.x * canvas.width \/ 100, node.y * canvas.height \/ 100, node.size, 0, Math.PI * 2);\r\n ctx.fillStyle = `rgba(0, 212, 255, 0.6)`;\r\n ctx.fill();\r\n });\r\n \r\n requestAnimationFrame(draw);\r\n }\r\n \r\n draw();\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\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-2fb48734 e-flex e-con-boxed e-con e-parent\" data-id=\"2fb48734\" 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-66ba67ab e-con-full e-flex e-con e-child\" data-id=\"66ba67ab\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-2843e931 e-con-full e-flex e-con e-child\" data-id=\"2843e931\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-648862a4 elementor-invisible elementor-widget elementor-widget-heading\" data-id=\"648862a4\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"_animation":"slideInLeft"}\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Preguntas Frecuentes sobre Branding<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3462bb80 animated-fast elementor-invisible elementor-widget elementor-widget-accordion\" data-id=\"3462bb80\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{"_animation":"slideInUp"}\" data-widget_type=\"accordion.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-accordion\">\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8781\" class=\"elementor-tab-title\" data-tab=\"1\" role=\"button\" aria-controls=\"elementor-tab-content-8781\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfQu\u00e9 es el branding y c\u00f3mo puede transformar mi negocio?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8781\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"1\" role=\"region\" aria-labelledby=\"elementor-tab-title-8781\"><p>El branding es mucho m\u00e1s que un logo bonito: es la personalidad completa de tu empresa. Incluye tu identidad visual, tu voz, tus valores y cada experiencia que viven tus clientes contigo. Un branding s\u00f3lido diferencia tu negocio en mercados saturados, genera confianza inmediata, permite establecer precios premium y construye una base de clientes leales que se convierten en embajadores de tu marca.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8782\" class=\"elementor-tab-title\" data-tab=\"2\" role=\"button\" aria-controls=\"elementor-tab-content-8782\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfCu\u00e1l es la diferencia entre marca, logo y branding?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8782\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"2\" role=\"region\" aria-labelledby=\"elementor-tab-title-8782\"><p>La marca es la percepci\u00f3n total que tienen las personas sobre tu empresa (reputaci\u00f3n, experiencias, emociones). El logo es solo un elemento visual que representa tu marca. El branding es el proceso estrat\u00e9gico de construir y gestionar esa marca, incluyendo el dise\u00f1o visual, la comunicaci\u00f3n, la experiencia del cliente y todos los puntos de contacto con tu audiencia.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8783\" class=\"elementor-tab-title\" data-tab=\"3\" role=\"button\" aria-controls=\"elementor-tab-content-8783\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfCu\u00e1ndo es el momento adecuado para invertir en una estrategia de branding profesional?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8783\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"3\" role=\"region\" aria-labelledby=\"elementor-tab-title-8783\"><p>Es momento de invertir en branding profesional cuando tu negocio est\u00e1 listo para crecer, cuando te confunden con la competencia, cuando tus ventas se estancan a pesar de tener un buen producto, o cuando planeas expandirte a nuevos mercados. Tambi\u00e9n es crucial si tus materiales de marketing se ven inconsistentes o amateur, ya que esto puede estar limitando tu potencial de crecimiento.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8784\" class=\"elementor-tab-title\" data-tab=\"4\" role=\"button\" aria-controls=\"elementor-tab-content-8784\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfC\u00f3mo justificar la inversi\u00f3n en branding ante resultados que no son inmediatos?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8784\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"4\" role=\"region\" aria-labelledby=\"elementor-tab-title-8784\"><p>El branding es una inversi\u00f3n estrat\u00e9gica, no un gasto. Empresas con branding fuerte pueden cobrar hasta 20% m\u00e1s por productos similares, tienen menores costos de adquisici\u00f3n de clientes y mayor valor de reventa. Pi\u00e9nsalo como construir los cimientos de una casa: no los ves, pero sin ellos todo lo dem\u00e1s se tambalea. Un branding s\u00f3lido multiplica la efectividad de todas tus futuras acciones de marketing.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8785\" class=\"elementor-tab-title\" data-tab=\"5\" role=\"button\" aria-controls=\"elementor-tab-content-8785\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfQu\u00e9 pasa si mi industria es \"muy tradicional\" o \"aburrida\" para el branding creativo?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8785\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"5\" role=\"region\" aria-labelledby=\"elementor-tab-title-8785\"><p>No existe industria aburrida, solo marcas que no han encontrado su diferenciador. Hemos transformado marcas en sectores como seguros, contabilidad, manufactura industrial y servicios legales, convirti\u00e9ndolas en l\u00edderes memorables de sus mercados. El secreto est\u00e1 en encontrar qu\u00e9 hace \u00fanica tu propuesta de valor y comunicarla de manera aut\u00e9ntica y relevante para tu audiencia espec\u00edfica.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8786\" class=\"elementor-tab-title\" data-tab=\"6\" role=\"button\" aria-controls=\"elementor-tab-content-8786\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfQu\u00e9 incluye un proyecto completo de branding con su agencia?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8786\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"6\" role=\"region\" aria-labelledby=\"elementor-tab-title-8786\"><p>Nuestro proceso integral incluye investigaci\u00f3n de mercado y an\u00e1lisis competitivo, definici\u00f3n de estrategia de marca y posicionamiento, creaci\u00f3n de identidad visual completa (logo, paleta de colores, tipograf\u00edas), desarrollo de voz y personalidad de marca, dise\u00f1o de aplicaciones (tarjetas, papeler\u00eda, digitales), gu\u00eda de uso de marca y estrategia de implementaci\u00f3n. Todo dise\u00f1ado para que tu marca tenga impacto desde el primer d\u00eda.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8787\" class=\"elementor-tab-title\" data-tab=\"7\" role=\"button\" aria-controls=\"elementor-tab-content-8787\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfCu\u00e1nto tiempo toma ver resultados reales de una nueva estrategia de branding?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8787\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"7\" role=\"region\" aria-labelledby=\"elementor-tab-title-8787\"><p>Los primeros resultados se notan inmediatamente: una imagen m\u00e1s profesional y mayor confianza del cliente. Sin embargo, el impacto completo se desarrolla progresivamente. En 3-6 meses ver\u00e1s mayor reconocimiento y engagement. Entre 6-12 meses, incremento en leads y ventas. El verdadero valor del branding, como posicionamiento s\u00f3lido y lealtad de marca, se consolida entre 1-2 a\u00f1os con implementaci\u00f3n consistente.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8788\" class=\"elementor-tab-title\" data-tab=\"8\" role=\"button\" aria-controls=\"elementor-tab-content-8788\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfCu\u00e1nto tiempo toma desarrollar una estrategia de branding efectiva?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8788\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"8\" role=\"region\" aria-labelledby=\"elementor-tab-title-8788\"><p>El desarrollo inicial de una estrategia de branding puede tomar entre 2-6 meses, dependiendo del tama\u00f1o y complejidad del proyecto. Sin embargo, el branding es un proceso continuo que evoluciona constantemente. La investigaci\u00f3n, definici\u00f3n de estrategia y creaci\u00f3n de elementos b\u00e1sicos puede completarse en pocos meses, pero construir reconocimiento y posicionamiento s\u00f3lido en el mercado puede tomar a\u00f1os.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-8789\" class=\"elementor-tab-title\" data-tab=\"9\" role=\"button\" aria-controls=\"elementor-tab-content-8789\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfCon qu\u00e9 frecuencia debo actualizar o renovar mi branding?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-8789\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"9\" role=\"region\" aria-labelledby=\"elementor-tab-title-8789\"><p>No existe una regla fija, pero generalmente se recomienda evaluar tu branding cada 5-10 a\u00f1os o cuando ocurran cambios significativos como expansi\u00f3n a nuevos mercados, fusiones, cambios en la audiencia objetivo o cuando la marca se sienta desactualizada. Las actualizaciones menores pueden hacerse m\u00e1s frecuentemente, mientras que los rebrandings completos deben ser decisiones estrat\u00e9gicas bien fundamentadas para evitar confundir a los clientes existentes.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-accordion-item\">\n\t\t\t\t\t<div id=\"elementor-tab-title-87810\" class=\"elementor-tab-title\" data-tab=\"10\" role=\"button\" aria-controls=\"elementor-tab-content-87810\" aria-expanded=\"false\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon elementor-accordion-icon-left\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-closed\"><svg class=\"e-font-icon-svg e-fas-plus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t<span class=\"elementor-accordion-icon-opened\"><svg class=\"e-font-icon-svg e-fas-minus\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\"><\/path><\/svg><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-accordion-title\" tabindex=\"0\">\u00bfQu\u00e9 m\u00e9todos de pago aceptan?<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-87810\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"10\" role=\"region\" aria-labelledby=\"elementor-tab-title-87810\"><p>Aceptamos varios m\u00e9todos de pago, incluyendo tarjetas de cr\u00e9dito, transferencias bancarias, y plataformas como PayPal. Tambi\u00e9n ofrecemos opciones de pago en cuotas para proyectos de mayor envergadura.<\/p><\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\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\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Branding \u00a1\u00danete a nosotros y genera una identidad para tu marca! Branding Showcase – Secci\u00f3n Promocional Branding Profesional Transforma Tu Marca Creamos identidades visuales que conectan, comunican y convierten Desarrollamos sistemas de identidad visual completos que reflejan la esencia \u00fanica de tu marca. Desde el dise\u00f1o de logo hasta aplicaciones digitales y f\u00edsicas, cada elemento […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-28058","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/eliteforgecompany.com\/en\/wp-json\/wp\/v2\/pages\/28058","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/eliteforgecompany.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/eliteforgecompany.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/eliteforgecompany.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/eliteforgecompany.com\/en\/wp-json\/wp\/v2\/comments?post=28058"}],"version-history":[{"count":147,"href":"https:\/\/eliteforgecompany.com\/en\/wp-json\/wp\/v2\/pages\/28058\/revisions"}],"predecessor-version":[{"id":28951,"href":"https:\/\/eliteforgecompany.com\/en\/wp-json\/wp\/v2\/pages\/28058\/revisions\/28951"}],"wp:attachment":[{"href":"https:\/\/eliteforgecompany.com\/en\/wp-json\/wp\/v2\/media?parent=28058"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}