:root{
  --blue-900:#012A72;
  --blue-700:#00578D;
  --blue-500:#017DBD;
  --yellow:#F9C00E;
  --offwhite:#F6F5F0;
  --gray:#565658;
  --border:rgba(1,42,114,.12);
  --bg-soft:rgba(1,125,189,.10);
  --gradient:linear-gradient(135deg,#012A72 0%,#00578D 55%,#017DBD 100%);
  --shadow-card:0 18px 50px rgba(1,42,114,.22);
  --radius-sm:10px;
  --radius-md:16px;
  --ease:220ms cubic-bezier(.2,.7,.3,1);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  font-family:system-ui,-apple-system,'Segoe UI',sans-serif;
  color:var(--gray);
  background:var(--offwhite);
  -webkit-font-smoothing:antialiased;
}
/* ============ LAYOUT ============ */
.page{
  display:grid;
  grid-template-columns:minmax(0, 7fr) minmax(0, 3fr);
  min-height:100vh;
}

/* ============ VITRINE (esquerda) ============ */
.vitrine{
  position:relative;
  background:var(--gradient);
  color:#fff;
  padding:40px 48px 32px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
/* textura tipo planta baixa */
.vitrine::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(120% 90% at 20% 10%,#000 0%,transparent 75%);
  pointer-events:none;
}
.vitrine::after{
  content:"";
  position:absolute;
  right:-160px;bottom:-200px;
  width:520px;height:520px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(249,192,14,.20) 0%,rgba(249,192,14,0) 65%);
  pointer-events:none;
}
.vitrine > *{position:relative;z-index:1}

.brand{display:flex;align-items:center;gap:14px;margin-bottom:auto}
.brand img{height:34px;filter:brightness(0) invert(1)}
.brand .sep{width:1px;height:22px;background:rgba(255,255,255,.28)}
.brand .sub{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.72);font-weight:500}

.pitch{max-width:620px;margin:44px 0 26px}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--yellow);
  margin-bottom:16px;
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--yellow);display:block}
.pitch h1{
  font-size:clamp(26px,2.5vw,40px);
  line-height:1.14;
  letter-spacing:-.02em;
  font-weight:700;
  margin:0 0 14px;
  color:#fff;
}
.pitch h1 em{font-style:normal;color:var(--yellow)}
.pitch p{
  margin:0;
  font-size:15px;
  line-height:1.6;
  color:rgba(255,255,255,.78);
  max-width:520px;
}

/* --- área de propaganda (embed) --- */
.login-news{
  background:transparent;
  border-radius:0;
  box-shadow:none;
  overflow:hidden;
  position:relative;
  max-width:620px;
  width:100%;
}
.login-news-body{position:relative;height:270px;background:transparent;overflow:hidden}
.login-news-body iframe{width:100%;height:100%;border:0;display:block}
/* Conteúdo local exibido enquanto o banner externo não carrega. */
.login-news-fallback{position:absolute;inset:0;display:none}
.login-news-fallback.on{display:block}
.slide{
  position:absolute;inset:0;
  padding:26px 30px;
  display:flex;flex-direction:column;justify-content:center;
  opacity:0;transition:opacity 500ms ease;
  background:#fff;
}
.slide.active{opacity:1}
.slide .chip{
  align-self:flex-start;
  font-size:9.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--blue-700);background:var(--bg-soft);
  padding:4px 10px;border-radius:999px;margin-bottom:12px;
}
.slide h3{margin:0 0 8px;font-size:21px;line-height:1.25;color:var(--blue-900);letter-spacing:-.01em}
.slide p{margin:0 0 16px;font-size:13.5px;line-height:1.55;color:var(--gray);max-width:78%}
.slide a{
  align-self:flex-start;
  font-size:12.5px;font-weight:600;color:var(--blue-900);
  background:var(--yellow);padding:9px 16px;border-radius:var(--radius-sm);
  text-decoration:none;transition:transform var(--ease),filter var(--ease);
}
.slide a:hover{transform:translateY(-1px);filter:brightness(1.05)}
/* ============ LOGIN (direita) ============ */
.painel{
  background:var(--offwhite);
  display:flex;flex-direction:column;
  padding:32px 44px 22px;
  position:relative;
}
.form-wrap{margin:auto 0;width:100%;max-width:360px;align-self:center}

.client-logo{
  height:64px;margin-bottom:26px;
  display:flex;align-items:center;justify-content:center;
}
.client-logo img{max-height:100%;max-width:78%;object-fit:scale-down}
.titulo{font-size:22px;font-weight:600;color:var(--blue-900);letter-spacing:-.015em;margin:0 0 4px}
.subtitulo{font-size:13px;color:var(--gray);margin:0 0 24px}
.subtitulo a{color:var(--blue-500);font-weight:600;text-decoration:none}
.subtitulo a:hover{text-decoration:underline}

.btn-entrar{
  width:100%;
  font-family:inherit;font-size:14.5px;font-weight:600;letter-spacing:.01em;
  color:var(--blue-900);
  background:var(--yellow);
  border:0;border-radius:var(--radius-sm);
  padding:14px;margin-top:6px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:9px;
  box-shadow:0 6px 18px rgba(249,192,14,.35);
  transition:transform var(--ease),box-shadow var(--ease),filter var(--ease);
}
.btn-entrar:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(249,192,14,.45);filter:brightness(1.04)}
.btn-entrar:active{transform:translateY(0)}
.btn-entrar[disabled]{background:#e2e4e8;color:#9aa1ad;box-shadow:none;cursor:not-allowed;transform:none}

.esqueci{
  display:block;text-align:right;margin-top:12px;
  font-size:12.5px;font-weight:500;color:var(--blue-500);
  background:none;border:0;cursor:pointer;font-family:inherit;margin-left:auto;
}
.esqueci:hover{color:var(--blue-900);text-decoration:underline}

.divisor{display:flex;align-items:center;gap:12px;margin:22px 0 16px}
.divisor::before,.divisor::after{content:"";flex:1;height:1px;background:var(--border)}
.divisor span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#a3a9b5;font-weight:500}

.painel-foot{margin-top:auto;padding-top:22px}
.suporte{
  display:flex;align-items:center;gap:10px;justify-content:center;
  background:#fff;border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:10px 14px;
  font-size:12px;color:var(--gray);
}
.suporte a{
  display:inline-flex;align-items:center;gap:6px;
  color:#1a9e50;font-weight:600;text-decoration:none;
}
.suporte a:hover{text-decoration:underline}
/* ============ RESPONSIVO ============ */
@media (max-width:1180px){
  .vitrine{padding:32px 34px 26px}
  .painel{padding:28px 32px 20px}
}
@media (max-width:960px){
  .page{grid-template-columns:1fr}
  .vitrine{order:2;padding:34px 24px 30px;min-height:auto}
  .vitrine .brand{margin-bottom:26px}
  .pitch{margin:0 0 22px}
  .painel{order:1;min-height:100vh;padding:26px 22px 18px}
}
@media (max-width:520px){
  .painel{padding:22px 18px 16px}
  .login-news-body{height:300px}
  .slide p{max-width:100%}
}

.cadastro-conta-dialog .ui-dialog-titlebar-close {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.cadastro-conta-dialog .cadastro-conta-select {
    width: calc(100% - 1em - 2px) !important;
    margin: 0.5em auto !important;
    display: block;
}

.cadastro-conta-dialog .cadastro-conta-select .ui-selectonemenu-label {
    width: calc(100% - 2.6em);
}

.cadastro-conta-acoes-etapa1 {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.cadastro-conta-acao-botao {
    min-width: 128px;
}

@media (max-width: 640px) {
    .cadastro-conta-acoes-etapa1 .cadastro-conta-acao-botao {
        width: 100%;
    }
}

/* JSF controls retain their actions; these rules adapt their generated markup. */
.page { min-height: 100vh; }
.painel > form { width: 100%; margin: auto 0; padding: 35px 0; }
.login-info { width: 100%; max-width: 360px; margin: 0 auto; }
.client-logo img { max-height: 64px; max-width: 80%; object-fit: contain; }
.vitrine .brand img { object-fit: contain; }
.login-label { display: block; margin: 15px 0 6px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #344b70; }
.login_input { box-sizing: border-box; display: block; width: 100%; margin: 6px 0 14px; padding: 13px 14px; border: 1.5px solid #dce2eb; border-radius: 8px; background: white; color: #012a72; font: inherit; font-size: 14px; box-shadow: none; }
.login_input:focus { outline: 2px solid #017dbd; outline-offset: 2px; }
.login-password { position: relative; }
.login-password .login_input { padding-right: 48px; }
.login-password .toggle { position: absolute; right: 6px; top: 6px; width: 34px; height: 34px; background: transparent; border: 0; color: #466388; border-radius: 6px; cursor: pointer; }
.painel .btn-entrar { height: 48px; background: #f9c00e; color: #012a72; border: 0; border-radius: 8px; font-weight: 700; text-shadow: none; }
.painel .btn-entrar.ui-state-disabled { background: #e2e4e8; color: #677180; box-shadow: none; opacity: 1; }
.painel .esqueci { background: transparent; border: 0; box-shadow: none; color: #017dbd; font-size: 12px; }
.login-acoes-secundarias { display: flex; gap: 10px; }
.painel .login-acao-botao { flex: 1; height: 42px; background: white; border: 1px solid #dce2eb; border-radius: 8px; color: #012a72; font-size: 12px; }
.login-versao { display: block; margin-top: 12px; color: #858d9b; font-size: 11px; text-align: left; }
.login-tag { display: flex; align-items: center; gap: 6px; }
.login-tag .login_input { min-width: 0; flex: 1; }
.login-tag .ui-button { flex-shrink: 0; }
.suporte { flex-wrap: wrap; text-align: center; }
.login-news-body iframe { position: relative; z-index: 1; visibility: hidden; }
.login-news-body iframe.loaded { visibility: visible; }
.login-news-fallback { z-index: 0; }
a:focus-visible, button:focus-visible { outline: 2px solid #017dbd; outline-offset: 3px; }
.ui-dialog { max-width: calc(100vw - 24px); }
.label-titulo { font-weight: bold; display: block; margin-bottom: 5px; }
.dialog-acao-botao { padding: 0 !important; }
@media (max-width: 960px) { .painel { min-height: 100svh; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* Override PrimeFaces theme specificity without changing shared controls. */
body .painel .login_input { height: 48px; margin: 6px 0 14px; padding: 13px 14px; border: 1.5px solid #dce2eb; border-radius: 10px; font-size: 14px; color: #012a72; }
body .painel .login-password .login_input { padding-right: 48px; }
body .painel .login_input:focus { border-color: #017dbd; outline: 2px solid #017dbd; outline-offset: 2px; box-shadow: none; }
body .painel .login-label { font-size: 11px; font-weight: 700; }
body .painel .btn-entrar,
body .painel .login-acao-botao,
body .painel .esqueci { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
body .painel .btn-entrar .ui-button-icon-left,
body .painel .login-acao-botao .ui-button-icon-left,
body .painel .esqueci .ui-button-icon-left { position: static; margin: 0; }
body .painel .btn-entrar .ui-button-text,
body .painel .login-acao-botao .ui-button-text,
body .painel .esqueci .ui-button-text { padding: 0; }
body .painel .esqueci { display: flex; width: fit-content; margin: 12px 0 0 auto; padding: 4px 0; }
.client-logo img { width: 260px; }
.vitrine { padding-bottom: 32px; }
@media (max-width: 960px) { .vitrine { padding-bottom: 30px; } }
body .painel .esqueci.ui-state-focus,
body .painel .esqueci.ui-state-hover { background: #e7f0f7; color: #00578d; }
.login-news-fallback[hidden] { display: none; }

.login-stats { display: flex; flex-wrap: wrap; gap: 34px; margin-top: 26px; }
.login-stat-numero { color: #fff; font-size: 20px; font-weight: 700; letter-spacing: -.01em; line-height: 1.1; }
.login-stat-numero span { color: var(--yellow); }
.login-stat-legenda { margin-top: 3px; color: rgba(255,255,255,.6); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
@media (max-width: 960px) { .login-stats { gap: 22px; } }

.login-input-box { position: relative; }
.login-input-icon { position: absolute; left: 14px; top: 17px; color: #a6b5cc; font-size: 13px; pointer-events: none; }
body .painel .login-input-box .login_input { padding-left: 40px; }
body .painel .login-input-box .login_input::placeholder { color: #a9b0bd; opacity: 1; }
.login-password .toggle { color: #a6b5cc; }
.login-password .toggle:hover { color: #00578d; background: #e7f0f7; }

.suporte { gap: 8px; padding: 10px 12px; }
.suporte-contato { display: inline-flex; align-items: center; gap: 7px; }
.suporte-contato > i { color: var(--blue-500); }

/* Desktop: apresentação e banner usam 55% da altura da janela. */
.login-showcase { display: flex; flex-direction: column; height: 55vh; min-height: 420px; margin-top: 44px; }
.login-showcase .pitch { margin: 0 0 26px; flex-shrink: 0; }
.login-showcase .login-news { display: flex; flex-direction: column; flex: 1; min-height: 160px; }
.login-showcase .login-news-body { flex: 1; min-height: 124px; }
/* Recorta os 10px de margem interna da página de banner externa. */
.login-showcase .login-news-body iframe { position: absolute; top: -10px; left: -10px; width: calc(100% + 20px); height: calc(100% + 20px); }
@media (max-width: 960px) {
    .login-showcase { height: auto; min-height: auto; margin-top: 0; }
    .login-showcase .login-news { flex: none; }
}
@media (max-width: 520px) { .login-showcase .login-news-body { min-height: 300px; } }

@media (min-width: 961px) {
    .vitrine .brand { margin-bottom: 32px; }
    .vitrine .login-showcase { width: 100%; max-width: 720px; margin: auto 0; }
}

.login-google {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    min-height: 46px;
    margin-bottom: 16px;
    padding: 12px 16px;
    border: 1px solid #dce2eb;
    border-radius: 10px;
    background: #fff;
    color: #344054;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    opacity: 1;
    cursor: default;
}
.login-google > i { color: #4285f4; font-size: 18px; }

/* Hierarquia do formulário: acesso, cadastro e alternativa social. */
.painel .login-info,
.painel .painel-foot { width: 100%; max-width: 400px; align-self: center; }
.painel .client-logo { justify-content: flex-start; height: 48px; margin-bottom: 30px; }
.painel .client-logo img { width: auto; max-width: 200px; max-height: 48px; }
.painel .titulo { font-size: 28px; line-height: 1.2; font-weight: 700; letter-spacing: -.025em; }
.painel .subtitulo { margin: 8px 0 26px; font-size: 14px; color: #707986; }
body .painel .login-label { margin: 0 0 8px; font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; }
body .painel .login-input-box .login_input { margin: 0 0 20px; }
.login-password-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
body .painel .login-text-link { width: auto; min-height: 0; height: auto; padding: 0; border: 0; border-radius: 3px; background: transparent; color: #017dbd; box-shadow: none; font-size: 13px; font-weight: 600; }
body .painel .login-text-link .ui-button-text { padding: 0; line-height: 1.5; }
body .painel .login-text-link:hover { color: #012a72; text-decoration: underline; background: transparent; }
body .painel .btn-entrar { margin-top: 0; box-shadow: none; font-size: 14px; border-radius: 8px; }
body .painel .btn-entrar:hover { box-shadow: 0 4px 12px rgba(249,192,14,.2); }
.login-signup { display: flex; align-items: baseline; justify-content: center; gap: 5px; margin-top: 18px; color: #707986; font-size: 13px; }
.painel .divisor { margin: 26px 0 22px; }
.painel .login-google { min-height: 44px; margin: 0; border-radius: 8px; font-weight: 500; }
.login-google svg { flex-shrink: 0; }
.painel .login-acoes-secundarias { display: flex; justify-content: center; margin-top: 18px; }
body .painel .login-ponto {
    align-items: center;
    background: #f8fbfd;
    border: 1px solid #d7e3ec;
    border-radius: 8px;
    box-shadow: none;
    color: #17445f;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
}
body .painel .login-ponto .ui-button-text { line-height: 1.2; padding: 0; }
body .painel .login-ponto .ui-button-icon-left {
    align-items: center;
    background: #e7f1f7 !important;
    border-radius: 50%;
    color: #017dbd;
    display: inline-flex;
    height: 24px;
    justify-content: center;
    margin: 0;
    position: static;
    width: 24px;
}
body .painel .login-ponto:hover {
    background: #eef7fb;
    border-color: #9fc9df;
    color: #005d87;
}
@media (max-width: 640px) {
    body .painel .login-text-link { min-height: 28px; }
    .painel .titulo { font-size: 26px; }
}
body .painel .login-ponto { width: fit-content; margin: 0 auto; }


/* Layout da referência: cabeçalho, vitrine e cartão de acesso. */
:root { --blue-900:#082b50; --yellow:#f7c253; --gray:#7d8798; --offwhite:#f8f7f4; }
body { background:var(--offwhite); }
.login-header { max-width:1600px; margin:auto; min-height:120px; padding:36px 5.7%; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { margin:0; gap:24px; }
.brand img { width:140px; height:auto; filter:none; }
.brand .sep { height:30px; background:#9ba8b8; }
.brand .sub { color:#395370; font-weight:600; letter-spacing:.22em; }
.login-manifesto { display:flex; gap:24px; color:#536780; font-size:10px; letter-spacing:.24em; text-transform:uppercase; }
.login-manifesto span + span { border-left:1px solid #a7b2c0; padding-left:24px; }
.login-manifesto span:last-child { position:relative; }
.login-manifesto span:last-child::after { content:""; position:absolute; bottom:-15px; right:0; width:44px; height:3px; background:var(--yellow); border-radius:3px; }
.page { max-width:1600px; margin:0 auto; padding:0 2.4% 32px; grid-template-columns:minmax(0,2.1fr) minmax(360px,1fr); gap:0; align-items:start; min-height:0; }
.vitrine { padding:0; display:block; overflow:visible; background:none; min-width:0; }
.vitrine::before,.vitrine::after { display:none; }
.vitrine .login-showcase { position:relative; width:100%; max-width:none; height:clamp(650px,53vw,790px); min-height:0; margin:0; padding:8.5% 5.5% 6%; overflow:hidden; border-radius:36px 85px 60px 36px; background:linear-gradient(90deg,rgba(3,28,46,.30),rgba(5,39,67,.12) 52%,transparent 75%),url('../imagem/login-obra-dia-v2.png.xhtml') center top / auto 115%; }
.login-showcase .pitch { position:relative; z-index:2; width:60%; max-width:none; margin:0; }
.pitch .eyebrow { color:#c0ccda; font-size:9px; letter-spacing:.19em; white-space:nowrap; margin-bottom:44px; gap:20px; }
.pitch .eyebrow::before { width:36px; height:3px; flex-shrink:0; }
.pitch h1 { font-size:clamp(30px,3.55vw,54px); line-height:1.12; letter-spacing:-.035em; margin:0 0 30px; }
.pitch h1 span,.pitch h1 em { display:block; white-space:nowrap; }
.login-showcase .pitch p { display:block; max-width:380px; font-size:clamp(14px,1.24vw,18px); line-height:1.45; color:#c6d0db; }
.login-benefits { position:relative; z-index:2; display:grid; gap:26px; margin-top:42px; width:47%; }
.login-benefit { display:flex; align-items:center; gap:26px; }
.login-benefit > i { width:62px; height:64px; flex-shrink:0; display:grid; place-items:center; border-radius:19px; background:rgba(130,167,194,.13); color:var(--yellow); font-size:28px; }
.login-benefit strong { display:block; color:#fff; font-size:16px; margin-bottom:5px; }
.login-benefit span { display:block; color:#c6d0db; font-size:14px; line-height:1.4; }
.login-phone { position:absolute; z-index:1; top:17%; right:13%; width:28%; aspect-ratio:auto; height:auto; padding:20px 6px 6px; border:2px solid #9ca6b0; border-radius:32px; background:#0a1018; box-shadow:8px 3px 0 #52606c,12px 5px 0 #a0a7ad,15px 28px 35px #00101b80; transform:none; overflow:hidden; }
.login-phone::after { content:""; position:absolute; top:7px; left:37%; width:26%; height:7px; background:#060b11; border-radius:20px; }
.login-phone img { width:100%; height:auto; display:block; border-radius:24px; }
.vitrine .login-stats { display:grid; grid-template-columns:.9fr 1.3fr 1fr; gap:0; margin:26px 0 0; padding:0 3%; }
.login-stat { display:flex; align-items:center; gap:20px; padding:0 18px; }
.login-stat + .login-stat { border-left:1px solid #d2d7dd; }
.login-stat > i { display:grid; place-items:center; width:54px; height:54px; flex-shrink:0; background:#eeefed; border-radius:50%; color:#254366; font-size:24px; }
.login-stat strong { display:block; color:#142e53; font-size:18px; white-space:nowrap; }
.login-stat span { display:block; color:#7f8ba0; font-size:9px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; margin-top:5px; }
.painel { margin-top:34px; min-width:0; padding:48px 9% 24px; border-radius:24px; background:rgba(255,255,255,.92); box-shadow:0 14px 40px #26354a08; min-height:780px; }
.painel > form { margin:0; padding:0; }
.login-info { max-width:380px; }
.painel .client-logo { flex-direction:column; align-items:flex-start; justify-content:center; height:80px; margin-bottom:30px; }
.client-logo-caption { margin-top:9px; color:#395370; font-size:10px; text-transform:uppercase; letter-spacing:.3em; }
.painel .client-logo img { width:170px; max-width:78%; max-height:60px; object-fit:contain; object-position:left; }
.painel .titulo { font-size:28px; font-weight:700; color:#092c50; }
.painel .subtitulo { font-size:15px; margin-bottom:28px; color:#7d8798; }
body .painel .login-label { font-size:13px; letter-spacing:0; text-transform:none; color:#203b60; margin-top:18px; }
body .painel .login_input { height:48px; border-color:#e0e5ed; font-size:14px; }
body .painel .btn-entrar { margin-top:10px; height:50px; background:var(--yellow); color:#092e50; }
.painel .painel-foot { position:static; transform:none; padding-top:42px; margin-top:auto; width:100%; }
.suporte { font-size:10px; padding:10px 7px; gap:8px; white-space:nowrap; }
.login-versao { text-align:center; }
@media (min-width:1600px) { .pitch h1 { font-size:54px; } }
@media (max-width:1200px) and (min-width:961px) {
 .page { grid-template-columns:minmax(0,1.65fr) minmax(340px,1fr); gap:16px; }
 .login-header { min-height:100px; }
 .vitrine .login-showcase { height:730px; padding-top:48px; }
 .pitch h1 { font-size:34px; }
 .pitch .eyebrow { font-size:7px; gap:10px; }
 .login-showcase .pitch { width:72%; }
 .login-showcase .pitch p { max-width:280px; }
 .login-phone { width:31%; right:7%; top:38%; }
 .login-benefits { width:65%; }
 .login-benefit { gap:15px; }
 .login-stat { gap:8px; padding:0 8px; }
 .login-stat > i { width:32px; height:32px; font-size:17px; }
 .login-stat strong { font-size:15px; }
 .painel { padding:35px 7% 24px; margin-top:0; }
}
@media (max-width:960px) {
 .login-header { padding:24px; min-height:90px; }
 .login-manifesto { display:none; }
 .page { display:flex; flex-direction:column; padding:0 20px 28px; gap:28px; }
 .painel { order:0; width:100%; max-width:520px; align-self:center; margin:0; min-height:0; padding:32px; }
 .painel .painel-foot { padding-top:30px; }
 .vitrine { order:1; width:100%; }
 .vitrine .login-showcase { height:690px; padding:45px 6%; border-radius:30px; }
 .pitch h1 { font-size:clamp(30px,5vw,46px); }
 .pitch .eyebrow { font-size:8px; margin-bottom:30px; }
 .login-showcase .pitch p { max-width:330px; }
 .login-phone { right:8%; top:28%; width:28%; }
 .login-benefits { margin-top:30px; }
 .vitrine .login-stats { padding:0; }
 .login-stat { gap:12px; padding:0 12px; }
 .login-stat > i { width:36px; height:36px; font-size:18px; }
 .login-stat strong { font-size:16px; }
}
@media (max-width:600px) {
 .login-header { justify-content:center; padding:22px 16px; }
 .brand { gap:16px; }
 .brand img { width:110px; }
 .brand .sub { font-size:9px; }
 .page { padding:0 12px 24px; }
 .painel { padding:28px 22px 22px; }
 .painel .titulo { font-size:26px; }
 .suporte { white-space:normal; }
 .vitrine .login-showcase { height:auto; min-height:890px; padding:32px 24px; }
 .login-showcase .pitch { width:100%; }
 .pitch .eyebrow { white-space:normal; font-size:7px; line-height:1.6; gap:12px; }
 .pitch h1 { font-size:clamp(25px,7.2vw,40px); }
 .login-showcase .pitch p { font-size:14px; }
 .login-benefits { width:100%; gap:18px; }
 .login-benefit > i { width:46px; height:48px; font-size:23px; border-radius:14px; }
 .login-benefit { gap:18px; }
 .login-benefit strong { font-size:14px; }
 .login-benefit span { font-size:12px; }
 .login-phone { position:relative; top:auto; right:auto; width:145px; margin:32px auto 0; border-radius:23px; padding:16px 5px 5px; }
 .login-phone img { border-radius:16px; }
 .login-phone::after { height:6px; top:6px; }
 .vitrine .login-stats { grid-template-columns:1fr; gap:18px; margin:24px auto 0; width:max-content; }
 .login-stat + .login-stat { border:0; }
}

/* A composição desktop acompanha a janela, inclusive em monitores largos. */
@media (min-width:961px) {
 body { min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; }
 .login-header { width:100%; max-width:none; margin:0; flex:0 0 clamp(76px,11.4vh,120px); min-height:0; padding:20px 5.7%; }
 .page { width:100%; max-width:none; margin:0; flex:1; min-height:calc(100dvh - clamp(76px,11.4vh,120px)); padding-bottom:16px; align-items:stretch; }
 .vitrine { display:flex; flex-direction:column; min-height:0; }
 .vitrine .login-showcase { flex:1; height:auto; min-height:0; padding-top:clamp(28px,7.5vh,80px); padding-bottom:28px; background-size:cover; background-repeat:no-repeat; }
 .vitrine .login-stats { flex:0 0 54px; margin-top:20px; }
 .painel { margin-top:clamp(0px,3.2vh,34px); min-height:0; padding-top:clamp(22px,4.5vh,48px); padding-bottom:20px; }
 .login-phone { width:clamp(180px,24vh,280px); height:auto; max-width:30%; top:18%; aspect-ratio:auto; }
 .pitch .eyebrow { margin-bottom:clamp(20px,4.2vh,44px); }
 .pitch h1 { font-size:clamp(30px,min(3.55vw,5.2vh),64px); margin-bottom:clamp(18px,2.8vh,30px); }
 .login-benefits { margin-top:clamp(24px,4vh,42px); gap:clamp(16px,2.5vh,26px); }
 .login-benefit > i { height:clamp(44px,6vh,64px); width:clamp(44px,6vh,62px); }
}
@media (min-width:961px) and (max-height:850px) {
 .login-header { flex-basis:76px; padding-top:14px; padding-bottom:14px; }
 .page { min-height:calc(100dvh - 76px); }
 .painel { margin-top:0; padding-top:20px; }
 .painel .client-logo { height:54px; margin-bottom:16px; }
 .painel .client-logo img { width:140px; max-height:36px; }
 .client-logo-caption { font-size:8px; margin-top:5px; }
 .painel .titulo { font-size:25px; }
 .painel .subtitulo { margin:6px 0 16px; font-size:13px; }
 body .painel .login-label { margin-top:8px; }
 body .painel .login-input-box .login_input { margin-bottom:12px; height:42px; }
 body .painel .btn-entrar { margin-top:4px; height:44px; }
 .login-signup { margin-top:12px; }
 .painel .divisor { margin:16px 0; }
 .painel .login-acoes-secundarias { margin-top:12px; }
 .painel .painel-foot { padding-top:20px; }
 .login-versao { margin-top:8px; }
 .vitrine .login-showcase { padding-top:28px; }
 .login-showcase .pitch p { font-size:15px; }
 .login-benefit strong { font-size:14px; }
 .login-benefit span { font-size:12px; }
 .login-phone { top:18%; }
}

/* Contornos dos cartões conforme a referência. */
@media (min-width:961px) {
 .vitrine .login-showcase {
  border-radius:36px 0 0 36px;
  clip-path:shape(from 36px 0, line to calc(100% - 90px) 0, curve to calc(100% - 24px) 54px with calc(100% - 45px) 0 / calc(100% - 40px) 12px, line to 100% 116px, line to 100% calc(100% - 62px), curve to calc(100% - 62px) 100% with 100% calc(100% - 24px) / calc(100% - 24px) 100%, line to 36px 100%, curve to 0 calc(100% - 36px) with 14px 100% / 0 calc(100% - 14px), line to 0 36px, curve to 36px 0 with 0 14px / 14px 0, close);
 }
 .painel { border-radius:24px; border:1px solid rgba(255,255,255,.7); box-shadow:0 14px 40px rgba(38,53,74,.045); }
}
@supports not (clip-path:shape(from 0 0, line to 100% 0, line to 100% 100%, close)) {
 @media (min-width:961px) {
  .vitrine .login-showcase { border-radius:36px 90px 62px 36px; }
 }
}

/* Paleta da referência: azul profundo, dourado quente e branco suave. */
:root {
 --blue-900:#08294b;
 --blue-700:#075487;
 --blue-500:#087dc1;
 --yellow:#f6c153;
 --offwhite:#faf9f6;
}
body { background:radial-gradient(ellipse at 70% 18%,#fff 0%,#faf9f6 56%,#f4f3ef 100%); }
.brand img,
.painel .client-logo img[id$="client_logo_padrao"] {
 filter:brightness(0) saturate(100%) invert(14%) sepia(40%) saturate(1787%) hue-rotate(172deg) brightness(92%) contrast(103%);
}
.vitrine .login-showcase {
 background-image:linear-gradient(90deg,rgba(0,30,48,.65) 0%,rgba(3,37,60,.48) 45%,rgba(18,54,81,.13) 72%,rgba(227,237,243,.13) 100%),url('../imagem/login-obra-dia-v2.png.xhtml');
}
.pitch h1 { color:#fbfcff; }
.pitch h1 em { color:#f8c657; }
.login-showcase .pitch p,
.login-benefit span { color:#c8d2de; }
.login-benefit > i { background:rgba(129,167,192,.14); color:#f8c657; }
.painel { background:linear-gradient(145deg,#fff 0%,#fff 65%,#fafaf8 100%); }
.painel .titulo { color:#09294a; }
.painel .subtitulo,
.login-signup { color:#818a9b; }
body .painel .login_input { background:#fff; border-color:#e0e4eb; color:#173858; }
:root { --login-action-bg:linear-gradient(110deg,#f8c75b,#f4bd4e); }
body .painel .btn-entrar { background:var(--login-action-bg); color:#0a3456; }
body .painel .btn-entrar.ui-state-disabled { background:#e2e4e8; color:#677180; }
.login-stat > i { background:#eeefec; color:#294668; }
.login-benefit > .fa-signal-3 { font-size:36px; }

/* Destaca o cartão de acesso sobre o fundo claro. */
.painel {
 box-shadow:0 16px 48px rgba(20,43,65,.13),0 3px 12px rgba(20,43,65,.06);
 border:1px solid rgba(20,43,65,.055);
}

/* Acabamento de concreto em diagonal no canto inferior da página. */
@media (min-width:961px) {
 body::after {
  content:"";
  position:fixed;
  right:0;
  bottom:0;
  width:43vw;
  height:clamp(48px,7vh,84px);
  background:url('../imagem/login-obra-dia-v2.png.xhtml') right bottom / 100% auto no-repeat;
  clip-path:polygon(0 100%,100% 0,100% 100%);
  filter:brightness(1.3) saturate(.3);
  opacity:.65;
  pointer-events:none;
  z-index:2;
 }
 .login-header,.page { position:relative; z-index:1; }
}

/* Cartões alinhados; indicadores ficam abaixo da vitrine. */
body { background:radial-gradient(ellipse at 65% 10%,#f0f1ef 0%,#e9ecea 60%,#e1e5e3 100%); }
@media (min-width:961px) {
 .painel { margin-top:0; margin-bottom:74px; }
 .painel .client-logo { height:64px; margin-bottom:22px; }
 .painel .subtitulo { margin-bottom:20px; }
 body .painel .login-label { margin-top:12px; }
 .painel .divisor { margin:20px 0 16px; }
 .painel .painel-foot { padding-top:24px; }
}
@media (min-width:961px) and (max-height:850px) {
 .painel { padding-top:16px; padding-bottom:14px; }
 .painel .client-logo { height:44px; margin-bottom:10px; }
 .painel .subtitulo { margin-bottom:10px; }
 body .painel .login-label { margin-top:4px; }
 body .painel .login-input-box .login_input { height:40px; margin-bottom:8px; }
 .login-signup { margin-top:8px; }
 .painel .divisor { margin:10px 0; }
 .painel .login-acoes-secundarias { margin-top:8px; }
 .painel .painel-foot { padding-top:12px; }
}

/* Acrescenta 20px externos sem substituir os espaçamentos da composição. */
body { padding:20px; }
@media (min-width:961px) {
 .page { min-height:calc(100dvh - 40px - clamp(76px,11.4vh,120px)); }
}
@media (min-width:961px) and (max-height:850px) {
 .page { min-height:calc(100dvh - 116px); }
}

/* Cabeçalho acompanha as mesmas bordas externas dos cartões. */
@media (min-width:961px) {
 .login-header { padding-left:2.4%; padding-right:2.4%; }
}

/* Prévia vetorial do aplicativo: tipografia e ícones nítidos em qualquer escala. */
.login-phone { container-type:inline-size; }
.app-preview { aspect-ratio:896 / 1755; display:flex; flex-direction:column; overflow:hidden; border-radius:24px; background:#f0f4f8; color:#12365b; font-family:Arial,sans-serif; }
.app-preview-header { flex:none; padding:7cqw 6cqw 8cqw; background:linear-gradient(145deg,#073c73,#002b58); color:#fff; }
.app-preview-bar { display:flex; align-items:center; justify-content:space-between; margin-bottom:9cqw; }
.login-phone .app-preview-bar img { width:31%; height:auto; border-radius:0; filter:brightness(0) invert(1); }
.app-preview-bar > span { display:flex; gap:6cqw; font-size:6cqw; }
.app-preview-greeting { display:flex; align-items:center; gap:4cqw; }
.app-preview-avatar { display:grid; place-items:center; width:16cqw; height:16cqw; border-radius:50%; background:#fff0ca; color:#b27c13; font-size:9cqw; flex-shrink:0; }
.app-preview-greeting strong { display:block; font-size:5.2cqw; line-height:1.4; }
.app-preview-greeting small { display:block; margin-top:1cqw; color:#bed0e7; font-size:4cqw; }
.app-preview-content { padding:4cqw; min-height:0; flex:1; display:flex; flex-direction:column; }
.app-preview-heading { display:flex; justify-content:space-between; align-items:center; margin:0 1cqw 3cqw; font-size:4cqw; color:#6d8196; }
.app-preview-heading i { font-size:5cqw; color:#235480; }
.app-preview-grid { display:grid; flex:1; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3cqw; }
.app-preview-grid > div { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:2.5cqw 3cqw; background:#fff; border:1px solid #e4eaf2; border-radius:4cqw; box-shadow:0 2px 5px #14395c04; }
.app-preview-grid i { display:grid; place-items:center; width:12cqw; height:12cqw; margin-bottom:2.5cqw; border-radius:3cqw; background:#eaf1ff; color:#1553a3; font-size:8cqw; }
.app-preview-grid strong { font-size:4.7cqw; line-height:1.3; white-space:nowrap; }
.app-preview-grid small { margin-top:1.5cqw; font-size:3.5cqw; line-height:1.4; color:#7c8a9d; white-space:nowrap; }
.app-preview-grid .app-preview-gold i { background:#fff3d9; color:#a67322; }
.app-preview-nav { flex:none; display:flex; justify-content:space-around; padding:5cqw 2cqw 6cqw; background:#fff; border-top:1px solid #e0e7ee; }
.app-preview-nav span { display:flex; flex-direction:column; align-items:center; gap:2cqw; color:#7b899b; font-size:6cqw; }
.app-preview-nav small { font-size:3.5cqw; }
.app-preview-nav .active { color:#0757a5; }
@media (max-width:600px) { .app-preview { border-radius:16px; } }

/* Rodapé aberto, com contatos legíveis e sem uma segunda moldura. */
.painel .suporte { border:0; border-radius:0; background:transparent; padding:8px 0; gap:20px; flex-wrap:nowrap; text-align:left; white-space:normal; }
.suporte-contato { gap:12px; }
.suporte-contato > i { font-size:23px; color:#1385b8; }
.suporte-contato small { display:block; color:#7c8c9c; font-size:11px; line-height:1.5; }
.suporte .suporte-telefone { display:block; color:#506b85; font-size:13px; line-height:1.6; font-weight:600; white-space:nowrap; }
.suporte > a { border-left:1px solid #d2dce2; padding:6px 0 6px 20px; gap:10px; color:#20a674; font-size:13px; }
.suporte > a > i { font-size:25px; }
.painel .login-versao { margin-top:16px; color:#94a0ad; font-size:10px; }
@media (min-width:961px) and (max-width:1200px), (max-width:400px) {
 .painel .suporte { gap:12px; }
 .suporte > a { padding-left:12px; gap:6px; font-size:12px; }
 .suporte-contato { gap:8px; }
 .suporte-contato small { font-size:10px; }
 .suporte .suporte-telefone { font-size:12px; }
 .suporte-contato > i,.suporte > a > i { font-size:20px; }
}
@media (min-width:961px) and (max-height:850px) {
 .painel .login-versao { margin-top:8px; }
}

.app-preview-avatar { background:#eaf1fb url('../imagem/mestre-evop/avatar-login.png.xhtml') center / cover no-repeat; }

/* Encaixe previsível da prévia em todos os tamanhos do aparelho. */
.app-preview { line-height:1.25; }
.app-preview-header { padding:6cqw 5cqw; }
.app-preview-bar { margin-bottom:6cqw; }
.app-preview-avatar { width:18cqw; height:18cqw; }
.app-preview-greeting { gap:3cqw; }
.app-preview-greeting strong { font-size:4.8cqw; }
.app-preview-greeting small { font-size:3.8cqw; }
.app-preview-content { gap:0; }
.app-preview-heading { font-size:3.7cqw; }
.app-preview-grid { min-height:0; grid-template-rows:repeat(3,minmax(0,1fr)); }
.app-preview-grid > div { min-height:0; }
.app-preview-grid strong { font-size:4.6cqw; }
.app-preview-grid small { font-size:3.3cqw; }
.app-preview-nav { padding:4cqw 2cqw 5cqw; }

@media (min-width:961px) {
 .login-phone { width:clamp(200px,27vh,310px); top:auto; bottom:calc(18% + 20px); }
}

/* Vitrine animada: nuvens atravessando o céu, celular em ângulo 3D e faixa MCP. */
@media (min-width:961px) {
 .vitrine .login-showcase { perspective:1100px; }
 .vitrine .login-showcase::before,
 .vitrine .login-showcase::after {
  content:""; display:block; position:absolute; z-index:0; left:0; right:0; top:0; pointer-events:none; background-repeat:repeat-x;
  -webkit-mask-image:linear-gradient(90deg,transparent 44%,#000 66%),linear-gradient(180deg,#000 55%,transparent);
  -webkit-mask-composite:source-in; mask-image:linear-gradient(90deg,transparent 44%,#000 66%),linear-gradient(180deg,#000 55%,transparent); mask-composite:intersect;
 }
 .vitrine .login-showcase::before {
  height:30%; opacity:.5; background-image:url('../imagem/login-nuvens-longe.svg.xhtml'); background-size:auto 100%;
  animation:evop-nuvens-longe 90s linear infinite;
 }
 .vitrine .login-showcase::after {
  height:38%; top:2%; opacity:.82; background-image:url('../imagem/login-nuvens-perto.svg.xhtml'); background-size:auto 100%;
  filter:drop-shadow(0 8px 10px rgba(40,70,100,.12));
  animation:evop-nuvens-perto 55s linear infinite;
 }
 .login-phone {
  transform-origin:50% 60%;
  transform:rotateY(-16deg) rotateX(5deg) rotateZ(1deg);
  box-shadow:10px 4px 0 #52606c,15px 7px 0 #a0a7ad,26px 34px 40px #00101b8c;
  animation:evop-phone-float 7s ease-in-out infinite;
 }
}
/* A largura do tile é proporcional à altura (1600x260 e 2000x320): o deslocamento usa a mesma proporção. */
@keyframes evop-nuvens-longe { from { background-position:0 0; } to { background-position:-1600px 0; } }
@keyframes evop-nuvens-perto { from { background-position:0 0; } to { background-position:-2000px 0; } }
@keyframes evop-phone-float {
 0%,100% { transform:rotateY(-16deg) rotateX(5deg) rotateZ(1deg) translateY(0); }
 50%     { transform:rotateY(-12deg) rotateX(3.5deg) rotateZ(.6deg) translateY(-6px); }
}

/* Faixa MCP sobre o muro de concreto. */
.login-mcp { position:absolute; z-index:2; right:6%; bottom:5%; display:flex; align-items:center; gap:16px; padding:14px 20px; overflow:hidden; border-radius:22px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28); box-shadow:0 12px 30px rgba(0,16,27,.35),inset 0 1px 0 rgba(255,255,255,.3); backdrop-filter:blur(10px) saturate(1.2); -webkit-backdrop-filter:blur(10px) saturate(1.2); color:#fff; animation:evop-mcp-entra .9s cubic-bezier(.2,.8,.2,1) .3s both; }
.login-mcp::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%); transform:translateX(-120%); animation:evop-mcp-brilho 5s ease-in-out 1.4s infinite; }
.login-mcp-sep { width:1px; height:30px; background:rgba(255,255,255,.4); }
.login-mcp strong { font-size:13px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; }
.login-mcp small { font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:#d5dde6; }
.login-mcp-ia { display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:#f7f5f1; box-shadow:0 3px 8px rgba(0,0,0,.2); animation:evop-mcp-ia 3s ease-in-out infinite; }
.login-mcp-ia:last-child { animation-delay:1.5s; }
.login-mcp-ia img { width:28px; height:28px; display:block; }
@keyframes evop-mcp-entra { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:none; } }
@keyframes evop-mcp-brilho { 0% { transform:translateX(-120%); } 40%,100% { transform:translateX(120%); } }
@keyframes evop-mcp-ia { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-3px); } }
@media (max-width:960px) { .login-mcp { position:relative; right:auto; bottom:auto; margin:24px auto 0; flex-wrap:wrap; justify-content:center; } }

/* Celular girável com o mouse (login-phone-3d.js). */
@media (min-width:961px) {
 .login-phone { cursor:grab; touch-action:none; user-select:none; will-change:transform; }
 .login-phone.login-phone-3d-ativo { animation:none; }
 .login-phone.login-phone-3d-ativo:active { cursor:grabbing; }
}

/* Destaque amarelo da faixa MCP: só a sigla. */
.login-mcp strong em { font-style:normal; color:#f8c657; text-shadow:0 0 12px rgba(248,198,87,.45); }

/* Header entra item a item, da esquerda para a direita. */
.login-header .brand > *,
.login-manifesto > span { animation:evop-header-entra .7s cubic-bezier(.2,.8,.2,1) both; }
.login-header .brand > :nth-child(1) { animation-delay:.05s; }
.login-header .brand > :nth-child(2) { animation-delay:.2s; }
.login-header .brand > :nth-child(3) { animation-delay:.35s; }
.login-manifesto > span:nth-child(1) { animation-delay:.5s; }
.login-manifesto > span:nth-child(2) { animation-delay:.65s; }
.login-manifesto > span:nth-child(3) { animation-delay:.8s; }
@keyframes evop-header-entra { from { opacity:0; transform:translateX(-18px); } to { opacity:1; transform:none; } }

/* Benefícios: entram um a um e cada ícone faz seu movimento uma vez. */
.login-benefit { animation:evop-header-entra .7s cubic-bezier(.2,.8,.2,1) both; }
.login-benefit:nth-child(1) { animation-delay:.9s; }
.login-benefit:nth-child(2) { animation-delay:1.05s; }
.login-benefit:nth-child(3) { animation-delay:1.2s; }
.login-benefit > i::before { display:inline-block; }
.login-benefit:nth-child(1) > i::before { transform-origin:50% 100%; animation:evop-icone-cresce 1.4s ease-in-out 1.9s 1; }
.login-benefit:nth-child(2) > i::before { animation:evop-icone-brilha 1.4s ease-in-out 2.1s 1; }
.login-benefit:nth-child(3) > i::before { animation:evop-icone-pula 1.4s ease-in-out 2.3s 1; }
@keyframes evop-icone-cresce { 0%,60%,100% { transform:scaleY(1); } 20% { transform:scaleY(.55); } 40% { transform:scaleY(1.12); } }
@keyframes evop-icone-brilha { 0%,60%,100% { transform:scale(1); filter:none; } 30% { transform:scale(1.14); filter:drop-shadow(0 0 6px rgba(248,198,87,.8)); } }
@keyframes evop-icone-pula { 0%,60%,100% { transform:translateY(0); } 20% { transform:translateY(-4px); } 35% { transform:translateY(0); } 45% { transform:translateY(-2px); } }

/* O botão Google só é <a> quando o login Google está disponível; aí ele é clicável. */
a.login-google { cursor:pointer; }
a.login-google:hover { border-color:#c3ccd8; background:#f8fafc; }


.login-session-alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 12px 0;
    padding: 12px 14px;
    border: 1px solid #d79b00;
    border-left: 4px solid #d79b00;
    border-radius: 6px;
    background: #fff8e1;
    color: #5f4600;
    font-size: 14px;
    line-height: 1.4;
}

.login-session-alert .pi {
    margin-top: 2px;
    color: #8a6200;
    font-size: 18px;
}

/* Mantém as duas colunas e deixa a página rolar quando a altura é pequena. */
@media (min-width:961px) {
 .page { grid-template-rows:minmax(min-content,1fr); }
 .painel { min-height:max-content; }
 .painel > form, .painel .painel-foot { flex-shrink:0; }
 .vitrine .login-showcase { min-height:540px; }
}

/* Reserva espaço para o aparelho sem cobrir os textos em notebooks estreitos. */
@media (min-width:961px) and (max-width:1200px) {
 .vitrine .login-showcase { min-height:600px; }
 .login-showcase .pitch { width:calc(100% - 180px); }
 .pitch h1 { font-size:clamp(24px,2.55vw,31px); }
 .pitch h1 span, .pitch h1 em, .pitch .eyebrow { white-space:normal; }
 .login-benefits { width:calc(100% - 180px); }
 .login-phone { width:140px; max-width:none; right:4%; top:24%; bottom:auto; }
 .login-mcp { position:relative; right:auto; bottom:auto; width:max-content; max-width:100%; margin-top:24px; gap:12px; padding:12px; flex-wrap:wrap; flex-shrink:0; }
}

/* Mantém os diálogos acessíveis ao girar o celular com a janela aberta. */
@media (max-width:960px) and (max-height:480px) {
 .ui-dialog { top:12px !important; max-height:calc(100svh - 24px); overflow-y:auto; }
}

/* Modais públicos do login: cadastro e recuperação de acesso. */
body .login-modal.ui-dialog {
 border:1px solid #e5e8ed; border-radius:20px; background:#fff;
 box-shadow:0 24px 70px rgba(4,25,44,.24); max-width:calc(100vw - 24px);
 max-height:calc(100svh - 24px); overflow-y:auto;
}
body .login-modal .ui-dialog-titlebar {
 background:transparent; border:0; padding:0; height:0; position:relative;
}
.login-modal .ui-dialog-title { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
body .login-modal .ui-dialog-titlebar-close {
 position:absolute; top:24px; right:24px; margin:0; z-index:2;
 color:#929bad; background:transparent; border:0;
}
body .login-modal .ui-dialog-titlebar-close .ui-icon { font-size:18px; width:20px; height:20px; }
body .login-modal .ui-dialog-content { padding:30px 38px 34px; color:#11243b; }
.login-modal-intro { margin-bottom:30px; padding-right:12px; }
.login-modal-tag { display:inline-flex; align-items:center; gap:10px; padding:7px 12px; border-radius:7px; background:#fbf1df; color:#c88f36; font-size:12px; font-weight:600; }
.login-modal-intro h2 { margin:18px 0 6px; font-size:30px; line-height:1.2; letter-spacing:-.025em; color:#11243b; }
.login-modal-intro p { margin:0; color:#7c8799; font-size:14px; line-height:1.5; }
.login-modal-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px 16px; }
.login-modal-field { min-width:0; }
body .login-modal .label-titulo { color:#243348; font-size:13px; font-weight:600; margin-bottom:8px; }
.login-modal-input { position:relative; min-width:0; }
.login-modal-input > i { position:absolute; left:16px; top:50%; transform:translateY(-50%); color:#8993a4; z-index:1; pointer-events:none; }
body .login-modal .login-modal-input .login_input {
 box-sizing:border-box; width:100%; height:46px; margin:0; padding:12px 14px 12px 44px;
 border:1px solid #d9dfe8; border-radius:8px; background:#fff; box-shadow:none; font-size:13px; color:#243348;
}
.login-modal-input input::placeholder { color:#9aa3b3; opacity:1; }
body .login-modal .login-modal-input .cadastro-conta-select {
 box-sizing:border-box; width:100% !important; min-width:0 !important; height:46px; margin:0 !important;
 border:1px solid #d9dfe8; border-radius:8px; background:#fff; padding:0;
}
body .login-modal .cadastro-conta-select .ui-selectonemenu-label {
 box-sizing:border-box; width:100%; min-height:44px; padding:13px 34px 12px 44px;
 font-size:13px; background:transparent; color:#536073;
}
body .login-modal .cadastro-conta-select .ui-selectonemenu-trigger { width:30px; background:transparent; border:0; color:#8993a4; }
body .login-modal .login-modal-actions { padding:0; margin-top:32px; display:flex; width:100%; flex-basis:100%; gap:8px; flex-wrap:wrap; }
body .login-modal .login-modal-required { margin-right:auto; color:#9aa3b3; font-size:11px; }
body .login-modal .login-modal-primary, body .login-modal .login-modal-secondary {
 box-sizing:border-box; min-height:46px; border-radius:8px; padding:0 14px; font-size:13px; font-weight:600; box-shadow:none;
}
body .login-modal .login-modal-primary { background:var(--login-action-bg); border:1px solid var(--yellow); color:#0a3456; }
body .login-modal .login-modal-primary.ui-state-hover { filter:brightness(1.04); }
body .login-modal .login-modal-secondary { background:#f7f8fa; border:1px solid #d9dfe8; color:#172b46; }
body .login-modal .login-modal-secondary.ui-state-hover { background:#edf0f5; }
body .login-modal .ui-button .ui-button-text { padding:12px 6px; }
body .login-modal .ui-button.ui-button-text-icon-left .ui-button-text { padding-left:24px; }
@media (max-width:640px) {
 body .login-modal .ui-dialog-content { padding:24px 22px; }
 .login-modal-intro h2 { font-size:25px; }
 .login-modal-grid { grid-template-columns:minmax(0,1fr); gap:16px; }
 .login-modal-required { flex-basis:100%; margin-bottom:4px; }
 body .login-modal .login-modal-actions .ui-button { width:auto; min-width:0; flex:1; }
 body .login-modal .ui-dialog-titlebar-close { top:20px; right:18px; }
}

/* Downloads do aplicativo no rodapé do login. */
.login-app-stores {
 display:flex; justify-content:center; flex-wrap:wrap; gap:14px;
 margin:0 0 20px; padding:0 0 24px; border-bottom:1px solid #e1e7ed;
}
.login-app-stores .login-store-badge {
 display:flex; align-items:center; justify-content:center; gap:10px;
 box-sizing:border-box; min-height:50px; width:164px; max-width:100%;
 padding:7px 12px; border:1px solid #a6a6a6; border-radius:10px;
 background:#050505; color:#fff; text-decoration:none;
}
.login-store-badge > i { font-size:28px; flex-shrink:0; }
.login-store-badge > .login-store-logo { width:28px; height:28px; flex-shrink:0; }
.login-store-badge span { display:flex; flex-direction:column; text-align:left; }
.login-store-badge small { font-size:10px; line-height:1.2; }
.login-store-badge strong { font-size:18px; line-height:1.2; font-weight:600; white-space:nowrap; }
.login-app-stores .login-store-badge:hover { background:#252525; }
.login-app-stores .login-store-badge:focus-visible { outline:3px solid #1385b8; outline-offset:4px; }
@media (max-width:400px), (min-width:961px) and (max-width:1200px) {
 .login-app-stores { gap:8px; }
 .login-app-stores .login-store-badge { width:145px; padding:7px 9px; gap:8px; }
 .login-store-badge strong { font-size:16px; }
}