:root {
  --fondo: #ffffff;
  --fondo-alt: #f4f6f9;
  --superficie: #ffffff;
  --linea: #e2e7ee;
  --linea-fuerte: #c4cfdf;
  --texto: #0b1220;
  --texto-2: #4b5768;
  --azul: #0a47c2;          
  --azul-hover: #07358f;
  --azul-texto: #0a47c2;
  --azul-suave: #eaf0fc;
  --verde-marca: #22a637;
  --verde-texto: #167a27;
  --verde-suave: #e8f6eb;
  --morado: #7c4ddb; --morado-suave: #f3effe;
  --ambar: #9a5b00;  --ambar-suave: #fff6e5;  
  --tinta: #0b1220;         
  --sombra: 0 1px 2px rgba(11,18,32,.04), 0 16px 40px -20px rgba(11,18,32,.25);
  --radio: 14px;
  --mono: ui-monospace, "Cascadia Code", "SF Mono", Consolas, monospace;
  --sans: "Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, sans-serif;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --fondo: #0a0f1a; --fondo-alt: #0e1524; --superficie: #121a2b;
    --linea: #22304a; --linea-fuerte: #34476b;
    --texto: #e6ebf2; --texto-2: #9aa7bb;
    --azul: #2f6bea; --azul-hover: #4a80f0; --azul-texto: #7aa5ff; --azul-suave: #16233f;
    --verde-texto: #4cd264; --verde-suave: #12301c;
    --morado: #a98bff; --morado-suave: #231c3d;
    --ambar: #ffc154;  --ambar-suave: #33270f;
    --sombra: 0 1px 2px rgba(0,0,0,.3), 0 20px 40px -20px rgba(0,0,0,.7);
    color-scheme: dark;
  }
}
:root[data-tema="oscuro"] {
  --fondo: #0a0f1a; --fondo-alt: #0e1524; --superficie: #121a2b;
  --linea: #22304a; --linea-fuerte: #34476b;
  --texto: #e6ebf2; --texto-2: #9aa7bb;
  --azul: #2f6bea; --azul-hover: #4a80f0; --azul-texto: #7aa5ff; --azul-suave: #16233f;
  --verde-texto: #4cd264; --verde-suave: #12301c;
  --morado: #a98bff; --morado-suave: #231c3d;
  --ambar: #ffc154;  --ambar-suave: #33270f;
  --sombra: 0 1px 2px rgba(0,0,0,.3), 0 20px 40px -20px rgba(0,0,0,.7);
  color-scheme: dark;
}


*, *::before, *::after { box-sizing: border-box; margin: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body { background: var(--fondo); color: var(--texto); font: 17px/1.6 var(--sans); -webkit-font-smoothing: antialiased; transition: background .25s, color .25s; }
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
ul, ol { padding: 0; list-style: none; }
button { font: inherit; color: inherit; }
kbd { font: 11px var(--mono); border: 1px solid var(--linea-fuerte); border-bottom-width: 2px; border-radius: 4px; padding: 0 5px; background: var(--superficie); }
:focus-visible { outline: 2px solid var(--azul-texto); outline-offset: 3px; border-radius: 4px; }
.visualmente-oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.contenedor { max-width: 1180px; margin-inline: auto; padding-inline: 20px; }
.saltar { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--azul); color: #fff; padding: 10px 16px; border-radius: 8px; }
.saltar:focus { top: 12px; }
.boceto-aviso { background: #fff3c4; color: #3a2e00; font: 13px var(--mono); padding: 6px 16px; text-align: center; }
.boceto-aviso kbd { background: #fffbe6; color: #3a2e00; }


.progreso { position: fixed; inset: 0 0 auto; height: 3px; z-index: 60; pointer-events: none; }
.progreso span { display: block; height: 100%; background: linear-gradient(90deg, var(--azul) 0 50%, var(--verde-marca) 50%); background-size: 200% 100%; transform-origin: left; transform: scaleX(0); }


h1 { font-size: clamp(2.3rem, 5.4vw, 4rem); line-height: 1.05; letter-spacing: -.035em; font-weight: 700; margin-top: 22px; }
h1 em { font-style: normal; color: var(--azul-texto); }
h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); line-height: 1.15; letter-spacing: -.025em; }
h3 { font-size: 1.3rem; letter-spacing: -.01em; line-height: 1.3; }
h4 { font: 600 12px var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--texto-2); margin: 20px 0 8px; }
.kicker { font: 600 13px var(--mono); text-transform: uppercase; letter-spacing: .1em; color: var(--verde-texto); margin-bottom: 10px; }
.kicker-claro { color: #4cd264; }


.boton { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; font-weight: 600; padding: 13px 24px; border-radius: 10px; background: var(--azul); color: #fff; border: 1px solid var(--azul); cursor: pointer; transition: background .15s, transform .15s; }
.boton:hover { background: var(--azul-hover); }
.boton:active { transform: translateY(1px); }
.boton-sec { background: transparent; color: var(--texto); border-color: var(--linea-fuerte); }
.boton-sec:hover { background: var(--superficie); border-color: var(--azul-texto); color: var(--azul-texto); }
.boton-peq { padding: 8px 16px; font-size: 14px; }
.boton-claro { background: #fff; color: var(--tinta); border-color: #fff; font-family: var(--mono); }
.boton-claro:hover { background: #e8f6eb; }
.enlace-flecha { font-weight: 600; color: var(--azul-texto); text-decoration: none; }
.enlace-flecha:hover { text-decoration: underline; }


.cabecera { position: sticky; top: 0; z-index: 50; background: var(--fondo); border-bottom: 1px solid var(--linea); transition: background .25s; }
.cabecera-fila { display: flex; align-items: center; gap: 20px; padding-block: 12px; }
.marca { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; margin-right: auto; }
.marca-escudo { width: 34px; height: 38px; }
.escudo-hueco { fill: var(--fondo); transition: fill .25s; }
.marca-texto { display: grid; line-height: 1; }
.marca-texto b { font-size: 20px; letter-spacing: .02em; color: var(--azul-texto); }
.marca-texto span { font: 600 10.5px var(--sans); letter-spacing: .22em; color: var(--texto); margin-top: 3px; }
.nav { display: flex; align-items: center; gap: 24px; font-size: 15px; }
.nav a:not(.boton) { text-decoration: none; color: var(--texto-2); font-weight: 500; position: relative; padding-block: 6px; }
.nav a:not(.boton):hover, .nav a.actual { color: var(--texto); }
.nav a.actual::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--verde-marca); border-radius: 2px; }
.nav-cta { color: #fff !important; }
.cabecera-herramientas { display: flex; gap: 6px; }
.herramienta { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--linea); background: var(--superficie); border-radius: 10px; cursor: pointer; color: var(--texto-2); font-size: 13px; }
.herramienta:hover { color: var(--texto); border-color: var(--linea-fuerte); }
.atajo { width: auto; padding-inline: 10px; font-family: var(--mono); }
.icono-tema { width: 16px; height: 16px; border-radius: 50%; border: 2px solid currentColor; background: linear-gradient(90deg, currentColor 50%, transparent 50%); }
.menu-movil { display: none; font-size: 18px; }


.hero { padding-block: 88px 72px; border-bottom: 1px solid var(--linea);
  background-image: linear-gradient(var(--linea) 1px, transparent 1px), linear-gradient(90deg, var(--linea) 1px, transparent 1px);
  background-size: 48px 48px; background-position: -1px -1px; }
.hero-rejilla { display: grid; grid-template-columns: 1.25fr 1fr; gap: 56px; align-items: center; }
.pastilla { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; background: var(--superficie); border: 1px solid var(--linea); border-radius: 999px; padding: 6px 14px; color: var(--texto-2); }
.punto { width: 8px; height: 8px; border-radius: 50%; background: var(--verde-marca); box-shadow: 0 0 0 3px var(--verde-suave); flex: none; }
.entradilla { font-size: 1.18rem; color: var(--texto-2); max-width: 56ch; margin-top: 24px; }
.entradilla strong { color: var(--texto); }
.acciones { display: flex; align-items: center; gap: 12px; margin-top: 34px; flex-wrap: wrap; }


.terminal { margin: 0; background: var(--tinta); border: 1px solid #1d2940; border-radius: var(--radio); overflow: hidden; box-shadow: 0 30px 60px -30px rgba(11,18,32,.55); }
.terminal-cab { display: flex; gap: 14px; align-items: center; padding: 12px 16px; border-bottom: 1px solid #1d2940; color: #7d8aa0; font: 12px var(--mono); }
.luces { display: inline-flex; gap: 6px; }
.luces i { width: 10px; height: 10px; border-radius: 50%; background: #2a3650; }
.luces i:nth-child(1) { background: #ff5f57; } .luces i:nth-child(2) { background: #febc2e; } .luces i:nth-child(3) { background: #28c840; }
pre.terminal-cuerpo { margin: 0; padding: 18px 20px 22px; font: 13.5px/1.75 var(--mono); color: #c9d3e1; white-space: pre; overflow-x: auto; min-height: 330px; }
.t-user { color: #3fcf5c; font-weight: 600; } .t-ruta { color: #6d9bff; font-weight: 600; }
.t-dim { color: #7d8aa0; } .t-bar { color: #6d9bff; } .t-ok { color: #3fcf5c; } .t-fin { color: #ffd166; }
.t-live { color: #3fcf5c; font-weight: 700; animation: latido 1.6s ease-in-out infinite; }
.cursor { display: inline-block; width: 8px; height: 15px; background: #3fcf5c; vertical-align: -2px; animation: parpadeo 1s steps(1) infinite; }
@keyframes latido { 50% { opacity: .55; } }
@keyframes parpadeo { 50% { opacity: 0; } }

.cifras { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 64px; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--superficie); overflow: hidden; }
.cifras div { padding: 20px 24px; border-right: 1px solid var(--linea); }
.cifras div:last-child { border-right: 0; }
.cifras dt { font-size: 14px; color: var(--texto-2); }
.cifras dd { margin: 4px 0 0; font-size: 1.9rem; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.confianza { margin-top: 22px; font-size: 14px; color: var(--texto-2); font-weight: 600; letter-spacing: .01em; }
.confianza span { font-weight: 400; margin-right: 6px; }


.seccion { padding-block: 96px; }
.seccion-alt { background: var(--fondo-alt); border-block: 1px solid var(--linea); }
.seccion-cab { max-width: 660px; margin-bottom: 44px; }
.seccion-cab p:not(.kicker) { color: var(--texto-2); margin-top: 14px; font-size: 1.1rem; }


.leyenda { display: flex; flex-wrap: wrap; gap: 18px; margin: -20px 0 32px; font-size: 14px; color: var(--texto-2); }
.leyenda li, .areas li { display: inline-flex; align-items: center; gap: 7px; }
.leyenda li::before, .areas li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; flex: none; }
.a-seg::before { background: var(--verde-marca); } .a-datos::before { background: var(--morado); }
.a-infra::before { background: var(--ambar); } .a-dev::before { background: var(--azul-texto); }

.caso { display: grid; grid-template-columns: 1.15fr 1fr; gap: 48px; align-items: center; border: 1px solid var(--linea); border-radius: 20px; padding: 40px; background: var(--superficie); margin-bottom: 24px; transition: border-color .2s, box-shadow .2s; }
.caso:hover { border-color: var(--linea-fuerte); box-shadow: var(--sombra); }
.caso-inverso .caso-texto { order: 2; }
.caso h3 { font-size: 1.6rem; }
.proyecto-cab { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.tipo { font: 13px var(--mono); color: var(--texto-2); }
.estado { font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; background: var(--verde-suave); color: var(--verde-texto); }
.estado-lab { background: var(--azul-suave); color: var(--azul-texto); }
.resumen { color: var(--texto-2); margin-top: 8px; max-width: 70ch; }
.dos-col { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.lista li { position: relative; padding-left: 22px; color: var(--texto-2); font-size: 15.5px; margin-bottom: 6px; }
.lista li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 10px; height: 2px; background: var(--azul-texto); }
.col-seg .lista li::before { background: var(--verde-marca); }
.areas { display: flex; flex-wrap: wrap; gap: 7px; }
.areas li { font: 12.5px var(--mono); padding: 5px 10px; border-radius: 6px; border: 1px solid var(--linea); background: var(--fondo-alt); }
.areas .a-seg { background: var(--verde-suave); } .areas .a-datos { background: var(--morado-suave); }
.areas .a-infra { background: var(--ambar-suave); } .areas .a-dev { background: var(--azul-suave); }

.caso-visual { position: relative; border-radius: 16px; min-height: 300px; display: grid; place-items: center; padding: 28px; background: var(--fondo-alt); border: 1px solid var(--linea); overflow: hidden; }

.hoja { width: min(280px, 100%); background: #fff; color: #0b1220; border-radius: 8px; padding: 20px; box-shadow: 0 20px 40px -20px rgba(11,18,32,.45); transform: rotate(-2deg); transition: transform .4s; }
.caso:hover .hoja { transform: rotate(0) translateY(-4px); }
.hoja-cab { display: flex; justify-content: space-between; align-items: center; padding-bottom: 12px; border-bottom: 2px solid #0b1220; }
.hoja-logo { width: 36px; height: 36px; border-radius: 6px; background: #0a47c2; }
.hoja-cab div, .hoja-pie div { text-align: right; }
.hoja b { display: block; font-size: 14px; letter-spacing: .08em; }
.hoja small { display: block; font: 11px var(--mono); color: #4b5768; }
.hoja-filas { padding-block: 14px; display: grid; gap: 9px; }
.hoja-filas i { height: 8px; border-radius: 4px; background: #e2e7ee; } .hoja-filas .corta { width: 55%; }
.hoja-pie { display: flex; justify-content: space-between; align-items: end; border-top: 1px solid #e2e7ee; padding-top: 12px; }
.hoja-pie b { font-size: 18px; letter-spacing: 0; }
.qr { width: 54px; height: 54px; background: repeating-conic-gradient(#0b1220 0 25%, #fff 0 50%) 0 0 / 10px 10px; border: 4px solid #fff; outline: 1px solid #e2e7ee; }
.hash { color: #167a27 !important; }
.sello { position: absolute; right: 24px; bottom: 24px; background: var(--verde-suave); color: var(--verde-texto); font: 600 13px var(--mono); padding: 6px 12px; border-radius: 999px; border: 1px solid var(--verde-marca); }

.visual-informe { background: var(--tinta); border-color: #1d2940; }
.informe { width: 100%; max-width: 360px; font: 12.5px var(--mono); color: #c9d3e1; }
.informe-barra { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; }
.n { padding: 4px 9px; border-radius: 4px; font-size: 11.5px; }
.n-h { background: #3a1b1f; color: #ff8a8a; } .n-i { background: #3a311a; color: #ffd166; } .n-f { background: #18263f; color: #8fb3ff; }
.informe-fila { display: flex; gap: 10px; padding: 10px 12px; border-left: 2px solid #22304a; background: #111a2c; margin-bottom: 8px; }
.informe-fila b { display: block; color: #e6ebf2; font-weight: 600; } .informe-fila small { color: #7d8aa0; }
.pt { width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; flex: none; } .pt-i { background: #ffd166; } .pt-f { background: #8fb3ff; }
.informe-sha { margin-top: 12px; color: #3fcf5c; }

.movil { width: 190px; border: 8px solid #0b1220; border-radius: 28px; background: #fffaf3; color: #0b1220; padding: 26px 16px; display: grid; gap: 10px; text-align: center; box-shadow: 0 24px 40px -20px rgba(11,18,32,.5); }
.movil small { font-size: 11px; color: #4b5768; } .movil b { font-size: 16px; font-family: Georgia, serif; }
.m-si, .m-no { font-size: 12px; padding: 8px; border-radius: 8px; }
.m-si { background: #0b1220; color: #fff; } .m-no { border: 1px solid #e2e7ee; background: #fff; }
.m-ok { color: #167a27 !important; font-family: var(--mono); }

.visual-datos { align-content: center; gap: 18px; }
.barras { display: flex; align-items: end; gap: 12px; height: 140px; }
.barras i { width: 30px; border-radius: 6px 6px 0 0; background: var(--azul); transform-origin: bottom; }
.barras i:nth-child(1) { height: 70%; } .barras i:nth-child(2) { height: 45%; opacity: .5; }
.barras i:nth-child(3) { height: 92%; background: var(--verde-marca); } .barras i:nth-child(4) { height: 30%; opacity: .5; }
.barras i:nth-child(5) { height: 60%; }
.js .visible .barras i { animation: crecer .9s cubic-bezier(.2,.8,.2,1) both; }
.js .visible .barras i:nth-child(2) { animation-delay: .08s; } .js .visible .barras i:nth-child(3) { animation-delay: .16s; }
.js .visible .barras i:nth-child(4) { animation-delay: .24s; } .js .visible .barras i:nth-child(5) { animation-delay: .32s; }
@keyframes crecer { from { transform: scaleY(0); } }
.burbuja-ia { font-size: 12.5px; background: var(--superficie); border: 1px solid var(--linea); border-radius: 12px 12px 12px 2px; padding: 8px 12px; max-width: 250px; }
.casos-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.caso-compacto { grid-template-columns: 1fr; gap: 28px; align-items: start; margin-bottom: 0; padding: 28px; }
.caso-compacto .caso-visual { min-height: 230px; }
.caso-compacto h3 { font-size: 1.3rem; }


.filtros { display: flex; flex-wrap: wrap; gap: 8px; margin: -16px 0 28px; }
.filtro { border: 1px solid var(--linea); background: var(--superficie); border-radius: 999px; padding: 7px 16px; font-size: 14px; font-weight: 500; cursor: pointer; color: var(--texto-2); }
.filtro:hover { border-color: var(--linea-fuerte); color: var(--texto); }
.filtro.activo { background: var(--texto); color: var(--fondo); border-color: var(--texto); }
.competencias { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.competencias article { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); padding: 22px; border-left: 4px solid var(--azul-texto); display: flex; flex-direction: column; transition: opacity .25s, transform .25s; }
.competencias article[data-area="a-seg"] { border-left-color: var(--verde-marca); }
.competencias article[data-area="a-datos"] { border-left-color: var(--morado); }
.competencias article[data-area="a-infra"] { border-left-color: var(--ambar); }
.competencias article.atenuada { opacity: .25; transform: scale(.98); }
.competencias h3 { font-size: 1.05rem; margin-bottom: 8px; }
.competencias p { color: var(--texto-2); font-size: 14.5px; flex: 1; }
.competencias .evidencia { flex: none; margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--linea); font: 12px var(--mono); color: var(--texto); }
.competencias .evidencia::before { content: "→ "; color: var(--azul-texto); }


.servicios { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.servicios article { background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio); padding: 26px; border-top: 3px solid var(--azul-texto); }
.servicios article:nth-child(2) { border-top-color: var(--verde-marca); }
.servicios article:nth-child(3) { border-top-color: var(--texto); }
.servicios article:nth-child(4) { border-top-color: var(--ambar); }
.servicios h3 { font-size: 1.15rem; }
.servicios p { color: var(--texto-2); margin-top: 10px; font-size: 15.5px; }
.icono { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; background: var(--azul-suave); color: var(--azul-texto); font: 600 18px var(--mono); margin-bottom: 18px; }
.servicios article:nth-child(2) .icono { background: var(--verde-suave); color: var(--verde-texto); }
.servicios article:nth-child(3) .icono { background: var(--fondo-alt); color: var(--texto); }
.servicios article:nth-child(4) .icono { background: var(--ambar-suave); color: var(--ambar); }
.modalidades-titulo { margin: 56px 0 20px; font-size: 1.4rem; }
.modalidades { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.modalidad { position: relative; border: 1px solid var(--linea); border-radius: var(--radio); padding: 28px; background: var(--superficie); }
.modalidad-rec { border: 2px solid var(--azul-texto); }
.etiqueta-rec { position: absolute; top: -12px; left: 24px; background: var(--azul); color: #fff; font: 600 12px var(--sans); padding: 3px 10px; border-radius: 999px; }
.modalidad h4 { font: 700 1.3rem var(--sans); text-transform: none; letter-spacing: -.01em; color: var(--texto); margin: 0; }
.precio-tipo { font: 13px var(--mono); color: var(--verde-texto); margin: 6px 0 18px; }
.ideal { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--linea); font-size: 14.5px; }


.calc-rejilla { display: grid; grid-template-columns: 1fr 1.25fr; gap: 56px; align-items: start; }
.calc { background: var(--superficie); border: 1px solid var(--linea); border-radius: 20px; padding: 32px; box-shadow: var(--sombra); display: grid; gap: 24px; }
.calc-campo label { display: flex; justify-content: space-between; font-weight: 600; font-size: 15px; margin-bottom: 10px; }
.calc-campo output { font: 600 15px var(--mono); color: var(--azul-texto); }
input[type="range"] { width: 100%; accent-color: var(--azul); height: 6px; cursor: pointer; }
.calc-resultado { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding-top: 24px; border-top: 1px solid var(--linea); }
.calc-resultado div { background: var(--fondo-alt); border-radius: 12px; padding: 16px 18px; }
.calc-resultado span { font-size: 13px; color: var(--texto-2); }
.calc-resultado b { display: block; font-size: 2rem; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.calc-dinero { background: var(--verde-suave) !important; }
.calc-dinero b { color: var(--verde-texto); }
.calc-nota { grid-column: 1 / -1; font-size: 13px; color: var(--texto-2); }
.calc-resultado .boton { grid-column: 1 / -1; justify-content: center; }


.audit-rejilla { display: grid; grid-template-columns: 1fr 1.25fr; gap: 56px; align-items: start; }
.audit { background: var(--tinta); color: #c9d3e1; border-radius: 20px; overflow: hidden; border: 1px solid #1d2940; font-size: 15px; }
.audit-cab { display: flex; justify-content: space-between; gap: 12px; padding: 14px 20px; border-bottom: 1px solid #1d2940; font: 12.5px var(--mono); color: #7d8aa0; }
#audit-total { color: #3fcf5c; }
.audit-lista li { display: flex; gap: 14px; padding: 16px 20px; border-bottom: 1px solid #16203a; }
.audit-lista b { display: block; color: #e6ebf2; font-weight: 600; }
.audit-lista small { color: #9aa7bb; font-size: 13.5px; }
.audit-estado { flex: none; width: 74px; font: 600 12px var(--mono); padding-top: 2px; color: #7d8aa0; }
.audit-estado.ok { color: #3fcf5c; } .audit-estado.pendiente { color: #ffd166; } .audit-estado.fallo { color: #ff8a8a; }
.audit-nota { padding: 14px 20px; font: 12.5px/1.6 var(--mono); color: #9aa7bb; }
.audit-nota:empty { display: none; }


.pasos { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--linea); counter-reset: paso; }
.pasos li { padding: 28px 24px 0 0; position: relative; }
.pasos li::before { content: ""; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--azul-texto); }
.pasos span { font: 600 14px var(--mono); color: var(--azul-texto); }
.pasos h3 { margin: 12px 0 8px; font-size: 1.15rem; }
.pasos p { color: var(--texto-2); font-size: 15.5px; }


.sobre-rejilla { display: grid; grid-template-columns: 300px 1fr; gap: 64px; align-items: start; }
.perfil { position: sticky; top: 96px; border: 1px solid var(--linea); border-radius: 20px; padding: 28px; background: var(--superficie); }
.avatar { width: 96px; height: 96px; border-radius: 50%; display: grid; place-items: center; background: var(--tinta); color: #fff; font: 700 30px var(--sans); margin-bottom: 18px; box-shadow: 0 0 0 4px var(--superficie), 0 0 0 5px var(--linea-fuerte); }
.perfil-nombre { font-size: 1.5rem; }
.perfil-rol { color: var(--azul-texto); font-weight: 600; margin-top: 4px; }
.perfil-lugar { color: var(--texto-2); font-size: 15px; margin-bottom: 14px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.chips li { font: 12.5px var(--mono); padding: 5px 10px; border-radius: 6px; background: var(--fondo-alt); border: 1px solid var(--linea); }
.sobre-intro { color: var(--texto-2); font-size: 1.1rem; margin-top: 16px; max-width: 64ch; }
.trayectoria { margin: 40px 0 0; border-left: 2px solid var(--linea); }
.trayectoria li { position: relative; display: grid; grid-template-columns: 110px 1fr; gap: 20px; padding: 0 0 28px 28px; }
.trayectoria li::before { content: ""; position: absolute; left: -7px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--fondo); border: 2px solid var(--azul-texto); }
.trayectoria li:first-child::before { background: var(--verde-marca); border-color: var(--verde-marca); box-shadow: 0 0 0 4px var(--verde-suave); }
.cuando { font: 600 13px var(--mono); color: var(--texto-2); padding-top: 2px; }
.trayectoria h3 { font-size: 1.1rem; }
.donde { font-size: 14px; color: var(--azul-texto); font-weight: 600; margin: 2px 0 6px; }
.trayectoria p:not(.donde) { color: var(--texto-2); font-size: 15.5px; }
.formacion-titulo { margin: 16px 0 14px; font-size: 1.1rem; }
.formacion { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.formacion li { border: 1px solid var(--linea); border-radius: 10px; padding: 12px 14px; background: var(--fondo-alt); }
.formacion b { display: block; font-size: 15px; }
.formacion span { font-size: 13px; color: var(--texto-2); }


.faq-rejilla { display: grid; grid-template-columns: 1fr 1.5fr; gap: 56px; align-items: start; }
.faq details { background: var(--superficie); border: 1px solid var(--linea); border-radius: 12px; margin-bottom: 10px; }
.faq summary { cursor: pointer; padding: 18px 22px; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font: 400 22px/1 var(--mono); color: var(--azul-texto); transition: transform .2s; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding: 0 22px 18px; color: var(--texto-2); }


.contacto { background: var(--tinta); color: #fff; padding-block: 88px; }
.contacto-fila { display: flex; justify-content: space-between; align-items: center; gap: 32px; flex-wrap: wrap; }
.contacto p:not(.kicker) { color: #9aa7bb; margin-top: 10px; font-size: 1.1rem; }
.contacto-acciones { display: grid; justify-items: end; gap: 8px; }
.copiado { font: 13px var(--mono); color: #4cd264; min-height: 1.2em; }
.pie { border-top: 1px solid var(--linea); }
.pie-fila { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding-block: 28px; font-size: 14px; color: var(--texto-2); }


.chat-lanzador { position: fixed; right: 20px; bottom: 20px; z-index: 40; display: inline-flex; align-items: center; gap: 10px; background: var(--tinta); color: #fff; border: 1px solid #2a3650; border-radius: 999px; padding: 14px 20px; font-weight: 600; font-size: 15px; cursor: pointer; box-shadow: 0 16px 32px -12px rgba(11,18,32,.5); }
.chat-lanzador:hover { background: #18233a; }
.chat-lanzador-punto { width: 9px; height: 9px; border-radius: 50%; background: #3fcf5c; box-shadow: 0 0 0 3px rgba(63,207,92,.25); }
.chat-lanzador[aria-expanded="true"] { display: none; }
.chat { position: fixed; right: 20px; bottom: 20px; z-index: 41; width: min(380px, calc(100vw - 24px)); height: min(600px, calc(100vh - 40px)); background: var(--superficie); border: 1px solid var(--linea); border-radius: 18px; box-shadow: 0 30px 70px -20px rgba(11,18,32,.5); display: flex; flex-direction: column; overflow: hidden; }
.chat[hidden] { display: none; }
.chat-cab { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; background: var(--tinta); color: #fff; }
.chat-cab b { display: block; font-size: 15px; }
.chat-cab small { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #9aa7bb; }
.chat-cerrar { background: none; border: 0; color: #9aa7bb; font-size: 16px; cursor: pointer; padding: 6px; border-radius: 6px; }
.chat-cerrar:hover { color: #fff; background: #18233a; }
.chat-cuerpo { flex: 1; overflow-y: auto; padding: 18px; background: var(--fondo-alt); display: flex; flex-direction: column; gap: 10px; }
.chat-mensajes { display: flex; flex-direction: column; gap: 10px; }
.msg { max-width: 88%; padding: 10px 14px; font-size: 15px; line-height: 1.5; }
.msg-yo { align-self: flex-end; background: var(--azul); color: #fff; border-radius: 14px 14px 4px 14px; animation: entra .25s ease; }
.msg-bot { align-self: flex-start; background: var(--superficie); border: 1px solid var(--linea); border-radius: 14px 14px 14px 4px; animation: entra .25s ease; }
@keyframes entra { from { opacity: 0; transform: translateY(6px); } }
.chat-menu { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 4px; }
.chat-menu-titulo { font: 600 11px var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--texto-2); margin: 6px 0 2px; }
.chat-menu button { text-align: left; background: var(--superficie); border: 1px solid var(--linea-fuerte); color: var(--azul-texto); border-radius: 999px; padding: 8px 14px; font-weight: 500; font-size: 14px; cursor: pointer; }
.chat-menu button:hover { background: var(--azul-suave); }
.chat-contacto { margin-top: 6px; font-size: 14px; font-weight: 600; }
.chat-legal { font-size: 11.5px; color: var(--texto-2); padding: 10px 14px 12px; border-top: 1px solid var(--linea); }


.paleta { width: min(560px, calc(100vw - 32px)); margin: 12vh auto auto; padding: 0; border: 1px solid var(--linea-fuerte); border-radius: 16px; background: var(--superficie); color: var(--texto); box-shadow: 0 40px 80px -20px rgba(0,0,0,.5); }
.paleta::backdrop { background: rgba(5,9,18,.55); }
.paleta-busca { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--linea); font: 18px var(--mono); color: var(--verde-texto); }
.paleta-busca input { flex: 1; border: 0; outline: 0; background: transparent; color: var(--texto); font: 16px var(--sans); }
.paleta-lista { max-height: 320px; overflow-y: auto; padding: 8px; }
.paleta-lista li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 8px; cursor: pointer; font-size: 15px; }
.paleta-lista li small { font: 12px var(--mono); color: var(--texto-2); }
.paleta-lista li[aria-selected="true"] { background: var(--azul-suave); color: var(--azul-texto); }
.paleta-lista .vacio { color: var(--texto-2); cursor: default; }
.paleta-pie { padding: 10px 16px; border-top: 1px solid var(--linea); font-size: 12px; color: var(--texto-2); }


.js .aparece { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.js .aparece.visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js .aparece { opacity: 1; transform: none; }
}


@media (max-width: 1080px) {
  .competencias, .servicios { grid-template-columns: repeat(2, 1fr); }
  .nav { gap: 16px; }
}
@media (max-width: 920px) {
  .menu-movil { display: grid; }
  .atajo { display: none; }
  .nav { position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--fondo); border-bottom: 1px solid var(--linea); padding: 8px 20px 20px; display: none; }
  .nav.abierta { display: flex; }
  .nav a:not(.boton) { padding: 14px 0; border-bottom: 1px solid var(--linea); }
  .nav a.actual::after { display: none; }
  .nav-cta { margin-top: 16px; justify-content: center; }
  .hero-rejilla, .calc-rejilla, .audit-rejilla, .faq-rejilla, .sobre-rejilla, .caso, .casos-dos, .dos-col { grid-template-columns: 1fr; }
  .caso { padding: 24px; gap: 28px; }
  .caso-inverso .caso-texto { order: 0; }
  .cifras { grid-template-columns: 1fr 1fr; }
  .cifras div:nth-child(2) { border-right: 0; }
  .cifras div:nth-child(-n+2) { border-bottom: 1px solid var(--linea); }
  .pasos { grid-template-columns: 1fr 1fr; row-gap: 24px; }
  .perfil { position: static; }
  .hero { padding-block: 56px; }
  .seccion { padding-block: 64px; }
  .contacto-acciones { justify-items: start; }
}
@media (max-width: 560px) {
  .competencias, .servicios, .pasos, .formacion, .modalidades, .calc-resultado { grid-template-columns: 1fr; }
  .trayectoria li { grid-template-columns: 1fr; gap: 4px; }
  pre.terminal-cuerpo { font-size: 11px; padding: 14px; min-height: 0; }
  .calc { padding: 22px; }
  .chat { right: 12px; bottom: 12px; height: calc(100vh - 24px); }
  .chat-lanzador { right: 12px; bottom: 12px; }
}




.pastilla { padding: 4px 14px 4px 4px; }
.pastilla b { color: var(--texto); font-weight: 600; }
.pastilla-foto { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
.avatar-foto { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; margin-bottom: 18px; box-shadow: 0 0 0 4px var(--superficie), 0 0 0 5px var(--linea-fuerte); }


.app-icono { position: absolute; top: 22px; left: 22px; width: 76px; height: 76px; border-radius: 18px; box-shadow: 0 14px 30px -10px rgba(10,71,194,.6); z-index: 1; }


.arq { display: grid; grid-template-columns: 1fr 28px 1.2fr 28px 1.3fr 28px 1.4fr; align-items: center; gap: 0; padding: 32px; border: 1px solid var(--linea); border-radius: 20px; background:
  radial-gradient(circle, var(--linea) 1px, transparent 1.5px) 0 0 / 22px 22px, var(--fondo-alt); }
.arq-col { display: grid; gap: 12px; }
.arq-nodo { background: var(--superficie); border: 1px solid var(--linea); border-radius: 12px; padding: 14px 16px; box-shadow: var(--sombra); }
.arq-nodo b { display: block; font-size: 15px; margin-top: 2px; }
.arq-nodo small { display: block; font-size: 12.5px; color: var(--texto-2); margin-top: 2px; }
.arq-nodo code { font: 12px var(--mono); color: var(--azul-texto); }
.arq-nodo ul { margin-top: 6px; display: grid; gap: 2px; }
.arq-nodo li { font-size: 12.5px; color: var(--texto-2); padding-left: 14px; position: relative; }
.arq-nodo li::before { content: "✓"; position: absolute; left: 0; color: var(--verde-texto); font-size: 11px; }
.arq-tag { font: 600 10.5px var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--texto-2); }
.arq-borde { border: 2px solid #f38020; }               
.arq-borde .arq-tag { color: #c25e05; }
.arq-func { border-left: 4px solid var(--azul-texto); }
.arq-dato { border-left: 4px solid var(--morado); }
.arq-ia { border-left: 4px solid var(--verde-marca); }
.arq-mail { border-left: 4px solid var(--ambar); }
.arq-flecha { height: 2px; background: var(--linea-fuerte); position: relative; overflow: visible; }
.arq-flecha::after { content: ""; position: absolute; right: -1px; top: -4px; border: 5px solid transparent; border-left: 7px solid var(--linea-fuerte); border-right: 0; }

.arq-flecha::before { content: ""; position: absolute; top: -3px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--verde-marca); animation: paquete 2.4s linear infinite; }
.arq-flecha:nth-of-type(4)::before { animation-delay: .8s; } .arq-flecha:nth-of-type(6)::before { animation-delay: 1.6s; }
@keyframes paquete { from { left: 0; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } to { left: calc(100% - 8px); opacity: 0; } }
.arq-pie { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 20px; }
.arq-pie li { font-size: 14px; color: var(--texto-2); border-top: 2px solid var(--linea); padding-top: 12px; }
.arq-pie b { display: block; color: var(--texto); font-size: 14.5px; }
:root[data-tema="oscuro"] .arq-borde .arq-tag { color: #ff9a3c; }
@media (prefers-color-scheme: dark) { :root:not([data-tema="claro"]) .arq-borde .arq-tag { color: #ff9a3c; } }


.contacto { padding-block: 96px; }
.contacto-rejilla { display: grid; grid-template-columns: 1fr 1.25fr; gap: 56px; align-items: start; }
.contacto-garantias { margin: 24px 0 28px; display: grid; gap: 8px; }
.contacto-garantias li { color: #c9d3e1; padding-left: 26px; position: relative; }
.contacto-garantias li::before { content: "✓"; position: absolute; left: 0; color: #4cd264; font-weight: 700; }
.contacto-acciones { justify-items: start; }

.formulario { background: #fff; color: #0b1220; border-radius: 20px; padding: 30px; display: grid; gap: 16px; box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); }
.f-fila { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.f-campo { display: grid; gap: 6px; }
.f-campo label { font-weight: 600; font-size: 14px; display: flex; justify-content: space-between; }
.f-opc, .f-contador { font-weight: 400; color: #4b5768; font-size: 13px; }
.formulario input:not([type="checkbox"]), .formulario select, .formulario textarea { width: 100%; font: 15px var(--sans); color: #0b1220; background: #f8f9fb; border: 1px solid #cfd7e3; border-radius: 10px; padding: 11px 13px; transition: border-color .15s, box-shadow .15s; }
.formulario textarea { resize: vertical; min-height: 120px; }
.formulario input:focus, .formulario select:focus, .formulario textarea:focus { outline: 0; border-color: #0a47c2; box-shadow: 0 0 0 3px #d6e2fb; background: #fff; }
.formulario [aria-invalid="true"] { border-color: #c62828; background: #fff6f6; }
.f-error { font-size: 13px; color: #b3261e; min-height: 0; }
.f-error:empty { display: none; }
.f-trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.f-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: #4b5768; }
.f-check input { margin-top: 3px; width: 18px; height: 18px; accent-color: #0a47c2; flex: none; }
.f-check a { color: #0a47c2; }
.turnstile { display: flex; align-items: center; gap: 12px; border: 1px solid #cfd7e3; border-radius: 8px; padding: 12px 14px; font-size: 14px; color: #4b5768; background: #f8f9fb; }
.ts-caja { width: 22px; height: 22px; border-radius: 50%; border: 2px solid #cfd7e3; border-top-color: #f38020; animation: girar 1s linear infinite; flex: none; }
.turnstile.ts-ok .ts-caja { animation: none; border-color: #22a637; background: #22a637; position: relative; }
.turnstile.ts-ok .ts-caja::after { content: "✓"; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 12px; font-weight: 700; }
.turnstile.ts-ok { color: #167a27; border-color: #bfe5c7; background: #f1faf3; }
@keyframes girar { to { transform: rotate(360deg); } }
.f-enviar { justify-content: center; position: relative; background: #0a47c2; border-color: #0a47c2; }
.f-enviar:disabled { opacity: .8; cursor: progress; }
.f-spinner { display: none; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: girar .8s linear infinite; }
.enviando .f-spinner { display: inline-block; }
.enviando .f-enviar-texto::after { content: "…"; }
.f-resultado { border-radius: 10px; padding: 12px 14px; font-size: 14.5px; }
.f-resultado[hidden] { display: none; }
.f-ok { background: #e8f6eb; color: #14532d; border: 1px solid #bfe5c7; }
.f-error.f-resultado, .f-resultado.f-error { background: #fdecec; color: #8a1c1c; border: 1px solid #f3c4c4; display: block; }


.chat-lanzador { padding-left: 16px; }
.chat-cab { gap: 12px; justify-content: flex-start; }
.chat-cab > div { flex: 1; }
.chat-foto { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #22a637; }
.chat-mensajes { display: flex; flex-direction: column; gap: 10px; }
.msg-aviso { align-self: stretch; max-width: none; background: var(--ambar-suave); border: 1px solid var(--ambar); color: var(--texto); border-radius: 12px; font-size: 14px; animation: entra .25s ease; }
.msg-meta { display: block; margin-top: 8px; font: 11.5px var(--mono); color: var(--texto-2); }
.meta-ok { color: var(--verde-texto); }
.msg-enlace { display: inline-block; margin-top: 8px; font-weight: 600; color: var(--azul-texto); }
.chat-escribiendo { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; background: var(--superficie); border: 1px solid var(--linea); border-radius: 14px; padding: 10px 14px; }
.chat-escribiendo[hidden] { display: none; }
.chat-escribiendo span { width: 6px; height: 6px; border-radius: 50%; background: var(--texto-2); animation: rebote 1s infinite; }
.chat-escribiendo span:nth-child(2) { animation-delay: .15s; } .chat-escribiendo span:nth-child(3) { animation-delay: .3s; }
.chat-escribiendo small { margin-left: 6px; color: var(--texto-2); font-size: 12px; }
@keyframes rebote { 0%, 80%, 100% { transform: none; opacity: .4; } 40% { transform: translateY(-4px); opacity: 1; } }
.sugerencias { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 4px; }
.sugerencias[hidden] { display: none; }
.sugerencias button { background: var(--superficie); border: 1px solid var(--linea-fuerte); color: var(--azul-texto); border-radius: 999px; padding: 8px 14px; font-weight: 500; font-size: 14px; cursor: pointer; }
.sugerencias button:hover { background: var(--azul-suave); }
.chat-form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--linea); background: var(--superficie); }
.chat-form input { flex: 1; min-width: 0; border: 1px solid var(--linea-fuerte); border-radius: 10px; padding: 11px 14px; font: 15px var(--sans); background: var(--fondo); color: var(--texto); }
.chat-form input:focus { outline: 2px solid var(--azul-texto); outline-offset: 0; }
.chat-form input:disabled { opacity: .6; }
.chat-form button { width: 44px; border: 0; border-radius: 10px; background: var(--azul); color: #fff; font-size: 18px; cursor: pointer; }
.chat-form button:disabled { opacity: .5; cursor: not-allowed; }


@media (max-width: 1080px) {
  .arq { grid-template-columns: 1fr; gap: 0; }
  .arq-flecha { width: 2px; height: 28px; margin-left: 32px; }
  .arq-flecha::after { right: auto; left: -4px; top: auto; bottom: -1px; border: 5px solid transparent; border-top: 7px solid var(--linea-fuerte); border-bottom: 0; }
  .arq-flecha::before { left: -3px; animation-name: paquete-v; }
  .arq-doble, .arq-triple { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
  .arq-pie { grid-template-columns: 1fr 1fr; }
}
@keyframes paquete-v { from { top: 0; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } to { top: calc(100% - 8px); opacity: 0; } }
@media (max-width: 920px) { .contacto-rejilla { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .f-fila, .arq-pie { grid-template-columns: 1fr; }
  .formulario { padding: 22px; }
  .arq { padding: 20px; }
}


.formulario { color-scheme: light; }
.contacto .formulario p { margin-top: 0; font-size: 13px; }
.contacto .formulario .f-error { color: #b3261e; }
.contacto .formulario .f-resultado { font-size: 14.5px; }
.contacto .formulario .f-ok { color: #14532d; }
.contacto .formulario .f-resultado.f-error { color: #8a1c1c; }




.jc-lanzador { gap: 10px; padding: 8px 18px 8px 8px; border: 1px solid #2a3a5c; }
.jc-lanzador img { width: 34px; height: 34px; border-radius: 10px; }
.jc-lanzador span { display: grid; text-align: left; line-height: 1.15; }
.jc-lanzador b { font-size: 15px; }
.jc-lanzador small { font-size: 12px; font-weight: 400; color: #9aa7bb; }
.jc-lanzador::after { content: ""; position: absolute; top: 8px; left: 36px; width: 10px; height: 10px; border-radius: 50%; background: #3fcf5c; border: 2px solid var(--tinta); }


.chat.jc { background: #0b1220; border: 1px solid #23324f; color: #c9d3e1; width: min(440px, calc(100vw - 24px)); height: min(620px, calc(100vh - 40px)); font: 13.5px/1.6 var(--mono); }
.jc-cab { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: #111a2c; border-bottom: 1px solid #1d2940; color: #7d8aa0; font-size: 12px; }
.jc-cab img { width: 22px; height: 22px; border-radius: 6px; }
.jc-titulo { flex: 1; }
.jc-titulo b { color: #e6ebf2; }
.jc-cerrar { background: none; border: 0; color: #7d8aa0; cursor: pointer; padding: 4px 8px; border-radius: 6px; font-size: 14px; }
.jc-cerrar:hover { background: #1d2940; color: #fff; }


.jc-pantalla { flex: 1; overflow-y: auto; padding: 14px 16px 6px; cursor: text; scrollbar-color: #2a3650 transparent; }
.jc-log { display: grid; gap: 6px; }
.jc-l { white-space: pre-wrap; overflow-wrap: anywhere; animation: entra .2s ease; }
.jc-sis { color: #7d8aa0; }
.jc-ok { color: #3fcf5c; }
.jc-alerta { color: #ffd166; }
.jc-yo { color: #e6ebf2; margin-top: 6px; }
.jc-bot { color: #c9d3e1; }
.jc-nombre { color: #6d9bff; font-weight: 700; }
.jc-meta { display: block; color: #4cd264; font-size: 11.5px; margin-top: 2px; }
.jc-pensando::after { content: " ..."; animation: puntos 1s steps(4) infinite; display: inline-block; width: 3ch; overflow: hidden; vertical-align: bottom; }
@keyframes puntos { from { width: 0; } to { width: 3ch; } }
.jc-accion { display: inline-block; margin: 6px 0 0 0; font: 600 12.5px var(--mono); color: #0b1220; background: #3fcf5c; border: 0; border-radius: 6px; padding: 5px 10px; cursor: pointer; }
.jc-accion:hover { background: #6ee08a; }


.jc-linea { display: flex; align-items: center; gap: 8px; margin: 8px 0 10px; }
.jc-prompt { flex: none; color: #c9d3e1; white-space: nowrap; }
.jc-linea input { flex: 1; min-width: 0; background: transparent; border: 0; outline: 0; color: #e6ebf2; font: inherit; caret-color: #3fcf5c; padding: 2px 0; }
.jc-linea input:disabled { opacity: .5; }
.jc-linea:focus-within { box-shadow: 0 1px 0 #3fcf5c; }


.jc-atajos { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 12px; border-top: 1px solid #1d2940; background: #0e1626; }
.jc-atajos button { font: 12px var(--mono); color: #8fb3ff; background: #111a2c; border: 1px solid #23324f; border-radius: 6px; padding: 4px 9px; cursor: pointer; }
.jc-atajos button::before { content: "$ "; color: #3fcf5c; }
.jc-atajos button:hover { border-color: #6d9bff; color: #fff; }
.jc-estado { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; padding: 6px 12px; background: #2f6bea; color: #fff; font-size: 11px; }
.jc-estado .jc-ok { color: #fff; }
.jc-agotada { color: #ffd166; font-weight: 700; }

.chat.jc :focus-visible { outline: 2px solid #3fcf5c; outline-offset: 2px; }

@media (max-width: 560px) {
  .chat.jc { font-size: 12.5px; }
  .jc-prompt .t-user { display: none; }   
  .jc-lanzador small { display: none; }
}


.chat.jc .jc-linea input:focus-visible { outline: none; }
.chat.jc .jc-linea:focus-within { box-shadow: 0 2px 0 #3fcf5c; }




html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }      
body { -webkit-tap-highlight-color: transparent; overflow-wrap: break-word; }
h1, h2, h3 { text-wrap: balance; }                                      
p, li { text-wrap: pretty; }
.entradilla, .seccion-cab p, .resumen { hyphens: auto; }                 
img { height: auto; }

input, select, textarea, .chat-form input, .jc-linea input, .paleta-busca input { font-size: max(16px, 1em) !important; }

.cabecera-fila, .contenedor { padding-left: max(20px, env(safe-area-inset-left)); padding-right: max(20px, env(safe-area-inset-right)); }


.nav-pie { display: none; }
.confianza-lista { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 20px; font-size: 14px; color: var(--texto-2); }
.confianza-lista li { display: inline-flex; align-items: center; gap: 8px; }
.confianza-lista li::before { content: "✓"; display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; flex: none;
  font-size: 11px; font-weight: 700; color: var(--verde-texto); background: var(--verde-suave); box-shadow: inset 0 0 0 1.5px var(--verde-marca); }
.desliza { display: none; }


.pie-completo { border-top: 1px solid var(--linea); background: var(--fondo-alt); }
.pie-rejilla { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 40px; padding-block: 56px 40px; }
.pie-logo { font: 600 13px var(--sans); letter-spacing: .2em; margin-bottom: 12px; }
.pie-logo b { color: var(--azul-texto); letter-spacing: .04em; font-size: 18px; margin-right: 4px; }
.pie-marca p:not(.pie-logo) { color: var(--texto-2); font-size: 15px; max-width: 36ch; }
.pie-sello { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; font: 12.5px var(--mono); }
.pie-col { display: grid; align-content: start; gap: 10px; }
.pie-col h2 { font: 600 12px var(--mono); text-transform: uppercase; letter-spacing: .1em; color: var(--texto-2); margin-bottom: 4px; }
.pie-col a { text-decoration: none; color: var(--texto); font-size: 15px; width: fit-content; }
.pie-base { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-block: 20px; border-top: 1px solid var(--linea); font-size: 14px; color: var(--texto-2); }
.arriba { text-decoration: none; font-weight: 600; }


.barra-movil { display: none; }


@media (hover: hover) and (pointer: fine) {
  .pie-col a:hover, .arriba:hover { color: var(--azul-texto); }
  .competencias article:hover, .servicios article:hover { border-color: var(--linea-fuerte); transform: translateY(-2px); box-shadow: var(--sombra); }
  .competencias article, .servicios article { transition: transform .2s, box-shadow .2s, border-color .2s, opacity .25s; }
}

@media (hover: none) {
  .caso:hover { box-shadow: none; border-color: var(--linea); }
  .caso:hover .hoja { transform: rotate(-2deg); }
}


@media (pointer: coarse) {
  .herramienta { width: 44px; height: 44px; }
  .filtro, .jc-atajos button, .chat-menu button, .sugerencias button { min-height: 44px; }
  .faq summary { min-height: 56px; align-items: center; }
  input[type="range"] { height: 32px; }
  .f-check input { width: 22px; height: 22px; }
}


@media (min-width: 1440px) {
  .contenedor { max-width: 1280px; }
  .hero { padding-block: 120px 96px; }
  .seccion { padding-block: 120px; }
}


@media (max-width: 1080px) {
  .menu-movil { display: grid; }
  .atajo { display: none; }
  .nav { position: fixed; inset: var(--alto-cab, 64px) 0 0 0; z-index: 49; flex-direction: column; align-items: stretch; gap: 0;
    background: var(--fondo); padding: 8px max(24px, env(safe-area-inset-left)) calc(24px + env(safe-area-inset-bottom));
    overflow-y: auto; display: flex; visibility: hidden; opacity: 0; transform: translateY(-8px);
    transition: opacity .2s, transform .2s, visibility 0s .2s; }
  .nav.abierta { visibility: visible; opacity: 1; transform: none; transition: opacity .2s, transform .2s; }
  .nav a:not(.boton) { font-size: 22px; font-weight: 600; color: var(--texto); padding: 16px 0; border-bottom: 1px solid var(--linea); }
  .nav a.actual::after { display: none; }
  .nav a.actual { color: var(--azul-texto); }
  .nav-cta { margin-top: 24px; justify-content: center; padding: 16px; font-size: 16px; }
  .nav-pie { display: block; margin-top: 18px; text-align: center; font: 13px var(--mono); color: var(--texto-2); }
  .cabecera { z-index: 50; }
  body.sin-scroll { overflow: hidden; }
  .competencias, .servicios { grid-template-columns: repeat(2, 1fr); }
  .pie-rejilla { grid-template-columns: 1fr 1fr; }
  .pie-marca { grid-column: 1 / -1; }
}


@media (max-width: 760px) {
  .hero { padding-block: 36px 48px; background-size: 36px 36px; }
  h1 { font-size: clamp(2.05rem, 9vw, 2.8rem); letter-spacing: -.03em; margin-top: 18px; }
  .entradilla { font-size: 1.05rem; margin-top: 18px; }
  .acciones { flex-direction: column; align-items: stretch; gap: 10px; margin-top: 26px; }
  .acciones .boton { justify-content: center; padding-block: 15px; }
  .pastilla { font-size: 13px; }
  .hero-rejilla { gap: 32px; }
  .seccion { padding-block: 56px; }
  .seccion-cab { margin-bottom: 28px; }
  h2 { font-size: clamp(1.6rem, 7vw, 2.1rem); }

  
  pre.terminal-cuerpo { font-size: 11px; line-height: 1.6; padding: 14px; min-height: 0; overflow-x: hidden; white-space: pre-wrap; }
  .terminal-cab { padding: 9px 12px; }

  .cifras { margin-top: 36px; }
  .cifras div { padding: 14px 16px; }
  .cifras dd { font-size: 1.5rem; }
  .confianza { font-size: 13px; }

  
  .desliza { display: flex; justify-content: space-between; font: 12.5px var(--mono); color: var(--texto-2); margin: -12px 0 12px; }
  .desliza span { color: var(--azul-texto); animation: empuja 1.6s ease-in-out infinite; }
  @keyframes empuja { 50% { transform: translateX(4px); } }
  .competencias, .servicios { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 82%; gap: 12px;
    overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scroll-padding-inline: 20px;
    margin-inline: -20px; padding: 4px 20px 16px; scrollbar-width: none; }
  .competencias::-webkit-scrollbar, .servicios::-webkit-scrollbar { display: none; }
  .competencias article, .servicios article { scroll-snap-align: start; }
  .filtros { flex-wrap: nowrap; overflow-x: auto; margin-inline: -20px; padding: 0 20px 4px; scrollbar-width: none; }
  .filtros::-webkit-scrollbar { display: none; }
  .filtro { flex: none; }

  
  .caso { padding: 18px; border-radius: 16px; gap: 20px; }
  .caso h3 { font-size: 1.35rem; }
  .caso-visual { min-height: 210px; padding: 20px; }
  .caso-compacto .caso-visual { min-height: 190px; }
  .app-icono { width: 56px; height: 56px; top: 14px; left: 14px; border-radius: 14px; }
  .areas li { font-size: 11.5px; padding: 4px 8px; }

  
  .calc { padding: 20px; gap: 18px; }
  .calc-resultado b { font-size: 1.6rem; }
  .formulario { padding: 20px; border-radius: 16px; }
  .contacto { padding-block: 56px; }
  .f-enviar { padding-block: 16px; }

  
  .barra-movil { display: grid; grid-template-columns: 1fr auto; gap: 10px; position: fixed; z-index: 45; left: 0; right: 0; bottom: 0;
    padding: 10px max(14px, env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
    background: color-mix(in srgb, var(--fondo) 92%, transparent); border-top: 1px solid var(--linea);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); transition: transform .25s ease; }
  .barra-movil.oculta, body.chat-abierto .barra-movil, body.sin-scroll .barra-movil { transform: translateY(110%); }
  .bm-boton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; border-radius: 12px; font-weight: 600; font-size: 15px; text-decoration: none; cursor: pointer; }
  .bm-principal { background: var(--azul); color: #fff; }
  .bm-jc { background: var(--tinta); color: #fff; border: 1px solid #2a3a5c; padding: 0 16px 0 10px; }
  .bm-jc img { width: 26px; height: 26px; border-radius: 7px; }
  .chat-lanzador { display: none !important; }       
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }

  
  .chat.jc { z-index: 70; inset: 0; right: 0; bottom: 0; width: 100%; height: 100vh; height: 100dvh; border-radius: 0; border: 0;
    padding: env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left); }
  .jc-atajos { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .jc-atajos::-webkit-scrollbar { display: none; }
  .jc-atajos button { flex: none; }
  .jc-estado { padding-bottom: calc(6px + env(safe-area-inset-bottom)); }

  .pie-rejilla { gap: 28px; padding-block: 40px 28px; }
}


@media (max-width: 560px) {
  .cabecera-fila { padding-block: 8px; gap: 12px; }
  .marca-escudo { width: 28px; height: 32px; }
  .marca-texto b { font-size: 17px; }
  .marca-texto span { font-size: 9.5px; }
  .herramienta { width: 42px; height: 42px; }
  .cifras dt { font-size: 12.5px; }
  .competencias, .servicios { grid-auto-columns: 86%; }
  .dos-col { gap: 0; }
  .pie-rejilla { grid-template-columns: 1fr 1fr; }
  .pie-base { flex-direction: column; }
  .modalidad { padding: 22px; }
  .sobre-rejilla { gap: 24px; }
  .avatar-foto { width: 96px; height: 96px; }
}

@media (max-width: 400px) { .ocultar-xs { display: none; } }


@media (max-height: 480px) and (orientation: landscape) {
  .cabecera { position: static; }               
  .hero { padding-block: 28px; }
  .barra-movil { padding-block: 6px calc(6px + env(safe-area-inset-bottom)); }
  .bm-boton { min-height: 40px; }
}


@media (forced-colors: active) {
  .boton, .bm-boton, .filtro, .herramienta, .chat-lanzador { border: 1px solid ButtonText; }
  .punto, .led, .osi-led { forced-color-adjust: none; }
  .confianza-lista li::before { box-shadow: none; border: 1px solid CanvasText; }
}


@media print {
  .cabecera, .barra-movil, .chat-lanzador, .chat, .paleta, .progreso, .boceto-aviso, .terminal, .calc, .formulario, .filtros, .desliza { display: none !important; }
  body { background: #fff; color: #000; padding: 0; }
  .seccion, .hero { padding-block: 16px; break-inside: avoid; }
  .competencias, .servicios { display: grid; grid-auto-flow: row; grid-template-columns: 1fr 1fr; overflow: visible; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 11px; }
}


.pie-marca p.pie-sello { font: 12.5px var(--mono); color: var(--texto-2); }   




.hero { position: relative; overflow: hidden; background-image: none; }
.hero > .contenedor { position: relative; z-index: 1; }
.hero-red { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none;
  
  -webkit-mask-image: linear-gradient(90deg, transparent 0 28%, #000 62%);
          mask-image: linear-gradient(90deg, transparent 0 28%, #000 62%); }
.red-enlaces line { stroke: var(--linea-fuerte); stroke-width: 1.2; stroke-dasharray: 3 5; }
.red-host { fill: var(--fondo); stroke: var(--linea-fuerte); stroke-width: 1.5; }
.red-sw { fill: var(--fondo); stroke: var(--azul-texto); stroke-width: 1.5; opacity: .7; }
.red-paquete { fill: var(--verde-marca); filter: drop-shadow(0 0 4px var(--verde-marca)); }


.stack { border-bottom: 1px solid var(--linea); }
.stack-rejilla { display: grid; grid-template-columns: 1fr 1.6fr; gap: 56px; align-items: center; }
.stack .leyenda { margin: 20px 0 0; }
.tabla { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.el { --c: var(--azul-texto); --s: var(--azul-suave);
  position: relative; aspect-ratio: 1 / 1; display: grid; grid-template-rows: auto 1fr auto auto; padding: 10px 12px 12px;
  border: 1px solid var(--linea); border-top: 3px solid var(--c); border-radius: 6px; background: var(--superficie); }
.el.a-infra { --c: var(--ambar); --s: var(--ambar-suave); }
.el.a-datos { --c: var(--morado); --s: var(--morado-suave); }
.el.a-seg { --c: var(--verde-marca); --s: var(--verde-suave); }
.el::before { content: none; }                     
.el-n { font: 11px var(--mono); color: var(--texto-2); }
.el-s { font: 700 clamp(1.6rem, 2.6vw, 2.2rem)/1 var(--sans); letter-spacing: -.02em; color: var(--c); align-self: center; }
.el-nom { font-size: 13.5px; font-weight: 600; line-height: 1.25; }
.el-cat { font: 10.5px var(--mono); color: var(--texto-2); text-transform: uppercase; letter-spacing: .05em; margin-top: 2px; }
@media (hover: hover) and (pointer: fine) {
  .el { transition: transform .2s, background .2s, box-shadow .2s; }
  .el:hover { transform: translateY(-3px); background: var(--s); box-shadow: 0 10px 24px -14px var(--c); }
}

@media (max-width: 1080px) {
  .stack-rejilla { grid-template-columns: 1fr; gap: 28px; }
  .tabla { grid-template-columns: repeat(6, 1fr); }
}
@media (max-width: 760px) {
  .hero-red { opacity: .55; -webkit-mask-image: linear-gradient(180deg, transparent 0 30%, #000 85%); mask-image: linear-gradient(180deg, transparent 0 30%, #000 85%); }
  .tabla { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .el { padding: 7px 8px 8px; border-radius: 5px; }
  .el-s { font-size: 1.35rem; }
  .el-nom { font-size: 11px; }
  .el-cat { display: none; }
}
@media (max-width: 400px) { .tabla { grid-template-columns: repeat(3, 1fr); } }
@media (forced-colors: active) { .hero-red { display: none; } }
@media print { .hero-red { display: none; } }




.lema { margin-top: 18px; font-weight: 700; font-size: 1.15rem; letter-spacing: -.01em; line-height: 1.4; }
.lema span { display: inline; }
.lema span:last-child { color: var(--azul-texto); }
.confianza-lista { margin-top: 18px; }


.etapas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 28px 0 24px; counter-reset: etapa;
  border: 1px solid var(--linea); border-radius: var(--radio); background: var(--superficie); overflow: hidden; }
.etapas li { position: relative; padding: 20px 22px 22px; display: grid; gap: 6px; align-content: start; border-right: 1px solid var(--linea); }
.etapas li:last-child { border-right: 0; }

.etapas li:not(:last-child)::after { content: ""; position: absolute; right: -7px; top: 50%; width: 12px; height: 12px; background: var(--superficie);
  border-top: 1px solid var(--linea); border-right: 1px solid var(--linea); transform: translateY(-50%) rotate(45deg); z-index: 1; }
.etapa-n { font: 600 12px var(--mono); color: var(--azul-texto); }
.etapas b { font-size: 1.05rem; }
.etapas li span:last-child { color: var(--texto-2); font-size: 14.5px; line-height: 1.5; }
.etapas li:nth-child(1) { border-top: 3px solid var(--ambar); }
.etapas li:nth-child(2) { border-top: 3px solid var(--azul-texto); }
.etapas li:nth-child(3) { border-top: 3px solid var(--verde-marca); }
.sobre-intro strong { color: var(--texto); }


.cita { margin: 28px 0 8px; padding: 22px 26px; border-left: 4px solid var(--verde-marca); background: var(--fondo-alt); border-radius: 0 var(--radio) var(--radio) 0; }
.cita p { font-size: clamp(1.2rem, 2.2vw, 1.5rem); font-weight: 700; line-height: 1.35; letter-spacing: -.015em; }
.cita footer { margin-top: 10px; font: 13px var(--mono); color: var(--texto-2); }


.hero-red-movil { display: none; position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }

@media (max-width: 760px) {
  .hero-red { display: none; }
  .hero-red-movil { display: block;
    
    -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.9) 0, rgba(0,0,0,.35) 18%, rgba(0,0,0,.35) 52%, #000 75%);
            mask-image: linear-gradient(180deg, rgba(0,0,0,.9) 0, rgba(0,0,0,.35) 18%, rgba(0,0,0,.35) 52%, #000 75%); }
  .lema { font-size: 1.05rem; }
  .lema span { display: block; }
  .etapas { grid-template-columns: 1fr; }
  .etapas li { border-right: 0; border-bottom: 1px solid var(--linea); border-top: 0 !important; border-left: 3px solid var(--ambar); padding: 16px 18px; }
  .etapas li:nth-child(2) { border-left-color: var(--azul-texto); }
  .etapas li:nth-child(3) { border-left-color: var(--verde-marca); border-bottom: 0; }
  .etapas li:not(:last-child)::after { right: auto; left: 24px; top: auto; bottom: -7px; transform: rotate(135deg); }
  .cita { padding: 18px 20px; }
}

:root[data-tema="oscuro"] .hero-red-movil .red-enlaces line, :root[data-tema="oscuro"] .hero-red .red-enlaces line { stroke: #3a5582; }
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) .hero-red-movil .red-enlaces line, :root:not([data-tema="claro"]) .hero-red .red-enlaces line { stroke: #3a5582; }
}
@media (forced-colors: active) { .hero-red-movil { display: none !important; } }
@media print { .hero-red-movil { display: none !important; } }




.seccion, .pagina-cab, .cta-banda, .contacto { position: relative; isolation: isolate; }
.seccion::before, .pagina-cab::before, .cta-banda::before, .contacto::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: url("../img/red-claro.svg") 0 0 / 640px 640px repeat; opacity: .7;
  -webkit-mask-image: radial-gradient(85% 75% at 100% 0%, #000 0%, transparent 72%);
          mask-image: radial-gradient(85% 75% at 100% 0%, #000 0%, transparent 72%); }
.seccion:nth-of-type(even)::before {
  background-position: 300px 180px;
  -webkit-mask-image: radial-gradient(85% 75% at 0% 100%, #000 0%, transparent 72%);
          mask-image: radial-gradient(85% 75% at 0% 100%, #000 0%, transparent 72%); }
.pagina-cab::before {
  -webkit-mask-image: linear-gradient(90deg, transparent 0 25%, #000 75%);
          mask-image: linear-gradient(90deg, transparent 0 25%, #000 75%); opacity: .9; }

.cta-banda::before, .contacto::before { background-image: url("../img/red-oscuro.svg"); opacity: .9;
  -webkit-mask-image: radial-gradient(70% 90% at 85% 50%, #000 0%, transparent 75%);
          mask-image: radial-gradient(70% 90% at 85% 50%, #000 0%, transparent 75%); }
:root[data-tema="oscuro"] .seccion::before, :root[data-tema="oscuro"] .pagina-cab::before { background-image: url("../img/red-oscuro.svg"); }
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) .seccion::before, :root:not([data-tema="claro"]) .pagina-cab::before { background-image: url("../img/red-oscuro.svg"); }
}
@media (prefers-reduced-motion: reduce) {
  .seccion::before, .pagina-cab::before { background-image: url("../img/red-claro-quieta.svg"); }
  .cta-banda::before, .contacto::before { background-image: url("../img/red-oscuro-quieta.svg"); }
  :root[data-tema="oscuro"] .seccion::before, :root[data-tema="oscuro"] .pagina-cab::before { background-image: url("../img/red-oscuro-quieta.svg"); }
}
@media (prefers-reduced-motion: reduce) and (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) .seccion::before, :root:not([data-tema="claro"]) .pagina-cab::before { background-image: url("../img/red-oscuro-quieta.svg"); }
}
@media (forced-colors: active) { .seccion::before, .pagina-cab::before, .cta-banda::before, .contacto::before { display: none; } }


.nav a.actual { color: var(--texto); }
@media (min-width: 1081px) {
  .nav a.actual::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--verde-marca); border-radius: 2px; }
}


.pagina-cab { padding-block: 72px 56px; border-bottom: 1px solid var(--linea); }
.miga { font: 13px var(--mono); color: var(--texto-2); margin-bottom: 18px; }
.miga a { color: var(--azul-texto); text-decoration: none; }
.pagina-cab h1 { font-size: clamp(2.1rem, 5vw, 3.6rem); max-width: 18ch; margin-top: 0; }
.pagina-cab .entradilla { max-width: 62ch; }


.destacados { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.destacado { display: grid; gap: 10px; align-content: start; text-decoration: none; color: inherit; padding: 18px 18px 22px;
  background: var(--superficie); border: 1px solid var(--linea); border-radius: 18px; transition: transform .2s, box-shadow .2s, border-color .2s; }
.d-visual { display: grid; place-items: center; height: 150px; border-radius: 12px; background: var(--fondo-alt); border: 1px solid var(--linea); margin-bottom: 6px; overflow: hidden; }
.d-factu img { width: 72px; height: 72px; border-radius: 18px; box-shadow: 0 14px 30px -10px rgba(10,71,194,.6); }
.d-monitor { background: var(--tinta); border-color: #1d2940; }
.d-meta { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.d-titulo { font-size: 1.15rem; letter-spacing: -.01em; }
.d-texto { color: var(--texto-2); font-size: 15px; }
.ver-todos { margin-top: 24px; }
@media (hover: hover) and (pointer: fine) {
  .destacado:hover { transform: translateY(-4px); border-color: var(--linea-fuerte); box-shadow: var(--sombra); }
  .destacado:hover .d-titulo { color: var(--azul-texto); }
}



.vp { width: min(320px, 100%); display: grid; grid-template-columns: 34px 1fr; background: var(--superficie); border: 1px solid var(--linea); border-radius: 10px; overflow: hidden; box-shadow: var(--sombra); }
.vp-lado { background: var(--tinta); display: grid; align-content: start; gap: 10px; padding: 12px 9px; }
.vp-lado i { height: 14px; border-radius: 4px; background: #23324f; }
.vp-lado i.on { background: var(--azul); }
.vp-main { padding: 12px; display: grid; gap: 8px; }
.vp-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.vp-kpis span { background: var(--fondo-alt); border: 1px solid var(--linea); border-radius: 6px; padding: 6px; font-size: 10.5px; color: var(--texto-2); display: grid; }
.vp-kpis b { font-size: 15px; color: var(--texto); }
.d-panel .vp-kpis { width: 82%; }
.vp-fila { display: flex; align-items: center; gap: 8px; font-size: 12px; padding: 5px 8px; border-radius: 6px; background: var(--fondo-alt); }
.vp-fila em { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.vp-fila em.ok { background: var(--verde-marca); } .vp-fila em.aviso { background: var(--ambar); }

.visual-monitor { background: var(--tinta); border-color: #1d2940; }
.mon { width: min(340px, 100%); font: 12px var(--mono); color: #c9d3e1; display: grid; gap: 6px; }
.mon-fila { display: flex; justify-content: space-between; }
.mon-ok { color: #3fcf5c; }
.mon-barras { display: flex; gap: 3px; height: 22px; }
.mon-barras i { flex: 1; background: #22a637; border-radius: 2px; opacity: .9; }
.mon-barras i.caida { background: #e5484d; }
.d-monitor .mon-barras { width: 80%; height: 34px; }
.mon-alerta { margin-top: 8px; background: #111a2c; border: 1px solid #23324f; border-left: 3px solid #6d9bff; border-radius: 8px; padding: 8px 10px; display: grid; gap: 2px; }
.mon-alerta b { color: #8fb3ff; }
.mon-alerta span { color: #3fcf5c; }

.movil-escaner { text-align: left; background: #0b1220; border-color: #0b1220; color: #c9d3e1; gap: 8px; padding: 20px 14px; }
.movil-escaner small { color: #7d8aa0 !important; font-family: var(--mono); }
.movil-escaner .m-ok { color: #3fcf5c !important; }
.esc-barra { height: 4px; background: #1d2940; border-radius: 2px; overflow: hidden; }
.esc-barra i { display: block; height: 100%; width: 65%; background: #3fcf5c; animation: escanea 2.4s ease-in-out infinite; }
@keyframes escanea { from { width: 10%; } to { width: 100%; } }
.esc-fila { font: 11px var(--mono); display: flex; justify-content: space-between; gap: 6px; padding: 5px 6px; background: #111a2c; border-radius: 5px; color: #9aa7bb; }
.esc-fila b { color: #e6ebf2; font-weight: 600; }

.visual-scripts { background: var(--tinta); border-color: #1d2940; }
.mini-terminal { margin: 0; font: 12.5px/1.8 var(--mono); color: #c9d3e1; white-space: pre-wrap; }

.estado-dev { background: var(--ambar-suave); color: var(--ambar); }


[data-tipo] { transition: opacity .25s, transform .25s; }
[data-tipo].atenuada { opacity: .22; transform: scale(.985); }
#filtros-proyectos { margin: 0 0 18px; }


.dev-desde { display: grid; grid-template-columns: auto 1fr; gap: 22px; align-items: center; margin: 28px 0; padding: 22px 24px; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--superficie); }
.dev-cifra { display: grid; text-align: center; border-right: 1px solid var(--linea); padding-right: 22px; }
.dev-cifra b { font-size: 2.4rem; line-height: 1; letter-spacing: -.03em; color: var(--azul-texto); }
.dev-cifra span { font: 11px var(--mono); color: var(--texto-2); text-transform: uppercase; letter-spacing: .06em; margin-top: 6px; max-width: 12ch; }
.dev-desde p:not(.dev-cifra) { color: var(--texto-2); }
.dev-desde strong { color: var(--texto); }
.linkedin-card { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 8px; padding: 22px 24px; border-radius: var(--radio);
  background: var(--tinta); color: #e6ebf2; border: 1px solid #1d2940; }
.linkedin-card p { color: #9aa7bb; font-size: 14.5px; margin-top: 4px; max-width: 46ch; }


.formacion-tabla { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ft { --c: var(--azul-texto); --s: var(--azul-suave);
  display: grid; gap: 4px; align-content: start; padding: 18px 18px 20px; border-radius: 10px;
  border: 1px solid var(--linea); border-top: 3px solid var(--c); background: var(--superficie); }
.ft-cert { --c: var(--verde-marca); --s: var(--verde-suave); }
.ft-curso { --c: var(--ambar); --s: var(--ambar-suave); }
.ft-tipo { font: 600 11px var(--mono); text-transform: uppercase; letter-spacing: .07em; color: var(--c); }
.ft b { font-size: 1.3rem; letter-spacing: -.015em; margin-top: 4px; }
.ft span:not(.ft-tipo) { color: var(--texto); font-size: 15px; }
.ft small { color: var(--texto-2); font: 12px var(--mono); margin-top: 6px; }
@media (hover: hover) and (pointer: fine) {
  .ft { transition: transform .2s, background .2s, box-shadow .2s; }
  .ft:hover { transform: translateY(-3px); background: var(--s); box-shadow: 0 12px 26px -14px var(--c); }
}


.cta-banda { background: var(--tinta); color: #fff; padding-block: 72px; }
.cta-fila { display: flex; justify-content: space-between; align-items: center; gap: 32px; flex-wrap: wrap; }
.cta-banda h2 { color: #fff; }
.cta-banda p { color: #9aa7bb; margin-top: 10px; font-size: 1.1rem; max-width: 52ch; }
.cta-acciones { display: flex; gap: 12px; flex-wrap: wrap; }
.boton-fantasma { background: transparent; color: #fff; border: 1px solid #34476b; }
.boton-fantasma:hover { background: #18233a; }


@media (max-width: 1080px) {
  .destacados { grid-template-columns: 1fr 1fr; }
  .destacado:last-child { grid-column: 1 / -1; }
  .formacion-tabla { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .pagina-cab { padding-block: 40px 36px; }
  .pagina-cab::before { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 100%); mask-image: linear-gradient(180deg, transparent 0, #000 100%); }
  .seccion::before, .seccion:nth-of-type(even)::before { -webkit-mask-image: linear-gradient(180deg, #000, transparent 70%); mask-image: linear-gradient(180deg, #000, transparent 70%); }
  .destacados { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 84%; overflow-x: auto; scroll-snap-type: x mandatory;
    margin-inline: -20px; padding: 4px 20px 14px; scrollbar-width: none; }
  .destacados::-webkit-scrollbar { display: none; }
  .destacado { scroll-snap-align: start; }
  .destacado:last-child { grid-column: auto; }
  #filtros-proyectos { flex-wrap: nowrap; overflow-x: auto; margin-inline: -20px; padding: 0 20px 4px; scrollbar-width: none; }
  .dev-desde { grid-template-columns: 1fr; text-align: left; }
  .dev-cifra { border-right: 0; border-bottom: 1px solid var(--linea); padding: 0 0 14px; text-align: left; }
  .cta-banda { padding-block: 52px; }
  .cta-acciones { width: 100%; }
  .cta-acciones .boton { flex: 1; justify-content: center; }
}
@media (max-width: 560px) { .formacion-tabla { grid-template-columns: 1fr; } }


:root { --cian: #0b6f80; --cian-suave: #e3f4f6; }                       
:root[data-tema="oscuro"] { --cian: #3fd0e0; --cian-suave: #0f2c33; }
@media (prefers-color-scheme: dark) { :root:not([data-tema="claro"]) { --cian: #3fd0e0; --cian-suave: #0f2c33; } }
.a-fis::before { background: var(--cian); }
.el.a-fis { --c: var(--cian); --s: var(--cian-suave); }


.capas { --pasos: 5; position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; padding-top: 22px; }

.capas::before { content: ""; position: absolute; top: 6px; left: 10%; right: 10%; height: 2px;
  background: repeating-linear-gradient(90deg, var(--linea-fuerte) 0 6px, transparent 6px 11px); }
.capas::after { content: ""; position: absolute; top: 2px; left: 10%; width: 10px; height: 10px; border-radius: 50%;
  background: var(--verde-marca); box-shadow: 0 0 8px var(--verde-marca); animation: viaja 6s linear infinite; }
@keyframes viaja { from { left: 10%; } to { left: calc(90% - 10px); } }
.capa { --c: var(--azul-texto); position: relative; display: grid; gap: 8px; align-content: start; padding: 20px 18px 22px;
  background: var(--superficie); border: 1px solid var(--linea); border-top: 3px solid var(--c); border-radius: 12px; }
.capa::before { content: ""; position: absolute; top: -22px; left: 50%; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%;
  background: var(--fondo); border: 2px solid var(--c); }
.cap-fis { --c: var(--cian); } .cap-infra { --c: var(--ambar); } .cap-sop { --c: var(--morado); } .cap-seg { --c: var(--verde-marca); } .cap-dev { --c: var(--azul-texto); }
.capa-cab { display: flex; justify-content: space-between; align-items: center; }
.capa-n { font: 700 13px var(--mono); color: var(--c); }
.capa-tag { font: 600 10.5px var(--mono); text-transform: uppercase; letter-spacing: .07em; color: var(--texto-2); }
.capa h3 { font-size: 1.12rem; }
.capa p { color: var(--texto-2); font-size: 14.5px; }
.capa .lista { margin-top: 6px; }
.capa .lista li { font-size: 14px; }
.capa .lista li::before { background: var(--c); }
@media (hover: hover) and (pointer: fine) {
  .capa { transition: transform .2s, box-shadow .2s; }
  .capa:hover { transform: translateY(-4px); box-shadow: 0 14px 30px -18px var(--c); }
}


.comparativa { margin-top: 48px; padding: 28px; border: 1px solid var(--linea); border-radius: 18px; background: var(--superficie); }
.comp-titulo { font-size: 1.4rem; }
.comp-sub { color: var(--texto-2); margin: 6px 0 18px; max-width: 64ch; }
.comp-scroll { overflow-x: auto; }
.comparativa table { width: 100%; border-collapse: collapse; font-size: 15px; }
.comparativa th, .comparativa td { padding: 12px 10px; border-bottom: 1px solid var(--linea); text-align: center; }
.comparativa tbody th { text-align: left; font-weight: 500; }
.comparativa thead th { font: 600 12px var(--mono); text-transform: uppercase; letter-spacing: .05em; color: var(--texto-2); }
.comparativa .comp-jc { background: var(--azul-suave); color: var(--azul-texto); font-weight: 700; }
.comparativa thead .comp-jc { border-radius: 8px 8px 0 0; color: var(--azul-texto); }
.comparativa tbody tr:last-child .comp-jc { border-radius: 0 0 8px 8px; }
.comparativa .si { color: var(--verde-texto); font-weight: 700; font-size: 17px; }
.comparativa .no { color: var(--texto-2); }
.comparativa .medio { color: var(--ambar); font-size: 17px; }
.comparativa .comp-jc.si { color: var(--verde-texto); }
.corto { display: none; }
.comp-nota { margin-top: 12px; font: 12.5px var(--mono); color: var(--texto-2); }

@media (prefers-reduced-motion: reduce) { .capas::after { display: none; } }

@media (max-width: 1080px) {
  .capas { grid-template-columns: repeat(2, 1fr); padding-top: 0; }
  .capas::before, .capas::after, .capa::before { display: none; }
  .capa:last-child { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  
  .capas { grid-template-columns: 1fr; gap: 12px; padding-left: 26px; }
  .capas::before { display: block; top: 8px; bottom: 8px; left: 8px; right: auto; width: 2px; height: auto;
    background: repeating-linear-gradient(180deg, var(--linea-fuerte) 0 6px, transparent 6px 11px); }
  .capas::after { display: block; left: 4px; top: 8px; animation: baja 7s linear infinite; }
  @keyframes baja { from { top: 8px; } to { top: calc(100% - 18px); } }
  .capa::before { display: block; top: 22px; left: -24px; margin-left: 0; }
  .capa:last-child { grid-column: auto; }
  .comparativa { padding: 18px 14px; margin-top: 32px; }
  .comparativa th, .comparativa td { padding: 10px 6px; }
  .comparativa table { font-size: 13.5px; }
}
@media (max-width: 560px) {
  .largo { display: none; } .corto { display: inline; }
  .comparativa thead th { font-size: 10.5px; letter-spacing: 0; }
  .comparativa thead .comp-jc { font-size: 10.5px; }
}


.jc-info { color: #8fb3ff; }


.compromiso { margin: 0 0 20px; padding: 22px 24px; border-radius: var(--radio); background: var(--verde-suave); border: 1px solid var(--verde-marca); }
.compromiso h3 { font-size: 1.15rem; margin-bottom: 10px; }
.compromiso ul { display: grid; gap: 8px; }
.compromiso li { position: relative; padding-left: 26px; color: var(--texto-2); font-size: 15px; }
.compromiso li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--verde-texto); font-weight: 700; }
.compromiso li b { color: var(--texto); }
.compromiso p { margin-top: 12px; font-weight: 600; color: var(--verde-texto); }


.dev-cifra span { max-width: none; overflow-wrap: normal; hyphens: none; white-space: nowrap; }
@media (max-width: 760px) { .dev-cifra span { white-space: normal; } }


.jc-out { color: #c9d3e1; white-space: pre-wrap; font-size: .95em; }
.jc-l .jc-accion + .jc-accion, .jc-l a.jc-accion { margin-left: 6px; }
a.jc-accion { text-decoration: none; display: inline-block; }


.f-copiar { margin-left: 6px; font: 600 13px var(--mono); background: #fff; color: #14532d; border: 1px solid #bfe5c7; border-radius: 6px; padding: 3px 9px; cursor: pointer; }
.f-copiar:hover { background: #e8f6eb; }

/* ===== legal ===== */
.legal { max-width: 760px; }
.legal h2 { font-size: 1.35rem; margin: 32px 0 10px; }
.legal p, .legal li { color: var(--texto-2); margin-bottom: 10px; }
.legal ul { list-style: disc; padding-left: 22px; }
.legal b { color: var(--texto); }
.legal-fecha { margin-top: 28px; font: 13px var(--mono); }
.cf-turnstile { min-height: 65px; }