/* SYMONE · Inicio de sesión 2026-11-01
   Capa de diseño aislada del acceso y su proceso de autenticación.
   No se cambian nombres de campos, rutas ni eventos del formulario. */
body.cap-login-sym-k1 {
  --symone-navy:#102b55;
  --symone-blue:#1164d9;
  --symone-electric:#1984f5;
  --symone-muted:#506c8c;
  background:linear-gradient(155deg,#f8fbff 0%,#eaf4fe 67%,#e5f1fc 100%);
}
body.cap-login-sym-k1 .topbar.topbar-control {
  min-height:76px;
  border-bottom:1px solid #e0ebf5;
  box-shadow:0 5px 30px rgba(29,78,142,.045);
}
body.cap-login-sym-k1 .topbar .control-brand-copy strong {
  font-size:clamp(14px,1.2vw,19px);
  letter-spacing:-.025em;
  color:#17325e;
}
body.cap-login-sym-k1 .topbar .control-brand-copy small {
  font-size:11px;
  font-weight:650;
  color:#5276a4;
  letter-spacing:.02em;
}
body.cap-login-sym-k1 .sym-auth-2026 {
  padding:clamp(14px,2.2vw,28px) clamp(12px,3vw,48px) 32px;
}
body.cap-login-sym-k1 .sym-auth-panel {
  width:90vw;
  max-width:1660px;
  border:1px solid rgba(207,227,247,.95);
  border-radius:32px;
  background:linear-gradient(113deg,#f8fcff 1%,#eef7ff 48%,#dceeff 100%);
  box-shadow:0 28px 74px rgba(19,72,137,.12);
  overflow:hidden;
}
body.cap-login-sym-k1 .sym-auth-panel::before {
  width:610px;height:610px;right:-145px;top:-160px;
  background:radial-gradient(circle,rgba(110,184,255,.33) 0%,rgba(169,214,253,.23) 58%,transparent 72%);
}
body.cap-login-sym-k1 .sym-auth-panel::after {
  content:"";pointer-events:none;position:absolute;width:360px;height:360px;
  left:-200px;bottom:-255px;border-radius:50%;
  background:radial-gradient(circle,rgba(81,165,249,.12),transparent 70%);
}
body.cap-login-sym-k1 .sym-auth-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) clamp(405px,29vw,495px);
  align-items:center;
  gap:clamp(32px,3.7vw,66px);
  width:100%;
  padding:clamp(33px,3.4vw,56px) clamp(35px,3.7vw,62px) 27px;
}
body.cap-login-sym-k1 .sym-auth-story {
  min-width:0;align-self:stretch;display:flex;align-items:center;
}
body.cap-login-sym-k1 .sym-auth-story-inner {width:100%;max-width:900px;min-width:0}
body.cap-login-sym-k1 .sym-auth-overline {
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  color:#52749e;font-size:10.5px;letter-spacing:.17em;
  font-weight:850;margin:0 0 18px;
}
body.cap-login-sym-k1 .sym-auth-overline .sym-auth-brand-spark {
  width:10px;height:10px;flex:0 0 10px;border-radius:50%;
  background:#1889fa;box-shadow:0 0 0 5px rgba(24,137,250,.12);
}
body.cap-login-sym-k1 .sym-auth-overline strong {
  color:#1256b8;letter-spacing:.22em;font-size:12px;font-weight:950;
}
body.cap-login-sym-k1 .sym-auth-overline .sym-auth-overline-divider {
  display:block;flex:0 0 1px;height:17px;width:1px;
  background:#b4cbe6;border-radius:0;
}
body.cap-login-sym-k1 .sym-auth-story h1 {
  font-size:clamp(42px,3.35vw,65px);
  line-height:1.08;letter-spacing:-.053em;font-weight:950;
  margin:0 0 15px;max-width:760px;
  text-wrap:balance;
}
body.cap-login-sym-k1 .sym-auth-story h1 span {color:#122d58}
body.cap-login-sym-k1 .sym-auth-story h1 em {color:#1677ed}
body.cap-login-sym-k1 .sym-auth-story h2 {
  font-size:clamp(19px,1.66vw,27px);
  line-height:1.25;letter-spacing:-.03em;
  color:#27466f;font-weight:800;margin:0 0 11px;
}
body.cap-login-sym-k1 .sym-auth-story-inner > .sym-auth-lead {
  display:block;max-width:610px;margin:0;
  color:#526e8f;font-size:clamp(13.5px,.96vw,16px);
  line-height:1.65;font-weight:480;
}
body.cap-login-sym-k1 .sym-auth-features {
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(9px,1vw,16px);margin:30px 0 0;
}
body.cap-login-sym-k1 .sym-auth-feature {
  display:flex;flex-direction:column;align-items:flex-start;
  min-height:138px;padding:17px 13px 14px;
  gap:6px;background:rgba(255,255,255,.76);
  border:1px solid rgba(255,255,255,.94);
  border-radius:19px;box-shadow:0 9px 24px rgba(31,83,139,.045);
}
body.cap-login-sym-k1 .sym-auth-feature-icon {
  flex:0 0 49px;display:grid;place-items:center;
  width:49px;height:49px;border-radius:15px;margin:0 0 5px;
}
body.cap-login-sym-k1 .sym-auth-feature-icon svg {height:25px;width:25px;stroke-width:1.95}
body.cap-login-sym-k1 .sym-auth-feature strong {
  font-size:clamp(12px,.89vw,14px);line-height:1.3;
  color:#193860;letter-spacing:-.012em;font-weight:850;
}
body.cap-login-sym-k1 .sym-auth-feature small {
  font-size:clamp(10px,.75vw,12px);line-height:1.42;color:#67809c;
}
body.cap-login-sym-k1 .sym-story-block {margin-top:22px}
body.cap-login-sym-k1 .sym-story-trigger {
  width:100%;min-height:90px;padding:14px 17px;gap:14px;
  border-radius:19px;border:1px solid #dbe8f6;
  background:rgba(255,255,255,.87);
  box-shadow:0 12px 30px rgba(25,82,145,.07);
}
body.cap-login-sym-k1 .sym-story-trigger-icon {
  width:51px;height:51px;flex-basis:51px;border-radius:15px;
}
body.cap-login-sym-k1 .sym-story-trigger-icon svg {width:26px;height:26px}
body.cap-login-sym-k1 .sym-story-trigger-text strong {
  font-size:clamp(14px,1.02vw,16px);line-height:1.35;
}
body.cap-login-sym-k1 .sym-story-trigger-text small {
  font-size:clamp(11px,.8vw,13px);line-height:1.4;
}
body.cap-login-sym-k1 .sym-story-trigger-cta {
  min-width:137px;min-height:47px;padding:10px 16px;
  border-radius:12px;gap:10px;font-size:13px;
  background:linear-gradient(110deg,#1555bc,#197ff0);
  box-shadow:0 8px 16px rgba(23,100,215,.18);
}
body.cap-login-sym-k1 .sym-auth-form-outer {
  display:flex;align-items:center;justify-content:center;min-width:0;width:100%;
}
body.cap-login-sym-k1 .sym-auth-form-card {
  width:100%;max-width:none;position:relative;
  padding:clamp(29px,2.5vw,43px);
  border:1px solid #e6effa;border-radius:27px;
  background:#fff;
  box-shadow:0 23px 56px rgba(19,65,129,.14);
}
body.cap-login-sym-k1 .sym-auth-form-card::before {
  content:"";position:absolute;inset:0 0 auto;height:6px;
  border-radius:26px 26px 0 0;
  background:linear-gradient(90deg,#194b9f,#148cff);
}
body.cap-login-sym-k1 .sym-auth-original-brands {
  min-height:82px;gap:22px;margin:0 0 14px;
}
body.cap-login-sym-k1 .sym-auth-original-brands img:first-child {
  width:127px;height:84px;object-fit:contain;
}
body.cap-login-sym-k1 .sym-auth-original-brands img:last-child {
  width:86px;height:80px;object-fit:contain;
}
body.cap-login-sym-k1 .sym-auth-brand-divider {height:55px;background:#d9e6f4}
body.cap-login-sym-k1 .sym-auth-form-heading {margin:0 0 26px;text-align:center}
body.cap-login-sym-k1 .sym-auth-welcome-tag {
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-size:10px;font-weight:900;letter-spacing:.18em;
  color:#2173cf;margin:0 0 10px;
}
body.cap-login-sym-k1 .sym-auth-welcome-tag span {
  width:6px;height:6px;background:#2691fc;border-radius:50%;
}
body.cap-login-sym-k1 .sym-auth-form-heading h2 {
  font-size:clamp(25px,1.85vw,31px);line-height:1.18;
  font-weight:900;color:#153565;letter-spacing:-.04em;margin:0 0 8px;
}
body.cap-login-sym-k1 .sym-auth-form-heading p {
  font-size:13.5px;line-height:1.5;color:#687f9d;max-width:none;margin:0;
}
body.cap-login-sym-k1 .sym-auth-form {gap:19px}
body.cap-login-sym-k1 .sym-auth-field {gap:9px}
body.cap-login-sym-k1 .sym-auth-field label {
  font-size:13.5px;font-weight:800;color:#294971;
}
body.cap-login-sym-k1 .sym-auth-input-wrap {
  min-height:61px;height:61px;gap:12px;padding:0 17px;
  border:1px solid #cfdff0;border-radius:15px;
  background:#f9fbfe;
}
body.cap-login-sym-k1 .sym-auth-input-wrap:focus-within {
  border-color:#1681ed;background:#fff;
  box-shadow:0 0 0 4px rgba(22,129,237,.13);
}
body.cap-login-sym-k1 .sym-auth-input-wrap>svg {
  width:22px;height:22px;flex-basis:22px;stroke:#6282a9;
}
body.cap-login-sym-k1 .sym-auth-input-wrap input {
  height:100%;min-width:0;padding:0!important;
  background:transparent!important;border:0!important;
  font-size:15px;color:#19375f;
}
body.cap-login-sym-k1 .sym-auth-password-toggle {
  flex:0 0 44px!important;width:44px;height:44px;min-width:44px;
  display:grid!important;place-items:center;border-radius:12px!important;
}
body.cap-login-sym-k1 .sym-auth-password-toggle svg {width:23px;height:23px}
body.cap-login-sym-k1 .sym-auth-submit {
  min-height:62px!important;height:62px!important;margin-top:6px;padding:15px 20px!important;
  border-radius:15px!important;
  background:linear-gradient(104deg,#1050b9,#1681f4)!important;
  box-shadow:0 14px 28px rgba(18,100,220,.25)!important;
  font-size:16px!important;font-weight:900!important;gap:11px;
  transition:filter .18s, transform .18s, box-shadow .18s;
}
body.cap-login-sym-k1 .sym-auth-submit:hover:not(:disabled) {
  filter:brightness(1.08);box-shadow:0 17px 29px rgba(18,100,220,.29)!important;
}
body.cap-login-sym-k1 .sym-auth-submit svg {width:22px;height:22px;margin-left:0}
body.cap-login-sym-k1 .sym-auth-security-note {
  margin-top:21px;font-size:11px;gap:8px;color:#7b8fa6;
}
body.cap-login-sym-k1 .sym-auth-security-note svg {width:18px;height:18px}
body.cap-login-sym-k1 .sym-auth-outcomes {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  max-width:none;width:auto;position:relative;
  padding:19px 18px;margin:0 clamp(30px,3.3vw,56px) 28px;
  background:rgba(255,255,255,.76);border:1px solid rgba(255,255,255,.94);
  border-radius:19px;box-shadow:0 10px 30px rgba(24,78,147,.055);
}
body.cap-login-sym-k1 .sym-auth-outcomes>div {
  gap:13px;padding:0 clamp(12px,2vw,29px);
}
body.cap-login-sym-k1 .sym-auth-outcome-icon {
  width:44px;height:44px;flex:0 0 44px;
  background:#e7f2ff;border-radius:13px;
  font-size:22px;color:#177af0;
}
body.cap-login-sym-k1 .sym-auth-outcomes strong {
  font-size:13px;line-height:1.32;font-weight:850;
}
body.cap-login-sym-k1 .sym-auth-outcomes small {
  font-size:11.5px;line-height:1.42;margin-top:4px;
}
body.cap-login-sym-k1 button:focus-visible,
body.cap-login-sym-k1 .sym-auth-input-wrap:focus-within {
  outline-offset:3px;
}
@media(min-width:921px) and (max-width:1400px) {
  body.cap-login-sym-k1 .sym-auth-layout {
    grid-template-columns:minmax(0,1fr) clamp(365px,30vw,435px);
    gap:clamp(20px,2.7vw,38px);padding:clamp(23px,3vw,38px);
  }
  body.cap-login-sym-k1 .sym-auth-story h1 {font-size:clamp(35px,3.5vw,54px)}
  body.cap-login-sym-k1 .sym-auth-features {grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:21px}
  body.cap-login-sym-k1 .sym-auth-feature {min-height:80px;display:grid;grid-template-columns:41px 1fr;grid-template-rows:auto auto;align-content:center;column-gap:10px;padding:10px}
  body.cap-login-sym-k1 .sym-auth-feature-icon {width:40px;height:40px;grid-row:1/3;grid-column:1;margin:0;border-radius:11px;flex-basis:40px}
  body.cap-login-sym-k1 .sym-auth-feature-icon svg {width:21px;height:21px}
  body.cap-login-sym-k1 .sym-auth-feature strong {grid-column:2;font-size:12.5px}
  body.cap-login-sym-k1 .sym-auth-feature small {grid-column:2;font-size:11px}
  body.cap-login-sym-k1 .sym-auth-form-card {padding:27px}
  body.cap-login-sym-k1 .sym-auth-outcomes {margin-inline:clamp(23px,3vw,38px)}
}
@media(max-width:920px) {
  body.cap-login-sym-k1 .sym-auth-2026 {padding:14px 12px 24px}
  body.cap-login-sym-k1 .sym-auth-panel {width:100%;max-width:690px;border-radius:26px}
  body.cap-login-sym-k1 .sym-auth-layout {
    display:flex;flex-direction:column;gap:0;padding:22px;
  }
  body.cap-login-sym-k1 .sym-auth-form-outer {order:0;width:100%}
  body.cap-login-sym-k1 .sym-auth-form-card {width:100%;max-width:550px;padding:32px}
  body.cap-login-sym-k1 .sym-auth-story {
    display:block;order:1;width:100%;align-self:auto;margin-top:18px;
  }
  body.cap-login-sym-k1 .sym-auth-story-inner {max-width:550px!important;margin:auto}
  body.cap-login-sym-k1 .sym-auth-story .sym-auth-overline,
  body.cap-login-sym-k1 .sym-auth-story h1,
  body.cap-login-sym-k1 .sym-auth-story h2,
  body.cap-login-sym-k1 .sym-auth-story .sym-auth-lead,
  body.cap-login-sym-k1 .sym-auth-story .sym-auth-features {display:none}
  body.cap-login-sym-k1 .sym-story-block {margin:0}
  body.cap-login-sym-k1 .sym-story-trigger {min-height:80px}
  body.cap-login-sym-k1 .sym-auth-outcomes {margin:0 22px 22px;padding:13px 9px}
  body.cap-login-sym-k1 .sym-auth-outcomes>div {gap:9px;padding:4px 10px;display:flex;align-items:center}
  body.cap-login-sym-k1 .sym-auth-outcome-icon {width:35px;height:35px;flex-basis:35px}
  body.cap-login-sym-k1 .sym-auth-outcomes strong {font-size:11px}
  body.cap-login-sym-k1 .sym-auth-outcomes small {display:none}
}
@media(max-width:600px) {
  body.cap-login-sym-k1 .topbar.topbar-control {min-height:65px}
  body.cap-login-sym-k1 .topbar .control-brand-copy strong {font-size:12.5px;letter-spacing:-.03em}
  body.cap-login-sym-k1 .topbar .control-brand-copy small {font-size:9.5px}
  body.cap-login-sym-k1 .sym-auth-2026 {padding:9px 8px 18px}
  body.cap-login-sym-k1 .sym-auth-panel {border-radius:22px}
  body.cap-login-sym-k1 .sym-auth-layout {padding:12px}
  body.cap-login-sym-k1 .sym-auth-form-card {padding:27px 20px 23px;border-radius:19px}
  body.cap-login-sym-k1 .sym-auth-original-brands {display:flex;gap:13px;min-height:51px;margin-bottom:13px}
  body.cap-login-sym-k1 .sym-auth-original-brands img:first-child {width:83px;height:53px}
  body.cap-login-sym-k1 .sym-auth-original-brands img:last-child {width:58px;height:53px}
  body.cap-login-sym-k1 .sym-auth-brand-divider {height:34px}
  body.cap-login-sym-k1 .sym-auth-form-heading {margin-bottom:24px}
  body.cap-login-sym-k1 .sym-auth-welcome-tag {font-size:9px;letter-spacing:.12em}
  body.cap-login-sym-k1 .sym-auth-form-heading h2 {font-size:25px}
  body.cap-login-sym-k1 .sym-auth-form-heading p {font-size:12.5px}
  body.cap-login-sym-k1 .sym-auth-input-wrap {height:58px;min-height:58px;padding:0 12px;gap:10px}
  body.cap-login-sym-k1 .sym-auth-input-wrap input {font-size:16px}
  body.cap-login-sym-k1 .sym-auth-submit {min-height:60px!important;height:60px!important;font-size:15px!important}
  body.cap-login-sym-k1 .sym-auth-security-note {font-size:10px;margin-top:17px}
  body.cap-login-sym-k1 .sym-auth-story {margin-top:13px}
  body.cap-login-sym-k1 .sym-story-trigger {min-height:74px;padding:11px;gap:9px}
  body.cap-login-sym-k1 .sym-story-trigger-icon {width:40px;height:40px;flex-basis:40px}
  body.cap-login-sym-k1 .sym-story-trigger-icon svg {width:22px;height:22px}
  body.cap-login-sym-k1 .sym-story-trigger-text strong {font-size:12px}
  body.cap-login-sym-k1 .sym-story-trigger-text small {font-size:10px}
  body.cap-login-sym-k1 .sym-story-trigger-cta {min-width:auto;min-height:39px;padding:9px;gap:5px;font-size:11px}
  body.cap-login-sym-k1 .sym-auth-outcomes {margin:0 12px 13px;padding:10px 5px;gap:0}
  body.cap-login-sym-k1 .sym-auth-outcomes>div {padding:2px 6px;gap:5px;display:grid;justify-items:start}
  body.cap-login-sym-k1 .sym-auth-outcome-icon {height:30px;width:30px;font-size:17px}
  body.cap-login-sym-k1 .sym-auth-outcomes strong {font-size:9.5px;line-height:1.25}
}
@media(max-width:370px) {
  body.cap-login-sym-k1 .sym-auth-layout {padding:9px}
  body.cap-login-sym-k1 .sym-auth-form-card {padding:22px 14px}
  body.cap-login-sym-k1 .sym-story-trigger-cta {font-size:10px}
  body.cap-login-sym-k1 .sym-auth-outcomes {grid-template-columns:1fr}
  body.cap-login-sym-k1 .sym-auth-outcomes>div {display:flex;padding:6px 8px;border:0;border-bottom:1px solid #e4edf8}
  body.cap-login-sym-k1 .sym-auth-outcomes>div:last-child {border-bottom:0}
}
@media(prefers-reduced-motion:reduce) {
  body.cap-login-sym-k1 .sym-auth-submit {transition:none}
}


/* PARCHE 2026-11-01 · Cabecera centrada + historia independiente
   Solo en login, sin modificar autenticación ni otras pantallas. */
@media (min-width:921px) {
  body.cap-login-sym-k1 .sym-auth-story-inner > .sym-auth-overline {
    justify-content:center;
    text-align:center;
  }
  body.cap-login-sym-k1 .sym-auth-story-inner > h1,
  body.cap-login-sym-k1 .sym-auth-story-inner > h2,
  body.cap-login-sym-k1 .sym-auth-story-inner > .sym-auth-lead {
    text-align:center;
    margin-left:auto;
    margin-right:auto;
  }
  body.cap-login-sym-k1 .sym-auth-story-inner > h1 {
    max-width:780px;
  }
  body.cap-login-sym-k1 .sym-auth-story-inner > h2 {
    max-width:750px;
  }
  body.cap-login-sym-k1 .sym-auth-story-inner > .sym-auth-lead {
    max-width:630px;
  }
}
/* La historia se superpone como ventana flotante. Ninguna columna
   ni la banda inferior cambia de tamaño al abrirse. */
body.cap-login-sym-k1 .sym-story-content:not([hidden]) {
  position:fixed;
  z-index:9999;
  margin:0;
  box-sizing:border-box;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  border:1px solid #c8def6;
  border-radius:19px;
  background:#fff;
  box-shadow:0 22px 65px rgba(13,43,91,.25),0 3px 12px rgba(10,54,99,.12);
  animation:symStoryFloatIn .14s ease-out;
}
@keyframes symStoryFloatIn {
  from {opacity:0;translate:0 7px;}
  to {opacity:1;translate:0 0;}
}
body.cap-login-sym-k1 .sym-story-content:not([hidden]) .sym-story-close {
  width:31px;
  height:31px;
  font-size:22px;
  border-radius:9px;
}
@media(max-width:920px) {
  body.cap-login-sym-k1 .sym-story-content:not([hidden]) {
    padding:12px;
    border-radius:15px;
  }
}
@media(prefers-reduced-motion:reduce) {
  body.cap-login-sym-k1 .sym-story-content:not([hidden]) {animation:none;}
}
/* Tamaño del disparador invariable: el texto Ver historia/Ocultar no
   cambia su alto, ni empuja los elementos que están debajo. */
body.cap-login-sym-k1 .sym-story-trigger {
  height:90px;
  box-sizing:border-box;
}
body.cap-login-sym-k1 .sym-story-trigger:hover {transform:none;}
@media(max-width:920px) {
  body.cap-login-sym-k1 .sym-story-trigger {height:80px;min-height:80px;}
}
@media(max-width:600px) {
  body.cap-login-sym-k1 .sym-story-trigger {height:78px;min-height:78px;}
}