:root{
  --rojo:#D40D29; --rojo-osc:#A80A21; --rojo-suave:#FBE9EC;
  --negro:#2E2B2A; --tinta:#45413F; --gris:#7A7572; --gris-claro:#A6A19D;
  --papel:#FAF9F8; --blanco:#FFFFFF; --borde:#E9E5E2; --borde-suave:#F1EEEB;
  --disp:'Jost',sans-serif; --body:'Source Sans 3',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--papel);color:var(--tinta);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img,svg{display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
.eyebrow{font-family:var(--disp);font-size:13px;font-weight:500;letter-spacing:.32em;color:var(--rojo);text-transform:uppercase}
h1,h2,h3{font-family:var(--disp);color:var(--negro);line-height:1.16;letter-spacing:.005em;font-weight:600}
.marca-i{font-style:italic;color:var(--rojo);font-weight:600}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:500;font-size:15.5px;letter-spacing:.02em;border:none;cursor:pointer;border-radius:10px;padding:14px 26px;transition:background .15s,transform .1s}
.btn:active{transform:translateY(1px)}
.btn-rojo{background:var(--rojo);color:#fff}
.btn-rojo:hover{background:var(--rojo-osc)}
.btn-linea{background:transparent;color:var(--negro);border:1.5px solid var(--borde);padding:12.5px 24px}
.btn-linea:hover{border-color:var(--negro)}
.btn .fl{transition:transform .15s}
.btn:hover .fl{transform:translateX(3px)}
:focus-visible{outline:2.5px solid var(--rojo);outline-offset:2px;border-radius:4px}

/* trazo inclinado de marca (eco de la cursiva del wordmark) */
.trazo{display:inline-block;width:58px;height:8px;background:var(--rojo);transform:skewX(-24deg);border-radius:2px}

/* ---------- Header ---------- */
header{position:sticky;top:0;z-index:40;background:rgba(250,249,248,.93);backdrop-filter:blur(8px);border-bottom:1px solid var(--borde-suave)}
.nav{display:flex;align-items:center;justify-content:space-between;height:80px}
.nav-logo img{height:44px;width:auto}
.nav-links{display:flex;gap:36px;font-family:var(--disp);font-size:15px;font-weight:500;color:var(--tinta)}
.nav-links a{position:relative;padding:6px 0}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--rojo);transform:skewX(-24deg);transition:width .2s}
.nav-links a:hover::after{width:100%}
@media(max-width:900px){.nav-links{display:none}}

/* ---------- Hero ---------- */
.hero{position:relative;padding:80px 0 36px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:44px;align-items:center}
.hero h1{font-size:clamp(31px,4.4vw,46px);margin:16px 0 14px}
.hero .sub{max-width:470px;color:var(--gris);font-size:17px;margin-top:20px}
.garantia{display:inline-flex;align-items:center;gap:10px;margin-top:26px;background:var(--blanco);border:1px solid var(--borde);border-radius:999px;padding:9px 18px 9px 12px;font-family:var(--disp);font-size:13.5px;font-weight:500;color:var(--negro);box-shadow:0 8px 24px -16px rgba(46,43,42,.25)}
.garantia img{height:16px;width:auto}
.hero-marca{display:flex;align-items:center;justify-content:center}
.hero-marca img{width:100%;max-width:460px;height:auto;filter:drop-shadow(0 24px 40px rgba(212,13,41,.18))}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-marca{display:none}.hero{padding-top:52px}}

/* ---------- Cuestionario (landing) ---------- */
.cuest-zona{padding:40px 0 92px}
.cuestionario{background:var(--blanco);border:1px solid var(--borde);border-radius:18px;box-shadow:0 28px 64px -32px rgba(46,43,42,.20);max-width:860px;margin:0 auto;padding:38px 44px 34px}
@media(max-width:640px){.cuestionario{padding:28px 20px}}
.prog{display:flex;align-items:center;gap:14px;margin-bottom:30px}
.prog-lab{font-family:var(--disp);font-size:13px;font-weight:600;color:var(--rojo);white-space:nowrap}
.prog-pist{flex:1;display:flex;gap:6px}
.pip{height:4px;flex:1;border-radius:2px;background:var(--borde);transform:skewX(-24deg);transition:background .3s}
.pip.hecho{background:var(--rojo)}
.prog-paso{font-family:var(--disp);font-size:13px;color:var(--gris-claro);white-space:nowrap}
.paso{display:none;animation:ap .25s ease}
.paso.activo{display:block}
@keyframes ap{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.paso h3{font-size:23px;text-align:center}
.paso .desc{text-align:center;color:var(--gris);font-size:14.5px;margin:6px 0 26px}
.f{margin-bottom:18px}
.f>label{display:block;font-family:var(--disp);font-size:13px;font-weight:500;color:var(--negro);margin-bottom:7px}
.f input,.f select,.f textarea{width:100%;font-family:var(--body);font-size:15px;color:var(--negro);background:#fff;border:1.5px solid var(--borde);border-radius:9px;padding:12px 14px;transition:border-color .15s}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--rojo);outline:none}
.f textarea{min-height:84px;resize:vertical}
.f .pista{font-size:12.5px;color:var(--gris-claro);margin-top:5px}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.dos{grid-template-columns:1fr}}
.opciones{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.opcion{border:1.5px solid var(--borde);border-radius:9px;padding:13px;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;font-family:var(--disp);font-size:14.5px;font-weight:500;color:var(--tinta);background:#fff;transition:border-color .15s,background .15s}
.opcion:hover{border-color:var(--gris-claro)}
.opcion.sel{border-color:var(--rojo);background:var(--rojo-suave);color:var(--rojo)}
.nota-ciega{display:flex;gap:12px;align-items:flex-start;background:var(--rojo-suave);border-radius:12px;padding:14px 16px;font-size:14px;color:var(--tinta);margin-top:4px}
.nota-ciega b{color:var(--rojo)}
.paso-pie{display:flex;justify-content:space-between;align-items:center;margin-top:28px;gap:12px}
.confid{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12.5px;color:var(--gris-claro);margin-top:22px}
.rev{border:1px solid var(--borde);border-radius:12px;overflow:hidden;margin-bottom:6px}
.rev-fila{display:grid;grid-template-columns:190px 1fr;gap:12px;padding:11px 16px;font-size:14.5px;border-top:1px solid var(--borde-suave)}
.rev-fila:first-child{border-top:none}
.rev-fila dt{color:var(--gris);font-size:13px;font-family:var(--disp);font-weight:500}
.rev-fila dd{color:var(--negro)}
@media(max-width:640px){.rev-fila{grid-template-columns:1fr;gap:2px}}
.exito{text-align:center;padding:26px 0 8px}
.exito h3{font-size:24px;margin:18px 0 8px}
.exito p{color:var(--gris);max-width:480px;margin:0 auto 6px}
.err{color:var(--rojo);font-size:13px;margin-top:10px;display:none;text-align:center}

/* ---------- Secciones ---------- */
section{padding:84px 0}
.sec-cab{text-align:center;max-width:660px;margin:0 auto 52px}
.sec-cab h2{font-size:clamp(26px,3.4vw,34px);margin-top:14px}
.sec-cab p{color:var(--gris);margin-top:12px}

/* Cómo funciona */
#como{background:var(--blanco);border-top:1px solid var(--borde-suave);border-bottom:1px solid var(--borde-suave)}
.pasos4{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;position:relative}
@media(max-width:900px){.pasos4{grid-template-columns:1fr 1fr;gap:28px}}
@media(max-width:560px){.pasos4{grid-template-columns:1fr}}
.paso4{text-align:center;padding:0 14px;position:relative}
.paso4 .circ{width:80px;height:80px;border-radius:999px;border:1.5px solid var(--borde);background:var(--papel);display:grid;place-items:center;margin:0 auto 18px;position:relative}
.paso4 .num{position:absolute;top:-6px;right:-8px;width:27px;height:27px;border-radius:8px;transform:skewX(-10deg);background:var(--rojo);color:#fff;font-family:var(--disp);font-size:13px;font-weight:600;display:grid;place-items:center}
.paso4 h3{font-size:17px;margin-bottom:8px}
.paso4 p{font-size:14px;color:var(--gris)}
.flecha-p{position:absolute;top:32px;right:-16px;color:var(--rojo)}
@media(max-width:900px){.flecha-p{display:none}}
.como-nota{max-width:640px;margin:46px auto 0;text-align:center;font-size:14.5px;color:var(--gris);border-top:1px solid var(--borde-suave);padding-top:26px}
.como-nota b{color:var(--negro)}

/* Ventajas */
.vent-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media(max-width:900px){.vent-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vent-grid{grid-template-columns:1fr}}
.vent{background:var(--blanco);border:1px solid var(--borde);border-radius:16px;padding:26px 22px;text-align:center}
.vent .cifra{font-family:var(--disp);font-style:italic;font-size:33px;font-weight:600;color:var(--rojo)}
.vent .cifra small{font-size:16px;font-weight:500}
.vent h3{font-size:15.5px;margin:8px 0 6px}
.vent p{font-size:13.5px;color:var(--gris)}
.vent-extra{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
@media(max-width:800px){.vent-extra{grid-template-columns:1fr}}
.vent-l{background:var(--blanco);border:1px solid var(--borde);border-radius:16px;padding:24px 26px;display:flex;gap:16px;align-items:flex-start}
.vent-l .ic{flex-shrink:0;width:44px;height:44px;border-radius:12px;background:var(--rojo-suave);display:grid;place-items:center;color:var(--rojo)}
.vent-l h3{font-size:16px;margin-bottom:4px}
.vent-l p{font-size:14px;color:var(--gris)}
.aviso{font-size:12.5px;color:var(--gris-claro);text-align:center;margin-top:26px}

/* Empresas / Asesorías */
#canales{background:var(--negro)}
#canales .sec-cab h2{color:#fff}
#canales .sec-cab p{color:#B8B3AF}
.can-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:800px){.can-grid{grid-template-columns:1fr}}
.can{background:#3A3735;border:1px solid #4A4644;border-radius:18px;padding:34px 32px}
.can .eyebrow{color:#F08A98}
.can h3{color:#fff;font-size:21.5px;margin:10px 0 12px}
.can p{color:#B8B3AF;font-size:15px;margin-bottom:18px}
.can ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin-bottom:26px}
.can li{display:flex;gap:10px;align-items:flex-start;color:#E2DEDB;font-size:14.5px}
.can li svg{flex-shrink:0;margin-top:4px}

/* Pilares */
.pilares{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:800px){.pilares{grid-template-columns:1fr}}
.pilar{background:var(--blanco);border:1px solid var(--borde);border-radius:16px;padding:28px 26px;display:flex;gap:16px;align-items:flex-start}
.pilar .ic{flex-shrink:0;color:var(--negro);width:34px;display:flex;justify-content:center}
.pilar .ic img{height:22px;width:auto;margin-top:4px}
.pilar h3{font-size:16.5px;margin-bottom:6px}
.pilar p{font-size:14px;color:var(--gris)}

/* Banner cierre */
.cierre{background:var(--blanco);border:1px solid var(--borde);border-radius:20px;padding:42px 46px;display:flex;align-items:center;gap:34px;justify-content:space-between;flex-wrap:wrap}
.cierre-l{display:flex;align-items:center;gap:28px}
.cierre h2{font-size:clamp(24px,3vw,31px);max-width:430px}
.cierre .gar2{font-family:var(--disp);font-size:13.5px;color:var(--gris);margin-top:8px;letter-spacing:.04em}
.sello{width:88px;height:88px;border-radius:22px;background:var(--negro);display:grid;place-items:center;flex-shrink:0}
.sello img{width:58px;height:auto}
@media(max-width:640px){.cierre{padding:30px 24px}.cierre-l{gap:18px}}

/* Footer */
footer{border-top:1px solid var(--borde);padding:46px 0 30px;background:var(--papel)}
.foot-top{display:flex;justify-content:space-between;align-items:center;gap:26px;flex-wrap:wrap}
.foot-logo img{height:52px;width:auto}
.foot-tag{font-family:var(--disp);font-size:11.5px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--gris-claro);margin-top:10px}
.foot-links{display:flex;gap:30px;font-family:var(--disp);font-size:14.5px;font-weight:500}
.foot-base{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--borde-suave);margin-top:30px;padding-top:22px;font-size:13px;color:var(--gris-claro)}
.foot-base a:hover{color:var(--tinta)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}


/* =====================================================================
   Sistema ALZA — estilos de la aplicación (cuestionario conectado,
   página de subida del PDF firmado, resultados y errores)
   ===================================================================== */

/* Campos: estados de validación y mensajes */
.f>label .req{color:var(--rojo);margin-left:2px}
.f input.ok,.f select.ok,.f textarea.ok{border-color:#1a6b4a}
.f input.err,.f select.err,.f textarea.err{border-color:var(--rojo)}
.f .msg{font-size:12.5px;margin-top:5px;display:none}
.f .msg.err{display:block;color:var(--rojo)}
.f .msg.ok{display:block;color:#1a6b4a}
.f input[readonly]{background:var(--papel);color:var(--gris)}
.f select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%237A7572' d='M6 8L0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
.f select:disabled{background-color:var(--papel);color:var(--gris-claro)}
.f input[type=number]{-moz-appearance:textfield}
.opcion input[type=radio]{position:absolute;opacity:0;width:0;height:0}
.opcion{position:relative}
.opcion:focus-within{outline:2.5px solid var(--rojo);outline-offset:2px}

/* Domicilio */
.dir1{display:grid;grid-template-columns:180px 1fr;gap:16px}
.dir2{display:grid;grid-template-columns:110px 1fr 1fr;gap:16px}
@media(max-width:640px){.dir1{grid-template-columns:1fr}.dir2{grid-template-columns:1fr 1fr}}
.select-wrap{position:relative}
.cp-spinner{display:none;width:16px;height:16px;border:2px solid var(--borde);border-top-color:var(--rojo);border-radius:50%;animation:girar .7s linear infinite;position:absolute;right:38px;top:50%;margin-top:-8px}
@keyframes girar{to{transform:rotate(360deg)}}
.leyenda{font-family:var(--disp);font-size:13px;font-weight:500;color:var(--negro);margin:6px 0 10px}

/* Notas y avisos dentro del cuestionario */
.nota-horario{display:none;margin-top:8px;background:var(--rojo-suave);border-left:3px solid var(--rojo);border-radius:0 8px 8px 0;padding:9px 13px;font-size:12.5px;color:var(--tinta);line-height:1.6}
.nota-horario.visible{display:block}
.legal{background:#FFF8E6;border:1.5px solid #E6C97A;border-radius:12px;padding:14px 16px;font-size:13.5px;color:#7B4F00;line-height:1.7;margin-top:18px}
.legal b{font-weight:700}
.badge-fijo{display:inline-flex;align-items:center;gap:8px;background:#E6F4EE;color:#1a6b4a;border:1.5px solid #A8D9C2;border-radius:8px;padding:9px 14px;font-family:var(--disp);font-size:14px;font-weight:500}
.alerta{border-radius:12px;padding:13px 16px;font-size:14px;margin-bottom:18px;display:none;line-height:1.6}
.alerta.err{display:block;background:#FDECEA;border:1.5px solid #F5A0A0;color:#C0392B}
.alerta.ok{display:block;background:#E6F4EE;border:1.5px solid #A8D9C2;color:#1a6b4a}
.hp{position:absolute;left:-9999px;top:-9999px;opacity:0;height:0;overflow:hidden;pointer-events:none}
.btn:disabled{opacity:.6;cursor:not-allowed}
.rev-fila dd{white-space:pre-line}

/* Páginas de la aplicación (subida, resultado, error) */
.app-zona{padding:56px 0 92px}
.app-card{background:var(--blanco);border:1px solid var(--borde);border-radius:18px;box-shadow:0 28px 64px -32px rgba(46,43,42,.20);max-width:760px;margin:0 auto;padding:38px 44px 34px}
@media(max-width:640px){.app-card{padding:28px 20px}}
.app-card h1{font-size:clamp(24px,3.4vw,32px);margin:10px 0 8px}
.app-card .sub{color:var(--gris);font-size:15px;margin-bottom:22px}
.app-ref{display:inline-block;background:var(--rojo-suave);color:var(--rojo);border-radius:8px;padding:7px 14px;font-family:var(--disp);font-size:13.5px;font-weight:600;margin:6px 0 18px}
.banner{display:flex;gap:12px;align-items:flex-start;border-radius:12px;padding:14px 16px;font-size:14px;line-height:1.65;margin-bottom:22px}
.banner.ok{background:#E6F4EE;border:1.5px solid #A8D9C2;color:#1d5c3a}
.banner.warn{background:#FFF8E6;border:1.5px solid #E6C97A;color:#7B4F00}
.banner.err{background:#FDECEA;border:1.5px solid #F5A0A0;color:#C0392B}
.banner b{display:block;margin-bottom:2px}
.pasos-lista{list-style:none;margin:0 0 22px;display:flex;flex-direction:column;gap:9px}
.pasos-lista li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--tinta);line-height:1.55}
.pasos-lista li span.n{flex-shrink:0;width:24px;height:24px;border-radius:7px;transform:skewX(-10deg);background:var(--rojo);color:#fff;font-family:var(--disp);font-size:12.5px;font-weight:600;display:grid;place-items:center;margin-top:1px}
.zona-subida{display:block;border:2.5px dashed var(--borde);border-radius:14px;padding:34px 20px;text-align:center;cursor:pointer;background:var(--papel);transition:border-color .15s,background .15s;margin-bottom:16px}
.zona-subida:hover,.zona-subida.drag{border-color:var(--rojo);background:var(--rojo-suave)}
.zona-subida .ico{color:var(--rojo);margin:0 auto 10px}
.zona-subida .t1{font-family:var(--disp);font-size:15px;font-weight:500;color:var(--negro)}
.zona-subida .t2{font-size:13px;color:var(--gris-claro);margin-top:4px}
.zona-subida input[type=file]{display:none}
.fichero{display:none;align-items:center;gap:10px;background:#E6F4EE;border:1.5px solid #A8D9C2;border-radius:10px;padding:10px 14px;font-size:14px;color:#1d5c3a;margin-bottom:16px}
.fichero.visible{display:flex}
.fichero .quitar{margin-left:auto;cursor:pointer;color:var(--rojo);background:none;border:none;font-size:16px;padding:0 4px}
.btn-ancho{width:100%;justify-content:center;font-size:16px;padding:15px 26px}
.progreso{background:var(--borde-suave);border-radius:4px;height:6px;margin-bottom:14px;display:none;overflow:hidden}
.progreso span{display:block;height:6px;width:0;background:var(--rojo);transition:width .3s}
.detalle{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0;text-align:left}
@media(max-width:560px){.detalle{grid-template-columns:1fr}}
.detalle div{background:var(--papel);border:1px solid var(--borde-suave);border-radius:12px;padding:13px 15px}
.detalle dt{font-family:var(--disp);font-size:11.5px;font-weight:600;color:var(--gris-claro);text-transform:uppercase;letter-spacing:.06em;margin-bottom:3px}
.detalle dd{font-size:14.5px;color:var(--negro)}
.check-grande{width:72px;height:72px;border-radius:50%;background:var(--rojo-suave);display:grid;place-items:center;margin:0 auto 14px;animation:pop .4s cubic-bezier(.175,.885,.32,1.275) both}
@keyframes pop{0%{transform:scale(0);opacity:0}100%{transform:scale(1);opacity:1}}
.centrado{text-align:center}
.nota-pie{font-size:13px;color:var(--gris-claro);text-align:center;margin-top:18px;line-height:1.7}
.nota-pie a{color:var(--rojo)}
.enlace{color:var(--rojo);text-decoration:underline}

/* Cabecera en pantallas estrechas: el logotipo y el botón no deben solaparse */
@media(max-width:520px){.nav{height:64px;gap:10px}.nav-logo img{height:32px}.nav .btn{padding:9px 12px;font-size:13px;white-space:nowrap}}
