/*
 * ERAi — ERA's own design (ERA-2528): Eric's website redesign, as the funnel
 * pages' layouts `erai-light` (the default) and `erai-dark`.
 *
 * Source: Eric's homepage and lead page (eraapp-redesign[-light].html,
 * erai-lead-page[-light].html) and his developer handoff. Every value below is
 * his, from his inline styles: colours, spacing, sizes, radii, clamp() sizes,
 * the 1480px hero and 1200px section widths. Light and Dark differ only in
 * colour, so every colour is a token.
 *
 * This sheet is the design system (`#page_ft_css`): tokens, type, buttons, the
 * bands, cards, the coach slider, the stats, the logo chips, the AI-stack
 * comparison, Acquire / Inspire / Empire with their Replaces boxes and step
 * cards, Education, Paths, the mid-CTA band, Founder, the FAQ, the final CTA,
 * the nav and the footer. `era-layouts-erai.css` (`#page_ft_era_css`) draws
 * ERA's hooks in it — the forms, the phone field, the consent box, the
 * Workshop's blocks — and the theme of the theme-only pages.
 *
 * SCOPE. On eraapp a published page is drawn inside eraapp's own layout: its
 * header, the page's body content, its footer, one document, the page's body
 * attributes copied onto eraapp's body. So nothing here reaches markup that is
 * not ERAi's: a body rule only defines tokens, every other rule goes through an
 * `erai-` class (a bare element only inside one), and the theme rules
 * (`[data-template-theme]`) live in the other sheet. The page's background,
 * colour and type are on its own wrapper, `<main class="erai-page">`.
 *
 * BANDS. Eric's rows strictly alternate (handoff §3). `.erai-band-a` is his
 * "dark row" (white in Light, #1C1C21 in Dark), `.erai-band-b` his "light row"
 * (#F4F5F7 in Light, #E6E6EA in Dark). His Dark page keeps the light rows'
 * contents light, so inside `.erai-band-b` Dark takes Light's palette back.
 * The bands' backgrounds stay one class deep: the editor's recolour rules
 * (`.section_even`, `.section_odd` in #custom_style, later) must win.
 */

/* ==========================================================================
   Tokens
   ========================================================================== */

/* The rows, the chrome and the hero: the same in every band. */
body[data-template="erai-light"],
[data-template-theme="erai-light"] {
  --erai-row: #FFFFFF;
  --erai-row-alt: #F4F5F7;
  --erai-chrome-bg: rgba(255, 255, 255, 0.88);
  --erai-chrome-line: #E4E4E7;
  --erai-logo-filter: none;
  --erai-hero-glow: rgba(37, 99, 235, 0.12);
  --erai-hero-fade: rgba(255, 255, 255, 0);
  --erai-hero-grid: rgba(17, 24, 39, 0.045);
  --erai-hero-top: #F0EFF7;
  --erai-hero-bottom: #FAFAFC;
  --erai-ring: #FFFFFF;
}

body[data-template="erai-dark"],
[data-template-theme="erai-dark"] {
  --erai-row: #1C1C21;
  --erai-row-alt: #E6E6EA;
  --erai-chrome-bg: rgba(28, 28, 33, 0.88);
  --erai-chrome-line: #2E2E35;
  --erai-logo-filter: invert(1);
  --erai-hero-glow: rgba(37, 99, 235, 0.28);
  --erai-hero-fade: rgba(28, 28, 33, 0);
  --erai-hero-grid: rgba(255, 255, 255, 0.045);
  --erai-hero-top: #201F2B;
  --erai-hero-bottom: #1C1C21;
  --erai-ring: #1C1C21;
}

/* The palette: Light, and Dark's light rows. */
body[data-template="erai-light"],
[data-template-theme="erai-light"],
body[data-template="erai-dark"] .erai-band-b {
  --erai-text: #18181B;
  --erai-ink: #09090B;
  --erai-body: #52525B;
  --erai-body-strong: #3F3F46;
  --erai-faint: #6B6B73;
  --erai-placeholder: #8A8A93;
  --erai-line: #E4E4E7;
  --erai-field-line: #D4D4DB;
  --erai-field-bg: #F9FAFB;
  --erai-card: #FFFFFF;
  --erai-card-alt: #FFFFFF;
  --erai-form-bg: #FFFFFF;
  --erai-form-line: #E4E4E7;
  --erai-form-rule: #E4E4E7;
  --erai-frame-line: #26262E;
  --erai-accent: #2563EB;
  --erai-link: #1D4ED8;
  --erai-link-hover: #1E3A8A;
  --erai-green: #15803D;
  --erai-check: #16A34A;
  --erai-badge-bg: #DCFCE7;
  --erai-badge-text: #166534;
  --erai-shadow: rgba(15, 23, 42, 0.08);
  --erai-shadow-strong: rgba(15, 23, 42, 0.10);
  --erai-btn-glow: rgba(37, 99, 235, 0.25);
  --erai-stat-shadow: 0 14px 40px rgba(15, 23, 42, 0.08);
  --erai-stat-line-4: rgba(37, 99, 235, 0.25);
  --erai-ring-form: #FFFFFF;
  /* Acquire */
  --erai-acq-tag: #7C3AED;
  --erai-acq-tag-text: #FFFFFF;
  --erai-acq-label: #6D28D9;
  --erai-acq-card-top: #F5F3FF;
  --erai-acq-card-bottom: #FFFFFF;
  --erai-acq-card-line: #DDD6FE;
  --erai-acq-title: #6D28D9;
  --erai-acq-row: #FFFFFF;
  --erai-acq-row-line: #27272A;
  --erai-acq-icon-bg: #EDE9FE;
  --erai-acq-icon: #6D28D9;
  --erai-acq-step: #6D28D9;
  --erai-acq-loop: #7C3AED;
  --erai-acq-repeat: #7C3AED;
  /* Inspire */
  --erai-ins-tag: #4ADE80;
  --erai-ins-tag-text: #052E16;
  --erai-ins-label: #15803D;
  --erai-ins-card-top: #F0FDF4;
  --erai-ins-card-bottom: #FFFFFF;
  --erai-ins-card-line: #BBF7D0;
  --erai-ins-title: #15803D;
  --erai-ins-row: #FFFFFF;
  --erai-ins-row-line: #27272A;
  --erai-ins-icon-bg: #DCFCE7;
  --erai-ins-icon: #15803D;
  --erai-ins-step: #15803D;
  --erai-ins-loop: #16A34A;
  --erai-ins-repeat: #15803D;
  /* Empire */
  --erai-emp-tag: #2563EB;
  --erai-emp-tag-text: #FFFFFF;
  --erai-emp-label: #2563EB;
  --erai-emp-card-top: #EFF6FF;
  --erai-emp-card-bottom: #FFFFFF;
  --erai-emp-card-line: #BFDBFE;
  --erai-emp-title: #2563EB;
  --erai-emp-row: #FFFFFF;
  --erai-emp-row-line: #27272A;
  --erai-emp-icon-bg: #DBEAFE;
  --erai-emp-icon: #1D4ED8;
  --erai-emp-step: #2563EB;
  --erai-emp-loop: #2563EB;
  --erai-emp-repeat: #2563EB;
  /* A loop's last step: the new client (green), the referral (blue) */
  --erai-win-row: #FFFFFF;
  --erai-win-row-line: #27272A;
  --erai-win-icon-bg: #DCFCE7;
  --erai-win-icon: #15803D;
  --erai-win-step: #15803D;
  --erai-ref-row: #FFFFFF;
  --erai-ref-row-line: #27272A;
  --erai-ref-icon-bg: #DBEAFE;
  --erai-ref-icon: #1D4ED8;
  --erai-ref-step: #2563EB;
}

/* The palette: Dark (its dark rows). Inspire, which Eric only drew on a light
   row, takes the same steps as Acquire and Empire in green. */
body[data-template="erai-dark"],
[data-template-theme="erai-dark"] {
  --erai-text: #F4F4F5;
  --erai-ink: #FAFAFA;
  --erai-body: #A1A1AA;
  --erai-body-strong: #D4D4D8;
  --erai-faint: #71717A;
  --erai-placeholder: #71717A;
  --erai-line: #34343C;
  --erai-field-line: #2E2E37;
  --erai-field-bg: #1F1F24;
  --erai-card: #26262C;
  --erai-card-alt: #1A1A1F;
  --erai-form-bg: #121216;
  --erai-form-line: #2A2A33;
  --erai-form-rule: #1F1F25;
  --erai-frame-line: #34343C;
  --erai-accent: #60A5FA;
  --erai-link: #93C5FD;
  --erai-link-hover: #BFDBFE;
  --erai-green: #4ADE80;
  --erai-check: #4ADE80;
  --erai-badge-bg: #16351F;
  --erai-badge-text: #4ADE80;
  --erai-shadow: rgba(0, 0, 0, 0.45);
  --erai-shadow-strong: rgba(0, 0, 0, 0.45);
  --erai-btn-glow: rgba(37, 99, 235, 0.35);
  --erai-stat-shadow: 0 18px 50px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --erai-stat-line-4: rgba(37, 99, 235, 0.35);
  --erai-ring-form: #26262C;
  --erai-acq-tag: #A78BFA;
  --erai-acq-tag-text: #09090B;
  --erai-acq-label: #A78BFA;
  --erai-acq-card-top: #15121F;
  --erai-acq-card-bottom: #0E0D14;
  --erai-acq-card-line: #2A2540;
  --erai-acq-title: #C4B5FD;
  --erai-acq-row: #1A1626;
  --erai-acq-row-line: #2E2845;
  --erai-acq-icon-bg: #2A2145;
  --erai-acq-icon: #C4B5FD;
  --erai-acq-step: #C4B5FD;
  --erai-acq-loop: #A78BFA;
  --erai-acq-repeat: #A78BFA;
  --erai-ins-tag: #4ADE80;
  --erai-ins-tag-text: #052E16;
  --erai-ins-label: #4ADE80;
  --erai-ins-card-top: #0E1A14;
  --erai-ins-card-bottom: #0B110D;
  --erai-ins-card-line: #1E4A2F;
  --erai-ins-title: #86EFAC;
  --erai-ins-row: #10261A;
  --erai-ins-row-line: #2C6B45;
  --erai-ins-icon-bg: #163A25;
  --erai-ins-icon: #86EFAC;
  --erai-ins-step: #86EFAC;
  --erai-ins-loop: #4ADE80;
  --erai-ins-repeat: #4ADE80;
  --erai-emp-tag: #60A5FA;
  --erai-emp-tag-text: #09090B;
  --erai-emp-label: #60A5FA;
  --erai-emp-card-top: #0E1424;
  --erai-emp-card-bottom: #0B0E17;
  --erai-emp-card-line: #1E3358;
  --erai-emp-title: #93C5FD;
  --erai-emp-row: #142235;
  --erai-emp-row-line: #2F5A94;
  --erai-emp-icon-bg: #1C3354;
  --erai-emp-icon: #93C5FD;
  --erai-emp-step: #93C5FD;
  --erai-emp-loop: #60A5FA;
  --erai-emp-repeat: #60A5FA;
  --erai-win-row: #10261A;
  --erai-win-row-line: #2C6B45;
  --erai-win-icon-bg: #163A25;
  --erai-win-icon: #4ADE80;
  --erai-win-step: #4ADE80;
  --erai-ref-row: #142235;
  --erai-ref-row-line: #2F5A94;
  --erai-ref-icon-bg: #1C3354;
  --erai-ref-icon: #93C5FD;
  --erai-ref-step: #93C5FD;
}

/* ==========================================================================
   The page, type, links, buttons
   ========================================================================== */

/* The page's own document only (on eraapp the body's children are eraapp's layout): Eric's `body{margin:0}`. */
body:has(> .erai-page) { margin: 0; }

.erai-page {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-x: clip;
  background: var(--erai-row);
  color: var(--erai-text);
  font-family: Inter, system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.55;
}
body[data-template="erai-dark"] .erai-page { color-scheme: dark; }
body[data-template="erai-dark"] .erai-band-b { color-scheme: light; }

/* Eric zeroes every margin inline; at a class's weight, so a component's own margin wins. */
.erai-page :where(h1, h2, h3, h4, p, figure, ul, ol, blockquote) { margin: 0; }
.erai-page :is(h1, h2, h3) { font-family: 'Inter Tight', Inter, sans-serif; }
.erai-page a { color: var(--erai-link); }
.erai-page a:hover { color: var(--erai-link-hover); }
.erai-page strong { font-weight: 700; }
.erai-page .custom_image img { display: block; }

/* The editor's text wrappers stay out of the layout's way. */
.erai-page .text-container { min-width: 0; }

/* Highlights in a headline: the app (blue, italic, underlined), the money (green). */
.erai-hl {
  color: var(--erai-accent);
  font-style: italic;
  text-decoration: underline;
  text-decoration-thickness: 0.07em;
  text-underline-offset: 0.12em;
}
.erai-money { color: var(--erai-check); }
.erai-accent { color: var(--erai-accent); }
.erai-muted { color: var(--erai-body); }

/* Section heads: eyebrow, headline, lede. */
.erai-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--erai-accent); }
.erai-eyebrow--green { color: var(--erai-green); }
.erai-h2 { font-size: clamp(32px, 4vw, 52px); line-height: 1.06; letter-spacing: -0.03em; }
.erai-h2--48 { font-size: clamp(32px, 4vw, 48px); }
.erai-lede { color: var(--erai-body); font-size: 18px; }
.erai-head { display: flex; flex-direction: column; gap: 14px; max-width: 760px; }
.erai-head--center { max-width: 860px; margin: 0 auto; text-align: center; align-items: center; }
.erai-head--wide { max-width: 820px; gap: 16px; }

/* Buttons: Eric's links-as-buttons, as <button>s the runtime answers. */
.erai-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin: 0;
  border: 0;
  font: inherit;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.erai-btn:focus-visible { outline: 3px solid rgba(37, 99, 235, 0.45); outline-offset: 2px; }
.erai-btn--blue { background: #2563EB; color: #FFFFFF; }
.erai-btn--white { background: #FFFFFF; color: #0B1220; }
.erai-btn--nav { min-height: 44px; padding: 11px 18px; border-radius: 10px; font-size: 15px; font-weight: 600; }
.erai-btn--team { padding: 14px 20px; border-radius: 12px; font-weight: 700; }
.erai-btn--block { width: 100%; padding: 14px; border-radius: 12px; font-weight: 700; }
.erai-btn--mid { min-height: 44px; padding: 16px 24px; border-radius: 12px; font-size: 16px; font-weight: 700; }
.erai-btn--final { padding: 18px 30px; border-radius: 14px; font-size: 18px; font-weight: 700; }
.erai-btn--glow { box-shadow: 0 10px 30px rgba(37, 99, 235, 0.35); }

/* What the editor's Add Web Elements inserts, in ERAi's blue (era-funnel.css draws it black). */
.erai-page :where(button.button) { background: #2563EB; border-radius: 12px; font-weight: 700; }

/* ==========================================================================
   Bands
   ========================================================================== */

.erai-band-a { position: relative; background: var(--erai-row); color: var(--erai-text); }
.erai-band-b { position: relative; background: var(--erai-row-alt); color: var(--erai-text); }

.erai-wrap { max-width: 1200px; margin: 0 auto; }
.erai-col { display: flex; flex-direction: column; gap: 40px; }

/* ==========================================================================
   Nav and footer (eraapp draws its own on the public site; the editor locks these)
   ========================================================================== */

.erai-nav {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--erai-chrome-bg);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--erai-chrome-line);
}
.erai-nav__inner {
  max-width: 1480px;
  margin: 0 auto;
  padding: 14px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.erai-nav__logo { display: flex; align-items: center; }
.erai-nav__logo img { display: block; width: auto; height: 30px; }
.erai-nav__menu { display: flex; gap: 28px; flex-wrap: wrap; font-size: 15px; font-weight: 500; }
.erai-nav__menu a { color: var(--erai-body-strong); text-decoration: none; }
.erai-nav__menu a:hover { color: var(--erai-text); }
.erai-nav__actions { display: flex; gap: 10px; align-items: center; }
.erai-nav__login {
  display: inline-block;
  padding: 10px 14px;
  border-radius: 10px;
  color: var(--erai-text);
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}
.erai-page .erai-nav__login,
.erai-page .erai-nav__login:hover { color: var(--erai-text); }

/* The ERAi logo is black; on a dark row it is drawn white. By file name, so a logo uploaded in its place shows as it is. */
:is(.erai-nav, .erai-footer) [data-type="logo"] img:is([src*="/images/erai/logo-black.png"], [src*="/images/ERAi_logo-light-mode.png"]) {
  filter: var(--erai-logo-filter);
}

.erai-footer {
  margin-top: auto;
  padding: 40px 24px;
  background: var(--erai-row);
  border-top: 1px solid var(--erai-chrome-line);
}
.erai-footer__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: space-between;
  align-items: center;
}
.erai-footer__brand { display: flex; flex-direction: column; gap: 8px; }
.erai-footer__logo { display: flex; align-self: flex-start; }
.erai-footer__logo img { display: block; width: auto; height: 26px; }
.erai-footer__tagline { color: var(--erai-body); font-size: 14px; }
.erai-footer__links { display: flex; flex-wrap: wrap; gap: 22px; font-size: 14px; }
.erai-page .erai-footer__links a { color: var(--erai-body); text-decoration: none; }
.erai-page .erai-footer__links a:hover { color: var(--erai-text); }
.erai-footer__legal { width: 100%; }
.erai-footer__copy { color: var(--erai-faint); font-size: 13px; }

/* ==========================================================================
   Hero
   ========================================================================== */

.erai-hero {
  padding: 72px 40px 48px;
  background:
    radial-gradient(900px 420px at 50% -80px, var(--erai-hero-glow), var(--erai-hero-fade) 70%),
    linear-gradient(var(--erai-hero-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--erai-hero-grid) 1px, transparent 1px),
    linear-gradient(180deg, var(--erai-hero-top), var(--erai-hero-bottom));
  background-size: auto, 100px 100px, 100px 100px, auto;
  background-position: center top;
}
.erai-hero--lead { padding: 72px 40px 88px; }
.erai-hero__inner { max-width: 1480px; margin: 0 auto; }
.erai-hero__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 22px;
  max-width: 1240px;
  margin: 0 auto;
}
.erai-hero__grid {
  margin-top: 48px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr));
  gap: 40px;
  align-items: stretch;
}
/* The lead page: the promise beside the form. */
.erai-hero__split {
  max-width: 1360px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr));
  gap: 56px;
  align-items: center;
}
.erai-hero__copy { display: flex; flex-direction: column; gap: 24px; }

.erai-pill {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px 7px 8px;
  border: 1px solid var(--erai-line);
  border-radius: 999px;
  background: var(--erai-card);
  font-size: 14px;
  color: var(--erai-body-strong);
}
.erai-pill--start { align-self: flex-start; }
.erai-pill__text { display: inline-flex; align-items: center; gap: 10px; }
.erai-pill__badge {
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--erai-badge-bg);
  color: var(--erai-badge-text);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.erai-pill__badge--blue { background: #2563EB; color: #FFFFFF; }
.erai-pill__text strong { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; }

.erai-h1 {
  font-weight: 800;
  font-size: clamp(36px, 4.8vw, 68px);
  line-height: 1.06;
  letter-spacing: -0.035em;
  color: var(--erai-ink);
}
.erai-h1--lead { font-size: clamp(32px, 3.5vw, 54px); line-height: 1.08; }
.erai-h1__sub { display: block; margin-top: 0.22em; font-size: 0.56em; font-weight: 700; line-height: 1.15; letter-spacing: -0.025em; }
.erai-h1__sub + .erai-h1__sub { margin-top: 0.08em; }
.erai-hero__sub { font-size: clamp(17px, 1.6vw, 20px); color: var(--erai-body); max-width: 980px; }
.erai-hero__sub strong { color: var(--erai-text); }
.erai-hero__kicker {
  font-family: 'Inter Tight', Inter, sans-serif;
  font-size: clamp(22px, 2.2vw, 30px);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--erai-ink);
}

/* The video, framed as Eric's VSL. */
.erai-vsl { display: flex; flex-direction: column; gap: 14px; }
.erai-vsl > .era_video,
.erai-frame {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9.3;
  border: 1px solid var(--erai-frame-line);
  border-radius: 20px;
  background: #000000;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
}
.erai-vsl > .era_video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.erai-frame--contain { aspect-ratio: auto; background: #0B0D14; }
.erai-frame img { width: 100%; height: 100%; object-fit: cover; }
.erai-frame--contain img { height: auto; object-fit: contain; }

/* The avatars beside a proof line. */
.erai-proof { display: flex; align-items: center; gap: 12px; padding-top: 4px; }
.erai-proof__faces { display: flex; }
.erai-proof__faces .custom_image { width: 34px; height: 34px; border: 2px solid var(--erai-ring); border-radius: 999px; overflow: hidden; }
.erai-proof__faces .custom_image + .custom_image { margin-left: -10px; }
.erai-proof__faces img { width: 100%; height: 100%; object-fit: cover; }
.erai-proof__text { font-size: 14px; color: var(--erai-body); }
.erai-proof--form { padding-top: 6px; border-top: 1px solid var(--erai-form-rule); }
.erai-proof--form .custom_image { border-color: var(--erai-ring-form); }
.erai-proof--form .erai-proof__text { font-size: 13px; }

/* ==========================================================================
   Coach results — the slider
   ========================================================================== */

.erai-results { padding: 88px 24px; }

/* The heading and the arrows share the rail's parent, as the runtime drives it
   (eraapp funnel-runtime initRails): the arrows top right, the rail below. */
.erai-rail-frame {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  grid-template-areas: "head prev next" "rail rail rail";
  align-items: end;
  column-gap: 10px;
  row-gap: 40px;
}
.erai-rail-frame__head { grid-area: head; display: flex; flex-direction: column; gap: 14px; max-width: 760px; padding-right: 10px; }
.erai-rail-frame__head--wide { max-width: none; }
.erai-rail-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--erai-field-line);
  border-radius: 999px;
  background: var(--erai-card);
  color: var(--erai-text);
  cursor: pointer;
}
.erai-rail-arrow[aria-label="Scroll left"] { grid-area: prev; }
.erai-rail-arrow[aria-label="Scroll right"] { grid-area: next; }
.erai-rail-arrow:disabled { opacity: 0.4; cursor: default; }
.erai-rail-arrow svg { width: 20px; height: 20px; }
.erai-rail {
  grid-area: rail;
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 4px 2px 16px;
  scrollbar-width: thin;
}
.erai-rail > * { scroll-snap-align: start; }

.erai-coach {
  flex: 0 0 280px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 22px;
  border: 1px solid var(--erai-line);
  border-radius: 18px;
  background: var(--erai-card);
}
.erai-coach__who { display: flex; align-items: center; gap: 12px; }
.erai-coach__photo { flex-shrink: 0; width: 48px; height: 48px; border: 2px solid var(--erai-line); border-radius: 999px; overflow: hidden; }
.erai-coach__photo img { width: 100%; height: 100%; object-fit: cover; }
.erai-coach__id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.erai-coach__name { font-size: 16px; }
.erai-page .erai-coach__handle {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  color: var(--erai-body);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
}
.erai-page .erai-coach__handle:hover { color: var(--erai-text); }
.erai-ig {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: radial-gradient(circle at 30% 107%, #FDF497 0%, #FDF497 5%, #FD5949 45%, #D6249F 60%, #285AEB 90%);
}
.erai-coach__rule { height: 1px; background: var(--erai-line); }
.erai-coach__win { display: flex; flex-direction: column; gap: 4px; }
.erai-coach__result {
  font-family: 'Inter Tight', Inter, sans-serif;
  font-size: 28px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: var(--erai-green);
}
.erai-coach__per { font-size: 16px; color: var(--erai-body); }
.erai-coach__caption { color: var(--erai-body); font-size: 14px; }
.erai-disclaimer { font-size: 12px; color: var(--erai-faint); }

/* ==========================================================================
   Stats
   ========================================================================== */

.erai-stats { padding: 56px 24px 24px; }
.erai-stats__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; }
.erai-stat {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 26px 24px 24px;
  border: 1px solid rgba(34, 197, 94, 0.35);
  border-radius: 20px;
  background: var(--erai-card-alt);
  box-shadow: var(--erai-stat-shadow);
}
.erai-stat__bar { position: absolute; left: 0; top: 0; right: 0; height: 3px; background: #22C55E; }
.erai-stat--blue { border-color: rgba(59, 130, 246, 0.35); }
.erai-stat--blue .erai-stat__bar { background: #3B82F6; }
.erai-stat--cyan { border-color: rgba(6, 182, 212, 0.35); }
.erai-stat--cyan .erai-stat__bar { background: #06B6D4; }
.erai-stat--last { border-color: var(--erai-stat-line-4); }
.erai-stat__text { display: flex; flex-direction: column; gap: 10px; }
.erai-stat__value {
  font-family: 'Inter Tight', Inter, sans-serif;
  font-size: 44px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: -0.035em;
  color: var(--erai-ink);
}
.erai-stat__label { color: var(--erai-body-strong); font-size: 16px; font-weight: 500; line-height: 1.4; }

/* ==========================================================================
   Logo chips: the cancel strip and the Replaces boxes
   ========================================================================== */

.erai-cancel { padding: 24px 24px 72px; }
.erai-cancel__inner { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.erai-cancel__title { display: flex; align-items: center; justify-content: center; gap: 14px; }
.erai-cancel__title svg { flex-shrink: 0; width: 30px; height: 30px; }
.erai-cancel__label {
  font-family: 'Inter Tight', Inter, sans-serif;
  font-size: clamp(22px, 3vw, 34px);
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #DC2626;
  text-align: center;
}
.erai-cancel__title .text-container { text-align: center; }
.erai-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.erai-chips--center { justify-content: center; }

.erai-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px 5px 5px;
  border: 1px solid var(--erai-line);
  border-radius: 999px;
  font-size: 14px;
  color: var(--erai-body);
}
.erai-chip img { display: block; width: 24px; height: 24px; border-radius: 6px; background: #FFFFFF; }

.erai-replaces {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px 20px;
  border: 1px solid var(--erai-line);
  border-radius: 16px;
  background: var(--erai-card);
}
.erai-replaces__label { font-size: 12px; font-weight: 700; letter-spacing: 0.14em; color: var(--erai-faint); }
.erai-replaces .erai-chip {
  gap: 10px;
  padding: 6px 14px 6px 6px;
  border-color: var(--erai-field-line);
  background: var(--erai-field-bg);
  font-weight: 500;
  color: var(--erai-body-strong);
}
.erai-replaces .erai-chip img { width: 28px; height: 28px; border-radius: 7px; object-fit: cover; }

/* ==========================================================================
   The AI stack — the problem and the solution
   ========================================================================== */

.erai-stack { padding: 88px 24px; }
.erai-stack__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr));
  gap: 20px;
  align-items: stretch;
}
.erai-stack__fig { display: flex; flex-direction: column; gap: 16px; }
.erai-stack__cap { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.erai-stack__title { font-family: 'Inter Tight', Inter, sans-serif; font-size: 22px; font-weight: 700; letter-spacing: -0.01em; }
.erai-stack__img { border-radius: 20px; overflow: hidden; box-shadow: 0 30px 80px var(--erai-shadow); }
.erai-stack__img img { width: 100%; height: auto; }
.erai-tag {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
}
.erai-tag--red { background: #DC2626; }
.erai-tag--green { background: #15803D; }

/* The lead page's comparison is drawn for each row: on a dark row, Eric's dark pictures (by file name). */
body[data-template="erai-dark"] .erai-band-a .erai-stack__img img[src*="/images/erai/lead-aistack-laptop.jpg"] { content: url("../images/erai/lead-aistack-laptop-dark.jpg"); }
body[data-template="erai-dark"] .erai-band-a .erai-stack__img img[src*="/images/erai/lead-aistack-phone.jpg"] { content: url("../images/erai/lead-aistack-phone-dark.jpg"); }

/* ==========================================================================
   Acquire / Inspire / Empire
   ========================================================================== */

.erai-pillar { padding: 72px 24px; }
.erai-pillar--acquire {
  --p-tag: var(--erai-acq-tag); --p-tag-text: var(--erai-acq-tag-text); --p-label: var(--erai-acq-label);
  --p-card-top: var(--erai-acq-card-top); --p-card-bottom: var(--erai-acq-card-bottom); --p-card-line: var(--erai-acq-card-line);
  --p-title: var(--erai-acq-title); --p-row: var(--erai-acq-row); --p-row-line: var(--erai-acq-row-line);
  --p-icon-bg: var(--erai-acq-icon-bg); --p-icon: var(--erai-acq-icon); --p-step: var(--erai-acq-step);
  --p-loop: var(--erai-acq-loop); --p-repeat: var(--erai-acq-repeat);
  --p-last-row: var(--erai-win-row); --p-last-row-line: var(--erai-win-row-line);
  --p-last-icon-bg: var(--erai-win-icon-bg); --p-last-icon: var(--erai-win-icon); --p-last-step: var(--erai-win-step);
  --p-radius: 18px;
}
.erai-pillar--inspire {
  --p-tag: var(--erai-ins-tag); --p-tag-text: var(--erai-ins-tag-text); --p-label: var(--erai-ins-label);
  --p-card-top: var(--erai-ins-card-top); --p-card-bottom: var(--erai-ins-card-bottom); --p-card-line: var(--erai-ins-card-line);
  --p-title: var(--erai-ins-title); --p-row: var(--erai-ins-row); --p-row-line: var(--erai-ins-row-line);
  --p-icon-bg: var(--erai-ins-icon-bg); --p-icon: var(--erai-ins-icon); --p-step: var(--erai-ins-step);
  --p-loop: var(--erai-ins-loop); --p-repeat: var(--erai-ins-repeat);
  --p-last-row: var(--erai-ref-row); --p-last-row-line: var(--erai-ref-row-line);
  --p-last-icon-bg: var(--erai-ref-icon-bg); --p-last-icon: var(--erai-ref-icon); --p-last-step: var(--erai-ref-step);
  --p-radius: 22px;
}
.erai-pillar--empire {
  --p-tag: var(--erai-emp-tag); --p-tag-text: var(--erai-emp-tag-text); --p-label: var(--erai-emp-label);
  --p-card-top: var(--erai-emp-card-top); --p-card-bottom: var(--erai-emp-card-bottom); --p-card-line: var(--erai-emp-card-line);
  --p-title: var(--erai-emp-title); --p-row: var(--erai-emp-row); --p-row-line: var(--erai-emp-row-line);
  --p-icon-bg: var(--erai-emp-icon-bg); --p-icon: var(--erai-emp-icon); --p-step: var(--erai-emp-step);
  --p-loop: var(--erai-emp-loop); --p-repeat: var(--erai-emp-repeat);
  --p-last-row: var(--erai-win-row); --p-last-row-line: var(--erai-win-row-line);
  --p-last-icon-bg: var(--erai-win-icon-bg); --p-last-icon: var(--erai-win-icon); --p-last-step: var(--erai-win-step);
  --p-radius: 18px;
}
.erai-pillar__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr));
  gap: 48px;
  align-items: center;
}
.erai-pillar__main { display: flex; flex-direction: column; gap: 18px; }
.erai-pillar__tagrow { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.erai-pillar__tag {
  padding: 5px 10px;
  border-radius: 6px;
  background: var(--p-tag);
  color: var(--p-tag-text);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
}
.erai-pillar__label {
  font-family: 'Inter Tight', Inter, sans-serif;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--p-label);
}
.erai-pillar__h2 { font-size: clamp(30px, 3.4vw, 44px); line-height: 1.08; letter-spacing: -0.03em; }
.erai-pillar__img { border-radius: var(--p-radius); overflow: hidden; box-shadow: 0 30px 80px var(--erai-shadow); }
.erai-pillar__img img { width: 100%; height: auto; }

/* The step card: AI at every step, the last one looping back to the first. */
.erai-steps-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 28px;
  border: 1px solid var(--p-card-line);
  border-radius: 22px;
  background: linear-gradient(180deg, var(--p-card-top), var(--p-card-bottom));
}
.erai-steps-card__title {
  display: block;
  padding-bottom: 4px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1.35;
  text-align: center;
  color: var(--p-title);
}
.erai-steps { position: relative; display: flex; flex-direction: column; gap: 10px; padding-left: 40px; }
.erai-step {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--p-row-line);
  border-radius: 14px;
  background: var(--p-row);
}
.erai-step__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--p-icon-bg);
  color: var(--p-icon);
}
.erai-step__icon svg { width: 22px; height: 22px; }
.erai-step__text { display: flex; flex-direction: column; gap: 2px; }
.erai-step__label { font-size: 11px; font-weight: 800; letter-spacing: 0.16em; color: var(--p-step); }
.erai-step__desc { color: var(--erai-body); font-size: 14px; }
.erai-step--last { border-color: var(--p-last-row-line); background: var(--p-last-row); }
.erai-step--last .erai-step__icon { background: var(--p-last-icon-bg); color: var(--p-last-icon); }
.erai-step--last .erai-step__label { color: var(--p-last-step); }
/* The REPEAT loop: an arc from the last step back up to the first, an arrowhead, the word. */
.erai-steps__loop {
  position: absolute;
  left: 2px;
  top: 44px;
  bottom: 44px;
  width: 22px;
  border: 2px solid var(--p-loop);
  border-right: 0;
  border-radius: 14px 0 0 14px;
}
.erai-steps__loop::after {
  content: "";
  position: absolute;
  left: 18px;
  top: -9px;
  border-style: solid;
  border-width: 7px 0 7px 12px;
  border-color: transparent transparent transparent var(--p-loop);
}
.erai-steps__repeat {
  position: absolute;
  left: -12px;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.18em;
  color: var(--p-repeat);
}

/* ==========================================================================
   Education — the app is the system, mentorship is how you scale it
   ========================================================================== */

.erai-edu { padding: 88px 24px; }
.erai-edu__tagrow { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.erai-edu__tag {
  padding: 5px 10px;
  border-radius: 6px;
  background: #1D4ED8;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
}
.erai-edu__label { font-size: 14px; font-weight: 600; color: var(--erai-body-strong); }
.erai-edu__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; }
.erai-edu-card {
  --c: #7C3AED; --c-tint: #EDE9FE; --c-ink: #5B21B6;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 24px;
  border: 1px solid var(--erai-line);
  border-radius: 18px;
  background: var(--erai-card);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
}
.erai-edu-card--green { --c: #15803D; --c-tint: #DCFCE7; --c-ink: #166534; }
.erai-edu-card--blue { --c: #2563EB; --c-tint: #DBEAFE; --c-ink: #1E40AF; }
.erai-edu-card__bar { display: block; height: 4px; border-radius: 4px; background: var(--c); }
.erai-edu-card__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.erai-edu-card__step {
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--c);
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.erai-edu-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: var(--c-tint);
  color: var(--c-ink);
}
.erai-edu-card__icon svg { width: 20px; height: 20px; }
.erai-edu-card h3 { font-size: 21px; line-height: 1.2; letter-spacing: -0.01em; }
.erai-edu-card p { color: var(--erai-body); font-size: 15px; }

.erai-team {
  display: flex;
  flex-direction: column;
  gap: 32px;
  padding: clamp(24px, 4vw, 40px);
  border: 1px solid var(--erai-line);
  border-radius: 22px;
  background: var(--erai-card);
}
.erai-team__head { display: flex; flex-wrap: wrap; gap: 20px; justify-content: space-between; align-items: flex-end; }
.erai-team__intro { display: flex; flex-direction: column; gap: 10px; max-width: 640px; }
.erai-team__intro h3 { font-size: 30px; line-height: 1.15; letter-spacing: -0.02em; }
.erai-team__intro p { color: var(--erai-body); }
.erai-team__layers { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 20px; }
.erai-layer {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px;
  border: 1px solid var(--erai-field-line);
  border-radius: 18px;
  background: var(--erai-field-bg);
}
.erai-layer__head { display: flex; flex-direction: column; gap: 4px; }
.erai-layer__label { font-size: 13px; font-weight: 800; letter-spacing: 0.14em; color: var(--erai-green); }
.erai-layer__title { font-size: 18px; font-weight: 700; }

/* A list led by green checks (each item's words editable). */
.erai-checks { display: flex; flex-direction: column; gap: 12px; padding: 0; list-style: none; }
.erai-checks > li { display: flex; gap: 12px; }
.erai-checks > li > svg { flex-shrink: 0; width: 20px; height: 20px; margin-top: 3px; color: var(--erai-check); }

/* ==========================================================================
   Paths — three ways to start
   ========================================================================== */

.erai-paths { padding: 88px 24px; }
.erai-paths__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; align-items: stretch; }
.erai-path {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 30px;
  border: 2px solid #3B82F6;
  border-radius: 20px;
  background: var(--erai-card);
}
.erai-path--green { border-color: #22C55E; }
.erai-path--featured {
  border: 1px solid #2B4A9A;
  background: linear-gradient(180deg, #152447, #0E1424);
  color: #FFFFFF;
}
.erai-path h3 { font-family: Inter, system-ui, sans-serif; font-size: 22px; }
.erai-path p { color: var(--erai-body); }
.erai-path ul { display: flex; flex-direction: column; gap: 6px; padding: 0 0 0 18px; color: var(--erai-body-strong); font-size: 15px; }
.erai-path--featured p { color: #BFDBFE; }
.erai-path--featured ul { color: #E4E4E7; }
.erai-path__cta { margin-top: auto; }
/* Two classes deep: the editor's own sheet makes every text container `position: relative`. */
.erai-path .erai-path__badge-wrap { position: absolute; top: -12px; left: 30px; }
.erai-path__badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  background: #2563EB;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

/* ==========================================================================
   The mid-CTA band, the founder
   ========================================================================== */

.erai-midcta { padding: 72px 24px; }
.erai-midcta__box {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  padding: 36px;
  border: 1px solid #3B82F6;
  border-radius: 22px;
  background: linear-gradient(120deg, #2563EB, #1D4ED8 55%, #1E40AF);
  color: #FFFFFF;
}
.erai-midcta__copy { display: flex; flex-direction: column; gap: 6px; max-width: 640px; }
.erai-midcta__copy h2 { font-size: 28px; letter-spacing: -0.02em; }
.erai-midcta__copy p { color: #EFF6FF; }

.erai-founder { padding: 88px 24px; }
.erai-founder__inner { max-width: 900px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
.erai-founder__h2 { font-size: clamp(30px, 3.6vw, 46px); line-height: 1.08; letter-spacing: -0.03em; }
.erai-founder__lead { color: var(--erai-body-strong); font-size: 19px; line-height: 1.65; }
.erai-founder__more { color: var(--erai-body); font-size: 17px; line-height: 1.65; }
.erai-founder__sign { display: flex; flex-direction: column; gap: 2px; padding-top: 8px; }
.erai-founder__sign strong { font-size: 17px; }
.erai-founder__sign span { color: var(--erai-body); font-size: 14px; }

/* ==========================================================================
   FAQ — era-react's accordion (era-funnel.css collapses it, the runtime opens
   an item), drawn as Eric's: hairlines, and a "+" that turns when open.
   ========================================================================== */

.erai-faq { padding: 88px 24px; }
.erai-faq__inner { max-width: 860px; margin: 0 auto; display: flex; flex-direction: column; gap: 28px; }
.erai-faq__h2 { font-size: clamp(30px, 3.6vw, 44px); letter-spacing: -0.03em; }
.erai-faq .faq_container { display: flex; flex-direction: column; border-top: 1px solid var(--erai-line); }
.erai-faq .faq_item { padding: 20px 0; border-bottom: 1px solid var(--erai-line); }
.erai-faq .faq_heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.erai-faq .faq_heading:hover { opacity: 1; }
.erai-faq .faq_heading h3 { font-family: Inter, system-ui, sans-serif; font-size: 18px; font-weight: 600; line-height: 1.55; }
.erai-faq .faq_heading::after {
  content: "+";
  flex-shrink: 0;
  color: var(--erai-faint);
  font-size: 18px;
  line-height: 1.55;
  transition: transform 0.2s;
}
.erai-faq .faq_item.open .faq_heading::after { transform: rotate(45deg); }
.erai-faq .faq_content_inner p { margin-top: 12px; color: var(--erai-body); }

/* ==========================================================================
   The final CTA
   ========================================================================== */

.erai-final { padding: 88px 24px; }
.erai-final__box {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: clamp(36px, 6vw, 72px);
  border: 1px solid #2B3A66;
  border-radius: 28px;
  background: radial-gradient(700px 360px at 50% 0%, rgba(37, 99, 235, 0.45), rgba(17, 17, 21, 1) 75%);
  color: #FFFFFF;
  text-align: center;
}
.erai-final__box > .text-container > h2 { max-width: 820px; font-size: clamp(32px, 4.6vw, 58px); line-height: 1.04; letter-spacing: -0.035em; }
.erai-final__box > .text-container > p { max-width: 620px; color: #C7D2FE; font-size: 18px; }
.erai-final__box .erai-accent { color: #93C5FD; }
/* The lead page's: a blue and a green glow on near-black. */
.erai-final__box--lead {
  border-color: rgba(96, 165, 250, 0.22);
  background:
    radial-gradient(700px 320px at 0% 0%, rgba(37, 99, 235, 0.32), rgba(37, 99, 235, 0) 70%),
    radial-gradient(600px 300px at 100% 100%, rgba(34, 197, 94, 0.16), rgba(34, 197, 94, 0) 70%),
    #0E121A;
  box-shadow: 0 30px 80px rgba(2, 6, 23, 0.35);
}
.erai-final__box--lead > .text-container > h2 { max-width: 1000px; }
.erai-final__box--lead > .text-container > p { color: #A1A1AA; }

/* ==========================================================================
   Confirmations (the Thank You pages): a card on the hero's ground
   ========================================================================== */

.erai-confirm { flex: 1 0 auto; padding: 96px 24px 112px; }
.erai-confirm__card {
  max-width: 680px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: clamp(32px, 5vw, 56px);
  border: 1px solid var(--erai-form-line);
  border-radius: 22px;
  background: var(--erai-card);
  box-shadow: 0 30px 80px var(--erai-shadow-strong);
  text-align: center;
}
.erai-confirm__check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 999px;
  background: var(--erai-badge-bg);
  color: var(--erai-badge-text);
}
.erai-confirm__check svg { width: 30px; height: 30px; }
.erai-confirm__card h1 { font-size: clamp(32px, 4vw, 48px); font-weight: 800; line-height: 1.08; letter-spacing: -0.03em; color: var(--erai-ink); }
.erai-confirm__card p { color: var(--erai-body); font-size: 18px; }

/* A thank-you's call to action: the mid-CTA's blue band, its headline's second line in light blue. */
.erai-midcta__copy h2 .erai-accent-light { color: #BFDBFE; }