/* Easy Impound theme assets v2.2.24 — do not edit in place, see README */
/* ==========================================================================
   Easy Impound — shared stylesheet
   Colors and type scale carried over from the original marketing site.
   ========================================================================== */

:root {
  --blue: #2E90FA;
  --blue-dark: #1267C2;
  --blue-deep: #0B4A8F;
  --green: #22C55E;
  --green-dark: #15803D;
  --purple: #7C3AED;
  --amber: #B45309;

  --ink: #0F172A;
  --body: #475569;
  --muted: #5B6B7F;
  --faint: #5F6D80;
  --line: #E2E8F0;
  --tint: #F2F8FF;
  --tint-2: #F8FAFC;

  --wrap: 1080px;
  --radius: 14px;
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, .06);
  --shadow-md: 0 8px 28px rgba(15, 23, 42, .08);
  --shadow-lg: 0 18px 48px rgba(15, 23, 42, .12);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
  color: var(--body);
  background: #fff;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }

a { color: var(--blue-dark); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4 { color: var(--ink); margin: 0 0 12px; line-height: 1.2; font-weight: 700; }
h1 { font-size: clamp(30px, 4.6vw, 46px); letter-spacing: -.02em; }
h2 { font-size: clamp(24px, 3.2vw, 34px); letter-spacing: -.015em; }
h3 { font-size: 18px; }
p  { margin: 0 0 14px; }

/* ---------- WordPress block shims -------------------------------------------
   Page content is stored as editable WordPress blocks, so a few elements that
   were <div> or <span> in the static build are now <p>. These rules strip the
   paragraph box back off them and restore inline display.

   Placement and specificity are deliberate: single class selectors sit here,
   directly after the element reset above, so they beat `p { margin }` but lose
   to every component rule that follows. Moving this block to the end of the
   file, or raising its specificity, will change the layout. */

.ei-p { margin: 0; }
.ei-inline { display: inline-block; }
.ei-btn-line { margin: 0; display: contents; }
.wp-block-group, .wp-block-details, .wp-block-list { margin: 0; }

/* display:contents would hide the button from the editor canvas. */
.editor-styles-wrapper .ei-btn-line { display: block; }

/* Belt and braces for the legacy group wrapper.

   WordPress injects <div class="wp-block-group__inner-container"> inside every
   group block for classic themes with no theme.json. inc/setup.php removes the
   filter that does it; these rules keep the layout standing if a future release
   reintroduces it. display:contents dissolves the wrapper so grid and flex
   children still reach their parent, and the two rules below restore the
   direct-child selectors it would otherwise break. */

.wp-block-group__inner-container { display: contents; }
.stat-strip > .wp-block-group__inner-container > div {
  background: #fff; padding: 22px 18px; text-align: center;
}
.product-card > .wp-block-group__inner-container > p:not(:where(.ei-p)) {
  font-size: 14px; color: var(--muted); margin-bottom: 16px;
}


.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }

/* Present to assistive tech and search engines, invisible on screen */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.narrow { max-width: 760px; margin-left: auto; margin-right: auto; }
.center { text-align: center; }
.lead { font-size: 17px; color: var(--muted); }
.small { font-size: 13px; }
.muted { color: var(--muted); }

/* ---------- Header / nav ---------------------------------------------- */

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, .94);
  backdrop-filter: saturate(180%) blur(10px);
  border-bottom: 1px solid var(--line);
}

.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  height: 66px;
}

.brand { display: flex; align-items: center; }
.brand img { height: 34px; width: auto; }
.brand:hover { text-decoration: none; }

/* Header uses the EI badge alone — the full lockup lives in the hero and footer */
.brand .brand-mark { height: 38px; width: 38px; }
@media (max-width: 780px) { .brand .brand-mark { height: 34px; width: 34px; } }

.nav-links {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nav-links > li { position: relative; }

.nav-links a,
.nav-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 14.5px;
  font-weight: 600;
  color: #334155;
  background: none;
  border: none;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
}

.nav-links a:hover,
.nav-toggle:hover,
.nav-toggle[aria-expanded="true"] {
  background: var(--tint);
  color: var(--blue-dark);
  text-decoration: none;
}

.nav-links a.is-current { color: var(--blue-dark); }

.caret { width: 10px; height: 10px; transition: transform .18s ease; }
.nav-toggle[aria-expanded="true"] .caret { transform: rotate(180deg); }

/* Dropdown */
.dropdown {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: 252px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  padding: 6px;
  display: none;
}
.dropdown.open { display: block; }
/* Invisible bridge over the gap between the toggle and the panel, so the
   pointer never technically "leaves" on the way down to the menu items. */
.dropdown::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 0;
  right: 0;
  height: 10px;
}

/* Overrides .nav-links a, which is an inline-flex nowrap pill */
.nav-links .dropdown-item {
  display: block;
  width: 100%;
  padding: 9px 11px;
  border-radius: 8px;
  white-space: normal;
  font-weight: 400;
  font-size: 14px;
  color: inherit;
}
.nav-links .dropdown-item:hover { background: var(--tint); text-decoration: none; }
.nav-links .dropdown-item:hover .di-title { color: var(--blue-dark); }

.dropdown-item .di-title {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.35;
  margin: 0;
  white-space: nowrap;
}

.dropdown-foot {
  border-top: 1px solid var(--line);
  margin-top: 5px;
  padding: 4px 0 0;
  font-size: 13px;
}
.dropdown-foot > div { padding: 0; }
/* Match the dropdown items exactly so every label shares one left edge */
.nav-links .dropdown-foot a {
  display: block;
  width: 100%;
  padding: 9px 11px;
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--blue-dark);
  white-space: nowrap;
}
.nav-links .dropdown-foot a:hover { background: var(--tint); text-decoration: none; }

.pill {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 20px;
  white-space: nowrap;
}
.pill-blue  { background: #E7F1FE; color: var(--blue-dark); }
.pill-green { background: #E6F7EE; color: var(--green-dark); }
.pill-amber { background: #FEF3C7; color: var(--amber); }
.pill-purple{ background: #F3EEFF; color: #6B21A8; }
.pill-slate { background: #F1F5F9; color: #475569; }

/* A centered row of audience labels. Used under the referral partners hero in
   place of a whole section of headings and body copy. */
.pill-row {
  display: flex; flex-wrap: wrap; gap: 8px;
  justify-content: center; margin-top: 26px;
}
.pill-row .pill { font-size: 11px; padding: 5px 12px; }

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 22px;
  border-radius: 8px;
  font-size: 14.5px;
  font-weight: 600;
  border: 1.5px solid transparent;
  cursor: pointer;
  font-family: inherit;
  transition: background .15s, color .15s, border-color .15s, transform .15s;
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn-primary { background: var(--blue); color: #fff; }
.btn-primary:hover { background: var(--blue-dark); color: #fff; }
.btn-green { background: var(--green-dark); color: #fff; }
.btn-green:hover { background: #116B34; color: #fff; }
.btn-ghost { background: #fff; color: #334155; border-color: var(--line); }
.btn-ghost:hover { border-color: #CBD5E1; color: var(--ink); }
.btn-white { background: #fff; color: var(--blue-dark); }
.btn-white:hover { background: #F1F7FF; color: var(--blue-deep); }
.btn-lg { padding: 14px 30px; font-size: 16px; }
.btn-sm { padding: 8px 16px; font-size: 13.5px; }

.nav-cta { display: flex; align-items: center; gap: 10px; }

.hamburger {
  display: none;
  background: none;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  cursor: pointer;
}
.hamburger span {
  display: block; width: 18px; height: 2px; background: #334155; border-radius: 2px;
}
.hamburger span + span { margin-top: 4px; }

/* ---------- Sections --------------------------------------------------- */

section { padding: 68px 0; }
.sec-tint { background: var(--tint); }
.sec-tight { padding: 48px 0; }

.eyebrow {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--blue-dark);
  background: #E7F1FE;
  padding: 5px 14px;
  border-radius: 20px;
  margin-bottom: 14px;
}

.sec-head { text-align: center; max-width: 680px; margin: 0 auto 40px; }
.sec-head p:not(:where(.ei-p)) { color: var(--muted); font-size: 16px; margin-bottom: 0; }

/* Hero */
.hero {
  background: linear-gradient(180deg, #F5FAFF 0%, #FFFFFF 100%);
  padding: 76px 0 64px;
  text-align: center;
}
.hero p.lead { max-width: 620px; margin: 0 auto 26px; }

/* Home hero: the full lockup stands in for the headline */
.hero-logo { margin: 0 auto 26px; max-width: 560px; }
.hero-logo img { width: 100%; height: auto; }

/* Deliberately light — reads as a watermark under the lockup. Held at
   #8291A4 (3.07:1 on the hero background) so it still clears WCAG AA for
   large text; going lighter would drop it below the threshold. */
.hero-statement {
  max-width: 720px;
  margin: 0 auto 30px;
  font-size: clamp(19px, 2.3vw, 25px);
  line-height: 1.5;
  color: #8291A4;
  font-weight: 400;
  letter-spacing: -.005em;
}

@media (max-width: 600px) {
  .hero-logo { max-width: 320px; margin-bottom: 20px; }
}
.hero-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.hero-note { margin-top: 18px; font-size: 13px; color: var(--faint); }

/* Stat strip */
.stat-strip {
  display: grid;
  /* Fixed columns, not auto-fit: with three stats, auto-fit's two-column
     middle ground left an empty grey cell in the grid. */
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  margin-top: 44px;
}
.stat-strip > div { background: #fff; padding: 22px 18px; text-align: center; }
.stat-strip .v { font-size: 26px; font-weight: 700; color: var(--ink); letter-spacing: -.02em; }
.stat-strip .l { font-size: 12.5px; color: var(--muted); margin-top: 3px; }
@media (max-width: 620px) { .stat-strip { grid-template-columns: 1fr; } }

/* Pricing fine print (2.1.0) */
.fine-print h2 { font-size: 20px; }
.fine-print .fine-print-list { list-style: disc; padding-left: 20px; margin: 14px 0 0; }
.fine-print .fine-print-list li { font-size: 12.5px; line-height: 1.65; color: var(--muted); margin-bottom: 10px; }
.fine-print .fine-print-list li strong { color: var(--ink); font-weight: 600; }

/* Cards */
.grid { display: grid; gap: 20px; }
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
/* Exactly two columns on desktop — used for the 2x2 product grid */
.grid-2x2 { grid-template-columns: 1fr 1fr; }
@media (max-width: 760px) { .grid-2x2 { grid-template-columns: 1fr; } }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

.card {
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--radius);
  padding: 24px;
}
.card h3 { margin-bottom: 6px; }
.card p:not(:where(.ei-p)) { font-size: 14px; color: var(--muted); margin-bottom: 0; }

.icon-box {
  width: 40px; height: 40px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px;
}
.ib-blue  { background: #E7F1FE; }
.ib-green { background: #E6F7EE; }
.ib-amber { background: #FEF3C7; }
.ib-purple{ background: #F3EEFF; }

/* Product cards */
.product-card {
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 16px;
  padding: 26px 24px 22px;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.product-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: #CBD5E1; }
.product-card .pc-top { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.product-card h3 { font-size: 19px; margin-bottom: 8px; }
.product-card > p:not(:where(.ei-p)) { font-size: 14px; color: var(--muted); margin-bottom: 16px; }
.product-card ul { margin: 0 0 20px; padding: 0; list-style: none; }
.product-card li {
  position: relative;
  padding-left: 24px;
  font-size: 13.5px;
  color: var(--body);
  margin-bottom: 8px;
  line-height: 1.5;
}
.product-card li::before {
  content: "";
  position: absolute;
  left: 0; top: 5px;
  width: 15px; height: 15px;
  border-radius: 50%;
  background: #E6F7EE url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5.5 10.5l3 3 6-6' stroke='%2316A34A' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat;
}
.product-card .pc-foot { margin-top: auto; }
.pc-price {
  font-size: 13px;
  color: var(--muted);
  border-top: 1px dashed var(--line);
  padding-top: 14px;
  margin-bottom: 14px;
}
.pc-price strong { color: var(--ink); font-size: 15px; }

/* Steps */
.steps { counter-reset: step; }
.step {
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--radius);
  padding: 24px 22px;
  text-align: center;
}
.step .n {
  width: 32px; height: 32px;
  margin: 0 auto 12px;
  border-radius: 50%;
  background: var(--blue);
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  display: flex; align-items: center; justify-content: center;
}
.step h3 { font-size: 16px; }
.step p:not(:where(.ei-p)) { font-size: 13.5px; color: var(--muted); margin: 0; }

/* Feature list two-column */
.feature-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 22px 40px; }
/* Exactly two columns — for lists of 4 that would otherwise render 3 + 1 */
.feature-list-2 { grid-template-columns: 1fr 1fr; }
@media (max-width: 700px) { .feature-list-2 { grid-template-columns: 1fr; } }
.feature { display: flex; gap: 12px; }
.feature svg { flex-shrink: 0; margin-top: 2px; }
.feature h3 { font-size: 15px; margin-bottom: 3px; line-height: 1.35; }
.feature p:not(:where(.ei-p)) { font-size: 13.5px; color: var(--muted); margin: 0; }

/* Callouts */
.callout {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  border-radius: 12px;
  padding: 16px 18px;
  font-size: 13.5px;
  line-height: 1.65;
}
.callout svg { flex-shrink: 0; margin-top: 2px; }
.callout p:not(:where(.ei-p)) { margin: 0; }
.callout-amber { background: #FFF7ED; border: 1px solid #FED7AA; color: #7C2D12; }
.callout-blue  { background: #EFF6FF; border: 1px solid #BFDBFE; color: #1E3A5F; }
.callout-green { background: #F0FDF4; border: 1px solid #BBF7D0; color: #14532D; }
.callout-slate { background: var(--tint-2); border: 1px solid var(--line); color: #334155; }

/* Comparison table */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.cmp {
  width: 100%;
  min-width: 720px;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  font-size: 13.5px;
}
table.cmp th, table.cmp td {
  padding: 14px 16px;
  text-align: left;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
table.cmp thead th {
  background: var(--tint-2);
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}
table.cmp tbody tr:last-child td { border-bottom: none; }
table.cmp td:first-child, table.cmp th:first-child { font-weight: 600; color: #334155; }
.yes { color: var(--green-dark); font-weight: 700; }
.no  { color: #CBD5E1; font-weight: 700; }

/* CTA band */
.cta-band {
  background: var(--blue);
  color: #fff;
  text-align: center;
  padding: 62px 0;
}
.cta-band h2 { color: #fff; }
.cta-band p:not(:where(.ei-p)) { color: #fff; max-width: 560px; margin: 0 auto 24px; }

/* Security band */
.security { text-align: center; }
.security .shield { margin: 0 auto 16px; }
.trust-row {
  display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 22px;
}
.trust-row span {
  font-size: 12px; color: var(--muted);
  border: 1px solid var(--line); border-radius: 20px; padding: 5px 14px; background: #fff;
}

/* Pricing */
.price-card {
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  transition: transform .18s, box-shadow .18s;
}
.price-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.price-head { padding: 24px 24px 18px; }
.price-card h3 { font-size: 21px; margin: 10px 0 4px; }
.price-card .sub { font-size: 13px; color: var(--muted); margin-bottom: 18px; }
.setup-row {
  background: var(--tint-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 16px;
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.setup-row .k { font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); font-weight: 700; }
.setup-row .s { font-size: 12px; color: var(--muted); }
.setup-row .amt { font-size: 24px; font-weight: 700; }

.tier-label {
  font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--faint); margin: 0 24px 10px;
}
.tiers { padding: 0 24px; display: flex; flex-direction: column; gap: 6px; margin-bottom: 22px; }
.tier {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 14px; border-radius: 8px;
}
.tier .t-l { font-size: 12.5px; font-weight: 600; color: #334155; }
.tier .t-s { font-size: 11px; color: var(--faint); }
.tier .t-v { font-size: 18px; font-weight: 700; text-align: right; }
.tier .t-u { font-size: 10px; color: var(--faint); text-align: right; }
.tier-1 { background: var(--tint-2); border: 1px solid var(--line); }
.tier-2 { background: #FFFBEB; border: 1px solid #FDE68A; }
.tier-3 { background: #F0FDF4; border: 1px solid #BBF7D0; }

.toggle {
  display: inline-flex; background: #fff; border: 1.5px solid var(--line);
  border-radius: 12px; padding: 4px; gap: 4px;
}
.toggle button {
  padding: 8px 24px; border-radius: 9px; border: none; background: none;
  font-size: 14px; font-weight: 600; color: var(--muted); cursor: pointer;
  font-family: inherit; position: relative; transition: all .15s;
}
.toggle button.active { background: var(--ink); color: #fff; }
.save-badge {
  position: absolute; top: -10px; right: -8px; background: var(--green-dark); color: #fff;
  font-size: 9px; font-weight: 700; padding: 2px 6px; border-radius: 20px; letter-spacing: .05em;
}

/* Trust bar — thin dark strip of proof points, sits above the header */
.trust-bar {
  background: #0E1D30;
  padding: 0;
}
.trust-bar .wrap {
  display: flex;
  align-items: center;
  gap: 20px;
  min-height: 34px;
  padding-top: 0;
  padding-bottom: 0;
}
.trust-items {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 26px;
  flex-wrap: wrap;
}
.trust-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 11.5px;
  line-height: 1.3;
  color: #94A3B8;
  white-space: nowrap;
}
.trust-item strong { color: #fff; font-weight: 700; }
.trust-item svg { flex-shrink: 0; opacity: .85; }
.trust-meta {
  flex-shrink: 0;
  font-size: 11.5px;
  line-height: 1.3;
  color: #7C8CA3;
  white-space: nowrap;
}
.trust-meta a { color: #CBD5E1; font-weight: 600; }
.trust-meta a:hover { color: #fff; }

@media (max-width: 900px) {
  .trust-meta { display: none; }
  .trust-items { gap: 20px; }
}
@media (max-width: 560px) {
  .trust-bar .wrap { min-height: 32px; padding-top: 6px; padding-bottom: 6px; }
  .trust-items { gap: 8px 16px; }
  .trust-item { font-size: 11px; gap: 6px; }
}

/* Key takeaways — written to be quotable standalone */
.takeaways {
  background: var(--tint);
  border: 1.5px solid #BFDBFE;
  border-radius: 14px;
  padding: 24px 26px;
}
.takeaways h2 {
  font-size: 15px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--blue-dark);
  margin-bottom: 14px;
}
.takeaways ul { margin: 0; padding: 0; list-style: none; }
.takeaways li {
  position: relative;
  padding-left: 26px;
  margin-bottom: 11px;
  font-size: 15.5px;
  line-height: 1.6;
  color: #1E3A5F;
}
.takeaways li:last-child { margin-bottom: 0; }
.takeaways li::before {
  content: "";
  position: absolute; left: 0; top: 7px;
  width: 16px; height: 16px; border-radius: 50%;
  background: #DBEAFE url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5.5 10.5l3 3 6-6' stroke='%231570CD' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat;
}

/* Glossary */
.glossary { margin: 0; }
.gloss {
  padding: 20px 0;
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 84px;
}
.gloss:last-child { border-bottom: none; }
.gloss dt {
  font-size: 17px;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 6px;
}
.gloss dd {
  margin: 0;
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--body);
}
.gloss dd a { font-weight: 600; white-space: nowrap; }

/* Guides */
.guide-sec { padding: 34px 0; scroll-margin-top: 84px; }
.guide-sec + .guide-sec { border-top: 1px solid var(--line); }
.guide-sec h2 { font-size: 25px; margin-bottom: 14px; }
.guide-sec p:not(:where(.ei-p)) { font-size: 16.5px; line-height: 1.75; margin-bottom: 16px; }
.guide-sec p:not(:where(.ei-p)):last-child { margin-bottom: 0; }
.guide-sec .callout { margin: 20px 0 4px; }
.guide-sec .ledger li { font-size: 15px; }

.guide-meta {
  font-size: 13px;
  color: var(--faint);
  margin: -4px 0 0;
}

.guide-card { display: block; transition: transform .18s, box-shadow .18s, border-color .18s; }
.guide-card:hover {
  text-decoration: none;
  transform: translateY(-3px);
  border-color: #CBD5E1;
  box-shadow: var(--shadow-md);
}
.guide-card h3 { font-size: 16px; margin-bottom: 4px; }
.guide-card p:not(:where(.ei-p)) { font-size: 13px; color: var(--muted); margin: 0; }
.guide-card-lg { padding: 26px 24px; }
.guide-card-lg h3 { font-size: 20px; margin: 12px 0 8px; line-height: 1.3; }
.guide-card-lg p:not(:where(.ei-p)) { font-size: 14.5px; line-height: 1.6; margin-bottom: 16px; }
.guide-go { font-size: 14px; font-weight: 700; color: var(--blue-dark); }

/* FAQ hub page */
.faq-jumps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 24px;
}
.faq-jump {
  display: inline-block;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 20px;
  padding: 7px 16px;
  font-size: 13.5px;
  font-weight: 600;
  color: #334155;
  transition: border-color .15s, color .15s, background .15s;
}
.faq-jump:hover {
  text-decoration: none;
  border-color: var(--blue);
  color: var(--blue-dark);
  background: var(--tint);
}

.faq-cat { padding: 44px 0; scroll-margin-top: 84px; }
.faq-cat + .faq-cat { border-top: 1px solid var(--line); }
.faq-cat h2 { font-size: 24px; margin-bottom: 4px; }

/* Link from a page-level FAQ block up to the hub */
.faq-more {
  margin-top: 22px;
  text-align: center;
  font-size: 14px;
}

/* FAQ */
.faq details {
  background: #fff; border: 1.5px solid var(--line); border-radius: 12px;
  padding: 16px 20px; margin-bottom: 10px;
}
.faq summary {
  cursor: pointer; font-weight: 600; color: var(--ink); font-size: 15px;
  list-style: none; display: flex; justify-content: space-between; gap: 16px; align-items: center;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--blue); font-size: 20px; font-weight: 400; }
.faq details[open] summary::after { content: "–"; }
.faq details p:not(:where(.ei-p)) { margin: 12px 0 0; font-size: 14px; color: var(--muted); }

/* Page hero (interior pages) */
.page-hero { background: linear-gradient(180deg, #F5FAFF 0%, #FFFFFF 100%); padding: 56px 0 48px; }
.page-hero .badges { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.page-hero h1 { margin-bottom: 14px; }
.page-hero p.lead { max-width: 640px; }
.breadcrumb { font-size: 13px; color: var(--faint); margin-bottom: 16px; }
.breadcrumb a { color: var(--muted); }

/* Split section */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; }
.split-panel {
  background: #fff; border: 1.5px solid var(--line); border-radius: var(--radius);
  padding: 26px; box-shadow: var(--shadow-sm);
}
.ledger { list-style: none; margin: 0; padding: 0; }
.ledger li {
  display: flex; justify-content: space-between; gap: 16px;
  padding: 11px 0; border-bottom: 1px dashed var(--line); font-size: 14px;
}
.ledger li:last-child { border-bottom: none; }
.ledger .amt { font-weight: 700; color: var(--ink); white-space: nowrap; }
.ledger .amt.pos { color: var(--green-dark); }

/* Subtotal row — reads as the sum of the lines above it */
.ledger li.ledger-total {
  border-top: 1.5px solid var(--line);
  border-bottom: 1.5px solid var(--line);
  font-weight: 700;
  color: var(--ink);
}
.ledger li.ledger-total .amt { color: #DC2626; font-size: 15px; }

/* ---------- Insurance monitoring page ---------------------------------- */

.callout-red { background: #FEF2F2; border: 1px solid #FECACA; color: #7F1D1D; }

/* Eligibility banner — this feature only ships with certain products */
.eligibility {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: #EFF6FF;
  border: 1.5px solid #BFDBFE;
  border-radius: 14px;
  padding: 18px 20px;
}
.eligibility svg { flex-shrink: 0; margin-top: 2px; }
.elig-title { font-size: 15px; font-weight: 700; margin-bottom: 5px; color: #1E3A5F; line-height: 1.35; }
.eligibility p:not(:where(.ei-p)) { font-size: 13.5px; color: #1E3A5F; margin: 0; line-height: 1.6; }
.eligibility .elig-links { margin-top: 10px; font-size: 13px; }
.eligibility .elig-links a { margin-right: 16px; font-weight: 600; }

/* Sample-data frame */
.sample-frame {
  border: 1.5px dashed #CBD5E1;
  border-radius: 16px;
  padding: 22px;
  background: repeating-linear-gradient(
    45deg, #FCFDFF, #FCFDFF 12px, #F7FAFF 12px, #F7FAFF 24px);
}
.sample-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #F1F5F9;
  color: #475569;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 20px;
  margin-bottom: 16px;
}
.sample-tag::before {
  content: "";
  width: 7px; height: 7px; border-radius: 50%;
  background: #94A3B8;
}

/* Premium history chart */
.chart-card { padding: 22px 24px 18px; }
.chart-bars {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  height: 130px;
  margin-bottom: 10px;
}
.chart-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  height: 100%;
  justify-content: flex-end;
}
.chart-amt { font-size: 11px; font-weight: 700; color: var(--ink); }
.chart-amt.up { color: #DC2626; }
.chart-bar {
  width: 100%;
  border-radius: 6px 6px 0 0;
  min-height: 8px;
  background: #BFDBFE;
  transition: background .15s;
}
.chart-bar.current { background: #DC2626; }
.chart-bar:hover { background: var(--blue); }
.chart-bar.current:hover { background: #B91C1C; }
.chart-yr { font-size: 11px; color: var(--muted); }
.chart-note {
  border-top: 1px solid var(--line);
  padding-top: 10px;
  font-size: 12.5px;
  color: var(--muted);
  text-align: center;
}
.chart-note strong { color: #DC2626; }

/* Opt-in banner */
.optin {
  background: var(--blue);
  border-radius: 18px;
  padding: 34px 34px 30px;
  display: flex;
  gap: 32px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  color: #fff;
}
.optin-copy { flex: 1; min-width: 280px; }
.optin h2 { color: #fff; font-size: 26px; margin-bottom: 10px; }
.optin p:not(:where(.ei-p)) { color: rgba(255,255,255,.88); font-size: 14.5px; margin: 0; max-width: 520px; }
.optin .eyebrow {
  background: rgba(255,255,255,.18);
  color: #fff;
}
.optin-box {
  background: rgba(255,255,255,.14);
  border-radius: 14px;
  padding: 22px 26px;
  text-align: center;
  min-width: 210px;
}
.optin-box .k {
  font-size: 11px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: rgba(255,255,255,.75); margin-bottom: 12px;
}
.optin-box .status { font-size: 13.5px; font-weight: 600; margin-top: 4px; }
.optin-box .fine { font-size: 11.5px; color: rgba(255,255,255,.6); margin-top: 8px; }

/* Coming soon treatments */
.pill-soon {
  background: #FEF3C7; color: #B45309;
}
.optin.soon { background: linear-gradient(135deg, #1570CD 0%, #2E90FA 100%); }
.soon-box {
  background: rgba(255,255,255,.14);
  border: 1px dashed rgba(255,255,255,.45);
  border-radius: 14px;
  padding: 22px 24px;
  text-align: center;
  min-width: 230px;
}
.soon-box .k {
  font-size: 11px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: rgba(255,255,255,.75); margin-bottom: 10px;
}
.soon-box .big {
  font-size: 19px; font-weight: 700; color: #fff; margin-bottom: 14px;
}
.soon-box .fine { font-size: 11.5px; color: rgba(255,255,255,.62); margin-top: 10px; }

.lock-mask .soon-tag {
  display: inline-block;
  background: #FEF3C7; color: #B45309;
  font-size: 11px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; padding: 4px 12px; border-radius: 20px;
  margin-bottom: 4px;
}

/* Preview-only table: dimmed and non-interactive behind the mask */
.lockable.preview-only .table-scroll { filter: grayscale(.35); opacity: .55; }

/* Toggle switch */
.switch { position: relative; display: inline-block; width: 62px; height: 32px; cursor: pointer; }
.switch input { opacity: 0; width: 0; height: 0; }
.switch .track {
  position: absolute; inset: 0;
  background: rgba(255,255,255,.28);
  border-radius: 32px;
  transition: background .2s;
}
.switch .track::before {
  content: "";
  position: absolute;
  height: 24px; width: 24px;
  left: 4px; bottom: 4px;
  background: #fff;
  border-radius: 50%;
  transition: transform .2s;
}
.switch input:checked + .track { background: var(--green); }
.switch input:checked + .track::before { transform: translateX(30px); }
.switch input:focus-visible + .track { outline: 2px solid #fff; outline-offset: 2px; }

/* Locked overlay */
.lockable { position: relative; }
.lock-mask {
  position: absolute; inset: 0;
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(3px);
  border-radius: var(--radius);
  z-index: 5;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  padding: 24px;
}
.lockable.locked .lock-mask { display: flex; }
.lock-mask h3 { font-size: 17px; margin: 0; }
.lock-mask p:not(:where(.ei-p)) { font-size: 13.5px; color: var(--muted); max-width: 320px; margin: 0; }

/* Comparison table extras */
.prov { font-weight: 700; color: var(--ink); }
.prov-sub { font-size: 12px; color: var(--faint); font-weight: 400; margin-top: 1px; }
.money { font-weight: 700; color: var(--ink); }
.money.save { color: var(--green-dark); }
.save-pill {
  display: inline-block;
  background: #E6F7EE; color: var(--green-dark);
  font-size: 11px; font-weight: 700;
  padding: 2px 8px; border-radius: 8px; margin-left: 6px;
  white-space: nowrap;
}
tr.best td { background: #F0FDF4; }
.delta-down { color: var(--green-dark); font-weight: 700; }
.delta-up { color: #DC2626; font-weight: 700; }

/* Value check form */
.vc-form { display: flex; flex-direction: column; gap: 15px; }
.vc-field { display: flex; flex-direction: column; gap: 6px; }
.vc-field label { font-size: 13px; font-weight: 600; color: var(--ink); }
.vc-field input, .vc-field select {
  padding: 10px 14px;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  font-size: 14px;
  color: var(--ink);
  background: #fff;
  font-family: inherit;
  outline: none;
  transition: border-color .15s;
}
.vc-field input:focus, .vc-field select:focus { border-color: var(--blue); }
.vc-field .hint { font-size: 11.5px; color: var(--faint); }

/* Value check results */
.vc-results { display: flex; flex-direction: column; gap: 12px; }
.vc-card {
  border-radius: 12px;
  padding: 16px 18px;
  border: 1.5px solid;
}
.vc-card.ok   { border-color: #BBF7D0; background: #F0FDF4; }
.vc-card.warn { border-color: #FED7AA; background: #FFF7ED; }
.vc-card.bad  { border-color: #FECACA; background: #FEF2F2; }
.vc-card h3 { font-size: 14.5px; margin-bottom: 6px; line-height: 1.35; }
.vc-card.ok h3   { color: var(--green-dark); }
.vc-card.warn h3 { color: #B45309; }
.vc-card.bad h3  { color: #B91C1C; }
.vc-card p:not(:where(.ei-p)) { font-size: 13.5px; color: var(--body); margin: 0; line-height: 1.6; }
.vc-action { margin-top: 10px; font-size: 12.5px; font-weight: 700; }
.vc-card.ok .vc-action   { color: var(--green-dark); }
.vc-card.warn .vc-action { color: #B45309; }
.vc-card.bad .vc-action  { color: #B91C1C; }

.vc-empty { text-align: center; padding: 40px 24px; }
.vc-empty h3 { font-size: 16px; margin-bottom: 6px; }
.vc-empty p:not(:where(.ei-p)) { font-size: 13.5px; color: var(--muted); margin: 0; }

/* Deductible meter */
.meter { margin: 14px 0 4px; }
.meter-track {
  height: 9px;
  border-radius: 9px;
  background: linear-gradient(to right, #F59E0B 0%, #22C55E 22%, #22C55E 62%, #F59E0B 100%);
  position: relative;
}
.meter-dot {
  position: absolute;
  top: -4px;
  width: 17px; height: 17px;
  border-radius: 50%;
  background: var(--ink);
  border: 2.5px solid #fff;
  box-shadow: 0 2px 6px rgba(15,23,42,.25);
  transform: translateX(-50%);
  transition: left .45s ease;
}
.meter-labels {
  display: flex; justify-content: space-between;
  margin-top: 8px; font-size: 10.5px; color: var(--faint);
}

@media (max-width: 700px) {
  .optin { padding: 26px 22px; }
  .chart-bars { height: 110px; gap: 6px; }
}

/* ---------- Get Started path chooser (modal) --------------------------- */

.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, .55);
  backdrop-filter: blur(3px);
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  overflow-y: auto;
}
.modal-backdrop.open { display: flex; }

.modal {
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
  width: 100%;
  max-width: 720px;
  padding: 34px 32px 28px;
  position: relative;
  margin: auto;
  animation: modal-in .18s ease-out;
}
@keyframes modal-in {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to   { opacity: 1; transform: none; }
}

.modal-close {
  position: absolute;
  top: 14px; right: 14px;
  width: 34px; height: 34px;
  border-radius: 8px;
  border: none;
  background: none;
  color: var(--muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.modal-close:hover { background: var(--tint-2); color: var(--ink); }

.modal h2 { font-size: 24px; margin-bottom: 6px; }
.modal .modal-sub { font-size: 14.5px; color: var(--muted); margin-bottom: 24px; }

.path-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 620px) { .path-grid { grid-template-columns: 1fr; } }

.path {
  display: block;
  text-align: left;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  padding: 22px 20px;
  background: #fff;
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
.path:hover {
  text-decoration: none;
  border-color: var(--blue);
  box-shadow: 0 8px 26px rgba(46, 144, 250, .16);
  transform: translateY(-2px);
}
.path .path-icon {
  width: 42px; height: 42px;
  border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px;
}
.path h3 { font-size: 17px; margin-bottom: 5px; }
.path p:not(:where(.ei-p)) { font-size: 13.5px; color: var(--muted); margin-bottom: 14px; line-height: 1.5; }
.path ul { list-style: none; margin: 0 0 16px; padding: 0; }
.path li {
  position: relative;
  padding-left: 18px;
  font-size: 12.5px;
  color: var(--body);
  margin-bottom: 5px;
}
.path li::before {
  content: "";
  position: absolute; left: 0; top: 7px;
  width: 5px; height: 5px; border-radius: 50%;
  background: #CBD5E1;
}
.path .path-go {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--blue-dark);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.path:hover .path-go { gap: 10px; }

.modal-foot {
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  font-size: 13px;
  color: var(--muted);
  text-align: center;
}

/* Footer */
.site-footer { border-top: 1px solid var(--line); padding: 52px 0 30px; background: #fff; }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr; gap: 28px; }
.footer-grid img { height: 30px; width: auto; margin-bottom: 12px; }
.footer-grid p:not(:where(.ei-p)) { font-size: 13px; color: var(--muted); max-width: 280px; }
.footer-col-title { font-size: 13px; font-weight: 700; color: var(--ink); margin-bottom: 12px; }
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-col li { margin-bottom: 8px; }
.footer-col a { font-size: 13.5px; color: var(--muted); }
.footer-col a:hover { color: var(--blue-dark); }
.footer-bottom {
  border-top: 1px solid var(--line); margin-top: 36px; padding-top: 20px;
  text-align: center; font-size: 12.5px; color: var(--faint);
}
.footer-bottom a { color: var(--faint); margin: 0 8px; }
.footer-access { margin-top: 12px; }
.footer-access a { text-decoration: underline; text-underline-offset: 2px; }
.footer-access a:hover { color: var(--ink); }
.footer-access .sep { color: var(--line); margin: 0 2px; }
.disclaimer { max-width: 780px; margin: 14px auto 0; font-size: 11.5px; line-height: 1.6; color: #5F6D80; }

/* ---------- Responsive ------------------------------------------------- */

@media (max-width: 900px) {
  .split { grid-template-columns: 1fr; gap: 28px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 780px) {
  .hamburger { display: block; }
  .nav-cta .btn-ghost { display: none; }

  .nav-links {
    display: none;
    position: absolute;
    top: 66px; left: 0; right: 0;
    background: #fff;
    border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow-md);
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    padding: 10px 16px 18px;
  }
  .nav-links.open { display: flex; }
  .nav-links a, .nav-toggle { width: 100%; justify-content: space-between; padding: 12px; }
  .dropdown {
    position: static;
    width: auto;
    box-shadow: none;
    border: none;
    border-left: 2px solid var(--line);
    border-radius: 0;
    margin: 2px 0 6px 12px;
    padding: 0 0 0 6px;
  }
  section { padding: 52px 0; }
  .hero { padding: 52px 0 44px; }
}

/* ---------- Legal documents (privacy policy, terms) ---------------------- */

.legal .page-hero { padding-bottom: 34px; }

.legal-summary {
  background: #EFF6FF;
  border: 1px solid #BFDBFE;
  border-radius: 12px;
  padding: 18px 20px;
  color: #1E3A5F;
}
.legal-summary-title {
  font-size: 11.5px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--blue-dark); margin-bottom: 8px;
}
.legal-summary p:not(:where(.ei-p)) { margin: 0; font-size: 14.5px; line-height: 1.7; }

/* Table of contents */
.legal-toc {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 20px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.legal-toc-item {
  display: flex; gap: 10px; align-items: baseline;
  padding: 5px 0;
  font-size: 13.5px; color: var(--body);
}
.legal-toc-item:hover { color: var(--blue-dark); text-decoration: none; }
.lt-num {
  flex-shrink: 0; min-width: 26px;
  font-size: 11.5px; font-weight: 700; color: var(--faint);
  font-variant-numeric: tabular-nums;
}
.legal-toc-item:hover .lt-num { color: var(--blue); }

/* Body copy */
.legal .guide-sec h3 { font-size: 16.5px; margin: 26px 0 10px; color: var(--ink); }
.legal .guide-sec ul { margin: 0 0 16px; padding-left: 22px; }
.legal .guide-sec li {
  font-size: 15.5px; line-height: 1.7; color: var(--body); margin-bottom: 7px;
}
.legal .guide-sec li:last-child { margin-bottom: 0; }

/* Contact cards */
.legal-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.legal-contact .card { padding: 20px 22px; }
.lc-role {
  font-size: 11px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--blue-dark); margin-bottom: 10px;
}
.legal-contact .lc-name {
  font-size: 15px; font-weight: 700; color: var(--ink); margin: 0 0 8px; line-height: 1.5;
}
.legal-contact .lc-addr { font-size: 14px; color: var(--muted); margin: 0 0 10px; line-height: 1.6; }
.legal-contact .lc-mail { font-size: 14px; margin: 0; line-height: 1.7; }

@media (max-width: 780px) {
  .legal-toc, .legal-contact { grid-template-columns: 1fr; }
}

/* ---------- Help Center -------------------------------------------------- */

.hc-hero {
  background: linear-gradient(180deg, #F0F7FF 0%, #FFFFFF 100%);
  border-bottom: 1px solid var(--line);
  padding: 54px 0 44px;
}
.hc-hero h1 { font-size: clamp(30px, 4.2vw, 42px); margin-bottom: 12px; }
.hc-lead { margin: 0 auto 26px; max-width: 520px; }

/* Search */
.hc-search {
  display: flex; align-items: center; gap: 10px;
  max-width: 560px; margin: 0 auto;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  padding: 8px 10px 8px 16px;
  box-shadow: var(--shadow-sm);
}
.hc-search:focus-within { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(46,144,250,.14); }
.hc-search svg { flex-shrink: 0; }
.hc-search input {
  flex: 1; min-width: 0;
  border: 0; outline: 0; background: transparent;
  font: inherit; font-size: 15px; color: var(--ink);
  padding: 9px 0;
}
.hc-search input::placeholder { color: var(--faint); }
.hc-search .btn { flex-shrink: 0; }

.hc-quick { margin: 16px 0 0; font-size: 13px; color: var(--faint); }
.hc-quick span { color: var(--muted); font-weight: 600; }
.hc-quick a {
  display: inline-block; margin: 0 3px;
  padding: 3px 10px; border-radius: 20px;
  background: #fff; border: 1px solid var(--line);
  font-size: 12.5px; color: var(--body);
}
.hc-quick a:hover { border-color: var(--blue); color: var(--blue-dark); text-decoration: none; }

/* Topic tiles */
.hc-tiles-sec { padding-top: 40px; }
.hc-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.hc-tile {
  display: block;
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  padding: 22px 22px 20px;
  transition: transform .18s, box-shadow .18s, border-color .18s;
}
.hc-tile:hover {
  transform: translateY(-2px);
  border-color: #BFDBFE;
  box-shadow: var(--shadow-md);
  text-decoration: none;
}
.hc-tile .icon-box { margin-bottom: 14px; }
.hc-tile h3 { font-size: 16.5px; margin-bottom: 5px; color: var(--ink); }
.hc-tile p:not(:where(.ei-p)) { font-size: 13.5px; color: var(--muted); margin: 0 0 14px; line-height: 1.6; }
.hc-go { font-size: 13px; font-weight: 700; color: var(--blue-dark); }

/* Popular questions + contact aside */
.hc-split { display: grid; grid-template-columns: 1.35fr 1fr; gap: 36px; align-items: start; }
.hc-h2 { font-size: 24px; margin-bottom: 16px; }

.hc-pop { background: #fff; border: 1.5px solid var(--line); border-radius: 14px; overflow: hidden; }
.hc-pop-item {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px 18px;
  border-top: 1px solid var(--line);
  font-size: 14.5px; color: var(--ink);
}
.hc-pop-item:first-child { border-top: 0; }
.hc-pop-item:hover { background: var(--tint); color: var(--blue-dark); text-decoration: none; }
.hc-pop-item svg { flex-shrink: 0; }
.hc-more { margin: 16px 0 0; }

.hc-aside {
  background: #fff; border: 1.5px solid var(--line); border-radius: 14px;
  padding: 24px 22px;
  box-shadow: var(--shadow-sm);
}
.hc-aside-title {
  font-size: 11.5px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--blue-dark); margin-bottom: 10px;
}
.hc-aside-copy { font-size: 14px; color: var(--muted); line-height: 1.6; margin-bottom: 16px; }
.hc-btn { width: 100%; justify-content: center; margin-bottom: 10px; }
.hc-aside-note {
  font-size: 12.5px; color: var(--muted); line-height: 1.6;
  margin: 6px 0 0; padding-top: 14px; border-top: 1px solid var(--line);
}
.hc-aside-mail { font-size: 13px; margin: 8px 0 0; }
.hc-aside-mail a { font-weight: 700; }

/* Guides row */
.hc-guides { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.hc-guide {
  display: block; background: #fff;
  border: 1.5px solid var(--line); border-radius: 14px;
  padding: 20px 18px;
  transition: transform .18s, box-shadow .18s, border-color .18s;
}
.hc-guide:hover {
  transform: translateY(-2px); border-color: #BFDBFE;
  box-shadow: var(--shadow-md); text-decoration: none;
}
.hc-guide h3 { font-size: 15px; margin-bottom: 5px; line-height: 1.35; }
.hc-guide p:not(:where(.ei-p)) { font-size: 13px; color: var(--muted); margin: 0; }

/* Closing block */
.hc-foot { padding: 46px 0; }
.hc-foot-copy { color: var(--muted); margin-bottom: 20px; }
.hc-foot-actions { display: flex; gap: 12px; justify-content: center; margin: 0 0 22px; flex-wrap: wrap; }
.hc-fineprint { font-size: 12.5px; color: var(--faint); line-height: 1.7; margin: 0; }

/* Chat fallback note */
.sp-chat-fallback { margin: 10px 0 0; font-size: 12.5px; color: var(--amber); }
.sp-chat-fallback a { color: var(--amber); font-weight: 700; text-decoration: underline; }

@media (max-width: 900px) {
  .hc-tiles { grid-template-columns: repeat(2, 1fr); }
  .hc-guides { grid-template-columns: repeat(2, 1fr); }
  .hc-split { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 620px) {
  .hc-tiles { grid-template-columns: 1fr; }
  .hc-search { flex-wrap: wrap; padding: 12px; }
  .hc-search input { width: 100%; flex-basis: 100%; }
  .hc-search .btn { width: 100%; justify-content: center; }
}

/* ---------- How It Works (journey layout) -------------------------------- */

/* Promise banner */
.hiw-promise {
  background: linear-gradient(135deg, var(--blue-deep) 0%, var(--blue) 55%, #38BDF8 100%);
  border-radius: 18px;
  padding: 32px 30px 28px;
  color: #fff;
  text-align: center;
}
.hiw-promise h2 { color: #fff; font-size: 24px; margin-bottom: 8px; }
.hiw-promise > p:not(:where(.ei-p)) { color: rgba(255,255,255,.9); font-size: 15px; margin: 0 auto 26px; max-width: 620px; }
.hiw-promise-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.hiw-pill-item {
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 14px;
  padding: 18px 16px;
}
.hiw-pill-item .hiw-ico {
  width: 38px; height: 38px; border-radius: 10px; margin: 0 auto 10px;
  background: rgba(255,255,255,.2);
  display: flex; align-items: center; justify-content: center;
}
.hiw-pill-item h3 { color: #fff; font-size: 15px; margin-bottom: 3px; }
.hiw-pill-item p:not(:where(.ei-p)) { color: rgba(255,255,255,.82); font-size: 12.5px; margin: 0; }

/* Step cards */
.hiw-step {
  background: #fff;
  border: 1.5px solid var(--line);
  border-left: 5px solid var(--blue);
  border-radius: 16px;
  padding: 26px 26px 24px;
  margin-bottom: 20px;
}
.hiw-step.is-blue { border-left-color: var(--blue); }
.hiw-step.is-green { border-left-color: var(--green); }
.hiw-step.is-amber { border-left-color: #F59E0B; }
.hiw-step.is-purple { border-left-color: var(--purple); }

.hiw-step-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 20px; }
.hiw-step-head .hiw-n {
  flex-shrink: 0; width: 30px; height: 30px; border-radius: 9px;
  background: var(--tint); color: var(--blue-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 700;
}
.hiw-step-head h3 { font-size: 19px; margin: 0 0 2px; }
.hiw-step-head p:not(:where(.ei-p)) { font-size: 13.5px; color: var(--muted); margin: 0; }
.hiw-step-head .pill { margin-left: auto; flex-shrink: 0; margin-top: 4px; }

.hiw-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.hiw-col-title {
  font-size: 11.5px; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; color: var(--muted); margin-bottom: 12px;
}
.hiw-list { list-style: none; margin: 0; padding: 0; }
.hiw-list li {
  display: flex; gap: 10px; align-items: flex-start; margin-bottom: 13px;
}
.hiw-list li:last-child { margin-bottom: 0; }
.hiw-list svg { flex-shrink: 0; margin-top: 2px; }
.hiw-list strong { display: block; font-size: 14.5px; color: var(--ink); font-weight: 700; line-height: 1.35; }
.hiw-list span { display: block; font-size: 13px; color: var(--muted); line-height: 1.5; margin-top: 1px; }

/* The benefit roller.

   On the Referral Partners page the three benefit cards sit inside .hiw-roller.
   site.js builds a topic strip from the cards' own headings and rolls one card
   at a time like a face of a cube — every state below hangs off .is-rolling,
   which only JavaScript adds, so with scripting off the page is simply the
   three cards stacked as normal. */

.hiw-tabs { display: none; }
.is-rolling .hiw-tabs {
  display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 18px;
}
.hiw-tab {
  flex: 1 1 220px; display: flex; align-items: center; gap: 10px;
  text-align: left; background: #fff;
  border: 1.5px solid var(--line); border-radius: 12px; padding: 12px 16px;
  font-family: inherit; font-size: 14px; font-weight: 600; color: var(--ink);
  cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.hiw-tab:hover { border-color: #BBD9FB; }
.hiw-tab.is-active { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(46, 144, 250, .14); }
.hiw-tab-n {
  flex-shrink: 0; width: 26px; height: 26px; border-radius: 8px;
  background: var(--tint); color: var(--blue-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700;
}
.hiw-tab.is-active .hiw-tab-n { background: var(--blue); color: #fff; }
.hiw-tab-t { line-height: 1.3; }
.hiw-tab .pill { margin-left: auto; flex-shrink: 0; }
@media (max-width: 760px) { .hiw-tab .pill { display: none; } }

/* Thin countdown under the active tab, so the auto-roll is legible rather than
   surprising. Restarted by JS on every turn; hidden once the visitor takes over. */
.hiw-tab .hiw-tab-bar {
  position: absolute; left: 14px; right: 14px; bottom: 6px; height: 3px;
  border-radius: 3px; background: var(--tint); overflow: hidden; opacity: 0;
}
.hiw-tab { position: relative; }
.hiw-tab.is-active .hiw-tab-bar { opacity: 1; }
.hiw-tab-bar span { display: block; height: 100%; width: 0; background: var(--blue); }
.is-auto .hiw-tab.is-active .hiw-tab-bar span { animation: hiwCount 7s linear forwards; }
@keyframes hiwCount { from { width: 0; } to { width: 100%; } }

.is-rolling .hiw-stage { position: relative; perspective: 1300px; }
.is-rolling .hiw-stage .hiw-step { margin: 0; backface-visibility: hidden; }
.is-rolling .hiw-step.is-parked {
  position: absolute; top: 0; left: 0; width: 100%;
  visibility: hidden; pointer-events: none;
}
.is-rolling .hiw-step.roll-out-up,
.is-rolling .hiw-step.roll-out-down {
  position: absolute; top: 0; left: 0; width: 100%;
  visibility: visible; pointer-events: none; z-index: 1;
}
.roll-out-up   { transform-origin: 50% 0;    animation: hiwOutUp   .5s cubic-bezier(.5, 0, .7, .4) both; }
.roll-in-up    { transform-origin: 50% 100%; animation: hiwInUp    .5s cubic-bezier(.2, .7, .3, 1) both; }
.roll-out-down { transform-origin: 50% 100%; animation: hiwOutDown .5s cubic-bezier(.5, 0, .7, .4) both; }
.roll-in-down  { transform-origin: 50% 0;    animation: hiwInDown  .5s cubic-bezier(.2, .7, .3, 1) both; }

@keyframes hiwOutUp   { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(-34px) rotateX(56deg); } }
@keyframes hiwInUp    { from { opacity: 0; transform: translateY(34px) rotateX(-56deg); } to { opacity: 1; transform: none; } }
@keyframes hiwOutDown { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(34px) rotateX(-56deg); } }
@keyframes hiwInDown  { from { opacity: 0; transform: translateY(-34px) rotateX(56deg); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .roll-out-up, .roll-out-down { animation: none; visibility: hidden; }
  .roll-in-up, .roll-in-down { animation: none; }
  .is-auto .hiw-tab.is-active .hiw-tab-bar span { animation: none; }
}

/* Worked example */
.hiw-example { background: var(--tint-2); border: 1.5px solid var(--line); border-radius: 14px; padding: 20px; }
.hiw-example-head { text-align: center; padding-bottom: 14px; border-bottom: 1px dashed var(--line); }
.hiw-example-head .v { font-size: 30px; font-weight: 700; color: var(--ink); letter-spacing: -.02em; }
.hiw-example-head .l { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.hiw-example .ledger { margin-top: 12px; }

.hiw-note { margin-top: 20px; }

@media (max-width: 820px) {
  .hiw-promise-grid { grid-template-columns: 1fr; }
  .hiw-cols { grid-template-columns: 1fr; gap: 20px; }
  .hiw-step-head { flex-wrap: wrap; }
  .hiw-step-head .pill { margin-left: 0; }
}

/* ---------- Careers ---------------------------------------------------------
   Job listing rows, and the panel that wraps the application form.

   The form markup itself comes from a WordPress form plugin, so nothing here
   targets a plugin class name. Inputs are styled by element inside
   .ei-form-panel, which means WPForms, Fluent Forms and Gravity Forms all come
   out looking like the rest of the site without per-plugin CSS. */

.job-list { display: grid; gap: 18px; }

.job-card {
  background: #fff; border: 1.5px solid var(--line); border-radius: var(--radius);
  padding: 26px; box-shadow: var(--shadow-sm);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.job-card:hover { border-color: #BBD9FB; box-shadow: var(--shadow-md); }
.job-card-head { display: flex; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.job-card-head h3 { font-size: 20px; margin: 0 0 3px; }
.job-card-head .pill { margin-left: auto; flex-shrink: 0; margin-top: 3px; }
.job-sub { font-size: 14px; color: var(--muted); margin: 0; }
.job-meta { display: flex; flex-wrap: wrap; gap: 7px; margin: 16px 0 0; }
.job-actions {
  display: flex; gap: 14px; align-items: center; flex-wrap: wrap;
  margin-top: 20px; padding-top: 20px; border-top: 1px dashed var(--line);
}
.job-actions .small { color: var(--muted); margin: 0; }

@media (max-width: 620px) {
  .job-card-head .pill { margin-left: 0; }
}

/* Application form */

.ei-form-panel {
  background: #fff; border: 1.5px solid var(--line); border-radius: var(--radius);
  padding: 30px; box-shadow: var(--shadow-sm); max-width: 720px; margin: 0 auto;
}
.ei-form-panel label { display: block; font-size: 13.5px; font-weight: 700; color: var(--ink); margin-bottom: 6px; }
.ei-form-panel .required, .ei-form-panel .wpforms-required-label { color: #DC2626; }
.ei-form-panel input[type="text"],
.ei-form-panel input[type="email"],
.ei-form-panel input[type="tel"],
.ei-form-panel input[type="url"],
.ei-form-panel input[type="number"],
.ei-form-panel input[type="date"],
.ei-form-panel input[type="file"],
.ei-form-panel select,
.ei-form-panel textarea {
  width: 100%; box-sizing: border-box; font: inherit; font-size: 14.5px;
  color: var(--ink); background: #fff;
  border: 1.5px solid var(--line); border-radius: 10px; padding: 11px 13px;
}
.ei-form-panel textarea { min-height: 120px; resize: vertical; }
.ei-form-panel input:focus, .ei-form-panel select:focus, .ei-form-panel textarea:focus {
  outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(46, 144, 250, .16);
}
.ei-form-panel input[type="file"] { padding: 9px 11px; background: var(--tint-2); }
.ei-form-panel ul, .ei-form-panel ol { list-style: none; margin: 0; padding: 0; }
.ei-form-panel li { margin: 0 0 18px; }
.ei-form-panel li:last-child { margin-bottom: 0; }
.ei-form-panel .description, .ei-form-panel .wpforms-field-description {
  font-size: 12.5px; color: var(--muted); margin-top: 5px;
}
.ei-form-panel input[type="submit"], .ei-form-panel button[type="submit"] {
  font: inherit; font-size: 15px; font-weight: 600; cursor: pointer;
  background: var(--blue); color: #fff; border: 0; border-radius: 10px;
  padding: 13px 26px; width: auto;
}
.ei-form-panel input[type="submit"]:hover, .ei-form-panel button[type="submit"]:hover {
  background: var(--blue-dark);
}
.ei-form-panel input[type="checkbox"], .ei-form-panel input[type="radio"] { width: auto; margin-right: 8px; }

/* The form sits behind a button, so the page opens as a job posting rather than
   a wall of inputs. The collapsed state is added by JavaScript, so with scripting
   off the form is simply visible and the button never appears — the page works
   either way. */
.ei-reveal-cta { display: none; text-align: center; }
.ei-reveal.is-collapsed .ei-reveal-cta { display: block; }
.ei-reveal.is-collapsed .ei-reveal-body { display: none; }
.ei-reveal-cta .small { margin: 14px 0 0; color: var(--muted); }

.ei-field { margin-bottom: 18px; }
.ei-field:last-child { margin-bottom: 0; }
.ei-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
/* Inside a row every field keeps its bottom spacing, so stacked rows (phones,
   narrow cards) never butt one field against the next. */
.ei-field-row .ei-field:last-child { margin-bottom: 18px; }
@media (max-width: 620px) { .ei-field-row { grid-template-columns: 1fr; } }

.ei-form-panel .required { font-weight: 700; }
.ei-required-note { font-size: 12.5px; color: var(--muted); margin: 0 0 22px; }
.ei-form-actions { margin-top: 24px; padding-top: 22px; border-top: 1px dashed var(--line); }
.ei-form-actions .small { color: var(--muted); margin: 12px 0 0; }

/* The honeypot. Bots fill hidden fields; people never see this one. */
.ei-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.ei-form-errors {
  background: #FEF2F2; border: 1.5px solid #FECACA; border-radius: 12px;
  padding: 14px 18px; margin-bottom: 24px; font-size: 13.5px; color: #991B1B;
}
.ei-form-errors ul { list-style: disc; margin: 8px 0 0 18px; padding: 0; }
.ei-form-errors li { margin-bottom: 4px; }
.ei-field.has-error input, .ei-field.has-error select, .ei-field.has-error textarea {
  border-color: #FCA5A5;
}

.ei-form-success { max-width: 720px; margin: 0 auto; text-align: center; }
.ei-form-success .split-panel { padding: 40px 30px; }
.ei-form-success h3 { font-size: 22px; margin-bottom: 10px; }
.ei-form-success p:not(:where(.ei-p)) { max-width: 460px; margin: 0 auto 8px; }
.ei-form-success .tick {
  width: 54px; height: 54px; border-radius: 50%; background: #E6F7EE;
  display: flex; align-items: center; justify-content: center; margin: 0 auto 18px;
}

/* Kept for the "use a form plugin instead" escape hatch. */
.ei-form-fallback { max-width: 720px; margin: 0 auto; }
.ei-form-fallback .split-panel h3 { font-size: 17px; margin-bottom: 8px; }
.ei-form-fallback ol { margin: 12px 0 0 18px; padding: 0; font-size: 14px; }
.ei-form-fallback ol li { margin-bottom: 7px; }

/* ---------- generated block utilities ---------------------------------
   These replace the inline style attributes of the static build, which the
   block editor would strip on save. Generated by wp_convert.py — edit the
   page in WordPress or regenerate rather than hand-editing this block.

   Class names are a hash of the declaration, not a sequence, so page
   content stored in the database keeps matching this file across builds.
   Never rename them by hand. */

.ei-x03c4bb6f.ei-x03c4bb6f.ei-x03c4bb6f { justify-content:center; }
.ei-x0bff048b.ei-x0bff048b.ei-x0bff048b { margin:1px 0 0; }
.ei-x0c43289c.ei-x0c43289c.ei-x0c43289c { color:#475569; }
.ei-x0e7e647c.ei-x0e7e647c.ei-x0e7e647c { padding:34px 24px; }
.ei-x11696618.ei-x11696618.ei-x11696618 { margin:0; }
.ei-x13f24e73.ei-x13f24e73.ei-x13f24e73 { margin-bottom:22px; }
.ei-x156c3132.ei-x156c3132.ei-x156c3132 { padding:16px 20px; border-top:1px solid var(--line); }
.ei-x173812a6.ei-x173812a6.ei-x173812a6 { padding:0 24px 24px; margin-top:auto; }
.ei-x1b0f4999.ei-x1b0f4999.ei-x1b0f4999 { margin-top:16px; }
.ei-x1e03b1cf.ei-x1e03b1cf.ei-x1e03b1cf { font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--faint); margin-bottom:12px; }
.ei-x1f6b67de.ei-x1f6b67de.ei-x1f6b67de { width:34px; height:34px; border-radius:8px; background:#B45309; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0; }
.ei-x22a26743.ei-x22a26743.ei-x22a26743 { padding:0; overflow:hidden; }
.ei-x22ead87c.ei-x22ead87c.ei-x22ead87c { color:#1355A6; }
.ei-x24d308c0.ei-x24d308c0.ei-x24d308c0 { margin-top:26px; }
.ei-x2517a51b.ei-x2517a51b.ei-x2517a51b { margin-top:22px; }
.ei-x2534ede1.ei-x2534ede1.ei-x2534ede1 { margin:0 auto 22px; }
.ei-x266e9b04.ei-x266e9b04.ei-x266e9b04 { margin:0 auto; }
.ei-x28550ce4.ei-x28550ce4.ei-x28550ce4 { padding-top:10px; }
.ei-x28b33533.ei-x28b33533.ei-x28b33533 { width:34px; height:34px; border-radius:8px; background:#0F7B5A; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0; }
.ei-x2b1e4d1d.ei-x2b1e4d1d.ei-x2b1e4d1d { display:flex; flex-direction:column; gap:16px; }
.ei-x2d3a13c7.ei-x2d3a13c7.ei-x2d3a13c7 { font-size:13px; font-weight:700; color:#B45309; }
.ei-x2d724d0f.ei-x2d724d0f.ei-x2d724d0f { margin:14px 0 0; }
.ei-x2edab498.ei-x2edab498.ei-x2edab498 { font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--faint); margin-bottom:10px; }
.ei-x36323e49.ei-x36323e49.ei-x36323e49 { background:#FFFBEB; border-radius:10px; padding:14px 16px; display:flex; gap:12px; align-items:center; }
.ei-x3bda2856.ei-x3bda2856.ei-x3bda2856 { font-size:26px; font-weight:700; color:var(--green-dark); }
.ei-x3cf35d29.ei-x3cf35d29.ei-x3cf35d29 { padding-top:24px; }
.ei-x3df699cc.ei-x3df699cc.ei-x3df699cc { width:34px; height:34px; margin:0; background:#FEF2F2; }
.ei-x41d7d7e2.ei-x41d7d7e2.ei-x41d7d7e2 { padding:0; }
.ei-x49fcd855.ei-x49fcd855.ei-x49fcd855 { margin-top:24px; }
.ei-x4a34beba.ei-x4a34beba.ei-x4a34beba { margin:0 auto 8px; }
.ei-x4e420aff.ei-x4e420aff.ei-x4e420aff { margin-bottom:6px; }
.ei-x522ecc25.ei-x522ecc25.ei-x522ecc25 { font-size:13px; font-weight:700; color:#1A1A1A; }
.ei-x54a03edb.ei-x54a03edb.ei-x54a03edb { padding:18px 22px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:11px; }
.ei-x56f43562.ei-x56f43562.ei-x56f43562 { margin-top:12px; }
.ei-x583f758b.ei-x583f758b.ei-x583f758b { margin-top:28px; }
.ei-x684ba2ce.ei-x684ba2ce.ei-x684ba2ce { padding-top:14px; }
.ei-x696fa04e.ei-x696fa04e.ei-x696fa04e { width:34px; height:34px; border-radius:8px; background:#1A1A1A; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0; }
.ei-x6a31ae78.ei-x6a31ae78.ei-x6a31ae78 { gap:14px; margin-bottom:18px; }
.ei-x6be0d8ba.ei-x6be0d8ba.ei-x6be0d8ba { text-align:left; }
.ei-x6e12ab0d.ei-x6e12ab0d.ei-x6e12ab0d { margin-bottom:26px; }
.ei-x6f3d7fed.ei-x6f3d7fed.ei-x6f3d7fed { padding:18px 22px; }
.ei-x7204f17f.ei-x7204f17f.ei-x7204f17f { font-size:26px; font-weight:700; color:var(--blue); }
.ei-x761d3add.ei-x761d3add.ei-x761d3add { margin-bottom:10px; }
.ei-x798dfa20.ei-x798dfa20.ei-x798dfa20 { font-size:26px; font-weight:700; color:var(--blue-dark); }
.ei-x7f0b786e.ei-x7f0b786e.ei-x7f0b786e { font-size:13px; font-weight:700; color:#0F7B5A; }
.ei-x7fd5b2bd.ei-x7fd5b2bd.ei-x7fd5b2bd { width:34px; height:34px; margin:0; background:#E7F1FE; }
.ei-x824563a4.ei-x824563a4.ei-x824563a4 { color:#6B21A8; }
.ei-x86de7ac6.ei-x86de7ac6.ei-x86de7ac6 { margin-top:18px; }
.ei-x874cd66e.ei-x874cd66e.ei-x874cd66e { background:#F0FDF4; border-radius:10px; padding:14px 16px; display:flex; gap:12px; align-items:center; }
.ei-x87752d03.ei-x87752d03.ei-x87752d03 { font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink); margin-bottom:14px; }
.ei-x89a19c27.ei-x89a19c27.ei-x89a19c27 { background:var(--tint-2); border-radius:10px; padding:14px 16px; display:flex; gap:12px; align-items:center; }
.ei-x89e3dbfd.ei-x89e3dbfd.ei-x89e3dbfd { padding:20px 22px 16px; }
.ei-x8c8393ad.ei-x8c8393ad.ei-x8c8393ad { padding:18px 22px 14px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:11px; }
.ei-x905d8b3d.ei-x905d8b3d.ei-x905d8b3d { margin-bottom:18px; }
.ei-x9849cae9.ei-x9849cae9.ei-x9849cae9 { justify-content:flex-start; margin-top:22px; }
.ei-xa26bda7d.ei-xa26bda7d.ei-xa26bda7d { margin-top:20px; }
.ei-xa6687c9c.ei-xa6687c9c.ei-xa6687c9c { font-size:52px; font-weight:700; color:var(--ink); letter-spacing:-.03em; margin:12px 0 2px; }
.ei-xaa7d3b1a.ei-xaa7d3b1a.ei-xaa7d3b1a { margin-top:22px; text-align:center; background:var(--tint-2); }
.ei-xb17c10e3.ei-xb17c10e3.ei-xb17c10e3 { font-size:15px; color:var(--muted); margin-bottom:6px; }
.ei-xb526f475.ei-xb526f475.ei-xb526f475 { text-align:left; max-width:560px; margin:0 auto; }
.ei-xb71a80ad.ei-xb71a80ad.ei-xb71a80ad { font-size:15px; color:var(--muted); margin-bottom:18px; }
.ei-xbd031f72.ei-xbd031f72.ei-xbd031f72 { margin:0 auto 24px; }
.ei-xbd196117.ei-xbd196117.ei-xbd196117 { border:none; border-radius:0; }
.ei-xc6394404.ei-xc6394404.ei-xc6394404 { padding-bottom:20px; }
.ei-xc8eccd83.ei-xc8eccd83.ei-xc8eccd83 { font-size:15px; margin:0; }
.ei-xd2c171b1.ei-xd2c171b1.ei-xd2c171b1 { margin-top:10px; }
.ei-xd435cffe.ei-xd435cffe.ei-xd435cffe { font-size:48px; font-weight:700; color:var(--ink); letter-spacing:-.03em; margin:12px 0 2px; }
.ei-xd6f2af6e.ei-xd6f2af6e.ei-xd6f2af6e { margin-top:14px; }
.ei-xd870e82b.ei-xd870e82b.ei-xd870e82b { margin:12px 0 0; }
.ei-xda12f285.ei-xda12f285.ei-xda12f285 { margin-bottom:12px; }
.ei-xdcfa0f28.ei-xdcfa0f28.ei-xdcfa0f28 { color:var(--faint); }
.ei-xdfb21652.ei-xdfb21652.ei-xdfb21652 { align-items:start; }
.ei-xe0b0d3a9.ei-xe0b0d3a9.ei-xe0b0d3a9 { color:#0F7B5A; }
.ei-xe8e7d570.ei-xe8e7d570.ei-xe8e7d570 { margin:0 auto 26px; }
.ei-xeafe7f43.ei-xeafe7f43.ei-xeafe7f43 { font-size:26px; font-weight:700; color:#7C3AED; }
.ei-xec483929.ei-xec483929.ei-xec483929 { padding:32px 24px; }
.ei-xeea88077.ei-xeea88077.ei-xeea88077 { margin-top:34px; }
.ei-xefea5fc7.ei-xefea5fc7.ei-xefea5fc7 { margin:16px 0 0; }
.ei-xf04e97f1.ei-xf04e97f1.ei-xf04e97f1 { line-height:1.7; }
.ei-xf19a7524.ei-xf19a7524.ei-xf19a7524 { max-width:560px; margin:0 auto 36px; }
.ei-xf1bebdbe.ei-xf1bebdbe.ei-xf1bebdbe { padding-top:22px; }
.ei-xfdd9c5e4.ei-xfdd9c5e4.ei-xfdd9c5e4 { max-width:520px; margin:0 auto 20px; }

/* ---------- Blog -------------------------------------------------------------
   The index at /blog/ (home.php) and single posts (single.php). Cards reuse the
   Guides pattern; the post body reuses the guide typography scale so posts
   written in the ordinary editor match the rest of the site. */

.post-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.post-grid .post-card-lg { grid-column: 1 / -1; padding: 30px 28px; }
.post-grid .post-card-lg h2 { font-size: 26px; }
@media (max-width: 760px) { .post-grid { grid-template-columns: 1fr; } }

.post-card h2 { font-size: 18px; margin: 8px 0 6px; line-height: 1.3; color: var(--ink); }
.post-card p:not(:where(.ei-p)) { font-size: 14px; color: var(--muted); margin: 0 0 12px; }

.post-meta {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-size: 13px; color: var(--faint); margin-bottom: 6px;
}
.post-read::before { content: "·"; margin-right: 10px; color: var(--line); }

.post-empty {
  text-align: center; max-width: 520px; margin: 0 auto; padding: 30px 0;
}
.post-empty h2 { margin-bottom: 10px; }
.post-empty p { color: var(--muted); margin-bottom: 20px; }

/* Reading column */
.post-col { max-width: 760px; }
.post-col h1 { font-size: clamp(28px, 4vw, 40px); margin-top: 6px; }
.post-hero-img img { border-radius: var(--radius); margin-bottom: 26px; }

.post-body { font-size: 16.5px; line-height: 1.75; }
.post-body p:not(:where(.ei-p)) { margin-bottom: 18px; }
.post-body h2 { font-size: 25px; margin: 34px 0 14px; }
.post-body h3 { font-size: 19px; margin: 28px 0 10px; }
.post-body ul, .post-body ol { margin: 0 0 18px; padding-left: 24px; }
.post-body li { margin-bottom: 8px; }
.post-body img { border-radius: 12px; }
.post-body blockquote {
  margin: 22px 0; padding: 4px 0 4px 20px;
  border-left: 3px solid var(--blue); color: var(--ink); font-size: 17.5px;
}
.post-body blockquote p:not(:where(.ei-p)):last-child { margin-bottom: 0; }
.post-body a { text-decoration: underline; text-underline-offset: 2px; }
.post-body .wp-block-image figcaption { font-size: 13px; color: var(--faint); text-align: center; }

/* Previous / next */
.post-nav {
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px;
  margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--line);
}
.post-nav-label { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--faint); display: block; margin-bottom: 6px; }
.post-nav .guide-card h3 { margin: 0; }
.post-nav-next { text-align: right; }
@media (max-width: 620px) { .post-nav { grid-template-columns: 1fr; } .post-nav-next { text-align: left; } }

/* Pagination.

   WordPress renders page links inside <div class="nav-links">, the same class
   the header menu uses — so without these resets the pager inherits menu-pill
   styling on desktop and the mobile rule that hides the menu behind the
   hamburger would hide the pager entirely. Scoping under .pager restores it. */
.pager { margin-top: 34px; }
.pager .nav-links {
  display: flex !important; justify-content: center; align-items: center;
  gap: 6px; flex-wrap: wrap;
  position: static; background: none; border: none; box-shadow: none; padding: 0;
  flex-direction: row;
}
.pager .page-numbers {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 38px; height: 38px; padding: 0 12px; border-radius: 10px;
  border: 1.5px solid var(--line); background: #fff;
  font-size: 14px; font-weight: 600; color: var(--ink); width: auto;
}
.pager a.page-numbers:hover { border-color: var(--blue); color: var(--blue-dark); text-decoration: none; }
.pager .page-numbers.current { background: var(--blue); border-color: var(--blue); color: #fff; }
.pager .page-numbers.dots { border: none; background: none; color: var(--faint); }
.pager .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ---------- Home hero slideshow (2.0.5) -------------------------------- */
/* Four lifestyle photos, all normalised to 2.4:1; the stage keeps that same
   ratio so the whole photo — its caption included — is always on screen and
   scales with the viewport on phone, tablet and desktop. */
.ei-hero { position: relative; background: #0B1526; padding: 0; margin: 0; }
.ei-hero-slides { position: relative; width: 100%; aspect-ratio: 2.4 / 1; overflow: hidden; }
.ei-slide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.1s ease; }
.ei-slide.on { opacity: 1; }
/* The photos are addressed RELATIVE TO THIS STYLESHEET, so they always come
   from whichever theme folder is active — page content never carries a
   version-bound image URL that a deleted old theme folder would break. */
.ei-slide-1 { background-image: url(hero-1.jpg); }
.ei-slide-2 { background-image: url(hero-2.jpg); }
.ei-slide-3 { background-image: url(hero-3.jpg); }
.ei-slide-4 { background-image: url(hero-4.jpg); }
/* The "light black layer": a dark band holding the logo, statement and
   buttons. It overlays the bottom of the photo on large screens and drops
   below the photo on smaller ones, so it never hides the caption. */
.ei-hero-bar {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: linear-gradient(180deg, rgba(9,14,24,0) 0%, rgba(9,14,24,.72) 30%, rgba(9,14,24,.94) 100%);
  padding: 34px 0 20px;
}
.ei-hero-bar-in { display: flex; align-items: center; gap: 24px; }
.ei-hero-logo-card { display: inline-block; flex-shrink: 0; margin: 0; line-height: 0; }
.ei-hero-logo-card img { display: block; width: min(400px, 68vw); height: auto; filter: drop-shadow(0 2px 8px rgba(2, 6, 14, 0.55)); }
.ei-hero-statement:where(.ei-p) { flex: 1; color: #F4F7FB; font-size: 13.8px; font-weight: 700; line-height: 1.6; margin: 0; text-shadow: 0 1px 2px rgba(0,0,0,.4); max-width: 640px; }
.ei-hero-actions:where(.ei-p) { margin: 0; display: flex; gap: 10px; flex-wrap: nowrap; flex-shrink: 0; }
.ei-hero-dots { position: absolute; right: 20px; top: 16px; display: flex; gap: 8px; z-index: 2; }
.ei-dot { width: 10px; height: 10px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.9); background: rgba(9,14,24,.25); padding: 0; cursor: pointer; }
.ei-dot.on { background: #fff; }
.ei-hero-after { padding-top: 30px; }
@media (max-width: 1080px) {
  /* Photo too short to overlay: the band becomes a solid block under it. */
  .ei-hero-bar { position: static; background: #0B1526; padding: 18px 0; }
  .ei-hero-bar-in { flex-wrap: wrap; gap: 14px; }
  .ei-hero-statement:where(.ei-p) { flex-basis: 100%; order: 3; max-width: none; }
  .ei-hero-actions:where(.ei-p) { order: 2; margin-left: auto; }
}
@media (max-width: 780px) {
  .ei-hero-logo-card img { width: min(250px, 60vw); }
  .ei-hero-actions:where(.ei-p) { margin-left: 0; }
  .ei-hero-actions:where(.ei-p) .btn { padding: 10px 16px; }
  .ei-hero-dots { right: 10px; top: 8px; gap: 6px; }
  .ei-dot { width: 8px; height: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .ei-slide { transition: none; }
}

/* ---------- Reg P model-form privacy notice (2.2.0) --------------------- */
.regp { max-width: 760px; }
.regp-facts { display: flex; align-items: stretch; border: 2px solid var(--ink); margin-bottom: 14px; }
.regp-facts-word { background: var(--ink); color: #fff; font-weight: 800; font-size: 22px; padding: 12px 18px; display: flex; align-items: center; }
.regp-facts-q { padding: 12px 16px; font-weight: 700; font-size: 15px; display: flex; align-items: center; }
.regp-table { width: 100%; border-collapse: collapse; margin: 0 0 18px; font-size: 13.5px; }
.regp-table th, .regp-table td { border: 1px solid var(--line); padding: 10px 12px; vertical-align: top; text-align: left; }
.regp-table th[scope="row"] { width: 30%; background: var(--tint); font-weight: 700; color: var(--ink); }
.regp-sharing thead th { background: var(--ink); color: #fff; font-weight: 700; }
.regp-sharing td:nth-child(2), .regp-sharing td:nth-child(3) { white-space: nowrap; width: 1%; }
.regp-band { background: var(--ink); color: #fff !important; font-weight: 700; }
.regp-table ul { margin: 6px 0 0 18px; padding: 0; }
.regp-table li { margin-bottom: 3px; }
@media (max-width: 620px) {
  .regp-table th[scope="row"] { width: 38%; }
  .regp-sharing td:nth-child(2), .regp-sharing td:nth-child(3) { white-space: normal; }
}

/* Privacy request form */
.ei-pr-attest label { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; font-size: 13.5px; line-height: 1.55; }
.ei-pr-attest input[type="checkbox"] { width: 16px; height: 16px; margin-top: 2px; flex-shrink: 0; }
.ei-pr-thanks h3 { margin-top: 0; }
.ei-pr-radios { border: 0; padding: 0; margin: 0; }
.ei-pr-radios legend { font-weight: 600; font-size: 14px; margin-bottom: 8px; padding: 0; }
.ei-pr-radio { display: flex; gap: 9px; align-items: center; font-weight: 500; font-size: 14px; margin: 0 0 7px; }
.ei-pr-radio input[type="radio"] { width: 15px; height: 15px; flex-shrink: 0; margin: 0; }

/* Text Message Terms — consent checkbox example */
.ei-sms-consent { border: 1.5px solid var(--line); border-radius: 12px; background: var(--tint-2); padding: 16px 18px; margin: 4px 0 20px; }
.ei-sms-consent label { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.55; color: var(--ink); }
.ei-sms-consent input { width: 16px; height: 16px; margin-top: 3px; flex-shrink: 0; }

/* Fee Schedule table */
.fee-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.fee-table th, .fee-table td { text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--line); vertical-align: top; }
.fee-table thead th { background: var(--ink); color: #fff; font-size: 13px; letter-spacing: .02em; }
.fee-table tbody tr:nth-child(even) td { background: var(--tint-2); }
.fee-table td:last-child { font-weight: 600; color: var(--ink); }


/* ---------- Accessibility pass (2.2.0) ---------------------------------- */
/* Inline links inside running text are underlined so they are distinguishable
   without relying on colour (WCAG 1.4.1). Buttons, cards and menus are exempt:
   they carry their own affordances. */
main p a:not(.btn), main li a:not(.btn), main td a, main figcaption a,
.disclaimer a, .footer-bottom a, .hc-fineprint a {
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* A visible focus indicator everywhere, not only where the browser default
   survives our resets. */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--blue-dark);
  outline-offset: 2px;
  border-radius: 4px;
}
.cta-band a:focus-visible, .ei-hero-bar a:focus-visible {
  outline-color: #fff;
}

/* ---------- Referral Partners: weekly training (2.2.11) ------------------- */
.ei-training-split { align-items: start; }
.ei-training .hiw-list { margin-top: 22px; }
.ei-training-card .ledger { margin-bottom: 20px; }
.ei-training-card .ei-reveal-cta { text-align: left; }
.ei-training-card .ei-reveal-cta .btn { width: 100%; justify-content: center; }
.ei-training-card .ei-form-panel { padding: 0; border: 0; box-shadow: none; background: transparent; }
.ei-training-card .ei-field-row { grid-template-columns: 1fr; }
.ei-training-card .ei-form-success .split-panel { box-shadow: none; }
@media (max-width: 860px) {
  .ei-training-split { grid-template-columns: 1fr; }
}

/* ---------- Partner-training landing page (2.2.12) ------------------------ */
.ei-lp-hero .pill-row { justify-content: center; margin-top: 18px; }
.ei-lp-hero .hero-actions { margin-top: 22px; }
.ei-lp-body h3 { margin-top: 28px; }
.ei-lp-card-title { margin: 0 0 14px; font-size: 20px; }
.ei-training-cta { width: 100%; justify-content: center; margin-top: 4px; }
.ei-training-card [hidden] { display: none !important; }
/* 2.2.14: form sits in the hero, right under the tags. */
.ei-lp-hero .ei-lp-form { max-width: 560px; margin: 28px auto 0; text-align: left; }
.ei-lp-hero .ei-lp-form .ei-form-success { text-align: center; }
.ei-lp-hero .ei-lp-form button[type="submit"] { width: 100%; justify-content: center; margin-top: 14px; }
.ei-lp-body { padding-top: 64px; }
.ei-lp-body h2 { margin-top: 0; }

/* ==========================================================================
   Become a Referral Partner (/become-a-referral-partner/), two-step card.
   Markup from [ei_partner_signup] in inc/partner-signup.php; steps in site.js.
   ========================================================================== */
.ei-ps-section { background: #F8F9FB; padding: 28px 16px 80px; }
.ei-ps { max-width: 448px; margin: 0 auto; }
.ei-ps-back {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 500; color: var(--ink);
  background: #fff; border: 1px solid #D1D5DB; border-radius: 6px;
  padding: 6px 10px; margin-bottom: 10px; text-decoration: none;
}
.ei-ps-back:hover { background: #F3F4F6; color: var(--ink); }
.ei-ps-back svg { width: 14px; height: 14px; }
.ei-ps-card { background: #fff; border: 1px solid #111827; border-radius: 6px; padding: 18px 16px 16px; }
.ei-ps-icon { display: block; width: 26px; height: 26px; color: #5B2BE0; margin-bottom: 12px; }
.ei-ps-card h1 { font-size: 20px; font-weight: 600; letter-spacing: -0.01em; margin: 0 0 4px; color: #111827; }
.ei-ps-sub { font-size: 12.5px; color: #4B5563; line-height: 1.5; margin: 0 0 14px; }
.ei-ps-steps { display: flex; align-items: center; gap: 4px; font-size: 12px; color: #6B7280; margin: 0 0 18px; }
.ei-ps-steps[hidden] { display: none; }
.ei-ps-bar { width: 28px; height: 4px; border-radius: 2px; background: #E5E7EB; }
.ei-ps-bar.is-on { background: #3F7EF5; }
.ei-ps-bar + span:not(.ei-ps-bar) { margin-left: 4px; }
.ei-ps-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 10px; }
@media (max-width: 420px) { .ei-ps-row { grid-template-columns: 1fr; } }
.ei-ps-field { margin: 0 0 18px; }
.ei-ps label { display: block; font-size: 12.5px; font-weight: 500; color: #111827; margin: 0 0 7px; }
.ei-ps-req { color: inherit; }
.ei-ps input[type="text"], .ei-ps input[type="email"], .ei-ps input[type="tel"], .ei-ps select {
  display: block; width: 100%; height: 34px; margin: 0;
  font: inherit; font-size: 13px; color: #111827; background: #fff;
  border: 1px solid #D1D5DB; border-radius: 6px; padding: 0 10px;
  box-shadow: none; outline: none; box-sizing: border-box;
}
.ei-ps input::placeholder { color: #9CA3AF; }
.ei-ps input:focus, .ei-ps select:focus { border-color: #3F7EF5; box-shadow: 0 0 0 3px rgba(63,126,245,.15); }
.ei-ps select:disabled { color: #6B7280; border-color: #E5E7EB; cursor: not-allowed; opacity: 1; }
.ei-ps .is-invalid { border-color: #DC2626; }
.ei-ps-error { font-size: 11.5px; color: #DC2626; margin-top: 5px; }
.ei-ps-alert { font-size: 12.5px; color: #991B1B; background: #FEF2F2; border: 1px solid #FECACA; border-radius: 6px; padding: 8px 10px; margin: 0 0 14px; }
.ei-ps .ei-ps-stack > * + * { margin-top: 8px; }
.ei-ps.is-js .ei-ps-js-hide { display: none; }
.ei-ps-note { font-size: 11.5px; color: #4B5563; line-height: 1.5; margin: -6px 0 14px; }
.ei-ps-actions { display: flex; gap: 10px; }
.ei-ps-actions[hidden], .ei-ps-btn[hidden], .ei-ps-step[hidden], .ei-ps [hidden] { display: none; }
.ei-ps-btn {
  flex: 1; height: 34px; border-radius: 6px; border: 1px solid transparent;
  font: inherit; font-size: 13px; font-weight: 500; cursor: pointer;
  background: #3F7EF5; color: #fff; padding: 0 14px;
}
.ei-ps-btn:hover { background: #2F6EE6; }
.ei-ps-btn-ghost { flex: 0 0 96px; background: #fff; color: #111827; border-color: #D1D5DB; }
.ei-ps-btn-ghost:hover { background: #F3F4F6; }
.ei-ps-done { text-align: center; padding: 12px 4px 8px; }
.ei-ps-tick { width: 44px; height: 44px; border-radius: 50%; background: #EDE7FD; color: #5B2BE0; display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; }
.ei-ps-done p { font-size: 13px; color: #4B5563; line-height: 1.55; margin: 6px 0 0; }
.ei-ps-card:has(.ei-ps-done:not([hidden])) > .ei-ps-icon { display: none; }

/* ---------- Audience landing pages (loan officers, realtors, sellers) ---- */
.lp-hero { padding: 60px 0 56px; }
.lp-hero-split { align-items: center; grid-template-columns: 1.2fr .8fr; }
.lp-hero .hero-actions { justify-content: flex-start; margin: 22px 0 0; }
.lp-states { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 22px 0 0; font-size: 13.5px; color: var(--muted); }
.lp-states .pill { font-size: 11px; padding: 4px 11px; }
.lp-states-label { margin-right: 2px; }
.lp-card-title { font-size: 18px; margin-bottom: 4px; }
.lp-hero-card .small { margin-bottom: 16px; }
.lp-compare { display: grid; gap: 10px; }
.lp-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 14px; border-radius: 10px; font-size: 14px; font-weight: 600; border: 1px solid var(--line);
}
.lp-row .pill { flex-shrink: 0; font-size: 10px; padding: 3px 8px; }
.lp-row.is-old { background: #FEF2F2; border-color: #FECACA; color: #991B1B; }
.lp-row.is-old .pill { background: #FEE2E2; color: #B91C1C; }
.lp-row.is-new { background: #F0FDF4; border-color: #BBF7D0; color: var(--green-dark); }
.lp-row.is-new .pill { background: #DCFCE7; color: var(--green-dark); }
.lp-arrow { text-align: center; color: var(--faint); font-size: 18px; line-height: 1; }

.lp-questions { gap: 20px; }
.lp-q {
  background: #fff; border: 1.5px solid var(--line); border-left: 4px solid var(--blue);
  border-radius: var(--radius); padding: 22px 22px 24px; box-shadow: var(--shadow-sm);
}
.lp-q-n { font-size: 12px; font-weight: 700; letter-spacing: .08em; color: var(--blue-dark); margin: 0 0 8px; }
.lp-q-text { font-size: 16.5px; font-weight: 600; color: var(--ink); line-height: 1.45; margin: 0; }

.lp-features .feature svg { margin-top: 0; }
.lp-features .feature h3 { font-size: 16px; }
.lp-features .feature p:not(:where(.ei-p)) { font-size: 14px; }

.lp-products { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.lp-prod {
  display: flex; align-items: center; gap: 10px; padding: 18px 18px;
  background: #fff; border: 1.5px solid var(--line); border-radius: 12px;
  font-weight: 600; font-size: 14.5px; color: var(--ink);
  transition: border-color .15s, transform .15s, box-shadow .15s;
}
.lp-prod:hover { text-decoration: none; border-color: #BFDBFE; transform: translateY(-2px); box-shadow: var(--shadow-sm); color: var(--blue-dark); }
.lp-dot { flex-shrink: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--blue); }

.lp-panel-title { font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }

.lp-form-split { align-items: start; }
.lp-form-split .lead { margin-bottom: 22px; }
.lp-checks li { margin-bottom: 14px; }
.lp-checks strong { font-weight: 600; font-size: 15px; }
.lp-form-card .ei-form-panel { padding: 0; border: 0; box-shadow: none; background: transparent; }
.lp-form-card > .small { margin-bottom: 18px; }
.lp-form-card .ei-form-actions button[type="submit"] { width: 100%; justify-content: center; margin-top: 12px; }
.ei-form-panel .opt { font-weight: 500; color: var(--muted); }
.ei-form-group-title {
  font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  color: var(--blue-dark); margin: 4px 0 12px;
}
.ei-field-row + .ei-form-group-title { margin-top: 6px; }
.ei-choice { border: 0; margin: 0; padding: 0; }
.ei-choice legend { display: block; font-size: 13.5px; font-weight: 700; color: var(--ink); margin-bottom: 8px; padding: 0; }
.ei-choice-row { display: flex; flex-wrap: wrap; gap: 10px; }
.ei-form-panel .ei-choice-row label {
  display: inline-flex; align-items: center; gap: 2px; margin: 0;
  padding: 9px 14px; border: 1.5px solid var(--line); border-radius: 8px;
  font-weight: 600; cursor: pointer; background: #fff;
}
.ei-form-panel .ei-choice-row label:has(input:checked) { border-color: var(--blue); background: #F1F7FF; color: var(--blue-dark); }

.cta-band a:not(.btn) { color: #fff; text-decoration: underline; }
.lp-nowrap { white-space: nowrap; }

@media (max-width: 900px) {
  .lp-hero-split { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .lp-hero .hero-actions .btn { width: 100%; text-align: center; }
  .lp-row { flex-direction: column; align-items: flex-start; gap: 6px; }
  .lp-form-card .ei-form-actions button[type="submit"] { text-align: center; }
}
.lp-steps-cta { margin-top: 32px; }
.lp-ref-hero .lp-form-split { align-items: start; }
.lp-ref-hero h1 { font-size: clamp(30px, 4.2vw, 42px); }
.lp-ref-help { margin-top: 22px; }
.ei-field[hidden] { display: none !important; }
.lp-thanks { padding: 84px 0 96px; }
.lp-thanks-icon {
  width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 50%;
  background: #DCFCE7; display: flex; align-items: center; justify-content: center;
}
.lp-thanks .lead { max-width: 560px; margin: 0 auto 26px; }
.lp-thanks-help { margin-top: 22px; }
/* Multi-step lead form */
.ei-step-label { font-size: 13px; font-weight: 700; color: var(--ink); margin: 0 0 14px; }
.ei-step-label span {
  display: inline-block; margin-right: 6px; padding: 3px 9px; border-radius: 20px;
  background: #E7F1FE; color: var(--blue-dark); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase;
}
.ei-steps:not(.is-stepped) .ei-step + .ei-step { margin-top: 22px; padding-top: 18px; border-top: 1px dashed var(--line); }
.ei-step[hidden], .ei-step-nav[hidden], .ei-step-back[hidden] { display: none !important; }
.ei-step-nav { margin-top: 20px; }
.ei-step-nav .btn { width: 100%; justify-content: center; text-align: center; }
.ei-step-back { margin: 4px 0 0; }
.ei-link-btn { background: none; border: 0; padding: 0; font: inherit; font-size: 13.5px; font-weight: 600; color: var(--blue-dark); cursor: pointer; }
.ei-link-btn:hover { text-decoration: underline; }
.lp-thanks .lp-thanks-help { font-size: 15px; color: var(--ink); margin-top: 26px; }
.lp-form-card [hidden] { display: none !important; }
.lp-form-card .ei-form-success .split-panel { border: 0; box-shadow: none; padding: 24px 0 8px; }