/* ============================================================
   ESTILOS GERAIS - CIC 2025 (IMMES)
   ============================================================ */

   :root {
    --ink:#0f172a; 
    --muted:#64748b; 
    --line:#e5e7eb; 
    --accent:#0b57d0; 
    --danger:#dc2626;
    --bg:#ffffff;
    --radius:14px;
    --gap:14px;
    --max:980px;
    --shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.1);
  }
  
  /* ===== RESET BÁSICO ===== */
  *{box-sizing:border-box}
  body {
    margin:0;
    font-family:system-ui,Segoe UI,Roboto,Inter,Arial;
    color:var(--ink);
    background:var(--bg);
    line-height:1.5;
  }
  
  .wrap { max-width:var(--max); margin:0 auto; padding:28px 16px 40px; }
  h1 { font-size:1.6rem; margin:0 0 8px; }
  h2 { font-size:1.2rem; margin:0 0 8px; }
  p { margin:0 0 10px; color:var(--muted); }
  .muted { color:var(--muted); font-size:.92rem; }
  
  /* ===== CARDS ===== */
  .card {
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:#fff;
    box-shadow:var(--shadow);
    margin-bottom:20px;
  }
  .section { padding:18px; }
  .section + .section { border-top:1px solid var(--line); }
  
  /* ===== FORMULÁRIOS ===== */
  .label { font-size:.95rem; color:var(--muted); display:block; margin-bottom:6px; }
  .req::after { content:" *"; color:var(--danger); }
  
  .input, .select, .textarea {
    width:100%;
    padding:12px 14px;
    color:var(--ink);
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    outline:none;
    transition:border-color .15s, box-shadow .15s;
  }
  
  .input:focus, .select:focus, .textarea:focus {
    border-color:var(--accent);
    box-shadow:0 0 0 3px rgba(11,87,208,.12);
  }
  
  textarea { min-height:120px; resize:vertical; }
  
  /* remove setinhas do input number */
  input[type=number]::-webkit-inner-spin-button,
  input[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
  input[type=number]{ -moz-appearance:textfield; }
  
  /* honeypot invisível */
  .honeypot { position:absolute; left:-9999px; top:-9999px; height:0; width:0; overflow:hidden; }
  
  /* fieldset */
  fieldset {
    border:1px solid var(--line);
    border-radius:10px;
    padding:12px 16px 16px;
    margin-bottom:16px;
  }
  legend { padding:0 6px; color:var(--muted); font-weight:600; }
  
  /* ===== GRID ===== */
  .grid { display:grid; gap:var(--gap); }
  @media (min-width:760px){ .cols-2 { grid-template-columns:1fr 1fr; } }
  
  /* ===== BOTÕES ===== */
  .actions {
    display:flex;
    gap:12px;
    justify-content:flex-end;
    margin-top:20px;
  }
  .btn {
    border:0;
    padding:12px 16px;
    border-radius:12px;
    cursor:pointer;
    font-weight:600;
  }
  .btn-primary {
    background:var(--accent);
    color:#fff;
    text-decoration: none;
  }
  .btn-primary:hover {
    filter:brightness(.95);
  }
  .btn-ghost {
    background:#fff;
    color:var(--muted);
    border:1px solid var(--line);
  }
  .btn-ghost:hover {
    background:#f9fafb;
  }
  
  /* ===== LISTAS / TIMELINE ===== */
  .timeline ul { margin:8px 0 0 0; padding:0 0 0 18px; }
  .timeline li { margin:6px 0; }
  
  /* ===== DESTAQUE ===== */
  .highlight {
    background:#f6f9fe;
    border:1px solid #dbe7ff;
    padding:10px;
    border-radius:10px;
  }
  
  /* ===== DARK MODE ===== */
  @media (prefers-color-scheme: dark) {
    :root {
      --bg:#0b0b0b; 
      --ink:#e5e7eb; 
      --muted:#a1a1aa; 
      --line:#262626;
    }
    .card { background:#111113; border-color:#262626; }
    .input, .select, .textarea { background:#0f0f10; border-color:#262626; color:var(--ink); }
    .btn-ghost { background:#0f0f10; border-color:#262626; }
  }

  /* ===== Fundo global com imagem ===== */
body {
    background:
      url("img/bg.jpg") center / cover no-repeat fixed;
    color: var(--ink);
    font-family: system-ui, Segoe UI, Roboto, Inter, Arial;
  }


  :root{--ink:#111;--muted:#555;--line:#e6e6e6;--accent:#0b57d0;--danger:#c62828;--radius:12px;--gap:14px;--max:860px}
  *{box-sizing:border-box}
  body{margin:0;font-family:system-ui,Segoe UI,Roboto,Inter,Arial;color:var(--ink)}
  .wrap{max-width:var(--max);margin:0 auto;padding:28px 16px 40px}
  h1{font-size:1.6rem;margin:0 0 8px}
  p{margin:0 0 10px;color:var(--muted)}
  .card{border:1px solid var(--line);border-radius:var(--radius);background:#fff}
  .section{padding:18px}
  .section+.section{border-top:1px solid var(--line)}
  form{display:grid;gap:var(--gap)}
  label{font-size:.95rem;color:var(--muted);display:block;margin-bottom:6px}
  input,select{width:100%;padding:12px 14px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:10px;outline:none;transition:.15s border-color,.15s box-shadow}
  input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(11,87,208,.12)}
  .grid{display:grid;gap:var(--gap)}
  @media (min-width:700px){.cols-2{grid-template-columns:1fr 1fr}}
  .req::after{content:" *";color:var(--danger)}
  .actions{display:flex;gap:12px;justify-content:flex-end}
  button{border:0;padding:12px 16px;border-radius:10px;cursor:pointer;font-weight:600}
  .btn-primary{background:var(--accent);color:#fff}
  .btn-ghost{background:#fff;color:var(--muted);border:1px solid var(--line)}
  .honeypot{position:absolute;left:-9999px;top:-9999px;height:0;width:0;overflow:hidden}
  .muted{color:var(--muted);font-size:.92rem}

  /* ======== BANNER TOPO ======== */
.banner-topo {
  width: 100%;
  text-align: center;
  background: rgba(255,255,255,0.85);
  border-bottom: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.banner-topo img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* ======== FOOTER COM LOGO ======== */
.footer-immes {
  text-align: center;
  padding: 24px 16px 40px;
  color: var(--muted);
  font-size: 0.9rem;
}
.footer-immes img {
  display: block;
  margin: 0 auto 8px;
  max-width: 160px;
  height: auto;
  opacity: 0.9;
}
.footer-immes p {
  margin: 0;
  opacity: 0.85;
}
.footer-immes img{
  width: 180px;
  margin-top: 50px;
}


:root{
  --ink:#111; --muted:#555; --line:#e6e6e6; --accent:#0b57d0; --danger:#c62828;
  --radius:12px; --gap:14px; --max:980px;
}
*{box-sizing:border-box}
body{margin:0; font-family:system-ui,Segoe UI,Roboto,Inter,Arial; color:var(--ink); line-height:1.45;}
.wrap{max-width:var(--max); margin:0 auto; padding:28px 16px 40px;}
h1{font-size:1.6rem; margin:0 0 8px;}
p{margin:0 0 10px; color:var(--muted);}
.card{border:1px solid var(--line); border-radius:var(--radius); background:#fff;}
.section{padding:18px;}
.section + .section{border-top:1px solid var(--line);}
.timeline h2{font-size:1.1rem; margin:0 0 8px;}
.timeline ul{margin:8px 0 0 0; padding:0 0 0 18px;}
.timeline li{margin:6px 0;}
.highlight{background:#f6f9fe; border:1px solid #dbe7ff; padding:10px; border-radius:10px;}
form{display:grid; gap:var(--gap);}
label{font-size:.95rem; color:var(--muted); display:block; margin-bottom:6px;}
input[type="text"],input[type="number"], input[type="email"], textarea, select{
  width:100%; padding:12px 14px; color:var(--ink); background:#fff;
  border:1px solid var(--line); border-radius:10px; outline:none; transition:.15s border-color,.15s box-shadow;
}
textarea{min-height:120px; resize:vertical;}
input:focus, textarea:focus, select:focus{
  border-color:var(--accent); box-shadow:0 0 0 3px rgba(11,87,208,.12);
}
fieldset{border:1px solid var(--line); border-radius:10px; padding:12px;}
legend{padding:0 6px; color:var(--muted); font-weight:600;}

.grid{display:grid; gap:var(--gap);}
@media (min-width:760px){ .cols-2{grid-template-columns:1fr 1fr;} }
.req::after{content:" *"; color:var(--danger);}
.actions{display:flex; gap:12px; justify-content:flex-end;}
button{border:0; padding:12px 16px; border-radius:10px; cursor:pointer; font-weight:600;}
.btn-primary{background:var(--accent); color:#fff;}
.btn-ghost{background:#fff; color:var(--muted); border:1px solid var(--line);}
.muted{color:var(--muted); font-size:.92rem;}
.honeypot{position:absolute; left:-9999px; top:-9999px; height:0; width:0; overflow:hidden;}

h1, .sub, .choice, .choice p, .actions a, p, .muted {
  color:#fff
}
input[type="text"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
  width: 100%;
  padding: 12px 14px;
  color: var(--ink);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(11,87,208,.12);
}

/* impede que checkbox/radio “estichem” e desalinharem */
input[type="checkbox"],
input[type="radio"] {
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  box-shadow: none;
}

/* fieldset e labels de opções alinhados à esquerda */
fieldset {
  text-align: left;
}

/* define layout das opções (checkbox/radio + texto) */
label.option {
  display: flex;
  align-items: flex-start; /* ícone e texto alinhados pelo topo */
  gap: 8px;
  margin: 6px 0;
  color: #222;
  width: fit-content;      /* evita que a linha ocupe 100% */
  text-align: left;
}

/* ligeiro ajuste vertical no input */
label.option input {
  flex: 0 0 auto;
  margin-top: 2px;
}
.btn-secondary {
    background: #e0e0e0;
    color: #111;
    padding: 10px 16px;
    border-radius: 6px;
    display: inline-block;
    text-decoration: none;
    font-weight: 500;
}

.btn-secondary:hover {
    background: #d5d5d5;
}
