@charset "UTF-8";

@font-face { font-family: 'Label'; src: url('../_sources/_fonts/_Quicksand/Quicksand-Bold.ttf'); }
@font-face { font-family: 'Empresa'; src: url('../_sources/_fonts/_Righteous/Righteous-Regular.ttf'); }
@font-face { font-family: 'Botao'; src: url('../_sources/_fonts/_Inconsolata/Inconsolata-Bold.ttf'); }
@font-face { font-family: 'Normal'; src: url('../_sources/_fonts/_Inconsolata/Inconsolata-Regular.ttf'); }

:root { --azul: #1688e8; --azul-escuro: #075a9f; --fundo: #172025; --texto: #525a62; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: linear-gradient(rgba(14, 23, 28, .92), rgba(14, 23, 28, .96)), url('../_sources/bgLogin.jpg') center / cover fixed; color: var(--texto); font-family: Normal, Arial, sans-serif; }
.cabecalho-interesses { min-height: 115px; padding: 20px 36px; background: #fff; border-top: 1px solid #333; border-bottom: 2px solid var(--azul); display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.marca-interesses { display: inline-flex; align-items: center; gap: 14px; color: inherit; text-decoration: none; }
.marca-interesses h1 { margin: 0; color: #287dc7; font: 32px Empresa, Arial, sans-serif; }
.marca-interesses p { margin: 6px 0 0; font-size: 15px; letter-spacing: .2px; }
.botao-voltar, .acoes-formulario button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; border: 0; border-radius: 6px; background: #333; color: #fff; font: 16px Botao, Arial, sans-serif; text-decoration: none; cursor: pointer; padding: 8px 14px; }
.botao-voltar:hover, .acoes-formulario button:hover { background: #111; color: #d9eeff; }
.pagina-interesses { width: min(1080px, calc(100% - 32px)); margin: 25px auto; }
.formulario-interesses { overflow: hidden; border-radius: 14px; background: #fff; box-shadow: 0 9px 34px rgba(0, 0, 0, .38); }
.topo-formulario { padding: 14px 22px; border-bottom: 1px solid #cdd7df; display: flex; align-items: center; gap: 18px; }
.topo-formulario > img { border: 2px solid var(--azul); border-radius: 50%; padding: 4px; box-shadow: 0 2px 4px #aaa; }
.topo-formulario h2 { margin: 0; color: #5d6267; font: 22px Normal, Arial, sans-serif; letter-spacing: .4px; }
.topo-formulario p { margin: 5px 0 0; font-size: 13px; }
.secao { padding: 18px 22px; border-bottom: 1px solid #e2e7eb; }
.secao h3 { margin: 0 0 13px; color: #075a9f; font: 18px Label, Arial, sans-serif; }
.grade { display: grid; gap: 15px; }
.grade-dados { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grade-dados label:nth-child(n + 3) { max-width: calc(50% - 7px); }
label, legend { color: #126fc1; font-size: 13px; }
.grade label { display: grid; gap: 5px; min-width: 0; }
input, select { width: 100%; min-height: 43px; border: 1px solid #bdcad4; border-radius: 7px; background: #fff; color: #3d464d; font: 16px Normal, Arial, sans-serif; padding: 8px 10px; outline: none; }
input:focus, select:focus { border-color: var(--azul); box-shadow: 0 0 0 3px rgba(22, 136, 232, .16); }
.atributos { padding: 0; margin: 0; border: 0; }
.atributos legend { margin-bottom: 12px; font-family: Label, Arial, sans-serif; }
.atributos legend span { color: #7a8288; font-family: Normal, Arial, sans-serif; }
.lista-atributos { display: flex; flex-wrap: wrap; gap: 9px 16px; padding: 0 0 18px; }
.lista-atributos label { display: inline-flex; align-items: center; gap: 5px; color: #0d76d0; cursor: pointer; white-space: nowrap; }
.lista-atributos input { width: 14px; min-height: 14px; margin: 0; accent-color: var(--azul); }
.grade-quantidades { grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 3px 0 19px; }
.grade-quantidades input { border: 0; border-bottom: 1px solid var(--azul); border-radius: 0; text-align: center; }
.grade-preferencias { grid-template-columns: 1.25fr repeat(3, 1fr); }
.grade-preferencias label:nth-last-child(-n + 2) { max-width: 220px; }
.acoes-formulario { padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #fbfcfd; }
.acoes-formulario p { margin: 0; color: #67717a; font-size: 13px; }
.acoes-formulario button { background: #222; }
.acoes-formulario button:disabled { opacity: .6; cursor: wait; }
.mensagem-formulario { min-height: 0; margin: 0; padding: 0 22px; font: 14px Label, Arial, sans-serif; }
.mensagem-formulario.sucesso, .mensagem-formulario.erro { min-height: 42px; padding-top: 12px; }
.mensagem-formulario.sucesso { background: #e7f7ed; color: #167044; }
.mensagem-formulario.erro { background: #fff0f0; color: #ae2b2b; }

@media (max-width: 780px) {
    .cabecalho-interesses { min-height: 88px; padding: 13px 16px; }
    .marca-interesses h1 { font-size: 25px; }
    .marca-interesses p { display: none; }
    .pagina-interesses { width: min(100% - 18px, 620px); margin: 10px auto; }
    .grade-dados, .grade-preferencias { grid-template-columns: 1fr 1fr; }
    .grade-dados label:nth-child(n + 3), .grade-preferencias label:nth-last-child(-n + 2) { max-width: none; }
    .grade-quantidades { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 520px) {
    .cabecalho-interesses { padding: 11px; }
    .marca-interesses img { width: 43px; height: 43px; }
    .marca-interesses h1 { font-size: 21px; }
    .botao-voltar { padding: 8px; font-size: 0; }
    .botao-voltar img { width: 21px; height: 21px; }
    .topo-formulario, .secao, .acoes-formulario { padding-left: 15px; padding-right: 15px; }
    .topo-formulario { align-items: flex-start; }
    .topo-formulario h2 { font-size: 19px; }
    .grade-dados, .grade-preferencias, .grade-quantidades { grid-template-columns: 1fr; }
    .lista-atributos { gap: 10px 12px; }
    .acoes-formulario { align-items: stretch; flex-direction: column; }
}
