/* Servidores IA · v4 (oct-2026). Sólo lo propio de esta página; el resto sale de
   estilo-v4.css. Sólo oscuro; la piel común va en v4-web.css. */

/* ── Hero: la GPU a la derecha (el render se voltea) ─ */
.ia-hero .hero-ft{transform:scaleX(-1);object-position:30% 45%}
.ia-hero .ia-nv{position:absolute;right:var(--pad);bottom:28px;display:inline-flex;align-items:center;gap:10px;font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-3)}
.ia-nv i,.ia-lista-cab .nv i{width:18px;height:18px;background:currentColor;-webkit-mask:url("/assets/img/v2/servidores-ia/nvidia.svg") center/contain no-repeat;mask:url("/assets/img/v2/servidores-ia/nvidia.svg") center/contain no-repeat}

/* ── 02 · Modelos: rejilla de 1 px ───────────────── */
.ia-modelos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--linea);border:1px solid var(--linea)}
.ia-mod{position:relative;background:var(--fondo);padding:28px;display:flex;flex-direction:column;min-height:330px;overflow:hidden;isolation:isolate;transition:background .25s}
.ia-mod:hover{background:var(--fondo-2)}
.ia-mod>*{position:relative;z-index:1}
.ia-mod .top{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:26px}
.ia-mod .badge{font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding:6px 8px;border:1px solid currentColor;color:var(--tinta)}  /* la misma etiqueta que «más elegido» de los planes */
.ia-mod .logo-m{display:block;width:44px;height:44px;margin-top:40px;color:var(--tinta)}
.ia-mod .logo-m i{display:block;width:100%;height:100%;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.ia-mod .logo-m svg{width:100%;height:100%}
.ia-mod h3{font:500 clamp(24px,2.3vw,32px)/1.05 var(--disp);letter-spacing:-.035em;margin-top:26px}
.ia-mod p{margin-top:10px;color:var(--tinta-2);font-size:15px;max-width:34ch}
.ia-mod .pie-m{margin-top:auto;padding-top:22px;display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;border-top:1px solid var(--linea);transition:border-color .2s}
.ia-mod>p{margin-bottom:26px}
.ia-mod .pie-m .v{font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3)}
.ia-mod .pie-m .p{font-size:14px;color:var(--tinta-2)}
.ia-mod .pie-m .p b{font-weight:500;color:var(--tinta);font-size:17px;letter-spacing:-.02em}
.ia-mod .pie-m:hover{border-color:var(--tinta-2)}
.ia-nota{margin-top:18px;font-size:14px;color:var(--tinta-3)}

/* ── 03 · Catálogo en vivo ───────────────────────── */
.ia-filtros{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:22px}
.ia-buscar{flex:1 1 280px;min-width:0;display:flex;align-items:center;gap:12px;height:46px;padding:0 16px;border:1px solid var(--linea-2);background:var(--fondo-2);color:var(--tinta-3);transition:border-color .2s}
.ia-buscar:focus-within{border-color:var(--tinta)}
.ia-buscar svg{width:17px;height:17px;flex:none}
.ia-buscar input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--tinta);font:400 15px/1 var(--disp);outline:none}
.ia-buscar input::placeholder{color:var(--tinta-3)}
.gpu-chips{display:flex;flex-wrap:wrap;gap:8px}
.gpu-chip{height:46px;padding:0 15px;border:1px solid var(--linea-2);background:transparent;font-size:14px;color:var(--tinta-2);cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:color .2s,border-color .2s}
.gpu-chip:hover{color:var(--tinta);border-color:var(--tinta-3)}
.gpu-chip.act{background:var(--inv);color:var(--inv-t);border-color:var(--inv)}
.gpu-chip .n{font:500 11px/1 var(--mono);opacity:.6}

.ia-lista{border:1px solid var(--linea)}
.ia-lista-cab{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 22px;border-bottom:1px solid var(--linea);font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3)}
.ia-lista-cab b{color:var(--tinta);font-weight:500}
.ia-cols{display:none}
.ia-lista-cab .nv{display:inline-flex;align-items:center;gap:10px}
.gfila{display:grid;grid-template-columns:44px minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr) auto;gap:20px;align-items:center;padding:20px 22px;border-bottom:1px solid var(--linea);position:relative;transition:background .2s}
.gfila:hover{background:var(--fondo-2)}
.gfila>*{position:relative;z-index:1}
.gpu-rejilla .gfila:last-child{border-bottom:0}
.gfila .gi{font:500 11px/1 var(--mono);letter-spacing:.1em;color:var(--tinta-3)}
.gfila h3{font:500 21px/1.1 var(--disp);letter-spacing:-.025em}
.gfila .desc{margin-top:6px;font:400 12px/1.4 var(--mono);color:var(--tinta-3)}
.gfila .gv b{display:block;font:500 20px/1 var(--disp);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.barra-v{display:block;margin-top:10px;height:3px;background:var(--linea-2);position:relative;max-width:180px}
.barra-v i{position:absolute;inset:0 auto 0 0;width:var(--v);background:var(--tinta);transform-origin:left;transform:scaleX(0);transition:transform 1.1s cubic-bezier(.2,.7,.2,1) .2s}
.gfila.dentro .barra-v i{transform:none}
.gfila{opacity:0;transform:translateY(10px);transition:opacity .6s,transform .6s,background .2s}
.gfila.dentro,html:not(.js) .gfila{opacity:1;transform:none}
.gfila .gp span{display:block;font-size:15px}
.gfila .gp small{display:block;margin-top:5px;font:500 10.5px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--tinta-3)}
.gfila .gprecio{text-align:right}
.gfila .gprecio b{display:block;font:500 24px/1 var(--disp);letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.gfila .gprecio small{display:block;margin-top:6px;font-size:12.5px;color:var(--tinta-3);white-space:nowrap}
.gfila .btn{justify-self:end}
.gpu-tarjeta.oculta,.oculta{display:none}
.gpu-sin-resultados{text-align:center;color:var(--tinta-3);padding:36px 16px;border-top:1px solid var(--linea)}
.gpu-sin-resultados a{color:var(--tinta);text-decoration:underline;text-underline-offset:3px}

.ia-vacio{border:1px solid var(--linea);text-align:center;padding:64px 24px;display:flex;flex-direction:column;align-items:center}
.ia-vacio .ic{width:54px;height:54px;display:grid;place-items:center;border:1px solid var(--linea-2);background:var(--fondo);margin-bottom:22px}
.ia-vacio .ic svg{width:26px;height:26px}
.ia-vacio h3{font:500 clamp(24px,2.6vw,34px)/1.1 var(--disp);letter-spacing:-.03em;margin-top:16px}
.ia-vacio p{margin:12px auto 26px;color:var(--tinta-2);max-width:44ch}

/* Enterprise */
.ia-ent{margin-top:clamp(56px,7vw,88px)}
.ia-ent .gran{min-height:600px}
.ia-ent .gran img{object-position:50% 50%}
.ia-ent-l{list-style:none;padding:0;margin:22px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:10px 34px;font-size:15px;color:rgba(242,242,242,.82)}
.ia-ent-l li{display:flex;gap:12px;align-items:flex-start}
.ia-ent-l li::before{content:"";flex:none;width:6px;height:6px;margin-top:9px;background:#f2f2f2}

/* Cómo funciona: la imagen del reloj y la terminal */
#como .mudanza .ft img{object-position:50% 50%}

@media (min-width:1101px){
  .ia-cols{display:grid;grid-template-columns:44px minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr) 112px;gap:20px;padding:12px 22px;border-bottom:1px solid var(--linea);font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-3)}
  .ia-cols .r{text-align:right}
  .gfila .btn{width:112px;justify-content:space-between}
}
@media (max-width:1100px){
  .ia-modelos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gfila{grid-template-columns:36px minmax(0,1fr) auto;grid-template-areas:"i n p" "i v b" "i g b";gap:12px 18px}
  .gfila .gi{grid-area:i;align-self:start;padding-top:6px}
  .gfila .gn{grid-area:n}
  .gfila .gv{grid-area:v}
  .gfila .gp{grid-area:g}
  .gfila .gprecio{grid-area:p}
  .gfila .btn{grid-area:b;align-self:end}
  .gfila .gp span{display:inline;font-size:14px}
  .gfila .gp small{display:inline;margin-left:10px}
}
@media (max-width:860px){
  .ia-hero .hero-ft{object-position:20% 40%}
  .ia-hero .ia-nv{display:none}
  .ia-ent .gran{min-height:640px}
}
@media (max-width:560px){
  .ia-modelos{grid-template-columns:1fr}
  .ia-mod{min-height:0;padding:24px 22px}
  .ia-mod .logo-m{margin-top:28px}
  .gpu-chips{flex-wrap:nowrap;overflow-x:auto;margin:0 calc(var(--pad)*-1);padding:0 var(--pad);scrollbar-width:none;width:calc(100% + var(--pad)*2)}
  .gpu-chips::-webkit-scrollbar{display:none}
  .gpu-chip{flex:none}
  .ia-buscar{flex-basis:100%}
  .ia-lista-cab{padding:14px 16px}
  .ia-lista-cab .nv{display:none}
  .gfila{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n p" "v v" "g b";padding:18px 16px}
  .gfila .gi{display:none}
  .gfila .gp small{display:block;margin:4px 0 0}
  .barra-v{max-width:none}
  .ia-ent-l{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.gfila{opacity:1;transform:none}.barra-v i{transform:none}}
/* Cierre: el render de la red queda detrás del texto, sin pelearse con la esfera ASCII */
#contacto .cierre .ft img{opacity:.42;object-position:30% 50%}
.ia-ent .precio-esq{white-space:nowrap}