/*
  EIC guide pages (new-system-guide.cfm, member-guide.cfm)
  Loaded via request.sm.core.addHeadInclude(). Every rule is scoped to .eic-guide
  with enough specificity to beat the site's .typography list/heading rules
  (gold square bullets, 30px li margins, 28px uppercase h3).
  Colors come from the site palette in /assets/css/site.css.
*/
.eic-guide {
  --eic-navy: #002f86;
  --eic-ink: #111c24;
  --eic-gold: #d6ba8b;
  --eic-gold-dark: #8a6d3b;
  --eic-gold-tint: #f8f3ea;
  --eic-gray: #f4f4f4;
  --eic-line: #dcdde0;
  --eic-muted: #686e78;
  max-width: 820px;
  margin-top:20px;
}

.eic-guide .eic-eyebrow { font-size: 0.8rem; letter-spacing: 0.15em; text-transform: uppercase; font-weight: 600; color: var(--eic-muted); margin: 0 0 0.5rem; }
.eic-guide .eic-lede { font-size: 1.2rem; margin: 0 0 2rem; }
.eic-guide .eic-intro { margin: 0 0 1rem; }

/* Callouts and notes */
.eic-guide .eic-callout { border-left: 4px solid var(--eic-gold); background: var(--eic-gold-tint); padding: 1rem 1.25rem; margin: 1rem 0; }
.eic-guide .eic-callout p { margin: 0 0 0.5rem; }
.eic-guide .eic-callout p:last-child { margin-bottom: 0; }
.eic-guide .eic-note { border: 1px solid var(--eic-line); background: #fff; padding: 0.75rem 1rem; margin: 0.75rem 0; font-size: 0.95rem; }

/* Card-style lists: remove the site's bullets and li spacing */
.eic-guide .eic-criteria,
.eic-guide .eic-cards,
.eic-guide .eic-rules,
.eic-guide .eic-gates { list-style: none; padding: 0; margin: 0 0 1rem; }
.eic-guide .eic-criteria > li,
.eic-guide .eic-cards > li,
.eic-guide .eic-rules > li,
.eic-guide .eic-gates > li { margin: 0 0 0.75rem; padding: 1rem 1.25rem; background: var(--eic-gray); border-left: 4px solid var(--eic-navy); }
.eic-guide .eic-criteria > li::before,
.eic-guide .eic-cards > li::before,
.eic-guide .eic-rules > li::before,
.eic-guide .eic-gates > li::before { content: none; display: none; }

.eic-guide .eic-criteria { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.eic-guide .eic-criteria > li { margin: 0; }

.eic-guide .eic-gates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.9rem; }
.eic-guide .eic-gates > li { margin: 0; background: var(--eic-gold-tint); border-left-color: var(--eic-gold); }
.eic-guide .eic-gates p { margin: 0; }

.eic-guide .eic-gate-label { display: block; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; color: var(--eic-gold-dark); margin-bottom: 0.25rem; }

/* Numbered timeline */
.eic-guide .eic-steps { list-style: none; counter-reset: eic-step; padding: 0; margin: 1.5rem 0 2rem; }
.eic-guide .eic-steps > li { counter-increment: eic-step; position: relative; margin: 0 0 0 1.25rem; padding: 0 0 1.75rem 2.5rem; border-left: 2px solid var(--eic-line); }
.eic-guide .eic-steps > li:last-child { border-left-color: transparent; padding-bottom: 0; }
.eic-guide .eic-steps > li::before { content: counter(eic-step); position: absolute; left: -1.3rem; top: -0.1rem; float: none; margin: 0; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--eic-navy); color: #fff; font-size: 1rem; font-weight: 700; line-height: 1; display: flex; align-items: center; justify-content: center; }
.eic-guide .eic-steps > li.eic-gate::before { background: var(--eic-gold); color: var(--eic-ink); }
.eic-guide .eic-steps p { margin: 0 0 0.5rem; }
.eic-guide .eic-gate-box { background: var(--eic-gold-tint); border-left: 4px solid var(--eic-gold); padding: 1rem 1.25rem; }
.eic-guide .eic-gate-box p:last-child { margin-bottom: 0; }

/* Keep h3s readable inside cards and steps (site default is 28px) */
.eic-guide .eic-steps h3,
.eic-guide .eic-gates h3 { font-size: 1.125rem; line-height: 1.3; letter-spacing: 0.5px; margin: 0.35rem 0 0.35rem; }
.eic-guide .eic-gate-box h3,
.eic-guide .eic-gates h3 { margin-top: 0; }

/* Contacts */
.eic-guide .eic-contacts { display: flex; gap: 1.5rem 3rem; flex-wrap: wrap; margin: 1rem 0 0; }
.eic-guide .eic-contacts p { margin: 0; }

@media (max-width: 600px) {
  .eic-guide .eic-criteria,
  .eic-guide .eic-gates { grid-template-columns: 1fr; }
}
