/* Fondos alternativos (opción A: velas, opción B: línea). Se cargan después de styles.css */
body.var-a,body.var-b{position:relative;isolation:isolate;
  background:radial-gradient(120% 80% at 50% 0%,#24356B 0%,#1A2856 55%,#121D40 100%) #1A2856}
body.var-a::before,body.var-b::before,body.var-a::after,body.var-b::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none}
/* rejilla tenue */
body.var-a::before,body.var-b::before{
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 45%);mask-image:linear-gradient(to bottom,transparent 0%,#000 45%)}
/* gráfica abajo */
body.var-a::after,body.var-b::after{inset:auto auto 0 50%;width:max(100%,900px);height:27vh;height:27dvh;
  transform:translateX(-50%);background-repeat:no-repeat;background-size:100% 100%}
body.var-a::after{background-image:url("assets/bg-velas.svg")}
body.var-b::after{background-image:url("assets/bg-linea.svg")}
/* velo detrás del contenido para legibilidad */
body.var-a .wrap,body.var-b .wrap{position:relative}
body.var-a .wrap::before,body.var-b .wrap::before{content:"";position:absolute;z-index:-1;inset:10% -10%;
  background:radial-gradient(closest-side,rgba(18,29,64,.75),rgba(18,29,64,0));pointer-events:none}
/* números tipo eje (opción B) */
.eje{position:fixed;right:10px;bottom:0;height:27vh;padding:6px 0;z-index:-1;display:flex;flex-direction:column;justify-content:space-around;
  font-size:.68rem;font-variant-numeric:tabular-nums;color:rgba(207,227,255,.28);text-align:right;pointer-events:none;user-select:none}
@media (min-width:600px){.eje{right:20px;font-size:.75rem}}

/* Opción C: logos de empresas de EE.UU. en blanco y baja opacidad */
body.var-c{position:relative;isolation:isolate;
  background:radial-gradient(120% 80% at 50% 0%,#24356B 0%,#1A2856 55%,#121D40 100%) #1A2856}
body.var-c::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px}
.logos{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.logos img{position:absolute;left:var(--mx);top:var(--my);width:calc(var(--w) * .62);height:auto;max-height:44px;object-fit:contain;
  transform:translate(-50%,-50%) rotate(var(--r));filter:brightness(0) invert(1);opacity:.11}
.logos img.dm{display:none}
body.var-c .wrap{position:relative}
body.var-c .wrap::before{content:"";position:absolute;z-index:-1;inset:8% -12%;
  background:radial-gradient(closest-side,rgba(18,29,64,.85),rgba(18,29,64,0));pointer-events:none}
@media (min-width:900px){
  .logos img,.logos img.dm{display:block;left:var(--x);top:var(--y);width:var(--w);max-height:64px}
}