/* Login layout using the existing Jasne zloto portal palette, logo and typography. */
.clientPortal .clientTopbar:not(.is-portal) .clientTopbarLabel,
.clientPortal .clientTopbar:not(.is-portal) .clientTopbarActions { display:none; }
.clientPortal #loginView { display:flex; justify-content:center; align-items:center; width:100%; max-width:none; min-height:calc(100svh - 82px); margin:0; padding:24px 32px 56px; }
.clientPortal #loginView[hidden] { display:none; }
.clientPortal #loginView::before,.clientPortal #loginView::after { display:none; }
.clientPortal .clientLoginSheet { display:grid; grid-template-columns:1.1fr 1fr; grid-template-areas:'hero form' 'hero note'; width:min(100%,1000px); border-radius:24px; background:var(--client-paper); box-shadow:0 24px 60px rgba(53,44,29,.1); border:1px solid var(--client-line); overflow:hidden; }
.clientPortal #loginView .clientHero { grid-area:hero; display:flex; flex-direction:column; gap:0; align-items:center; justify-content:center; position:relative; isolation:isolate; width:100%; padding:52px 38px; text-align:center; background:linear-gradient(135deg,var(--client-soft),var(--client-paper)); animation:none; }
.clientPortal #loginView .clientHero::before { content:''; position:absolute; z-index:-1; inset:14px; border:1px solid var(--client-line); border-radius:13px; pointer-events:none; }
.clientPortal #loginView .clientHero::after { display:none; }
.clientPortal #clientLoginTitle { width:100%; max-width:none; margin:0; color:var(--client-ink); font-size:clamp(46px,5vw,62px); font-weight:500; line-height:1.02; letter-spacing:-.025em; text-wrap:balance; }
.clientPortal #clientLoginTitle .clientLoginOpening { display:block; max-width:none; margin:0 auto 24px; font:400 17px/1.6 'Overpass',sans-serif; color:var(--client-muted); letter-spacing:0; }
.clientPortal #clientLoginTitle .clientLoginPersonal { display:block; }
.clientPortal #clientLoginTitle em { font-weight:500; color:var(--client-gold-deep); }
.clientPortal #loginView .clientCard { grid-area:form; align-self:center; width:100%; margin:0; padding:48px 38px 24px; background:transparent; border:0; border-radius:0; box-shadow:none; overflow:visible; animation:none; }
.clientPortal #loginView .clientCard::before { display:none; }
.clientPortal #loginView .clientCardHeader { gap:8px; text-align:left; justify-items:start; }
.clientPortal #loginView .clientCardHeader h2 { margin:0; color:var(--client-ink); font:600 32px/1.1 'Cormorant Garamond',serif; letter-spacing:-.025em; }
.clientPortal #loginView .clientCardHeader p { margin:0; max-width:310px; color:var(--client-muted); font-size:13px; line-height:1.55; }
.clientPortal #clientLoginForm { margin-top:28px; gap:18px; }
.clientPortal #clientLoginForm label { gap:8px; color:var(--client-ink); font-size:12px; font-weight:600; letter-spacing:0; text-transform:none; }
.clientPortal #clientLoginForm input { width:100%; min-height:54px; padding:13px 14px; font-size:16px; line-height:1.35; border-radius:12px; background:rgba(255,255,255,.8); border-color:rgba(169,124,40,.24); box-shadow:none; }
.clientPortal #clientLoginForm input:focus { border-color:rgba(169,124,40,.72); box-shadow:0 0 0 4px rgba(215,175,87,.14); outline:none; }
.clientPortal #clientLoginForm button { min-height:54px; margin-top:4px; padding:14px 17px; gap:12px; border:1px solid var(--client-gold); border-bottom-color:#b98d34; border-radius:12px; background:linear-gradient(180deg,#dfbb68,var(--client-gold)); color:#17130c; font-size:14px; line-height:1.35; font-weight:600; box-shadow:0 14px 30px rgba(169,124,40,.18); transition:background .2s,box-shadow .2s; }
.clientPortal #clientLoginForm button>span { flex:none; font-size:21px; line-height:1; color:inherit; }
.clientPortal #clientLoginForm button:hover { background:linear-gradient(180deg,var(--client-champagne-light),var(--client-gold)); box-shadow:0 14px 30px rgba(169,124,40,.24); }
.clientPortal #clientLoginForm button:focus-visible { outline:3px solid var(--client-gold-deep); outline-offset:3px; }
.clientPortal #clientLoginError { padding:10px 12px; font-size:13px; line-height:1.45; font-weight:600; }
.clientPortal #loginView .clientLoginIdea { grid-area:note; display:flex; align-items:center; justify-content:center; gap:7px; width:auto; margin:0 38px; padding:0 0 34px; color:#b24c61!important; font-size:12px; line-height:1.5; text-align:center; animation:clientLoveGlow 3.5s ease-in-out infinite; }
.clientPortal .clientLoginIdea>span:last-child { white-space:nowrap; }
.clientPortal .clientLoginHeart { display:inline-block; flex:none; font-size:17px; line-height:1; animation:clientLovePulse 3.5s ease-in-out infinite; }
@keyframes clientLovePulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.1); } }
@keyframes clientLoveGlow { 0%,100% { opacity:.95; } 50% { opacity:1; } }
@media(max-width:760px) {
 .clientPortal #loginView { min-height:calc(100svh - 70px); padding:8px 20px 28px; }
 .clientPortal .clientLoginSheet { width:min(100%,480px); grid-template-columns:1fr; grid-template-areas:'hero' 'form' 'note'; border-radius:22px; }
 .clientPortal #loginView .clientHero { padding:24px 28px 28px; }
 .clientPortal #loginView .clientHero::before { inset:10px; border-radius:12px; }
 .clientPortal #clientLoginTitle { font-size:clamp(42px,12vw,62px); }
 .clientPortal #clientLoginTitle .clientLoginOpening { max-width:250px; font-size:15px; line-height:1.5; margin-bottom:17px; }
 .clientPortal #loginView .clientCard { padding:27px 27px 22px; }
 .clientPortal #loginView .clientCardHeader { gap:6px; }
 .clientPortal #loginView .clientCardHeader h2 { font-size:30px; }
 .clientPortal #loginView .clientCardHeader p { font-size:12px; }
 .clientPortal #clientLoginForm { margin-top:22px; gap:15px; }
 .clientPortal #loginView .clientLoginIdea { margin:0 16px; padding-bottom:25px; font-size:11px; }
}
@media(max-width:760px) and (max-height:800px) {
 .clientPortal #loginView { min-height:calc(100svh - 70px); padding:4px 16px 14px; }
 .clientPortal #loginView .clientHero { padding:23px 23px 26px; }
 .clientPortal #clientLoginTitle { font-size:clamp(34px,10.5vw,48px); }
 .clientPortal #clientLoginTitle .clientLoginOpening { font-size:13px; line-height:1.4; margin-bottom:12px; }
 .clientPortal #loginView .clientCard { padding:21px 23px 17px; }
 .clientPortal #loginView .clientCardHeader h2 { font-size:28px; }
 .clientPortal #clientLoginForm { margin-top:17px; gap:12px; }
 .clientPortal #clientLoginForm input,.clientPortal #clientLoginForm button { min-height:48px; padding-block:11px; }
 .clientPortal #loginView .clientLoginIdea { padding-bottom:19px; }
}
@media(max-width:760px) and (max-height:620px) {
 .clientPortal #loginView .clientHero { padding:14px 22px; }
 .clientPortal #clientLoginTitle { font-size:32px; }
 .clientPortal #clientLoginTitle .clientLoginOpening { font-size:12px; margin-bottom:9px; }
 .clientPortal #loginView .clientCard { padding:14px 20px 10px; }
 .clientPortal #clientLoginForm { margin-top:13px; gap:10px; }
 .clientPortal #clientLoginForm label { gap:5px; }
 .clientPortal #loginView .clientLoginIdea { padding-bottom:16px; font-size:10.5px; }
}
@media(prefers-reduced-motion:reduce) { .clientPortal #loginView .clientLoginIdea,.clientPortal .clientLoginHeart { animation:none; } .clientPortal #clientLoginForm button { transition:none; } }

.clientPortal #clientLoginTitle .clientLoginOpening>span { display:block; }
@media(max-width:760px) and (max-height:800px) { .clientPortal #clientLoginTitle .clientLoginOpening>span { display:inline; } }
@media(max-width:360px) { .clientPortal #loginView { padding-inline:16px; } .clientPortal #loginView .clientCard { padding-inline:20px; } }
@media(max-width:760px) and (max-height:620px) { .clientPortal #loginView { padding-block:2px 8px; } .clientPortal #loginView .clientCardHeader h2 { font-size:24px; } }