/* CB Energía · Acceso institucional v0.6.0 | hoja independiente; no altera MFA. */
:root { color-scheme: light; }
* { box-sizing: border-box; }
html { font-family: Inter, system-ui, -apple-system, "Segoe UI", Arial, sans-serif; }
body.cbi-login { margin: 0; min-height: 100vh; background: #f8fbf7; color: #203d2d; line-height: 1.48; }
.cbi-layout { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(390px, .90fr); min-height: 100vh; }
.cbi-visual { min-height: 620px; position: relative; overflow: hidden; background: #174d43; display: flex; align-items: end; isolation: isolate; }
.cbi-visual-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 52% center; z-index: -2; }
.cbi-visual-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(7,32,24,.88), rgba(7,32,24,.26) 27%, transparent 68%); z-index: -1; }
.cbi-visual-copy { max-width: 670px; color: #fff; padding: clamp(24px, 5.1vw, 80px); padding-bottom: clamp(30px, 6.3vw, 90px); text-shadow: 0 2px 18px #0a2a2370; }
.cbi-eyebrow { display: inline-block; margin-bottom: 15px; text-transform: uppercase; font-size: .73rem; font-weight: 800; letter-spacing: .14em; color: #bfecc1; }
.cbi-visual-copy h2 { color: #fff; line-height: 1.12; letter-spacing: -.035em; font-size: clamp(1.9rem, 3vw, 3.15rem); font-weight: 780; margin: 0 0 12px; }
.cbi-visual-copy p { color: #f2f8ee; margin: 0; font-size: 1.05rem; }
.cbi-access { background: radial-gradient(circle at 110% -15%, #edf8ed, transparent 44%), #fff; display: grid; align-items: center; padding: 32px clamp(25px, 5.6vw, 90px); }
.cbi-access-inner { width: 100%; max-width: 510px; margin: 0 auto; }
.cbi-access-head { padding: 0 0 31px; text-align: center; }
.cbi-logo { display: block; max-width: min(100%, 340px); height: auto; margin: 0 auto 7px; }
.cbi-subtitle { font-size: 1rem; font-weight: 600; color: #435749; letter-spacing: .015em; margin: 0; }
.cbi-form-header { margin-bottom: 26px; }
.cbi-overline { margin: 0 0 7px; color: #3f8735; letter-spacing: .14em; text-transform: uppercase; font-size: .7rem; font-weight: 850; }
.cbi-form-header h1 { font-size: clamp(1.7rem, 2.4vw, 2.25rem); letter-spacing: -.03em; margin: 0 0 7px; color: #163b27; line-height: 1.2; }
.cbi-form-header > p:not(.cbi-overline) { font-size: .92rem; color: #586b60; margin: 0; }
.cbi-form { width: 100%; }
.cbi-field { margin-bottom: 20px; }
.cbi-field label { display: block; font-size: .90rem; font-weight: 750; color: #213d2e; margin-bottom: 8px; }
.cbi-field input { width: 100%; display: block; height: 54px; border: 1.5px solid #b5cabe; border-radius: 11px; background: #fff; color: #173729; padding: 0 16px; font: inherit; transition: border-color .12s, box-shadow .12s; }
.cbi-field input::placeholder { color: #697b70; opacity: 1; }
.cbi-field input:hover { border-color: #7fa88a; }
.cbi-field input:focus-visible { outline: 3px solid #abd99f; outline-offset: 2px; border-color: #388a36; }
.cbi-submit { background: #368e31; color: #fff; width: 100%; min-height: 56px; border: 0; border-radius: 11px; display: flex; gap: 12px; align-items: center; justify-content: center; font: inherit; font-weight: 800; font-size: 1.05rem; cursor: pointer; box-shadow: 0 7px 15px rgba(37,115,48,.13); margin-top: 27px; }
.cbi-submit span { margin-left: 8px; font-size: 1.45rem; line-height: 1; }
.cbi-submit:hover { background: #277425; }
.cbi-submit:focus-visible, .cbi-help a:focus-visible { outline: 3px solid #abd99f; outline-offset: 4px; }
.cbi-help { margin-top: 23px; text-align: center; }
.cbi-help a { color: #246c2b; font-weight: 750; font-size: .89rem; text-decoration: underline; text-underline-offset: 3px; }
.cbi-help a:hover { color: #184e20; }
.cbi-access-footer { margin-top: 54px; border-top: 1px solid #e0e8df; padding-top: 22px; text-align: center; color: #596f62; font-size: .79rem; }
.cbi-lock { display: inline-block; color: #2b8933; font-size: .7rem; margin-right: 7px; }
.cbi-notice,.cbi-error { padding: 14px 16px; border-radius: 10px; margin: 0 0 18px; font-size: .91rem; border: 1px solid #c5dfc8; background: #eff9ec; color: #1c602a; }
.cbi-error { background: #fff1ef; border-color: #edb8b0; color: #8a2622; }
@media (min-width: 1520px) { .cbi-layout { grid-template-columns: minmax(0, 1.28fr) minmax(460px, .86fr); } }
@media (max-width: 980px) { .cbi-layout { grid-template-columns: 1fr; } .cbi-visual { min-height: 265px; max-height: 300px; } .cbi-visual-image { object-position: 50% 40%; } .cbi-visual-copy { padding: 24px 32px; } .cbi-visual-copy h2 { max-width: 620px; font-size: 1.75rem; } .cbi-visual-copy p { font-size: .9rem; } .cbi-access { padding: 36px 26px 52px; } .cbi-access-head { padding-bottom: 20px; } .cbi-access-footer { margin-top: 38px; } }
@media (max-width: 560px) { .cbi-visual { min-height: 172px; max-height: 172px; } .cbi-visual-image { object-position: 50% 35%; } .cbi-visual-copy { padding: 15px 20px; } .cbi-visual-copy h2 { font-size: 1.27rem; margin-bottom: 0; } .cbi-visual-copy p { display: none; } .cbi-eyebrow { font-size: .63rem; margin-bottom: 9px; } .cbi-access { padding: 27px 20px 40px; } .cbi-logo { max-width: min(95%, 265px); } .cbi-form-header { margin-bottom: 20px; } .cbi-field input { height: 51px; } .cbi-access-footer { margin-top: 26px; } }
@media (prefers-reduced-motion: reduce) { .cbi-field input { transition: none; } }