/* The log in page: one card on the navy first screen, the network/company choice, and the "not open yet" note for companies. Loaded after site.css. */
.lg{min-height:100vh}
.lg-wrap{flex:1;display:grid;place-items:center;padding:48px 20px 72px}
.lg-card{width:min(440px,100%);padding:30px clamp(20px,4vw,34px) 32px;background:rgba(15,26,49,.92);border:1px solid var(--ruleD);border-top:3px solid var(--amberL);box-shadow:0 30px 60px -36px #000}
.lg-who{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin:-6px 0 20px;padding:10px 12px;border:1px solid rgba(242,169,73,.45);font-size:14.5px;color:var(--mute)}
.lg-who b{color:var(--fg);font-weight:500}
.lg-who a{color:var(--amberL);font-weight:500}
.lg-who[hidden]{display:none}
.lg-logo{display:block;height:40px;width:auto;margin-bottom:18px}
.lg h1{font:300 34px/1.1 var(--head);margin-top:10px;max-width:none}
.lg-tabs{display:flex;margin-top:24px;border:1px solid var(--ruleD)}
.lg-tabs button{flex:1;padding:10px 12px;font:500 15px var(--head);color:var(--mute);background:none;border:0;cursor:pointer}
.lg-tabs button[aria-pressed="true"]{background:var(--fg);color:var(--night)}
.lg-tabs button:not([aria-pressed="true"]):hover{color:var(--fg)}
#lForm{display:grid;gap:16px;margin-top:22px}
#lForm label{display:grid;gap:6px;font:500 13px var(--mono);letter-spacing:.06em;color:var(--mute)}
#lForm input{font:400 17px var(--head);color:var(--fg);background:var(--night);border:1px solid rgba(149,163,185,.4);padding:12px 14px;width:100%}
#lForm input:focus{outline:2px solid var(--amberL);outline-offset:1px;border-color:transparent}
#lForm .btn{justify-content:center;margin-top:6px;border:0;cursor:pointer}
#lForm .btn[disabled]{opacity:.6;cursor:wait}
.lg-msg{min-height:1.5em;font-size:15px;color:var(--amberL)}

.lg-pop{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:20px}
.lg-pop[hidden]{display:none}
.lg-pop-back{position:absolute;inset:0;background:rgba(7,12,24,.7)}
.lg-pop-in{position:relative;width:min(460px,100%);padding:28px 28px 26px;background:var(--white);color:var(--ink);border-top:3px solid var(--amber);box-shadow:0 30px 60px -30px #000}
.lg-pop-in h2{font:500 22px/1.25 var(--head)}
.lg-pop-in p{margin-top:10px;font-size:16px;color:var(--ink2)}
.lg-pop-acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:22px}
.lg-pop-acts .btn{background:var(--night);color:var(--fg);border:0;cursor:pointer}
.lg-pop-acts .btn:hover{background:var(--navy)}
.lg-pop-acts a{font-size:15px;color:var(--blue)}
@media (max-width:980px){.lg .nav nav{display:none}}
