/* ============================================================================
   TEST WEB QUE CONVIERTE · conversion.felincore.com
   Sistema visual heredado de felincore.com (tokens --fx-*)
   ============================================================================ */

/* ---------- 1) FUENTES LOCALES ---------- */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 700;font-stretch:100%;font-display:swap;
  src:url(../fonts/bricolage-grotesque-400-700-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:400 700;font-stretch:100%;font-display:swap;
  src:url(../fonts/bricolage-grotesque-400-700-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Schibsted Grotesk';font-style:normal;font-weight:400 700;font-stretch:100%;font-display:swap;
  src:url(../fonts/schibsted-grotesk-400-700-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Schibsted Grotesk';font-style:normal;font-weight:400 700;font-stretch:100%;font-display:swap;
  src:url(../fonts/schibsted-grotesk-400-700-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/space-mono-400-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/space-mono-400-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;
  src:url(../fonts/space-mono-700-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ---------- 2) TOKENS (idénticos a felincore.com) ---------- */
:root{
  --fx-bg:#08080a; --fx-bg-soft:#0c0c0f; --fx-bg-header:#08080a;
  --fx-ink:#f4f5f7; --fx-ink-2:#b8bbc2; --fx-ink-3:#82868f; --fx-ink-4:#5a5e67;
  --fx-line:rgba(255,255,255,.09); --fx-line-2:rgba(255,255,255,.16);
  --fx-btn-bg:#ffffff; --fx-btn-text:#0a0a0c; --fx-btn-ghost-txt:#f4f5f7;
  --fx-whatsapp:#25D366;
  --fx-font-body:"Schibsted Grotesk",sans-serif;
  --fx-font-display:"Bricolage Grotesque",sans-serif;
  --fx-font-mono:"Space Mono",monospace;
  --fx-radius:18px; --fx-radius-sm:12px; --fx-radius-pill:999px;
  --fx-maxw:1240px; --fx-pad:clamp(20px,5vw,64px);
  --fx-grain:.5;
  --fx-h1:clamp(40px,6.4vw,86px); --fx-h2:clamp(30px,4.4vw,56px);
  --fx-h3:clamp(22px,2.4vw,30px); --fx-h4:clamp(19px,1.8vw,23px);
  --fx-h5:17px; --fx-h6:12px;
  --fx-metal-gradient:linear-gradient(178deg,#ffffff 0%,#e7e9ec 16%,#9b9ea4 37%,#ffffff 52%,#7e8187 68%,#c9ccd1 84%,#ffffff 100%);
  /* semáforo de diagnóstico */
  --fx-crit:#ff5f56; --fx-warn:#ffa13d;
  --fx-mid:#f5c542; --fx-good:#4ade80;
  /* movimiento */
  --fx-ease:cubic-bezier(.2,.8,.2,1);
  --fx-ease-out:cubic-bezier(.16,1,.3,1);
  --fx-ease-back:cubic-bezier(.34,1.4,.5,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{
  margin:0;background:var(--fx-bg);color:var(--fx-ink);
  font-family:var(--fx-font-body);font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
::selection{background:#fff;color:#000;}

h1,h2,h3,h4,h5,h6{font-family:var(--fx-font-display);color:var(--fx-ink);margin:0 0 .4em;text-wrap:balance;}
h1{font-weight:700;font-size:var(--fx-h1);line-height:1.02;letter-spacing:-.02em;}
h2{font-weight:600;font-size:var(--fx-h2);line-height:1.06;letter-spacing:-.02em;}
h3{font-weight:600;font-size:var(--fx-h3);line-height:1.15;letter-spacing:-.01em;}
h4{font-weight:600;font-size:var(--fx-h4);line-height:1.25;}
h5{font-weight:600;font-size:var(--fx-h5);line-height:1.3;}
h6{font-family:var(--fx-font-mono);font-weight:400;font-size:var(--fx-h6);line-height:1.4;letter-spacing:.18em;text-transform:uppercase;color:var(--fx-ink-3);}
p{margin:0 0 1em;color:var(--fx-ink-2);}
strong,b{color:#fff;font-weight:600;}
small{color:var(--fx-ink-3);}
a{color:var(--fx-ink);text-decoration:none;transition:color .2s ease;}
a:hover{color:#fff;}
img{max-width:100%;height:auto;display:block;}

:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:6px;}

/* ---------- 3) EFECTOS ---------- */
.fx-metal{background:var(--fx-metal-gradient);-webkit-background-clip:text;background-clip:text;color:transparent;}
.fx-metal-soft{background:linear-gradient(180deg,#ffffff,#cfd2d7 60%,#9a9da3);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* Aurora de fondo: dos capas que respiran muy despacio */
body::before{
  content:"";position:fixed;inset:-10%;pointer-events:none;z-index:0;
  background:
    radial-gradient(60% 38% at 50% 4%,rgba(255,255,255,.10),transparent 70%),
    radial-gradient(40% 30% at 88% 20%,rgba(255,255,255,.055),transparent 70%),
    radial-gradient(50% 40% at 6% 72%,rgba(255,255,255,.045),transparent 70%);
  animation:aurora 24s ease-in-out infinite alternate;
}
@keyframes aurora{
  0%  {transform:translate3d(0,0,0) scale(1);opacity:.85;}
  50% {transform:translate3d(-1.5%,1.5%,0) scale(1.06);opacity:1;}
  100%{transform:translate3d(1.5%,-1%,0) scale(1.02);opacity:.9;}
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;
  opacity:var(--fx-grain);mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  background-size:240px 240px;
}
.site{position:relative;z-index:1;}

/* ---------- 3b) SISTEMA DE APARICIÓN AL HACER SCROLL ---------- */
[data-reveal]{
  opacity:0;transform:translateY(22px);
  transition:opacity .72s var(--fx-ease-out) var(--d,0ms),transform .72s var(--fx-ease-out) var(--d,0ms);
  will-change:opacity,transform;
}
[data-reveal="scale"]{transform:translateY(16px) scale(.965);}
[data-reveal="left"]{transform:translateX(-24px);}
[data-reveal="right"]{transform:translateX(24px);}
[data-reveal].is-in{opacity:1;transform:none;will-change:auto;}
.no-reveal [data-reveal]{opacity:1;transform:none;}

/* Brillo que sigue al puntero sobre las tarjetas */
.glow{position:relative;isolation:isolate;}
.glow::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(240px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.12),transparent 65%);
  opacity:0;transition:opacity .35s ease;z-index:-1;
}
.glow:hover::after{opacity:1;}

/* ---------- 4) LAYOUT ---------- */
.fx-wrap{max-width:var(--fx-maxw);margin-inline:auto;padding-inline:var(--fx-pad);}
.fx-wrap--narrow{max-width:880px;}
.fx-kicker{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--fx-font-mono);font-size:11.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--fx-ink-3);
  padding:7px 13px 7px 11px;border:1px solid var(--fx-line);
  border-radius:var(--fx-radius-pill);background:rgba(255,255,255,.02);
  transition:border-color .3s ease,color .3s ease;
}
.fx-kicker:hover{border-color:var(--fx-line-2);color:var(--fx-ink-2);}
.fx-kicker::before{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--fx-ink);
  box-shadow:0 0 10px 1px rgba(255,255,255,.7);animation:pulseDot 2.6s ease-in-out infinite;
}
@keyframes pulseDot{
  0%,100%{opacity:1;box-shadow:0 0 10px 1px rgba(255,255,255,.7);}
  50%    {opacity:.55;box-shadow:0 0 14px 2px rgba(255,255,255,.35);}
}
.fx-lede{font-size:clamp(16px,1.5vw,19px);color:var(--fx-ink-2);line-height:1.6;max-width:62ch;}

/* ---------- 5) HEADER ---------- */
.site-header{
  position:sticky;top:0;z-index:50;background:rgba(8,8,10,.82);
  backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom:1px solid var(--fx-line);
}
.site-header__in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:66px;}
.brand{display:flex;align-items:center;gap:11px;}
.brand img{width:30px;height:30px;transition:transform .5s var(--fx-ease-back);}
.brand:hover img{transform:rotate(-8deg) scale(1.08);}
.brand__name{font-family:var(--fx-font-display);font-weight:700;font-size:17px;letter-spacing:-.01em;color:#fff;}
.brand__sep{width:1px;height:18px;background:var(--fx-line-2);}
.brand__tag{font-family:var(--fx-font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--fx-ink-3);}
@media (max-width:620px){.brand__sep,.brand__tag{display:none;}}

/* ---------- 6) BOTONES ---------- */
.fx-btn{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;
  font-family:var(--fx-font-body);font-weight:600;font-size:15px;line-height:1;
  padding:14px 22px;border-radius:var(--fx-radius-pill);
  border:1px solid var(--fx-btn-bg);background:var(--fx-btn-bg);color:var(--fx-btn-text);
  text-decoration:none;text-align:center;
  transition:transform .25s var(--fx-ease),background .25s,box-shadow .25s,color .25s,border-color .25s,opacity .2s;
}
/* Destello que barre el botón al pasar por encima.
   El botón blanco necesita un barrido oscuro; los oscuros, uno claro. */
.fx-btn::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(110deg,transparent 30%,rgba(10,10,12,.12) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .7s var(--fx-ease-out);
}
.fx-btn:hover::before{transform:translateX(120%);}
.fx-btn > *{position:relative;}
.fx-btn:hover{transform:translateY(-2px);box-shadow:0 14px 44px -10px rgba(255,255,255,.45);color:var(--fx-btn-text);}
.fx-btn:active{transform:translateY(1px) scale(.99);}
.fx-btn[disabled],.fx-btn[aria-disabled="true"]{opacity:.4;pointer-events:none;}
.fx-btn--ghost{background:rgba(255,255,255,.03);color:var(--fx-btn-ghost-txt);border-color:var(--fx-line-2);}
.fx-btn--ghost::before{background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.16) 50%,transparent 70%);}
.fx-btn--ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3);color:#fff;box-shadow:none;}
.fx-btn--wa{background:var(--fx-whatsapp);color:#06210f;border-color:var(--fx-whatsapp);}
.fx-btn--wa::before{background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);}
.fx-btn--wa:hover{filter:brightness(1.08);color:#06210f;box-shadow:0 14px 44px -10px rgba(37,211,102,.5);}
.fx-btn--sm{padding:10px 16px;font-size:13.5px;}
.fx-btn--lg{padding:17px 30px;font-size:16px;}
.fx-btn .fx-arr{transition:transform .3s var(--fx-ease-back);}
.fx-btn:hover .fx-arr{transform:translateX(4px);}
/* Latido suave del CTA principal para llamar la atención sin molestar */
.fx-btn--pulse{animation:ctaPulse 3.6s ease-in-out infinite;}
.fx-btn--pulse:hover{animation:none;}
@keyframes ctaPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.22);}
  50%    {box-shadow:0 0 0 14px rgba(255,255,255,0);}
}

/* ---------- 7) TARJETAS ---------- */
.fx-card{
  position:relative;border:1px solid var(--fx-line);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012));
  border-radius:var(--fx-radius);padding:28px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 60px -40px rgba(0,0,0,.9);
}
.fx-badge{
  display:inline-block;font-family:var(--fx-font-mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;padding:5px 10px;border-radius:var(--fx-radius-pill);
  border:1px solid var(--fx-line-2);color:var(--fx-ink);background:rgba(255,255,255,.05);
  transition:transform .25s var(--fx-ease-back),background .25s,border-color .25s;
}
.fx-badge:hover{transform:translateY(-2px);background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.28);}

/* ---------- 8) FORM ---------- */
input[type="text"],input[type="email"],input[type="url"],input[type="tel"],textarea{
  width:100%;background:rgba(255,255,255,.03);border:1px solid var(--fx-line);
  border-radius:var(--fx-radius-sm);color:#fff;font-family:var(--fx-font-body);
  font-size:15px;padding:13px 15px;outline:none;
  transition:border-color .25s,background .25s,box-shadow .25s;
}
input:focus,textarea:focus{
  border-color:rgba(255,255,255,.34);background:rgba(255,255,255,.06);
  box-shadow:0 0 0 4px rgba(255,255,255,.06);
}
::placeholder{color:var(--fx-ink-4);}
label{display:block;font-size:13px;color:var(--fx-ink-3);margin-bottom:7px;font-weight:600;}
.field{display:block;text-align:left;}
.field__opt{color:var(--fx-ink-4);font-weight:400;}

/* ============================================================================
   PANTALLAS
   ============================================================================ */
.screen{display:none;}
.screen.is-active{display:block;animation:fadeUp .5s var(--fx-ease-out) both;}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}

/* ---------- INTRO ---------- */
.intro{padding-block:clamp(48px,8vw,96px) clamp(60px,9vw,110px);}
.intro__head{text-align:center;max-width:820px;margin-inline:auto;}
.intro h1{margin:22px 0 18px;}
.intro .fx-lede{margin-inline:auto;text-align:center;}
.intro__meta{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:26px 0 34px;}
.intro__field{max-width:420px;margin:0 auto 20px;text-align:left;}
.intro__cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center;}
.intro__cta--end{margin-top:clamp(44px,6vw,68px);}
.intro__note{margin-top:16px;text-align:center;font-size:13px;color:var(--fx-ink-4);}
.intro__resume{max-width:520px;margin:28px auto 0;text-align:left;animation:popIn .5s var(--fx-ease-back) both;}
.intro__resume h4{margin:0 0 8px;}
.intro__resume p{margin:0 0 18px;font-size:14.5px;}
.intro__resume-btns{display:flex;gap:10px;flex-wrap:wrap;}
@keyframes popIn{from{opacity:0;transform:translateY(12px) scale(.97);}to{opacity:1;transform:none;}}

.sec__head--center{text-align:center;margin-top:clamp(56px,8vw,96px);}
.sec__head--center h2{margin-top:18px;}
.sec__head--center .fx-lede{margin-inline:auto;}

/* Pilares: 6 tarjetas → 3×2 en escritorio, 2 en tablet, 1 en móvil.
   Nada de auto-fit: con 6 elementos dejaba filas huérfanas. */
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(48px,7vw,80px);}
@media (max-width:1000px){.pillars{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:600px) {.pillars{grid-template-columns:1fr;}}
.pillar-card{
  display:flex;flex-direction:column;padding:24px;
  border:1px solid var(--fx-line);border-radius:var(--fx-radius);
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .4s var(--fx-ease),border-color .4s ease,box-shadow .4s ease,background .4s ease;
}
.pillar-card:hover{
  transform:translateY(-5px);border-color:var(--fx-line-2);
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.015));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 26px 50px -34px rgba(0,0,0,1);
}
.pillar-card__top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;}
.pillar-card__n{font-family:var(--fx-font-mono);font-size:11px;letter-spacing:.14em;color:var(--fx-ink-4);transition:color .3s ease;}
.pillar-card:hover .pillar-card__n{color:var(--fx-ink-2);}
.pillar-card__w{font-family:var(--fx-font-mono);font-size:12px;color:#fff;background:rgba(255,255,255,.07);
  border:1px solid var(--fx-line-2);border-radius:var(--fx-radius-pill);padding:3px 9px;
  transition:transform .35s var(--fx-ease-back),background .3s ease;}
.pillar-card:hover .pillar-card__w{transform:scale(1.07);background:rgba(255,255,255,.13);}
.pillar-card h3{font-size:18px;margin:0 0 8px;}
.pillar-card p{font-size:13.5px;margin:0 0 18px;color:var(--fx-ink-3);line-height:1.55;}
/* Filo luminoso inferior que se dibuja al pasar el ratón */
.pillar-card__edge{
  display:block;height:1px;margin-top:auto;padding-top:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:scaleX(0);transform-origin:center;
  transition:transform .55s var(--fx-ease-out);
}
.pillar-card:hover .pillar-card__edge{transform:scaleX(1);}

/* Cómo funciona: 3 pasos, nunca 2+1 huérfano */
.howto{margin-top:clamp(44px,6vw,72px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
@media (max-width:860px){.howto{grid-template-columns:1fr;gap:14px;}}
.howto__item{
  display:flex;gap:15px;padding:22px;border-radius:var(--fx-radius);
  border:1px solid transparent;background:rgba(255,255,255,.015);
  transition:border-color .35s ease,background .35s ease,transform .35s var(--fx-ease);
}
.howto__item:hover{border-color:var(--fx-line);background:rgba(255,255,255,.04);transform:translateY(-3px);}
.howto__n{flex:0 0 auto;width:32px;height:32px;border-radius:50%;border:1px solid var(--fx-line-2);
  display:grid;place-items:center;font-family:var(--fx-font-mono);font-size:12px;color:#fff;background:rgba(255,255,255,.04);
  transition:background .35s ease,color .35s ease,transform .45s var(--fx-ease-back),border-color .35s ease;}
.howto__item:hover .howto__n{background:#fff;color:#08080a;border-color:#fff;transform:scale(1.1) rotate(-6deg);}
.howto__item h4{font-size:16px;margin:4px 0 6px;}
.howto__item p{font-size:14px;margin:0;color:var(--fx-ink-3);}

/* ---------- QUIZ ---------- */
.quiz{padding-block:clamp(26px,4vw,44px) clamp(60px,9vw,100px);}
.progress{position:sticky;top:66px;z-index:40;background:rgba(8,8,10,.86);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--fx-line);margin-bottom:clamp(28px,5vw,46px);
  animation:progressDrop .45s var(--fx-ease-out) both;}
@keyframes progressDrop{from{opacity:0;transform:translateY(-12px);}to{opacity:1;transform:none;}}
.progress__in{padding-block:13px;}
.progress__row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:10px;}
.progress__pillar{font-family:var(--fx-font-mono);font-size:11px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--fx-ink-2);display:flex;align-items:center;gap:8px;min-width:0;}
.progress__pillar span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.progress__dot{flex:0 0 auto;width:6px;height:6px;border-radius:50%;background:#fff;
  box-shadow:0 0 10px 1px rgba(255,255,255,.7);animation:pulseDot 2.6s ease-in-out infinite;}
.progress__count{font-family:var(--fx-font-mono);font-size:12px;color:var(--fx-ink-3);white-space:nowrap;}
.progress__count b{color:#fff;font-weight:400;display:inline-block;}
.progress__count b.is-tick{animation:tick .34s var(--fx-ease-back);}
@keyframes tick{0%{transform:translateY(-6px);opacity:0;}100%{transform:none;opacity:1;}}
.progress__track{position:relative;height:3px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;}
.progress__bar{position:relative;height:100%;width:0;border-radius:99px;background:var(--fx-metal-gradient);
  transition:width .55s var(--fx-ease);}
.progress__bar::after{
  content:"";position:absolute;inset:0;border-radius:99px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);
  animation:shimmer 2.2s linear infinite;
}
@keyframes shimmer{from{transform:translateX(-100%);}to{transform:translateX(100%);}}
.progress__steps{display:flex;gap:4px;margin-top:9px;}
.progress__step{flex:1;height:2px;border-radius:99px;background:rgba(255,255,255,.07);transition:background .4s ease,transform .4s var(--fx-ease);transform-origin:left;}
.progress__step.is-done{background:rgba(255,255,255,.55);}
.progress__step.is-current{background:#fff;transform:scaleY(1.8);}

.q{max-width:760px;margin-inline:auto;}
.q__num{font-family:var(--fx-font-mono);font-size:11.5px;letter-spacing:.2em;color:var(--fx-ink-4);text-transform:uppercase;}
.q__title{font-size:clamp(23px,3.2vw,34px);line-height:1.18;margin:14px 0 0;font-weight:600;}
.q__help{font-size:14.5px;color:var(--fx-ink-3);margin:14px 0 0;line-height:1.55;
  border-left:2px solid var(--fx-line-2);padding-left:14px;}
/* Entrada de la pregunta; la dirección la marca el JS (avanzar / volver) */
.q__anim{animation:qIn .42s var(--fx-ease-out) both;}
.q__anim--back{animation-name:qInBack;}
@keyframes qIn{from{opacity:0;transform:translate3d(26px,8px,0);}to{opacity:1;transform:none;}}
@keyframes qInBack{from{opacity:0;transform:translate3d(-26px,8px,0);}to{opacity:1;transform:none;}}

.opts{display:grid;gap:10px;margin:30px 0 0;}
.opt{
  position:relative;overflow:hidden;
  display:flex;align-items:center;gap:14px;width:100%;text-align:left;cursor:pointer;
  padding:16px 18px;border-radius:var(--fx-radius-sm);
  border:1px solid var(--fx-line);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));
  color:var(--fx-ink);font-family:var(--fx-font-body);font-size:15.5px;font-weight:500;
  transition:border-color .22s,background .22s,transform .22s var(--fx-ease),box-shadow .22s;
  animation:optIn .4s var(--fx-ease-out) both;animation-delay:calc(var(--i,0) * 55ms + 90ms);
}
@keyframes optIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.opt:hover{border-color:var(--fx-line-2);background:rgba(255,255,255,.06);transform:translateX(4px);}
.opt:active{transform:translateX(4px) scale(.995);}
.opt__key{
  flex:0 0 auto;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;
  font-family:var(--fx-font-mono);font-size:12px;color:var(--fx-ink-3);
  border:1px solid var(--fx-line-2);background:rgba(255,255,255,.04);
  transition:background .22s,color .22s,border-color .22s,transform .35s var(--fx-ease-back);
}
.opt:hover .opt__key{border-color:rgba(255,255,255,.34);color:var(--fx-ink);}
.opt__txt{flex:1;min-width:0;}
.opt__sub{display:block;font-size:12.5px;color:var(--fx-ink-4);font-weight:400;margin-top:2px;transition:color .22s;}
.opt.is-selected{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.10);
  box-shadow:0 0 0 1px rgba(255,255,255,.18),0 12px 30px -22px rgba(255,255,255,.7);}
.opt.is-selected .opt__key{background:#fff;color:#08080a;border-color:#fff;transform:scale(1.12);}
.opt.is-selected .opt__sub{color:var(--fx-ink-3);}
/* Onda que recorre la opción al elegirla */
.opt__ripple{
  position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:radial-gradient(120px circle at var(--rx,30px) 50%,rgba(255,255,255,.22),transparent 70%);
  opacity:0;
}
.opt.is-just-picked .opt__ripple{animation:ripple .55s var(--fx-ease-out);}
@keyframes ripple{0%{opacity:1;transform:scale(.6);}100%{opacity:0;transform:scale(1.6);}}

.q__nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:26px;flex-wrap:wrap;}
.q__hint{font-family:var(--fx-font-mono);font-size:11px;letter-spacing:.1em;color:var(--fx-ink-4);}
.q__hint kbd{font-family:inherit;border:1px solid var(--fx-line-2);border-radius:5px;padding:1px 5px;color:var(--fx-ink-3);}
@media (max-width:600px){.q__hint{display:none;}}
.linkbtn{background:none;border:0;padding:8px 2px;cursor:pointer;color:var(--fx-ink-3);
  font-family:var(--fx-font-body);font-size:14px;font-weight:500;transition:color .2s,transform .25s var(--fx-ease);}
.linkbtn:hover{color:#fff;transform:translateX(-3px);}

/* ---------- LOADER ---------- */
.calc{min-height:62vh;display:grid;place-items:center;text-align:center;padding-block:80px;}
.calc__ring{position:relative;width:86px;height:86px;margin:0 auto 30px;}
.calc__ring::before,.calc__ring::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 3px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 3px));
}
.calc__ring::before{background:conic-gradient(from 0deg,transparent 0deg,#fff 300deg,transparent 360deg);animation:spin 1.05s linear infinite;}
.calc__ring::after{inset:11px;background:conic-gradient(from 180deg,transparent 0deg,rgba(255,255,255,.45) 220deg,transparent 360deg);animation:spin 1.6s linear infinite reverse;}
@keyframes spin{to{transform:rotate(360deg);}}
.calc__step{font-family:var(--fx-font-mono);font-size:12.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--fx-ink-3);min-height:1.4em;}
.calc__list{list-style:none;margin:26px auto 0;padding:0;display:grid;gap:9px;text-align:left;max-width:330px;}
.calc__li{
  display:flex;align-items:center;gap:11px;font-size:13.5px;color:var(--fx-ink-4);
  opacity:.4;transform:translateY(6px);
  transition:opacity .4s ease,transform .4s var(--fx-ease-out),color .4s ease;
}
.calc__li.is-on{opacity:1;transform:none;color:var(--fx-ink-2);}
.calc__li.is-done{color:var(--fx-ink-3);}
.calc__tick{
  flex:0 0 auto;width:17px;height:17px;border-radius:50%;border:1px solid var(--fx-line-2);
  display:grid;place-items:center;font-size:9px;color:transparent;
  transition:background .35s ease,border-color .35s ease,color .35s ease,transform .45s var(--fx-ease-back);
}
.calc__li.is-done .calc__tick{background:#fff;border-color:#fff;color:#08080a;transform:scale(1.12);}

/* ---------- RESULTADOS ---------- */
.results{padding-block:clamp(30px,5vw,56px) clamp(60px,9vw,100px);}
.results__head{text-align:center;margin-bottom:clamp(26px,4vw,40px);}
.results__site{margin:14px 0 0;font-family:var(--fx-font-mono);font-size:13px;color:var(--fx-ink-3);}

.score{position:relative;overflow:hidden;
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(26px,5vw,52px);align-items:center;
  padding:clamp(26px,4vw,40px);border:1px solid var(--fx-line);border-radius:var(--fx-radius);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 30px 80px -50px rgba(0,0,0,1);}
@media (max-width:760px){.score{grid-template-columns:1fr;text-align:center;justify-items:center;gap:26px;}}
.gauge{position:relative;width:186px;height:186px;flex:0 0 auto;}
.gauge::before{
  content:"";position:absolute;inset:-14%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.14),transparent 62%);
  animation:halo 4.5s ease-in-out infinite;
}
@keyframes halo{0%,100%{opacity:.5;transform:scale(.96);}50%{opacity:1;transform:scale(1.04);}}
.gauge svg{position:relative;width:100%;height:100%;transform:rotate(-90deg);}
.gauge__bgc{fill:none;stroke:rgba(255,255,255,.08);stroke-width:9;}
.gauge__fg{fill:none;stroke:url(#gaugeGrad);stroke-width:9;stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(255,255,255,.35));
  transition:stroke-dashoffset 1.5s var(--fx-ease-out);}
.gauge__mid{position:absolute;inset:0;display:grid;place-content:center;text-align:center;}
.gauge__val{font-family:var(--fx-font-display);font-size:54px;font-weight:700;line-height:1;letter-spacing:-.03em;
  background:var(--fx-metal-gradient);-webkit-background-clip:text;background-clip:text;color:transparent;
  font-variant-numeric:tabular-nums;}
.gauge__max{font-family:var(--fx-font-mono);font-size:11px;letter-spacing:.18em;color:var(--fx-ink-4);margin-top:7px;}
.score__body h2{font-size:clamp(25px,3.4vw,40px);margin:12px 0 12px;}
.score__body p{font-size:clamp(15px,1.5vw,17.5px);margin:0;color:var(--fx-ink-2);max-width:52ch;}
@media (max-width:760px){.score__body p{margin-inline:auto;}}

.sec{margin-top:clamp(48px,7vw,80px);}
.sec__head{margin-bottom:26px;}
.sec__head h3{margin:12px 0 8px;}
.sec__head p{font-size:15px;margin:0;max-width:62ch;}

/* Barras por área */
.areas{display:grid;gap:12px;}
.area{padding:20px 22px;border:1px solid var(--fx-line);border-radius:var(--fx-radius-sm);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));
  transition:border-color .35s ease,background .35s ease,transform .35s var(--fx-ease);}
.area:hover{border-color:var(--fx-line-2);background:rgba(255,255,255,.05);transform:translateX(4px);}
.area__row{display:flex;align-items:center;gap:12px;margin-bottom:11px;flex-wrap:wrap;}
.area__dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 0 currentColor;
  animation:dotHalo 3s ease-in-out infinite;}
@keyframes dotHalo{0%,100%{box-shadow:0 0 6px 0 currentColor;}50%{box-shadow:0 0 12px 2px currentColor;}}
.area__name{font-family:var(--fx-font-display);font-weight:600;font-size:17px;flex:1;min-width:140px;}
.area__w{font-family:var(--fx-font-mono);font-size:11px;color:var(--fx-ink-4);letter-spacing:.08em;}
.area__score{font-family:var(--fx-font-mono);font-size:14px;color:#fff;white-space:nowrap;font-variant-numeric:tabular-nums;}
.area__score span{color:var(--fx-ink-4);font-size:11.5px;}
.area__track{position:relative;height:6px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden;}
.area__bar{position:relative;height:100%;width:0;border-radius:99px;
  transition:width 1.15s var(--fx-ease-out) var(--d,0ms);}
.area__bar::after{
  content:"";position:absolute;inset:0;border-radius:99px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  animation:shimmer 2.6s linear infinite;animation-delay:1s;
}
.area__note{font-size:13.5px;color:var(--fx-ink-3);margin:11px 0 0;line-height:1.5;}

/* Prioridades */
.prios{display:grid;gap:14px;}
.prio{position:relative;padding:24px 26px;border:1px solid var(--fx-line-2);border-radius:var(--fx-radius);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.014));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);overflow:hidden;
  transition:transform .4s var(--fx-ease),box-shadow .4s ease,border-color .4s ease;}
.prio:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.26);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 28px 60px -40px rgba(0,0,0,1);}
.prio::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--c,#fff);
  transform:scaleY(0);transform-origin:top;transition:transform .8s var(--fx-ease-out) var(--d,0ms);}
.prio.is-in::before,.is-in .prio::before{transform:scaleY(1);}
.prio:hover::before{box-shadow:0 0 18px 1px var(--c,#fff);}
.prio__top{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.prio__n{width:28px;height:28px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;
  background:#fff;color:#08080a;font-family:var(--fx-font-mono);font-size:12.5px;font-weight:700;
  transition:transform .4s var(--fx-ease-back);}
.prio:hover .prio__n{transform:scale(1.12) rotate(-8deg);}
.prio__tag{font-family:var(--fx-font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--c,#fff);border:1px solid currentColor;border-radius:var(--fx-radius-pill);padding:4px 9px;opacity:.9;}
.prio h4{margin:0 0 9px;font-size:clamp(18px,2vw,21px);}
.prio p{margin:0;font-size:15px;color:var(--fx-ink-2);line-height:1.6;}
.prio__q{margin-top:13px;padding-top:13px;border-top:1px solid var(--fx-line);
  font-size:13px;color:var(--fx-ink-4);font-style:italic;}

/* Plan completo */
.plan__group{border:1px solid var(--fx-line);border-radius:var(--fx-radius);margin-bottom:12px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.008));
  transition:border-color .3s ease;}
.plan__group:hover{border-color:var(--fx-line-2);}
.plan__sum{display:flex;align-items:center;gap:13px;padding:18px 22px;cursor:pointer;list-style:none;
  transition:background .25s;user-select:none;}
.plan__sum::-webkit-details-marker{display:none;}
.plan__sum:hover{background:rgba(255,255,255,.045);}
.plan__sum h4{margin:0;font-size:17px;flex:1;min-width:0;}
.plan__n{font-family:var(--fx-font-mono);font-size:11.5px;color:var(--fx-ink-3);white-space:nowrap;}
.plan__chev{width:9px;height:9px;border-right:1.6px solid var(--fx-ink-3);border-bottom:1.6px solid var(--fx-ink-3);
  transform:rotate(45deg) translateY(-2px);transition:transform .35s var(--fx-ease-back);flex:0 0 auto;}
details[open] .plan__chev{transform:rotate(-135deg) translateY(-2px);}
.plan__body{padding:0 22px 8px;}
details[open] .plan__body{animation:planOpen .4s var(--fx-ease-out) both;}
@keyframes planOpen{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:none;}}
.plan__item{padding:17px 0;border-top:1px solid var(--fx-line);}
.plan__item h5{margin:0 0 7px;font-size:15.5px;display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.plan__lvl{font-family:var(--fx-font-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  padding:3px 8px;border-radius:var(--fx-radius-pill);border:1px solid currentColor;}
.plan__item p{margin:0;font-size:14.5px;line-height:1.6;color:var(--fx-ink-2);}
.plan__ok{padding:22px;text-align:center;color:var(--fx-ink-3);font-size:14.5px;}

/* Bloque de lead / CTA final */
.cta-final{position:relative;overflow:hidden;
  margin-top:clamp(48px,7vw,80px);padding:clamp(30px,5vw,52px);
  border:1px solid var(--fx-line-2);border-radius:var(--fx-radius);text-align:center;
  background:
    radial-gradient(70% 120% at 50% 0%,rgba(255,255,255,.08),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 30px 90px -60px rgba(0,0,0,1);}
.cta-final::before{
  content:"";position:absolute;top:-1px;left:15%;right:15%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);
  animation:sheen 5s ease-in-out infinite;
}
@keyframes sheen{0%,100%{opacity:.35;}50%{opacity:1;}}
.cta-final h3{margin:14px 0 12px;}
.cta-final > p{margin-inline:auto;max-width:56ch;}
.cta-final__btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px;}

.leadform{max-width:520px;margin:28px auto 0;text-align:left;}
.leadform__intro{font-size:13.5px;color:var(--fx-ink-3);margin:0 0 16px;text-align:center;}
.leadform__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
@media (max-width:560px){.leadform__grid{grid-template-columns:1fr;}}
.leadform__full{grid-column:1/-1;}
.leadform__consent{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:12.5px;color:var(--fx-ink-4);line-height:1.5;cursor:pointer;}
.leadform__consent input{margin-top:2px;flex:0 0 auto;width:15px;height:15px;accent-color:#fff;}
.leadform__consent a{color:var(--fx-ink-2);text-decoration:underline;}
.leadform__send{margin-top:16px;text-align:center;}
.leadform__msg{margin-top:13px;font-size:13.5px;min-height:1.3em;text-align:center;}
.leadform__msg.is-err{color:#ff8b84;animation:shake .4s ease;}
.leadform__msg.is-ok{color:#8ce8ab;animation:popIn .45s var(--fx-ease-back) both;}
@keyframes shake{10%,90%{transform:translateX(-2px);}30%,70%{transform:translateX(4px);}50%{transform:translateX(-4px);}}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;}

.results__actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:clamp(40px,6vw,64px);}
.results__permalink{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}

/* ---------- FOOTER ---------- */
.site-footer{border-top:1px solid var(--fx-line);margin-top:clamp(56px,8vw,96px);padding:34px 0 46px;}
.site-footer__in{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;}
.site-footer p{margin:0;font-size:13px;color:var(--fx-ink-4);}
.site-footer nav{display:flex;gap:18px;flex-wrap:wrap;}
.site-footer nav a{position:relative;font-size:13px;color:var(--fx-ink-3);}
.site-footer nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:-3px;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .35s var(--fx-ease-out);
}
.site-footer nav a:hover::after{transform:scaleX(1);transform-origin:left;}
.site-footer nav a:hover{color:#fff;}
.site-footer__fine{margin-top:18px;}
.site-footer__legal{font-size:11.5px;color:var(--fx-ink-4);max-width:78ch;line-height:1.55;}

/* ---------- MOVIMIENTO REDUCIDO ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;animation-delay:0s!important;
    transition-duration:.001ms!important;transition-delay:0s!important;
  }
  [data-reveal]{opacity:1!important;transform:none!important;}
  .calc__li{opacity:1;transform:none;}
  .prio::before{transform:scaleY(1)!important;}
}

/* ---------- IMPRESIÓN / PDF ---------- */
@media print{
  @page{margin:14mm;}
  body{background:#fff!important;color:#111!important;font-size:11.5pt;}
  body::before,body::after{display:none!important;}
  .site-header,.site-footer,.results__actions,.cta-final__btns,.leadform,.noprint,.progress{display:none!important;}
  .screen{display:none!important;}
  .screen.is-active{display:block!important;animation:none!important;}
  [data-reveal]{opacity:1!important;transform:none!important;transition:none!important;}
  h1,h2,h3,h4,h5{color:#111!important;}
  p,li{color:#333!important;}
  strong,b{color:#000!important;}
  .fx-metal,.fx-metal-soft,.gauge__val{-webkit-text-fill-color:#111!important;color:#111!important;background:none!important;}
  .score,.area,.prio,.fx-card,.plan__group,.cta-final{
    background:#fff!important;border:1px solid #d5d5d5!important;box-shadow:none!important;
    break-inside:avoid;page-break-inside:avoid;}
  .gauge::before,.cta-final::before,.area__bar::after,.progress__bar::after{display:none!important;}
  .prio__n{background:#111!important;color:#fff!important;}
  .prio::before{transform:none!important;background:#111!important;}
  .area__track,.progress__track{background:#e6e6e6!important;}
  .gauge__bgc{stroke:#e6e6e6!important;}
  .gauge__fg{stroke:#111!important;filter:none!important;}
  .fx-kicker,.fx-badge{border-color:#d5d5d5!important;color:#555!important;background:none!important;}
  .fx-kicker::before{background:#111!important;box-shadow:none!important;animation:none!important;}
  .plan__body{display:block!important;animation:none!important;}
  .sec{margin-top:26px;break-inside:auto;}
  .plan__chev{display:none;}
  a{color:#111!important;}
}