@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;750&display=swap');
.login-design{--ink:#102f3d;--muted:#526b77;--line:#d5e5e9;background:white;color:var(--ink);font:17px/1.5 Inter,Arial,sans-serif}
.login-design .login-shell{display:grid;grid-template-columns:1fr 1fr;min-height:100svh}
.login-design .login-story{display:flex;flex-direction:column;justify-content:flex-start;gap:32px;padding:40px clamp(28px,4vw,72px);border-right:1px solid #dce9ed;background:radial-gradient(ellipse at 45% 70%,#dcf2f4,transparent 65%),#f5f8fb}
.login-design .brand .direction-logo{width:220px}
.login-story-content{display:flex;flex-direction:column;justify-content:center;flex:1;width:100%;max-width:560px;margin:auto;padding:16px 0}
.login-design .login-story h2{font:750 clamp(36px,4vw,64px)/1.1 Inter,Arial,sans-serif;letter-spacing:-.045em;max-width:none}
.login-design .login-story p{font-size:18px;line-height:1.6;color:#526b77;max-width:440px;margin-top:20px}
.login-design .orbit{width:100%;height:auto;aspect-ratio:520/320;margin:38px 0 0;position:relative}
.orbit-paths{position:absolute;inset:0;width:100%;height:100%;stroke:#a5d6df;stroke-width:1.5}
.login-design .orbit-center{position:absolute;left:50%;top:50%;width:60px;height:60px;transform:translate(-50%,-50%);background:#fff;padding:12px;border-radius:20px;box-shadow:0 12px 32px #007f9817}
.login-design .orbit-center img{width:100%;height:100%}
.login-design .orbit-label{position:absolute;transform:translate(-50%,-50%);border:1px solid #bedce3;border-radius:12px;background:white;padding:12px 16px;font-size:16px;line-height:1.3;white-space:nowrap;color:#365966;box-shadow:0 5px 18px #0a3f4d08}
.login-design .orbit-label.one{left:18.9%;top:66.4%;bottom:auto;right:auto}
.login-design .orbit-label.two{left:81.1%;top:33.6%;bottom:auto;right:auto}
.login-design .orbit-label.three{left:50%;top:90.625%;bottom:auto;right:auto}
.login-design .login-main{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;padding:112px 40px 64px;background:white}
.login-design .login-back{position:absolute;top:34px;right:40px;font-size:16px;color:#526b77}
.login-design .login-back:hover{color:#007f98}
.login-design .login-form{width:100%;max-width:420px;min-height:454px}
.login-design .login-form:before{content:none}
.login-design .login-form h1{font:750 clamp(32px,3vw,44px)/1.15 Inter,Arial,sans-serif;letter-spacing:-.04em;margin:0 0 16px}
.login-design .login-form>.login-intro{font-size:18px;line-height:1.6;color:#526b77;margin-bottom:28px}
.login-design .login-options{display:grid;gap:12px;margin:0}
.login-design .login-provider{width:100%;min-height:56px;margin:0;padding:14px 18px;border:1px solid #c7dce3;border-radius:10px;font-size:16px;font-weight:600;gap:12px;line-height:1.5;background:white;color:#173341;box-shadow:none}
.login-design .login-provider:hover{background:#f0f8fa;border-color:#007f98;transform:none}
.login-provider svg{flex-shrink:0}
.login-design .login-provider.provider-email,.login-design .email-submit{background:#007f98;border-color:#007f98;color:#fff}
.login-design .provider-email:hover,.login-design .email-submit:hover{background:#006b81;transform:none}
.login-or{display:flex;gap:18px;align-items:center;color:#647c86;font-size:16px;justify-content:center;padding:2px 0}
.login-or:before,.login-or:after{content:'';height:1px;background:#dce7eb;flex:1}
.login-design .email-panel{margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#173341}
.email-panel label{display:block;font-size:17px;font-weight:600;margin:0 0 8px}
.email-panel input{display:block;width:100%;min-height:54px;padding:12px 14px;border:1px solid #bcd3dc;border-radius:10px;background:#fff;color:#173341;font-size:18px;margin-bottom:22px}
.login-design .email-submit{width:100%;min-height:54px;font-size:17px;margin-top:2px;border-radius:10px}
.email-back{display:block;border:0;background:transparent;color:#426471;font-size:16px;padding:10px 0;margin:16px 0 0;text-align:left}
.email-back:hover{color:#007f98;text-decoration:underline}
.login-design a:focus-visible,.login-design button:focus-visible,.login-design input:focus-visible{outline:3px solid #5ac5d3;outline-offset:3px}
.provider-notice,#login-error,#email-login-error{font-size:16px;line-height:1.6;padding:12px 16px;border:1px solid #c9dfe5;border-radius:10px;background:#eff7f9;margin:16px 0;color:#365966}
#login-error,#email-login-error{color:#a32626;background:#fff3f3;border-color:#f2c9cc}
.login-mobile-brand{display:none}
@media(max-width:1000px){.login-design .login-story{padding:32px 28px}.login-design .login-main{padding-left:28px;padding-right:28px}.login-design .orbit-label{padding:10px 12px;font-size:16px;white-space:normal;text-align:center;max-width:140px}.login-design .orbit{margin-top:40px}}
@media(max-width:760px){.login-design .login-shell{grid-template-columns:1fr}.login-design .login-story{display:none}.login-design .login-main{min-height:100svh;padding:100px 24px 44px}.login-design .login-back{right:24px;top:28px}.login-design .login-form{max-width:420px;min-height:0}.login-mobile-brand{display:block;margin-bottom:36px}.login-design .login-mobile-brand .direction-logo{width:190px}.login-design .login-form h1{font-size:34px}.login-design .login-options .login-provider{font-size:16px}.login-design .login-form>.login-intro{font-size:17px}}
@media(max-width:760px){.login-design .login-main{justify-content:flex-start}}

@media(min-width:761px) and (max-width:1000px){.login-design .orbit-center{width:48px;height:48px;padding:8px}.login-design .orbit-label{width:112px;padding:10px 8px}}
@media(min-width:761px) and (max-width:1000px){.login-design .orbit{width:calc(100% + 56px);margin-left:-28px}}
