/* ==========================================================================
   SOLTEX — Sistema de diseño Fase 2 ("Precisión industrial premium")
   Tokens y componentes compartidos entre todas las páginas rediseñadas.
   ========================================================================== */
:root{
  --canvas:#0B0F14;
  --surface-1:#12161D;
  --surface-2:#1B212B;
  --border-c:#2A313D;
  --text-1:#F4F5F7;
  --text-2:#9AA3B0;
  --accent:#3D6FE0;
  --accent-dark:#2F58BD;
  --alert:#E0A83D;
}
*{font-family:'IBM Plex Sans', sans-serif;}
html{scroll-behavior:smooth;}
body{background:var(--canvas); color:var(--text-1); margin:0;}
.font-display{font-family:'Space Grotesk', sans-serif; letter-spacing:-0.02em;}
.font-mono{font-family:'IBM Plex Mono', monospace; letter-spacing:0.06em;}

.surface-1{background:var(--surface-1);}
.surface-2{background:var(--surface-2);}
.border-c{border-color:var(--border-c) !important;}
.text-2{color:var(--text-2);}
.accent{color:var(--accent);}
.bg-accent{background:var(--accent);}

.btn-primary{background:var(--accent); color:#fff; transition:background .2s ease, transform .15s ease;}
.btn-primary:hover{background:var(--accent-dark);}
.btn-primary:active{transform:scale(.98);}
.btn-ghost{background:transparent; border:1px solid var(--border-c); color:var(--text-1); transition:border-color .2s ease, background .2s ease;}
.btn-ghost:hover{border-color:var(--accent); background:rgba(61,111,224,0.08);}

.eyebrow{font-family:'IBM Plex Mono', monospace; font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent);}

.measure-line{position:relative;}
.measure-line::before{content:"";position:absolute; left:0; top:0; bottom:0; width:1px; background:var(--border-c);}

.scroll-reveal{opacity:0; transform:translateY(14px); transition:all .6s cubic-bezier(.16,1,.3,1);}
.scroll-reveal.active{opacity:1; transform:translateY(0);}

.nav-scrolled{background:rgba(11,15,20,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--border-c);}

.card-hover{transition:border-color .25s ease, transform .25s ease;}
.card-hover:hover{border-color:var(--accent); transform:translateY(-3px);}

::selection{background:var(--accent); color:#fff;}
input, select, textarea{background:var(--surface-2); border:1px solid var(--border-c); color:var(--text-1);}
input::placeholder, textarea::placeholder{color:var(--text-2);}
input:focus, select:focus, textarea:focus{outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent);}
a:focus-visible, button:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}

.whatsapp-float{animation:pulse 2.4s infinite;}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.06);}}

/* Inner-page hero (secondary, non-home pages) */
.page-hero-v2{
  background: linear-gradient(180deg, rgba(11,15,20,.2) 0%, var(--canvas) 100%), var(--surface-1);
  border-bottom:1px solid var(--border-c);
}
.page-hero-v2 h1{font-family:'Space Grotesk', sans-serif; letter-spacing:-0.02em; font-weight:600;}

/* Product / machine card, dark variant */
.card-v2{
  background:var(--surface-1);
  border:1px solid var(--border-c);
  transition:border-color .25s ease, transform .25s ease;
}
.card-v2:hover{border-color:var(--accent); transform:translateY(-3px);}
.card-v2 h3{color:var(--text-1);}
.card-v2 p{color:var(--text-2);}

.badge-v2{
  font-family:'IBM Plex Mono', monospace;
  font-size:.65rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:.3rem .6rem;
  background:var(--surface-2);
  border:1px solid var(--border-c);
  color:var(--text-2);
}
.badge-accent-v2{
  font-family:'IBM Plex Mono', monospace;
  font-size:.65rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:.3rem .6rem;
  background:rgba(61,111,224,0.15);
  color:var(--accent);
  border:1px solid rgba(61,111,224,0.3);
}

.filter-btn-v2{
  font-family:'IBM Plex Mono', monospace;
  font-size:.75rem;
  letter-spacing:.04em;
  padding:.5rem 1.1rem;
  background:transparent;
  border:1px solid var(--border-c);
  color:var(--text-2);
  transition:all .2s ease;
  white-space:nowrap;
}
.filter-btn-v2:hover{border-color:var(--accent); color:var(--text-1);}
.filter-btn-v2.active{background:var(--accent); border-color:var(--accent); color:#fff;}

@media (prefers-reduced-motion: reduce){
  .scroll-reveal{transition:none; opacity:1; transform:none;}
  .whatsapp-float{animation:none;}
}
