/* ========================================================= Movimiento «Elegancia Arcana» (tema josecuy) Clases globales de Elementor: jc-hero-entrada, jc-reveal, jc-reveal-grupo, jc-linea. Solo actúa si tiene .jc-motion (JS disponible y sin movimiento reducido). ========================================================= */ :root { --jc-ease-out: cubic-bezier(0.22, 1, 0.36, 1); --jc-enter-y: 12px; --jc-enter-blur: 4px; } /* Hero: entrada única al cargar (el H1 solo se desplaza: no retrasa el LCP) */ @keyframes jc-enter { from { opacity: 0; transform: translateY(var(--jc-enter-y)); filter: blur(var(--jc-enter-blur)); } } @keyframes jc-enter-move { from { transform: translateY(var(--jc-enter-y)); } } html.jc-motion .jc-hero-entrada > * { animation: jc-enter 560ms var(--jc-ease-out) both; animation-delay: calc(100ms + var(--jc-i, 0) * 80ms); } html.jc-motion .jc-hero-entrada > h1 { animation-name: jc-enter-move; } /* Aparición al entrar en pantalla (una sola vez) */ html.jc-motion .jc-reveal:not(.is-done), html.jc-motion .jc-reveal-grupo:not(.is-done) > * { opacity: 0; transform: translateY(var(--jc-enter-y)); filter: blur(var(--jc-enter-blur)); transition: opacity 520ms var(--jc-ease-out), transform 520ms var(--jc-ease-out), filter 520ms var(--jc-ease-out); } html.jc-motion .jc-reveal-grupo:not(.is-done) > * { transition-delay: calc(var(--jc-i, 0) * 70ms); } html.jc-motion .jc-reveal.is-visible:not(.is-done), html.jc-motion .jc-reveal-grupo.is-visible:not(.is-done) > * { opacity: 1; transform: none; filter: none; } /* Índices de escalonado (máx. 6 pasos: ~420 ms) */ .jc-hero-entrada > :nth-child(2), .jc-reveal-grupo > :nth-child(2) { --jc-i: 1; } .jc-hero-entrada > :nth-child(3), .jc-reveal-grupo > :nth-child(3) { --jc-i: 2; } .jc-hero-entrada > :nth-child(4), .jc-reveal-grupo > :nth-child(4) { --jc-i: 3; } .jc-hero-entrada > :nth-child(5), .jc-reveal-grupo > :nth-child(5) { --jc-i: 4; } .jc-hero-entrada > :nth-child(6), .jc-reveal-grupo > :nth-child(6) { --jc-i: 5; } .jc-hero-entrada > :nth-child(n+7), .jc-reveal-grupo > :nth-child(n+7) { --jc-i: 6; } /* Recorridos: el filete dorado se dibuja de izquierda a derecha */ html.jc-motion .jc-linea { position: relative; } html.jc-motion .jc-linea::before { content: ''; position: absolute; top: -1px; left: 0; width: 100%; height: 1px; background: #C9A76A; transform: scaleX(0); transform-origin: left center; transition: transform 800ms var(--jc-ease-out); pointer-events: none; } html.jc-motion .jc-linea.is-visible::before { transform: scaleX(1); } /* Preguntas frecuentes: la respuesta aparece al abrir */ @keyframes jc-faq-in { from { opacity: 0; transform: translateY(-4px); } } html.jc-motion .jc-faq-acc details[open] > p { animation: jc-faq-in 240ms var(--jc-ease-out); } /* Movimiento reducido: todo estático, contenido siempre visible */ @media (prefers-reduced-motion: reduce) { html.jc-motion .jc-hero-entrada > *, html.jc-motion .jc-faq-acc details[open] > p { animation: none; } html.jc-motion .jc-reveal, html.jc-motion .jc-reveal-grupo > * { opacity: 1 !important; transform: none !important; filter: none !important; transition: none !important; } html.jc-motion .jc-linea::before { transform: scaleX(1); transition: none; } }