:root{--sparda-blue:#005da4;--sparda-blue-dark:#004a84;--sparda-orange:#f39200;--bg-page:#ececec;--bg-input:#fafafa;--border-input:#555;--border-light:#d0d0d0;--text-primary:#333;--text-secondary:#555;--card-shadow:0 1px 4px #0000001f;--header-blue-bar:#005da4;--max-content-width:1200px}.app{background-color:var(--bg-page);flex-direction:column;min-height:100vh;display:flex}.header{border-bottom:1px solid var(--border-light);background:#fff}.header-first-row{background-color:var(--header-blue-bar);width:100%;height:8px}.header-second-row{max-width:var(--max-content-width);align-items:center;gap:8px;margin:0 auto;padding:12px 16px;display:flex}.header-logo{flex-shrink:0;width:auto;height:40px}.bank-name{color:var(--sparda-blue);font-size:1.125rem;font-weight:600;line-height:1.3}.spacer{flex:1}.frame-content-web-clients{max-width:var(--max-content-width);flex:1;width:100%;margin:0 auto;padding:24px 16px 32px}.login-row{flex-wrap:wrap;gap:0;display:flex}.login-section{flex-direction:column;flex:0 0 100%;order:1;display:flex}.teaser-section{flex:0 0 100%;order:2;padding-top:16px}.kf-tile{box-shadow:var(--card-shadow);background:#fff;border-radius:8px;overflow:hidden}.kf-tile-content{padding:0}.tile-padding-top{padding:24px 24px 0}.tile-padding-bottom{padding-bottom:24px}.info-tile{order:3;margin-top:16px}.login-tile{order:1}.kf-headline-headline{color:var(--sparda-blue);margin:0;font-size:1.75rem;font-weight:600;line-height:1.2}.info-message{color:var(--text-primary);padding:16px 24px 0;font-size:.9375rem;line-height:1.5}.info-message p{margin-bottom:12px}.info-message p:last-child{margin-bottom:0}.info-message a{color:var(--sparda-blue)}.upper-info{padding-bottom:8px}.info-tile .info-message{padding:24px}.login-form{padding:8px 24px 24px}.form-field{margin-bottom:12px}.mat-form-field{border:1px solid var(--border-input);background:#fff;border-radius:6px;padding:0;transition:border-color .2s;position:relative}.mat-form-field:focus-within{border-color:var(--sparda-blue)}.mat-form-field input{width:100%;color:var(--text-primary);background:0 0;border:none;border-radius:6px;outline:none;padding:14px 16px}.mat-form-field input::placeholder{color:#888}.mat-form-field-pin input{padding-right:48px}.pin-visibility-btn{color:#666;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:8px;display:flex;position:absolute;top:50%;right:4px;transform:translateY(-50%)}.pin-visibility-btn:hover{background:#0000000a}.mat-divider{background:var(--border-light);height:1px;margin:16px 0}.tile-actionbar-container{flex-direction:column-reverse;gap:12px;display:flex}.btn{border:2px solid var(--sparda-blue);letter-spacing:.01em;border-radius:24px;justify-content:center;align-items:center;width:100%;min-height:48px;padding:12px 24px;font-size:1rem;font-weight:600;transition:background .2s,color .2s;display:inline-flex}.btn-outlined{color:var(--sparda-blue);background:#fff}.btn-outlined:hover{background:#005da40a}.btn-primary{background:var(--sparda-blue);color:#fff;border-color:var(--sparda-blue)}.btn-primary:hover{background:var(--sparda-blue-dark);border-color:var(--sparda-blue-dark)}.teaser-link{color:inherit;text-decoration:none;display:block}.teaser-link:hover{text-decoration:none}.teaser-tile{flex-direction:column;display:flex}.teaser-image-container{width:100%;margin-bottom:0;overflow:hidden}.teaser-image{object-fit:cover;width:100%;height:auto;display:block}.teaser-footer{justify-content:space-between;align-items:center;padding:16px 24px 20px;display:flex}.teaser-headline{color:var(--text-primary);margin:0;font-size:1.125rem;font-weight:600}.teaser-arrow{color:var(--sparda-blue);align-items:center;display:flex}@media (width>=768px){.header-second-row{padding:16px 24px}.bank-name{font-size:1.25rem}.frame-content-web-clients{padding:32px 24px 48px}.login-section{flex:0 0 50%;order:unset;padding-right:16px}.teaser-section{flex:0 0 50%;order:unset;padding-top:0;padding-left:16px}.info-tile{order:unset;margin-top:24px}.tile-actionbar-container{flex-direction:row;justify-content:flex-start;align-items:center;gap:16px}.btn{border-width:1px;border-radius:4px;width:auto;min-width:120px;min-height:44px;padding:10px 20px}.btn-outlined{order:1}.btn-primary{order:2;margin-left:auto}}@media (width>=992px){.header-logo{height:48px}.bank-name{font-size:1.375rem}.kf-headline-headline{font-size:2rem}}@media (width<=767px){.login-section{display:contents}.login-tile{order:1}.teaser-section{order:2}.info-tile{order:3;margin-top:16px}.login-row{flex-direction:column;display:flex}.frame-content-web-clients{padding:16px 12px 24px}.tile-padding-top{padding:20px 20px 0}.info-message{padding:16px 20px 0}.login-form{padding:8px 20px 20px}.info-tile .info-message{padding:20px}.bank-name{font-size:.95rem}.header-logo{height:36px}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{color:#333;-webkit-font-smoothing:antialiased;background-color:#ececec;font-family:Segoe UI,Arial,Helvetica,sans-serif;font-size:16px;line-height:1.5}#root{min-height:100%}a{color:#005da4;text-decoration:none}a:hover{text-decoration:underline}button{cursor:pointer;font-family:inherit}input{font-family:inherit;font-size:16px}img{max-width:100%;display:block}