/* =========================================================
   CONTIGO – DESKTOP (NORMAL)
========================================================= */

:root{
  --ci-yellow:#f4bd2f;
  --ci-blue:#1B4F8D;
  --ci-gray:#20242C;
  --ci-border: rgba(32,36,44,.16);
  --ci-muted: rgba(32,36,44,.70);
  --ci-shadow: 0 10px 22px rgba(32,36,44,.06);
}

/* ================= GLOBAL ================= */
html, body, body *{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  color: var(--ci-gray);
}

body{
  background:#ffffff !important;
}

/* ================= REMOVE AQUA (#1da0a9) ================= */
*:focus{
  outline-color: var(--ci-blue) !important;
}

input:focus,
select:focus,
textarea:focus{
  border-color: var(--ci-blue) !important;
  box-shadow: 0 0 0 4px rgba(27,79,141,.15) !important;
  outline:none !important;
}

/* Kill aqua borders on buttons */
button,
input[type="button"],
input[type="submit"]{
  border-color: rgba(32,36,44,.25) !important;
}

/* ================= TITLES ================= */
.stepTitle{
  color: var(--ci-blue) !important;
  font-weight: 900 !important;
  letter-spacing:-0.02em !important;
}

/* ================= CARDS ================= */
.inputPanel{
  background:#ffffff !important;
  border:1px solid var(--ci-border) !important;
  border-radius:14px !important;
  box-shadow: var(--ci-shadow) !important;
}

.panelTitle{
  color: var(--ci-blue) !important;
  font-weight: 900 !important;
}

.panelDesc{
  color: var(--ci-muted) !important;
  font-weight: 600 !important;
}

/* ================= INPUTS ================= */
.pnlInput{
  border-bottom: 2px solid rgba(27,79,141,.25) !important;
}

.pnlInput:focus-within{
  border-bottom-color: var(--ci-blue) !important;
}

.pnlInput input,
.pnlInput select{
  font-family: inherit !important;
  color: var(--ci-gray) !important;
}

.pnlInput input::placeholder{
  color: rgba(32,36,44,.40) !important;
}

/* ================= ICONS ================= */
.inputPanel svg,
.inputPanel svg *{
  stroke: var(--ci-blue) !important;
  fill: none !important;
}

.inputPanel:hover svg,
.inputPanel:hover svg *{
  stroke: var(--ci-blue) !important;
}

/* ================= BUTTONS ================= */
button,
input[type="button"],
input[type="submit"]{
  font-weight: 900 !important;
  border-radius: 16px !important;
}

.nextButton button,
button[type="submit"]{
  background: var(--ci-yellow) !important;
  color: var(--ci-gray) !important;
  border: 1px solid rgba(32,36,44,.18) !important;
  box-shadow: 0 10px 18px rgba(244,189,47,.25) !important;
}

.nextButton *,
button *{
  color: var(--ci-gray) !important;
}

/* ================= LINKS ================= */
a{
  color: var(--ci-blue) !important;
  font-weight:800 !important;
  text-decoration:none !important;
}
a:hover{
  text-decoration:underline !important;
}

/* ================= CHECKBOX ================= */
input[type="checkbox"]{
  accent-color: var(--ci-yellow) !important;
}