/* Jarvis Trader México — acceso. La base funcional permanece intacta. */
:root {
  --bg: #061522;
  --panel: #081a2a;
  --orange: #00d9ff;
  --amber: #ffa726;
  --text: #f5f8ff;
  --muted: #8eacb9;
  --line: rgba(0, 217, 255, .2);
  --ok: #4ce7aa;
  --error: #ff6678;
}

html { background: #061522; }
body {
  background:
    radial-gradient(circle at 16% 18%, rgba(0, 217, 255, .12), transparent 30%),
    radial-gradient(circle at 82% 76%, rgba(255, 167, 38, .08), transparent 28%),
    linear-gradient(145deg, #061522 0%, #071a2a 52%, #081827 100%);
}
.grid {
  opacity: .76;
  background-image: linear-gradient(rgba(0, 217, 255, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 217, 255, .035) 1px, transparent 1px);
  background-size: 52px 52px;
}
header { border-color: rgba(0, 217, 255, .16); }
.brand img { filter: drop-shadow(0 0 15px rgba(0, 217, 255, .2)); }
.stage { border-color: rgba(0, 217, 255, .25); color: #aac3cd; background: rgba(7, 26, 41, .58); }
.stage i { background: var(--ok); box-shadow: 0 0 10px var(--ok); }
.intro h1 { color: #f5f8ff; text-wrap: balance; }
.intro h1 em { color: #00d9ff; text-shadow: 0 0 25px rgba(0, 217, 255, .22); }
.intro > p { color: #a7bdc7; }
.intro li { border-color: rgba(0, 217, 255, .14); color: #aec4cd; }
.intro li b, .eyebrow, .form-title > span { color: #ffa726; }
.eyebrow span { background: #ffa726; box-shadow: 0 0 8px rgba(255, 167, 38, .75); }
.signal { filter: hue-rotate(158deg) saturate(1.28) brightness(1.1); }
.access {
  border-color: rgba(0, 217, 255, .27);
  background: linear-gradient(155deg, rgba(10, 31, 51, .98), rgba(3, 15, 25, .99));
  box-shadow: 0 34px 100px rgba(0, 0, 0, .5), 0 0 55px rgba(0, 217, 255, .07), inset 0 1px rgba(245, 248, 255, .04);
}
.access-head { border-color: rgba(0, 217, 255, .16); color: #7f9dab; }
.access-head span { color: #b8d0d9; }
.access-head i { background: var(--ok); box-shadow: 0 0 9px var(--ok); }
.tabs { background: rgba(0, 8, 14, .3); }
.tabs button { color: #829eaa; }
.tabs button.active { background: linear-gradient(135deg, rgba(0, 217, 255, .16), rgba(0, 217, 255, .05)); color: #9bf2ff; box-shadow: inset 0 0 0 1px rgba(0, 217, 255, .12); }
form label { color: #b9ced6; }
form input, .password { border-color: rgba(0, 217, 255, .18); background: rgba(2, 13, 22, .74); color: #f5f8ff; }
form input:focus { border-color: #00d9ff; box-shadow: 0 0 0 3px rgba(0, 217, 255, .12); }
.password button { color: #79eaff; }
.terms { color: #8eaab6; }
.terms input { accent-color: #00d9ff; }
.submit {
  background: linear-gradient(135deg, #00d9ff, #08a9d2);
  color: #00151e;
  box-shadow: 0 12px 28px rgba(0, 217, 255, .18);
}
.submit:hover { box-shadow: 0 16px 34px rgba(0, 217, 255, .3); transform: translateY(-1px); }
.submit:focus-visible, button:focus-visible, a:focus-visible { outline: 2px solid #ffa726; outline-offset: 3px; }
.message.error { color: #ff91a0; }
.message.success { color: #6bf0ba; }
.session-icon { border-color: rgba(0, 217, 255, .4); background: rgba(0, 217, 255, .1); color: #8ff1ff; }
.purchase-license { border-color: rgba(255, 167, 38, .35); color: #ffc15c; background: rgba(255, 167, 38, .07); }
.legal { color: #6f8b98; }

@media (max-width: 800px) {
  header { height: 70px; }
  main { gap: 38px; padding-top: 34px; }
  .intro { text-align: center; }
  .intro h1, .intro > p, .intro li { margin-left: auto; margin-right: auto; }
  .eyebrow { justify-content: center; }
  .signal { margin-left: auto; margin-right: auto; }
}

@media (max-width: 520px) {
  header, main, .legal { width: min(100% - 28px, 1180px); }
  .stage { padding: 8px 10px; font-size: 7px; }
  .intro h1 { font-size: clamp(37px, 12vw, 50px); }
  .access { border-radius: 18px; }
  .access-head { padding-inline: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
