/* =========================================================
   Procesa · página de planes
   ========================================================= */

:root {
  --tinta: #0A1630;
  --tinta-2: #12234A;
  --tinta-3: #1B3163;
  --texto: #1C2640;
  --texto-suave: #5A6582;
  --papel: #F7F6F2;
  --superficie: #FFFFFF;
  --linea: rgba(10, 22, 48, .10);
  --linea-fuerte: rgba(10, 22, 48, .18);

  --azul: #3D5AFE;
  --azul-claro: #7C8CFF;
  --verde: #10B981;
  --verde-claro: #6EE7B7;
  --ambar: #F59E0B;
  --violeta: #8B5CF6;
  --coral: #F4604E;

  --degradado: linear-gradient(120deg, var(--azul) 0%, #4F8BFF 45%, var(--verde) 100%);
  --sombra-1: 0 1px 2px rgba(10,22,48,.06), 0 4px 14px rgba(10,22,48,.06);
  --sombra-2: 0 2px 6px rgba(10,22,48,.08), 0 24px 60px -18px rgba(10,22,48,.28);
  --sombra-brillo: 0 18px 50px -12px rgba(61,90,254,.55);

  --radio: 18px;
  --radio-sm: 12px;
  --fuente: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fuente-titulo: "Fraunces", Georgia, serif;
  --ancho: 1200px;
  --curva: cubic-bezier(.2, .8, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--fuente);
  font-size: 17px;
  line-height: 1.6;
  color: var(--texto);
  background: var(--papel);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
[hidden] { display: none !important; }
a { color: inherit; }
h1, h2, h3 { margin: 0; line-height: 1.1; letter-spacing: -.02em; }
h2 { font-family: var(--fuente-titulo); font-weight: 600; font-size: clamp(2rem, 4.2vw, 3.3rem); }
h3 { font-size: 1.35rem; font-weight: 700; }
p { margin: 0; }
button, input, select { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--azul-claro); outline-offset: 3px; border-radius: 6px; }

.saltar {
  position: absolute; left: 16px; top: -60px; z-index: 100;
  background: var(--tinta); color: #fff; padding: 10px 16px; border-radius: 10px;
}
.saltar:focus { top: 12px; }

.contenedor { width: 100%; max-width: var(--ancho); margin: 0 auto; padding: 0 24px; }
.contenedor--angosto { max-width: 860px; }
.seccion { padding: clamp(72px, 10vw, 128px) 0; position: relative; }

/* ---------- Tipografía auxiliar ---------- */
.antetitulo {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--fuente-titulo); font-style: italic; font-weight: 500; font-size: 1.08rem;
  color: var(--texto-suave); letter-spacing: 0;
}
.antetitulo__num {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--fuente); font-style: normal; font-weight: 700; font-size: .8rem;
  color: var(--azul); font-variant-numeric: tabular-nums; letter-spacing: .04em;
}
.antetitulo__num::after { content: ""; width: 36px; height: 1px; background: currentColor; opacity: .5; }
.antetitulo--oscuro { color: rgba(255,255,255,.66); }
.antetitulo--oscuro .antetitulo__num { color: var(--verde-claro); }
.antetitulo--heroe { color: rgba(255,255,255,.72); font-size: 1.15rem; }
.antetitulo--heroe::before { content: ""; width: 44px; height: 1px; background: linear-gradient(90deg, var(--verde-claro), transparent); }
.texto-degradado { background: var(--degradado); -webkit-background-clip: text; background-clip: text; color: transparent; }
.encabezado { text-align: center; max-width: 760px; margin: 0 auto clamp(40px, 6vw, 64px); display: grid; gap: 18px; justify-items: center; }
.encabezado__lead { color: var(--texto-suave); font-size: 1.1rem; max-width: 600px; }

.subrayado { font-style: italic; position: relative; white-space: nowrap; color: #fff; }
.subrayado::after {
  content: ""; position: absolute; left: -2%; right: -2%; bottom: .06em; height: .2em; z-index: -1;
  background: var(--degradado); border-radius: 4px; opacity: .85;
  transform-origin: left; transform: scaleX(0);
  animation: trazo 1s .9s var(--curva) forwards;
}
@keyframes trazo { to { transform: scaleX(1); } }

.punto-vivo {
  width: 8px; height: 8px; border-radius: 50%; background: var(--verde); display: inline-block; position: relative; flex: none;
}
.punto-vivo::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--verde);
  animation: latido 1.8s ease-out infinite;
}
@keyframes latido { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(3); opacity: 0; } }

/* ---------- Botones ---------- */
.boton {
  --bg: var(--superficie);
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 12px 20px; border-radius: 12px; border: 1px solid transparent;
  font-weight: 700; font-size: .98rem; text-decoration: none; cursor: pointer;
  transition: transform .25s var(--curva), box-shadow .25s var(--curva), background .25s;
  white-space: nowrap;
}
.boton svg { width: 18px; height: 18px; transition: transform .25s var(--curva); }
.boton:hover svg { transform: translateX(3px); }
.boton--primario { background: var(--degradado); background-size: 160% 100%; color: #fff; box-shadow: var(--sombra-brillo); }
.boton--primario:hover { transform: translateY(-2px); background-position: 100% 0; box-shadow: 0 22px 60px -12px rgba(61,90,254,.7); }
.boton--fantasma { color: #fff; border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.06); backdrop-filter: blur(8px); }
.boton--fantasma:hover { background: rgba(255,255,255,.12); transform: translateY(-2px); }
.boton--fantasma-claro { color: var(--tinta); border-color: var(--linea-fuerte); background: var(--superficie); }
.boton--fantasma-claro:hover { border-color: var(--azul); color: var(--azul); }
.boton--sm { padding: 9px 16px; font-size: .9rem; }
.boton--lg { padding: 15px 26px; font-size: 1.02rem; border-radius: 14px; }
.boton--bloque { width: 100%; }

/* ---------- Navegación ---------- */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  transition: background .3s, box-shadow .3s, backdrop-filter .3s;
}
.nav.nav--solida { background: rgba(10,22,48,.82); backdrop-filter: saturate(160%) blur(14px); box-shadow: 0 1px 0 rgba(255,255,255,.06); }
.nav__fila { display: flex; align-items: center; justify-content: space-between; height: 72px; gap: 24px; }
.marca { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: #fff; font-weight: 800; font-size: 1.3rem; letter-spacing: -.02em; }
.marca--clara { color: #fff; }
.nav__enlaces { display: flex; gap: 6px; }
.nav__enlaces a { color: rgba(255,255,255,.78); text-decoration: none; font-weight: 600; font-size: .95rem; padding: 8px 14px; border-radius: 10px; transition: color .2s, background .2s; }
.nav__enlaces a:hover { color: #fff; background: rgba(255,255,255,.08); }
.nav__enlaces .nav__movil-cta { display: none; }
.nav__acciones { display: flex; align-items: center; gap: 14px; }
.nav__ingresar { color: #fff; font-weight: 600; text-decoration: none; font-size: .95rem; }
.nav__ingresar:hover { text-decoration: underline; text-underline-offset: 4px; }
.nav__hamburguesa { display: none; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.06); border-radius: 12px; cursor: pointer; padding: 0; position: relative; }
.nav__hamburguesa span { position: absolute; left: 12px; right: 12px; height: 2px; background: #fff; border-radius: 2px; transition: transform .3s var(--curva), opacity .2s; }
.nav__hamburguesa span:nth-child(1) { top: 15px; }
.nav__hamburguesa span:nth-child(2) { top: 21px; }
.nav__hamburguesa span:nth-child(3) { top: 27px; }
.nav__hamburguesa[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav__hamburguesa[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav__hamburguesa[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---------- Héroe ---------- */
.heroe {
  position: relative; overflow: hidden; isolation: isolate;
  background: radial-gradient(1200px 600px at 80% -10%, #1C3478 0%, transparent 60%), var(--tinta);
  color: #fff; padding: 140px 0 56px;
}
.heroe__fondo { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.orbe { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .55; animation: flotar 16s ease-in-out infinite alternate; }
.orbe--a { width: 520px; height: 520px; background: #2F4BFF; top: -180px; right: -120px; }
.orbe--b { width: 380px; height: 380px; background: #0EA37A; bottom: -160px; left: -120px; opacity: .35; animation-delay: -5s; }
.orbe--c { width: 300px; height: 300px; background: #7C3AED; top: 40%; left: 45%; opacity: .22; animation-delay: -9s; }
@keyframes flotar { 0% { transform: translate(0,0) scale(1); } 100% { transform: translate(40px, 30px) scale(1.12); } }
.rejilla {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 30%, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 30%, #000 20%, transparent 75%);
}
.heroe__fila { display: grid; grid-template-columns: 1.02fr 1fr; gap: 56px; align-items: center; }
.heroe h1 { font-family: var(--fuente-titulo); font-weight: 600; font-size: clamp(2.7rem, 6.4vw, 5rem); line-height: 1.02; margin: 22px 0 22px; letter-spacing: -.03em; }
.heroe__lead { font-size: clamp(1.05rem, 1.6vw, 1.2rem); color: rgba(255,255,255,.76); max-width: 540px; }
.heroe__ctas { display: flex; flex-wrap: wrap; gap: 14px; margin: 34px 0 30px; }
.heroe__garantias { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px 22px; font-size: .92rem; color: rgba(255,255,255,.72); }
.heroe__garantias li, .contacto__puntos li { display: inline-flex; align-items: center; gap: 8px; }
.heroe__garantias svg, .contacto__puntos svg { width: 18px; height: 18px; fill: none; stroke: var(--verde-claro); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; flex: none; }

/* Escena animada */
.heroe__escena { position: relative; }
.escena { position: relative; aspect-ratio: 520 / 460; width: 100%; max-width: 560px; margin-left: auto; }
.escena__cables { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.escena__cables path { fill: none; stroke: rgba(124,140,255,.35); stroke-width: 2; stroke-dasharray: 5 7; animation: correr 1.2s linear infinite; }
@keyframes correr { to { stroke-dashoffset: -24; } }
.chispa { fill: var(--verde-claro); filter: drop-shadow(0 0 6px var(--verde-claro)); }
.chispa--b { fill: #A5B4FC; filter: drop-shadow(0 0 6px #A5B4FC); }

.fuente {
  position: absolute; left: 0; z-index: 2;
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px 10px 10px; border-radius: 14px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(10px);
  font-size: .85rem; line-height: 1.2; width: 29%;
  animation: flotarSuave 6s ease-in-out infinite;
}
.fuente b { display: block; font-size: .92rem; }
.fuente small { color: rgba(255,255,255,.6); font-size: .72rem; }
.fuente--1 { top: 6%; }
.fuente--2 { top: 24%; animation-delay: -3s; }
.fuente__icono { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: linear-gradient(135deg, #3D5AFE, #6B7CFF); flex: none; }
.fuente__icono--b { background: linear-gradient(135deg, #10B981, #34D399); }
.fuente__icono svg, .aviso__icono svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@keyframes flotarSuave { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

.panel {
  position: absolute; right: 0; top: 18%; width: 64%; z-index: 1;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(244,246,255,.96));
  color: var(--texto); border-radius: 18px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.4);
  overflow: hidden;
  transform: perspective(1400px) rotateY(-8deg) rotateX(3deg);
  transition: transform .6s var(--curva);
}
.heroe__escena:hover .panel { transform: perspective(1400px) rotateY(-2deg) rotateX(1deg); }
.panel__barra { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--linea); font-size: .78rem; }
.luces { display: flex; gap: 5px; }
.luces i { width: 9px; height: 9px; border-radius: 50%; background: #E3E6EF; }
.luces i:nth-child(1) { background: #FF6159; } .luces i:nth-child(2) { background: #FFBD2E; } .luces i:nth-child(3) { background: #28C941; }
.panel__titulo { font-weight: 700; }
.panel__vivo { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; color: var(--verde); font-weight: 700; }
.panel__resumen { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 12px 14px; }
.panel__resumen div { background: #F2F4FB; border-radius: 10px; padding: 8px 10px; }
.panel__resumen small { display: block; font-size: .64rem; color: var(--texto-suave); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.panel__resumen b { font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.panel__resumen .verde { color: var(--verde); }
.panel__lista { list-style: none; margin: 0; padding: 4px 8px 12px; }
.panel__lista li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 8px; border-radius: 9px; font-size: .72rem; transition: background .5s; }
.panel__lista li + li { border-top: 1px dashed var(--linea); }
.panel__lista li.destello { background: rgba(16,185,129,.12); }
.rad { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .68rem; color: var(--texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }

.chip { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 999px; font-size: .68rem; font-weight: 700; white-space: nowrap; flex: none; transition: background .4s, color .4s; }
.chip--gris { background: #EEF0F6; color: #7B849D; }
.chip--verde { background: rgba(16,185,129,.14); color: #047857; }
.chip--azul { background: rgba(61,90,254,.12); color: var(--azul); }

.aviso {
  position: absolute; left: 4%; bottom: 17%; z-index: 3; width: 58%;
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border-radius: 14px;
  background: #fff; color: var(--texto); box-shadow: var(--sombra-2);
  font-size: .82rem; line-height: 1.3;
  transform-origin: left center;
  animation: flotarSuave 5s ease-in-out infinite;
}
.aviso.aviso--entra { animation: avisoEntra .7s var(--curva); }
@keyframes avisoEntra { 0% { opacity: 0; transform: translateY(18px) scale(.92); } 100% { opacity: 1; transform: none; } }
.aviso b { display: block; }
.aviso small { color: var(--texto-suave); font-size: .74rem; }
.aviso__icono { width: 38px; height: 38px; border-radius: 11px; background: linear-gradient(135deg, var(--ambar), #FB923C); display: grid; place-items: center; flex: none; animation: timbre 2.5s ease-in-out infinite; }
@keyframes timbre { 0%, 70%, 100% { transform: rotate(0); } 75% { transform: rotate(-14deg); } 85% { transform: rotate(12deg); } 92% { transform: rotate(-6deg); } }

.archivo {
  position: absolute; right: 0; bottom: -3%; z-index: 3; width: 50%;
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border-radius: 12px;
  background: #fff; color: var(--texto); box-shadow: 0 1px 0 rgba(10,22,48,.06), var(--sombra-2);
  font-size: .78rem; line-height: 1.3;
}
.archivo__hoja {
  position: relative; flex: none; width: 30px; height: 38px; border-radius: 3px;
  background: linear-gradient(180deg, #F4F6FB, #E6EAF4);
  clip-path: polygon(0 0, 68% 0, 100% 24%, 100% 100%, 0 100%);
}
.archivo__hoja::before { content: ""; position: absolute; right: 0; top: 0; width: 32%; height: 24%; background: #C9D0E2; border-bottom-left-radius: 3px; }
.archivo__hoja b { position: absolute; left: -2px; bottom: 5px; font-size: .5rem; font-weight: 800; letter-spacing: .04em; color: #fff; background: #D93A2B; padding: 1px 4px; border-radius: 2px; }
.archivo__info { min-width: 0; flex: 1; display: grid; gap: 2px; }
.archivo__info b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .8rem; }
.archivo__info small { color: var(--texto-suave); font-size: .7rem; }
.archivo__progreso { height: 3px; border-radius: 2px; background: #E8EBF3; overflow: hidden; margin-top: 4px; }
.archivo__progreso i { display: block; height: 100%; width: 0; background: var(--azul); animation: descarga 3.4s var(--curva) infinite; }
@keyframes descarga { 0% { width: 0; background: var(--azul); } 45% { width: 100%; background: var(--azul); } 55%, 100% { width: 100%; background: var(--verde); } }
.archivo__ok { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid var(--linea-fuerte); animation: listo 3.4s var(--curva) infinite; }
.archivo__ok svg { width: 14px; fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
@keyframes listo { 0%, 48% { background: transparent; border-color: var(--linea-fuerte); transform: scale(1); } 55% { background: var(--verde); border-color: var(--verde); transform: scale(1.15); } 62%, 100% { background: var(--verde); border-color: var(--verde); transform: scale(1); } }

.cinta { margin-top: 64px; display: flex; align-items: baseline; gap: 12px 28px; flex-wrap: wrap; justify-content: center; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.1); }
.cinta > span { font-family: var(--fuente-titulo); font-style: italic; font-size: 1.05rem; color: rgba(255,255,255,.55); }
.cinta ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 0; justify-content: center; }
.cinta li { font-weight: 600; color: rgba(255,255,255,.88); font-size: .98rem; padding: 0 22px; }
.cinta li + li { border-left: 1px solid rgba(255,255,255,.18); }

/* ---------- Cifras ---------- */
.cifras__rejilla { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.cifra {
  background: var(--superficie); border: 1px solid var(--linea); border-radius: var(--radio);
  padding: 28px 24px; display: grid; gap: 10px; align-content: start;
  box-shadow: var(--sombra-1); transition: transform .35s var(--curva), box-shadow .35s var(--curva);
  position: relative; overflow: hidden;
}
.cifra::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--degradado); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--curva); }
.cifra:hover { transform: translateY(-6px); box-shadow: var(--sombra-2); }
.cifra:hover::before { transform: scaleX(1); }
.cifra__antes { font-size: .85rem; color: var(--texto-suave); font-weight: 600; }
.cifra__antes s { color: var(--coral); text-decoration-thickness: 2px; }
.cifra__valor { font-family: var(--fuente-titulo); font-size: 2.3rem; font-weight: 600; line-height: 1; letter-spacing: -.02em; background: var(--degradado); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cifra__texto { color: var(--texto-suave); font-size: .95rem; }

/* ---------- Cómo funciona ---------- */
.como { background: var(--superficie); }
.pasos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; position: relative; }
.pasos::before {
  content: ""; position: absolute; top: 90px; left: 16%; right: 16%; height: 2px;
  background: repeating-linear-gradient(90deg, var(--linea-fuerte) 0 8px, transparent 8px 16px);
}
.paso { position: relative; text-align: center; display: grid; justify-items: center; gap: 10px; }
.paso__arte { width: 180px; height: 180px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 30% 25%, #fff, #EEF1FF); border: 1px solid var(--linea); box-shadow: var(--sombra-1); margin-bottom: 14px; position: relative; z-index: 1; }
.paso__num { font-family: var(--fuente-titulo); font-weight: 700; font-size: .95rem; color: var(--azul); letter-spacing: .05em; }
.paso p { color: var(--texto-suave); max-width: 320px; }

.hoja-excel { width: 104px; background: #fff; border-radius: 10px; box-shadow: var(--sombra-2); overflow: visible; position: relative; font-size: .62rem; font-weight: 700; }
.hoja-excel__cab { display: flex; align-items: center; gap: 6px; padding: 6px 8px; background: #107C41; color: #fff; border-radius: 10px 10px 0 0; }
.hoja-excel__cab i { width: 10px; height: 10px; border-radius: 2px; background: rgba(255,255,255,.8); }
.hoja-excel__filas { padding: 6px 8px 10px; display: grid; gap: 5px; }
.hoja-excel__filas i { height: 7px; border-radius: 3px; background: #E4F2EA; animation: filaCarga 3s ease-in-out infinite; transform-origin: left; }
.hoja-excel__filas i:nth-child(2) { animation-delay: .2s; } .hoja-excel__filas i:nth-child(3) { animation-delay: .4s; } .hoja-excel__filas i:nth-child(4) { animation-delay: .6s; } .hoja-excel__filas i:nth-child(5) { animation-delay: .8s; }
@keyframes filaCarga { 0% { background: #E4F2EA; } 30% { background: #34D399; } 60%,100% { background: #E4F2EA; } }
.hoja-excel__flecha { position: absolute; right: -16px; top: -16px; width: 34px; height: 34px; border-radius: 50%; background: var(--azul); display: grid; place-items: center; box-shadow: var(--sombra-brillo); animation: subir 1.8s ease-in-out infinite; }
.hoja-excel__flecha svg { width: 18px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
@keyframes subir { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }

.radar { width: 120px; height: 120px; border-radius: 50%; position: relative; overflow: hidden;
  background: radial-gradient(circle, transparent 0 29%, rgba(61,90,254,.18) 30% 31%, transparent 32% 59%, rgba(61,90,254,.18) 60% 61%, transparent 62%), #0F1D3F; }
.radar__barrido { position: absolute; inset: 0; background: conic-gradient(from 0deg, rgba(110,231,183,.55), transparent 70deg); animation: girar 3s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }
.radar i { position: absolute; left: var(--x); top: var(--y); width: 8px; height: 8px; border-radius: 50%; background: var(--verde-claro); box-shadow: 0 0 10px var(--verde-claro); animation: parpadeo 3s ease-in-out infinite; }
.radar i:nth-of-type(2) { animation-delay: 1s; } .radar i:nth-of-type(3) { animation-delay: 2s; }
@keyframes parpadeo { 0%,100% { opacity: .2; transform: scale(.7); } 30% { opacity: 1; transform: scale(1.2); } }

.campana { position: relative; width: 84px; height: 84px; border-radius: 24px; background: linear-gradient(135deg, var(--ambar), #FB923C); display: grid; place-items: center; box-shadow: 0 18px 40px -12px rgba(245,158,11,.6); }
.campana svg { width: 42px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; animation: timbre 2.2s ease-in-out infinite; transform-origin: 50% 10%; }
.campana__globo { position: absolute; top: -8px; right: -8px; width: 28px; height: 28px; border-radius: 50%; background: var(--coral); color: #fff; font-weight: 800; font-size: .85rem; display: grid; place-items: center; border: 3px solid #fff; animation: rebote 2.2s ease-in-out infinite; }
@keyframes rebote { 0%,70%,100% { transform: scale(1); } 78% { transform: scale(1.3); } }

/* ---------- Servicios ---------- */
.servicio { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 88px); align-items: center; padding: clamp(28px, 4vw, 48px) 0; }
.servicio + .servicio { border-top: 1px solid var(--linea); }
.servicio--invertido .servicio__texto { order: 2; }
.servicio__texto { display: grid; gap: 16px; }
.servicio__texto h3 { font-family: var(--fuente-titulo); font-weight: 600; font-size: clamp(1.7rem, 3vw, 2.3rem); }
.servicio__texto > p { color: var(--texto-suave); font-size: 1.05rem; }
.servicio__tag { justify-self: start; font-size: .76rem; font-weight: 700; padding: 5px 12px; border-radius: 999px; }
.tag--azul { background: rgba(61,90,254,.1); color: var(--azul); }
.tag--violeta { background: rgba(139,92,246,.12); color: #6D28D9; }
.tag--ambar { background: rgba(245,158,11,.14); color: #B45309; }
.tag--verde { background: rgba(16,185,129,.14); color: #047857; }
.lista-check { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 10px; }
.lista-check li { position: relative; padding-left: 32px; }
.lista-check li::before {
  content: ""; position: absolute; left: 0; top: 3px; width: 21px; height: 21px; border-radius: 50%;
  background: rgba(16,185,129,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.5 10.5 3 3 6-6.5' fill='none' stroke='%23059669' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/15px no-repeat;
}

.ilus {
  position: relative; aspect-ratio: 5 / 4; border-radius: 28px; overflow: hidden;
  background: radial-gradient(circle at 20% 15%, #fff 0, transparent 50%), linear-gradient(145deg, #EEF1FF, #E8F8F1);
  border: 1px solid var(--linea); box-shadow: var(--sombra-2);
  display: grid; place-items: center; padding: 28px;
}
.ilus--memorial { background: radial-gradient(circle at 80% 10%, #fff 0, transparent 50%), linear-gradient(145deg, #F3EEFF, #EEF1FF); }
.ilus--certificado { background: radial-gradient(circle at 20% 90%, #fff 0, transparent 50%), linear-gradient(145deg, #FFF6E6, #EEF1FF); }
.ilus--liquidador { background: radial-gradient(circle at 80% 90%, #fff 0, transparent 50%), linear-gradient(145deg, #E8F8F1, #EEF1FF); }

/* Vigilancia: línea de tiempo */
.linea-tiempo { width: 86%; background: #fff; border-radius: 18px; box-shadow: var(--sombra-2); padding: 18px 18px 10px; display: grid; gap: 4px; position: relative; }
.linea-tiempo::before { content: ""; position: absolute; left: 27px; top: 28px; bottom: 34px; width: 2px; background: #E3E7F3; }
.lt-item { display: flex; align-items: center; gap: 14px; padding: 8px 6px; border-radius: 12px; position: relative; font-size: .88rem; line-height: 1.3; }
.lt-item b { display: block; font-size: .9rem; }
.lt-item small { color: var(--texto-suave); font-size: .76rem; }
.lt-item .chip { margin-left: auto; }
.lt-punto { width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid #C7CEE6; flex: none; position: relative; z-index: 1; }
.lt-item--nuevo { background: rgba(16,185,129,.08); }
.lt-item--nuevo .lt-punto { border-color: var(--verde); background: var(--verde); box-shadow: 0 0 0 5px rgba(16,185,129,.2); }
.en-vista .lt-item { animation: aparecer .6s var(--curva) both; }
.en-vista .lt-item:nth-child(2) { animation-delay: .15s; } .en-vista .lt-item:nth-child(3) { animation-delay: .3s; }
.en-vista .lt-item--nuevo { animation: aparecer .6s var(--curva) .9s both, resplandor 2.4s ease-in-out 1.6s infinite; }
@keyframes aparecer { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes resplandor { 0%,100% { background: rgba(16,185,129,.08); } 50% { background: rgba(16,185,129,.18); } }
.correo-flotante { position: absolute; right: 6%; top: 8%; display: flex; align-items: center; gap: 10px; background: var(--tinta); color: #fff; padding: 10px 14px; border-radius: 14px; box-shadow: var(--sombra-2); font-size: .78rem; line-height: 1.25; animation: flotarSuave 5s ease-in-out infinite; }
.correo-flotante svg { width: 22px; fill: none; stroke: var(--verde-claro); stroke-width: 1.8; stroke-linejoin: round; }
.correo-flotante small { display: block; color: rgba(255,255,255,.6); }

/* Memorial */
.ilus--memorial { place-items: stretch; }
.memorial { position: absolute; left: 9%; top: 11%; width: 50%; height: 78%; background: #fff; border-radius: 10px; box-shadow: var(--sombra-2); padding: 18px 18px; display: flex; flex-direction: column; gap: 8px; font-family: "Times New Roman", Georgia, serif; }
.memorial__cab { font-size: .72rem; font-weight: 700; line-height: 1.3; }
.memorial__ref { font-size: .62rem; color: var(--texto-suave); line-height: 1.35; margin-bottom: 4px; }
.renglon { display: block; height: 6px; border-radius: 3px; background: #E4E8F3; width: 0; }
.en-vista .renglon { animation: escribir .7s var(--curva) forwards; }
.en-vista .renglon:nth-of-type(1) { animation-delay: .2s; } .en-vista .renglon:nth-of-type(2) { animation-delay: .5s; } .en-vista .renglon:nth-of-type(3) { animation-delay: .8s; } .en-vista .renglon:nth-of-type(4) { animation-delay: 1.1s; } .en-vista .renglon:nth-of-type(5) { animation-delay: 1.4s; } .en-vista .renglon:nth-of-type(6) { animation-delay: 1.7s; } .en-vista .renglon:nth-of-type(7) { animation-delay: 1.9s; } .en-vista .renglon:nth-of-type(8) { animation-delay: 2.1s; }
@keyframes escribir { to { width: var(--w); } }
.renglon--firma { margin-top: auto; background: var(--tinta); height: 2px; }
.sello { position: absolute; right: 12px; bottom: 34%; font-family: var(--fuente); font-weight: 800; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; color: var(--verde); border: 3px solid var(--verde); padding: 5px 12px; border-radius: 8px; background: rgba(255,255,255,.92); transform: rotate(-12deg) scale(2); opacity: 0; }
.en-vista .sello { animation: sellar .5s cubic-bezier(.3,1.6,.5,1) 2.2s forwards; }
@keyframes sellar { to { transform: rotate(-12deg) scale(1); opacity: 1; } }
.vuelo { position: absolute; left: 58%; top: 40%; width: 44px; height: 44px; border-radius: 50%; background: var(--violeta); display: grid; place-items: center; box-shadow: 0 12px 30px -8px rgba(139,92,246,.7); opacity: 0; }
.vuelo svg { width: 22px; fill: none; stroke: #fff; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.en-vista .vuelo { animation: volar 3.2s var(--curva) 2.8s infinite; }
@keyframes volar { 0% { opacity: 0; transform: translate(0, 0) scale(.6); } 15% { opacity: 1; transform: translate(0, 0) scale(1); } 55% { opacity: 1; transform: translate(80px, -70px) scale(.9); } 70%,100% { opacity: 0; transform: translate(96px, -84px) scale(.5); } }
.juzgado { position: absolute; right: 7%; top: 11%; width: 30%; display: grid; justify-items: center; gap: 8px; text-align: center; background: #fff; border-radius: 14px; padding: 14px 10px; box-shadow: var(--sombra-1); font-size: .72rem; font-weight: 700; line-height: 1.25; }
.juzgado svg { width: 30px; fill: none; stroke: var(--tinta); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.respuesta { position: absolute; right: 5%; bottom: 11%; width: 44%; display: flex; gap: 10px; align-items: center; background: var(--tinta); color: #fff; border-radius: 14px; padding: 12px 14px; font-size: .74rem; line-height: 1.25; box-shadow: var(--sombra-2); opacity: 0; }
.respuesta svg { width: 22px; flex: none; fill: none; stroke: var(--verde-claro); stroke-width: 1.8; stroke-linejoin: round; }
.respuesta small { display: block; color: rgba(255,255,255,.6); }
.en-vista .respuesta { animation: aparecer .6s var(--curva) 4.2s forwards; }

/* Certificado */
.ilus--certificado { place-items: stretch; }
.pdf { position: absolute; left: 8%; top: 10%; width: 40%; height: 80%; background: #fff; border-radius: 10px; box-shadow: var(--sombra-2); padding: 14px; display: flex; flex-direction: column; gap: 9px; overflow: hidden; }
.pdf__cab { font-size: .64rem; font-weight: 700; display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.pdf__cab span { background: var(--coral); color: #fff; padding: 2px 5px; border-radius: 4px; font-size: .58rem; }
.pdf .renglon { width: var(--w); }
.escaner { position: absolute; left: 0; right: 0; top: 0; height: 40px; background: linear-gradient(180deg, transparent, rgba(245,158,11,.28)); border-bottom: 2px solid var(--ambar); box-shadow: 0 6px 18px rgba(245,158,11,.5); animation: escanear 2.8s ease-in-out infinite; }
@keyframes escanear { 0% { transform: translateY(-40px); } 100% { transform: translateY(calc(100% + 280px)); } }
.chequeo { position: absolute; right: 6%; top: 10%; width: 46%; list-style: none; margin: 0; padding: 12px; background: #fff; border-radius: 14px; box-shadow: var(--sombra-1); display: grid; gap: 7px; font-size: .74rem; line-height: 1.25; font-weight: 600; }
.chequeo li { display: flex; align-items: flex-start; gap: 8px; opacity: 0; }
.chequeo em { display: block; font-style: normal; color: var(--texto-suave); font-weight: 500; font-size: .66rem; }
.en-vista .chequeo li { animation: aparecer .5s var(--curva) calc(.5s + var(--i) * .45s) forwards; }
.chequeo i { width: 16px; height: 16px; border-radius: 50%; flex: none; margin-top: 1px; }
.chequeo i.ok { background: var(--verde) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.5 10.5 3 3 6-6.5' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.chequeo i.alerta { background: var(--ambar) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 5v6m0 3.5v.5' fill='none' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.veredicto { position: absolute; right: 6%; bottom: 10%; width: 46%; padding: 12px 14px; border-radius: 14px; background: linear-gradient(135deg, #065F46, var(--verde)); color: #fff; box-shadow: 0 16px 36px -12px rgba(16,185,129,.7); opacity: 0; }
.veredicto small { display: block; font-size: .66rem; text-transform: uppercase; letter-spacing: .1em; opacity: .75; font-weight: 700; }
.veredicto b { font-size: .95rem; }
.en-vista .veredicto { animation: sellar2 .6s cubic-bezier(.3,1.5,.5,1) 3s forwards; }
@keyframes sellar2 { from { opacity: 0; transform: scale(.8); } to { opacity: 1; transform: none; } }

/* Liquidador */
.liq { width: 84%; background: #fff; border-radius: 18px; box-shadow: var(--sombra-2); padding: 20px; display: grid; gap: 10px; font-size: .88rem; }
.liq__cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-weight: 800; font-size: .92rem; margin-bottom: 4px; flex-wrap: wrap; }
.liq__fila, .liq__total { display: flex; justify-content: space-between; gap: 12px; }
.liq__fila span { color: var(--texto-suave); }
.liq__fila b { font-variant-numeric: tabular-nums; }
.liq__total { border-top: 2px solid var(--tinta); padding-top: 10px; font-weight: 800; font-size: 1.05rem; }
.liq__total b { color: var(--verde); font-variant-numeric: tabular-nums; }
.barras { display: flex; align-items: flex-end; gap: 5px; height: 64px; margin-top: 8px; }
.barras i { flex: 1; height: 0; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, var(--azul-claro), var(--azul)); transition: height .9s var(--curva); }
.en-vista .barras i { height: var(--h); }
.barras i:nth-child(2) { transition-delay: .05s; } .barras i:nth-child(3) { transition-delay: .1s; } .barras i:nth-child(4) { transition-delay: .15s; } .barras i:nth-child(5) { transition-delay: .2s; } .barras i:nth-child(6) { transition-delay: .25s; } .barras i:nth-child(7) { transition-delay: .3s; } .barras i:nth-child(8) { transition-delay: .35s; } .barras i:nth-child(9) { transition-delay: .4s; } .barras i:nth-child(10) { transition-delay: .45s; } .barras i:nth-child(11) { transition-delay: .5s; } .barras i:nth-child(12) { transition-delay: .55s; }
.liq__nota { color: var(--texto-suave); font-size: .72rem; }

/* ---------- Comparación ---------- */
.comparacion { background: var(--tinta); color: #fff; overflow: hidden; }
.comparacion h2 { color: #fff; }
.tabla-comp { border-radius: 22px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.03); max-width: 980px; margin: 0 auto; }
.tc-fila { display: grid; grid-template-columns: 1.3fr 1fr 1.2fr; align-items: center; }
.tc-fila > span { padding: 18px 22px; display: flex; align-items: center; gap: 10px; }
.tc-fila + .tc-fila { border-top: 1px solid rgba(255,255,255,.08); }
.tc-fila > span:nth-child(2) { color: rgba(255,255,255,.6); }
.tc-cab { font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; color: rgba(255,255,255,.55); }
.tc-procesa { background: linear-gradient(90deg, rgba(61,90,254,.14), rgba(16,185,129,.12)); color: #fff; font-weight: 600; align-self: stretch; }
.tc-cab .tc-procesa { color: #fff; text-transform: none; letter-spacing: 0; font-size: 1rem; }
.tabla-comp i { width: 20px; height: 20px; border-radius: 50%; flex: none; }
.tabla-comp i.si { background: var(--verde) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.5 10.5 3 3 6-6.5' fill='none' stroke='white' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat; }
.tabla-comp i.no { background: rgba(244,96,78,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m6.5 6.5 7 7m0-7-7 7' fill='none' stroke='%23F4604E' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat; }
.tabla-comp i.parcial { background: rgba(245,158,11,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10h8' fill='none' stroke='%23F59E0B' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat; }

/* ---------- Planes ---------- */
.planes { background: linear-gradient(180deg, var(--papel), #EEF1FA); }
.calculadora {
  display: grid; grid-template-columns: 1.35fr 1fr; gap: 0;
  background: var(--superficie); border-radius: 28px; box-shadow: var(--sombra-2); border: 1px solid var(--linea);
  overflow: hidden; margin-bottom: 72px;
}
.calc__entrada { padding: clamp(24px, 4vw, 44px); display: grid; gap: 22px; align-content: start; }
.calc__pregunta { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.calc__pregunta label { font-weight: 800; font-size: 1.2rem; }
.calc__numero { display: flex; align-items: center; border: 1.5px solid var(--linea-fuerte); border-radius: 14px; overflow: hidden; background: var(--papel); }
.calc__numero input { width: 96px; text-align: center; border: 0; background: transparent; font-weight: 800; font-size: 1.3rem; padding: 8px 4px; font-variant-numeric: tabular-nums; -moz-appearance: textfield; appearance: textfield; }
.calc__numero input::-webkit-outer-spin-button, .calc__numero input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.calc__numero input:focus { outline: none; }
.calc__numero:focus-within { border-color: var(--azul); box-shadow: 0 0 0 4px rgba(61,90,254,.15); }
.calc__paso { width: 44px; height: 48px; border: 0; background: transparent; font-size: 1.4rem; font-weight: 600; cursor: pointer; color: var(--texto-suave); transition: background .2s, color .2s; }
.calc__paso:hover { background: rgba(61,90,254,.08); color: var(--azul); }
.calc__ayuda { color: var(--texto-suave); font-size: .88rem; }

.deslizador { -webkit-appearance: none; appearance: none; width: 100%; height: 10px; border-radius: 999px; outline: none; cursor: pointer;
  background: linear-gradient(90deg, var(--azul) 0%, var(--verde) var(--lleno, 50%), #E3E7F3 var(--lleno, 50%)); }
.deslizador::-webkit-slider-thumb { -webkit-appearance: none; width: 30px; height: 30px; border-radius: 50%; background: #fff; border: 3px solid var(--azul); box-shadow: 0 6px 16px rgba(61,90,254,.4); cursor: grab; transition: transform .2s; }
.deslizador::-webkit-slider-thumb:active { transform: scale(1.15); cursor: grabbing; }
.deslizador::-moz-range-thumb { width: 26px; height: 26px; border-radius: 50%; background: #fff; border: 3px solid var(--azul); box-shadow: 0 6px 16px rgba(61,90,254,.4); cursor: grab; }
.deslizador:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 6px rgba(61,90,254,.25); }
.deslizador__marcas { position: relative; height: 18px; margin: -10px 15px 0; font-size: .72rem; color: var(--texto-suave); font-weight: 600; }
.deslizador__marcas span { position: absolute; left: var(--p); transform: translateX(-50%); white-space: nowrap; }

.modalidad { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.modalidad legend { font-weight: 700; margin-bottom: 12px; padding: 0; }
.modalidad__op { position: relative; cursor: pointer; }
.modalidad__op input { position: absolute; opacity: 0; }
.modalidad__op span { display: grid; gap: 4px; height: 100%; padding: 14px 16px 14px 46px; border-radius: 14px; border: 1.5px solid var(--linea-fuerte); transition: border-color .2s, background .2s, box-shadow .2s; }
.modalidad__op span::before { content: ""; position: absolute; left: 16px; top: 17px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--linea-fuerte); background: #fff; transition: border .2s, box-shadow .2s; }
.modalidad__op small { color: var(--texto-suave); font-size: .8rem; line-height: 1.35; }
.modalidad__op input:checked + span { border-color: var(--azul); background: rgba(61,90,254,.05); box-shadow: 0 0 0 4px rgba(61,90,254,.1); }
.modalidad__op input:checked + span::before { border: 6px solid var(--azul); }
.modalidad__op input:focus-visible + span { outline: 3px solid var(--azul-claro); outline-offset: 2px; }

.calc__certs { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 18px; border-top: 1px dashed var(--linea-fuerte); }
.calc__certs label { font-weight: 700; }
.calc__certs small { color: var(--texto-suave); font-weight: 500; }
.calc__certs input { width: 120px; padding: 10px 12px; border-radius: 12px; border: 1.5px solid var(--linea-fuerte); background: var(--papel); font-weight: 700; text-align: center; }
.calc__certs input:focus { outline: none; border-color: var(--azul); box-shadow: 0 0 0 4px rgba(61,90,254,.15); }

.calc__resultado { background: radial-gradient(500px 300px at 100% 0%, rgba(61,90,254,.5), transparent 60%), radial-gradient(400px 300px at 0% 100%, rgba(16,185,129,.28), transparent 60%), var(--tinta); color: #fff; padding: clamp(24px, 4vw, 44px); display: grid; gap: 14px; align-content: start; position: relative; }
.resultado__cab span { font-size: .78rem; text-transform: uppercase; letter-spacing: .14em; color: rgba(255,255,255,.55); font-weight: 700; }
.resultado__cab b { display: block; font-family: var(--fuente-titulo); font-size: 2.2rem; font-weight: 600; line-height: 1.1; margin-top: 4px; }
.resultado__cab small { color: var(--verde-claro); font-weight: 600; }
.resultado__precio { display: flex; align-items: baseline; gap: 4px; font-variant-numeric: tabular-nums; }
.resultado__precio .moneda { font-size: 1.6rem; font-weight: 700; color: rgba(255,255,255,.7); }
.resultado__precio #resPrecio { font-size: clamp(2.6rem, 5vw, 3.6rem); font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.resultado__precio .periodo { color: rgba(255,255,255,.6); font-weight: 600; }
.resultado__precio.cambio #resPrecio { animation: pulsoPrecio .45s var(--curva); }
@keyframes pulsoPrecio { 0% { transform: translateY(8px); opacity: .3; } 100% { transform: none; opacity: 1; } }
.resultado__por { color: rgba(255,255,255,.7); font-size: .95rem; }
.resultado__lineas { list-style: none; margin: 6px 0 0; padding: 14px 0 0; border-top: 1px solid rgba(255,255,255,.12); display: grid; gap: 10px; font-size: .92rem; }
.resultado__lineas li { display: flex; justify-content: space-between; gap: 12px; color: rgba(255,255,255,.75); }
.resultado__lineas b { color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
.resultado__total { padding-top: 10px; border-top: 1px dashed rgba(255,255,255,.18); font-weight: 700; }
.resultado__total span { color: #fff !important; }
.resultado__total b { color: var(--verde-claro); font-size: 1.1rem; }
.resultado__nota { font-size: .85rem; color: rgba(255,255,255,.7); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); padding: 10px 12px; border-radius: 12px; }
.resultado__nota.aviso-nota { color: #FDE68A; border-color: rgba(253,230,138,.3); background: rgba(245,158,11,.1); }

.interruptor { position: relative; display: grid; grid-template-columns: 1fr 1fr; width: min(420px, 100%); margin: 0 auto 36px; padding: 5px; border-radius: 999px; background: var(--superficie); border: 1px solid var(--linea); box-shadow: var(--sombra-1); }
.interruptor__op { position: relative; z-index: 1; border: 0; background: transparent; padding: 11px 16px; font-weight: 700; font-size: .95rem; border-radius: 999px; cursor: pointer; color: var(--texto-suave); transition: color .3s; }
.interruptor__op.activo { color: #fff; }
.interruptor__pastilla { position: absolute; top: 5px; bottom: 5px; left: 5px; width: calc(50% - 5px); border-radius: 999px; background: var(--degradado); box-shadow: var(--sombra-brillo); transition: transform .45s var(--curva); }
.interruptor[data-vista="con"] .interruptor__pastilla { transform: translateX(100%); }

.tarjetas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.tarjeta {
  font: inherit; color: inherit; width: 100%;
  position: relative; background: var(--superficie); border: 1.5px solid var(--linea); border-radius: 22px; padding: 24px 22px 22px;
  display: grid; gap: 12px; align-content: start;
  transition: transform .35s var(--curva), box-shadow .35s var(--curva), border-color .35s;
  cursor: pointer; text-align: left;
}
.tarjeta:hover { transform: translateY(-6px); box-shadow: var(--sombra-2); border-color: rgba(61,90,254,.35); }
.tarjeta.elegida { border-color: var(--azul); box-shadow: 0 0 0 4px rgba(61,90,254,.12), var(--sombra-2); transform: translateY(-6px); }
.tarjeta__insignia { position: absolute; top: -12px; left: 22px; font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 5px 11px; border-radius: 999px; background: var(--degradado); color: #fff; box-shadow: var(--sombra-brillo); }
.tarjeta__nombre { font-weight: 800; font-size: 1.12rem; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.tarjeta__nombre span { width: 10px; height: 10px; border-radius: 50%; background: var(--c, var(--azul)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c, var(--azul)) 18%, transparent); }
.tarjeta__rango { color: var(--texto-suave); font-size: .88rem; font-weight: 600; margin-top: -8px; }
.tarjeta__precio { font-variant-numeric: tabular-nums; }
.tarjeta__precio b { font-size: 1.9rem; font-weight: 800; letter-spacing: -.03em; display: inline-block; transition: opacity .25s, transform .25s; }
.tarjeta__precio small { color: var(--texto-suave); font-weight: 600; }
.tarjetas.girando .tarjeta__precio b, .tarjetas.girando .tarjeta__detalle { opacity: 0; transform: translateY(-6px); }
.tarjeta__detalle { font-size: .86rem; color: var(--texto-suave); display: grid; gap: 6px; padding-top: 12px; border-top: 1px dashed var(--linea-fuerte); transition: opacity .25s, transform .25s; }
.tarjeta__detalle > span { display: flex; justify-content: space-between; gap: 8px; }
.tarjeta__detalle b { color: var(--texto); }
.tarjeta__barra { height: 6px; border-radius: 999px; background: #EEF0F6; overflow: hidden; }
.tarjeta__barra i { display: block; height: 100%; width: var(--w); border-radius: inherit; background: var(--degradado); }
.tarjeta--medida { background: var(--tinta); color: #fff; border-color: transparent; text-decoration: none; }
.tarjeta--medida .tarjeta__rango, .tarjeta--medida .tarjeta__detalle { color: rgba(255,255,255,.65); }
.tarjeta--medida .tarjeta__precio b { font-size: 1.5rem; }
.tarjeta--medida .tarjeta__detalle { border-color: rgba(255,255,255,.18); }

.extras { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 48px; }
.extra { background: var(--superficie); border: 1px solid var(--linea); border-radius: 22px; padding: 26px; display: grid; gap: 12px; align-content: start; box-shadow: var(--sombra-1); }
.extra p { color: var(--texto-suave); font-size: .95rem; }
.extra__icono { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; }
.extra__icono svg { width: 24px; fill: none; stroke: #fff; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.extra__icono--violeta { background: linear-gradient(135deg, #8B5CF6, #A78BFA); }
.extra__icono--ambar { background: linear-gradient(135deg, #F59E0B, #FBBF24); }
.extra__icono--verde { background: linear-gradient(135deg, #059669, #34D399); }
.extra__precios { display: grid; gap: 8px; margin-top: 4px; }
.extra__precios div { display: flex; justify-content: space-between; gap: 8px; padding: 10px 14px; border-radius: 12px; background: var(--papel); font-size: .92rem; }
.extra__precios b { font-variant-numeric: tabular-nums; }
.extra .boton { justify-self: start; margin-top: 4px; }

/* ---------- Preguntas ---------- */
.preguntas { background: var(--superficie); }
.acordeon { display: grid; gap: 12px; }
.acordeon details { border: 1px solid var(--linea); border-radius: 16px; background: var(--papel); transition: background .3s, box-shadow .3s; }
.acordeon details[open] { background: var(--superficie); box-shadow: var(--sombra-1); }
.acordeon summary { list-style: none; cursor: pointer; padding: 20px 60px 20px 24px; font-weight: 700; font-size: 1.05rem; position: relative; }
.acordeon summary::-webkit-details-marker { display: none; }
.acordeon summary::after { content: ""; position: absolute; right: 22px; top: 50%; width: 26px; height: 26px; margin-top: -13px; border-radius: 50%; background: rgba(61,90,254,.1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 5v10M5 10h10' fill='none' stroke='%233D5AFE' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat; transition: transform .35s var(--curva); }
.acordeon details[open] summary::after { transform: rotate(135deg); }
.acordeon details p { padding: 0 24px 22px; color: var(--texto-suave); }

/* ---------- Contacto ---------- */
.contacto { background: var(--tinta); color: #fff; overflow: hidden; isolation: isolate; }
.contacto__fila { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 80px); align-items: center; }
.contacto__texto { display: grid; gap: 20px; justify-items: start; }
.contacto__texto > p { color: rgba(255,255,255,.72); font-size: 1.1rem; }
.contacto__puntos { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; color: rgba(255,255,255,.85); font-weight: 600; }
.formulario { background: #fff; color: var(--texto); border-radius: 26px; padding: clamp(22px, 4vw, 36px); display: grid; gap: 16px; box-shadow: 0 40px 90px -30px rgba(0,0,0,.7); }
.formulario__cab { display: grid; gap: 4px; padding-bottom: 6px; border-bottom: 1px solid var(--linea); margin-bottom: 2px; }
.formulario__cab h3 { font-family: var(--fuente-titulo); font-weight: 600; font-size: 1.6rem; }
.formulario__cab p { color: var(--texto-suave); font-size: .92rem; padding-bottom: 10px; }
.campo { display: grid; gap: 7px; min-width: 0; }
.campo label, .intereses legend { font-weight: 700; font-size: .86rem; color: var(--texto); }
.campo__req { color: var(--coral); }
.campo__opc { font-weight: 500; color: var(--texto-suave); font-size: .8rem; margin-left: 4px; }
.formulario input:not([type="checkbox"]) {
  width: 100%; height: 48px; padding: 0 14px; border-radius: 12px;
  border: 1.5px solid var(--linea-fuerte); background: var(--papel);
  font-weight: 500; font-size: 1rem; transition: border-color .2s, box-shadow .2s, background .2s;
}
.formulario input::placeholder { color: #9AA3BA; font-weight: 400; }
.formulario input:not([type="checkbox"]):hover { border-color: rgba(10,22,48,.3); }
.formulario input:not([type="checkbox"]):focus { outline: none; border-color: var(--azul); box-shadow: 0 0 0 4px rgba(61,90,254,.15); background: #fff; }
.formulario input[aria-invalid="true"] { border-color: var(--coral); background: #FFF6F5; }
.campo__sufijo { position: relative; }
.campo__sufijo input { padding-right: 84px; font-variant-numeric: tabular-nums; }
.campo__sufijo span { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: var(--texto-suave); font-size: .85rem; pointer-events: none; }
.formulario__dos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.intereses { border: 0; margin: 0; padding: 0; min-width: 0; }
.intereses legend { padding: 0; margin-bottom: 8px; }
.intereses__op { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.interes { position: relative; cursor: pointer; }
.interes input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.interes__caja {
  display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 12px;
  border: 1.5px solid var(--linea-fuerte); border-radius: 12px; background: var(--papel);
  font-weight: 600; font-size: .92rem; user-select: none;
  transition: border-color .2s, background .2s, box-shadow .2s, color .2s;
}
.interes__icono { width: 18px; height: 18px; flex: none; fill: none; stroke: var(--texto-suave); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: stroke .2s; }
.interes__check { width: 18px; height: 18px; margin-left: auto; flex: none; border-radius: 5px; border: 1.5px solid var(--linea-fuerte); background: #fff; fill: none; stroke: transparent; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; transition: background .2s, border-color .2s; }
.interes:hover .interes__caja { border-color: rgba(10,22,48,.3); }
.interes input:checked + .interes__caja { border-color: var(--azul); background: rgba(61,90,254,.06); color: var(--tinta); }
.interes input:checked + .interes__caja .interes__icono { stroke: var(--azul); }
.interes input:checked + .interes__caja .interes__check { background: var(--azul); border-color: var(--azul); stroke: #fff; }
.interes input:focus-visible + .interes__caja { outline: 3px solid var(--azul-claro); outline-offset: 2px; }

.boton--whatsapp { background: #16A34A; color: #fff; box-shadow: 0 16px 40px -14px rgba(22,163,74,.7); margin-top: 4px; }
.boton--whatsapp:hover { background: #15803D; transform: translateY(-2px); }
.boton--whatsapp svg { width: 22px; height: 22px; }
.boton--whatsapp:hover svg { transform: none; }
.formulario__error { color: #C2410C; font-size: .88rem; font-weight: 600; margin-top: -4px; }
.formulario__pie { text-align: center; font-size: .82rem; color: var(--texto-suave); }
.formulario__pie a { color: var(--azul); font-weight: 700; }

/* ---------- Pie ---------- */
.pie { background: #060E20; color: rgba(255,255,255,.6); padding: 48px 0 28px; font-size: .92rem; }
.pie__fila { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-bottom: 28px; border-bottom: 1px solid rgba(255,255,255,.08); }
.pie__fila nav { display: flex; gap: 20px; }
.pie__fila nav a { text-decoration: none; color: rgba(255,255,255,.75); font-weight: 600; }
.pie__fila nav a:hover { color: #fff; }
.pie__legal { padding-top: 22px; font-size: .8rem; color: rgba(255,255,255,.42); }

/* ---------- Aparición al hacer scroll ---------- */
.js .revelar { opacity: 0; }
.js .revelar.visible { animation: revelar .8s var(--curva) calc(var(--r, 0) * 110ms) both; }
@keyframes revelar { from { opacity: 0; translate: 0 28px; } to { opacity: 1; translate: 0 0; } }

/* ---------- Responsivo ---------- */
@media (max-width: 1080px) {
  .tarjetas { grid-template-columns: repeat(2, 1fr); }
  .cifras__rejilla { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 960px) {
  .nav__enlaces {
    position: fixed; inset: 72px 0 auto 0; flex-direction: column; gap: 4px;
    padding: 16px; background: rgba(10,22,48,.97); backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(255,255,255,.08);
    transform: translateY(-12px); opacity: 0; visibility: hidden; transition: all .3s var(--curva);
  }
  .nav__enlaces.abierto { transform: none; opacity: 1; visibility: visible; }
  .nav__enlaces a { padding: 14px 16px; font-size: 1.05rem; }
  .nav__enlaces .nav__movil-cta { display: flex; margin-top: 8px; color: #fff; }
  .nav__hamburguesa { display: block; }
  .nav__acciones .boton { display: none; }
  .heroe { padding-top: 116px; }
  .heroe__fila { grid-template-columns: 1fr; gap: 40px; }
  .escena { margin: 0 auto; }
  .servicio, .servicio--invertido { grid-template-columns: 1fr; }
  .servicio--invertido .servicio__texto { order: 0; }
  .calculadora { grid-template-columns: 1fr; }
  .contacto__fila { grid-template-columns: 1fr; }
  .extras { grid-template-columns: 1fr; }
  .pasos { grid-template-columns: 1fr; gap: 48px; }
  .pasos::before { display: none; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .contenedor { padding: 0 16px; }
  .nav__ingresar { display: none; }
  .heroe__ctas .boton { width: 100%; }
  .cifras__rejilla, .tarjetas { grid-template-columns: 1fr; }
  .modalidad { grid-template-columns: 1fr; }
  .escena { aspect-ratio: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .escena__cables { display: none; }
  .fuente, .panel, .aviso { position: relative; inset: auto; }
  .fuente { width: auto; padding: 7px 10px 7px 7px; gap: 8px; }
  .fuente small { display: none; }
  .fuente__icono { width: 28px; height: 28px; }
  .fuente__icono svg { width: 16px; height: 16px; }
  .panel { grid-column: 1 / -1; width: 100%; transform: none; }
  .heroe__escena:hover .panel { transform: none; }
  .panel__resumen { padding: 8px; gap: 5px; }
  .panel__resumen div:nth-child(3) { display: none; }
  .panel__resumen { grid-template-columns: 1fr 1fr; }
  .panel__resumen b { font-size: .9rem; }
  .panel__lista li { padding: 6px 4px; }
  .rad { font-size: .62rem; }
  .chip { font-size: .6rem; padding: 2px 7px; }
  .aviso { bottom: auto; grid-column: 1 / -1; width: 92%; margin: -34px auto 0; padding: 10px 12px; font-size: .78rem; }
  .aviso__icono { width: 30px; height: 30px; }
  .cinta li { padding: 0 14px; font-size: .92rem; }
  .cinta li + li { border-left: 0; }
  .archivo { position: relative; right: auto; bottom: auto; grid-column: 1 / -1; width: 100%; margin-top: 10px; }
  .ilus { aspect-ratio: 4 / 4.4; padding: 16px; border-radius: 22px; }
  .linea-tiempo { width: 100%; padding: 12px 10px 6px; }
  .linea-tiempo::before { left: 19px; }
  .lt-item { gap: 10px; font-size: .8rem; }
  .lt-item .chip { display: none; }
  .correo-flotante { top: 4%; right: 4%; }
  .memorial { width: 56%; left: 5%; padding: 12px; }
  .juzgado { width: 34%; right: 4%; }
  .respuesta { width: 56%; right: 4%; }
  .pdf { width: 42%; left: 5%; }
  .chequeo { width: 52%; right: 4%; font-size: .66rem; padding: 10px; gap: 5px; }
  .veredicto { width: 52%; right: 4%; }
  .liq { width: 100%; padding: 16px; }
  .tc-fila { grid-template-columns: 1fr 1fr; }
  .tc-fila > span:first-child { grid-column: 1 / -1; padding-bottom: 4px; font-weight: 700; color: #fff; }
  .tc-fila > span { padding: 12px 14px; font-size: .88rem; }
  .tc-cab > span:first-child { display: none; }
  .deslizador__marcas span:nth-child(2), .deslizador__marcas span:nth-child(4), .deslizador__marcas span:nth-child(5), .deslizador__marcas span:nth-child(7) { display: none; }
  .formulario__dos { grid-template-columns: 1fr; }
  .pie__fila { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .js .revelar { opacity: 1; transform: none; }
  .renglon { width: var(--w); }
  .sello, .respuesta, .chequeo li, .veredicto { opacity: 1; transform: rotate(0); }
  .barras i { height: var(--h); }
  .escaner, .vuelo { display: none; }
  .archivo__progreso i { width: 100%; background: var(--verde); }
  .archivo__ok { background: var(--verde); border-color: var(--verde); }
}
@media (max-width: 440px) {
  .intereses__op { grid-template-columns: 1fr; }
}