/* =========================================================
   Insure Choice — steps.html visual refresh (v2)
   Loaded AFTER styles.css. Pure overrides: no IDs/classes
   the JS depends on are renamed or removed.
   ========================================================= */
:root {
  --orange: #F16E16;
  --orange-600: #D95D07;
  --orange-50: #FFF4EC;
  --blue: #0B4F8A;
  --blue-700: #083B68;
  --blue-50: #EEF5FC;
  --ink: #17212B;
  --body: #3A4652;
  --muted: #66727E;
  --line: #E3E8EE;
  --tint: #F6F8FB;
}

body, button, input, select, textarea { font-family: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important; }
body { color: var(--body); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6, .rd-h1, .main-content h2, .sidebar h2, .sidebar h3, label, p, a, span, div { font-family: inherit !important; }
header .header-container { padding-left: 20px; padding-right: 20px; }

/* ---------- Header ---------- */
header { background: #fff; border-bottom: 1px solid var(--line); box-shadow: none; }
header .logo img { height: 46px; width: auto; }
header .rating { font-size: 14px; color: var(--muted); }
header .rating .stars { color: var(--orange); }
header .contact-info p { color: var(--muted); font-size: 13.5px; }
header .phone-number {
  color: var(--blue) !important; font-weight: 800; font-size: 17px; text-decoration: none;
}
.lang-btn { border-radius: 999px; font-weight: 600; }

/* ---------- Progress ---------- */
.progress-container { background: var(--tint); border-bottom: 1px solid var(--line); }
.progress-container .progress-bar-container { height: 40px; font-size: 13.5px; }
.item-progress { border-right-color: #F4C7A6; color: var(--muted); font-weight: 600; }
.item-progress.active { color: #fff; }
.progress-topbar, .progress-mobile { background: var(--orange); }
/* "Step 2/15" reads as a long form and the numbering skips; the bar already shows progress */
.step-detail { display: none !important; }
.back-button {
  background: transparent !important; color: var(--blue) !important; font-weight: 700;
  border-right: 1px solid var(--line) !important;
}
.back-button svg { stroke: var(--blue) !important; }

/* ---------- Form cards ---------- */
.main-content .inner-cont { padding-top: 32px; }
.rd-card {
  border: 1px solid var(--line) !important; border-radius: 18px !important;
  box-shadow: 0 10px 30px -14px rgba(16, 33, 52, .22) !important;
  padding: 28px 32px !important; background: #fff;
}
.rd-h1, .main-content h2 { color: var(--ink) !important; font-weight: 800 !important; letter-spacing: -0.01em; }
.rd-sub { color: var(--muted) !important; }
.rd-fld, .rd-section-label { color: var(--ink) !important; font-weight: 700 !important; }
.rd-input, .form-control {
  border: 1.5px solid var(--line) !important; border-radius: 12px !important;
  min-height: 52px; font-size: 17px !important; color: var(--ink) !important;
}
.rd-input:focus, .form-control:focus {
  border-color: #0078D7 !important; box-shadow: 0 0 0 4px rgba(0, 120, 215, .15) !important;
}

/* Choice buttons (coverage, income range, yes/no) */
.option {
  background: var(--orange) !important; border-radius: 12px !important;
  font-weight: 700; transition: background .12s, transform .12s;
}
.option:hover { background: var(--orange-600) !important; transform: translateY(-1px); }
.option.active { background: var(--blue) !important; }
.rd-seg .option { background: #fff !important; color: var(--ink) !important; border: 1.5px solid var(--line) !important; }
.rd-seg .option:hover { border-color: var(--orange) !important; }
.rd-seg .option.active { background: var(--orange-50) !important; border-color: var(--orange) !important; color: var(--orange-600) !important; }
.rd-card-opt { background: #fff !important; color: var(--ink) !important; border: 1.5px solid var(--line) !important; }
.rd-card-opt.active { border-color: var(--orange) !important; background: var(--orange-50) !important; }

.rd-cta, .continue-button {
  background: var(--orange) !important; border-radius: 12px !important;
  font-weight: 800 !important; font-size: 18px !important; min-height: 56px;
  box-shadow: 0 8px 18px -10px rgba(217, 93, 7, .9) !important;
}
.rd-cta:hover, .continue-button:hover { background: var(--orange-600) !important; }

/* Reassurance line injected on the contact step */
.v2-reassure { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 12px; font-size: 14px; color: var(--muted); }
.v2-reassure svg { width: 16px; height: 16px; color: #1F8A5B; flex: none; }

/* TCPA copy: keep readable, never tiny */
.copy-tcpa { font-size: 13.5px !important; line-height: 1.5 !important; color: var(--body) !important; }

/* ---------- Sidebar ---------- */
.sidebar { background: var(--blue) !important; }
.sidebar-section { background: none !important; }
.sidebar .progress-bar-fill { background: var(--orange) !important; }
/* Government-style seal: CMS marketing standards prohibit imagery implying
   government affiliation. Hidden until replaced with a neutral graphic. */
.aca-logo { display: none !important; }

/* Carrier logos under the form */
.insurance-logos img { filter: grayscale(1); opacity: .7; }

@media (max-width: 767px) {
  header .logo img { height: 38px; }
  .main-content .inner-cont { padding-top: 18px; }
  .rd-card { padding: 20px 18px !important; }
}