{"id":380,"date":"2026-06-08T18:29:53","date_gmt":"2026-06-08T18:29:53","guid":{"rendered":"https:\/\/erguezhacha.estaciondiseno.es\/?page_id=380"},"modified":"2026-06-13T11:16:47","modified_gmt":"2026-06-13T11:16:47","slug":"elementor-380","status":"publish","type":"page","link":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/elementor-380\/","title":{"rendered":"Elementor #380"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t
\r\n\r\n\r\n \r\n \r\n conhache.design \u2014 Dise\u00f1o Visual con Car\u00e1cter<\/title>\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\" \/>\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin \/>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Oswald:wght@400;700&family=Poppins:wght@300;400;500;600&display=swap\" rel=\"stylesheet\" \/>\r\n\r\n <style>\r\n \/* \u2500\u2500\u2500 TOKENS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n :root {\r\n --black: #0a0a0a;\r\n --off-white: #f5f0eb;\r\n --white: #ffffff;\r\n --red: #e8000d;\r\n --red-dim: #e8000d22;\r\n --red-dark: #9b0009;\r\n --gray: #1c1c1c;\r\n --mid: #2e2e2e;\r\n --muted: #666666;\r\n --muted-light:#999999;\r\n\r\n --font-title: 'Oswald', sans-serif;\r\n --font-body: 'Poppins', sans-serif;\r\n\r\n --pad: 1.4rem;\r\n --ease: all 0.3s ease;\r\n }\r\n\r\n \/* \u2500\u2500\u2500 RESET SEGURO PARA ENTORNO WORDPRESS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n .ch-portfolio-wrapper *, \r\n .ch-portfolio-wrapper *::before, \r\n .ch-portfolio-wrapper *::after { \r\n box-sizing: border-box; \r\n margin: 0; \r\n padding: 0; \r\n }\r\n \r\n \/* Contenedor principal para aislar los estilos y que no rompa Elementor *\/\r\n .ch-portfolio-wrapper {\r\n background: var(--black) !important;\r\n color: #ffffff !important;\r\n font-family: var(--font-body) !important;\r\n font-size: 15px !important;\r\n line-height: 1.6 !important;\r\n overflow-x: hidden !important;\r\n width: 100%;\r\n position: relative;\r\n }\r\n\r\n .ch-portfolio-wrapper img { display: block; width: 100%; height: auto; }\r\n \r\n \/* Bloqueo absoluto anti-azul integrado en el contenedor *\/\r\n .ch-portfolio-wrapper a, \r\n .ch-portfolio-wrapper a:link, \r\n .ch-portfolio-wrapper a:visited, \r\n .ch-portfolio-wrapper a:hover, \r\n .ch-portfolio-wrapper a:active, \r\n .ch-portfolio-wrapper a:focus { \r\n text-decoration: none !important; \r\n color: inherit !important; \r\n outline: none !important;\r\n }\r\n\r\n \/* \u2500\u2500\u2500 SCROLLBAR \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n ::-webkit-scrollbar { width: 3px; }\r\n ::-webkit-scrollbar-track { background: var(--black); }\r\n ::-webkit-scrollbar-thumb { background: var(--red); }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n NAV\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n .site-nav {\r\n position: fixed;\r\n top: 0; left: 0; right: 0;\r\n z-index: 200;\r\n background: rgba(10,10,10,0.92);\r\n backdrop-filter: blur(10px);\r\n border-bottom: 1px solid var(--gray);\r\n }\r\n\r\n .nav-top {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 0.9rem var(--pad);\r\n }\r\n\r\n .nav-brand {\r\n font-family: var(--font-title);\r\n font-size: 1rem;\r\n font-weight: 700;\r\n letter-spacing: 0.04em;\r\n color: #ffffff !important;\r\n flex-shrink: 0;\r\n }\r\n .nav-brand span { color: #e8000d !important; }\r\n\r\n \/* Hamburger (mobile) *\/\r\n .nav-toggle {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 5px;\r\n cursor: pointer;\r\n padding: 4px;\r\n background: none;\r\n border: none;\r\n }\r\n .nav-toggle span {\r\n display: block;\r\n width: 22px; height: 2px;\r\n background: #ffffff !important;\r\n transition: var(--ease);\r\n transform-origin: center;\r\n }\r\n .nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }\r\n .nav-toggle.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }\r\n .nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }\r\n\r\n \/* Menu drawer *\/\r\n\t .nav-menu {\r\n max-height: 0;\r\n overflow: hidden;\r\n transition: max-height 0.4s cubic-bezier(0.4,0,0.2,1);\r\n border-top: 1px solid transparent;\r\n }\r\n .nav-menu.open {\r\n max-height: 300px;\r\n border-top-color: var(--gray);\r\n }\r\n\r\n .nav-links {\r\n display: flex;\r\n flex-direction: column;\r\n padding: 0.6rem 0 1rem;\r\n }\r\n\r\n .nav-link {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n gap: 0.8rem;\r\n padding: 0.85rem var(--pad);\r\n font-family: var(--font-title);\r\n font-size: 1.05rem;\r\n font-weight: 700;\r\n letter-spacing: 0.08em;\r\n text-transform: uppercase;\r\n color: #ffffff !important;\r\n overflow: hidden;\r\n transition: color 0.25s;\r\n }\r\n\r\n \/* Red sweep fill on click *\/\r\n .nav-link::before {\r\n content: '';\r\n position: absolute;\r\n inset: 0;\r\n background: var(--red);\r\n transform: translateX(-100%);\r\n transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);\r\n z-index: 0;\r\n }\r\n .nav-link.active::before,\r\n .nav-link:hover::before { transform: translateX(0); }\r\n .nav-link.active, .nav-link:hover { color: #ffffff !important; }\r\n\r\n .nav-link-num {\r\n font-size: 0.6rem;\r\n color: #e8000d !important;\r\n font-family: var(--font-body);\r\n font-weight: 600;\r\n letter-spacing: 0.14em;\r\n position: relative; z-index: 1;\r\n transition: color 0.25s;\r\n }\r\n .nav-link:hover .nav-link-num,\r\n .nav-link.active .nav-link-num { color: rgba(255,255,255,0.6) !important; }\r\n\r\n .nav-link-text { position: relative; z-index: 1; color: inherit !important; }\r\n\r\n .nav-link-arrow {\r\n margin-left: auto;\r\n position: relative; z-index: 1;\r\n font-size: 0.75rem;\r\n color: inherit !important;\r\n opacity: 0;\r\n transform: translateX(-6px);\r\n transition: opacity 0.25s, transform 0.25s;\r\n }\r\n .nav-link:hover .nav-link-arrow,\r\n .nav-link.active .nav-link-arrow { opacity: 1; transform: translateX(0); }\r\n\r\n \/* Desktop nav inline *\/\r\n @media (min-width: 768px) {\r\n .nav-toggle { display: none; }\r\n .nav-menu {\r\n max-height: none !important;\r\n overflow: visible;\r\n border-top: none !important;\r\n }\r\n .nav-top { padding-bottom: 0; }\r\n .nav-links {\r\n flex-direction: row;\r\n padding: 0;\r\n border-top: none;\r\n gap: 0;\r\n }\r\n .nav-link {\r\n padding: 0.9rem 1.2rem;\r\n font-size: 0.75rem;\r\n border-left: 1px solid var(--gray);\r\n }\r\n .nav-link:first-child { border-left: none; }\r\n .site-nav { display: flex; align-items: stretch; }\r\n .nav-top { flex: 0 0 auto; }\r\n .nav-menu { flex: 1; display: flex; align-items: stretch; }\r\n .nav-links { width: 100%; justify-content: flex-end; }\r\n }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n PAGE-TRANSITION OVERLAY\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n .page-transition {\r\n position: fixed;\r\n inset: 0;\r\n background: var(--red);\r\n z-index: 1000;\r\n transform: scaleY(0);\r\n transform-origin: bottom;\r\n pointer-events: none;\r\n }\r\n .page-transition.run {\r\n animation: wipe 0.7s cubic-bezier(0.76,0,0.24,1) forwards;\r\n }\r\n @keyframes wipe {\r\n 0% { transform: scaleY(0); transform-origin: bottom; }\r\n 45% { transform: scaleY(1); transform-origin: bottom; }\r\n 55% { transform: scaleY(1); transform-origin: top; }\r\n 100% { transform: scaleY(0); transform-origin: top; }\r\n }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n HERO\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n .hero {\r\n min-height: 100svh;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: flex-end;\r\n padding: 8rem var(--pad) 3.5rem;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n \/* Grain *\/\r\n .hero::before {\r\n content: '';\r\n position: absolute; inset: 0;\r\n background-image: url(\"data:image\/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http:\/\/www.w3.org\/2000\/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'\/%3E%3C\/svg%3E\");\r\n background-size: 180px;\r\n pointer-events: none; z-index: 0;\r\n }\r\n\r\n \/* Red circle decor *\/\r\n .hero::after {\r\n content: '';\r\n position: absolute;\r\n top: -140px; right: -110px;\r\n width: 420px; height: 420px;\r\n border-radius: 50%;\r\n border: 1.5px solid var(--red);\r\n opacity: 0.12;\r\n pointer-events: none; z-index: 0;\r\n }\r\n\r\n .hero-inner { position: relative; z-index: 1; }\r\n\r\n .hero-eyebrow {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 0.5rem;\r\n font-size: 0.68rem;\r\n letter-spacing: 0.2em;\r\n color: #e8000d !important;\r\n text-transform: uppercase;\r\n font-weight: 600;\r\n margin-bottom: 1.2rem;\r\n }\r\n .hero-eyebrow::before {\r\n content: '';\r\n display: block;\r\n width: 28px; height: 1px;\r\n background: var(--red);\r\n }\r\n\r\n .hero-title {\r\n font-family: var(--font-title);\r\n font-size: clamp(2.8rem, 12vw, 5rem);\r\n font-weight: 700;\r\n line-height: 0.93;\r\n text-transform: uppercase;\r\n letter-spacing: -0.01em;\r\n margin-bottom: 1.6rem;\r\n color: #ffffff !important;\r\n }\r\n .hero-title .line-accent {\r\n color: #e8000d !important;\r\n display: block;\r\n }\r\n .hero-title .circled {\r\n position: relative;\r\n display: inline-block;\r\n }\r\n .hero-title .circled::after {\r\n content: '';\r\n position: absolute;\r\n inset: -6px -10px;\r\n border: 2px solid var(--red);\r\n border-radius: 55% 45% 50% 60% \/ 40% 55% 45% 60%;\r\n opacity: 0.7;\r\n transform: rotate(-1.5deg);\r\n }\r\n\r\n .hero-sub {\r\n font-size: 0.88rem;\r\n color: #aaaaaa !important;\r\n max-width: 320px;\r\n margin-bottom: 2.2rem;\r\n font-weight: 300;\r\n }\r\n\r\n .hero-cta {\r\n display: inline-block;\r\n padding: 0.85rem 2rem;\r\n background: var(--red);\r\n color: #ffffff !important;\r\n font-family: var(--font-title);\r\n font-weight: 700;\r\n font-size: 0.85rem;\r\n letter-spacing: 0.12em;\r\n text-transform: uppercase;\r\n border: 2px solid var(--red);\r\n transition: var(--ease);\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n .hero-cta::after {\r\n content: '';\r\n position: absolute; inset: 0;\r\n background: var(--off-white);\r\n transform: translateX(-101%);\r\n transition: transform 0.3s ease;\r\n }\r\n .hero-cta:hover { color: #0a0a0a !important; border-color: var(--off-white); }\r\n .hero-cta:hover::after { transform: translateX(0); }\r\n .hero-cta span { position: relative; z-index: 1; color: inherit !important; }\r\n\r\n .scroll-hint {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-start;\r\n gap: 0.3rem;\r\n margin-top: 3rem;\r\n }\r\n .scroll-hint span {\r\n font-size: 0.62rem;\r\n letter-spacing: 0.22em;\r\n color: var(--muted);\r\n text-transform: uppercase;\r\n }\r\n .scroll-line {\r\n width: 1px; height: 40px;\r\n background: linear-gradient(to bottom, var(--red), transparent);\r\n margin-left: 2px;\r\n animation: scroll-anim 2s ease-in-out infinite;\r\n }\r\n @keyframes scroll-anim {\r\n 0%, 100% { opacity:1; transform:scaleY(1); transform-origin:top; }\r\n 50% { opacity:0.3; transform:scaleY(0.5); transform-origin:top; }\r\n }\r\n\r\n \/* \u2500\u2500\u2500 SECTION COMMONS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n .ch-portfolio-wrapper section { padding: 4rem var(--pad); }\r\n\r\n .section-label {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 0.5rem;\r\n font-size: 0.62rem;\r\n letter-spacing: 0.24em;\r\n color: var(--red);\r\n text-transform: uppercase;\r\n font-weight: 600;\r\n margin-bottom: 1.4rem;\r\n }\r\n .section-label::before {\r\n content: '';\r\n display: block;\r\n width: 20px; height: 1px;\r\n background: var(--red);\r\n }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n WORK\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n #work { padding-top: 2rem; }\r\n\r\n .work-heading {\r\n font-family: var(--font-title);\r\n font-size: clamp(2rem, 9vw, 3.2rem);\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n letter-spacing: 0.02em;\r\n margin-bottom: 2.8rem;\r\n line-height: 1;\r\n color: #ffffff !important;\r\n }\r\n .work-heading .num {\r\n display: block;\r\n font-size: 0.68rem;\r\n color: #666666 !important;\r\n letter-spacing: 0.2em;\r\n font-family: var(--font-body);\r\n font-weight: 400;\r\n margin-bottom: 0.4rem;\r\n }\r\n\r\n .project-list { display: flex; flex-direction: column; }\r\n\r\n .project-card {\r\n position: relative;\r\n overflow: hidden;\r\n cursor: pointer;\r\n border-top: 1px solid var(--gray);\r\n color: #ffffff !important;\r\n }\r\n .project-card:last-child { border-bottom: 1px solid var(--gray); }\r\n\r\n \/* Project image wrapper *\/\r\n .project-img {\r\n width: 100%;\r\n aspect-ratio: 4\/3;\r\n overflow: hidden;\r\n position: relative;\r\n transition: transform 0.4s ease;\r\n background: var(--gray);\r\n }\r\n .project-img img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n object-position: center top;\r\n transition: transform 0.55s ease;\r\n }\r\n .project-card:hover .project-img img { transform: scale(1.04); }\r\n\r\n \/* Red overlay on hover *\/\r\n .project-img::after {\r\n content: '';\r\n position: absolute; inset: 0;\r\n background: var(--red);\r\n opacity: 0;\r\n transition: opacity 0.3s ease;\r\n mix-blend-mode: multiply;\r\n }\r\n .project-card:hover .project-img::after { opacity: 0.15; }\r\n\r\n .project-info {\r\n padding: 1.1rem 0 1.5rem;\r\n display: flex;\r\n align-items: flex-start;\r\n justify-content: space-between;\r\n gap: 1rem;\r\n }\r\n .project-tag {\r\n font-size: 0.6rem;\r\n letter-spacing: 0.2em;\r\n color: #e8000d !important;\r\n text-transform: uppercase;\r\n font-weight: 600;\r\n margin-bottom: 0.3rem;\r\n }\r\n .project-name {\r\n font-family: var(--font-title);\r\n font-size: 1.3rem;\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n letter-spacing: 0.02em;\r\n color: #ffffff !important;\r\n }\r\n .project-year {\r\n font-size: 0.68rem;\r\n color: #666666 !important;\r\n align-self: flex-end;\r\n padding-bottom: 0.15rem;\r\n white-space: nowrap;\r\n }\r\n\r\n \/* \"Ver proyecto\" bottom strip *\/\r\n .project-card::after {\r\n content: 'Ver proyecto \u2192';\r\n position: absolute;\r\n bottom: 0; left: 0; right: 0;\r\n padding: 0.85rem var(--pad);\r\n background: var(--red);\r\n color: var(--white);\r\n font-family: var(--font-title);\r\n font-size: 0.78rem;\r\n font-weight: 700;\r\n letter-spacing: 0.12em;\r\n text-transform: uppercase;\r\n transform: translateY(100%);\r\n transition: transform 0.28s ease;\r\n }\r\n .project-card:hover::after,\r\n .project-card:focus-within::after { transform: translateY(0); }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n TICKER\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n .process-strip {\r\n background: var(--red);\r\n padding: 0.9rem 0;\r\n overflow: hidden;\r\n }\r\n .ticker-track {\r\n display: flex;\r\n gap: 2.5rem;\r\n width: max-content;\r\n animation: ticker 20s linear infinite;\r\n }\r\n .ticker-track span {\r\n font-family: var(--font-title);\r\n font-size: 0.72rem;\r\n font-weight: 700;\r\n letter-spacing: 0.15em;\r\n text-transform: uppercase;\r\n color: #ffffff !important;\r\n white-space: nowrap;\r\n }\r\n .ticker-track span.dot::before { content: '\u2726'; margin-right: 2.5rem; }\r\n @keyframes ticker {\r\n from { transform: translateX(0); }\r\n to { transform: translateX(-50%); }\r\n }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n ABOUT (off-white block)\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n #about {\r\n background: var(--off-white) !important;\r\n color: var(--black) !important;\r\n }\r\n #about .section-label { color: var(--red) !important; }\r\n #about .section-label::before { background: var(--red); }\r\n\r\n .about-top {\r\n display: flex;\r\n align-items: flex-end;\r\n justify-content: space-between;\r\n margin-bottom: 2rem;\r\n }\r\n .about-big {\r\n font-family: var(--font-title);\r\n font-size: clamp(3.5rem, 18vw, 6rem);\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n line-height: 0.85;\r\n color: var(--black) !important;\r\n }\r\n .about-arrow { flex-shrink: 0; width: 52px; margin-bottom: 0.5rem; }\r\n .about-arrow svg { width: 100%; height: auto; }\r\n\r\n .about-body {\r\n font-size: 0.92rem;\r\n line-height: 1.78;\r\n color: #1a1a1a !important;\r\n font-weight: 300;\r\n max-width: 400px;\r\n margin-bottom: 2rem;\r\n }\r\n .about-body strong { font-weight: 600; color: #000000 !important; }\r\n .about-body em {\r\n font-style: normal;\r\n display: inline-block;\r\n border-bottom: 1.5px solid var(--red);\r\n color: #e8000d !important;\r\n }\r\n\r\n .about-stats {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 1px;\r\n background: #ddd;\r\n border: 1px solid #ddd;\r\n margin-top: 2.5rem;\r\n }\r\n .stat-cell { background: var(--off-white); padding: 1.1rem 1rem; }\r\n .stat-num {\r\n font-family: var(--font-title);\r\n font-size: 2rem;\r\n font-weight: 700;\r\n color: var(--black) !important;\r\n line-height: 1;\r\n margin-bottom: 0.2rem;\r\n }\r\n .stat-num sup { font-size: 0.9rem; }\r\n .stat-label {\r\n font-size: 0.62rem;\r\n letter-spacing: 0.16em;\r\n text-transform: uppercase;\r\n color: #777;\r\n }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n SERVICES ACCORDION\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n #services { background: var(--black); }\r\n\r\n .services-heading {\r\n font-family: var(--font-title);\r\n font-size: clamp(1.9rem, 8vw, 3rem);\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n margin-bottom: 0.6rem;\r\n line-height: 1;\r\n color: #ffffff !important;\r\n }\r\n .services-sub {\r\n font-size: 0.82rem;\r\n color: var(--muted);\r\n margin-bottom: 2.5rem;\r\n }\r\n\r\n .accordion-list { display: flex; flex-direction: column; }\r\n details { border-top: 1px solid var(--gray); }\r\n details:last-child { border-bottom: 1px solid var(--gray); }\r\n\r\n summary {\r\n list-style: none;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 1.3rem 0;\r\n cursor: pointer;\r\n user-select: none;\r\n gap: 1rem;\r\n transition: var(--ease);\r\n }\r\n summary::-webkit-details-marker { display: none; }\r\n\r\n .summary-inner { display: flex; align-items: center; gap: 1rem; }\r\n .sum-index {\r\n font-size: 0.6rem;\r\n color: var(--red);\r\n font-weight: 600;\r\n letter-spacing: 0.1em;\r\n min-width: 22px;\r\n }\r\n .sum-title {\r\n font-family: var(--font-title);\r\n font-size: 1.15rem;\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n letter-spacing: 0.03em;\r\n color: var(--white) !important;\r\n transition: color 0.25s;\r\n }\r\n .sum-icon {\r\n width: 28px; height: 28px;\r\n border: 1.5px solid var(--gray);\r\n border-radius: 50%;\r\n display: flex; align-items: center; justify-content: center;\r\n flex-shrink: 0;\r\n font-size: 0.9rem;\r\n color: var(--red);\r\n transition: var(--ease);\r\n }\r\n details[open] .sum-icon { transform: rotate(45deg); background: var(--red); color: var(--white); border-color: var(--red); }\r\n details[open] .sum-title { color: var(--red) !important; }\r\n\r\n .accordion-body { padding: 0 0 1.8rem 2.4rem; }\r\n .accordion-body p {\r\n font-size: 0.85rem;\r\n color: #999 !important;\r\n font-weight: 300;\r\n line-height: 1.7;\r\n margin-bottom: 1rem;\r\n }\r\n .service-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }\r\n .s-tag {\r\n font-size: 0.6rem;\r\n letter-spacing: 0.12em;\r\n text-transform: uppercase;\r\n padding: 0.3rem 0.7rem;\r\n border: 1px solid var(--gray);\r\n color: var(--muted);\r\n border-radius: 2px;\r\n transition: var(--ease);\r\n }\r\n details[open] .s-tag:hover { border-color: var(--red); color: var(--red); }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n CONTACT \/ FOOTER\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n #contact {\r\n background: var(--black);\r\n padding: 4rem var(--pad) 2.5rem;\r\n border-top: 1px solid var(--gray);\r\n }\r\n\r\n .contact-eyebrow {\r\n font-size: 0.62rem;\r\n letter-spacing: 0.24em;\r\n text-transform: uppercase;\r\n color: var(--red);\r\n font-weight: 600;\r\n margin-bottom: 1rem;\r\n }\r\n .contact-heading {\r\n font-family: var(--font-title);\r\n font-size: clamp(2.5rem, 13vw, 5rem);\r\n font-weight: 700;\r\n text-transform: uppercase;\r\n line-height: 0.95;\r\n margin-bottom: 1.6rem;\r\n color: #ffffff !important;\r\n }\r\n .contact-heading .qmark { color: var(--red); }\r\n\r\n .contact-sub {\r\n font-size: 0.88rem;\r\n color: var(--muted);\r\n font-weight: 300;\r\n margin-bottom: 2.5rem;\r\n max-width: 300px;\r\n line-height: 1.65;\r\n }\r\n .contact-cta {\r\n display: inline-block;\r\n padding: 1rem 2.2rem;\r\n border: 1.5px solid var(--red);\r\n color: var(--red);\r\n font-family: var(--font-title);\r\n font-weight: 700;\r\n font-size: 0.85rem;\r\n letter-spacing: 0.12em;\r\n text-transform: uppercase;\r\n transition: var(--ease);\r\n background: transparent;\r\n margin-bottom: 3rem;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n .contact-cta::after {\r\n content: '';\r\n position: absolute; inset: 0;\r\n background: var(--red);\r\n transform: translateX(-101%);\r\n transition: transform 0.3s ease;\r\n z-index: 0;\r\n }\r\n .contact-cta:hover { color: var(--white); }\r\n .contact-cta:hover::after { transform: translateX(0); }\r\n .contact-cta span { position: relative; z-index: 1; }\r\n\r\n .social-row {\r\n display: flex;\r\n align-items: center;\r\n border-top: 1px solid var(--gray);\r\n border-bottom: 1px solid var(--gray);\r\n margin-bottom: 2.5rem;\r\n }\r\n .social-link {\r\n flex: 1;\r\n padding: 1rem 0;\r\n text-align: center;\r\n font-family: var(--font-title);\r\n font-size: 0.72rem;\r\n font-weight: 700;\r\n letter-spacing: 0.1em;\r\n text-transform: uppercase;\r\n color: var(--muted);\r\n border-right: 1px solid var(--gray);\r\n transition: var(--ease);\r\n }\r\n .social-link:last-child { border-right: none; }\r\n .social-link:hover { color: var(--red); background: rgba(232,0,13,0.04); }\r\n\r\n .footer-bottom {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 1rem;\r\n }\r\n .footer-brand {\r\n font-family: var(--font-title);\r\n font-size: 0.75rem;\r\n font-weight: 700;\r\n letter-spacing: 0.06em;\r\n color: var(--muted);\r\n text-transform: uppercase;\r\n }\r\n .footer-brand strong { color: var(--red); }\r\n .footer-copy { font-size: 0.6rem; color: #333; }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n FAB\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n .fab {\r\n position: fixed;\r\n bottom: 1.5rem; right: 1.5rem;\r\n z-index: 150;\r\n width: 52px; height: 52px;\r\n background: var(--red);\r\n color: var(--white) !important;\r\n border-radius: 50%;\r\n display: flex; align-items: center; justify-content: center;\r\n font-size: 1.1rem;\r\n box-shadow: 0 4px 24px rgba(232,0,13,0.4);\r\n transition: var(--ease);\r\n }\r\n .fab:hover { transform: scale(1.12) rotate(10deg); box-shadow: 0 6px 32px rgba(232,0,13,0.6); }\r\n\r\n \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n FADE-UP ANIMATION\r\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n .fade-up {\r\n opacity: 0;\r\n transform: translateY(28px);\r\n transition: opacity 0.65s ease, transform 0.65s ease;\r\n }\r\n .fade-up.visible { opacity: 1; transform: translateY(0); }\r\n\r\n \/* \u2500\u2500\u2500 DESKTOP BREAKPOINTS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n @media (min-width: 600px) {\r\n :root { --pad: 2.2rem; }\r\n .hero-title { font-size: clamp(3rem, 8vw, 5.5rem); }\r\n .work-heading { font-size: clamp(2rem, 6vw, 3.5rem); }\r\n .about-big { font-size: clamp(4rem, 14vw, 7rem); }\r\n .contact-heading { font-size: clamp(3rem, 10vw, 6rem); }\r\n .about-stats { grid-template-columns: repeat(4, 1fr); }\r\n .project-img { aspect-ratio: 16\/9; }\r\n }\r\n @media (min-width: 900px) {\r\n :root { --pad: 4rem; }\r\n .hero { min-height: 100vh; }\r\n }\r\n <\/style>\r\n<\/head>\r\n\r\n<body>\r\n\r\n <div class=\"page-transition\" id=\"pageTransition\"><\/div>\r\n\r\n <nav class=\"site-nav\" id=\"siteNav\">\r\n <div class=\"nav-top\">\r\n <a href=\"#\" class=\"nav-brand\">conhache<span>.design<\/span><\/a>\r\n <button class=\"nav-toggle\" id=\"navToggle\" aria-label=\"Abrir men\u00fa\">\r\n <span><\/span><span><\/span><span><\/span>\r\n <\/button>\r\n <\/div>\r\n <div class=\"nav-menu\" id=\"navMenu\">\r\n <div class=\"nav-links\">\r\n <a href=\"#identidad\" class=\"nav-link\" data-target=\"identidad\">\r\n <span class=\"nav-link-num\">01<\/span>\r\n <span class=\"nav-link-text\">Identidad Visual<\/span>\r\n <span class=\"nav-link-arrow\">\u2192<\/span>\r\n <\/a>\r\n <a href=\"#publicidad\" class=\"nav-link\" data-target=\"publicidad\">\r\n <span class=\"nav-link-num\">02<\/span>\r\n <span class=\"nav-link-text\">Publicidad<\/span>\r\n <span class=\"nav-link-arrow\">\u2192<\/span>\r\n <\/a>\r\n <a href=\"#editorial\" class=\"nav-link\" data-target=\"editorial\">\r\n <span class=\"nav-link-num\">03<\/span>\r\n <span class=\"nav-link-text\">Editorial<\/span>\r\n <span class=\"nav-link-arrow\">\u2192<\/span>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/nav>\r\n\r\n <a href=\"mailto:hola@conhache.design\" class=\"fab\" aria-label=\"Contactar\">\u2709<\/a>\r\n\r\n <section class=\"hero\">\r\n <div class=\"hero-inner\">\r\n <p class=\"hero-eyebrow\">Dise\u00f1o gr\u00e1fico \u00b7 Branding \u00b7 Visual<\/p>\r\n <h1 class=\"hero-title\">\r\n TRANSFORMO<br>IDEAS EN\r\n <span class=\"line-accent\"><span class=\"circled\">IMPACTO<\/span><br>VISUAL.<\/span>\r\n <\/h1>\r\n <p class=\"hero-sub\">Identidad visual estrat\u00e9gica que conecta marcas con las personas que las necesitan.<\/p>\r\n <a href=\"#work\" class=\"hero-cta\"><span>Ver trabajos<\/span><\/a>\r\n <div class=\"scroll-hint\">\r\n <span>Scroll<\/span>\r\n <div class=\"scroll-line\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"work\">\r\n <p class=\"section-label\">Proyectos seleccionados<\/p>\r\n <div class=\"work-heading fade-up\">\r\n <span class=\"num\">2025 \/ 2026<\/span>\r\n PORTFOLIO\r\n <\/div>\r\n\r\n <div class=\"project-list\">\r\n <article class=\"project-card fade-up\" id=\"identidad\">\r\n <a href=\"#\" tabindex=\"0\">\r\n <div class=\"project-img\">\r\n <img decoding=\"async\" src=\"https:\/\/erguezhacha.estaciondiseno.es\/wp-content\/uploads\/2026\/06\/LOGO-NUEVO.png\" alt=\"Proyecto Identidad Visual \u2014 Urban Poster Mockup\" loading=\"lazy\" \/>\r\n <\/div>\r\n <div class=\"project-info\">\r\n <div class=\"project-info-left\">\r\n <p class=\"project-tag\">Branding \u00b7 Identidad Visual<\/p>\r\n <h2 class=\"project-name\">Mexicano Taquer\u00edas<\/h2>\r\n <\/div>\r\n <span class=\"project-year\">2025<\/span>\r\n <\/div>\r\n <\/a>\r\n <\/article>\r\n\r\n <article class=\"project-card fade-up\" id=\"publicidad\">\r\n <a href=\"#\" tabindex=\"0\">\r\n <div class=\"project-img\">\r\n <img decoding=\"async\" src=\"https:\/\/erguezhacha.estaciondiseno.es\/wp-content\/uploads\/2026\/05\/pacakaging-e1780511422216.png\" alt=\"Proyecto Publicidad\" loading=\"lazy\" \/>\r\n <\/div>\r\n <div class=\"project-info\">\r\n <div class=\"project-info-left\">\r\n <p class=\"project-tag\">Campa\u00f1a Publicitaria<\/p>\r\n <h2 class=\"project-name\">Propuesta Festival MILNOFF<\/h2>\r\n <\/div>\r\n <span class=\"project-year\">2026<\/span>\r\n <\/div>\r\n <\/a>\r\n <\/article>\r\n\r\n <article class=\"project-card fade-up\" id=\"editorial\">\r\n <a href=\"#\" tabindex=\"0\">\r\n <div class=\"project-img\">\r\n <img decoding=\"async\" src=\"https:\/\/erguezhacha.estaciondiseno.es\/wp-content\/uploads\/2026\/05\/22340de1-1-scaled.png\" alt=\"Proyecto Editorial\" loading=\"lazy\" \/>\r\n <\/div>\r\n <div class=\"project-info\">\r\n <div class=\"project-info-left\">\r\n <p class=\"project-tag\">Editorial<\/p>\r\n <h2 class=\"project-name\">Serie Carteler\u00eda \"Pueblo\"<\/h2>\r\n\t\t\t\t <img decoding=\"async\" src=\"https:\/\/erguezhacha.estaciondiseno.es\/wp-content\/uploads\/2026\/05\/TINAJAS-copiaPUBLIS-PUE.png\" alt=\"Proyecto Editorial\" loading=\"lazy\" \/>\r\n <\/div>\r\n <span class=\"project-year\">2026<\/span>\r\n <\/div>\r\n <\/a>\r\n <\/article>\r\n <\/div>\r\n <\/section>\r\n\r\n <div class=\"process-strip\" aria-hidden=\"true\">\r\n <div class=\"ticker-track\">\r\n <span>Dise\u00f1o con car\u00e1cter<\/span>\r\n <span class=\"dot\">Identidad visual<\/span>\r\n <span class=\"dot\">Branding estrat\u00e9gico<\/span>\r\n <span class=\"dot\">Dise\u00f1o de impacto<\/span>\r\n <span class=\"dot\">conhache.design<\/span>\r\n <span>Dise\u00f1o con car\u00e1cter<\/span>\r\n <span class=\"dot\">Identidad visual<\/span>\r\n <span class=\"dot\">Branding estrat\u00e9gico<\/span>\r\n <span class=\"dot\">Dise\u00f1o de impacto<\/span>\r\n <span class=\"dot\">conhache.design<\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n <section id=\"about\">\r\n <p class=\"section-label\">Sobre m\u00ed<\/p>\r\n <div class=\"about-top\">\r\n <p class=\"about-big\">About<\/p>\r\n <div class=\"about-arrow\">\r\n <svg viewBox=\"0 0 60 60\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n <path d=\"M8 48 C12 30 32 14 50 10\" stroke=\"#e8000d\" stroke-width=\"2\" stroke-linecap=\"round\" fill=\"none\"\/>\r\n <path d=\"M42 6 L50 10 L45 18\" stroke=\"#e8000d\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" fill=\"none\"\/>\r\n <\/svg>\r\n <\/div>\r\n <\/div>\r\n <p class=\"about-body fade-up\">\r\n Soy dise\u00f1adora gr\u00e1fica especializada en <strong>identidad visual y publicidad<\/strong>. Creo sistemas visuales con <em>personalidad propia<\/em> que hacen que las marcas se vean, se sientan y se recuerden de verdad. Cada proyecto es una oportunidad de construir algo que dure.\r\n <\/p>\r\n <\/section>\r\n\r\n <section id=\"services\">\r\n <p class=\"section-label\">Qu\u00e9 hago<\/p>\r\n <h2 class=\"services-heading fade-up\">SERVICIOS<\/h2>\r\n <p class=\"services-sub fade-up\">Selecciona para explorar cada \u00e1rea.<\/p>\r\n\r\n <div class=\"accordion-list\">\r\n <details open>\r\n <summary>\r\n <div class=\"summary-inner\">\r\n <span class=\"sum-index\">01<\/span>\r\n <span class=\"sum-title\">Identidad Visual<\/span>\r\n <\/div>\r\n <div class=\"sum-icon\">+<\/div>\r\n <\/summary>\r\n <div class=\"accordion-body\">\r\n <p>Creaci\u00f3n de identidades visuales completas: logotipo, tipograf\u00eda, colores, sistema de aplicaciones. Dise\u00f1o que define qui\u00e9n eres antes de que digas una sola palabra.<\/p>\r\n <div class=\"service-tags\">\r\n <span class=\"s-tag\">Dise\u00f1o de logotipo<\/span>\r\n <span class=\"s-tag\">Identidad visual<\/span>\r\n <span class=\"s-tag\">Naming<\/span>\r\n <span class=\"s-tag\">Branding<\/span>\r\n <span class=\"s-tag\">Adaptaciones a RRSS<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/details>\r\n\r\n <details>\r\n <summary>\r\n <div class=\"summary-inner\">\r\n <span class=\"sum-index\">02<\/span>\r\n <span class=\"sum-title\">Publicidad<\/span>\r\n <\/div>\r\n <div class=\"sum-icon\">+<\/div>\r\n <\/summary>\r\n <div class=\"accordion-body\">\r\n <p>Desarrollo de campa\u00f1as publicitarias creativas e impactantes tanto digitales como impresas, optimizadas para captar la atenci\u00f3n de tu p\u00fablico objetivo.<\/p>\r\n <div class=\"service-tags\">\r\n <span class=\"s-tag\">Campa\u00f1as creativas<\/span>\r\n <span class=\"s-tag\">Carteler\u00eda<\/span>\r\n <span class=\"s-tag\">Copywriting<\/span>\r\n <span class=\"s-tag\">Direcci\u00f3n de arte<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/details>\r\n\r\n <details>\r\n <summary>\r\n <div class=\"summary-inner\">\r\n <span class=\"sum-index\">03<\/span>\r\n <span class=\"sum-title\">Editorial<\/span>\r\n <\/div>\r\n <div class=\"sum-icon\">+<\/div>\r\n <\/summary>\r\n <div class=\"accordion-body\">\r\n <p>Maquetaci\u00f3n y dise\u00f1o de publicaciones tanto impresas como digitales. Cuidado riguroso de la tipograf\u00eda, la composici\u00f3n y el ritmo visual para crear lecturas impecables.<\/p>\r\n <div class=\"service-tags\">\r\n <span class=\"s-tag\">Dise\u00f1o de cat\u00e1logos<\/span>\r\n <span class=\"s-tag\">Revistas<\/span>\r\n <span class=\"s-tag\">Libros<\/span>\r\n <span class=\"s-tag\">Memorias corporativas<\/span>\r\n <span class=\"s-tag\">Artes finales<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/details>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"contact\">\r\n <p class=\"contact-eyebrow\">\u00bfTienes un proyecto en mente?<\/p>\r\n <h2 class=\"contact-heading\">Habla<span class=\"qmark\">mos?<\/span><\/h2>\r\n <p class=\"contact-sub\">Si buscas dise\u00f1o estrat\u00e9gico y con car\u00e1cter, hablemos y hagamos que suceda.<\/p>\r\n <a href=\"mailto:conhache.desgin@gmail.com\" class=\"contact-cta\"><span>Escr\u00edbeme<\/span><\/a>\r\n <div class=\"social-row\">\r\n <a href=\"#\" class=\"https:\/\/www.instagram.com\/conhache.design?utm_source=ig_web_button_share_sheet&igsh=ZDNlZDc0MzIxNw==\">Instagram<\/a>\r\n <a href=\"#\" class=\"www.linkedin.com\/in\/elena-rodr\u00edguez-hacha-32ba913b9\">LinkedIn<\/a>\r\n <\/div>\r\n <div class=\"footer-bottom\">\r\n <div class=\"footer-brand\">conhache<strong>.design<\/strong><\/div>\r\n <div class=\"footer-copy\">\u00a9 2026 \u2014 Todos los derechos reservados<\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <\/div>\r\n\r\n <script>\r\n \/\/ L\u00f3gica para abrir\/cerrar el men\u00fa hamburguesa\r\n const toggle = document.getElementById('navToggle');\r\n const menu = document.getElementById('navMenu');\r\n if(toggle && menu) {\r\n toggle.addEventListener('click', () => {\r\n toggle.classList.toggle('open');\r\n menu.classList.toggle('open');\r\n });\r\n }\r\n\r\n \/\/ Animaci\u00f3n b\u00e1sica de fade-up con IntersectionObserver\r\n const fadeElements = document.querySelectorAll('.fade-up');\r\n const observer = new IntersectionObserver((entries) => {\r\n entries.forEach(entry => {\r\n if(entry.isIntersecting) {\r\n entry.target.classList.add('visible');\r\n }\r\n });\r\n }, { threshold: 0.1 });\r\n fadeElements.forEach(el => observer.observe(el));\r\n <\/script>\r\n<\/body>\r\n<\/html><\/div>\n\t\t\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":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","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":"default","ast-page-background-enabled":"default","ast-page-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":"","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-4)","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-4)","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-4)","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-380","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/wp-json\/wp\/v2\/pages\/380","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/wp-json\/wp\/v2\/comments?post=380"}],"version-history":[{"count":7,"href":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/wp-json\/wp\/v2\/pages\/380\/revisions"}],"predecessor-version":[{"id":389,"href":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/wp-json\/wp\/v2\/pages\/380\/revisions\/389"}],"wp:attachment":[{"href":"https:\/\/erguezhacha.estaciondiseno.es\/index.php\/wp-json\/wp\/v2\/media?parent=380"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}