@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url('brands/poppins-400.woff2') format('woff2')}
@font-face{font-family:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url('brands/poppins-500.woff2') format('woff2')}
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url('brands/poppins-600.woff2') format('woff2')}
:root{font-family:Poppins,Arial,sans-serif;color:#111827;background:#fff;font-synthesis:none;color-scheme:light}
*,::before,::after{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,summary{cursor:pointer}[hidden]{display:none!important}
.login-layout{min-height:100svh;display:grid;grid-template-columns:54.338% 45.662%}
.brand-panel{background:linear-gradient(160deg,#1b2138,#13172a 58%,#0c0f1d);color:#fff;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:56px;min-height:100svh}
.brand-panel::before,.brand-panel::after{content:"";position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
.brand-panel::before{width:380px;height:380px;border:44px solid #ffa60012;right:-128px;top:-128px}
.brand-panel::after{width:280px;height:280px;border:1px solid #ffffff0f;left:-96px;bottom:-96px}
.brand-heading{align-self:center}.itno-logo{display:block;height:80px;width:auto;max-width:100%;object-fit:contain}
.brand-message{position:relative}.brand-message h1{max-width:448px;font-size:36px;line-height:1.1;font-weight:600;margin:0 0 12px}
.brand-message>p{font-size:18px;line-height:1.625;color:#ffffff99;margin:0;max-width:448px}
.product-brands{position:absolute;top:100%;left:0;list-style:none;display:flex;gap:28px;margin:32px 0 0;padding:0}
.product-brands li{display:flex;align-items:center;gap:8px;font-size:11px;color:#ffffff99;white-space:nowrap}
.product-brands img{width:24px;height:24px;object-fit:contain}.brand-footer{color:#6b7280;font-size:12px;line-height:16px}
.login-panel{display:flex;align-items:center;justify-content:center;padding:24px}.login-content{width:380px;max-width:100%;outline:none}.mobile-logo{display:none}
.welcome{font-size:12px;line-height:16px;letter-spacing:.14em;text-transform:uppercase;color:#e68a00;font-weight:600;margin:0}.login-heading h2{font-size:30px;line-height:36px;margin:4px 0 32px;font-weight:600}
form{display:flex;flex-direction:column}label{font-weight:500;font-size:14px;line-height:20px;margin-bottom:4px;color:#374151}
input:not([type=hidden]){width:100%;height:38px;border:1px solid #d1d5db;border-radius:6px;padding:8px 12px;background:#fff;color:#111827;font-size:14px;line-height:20px;box-shadow:0 1px 2px #0000000d}input::placeholder{color:#9ca3af}
.login-button{height:38px;border-radius:6px;border:1px solid transparent;display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px;line-height:20px;font-weight:500;padding:8px 12px;box-shadow:0 1px 2px #0000000d}
.microsoft-button{text-decoration:none;height:42px;background:#fff;border-color:#d1d5db;color:#374151;list-style:none}.microsoft-button::-webkit-details-marker{display:none}.microsoft-button:hover{background:#f9fafb}.microsoft-button img{object-fit:contain}
.local-form>input:not([type=hidden]){margin-bottom:24px}.password-field{position:relative}.password-field input{padding-right:40px}.password-toggle{position:absolute;right:0;top:0;width:38px;height:38px;display:grid;place-items:center;border:0;background:transparent;color:#9ca3af;border-radius:6px}.password-toggle:hover{background:#f3f4f6}.local-button{background:#ffa600;color:#000;margin-top:24px}.local-button:hover{background:#ed9900}
.login-divider{display:flex;align-items:center;gap:8px;color:#6b7280;font-size:14px;line-height:20px;margin:24px 0 16px}.login-divider::before,.login-divider::after{content:"";height:1px;background:#d1d5db;flex:1}
.microsoft-form{padding-top:20px}.login-error,.errorlist{color:#a12c29;font-size:14px;line-height:1.5}.login-error{background:#fff4f3;padding:12px;margin-bottom:20px;border-left:3px solid #a12c29}.errorlist{padding-left:20px}.login-notice{color:#626b7e;line-height:1.7}
:focus-visible{outline:3px solid #b36d00;outline-offset:3px}.skip-link{position:fixed;top:12px;left:12px;z-index:10;padding:10px 16px;background:white;color:#171b2e;transform:translateY(-160%);border-radius:4px}.skip-link:focus{transform:translateY(0)}
@media(max-width:1100px){.product-brands{gap:18px}.product-brands li{flex-direction:column;align-items:flex-start;gap:6px}}
@media(max-width:767px){.login-layout{display:flex}.brand-panel{display:none}.login-panel{width:100%;min-height:100svh}.mobile-logo{display:block;width:auto;height:48px;max-width:100%;margin:0 auto 32px}}
@media(max-height:650px) and (min-width:768px){.brand-panel{min-height:650px}}
.access-content{width:420px}.access-content .login-heading h2{font-size:32px;line-height:1.25;margin-bottom:24px}.access-lead{font-size:16px;line-height:1.75;color:#374151;margin:0 0 18px}.access-copy{font-size:14px;line-height:1.75;color:#6b7280;margin:0 0 26px}.access-contact{display:flex;align-items:center;gap:12px;margin:24px 0}.contact-monogram{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff4dd;color:#875200;font-size:14px;font-weight:600}.access-contact strong,.access-contact div>span{display:block}.access-contact strong{font-size:14px;font-weight:600}.access-contact div>span{font-size:12px;color:#6b7280;margin-top:3px}.contact-button{height:auto;min-height:44px;text-decoration:none;text-align:center}.contact-email{display:block;text-align:center;color:#4b5563;font-size:13px;margin:14px 0 26px;text-underline-offset:3px}.access-existing{font-size:12px;line-height:1.75;color:#6b7280;border-top:1px solid #e5e7eb;padding-top:22px;margin:0 0 18px}.access-back{font-size:13px;color:#374151;text-underline-offset:4px}
@media(max-width:767px){.access-content .login-heading h2{font-size:28px}.access-content{padding:20px 0}}
/* Designløft 19. oktober 2026: feltene får fokusring rundt hele feltet i stedet for en frittstående kontur. Rammen bruker fokusfargen #b36d00 for kontrast mot hvitt. */
input:not([type=hidden]),.login-button,.password-toggle{transition:border-color .15s,box-shadow .15s,background-color .15s,color .15s}input:not([type=hidden]):hover:not(:focus){border-color:#9ca3af}input:not([type=hidden]):focus-visible{outline:2px solid transparent;outline-offset:0;border-color:#b36d00;box-shadow:0 0 0 3px #ffa60033}
@media(prefers-reduced-motion:reduce){input:not([type=hidden]),.login-button,.password-toggle{transition:none}}
