/* Fuentes propias (DM Sans y Plus Jakarta Sans, licencia SIL OFL). Se sirven desde /fonts para no depender de Google. */
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/dm-sans-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:'DM Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/dm-sans-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/plus-jakarta-sans-cyrillic-ext-800.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/plus-jakarta-sans-latin-800.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:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/plus-jakarta-sans-latin-ext-800.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/plus-jakarta-sans-vietnamese-800.woff2) format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
/* Estilo: violet ink on white parchment (tokens propios, tema claro) */
:root{
  --violet:#7622d7;--lavender:#f9f5ff;--lilac:#f0e6fa;--veil:#e6d5fe;
  --ink:#000;--carbon:#121214;--graphite:#27272a;--iron:#5a5b5f;--slate:#71717a;--mist:#a9a9b2;--fog:#e4e4e7;--paper:#fff;
  --gold:#ffefa7;--lime:#94e022;
  --font-ui:'DM Sans',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-display:'Plus Jakarta Sans','DM Sans',ui-sans-serif,system-ui,sans-serif;
}
*{box-sizing:border-box}
html{color-scheme:light}
body{margin:0;background:var(--paper);color:var(--graphite);font:400 16px/1.5 var(--font-ui)}
a{color:inherit}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--paper);z-index:10}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:12px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));border-bottom:1px solid var(--fog);background:var(--paper);position:sticky;top:env(safe-area-inset-top,0px);z-index:5}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;font:800 1.3rem var(--font-display);color:var(--brand-ink);letter-spacing:-.02em}
.brand b{color:var(--brand-go);font-weight:800}
.mark .lg-dark{fill:var(--logo)}.mark .lg-stroke{stroke:var(--logo)}
.brand .mark{width:38px;height:38px;flex:none}
nav{display:flex;gap:4px}
nav a{padding:8px 14px;border-radius:32px;text-decoration:none;color:var(--slate);font-weight:500;font-size:14px}
nav a:hover,nav a.on{background:var(--lavender);color:var(--violet)}
main{max-width:1200px;margin:0 auto;padding-block:48px 80px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--font-display);color:var(--ink);letter-spacing:-.02em}
h1{font-weight:800;font-size:clamp(2.1rem,5.5vw,3.75rem);line-height:1.08;margin:0 0 16px}
h2{font-weight:800;font-size:1.6rem;line-height:1.1;margin:0 0 12px}
h3{font-weight:800;font-size:1.15rem;line-height:1.14;margin:0 0 8px}
.lead{color:var(--graphite);max-width:640px;font-size:18px;line-height:1.43}
.muted{color:var(--slate)}
.btn{display:inline-block;border:1px solid var(--btn);background:var(--btn);color:#fff;padding:12px 20px;border-radius:32px;font:700 14px/1 var(--font-ui);cursor:pointer;text-decoration:none}
.btn:hover{filter:brightness(.9)}
.btn.ghost{background:transparent;color:var(--violet);border:1px solid var(--veil);font-weight:600}
.btn.ghost:hover{background:var(--lavender)}
.btn.sm{padding:8px 14px;font-size:13px}
.btn:disabled{opacity:.55;cursor:default}
:focus-visible{outline:2px solid var(--violet);outline-offset:2px}
.hero{text-align:center;padding:48px 16px 56px;margin:0;background:linear-gradient(180deg,var(--paper) 0%,var(--lavender) 70%,var(--veil) 140%);border-radius:0 0 12px 12px}
.hero .lead{margin:0 auto 28px}
.hero h1{max-width:900px;margin-left:auto;margin-right:auto}
.eyebrow{display:inline-block;margin-bottom:20px;padding:6px 14px;border:1px solid var(--veil);border-radius:9999px;background:var(--lavender);color:var(--violet);font:500 13px var(--font-ui)}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:64px}
.card{background:var(--lavender);border:1px solid var(--fog);border-radius:12px;padding:24px}
.card.plain{background:var(--paper)}
.card p{color:var(--graphite);margin:6px 0 18px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
@media(max-width:820px){.split{grid-template-columns:1fr}main{padding-block:32px 56px}}
.split>*,.card,.item{min-width:0}
.paper{overflow-x:auto}
label{display:block;font-size:13px;font-weight:500;color:var(--iron);margin:14px 0 4px}
input,textarea,select{width:100%;padding:12px 16px;border:1px solid var(--fog);border-radius:8px;background:var(--paper);color:var(--graphite);font:400 15px var(--font-ui)}
input::placeholder,textarea::placeholder{color:var(--mist)}
input:focus,textarea:focus,select:focus{outline:0;border-color:var(--violet);box-shadow:0 0 0 3px var(--veil)}
textarea{min-height:84px;resize:vertical}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.row>*{flex:1 1 140px}
.score{display:flex;align-items:center;gap:12px;margin:8px 0}
.score b{font:800 1.1rem var(--font-display);color:var(--ink)}
.bar{flex:1;height:8px;background:var(--lilac);border-radius:9999px;overflow:hidden}.bar i{display:block;height:100%;background:var(--violet);border-radius:9999px}
.tag{display:inline-block;padding:4px 10px;border-radius:9999px;background:var(--lavender);border:1px solid var(--veil);color:var(--violet);font:500 12px var(--font-ui);margin:2px 4px 2px 0}
.tag.miss{background:var(--paper);border-color:var(--mist);color:var(--iron)}
.paper{background:var(--paper);color:#111;border:1px solid var(--fog);border-radius:12px;padding:28px;font:14px/1.45 Georgia,serif;min-height:520px}
.paper h2{font:800 1.6rem var(--font-display);margin:0;color:#000}.paper .sub{color:var(--iron);margin-bottom:10px;font-family:var(--font-ui)}
.paper h4{margin:14px 0 4px;border-bottom:1px solid var(--fog);font:600 .72rem var(--font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--violet)}
.paper ul{margin:2px 0 6px;padding-left:18px}
.item{border:1px solid var(--veil);background:var(--paper);border-radius:12px;padding:14px;margin-top:12px}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:10px 6px;border-bottom:1px solid var(--fog);font-size:14px;vertical-align:top}
th{color:var(--slate);font-weight:600;font-size:12px;letter-spacing:.5px;text-transform:uppercase}
.funnel{display:flex;gap:12px;flex-wrap:wrap;margin:12px 0 20px}
.funnel div{flex:1 1 110px;background:var(--lilac);border-radius:12px;padding:14px;color:var(--iron);font-size:13px}
.funnel b{display:block;font:800 1.9rem var(--font-display);color:var(--violet)}
.chat{display:flex;flex-direction:column;gap:10px;max-height:380px;overflow:auto;padding:4px}
.msg{padding:12px 16px;border-radius:12px;max-width:90%}
.msg.q{background:var(--lilac);color:var(--ink);align-self:flex-start}
.msg.a{background:var(--paper);border:1px solid var(--fog);align-self:flex-end}
.fb{font-size:14px;color:var(--iron);padding-left:0;list-style:none}.fb li{margin:6px 0}
.fb li.ok{color:var(--graphite)}.fb li.ok::first-letter{color:#4d8a00}
.fb li.no{color:var(--graphite)}.fb li.no::first-letter{color:var(--violet)}
.foot{text-align:center;color:var(--slate);font-size:12px;padding:32px;border-top:1px solid var(--fog)}
/* ---------- Banner y animaciones ---------- */
.notice{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding-block:8px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:#1e0a3c;color:#fff;font:500 13px var(--font-ui);text-align:center}
.notice b{color:var(--lime);font-weight:700}
.notice a{padding:5px 12px;border-radius:32px;background:#fff;color:#111;font-weight:600;font-size:12px;text-decoration:none}
.notice a:hover{background:#e6d5fe}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.96) translateY(6px)}to{opacity:1;transform:none}}
@keyframes drift{from{background-position:0 50%}to{background-position:300% 50%}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes ring{from{stroke-dasharray:0 100}}
@keyframes tick{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
@keyframes dot{0%,80%,100%{transform:translateY(0);opacity:.4}40%{transform:translateY(-4px);opacity:1}}
#view.enter{animation:rise .45s cubic-bezier(.2,.7,.2,1) both}
.hero{position:relative;overflow:hidden;isolation:isolate;padding:72px 16px 80px}
.aurora{position:absolute;inset:-30% -10%;z-index:-1;background:linear-gradient(90deg,#9a58fc,#70ddff,#e6d5fe,#bafc58,#9a58fc);background-size:300% 100%;filter:blur(70px);opacity:.28;animation:drift 22s linear infinite}
.hero-copy{position:relative;max-width:760px;margin:0 auto}
.hero h1{text-wrap:balance}
.hero h1 .w{display:inline-block;margin-right:.26em;animation:rise .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i) * 70ms + 100ms)}
.hero .eyebrow,.hero .lead,.hero .btn.big,.hero .chips{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.hero .lead{animation-delay:.5s}.hero .btn.big{animation-delay:.65s}.hero .chips{animation-delay:.8s}
.btn.big{padding:15px 26px;font-size:15px}
.btn .arrow{display:inline-block;transition:transform .2s}.btn:hover .arrow{transform:translateX(4px)}
.btn{transition:background .2s,transform .15s}.btn:active{transform:scale(.97)}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:28px}
.chips .tag{background:color-mix(in srgb,var(--paper) 70%,transparent)}
.floaters{display:none}
@media(min-width:1000px){
  .floaters{display:block;position:absolute;inset:0;pointer-events:none}
  .fl{position:absolute;display:flex;gap:12px;align-items:center;padding:14px 16px;background:var(--paper);border:1px solid var(--veil);border-radius:12px;text-align:left;font-size:13px;animation:rise .8s both,bob 6s ease-in-out infinite}
  .fl b{display:block;font:700 14px var(--font-ui);color:var(--ink)}.fl span{color:var(--slate);font-size:12px}
  .fl-a{left:3%;top:22%;animation-delay:.9s,1.7s}
  .fl-b{right:3%;top:16%;flex-direction:column;align-items:flex-start;gap:6px;min-width:210px;animation-delay:1.1s,2.4s;animation-duration:.8s,7s}
  .fl-c{left:7%;bottom:12%;flex-direction:column;align-items:flex-start;gap:4px;max-width:220px;animation-delay:1.3s,3s;animation-duration:.8s,8s}
}
.ring{position:relative;width:48px;height:48px;flex:none}
.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:4}.ring-bg{stroke:var(--lilac)}.ring-fg{stroke:var(--violet);stroke-linecap:round;animation:ring 1.4s .9s cubic-bezier(.2,.7,.2,1) both}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font:800 13px var(--font-display);color:var(--ink)}
.row-ok{display:flex;align-items:center;gap:8px;color:var(--graphite);animation:tick .5s both;animation-delay:calc(1.6s + var(--i) * .5s)}
.row-ok i{display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--lime);color:var(--ink);font:700 10px var(--font-ui);font-style:normal}
.typing{display:flex;gap:4px;margin-top:4px}.typing i{width:6px;height:6px;border-radius:50%;background:var(--violet);animation:dot 1.2s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
.stagger>*{animation:rise .6s cubic-bezier(.2,.7,.2,1) both}
.stagger>:nth-child(1){animation-delay:.2s}.stagger>:nth-child(2){animation-delay:.32s}.stagger>:nth-child(3){animation-delay:.44s}.stagger>:nth-child(4){animation-delay:.56s}
.links{display:flex;flex-wrap:wrap;gap:8px}.links a{text-decoration:none}
.grid3{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
@media(max-width:560px){nav a{padding:8px 9px;font-size:13px}}
.card.hov{transition:border-color .2s,background .2s,transform .2s}
.card.hov:hover{border-color:var(--violet);background:var(--lilac);transform:translateY(-3px)}
.ico{display:inline-grid;place-items:center;width:48px;height:48px;margin-bottom:14px;border-radius:12px;background:var(--paper);border:1px solid var(--veil);color:var(--violet)}
nav a{transition:background .2s,color .2s}
.msg{animation:pop .3s both}
.fb li{animation:rise .4s both}.fb li:nth-child(2){animation-delay:.08s}.fb li:nth-child(3){animation-delay:.16s}.fb li:nth-child(4){animation-delay:.24s}.fb li:nth-child(5){animation-delay:.32s}
.item{animation:pop .3s both}
/* ---------- Un tono por sección ---------- */
[data-sec="cv"],nav a[data-route="cv"]{--sec:#7622d7;--sec-soft:#f4ecfd;--sec-veil:#e6d5fe;--sec-ink:#4a1590;--sec-btn:#7622d7}
[data-sec="mercado"],nav a[data-route="mercado"]{--sec:#1769d6;--sec-soft:#eaf2fd;--sec-veil:#cfe1fb;--sec-ink:#0e4290;--sec-btn:#1769d6}
[data-sec="candidaturas"],nav a[data-route="candidaturas"]{--sec:#cf4a1e;--sec-soft:#fdeee8;--sec-veil:#f8d2c4;--sec-ink:#8f3210;--sec-btn:#cf4a1e}
[data-sec="entrevista"],nav a[data-route="entrevista"]{--sec:#0b8a5f;--sec-soft:#e7f7f0;--sec-veil:#c3ebdb;--sec-ink:#07603f;--sec-btn:#0a7f57}
nav a[data-route]{display:flex;align-items:center;gap:7px}
nav a[data-route]::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--sec);transition:transform .25s}
nav a[data-route]:hover::before,nav a[data-route].on::before{transform:scale(1.5)}
nav a[data-route]:hover,nav a[data-route].on{background:var(--sec-soft);color:var(--sec-ink)}
[data-sec] .btn{background:var(--sec-btn,var(--sec));border-color:var(--sec-btn,var(--sec))}
[data-sec] .btn:hover{filter:brightness(.9)}
[data-sec] .btn.ghost{background:transparent;color:var(--sec-ink);border-color:var(--sec-veil)}
[data-sec] .btn.ghost:hover{background:var(--sec-soft);filter:none}
#view[data-sec] .card{background:var(--sec-soft);border-color:var(--sec-veil)}
#view[data-sec] .item{border-color:var(--sec-veil)}
#view[data-sec] .tag{background:var(--sec-soft);border-color:var(--sec-veil);color:var(--sec-ink)}
#view[data-sec] .tag.miss{background:var(--paper);border-color:var(--mist);color:var(--iron)}
#view[data-sec] .bar{background:var(--sec-veil)}#view[data-sec] .bar i{background:var(--sec)}
#view[data-sec] .funnel div{background:var(--sec-veil);color:var(--sec-ink)}#view[data-sec] .funnel b{color:var(--sec)}
#view[data-sec] .msg.q{background:var(--sec-veil)}
#view[data-sec] .paper h4{color:var(--sec)}
#view[data-sec] input:focus,#view[data-sec] textarea:focus,#view[data-sec] select:focus{border-color:var(--sec);box-shadow:0 0 0 3px var(--sec-veil)}
#view[data-sec] :focus-visible{outline-color:var(--sec)}
#view[data-sec] .fb li.no::first-letter{color:var(--sec)}
.card.hov[data-sec]{background:var(--sec-soft);border-color:var(--sec-veil)}
.card.hov[data-sec]:hover{border-color:var(--sec);background:var(--sec-soft)}
.card[data-sec] .ico{border-color:var(--sec-veil);color:var(--sec-ink)}
/* Cabecera de sección con icono animado */
.sec-title{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.sec-title h1{margin:0}
.sico{display:inline-grid;place-items:center;color:var(--sec-ink)}
.sico svg{width:34px;height:34px;overflow:visible}
.sico.big{width:72px;height:72px;flex:none;border-radius:20px;background:var(--sec-soft);border:1px solid var(--sec-veil)}
.sico.big svg{width:46px;height:46px}
.card[data-sec] .ico{width:56px;height:56px}.card[data-sec] .ico .sico svg{width:38px;height:38px}
.card.hov:hover .sico svg,.sico.big:hover svg{transform:scale(1.08) rotate(-3deg)}
.sico svg{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
/* CV: se dibujan las líneas, un escáner revisa el documento y aparece el visto bueno */
@keyframes draw{0%,8%{stroke-dashoffset:24}35%,88%{stroke-dashoffset:0}100%{stroke-dashoffset:24}}
@keyframes scan{0%,12%{transform:translateY(0);opacity:0}22%{opacity:.9}62%{transform:translateY(24px);opacity:.9}72%,100%{transform:translateY(24px);opacity:0}}
@keyframes pop2{0%,55%{transform:scale(0)}68%{transform:scale(1.18)}78%,92%{transform:scale(1)}100%{transform:scale(0)}}
.ic-cv .ln{stroke-dasharray:24;animation:draw 4.2s ease-in-out infinite}.ic-cv .l2{animation-delay:.15s}.ic-cv .l3{animation-delay:.3s}
.ic-cv .scan{transform-box:fill-box;animation:scan 4.2s ease-in-out infinite}
.ic-cv .badge{transform-box:fill-box;transform-origin:center;animation:pop2 4.2s ease-in-out infinite}
/* Mercado: las barras crecen y la tendencia se dibuja hasta el punto */
@keyframes grow{0%,6%{transform:scaleY(.1)}28%,86%{transform:scaleY(1)}100%{transform:scaleY(.1)}}
@keyframes trend{0%,25%{stroke-dashoffset:70}55%,88%{stroke-dashoffset:0}100%{stroke-dashoffset:70}}
@keyframes ping{0%,50%{transform:scale(0)}62%{transform:scale(1.5)}72%,90%{transform:scale(1)}100%{transform:scale(0)}}
.ic-mk .bar{transform-box:fill-box;transform-origin:bottom;animation:grow 4.4s cubic-bezier(.3,.7,.3,1) infinite}.ic-mk .b2{animation-delay:.12s}.ic-mk .b3{animation-delay:.24s}
.ic-mk .trend{stroke-dasharray:70;animation:trend 4.4s ease-in-out infinite}
.ic-mk .dot{transform-box:fill-box;transform-origin:center;animation:ping 4.4s ease-in-out infinite}
/* Candidaturas: el avión sale del sobre dejando estela */
@keyframes fly{0%,10%{transform:translate(-14px,14px);opacity:0}25%{opacity:1}55%,80%{transform:translate(0,0);opacity:1}100%{transform:translate(8px,-8px);opacity:0}}
@keyframes trail{0%,25%{opacity:0;stroke-dashoffset:8}45%{opacity:.9;stroke-dashoffset:0}70%,100%{opacity:0}}
.ic-cd .plane{transform-box:fill-box;animation:fly 3.6s ease-in-out infinite}
.ic-cd .trail{stroke-dasharray:8;animation:trail 3.6s ease-in-out infinite}.ic-cd .t2{animation-delay:.2s}
/* Entrevista: pregunta, puntos de "escribiendo" y respuesta con destello */
@keyframes bubIn{0%{transform:scale(0)}12%,92%{transform:scale(1)}100%{transform:scale(0)}}
@keyframes bubIn2{0%,22%{transform:scale(0)}34%,92%{transform:scale(1)}100%{transform:scale(0)}}
@keyframes type{0%,60%,100%{transform:translateY(0);opacity:.35}20%{transform:translateY(-3px);opacity:1}}
@keyframes spark{0%,45%{transform:scale(0) rotate(0)}60%{transform:scale(1.25) rotate(60deg)}72%,92%{transform:scale(1) rotate(0)}100%{transform:scale(0)}}
.ic-en .b1{transform-box:fill-box;transform-origin:20% 90%;animation:bubIn 4.4s ease-out infinite}
.ic-en .b2{transform-box:fill-box;transform-origin:80% 90%;animation:bubIn2 4.4s ease-out infinite}
.ic-en .d{transform-box:fill-box;transform-origin:center;animation:type 1.2s ease-in-out infinite}.ic-en .d2{animation-delay:.15s}.ic-en .d3{animation-delay:.3s}
.ic-en .star{transform-box:fill-box;transform-origin:center;animation:spark 4.4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media print{body *{visibility:hidden}.paper,.paper *{visibility:visible}.paper{position:absolute;inset:0;border:0}}
.chips-left{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:8px 0 4px}
/* ---------- Gráficos y datos de mercado ---------- */
@keyframes barIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes colIn{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.kpis{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0}
.kpi{flex:1 1 170px;background:var(--paper);border:1px solid var(--sec-veil,var(--fog));border-radius:12px;padding:14px 16px}
.kpi b{display:block;font:800 1.7rem/1.1 var(--font-display);color:var(--sec-ink,var(--ink));font-variant-numeric:tabular-nums}
.kpi span{color:var(--slate);font-size:13px}
.kpi.dem-alta b{color:#0b8a5f}.kpi.dem-media b{color:#a16207}.kpi.dem-baja b{color:#b42318}
.charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:8px}
.chart{background:var(--paper);border:1px solid var(--sec-veil,var(--fog));border-radius:12px;padding:16px;min-width:0}
.chart h4{margin:0 0 4px;font:700 15px var(--font-ui);color:var(--ink)}
.csub{font-size:12px;margin:0 0 8px}
.cbar{display:grid;grid-template-columns:minmax(80px,38%) 1fr auto;gap:10px;align-items:center;margin:7px 0;font-size:13px}
.cl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--graphite)}
.ct{height:12px;background:var(--sec-soft,var(--lilac));border-radius:6px;overflow:hidden}
.ct i{display:block;height:100%;background:var(--sec,var(--violet));border-radius:6px;transform-origin:left;animation:barIn .8s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d,0ms)}
.cbar.miss .ct i{background:var(--mist)}
.cv{font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink);text-align:right;min-width:48px}
.cols{display:flex;align-items:flex-end;gap:6px;height:150px;margin-top:10px;padding-bottom:20px;border-bottom:1px solid var(--fog)}
.col{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;position:relative;min-width:0}
.col i{display:block;background:var(--sec,var(--violet));border-radius:5px 5px 0 0;transform-origin:bottom;animation:colIn .8s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--d,0ms)}
.col span{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:11px;color:var(--slate);font-variant-numeric:tabular-nums}
/* ---------- Acceso, modo demo y demo animada ---------- */
[hidden]{display:none!important}
[data-sec="admin"],nav a[data-route="admin"]{--sec:#475467;--sec-soft:#eef0f3;--sec-veil:#d5d9e0;--sec-ink:#1d2939;--sec-btn:#475467}
.top{flex-wrap:wrap}
.who{display:flex;align-items:center;gap:8px;margin-left:auto}
.role{padding:4px 10px;border-radius:9999px;font:600 12px var(--font-ui);background:var(--lilac);color:var(--violet)}
.role-admin{background:#1d2939;color:#fff}.role-guest{background:var(--gold);color:#5c4400}
.modebanner{position:sticky;top:0;z-index:20;display:flex;gap:6px;justify-content:center;flex-wrap:wrap;padding:10px 16px;background:var(--gold);color:#4a3800;font:500 14px var(--font-ui);text-align:center;border-bottom:1px solid #e6d27a}
.modebanner b{letter-spacing:.08em}
.guestnote{margin:10px 0 18px;padding:14px 16px;border-radius:12px;background:var(--gold);color:#4a3800;border:1px solid #e6d27a}
.hero.gate{padding:56px 16px 56px}
.gatebox{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:560px;margin:8px auto 0}
.gatebox input{flex:1 1 260px;min-width:0;text-align:center;font-size:16px;padding:14px 16px;border-radius:32px}
.dplayer{background:var(--sec-soft);border:1px solid var(--sec-veil);border-radius:16px;padding:20px;margin-top:16px;min-width:0}
.dbadge{display:inline-block;padding:5px 12px;border-radius:9999px;background:var(--gold);color:#4a3800;border:1px solid #e6d27a;font:700 11px var(--font-ui);letter-spacing:.08em}
.dtitle{margin:12px 0 4px;color:var(--sec-ink)}
.dwrap{min-height:330px;margin-top:14px;background:var(--paper);border:1px solid var(--sec-veil);border-radius:12px;padding:18px;overflow:hidden;animation:rise .5s both}
.dctl{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:14px}
.ddots{display:flex;gap:8px}.ddots button{width:12px;height:12px;border-radius:50%;border:0;background:var(--sec-veil);cursor:pointer;padding:0;transition:transform .2s,background .2s}
.ddots button.on{background:var(--sec);transform:scale(1.35)}
.dfile{display:flex;align-items:center;gap:12px;animation:rise .5s both}
.dico{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:var(--sec-btn,var(--sec));color:#fff;font:800 12px var(--font-ui)}
.dbar{height:8px;border-radius:9999px;background:var(--sec-veil);margin:14px 0 6px;overflow:hidden}
.dbar i{display:block;height:100%;background:var(--sec);transform-origin:left;animation:barIn 4.2s ease-in-out both}
.dlbl{font-size:13px;color:var(--slate)}.dlbl.done{color:var(--sec-ink);font-weight:600}
.dcompare{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:stretch;margin-top:16px}
@media(max-width:620px){.dcompare{grid-template-columns:1fr}.darrow{transform:rotate(90deg);justify-self:center}}
.dcard{border:1px solid var(--fog);border-radius:12px;padding:14px;min-width:0}
.dcard h5{margin:0 0 8px;font:700 12px var(--font-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--slate)}
.dcard.after{border-color:var(--sec);background:var(--sec-soft)}.dcard.after h5{color:var(--sec-ink)}
.dl{font-size:14px;min-height:60px;overflow-wrap:anywhere}.dl.ok{color:var(--ink)}
.dscore{margin-top:8px;font-size:13px;color:var(--slate)}.dscore b{font:800 1.6rem var(--font-display);color:var(--sec-ink);font-variant-numeric:tabular-nums}
.dcard.before .dscore b{color:#b42318}
.darrow{align-self:center;font-size:24px;color:var(--sec)}
.dlist{display:flex;flex-direction:column;gap:8px}
.drow{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--fog);border-radius:10px;font-size:14px}
.dstate{display:inline-block;padding:3px 10px;border-radius:9999px;background:var(--lilac);color:var(--iron);font:600 12px var(--font-ui);transition:background .3s,color .3s}
.dstate.sent{background:var(--sec-veil);color:var(--sec-ink)}.dstate.answer{background:var(--lime);color:#1d3300}
.dmail{margin-top:14px;border:1px solid var(--sec-veil);border-radius:12px;padding:14px;background:var(--sec-soft)}
.dmailhead{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.dmail p{margin:0;min-height:72px;font-size:14px}
.dhidden{display:none}
.dfb{display:flex;gap:14px;align-items:center;margin-top:14px;padding:14px;border-radius:12px;background:var(--sec-soft);border:1px solid var(--sec-veil);animation:pop .4s both}
.dfb>div:last-child{display:flex;flex-direction:column;gap:4px}
.fbitem{font-size:14px;animation:rise .4s both;animation-delay:calc(var(--i) * .5s + .4s)}.fbitem.ok{color:#0a6b4a}.fbitem.no{color:#9a3412}
.dint .chat{max-height:none;min-height:130px}
.dint .ring{--sec:var(--sec)}
@media(prefers-reduced-motion:reduce){.dbar i{animation:none}}
/* ---------- Revisión: accesibilidad táctil, salir y cuota ---------- */
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:8px;text-decoration:none}
.skip:focus{left:8px}
#view:focus{outline:none}
.ddots button{position:relative}.ddots button::after{content:"";position:absolute;inset:-16px}
.linklike{background:none;border:0;padding:8px 6px;color:var(--iron);text-decoration:underline;cursor:pointer;font:inherit;font-size:12px}
.logout{position:relative}.logout summary{list-style:none;cursor:pointer}.logout summary::-webkit-details-marker{display:none}
.logoutmenu{position:absolute;right:0;top:calc(100% + 6px);z-index:30;display:grid;gap:4px;background:var(--paper);border:1px solid var(--fog);border-radius:12px;padding:6px;min-width:220px}
.logoutmenu button{background:none;border:0;text-align:left;padding:12px;border-radius:8px;cursor:pointer;font:500 14px var(--font-ui);color:var(--graphite)}
.logoutmenu button:hover{background:var(--lavender)}
.quota{font:600 12px var(--font-ui);color:var(--iron);padding:4px 8px;border:1px solid var(--fog);border-radius:9999px;white-space:nowrap}
@media(pointer:coarse),(max-width:620px){
  .btn.sm{min-height:44px;padding-block:12px}
  .notice a{display:inline-grid;place-items:center;min-height:36px;padding-inline:16px}
  nav a{min-height:44px}
  .ddots{gap:16px}
}

/* ---------- Tema: variables base y modo oscuro ---------- */
:root{--btn:#7622d7;--brand-ink:#26363f;--brand-go:#1c5663;--logo:#24404a;color-scheme:light}
:root[data-theme="dark"]{
  color-scheme:dark;
  --violet:#b78af7;--btn:#7a35d9;--lavender:#1c1826;--lilac:#261f35;--veil:#3a3052;
  --ink:#f4f1fa;--carbon:#f0edf6;--graphite:#e4e0ec;--iron:#b9b4c4;--slate:#a8a3b4;--mist:#6e6a7a;--fog:#2f2b3a;--paper:#14121a;
  --brand-ink:#e9eff2;--brand-go:#6cc3d1;--logo:#d3e6ea;
}
:root[data-theme="dark"] [data-sec="cv"],:root[data-theme="dark"] nav a[data-route="cv"]{--sec:#b78af7;--sec-soft:#241c36;--sec-veil:#3d2d5c;--sec-ink:#dcc6fa;--sec-btn:#7a35d9}
:root[data-theme="dark"] [data-sec="mercado"],:root[data-theme="dark"] nav a[data-route="mercado"]{--sec:#6aa6f5;--sec-soft:#152238;--sec-veil:#243a5e;--sec-ink:#bcd6fb;--sec-btn:#2f6fd6}
:root[data-theme="dark"] [data-sec="candidaturas"],:root[data-theme="dark"] nav a[data-route="candidaturas"]{--sec:#f58a5d;--sec-soft:#32201a;--sec-veil:#5a3326;--sec-ink:#f9c8b3;--sec-btn:#cf4a1e}
:root[data-theme="dark"] [data-sec="entrevista"],:root[data-theme="dark"] nav a[data-route="entrevista"]{--sec:#38c995;--sec-soft:#12281f;--sec-veil:#1f4a38;--sec-ink:#aeeed3;--sec-btn:#0a7f57}
:root[data-theme="dark"] [data-sec="admin"],:root[data-theme="dark"] nav a[data-route="admin"]{--sec:#a4aebd;--sec-soft:#1e222a;--sec-veil:#343a46;--sec-ink:#dde2ea;--sec-btn:#56637a}
:root[data-theme="dark"] .kpi.dem-alta b{color:#46dca0}:root[data-theme="dark"] .kpi.dem-media b{color:#f4c455}:root[data-theme="dark"] .kpi.dem-baja b{color:#ff8277}
:root[data-theme="dark"] .fbitem.ok{color:#58d6a6}:root[data-theme="dark"] .fbitem.no{color:#ffa07c}
:root[data-theme="dark"] .dcard.before .dscore b{color:#ff8277}
:root[data-theme="dark"] .aurora{opacity:.2}
:root[data-theme="dark"] .role{background:var(--lilac);color:var(--violet)}
:root[data-theme="dark"] .role-admin{background:#dde2ea;color:#1d2939}
:root[data-theme="dark"] .paper{box-shadow:0 0 0 1px var(--fog)}
.themebtn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--fog);background:transparent;color:var(--iron);cursor:pointer;transition:background .2s,color .2s,transform .3s}
.themebtn:hover{background:var(--lavender);color:var(--violet);transform:rotate(18deg)}
.themebtn svg{width:20px;height:20px}.themebtn .moon{display:none}
:root[data-theme="dark"] .themebtn .sun{display:none}:root[data-theme="dark"] .themebtn .moon{display:block}
@media(max-width:620px){.top{gap:8px}}

/* ---------- Fase 2: logo animado, esqueletos, avisos, confeti, ruta y navegación inferior ---------- */
.mark .lg-swoosh{transform-box:fill-box;transform-origin:left center;animation:swoosh .9s .15s cubic-bezier(.2,.7,.2,1) both}
.mark .lg-steps{animation:stepsUp .7s cubic-bezier(.2,.7,.2,1) both}
.mark .lg-arrow{animation:arrowUp .8s .35s cubic-bezier(.2,.9,.3,1.2) both}
.brand:hover .lg-arrow{animation:arrowNudge .5s ease}
@keyframes swoosh{from{transform:scaleX(0);opacity:0}to{transform:none;opacity:1}}
@keyframes stepsUp{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}
@keyframes arrowUp{from{transform:translate(-10px,14px);opacity:0}to{transform:none;opacity:1}}
@keyframes arrowNudge{50%{transform:translate(4px,-4px)}}

@keyframes shimmer{to{background-position:-200% 0}}
.skel{padding:6px 0}
.skel i{display:block;border-radius:8px;margin:10px 0;background:linear-gradient(90deg,var(--sec-soft,var(--lilac)) 25%,var(--sec-veil,var(--veil)) 50%,var(--sec-soft,var(--lilac)) 75%);background-size:200% 100%;animation:shimmer 1.3s linear infinite}

#toasts{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:80;display:grid;gap:8px;justify-items:center;pointer-events:none;width:min(92vw,420px)}
.toast{background:var(--ink);color:var(--paper);padding:11px 18px;border-radius:9999px;font:600 14px var(--font-ui);text-align:center;animation:toastIn .35s cubic-bezier(.2,.9,.3,1.2) both}
.toast.out{animation:toastOut .4s ease both}
@keyframes toastIn{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateY(8px)}}

.confetti{position:fixed;inset:0;pointer-events:none;z-index:90;overflow:hidden}
.confetti i{position:absolute;top:-14px;width:9px;height:14px;border-radius:2px;animation:fall 1.6s ease-in forwards}
@keyframes fall{to{transform:translate(var(--dx),100vh) rotate(var(--r));opacity:.9}}

.journey{margin:28px 0 8px;padding:20px;border:1px solid var(--fog);border-radius:16px;background:var(--paper)}
.jhead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}.jhead h2{margin:0;font-size:1.2rem}
.jbar{height:10px;border-radius:9999px;background:var(--lilac);margin:12px 0 16px;overflow:hidden}
.jbar i{display:block;height:100%;background:linear-gradient(90deg,#7622d7,#1769d6,#cf4a1e,#0b8a5f);border-radius:9999px;transform-origin:left;animation:barIn 1s cubic-bezier(.2,.7,.2,1) both}
.jsteps{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.jstep{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--sec-veil);border-radius:12px;background:var(--sec-soft);color:var(--sec-ink);text-decoration:none;font-weight:600;font-size:14px;transition:transform .2s,border-color .2s}
.jstep:hover{transform:translateY(-2px);border-color:var(--sec)}
.jn{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--paper);border:1.5px solid var(--sec);font:800 13px var(--font-ui);flex:none}
.jstep.ok .jn{background:var(--sec-btn);color:#fff;border-color:var(--sec-btn)}
.jstep.next{outline:2px solid var(--sec);outline-offset:2px}
.jstep.next .jn{animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--sec) 25%,transparent)}}
.herobtns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

.cbar{cursor:default;border-radius:8px;padding:2px 4px;margin-inline:-4px;transition:background .2s}
.cbar:hover{background:var(--sec-soft,var(--lavender))}.cbar:hover .cv{color:var(--sec,var(--violet))}
.cbar:hover .ct i{filter:brightness(1.15)}
.col:hover i{filter:brightness(1.2)}.col:hover span{color:var(--ink);font-weight:700}

.has-io .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.has-io .reveal.in{opacity:1;transform:none}

.who:empty{display:none}
@media(max-width:900px){nav a{padding:8px 9px;font-size:13.5px}.top{gap:8px}}

#tabbar{display:none}
@media(max-width:620px){
  .top nav{display:none}
  #tabbar:not([hidden]){display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;gap:0;background:var(--paper);border-top:1px solid var(--fog);padding-bottom:env(safe-area-inset-bottom,0px)}
  #tabbar a{flex:1;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:58px;padding:6px 2px;font:600 11px var(--font-ui);color:var(--slate);text-decoration:none;border-radius:0}
  #tabbar a::before{display:none}
  #tabbar a.on{color:var(--sec-ink);background:var(--sec-soft)}
  #tabbar .sico svg{width:26px;height:26px}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  #toasts{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
}
@media(prefers-reduced-motion:reduce){.has-io .reveal{opacity:1;transform:none;transition:none}.skel i{animation:none}}

/* Contraste: gris de apoyo más oscuro en claro y vista previa del CV siempre como documento blanco */
:root{--slate:#63636d}
.paper{background:#fff;color:#111}.paper .sub{color:#555}.paper h4{color:#7622d7;border-bottom-color:#ccc}
#view[data-sec] .paper h4{color:#6a1fc2}

/* ---------- Fase 3: tablero de seguimiento ---------- */
.toast{pointer-events:auto}
.toast-act{margin-left:12px;background:none;border:0;border-bottom:1px solid currentColor;color:inherit;font:700 14px var(--font-ui);cursor:pointer;padding:0}
.trk-top{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:0 0 14px}
.seg{display:inline-flex;border:1px solid var(--veil);border-radius:9999px;overflow:hidden}
.segbtn{background:transparent;border:0;padding:8px 18px;font:600 13px var(--font-ui);color:var(--ink);cursor:pointer;min-height:36px}
.segbtn.on{background:var(--sec-btn,#7622d7);color:#fff}
.duenote{background:#fff3cd;color:#5c4400;border-radius:12px;padding:12px 16px;margin:0 0 14px;font-weight:600}
.board{display:grid;grid-template-columns:repeat(5,minmax(210px,1fr));gap:12px;overflow-x:auto;padding-bottom:8px;align-items:start}
.kcol{background:var(--sec-soft,var(--lilac));border:2px dashed transparent;border-radius:12px;padding:10px;min-height:120px}
.kcol.over{border-color:var(--sec,#7622d7)}
.khead{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;color:var(--sec-ink,var(--ink))}
.kn{background:var(--sec-btn,#7622d7);color:#fff;border-radius:9999px;padding:1px 9px;font:700 12px var(--font-ui)}
.kcard{background:var(--paper);border:1px solid var(--veil);border-radius:10px;padding:10px;margin-bottom:8px;cursor:grab}
.kcard.dragging{opacity:.45}
.kcard.off,tr.off{opacity:.65}
.kmot{margin:4px 0;font-size:13px}
.krow{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:6px 0}
.rem{font-size:12px;font-weight:700;background:var(--lilac);color:var(--iron);border-radius:9999px;padding:3px 9px}
.rem.today{background:#fff3cd;color:#5c4400}
.rem.late{background:#fde2e0;color:#8a1c14}
.kempty{font-size:13px;text-align:center}
.kctl{display:grid;gap:6px;margin-top:6px}
.klab{display:grid;gap:3px;font-size:12px;font-weight:600}
.kctl select,.kctl input,.kctl textarea{font-size:13px;padding:6px 8px;width:100%}
.kdet summary{cursor:pointer;font-size:13px;font-weight:600;padding:4px 0}
.kbtns{gap:6px}
.addform summary{cursor:pointer}
.nav-badge{display:inline-block;min-width:18px;height:18px;border-radius:9999px;background:#cf4a1e;color:#fff;font:700 11px/18px var(--font-ui);text-align:center;margin-left:6px;padding:0 4px}
@media (max-width:700px){.board{grid-template-columns:repeat(5,78vw)}}

/* ---------- Fase 3: entrevista ---------- */
.ivclock{font:700 15px var(--font-ui);font-variant-numeric:tabular-nums;color:var(--sec-ink,var(--ink));margin-left:auto}
.ivclock.long{color:#b3261e}
.ivhist{display:flex;gap:8px;align-items:flex-end;height:150px;padding-top:8px}
.ivbar{flex:1 1 0;max-width:60px;height:100%;display:grid;grid-template-rows:1fr auto auto;justify-items:center;align-items:end;font-size:11px;color:var(--iron)}
.ivbar i{display:block;width:70%;background:var(--sec-btn,#0a7f57);border-radius:6px 6px 0 0;min-height:4px}
.ivbar b{font-size:12px;color:var(--ink)}

/* ---------- Fase 3: plantillas de CV ---------- */
.paper.tpl-moderna{font-family:var(--font-ui)}
.paper.tpl-moderna h2{color:#4a1590;font-size:1.9rem}
.paper.tpl-moderna h4{background:#f4ecfd;border:0;padding:4px 8px;color:#4a1590!important;border-radius:4px}
.paper.tpl-compacta{font-size:12px;line-height:1.35;padding:20px;min-height:0}
.paper.tpl-compacta h2{font-size:1.3rem}
.paper.tpl-compacta h4{margin:10px 0 3px}

/* ---------- Fase 4: sincronización ---------- */
.synckey{font:700 1.2rem var(--font-ui);letter-spacing:.08em;word-break:break-all;background:var(--lilac);color:var(--ink);border-radius:8px;padding:12px;user-select:all}