/* Variaveis tema */
:root{
    --cor-fundo:#f7f9fc;
    --cor-cartao:#ffffff;
    --cor-destaque:#0066cc;
    --cor-texto-suave:#6b7280;
    --cor-texto-principal:#0f172a;

    --borda-arredondada:12px;
    --sombra: 0 6px 18px rgba(16,24,40,0.08);

    font-family: 'Jeju Gothic', sans-serif
}

body{
    margin:0;
    background:var(--cor-fundo);
    color:var(--cor-texto-principal);
    -webkit-font-smoothing:antialiased;
}

/* cabeçalho principal */
.cabecalho-cargorastreio{
    width:100%;
    padding:1.25rem 2rem;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    color:#ffffff;
    font-weight:700;
    font-size:1rem;

    background: linear-gradient(90deg, #122530 0%, #1e3a5f 40%, #2b6b82 70%);
    box-shadow:var(--sombra);
    margin-bottom:30px;
    min-height:88px;
}

.cabecalho-cargorastreio .cabecalho-interno{
    width:100%;
    max-width:1100px;
    padding:0 20px;
    display:flex;
    align-items:center;
}

.cabecalho-cargorastreio h1{
    margin:0;
    font-size:60px;
    gap: 1rem
}

/* Responsivo */
@media (max-width:600px){
    .cabecalho-cargorastreio{
        padding:0.8rem 1rem;
        min-height:64px;
    }

    .cabecalho-cargorastreio h1{
        font-size:22px;
    }
}

/* container principal */
.conteiner{
    max-width:900px;
    margin:0 auto;
    padding:20px;
}

/* Header do faq */
header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px;
}

.descricao{
    color:var(--cor-texto-suave);
    font-size:0.95rem;
}

/* Barra de pesquisa */
.controles{
    display:flex;
    align-items:center;
}

.barra-pesquisa{
    display:flex;
    gap:8px;
    background:var(--cor-cartao);
    padding:8px 14px;
    border-radius:999px;
    border:1px solid rgba(0,0,0,0.05);
    box-shadow:var(--sombra);
}

.barra-pesquisa input{
    border:0;
    outline:0;
    background:transparent;
    font-size:0.95rem;
    width:200px;
}

/* Lista de perguntas */
.faq-lista{
    margin-top:25px;
    display:grid;
    gap:14px;
}

/* Item do faq */
details{
    background:var(--cor-cartao);
    padding:16px;
    border-radius:var(--borda-arredondada);
    box-shadow:var(--sombra);
    border:1px solid rgba(0,0,0,0.05);
    transition:transform .12s ease;
    cursor:pointer;
}

details[open]{
    transform:translateY(-2px);
}

/* Titulo */
summary{
    list-style:none;
    font-size:1rem;
    font-weight:600;
    display:flex;
    justify-content:space-between;
    align-items:center;
    cursor:pointer;
}

summary::-webkit-details-marker{
    display:none;
}

/* Seta */
.icone-seta{
    font-size:1.2rem;
    color:var(--cor-destaque);
    transition:transform .2s ease;
}

details[open] .icone-seta{
    transform:rotate(180deg);
}

/* texto da resposta */
.resposta{
    margin-top:10px;
    color:var(--cor-texto-suave);
    font-size:0.96rem;
    line-height:1.5;
}

/* Responsivo */
@media (max-width:600px){
    header{
        flex-direction:column;
        align-items:flex-start;
    }

    .barra-pesquisa input{
        width:120px;
    }
}

/* Botão Voltar para Home */
.voltar-home {
  position: fixed;
  bottom: 20px;
  left: 20px; /* fica no canto inferior esquerdo */
  background-color: #1e3a5f;
  color: #fff;
  padding: 12px 18px;
  border-radius: 50px;
  font-weight: bold;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  transition: background-color 0.3s ease, transform 0.2s ease;
  z-index: 9999;
}

.voltar-home:hover {
  background-color: #16314a;
  transform: translateY(-3px);
}