/* ============================================================
   ZYRA · v44 — REDISEÑO
   Capa que va encima de zyra.css: composición centrada, luz
   violeta líquida (Aurora), titulares palabra a palabra,
   cintas y bucles entre secciones (ScrollVelocity, LogoLoop,
   CurvedLoop), tarjetas con luz que sigue al cursor (MagicBento).
   Mismos colores, logos y tipografía. Todo lo nuevo vive aquí.
   ============================================================ */

:root{
  --fx-ease:cubic-bezier(.16,1,.3,1);
  --fx-ease-soft:cubic-bezier(.22,1,.36,1);
  --fx-radius:24px;
  --fx-card:linear-gradient(160deg,var(--panel-a),var(--panel-b));
  --fx-ring:rgba(196,181,253,.95);
  --fx-ring-2:rgba(124,58,237,.5);
  --fx-fill:rgba(168,85,247,.12);
  --fx-tape:linear-gradient(90deg,#5B21B6 0%,#7C3AED 35%,#A855F7 65%,#7C3AED 100%);
}
[data-theme="light"]{
  --fx-ring:rgba(124,58,237,.85);
  --fx-ring-2:rgba(147,51,234,.35);
  --fx-fill:rgba(124,58,237,.07);
}

/* ── Arranque: el titular del hero espera a dividirse ── */
html.fx-pending .hero__title,
html.fx-pending .phero__title{opacity:0}

/* ════════════════════════════════════════════════════════
   1 · TITULARES PALABRA A PALABRA (BlurText / SplitText)
   ════════════════════════════════════════════════════════ */
.fx-split,
.fx-split em,
.fx-split .line__in{background:none !important;text-shadow:none !important}
.fx-split .line{overflow:visible}
.fx-w{
  display:inline-block;
  /* aire para que el degradado no recorte acentos ni descendentes */
  padding:.06em .05em .12em 0;margin:-.06em -.05em -.12em 0;
  will-change:auto;
}
/* Colores por palabra: el degradado vive en cada palabra para poder moverlas */
.hero__title.fx-split .fx-w,
.h-display.fx-split .fx-w,
.phero__title.fx-split .fx-w{
  background:var(--grad-title);-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
}
.fx-split .fx-w--em,
.hero__title.fx-split .fx-w--em,
.h-display.fx-split .fx-w--em,
.phero__title.fx-split .fx-w--em{
  background:var(--grad-accent);background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
}
/* Puntuación pegada a una palabra destacada: conserva el color normal */
.fx-punct{background:none;-webkit-text-fill-color:var(--fx-punct,var(--text));color:var(--fx-punct,var(--text))}
.hero__title,.h-display,.phero__title{--fx-punct:var(--title-a)}
/* En los titulares de sección la palabra destacada va en gris (decisión v41) */
h2.h-section.fx-split .fx-w--em,
.trust .h-display.fx-split .fx-w--em{
  background:none;color:var(--title-soft);-webkit-text-fill-color:var(--title-soft);
}
/* GradientText: el violeta del hero respira despacio */
.hero__title.fx-split .fx-w--em,
.phero__title.fx-split .fx-w--em{animation:fx-grad 7s ease-in-out infinite alternate}
@keyframes fx-grad{from{background-position:0% 50%}to{background-position:100% 50%}}

/* Entrada */
.fx-on .fx-split .fx-w{
  transition:
    opacity .9s var(--fx-ease) calc(min(var(--i) * 55ms, 1100ms) + var(--d,0ms)),
    filter 1s var(--fx-ease) calc(min(var(--i) * 55ms, 1100ms) + var(--d,0ms)),
    transform 1.1s var(--fx-ease) calc(min(var(--i) * 55ms, 1100ms) + var(--d,0ms));
}
.fx-on .fx-split:not(.is-in):not(.fx-scrollreveal) .fx-w{
  opacity:0;filter:blur(12px);transform:translate3d(0,.42em,0) rotate(2deg);
}
.hero__title{--d:120ms}

/* FadeContent: párrafos y enlaces entran enfocándose */
.fx-on .fx-fade{
  transition:opacity .9s var(--fx-ease) .12s,filter .9s var(--fx-ease) .12s,transform 1s var(--fx-ease) .12s;
}
.fx-on .fx-fade:not(.is-in){opacity:0;filter:blur(8px);transform:translate3d(0,18px,0)}

/* ════════════════════════════════════════════════════════
   2 · LUZ DE FONDO (Aurora WebGL) + rejilla
   ════════════════════════════════════════════════════════ */
.fx-aurora-host{position:relative;isolation:isolate}
.fx-aurora{
  position:absolute;left:0;top:0;width:100%;height:100%;z-index:-2;pointer-events:none;
  opacity:0;transition:opacity 1.8s ease;
}
.has-aurora > .fx-aurora{opacity:1}
.fx-aurora{
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 96%);
          mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 96%);
}
.band > .fx-aurora{-webkit-mask-image:linear-gradient(0deg,#000 0%,#000 40%,transparent 100%);mask-image:linear-gradient(0deg,#000 0%,#000 40%,transparent 100%)}
.hero > .fx-aurora{height:min(100%,125svh)}
.phero > .fx-aurora{height:100%;opacity:.0}
.phero.has-aurora > .fx-aurora{opacity:.85}
.band > .fx-aurora{transform:scaleY(-1)}
[data-theme="light"] .fx-aurora{mix-blend-mode:multiply}
[data-theme="light"] .has-aurora > .fx-aurora{opacity:.55}
/* Con aurora, los halos estáticos de antes sobran */
.has-aurora > .hero__glow,.has-aurora > .phero__glow,.has-aurora > .band__glow,.has-aurora > .lost__glow{opacity:.35}

/* Rejilla fina que se desvanece hacia los bordes */
.hero::before,.phero::before{
  content:"";position:absolute;left:0;right:0;top:0;height:min(100%,110svh);z-index:-1;pointer-events:none;
  background-image:
    linear-gradient(to right,var(--line) 1px,transparent 1px),
    linear-gradient(to bottom,var(--line) 1px,transparent 1px);
  background-size:76px 76px;background-position:center top;
  -webkit-mask-image:radial-gradient(ellipse 62% 58% at 50% 38%,#000 15%,transparent 72%);
          mask-image:radial-gradient(ellipse 62% 58% at 50% 38%,#000 15%,transparent 72%);
  opacity:.7;
}
.phero::before{opacity:.5}

/* ════════════════════════════════════════════════════════
   3 · HERO CENTRADO + VÍDEO QUE SE ENDEREZA (ContainerScroll)
   ════════════════════════════════════════════════════════ */
.hero{
  min-height:auto;text-align:center;overflow:hidden;
  padding:clamp(132px,19vh,210px) var(--pad) clamp(30px,6vh,80px);
}
.hero__grid{
  grid-template-columns:minmax(0,1fr) !important;justify-items:center;
  gap:clamp(44px,8vh,96px);perspective:1400px;
}
.hero__lead{display:flex;flex-direction:column;align-items:center;max-width:min(100%,1180px);margin-inline:auto}
.hero__title{
  max-width:none;font-size:clamp(2.75rem,8vw,7.6rem);line-height:.98;letter-spacing:-.055em;
  text-align:center;text-wrap:balance;
}
@media (min-width:1081px){.hero__title{font-size:clamp(4rem,7.4vw,7.6rem)}}
.hero__title .line{display:block}
.hero__copy{margin-inline:auto;text-align:center;max-width:58ch;font-size:clamp(1.02rem,1.25vw,1.2rem)}
.hero__cta{justify-content:center}
.hero__glow{left:50%;top:6%;transform:translateX(-50%)}
.hero__scroll{display:none}

.showcase{
  justify-self:center;width:min(100%,1120px);margin:0;padding:0;
  perspective:1600px;
}
.showcase{--cs:1}
.showcase__frame{
  transform-origin:50% 0;
  transform:
    translate3d(0,calc((1 - var(--cs)) * 40px),0)
    rotateX(calc((1 - var(--cs)) * 26deg))
    scale(calc(.9 + var(--cs) * .1));
  border-radius:20px;
  box-shadow:
    0 0 0 1px rgba(245,247,250,.06),
    0 50px 120px -40px rgba(0,0,0,.95),
    0 30px 90px -30px rgba(124,58,237,.55),
    inset 0 1px 0 rgba(255,255,255,.09);
  will-change:transform;
}
.showcase__glow{left:10%;width:80%;top:-6%;height:90%}
.showcase__arc{left:-6%;width:112%;bottom:-14%}
.showcase__bar{padding:12px 16px}
@media (max-width:820px){
  /* En móvil el vídeo no se descarga: se ve el póster */
  .showcase{display:block;width:100%}
  .showcase__frame{border-radius:14px}
  .hero{padding-bottom:clamp(20px,4vh,40px)}
}
@media (prefers-reduced-motion:reduce){.showcase__frame{transform:none}}

/* ════════════════════════════════════════════════════════
   4 · BOTÓN PRINCIPAL CON BORDE DE LUZ (StarBorder)
   ════════════════════════════════════════════════════════ */
@property --fx-a{syntax:"<angle>";inherits:false;initial-value:0deg}
.hero__cta .btn--light,.band__cta .btn--light,.lost__cta.btn--light,.form__send.btn--light{
  box-shadow:0 0 0 1px rgba(196,181,253,.35),0 14px 40px -14px rgba(168,85,247,.75);
}
.hero__cta .btn--light::after,.band__cta .btn--light::after,.lost__cta.btn--light::after{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.6px;pointer-events:none;z-index:2;
  background:conic-gradient(from var(--fx-a),transparent 0 62%,rgba(196,181,253,.0) 66%,#C4B5FD 78%,#7C3AED 86%,transparent 92%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:fx-spin 3.4s linear infinite;
}
@keyframes fx-spin{to{--fx-a:360deg}}
.hero__cta .btn,.band__cta .btn{padding:15px 28px;font-size:1rem}

/* ════════════════════════════════════════════════════════
   5 · CINTAS ENTRE SECCIONES (ScrollVelocity)
   ════════════════════════════════════════════════════════ */
.fx-velo{
  position:relative;padding:clamp(56px,9vh,110px) 0;overflow:hidden;direction:ltr;
  pointer-events:none;user-select:none;
}
.fx-velo__row{position:relative;width:112%;margin-left:-6%;overflow:hidden;white-space:nowrap}
.fx-velo__row--a{
  z-index:2;transform:rotate(-2.6deg);background:var(--fx-tape);color:#fff;
  padding:.5em 0;box-shadow:0 24px 60px -24px rgba(124,58,237,.75),inset 0 1px 0 rgba(255,255,255,.25);
}
.fx-velo__row--b{
  z-index:1;transform:rotate(1.8deg);margin-top:-1.1em;
  background:var(--deep);border-block:1px solid var(--line-2);color:var(--text);padding:.5em 0;
}
.fx-velo__track{display:flex;width:max-content;will-change:transform}
.fx-velo__set{
  display:flex;align-items:center;flex:none;gap:.55em;padding-right:.55em;
  font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,3.6vw,3.2rem);
  letter-spacing:-.035em;line-height:1.05;
}
.fx-velo__set span{unicode-bidi:plaintext}
.fx-velo__row--b .fx-velo__set span:nth-child(4n+1){color:transparent;-webkit-text-stroke:1.2px var(--muted)}
.fx-velo__set svg{width:.62em;height:.62em;flex:none;fill:currentColor;opacity:.9}
.fx-velo__row--b .fx-velo__set svg{fill:var(--violet-lit)}
[dir="rtl"] .fx-velo__set{letter-spacing:0}

/* ════════════════════════════════════════════════════════
   6 · TECNOLOGÍAS EN BUCLE (LogoLoop)
   ════════════════════════════════════════════════════════ */
.fx-logos{padding:clamp(64px,10vh,120px) 0;text-align:center;direction:ltr}
.fx-logos__label{
  direction:inherit;font-family:var(--mono);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);margin-bottom:clamp(24px,4vh,40px);padding-inline:var(--pad);
}
[dir="rtl"] .fx-logos__label{direction:rtl;letter-spacing:0;font-family:var(--sans);font-size:.95rem;text-transform:none}
.fx-logos__viewport{
  display:flex;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
}
.fx-logos__track{
  display:flex;flex:none;gap:14px;padding-right:14px;margin:0;list-style:none;
  animation:fx-loop 48s linear infinite;
}
.fx-logos.is-paused .fx-logos__track{animation-play-state:paused}
@keyframes fx-loop{to{transform:translate3d(-100%,0,0)}}
.fx-logo{
  display:flex;align-items:center;gap:12px;flex:none;
  padding:12px 20px 12px 14px;border:1px solid var(--line);border-radius:16px;
  background:var(--fx-card);font-size:.95rem;font-weight:500;color:var(--muted);
  transition:color .4s ease,border-color .4s ease,transform .5s var(--fx-ease);
}
.fx-logo{color:var(--text)}
/* v10: los logos siempre con su color real */
.fx-logo img{width:30px;height:30px;object-fit:contain;filter:none;opacity:1;transition:transform .5s var(--fx-ease)}
.fx-logo--dark img{filter:invert(1) brightness(1.15)}
.fx-logo:hover{border-color:rgba(168,85,247,.45);transform:translateY(-3px)}
.fx-logo:hover img{transform:scale(1.12) rotate(-4deg)}
[data-theme="light"] .fx-logo--dark img{filter:none}

/* ════════════════════════════════════════════════════════
   7 · FRASE EN CURVA (CurvedLoop)
   ════════════════════════════════════════════════════════ */
.fx-curve{
  position:relative;overflow:hidden;direction:ltr;user-select:none;pointer-events:none;
  padding:clamp(10px,3vh,40px) 0;
}
.fx-curve svg{display:block;width:100%;height:clamp(130px,15vw,230px);overflow:visible}
.fx-curve__text{
  font-family:var(--display);font-weight:600;font-size:66px;letter-spacing:-2.2px;
  fill:var(--text);
}
[dir="rtl"] .fx-curve__text{letter-spacing:0}
.fx-curve__star{fill:var(--violet-lit)}
.fx-curve__path-line{fill:none;stroke:var(--line);stroke-width:1}

/* ════════════════════════════════════════════════════════
   8 · TARJETAS CON LUZ (MagicBento / SpotlightCard)
   ════════════════════════════════════════════════════════ */
.fx-glow{isolation:isolate}
.fx-spot{
  position:absolute !important;inset:0;z-index:-1 !important;border-radius:inherit;pointer-events:none;
  opacity:var(--glow,0);transition:opacity .45s ease;
}
.fx-spot::before,.fx-spot::after{content:"";position:absolute;inset:0;border-radius:inherit}
.fx-spot::before{
  background:radial-gradient(460px circle at var(--mx,50%) var(--my,50%),var(--fx-fill),transparent 62%);
}
.fx-spot::after{
  padding:1px;
  background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),var(--fx-ring),var(--fx-ring-2) 34%,transparent 66%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
}

/* Las tarjetas sencillas pasan a ser paneles */
.pillar,.card{
  position:relative;padding:clamp(22px,2.4vw,32px);border:1px solid var(--line);border-radius:22px;
  background:var(--fx-card);transition:translate .6s var(--fx-ease),border-color .4s ease;
}
.pillar:hover,.card:hover{translate:0 -4px}
.card{border-top:1px solid var(--line)}
.pillar h3,.card h3{font-size:1.18rem;margin-bottom:12px}

/* ════════════════════════════════════════════════════════
   9 · COMPOSICIÓN CENTRADA DE LAS SECCIONES
   ════════════════════════════════════════════════════════ */
.shead{margin-inline:auto;text-align:center;max-width:1000px}
.shead__lead{margin-inline:auto}
.h-section{font-size:clamp(2.3rem,5.4vw,4.8rem);line-height:1;text-wrap:balance}

/* Manifiesto (ScrollReveal) */
.manifesto{text-align:center;padding-top:clamp(70px,10vh,140px)}
.manifesto__text{margin-inline:auto;max-width:27ch;font-size:clamp(1.5rem,3.3vw,2.9rem);line-height:1.18;text-wrap:balance}
.fx-scrollreveal{transform:rotate(calc((1 - var(--p,1)) * 2.5deg));transform-origin:0 50%}
.fx-scrollreveal .fx-w{will-change:opacity,filter,transform}
.fx-scrollreveal.is-static .fx-w{opacity:1;filter:none;transform:none}
.manifesto__text mark.hl .fx-w{background:none}
.pillars{
  border-top:0;padding-top:0;text-align:start;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);
  max-width:1180px;margin-inline:auto;
}

/* Qué hacemos */
.services{background:transparent;border-block:0}
.services__head{flex-direction:column;align-items:center;text-align:center;gap:14px}
.service{border-radius:28px}

/* Por dónde empezar: bento 4 columnas */
.pricing{background:transparent;border-block:0}
.rates{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,18px);
  border-top:0;max-width:1240px;margin-inline:auto;
}
.rate,.rate:hover{
  display:flex;flex-direction:column;align-items:flex-start;gap:12px;
  padding:clamp(24px,2.4vw,34px);border:1px solid var(--line);border-radius:var(--fx-radius);
  background:var(--fx-card);min-height:230px;
  transition:translate .6s var(--fx-ease),border-color .4s ease;
}
.rate:hover{translate:0 -4px}
.rate::before{display:none}
.rate:nth-child(1),.rate:nth-child(6){grid-column:span 2}
.rate h3{font-size:clamp(1.3rem,2vw,1.75rem)}
.rate .alink{margin-top:auto}
.rate p{order:0;grid-column:auto}
.rate:nth-child(1){background:
  radial-gradient(120% 140% at 100% 0%,rgba(124,58,237,.22),transparent 55%),var(--fx-card)}
.rate:nth-child(6){background:
  radial-gradient(120% 140% at 0% 100%,rgba(124,58,237,.2),transparent 55%),var(--fx-card)}
@media (max-width:1080px){
  .rates{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rate:nth-child(1),.rate:nth-child(6){grid-column:span 2}
}
@media (max-width:620px){
  .rates{grid-template-columns:1fr}
  .rate:nth-child(1),.rate:nth-child(6){grid-column:auto}
  .rate{min-height:0}
}

/* Proceso: cabecera centrada y línea de tiempo en el centro */
.process{grid-template-columns:minmax(0,1fr);justify-items:center}
.process__sticky{position:static;display:flex;flex-direction:column;align-items:center;text-align:center;max-width:900px}
.process__note{margin-inline:auto}
.process__sticky .shead{margin-bottom:0}
@media (min-width:901px){
  .steps{
    width:min(100%,1080px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:clamp(70px,9vw,140px);row-gap:clamp(10px,3vh,30px);padding-left:0;padding-right:0;
    margin-top:clamp(30px,6vh,70px);
  }
  .steps__line{left:50% !important;right:auto !important;transform:translateX(-50%)}
  .step{grid-column:1;text-align:end;padding:clamp(18px,2vw,26px) 0}
  .step:nth-child(even){grid-column:2;text-align:start;margin-top:clamp(50px,9vh,110px)}
  .step p{margin-inline-start:auto}
  .step:nth-child(even) p{margin-inline-start:0}
  .step::before{
    left:auto !important;right:auto !important;top:calc(clamp(18px,2vw,26px) + .5em);
    inset-inline-end:calc(clamp(70px,9vw,140px) / -2 - 6px) !important;inset-inline-start:auto !important;
    width:12px;height:12px;
  }
  .step:nth-child(even)::before{
    inset-inline-start:calc(clamp(70px,9vw,140px) / -2 - 6px) !important;inset-inline-end:auto !important;
  }
  .step__n{font-size:.9rem}
}
@media (max-width:900px){
  .steps{width:min(100%,640px);margin-top:clamp(30px,5vh,50px)}
}

/* Por qué nosotros */
.why .cards{max-width:1240px;margin-inline:auto;gap:clamp(14px,1.6vw,22px)}
@media (min-width:1081px){.why .cards{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Transparencia */
.trust__grid{grid-template-columns:minmax(0,1fr) !important;justify-items:center;text-align:center}
.trust__lead{display:flex;flex-direction:column;align-items:center;max-width:980px}
.trust__lead p{margin-inline:auto}
.promises{
  width:min(100%,1240px);grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,18px);
  margin-top:clamp(20px,4vh,40px);margin-inline:auto;text-align:start;
}
.shead + .lead,.shead + .lead--wide{margin-inline:auto;text-align:center}
.promises li,.promises--wide li{
  flex-direction:column;gap:18px;align-items:flex-start;
  padding:clamp(20px,2vw,28px);border:1px solid var(--line);border-radius:20px;background:var(--fx-card);
  font-size:1.04rem;line-height:1.4;
}
.promises li .mono{
  display:grid;place-items:center;width:38px;height:38px;border-radius:12px;
  background:rgba(124,58,237,.14);border:1px solid rgba(168,85,247,.3);font-size:.78rem;
}
@media (max-width:1080px){.promises{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.promises{grid-template-columns:1fr}}

/* Opiniones y preguntas */
.reviews{text-align:center}
.reviews .shead,.reviews__head{margin-inline:auto;text-align:center}
.reviews__empty{margin-inline:auto}
.reviews__bar{justify-content:center}
.reviews__list{text-align:start;max-width:1240px;margin-inline:auto;grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),390px));justify-content:center}
.faq{background:transparent;border-block:0}
.faq__list{
  margin-inline:auto;max-width:880px;display:grid;gap:10px;border-top:0;
}
.qa{
  border:1px solid var(--line);border-radius:18px;padding:0 clamp(18px,2.2vw,28px);
  background:var(--soft);transition:border-color .4s ease,background .4s ease;
}
.qa:hover{border-color:var(--line-2)}
.qa[open]{border-color:rgba(168,85,247,.38);background:linear-gradient(160deg,rgba(124,58,237,.08),var(--soft))}
.qa summary i{width:28px;height:28px;flex:0 0 28px;border-radius:99px;border:1px solid var(--line-2)}
.qa summary i::before,.qa summary i::after{left:7px;width:13px}

/* Contacto */
.unfold__cue{margin-inline:auto}

/* Banda de cierre */
.band{text-align:center;border-top:0}
.band .h-display{margin-inline:auto;max-width:18ch}
.band p{margin-inline:auto}
.band__cta{justify-content:center}

/* Textos legales: columna centrada, lectura alineada a la izquierda */
.prose{margin-inline:auto}

/* Hero de páginas interiores */
.phero{text-align:center;overflow:hidden;padding-bottom:clamp(60px,10vh,120px)}
.phero .crumb{justify-content:center}
.phero__title{margin-inline:auto;max-width:18ch;font-size:clamp(2.8rem,7vw,6.4rem);text-wrap:balance}
.phero__lead{margin-inline:auto}
.phero__glow{left:50%;transform:translateX(-50%)}

/* ════════════════════════════════════════════════════════
   10 · NAVEGACIÓN FLOTANTE, PROGRESO Y PIE
   ════════════════════════════════════════════════════════ */
@media (min-width:821px){
  .nav{transition:background .5s ease,backdrop-filter .5s ease,padding .5s var(--fx-ease),border-color .5s ease,
       top .5s var(--fx-ease),left .5s var(--fx-ease),right .5s var(--fx-ease),border-radius .5s var(--fx-ease),transform .45s var(--fx-ease)}
  .nav.is-stuck{
    top:12px;left:clamp(12px,3vw,48px);right:clamp(12px,3vw,48px);border-radius:999px;
    border:1px solid var(--line-2);padding:10px 12px 10px 22px;
    box-shadow:0 20px 50px -30px rgba(0,0,0,.8);
  }
  [dir="rtl"] .nav.is-stuck{padding:10px 22px 10px 12px}
  .nav.is-hidden{transform:translateY(calc(-100% - 24px))}
}

.fx-progress{
  position:fixed;left:0;right:0;top:0;height:2px;z-index:90;pointer-events:none;
  background:var(--grad-accent);transform:scaleX(0);transform-origin:0 50%;
  box-shadow:0 0 12px rgba(168,85,247,.7);
}
[dir="rtl"] .fx-progress{transform-origin:100% 50%}

.footer{position:relative;overflow:hidden;background:var(--deep)}
/* v10 · ZYRA del pie: luz que recorre las letras (violeta → blanco → lila)
   y un foco que sigue al cursor. Se desvanece hacia abajo con una máscara. */
@property --wm-x{syntax:"<percentage>";inherits:true;initial-value:0%}
@property --spot{syntax:"<number>";inherits:true;initial-value:0}
.fx-wordmark{
  --mx:50%;--my:50%;--spot:0;
  position:relative;display:block;text-align:center;font-family:var(--display);font-weight:700;
  font-size:clamp(5rem,25vw,24rem);line-height:.78;letter-spacing:-.07em;
  margin:clamp(10px,2vh,30px) 0 -.11em;padding:0 var(--pad);
  background:
    radial-gradient(circle 22vw at var(--mx) var(--my),rgba(255,255,255,calc(var(--spot) * .95)),transparent 70%),
    linear-gradient(100deg,#5B21B6 0%,#7C3AED 18%,#C4B5FD 30%,#FFFFFF 36%,#C4B5FD 42%,#A855F7 56%,#7C3AED 72%,#F5F7FA 82%,#7C3AED 92%,#5B21B6 100%);
  background-size:100% 100%,260% 100%;
  background-position:0 0,var(--wm-x) 50%;
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 38%,rgba(0,0,0,.35) 72%,transparent 96%);
          mask-image:linear-gradient(180deg,#000 0%,#000 38%,rgba(0,0,0,.35) 72%,transparent 96%);
  isolation:isolate;
  animation:fx-wm 9s linear infinite;
  user-select:none;pointer-events:none;
  transition:--spot .5s ease;
}
@keyframes fx-wm{from{--wm-x:0%}to{--wm-x:100%}}
/* Halo: una copia desenfocada detrás de las letras, que respira */
.fx-wordmark::before{
  content:"ZYRA";position:absolute;inset:0;z-index:-1;padding:inherit;
  background:none;-webkit-text-fill-color:rgba(124,58,237,.75);color:rgba(124,58,237,.75);
  filter:blur(38px);opacity:.45;animation:fx-wm-glow 4.5s ease-in-out infinite;pointer-events:none;
}
@keyframes fx-wm-glow{0%,100%{opacity:.3}50%{opacity:.7}}
.fx-wordmark.is-in{animation:fx-wm 9s linear infinite,fx-wm-in 1.4s var(--fx-ease) both}
@keyframes fx-wm-in{from{opacity:0;transform:translateY(18%) scale(.96);letter-spacing:.02em}to{opacity:1;transform:none;letter-spacing:-.07em}}
[data-theme="light"] .fx-wordmark{
  background:
    radial-gradient(circle 22vw at var(--mx) var(--my),rgba(124,58,237,calc(var(--spot) * .6)),transparent 70%),
    linear-gradient(100deg,#4C1D95 0%,#7C3AED 20%,#A855F7 34%,#DDD6FE 40%,#9333EA 52%,#6D28D9 70%,#C4B5FD 82%,#4C1D95 100%);
  background-size:100% 100%,260% 100%;background-position:0 0,var(--wm-x) 50%;
  -webkit-background-clip:text;background-clip:text;
}
.fx-on .fx-wordmark:not(.is-in){opacity:0}
@media (prefers-reduced-motion:reduce){.fx-wordmark,.fx-wordmark.is-in,.fx-wordmark::before{animation:none}.fx-on .fx-wordmark:not(.is-in){opacity:1}}

/* v10 · El cuestionario termina en el formulario de contacto */
.qnext{
  display:grid;gap:8px;justify-items:start;
  margin-top:26px;padding-top:24px;border-top:1px solid var(--line);
}
.qnext__go{margin-top:12px;gap:10px}
.qnext__go svg{transition:transform .4s var(--fx-ease)}
.qnext__go:hover svg{transform:translateY(3px)}
@media (max-width:620px){.qnext__go{justify-self:stretch;justify-content:center}}
.forms.is-prefilled{animation:fx-prefill 2.6s var(--fx-ease)}
@keyframes fx-prefill{
  0%{box-shadow:0 0 0 0 rgba(168,85,247,0)}
  18%{box-shadow:0 0 0 3px rgba(168,85,247,.75),0 0 60px -6px rgba(168,85,247,.6)}
  100%{box-shadow:0 0 0 0 rgba(168,85,247,0)}
}

/* ════════════════════════════════════════════════════════
   11 · RESPONSIVE, RTL Y MOVIMIENTO REDUCIDO
   ════════════════════════════════════════════════════════ */
@media (max-width:1080px){
  .pillars{grid-template-columns:minmax(0,1fr)}
}
@media (min-width:621px) and (max-width:1080px){
  .pillars{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:620px){
  .hero{padding-top:clamp(116px,17vh,150px)}
  .hero__title{font-size:clamp(2.55rem,11.5vw,3.6rem);letter-spacing:-.045em}
  .fx-velo{padding:44px 0}
  .fx-velo__row{width:130%;margin-left:-15%}
  .fx-logo{padding:10px 16px 10px 12px;font-size:.88rem}
  .fx-logo img{width:24px;height:24px}
  .h-section{font-size:clamp(2.1rem,9vw,3rem)}
}
[dir="rtl"] .hero__title{letter-spacing:0;line-height:1.25}
[dir="rtl"] .fx-w{padding-top:.12em;margin-top:-.12em}
[dir="rtl"] .fx-scrollreveal{transform-origin:100% 50%;transform:rotate(calc((1 - var(--p,1)) * -2.5deg))}

@media (prefers-reduced-motion:reduce){
  .fx-split .fx-w,.fx-fade{opacity:1 !important;filter:none !important;transform:none !important}
  .fx-logos__track{animation:none}
  .hero__cta .btn--light::after,.band__cta .btn--light::after,.lost__cta.btn--light::after{animation:none}
  .hero__title.fx-split .fx-w--em{animation:none}
}
@media print{
  .fx-aurora,.fx-velo,.fx-logos,.fx-curve,.fx-progress,.fx-wordmark{display:none !important}
  .fx-w,.fx-fade{opacity:1 !important;filter:none !important;transform:none !important}
}
