/* ============================
   VARIÁVEIS GLOBAIS
   ============================ */
:root{
  --bg-main:#EEF1F7;
  --azul-principal:#182E59;
  --azul-escuro:#122640;
  --dourado:#BF9B6F;
  --dourado-hover:#a9865c;
  --texto:#122640;
  --texto-suave:#5b6a82;
  --branco:#ffffff;
  --erro:#c0392b;
  --sucesso:#2e7d32;
  --borda:#dbe1ec;

  --radius-sm:10px;
  --radius-md:16px;
  --radius-lg:24px;

  --shadow-card:0 20px 45px -20px rgba(18,38,64,0.18);
  --shadow-input:0 1px 2px rgba(18,38,64,0.04);

  --transition:200ms ease;
}

*{box-sizing:border-box;}

html,body{
  margin:0;
  padding:0;
  background:var(--bg-main);
  font-family:'Poppins', sans-serif;
  color:var(--texto);
  -webkit-font-smoothing:antialiased;
}

body{
  min-height:100vh;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:48px 20px 80px;
}

/* ============================
   LAYOUT DO CARD
   ============================ */
.page-wrap{
  width:100%;
  max-width:880px;
}

.form-header{
  text-align:center;
  margin-bottom:28px;
}

.form-header .logo-mark{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--dourado);
  font-weight:600;
  margin-bottom:10px;
}

.form-header .logo-mark::before,
.form-header .logo-mark::after{
  content:"";
  width:22px;
  height:1px;
  background:var(--dourado);
  display:inline-block;
}

.form-header h1{
  font-size:clamp(22px,3.4vw,30px);
  font-weight:700;
  color:var(--azul-principal);
  margin:0 0 8px;
  letter-spacing:-0.01em;
}

.form-header p{
  color:var(--texto-suave);
  font-size:14.5px;
  margin:0;
  line-height:1.5;
}

.progress-track{
  display:flex;
  gap:6px;
  margin:14px auto 0;
  max-width:260px;
}
.progress-track span{
  flex:1;
  height:4px;
  border-radius:4px;
  background:var(--borda);
}
.progress-track span.active{
  background:var(--dourado);
}

.form-card{
  background:var(--branco);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  padding:clamp(28px,5vw,48px);
  border:1px solid rgba(18,38,64,0.04);
}

/* ============================
   SEÇÕES / GRUPOS
   ============================ */
.section-block{
  margin-bottom:36px;
}
.section-block:last-of-type{
  margin-bottom:0;
}

.section-title{
  font-size:12px;
  font-weight:600;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:var(--dourado);
  margin:0 0 14px;
  display:flex;
  align-items:center;
  gap:8px;
}

.section-title::after{
  content:"";
  flex:1;
  height:1px;
  background:var(--borda);
}

.section-intro{
  font-size:13.5px;
  color:var(--texto-suave);
  margin:-6px 0 18px;
  line-height:1.5;
}

/* ============================
   TOGGLE / RADIO PILLS
   ============================ */
.toggle-list{
  margin-bottom:8px;
}

.toggle-list > label.group-label{
  display:block;
  font-weight:600;
  font-size:14.5px;
  color:var(--azul-escuro);
  margin-bottom:12px;
}

.toggle-options{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.toggle-item{
  position:relative;
}

.toggle-item input{
  position:absolute;
  opacity:0;
  width:0;
  height:0;
}

.toggle-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 20px;
  border-radius:999px;
  border:1.5px solid var(--borda);
  background:var(--bg-main);
  color:var(--texto-suave);
  font-size:14px;
  font-weight:500;
  cursor:pointer;
  transition:all var(--transition);
  user-select:none;
  text-align:center;
  line-height:1.3;
}

.toggle-button:hover{
  border-color:var(--dourado);
  color:var(--azul-escuro);
}

.toggle-item input:focus-visible + .toggle-button{
  outline:2px solid var(--dourado);
  outline-offset:2px;
}

.toggle-item input:checked + .toggle-button{
  background:var(--azul-principal);
  border-color:var(--azul-principal);
  color:var(--branco);
  box-shadow:0 4px 14px -4px rgba(24,46,89,0.45);
}

.toggle-item input:checked + .toggle-button::before{
  content:"✓";
  margin-right:7px;
  color:var(--dourado);
  font-weight:700;
}

.toggle-list.tem-erro > label.group-label{
  color:var(--erro);
}

/* ============================
   CAMPOS DE TEXTO
   ============================ */
.campo{
  margin-bottom:20px;
  transition:all var(--transition);
}

.campo.is-hidden{
  display:none;
}

.campo label{
  display:block;
  font-weight:600;
  font-size:14px;
  color:var(--azul-escuro);
  margin-bottom:7px;
}

.campo label .opcional{
  font-weight:400;
  color:var(--texto-suave);
  font-size:12.5px;
  text-transform:none;
  letter-spacing:0;
  margin-left:4px;
}

.campo .campo-hint{
  font-size:12px;
  color:var(--texto-suave);
  margin:6px 0 0;
  line-height:1.4;
}

.campo .campo-hint:empty{
  display:none;
}

.campo .campo-hint.sucesso{
  color:var(--sucesso);
  font-weight:500;
}

.campo .campo-hint.erro-api{
  color:var(--erro);
  font-weight:500;
}

.campo input,
.campo select{
  width:100%;
  min-height:48px;
  padding:12px 16px;
  border-radius:var(--radius-sm);
  border:1.5px solid var(--borda);
  background:var(--bg-main);
  font-family:'Poppins', sans-serif;
  font-size:15px;
  color:var(--texto);
  transition:border-color var(--transition), box-shadow var(--transition), background var(--transition);
  box-shadow:var(--shadow-input);
}

.campo input::placeholder{
  color:#9aa6bb;
}

.campo input:hover,
.campo select:hover{
  border-color:#b9c2d6;
}

.campo input:focus,
.campo select:focus{
  outline:none;
  border-color:var(--dourado);
  background:var(--branco);
  box-shadow:0 0 0 4px rgba(191,155,111,0.18);
}

.campo input:disabled,
.campo select:disabled,
.campo textarea:disabled{
  background:#f1f3f7;
  color:#a7b0c0;
  cursor:not-allowed;
  border-color:var(--borda);
}

/* Estado de erro */
.campo.tem-erro input,
.campo.tem-erro select,
.campo.tem-erro textarea{
  border-color:var(--erro);
  background:#fdf3f2;
}
.campo.tem-erro input:focus{
  box-shadow:0 0 0 4px rgba(192,57,43,0.15);
}
.campo .erro-msg{
  display:none;
  color:var(--erro);
  font-size:12.5px;
  font-weight:500;
  margin-top:6px;
}
.campo.tem-erro .erro-msg{
  display:block;
}

/* Estado válido (sucesso sutil) */
.campo.tem-sucesso input,
.campo.tem-sucesso select{
  border-color:#9ecb9f;
}

/* ============================
   GRID PARA CAMPOS EMPARELHADOS
   ============================ */
.campo-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.campo-grid .campo.campo-largura-total{
  grid-column:1 / -1;
}

@media (max-width:560px){
  .campo-grid{
    grid-template-columns:1fr;
  }
}

/* ============================
   BOTÃO PRINCIPAL
   ============================ */
.actions{
  margin-top:40px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
}

.btn-primario:disabled,
.btn-secundario:disabled{
  background:#c7cddb;
  color:var(--branco);
  border-color:#c7cddb;
  cursor:not-allowed;
  box-shadow:none;
  transform:none;
}

.helper-text{
  font-size:12.5px;
  color:var(--texto-suave);
  text-align:center;
  margin:0;
}

.helper-text strong{
  color:var(--azul-principal);
}

/* ============================
   INDICADOR DE ETAPA
   ============================ */
.step-indicator{
  font-size:12.5px;
  color:var(--texto-suave);
  margin:20px 0 0;
  font-weight:500;
}

/* ============================
   STEPS (MULTI-PÁGINA)
   ============================ */
.step.is-hidden{
  display:none;
}

/* ============================
   SELECT CUSTOMIZADO
   ============================ */
.campo select{
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%23122640' stroke-width='1.8' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
  padding-right:44px;
  cursor:pointer;
}

/* ============================
   TEXTAREA
   ============================ */
.campo textarea{
  width:100%;
  padding:12px 16px;
  border-radius:var(--radius-sm);
  border:1.5px solid var(--borda);
  background:var(--bg-main);
  font-family:'Poppins', sans-serif;
  font-size:15px;
  color:var(--texto);
  resize:vertical;
  min-height:96px;
  transition:border-color var(--transition), box-shadow var(--transition), background var(--transition);
  box-shadow:var(--shadow-input);
}
.campo textarea::placeholder{
  color:#9aa6bb;
}
.campo textarea:hover{
  border-color:#b9c2d6;
}
.campo textarea:focus{
  outline:none;
  border-color:var(--dourado);
  background:var(--branco);
  box-shadow:0 0 0 4px rgba(191,155,111,0.18);
}

/* ============================
   DROPZONE DE UPLOAD
   ============================ */
.dropzone{
  position:relative;
  border:1.5px dashed var(--borda);
  border-radius:var(--radius-md);
  background:var(--bg-main);
  padding:24px 20px;
  text-align:center;
  cursor:pointer;
  transition:border-color var(--transition), background var(--transition);
}

.dropzone:hover{
  border-color:var(--dourado);
  background:#f7f3ec;
}

.dropzone.drag-ativo{
  border-color:var(--dourado);
  background:#f7f3ec;
  box-shadow:0 0 0 4px rgba(191,155,111,0.15);
}

.dropzone.arquivo-selecionado{
  border-style:solid;
  border-color:#9ecb9f;
  background:#f4faf4;
}

.dropzone input[type="file"]{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  cursor:pointer;
}

.dropzone-content{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  pointer-events:none;
}

.dropzone-icon{
  width:34px;
  height:34px;
  border-radius:50%;
  background:var(--azul-principal);
  color:var(--branco);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  margin-bottom:4px;
}

.dropzone.arquivo-selecionado .dropzone-icon{
  background:var(--sucesso);
}

.dropzone-text{
  margin:0;
  font-size:14px;
  color:var(--azul-escuro);
}

.dropzone-text strong{
  color:var(--azul-principal);
}

.dropzone-hint{
  margin:0;
  font-size:12px;
  color:var(--texto-suave);
}

.dropzone.tem-erro-upload{
  border-color:var(--erro);
  background:#fdf3f2;
}

/* ============================
   BOTÕES DE NAVEGAÇÃO (MULTI-STEP)
   ============================ */
.actions-row{
  display:flex;
  gap:12px;
  width:100%;
}

.btn-primario,
.btn-secundario{
  flex:1;
  min-height:52px;
  border-radius:var(--radius-sm);
  font-family:'Poppins', sans-serif;
  font-size:16px;
  font-weight:600;
  letter-spacing:.01em;
  cursor:pointer;
  transition:background var(--transition), transform var(--transition), box-shadow var(--transition), border-color var(--transition), color var(--transition);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}

.btn-primario{
  background:var(--azul-principal);
  color:var(--branco);
  border:none;
  box-shadow:0 12px 24px -10px rgba(24,46,89,0.45);
}

.btn-primario:hover{
  background:var(--azul-escuro);
  transform:translateY(-1px);
  box-shadow:0 16px 30px -10px rgba(18,38,64,0.5);
}

.btn-primario:active,
.btn-secundario:active{
  transform:translateY(0);
}

.btn-primario:focus-visible{
  outline:3px solid var(--dourado);
  outline-offset:3px;
}

.btn-secundario{
  background:transparent;
  color:var(--azul-principal);
  border:1.5px solid var(--borda);
  flex:0.6;
}

.btn-secundario:hover{
  border-color:var(--azul-principal);
  background:var(--bg-main);
}

.btn-secundario:focus-visible{
  outline:3px solid var(--dourado);
  outline-offset:3px;
}

.actions-row .is-hidden{
  display:none;
}

/* ============================
   SÓCIOS (BLOCOS DINÂMICOS)
   ============================ */
.lista-socios{
  display:flex;
  flex-direction:column;
  gap:20px;
  margin-bottom:16px;
}

.socio-card{
  border:1.5px solid var(--borda);
  border-radius:var(--radius-md);
  background:var(--bg-main);
  padding:22px 20px;
}

.socio-card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:16px;
}

.socio-card-titulo{
  font-size:14.5px;
  font-weight:700;
  color:var(--azul-principal);
  margin:0;
}

.btn-remover-socio{
  background:none;
  border:none;
  color:var(--erro);
  font-family:'Poppins', sans-serif;
  font-size:12.5px;
  font-weight:600;
  cursor:pointer;
  padding:4px 0;
  text-decoration:underline;
}

.btn-remover-socio:hover{
  color:#8f2c20;
}

.btn-remover-socio.is-hidden{
  display:none;
}

.btn-adicionar-socio{
  width:100%;
  min-height:52px;
  border-radius:var(--radius-sm);
  border:1.5px dashed var(--borda);
  background:transparent;
  color:var(--azul-principal);
  font-family:'Poppins', sans-serif;
  font-size:14.5px;
  font-weight:600;
  cursor:pointer;
  transition:all var(--transition);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

.btn-adicionar-socio:hover{
  border-color:var(--dourado);
  color:var(--dourado-hover);
  background:#f7f3ec;
}

.aviso-percentual{
  font-size:12.5px;
  color:var(--texto-suave);
  text-align:center;
  margin:12px 0 0;
}

.aviso-percentual.erro{
  color:var(--erro);
  font-weight:600;
}

.aviso-percentual.sucesso{
  color:var(--sucesso);
  font-weight:600;
}

/* ============================
   TOAST DE FEEDBACK (envio)
   ============================ */
.toast{
  position:fixed;
  bottom:24px;
  left:50%;
  transform:translateX(-50%) translateY(20px);
  background:var(--azul-escuro);
  color:var(--branco);
  padding:14px 22px;
  border-radius:var(--radius-sm);
  font-size:14px;
  font-weight:500;
  box-shadow:0 12px 30px -8px rgba(18,38,64,0.5);
  opacity:0;
  pointer-events:none;
  transition:opacity 250ms ease, transform 250ms ease;
  z-index:1000;
  max-width:90vw;
  text-align:center;
}

.toast.visivel{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

.toast.erro{
  background:var(--erro);
}

.toast.sucesso{
  background:var(--sucesso);
}

@media (max-width:480px){
  .actions-row{
    flex-direction:column;
  }
  .btn-secundario{
    flex:1;
    order:2;
  }
  .btn-primario{
    order:1;
  }
}

/* ============================
   RESPONSIVIDADE MOBILE
   ============================ */
@media (max-width:600px){
  body{
    padding:28px 14px 60px;
  }
  .form-card{
    border-radius:var(--radius-md);
    padding:26px 20px;
  }
  .toggle-options{
    gap:8px;
  }
  .toggle-button{
    flex:1 1 auto;
    padding:11px 14px;
    font-size:13.5px;
  }
  .section-block{
    margin-bottom:28px;
  }
  .socio-card{
    padding:18px 16px;
  }
}

/* ============================
   CHECKBOX GRID (O que vai alterar)
   ============================ */
.grupo-checkbox > .group-label{
  display:block;
  font-weight:600;
  font-size:14px;
  color:var(--azul-escuro);
  margin-bottom:10px;
}

.grupo-checkbox.tem-erro > .group-label{
  color:var(--erro);
}

.grupo-checkbox .erro-msg{
  display:none;
  color:var(--erro);
  font-size:12.5px;
  font-weight:500;
  margin-top:8px;
}

.grupo-checkbox.tem-erro .erro-msg{
  display:block;
}

.checkbox-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
}

@media (max-width:620px){
  .checkbox-grid{
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width:380px){
  .checkbox-grid{
    grid-template-columns:1fr;
  }
}

.checkbox-card{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 14px;
  border-radius:var(--radius-sm);
  border:1.5px solid var(--borda);
  background:var(--bg-main);
  cursor:pointer;
  transition:all var(--transition);
  min-height:48px;
}

.checkbox-card:hover{
  border-color:var(--dourado);
  background:#f7f3ec;
}

.checkbox-card input{
  position:absolute;
  opacity:0;
  width:0;
  height:0;
}

.checkbox-card .check-visual{
  width:20px;
  height:20px;
  min-width:20px;
  border-radius:6px;
  border:1.5px solid #b9c2d6;
  background:var(--branco);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all var(--transition);
  color:var(--branco);
  font-size:12px;
  font-weight:700;
}

.checkbox-card input:checked ~ .check-visual{
  background:var(--azul-principal);
  border-color:var(--azul-principal);
}

.checkbox-card input:checked ~ .check-visual::after{
  content:"✓";
}

.checkbox-card input:focus-visible ~ .check-visual{
  outline:2px solid var(--dourado);
  outline-offset:2px;
}

.checkbox-card .check-label{
  font-size:14px;
  font-weight:500;
  color:var(--azul-escuro);
  line-height:1.3;
}

.checkbox-card:has(input:checked){
  border-color:var(--azul-principal);
  background:var(--branco);
  box-shadow:0 4px 14px -6px rgba(24,46,89,0.25);
}

/* ============================
   POPUP DE BOAS-VINDAS
   ============================ */
.popup-boas-vindas{
  width:min(480px, calc(100vw - 32px));
  border:none;
  border-radius:var(--radius-lg);
  padding:36px 32px 30px;
  background:var(--branco);
  color:var(--texto);
  text-align:center;
  box-shadow:0 30px 60px -20px rgba(18,38,64,0.45);
}

.popup-boas-vindas::backdrop{
  background:rgba(18,38,64,0.55);
  backdrop-filter:blur(3px);
}

.popup-boas-vindas[open]{
  animation:popup-entrada 260ms ease;
}

@keyframes popup-entrada{
  from{ opacity:0; transform:translateY(12px) scale(.98); }
  to{ opacity:1; transform:none; }
}

.popup-icone{
  width:52px;
  height:52px;
  margin:0 auto 16px;
  border-radius:50%;
  background:#f7f3ec;
  color:var(--dourado);
  font-size:24px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.popup-boas-vindas h2{
  font-size:19px;
  font-weight:700;
  line-height:1.35;
  color:var(--azul-principal);
  margin:0 0 14px;
}

.popup-boas-vindas p{
  font-size:14px;
  line-height:1.6;
  color:var(--texto-suave);
  margin:0 0 10px;
}

.popup-boas-vindas p strong{
  color:var(--azul-escuro);
}

.popup-boas-vindas form{
  display:flex;
  margin-top:24px;
}

@media (max-width:480px){
  .popup-boas-vindas{
    padding:30px 22px 24px;
  }
  .popup-boas-vindas h2{
    font-size:17px;
  }
}

/* ============================
   AJUDA: O QUE SIGNIFICA CADA ITEM (sanfona)
   ============================ */
.ajuda-itens{
  border:1.5px solid var(--borda);
  border-radius:var(--radius-md);
  background:var(--branco);
  margin-top:4px;
}

.ajuda-itens > summary{
  list-style:none;
  cursor:pointer;
  padding:14px 18px;
  font-size:14px;
  font-weight:600;
  color:var(--azul-principal);
  display:flex;
  align-items:center;
  gap:10px;
  border-radius:var(--radius-md);
  transition:background var(--transition);
}

.ajuda-itens > summary::-webkit-details-marker,
.explicacao-card > summary::-webkit-details-marker{
  display:none;
}

.ajuda-itens > summary::before{
  content:"?";
  width:24px;
  height:24px;
  min-width:24px;
  border-radius:50%;
  background:var(--dourado);
  color:var(--branco);
  font-size:13px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
}

.ajuda-itens > summary::after,
.explicacao-card > summary::after{
  content:"";
  margin-left:auto;
  width:10px;
  height:10px;
  border-right:1.8px solid currentColor;
  border-bottom:1.8px solid currentColor;
  transform:rotate(45deg) translateY(-3px);
  transition:transform var(--transition);
}

.ajuda-itens[open] > summary::after,
.explicacao-card[open] > summary::after{
  transform:rotate(-135deg) translateY(-3px);
}

.ajuda-itens > summary:hover{
  background:#f7f3ec;
}

.ajuda-itens > summary:focus-visible,
.explicacao-card > summary:focus-visible{
  outline:2px solid var(--dourado);
  outline-offset:2px;
}

.ajuda-intro{
  font-size:12.5px;
  color:var(--texto-suave);
  margin:0;
  padding:0 18px 12px;
}

.explicacao-card{
  border-top:1px solid var(--borda);
}

.explicacao-card > summary{
  list-style:none;
  cursor:pointer;
  padding:13px 18px;
  font-size:14px;
  font-weight:500;
  color:var(--azul-escuro);
  display:flex;
  align-items:center;
  transition:background var(--transition), color var(--transition);
}

.explicacao-card > summary:hover{
  background:var(--bg-main);
}

.explicacao-card[open] > summary{
  color:var(--azul-principal);
  font-weight:600;
}

.explicacao-corpo{
  margin:0 18px 16px;
  padding:4px 0 2px 16px;
  border-left:3px solid var(--dourado);
  font-size:13.5px;
  line-height:1.6;
  color:var(--texto);
}

.explicacao-corpo p{
  margin:0;
}

.explicacao-corpo p + p,
.explicacao-corpo ul + p,
.explicacao-corpo p + ul{
  margin-top:8px;
}

.explicacao-corpo ul{
  margin:0;
  padding-left:20px;
}

.explicacao-corpo strong{
  color:var(--azul-principal);
}

.explicacao-corpo .obs{
  font-size:12.5px;
  color:var(--texto-suave);
  background:var(--bg-main);
  border-radius:8px;
  padding:8px 12px;
}

/* ============================
   BLOCOS DE DETALHE (Etapa 2)
   ============================ */
.detalhe-bloco{
  border:1.5px solid var(--borda);
  border-radius:var(--radius-md);
  padding:22px 20px 6px;
  margin-bottom:20px;
}

.detalhe-bloco.is-hidden{
  display:none;
}

.detalhe-bloco-titulo{
  font-size:14.5px;
  font-weight:700;
  color:var(--azul-principal);
  margin:0 0 16px;
}

.detalhe-bloco .toggle-list{
  margin-bottom:20px;
}

.sub-grupo.is-hidden{
  display:none;
}

/* ============================
   RELAÇÃO DE DOCUMENTOS (Etapa 3)
   ============================ */
.resumo-alteracoes{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 24px;
  padding:0;
  list-style:none;
}

.resumo-alteracoes li{
  background:var(--azul-principal);
  color:var(--branco);
  font-size:12.5px;
  font-weight:500;
  padding:6px 12px;
  border-radius:999px;
}

.lista-documentos{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.documento-grupo-titulo{
  font-size:13px;
  font-weight:700;
  color:var(--azul-principal);
  margin:14px 0 10px;
}

.documento-grupo-titulo:first-child{
  margin-top:0;
}

.sem-documentos{
  background:#f4faf4;
  border:1.5px solid #9ecb9f;
  border-radius:var(--radius-md);
  padding:18px 20px;
  font-size:14px;
  color:var(--sucesso);
  font-weight:500;
  text-align:center;
}

/* ============================
   LOGO NO TOPO
   ============================ */
.form-header .logo-mark{
  display:block;
  width:190px;
  height:auto;
  margin:0 auto 20px;
}

.form-header .logo-mark::before,
.form-header .logo-mark::after{
  content:none;
}

@media (max-width:600px){
  .form-header .logo-mark{
    width:150px;
    margin-bottom:16px;
  }
}
