:root {
  --login-primary: #F8890D;
  --login-secondary: #763085;
  --login-soft: #EDEEF4;
  --login-ink: #302536;
  --login-muted: #74717A;
  --login-line: #E3E0E6;
}

body { background: #fff; }
.login-shell { grid-template-columns: repeat(2, minmax(0, 1fr)); background: #fff; }

.theme-panel {
  grid-column: 2;
  grid-row: 1;
  min-height: 100vh;
  justify-content: flex-end;
  padding: 48px clamp(42px, 5vw, 82px);
  background: var(--login-soft);
  color: var(--login-ink);
  border-top: 4px solid var(--login-primary);
}
.theme-panel::after, .theme-brand, .theme-footer, .findash-showcase { display: none; }
.theme-world-map {
  top: 33%;
  left: 50%;
  width: min(760px, 84%);
  height: 47%;
  background-image: url("../images/mapa-fondo-claro-web.png?v=20260908b");
  opacity: .13;
  transform: translate(-50%, -50%);
  animation: none;
  filter: sepia(.15) saturate(.75) hue-rotate(238deg);
}
.theme-illustration {
  position: absolute;
  z-index: 2;
  top: 31%;
  left: 50%;
  width: min(305px, 47%);
  height: auto;
  display: block;
  pointer-events: none;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 14px 20px rgba(79, 52, 90, .09));
}
.theme-content {
  width: min(570px, 92%);
  margin: 0 auto clamp(54px, 8vh, 92px);
  padding: 0;
  text-align: center;
}
.portal-label {
  justify-content: center;
  margin-bottom: 15px;
  color: var(--login-secondary);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.portal-label::before { width: 26px; background: var(--login-primary); }
.theme-content h1, .theme-content h1 strong { max-width: 560px; color: var(--login-ink); }
.theme-content h1 {
  margin: 0 auto;
  font-size: clamp(34px, 3.4vw, 50px);
  font-weight: 650;
  line-height: 1.08;
  letter-spacing: -.04em;
}
.theme-content h1 strong { font-weight: 650; }
.theme-content > p {
  max-width: 520px;
  margin: 17px auto 0;
  color: var(--login-muted);
  font-size: 13px;
  line-height: 1.62;
}

.auth-panel {
  grid-column: 1;
  grid-row: 1;
  min-height: 100vh;
  padding: 48px clamp(34px, 7vw, 96px);
  background: #fff;
}
.auth-panel::before, .mobile-brand { display: none; }
.auth-card {
  width: min(430px, 100%);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  animation: loginSoberIn .42s ease both;
}
.auth-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  margin-bottom: 27px;
}
.auth-brand img { width: 64px; height: 64px; display: block; object-fit: contain; }
.auth-brand-copy {
  padding-left: 14px;
  border-left: 1px solid var(--login-line);
  line-height: 1.05;
  text-align: left;
}
.auth-brand-copy strong, .auth-brand-copy span { display: block; }
.auth-brand-copy strong {
  color: var(--login-secondary);
  font-size: 19px;
  font-weight: 750;
  letter-spacing: -.025em;
}
.auth-brand-copy span {
  margin-top: 5px;
  color: var(--login-muted);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.auth-card h2 {
  color: var(--login-ink);
  font-size: 21px;
  font-weight: 650;
  text-align: center;
  letter-spacing: -.02em;
}
.auth-lead {
  max-width: 39ch;
  margin: 7px auto 34px;
  color: var(--login-muted);
  font-size: 11.5px;
  line-height: 1.6;
  text-align: center;
}
.field { margin-bottom: 20px; }
.field label { margin-bottom: 8px; color: #514A55; font-size: 11px; font-weight: 550; }
.input-wrap > i { color: #8A848D; font-size: 16px; }
.input-wrap input {
  height: 46px;
  border-color: var(--login-line);
  border-radius: 5px;
  background: #fff;
  color: var(--login-ink);
  font-size: 11.5px;
}
.input-wrap input:hover { border-color: #CFC9D3; }
.input-wrap input:focus {
  border-color: var(--login-secondary);
  box-shadow: 0 0 0 3px rgba(118, 48, 133, .1);
}
.input-wrap:focus-within > i, .toggle-pw:hover { color: var(--login-secondary); }
.toggle-pw:hover { background: #F4F0F5; }
.access-row {
  min-height: 24px;
  margin: -3px 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  color: #8A848D;
  font-size: 9.5px;
}
.access-row span { display: inline-flex; align-items: center; gap: 6px; }
.access-row i { color: var(--login-secondary); font-size: 13px; }
.btn-login {
  min-height: 46px;
  margin: 0;
  border-radius: 5px;
  background: var(--login-primary);
  font-size: 11px;
  font-weight: 700;
  box-shadow: none;
}
.btn-login:hover { background: #DD7708; box-shadow: 0 7px 16px rgba(248, 137, 13, .16); }
.btn-login:focus-visible, .toggle-pw:focus-visible { outline-color: rgba(118, 48, 133, .3); }
.secure-note {
  margin-top: 23px;
  padding-top: 19px;
  justify-content: center;
  border-color: #ECE9EE;
  text-align: center;
}
.secure-note > i { display: none; }
.secure-note b { color: #67616B; font-size: 9.5px; font-weight: 600; }
.secure-note span { margin-top: 4px; color: #918B94; font-size: 9px; }
.auth-footer {
  width: min(430px, 100%);
  margin-top: 28px;
  justify-content: center;
  color: #969199;
  font-size: 8.5px;
  text-align: center;
}
.auth-footer span + span::before { margin-right: 11px; color: #CFCAD1; content: "·"; }

@keyframes loginSoberIn {
  from { opacity: .35; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-height: 760px) and (min-width: 901px) {
  .theme-world-map { top: 30%; height: 43%; }
  .theme-illustration { top: 28%; width: min(245px, 42%); }
  .theme-content { margin-bottom: 34px; }
  .auth-panel { padding-block: 28px; }
  .auth-brand { margin-bottom: 19px; }
  .auth-lead { margin-bottom: 25px; }
  .field { margin-bottom: 15px; }
  .secure-note { margin-top: 17px; padding-top: 15px; }
  .auth-footer { margin-top: 18px; }
}

@media (max-width: 900px) {
  .login-shell { display: block; }
  .theme-panel { display: none; }
  .auth-panel {
    min-height: 100vh;
    padding: 40px 24px;
    background: linear-gradient(180deg, var(--login-soft) 0, var(--login-soft) 4px, #fff 4px, #fff 100%);
  }
  .auth-card { padding: 0; border: 0; box-shadow: none; }
}

@media (max-width: 520px) {
  .auth-panel { justify-content: center; padding: max(28px, env(safe-area-inset-top)) 22px 28px; }
  .auth-brand img { width: 54px; height: 54px; }
  .auth-brand-copy strong { font-size: 17px; }
  .auth-card h2 { font-size: 20px; }
  .auth-footer { margin-top: 24px; padding-top: 0; flex-direction: row; gap: 11px; }
  .auth-footer span:last-child { text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .auth-card { animation: none; }
}