@font-face{font-family:Outfit;src:url(outfit.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--marino:#131A43;--violeta:#5A48F5;--violeta-osc:#4636D6;--turquesa:#14B8C8;--lila:#8F83FF;--lila-claro:#F5F4FF;--borde:#E3E5F0;--texto:#131A43;--texto-2:#4A5178;--blanco:#fff;--ok:#0B6B50;--ok-f:#DDF5EC;--pend:#8A5A0B;--pend-f:#FCEFCF;--venc:#A32227;--venc-f:#FBDDDE;--ancho:1120px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:Outfit,Arial,sans-serif;color:var(--texto);background:var(--blanco);font-size:18px;line-height:1.55;font-weight:400}
img,svg{max-width:100%;display:block}
a{color:var(--violeta)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--lila);outline-offset:3px;border-radius:6px}
.c{max-width:var(--ancho);margin:0 auto;padding:0 24px}
.salto{position:absolute;left:-999px}.salto:focus{left:16px;top:16px;background:#fff;padding:8px 12px;z-index:9}
h1,h2,h3{font-weight:600;letter-spacing:-.02em;line-height:1.12}
h1{font-size:clamp(2.3rem,5.2vw,3.7rem)}h2{font-size:clamp(1.8rem,3.6vw,2.6rem);margin-bottom:.5em}h3{font-size:1.2rem;letter-spacing:-.01em;margin-bottom:.35em}
.ante{color:var(--violeta);font-weight:600;font-size:.82rem;letter-spacing:.09em;text-transform:uppercase;margin-bottom:.9rem}
.entr{font-size:1.2rem;color:var(--texto-2);max-width:40em}
section{padding:88px 0}
.btn{display:inline-flex;align-items:center;gap:.5em;font:500 1rem Outfit,Arial,sans-serif;padding:.85em 1.4em;border-radius:12px;text-decoration:none;border:1.5px solid transparent;cursor:pointer}
.btn-p{background:var(--violeta);color:#fff}.btn-p:hover{background:var(--violeta-osc)}
.btn-s{border-color:var(--marino);color:var(--marino)}.btn-s:hover{background:var(--lila-claro)}
.btn-b{background:#fff;color:var(--marino)}.btn-b:hover{background:var(--lila-claro)}

/* cabecera */
.cab{position:sticky;top:0;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--borde);z-index:5}
.cab .c{display:flex;align-items:center;justify-content:space-between;height:68px}
.cab img{height:30px;width:auto}
.nav{display:flex;align-items:center;gap:28px}.nav a{color:var(--marino);text-decoration:none;font-weight:500;font-size:.97rem}.nav a:hover{color:var(--violeta)}
.nav .btn{padding:.6em 1.1em;color:#fff}.nav .btn:hover{color:#fff}
.menu{display:none;background:none;border:0;padding:8px;cursor:pointer}.menu span{display:block;width:24px;height:2.5px;background:var(--marino);margin:5px 0;border-radius:2px}

/* portada */
.hero{padding:76px 0 88px;background:linear-gradient(180deg,var(--lila-claro),#fff 78%)}
.hero .c{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.hero p.entr{margin:1.3rem 0 2rem}
.acc{display:flex;flex-wrap:wrap;gap:12px}
.bajo{margin-top:1.4rem;font-size:.92rem;color:var(--texto-2)}
.panel{background:#fff;border:1px solid var(--borde);border-radius:20px;padding:22px;box-shadow:0 24px 60px -30px rgba(19,26,67,.35)}
.panel .tit{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-weight:600}
.panel .tit small{font-weight:400;color:var(--texto-2);font-size:.78rem}
.fila{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--borde);font-size:.95rem}
.fila b{font-weight:500}.fila span.i{font-variant-numeric:tabular-nums}
.chip{font-size:.78rem;font-weight:500;border-radius:99px;padding:.15em .8em;white-space:nowrap}
.ok{background:var(--ok-f);color:var(--ok)}.pend{background:var(--pend-f);color:var(--pend)}.venc{background:var(--venc-f);color:var(--venc)}
.cuadra{display:flex;align-items:center;gap:12px;margin-top:14px;background:var(--marino);color:#fff;border-radius:14px;padding:14px 16px;font-size:.95rem}
.cuadra svg{flex:none}.cuadra b{font-weight:600}
.fig{font-size:.78rem;color:var(--texto-2);margin-top:10px;text-align:right}

/* tres verbos */
.tres{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.verbo{border:1px solid var(--borde);border-radius:18px;padding:28px}
.verbo .n{display:inline-flex;width:40px;height:40px;border-radius:11px;background:var(--marino);color:#fff;align-items:center;justify-content:center;font-weight:600;margin-bottom:16px}
.verbo:nth-child(2) .n{background:var(--violeta)}.verbo:nth-child(3) .n{background:var(--turquesa);color:var(--marino)}
.verbo p{color:var(--texto-2);font-size:1rem}

/* funciones */
.suave{background:var(--lila-claro)}
.fun{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.f{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:24px}
.f ul{list-style:none;margin-top:.6em}.f li{font-size:.95rem;color:var(--texto-2);padding-left:1.25em;position:relative;margin-bottom:.4em}
.f li::before{content:"";position:absolute;left:0;top:.55em;width:.5em;height:.5em;border-radius:2px;background:var(--violeta)}

/* verifactu */
.dos{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.fechas{display:grid;gap:14px;margin:28px 0}
.fecha{display:flex;gap:18px;align-items:center;border:1px solid var(--borde);border-radius:16px;padding:18px 20px;background:#fff}
.fecha time{font-weight:600;font-size:1.25rem;color:var(--violeta);min-width:8.2em}
.fecha span{color:var(--texto-2);font-size:.98rem}
.estado{background:var(--marino);color:#fff;border-radius:20px;padding:32px}
.estado h3{font-size:1.35rem;margin-bottom:.7em}
.estado ul{list-style:none}.estado li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid rgba(255,255,255,.14);font-size:.98rem}
.estado li:first-child{border-top:0}
.estado .chip{margin-top:.15em}
.hecho{background:rgba(20,184,200,.2);color:#8BE9F2}.falta{background:rgba(252,239,207,.16);color:#FFD98A}
.estado p{color:#C9CDE8;font-size:.92rem;margin-top:1rem}
.fuente{font-size:.85rem;color:var(--texto-2);margin-top:1rem}

/* gestoría */
.lista{list-style:none;margin-top:1.4rem}.lista li{padding:14px 0 14px 2.2em;border-top:1px solid var(--borde);position:relative}
.lista li::before{content:"";position:absolute;left:0;top:1.15em;width:1.15em;height:1.15em;border-radius:5px;background:var(--violeta) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.lista b{font-weight:600}.lista span{display:block;color:var(--texto-2);font-size:.97rem}
.caja{background:var(--lila-claro);border-radius:20px;padding:32px}
.caja h3{margin-bottom:.6em}.caja p{color:var(--texto-2);font-size:1rem;margin-bottom:.8em}
.nom{display:grid;gap:10px;margin-top:1.2rem}.nom div{background:#fff;border-radius:12px;padding:12px 16px;display:flex;gap:14px;align-items:baseline}
.nom b{color:var(--violeta);font-weight:600;font-size:1.2rem;min-width:5.2em}.nom span{font-size:.9rem;color:var(--texto-2)}

/* pasos */
.pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px;counter-reset:p}
.paso{border-top:3px solid var(--marino);padding-top:20px;counter-increment:p}
.paso::before{content:"Paso " counter(p);display:block;color:var(--violeta);font-weight:600;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.6em}
.paso p{color:var(--texto-2);font-size:1rem}

/* en camino */
.camino{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.camino div{border:1.5px dashed #C9C4F5;border-radius:16px;padding:22px}
.camino p{color:var(--texto-2);font-size:.97rem}
.aviso{font-size:.9rem;color:var(--texto-2);margin-top:1.2rem}

/* preguntas */
.faq{max-width:820px}
details{border-top:1px solid var(--borde);padding:20px 0}details:last-child{border-bottom:1px solid var(--borde)}
summary{font-weight:600;font-size:1.1rem;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--violeta);font-weight:500;font-size:1.4rem;line-height:1}
details[open] summary::after{content:"–"}
details p{color:var(--texto-2);margin-top:.8em;max-width:44em}

/* cierre y pie */
.cierre{background:var(--marino);color:#fff;text-align:center}
.cierre p{color:#C9CDE8;max-width:34em;margin:0 auto 2rem;font-size:1.15rem}
.cierre .acc{justify-content:center}
footer{background:#0D1233;color:#B9BEE0;padding:48px 0 36px;font-size:.92rem}
footer .c{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px}
footer img{height:28px;width:auto;margin-bottom:14px}
footer b{display:block;color:#fff;font-weight:600;margin-bottom:.7em}
footer a{color:#B9BEE0;text-decoration:none;display:block;margin-bottom:.45em}footer a:hover{color:#fff}
.legal{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:20px;font-size:.84rem;color:#8C92BD}

@media (max-width:980px){.fun{grid-template-columns:repeat(2,1fr)}.hero .c,.dos{grid-template-columns:1fr;gap:40px}}
@media (max-width:760px){body{font-size:17px}section{padding:64px 0}.hero{padding:48px 0 64px}
 .tres,.pasos,.camino,footer .c{grid-template-columns:1fr}.fun{grid-template-columns:1fr}
 .menu{display:block}.nav{display:none;position:absolute;top:68px;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:8px 24px 20px;border-bottom:1px solid var(--borde)}
 .nav.abierto{display:flex}.nav a{padding:12px 0}.nav .btn{justify-content:center;margin-top:8px}
 .fecha{flex-direction:column;align-items:flex-start;gap:4px}.fila{grid-template-columns:1fr auto}.fila .i{display:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* recreación animada del programa */
.idea{margin-top:40px}
.idea .tres{margin-top:26px}
.idea .verbo{transition:border-color .4s,box-shadow .4s,background .4s}
.idea .verbo.activo{border-color:var(--violeta);background:var(--lila-claro);box-shadow:0 0 0 3px rgba(90,72,245,.14)}
.marco{position:relative;background:var(--violeta);border-radius:30px;padding:clamp(8px,1.2vw,16px);box-shadow:0 30px 70px -35px rgba(19,26,67,.45)}
.marco .demo{border:0;box-shadow:none}
.demo{--u:1cqw;position:relative;container-type:inline-size;background:#EEF0F7;border:1px solid var(--borde);border-radius:18px;aspect-ratio:16/9;overflow:hidden;color:var(--marino);box-shadow:0 30px 70px -40px rgba(19,26,67,.5);font-size:calc(var(--u)*1.25);line-height:1.35}
.app{position:absolute;inset:0;display:grid;grid-template-columns:calc(var(--u)*17) 1fr;grid-template-rows:calc(var(--u)*3.4) 1fr}
.barra-v{grid-column:1/-1;background:#fff;border-bottom:1px solid var(--borde);display:flex;align-items:center;gap:calc(var(--u)*.6);padding:0 calc(var(--u)*1.2)}
.barra-v i{width:calc(var(--u)*.9);height:calc(var(--u)*.9);border-radius:50%;background:#D9DCEA}
.barra-v span{margin-left:calc(var(--u)*1.2);background:#F2F3F9;border-radius:99px;padding:calc(var(--u)*.25) calc(var(--u)*1.6);font-size:calc(var(--u)*1.05);color:var(--texto-2)}
.lat{background:var(--marino);color:#C9CDE8;padding:calc(var(--u)*1.6) calc(var(--u)*1.1);display:flex;flex-direction:column;gap:calc(var(--u)*.35)}
.lat img{width:calc(var(--u)*10.5);height:auto;margin:0 0 calc(var(--u)*1.6) calc(var(--u)*.5)}
.lat a{color:#C9CDE8;display:flex;align-items:center;gap:calc(var(--u)*.9);padding:calc(var(--u)*.75) calc(var(--u)*.9);border-radius:calc(var(--u)*.8);font-weight:500;transition:background .3s,color .3s}
.lat a::before{content:"";width:calc(var(--u)*1.1);height:calc(var(--u)*1.1);border-radius:calc(var(--u)*.3);background:currentColor;opacity:.55}
.lat a.act{background:rgba(255,255,255,.13);color:#fff}.lat a.act::before{background:var(--turquesa);opacity:1}
.cuerpo{position:relative;overflow:hidden}
.pan{position:absolute;inset:0;padding:calc(var(--u)*2) calc(var(--u)*2.4);opacity:0;transform:translateY(calc(var(--u)*1.2));transition:opacity .45s ease,transform .45s ease;display:flex;flex-direction:column;gap:calc(var(--u)*1.3)}
.pan.on{opacity:1;transform:none}
.pan h4{font-size:calc(var(--u)*1.9);font-weight:600;letter-spacing:-.02em;display:flex;justify-content:space-between;align-items:center}
.pan h4 small{font-size:calc(var(--u)*1.1);font-weight:400;color:var(--texto-2)}
.bx{background:#fff;border:1px solid var(--borde);border-radius:calc(var(--u)*1.1);padding:calc(var(--u)*1.2) calc(var(--u)*1.4)}
.kp{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--u)*1.1)}
.kp .bx span{display:block;color:var(--texto-2);font-size:calc(var(--u)*1.05)}.kp .bx b{font-size:calc(var(--u)*2.1);font-weight:600;font-variant-numeric:tabular-nums}
.kp .bx:nth-child(2) b{color:var(--ok)}.kp .bx:nth-child(4) b{color:var(--venc)}
.gra{flex:1;display:flex;align-items:flex-end;gap:calc(var(--u)*1.2);min-height:0}
.gra i{flex:1;background:var(--lila);border-radius:calc(var(--u)*.5) calc(var(--u)*.5) 0 0;height:0;transition:height .9s cubic-bezier(.2,.8,.2,1)}
.gra i.t{background:var(--turquesa)}.gra i.n{background:#F3B1B4}
.pan.on .gra i{height:var(--h)}
.bot{background:var(--violeta);color:#fff;border-radius:calc(var(--u)*.8);padding:calc(var(--u)*.6) calc(var(--u)*1.5);font-size:calc(var(--u)*1.2);font-weight:500;white-space:nowrap;transition:transform .15s,background .15s}
.bot.pres{transform:scale(.94);background:var(--violeta-osc)}
.bot.sec{background:#fff;color:var(--marino);border:1px solid var(--marino)}
.tb{display:grid;gap:0;padding:calc(var(--u)*.4) calc(var(--u)*1.4)}
.tr{display:grid;grid-template-columns:1.1fr 2fr 1fr auto;gap:calc(var(--u)*1.2);align-items:center;padding:calc(var(--u)*.8) 0;border-top:1px solid var(--borde);font-variant-numeric:tabular-nums}
.tr:first-child{border-top:0;color:var(--texto-2);font-size:calc(var(--u)*1.05)}
.tr span:nth-child(3){text-align:right}
.demo .chip{font-size:calc(var(--u)*1.05);padding:calc(var(--u)*.15) calc(var(--u)*.9)}
.tr.nueva{opacity:0;max-height:0;overflow:hidden;padding-top:0;padding-bottom:0;border-top-width:0;transition:opacity .5s,max-height .5s,padding .5s;background:var(--lila-claro);margin:0 calc(var(--u)*-1.4);padding-left:calc(var(--u)*1.4);padding-right:calc(var(--u)*1.4)}
.tr.nueva.ver{opacity:1;max-height:calc(var(--u)*6);padding-top:calc(var(--u)*.8);padding-bottom:calc(var(--u)*.8);border-top-width:1px}
.frm{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*1.1)}
.cmp{display:flex;flex-direction:column;gap:calc(var(--u)*.3)}.cmp label{font-size:calc(var(--u)*1.05);color:var(--texto-2)}
.cmp div{border:1px solid #D5D8E8;border-radius:calc(var(--u)*.7);padding:calc(var(--u)*.65) calc(var(--u)*.9);min-height:calc(var(--u)*3);background:#fff;transition:border-color .3s,box-shadow .3s}
.cmp div.foco{border-color:var(--violeta);box-shadow:0 0 0 calc(var(--u)*.25) rgba(90,72,245,.18)}
.tot{display:flex;justify-content:flex-end;align-items:center;gap:calc(var(--u)*2);font-variant-numeric:tabular-nums}
.tot b{font-size:calc(var(--u)*2);font-weight:600}
.aparece{opacity:0;transform:translateY(calc(var(--u)*.8));transition:opacity .45s,transform .45s}.aparece.ver{opacity:1;transform:none}
.tost{position:absolute;right:calc(var(--u)*2.4);bottom:calc(var(--u)*2);background:var(--marino);color:#fff;border-radius:calc(var(--u)*1);padding:calc(var(--u)*.9) calc(var(--u)*1.4);display:flex;align-items:center;gap:calc(var(--u)*.8);font-size:calc(var(--u)*1.2);box-shadow:0 calc(var(--u)*1.5) calc(var(--u)*3) calc(var(--u)*-1.5) rgba(19,26,67,.6)}
.tost::before{content:"";width:calc(var(--u)*1.8);height:calc(var(--u)*1.8);border-radius:50%;background:var(--turquesa) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='%23131A43' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.gas{display:grid;grid-template-columns:.8fr 1.2fr;gap:calc(var(--u)*1.6);flex:1;min-height:0}
.doc{position:relative;background:#fff;border:1px solid var(--borde);border-radius:calc(var(--u)*1);padding:calc(var(--u)*1.6);display:flex;flex-direction:column;gap:calc(var(--u)*.9);overflow:hidden}
.doc i{height:calc(var(--u)*.8);border-radius:99px;background:#E4E6F1}.doc i:nth-child(1){width:55%;height:calc(var(--u)*1.3);background:#C9CDE8}.doc i:nth-child(3){width:80%}.doc i:nth-child(5){width:65%}.doc i:nth-child(7){width:40%;margin-left:auto;background:#C9CDE8}
.doc::after{content:"";position:absolute;left:0;right:0;top:-12%;height:12%;background:linear-gradient(180deg,transparent,rgba(90,72,245,.28));border-bottom:2px solid var(--violeta)}
.doc.lee::after{animation:lee 1.6s ease-in-out 2}
@keyframes lee{to{top:100%}}
.cmps{display:grid;gap:calc(var(--u)*.9);align-content:start}
.banco{display:grid;gap:calc(var(--u)*.9)}
.mov{display:flex;justify-content:space-between;align-items:center;gap:calc(var(--u)*1)}
.mov small{display:block;color:var(--texto-2);font-size:calc(var(--u)*1.05)}.mov b{font-weight:600;font-variant-numeric:tabular-nums;font-size:calc(var(--u)*1.5)}
.une2{justify-self:center;color:var(--violeta);font-weight:500;font-size:calc(var(--u)*1.15)}
.mods{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--u)*1.1)}
.mods .bx{display:flex;flex-direction:column;gap:calc(var(--u)*.5)}.mods b{font-size:calc(var(--u)*1.9);font-weight:600}.mods span{color:var(--texto-2);font-size:calc(var(--u)*1.05)}
.fila-b{display:flex;justify-content:space-between;align-items:center;gap:calc(var(--u)*1.2)}
.zip{display:inline-flex;align-items:center;gap:calc(var(--u)*.8);background:var(--ok-f);color:var(--ok);border-radius:99px;padding:calc(var(--u)*.5) calc(var(--u)*1.4);font-weight:500}
.tela{position:absolute;inset:0;z-index:3;background:var(--marino);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*1.6);text-align:center;opacity:0;pointer-events:none;transition:opacity .6s}
.tela.on{opacity:1}
.tela p{font-weight:600;font-size:calc(var(--u)*5.2);letter-spacing:-.03em;line-height:1.08}.tela p em{font-style:normal;color:var(--lila)}
.tela img{width:calc(var(--u)*34);height:auto}.tela span{font-size:calc(var(--u)*2.4);color:#C9CDE8;font-weight:500}
.curs{position:absolute;left:0;top:0;z-index:4;width:calc(var(--u)*2.8);height:calc(var(--u)*2.8);transform:translate(60cqw,40cqw);transition:transform .75s cubic-bezier(.3,.7,.2,1),opacity .3s;opacity:0;pointer-events:none}
.curs.ver{opacity:1}.curs.clic svg{transform:scale(.8)}.curs svg{width:100%;height:100%;transition:transform .12s;filter:drop-shadow(0 2px 3px rgba(19,26,67,.35))}
.caps{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.caps button{font:500 1.05rem Outfit,Arial,sans-serif;color:var(--texto-2);background:#fff;border:1.5px solid var(--borde);border-radius:99px;padding:.6em 1.45em;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.caps button:hover{border-color:var(--violeta)}
.caps button.act{background:var(--marino);color:#fff;border-color:var(--marino)}
.ctl{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px}
.ctl .fig{margin:0;text-align:left;font-size:.98rem}
.ctl button{font:500 .98rem Outfit,Arial,sans-serif;color:var(--marino);background:none;border:1.5px solid var(--borde);border-radius:99px;padding:.5em 1.3em;cursor:pointer;white-space:nowrap}
.ctl button:hover{background:var(--lila-claro)}
@container (max-width:620px){.app{grid-template-columns:1fr}.lat{display:none}.kp,.mods{grid-template-columns:1fr 1fr}.gra{display:none}.tr{grid-template-columns:1fr 1.4fr 1fr auto;gap:calc(var(--u)*.8)}.gas{grid-template-columns:.6fr 1.4fr}}
@media (max-width:700px){.demo{--u:2.05cqw;aspect-ratio:1/1.02}}
@media (prefers-reduced-motion:reduce){.pan,.curs,.gra i,.aparece,.tela{transition:none}.doc.lee::after{animation:none}}
