/* JESA Investments — sistema compartido por todas las páginas.
   Un solo archivo para que cada página cargue el mismo look institucional sin
   duplicar cientos de líneas de CSS por archivo. */

:root{
  --tinta:#0C1B32; --tinta2:#3D4A62; --tenue:#68738A;
  --papel:#F6F7FA; --tarjeta:#FFFFFF; --linea:#E1E5EC; --linea-fuerte:#C7CEDA;
  /* Azul marino claramente azul, no casi-negro: un navy demasiado oscuro se percibe como
     negro plano en pantalla y pierde la señal de "azul institucional" que se buscaba. */
  --marca:#1C3A63; --marca-tinta:#EEF1F6; --marca-tenue:#A6B7D1; --marca-linea:#2F5182;
  --oro:#8C6A28; --oro-claro:#C7A24E; --oro-suave:#F6F0DF;
  --si:#0F5C46; --no:#7A2A28;
  --sombra:rgba(12,27,50,.08);
  --sans:"Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --serif:Georgia,"Times New Roman",serif;
  --mono:"Consolas",ui-monospace,"SF Mono",Menlo,monospace;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --tinta:#E7EAF0; --tinta2:#AEB7C6; --tenue:#7C8698;
    --papel:#0A0E16; --tarjeta:#121620; --linea:#232A38; --linea-fuerte:#333C4E;
    --marca:#070B12; --marca-tinta:#E7EAF0; --marca-tenue:#8891A3; --marca-linea:#1C2431;
    --oro:#D9B36A; --oro-claro:#E8C787; --oro-suave:#1B160E;
    --si:#48B090; --no:#DB7B75; --sombra:rgba(0,0,0,.45);
  }
}
:root[data-theme="dark"]{
  --tinta:#E7EAF0; --tinta2:#AEB7C6; --tenue:#7C8698;
  --papel:#0A0E16; --tarjeta:#121620; --linea:#232A38; --linea-fuerte:#333C4E;
  --marca:#070B12; --marca-tinta:#E7EAF0; --marca-tenue:#8891A3; --marca-linea:#1C2431;
  --oro:#D9B36A; --oro-claro:#E8C787; --oro-suave:#1B160E;
  --si:#48B090; --no:#DB7B75; --sombra:rgba(0,0,0,.45);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--papel);color:var(--tinta);font-family:var(--sans);
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;
}
.env{max-width:64rem;margin:0 auto;padding:0 1.6rem}
h1,h2,h3{text-wrap:balance}
p{margin:0 0 1.05rem;max-width:62ch}
a{color:inherit}
strong{font-weight:650;color:var(--tinta)}
.tenue{color:var(--tenue)}
.ojo{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--oro);font-weight:700;margin:0 0 .85rem;display:flex;align-items:center;gap:.7rem;
}
.ojo::before{content:"";width:1.7rem;height:2px;background:var(--oro);flex:none}

/* ---------- barra superior + navegación ---------- */
.barra{background:var(--marca);color:var(--marca-tinta);border-bottom:2px solid var(--oro)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.05rem 0}
.marca-nombre{
  font-family:var(--serif);font-weight:700;font-size:1.28rem;letter-spacing:-.01em;
  color:var(--marca-tinta);text-decoration:none;
}
.marca-nombre b{color:var(--oro-claro)}
.marca-eslogan{
  font-family:var(--mono);font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--marca-tenue);display:block;margin-top:.15rem;
}
.enlaces{display:flex;align-items:center;gap:1.4rem;list-style:none;margin:0;padding:0}
.enlaces a{
  font-size:.87rem;font-weight:600;color:var(--marca-tenue);text-decoration:none;
  padding:.3rem 0;border-bottom:2px solid transparent;transition:color .12s,border-color .12s;
}
.enlaces a:hover{color:var(--marca-tinta)}
.enlaces a[aria-current="page"]{color:var(--marca-tinta);border-color:var(--oro)}
.enlaces .cta{
  background:var(--oro);color:#1B140A;padding:.55rem 1.05rem;border:0;font-weight:700;
  border-bottom:0;
}
.enlaces .cta:hover{background:var(--oro-claro);color:#1B140A}
.nav-alterna{display:none;background:transparent;border:1px solid var(--marca-linea);
  color:var(--marca-tinta);width:2.4rem;height:2.4rem;font-size:1.1rem;cursor:pointer}
@media (max-width:58rem){
  .enlaces{
    display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;
    align-items:stretch;gap:0;background:var(--marca);border-top:1px solid var(--marca-linea);
    border-bottom:2px solid var(--oro);padding:.4rem 1.6rem 1rem;
  }
  .enlaces.abierta{display:flex}
  .enlaces a{padding:.85rem 0;border-bottom:1px solid var(--marca-linea)}
  .enlaces .cta{text-align:center;margin-top:.7rem;border:0}
  .nav-alterna{display:block}
  .barra{position:relative}
}

/* ---------- portada (encabezado grande, solo Inicio) ---------- */
.portada{background:var(--marca);color:var(--marca-tinta);padding:4.4rem 0 4.2rem}
.portada .marca-linea{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.19em;text-transform:uppercase;
  color:var(--oro-claro);font-weight:700;margin-bottom:1.4rem;
}
.portada h1{
  font-family:var(--serif);font-size:clamp(2.35rem,5vw,3.4rem);line-height:1.08;
  font-weight:700;margin:0 0 1.25rem;letter-spacing:-.016em;
}
.portada p{color:var(--marca-tenue);font-size:1.1rem;max-width:56ch;margin:0}
.portada .cta-fila{margin-top:2.1rem;display:flex;gap:.9rem;flex-wrap:wrap}

/* ---------- título simple (subpáginas) ---------- */
.titulo{background:var(--marca);color:var(--marca-tinta);padding:3rem 0 2.6rem}
.titulo .ojo2{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--oro-claro);font-weight:700;margin-bottom:1rem;
}
.titulo h1{font-family:var(--serif);font-size:clamp(1.9rem,4vw,2.5rem);line-height:1.12;
  font-weight:700;margin:0 0 .7rem;letter-spacing:-.014em}
.titulo p{color:var(--marca-tenue);font-size:1.02rem;max-width:58ch;margin:0}

/* ---------- botones ---------- */
.boton{
  display:inline-block;background:var(--oro);color:#1B140A;text-decoration:none;
  font-family:var(--sans);font-weight:700;font-size:.95rem;padding:.85rem 1.55rem;border:0;
  text-align:center;
}
.boton:hover{background:var(--oro-claro)}
.boton.fantasma{
  background:transparent;color:var(--marca-tinta);border:1px solid var(--marca-linea);
  padding:.83rem 1.5rem;
}
.boton.fantasma:hover{border-color:var(--oro-claro);color:var(--oro-claro)}
.boton.oscuro{background:var(--marca);color:var(--marca-tinta);border:1px solid var(--marca)}
.boton.oscuro:hover{background:var(--marca-linea)}

/* ---------- secciones de contenido ---------- */
main{display:block}
section{padding:3.6rem 0;border-top:1px solid var(--linea)}
section:first-of-type{border-top:0}
h2{
  font-family:var(--serif);font-size:1.85rem;line-height:1.16;font-weight:700;
  margin:0 0 .5rem;letter-spacing:-.01em;
}
h3{font-family:var(--sans);font-size:1.04rem;font-weight:650;margin:0 0 .35rem;line-height:1.35}
.entrada{font-size:1.08rem;color:var(--tinta2);max-width:60ch;margin-bottom:2.1rem}

/* ---------- planes ---------- */
.planes{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:1.3rem;margin:2.1rem 0 1.6rem}
.plan{
  background:var(--tarjeta);border:1px solid var(--linea);border-top:3px solid var(--linea-fuerte);
  padding:1.9rem 1.7rem 1.7rem;display:flex;flex-direction:column;
}
.plan.elegido{border-color:var(--oro);border-top:3px solid var(--oro);background:var(--oro-suave)}
.plan .nombre{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--tenue);font-weight:700;margin-bottom:1rem;
}
.plan.elegido .nombre{color:var(--oro)}
.plan .cifra{display:flex;align-items:baseline;gap:.55rem;margin-bottom:.5rem}
.plan .cifra b{font-family:var(--serif);font-size:3.05rem;line-height:1;font-weight:700;letter-spacing:-.02em}
.plan .cifra span{font-size:.92rem;color:var(--tenue)}
.plan .mes{font-family:var(--mono);font-size:.95rem;color:var(--tinta2);margin-bottom:1.2rem}
.plan .nota{font-size:.93rem;color:var(--tinta2);margin:0;line-height:1.5}
.etiqueta{
  align-self:flex-start;background:var(--oro);color:#1B140A;font-family:var(--mono);
  font-size:.74rem;font-weight:700;letter-spacing:.1em;padding:.34rem .72rem;margin-bottom:1.1rem;
}
.cuenta{
  background:var(--tarjeta);border:1px solid var(--linea);border-left:3px solid var(--oro);
  padding:1.15rem 1.4rem;font-family:var(--mono);font-size:.95rem;color:var(--tinta2);line-height:1.75;
}
.cuenta b{color:var(--tinta);font-weight:700}

/* ---------- listas ---------- */
.lista{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.85rem}
.lista li{padding-left:1.5rem;position:relative;color:var(--tinta2);max-width:60ch}
.lista li::before{content:"—";position:absolute;left:0;color:var(--oro);font-weight:700}
.par{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));gap:1.3rem;margin-top:2rem}
.caja{background:var(--tarjeta);border:1px solid var(--linea);padding:1.6rem 1.55rem}
.caja.si{border-top:3px solid var(--si)}
.caja.no{border-top:3px solid var(--no)}
.caja .rot{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;margin-bottom:1.1rem;
}
.caja.si .rot{color:var(--si)}
.caja.no .rot{color:var(--no)}

/* ---------- pasos numerados ---------- */
.pasos{list-style:none;padding:0;margin:2rem 0 0;counter-reset:p}
.pasos li{
  counter-increment:p;display:grid;grid-template-columns:3.4rem 1fr;gap:1.4rem;
  padding:1.35rem 0;border-top:1px solid var(--linea);
}
.pasos li:last-child{border-bottom:1px solid var(--linea)}
.pasos li::before{
  content:counter(p,decimal-leading-zero);font-family:var(--mono);font-size:1.05rem;
  font-weight:700;color:var(--oro);padding-top:.14rem;
}
.pasos p{margin:0;color:var(--tinta2);font-size:.99rem}
.cuando{
  font-family:var(--mono);font-size:.75rem;color:var(--tenue);text-transform:uppercase;
  letter-spacing:.09em;margin-top:.4rem;display:block;
}

/* pasos en tarjeta, para paginas cortas (Suscribirme) */
.pasos-tarjeta{list-style:none;padding:0;margin:0;counter-reset:p;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media(max-width:44rem){.pasos-tarjeta{grid-template-columns:1fr}}
.pasos-tarjeta li{counter-increment:p;background:var(--tarjeta);border:1px solid var(--linea);
  border-top:3px solid var(--oro);padding:1.2rem 1.15rem}
.pasos-tarjeta li::before{content:counter(p,decimal-leading-zero);font-family:var(--mono);
  font-size:.85rem;font-weight:700;color:var(--oro);display:block;margin-bottom:.5rem}
.pasos-tarjeta p{margin:0;color:var(--tinta2);font-size:.9rem;line-height:1.55}

/* ---------- canales ---------- */
.canales{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.2rem;margin-top:2rem}
.canal{background:var(--tarjeta);border:1px solid var(--linea);border-top:3px solid var(--oro);padding:1.55rem 1.45rem}
.canal .n{font-family:var(--serif);font-size:1.9rem;font-weight:700;color:var(--oro);line-height:1;margin-bottom:.6rem}
.canal .rol{font-family:var(--mono);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--tenue);font-weight:700;margin-bottom:.5rem}
.canal p{font-size:.95rem;color:var(--tinta2);margin:0;line-height:1.55}

/* ---------- tabla ---------- */
.tw{overflow-x:auto;margin-top:2rem;border:1px solid var(--linea);background:var(--tarjeta)}
table{border-collapse:collapse;width:100%;min-width:34rem;font-size:.97rem}
th,td{padding:.82rem 1.1rem;text-align:left;border-bottom:1px solid var(--linea)}
th{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--tenue);font-weight:700;background:var(--papel);
}
td:not(:first-child){font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;color:var(--tinta2)}
th:not(:first-child){text-align:right}
tr:last-child td{border-bottom:0}
tr.marcada td{background:var(--oro-suave);color:var(--tinta);font-weight:650}
tr.marcada td:not(:first-child){color:var(--oro)}

/* ---------- cifras grandes (Resultados) ---------- */
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1.2rem;margin:2rem 0}
.cifra-grande{background:var(--tarjeta);border:1px solid var(--linea);border-top:3px solid var(--oro);
  padding:1.5rem 1.4rem}
.cifra-grande .rot{font-family:var(--mono);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--tenue);font-weight:700;margin-bottom:.7rem}
.cifra-grande .valor{font-family:var(--serif);font-size:2.5rem;font-weight:700;line-height:1;
  letter-spacing:-.02em;margin-bottom:.5rem}
.cifra-grande .valor.si{color:var(--si)}
.cifra-grande .comp{font-family:var(--mono);font-size:.85rem;color:var(--tinta2)}
.cifra-grande .comp b{color:var(--tinta)}

/* ---------- grafico ---------- */
.grafico-caja{background:var(--tarjeta);border:1px solid var(--linea);padding:1.6rem 1.6rem 1.2rem;margin-top:2rem}
.grafico-caja svg{width:100%;height:auto;display:block}
.grafico-leyenda{display:flex;gap:1.6rem;flex-wrap:wrap;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--linea)}
.grafico-leyenda span{display:inline-flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--tinta2)}
.grafico-leyenda i{width:1.1rem;height:3px;display:inline-block;flex:none}
.grafico-nota{font-family:var(--mono);font-size:.72rem;color:var(--tenue);margin-top:.6rem}

/* ---------- aviso ---------- */
.aviso{background:var(--oro-suave);border:1px solid var(--oro);padding:1.7rem 1.75rem;margin-top:2rem}
.aviso .titulo2{font-family:var(--serif);font-size:1.5rem;font-weight:700;margin:0 0 .5rem;color:var(--tinta)}
.aviso p{margin:0;color:var(--tinta2);font-size:1rem}

/* ---------- faq ---------- */
.faq{margin-top:2rem;border-top:1px solid var(--linea)}
details{border-bottom:1px solid var(--linea)}
summary{padding:1.15rem 2.2rem 1.15rem 0;cursor:pointer;font-weight:600;position:relative;list-style:none;line-height:1.4}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:.3rem;top:1.02rem;font-family:var(--mono);font-size:1.25rem;color:var(--oro);font-weight:700}
details[open] summary::after{content:"\2212"}
summary:focus-visible{outline:2px solid var(--oro);outline-offset:3px}
details p{padding:0 0 1.25rem;color:var(--tinta2);margin:0 0 .8rem;font-size:.99rem}
details p:last-child{margin-bottom:0}

/* ---------- tarjetas simples (metodologia / quienes somos) ---------- */
.tarjetas{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.2rem;margin-top:1.8rem}
.tarjeta{background:var(--tarjeta);border:1px solid var(--linea);padding:1.5rem 1.4rem}
.tarjeta .rot{font-family:var(--mono);font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--oro);font-weight:700;margin-bottom:.7rem}
.tarjeta p{margin:0;font-size:.95rem;color:var(--tinta2);line-height:1.6}

/* ---------- pie ---------- */
footer{background:var(--marca);color:var(--marca-tenue);padding:3.2rem 0 2.6rem}
footer .fila-pie{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2rem;padding-bottom:2.2rem;border-bottom:1px solid var(--marca-linea);margin-bottom:2.2rem}
footer .marca-pie{font-family:var(--serif);font-size:1.1rem;font-weight:700;color:var(--marca-tinta)}
footer .marca-pie b{color:var(--oro-claro)}
footer nav ul{list-style:none;margin:0;padding:0;display:flex;gap:1.6rem;flex-wrap:wrap}
footer nav a{color:var(--marca-tenue);text-decoration:none;font-size:.86rem;font-weight:600}
footer nav a:hover{color:var(--marca-tinta)}
footer .rot{font-family:var(--mono);font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;color:var(--oro-claro);font-weight:700;margin-bottom:1.3rem}
footer p{max-width:78ch;margin:0 0 1rem;font-size:.83rem;line-height:1.72}
footer b{color:#C9CED6;font-weight:700}