/* Prosper · web de los fondos Tandem. Colores de marca: navy #0A2463, azul #1A3BCC, claro #E8EEFF. */
:root {
  --fondo: #04071A;
  --fondo-2: #070C24;
  --panel: #0B1230;
  --panel-2: #0F1840;
  --linea: rgba(232, 238, 255, 0.09);
  --linea-fuerte: rgba(232, 238, 255, 0.18);
  --texto: #E8EEFF;
  --texto-2: #A9B4D9;
  --texto-3: #6F7BA6;
  --navy: #0A2463;
  --azul: #1A3BCC;
  --azul-vivo: #4E6DFF;
  --azul-suave: #8FA6FF;
  --claro: #E8EEFF;
  --verde: #2BB673;
  --ambar: #F2A93B;
  --rojo: #E5484D;
  --radio: 20px;
  --fuente: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fuente-titulo: "Inter Tight", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body {
  background: var(--fondo);
  color: var(--texto);
  font-family: var(--fuente);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
b, strong { font-weight: 600; color: var(--texto); }

.contenedor { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 32px; }

/* ---------- Navegación ---------- */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  transition: background .3s, border-color .3s, backdrop-filter .3s;
  border-bottom: 1px solid transparent;
}
.nav.solida { background: rgba(4, 7, 26, 0.82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-color: var(--linea); }
.nav-fila { display: flex; align-items: center; justify-content: space-between; height: 76px; gap: 24px; }
.nav-logo img { width: 140px; height: auto; }
.nav-links { display: flex; gap: 32px; font-size: 14.5px; color: var(--texto-2); }
.nav-links a { transition: color .2s; }
.nav-links a:hover { color: var(--texto); }

/* ---------- Botones ---------- */
.boton {
  display: inline-flex; align-items: center; justify-content: center;
  height: 50px; padding: 0 26px; border-radius: 999px;
  background: var(--claro); color: var(--navy);
  font-weight: 600; font-size: 15px; letter-spacing: -0.01em;
  transition: transform .2s, background .2s, box-shadow .2s;
}
.boton:hover { transform: translateY(-1px); box-shadow: 0 8px 30px rgba(78, 109, 255, 0.35); }
.boton-secundario { background: transparent; color: var(--texto); border: 1px solid var(--linea-fuerte); }
.boton-secundario:hover { background: rgba(232, 238, 255, 0.06); box-shadow: none; }
.boton-chico { height: 40px; padding: 0 20px; font-size: 14px; }

/* ---------- Tipografía ---------- */
.eyebrow {
  font-size: 13px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--azul-suave); margin-bottom: 20px;
}
h1, h2, h3 { font-family: var(--fuente-titulo); font-weight: 600; letter-spacing: -0.035em; line-height: 1.04; }
h1 { font-size: clamp(44px, 7.4vw, 96px); max-width: 15ch; }
.titulo-seccion { font-size: clamp(34px, 4.8vw, 60px); max-width: 20ch; margin-bottom: 64px; }
h3 { font-size: 22px; letter-spacing: -0.02em; line-height: 1.2; }

/* ---------- Hero ---------- */
.hero { position: relative; padding: 200px 0 120px; overflow: hidden; }
.hero-fondo {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(60% 55% at 78% 18%, rgba(26, 59, 204, 0.55), transparent 70%),
    radial-gradient(45% 45% at 10% 90%, rgba(10, 36, 99, 0.9), transparent 70%);
}
.hero-fondo::after {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(var(--linea) 1px, transparent 1px), linear-gradient(90deg, var(--linea) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(70% 60% at 60% 30%, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(70% 60% at 60% 30%, #000 20%, transparent 75%);
}
.hero .contenedor { position: relative; }
.hero-bajada { font-size: clamp(17px, 1.6vw, 20px); color: var(--texto-2); max-width: 56ch; margin: 32px 0 44px; }
.hero-acciones { display: flex; gap: 14px; flex-wrap: wrap; }
.hero-stats {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px;
  margin-top: 110px; background: var(--linea); border: 1px solid var(--linea); border-radius: var(--radio); overflow: hidden;
}
.hero-stat { background: rgba(7, 12, 36, 0.78); backdrop-filter: blur(8px); padding: 32px 36px; display: flex; flex-direction: column; gap: 6px; transition: background .2s; }
.hero-stat:hover { background: rgba(15, 24, 64, 0.85); }
.hero-stat-fondo { font-size: 14px; color: var(--texto-2); display: flex; justify-content: space-between; gap: 12px; }
.hero-stat-fondo span:last-child { color: var(--texto-3); }
.hero-stat-valor { font-family: var(--fuente-titulo); font-size: clamp(40px, 5vw, 64px); font-weight: 600; letter-spacing: -0.04em; line-height: 1.1; }
.hero-stat-etiqueta { font-size: 14px; color: var(--texto-3); }

/* ---------- Secciones ---------- */
.seccion { padding: 140px 0; border-top: 1px solid var(--linea); }

.tarjetas-fondos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.tarjeta-fondo {
  position: relative; display: flex; flex-direction: column; gap: 22px;
  padding: 44px; border-radius: var(--radio); border: 1px solid var(--linea);
  background: linear-gradient(160deg, var(--panel-2), var(--panel) 55%);
  overflow: hidden; transition: border-color .25s, transform .25s;
}
.tarjeta-fondo::before {
  content: ""; position: absolute; width: 380px; height: 380px; right: -140px; top: -160px; border-radius: 50%;
  background: radial-gradient(circle, rgba(78, 109, 255, 0.35), transparent 70%);
}
.tarjeta-fondo:hover { border-color: var(--linea-fuerte); transform: translateY(-3px); }
.tarjeta-fondo > * { position: relative; }
.tarjeta-moneda { font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--azul-suave); }
.tarjeta-fondo h3 { font-size: clamp(30px, 3.2vw, 40px); letter-spacing: -0.035em; }
.tarjeta-fondo p { color: var(--texto-2); }
.tarjeta-datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 16px; padding-top: 22px; border-top: 1px solid var(--linea); margin-top: auto; }
.tarjeta-datos dt { font-size: 13px; color: var(--texto-3); }
.tarjeta-datos dd { font-family: var(--fuente-titulo); font-size: 22px; font-weight: 600; letter-spacing: -0.02em; white-space: nowrap; }
.tarjeta-link { font-size: 15px; font-weight: 500; color: var(--texto); display: inline-flex; gap: 8px; align-items: center; }
.tarjeta-link::after { content: "→"; transition: transform .2s; }
.tarjeta-fondo:hover .tarjeta-link::after { transform: translateX(4px); }

/* ---------- Detalle de fondo ---------- */
.fondo { padding: 140px 0; border-top: 1px solid var(--linea); }
.fondo:nth-child(even) { background: var(--fondo-2); }
.fondo-cabecera { display: grid; grid-template-columns: 1.15fr 1fr; gap: 64px; align-items: end; margin-bottom: 64px; }
.fondo-cabecera h2 { font-size: clamp(40px, 5.6vw, 72px); }
.fondo-subtitulo { font-size: 20px; color: var(--texto-2); margin-top: 14px; }
.fondo-desc { color: var(--texto-2); font-size: 16.5px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.chip { font-size: 13px; padding: 6px 13px; border-radius: 999px; border: 1px solid var(--linea-fuerte); color: var(--texto-2); }

.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--linea); border-radius: var(--radio); overflow: hidden; gap: 1px; background: var(--linea); margin-bottom: 24px; }
.kpi { background: var(--panel); padding: 28px 30px; }
.kpi-etiqueta { font-size: 13.5px; color: var(--texto-3); }
.kpi-valor { font-family: var(--fuente-titulo); font-size: clamp(28px, 2.8vw, 40px); font-weight: 600; letter-spacing: -0.035em; line-height: 1.2; margin-top: 6px; }
.kpi-sub { font-size: 13.5px; color: var(--texto-2); margin-top: 4px; }
.kpi-sub .sube { color: var(--verde); }

.grilla { display: grid; gap: 24px; margin-bottom: 24px; }
.grilla-2-1 { grid-template-columns: 1.7fr 1fr; }
.grilla-1-1 { grid-template-columns: 1fr 1fr; }
.grilla-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.panel { background: var(--panel); border: 1px solid var(--linea); border-radius: var(--radio); padding: 32px; min-width: 0; }
.panel-cabecera { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 26px; flex-wrap: wrap; }
.panel h3 { font-size: 19px; }
.panel-nota { font-size: 13px; color: var(--texto-3); }
.panel-pie { font-size: 12.5px; color: var(--texto-3); margin-top: 18px; line-height: 1.5; }
.destacado { font-family: var(--fuente-titulo); font-size: 15px; font-weight: 600; color: var(--verde); }

/* Gráfico de evolución */
.grafico { position: relative; width: 100%; }
.grafico svg { display: block; width: 100%; overflow: visible; }
.grafico .eje text { fill: var(--texto-3); font-size: 12px; font-family: var(--fuente); }
.grafico .eje line { stroke: var(--linea); }
.grafico .serie { fill: none; stroke: var(--azul-vivo); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.grafico .punto { fill: var(--fondo); stroke: var(--azul-vivo); stroke-width: 2; transition: r .15s; }
.grafico .punto.final { fill: var(--claro); stroke-width: 3; }
.grafico .punto.activo { r: 6.5px; }
.leyenda { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 12px; font-size: 13px; color: var(--texto-2); }
.leyenda span { display: inline-flex; align-items: center; gap: 8px; }
.leyenda i, .tooltip i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.tooltip i { margin-right: 6px; }
.grafico .guia { stroke: var(--linea-fuerte); stroke-dasharray: 3 4; opacity: 0; }
.grafico .guia.activa { opacity: 1; }
.grafico .zona { fill: transparent; cursor: crosshair; }

/* Barras */
.barras { display: flex; flex-direction: column; gap: 22px; }
.barra-fila { display: flex; flex-direction: column; gap: 8px; }
.barra-texto { display: flex; justify-content: space-between; gap: 12px; font-size: 14.5px; }
.barra-texto span:first-child { color: var(--texto-2); }
.barra-texto b { font-family: var(--fuente-titulo); font-size: 16px; white-space: nowrap; }
.barra-pista { height: 10px; border-radius: 999px; background: rgba(232, 238, 255, 0.06); overflow: hidden; }
.barra-relleno { height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--azul), var(--azul-vivo)); transition: width 1.1s cubic-bezier(.2, .8, .2, 1); }
.barra-sub { font-size: 12.5px; color: var(--texto-3); }

.rend-bloque { padding: 20px 0; border-bottom: 1px solid var(--linea); }
.rend-bloque:first-of-type { padding-top: 0; }
.rend-bloque:last-of-type { border-bottom: 0; }
.rend-periodo { font-size: 13.5px; color: var(--texto-3); }
.rend-valores { display: flex; gap: 32px; margin-top: 6px; }
.rend-valores div { display: flex; flex-direction: column; }
.rend-valores b { font-family: var(--fuente-titulo); font-size: 32px; letter-spacing: -0.03em; line-height: 1.15; }
.rend-valores span { font-size: 12.5px; color: var(--texto-3); }

/* Tenencias */
.apilada { display: flex; height: 14px; border-radius: 999px; overflow: hidden; gap: 2px; margin-bottom: 24px; }
.apilada span { height: 100%; transform-origin: left; transform: scaleX(0); transition: transform 1s cubic-bezier(.2, .8, .2, 1); }
.lista-tenencias { list-style: none; display: flex; flex-direction: column; }
.lista-tenencias li { display: grid; grid-template-columns: 12px 1fr auto; gap: 14px; align-items: start; padding: 12px 0; border-bottom: 1px solid var(--linea); }
.lista-tenencias li:last-child { border-bottom: 0; }
.lista-tenencias i { width: 12px; height: 12px; border-radius: 3px; margin-top: 5px; }
.lista-tenencias .t-nombre { font-weight: 500; font-size: 15px; }
.lista-tenencias .t-desc { font-size: 13px; color: var(--texto-3); }
.lista-tenencias .t-pct { font-family: var(--fuente-titulo); font-weight: 600; font-size: 16px; }

/* Rendimiento esperado */
.tiles { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 1px; background: var(--linea); border-radius: 14px; overflow: hidden; }
.tile { background: linear-gradient(160deg, var(--azul), var(--navy)); padding: 22px 14px; text-align: center; }
.tile b { display: block; font-family: var(--fuente-titulo); font-size: clamp(24px, 2.4vw, 32px); letter-spacing: -0.03em; line-height: 1.15; }
.tile span { font-size: 12.5px; color: rgba(232, 238, 255, 0.8); }

/* Perfil de riesgo */
.riesgo-escala { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin: 4px 0 10px; }
.riesgo-escala span { height: 38px; border-radius: 8px; display: grid; place-items: center; font-size: 14px; font-weight: 600; background: rgba(232, 238, 255, 0.05); color: var(--texto-3); border: 1px solid var(--linea); }
.riesgo-escala span.activo { color: #fff; border-color: transparent; }
.riesgo-eje { display: flex; justify-content: space-between; font-size: 12px; color: var(--texto-3); margin-bottom: 16px; }
.riesgo-texto { font-size: 14px; color: var(--texto-2); }

/* Tablas clave-valor */
.kv { width: 100%; border-collapse: collapse; font-size: 14px; }
.kv td { padding: 10px 0; border-bottom: 1px solid var(--linea); vertical-align: top; }
.kv tr:last-child td { border-bottom: 0; }
.kv td:first-child { color: var(--texto-3); padding-right: 16px; }
.kv td:last-child { text-align: right; font-weight: 500; }
.kv td:last-child:not(:first-child) { white-space: nowrap; }
.kv th { font-size: 12px; font-weight: 500; color: var(--texto-3); text-align: right; padding-bottom: 8px; border-bottom: 1px solid var(--linea); }
.kv th:first-child { text-align: left; }
.kv.tres td:nth-child(2) { text-align: right; }

/* Comentario */
.comentario { border: 1px solid var(--linea); border-radius: var(--radio); background: var(--panel); }
.comentario summary { cursor: pointer; list-style: none; padding: 26px 32px; display: flex; justify-content: space-between; align-items: center; font-family: var(--fuente-titulo); font-size: 19px; font-weight: 600; letter-spacing: -0.02em; }
.comentario summary::-webkit-details-marker { display: none; }
.comentario summary::after { content: "+"; font-size: 26px; font-weight: 400; color: var(--texto-2); transition: transform .2s; }
.comentario[open] summary::after { transform: rotate(45deg); }
.comentario-cuerpo { padding: 0 32px 30px; color: var(--texto-2); display: flex; flex-direction: column; gap: 14px; max-width: 90ch; }
.fuente-datos { font-size: 12.5px; color: var(--texto-3); margin-top: 18px; }

/* ---------- Por qué / cómo invertir ---------- */
.pilares { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--linea); border: 1px solid var(--linea); border-radius: var(--radio); overflow: hidden; }
.pilar { background: var(--fondo); padding: 40px 32px 48px; display: flex; flex-direction: column; gap: 14px; }
.pilar-num { font-family: var(--fuente-titulo); font-size: 14px; color: var(--azul-suave); margin-bottom: 48px; }
.pilar p { color: var(--texto-2); font-size: 15px; }

.seccion-invertir { background: radial-gradient(60% 80% at 50% 120%, rgba(26, 59, 204, 0.35), transparent 70%), var(--fondo-2); }
.pasos { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-bottom: 64px; }
.pasos li { padding: 36px; border: 1px solid var(--linea); border-radius: var(--radio); background: rgba(11, 18, 48, 0.6); display: flex; flex-direction: column; gap: 12px; }
.pasos li > span { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--azul); font-weight: 600; margin-bottom: 20px; }
.pasos p { color: var(--texto-2); font-size: 15px; }
.contacto { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding-top: 40px; border-top: 1px solid var(--linea); }
.contacto dt { font-size: 13px; color: var(--texto-3); margin-bottom: 4px; }
.contacto dd { font-size: 17px; font-weight: 500; word-break: break-word; }
.contacto dd a:hover { color: var(--azul-suave); }

/* ---------- Pie ---------- */
.pie { padding: 72px 0 56px; border-top: 1px solid var(--linea); }
.pie-fila { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; margin-bottom: 40px; }
.pie-fila img { width: 120px; }
.pie-actualizacion { font-size: 13px; color: var(--texto-3); }
.legal { font-size: 12px; color: var(--texto-3); line-height: 1.6; display: flex; flex-direction: column; gap: 10px; max-width: 110ch; }
.legal b { color: var(--texto-2); font-weight: 500; }

/* ---------- Tooltip ---------- */
.tooltip {
  position: fixed; z-index: 60; pointer-events: none; opacity: 0; transition: opacity .15s;
  background: rgba(15, 24, 64, 0.96); border: 1px solid var(--linea-fuerte); border-radius: 10px;
  padding: 9px 13px; font-size: 13px; line-height: 1.4; box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4); white-space: nowrap;
}
.tooltip.visible { opacity: 1; }
.tooltip span { color: var(--texto-3); display: block; font-size: 12px; }
.tooltip b { font-family: var(--fuente-titulo); font-size: 15px; }
.tooltip em { font-style: normal; color: var(--texto-3); font-size: 12px; margin-left: 6px; }

/* ---------- Web pública: secciones nuevas ---------- */
.nav-acciones { display: flex; gap: 10px; }
button.boton { border: 0; cursor: pointer; font-family: inherit; }
button.boton-secundario { border: 1px solid var(--linea-fuerte); }
.seccion-alterna { background: var(--fondo-2); }
.seccion-bajada { font-size: 18px; color: var(--texto-2); max-width: 62ch; margin: -32px 0 64px; }

.servicios { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.servicio { display: flex; flex-direction: column; gap: 14px; padding: 32px 28px; border-radius: var(--radio); border: 1px solid var(--linea); background: linear-gradient(170deg, var(--panel-2), var(--panel) 60%); }
.servicio p { color: var(--texto-2); font-size: 15px; flex: 1; }
.servicio-icono { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: rgba(78, 109, 255, .14); border: 1px solid rgba(78, 109, 255, .3); margin-bottom: 18px; }
.servicio-icono svg { width: 24px; height: 24px; fill: none; stroke: var(--azul-suave); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.servicio-producto { font-size: 13px; color: var(--azul-suave); padding-top: 14px; border-top: 1px solid var(--linea); }

.flujo { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--linea-fuerte); }
.flujo li { padding: 32px 28px 0 0; position: relative; display: flex; flex-direction: column; gap: 12px; }
.flujo li::before { content: ""; position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--azul-vivo); box-shadow: 0 0 0 5px rgba(78, 109, 255, .2); }
.flujo-num { font-family: var(--fuente-titulo); font-size: 14px; color: var(--azul-suave); }
.flujo p { color: var(--texto-2); font-size: 15px; }

.fondos-resumen { display: flex; flex-direction: column; gap: 24px; }
.fondo-resumen { border: 1px solid var(--linea); border-radius: var(--radio); background: linear-gradient(160deg, var(--panel-2), var(--panel) 50%); padding: 40px; }
.fondo-resumen-cabecera { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; padding-bottom: 28px; margin-bottom: 28px; border-bottom: 1px solid var(--linea); }
.fondo-resumen-cabecera h3 { font-size: clamp(28px, 3.2vw, 40px); letter-spacing: -0.035em; margin: 10px 0 6px; }
.fondo-resumen-cabecera p { color: var(--texto-2); }
.fondo-resumen-cabecera .chips { margin-top: 0; }
.fondo-resumen-cuerpo { display: grid; grid-template-columns: 1.6fr 1fr; gap: 48px; }
.fondo-resumen-rend { display: flex; flex-direction: column; gap: 22px; }
.rend-linea { display: flex; flex-direction: column; gap: 8px; }
.rend-linea small { font-size: 12px; color: var(--texto-3); font-weight: 500; }
.tarjeta-link { background: none; border: 0; padding: 0; cursor: pointer; font-family: inherit; text-align: left; }
.tarjeta-link:hover::after { transform: translateX(4px); }
.aviso-registro { margin-top: 24px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; padding: 36px 40px; border-radius: var(--radio); background: linear-gradient(120deg, var(--azul), var(--navy)); }
.aviso-registro p { color: rgba(232, 238, 255, .8); max-width: 60ch; margin-top: 6px; }

.estructura { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-bottom: 24px; }
.rol { padding: 28px; border-radius: var(--radio); border: 1px solid var(--linea); background: var(--panel); display: flex; flex-direction: column; gap: 8px; }
.rol span { font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--azul-suave); }
.rol b { font-family: var(--fuente-titulo); font-size: 20px; letter-spacing: -0.02em; line-height: 1.25; }
.rol p { font-size: 14px; color: var(--texto-3); }
#institucional .pilar { background: var(--fondo-2); }

.adelanto { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.adelanto .titulo-seccion { margin-bottom: 32px; }
.lista-check { list-style: none; display: flex; flex-direction: column; gap: 14px; margin-bottom: 40px; color: var(--texto-2); }
.lista-check li { padding-left: 32px; position: relative; }
.lista-check li::before { content: ""; position: absolute; left: 0; top: 4px; width: 18px; height: 18px; border-radius: 50%; background: rgba(78, 109, 255, .2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%238FA6FF' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.maqueta { border-radius: var(--radio); border: 1px solid var(--linea-fuerte); background: linear-gradient(160deg, var(--panel-2), var(--panel)); box-shadow: 0 40px 80px rgba(0, 0, 0, .45), 0 0 0 1px rgba(78, 109, 255, .08); overflow: hidden; }
.maqueta-barra { display: flex; gap: 7px; padding: 14px 18px; border-bottom: 1px solid var(--linea); }
.maqueta-barra span { width: 10px; height: 10px; border-radius: 50%; background: var(--linea-fuerte); }
.maqueta-cuerpo { padding: 28px; display: flex; flex-direction: column; gap: 22px; }
.maqueta-fila { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.maqueta-fila small { display: block; font-size: 12.5px; color: var(--texto-3); }
.maqueta-fila b { font-family: var(--fuente-titulo); font-size: 28px; letter-spacing: -0.03em; }
.maqueta-grafico { width: 100%; height: auto; }
.maqueta-grafico path { fill: none; stroke: var(--azul-vivo); stroke-width: 2.5; }
.maqueta-grafico path.punteada { stroke: var(--texto-3); stroke-dasharray: 5 5; stroke-width: 2; }
.maqueta-lineas { display: flex; flex-direction: column; gap: 10px; }
.maqueta-lineas span { height: 12px; border-radius: 6px; background: rgba(232, 238, 255, .06); }
.maqueta-lineas span:nth-child(2) { width: 80%; }
.maqueta-lineas span:nth-child(3) { width: 60%; }
.sube { color: var(--verde); }
.baja { color: var(--rojo); }

.preguntas-grilla { display: grid; grid-template-columns: 1fr 1.4fr; gap: 64px; }
.preguntas details { border-bottom: 1px solid var(--linea); }
.preguntas summary { cursor: pointer; list-style: none; padding: 24px 40px 24px 0; position: relative; font-family: var(--fuente-titulo); font-size: 19px; font-weight: 600; letter-spacing: -0.015em; }
.preguntas summary::-webkit-details-marker { display: none; }
.preguntas summary::after { content: "+"; position: absolute; right: 4px; top: 20px; font-size: 26px; font-weight: 400; color: var(--texto-2); transition: transform .2s; }
.preguntas details[open] summary::after { transform: rotate(45deg); }
.preguntas p { color: var(--texto-2); padding: 0 40px 24px 0; }

.seccion-final { background: radial-gradient(60% 90% at 50% 120%, rgba(26, 59, 204, .45), transparent 70%), var(--fondo); text-align: center; }
.final .titulo-seccion { margin: 0 auto 40px; }
.final .hero-acciones { justify-content: center; margin-bottom: 72px; }
.final .contacto { text-align: left; }

/* ---------- Ventana de ingreso ---------- */
.modal { position: fixed; inset: 0; z-index: 80; display: none; align-items: center; justify-content: center; padding: 20px; }
.modal.abierto { display: flex; }
.modal-fondo { position: absolute; inset: 0; background: rgba(2, 4, 14, .72); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.modal-caja { position: relative; width: 100%; max-width: 440px; max-height: calc(100vh - 40px); overflow-y: auto; padding: 40px 36px 32px; border-radius: 24px; border: 1px solid var(--linea-fuerte); background: linear-gradient(170deg, var(--panel-2), var(--panel)); box-shadow: 0 40px 100px rgba(0, 0, 0, .6); }
.modal-caja h2 { font-size: 30px; margin: 22px 0 12px; }
.modal-caja p { color: var(--texto-2); font-size: 15px; }
.modal-logo { width: 110px; }
.modal-nota { font-size: 13.5px !important; color: var(--texto-3) !important; margin-top: 10px; }
.modal-cerrar { position: absolute; top: 14px; right: 16px; width: 36px; height: 36px; border-radius: 50%; border: 0; background: rgba(232, 238, 255, .06); color: var(--texto-2); font-size: 22px; cursor: pointer; }
.modal-acciones { margin-top: 28px; display: flex; flex-direction: column; gap: 18px; }
.boton-google { min-height: 44px; }
.form-desarrollo { display: flex; flex-direction: column; gap: 10px; padding-top: 18px; border-top: 1px solid var(--linea); }
.form-desarrollo input { height: 46px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--linea-fuerte); background: rgba(4, 7, 26, .6); color: var(--texto); font: inherit; }
.form-desarrollo input:focus { outline: 2px solid var(--azul-vivo); outline-offset: 1px; }
.modal-ancha { max-width: 780px; }
.modal-ancha h2 { margin: 0 0 22px; }
.modal-ancha .form-grilla { margin-bottom: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.modal-ancha .hero-acciones { margin-top: 18px; }
.campo input[readonly] { opacity: .65; cursor: not-allowed; }
.modal-error { color: var(--rojo) !important; font-size: 14px !important; margin-top: 12px; min-height: 1em; }
body.sin-scroll { overflow: hidden; }

/* ---------- Panel del inversor ---------- */
.pagina-panel { background: var(--fondo); }
.panel-principal { padding: 120px 0 80px; min-height: 80vh; }
.cargando { padding: 80px 0; text-align: center; }
.pestanas { display: flex; gap: 6px; padding: 5px; border-radius: 999px; border: 1px solid var(--linea); background: rgba(11, 18, 48, .6); }
.pestanas a, .selector a { padding: 8px 18px; border-radius: 999px; font-size: 14.5px; color: var(--texto-2); transition: background .2s, color .2s; }
.pestanas a.activa, .selector a.activa { background: var(--claro); color: var(--navy); font-weight: 600; }
.usuario { display: flex; align-items: center; gap: 12px; }
.avatar { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--azul); font-size: 13px; font-weight: 600; object-fit: cover; }
.usuario-datos { display: flex; flex-direction: column; line-height: 1.25; font-size: 14px; }
.usuario-datos small { color: var(--texto-3); font-size: 12px; }
.panel-titulo { margin-bottom: 40px; }
.panel-titulo h1 { font-size: clamp(36px, 5vw, 60px); max-width: none; }
.panel-sub { color: var(--texto-2); margin-top: 14px; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
.subtitulo-panel { font-size: 24px; letter-spacing: -0.02em; margin-bottom: 18px; }
.bloque-moneda { margin-bottom: 48px; }
.bloque-moneda .kpi-valor { font-size: clamp(22px, 2.3vw, 32px); }
/* Inversiones: una tarjeta por tipo de activo con resumen y detalle desplegable */
.tarjeta-activo { margin-bottom: 24px; }
.tarjeta-activo > .panel-cabecera { align-items: center; margin-bottom: 20px; }
.tarjeta-activo > .panel-cabecera h3 { margin-bottom: 2px; }
.tarjeta-activo > .kpis { margin-bottom: 0; }
.boton-desplegar span::after { content: " ▾"; display: inline-block; transition: transform .2s ease; }
.boton-desplegar[aria-expanded="true"] span::after { transform: rotate(180deg); }
.detalle-activo { margin-top: 24px; }
.detalle-activo .grilla { margin-bottom: 0; }
.detalle-activo .panel { background: transparent; }
.estado { display: inline-block; font-size: 12.5px; font-weight: 500; padding: 4px 12px; border-radius: 999px; }
.estado-ok { background: rgba(43, 182, 115, .15); color: var(--verde); }
.estado-pendiente { background: rgba(242, 169, 59, .15); color: var(--ambar); margin-bottom: 16px; }
.aviso-pendiente { max-width: 760px; padding: 40px; }
.aviso-pendiente h3 { font-size: 26px; margin-bottom: 12px; }
.aviso-pendiente p { color: var(--texto-2); margin-bottom: 28px; }
.selector { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 5px; border-radius: 999px; border: 1px solid var(--linea); margin-top: 24px; }
.vista > .panel, .bloque { margin-bottom: 24px; }
.separado { margin-top: 30px; }

.tabla-scroll { overflow-x: auto; margin: 0 -8px; padding: 0 8px; }
.tabla { width: 100%; border-collapse: collapse; font-size: 14px; white-space: nowrap; }
.tabla th { font-size: 12px; font-weight: 500; color: var(--texto-3); text-align: right; padding: 0 0 12px 18px; border-bottom: 1px solid var(--linea); }
.tabla td { padding: 14px 0 14px 18px; border-bottom: 1px solid var(--linea); text-align: right; font-variant-numeric: tabular-nums; vertical-align: top; }
.tabla th:first-child, .tabla td:first-child { text-align: left; padding-left: 0; }
.tabla tbody tr:last-child td { border-bottom: 0; }
.tabla tbody tr:hover td { background: rgba(232, 238, 255, .025); }
.tabla td small { display: block; font-size: 12px; color: var(--texto-3); }
.tabla td small.alerta { color: var(--ambar); }
.tabla a { color: var(--azul-suave); }
.etiqueta-tipo { font-size: 12.5px; padding: 3px 10px; border-radius: 999px; }
.etiqueta-tipo.suscripcion { background: rgba(78, 109, 255, .16); color: var(--azul-suave); }
.etiqueta-tipo.rescate { background: rgba(242, 169, 59, .14); color: var(--ambar); }
.pie-panel { padding: 40px 0; }

/* ---------- Panel de gestión ---------- */
.pagina-panel .panel-principal { padding-top: 160px; }
.barra-pestanas { border-top: 1px solid var(--linea); }
.pestanas-panel { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; height: 50px; align-items: center; }
.pestanas-panel::-webkit-scrollbar { display: none; }
.pestanas-panel a { flex: none; padding: 8px 16px; border-radius: 999px; font-size: 14.5px; color: var(--texto-2); white-space: nowrap; transition: background .2s, color .2s; }
.pestanas-panel a:hover { color: var(--texto); background: rgba(232, 238, 255, .05); }
.pestanas-panel a.activa { background: var(--claro); color: var(--navy); font-weight: 600; }
.sin-margen { margin: 0; }

.acciones-rapidas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 24px; }
.accion { display: flex; align-items: center; gap: 14px; padding: 18px 20px; border-radius: 16px; border: 1px solid var(--linea); background: var(--panel); font-weight: 500; transition: border-color .2s, background .2s; }
.accion:hover { border-color: var(--linea-fuerte); background: var(--panel-2); }
.accion-icono { width: 38px; height: 38px; flex: none; border-radius: 50%; display: grid; place-items: center; background: rgba(78, 109, 255, .16); color: var(--azul-suave); font-size: 18px; font-weight: 600; }

.tarjeta-patrimonio { display: flex; flex-direction: column; gap: 14px; }
.tarjeta-patrimonio .panel-cabecera { margin-bottom: 0; }
.patrimonio-total { font-family: var(--fuente-titulo); font-size: clamp(30px, 3.6vw, 46px); font-weight: 600; letter-spacing: -0.04em; line-height: 1.1; }
.barra-doble { display: flex; gap: 3px; height: 10px; border-radius: 999px; overflow: hidden; }
.barra-doble .b-disp, .patrimonio-partes .p-disp { background: var(--azul-suave); }
.barra-doble .b-inv, .patrimonio-partes .p-inv { background: var(--azul); }
.patrimonio-partes { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.patrimonio-partes a { display: flex; flex-direction: column; gap: 2px; font-size: 13.5px; color: var(--texto-3); }
.patrimonio-partes i { display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 8px; }
.patrimonio-partes b { font-family: var(--fuente-titulo); font-size: 18px; color: var(--texto); }
.kpis-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.kpis-5 .kpi { padding: 24px 22px; }
.kpis-5 .kpi-valor, .bloque-moneda .kpis-5 .kpi-valor { font-size: clamp(20px, 1.8vw, 27px); white-space: nowrap; }
:root { color-scheme: dark; }
.tabla-scroll { scrollbar-color: var(--linea-fuerte) transparent; scrollbar-width: thin; }
.tabla-izquierda th, .tabla-izquierda td { text-align: left; }
.tabla-izquierda th:last-child, .tabla-izquierda td:last-child, .tabla-izquierda .num { text-align: right; }

.lista-movs { list-style: none; }
.lista-movs li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--linea); font-size: 14px; }
.lista-movs li:last-child { border-bottom: 0; }
.lista-movs small { display: block; color: var(--texto-3); font-size: 12.5px; }
.lista-movs span { white-space: nowrap; font-weight: 500; font-variant-numeric: tabular-nums; }

.cuenta-monetaria { display: flex; flex-direction: column; gap: 12px; }
.cuenta-monetaria .panel-cabecera { margin-bottom: 4px; }
.datos-deposito { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; padding: 18px; border-radius: 14px; background: rgba(4, 7, 26, .5); border: 1px solid var(--linea); }
.dato-copiable { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.dato-copiable small, .dato-fila small { display: block; font-size: 12px; color: var(--texto-3); }
.dato-copiable b { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 15px; font-weight: 500; letter-spacing: .02em; word-break: break-all; }
.dato-fila span { font-size: 14px; }
.boton-icono { flex: none; height: 32px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--linea-fuerte); background: transparent; color: var(--texto); font: inherit; font-size: 13px; cursor: pointer; }
.boton-icono:hover { background: rgba(232, 238, 255, .06); }
.boton-texto { background: none; border: 0; padding: 0; color: var(--azul-suave); font: inherit; font-size: 14px; cursor: pointer; }
.boton-texto:hover { text-decoration: underline; }
.acciones-cuenta { margin-top: 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.acciones-cuenta .boton { width: 100%; padding: 0 12px; }

/* Popups de depositar / retirar / invertir */
.modal-op { max-width: 560px; }
.modal-op .panel-sub { margin: -8px 0 18px; }
.modal-op .datos-deposito { margin-top: 0; }
.modal-op [data-op="form"] > h3:not(.titulo-revision) { display: none; }
.modal-op .form-campos { margin-top: 0; }
.campo[hidden] { display: none; }

/* Popup genérico, confirmaciones y acciones de listados */
.popup-acciones { margin-top: 22px; }
.popup-texto { color: var(--texto-2); margin-bottom: 18px; }
.modal-confirmacion { max-width: 500px; }
.campo textarea { padding: 12px 14px; border-radius: 12px; border: 1px solid var(--linea-fuerte); background: rgba(4, 7, 26, .6); color: var(--texto); font: inherit; font-size: 15px; resize: vertical; }
.campo textarea:focus { outline: 2px solid var(--azul-vivo); outline-offset: 1px; }
.boton-peligro { background: var(--rojo); color: #fff; }
.boton-peligro:hover { box-shadow: 0 8px 30px rgba(229, 72, 77, .35); }
.texto-peligro { color: var(--rojo); }
.acciones-fila .boton-texto { margin-left: 14px; }
.acciones-fila .boton-texto:first-child { margin-left: 0; }
.celda-vacia { text-align: left !important; color: var(--texto-3); padding: 22px 0 !important; }
.acciones-cabecera { display: flex; gap: 8px; flex-wrap: wrap; }
.subtitulo-popup { font-size: 17px; margin: 6px 0 12px; }
.subtitulo-popup ~ .subtitulo-popup { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--linea); }
/* Resumen tipo billetera: un bloque por moneda */
.bloque-billetera { margin-bottom: 48px; }
.billetera-cabecera { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.billetera-cabecera h2 { font-size: 26px; letter-spacing: -0.025em; }
.billetera-cabecera b { color: var(--texto); font-family: var(--fuente-titulo); font-size: 17px; margin-left: 6px; }
.billetera-grilla { grid-template-columns: 1fr 1.45fr; margin-bottom: 24px; }
.tarjeta-saldo { display: flex; flex-direction: column; gap: 10px; background: linear-gradient(150deg, var(--azul) 0%, var(--navy) 70%); border-color: rgba(143, 166, 255, .3); }
.tarjeta-saldo .panel-cabecera { margin-bottom: 6px; }
.tarjeta-saldo .kpi-etiqueta { color: rgba(232, 238, 255, .8); }
.tarjeta-saldo .chip { border-color: rgba(232, 238, 255, .3); color: var(--claro); font-size: 12.5px; }
.saldo-nota { font-size: 13.5px; color: rgba(232, 238, 255, .75); }
.tarjeta-saldo .acciones-cuenta { margin-top: auto; padding-top: 14px; }
.tarjeta-saldo .boton-secundario { border-color: rgba(232, 238, 255, .35); }
.inv-principal { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 18px; }
.inv-principal small { display: block; font-size: 12.5px; margin-top: 2px; }
.inv-valor { font-family: var(--fuente-titulo); font-size: clamp(24px, 2.4vw, 32px); font-weight: 600; letter-spacing: -0.03em; line-height: 1.2; margin-top: 4px; white-space: nowrap; }
.inv-metricas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 16px 0; border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.inv-metricas small { display: block; font-size: 12.5px; color: var(--texto-3); }
.inv-metricas b { font-family: var(--fuente-titulo); font-size: 18px; white-space: nowrap; }
.lista-posiciones { list-style: none; }
.lista-posiciones li { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--linea); font-size: 14.5px; }
.lista-posiciones li:last-child { border-bottom: 0; padding-bottom: 0; }
.lista-posiciones li > span:last-child { text-align: right; white-space: nowrap; font-weight: 500; font-variant-numeric: tabular-nums; }
.lista-posiciones small { display: block; font-size: 12.5px; color: var(--texto-3); font-weight: 400; }
.lista-posiciones small.sube { color: var(--verde); }
.lista-posiciones small.baja { color: var(--rojo); }
.lista-posiciones small.alerta { color: var(--ambar); }
@media (max-width: 860px) { .billetera-grilla { grid-template-columns: 1fr; } }

/* Carrusel de saldos (monedas y cripto) */
.carrusel-saldos { margin-bottom: 48px; }
.carrusel { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.carrusel::-webkit-scrollbar { display: none; }
.carrusel > .tarjeta-saldo, .carrusel > .cuenta-monetaria { flex: 0 0 calc((100% - 18px) / 2); scroll-snap-align: start; }
.carrusel > .tarjeta-saldo { min-height: 260px; }
.tarjeta-moneda-nombre { font-family: var(--fuente-titulo); font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
.tarjeta-saldo .patrimonio-total small { font-size: .5em; color: rgba(232, 238, 255, .75); }
.tarjeta-cripto { background: linear-gradient(150deg, #2B4AA8 0%, #0B1230 75%); }
.tarjeta-cripto .acciones-cuenta { grid-template-columns: auto; justify-content: start; }
.tarjeta-saldo .saldo-nota .sube { color: #7BE3AE; }
.carrusel-flechas { display: flex; gap: 8px; }
.carrusel-flechas .boton-icono { width: 38px; height: 38px; padding: 0; font-size: 20px; line-height: 1; }
.carrusel-flechas .boton-icono:disabled { opacity: .35; cursor: default; }
.carrusel-puntos { display: flex; justify-content: center; gap: 8px; margin-top: 16px; }
.carrusel-puntos button { width: 8px; height: 8px; padding: 0; border-radius: 999px; border: 0; background: var(--linea-fuerte); cursor: pointer; transition: width .2s, background .2s; }
.carrusel-puntos button.activo { width: 22px; background: var(--azul-suave); }
@media (max-width: 860px) { .carrusel > .tarjeta-saldo, .carrusel > .cuenta-monetaria { flex-basis: 86%; } }
@media (max-width: 620px) {
  .inv-metricas { grid-template-columns: 1fr 1fr; }
  .inv-principal { grid-template-columns: 1fr; gap: 12px; }
  .billetera-cabecera h2 { font-size: 22px; }
}

button.accion { color: var(--texto); font: inherit; font-weight: 500; cursor: pointer; text-align: left; width: 100%; }
.modal-op .op-detalle { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--linea); }
.modal-op .op-detalle .panel-cabecera { margin-bottom: 10px; }
.modal-op .op-detalle .panel-cabecera h3 { font-size: 15px; color: var(--texto-3); font-weight: 500; letter-spacing: 0; }
.modal-op .hero-acciones .boton { flex: 1; }
.sin-cuenta { padding: 18px; border-radius: 14px; border: 1px dashed var(--linea-fuerte); }
.sin-cuenta a, .alerta-texto a { color: var(--azul-suave); text-decoration: underline; }
.acciones-fila { white-space: nowrap; }
.acciones-fila a { color: var(--azul-suave); margin-left: 14px; }
.celda-detalle { white-space: normal !important; min-width: 200px; max-width: 360px; text-align: left !important; }
.etiqueta-cuenta { font-size: 12px; padding: 3px 10px; border-radius: 999px; background: rgba(232, 238, 255, .06); color: var(--texto-2); }
.etiqueta-cuenta.c-monetaria { background: rgba(143, 166, 255, .14); color: var(--azul-suave); }
.etiqueta-cuenta.c-inversión { background: rgba(43, 182, 115, .13); color: var(--verde); }
.etiqueta-cuenta.c-solicitud { background: rgba(242, 169, 59, .13); color: var(--ambar); }
.estado-confirmada { background: rgba(78, 109, 255, .16); color: var(--azul-suave); }
.estado-rechazada { background: rgba(229, 72, 77, .14); color: var(--rojo); }
.estado-cancelada, .estado-anulada { background: rgba(232, 238, 255, .06); color: var(--texto-3); }
.tabla .estado-pendiente { margin-bottom: 0; }

/* Formularios */
.filtros, .form-grilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; align-items: end; margin-bottom: 20px; }
.filtros-movs { margin-bottom: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.filtros-pie { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.campo { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--texto-3); min-width: 0; }
.campo-ancho { grid-column: span 2; }
.campo input, .campo select, .input-motivo, .tabla select {
  height: 44px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--linea-fuerte); background: rgba(4, 7, 26, .6);
  color: var(--texto); font: inherit; font-size: 15px; width: 100%; min-width: 0;
}
.tabla select { height: 36px; font-size: 14px; min-width: 180px; }
.campo select option, .tabla select option { background: var(--panel); }
.campo input:focus, .campo select:focus, .input-motivo:focus { outline: 2px solid var(--azul-vivo); outline-offset: 1px; }
.campo input:disabled { opacity: .6; }
.campo-importe { position: relative; }
.campo-importe input { font-family: var(--fuente-titulo); font-size: 22px; height: 56px; padding-right: 150px; }
.campo-importe .boton-texto { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 13px; }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--texto-2); cursor: pointer; }
.check input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--azul-vivo); flex: none; }
.form-campos { display: flex; flex-direction: column; gap: 18px; margin: 20px 0 24px; }
.segmentado { display: inline-flex; padding: 5px; gap: 4px; border-radius: 999px; border: 1px solid var(--linea); background: var(--panel); margin-bottom: 24px; }
.segmentado button { border: 0; background: none; color: var(--texto-2); font: inherit; font-size: 15px; padding: 10px 22px; border-radius: 999px; cursor: pointer; }
.segmentado button.activa { background: var(--claro); color: var(--navy); font-weight: 600; }
.grilla-operar { grid-template-columns: 1.2fr 1fr; }
.resumen-confirmacion { margin: 18px 0 22px; }
.resumen-confirmacion td:last-child { font-size: 16px; }
#form-op .check { margin-bottom: 22px; }
.alerta-texto { margin-top: 14px; font-size: 14px; color: var(--ambar); }
.kv small { color: var(--texto-3); font-weight: 400; }
.solicitud { margin-bottom: 18px; }
.solicitud .panel-sub { margin: -10px 0 18px; }
.input-motivo { width: auto; flex: 1; min-width: 180px; height: 40px; }
.solicitud .hero-acciones { align-items: center; }
.acciones-fondo { margin-top: 24px; }

.aviso-flotante { position: fixed; left: 50%; bottom: 28px; z-index: 90; transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
  max-width: min(560px, calc(100vw - 32px)); padding: 14px 20px; border-radius: 14px; background: var(--panel-2); border: 1px solid var(--linea-fuerte);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .5); font-size: 14.5px; transition: opacity .25s, transform .25s; }
.aviso-flotante.visible { opacity: 1; transform: translate(-50%, 0); }
.aviso-flotante.ok { border-color: rgba(43, 182, 115, .5); }
.aviso-flotante.error { border-color: rgba(229, 72, 77, .6); }

@media (max-width: 1080px) {
  .kpis-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grilla-operar { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .pagina-panel .panel-principal { padding-top: 136px; }
  .acciones-rapidas { grid-template-columns: 1fr 1fr; gap: 10px; }
  .accion { padding: 14px; gap: 10px; font-size: 14.5px; }
  .accion-icono { width: 32px; height: 32px; font-size: 16px; }
  .kpis-5 { grid-template-columns: 1fr; }
  .campo-ancho { grid-column: auto; }
  .segmentado { display: flex; }
  .segmentado button { flex: 1; padding: 10px 8px; }
  .campo-importe input { padding-right: 120px; font-size: 19px; }
  .patrimonio-partes b { font-size: 16px; }
  .pestanas-panel { height: 46px; }
  .dato-copiable b { font-size: 13px; letter-spacing: 0; }
  .datos-deposito { padding: 14px; }
  .pestanas-panel a { padding: 7px 13px; font-size: 13.5px; }
}

/* ---------- Animación de entrada ---------- */
.revelar { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s cubic-bezier(.2, .8, .2, 1); }
.revelar.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .revelar, .barra-relleno, .apilada span { transition: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .nav-links { gap: 22px; }
  .servicios, .estructura { grid-template-columns: 1fr 1fr; }
  .flujo { grid-template-columns: 1fr 1fr; row-gap: 40px; }
  .usuario-datos { display: none; }
  .grilla-3 { grid-template-columns: 1fr 1fr; }
  .grilla-3 > :last-child { grid-column: 1 / -1; }
  .pilares { grid-template-columns: 1fr 1fr; }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .nav-links { display: none; }
  .fondo-cabecera, .grilla-2-1, .grilla-1-1, .tarjetas-fondos { grid-template-columns: 1fr; }
  .fondo-cabecera { gap: 24px; }
  .pasos, .contacto { grid-template-columns: 1fr; }
  .fondo-resumen-cuerpo, .adelanto, .preguntas-grilla { grid-template-columns: 1fr; gap: 36px; }
  .preguntas-grilla .titulo-seccion { margin-bottom: 0; }
}
@media (max-width: 620px) {
  .contenedor { padding: 0 20px; }
  .nav-fila { height: 64px; }
  .nav-logo img { width: 116px; }
  .hero { padding: 140px 0 72px; }
  .hero-stats { grid-template-columns: 1fr; margin-top: 64px; }
  .hero-stat { padding: 24px; }
  .seccion, .fondo { padding: 88px 0; }
  .titulo-seccion { margin-bottom: 40px; }
  .tarjeta-fondo { padding: 28px; }
  .tarjeta-datos dd { font-size: 18px; }
  .grilla-3 { grid-template-columns: 1fr; }
  .pilares { grid-template-columns: 1fr; }
  .pilar-num { margin-bottom: 16px; }
  .kpi { padding: 20px; }
  .panel { padding: 22px; }
  .rend-valores { gap: 24px; }
  .rend-valores b { font-size: 26px; }
  .pasos li { padding: 26px; }
  .comentario summary { padding: 22px; }
  .comentario-cuerpo { padding: 0 22px 24px; }
  .solo-escritorio { display: none; }
  .servicios, .estructura, .flujo { grid-template-columns: 1fr; }
  .seccion-bajada { margin: -16px 0 40px; font-size: 16.5px; }
  .fondo-resumen { padding: 24px; }
  .aviso-registro { padding: 28px 24px; }
  .modal-caja { padding: 36px 24px 26px; }
  .panel-principal { padding-top: 96px; }
  .nav-fila { gap: 10px; }
  .pestanas { padding: 4px; gap: 2px; }
  .pestanas a { padding: 7px 12px; font-size: 13.5px; white-space: nowrap; }
  .pagina-panel .nav-logo img { width: 92px; }
  .usuario .avatar { display: none; }
  .usuario .boton-chico { padding: 0 14px; height: 36px; }
  .aviso-pendiente { padding: 26px; }
  .bloque-moneda .kpis { grid-template-columns: 1fr; }
  .bloque-moneda .kpi { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; padding: 18px 20px; }
  .bloque-moneda .kpi-valor { font-size: 22px; margin-top: 0; }
  .bloque-moneda .kpi-sub { width: 100%; margin-top: 0; }
}