/* ==========================================================================
   File:    acxpa-subscriber-onboarding.css (acxs-)
   Version  1.3.0 — 12 Oct 2026 (step 4 form rules moved to acxpa-email-preferences.css)
            1.2.1 — 9 Oct 2026 (step 4: the whole topic tile ticks the box; step 3 match note colours)
            1.2.0 — 6 Oct 2026 (1.2: /subscribe/ rebuilt on this frame, form 74
            inside the hero, Free-vs-Member table; replaces 86073's page CSS box)
            1.1.0 — 5 Oct 2026 (live Roundtable countdowns, full-page
            loader for the sign-up forms, no text-wrap: balance on headings)
   Scope:   The free Subscriber sign-up and welcome journey:
              /subscriber-validation/      86109  step 2  check your email
              /validate-email-address/     86081  step 3  create password (sub-validate.php)
              /subscriber-registration/    91863  step 4  preferences (Gravity Form 75)
              /welcome-subscriber/         86090  step 5  welcome
              /welcome-back-subscribers/   86096  login landing
              /subscribe/                  86073  step 1  sign up (form 74)
   Owns:    .acxs and everything prefixed acxs-, plus #gform_74 (in aside.acxs-formCard).
            #gform_75 (91863) is styled in acxpa-email-preferences.css with the member form (12 Oct 2026).
            Replaces the page Custom CSS boxes on 86073, 86090, 86096, 86109 and 91863
            and the .validate-sub button rules that lived in custom.css.
   Enqueue: mu-plugins/acxpa-subscriber-onboarding.php, only on the pages above,
            after acxpa-ds-tokens and child-style so it wins at equal specificity.
   Rules:   Tokens only (acxpa-tokens.css v1.5.0); no hex, no rgb literals.
            Cool temperature: Cloud / White / Harbour / Teal surfaces; no Sand.
            Gold is the action colour (Ink on Gold 8.49:1). No max-width on text.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Shell
   -------------------------------------------------------------------------- */
div.acxs {
  font-family: var(--acxpa-ds-font);
  font-size: var(--acxpa-ds-text-body);
  line-height: var(--acxpa-ds-leading-body);
  color: var(--acxpa-ds-ink);
  -webkit-font-smoothing: antialiased;
  margin: 0 0 var(--acxpa-ds-space-2xl);
  padding-top: var(--acxpa-ds-space-xl);
}
/* A page split over several WPBakery rows: the head block keeps the top
   padding, the blocks that follow it don't, so the rhythm stays even */
div.acxs.acxs--head { margin-bottom: 0; }
div.acxs.acxs--cont { padding-top: 0 !important; }
div.acxs *, div.acxs *::before, div.acxs *::after { box-sizing: border-box; }
div.acxs p { margin: 0; }
div.acxs a { text-decoration: none; }
div.acxs ul { margin: 0; padding: 0; list-style: none; }

div.acxs h1.acxs-h1,
div.acxs h2.acxs-h2,
div.acxs h3.acxs-h3 {
  font-family: var(--acxpa-ds-font) !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}
div.acxs h1.acxs-h1 {
  font-size: var(--acxpa-ds-text-h1) !important;
  line-height: var(--acxpa-ds-leading-tight) !important;
  font-weight: 800 !important;
  color: var(--acxpa-ds-teal-800) !important;
  margin: 0 0 var(--acxpa-ds-space-md) !important;
}
div.acxs h2.acxs-h2 {
  font-size: var(--acxpa-ds-text-h2) !important;
  line-height: var(--acxpa-ds-leading-tight) !important;
  font-weight: 800 !important;
  color: var(--acxpa-ds-teal-800) !important;
  margin: 0 0 var(--acxpa-ds-space-xs) !important;
}
div.acxs h3.acxs-h3 {
  font-size: var(--acxpa-ds-text-h4) !important;
  line-height: var(--acxpa-ds-leading-snug) !important;
  font-weight: 700 !important;
  color: var(--acxpa-ds-ink) !important;
  margin: 0 0 var(--acxpa-ds-space-2xs) !important;
}
p.acxs-eyebrow {
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--acxpa-ds-harbour);
  margin: 0 0 var(--acxpa-ds-space-sm) !important;
}
p.acxs-lede {
  font-size: var(--acxpa-ds-text-lead);
  line-height: var(--acxpa-ds-leading-snug);
  color: var(--acxpa-ds-ink);
}
p.acxs-lede + p.acxs-lede { margin-top: var(--acxpa-ds-space-sm) !important; }
p.acxs-sectionLede {
  font-size: var(--acxpa-ds-text-body);
  color: var(--acxpa-ds-slate);
}
div.acxs-sectionHead { margin: 0 0 var(--acxpa-ds-space-lg); }
div.acxs a.acxs-inline { color: var(--acxpa-ds-teal-600); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
div.acxs a.acxs-inline:hover { color: var(--acxpa-ds-gold-deep); }

/* Buttons (R-E1): Gold is the action, white secondary, one hover colour */
div.acxs a.acxs-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 26px;
  border-radius: var(--acxpa-ds-radius-pill);
  border: 2px solid transparent;
  font-size: var(--acxpa-ds-text-body);
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
div.acxs a.acxs-btn--cta { background: var(--acxpa-ds-gold); border-color: var(--acxpa-ds-gold); color: var(--acxpa-ds-ink); box-shadow: var(--acxpa-ds-shadow-md); }
div.acxs a.acxs-btn--secondary { background: var(--acxpa-ds-white); border-color: var(--acxpa-ds-teal-700); color: var(--acxpa-ds-teal-700); }
div.acxs a.acxs-btn--onDark { background: transparent; border-color: var(--acxpa-ds-white); color: var(--acxpa-ds-white); }
div.acxs a.acxs-btn:hover,
div.acxs a.acxs-btn:focus-visible {
  background: var(--acxpa-ds-gold-deep);
  border-color: var(--acxpa-ds-gold-deep);
  color: var(--acxpa-ds-white);
  transform: translateY(-1px);
}
div.acxs a.acxs-btn:focus-visible,
div.acxs a.acxs-tile:focus-visible { outline: 3px solid var(--acxpa-ds-focus); outline-offset: 3px; }
div.acxs-actions { display: flex; flex-wrap: wrap; gap: var(--acxpa-ds-space-sm); align-items: center; }

/* Icon chips (Font Awesome 5, loaded site-wide) */
span.acxs-ico {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--acxpa-ds-radius-lg);
  background: var(--acxpa-ds-harbour-tint);
  color: var(--acxpa-ds-harbour-deep);
  font-size: 20px;
}
span.acxs-ico--teal { background: var(--acxpa-ds-teal-50); color: var(--acxpa-ds-teal-700); border: 1px solid var(--acxpa-ds-teal-100); }
span.acxs-ico--white { background: var(--acxpa-ds-white); color: var(--acxpa-ds-harbour-deep); }

/* --------------------------------------------------------------------------
   Progress steps (steps 2-4)
   -------------------------------------------------------------------------- */
ol.acxs-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--acxpa-ds-space-xs);
  margin: 0 0 var(--acxpa-ds-space-lg) !important;
  padding: 0 !important;
  list-style: none !important;
  counter-reset: acxs-step;
}
ol.acxs-steps li {
  counter-increment: acxs-step;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
  padding: 12px 14px;
  border-radius: var(--acxpa-ds-radius-md);
  background: var(--acxpa-ds-cloud);
  border: 1px solid var(--acxpa-ds-teal-100);
  font-size: var(--acxpa-ds-text-small);
  font-weight: 600;
  line-height: 1.3;
  color: var(--acxpa-ds-slate);
  list-style: none !important;
}
ol.acxs-steps li::before {
  content: counter(acxs-step);
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--acxpa-ds-white);
  border: 2px solid var(--acxpa-ds-teal-200);
  color: var(--acxpa-ds-slate);
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
}
ol.acxs-steps li.is-done { color: var(--acxpa-ds-success-deep); background: var(--acxpa-ds-success-tint); border-color: var(--acxpa-ds-success-tint); }
ol.acxs-steps li.is-done::before {
  content: "\f00c";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  background: var(--acxpa-ds-success);
  border-color: var(--acxpa-ds-success);
  color: var(--acxpa-ds-white);
}
ol.acxs-steps li.is-current { color: var(--acxpa-ds-white); background: var(--acxpa-ds-harbour); border-color: var(--acxpa-ds-harbour); }
ol.acxs-steps li.is-current::before { background: var(--acxpa-ds-white); border-color: var(--acxpa-ds-white); color: var(--acxpa-ds-harbour-deep); }

/* --------------------------------------------------------------------------
   Hero (light, cool: Cloud panel, Harbour top rule)
   -------------------------------------------------------------------------- */
header.acxs-hero {
  margin: 0 0 var(--acxpa-ds-space-xl);
  padding: 44px 40px;
  border-radius: var(--acxpa-ds-radius-xl);
  border: 1px solid var(--acxpa-ds-teal-100);
  border-top: 5px solid var(--acxpa-ds-harbour);
  background: var(--acxpa-ds-cloud);
}
div.acxs-heroGrid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 40px;
  align-items: center;
}
div.acxs-heroGrid--single { grid-template-columns: minmax(0, 1fr); }
div.acxs-heroCopy div.acxs-actions { margin-top: var(--acxpa-ds-space-lg); }

/* "What's included" card in the hero */
aside.acxs-incl {
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-100);
  border-radius: var(--acxpa-ds-radius-lg);
  box-shadow: var(--acxpa-ds-shadow-md);
  padding: 24px 26px;
}
div.acxs-inclHead {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 var(--acxpa-ds-space-md);
  padding: 0 0 var(--acxpa-ds-space-md);
  border-bottom: 1px solid var(--acxpa-ds-teal-100);
}
div.acxs img.acxs-badge { flex: none; width: 140px; height: 140px; margin: 0; }
div.acxs-inclHead p.acxs-inclTitle { flex-wrap: wrap; margin: 0 !important; }
p.acxs-inclTitle {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--acxpa-ds-harbour-deep);
  margin: 0 0 var(--acxpa-ds-space-sm) !important;
}
p.acxs-inclTitle span.acxs-pill {
  letter-spacing: normal;
  text-transform: none;
}
span.acxs-pill {
  display: inline-block;
  padding: 3px 10px;
  border-radius: var(--acxpa-ds-radius-pill);
  background: var(--acxpa-ds-success-tint);
  color: var(--acxpa-ds-success-deep);
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
}
ul.acxs-ticks li {
  position: relative;
  padding: 0 0 0 30px;
  margin: 0 0 10px !important;
  list-style: none !important;
  font-size: var(--acxpa-ds-text-body);
  line-height: var(--acxpa-ds-leading-snug);
  color: var(--acxpa-ds-ink);
}
ul.acxs-ticks li:last-child { margin-bottom: 0 !important; }
ul.acxs-ticks li::before {
  content: "\f00c";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  left: 0;
  top: 1px;
  color: var(--acxpa-ds-success);
}

/* Information note (Harbour tint, Ink text) */
div.acxs-note {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin: 0 0 var(--acxpa-ds-space-xl);
  padding: 20px 22px;
  border-radius: var(--acxpa-ds-radius-lg);
  background: var(--acxpa-ds-harbour-tint);
  color: var(--acxpa-ds-ink);
}
div.acxs-note p + p { margin-top: 4px !important; }
div.acxs-note strong { color: var(--acxpa-ds-harbour-deep); }
div.acxs-note span.acxs-ico { width: 40px; height: 40px; font-size: 17px; }

/* --------------------------------------------------------------------------
   Sections and tile grids
   -------------------------------------------------------------------------- */
section.acxs-section { margin: 0 0 var(--acxpa-ds-space-xl); }
section.acxs-section--cloud {
  padding: 36px 36px 40px;
  border-radius: var(--acxpa-ds-radius-xl);
  background: var(--acxpa-ds-cloud);
  border: 1px solid var(--acxpa-ds-teal-100);
}
div.acxs-grid { display: grid; gap: 18px; }
div.acxs-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
div.acxs-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
div.acxs-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

div.acxs .acxs-tile {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  padding: 22px 22px 20px;
  border-radius: var(--acxpa-ds-radius-lg);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-100);
  box-shadow: var(--acxpa-ds-shadow-sm);
  color: var(--acxpa-ds-ink);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
div.acxs a.acxs-tile:hover {
  transform: translateY(-2px);
  box-shadow: var(--acxpa-ds-shadow-lg);
  border-color: var(--acxpa-ds-teal-300);
}
div.acxs .acxs-tile p {
  font-size: var(--acxpa-ds-text-small);
  line-height: var(--acxpa-ds-leading-body);
  color: var(--acxpa-ds-slate);
}
div.acxs a.acxs-tile span.acxs-go {
  margin-top: auto;
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  color: var(--acxpa-ds-teal-600);
}
div.acxs a.acxs-tile:hover span.acxs-go { color: var(--acxpa-ds-gold-deep); }
div.acxs a.acxs-tile span.acxs-go i { margin-left: 4px; font-size: 0.85em; }

/* Row tiles (icon beside text) for the smaller tools grid */
div.acxs .acxs-tile--row { flex-direction: row; align-items: flex-start; gap: 16px; }
div.acxs .acxs-tile--row div.acxs-tileBody { flex: 1; align-self: stretch; display: flex; flex-direction: column; gap: 4px; }
div.acxs .acxs-tile--row span.acxs-go { padding-top: 6px; }

/* --------------------------------------------------------------------------
   Roundtables band (Harbour Deep, the one dark surface)
   -------------------------------------------------------------------------- */
section.acxs-rt {
  margin: 0 0 var(--acxpa-ds-space-xl);
  padding: 40px 40px 36px;
  border-radius: var(--acxpa-ds-radius-xl);
  background: var(--acxpa-ds-harbour-deep);
  color: var(--acxpa-ds-white);
}
section.acxs-rt p.acxs-eyebrow { color: var(--acxpa-ds-gold); }
div.acxs section.acxs-rt h2.acxs-h2 { color: var(--acxpa-ds-white) !important; }
section.acxs-rt p.acxs-sectionLede { color: var(--acxpa-ds-harbour-tint); }
div.acxs-rtCard {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  padding: 24px;
  border-radius: var(--acxpa-ds-radius-lg);
  background: var(--acxpa-ds-harbour);
  border: 1px solid color-mix(in srgb, var(--acxpa-ds-white) 18%, transparent);
}
div.acxs section.acxs-rt div.acxs-rtCard h3.acxs-h3 { color: var(--acxpa-ds-white) !important; font-size: var(--acxpa-ds-text-h3) !important; }
div.acxs-rtCard p { color: var(--acxpa-ds-harbour-tint); }
div.acxs-rtCard div.acxs-actions { margin-top: auto; padding-top: 6px; }
div.acxs-rtTop { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
span.acxs-rtBadge {
  display: inline-block;
  padding: 4px 12px;
  border-radius: var(--acxpa-ds-radius-pill);
  background: var(--acxpa-ds-gold);
  color: var(--acxpa-ds-ink);
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
}
div.acxs-rtMore {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px 28px;
  margin-top: 22px;
  padding: 22px 24px;
  border-radius: var(--acxpa-ds-radius-lg);
  background: var(--acxpa-ds-white);
  color: var(--acxpa-ds-ink);
}
div.acxs-rtMore > div { flex: 1 1 420px; }
div.acxs-rtMore p.acxs-rtMoreTitle { font-weight: 700; color: var(--acxpa-ds-harbour-deep); margin: 0 0 6px !important; }
div.acxs-rtMore ul.acxs-ticks { display: flex; flex-wrap: wrap; gap: 6px 24px; }
div.acxs-rtMore ul.acxs-ticks li { margin: 0 !important; font-size: var(--acxpa-ds-text-small); }

/* --------------------------------------------------------------------------
   Upgrade panel (white, Gold action)
   -------------------------------------------------------------------------- */
section.acxs-up {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 32px;
  align-items: center;
  margin: 0 0 var(--acxpa-ds-space-xl);
  padding: 36px 40px;
  border-radius: var(--acxpa-ds-radius-xl);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-200);
  border-left: 6px solid var(--acxpa-ds-gold);
  box-shadow: var(--acxpa-ds-shadow-md);
}
section.acxs-up ul.acxs-ticks { margin-top: var(--acxpa-ds-space-md) !important; }
div.acxs-upSide { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
div.acxs-upSide a.acxs-btn { width: 100%; }
p.acxs-upNote { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); text-align: center; }

/* Former member: who managed your previous access */
div.acxs-contact {
  margin: var(--acxpa-ds-space-md) 0 0;
  padding: 16px 18px;
  border-radius: var(--acxpa-ds-radius-md);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-100);
  font-size: var(--acxpa-ds-text-small);
}
div.acxs-contact p + p { margin-top: 4px !important; }
div.acxs-contact a { color: var(--acxpa-ds-teal-600); font-weight: 600; text-decoration: underline; }

/* --------------------------------------------------------------------------
   Step 2: check your email
   -------------------------------------------------------------------------- */
p.acxs-sentTo {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: var(--acxpa-ds-space-md) !important;
  padding: 10px 16px;
  border-radius: var(--acxpa-ds-radius-pill);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-200);
  font-size: var(--acxpa-ds-text-body);
  color: var(--acxpa-ds-ink);
  overflow-wrap: anywhere;
}
p.acxs-sentTo i { color: var(--acxpa-ds-harbour); }
ol.acxs-next { margin: 0 !important; padding: 0 !important; list-style: none !important; counter-reset: acxs-next; }
ol.acxs-next li {
  counter-increment: acxs-next;
  position: relative;
  padding: 0 0 0 44px;
  margin: 0 0 16px !important;
  list-style: none !important;
}
ol.acxs-next li:last-child { margin-bottom: 0 !important; }
ol.acxs-next li::before {
  content: counter(acxs-next);
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--acxpa-ds-harbour);
  color: var(--acxpa-ds-white);
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
ol.acxs-next li strong { display: block; color: var(--acxpa-ds-ink); }
ol.acxs-next li span { color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }

/* --------------------------------------------------------------------------
   Step 3: create password (page-templates/sub-validate.php)
   -------------------------------------------------------------------------- */
form.acxs-pwForm {
  margin: 0;
  padding: 32px 36px;
  border-radius: var(--acxpa-ds-radius-xl);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-200);
  box-shadow: var(--acxpa-ds-shadow-md);
}
div.acxs-pwGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; }
div.acxs-field label {
  display: block;
  margin: 0 0 6px !important;
  font-size: var(--acxpa-ds-text-body);
  font-weight: 700;
  color: var(--acxpa-ds-ink);
}
div.acxs input.acxs-input {
  width: 100%;
  height: auto !important;
  padding: 12px 14px !important;
  border: 1px solid var(--acxpa-ds-teal-300) !important;
  border-radius: var(--acxpa-ds-radius-md) !important;
  background: var(--acxpa-ds-white) !important;
  color: var(--acxpa-ds-ink) !important;
  font-family: var(--acxpa-ds-font);
  font-size: var(--acxpa-ds-text-body) !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
}
div.acxs input.acxs-input:focus {
  outline: none;
  border-color: var(--acxpa-ds-teal-700) !important;
  box-shadow: 0 0 0 3px var(--acxpa-ds-teal-100) !important;
}
p.acxs-hint { margin-top: 6px !important; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
p.acxs-hint:empty { display: none; }
p.acxs-hint.is-ok { color: var(--acxpa-ds-success-deep); font-weight: 600; }
p.acxs-hint.is-bad { color: var(--acxpa-ds-error); font-weight: 600; }
/* footer.php writes the match result with an inline red/green; map it to the status tokens */
div.acxs p#CheckPasswordMatch[style*="red"] { color: var(--acxpa-ds-error-deep) !important; font-weight: 600; }
div.acxs p#CheckPasswordMatch[style*="green"] { color: var(--acxpa-ds-success-deep) !important; font-weight: 600; }
label.acxs-show {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  margin: 16px 0 0 !important;
  font-size: var(--acxpa-ds-text-small);
  font-weight: 600;
  color: var(--acxpa-ds-slate);
  cursor: pointer;
}
label.acxs-show input { width: 18px; height: 18px; margin: 0; accent-color: var(--acxpa-ds-teal-700); }
div.acxs-error {
  margin: 20px 0 0;
  padding: 12px 16px;
  border-radius: var(--acxpa-ds-radius-md);
  background: var(--acxpa-ds-error-tint);
  color: var(--acxpa-ds-error-deep);
  font-weight: 600;
}
div.acxs-pwFoot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--acxpa-ds-teal-100);
}
div.acxs-pwFoot p { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
div.acxs button.acxs-submit {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 14px 30px !important;
  border-radius: var(--acxpa-ds-radius-pill) !important;
  border: 2px solid var(--acxpa-ds-gold) !important;
  background: var(--acxpa-ds-gold) !important;
  color: var(--acxpa-ds-ink) !important;
  font-family: var(--acxpa-ds-font) !important;
  font-size: var(--acxpa-ds-text-body) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  box-shadow: var(--acxpa-ds-shadow-md) !important;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
div.acxs button.acxs-submit:hover,
div.acxs button.acxs-submit:focus-visible {
  background: var(--acxpa-ds-gold-deep) !important;
  border-color: var(--acxpa-ds-gold-deep) !important;
  color: var(--acxpa-ds-white) !important;
  transform: translateY(-1px);
}

/* --------------------------------------------------------------------------
   Step 4: preferences (Gravity Form 75 on 91863)
   The menu is hidden on this page (customizer.css), so the header row
   collapsed to 47px (it takes its height from the menu) and the logo's
   -6px top margin pushed it up under the top bar. Restore the 88px row.
   -------------------------------------------------------------------------- */
body.page-id-91863 .kleo-main-header > .container { min-height: 88px; align-items: center; }
body.page-id-91863 .kleo-main-header #logo_img { margin-top: 0; }
body.page-id-91863 .kleo-main-header .navbar-toggle { display: none !important; } /* opens a menu that is hidden on this step */

/* The form itself (#gform_75) is styled in css/acxpa-email-preferences.css, shared with the member form (#gform_57). */

/* Reassurance line under the form */
p.acxs-reassure {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: var(--acxpa-ds-space-lg) 0 var(--acxpa-ds-space-xl) !important;
  font-size: var(--acxpa-ds-text-small);
  color: var(--acxpa-ds-slate);
  text-align: center;
}
p.acxs-reassure i { color: var(--acxpa-ds-success); }

/* --------------------------------------------------------------------------
   Live Roundtable countdowns (js/acxpa-subscriber-onboarding.js reads the
   schedule from window.ACXPA_SESSIONS, printed by acxpa-live-sessions.php)
   -------------------------------------------------------------------------- */
div.acxs-cd {
  padding: 14px 16px;
  border-radius: var(--acxpa-ds-radius-md);
  background: var(--acxpa-ds-harbour-deep);
  border: 1px solid color-mix(in srgb, var(--acxpa-ds-white) 14%, transparent);
}
div.acxs-cd[hidden] { display: none; }
div.acxs-rtCard p.acxs-cdLabel {
  margin: 0 0 8px !important;
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--acxpa-ds-gold);
}
div.acxs-cdUnits { display: flex; gap: 8px; }
span.acxs-cdUnit {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 4px;
  border-radius: var(--acxpa-ds-radius-sm);
  background: var(--acxpa-ds-white);
}
span.acxs-cdNum {
  font-size: var(--acxpa-ds-text-h3);
  font-weight: 800;
  line-height: 1.1;
  color: var(--acxpa-ds-harbour-deep);
  font-variant-numeric: tabular-nums;
}
span.acxs-cdLbl { font-size: var(--acxpa-ds-text-caption); font-weight: 600; color: var(--acxpa-ds-slate); }
div.acxs-rtCard p.acxs-cdWhen { margin: 8px 0 0 !important; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-white); }
span.acxs-cdLive {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  border-radius: var(--acxpa-ds-radius-pill);
  background: var(--acxpa-ds-live);
  color: var(--acxpa-ds-white);
  font-weight: 800;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
  animation: acxsLivePulse 1.2s ease-in-out infinite;
}
span.acxs-cdLive::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--acxpa-ds-white); }
@keyframes acxsLivePulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--acxpa-ds-live) 60%, transparent); }
  50% { box-shadow: 0 0 0 10px color-mix(in srgb, var(--acxpa-ds-live) 0%, transparent); }
}
div.acxs-rtCard[data-live="true"] { border-color: var(--acxpa-ds-live); }
div.acxs a.acxs-rtCal {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--acxpa-ds-text-small);
  font-weight: 600;
  color: var(--acxpa-ds-white);
  text-decoration: underline;
  text-underline-offset: 3px;
}
div.acxs a.acxs-rtCal:hover { color: var(--acxpa-ds-gold); }
@media (prefers-reduced-motion: reduce) { span.acxs-cdLive { animation: none; } }

/* --------------------------------------------------------------------------
   Full-page loader for the slow sign-up submits (form 74, the password
   step and form 75).
   The markup is printed by mu-plugins/acxpa-subscriber-onboarding.php.
   -------------------------------------------------------------------------- */
div.acxs-loading {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: color-mix(in srgb, var(--acxpa-ds-ink) 55%, transparent);
}
div.acxs-loading.is-on { display: flex; }
div.acxs-loadingCard {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  width: 100%;
  max-width: 360px;
  padding: 28px 24px;
  border-radius: var(--acxpa-ds-radius-xl);
  background: var(--acxpa-ds-white);
  box-shadow: var(--acxpa-ds-shadow-lg);
  text-align: center;
  font-family: var(--acxpa-ds-font);
}
div.acxs-loadingCard img { width: 88px; height: 88px; }
div.acxs-loadingCard p { margin: 0; font-size: var(--acxpa-ds-text-body); font-weight: 700; color: var(--acxpa-ds-ink); }
div.acxs-loadingCard span { font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
/* the overlay replaces Gravity Forms' small in-button spinner */
body.page-id-86073 #gform_74 .gform-loader,
body.page-id-86073 #gform_74 .gform_ajax_spinner,
body.page-id-91863 #gform_75 .gform-loader,
body.page-id-91863 #gform_75 .gform_ajax_spinner { display: none !important; }

/* --------------------------------------------------------------------------
   Step 1: /subscribe/ (86073) — sign-up page, form 74 inside the hero
   Replaces the page Custom CSS box on 86073 (#acxpa-subscribe, #gform_wrapper_74).
   Surfaces: Cloud hero + white form card, white steps bar, white tiles,
   Harbour Deep Roundtables band, white Free-vs-Member table with a Gold
   member column, Cloud FAQ. Tier colours per the 13 Sep 2026 rule:
   Subscriber = Cloud, the tier being sold = Gold (Ink on Gold Tint, R-B22).
   -------------------------------------------------------------------------- */
div.acxs.acxs-sub { padding-top: var(--acxpa-ds-space-lg); }
div.acxs-sub div.acxs-subGrid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; gap: 44px; }
div.acxs-sub header.acxs-subHero { padding: 44px 40px 44px; }
div.acxs-sub ul.acxs-subTicks { margin-top: var(--acxpa-ds-space-lg) !important; }
div.acxs-sub ul.acxs-subTicks li { margin-bottom: 12px !important; }
div.acxs-sub ul.acxs-subTicks li strong { color: var(--acxpa-ds-teal-800); }
div.acxs-sub .acxs-centre { justify-content: center; margin-top: var(--acxpa-ds-space-lg); }
p.acxs-eyebrow.acxs-eyebrow--gold { color: var(--acxpa-ds-gold-deep); }
p.acxs-subMeta { margin-top: var(--acxpa-ds-space-md) !important; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }
span.acxs-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Form card */
aside.acxs-formCard {
  scroll-margin-top: 200px;
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-200);
  border-top: 5px solid var(--acxpa-ds-gold);
  border-radius: var(--acxpa-ds-radius-xl);
  box-shadow: var(--acxpa-ds-shadow-lg);
  padding: 26px 28px 24px;
}
div.acxs-formHead {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0 0 18px;
  padding: 0 0 18px;
  border-bottom: 1px solid var(--acxpa-ds-teal-100);
}
div.acxs img.acxs-formBadge { flex: none; width: 84px; height: 84px; margin: 0; }
p.acxs-formTitle { font-size: var(--acxpa-ds-text-h3); line-height: var(--acxpa-ds-leading-snug); font-weight: 800; color: var(--acxpa-ds-teal-800); }
p.acxs-formSub { margin-top: 2px !important; font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-success-deep); }
p.acxs-formNote {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 16px !important;
  font-size: var(--acxpa-ds-text-small);
  line-height: var(--acxpa-ds-leading-body);
  color: var(--acxpa-ds-slate);
}
p.acxs-formNote i { margin-top: 5px; color: var(--acxpa-ds-success); }
p.acxs-formLogin {
  margin-top: 14px !important;
  padding-top: 14px;
  border-top: 1px solid var(--acxpa-ds-teal-100);
  font-size: var(--acxpa-ds-text-small);
  color: var(--acxpa-ds-ink);
}

/* Gravity Form 74 inside the card */
aside.acxs-formCard .gform_wrapper.gravity-theme { margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; max-width: none !important; }
aside.acxs-formCard #gform_74 { font-family: var(--acxpa-ds-font); color: var(--acxpa-ds-ink); }
aside.acxs-formCard #gform_74 .gform_fields { row-gap: 18px !important; }
aside.acxs-formCard #gform_74 .gfield { margin: 0 !important; padding: 0 !important; }
aside.acxs-formCard #gform_74 #field_74_23 { display: none; } /* empty HTML field */
aside.acxs-formCard #gform_74 .gfield_label,
aside.acxs-formCard #gform_74 legend.gfield_label {
  font-family: var(--acxpa-ds-font) !important;
  font-size: var(--acxpa-ds-text-body) !important;
  font-weight: 700 !important;
  color: var(--acxpa-ds-ink) !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
}
aside.acxs-formCard #gform_74 .gfield_required { display: none; } /* every field is required; the card says so */
aside.acxs-formCard #gform_74 .gform-field-label--type-sub {
  font-size: var(--acxpa-ds-text-caption) !important;
  font-weight: 600 !important;
  color: var(--acxpa-ds-slate) !important;
  margin: 0 0 4px !important;
}
aside.acxs-formCard #gform_74 .ginput_container_name { gap: 0 14px; }
aside.acxs-formCard #gform_74 input[type="text"],
aside.acxs-formCard #gform_74 input[type="email"] {
  width: 100% !important;
  height: auto !important;
  min-height: 50px;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid var(--acxpa-ds-teal-300) !important;
  border-radius: var(--acxpa-ds-radius-md) !important;
  background: var(--acxpa-ds-white) !important;
  color: var(--acxpa-ds-ink) !important;
  font-family: var(--acxpa-ds-font) !important;
  font-size: var(--acxpa-ds-text-body) !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
}
aside.acxs-formCard #gform_74 input[type="text"]:focus,
aside.acxs-formCard #gform_74 input[type="email"]:focus {
  outline: none;
  border-color: var(--acxpa-ds-teal-700) !important;
  box-shadow: 0 0 0 3px var(--acxpa-ds-teal-100) !important;
}
aside.acxs-formCard #gform_74 .gform_footer { margin: 20px 0 0 !important; padding: 0 !important; border: 0 !important; }
aside.acxs-formCard #gform_74 .gform_footer button.gform_button,
aside.acxs-formCard #gform_74 .gform_footer input[type="submit"] {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 15px 24px !important;
  border-radius: var(--acxpa-ds-radius-pill) !important;
  border: 2px solid var(--acxpa-ds-gold) !important;
  background: var(--acxpa-ds-gold) !important;
  color: var(--acxpa-ds-ink) !important;
  font-family: var(--acxpa-ds-font) !important;
  font-size: var(--acxpa-ds-text-h4) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  box-shadow: var(--acxpa-ds-shadow-md) !important;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
aside.acxs-formCard #gform_74 .gform_footer button.gform_button:hover,
aside.acxs-formCard #gform_74 .gform_footer button.gform_button:focus-visible {
  background: var(--acxpa-ds-gold-deep) !important;
  border-color: var(--acxpa-ds-gold-deep) !important;
  color: var(--acxpa-ds-white) !important;
  transform: translateY(-1px);
}
aside.acxs-formCard #gform_74 .gfield_validation_message,
aside.acxs-formCard #gform_74 .validation_message {
  margin-top: 8px;
  padding: 8px 12px !important;
  border: 0 !important;
  border-radius: var(--acxpa-ds-radius-sm);
  background: var(--acxpa-ds-error-tint) !important;
  color: var(--acxpa-ds-error-deep) !important;
  font-size: var(--acxpa-ds-text-small);
  font-weight: 600;
}
aside.acxs-formCard #gform_74 .validation_message a { color: var(--acxpa-ds-error-deep) !important; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
aside.acxs-formCard .gform_validation_errors {
  margin: 0 0 16px !important;
  border-radius: var(--acxpa-ds-radius-md) !important;
  border-color: var(--acxpa-ds-error) !important;
  background: var(--acxpa-ds-error-tint) !important;
  box-shadow: none !important;
}
aside.acxs-formCard .gform_validation_errors h2 { font-size: var(--acxpa-ds-text-small) !important; color: var(--acxpa-ds-error-deep) !important; }

/* Four quick steps (white bar under the hero) */
section.acxs-how {
  margin: calc(-1 * var(--acxpa-ds-space-md)) 0 var(--acxpa-ds-space-2xl);
  padding: 22px 28px;
  border-radius: var(--acxpa-ds-radius-xl);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-100);
  box-shadow: var(--acxpa-ds-shadow-sm);
}
p.acxs-howTitle {
  margin: 0 0 14px !important;
  font-size: var(--acxpa-ds-text-caption);
  font-weight: 700;
  letter-spacing: var(--acxpa-ds-tracking-eyebrow);
  text-transform: uppercase;
  color: var(--acxpa-ds-harbour);
}
ol.acxs-howSteps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  counter-reset: acxs-how;
}
ol.acxs-howSteps li {
  counter-increment: acxs-how;
  position: relative;
  margin: 0 !important;
  padding: 0 0 0 46px;
  list-style: none !important;
  line-height: 1.35;
}
ol.acxs-howSteps li::before {
  content: counter(acxs-how);
  position: absolute;
  left: 0;
  top: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--acxpa-ds-harbour);
  color: var(--acxpa-ds-white);
  font-size: var(--acxpa-ds-text-small);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
ol.acxs-howSteps li strong { display: block; font-size: var(--acxpa-ds-text-body); color: var(--acxpa-ds-ink); }
ol.acxs-howSteps li span { display: block; margin-top: 2px; font-size: var(--acxpa-ds-text-small); color: var(--acxpa-ds-slate); }

/* Free vs Member */
section.acxs-cmp {
  margin: 0 0 var(--acxpa-ds-space-xl);
  padding: 40px 40px 36px;
  border-radius: var(--acxpa-ds-radius-xl);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-200);
  border-top: 5px solid var(--acxpa-ds-gold);
  box-shadow: var(--acxpa-ds-shadow-md);
}
ul.acxs-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 var(--acxpa-ds-space-lg) !important;
}
ul.acxs-stats li {
  margin: 0 !important;
  padding: 16px 18px;
  border-radius: var(--acxpa-ds-radius-lg);
  background: var(--acxpa-ds-harbour-tint);
  list-style: none !important;
}
ul.acxs-stats li strong { display: block; font-size: var(--acxpa-ds-text-h2); line-height: 1.1; font-weight: 800; color: var(--acxpa-ds-harbour-deep); }
ul.acxs-stats li span { display: block; margin-top: 4px; font-size: var(--acxpa-ds-text-small); font-weight: 600; color: var(--acxpa-ds-ink); }

div.acxs-cmpTable { border: 1px solid var(--acxpa-ds-teal-100); border-radius: var(--acxpa-ds-radius-lg); overflow: hidden; }
div.acxs-cmpRow {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr) minmax(0, 1.25fr);
  border-top: 1px solid var(--acxpa-ds-teal-100);
}
div.acxs-cmpRow:first-child { border-top: 0; }
div.acxs-cmpRow > * { padding: 16px 18px; }
span.acxs-cmpFeat {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  color: var(--acxpa-ds-ink);
  background: var(--acxpa-ds-white);
}
span.acxs-cmpFeat i { width: 20px; text-align: center; color: var(--acxpa-ds-harbour); }
div.acxs-cmpCell { display: flex; gap: 10px; align-items: flex-start; font-size: var(--acxpa-ds-text-small); line-height: var(--acxpa-ds-leading-body); color: var(--acxpa-ds-ink); }
div.acxs-cmpCell > i { margin-top: 5px; flex: none; }
div.acxs-cmpCell--free { background: var(--acxpa-ds-cloud); }
div.acxs-cmpCell--free > i { color: var(--acxpa-ds-success); }
div.acxs-cmpCell--no { color: var(--acxpa-ds-slate); }
div.acxs-cmpCell--no > i { color: var(--acxpa-ds-slate); }
div.acxs-cmpCell--mem { background: var(--acxpa-ds-gold-tint); }
div.acxs-cmpCell--mem > i { color: var(--acxpa-ds-ink); }
div.acxs-cmpCell--mem strong { color: var(--acxpa-ds-ink); }
div.acxs-cmpRow--head div.acxs-cmpCell { flex-direction: column; gap: 2px; align-items: flex-start; }
div.acxs-cmpRow--head div.acxs-cmpCell--mem { background: var(--acxpa-ds-gold); }
span.acxs-cmpTier { font-size: var(--acxpa-ds-text-small); font-weight: 700; letter-spacing: var(--acxpa-ds-tracking-eyebrow); text-transform: uppercase; color: var(--acxpa-ds-ink); }
span.acxs-cmpPrice { font-size: var(--acxpa-ds-text-h2); line-height: 1.1; font-weight: 800; color: var(--acxpa-ds-teal-800); }
div.acxs-cmpCell--mem span.acxs-cmpPrice { color: var(--acxpa-ds-ink); }
span.acxs-cmpPrice small { font-size: var(--acxpa-ds-text-small); font-weight: 600; margin-left: 4px; }
div.acxs-cmpRow--foot div.acxs-cmpCell { flex-direction: column; align-items: stretch; gap: 8px; padding-top: 20px; padding-bottom: 20px; }
span.acxs-cmpSmall { font-size: var(--acxpa-ds-text-caption); font-weight: 600; color: var(--acxpa-ds-ink); text-align: center; }

div.acxs-team {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 18px;
  margin-top: var(--acxpa-ds-space-lg);
  padding: 18px 22px;
  border-radius: var(--acxpa-ds-radius-lg);
  background: var(--acxpa-ds-teal-50);
  border: 1px solid var(--acxpa-ds-teal-100);
}
div.acxs-team p { flex: 1 1 420px; color: var(--acxpa-ds-ink); }
div.acxs-team p strong { color: var(--acxpa-ds-teal-800); }
div.acxs a.acxs-go { font-size: var(--acxpa-ds-text-small); font-weight: 700; color: var(--acxpa-ds-teal-600); }
div.acxs a.acxs-go:hover { color: var(--acxpa-ds-gold-deep); }

/* Logged-in Subscriber upgrade panel price */
p.acxs-upPrice { text-align: center; font-size: var(--acxpa-ds-text-small); font-weight: 700; letter-spacing: var(--acxpa-ds-tracking-eyebrow); text-transform: uppercase; color: var(--acxpa-ds-slate); }
p.acxs-upPrice strong { display: block; margin-top: 4px; font-size: var(--acxpa-ds-text-h1); line-height: 1.1; font-weight: 800; letter-spacing: normal; text-transform: none; color: var(--acxpa-ds-teal-800); }
p.acxs-upPrice small { font-size: var(--acxpa-ds-text-small); font-weight: 600; margin-left: 4px; }

/* FAQ */
div.acxs-faqList { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
div.acxs-faqList details {
  border-radius: var(--acxpa-ds-radius-lg);
  background: var(--acxpa-ds-white);
  border: 1px solid var(--acxpa-ds-teal-100);
}
div.acxs-faqList summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 20px;
  font-weight: 700;
  color: var(--acxpa-ds-ink);
  cursor: pointer;
  list-style: none;
}
div.acxs-faqList summary::-webkit-details-marker { display: none; }
div.acxs-faqList summary::after {
  content: "\f078";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 0.8em;
  color: var(--acxpa-ds-harbour);
  transition: transform 0.15s ease;
}
div.acxs-faqList details[open] summary::after { transform: rotate(180deg); }
div.acxs-faqList summary:focus-visible { outline: 3px solid var(--acxpa-ds-focus); outline-offset: 2px; border-radius: var(--acxpa-ds-radius-lg); }
div.acxs-faqList details p { padding: 0 20px; color: var(--acxpa-ds-slate); font-size: var(--acxpa-ds-text-small); }
div.acxs-faqList details p + p { margin-top: 8px !important; }
div.acxs-faqList details p:last-child { padding-bottom: 18px; }
section.acxs-faq { margin-bottom: var(--acxpa-ds-space-xl); }

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1100px) {
  div.acxs-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  div.acxs-heroGrid,
  section.acxs-up { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  div.acxs-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  ol.acxs-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  header.acxs-hero { padding: 28px 20px; }
  section.acxs-section--cloud,
  section.acxs-rt,
  section.acxs-up,
  form.acxs-pwForm { padding: 26px 18px; }
  div.acxs-grid--4,
  div.acxs-grid--3,
  div.acxs-grid--2,
  div.acxs-pwGrid { grid-template-columns: minmax(0, 1fr); }
  ol.acxs-steps li { padding: 10px; font-size: var(--acxpa-ds-text-caption); }
  div.acxs-actions a.acxs-btn,
  div.acxs button.acxs-submit { width: 100% !important; }
  div.acxs-rtMore { padding: 18px; }
  div.acxs { padding-top: var(--acxpa-ds-space-md); }
  p.acxs-sentTo { display: flex; flex-wrap: nowrap; align-items: flex-start; border-radius: var(--acxpa-ds-radius-md); }
  p.acxs-sentTo i { margin-top: 5px; }
  /* Step 3: bring the password fields up; the hero already says why */
  div.acxs--pw aside.acxs-incl { display: none; }
  div.acxs img.acxs-badge { width: 112px; height: 112px; }
  /* Hub tiles: icon beside the text so eight tiles don't make a very long page */
  div.acxs div.acxs-grid--4 a.acxs-tile {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 14px;
    row-gap: 4px;
    padding: 18px;
  }
  div.acxs div.acxs-grid--4 a.acxs-tile span.acxs-ico { grid-row: 1 / span 3; width: 44px; height: 44px; font-size: 18px; }
  div.acxs div.acxs-grid--4 a.acxs-tile span.acxs-go { padding-top: 4px; }
}

/* /subscribe/ (86073) */
@media (max-width: 1100px) {
  div.acxs-sub div.acxs-subGrid { gap: 28px; }
  div.acxs-faqList { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  div.acxs-sub div.acxs-subGrid { grid-template-columns: minmax(0, 1fr); }
  ol.acxs-howSteps,
  ul.acxs-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  div.acxs-cmpRow { grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr) minmax(0, 1.2fr); }
}
@media (max-width: 640px) {
  div.acxs-sub header.acxs-subHero { padding: 26px 16px; }
  /* the tiles below repeat these, so the form comes straight after the intro */
  div.acxs-sub ul.acxs-subTicks { display: none; }
  aside.acxs-formCard { padding: 20px 18px; }
  div.acxs img.acxs-formBadge { width: 64px; height: 64px; }
  aside.acxs-formCard #gform_74 .ginput_container_name { row-gap: 14px; }
  section.acxs-how { margin-top: 0; padding: 20px 18px; }
  ol.acxs-howSteps { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  section.acxs-cmp { padding: 26px 16px; }
  ul.acxs-stats { gap: 10px; }
  ul.acxs-stats li { padding: 14px; }
  div.acxs-cmpRow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  div.acxs-cmpRow > * { padding: 12px; }
  div.acxs-cmpRow span.acxs-cmpFeat { grid-column: 1 / -1; padding-bottom: 6px; }
  div.acxs-cmpRow--head span.acxs-cmpFeat,
  div.acxs-cmpRow--foot span.acxs-cmpFeat { display: none; }
  div.acxs-cmpCell { flex-direction: column; gap: 4px; }
  div.acxs-cmpCell[data-tier]::before {
    content: attr(data-tier);
    font-size: var(--acxpa-ds-text-caption);
    font-weight: 700;
    letter-spacing: var(--acxpa-ds-tracking-eyebrow);
    text-transform: uppercase;
    color: var(--acxpa-ds-slate);
  }
  div.acxs-cmpCell--mem[data-tier]::before { color: var(--acxpa-ds-ink); }
  div.acxs-cmpCell > i { display: none; }
  span.acxs-cmpPrice { font-size: var(--acxpa-ds-text-h3); }
  div.acxs-cmpRow--foot { grid-template-columns: minmax(0, 1fr); }
  div.acxs-cmpRow--foot div.acxs-cmpCell--free { order: 2; }
  div.acxs-team { padding: 16px; }
}