:root{
  --marinho:#0b1d3f;          /* fundo da logo (ajuste com o valor do identify) */
  --marinho-2:#14306b;
  --dourado:#c9971c;
  --dourado-claro:#e8bd52;
  --dourado-escuro:#a67c12;
  --fundo:#f3f5f9;
  --borda:#d6dce8;
  --texto:#1c2536;
  --raio:12px;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  background:var(--fundo);
  color:var(--texto);
  line-height:1.5;
}

/* Cabeçalho com a logo */
.topo{
  background:var(--marinho);
  text-align:center;
  padding:24px 16px 72px;
  border-bottom:4px solid var(--dourado);
}
.topo img{
  display:block;
  margin:0 auto 8px;
  width:100%;
  max-width:340px;
  height:auto;
}
.topo p{
  margin:0 auto;
  max-width:560px;
  color:#e9edf6;
  font-size:1.05rem;
}
.topo p strong{color:var(--dourado-claro)}

main{max-width:780px;margin:0 auto;padding:16px}
.topo + main{margin-top:-48px}   /* o formulário sobe sobre o cabeçalho */

/* Blocos do formulário */
fieldset{
  background:#fff;
  border:1px solid var(--borda);
  border-top:4px solid var(--dourado);
  border-radius:var(--raio);
  box-shadow:0 6px 18px rgba(11,29,63,.08);
  margin:22px 0;
  padding:24px;
  display:grid;
  gap:16px;
}
legend{
  font-weight:700;
  font-size:1rem;
  color:var(--dourado-claro);
  background:var(--marinho);
  padding:7px 18px;
  border-radius:999px;
  letter-spacing:.3px;
}

/* Campos */
label{display:flex;flex-direction:column;font-size:.9rem;font-weight:600;gap:6px;color:var(--marinho)}
input,select,textarea{
  font:inherit;
  font-weight:400;
  color:var(--texto);
  padding:11px 12px;
  border:1px solid var(--borda);
  border-radius:8px;
  background:#fbfcfe;
  transition:border-color .15s, box-shadow .15s;
}
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:var(--dourado);
  box-shadow:0 0 0 3px rgba(201,151,28,.25);
  background:#fff;
}
textarea{min-height:90px;resize:vertical}

/* Botões */
button{
  font:inherit;
  font-weight:700;
  background:linear-gradient(180deg,var(--dourado-claro),var(--dourado));
  color:var(--marinho);
  border:0;
  border-radius:8px;
  padding:14px 22px;
  cursor:pointer;
  transition:filter .15s, transform .05s;
}
button:hover{filter:brightness(1.06)}
button:active{transform:translateY(1px)}
button[type=submit]{width:100%;font-size:1.1rem;margin:8px 0 32px;padding:16px}
#add{
  background:#fff;
  color:var(--dourado-escuro);
  border:2px dashed var(--dourado);
}
#add:hover{background:#fff8e6;filter:none}

/* Contratos e consentimento */
.contrato{
  display:grid;
  gap:16px;
  border-top:2px dashed var(--borda);
  padding-top:16px;
}
.check{
  flex-direction:row;
  align-items:flex-start;
  gap:10px;
  font-weight:400;
  color:var(--texto);
  background:#fff;
  border:1px solid var(--borda);
  border-left:4px solid var(--dourado);
  border-radius:var(--raio);
  padding:16px;
}
.check input{margin-top:3px;accent-color:var(--dourado-escuro)}
.check a{color:var(--marinho-2);font-weight:600}

/* Página de agradecimento */
.cartao{
  background:#fff;
  border:1px solid var(--borda);
  border-top:4px solid var(--dourado);
  border-radius:var(--raio);
  box-shadow:0 6px 18px rgba(11,29,63,.08);
  padding:32px 24px;
  text-align:center;
}
.cartao h1{margin:0 0 8px;color:var(--marinho)}
.cartao .protocolo{
  display:inline-block;
  margin:12px 0;
  padding:8px 20px;
  background:var(--marinho);
  color:var(--dourado-claro);
  border-radius:999px;
  font-weight:700;
  letter-spacing:1px;
}

/* NÃO APAGUE: campo-armadilha contra robôs (honeypot) */
.hp{position:absolute;left:-9999px}

/* Rodapé */
.rodape{
  text-align:center;
  font-size:.8rem;
  color:#5b6577;
  padding:0 16px 32px;
}

/* Telas maiores: campos em duas colunas */
@media(min-width:640px){
  fieldset{grid-template-columns:1fr 1fr}
  .contrato{grid-column:1/-1;grid-template-columns:1fr 1fr}
}

/* ===== PÁGINA INICIAL ===== */
.hero{padding:32px 16px 56px}
.hero h1{
  color:#fff;
  font-size:1.8rem;
  line-height:1.25;
  max-width:640px;
  margin:8px auto 12px;
}
.hero p{margin-bottom:24px}

/* Botão em formato de link */
.btn{
  display:inline-block;
  font-weight:700;
  font-size:1.05rem;
  text-decoration:none;
  color:var(--marinho);
  background:linear-gradient(180deg,var(--dourado-claro),var(--dourado));
  padding:15px 30px;
  border-radius:8px;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
  transition:filter .15s, transform .05s;
}
.btn:hover{filter:brightness(1.07)}
.btn:active{transform:translateY(1px)}

/* Seções */
.secao{max-width:980px;margin:0 auto;padding:48px 16px}
.secao h2{
  text-align:center;
  color:var(--marinho);
  font-size:1.6rem;
  margin:0 0 28px;
}
.secao h2::after{
  content:"";
  display:block;
  width:56px;height:4px;
  background:var(--dourado);
  border-radius:2px;
  margin:10px auto 0;
}
/* faixa de fundo que ocupa a largura toda */
.fundo-claro{
  max-width:none;
  background:#fff;
  border-top:1px solid var(--borda);
  border-bottom:1px solid var(--borda);
  padding-left:max(16px, calc((100% - 980px) / 2));
  padding-right:max(16px, calc((100% - 980px) / 2));
}

/* Cartões */
.cards{
  display:grid;
  gap:18px;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
}
.card{
  background:#fff;
  border:1px solid var(--borda);
  border-top:4px solid var(--dourado);
  border-radius:var(--raio);
  box-shadow:0 6px 18px rgba(11,29,63,.07);
  padding:22px;
}
.fundo-claro .card{background:var(--fundo)}
.card h3{margin:0 0 8px;font-size:1.05rem;color:var(--marinho)}
.card p{margin:0;font-size:.95rem}
.num{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;
  background:var(--marinho);
  color:var(--dourado-claro);
  font-weight:700;
  border-radius:50%;
  margin-bottom:10px;
}

/* Perguntas frequentes */
.faq{max-width:720px;margin:0 auto}
.faq details{
  background:var(--fundo);
  border:1px solid var(--borda);
  border-left:4px solid var(--dourado);
  border-radius:10px;
  padding:14px 18px;
  margin-bottom:12px;
}
.faq summary{cursor:pointer;font-weight:700;color:var(--marinho)}
.faq details p{margin:10px 0 0}

/* Chamada final */
.cta{
  max-width:none;
  background:var(--marinho);
  border-top:4px solid var(--dourado);
  text-align:center;
}
.cta h2{color:#fff}
.cta p{color:#e9edf6;margin:0 0 24px}

/* Rodapé extra */
.rodape a{color:var(--marinho-2);font-weight:600}
.rodape .aviso{font-size:.75rem;opacity:.85}

@media(min-width:640px){
  .hero h1{font-size:2.3rem}
}

/* Link "Voltar ao início" dentro do cabeçalho */
.voltar{
  display:inline-block;
  margin-top:14px;
  padding:7px 16px;
  color:var(--dourado-claro);
  font-size:.9rem;
  font-weight:600;
  text-decoration:none;
  border:1px solid rgba(232,189,82,.5);
  border-radius:999px;
  transition:background .15s, color .15s;
}
.voltar:hover{
  background:var(--dourado-claro);
  color:var(--marinho);
}


/* ===== BANNER COM FOTO ===== */
.banner{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:460px;
  max-height:640px;
  padding:32px 16px;
  background:
    linear-gradient(180deg, rgba(11,29,63,.82) 0%, rgba(11,29,63,.55) 100%),
    url("../img/banner-mobile.jpg") center / cover no-repeat;
  border-bottom:4px solid var(--dourado);
}
.banner-texto{
  text-align:center;
  max-width:680px;
}
.banner-logo-img{
  display:block;
  width:100%;
  max-width:260px;
  height:auto;
  margin:0 auto 16px;
}
.banner-texto h1{
  margin:0 0 10px;
  color:#fff;
  font-size:1.6rem;
  line-height:1.25;
  text-shadow:0 2px 10px rgba(0,0,0,.6);
}
.banner-texto p{
  margin:0 0 22px;
  color:#f1f4fa;
  text-shadow:0 2px 8px rgba(0,0,0,.6);
}

@media(min-width:800px){
  .banner{
    min-height:520px;
    background:
      linear-gradient(180deg, rgba(11,29,63,.82) 0%, rgba(11,29,63,.55) 100%),
      url("../img/banner.jpg") center / cover no-repeat;
  }
  .banner-texto h1{font-size:2.2rem}
}

/* Banner das páginas internas (mesma foto, mais baixo) */
.banner-interno{
  min-height:320px;
}
.banner-interno .banner-texto p{margin-bottom:0}
.banner-interno .voltar{margin-top:16px}

@media(min-width:800px){
  .banner-interno{min-height:360px}
}

/* ===== PÁGINAS DE TEXTO (privacidade, termos) ===== */
.texto-legal{
  background:#fff;
  border:1px solid var(--borda);
  border-top:4px solid var(--dourado);
  border-radius:var(--raio);
  box-shadow:0 6px 18px rgba(11,29,63,.08);
  padding:28px 22px;
  margin:24px 0 32px;
}
.texto-legal h2{
  color:var(--marinho);
  font-size:1.15rem;
  margin:28px 0 8px;
  padding-left:12px;
  border-left:4px solid var(--dourado);
}
.texto-legal h2:first-of-type{margin-top:8px}
.texto-legal p,.texto-legal li{font-size:.97rem}
.texto-legal ul{padding-left:22px;margin:8px 0}
.texto-legal li{margin-bottom:6px}
.texto-legal .atualizacao{color:#5b6577;font-size:.85rem;margin:0}
@media(min-width:640px){.texto-legal{padding:36px 40px}}

