/* FLOWMA Universal R5 login skin – served directly (no Vite rebuild needed). */
.flowma-auth-left { background: #fff !important; }
.flowma-login-brand-r5 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    margin-bottom: 32px;
}
.flowma-login-brand-img {
    display: block;
    width: min(100%, 280px);
    max-height: 108px;
    height: auto;
    object-fit: contain;
    object-position: left center;
}
.flowma-login-brand-tagline {
    margin: 0 0 0 2px;
    color: #6b8b92;
    font-weight: 500;
    font-size: 13px;
    letter-spacing: .015em;
}
.flowma-login-heading h1 { font-size: clamp(28px, 2.15vw, 34px); }
.flowma-login-heading p { font-size: 14px; line-height: 1.7; }
.flowma-auth-right {
    background: linear-gradient(155deg, #eff9fa 0%, #eaf4f7 54%, #e4f0f4 100%) !important;
}
.flowma-auth-right::before {
    width: min(70vw, 580px);
    height: min(70vw, 580px);
    background: radial-gradient(circle, rgba(106,180,194,.16) 0%, rgba(106,180,194,.05) 52%, transparent 70%);
}
.flowma-login-hero-r5 { width: min(94%, 820px); max-width: 820px; }
.flowma-login-hero-image {
    display: block;
    width: min(100%, 780px);
    height: auto;
    max-height: 62vh;
    object-fit: contain;
    margin: 0 auto;
    filter: drop-shadow(0 18px 22px rgba(38,89,108,.075));
}
.flowma-login-hero-r5 .flowma-illustration-copy { margin-top: 0; }
.flowma-login-hero-r5 .flowma-illustration-copy h2 {
    color: #245661;
    line-height: 1.14;
    font-size: clamp(26px, 2.3vw, 38px);
    max-width: 740px;
    margin: 0 auto 12px;
}
.flowma-login-hero-r5 .flowma-illustration-copy p {
    max-width: 580px;
    font-size: clamp(14px, 1vw, 16px);
    color: #597883;
}
@media (max-height: 730px) and (min-width: 901px) {
  .flowma-login-brand-r5 { margin-bottom: 22px; }
  .flowma-login-footer { margin-top: 20px; }
  .flowma-login-hero-image { max-height: 54vh; }
}
@media (max-width: 900px) {
  .flowma-login-brand-img { width: min(72%, 290px); }
}